Component grouping - update repo and Storybook

[thrbnhrtmnn]

Description / User story

Description / User story
After the discussion on 31.01. about #303 and #742 we made the following decisions:

1. All components will be restructured, so they all live in the same directory called "components". This will also be changed in Figma and in Storybook. There will not be any semantic groups like "Action", "Form", "UI" etc. and there will also not be any sub-groups like "Internal components".
2. All components can be combined to creating new components. But not all components should be combined to build a new interfaces, pages or applications. We will optimise the component documentations to make clear if a component is intended to be used when building interfaces, pages, applications or not.
3. Parts still exist. The decision to separate a section of a component into a part is up to the designer or the developer that is creating the component and they do not have to be aligned between code and design. The only rule is that parts can only be used in a single component, not in multiple components.
4. Parts are documented close to the component they are used in. In Figma this means they are documented in a separate panel, next to the component panel (see Menu for example). In GitHub the parts will be added to a new folder inside the component folder. So if we decide to build Tabs as a part of the TabBar, a "tab" folder should be part of the "tab-bar" folder.

This issue was created to update the repository and Storybook to follow the new rules.

Acceptance Criteria

• Semantic groups (like "Action", "Form", "UI" etc.) have been removed in the repo
• Semantic groups (like "Action", "Form", "UI" etc.) have been removed in Storybook
• All components are sorted alphabetically in the "components" directory in the repo
• The "Design System" section in Storybook has been renamed to "Components" and all components are sorted alphabetically in it. The "Components" section should be placed below the "Foundation" section.
• All components that were "internal" components before have a new paragraph in their intro, which explains that this component should only be used when building new components (and not to build interfaces, pages or applications). See Additional information below for a suggestion.
  • Counter
  • Form Caption
  • Form Caption Group
  • Form label
  • Input Icon
  • Stepper Button

Additional information

Suggestion for "internal" components:

The [Component Name] is intended to be used when creating new components. Currently it is used like this in the following components:

• [List of all Component Names that use this component]
• ...

It is not intended to use the [Component Name] directly when creating new applications.

Code of Conduct

• I agree to follow this project's Code of Conduct

[bar-tay]

• All components that were "internal" components before have a new paragraph in their intro, which explains that this component should only be used when building new components (and not to build interfaces, pages or applications). See Additional information below for a suggestion.

  • Counter
  • Form Caption
  • Form Caption Group
  • Form label
  • Input Icon
  • Stepper Button

@thrbnhrtmnn I left out the Stepper Button, since it doesn't exist yet