New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: add SegmentedButtons component #3283

Merged

lukewalczak merged 42 commits into main from feature/segmentedButton

Aug 31, 2022

Member

okwasniewski commented Jul 30, 2022 •

edited

Loading

This PR introduces new component named: SegmentedButton.

Summary

General overview of the component: https://m3.material.io/components/segmented-buttons/overview

Highlights:

single or multi-selection
segmented buttons can have 2-5 segments, segments cannot wrap into a new line
icons can be used in place of labels
icon next to the label is optional

Screenshots

Version 3

ios	android

Version 2

ios	android

Test plan

Write tests for this component.

okwasniewski self-assigned this

github-actions bot commented Jul 30, 2022

The mobile version of example app from this branch is ready! You can see it here

.

callstack-bot commented Jul 30, 2022 •

edited

Loading

Hey @okwasniewski, thank you for your pull request 🤗. The documentation from this branch can be viewed here.

github-actions bot commented Jul 30, 2022

The mobile version of example app from this branch is ready! You can see it here

.

2 similar comments

github-actions bot commented Aug 1, 2022

The mobile version of example app from this branch is ready! You can see it here

.

github-actions bot commented Aug 2, 2022

The mobile version of example app from this branch is ready! You can see it here

.

lukewalczak added wip Material You (v5) SegmenetedButtons labels

github-actions bot commented Aug 2, 2022

The mobile version of example app from this branch is ready! You can see it here

.

5 similar comments

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

okwasniewski marked this pull request as ready for review

August 3, 2022 13:54

okwasniewski removed the wip label

satya164 requested changes

View reviewed changes

src/components/SegmentedButton/SegmentedButton.tsx Outdated Show resolved Hide resolved

okwasniewski requested a review from satya164

August 3, 2022 14:16

github-actions bot commented Aug 3, 2022

The mobile version of example app from this branch is ready! You can see it here

.

1 similar comment

github-actions bot commented Aug 4, 2022

The mobile version of example app from this branch is ready! You can see it here

.

Drakeoon reviewed

View reviewed changes

example/src/Examples/SegmentedButtonExample.tsx Outdated Show resolved Hide resolved

github-actions bot commented Aug 7, 2022

The mobile version of example app from this branch is ready! You can see it here

.

1 similar comment

github-actions bot commented Aug 7, 2022

The mobile version of example app from this branch is ready! You can see it here

.

slavikdenis requested changes

View reviewed changes

src/components/SegmentedButton/SegmentedButton.tsx Outdated Show resolved Hide resolved

src/components/SegmentedButton/SegmentedButton.tsx Outdated Show resolved Hide resolved

src/components/SegmentedButton/SegmentedButton.tsx Outdated Show resolved Hide resolved

github-actions bot commented Aug 8, 2022

The mobile version of example app from this branch is ready! You can see it here

.

lukewalczak reviewed

View reviewed changes

src/components/SegmentedButton/SegmentedButton.tsx Outdated Show resolved Hide resolved

lukewalczak reviewed

View reviewed changes

src/components/SegmentedButton/SegmentedButtonGroup.tsx Outdated Show resolved Hide resolved

github-actions bot commented Aug 8, 2022

The mobile version of example app from this branch is ready! You can see it here

.

1 similar comment

github-actions bot commented Aug 10, 2022

The mobile version of example app from this branch is ready! You can see it here

.

okwasniewski added 22 commits

August 28, 2022 16:54


          feat: add segmented button tests


          refactor: split example to separate components

3fca6c0


          fix: handle all disabled cases

984114d


          fix: change event type naming

bcf67dd


          docs: add description and screenshot

14eab35


          feat: add available in v5.x

b691a89


          feat: export props

a5d5a4f


          fix: reorder example list

f546656


          fix: update @supported annotaion

56ba3f2


          fix: delete @supported annotation

4371f38


          fix: change minWidth

20bf4e1


          fix: type & naming adjustments

cec8afd


          feat: handle multiSelect with context

5beb879


          feat: add conditional mutliselect value prop

27ad017


          fix: segmentedButtonDisabled example types

afdd581


          fix: update tests

8471c46


          feat: change component API

2b841da


          fix: component displayName

8f5d032


          feat: add selected state tests

128f12b


          fix: remove context, adjust to comments

5b27eb2


          feat: change how density is handled

875ceec


          feat: add info to migration guide

okwasniewski force-pushed the feature/segmentedButton branch from 39088d5 to 6952379 Compare

August 28, 2022 14:55

github-actions bot commented Aug 28, 2022

The mobile version of example app from this branch is ready! You can see it here

.


          fix: update migration guide, change examples

d498408

github-actions bot commented Aug 29, 2022

The mobile version of example app from this branch is ready! You can see it here

.


          refactor: move logic outside SegementedButtonItem to simplify types

0ddb1c4

github-actions bot commented Aug 30, 2022

The mobile version of example app from this branch is ready! You can see it here

.

lukewalczak merged commit 0d32dd7 into main

lukewalczak deleted the feature/segmentedButton branch

August 31, 2022 08:15

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Material You (v5) SegmenetedButtons