Feat/responsive group button component

[terrance456]

Figma: https://www.figma.com/design/dX0HJ2MOaQyAOTziCD5fQ7/SEB-Design-System?node-id=11611-51497&m=dev

1)

2)

3)

[green-design-system-bot[bot]]

🦋 Changeset status

None or empty changeset found. This PR will not result any new releases.

If you believe this is incorrect, please add a changeset by running npx changeset, and then commiting the resulting changeset file.

You can also explicitly add an empty changeset by running: npx changeset add --empty

[green-design-system-bot[bot]]

👋 Thanks for creating a pull request!

🚀 Checkout the storybooks we've created for it:

• angular
• angular-charts
• chlorophyll
• react
• react-charts

[terrance456]

Hey @terrance456!

Segmented Control is already implemented as a web component in Green Core, and we'd like to avoid having duplicate implementations as much as possible. So even though this code looks excellent, I have to reject it in it's current form.

You can see the new Segmented Control here: https://storybook.seb.io/latest/core/?path=/docs/docs-components-segmented-control--docs

If you'd like to update this PR to instead add a React wrapper for the web component (using https://lit.dev/docs/frameworks/react/), we can merge that instead.

Either way, thank you for contributing, and sorry to have to reject this one!

Hi @splashdust, I'm just wondering if the design in green core for segmented control, is it something according to SEB design guidelines? Because it looks very different from design library.

Design library

Green core

[splashdust]

@terrance456 Yes, what you're seeing is the 2023 design version. In the toolbar in Storybook you can switch to the 2016 version, which will match with Design Library.

To get the 2016 design in code, you register Transitional Styles for the component. The idea is that when it's time to upgrade to the new design at some point in the future, you just remove transitional styles and you're good to go. There's a documentation section for this in the Core storybook where you can read more about it.

[ethan-qsh]

Hi @splashdust, does this mean that Green React is no longer going to/should not be updated anymore and we are recommended to use Green Core instead?

[splashdust]

@ethan-qsh It will still be maintained, but we'll be adding Lit wrappers instead of new React components. And some of the existing ones may get replaced under the hood (just like we've done with the Dropdown and Datepicker). The idea is that you can use it like a React library, but it's web components under the hood.