docs(storybook): group components (#1028)

src/components/ActionTooltip/__stories__/ActionTooltip.stories.tsx

@@ -7,7 +7,7 @@ import {ActionTooltip} from '../ActionTooltip';
 import type {ActionTooltipProps} from '../ActionTooltip';
 
 export default {
-    title: 'Components/ActionTooltip',
+    title: 'Components/Overlays/ActionTooltip',
     component: ActionTooltip,
 };
 

src/components/Alert/__stories__/Alert.stories.tsx

@@ -8,7 +8,7 @@ import {Alert} from '../Alert';
 import type {AlertProps} from '../types';
 
 export default {
-    title: 'Components/Alert',
+    title: 'Components/Feedback/Alert',
     component: Alert,
 } as Meta;
 

src/components/ArrowToggle/__stories__/ArrowToggle.new.stories.tsx

@@ -7,8 +7,8 @@ import {ArrowToggle, ArrowToggleProps} from '../ArrowToggle';
 const directions = ['top', 'left', 'bottom', 'right'] as Array<ArrowToggleProps['direction']>;
 
 export default {
-    title: 'Components/ArrowToggle',
-    id: 'components/ArrowToggle',
+    title: 'Components/Utils/ArrowToggle',
+    id: 'components/utils/ArrowToggle',
     args: {
         direction: 'bottom',
         size: 16,

src/components/ArrowToggle/__stories__/ArrowToggle.stories.tsx

@@ -6,7 +6,7 @@ import {ArrowToggle} from '../ArrowToggle';
 import type {ArrowToggleProps} from '../ArrowToggle';
 
 export default {
-    title: 'Components/ArrowToggle',
+    title: 'Components/Utils/ArrowToggle',
     component: ArrowToggle,
 } as Meta;
 

src/components/Breadcrumbs/__stories__/Breadcrumbs.stories.tsx

@@ -32,7 +32,7 @@ const items = [
 ];
 
 export default {
-    title: 'Components/Breadcrumbs',
+    title: 'Components/Navigation/Breadcrumbs',
     component: Breadcrumbs,
     // TODO: debug why it can't parse enum
     argTypes: {

src/components/Button/__stories__/Button.new.stories.tsx

@@ -7,8 +7,8 @@ import {Icon} from '../../Icon';
 import {Button} from '../Button';
 
 export default {
-    title: 'Components/Basic/Button',
-    id: 'components/Button',
+    title: 'Components/Inputs/Button',
+    id: 'components/inputs/Button',
     args: {
         view: 'normal',
         size: 'm',

src/components/Button/__stories__/Button.stories.tsx

@@ -10,7 +10,7 @@ import type {ButtonProps} from '../Button';
 import {ButtonShowcase} from './ButtonShowcase';
 
 export default {
-    title: 'Components/Button',
+    title: 'Components/Inputs/Button',
     component: Button,
 } as Meta;
 

src/components/Card/__stories__/Card.stories.tsx

@@ -10,7 +10,7 @@ import {CardShowcase} from './CardShowcase';
 import './Card.stories.scss';
 
 export default {
-    title: 'Components/Card',
+    title: 'Components/Data Display/Card',
     component: Card,
 } as Meta;
 

src/components/Checkbox/__stories__/Checkbox.stories.tsx

@@ -8,7 +8,7 @@ import type {CheckboxProps} from '../Checkbox';
 import {CheckboxShowcase} from './CheckboxShowcase';
 
 export default {
-    title: 'Components/Checkbox',
+    title: 'Components/Inputs/Checkbox',
     component: Checkbox,
 } as Meta;
 

src/components/ClipboardButton/__stories__/ClipboardButton.stories.tsx

@@ -6,7 +6,7 @@ import {ClipboardButton} from '../ClipboardButton';
 import type {ClipboardButtonProps} from '../ClipboardButton';
 
 export default {
-    title: 'Components/ClipboardButton',
+    title: 'Components/Utils/ClipboardButton',
     component: ClipboardButton,
 } as Meta;
 

src/components/Dialog/__stories__/Dialog.stories.tsx

@@ -9,7 +9,7 @@ import type {DialogProps} from '../Dialog';
 import {DialogShowcase} from './DialogShowcase';
 
 export default {
-    title: 'Components/Dialog',
+    title: 'Components/Overlays/Dialog',
     component: Dialog,
 } as Meta<DialogProps>;
 

src/components/Disclosure/__stories__/Disclosure.stories.tsx

@@ -11,7 +11,7 @@ import {Disclosure} from '../index';
 import './Disclosure.stories.scss';
 
 export default {
-    title: 'Components/Disclosure',
+    title: 'Components/Utils/Disclosure',
     component: Disclosure,
     args: {
         children: 'Default content',

src/components/DropdownMenu/__stories__/DropdownMenu.stories.tsx

@@ -17,7 +17,7 @@ import './DropdownMenu.stories.scss';
 const b = cn('dropdown-menu-stories');
 
 export default {
-    title: 'Components/DropdownMenu',
+    title: 'Components/Overlays/DropdownMenu',
     component: DropdownMenu,
     args: {},
 } as Meta;

src/components/Hotkey/__stories__/Hotkey.stories.tsx

@@ -7,7 +7,7 @@ import {Hotkey} from '../Hotkey';
 import type {HotkeyProps} from '../Hotkey';
 
 export default {
-    title: 'Components/Hotkey',
+    title: 'Components/Data Display/Hotkey',
     component: Hotkey,
 } as Meta;
 

src/components/Icon/__stories__/Icon.stories.tsx

@@ -7,7 +7,7 @@ import {Icon} from '../Icon';
 import type {IconProps} from '../Icon';
 
 export default {
-    title: 'Components/Icon',
+    title: 'Components/Data Display/Icon',
     component: Icon,
 } as Meta;
 

src/components/Label/__stories__/Label.new.stories.tsx

@@ -5,8 +5,8 @@ import type {Meta, StoryFn} from '@storybook/react';
 import {Label} from '../Label';
 
 export default {
-    title: 'Components/Basic/Label',
-    id: 'components/Label',
+    title: 'Components/Data display/Label',
+    id: 'components/data display/Label',
     args: {
         children: 'Label',
         theme: 'normal',

src/components/Label/__stories__/Label.stories.tsx

@@ -22,7 +22,7 @@ const icons = {
 };
 
 export default {
-    title: 'Components/Label',
+    title: 'Components/Data Display/Label',
     component: Label,
     args: {
         children: '',

src/components/Link/__stories__/Link.new.stories.tsx

@@ -5,8 +5,8 @@ import type {Meta, StoryFn} from '@storybook/react';
 import {Link} from '../Link';
 
 export default {
-    title: 'Components/Basic/Link',
-    id: 'components/Link',
+    title: 'Components/Navigation/Link',
+    id: 'components/navigation/Link',
     args: {
         view: 'normal',
         children: 'Link',

src/components/Link/__stories__/Link.stories.tsx

@@ -7,7 +7,7 @@ import type {LinkProps} from '../Link';
 import {LinkShowcase} from '../__stories__/LinkShowcase';
 
 export default {
-    title: 'Components/Link',
+    title: 'Components/Navigation/Link',
     component: Link,
 } as Meta;
 

src/components/List/__stories__/List.stories.tsx

@@ -10,7 +10,7 @@ import {ListShowcase} from './ListShowcase';
 type ComponentType = React.JSXElementConstructor<ListProps<string>>;
 
 export default {
-    title: 'Components/List',
+    title: 'Components/Data Display/List',
     component: List,
     args: {
         ...listDefaultProps,

src/components/List/__stories__/ListItem.stories.tsx

@@ -13,7 +13,7 @@ const demoWrapperStyles: React.CSSProperties = {
 };
 
 export default {
-    title: 'Components/List/Item',
+    title: 'Components/Data Display/List/Item',
     component: ListItem,
     args: {
         item: 'Item Content',

src/components/Loader/__stories__/Loader.stories.tsx

@@ -6,7 +6,7 @@ import {Loader} from '../Loader';
 import type {LoaderProps} from '../Loader';
 
 export default {
-    title: 'Components/Loader',
+    title: 'Components/Feedback/Loader',
     component: Loader,
 } as Meta;
 

src/components/Menu/__stories__/Menu.stories.tsx

@@ -8,7 +8,7 @@ import {Menu} from '../Menu';
 import type {MenuProps} from '../Menu';
 
 export default {
-    title: 'Components/Menu',
+    title: 'Components/Navigation/Menu',
     component: Menu,
 } as Meta;
 

src/components/Modal/__stories__/Modal.stories.tsx

@@ -7,7 +7,7 @@ import {Modal} from '../Modal';
 import type {ModalProps} from '../Modal';
 
 export default {
-    title: 'Components/Modal',
+    title: 'Components/Overlays/Modal',
     component: Modal,
 } as Meta;
 

src/components/Pagination/__stories__/Pagination.stories.tsx

@@ -12,7 +12,7 @@ const useState = (args: PaginationProps) => {
 };
 
 export default {
-    title: 'Components/Pagination',
+    title: 'Components/Navigation/Pagination',
     component: Pagination,
 } as Meta;
 

src/components/Persona/__stories__/Persona.stories.tsx

@@ -6,7 +6,7 @@ import type {ComponentMeta, ComponentStory} from '@storybook/react';
 import {Persona} from '../Persona';
 
 export default {
-    title: 'Components/Persona',
+    title: 'Components/Data Display/Persona',
     component: Persona,
 } as ComponentMeta<typeof Persona>;
 

src/components/Popover/__stories__/Popover.stories.tsx

@@ -13,7 +13,7 @@ import {WithCustomAnchor as WithCustomAnchorExample} from './examples/WithCustom
 import './PopoverDemo.scss';
 
 export default {
-    title: 'Components/Popover',
+    title: 'Components/Overlays/Popover',
     component: Popover,
     args: {
         initialOpen: false,

src/components/Popup/__stories__/Popup.stories.tsx

@@ -9,7 +9,7 @@ import {Popup} from '../Popup';
 import type {PopupPlacement, PopupProps} from '../Popup';
 
 export default {
-    title: 'Components/Popup',
+    title: 'Components/Overlays/Popup',
     component: Popup,
 } as Meta;
 

src/components/Portal/__stories__/Portal.stories.tsx

@@ -6,7 +6,7 @@ import {Portal} from '../Portal';
 import type {PortalProps} from '../Portal';
 
 export default {
-    title: 'Components/Portal',
+    title: 'Components/Utils/Portal',
     component: Portal,
 } as Meta;
 

src/components/Progress/__stories__/Progress.stories.tsx

@@ -6,7 +6,7 @@ import {Progress} from '../Progress';
 import type {ProgressTheme} from '../Progress';
 
 export default {
-    title: 'Components/Progress',
+    title: 'Components/Feedback/Progress',
     component: Progress,
 } as Meta;
 

src/components/Radio/__stories__/Radio.stories.tsx

@@ -8,7 +8,7 @@ import type {RadioProps} from '../Radio';
 import {RadioShowcase} from './RadioShowcase';
 
 export default {
-    title: 'Components/Radio',
+    title: 'Components/Inputs/Radio',
     component: Radio,
 } as Meta;
 

src/components/RadioButton/__stories__/RadioButton.stories.tsx

@@ -8,7 +8,7 @@ import type {RadioButtonOption, RadioButtonProps} from '../RadioButton';
 import {RadioButtonShowcase} from './RadioButtonShowcase';
 
 export default {
-    title: 'Components/RadioButton',
+    title: 'Components/Inputs/RadioButton',
     component: RadioButton,
 } as Meta;
 

src/components/RadioGroup/__stories__/RadioGroup.stories.tsx

@@ -9,7 +9,7 @@ import type {RadioGroupOption, RadioGroupProps} from '../RadioGroup';
 import {RadioGroupShowcase} from './RadioGroupShowcase';
 
 export default {
-    title: 'Components/RadioGroup',
+    title: 'Components/Inputs/RadioGroup',
     component: RadioGroup,
 } as Meta;
 

src/components/Select/__stories__/Select.stories.tsx

@@ -9,7 +9,7 @@ import {SelectPopupWidthShowcase} from './SelectPopupWidthShowcase';
 import {SelectShowcase} from './SelectShowcase';
 
 export default {
-    title: 'Components/Select',
+    title: 'Components/Inputs/Select',
     component: Select,
 } as Meta;
 

src/components/Sheet/__stories__/DefaultShowcase/DefaultShowcase.stories.tsx

@@ -28,7 +28,7 @@ const EXTRA_INNER_CONTENT = getRandomText(500);
 const EXTRA_INNER_CONTENT_MORE_THAN_VIEWPORT = getRandomText(3000);
 
 export default {
-    title: 'Components/Sheet',
+    title: 'Components/Overlays/Sheet',
     component: Sheet,
 } as Meta;
 

src/components/Sheet/__stories__/Sheet.stories.tsx

@@ -6,7 +6,7 @@ import {Showcase} from './DefaultShowcase/DefaultShowcase.stories';
 import {WithMenuShowcase} from './WithMenuShowcase/WithMenuShowcase.stories';
 
 export default {
-    title: 'Components/Sheet',
+    title: 'Components/Overlays/Sheet',
     component: Sheet,
 } as Meta;
 

src/components/Sheet/__stories__/WithMenuShowcase/WithMenuShowcase.stories.tsx

@@ -12,7 +12,7 @@ import './WithMenuShowcase.scss';
 const b = cn('sheet-stories-with-menu-showcase');
 
 export default {
-    title: 'Components/Sheet',
+    title: 'Components/Overlays/Sheet',
     component: Sheet,
 } as Meta;
 

src/components/Skeleton/__stories__/Skeleton.stories.tsx

@@ -8,7 +8,7 @@ import type {SkeletonProps} from '../Skeleton';
 import {SkeletonShowcase} from './SkeletonShowcase';
 
 export default {
-    title: 'Components/Skeleton',
+    title: 'Components/Feedback/Skeleton',
     component: Skeleton,
 } as Meta;
 

src/components/Spin/__stories__/Spin.stories.tsx

@@ -6,7 +6,7 @@ import {Spin} from '../Spin';
 import type {SpinProps} from '../Spin';
 
 export default {
-    title: 'Components/Spin',
+    title: 'Components/Feedback/Spin',
     component: Spin,
 } as Meta;
 

src/components/Switch/__stories__/Switch.stories.tsx

@@ -8,7 +8,7 @@ import type {SwitchProps} from '../Switch';
 import {SwitchShowcase} from './SwitchShowcase';
 
 export default {
-    title: 'Components/Switch',
+    title: 'Components/Inputs/Switch',
     component: Switch,
 } as Meta;
 

src/components/Table/__stories__/Table.stories.tsx

@@ -23,7 +23,7 @@ import {
 import type {DataItem} from './utils';
 
 export default {
-    title: 'Components/Table',
+    title: 'Components/Data Display/Table',
     component: Table,
     args: {
         columns,

src/components/Tabs/__stories__/Tabs.stories.tsx

@@ -10,7 +10,7 @@ import {getTabsMock} from './getTabsMock';
 import type {StoryParams} from './types';
 
 export default {
-    title: 'Components/Tabs',
+    title: 'Components/Navigation/Tabs',
     component: Tabs,
     args: {
         direction: 'horizontal',

src/components/Text/__stories__/Text.stories.tsx

@@ -6,7 +6,7 @@ import {Text, colorText, text} from '../.';
 import type {TextProps} from '../.';
 
 export default {
-    title: 'Components/Text',
+    title: 'Components/Data Display/Text',
     component: Text,
 } as Meta;