cbf9e7b7c2
chore (SW-834): Upgrade to Next 15 * wip: apply codemod and upgrade swc plugin * wip: design-system to react 19, fix issues from async (search)params * wip: fix remaining issues from codemod serverClient is now async because context use headers() getLang is now async because it uses headers() * Minor cleanup * Inline react-material-symbols package Package is seemingly not maintained any more and doesn't support React 19. This copies the package source into `design-system`, makes the necessary changes for 19 and export it for others to use. * Fix missing awaits * Disable modal exit animations Enabling modal exit animations via isExiting prop is causing modals to be rendered in "hidden" state and never unmount. Seems to be an issue with react-aria-components, see https://github.com/adobe/react-spectrum/issues/7563. Can probably be fixed by rewriting to a solution similar to https://react-spectrum.adobe.com/react-aria/examples/framer-modal-sheet.html * Remove unstable cache implementation and use in memory cache locally * Fix ref type in SelectFilter * Use cloneElement to add key prop to element Approved-by: Linus Flood
66 lines
1.1 KiB
TypeScript
66 lines
1.1 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/react'
|
|
|
|
import { Select } from './Select'
|
|
|
|
const meta: Meta<typeof Select> = {
|
|
title: 'Components/Select',
|
|
component: Select,
|
|
argTypes: {},
|
|
}
|
|
|
|
export default meta
|
|
|
|
type Story = StoryObj<typeof Select>
|
|
|
|
const items = [
|
|
{ label: 'Foo', value: 'foo' },
|
|
{ label: 'Bar', value: 'bar' },
|
|
{ label: 'Baz', value: 'baz' },
|
|
]
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
items,
|
|
label: 'Select an item',
|
|
name: 'foo',
|
|
},
|
|
}
|
|
|
|
export const DefaultSelected: Story = {
|
|
args: {
|
|
items,
|
|
label: 'Select an item',
|
|
name: 'foo',
|
|
defaultSelectedKey: 'foo',
|
|
},
|
|
}
|
|
|
|
export const Icons: Story = {
|
|
args: {
|
|
items,
|
|
label: 'Select an item',
|
|
name: 'foo',
|
|
icon: 'star',
|
|
itemIcon: 'check',
|
|
},
|
|
}
|
|
|
|
export const Filtering: Story = {
|
|
args: {
|
|
items,
|
|
label: 'Select an item',
|
|
name: 'foo',
|
|
enableFiltering: true,
|
|
},
|
|
}
|
|
|
|
export const FilteringSelected: Story = {
|
|
args: {
|
|
items,
|
|
label: 'Select an item',
|
|
name: 'foo',
|
|
enableFiltering: true,
|
|
defaultSelectedKey: 'foo',
|
|
},
|
|
}
|