paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 43 Packages Projects Releases Wiki Activity

Merge pull request #29306 from backstage/caon-docs-compose-stories

Browse Source 
Canon Docs - Use Storybook stories directly in Canon docs using composeStories()
This commit is contained in:
Charles de Dreuille
2025-03-25 18:03:20 +00:00
committed by GitHub
parent 618ad32279 fc2860c102
commit 2c4a1b6631
41 changed files with 563 additions and 1000 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/quick-carrots-open.md
+5
View File
@@ -0,0 +1,5 @@
---
'@backstage/canon': patch
---
Fix types on the Icon component.
canon-docs/package.json
+2 -2
View File
@@ -14,7 +14,7 @@
"@mdx-js/loader": "^3.1.0",
"@mdx-js/react": "^3.1.0",
"@next/mdx": "^15.1.4",
"@storybook/react": "^8.4.7",
"@storybook/react": "^8.6.8",
"@uiw/codemirror-themes": "^4.23.7",
"@uiw/react-codemirror": "^4.23.7",
"motion": "^12.4.1",
@@ -23,7 +23,7 @@
"react-dom": "^18.0.2",
"react-frame-component": "^5.2.7",
"shiki": "^1.26.1",
"storybook": "^8.4.7"
"storybook": "^8.6.8"
},
"devDependencies": {
"@types/mdx": "^2.0.13",
canon-docs/src/app/(docs)/components/box/page.mdx
+2 -2
View File
@@ -2,7 +2,7 @@ import { CodeBlock } from '@/components/CodeBlock';
import { PropsTable } from '@/components/PropsTable';
import { Tabs } from '@/components/Tabs';
import { Snippet } from '@/components/Snippet';
import { BoxPreview } from '@/snippets/box';
import { BoxSnippet } from '@/snippets/stories-snippets';
import { boxPropDefs } from './props';
import { spacingPropDefs } from '../../../../utils/propDefs';
@@ -12,7 +12,7 @@ Box is the lowest-level component in Canon. It provides a consistent API for sty
<Snippet
py={4}
preview={<BoxPreview />}
preview={<BoxSnippet story="Preview" />}
code={`<Box>
<DecorativeBox />
</Box>`}
canon-docs/src/app/(docs)/components/button/page.mdx
+9 -20
View File
@@ -2,15 +2,8 @@ import { PropsTable } from '@/components/PropsTable';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
import {
ButtonPreview,
ButtonSizes,
ButtonWithIcons,
ButtonFullWidth,
ButtonDisabled,
ButtonResponsive,
} from '@/snippets/button';
import { buttonVariants } from '@/snippets/_snippets';
import { ButtonSnippet } from '@/snippets/stories-snippets';
import { buttonVariants } from '@/snippets/code-snippets';
import { buttonPropDefs } from './props';
# Button
@@ -20,7 +13,7 @@ A button component that can be used to trigger actions.
<Snippet
align="center"
py={4}
preview={<ButtonPreview />}
preview={<ButtonSnippet story="Variants" />}
code={`<Inline alignY="center">
<Button iconStart="cloud" variant="primary">
Button
@@ -71,7 +64,7 @@ Here's a view when buttons have different variants.
align="center"
py={4}
open
preview={<ButtonPreview />}
preview={<ButtonSnippet story="Variants" />}
code={buttonVariants}
/>
@@ -83,7 +76,7 @@ Here's a view when buttons have different sizes.
align="center"
py={4}
open
preview={<ButtonSizes />}
preview={<ButtonSnippet story="Sizes" />}
code={`<Inline alignY="center">
<Button size="small">Small</Button>
<Button size="medium">Medium</Button>
@@ -98,7 +91,7 @@ Here's a view when buttons have icons.
align="center"
py={4}
open
preview={<ButtonWithIcons />}
preview={<ButtonSnippet story="WithIcons" />}
code={`<Inline alignY="center">
<Button iconStart="cloud">Button</Button>
<Button iconEnd="chevronRight">Button</Button>
@@ -114,7 +107,7 @@ Here's a view when buttons are full width.
align="center"
py={4}
open
preview={<ButtonFullWidth />}
preview={<ButtonSnippet story="FullWidth" />}
code={`<Flex style={{ width: '300px' }}>
<Button fullWidth>Full width</Button>
</Flex>`}
@@ -128,7 +121,7 @@ Here's a view when buttons are disabled.
align="center"
py={4}
open
preview={<ButtonDisabled />}
preview={<ButtonSnippet story="Disabled" />}
code={`<Button disabled>Button</Button>`}
/>
@@ -136,11 +129,7 @@ Here's a view when buttons are disabled.
Here's a view when buttons are responsive.
<Snippet
align="center"
py={4}
open
preview={<ButtonResponsive />}
<CodeBlock
code={`<Button variant={{ initial: 'primary', lg: 'secondary' }}>
Responsive Button
</Button>`}
canon-docs/src/app/(docs)/components/checkbox/page.mdx
+4 -3
View File
@@ -1,5 +1,5 @@
import { PropsTable } from '@/components/PropsTable';
import { CheckboxPreview, CheckboxAllVariants } from '@/snippets/checkbox';
import { CheckboxSnippet } from '@/snippets/stories-snippets';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
@@ -11,8 +11,9 @@ import { checkboxPropDefs } from './props';
A checkbox component that can be used to trigger actions.
<Snippet
align="center"
py={4}
preview={<CheckboxPreview />}
preview={<CheckboxSnippet story="Default" />}
code={`<Checkbox label="Accept terms and conditions" />`}
/>
@@ -55,7 +56,7 @@ Here's a view when checkboxes have different variants.
align="center"
py={4}
open
preview={<CheckboxAllVariants />}
preview={<CheckboxSnippet story="AllVariants" />}
code={`<Inline alignY="center">
<Checkbox />
<Checkbox checked />
canon-docs/src/app/(docs)/components/container/page.mdx
+2 -2
View File
@@ -2,7 +2,7 @@ import { CodeBlock } from '@/components/CodeBlock';
import { PropsTable } from '@/components/PropsTable';
import { Tabs } from '@/components/Tabs';
import { Snippet } from '@/components/Snippet';
import { ContainerPreview } from '@/snippets/container';
import { ContainerSnippet } from '@/snippets/stories-snippets';
import { containerPropDefs } from './props';
# Container
@@ -12,7 +12,7 @@ content on the page.
<Snippet
py={4}
preview={<ContainerPreview />}
preview={<ContainerSnippet story="Preview" />}
code={`<Container>
<DecorativeBox />
</Container>`}
canon-docs/src/app/(docs)/components/field/page.mdx
+8 -3
View File
@@ -2,7 +2,7 @@ import { PropsTable } from '@/components/PropsTable';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
import { FieldPreview } from '@/snippets/field';
import { FieldSnippet } from '@/snippets/stories-snippets';
import { BaseUI } from '@/components/HeadlessBanners/BaseUI';
import {
fieldRootPropDefs,
@@ -15,7 +15,12 @@ import {
A wrapper around `Input` or `Select` component to add label, description and error messages..
<Snippet align="center" py={4} preview={<FieldPreview />} code={`<Field />`} />
<Snippet
align="center"
py={4}
preview={<FieldSnippet story="Default" />}
code={`<Field />`}
/>
<Tabs.Root>
<Tabs.List>
@@ -85,7 +90,7 @@ Here's a simple input with a label and description.
align="center"
py={4}
open
preview={<FieldPreview />}
preview={<FieldSnippet story="WithLabelAndDescription" />}
code={`<Field>
<Field.Label>Name</Field.Label>
<Field.Description>Visible on your profile</Field.Description>
canon-docs/src/app/(docs)/components/flex/page.mdx
+3 -3
View File
@@ -6,9 +6,9 @@ import {
flexSimple,
flexResponsive,
flexAlign,
} from '@/snippets/_snippets';
} from '@/snippets/code-snippets';
import { Snippet } from '@/components/Snippet';
import { FlexPreview } from '@/snippets/flex';
import { FlexSnippet } from '@/snippets/stories-snippets';
import { flexPropDefs } from './props';
import { spacingPropDefs } from '../../../../utils/propDefs';
@@ -21,7 +21,7 @@ columns. All values are responsive.
<Snippet
py={4}
align="center"
preview={<FlexPreview />}
preview={<FlexSnippet story="Default" />}
code={`<Flex>
<DecorativeBox />
<DecorativeBox />
canon-docs/src/app/(docs)/components/grid/page.mdx
+3 -3
View File
@@ -1,9 +1,9 @@
import { CodeBlock } from '@/components/CodeBlock';
import { PropsTable } from '@/components/PropsTable';
import { Tabs } from '@/components/Tabs';
import { grid } from '@/snippets/_snippets';
import { grid } from '@/snippets/code-snippets';
import { Snippet } from '@/components/Snippet';
import { GridPreview } from '@/snippets/grid';
import { GridSnippet } from '@/snippets/stories-snippets';
import { spacingPropDefs } from '../../../../utils/propDefs';
import { gridPropDefs, gridItemPropDefs } from './props';
@@ -14,7 +14,7 @@ more complex ones.
<Snippet
py={4}
preview={<GridPreview />}
preview={<GridSnippet story="Default" />}
code={`<Grid>
<DecorativeBox />
<DecorativeBox />
canon-docs/src/app/(docs)/components/heading/page.mdx
+4 -11
View File
@@ -1,9 +1,5 @@
import { PropsTable } from '@/components/PropsTable';
import {
HeadingPreview,
HeadingAllVariants,
HeadingResponsive,
} from '@/snippets/heading';
import { HeadingSnippet } from '@/snippets/stories-snippets';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
@@ -15,7 +11,7 @@ Headings are used to structure the content of your page.
<Snippet
py={4}
preview={<HeadingPreview />}
preview={<HeadingSnippet story="Title1" />}
code={`<Heading variant="title1">Hello World!</Heading>`}
/>
@@ -56,7 +52,7 @@ appearance of the heading.
<Snippet
py={2}
open
preview={<HeadingAllVariants />}
preview={<HeadingSnippet story="AllVariants" />}
code={`<Flex direction="column" gap="4">
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
@@ -71,10 +67,7 @@ appearance of the heading.
You can also use the `variant` prop to change the appearance of the text based
on the screen size.
<Snippet
py={4}
open
preview={<HeadingResponsive />}
<CodeBlock
code={`<Heading variant={{ initial: 'title2', lg: 'title1' }}>
Responsive heading
</Heading>`}
canon-docs/src/app/(docs)/components/icon-button/page.mdx
+8 -17
View File
@@ -2,13 +2,8 @@ import { PropsTable } from '@/components/PropsTable';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
import {
IconButtonPreview,
IconButtonSizes,
IconButtonDisabled,
IconButtonResponsive,
} from '@/snippets/icon-button';
import { iconButtonVariants } from '@/snippets/_snippets';
import { IconButtonSnippet } from '@/snippets/stories-snippets';
import { iconButtonVariants } from '@/snippets/code-snippets';
import { iconButtonPropDefs } from './props';
# Icon Button
@@ -18,11 +13,11 @@ A button component with a single icon that can be used to trigger actions.
<Snippet
align="center"
py={4}
preview={<IconButtonPreview />}
preview={<IconButtonSnippet story="Variants" />}
code={`<Flex align="center">
<IconButton icon="cloud" variant="primary" />
<IconButton icon="cloud" variant="secondary" />
</Flex>`}
</Flex>`}
/>
<Tabs.Root>
@@ -62,7 +57,7 @@ Here's a view when buttons have different variants.
align="center"
py={4}
open
preview={<IconButtonPreview />}
preview={<IconButtonSnippet story="Variants" />}
code={iconButtonVariants}
/>
@@ -74,7 +69,7 @@ Here's a view when buttons have different sizes.
align="center"
py={4}
open
preview={<IconButtonSizes />}
preview={<IconButtonSnippet story="Sizes" />}
code={`<Flex align="center">
<IconButton icon="cloud" size="small" />
<IconButton icon="cloud" size="medium" />
@@ -89,7 +84,7 @@ Here's a view when buttons are disabled.
align="center"
py={4}
open
preview={<IconButtonDisabled />}
preview={<IconButtonSnippet story="Disabled" />}
code={`<IconButton icon="cloud" disabled />`}
/>
@@ -97,10 +92,6 @@ Here's a view when buttons are disabled.
Here's a view when buttons are responsive.
<Snippet
align="center"
py={4}
open
preview={<IconButtonResponsive />}
<CodeBlock
code={`<IconButton icon="cloud" variant={{ initial: 'primary', lg: 'secondary' }} />`}
/>
canon-docs/src/app/(docs)/components/icon/page.mdx
+2 -2
View File
@@ -1,5 +1,5 @@
import { PropsTable } from '@/components/PropsTable';
import { IconPreview } from '@/snippets/icon';
import { IconSnippet } from '@/snippets/stories-snippets';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
@@ -12,7 +12,7 @@ Icons are used to represent an action or a state.
<Snippet
py={4}
align="center"
preview={<IconPreview />}
preview={<IconSnippet story="Default" />}
code={`<Icon name="heart" />`}
/>
canon-docs/src/app/(docs)/components/input/page.mdx
+3 -3
View File
@@ -2,7 +2,7 @@ import { PropsTable } from '@/components/PropsTable';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
import { InputPreview, InputSizes } from '@/snippets/input';
import { InputSnippet } from '@/snippets/stories-snippets';
import { BaseUI } from '@/components/HeadlessBanners/BaseUI';
import { inputPropDefs } from './props';
@@ -13,7 +13,7 @@ A input component tfor your forms.
<Snippet
align="center"
py={4}
preview={<InputPreview />}
preview={<InputSnippet story="Primary" />}
code={`<Input label="Name" placeholder="Enter your name" />`}
/>
@@ -55,7 +55,7 @@ Here's a simple input with a label and description.
align="center"
py={4}
open
preview={<InputSizes />}
preview={<InputSnippet story="Sizes" />}
code={`<Grid>
<Input size="sm" placeholder="Small" />
<Input size="md" placeholder="Medium" />
canon-docs/src/app/(docs)/components/text/page.mdx
+5 -12
View File
@@ -1,10 +1,5 @@
import { PropsTable } from '@/components/PropsTable';
import {
TextPreview,
TextAllVariants,
TextResponsive,
TextAllWeights,
} from '@/snippets/text';
import { TextSnippet } from '@/snippets/stories-snippets';
import { Snippet } from '@/components/Snippet';
import { Tabs } from '@/components/Tabs';
import { CodeBlock } from '@/components/CodeBlock';
@@ -16,7 +11,7 @@ The `Text` component is used to display content on your page.
<Snippet
py={4}
preview={<TextPreview />}
preview={<TextSnippet story="Default" />}
code={`<Text style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is in
@@ -60,7 +55,7 @@ appearance of the text.
<Snippet
open
preview={<TextAllVariants />}
preview={<TextSnippet story="AllVariants" />}
code={`<Flex direction="column" gap="4">
<Text variant="subtitle" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
@@ -92,7 +87,7 @@ appearance of the text.
<Snippet
open
preview={<TextAllWeights />}
preview={<TextSnippet story="AllWeights" />}
code={`<Flex direction="column" gap="4">
<Text weight="regular" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
@@ -112,9 +107,7 @@ appearance of the text.
You can also use the `variant` prop to change the appearance of the text based
on the screen size.
<Snippet
open
preview={<TextResponsive />}
<CodeBlock
code={`<Text variant={{ initial: 'body', lg: 'subtitle' }}>
Responsive text
</Text>`}
canon-docs/src/app/(docs)/theme/theming/page.mdx
+1 -1
View File
@@ -1,7 +1,7 @@
import { CodeBlock } from '@/components/CodeBlock';
import * as Table from '@/components/Table';
import { Chip } from '@/components/Chip';
import { customTheme } from '@/snippets/_snippets';
import { customTheme } from '@/snippets/code-snippets';
# Theming
canon-docs/src/app/(docs)/theme/typography/page.mdx
+3 -4
View File
@@ -1,5 +1,4 @@
import { HeadingAllVariants } from '@/snippets/heading';
import { TextAllVariants } from '@/snippets/text';
import { HeadingSnippet, TextSnippet } from '@/snippets/stories-snippets';
import { Snippet } from '@/components/Snippet';
# Typography
@@ -20,7 +19,7 @@ component](?path=/docs/components-heading--docs).
<Snippet
py={2}
open
preview={<HeadingAllVariants />}
preview={<HeadingSnippet story="AllVariants" />}
code={`<Flex direction="column" gap="4">
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
@@ -40,7 +39,7 @@ page.
<Snippet
open
preview={<TextAllVariants />}
preview={<TextSnippet story="AllVariants" />}
code={`<Flex direction="column" gap="4">
<Text variant="subtitle" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
canon-docs/src/app/(playground)/playground/page.tsx
+13 -8
View File
@@ -5,10 +5,12 @@ import { Grid, Flex, Text } from '../../../../../packages/canon';
import { screenSizes } from '@/utils/data';
import { Frame } from '@/components/Frame';
import { usePlayground } from '@/utils/playground-context';
import { ButtonPlayground } from '@/snippets/button';
import { CheckboxPlayground } from '@/snippets/checkbox';
import { HeadingPlayground } from '@/snippets/heading';
import { TextPlayground } from '@/snippets/text';
import {
ButtonSnippet,
CheckboxSnippet,
HeadingSnippet,
TextSnippet,
} from '@/snippets/stories-snippets';
import styles from './styles.module.css';
@@ -55,16 +57,19 @@ const Content = () => {
return (
<Flex direction="column" gap="4">
{selectedComponents.find(c => c === 'button') && (
<Line content={<ButtonPlayground />} title="Button" />
<Line content={<ButtonSnippet story="Playground" />} title="Button" />
)}
{selectedComponents.find(c => c === 'checkbox') && (
<Line content={<CheckboxPlayground />} title="Checkbox" />
<Line
content={<CheckboxSnippet story="Playground" />}
title="Checkbox"
/>
)}
{selectedComponents.find(c => c === 'heading') && (
<Line content={<HeadingPlayground />} title="Heading" />
<Line content={<HeadingSnippet story="Playground" />} title="Heading" />
)}
{selectedComponents.find(c => c === 'text') && (
<Line content={<TextPlayground />} title="Text" />
<Line content={<TextSnippet story="Playground" />} title="Text" />
)}
{/* {selectedComponents.find(c => c === 'input') && (
<Line content={<InputPlayground />} title="Input" />
canon-docs/src/snippets/box.tsx
-20
View File
@@ -1,20 +0,0 @@
'use client';
import { Box } from '../../../packages/canon';
export const BoxPreview = () => {
return (
<Box
style={{
width: '64px',
height: '64px',
background: '#eaf2fd',
borderRadius: '4px',
border: '1px solid #2563eb',
color: '#2563eb',
backgroundImage:
'url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22%232563eb%22%20fill-opacity%3D%220.3%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M5%200h1L0%206V5zM6%205v1H5z%22/%3E%3C/g%3E%3C/svg%3E")',
}}
/>
);
};
canon-docs/src/snippets/button.tsx
-102
View File
@@ -1,102 +0,0 @@
'use client';
import { Button, Flex, ButtonProps, Text } from '../../../packages/canon';
export const ButtonPreview = () => {
return (
<Flex align="center">
<Button iconStart="cloud" variant="primary">
Button
</Button>
<Button iconStart="cloud" variant="secondary">
Button
</Button>
</Flex>
);
};
export const ButtonSizes = () => {
return (
<Flex align="center">
<Button size="medium">Medium</Button>
<Button size="small">Small</Button>
</Flex>
);
};
export const ButtonWithIcons = () => {
return (
<Flex align="center">
<Button iconStart="cloud">Button</Button>
<Button iconEnd="chevron-right">Button</Button>
<Button iconStart="cloud" iconEnd="chevron-right">
Button
</Button>
</Flex>
);
};
export const ButtonFullWidth = () => {
return (
<Flex direction="column" style={{ width: '300px' }}>
<Button iconStart="cloud">Button</Button>
<Button iconEnd="chevron-right">Button</Button>
<Button iconStart="cloud" iconEnd="chevron-right">
Button
</Button>
</Flex>
);
};
export const ButtonDisabled = () => {
return <Button disabled>Button</Button>;
};
export const ButtonResponsive = () => {
return (
<Button variant={{ initial: 'primary', lg: 'secondary' }}>
Responsive Button
</Button>
);
};
export const ButtonPlayground = () => {
const variants: string[] = ['primary', 'secondary', 'tertiary'];
return (
<Flex direction="column">
{variants.map(variant => (
<Flex direction="column" key={variant}>
<Text>{variant}</Text>
{['small', 'medium'].map(size => (
<Flex align="center" key={size}>
<Button
iconStart="cloud"
variant={variant as ButtonProps['variant']}
size={size as ButtonProps['size']}
>
Button
</Button>
<Button
iconEnd="chevron-right"
variant={variant as ButtonProps['variant']}
size={size as ButtonProps['size']}
>
Button
</Button>
<Button
iconStart="cloud"
iconEnd="chevron-right"
style={{ width: '200px' }}
variant={variant as ButtonProps['variant']}
size={size as ButtonProps['size']}
>
Button
</Button>
</Flex>
))}
</Flex>
))}
</Flex>
);
};
canon-docs/src/snippets/checkbox.tsx
-32
View File
@@ -1,32 +0,0 @@
'use client';
import { Checkbox, Flex, Text } from '../../../packages/canon';
export const CheckboxPreview = () => {
return <Checkbox label="Accept terms and conditions" />;
};
export const CheckboxAllVariants = () => {
return (
<Flex align="center">
<Checkbox />
<Checkbox checked />
<Checkbox label="Checkbox" />
<Checkbox label="Checkbox" checked />
</Flex>
);
};
export const CheckboxPlayground = () => {
return (
<Flex direction="column">
<Text>All variants</Text>
<Flex align="center">
<Checkbox />
<Checkbox checked />
<Checkbox label="Checkbox" />
<Checkbox label="Checkbox" checked />
</Flex>
</Flex>
);
};
canon-docs/src/snippets/_snippets.ts → canon-docs/src/snippets/code-snippets.ts
View File
canon-docs/src/snippets/container.tsx
-24
View File
@@ -1,24 +0,0 @@
'use client';
import { Box, Container } from '../../../packages/canon';
const DecorativeBox = () => (
<Box
style={{
height: '64px',
background: '#eaf2fd',
borderRadius: '4px',
border: '1px solid #2563eb',
backgroundImage:
'url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22%232563eb%22%20fill-opacity%3D%220.3%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M5%200h1L0%206V5zM6%205v1H5z%22/%3E%3C/g%3E%3C/svg%3E")',
}}
/>
);
export const ContainerPreview = () => {
return (
<Container>
<DecorativeBox />
</Container>
);
};
canon-docs/src/snippets/field.tsx
-23
View File
@@ -1,23 +0,0 @@
'use client';
import { Input, Field } from '../../../packages/canon';
export const FieldPreview = () => {
return (
<div style={{ width: '300px' }}>
<Field.Root>
<Field.Label>Name</Field.Label>
<Input placeholder="Enter your name" />
<Field.Description>Visible on your profile</Field.Description>
</Field.Root>
</div>
);
};
export const InputPlayground = () => {
return (
<div style={{ maxWidth: '300px' }}>
<Input placeholder="Enter your name" />
</div>
);
};
canon-docs/src/snippets/flex.tsx
-31
View File
@@ -1,31 +0,0 @@
'use client';
import { Flex } from '../../../packages/canon';
const DecorativeBox = () => {
return (
<div
style={{
background: '#eaf2fd',
borderRadius: '4px',
boxShadow: '0 0 0 1px #2563eb',
height: '32px',
minWidth: '100px',
backgroundImage:
'url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22%232563eb%22%20fill-opacity%3D%220.3%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M5%200h1L0%206V5zM6%205v1H5z%22/%3E%3C/g%3E%3C/svg%3E")',
}}
/>
);
};
export const FlexPreview = () => {
return (
<div style={{ width: '320px' }}>
<Flex>
<DecorativeBox />
<DecorativeBox />
<DecorativeBox />
</Flex>
</div>
);
};
canon-docs/src/snippets/grid.tsx
-26
View File
@@ -1,26 +0,0 @@
'use client';
import { Box, Grid } from '../../../packages/canon';
const FakeBox = () => (
<Box
style={{
background: '#eaf2fd',
borderRadius: '4px',
boxShadow: '0 0 0 1px #2563eb',
height: '64px',
backgroundImage:
'url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22%232563eb%22%20fill-opacity%3D%220.3%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M5%200h1L0%206V5zM6%205v1H5z%22/%3E%3C/g%3E%3C/svg%3E")',
}}
/>
);
export const GridPreview = () => {
return (
<Grid>
<FakeBox />
<FakeBox />
<FakeBox />
</Grid>
);
};
canon-docs/src/snippets/heading.tsx
-42
View File
@@ -1,42 +0,0 @@
'use client';
import { Heading, Flex, Text } from '../../../packages/canon';
export const HeadingPreview = () => {
return <Heading>Look mum, no hands!</Heading>;
};
export const HeadingAllVariants = () => {
return (
<Flex direction="column">
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
<Heading variant="title2">Title 2</Heading>
<Heading variant="title3">Title 3</Heading>
<Heading variant="title4">Title 4</Heading>
</Flex>
);
};
export const HeadingResponsive = () => {
return (
<Flex direction="column">
<Heading variant={{ initial: 'title2', lg: 'title1' }}>
Responsive heading
</Heading>
</Flex>
);
};
export const HeadingPlayground = () => {
return (
<Flex direction="column">
<Text>All variants</Text>
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
<Heading variant="title2">Title 2</Heading>
<Heading variant="title3">Title 3</Heading>
<Heading variant="title4">Title 4</Heading>
</Flex>
);
};
canon-docs/src/snippets/icon-button.tsx
-57
View File
@@ -1,57 +0,0 @@
'use client';
import { IconButton, Flex, ButtonProps, Text } from '../../../packages/canon';
export const IconButtonPreview = () => {
return (
<Flex align="center">
<IconButton icon="cloud" variant="primary" />
<IconButton icon="cloud" variant="secondary" />
</Flex>
);
};
export const IconButtonSizes = () => {
return (
<Flex align="center">
<IconButton icon="cloud" size="medium" />
<IconButton icon="cloud" size="small" />
</Flex>
);
};
export const IconButtonDisabled = () => {
return <IconButton icon="cloud" disabled />;
};
export const IconButtonResponsive = () => {
return (
<IconButton
icon="cloud"
variant={{ initial: 'primary', lg: 'secondary' }}
/>
);
};
export const IconButtonPlayground = () => {
const variants: string[] = ['primary', 'secondary'];
return (
<Flex direction="column">
{variants.map(variant => (
<Flex direction="column" key={variant}>
<Text>{variant}</Text>
{['small', 'medium'].map(size => (
<Flex align="center" key={size}>
<IconButton
icon="cloud"
variant={variant as ButtonProps['variant']}
size={size as ButtonProps['size']}
/>
</Flex>
))}
</Flex>
))}
</Flex>
);
};
canon-docs/src/snippets/icon.tsx
-7
View File
@@ -1,7 +0,0 @@
'use client';
import { Icon } from '../../../packages/canon';
export const IconPreview = () => {
return <Icon name="heart" />;
};
canon-docs/src/snippets/inline.tsx
-47
View File
@@ -1,47 +0,0 @@
'use client';
import { Box, Flex } from '../../../packages/canon';
const fakeBlockList = [
{ width: 45, height: 60 },
{ width: 150, height: 75 },
{ width: 80, height: 50 },
{ width: 120, height: 70 },
{ width: 95, height: 65 },
{ width: 80, height: 32 },
{ width: 130, height: 60 },
{ width: 100, height: 80 },
{ width: 140, height: 45 },
{ width: 85, height: 70 },
{ width: 125, height: 50 },
];
const FakeBox = ({
width = 120,
height = 80,
}: {
width?: number;
height?: number;
}) => (
<Box
style={{
background: '#eaf2fd',
borderRadius: '4px',
boxShadow: '0 0 0 1px #2563eb',
width,
height,
backgroundImage:
'url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%20fill%3D%22%232563eb%22%20fill-opacity%3D%220.3%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M5%200h1L0%206V5zM6%205v1H5z%22/%3E%3C/g%3E%3C/svg%3E")',
}}
/>
);
export const InlinePreview = () => {
return (
<Flex>
{fakeBlockList.map((block, index) => (
<FakeBox key={index} width={block.width} height={block.height} />
))}
</Flex>
);
};
canon-docs/src/snippets/input.tsx
-36
View File
@@ -1,36 +0,0 @@
'use client';
import { Input, Grid } from '../../../packages/canon';
export const InputPreview = () => {
return (
<div style={{ width: '300px' }}>
<Input placeholder="Enter your name" />
</div>
);
};
export const InputSizes = () => {
return (
<Grid style={{ width: '300px' }}>
<Input size="sm" placeholder="Small" />
<Input size="md" placeholder="Medium" />
</Grid>
);
};
export const InputError = () => {
return (
<div style={{ width: '300px' }}>
<Input required />
</div>
);
};
export const InputPlayground = () => {
return (
<div style={{ maxWidth: '300px' }}>
<Input placeholder="Enter your name" />
</div>
);
};
canon-docs/src/snippets/stories-snippets.tsx
+127
View File
@@ -0,0 +1,127 @@
'use client';
import { composeStories } from '@storybook/react';
import * as BoxStories from '../../../packages/canon/src/components/Box/Box.stories';
import * as ButtonStories from '../../../packages/canon/src/components/Button/Button.stories';
import * as CheckboxStories from '../../../packages/canon/src/components/Checkbox/Checkbox.stories';
import * as ContainerStories from '../../../packages/canon/src/components/Container/Container.stories';
import * as FieldStories from '../../../packages/canon/src/components/Field/Field.stories';
import * as GridStories from '../../../packages/canon/src/components/Grid/Grid.stories';
import * as HeadingStories from '../../../packages/canon/src/components/Heading/Heading.stories';
import * as IconButtonStories from '../../../packages/canon/src/components/IconButton/IconButton.stories';
import * as IconStories from '../../../packages/canon/src/components/Icon/Icon.stories';
import * as InputStories from '../../../packages/canon/src/components/Input/Input.stories';
import * as TextStories from '../../../packages/canon/src/components/Text/Text.stories';
import * as FlexStories from '../../../packages/canon/src/components/Flex/Flex.stories';
export const BoxSnippet = ({ story }: { story: keyof typeof BoxStories }) => {
const stories = composeStories(BoxStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const ButtonSnippet = ({
story,
}: {
story: keyof typeof ButtonStories;
}) => {
const stories = composeStories(ButtonStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const CheckboxSnippet = ({
story,
}: {
story: keyof typeof CheckboxStories;
}) => {
const stories = composeStories(CheckboxStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const ContainerSnippet = ({
story,
}: {
story: keyof typeof ContainerStories;
}) => {
const stories = composeStories(ContainerStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const FlexSnippet = ({ story }: { story: keyof typeof FlexStories }) => {
const stories = composeStories(FlexStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const FieldSnippet = ({
story,
}: {
story: keyof typeof FieldStories;
}) => {
const stories = composeStories(FieldStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const GridSnippet = ({ story }: { story: keyof typeof GridStories }) => {
const stories = composeStories(GridStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const HeadingSnippet = ({
story,
}: {
story: keyof typeof HeadingStories;
}) => {
const stories = composeStories(HeadingStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const IconButtonSnippet = ({
story,
}: {
story: keyof typeof IconButtonStories;
}) => {
const stories = composeStories(IconButtonStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const IconSnippet = ({ story }: { story: keyof typeof IconStories }) => {
const stories = composeStories(IconStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const InputSnippet = ({
story,
}: {
story: keyof typeof InputStories;
}) => {
const stories = composeStories(InputStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
export const TextSnippet = ({ story }: { story: keyof typeof TextStories }) => {
const stories = composeStories(TextStories);
const StoryComponent = stories[story as keyof typeof stories];
return StoryComponent ? <StoryComponent /> : null;
};
canon-docs/src/snippets/text.tsx
-94
View File
@@ -1,94 +0,0 @@
'use client';
import { Flex, Text } from '../../../packages/canon';
export const TextPreview = () => {
return (
<Text style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is in
the painting?
</Text>
);
};
export const TextAllVariants = () => {
return (
<Flex direction="column">
<Text variant="subtitle" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text variant="body" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text variant="caption" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text variant="label" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
</Flex>
);
};
export const TextAllWeights = () => {
return (
<Flex direction="column">
<Text weight="regular" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text weight="bold" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
</Flex>
);
};
export const TextResponsive = () => {
return (
<Text variant={{ initial: 'body', lg: 'subtitle' }}>Responsive text</Text>
);
};
export const TextPlayground = () => {
return (
<Flex direction="column">
<Text>Subtitle</Text>
<Text variant="subtitle" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text>Body</Text>
<Text variant="body" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text>Caption</Text>
<Text variant="caption" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
<Text>Label</Text>
<Text variant="label" style={{ maxWidth: '600px' }}>
A man looks at a painting in a museum and says, “Brothers and sisters I
have none, but that man&apos;s father is my father&apos;s son.” Who is
in the painting?
</Text>
</Flex>
);
};
canon-docs/yarn.lock
+83 -82
View File
@@ -6,11 +6,11 @@ __metadata:
cacheKey: 8
"@babel/runtime@npm:^7.18.6":
version: 7.26.0
resolution: "@babel/runtime@npm:7.26.0"
version: 7.26.10
resolution: "@babel/runtime@npm:7.26.10"
dependencies:
regenerator-runtime: ^0.14.0
checksum: c8e2c0504ab271b3467a261a8f119bf2603eb857a0d71e37791f4e3fae00f681365073cc79f141ddaa90c6077c60ba56448004ad5429d07ac73532be9f7cf28a
checksum: 22d2e0abb86e90de489ab16bb578db6fe2b63a88696db431198b24963749820c723f1982298cdbbea187f7b2b80fb4d98a514faf114ddb2fdc14a4b96277b955
languageName: node
linkType: hard
@@ -722,20 +722,20 @@ __metadata:
languageName: node
linkType: hard
"@storybook/components@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/components@npm:8.6.7"
"@storybook/components@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/components@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: cb20f8baa76deef1af1739d6c1b1a9f57eb22d158fa046d9919a91840e7a00f1b48e96b7ffe7994365b60808f864c963a3476ee98b4c8b63968a3a877068da3a
checksum: fb69c6d7804f91fffd3fc7d42ba5b144c7b808af6e6b764c14cdef11263897e551e5cc8a0fa379b9ed73f5c0438ed32d355c7ed63801046e1cb078c479d4cecf
languageName: node
linkType: hard
"@storybook/core@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/core@npm:8.6.7"
"@storybook/core@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/core@npm:8.6.8"
dependencies:
"@storybook/theming": 8.6.7
"@storybook/theming": 8.6.8
better-opn: ^3.0.2
browser-assert: ^1.2.1
esbuild: ^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0
@@ -751,7 +751,7 @@ __metadata:
peerDependenciesMeta:
prettier:
optional: true
checksum: b150b7472766fccbbc1dec74cba3c16e009a9f24c13f01198923f553d12e2a2070ee2a35f5514f9af350b79e34577946ea65a4a495fd1fa18a27655f897c013a
checksum: d67dea27c021b51f17a0d5807b72a29ea174bb8c945fb41092fbf3698002810da0a510aa7e0e23e1682634362f9b52590ba1a09ef6dd40a2ad5653988b0b0e14
languageName: node
linkType: hard
@@ -762,66 +762,66 @@ __metadata:
languageName: node
linkType: hard
"@storybook/manager-api@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/manager-api@npm:8.6.7"
"@storybook/manager-api@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/manager-api@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 6bb0860c3795945189832613da5866e5159b2adb376478a2b596c113928c64f5962efc325f927a6bcb7a48d7257f42cf6489b0c44397876129626ac68c44aa28
checksum: ee575781572898fc2fa734750ccb4bad09fc021bd0878ca9a05d9668cb336610d53e8110f4ff3c2c180573a64e9caba8f50f59d0bd3f0398a5c98e2eafdd91ae
languageName: node
linkType: hard
"@storybook/preview-api@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/preview-api@npm:8.6.7"
"@storybook/preview-api@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/preview-api@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 0d24d62444b7b153bde89d3949ab6539a163e15bc80c5bfcc73b7d49bbb34fb02eb74a99434793b8a6446aeec491e07f006c0f4e404f98486c6d1d614d01defa
checksum: ac923a342d09c9e51f67734acaea19a41dc87cfc6cb22aea262591396d41cd4b69896417b618c55f17a9d64660b659813475c30d338c9bb6aa45391cfe8328f0
languageName: node
linkType: hard
"@storybook/react-dom-shim@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/react-dom-shim@npm:8.6.7"
"@storybook/react-dom-shim@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/react-dom-shim@npm:8.6.8"
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
checksum: 51c20259ac4485d9a996266341a4d9898c949049e2a9af9a08bec58c2ace3a40be1a534005c52fc2db2c81bb010dbd36030bb70581b36c05cf4b34d58f140d3a
storybook: ^8.6.8
checksum: d48ba28fefe0bbe0bde02de6a99629d84ba9436fb539ffc6d779173f7b8f6ec466e26018e943d95fa079d73ace2d96d5911def0221754262782e8a5e8b20882d
languageName: node
linkType: hard
"@storybook/react@npm:^8.4.7":
version: 8.6.7
resolution: "@storybook/react@npm:8.6.7"
"@storybook/react@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/react@npm:8.6.8"
dependencies:
"@storybook/components": 8.6.7
"@storybook/components": 8.6.8
"@storybook/global": ^5.0.0
"@storybook/manager-api": 8.6.7
"@storybook/preview-api": 8.6.7
"@storybook/react-dom-shim": 8.6.7
"@storybook/theming": 8.6.7
"@storybook/manager-api": 8.6.8
"@storybook/preview-api": 8.6.8
"@storybook/react-dom-shim": 8.6.8
"@storybook/theming": 8.6.8
peerDependencies:
"@storybook/test": 8.6.7
"@storybook/test": 8.6.8
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
storybook: ^8.6.8
typescript: ">= 4.2.x"
peerDependenciesMeta:
"@storybook/test":
optional: true
typescript:
optional: true
checksum: c98438ddfd764300e1a805623fab976f9ef94a2d939984d6caf98ce92ed29d8a7307389b98e2df2d1302b302dc549c7c95050464731d9c588347cd154c360834
checksum: ebbfb2bed68d4ca8c8777769e5b752b1becf9cc1c3fd6f051df9a8eb012d209526b9e188812f3bf8ecf337a331c5049afa2236d2b073fbcafafd35e79cc3ed78
languageName: node
linkType: hard
"@storybook/theming@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/theming@npm:8.6.7"
"@storybook/theming@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/theming@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 747a2377df65d5f0962dc8606d06247ad89fb7ecabab0bd9611055d599b5bd0fa15769e4c76e948ae34ae232ba756bf6795ccb3467b1adf35ff961db7350f4de
checksum: 1be0dea23178af562133f1047165e170f7e90bec4c3cedbdcb59df22685f314273a06a4677835ab84e6dbc682b803590adad6963217971c8136b076ce69800aa
languageName: node
linkType: hard
@@ -1436,13 +1436,13 @@ __metadata:
languageName: node
linkType: hard
"call-bind-apply-helpers@npm:^1.0.0, call-bind-apply-helpers@npm:^1.0.1":
version: 1.0.1
resolution: "call-bind-apply-helpers@npm:1.0.1"
"call-bind-apply-helpers@npm:^1.0.0, call-bind-apply-helpers@npm:^1.0.1, call-bind-apply-helpers@npm:^1.0.2":
version: 1.0.2
resolution: "call-bind-apply-helpers@npm:1.0.2"
dependencies:
es-errors: ^1.3.0
function-bind: ^1.1.2
checksum: 3c55343261bb387c58a4762d15ad9d42053659a62681ec5eb50690c6b52a4a666302a01d557133ce6533e8bd04530ee3b209f23dd06c9577a1925556f8fcccdf
checksum: b2863d74fcf2a6948221f65d95b91b4b2d90cfe8927650b506141e669f7d5de65cea191bf788838bc40d13846b7886c5bc5c84ab96c3adbcf88ad69a72fcdc6b
languageName: node
linkType: hard
@@ -1458,13 +1458,13 @@ __metadata:
languageName: node
linkType: hard
"call-bound@npm:^1.0.2, call-bound@npm:^1.0.3":
version: 1.0.3
resolution: "call-bound@npm:1.0.3"
"call-bound@npm:^1.0.2, call-bound@npm:^1.0.3, call-bound@npm:^1.0.4":
version: 1.0.4
resolution: "call-bound@npm:1.0.4"
dependencies:
call-bind-apply-helpers: ^1.0.1
get-intrinsic: ^1.2.6
checksum: a93bbe0f2d0a2d6c144a4349ccd0593d5d0d5d9309b69101710644af8964286420062f2cc3114dca120b9bc8cc07507952d4b1b3ea7672e0d7f6f1675efedb32
call-bind-apply-helpers: ^1.0.2
get-intrinsic: ^1.3.0
checksum: 2f6399488d1c272f56306ca60ff696575e2b7f31daf23bc11574798c84d9f2759dceb0cb1f471a85b77f28962a7ac6411f51d283ea2e45319009a19b6ccab3b2
languageName: node
linkType: hard
@@ -1491,7 +1491,7 @@ __metadata:
"@mdx-js/loader": ^3.1.0
"@mdx-js/react": ^3.1.0
"@next/mdx": ^15.1.4
"@storybook/react": ^8.4.7
"@storybook/react": ^8.6.8
"@types/mdx": ^2.0.13
"@types/node": ^20
"@types/react": ^18.0.0
@@ -1507,7 +1507,7 @@ __metadata:
react-dom: ^18.0.2
react-frame-component: ^5.2.7
shiki: ^1.26.1
storybook: ^8.4.7
storybook: ^8.6.8
typescript: ^5
languageName: unknown
linkType: soft
@@ -1934,12 +1934,12 @@ __metadata:
languageName: node
linkType: hard
"es-object-atoms@npm:^1.0.0":
version: 1.0.0
resolution: "es-object-atoms@npm:1.0.0"
"es-object-atoms@npm:^1.0.0, es-object-atoms@npm:^1.1.1":
version: 1.1.1
resolution: "es-object-atoms@npm:1.1.1"
dependencies:
es-errors: ^1.3.0
checksum: 26f0ff78ab93b63394e8403c353842b2272836968de4eafe97656adfb8a7c84b9099bf0fe96ed58f4a4cddc860f6e34c77f91649a58a5daa4a9c40b902744e3c
checksum: 214d3767287b12f36d3d7267ef342bbbe1e89f899cfd67040309fc65032372a8e60201410a99a1645f2f90c1912c8c49c8668066f6bdd954bcd614dda2e3da97
languageName: node
linkType: hard
@@ -2555,12 +2555,12 @@ __metadata:
languageName: node
linkType: hard
"for-each@npm:^0.3.3":
version: 0.3.3
resolution: "for-each@npm:0.3.3"
"for-each@npm:^0.3.3, for-each@npm:^0.3.5":
version: 0.3.5
resolution: "for-each@npm:0.3.5"
dependencies:
is-callable: ^1.1.3
checksum: 6c48ff2bc63362319c65e2edca4a8e1e3483a2fabc72fbe7feaf8c73db94fc7861bd53bc02c8a66a0c1dd709da6b04eec42e0abdd6b40ce47305ae92a25e5d28
is-callable: ^1.2.7
checksum: 3c986d7e11f4381237cc98baa0a2f87eabe74719eee65ed7bed275163082b940ede19268c61d04c6260e0215983b12f8d885e3c8f9aa8c2113bf07c37051745c
languageName: node
linkType: hard
@@ -2631,21 +2631,21 @@ __metadata:
languageName: node
linkType: hard
"get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6, get-intrinsic@npm:^1.2.7":
version: 1.2.7
resolution: "get-intrinsic@npm:1.2.7"
"get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6, get-intrinsic@npm:^1.2.7, get-intrinsic@npm:^1.3.0":
version: 1.3.0
resolution: "get-intrinsic@npm:1.3.0"
dependencies:
call-bind-apply-helpers: ^1.0.1
call-bind-apply-helpers: ^1.0.2
es-define-property: ^1.0.1
es-errors: ^1.3.0
es-object-atoms: ^1.0.0
es-object-atoms: ^1.1.1
function-bind: ^1.1.2
get-proto: ^1.0.0
get-proto: ^1.0.1
gopd: ^1.2.0
has-symbols: ^1.1.0
hasown: ^2.0.2
math-intrinsics: ^1.1.0
checksum: a1597b3b432074f805b6a0ba1182130dd6517c0ea0c4eecc4b8834c803913e1ea62dfc412865be795b3dacb1555a21775b70cf9af7a18b1454ff3414e5442d4a
checksum: 301008e4482bb9a9cb49e132b88fee093bff373b4e6def8ba219b1e96b60158a6084f273ef5cafe832e42cd93462f4accb46a618d35fe59a2b507f2388c5b79d
languageName: node
linkType: hard
@@ -3042,7 +3042,7 @@ __metadata:
languageName: node
linkType: hard
"is-callable@npm:^1.1.3, is-callable@npm:^1.2.7":
"is-callable@npm:^1.2.7":
version: 1.2.7
resolution: "is-callable@npm:1.2.7"
checksum: 61fd57d03b0d984e2ed3720fb1c7a897827ea174bd44402878e059542ea8c4aeedee0ea0985998aa5cc2736b2fa6e271c08587addb5b3959ac52cf665173d1ac
@@ -5051,11 +5051,11 @@ __metadata:
languageName: node
linkType: hard
"storybook@npm:^8.4.7":
version: 8.6.7
resolution: "storybook@npm:8.6.7"
"storybook@npm:^8.6.8":
version: 8.6.8
resolution: "storybook@npm:8.6.8"
dependencies:
"@storybook/core": 8.6.7
"@storybook/core": 8.6.8
peerDependencies:
prettier: ^2 || ^3
peerDependenciesMeta:
@@ -5065,7 +5065,7 @@ __metadata:
getstorybook: ./bin/index.cjs
sb: ./bin/index.cjs
storybook: ./bin/index.cjs
checksum: fe21ce4d9cd17069a5b409ed518603f97ec6ec421b7f41cff3e43b409820fcbc2c8dbcb3aed99dd7d0a99a0c6138c7576ddf72f78186b6f86085d503b3c8b32f
checksum: 93b92e53c00ff29b4864932c26c52dd4a45e76b3d46811a2bcdc0271ef37c96e2f8d1833982569ab6a6348d6e84d8348aecf74ee72164744459de4c78d0f6759
languageName: node
linkType: hard
@@ -5616,16 +5616,17 @@ __metadata:
linkType: hard
"which-typed-array@npm:^1.1.16, which-typed-array@npm:^1.1.18, which-typed-array@npm:^1.1.2":
version: 1.1.18
resolution: "which-typed-array@npm:1.1.18"
version: 1.1.19
resolution: "which-typed-array@npm:1.1.19"
dependencies:
available-typed-arrays: ^1.0.7
call-bind: ^1.0.8
call-bound: ^1.0.3
for-each: ^0.3.3
call-bound: ^1.0.4
for-each: ^0.3.5
get-proto: ^1.0.1
gopd: ^1.2.0
has-tostringtag: ^1.0.2
checksum: d2feea7f51af66b3a240397aa41c796585033e1069f18e5b6d4cd3878538a1e7780596fd3ea9bf347c43d9e98e13be09b37d9ea3887cef29b11bc291fd47bb52
checksum: 162d2a07f68ea323f88ed9419861487ce5d02cb876f2cf9dd1e428d04a63133f93a54f89308f337b27cabd312ee3d027cae4a79002b2f0a85b79b9ef4c190670
languageName: node
linkType: hard
@@ -5677,8 +5678,8 @@ __metadata:
linkType: hard
"ws@npm:^8.2.3":
version: 8.18.0
resolution: "ws@npm:8.18.0"
version: 8.18.1
resolution: "ws@npm:8.18.1"
peerDependencies:
bufferutil: ^4.0.1
utf-8-validate: ">=5.0.2"
@@ -5687,7 +5688,7 @@ __metadata:
optional: true
utf-8-validate:
optional: true
checksum: 91d4d35bc99ff6df483bdf029b9ea4bfd7af1f16fc91231a96777a63d263e1eabf486e13a2353970efc534f9faa43bdbf9ee76525af22f4752cbc5ebda333975
checksum: 4658357185d891bc45cc2d42a84f9e192d047e8476fb5cba25b604f7d75ca87ca0dd54cd0b2cc49aeee57c79045a741cb7d0b14501953ac60c790cd105c42f23
languageName: node
linkType: hard
packages/canon/.storybook/manager.ts
-12
View File
@@ -1,12 +0,0 @@
import { addons } from '@storybook/manager-api';
import { create } from '@storybook/theming';
const theme = create({
base: 'light',
brandTitle: 'Canon',
brandImage: 'logo.svg',
});
addons.setConfig({
theme,
});
packages/canon/package.json
+9 -10
View File
@@ -47,20 +47,19 @@
},
"devDependencies": {
"@backstage/cli": "workspace:^",
"@storybook/addon-essentials": "^8.6.4",
"@storybook/addon-interactions": "^8.6.4",
"@storybook/addon-essentials": "^8.6.8",
"@storybook/addon-interactions": "^8.6.8",
"@storybook/addon-styling-webpack": "^1.0.1",
"@storybook/addon-themes": "^8.6.4",
"@storybook/addon-webpack5-compiler-swc": "^2.1.0",
"@storybook/blocks": "^8.6.4",
"@storybook/react": "^8.6.4",
"@storybook/react-webpack5": "^8.6.4",
"@storybook/test": "^8.6.4",
"@storybook/addon-themes": "^8.6.8",
"@storybook/addon-webpack5-compiler-swc": "^3.0.0",
"@storybook/blocks": "^8.6.8",
"@storybook/react": "^8.6.8",
"@storybook/react-webpack5": "^8.6.8",
"@storybook/test": "^8.6.8",
"@testing-library/jest-dom": "^6.0.0",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"chalk": "^5.4.1",
"concurrently": "^9.1.2",
"eslint-plugin-storybook": "^0.11.4",
"glob": "^11.0.1",
"globals": "^15.11.0",
@@ -69,7 +68,7 @@
"react": "^18.0.2",
"react-dom": "^18.0.2",
"react-router-dom": "^6.3.0",
"storybook": "^8.6.4"
"storybook": "^8.6.8"
},
"peerDependencies": {
"@types/react": "^17.0.0 || ^18.0.0",
packages/canon/report.api.md
+3 -2
View File
@@ -13,6 +13,7 @@ import { default as React_2 } from 'react';
import * as React_3 from 'react';
import { ReactNode } from 'react';
import { RefAttributes } from 'react';
import type { RemixiconComponentType } from '@remixicon/react';
import { ScrollArea as ScrollArea_2 } from '@base-ui-components/react/scroll-area';
import { Tooltip as Tooltip_2 } from '@base-ui-components/react/tooltip';
@@ -636,7 +637,7 @@ export interface IconContextProps {
}
// @public (undocumented)
export type IconMap = Partial<Record<IconNames, React.ComponentType>>;
export type IconMap = Partial<Record<IconNames, RemixiconComponentType>>;
// @public (undocumented)
export type IconNames =
@@ -711,7 +712,7 @@ export interface IconProviderProps {
// (undocumented)
children?: ReactNode;
// (undocumented)
overrides?: Partial<Record<IconNames, React.ComponentType>>;
overrides?: Partial<Record<IconNames, RemixiconComponentType>>;
}
// @public (undocumented)
packages/canon/src/components/Flex/Flex.stories.tsx
+15 -3
View File
@@ -61,21 +61,33 @@ const DecorativeBox = () => {
export const Default: Story = {
args: {
children: [<DecorativeBox />, <DecorativeBox />, <DecorativeBox />],
children: (
<>
<DecorativeBox />, <DecorativeBox />, <DecorativeBox />
</>
),
},
};
export const ColumnDirection: Story = {
args: {
direction: 'column',
children: [<DecorativeBox />, <DecorativeBox />, <DecorativeBox />],
children: (
<>
<DecorativeBox />, <DecorativeBox />, <DecorativeBox />
</>
),
},
};
export const RowDirection: Story = {
args: {
direction: 'row',
children: [<DecorativeBox />, <DecorativeBox />, <DecorativeBox />],
children: (
<>
<DecorativeBox />, <DecorativeBox />, <DecorativeBox />
</>
),
},
};
packages/canon/src/components/Heading/Heading.stories.tsx
+2 -4
View File
@@ -18,7 +18,6 @@ import React from 'react';
import type { Meta, StoryObj } from '@storybook/react';
import { Heading } from './Heading';
import { Flex } from '../Flex';
import { Text } from '../Text';
const meta = {
title: 'Components/Heading',
@@ -42,7 +41,7 @@ export const Title1: Story = {
export const AllVariants: Story = {
render: () => (
<Flex>
<Flex direction="column" gap="4">
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
<Heading variant="title2">Title 2</Heading>
@@ -83,8 +82,7 @@ export const WrappedInLink: Story = {
export const Playground: Story = {
render: () => (
<Flex>
<Text>All variants</Text>
<Flex direction="column" gap="4">
<Heading variant="display">Display</Heading>
<Heading variant="title1">Title 1</Heading>
<Heading variant="title2">Title 2</Heading>
packages/canon/src/components/Icon/icons.ts
+1 -1
View File
@@ -130,4 +130,4 @@ export const icons: IconMap = {
youtube: RiYoutubeLine,
'zoom-in': RiZoomInLine,
'zoom-out': RiZoomOutLine,
};
} as const;
packages/canon/src/components/Icon/types.ts
+3 -2
View File
@@ -15,6 +15,7 @@
*/
import { ReactNode } from 'react';
import type { RemixiconComponentType } from '@remixicon/react';
/** @public */
export type IconNames =
@@ -74,7 +75,7 @@ export type IconNames =
| 'zoom-out';
/** @public */
export type IconMap = Partial<Record<IconNames, React.ComponentType>>;
export type IconMap = Partial<Record<IconNames, RemixiconComponentType>>;
/** @public */
export type IconProps = {
@@ -92,5 +93,5 @@ export interface IconContextProps {
/** @public */
export interface IconProviderProps {
children?: ReactNode;
overrides?: Partial<Record<IconNames, React.ComponentType>>;
overrides?: Partial<Record<IconNames, RemixiconComponentType>>;
}
yarn.lock
+243 -247
View File
@@ -3780,21 +3780,20 @@ __metadata:
"@backstage/cli": "workspace:^"
"@base-ui-components/react": ^1.0.0-alpha.5
"@remixicon/react": ^4.5.0
"@storybook/addon-essentials": ^8.6.4
"@storybook/addon-interactions": ^8.6.4
"@storybook/addon-essentials": ^8.6.8
"@storybook/addon-interactions": ^8.6.8
"@storybook/addon-styling-webpack": ^1.0.1
"@storybook/addon-themes": ^8.6.4
"@storybook/addon-webpack5-compiler-swc": ^2.1.0
"@storybook/blocks": ^8.6.4
"@storybook/react": ^8.6.4
"@storybook/react-webpack5": ^8.6.4
"@storybook/test": ^8.6.4
"@storybook/addon-themes": ^8.6.8
"@storybook/addon-webpack5-compiler-swc": ^3.0.0
"@storybook/blocks": ^8.6.8
"@storybook/react": ^8.6.8
"@storybook/react-webpack5": ^8.6.8
"@storybook/test": ^8.6.8
"@testing-library/jest-dom": ^6.0.0
"@types/react": ^18.0.0
"@types/react-dom": ^18.0.0
chalk: ^5.4.1
clsx: ^2.1.1
concurrently: ^9.1.2
eslint-plugin-storybook: ^0.11.4
glob: ^11.0.1
globals: ^15.11.0
@@ -3803,7 +3802,7 @@ __metadata:
react: ^18.0.2
react-dom: ^18.0.2
react-router-dom: ^6.3.0
storybook: ^8.6.4
storybook: ^8.6.8
peerDependencies:
"@types/react": ^17.0.0 || ^18.0.0
react: ^17.0.0 || ^18.0.0
@@ -17328,9 +17327,9 @@ __metadata:
languageName: node
linkType: hard
"@storybook/addon-actions@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-actions@npm:8.6.7"
"@storybook/addon-actions@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-actions@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
"@types/uuid": ^9.0.1
@@ -17338,121 +17337,121 @@ __metadata:
polished: ^4.2.2
uuid: ^9.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 28add3c30e397894bb13d1d492b88e331cec2a24b47ad9e865002e54851a17a0916387dca02074b834c6d665748bd2a5ec88904ad08795645d1b8a9345fb1328
storybook: ^8.6.8
checksum: 8799cdad3f4c604cb7dd11331e2a9a2786ea0dfb2dddde7dfc1f782d748911dc3c1d495828b89e70f49f114c6040507adce3d607d6a4ef146b8daf83070c7373
languageName: node
linkType: hard
"@storybook/addon-backgrounds@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-backgrounds@npm:8.6.7"
"@storybook/addon-backgrounds@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-backgrounds@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
memoizerific: ^1.11.3
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 574b634e49225f52800a7ed0ea7b120f15198ae91068c06842b16e2d197a076bf94c1b42dc05fc0daac328169317768f28294260a14451f928cb0641010bec0d
storybook: ^8.6.8
checksum: 4483217be3ca542ab37c5d565511295587097965f5df4f0c0ca83eca8d3f7f4bed3ef32eb5f7ef434a1fabd1727e06ad227ac52174d22b9c86611f0f18f0543e
languageName: node
linkType: hard
"@storybook/addon-controls@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-controls@npm:8.6.7"
"@storybook/addon-controls@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-controls@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
dequal: ^2.0.2
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 002184ac5444ea21bb76e2737f596920d1d06fbf2f7eab75d12d8f4b4f176439132e81e7433ad46f968e379bfb5224992a0a351b19f7673a96bbd74212d6d6c6
storybook: ^8.6.8
checksum: 81ffa2fe6cc7daf23d8db1a14ea0a81d4e25b933c5df554f39ebcd5ce18348da7dcfd68d5d0fc862bb39f034767186cb4d568653593ca9f3af3e47044b907559
languageName: node
linkType: hard
"@storybook/addon-docs@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-docs@npm:8.6.7"
"@storybook/addon-docs@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-docs@npm:8.6.8"
dependencies:
"@mdx-js/react": ^3.0.0
"@storybook/blocks": 8.6.7
"@storybook/csf-plugin": 8.6.7
"@storybook/react-dom-shim": 8.6.7
"@storybook/blocks": 8.6.8
"@storybook/csf-plugin": 8.6.8
"@storybook/react-dom-shim": 8.6.8
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 764c3fddbbb92a2c4c7df4d96d943f9511a96a40e87f94b084dbaed789bec4de8d87a83e3877cb7648aafb1fa61940be8d52c2910c037ade89c6ef02beb3d745
storybook: ^8.6.8
checksum: 22becb8d5bfd23c092d2666650c8cf19d68e794842f6772dbc617303bf9f6f70f838de3eed2e070fb23c603ea141ef9bf1ce9b9f2c24f62884d6b52df2f54ba7
languageName: node
linkType: hard
"@storybook/addon-essentials@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/addon-essentials@npm:8.6.7"
"@storybook/addon-essentials@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/addon-essentials@npm:8.6.8"
dependencies:
"@storybook/addon-actions": 8.6.7
"@storybook/addon-backgrounds": 8.6.7
"@storybook/addon-controls": 8.6.7
"@storybook/addon-docs": 8.6.7
"@storybook/addon-highlight": 8.6.7
"@storybook/addon-measure": 8.6.7
"@storybook/addon-outline": 8.6.7
"@storybook/addon-toolbars": 8.6.7
"@storybook/addon-viewport": 8.6.7
"@storybook/addon-actions": 8.6.8
"@storybook/addon-backgrounds": 8.6.8
"@storybook/addon-controls": 8.6.8
"@storybook/addon-docs": 8.6.8
"@storybook/addon-highlight": 8.6.8
"@storybook/addon-measure": 8.6.8
"@storybook/addon-outline": 8.6.8
"@storybook/addon-toolbars": 8.6.8
"@storybook/addon-viewport": 8.6.8
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 774b50e98888ece9536ec2a7f491c8486055d3c7515ac9a7f0264916f684c6c4608e95da7db14bceb65dfdf05f3fc93011a0b74a690eec2d44b6c969511b9313
storybook: ^8.6.8
checksum: eaaca24361e850809eb06fd01d873aad1203dc419bc112d50e6327b9ea4daabfca03e9cc0843c1f36da4965b766a28813b6f668df4fc189c84ccdf40a9a0df30
languageName: node
linkType: hard
"@storybook/addon-highlight@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-highlight@npm:8.6.7"
"@storybook/addon-highlight@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-highlight@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 7baae25d40e717e5138d10b4ea7ef424b55500ab7496ef38738ea0fb99f910bdf3a56651efbfa85d3e4218382498b045894653b47cdd066c6b16ed0076537940
storybook: ^8.6.8
checksum: 85eeb8d549b6b3358d31c8204a58164a2c6a7728d0d6e53799e65b4d3ab4cb29743bffc7f861b36d50eb2213f569668840a15c54c44beaefe7b707f2dc7966a5
languageName: node
linkType: hard
"@storybook/addon-interactions@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/addon-interactions@npm:8.6.7"
"@storybook/addon-interactions@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/addon-interactions@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
"@storybook/instrumenter": 8.6.7
"@storybook/test": 8.6.7
"@storybook/instrumenter": 8.6.8
"@storybook/test": 8.6.8
polished: ^4.2.2
ts-dedent: ^2.2.0
peerDependencies:
storybook: ^8.6.7
checksum: f7a66307aa4e83b1a230d0103123eef15ce7d27aa25c47270624b9ddb6653293e9d0dfe9bb93d3c348604ec05c774716bd513f4d3987ae0b9818a0f865fa0d69
storybook: ^8.6.8
checksum: 99a28f5c4ad3d1f2c239a339158733691ee68e5bf062e015607cb717841ee8eecd1f5244936d64f3ac39c00da8f1de0806cf3333d35f1c79b4762b3a40261c4e
languageName: node
linkType: hard
"@storybook/addon-measure@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-measure@npm:8.6.7"
"@storybook/addon-measure@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-measure@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
tiny-invariant: ^1.3.1
peerDependencies:
storybook: ^8.6.7
checksum: 38c51463366405216aa21f5e99a5c66acf8a626084427a439bbbdf76f41119cf66a5fd25e1b27f7859e180101b4a536ee058a3978b03cbe6a48f2e0807927c83
storybook: ^8.6.8
checksum: d31e576014aa960ad856a95a8156b65115856dc83b8670502ada1e730ec0ccade1f19e6f9eec2e80960c1b7c442b49777be4e4c4ccd05f849d66ba0d127b378d
languageName: node
linkType: hard
"@storybook/addon-outline@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-outline@npm:8.6.7"
"@storybook/addon-outline@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-outline@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 8919842d53079cb6ae8efcecc5673d1fcd3ec8f9cf2dbf2f44de0fa2648ef684bd626c9be187ef570e7ff2b21eb92bfe1759b8e72bd41f9f0cb82e2e57073cc7
storybook: ^8.6.8
checksum: 4d6e137b0de24da56aca1e41b39673488bda2634952027e982ae134ffb8aaa3ed67120c348c157f15d27c65dd530dec815df805c671f6e8a9f5d5697a84c251b
languageName: node
linkType: hard
@@ -17467,71 +17466,71 @@ __metadata:
languageName: node
linkType: hard
"@storybook/addon-themes@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/addon-themes@npm:8.6.7"
"@storybook/addon-themes@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/addon-themes@npm:8.6.8"
dependencies:
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: 209793b93774e3e1696e33fcf3a62dd63a4ca60920e45b465a86a2504545d00463ebc683f4ff65606b502175d575a969698efe96538daebc5254adfe9b767929
storybook: ^8.6.8
checksum: c75aa43e1aaf5af0d2526319d35209a796c074983fbe053f6fab63277e4ae9b872d8b6ae796851e9d7f471e1c94d3ba4925ff7b3fadbe0986fdb922a87be824a
languageName: node
linkType: hard
"@storybook/addon-toolbars@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-toolbars@npm:8.6.7"
"@storybook/addon-toolbars@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-toolbars@npm:8.6.8"
peerDependencies:
storybook: ^8.6.7
checksum: 72de8200fcbd95714b79deae7194451725abfd75dac56862b76d9f19150aa844829d7e2c99597fc3be650c6cd952c3fe4789866512314fb26f5d112620ae8145
storybook: ^8.6.8
checksum: 5c034aca498ddd91ca23cd571b4c7a9c6d643bd19cf0c67346f4ae4617292ca858dbe1170c566ac550ad6f7d564effee329d89e9f2fa1219e605d8b6cfe06572
languageName: node
linkType: hard
"@storybook/addon-viewport@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/addon-viewport@npm:8.6.7"
"@storybook/addon-viewport@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/addon-viewport@npm:8.6.8"
dependencies:
memoizerific: ^1.11.3
peerDependencies:
storybook: ^8.6.7
checksum: 2a83a8683ca8306e13578266aeffbc24968f9bf11b1b71c19a5aba0239e0365f19d335950ec261f11c4907577a9600ab6182ccc0ad8e60c13f9a9ea02b6b0adc
storybook: ^8.6.8
checksum: 8a9f21bad254ef1cb31cb4ff8fc6089e90894678bb234ad92c4e2aaae4f4c7a50fc31b559f30ff105b627872e14bbda1cb8c475f3429ac3207d7aae841915ba0
languageName: node
linkType: hard
"@storybook/addon-webpack5-compiler-swc@npm:^2.1.0":
version: 2.1.0
resolution: "@storybook/addon-webpack5-compiler-swc@npm:2.1.0"
"@storybook/addon-webpack5-compiler-swc@npm:^3.0.0":
version: 3.0.0
resolution: "@storybook/addon-webpack5-compiler-swc@npm:3.0.0"
dependencies:
"@swc/core": ^1.10.8
swc-loader: ^0.2.6
checksum: 1a5ebc6842f29b342d4bb0a8efab183e521c07b96aee9071dbddb2d4c8ab3525dd79cd1b3be914d0f45dbb97a2cb5b78392e352ed5f406f891f9f10857e1315d
checksum: 4dbf7df5ed5c6c8a6f532c2761839206bdc9d3d4a11c5cf435b4ded44c8bcb57b83cf389dd8c9510e0dc90587d8ef0ba45730daf865ca8b24c58757dcb649f63
languageName: node
linkType: hard
"@storybook/blocks@npm:8.6.7, @storybook/blocks@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/blocks@npm:8.6.7"
"@storybook/blocks@npm:8.6.8, @storybook/blocks@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/blocks@npm:8.6.8"
dependencies:
"@storybook/icons": ^1.2.12
ts-dedent: ^2.0.0
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
storybook: ^8.6.7
storybook: ^8.6.8
peerDependenciesMeta:
react:
optional: true
react-dom:
optional: true
checksum: 89b600680772712500318d82195d2a78885d84127a05ab3e2e6474170f871239ab5de72669d0bfdeede99186f8487c48e197ed33fc3e7fc17d0aea228f915bff
checksum: 5d52e9e64179b4355b34f4fbafb2903249c654b7f3f8656887fa60e704b9d7ea8d57b617227d3e71d742eef64023b961b8eb938806ce267f86dfe437e967861d
languageName: node
linkType: hard
"@storybook/builder-webpack5@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/builder-webpack5@npm:8.6.7"
"@storybook/builder-webpack5@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/builder-webpack5@npm:8.6.8"
dependencies:
"@storybook/core-webpack": 8.6.7
"@storybook/core-webpack": 8.6.8
"@types/semver": ^7.3.4
browser-assert: ^1.2.1
case-sensitive-paths-webpack-plugin: ^2.4.0
@@ -17556,39 +17555,39 @@ __metadata:
webpack-hot-middleware: ^2.25.1
webpack-virtual-modules: ^0.6.0
peerDependencies:
storybook: ^8.6.7
storybook: ^8.6.8
peerDependenciesMeta:
typescript:
optional: true
checksum: 87ee61663dc418385f6b04f48b0790d5df34f1bcc267714cedd63062fd304dfeb35f1f3c71ee123d0dd3122b7d29d06e32a56618d280e6b0cae12d7eac72b59d
checksum: 27bc38b1b46f681f2a24410b4b06973b516b5031f35b355cddc48c70eb7784537f6fadec2ceca367a818f13a8700877893730d676a3ce6ba25f3e5baf69bae6b
languageName: node
linkType: hard
"@storybook/components@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/components@npm:8.6.7"
"@storybook/components@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/components@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: cb20f8baa76deef1af1739d6c1b1a9f57eb22d158fa046d9919a91840e7a00f1b48e96b7ffe7994365b60808f864c963a3476ee98b4c8b63968a3a877068da3a
checksum: fb69c6d7804f91fffd3fc7d42ba5b144c7b808af6e6b764c14cdef11263897e551e5cc8a0fa379b9ed73f5c0438ed32d355c7ed63801046e1cb078c479d4cecf
languageName: node
linkType: hard
"@storybook/core-webpack@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/core-webpack@npm:8.6.7"
"@storybook/core-webpack@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/core-webpack@npm:8.6.8"
dependencies:
ts-dedent: ^2.0.0
peerDependencies:
storybook: ^8.6.7
checksum: a2b7d8db89cc96ba7278c82ba1ea43303baa7dba9f4c7aff2d576de473c09c572140d7f7ab9db2a4eb453c47aeee0a5124e2f18b4312d67c2670bbc244b4bc26
storybook: ^8.6.8
checksum: f64234cac8402cb15e441922c4cd756cd81264f1051d7d31d5d6209169d7adc34296b88f2e3bcd8b416837686ad5b69ed023c53984cb22fdc18533ffdca1205d
languageName: node
linkType: hard
"@storybook/core@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/core@npm:8.6.7"
"@storybook/core@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/core@npm:8.6.8"
dependencies:
"@storybook/theming": 8.6.7
"@storybook/theming": 8.6.8
better-opn: ^3.0.2
browser-assert: ^1.2.1
esbuild: ^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0
@@ -17604,18 +17603,18 @@ __metadata:
peerDependenciesMeta:
prettier:
optional: true
checksum: b150b7472766fccbbc1dec74cba3c16e009a9f24c13f01198923f553d12e2a2070ee2a35f5514f9af350b79e34577946ea65a4a495fd1fa18a27655f897c013a
checksum: d67dea27c021b51f17a0d5807b72a29ea174bb8c945fb41092fbf3698002810da0a510aa7e0e23e1682634362f9b52590ba1a09ef6dd40a2ad5653988b0b0e14
languageName: node
linkType: hard
"@storybook/csf-plugin@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/csf-plugin@npm:8.6.7"
"@storybook/csf-plugin@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/csf-plugin@npm:8.6.8"
dependencies:
unplugin: ^1.3.1
peerDependencies:
storybook: ^8.6.7
checksum: 75c799fd222552f447e24c852b696bc00f1399a631c6a29e4da1b0be97600aa6085f0ebb56beb8c22731b6099fdddaf52edf01c0d0803ba8e22dd04f79bf483a
storybook: ^8.6.8
checksum: 17dece5267ae2bfb735ccb26485722bb16dbb2c53aea18c94aa6f532a5b848b2a2558678b6ccad3dbfabbf596aa45d543aea3a1967afa1e97c244f8603d86ec9
languageName: node
linkType: hard
@@ -17636,33 +17635,33 @@ __metadata:
linkType: hard
"@storybook/icons@npm:^1.2.12":
version: 1.2.12
resolution: "@storybook/icons@npm:1.2.12"
version: 1.4.0
resolution: "@storybook/icons@npm:1.4.0"
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
checksum: a4c87cbfadfa1369680c4acc9d5ef90b9ff23e2ad603b6c0aba0dafe89780e5643c567160eb0544fe33f3b9f157adda2621ae45b4036ac001139a34926e00102
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
checksum: a1e41fa9539629cb22a985dac695ac396afc5eb6ded7ce81497499a737ebf7556521acc569dbc0454e0b231ae50e8a5afbeee246dfbf8dc06a16a9cc1caa5bc8
languageName: node
linkType: hard
"@storybook/instrumenter@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/instrumenter@npm:8.6.7"
"@storybook/instrumenter@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/instrumenter@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
"@vitest/utils": ^2.1.1
peerDependencies:
storybook: ^8.6.7
checksum: 8b5bbdd73637233ddebf6d3f14d3904c6f122f29f2efe4a0172a1f03e066a88a3453ae3eef140b227eb626ee959c0c3522f62944407f4530e24e6a6ac804598b
storybook: ^8.6.8
checksum: 111508d96d3cacb04388a58a7977b2766616348a33f0d461f53786a73286e58e73dde637d26f6395f0841d323da30b4985707a801d43236394c8303c847351db
languageName: node
linkType: hard
"@storybook/manager-api@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/manager-api@npm:8.6.7"
"@storybook/manager-api@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/manager-api@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 6bb0860c3795945189832613da5866e5159b2adb376478a2b596c113928c64f5962efc325f927a6bcb7a48d7257f42cf6489b0c44397876129626ac68c44aa28
checksum: ee575781572898fc2fa734750ccb4bad09fc021bd0878ca9a05d9668cb336610d53e8110f4ff3c2c180573a64e9caba8f50f59d0bd3f0398a5c98e2eafdd91ae
languageName: node
linkType: hard
@@ -17675,12 +17674,12 @@ __metadata:
languageName: node
linkType: hard
"@storybook/preset-react-webpack@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/preset-react-webpack@npm:8.6.7"
"@storybook/preset-react-webpack@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/preset-react-webpack@npm:8.6.8"
dependencies:
"@storybook/core-webpack": 8.6.7
"@storybook/react": 8.6.7
"@storybook/core-webpack": 8.6.8
"@storybook/react": 8.6.8
"@storybook/react-docgen-typescript-plugin": 1.0.6--canary.9.0c3f3b7.0
"@types/semver": ^7.3.4
find-up: ^5.0.0
@@ -17693,20 +17692,20 @@ __metadata:
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
storybook: ^8.6.8
peerDependenciesMeta:
typescript:
optional: true
checksum: b40194dd66538104ace7abe96fa5100caa795bb562faf1612fb0769f54fc19303ad4914953c99be7298383989a4b1844db086e22df0ff458a9cd7409f36cd998
checksum: 019aceb0ba0b79779839a3719ab37a130d951e644dad574310e76ac67ccfc41ee53b118209726a7c851ad40965054b1e1f24b1481a02f4dc9bf65d2b537d6117
languageName: node
linkType: hard
"@storybook/preview-api@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/preview-api@npm:8.6.7"
"@storybook/preview-api@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/preview-api@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 0d24d62444b7b153bde89d3949ab6539a163e15bc80c5bfcc73b7d49bbb34fb02eb74a99434793b8a6446aeec491e07f006c0f4e404f98486c6d1d614d01defa
checksum: ac923a342d09c9e51f67734acaea19a41dc87cfc6cb22aea262591396d41cd4b69896417b618c55f17a9d64660b659813475c30d338c9bb6aa45391cfe8328f0
languageName: node
linkType: hard
@@ -17728,84 +17727,84 @@ __metadata:
languageName: node
linkType: hard
"@storybook/react-dom-shim@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/react-dom-shim@npm:8.6.7"
"@storybook/react-dom-shim@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/react-dom-shim@npm:8.6.8"
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
checksum: 51c20259ac4485d9a996266341a4d9898c949049e2a9af9a08bec58c2ace3a40be1a534005c52fc2db2c81bb010dbd36030bb70581b36c05cf4b34d58f140d3a
storybook: ^8.6.8
checksum: d48ba28fefe0bbe0bde02de6a99629d84ba9436fb539ffc6d779173f7b8f6ec466e26018e943d95fa079d73ace2d96d5911def0221754262782e8a5e8b20882d
languageName: node
linkType: hard
"@storybook/react-webpack5@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/react-webpack5@npm:8.6.7"
"@storybook/react-webpack5@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/react-webpack5@npm:8.6.8"
dependencies:
"@storybook/builder-webpack5": 8.6.7
"@storybook/preset-react-webpack": 8.6.7
"@storybook/react": 8.6.7
"@storybook/builder-webpack5": 8.6.8
"@storybook/preset-react-webpack": 8.6.8
"@storybook/react": 8.6.8
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
storybook: ^8.6.8
typescript: ">= 4.2.x"
peerDependenciesMeta:
typescript:
optional: true
checksum: b741566e5b17c66c3993fcd7550d193aef7f00205328e8dd03561b1cb12f7ad963e493e3db3146b93fffdf67ab17a960fe94ce0c15926b9dfe769340d0606c71
checksum: 49c60b8005e44c623f3a2d18694770ab72cb6fd2e51611592d287971f51f4218de2f228c677debda6aba5c6d97d71510e2ca303eaa2d3b67069262198ab17271
languageName: node
linkType: hard
"@storybook/react@npm:8.6.7, @storybook/react@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/react@npm:8.6.7"
"@storybook/react@npm:8.6.8, @storybook/react@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/react@npm:8.6.8"
dependencies:
"@storybook/components": 8.6.7
"@storybook/components": 8.6.8
"@storybook/global": ^5.0.0
"@storybook/manager-api": 8.6.7
"@storybook/preview-api": 8.6.7
"@storybook/react-dom-shim": 8.6.7
"@storybook/theming": 8.6.7
"@storybook/manager-api": 8.6.8
"@storybook/preview-api": 8.6.8
"@storybook/react-dom-shim": 8.6.8
"@storybook/theming": 8.6.8
peerDependencies:
"@storybook/test": 8.6.7
"@storybook/test": 8.6.8
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta
storybook: ^8.6.7
storybook: ^8.6.8
typescript: ">= 4.2.x"
peerDependenciesMeta:
"@storybook/test":
optional: true
typescript:
optional: true
checksum: c98438ddfd764300e1a805623fab976f9ef94a2d939984d6caf98ce92ed29d8a7307389b98e2df2d1302b302dc549c7c95050464731d9c588347cd154c360834
checksum: ebbfb2bed68d4ca8c8777769e5b752b1becf9cc1c3fd6f051df9a8eb012d209526b9e188812f3bf8ecf337a331c5049afa2236d2b073fbcafafd35e79cc3ed78
languageName: node
linkType: hard
"@storybook/test@npm:8.6.7, @storybook/test@npm:^8.6.4":
version: 8.6.7
resolution: "@storybook/test@npm:8.6.7"
"@storybook/test@npm:8.6.8, @storybook/test@npm:^8.6.8":
version: 8.6.8
resolution: "@storybook/test@npm:8.6.8"
dependencies:
"@storybook/global": ^5.0.0
"@storybook/instrumenter": 8.6.7
"@storybook/instrumenter": 8.6.8
"@testing-library/dom": 10.4.0
"@testing-library/jest-dom": 6.5.0
"@testing-library/user-event": 14.5.2
"@vitest/expect": 2.0.5
"@vitest/spy": 2.0.5
peerDependencies:
storybook: ^8.6.7
checksum: d269423580cbcc61de74a3940504f00bb580b389b04432aa6a0a7e8fed54536782ef254e8edcf6bac3ce98d35e439fdfd86316cf53f3435396f12cbc2e060541
storybook: ^8.6.8
checksum: 7787760fe34cc004a556dbdc6bf6ed8f64970c16d1afb985dc57ca269cffea2203538d3756440108cc4acd8430325162d5481d90e8835787ae9ac1bf55d2f387
languageName: node
linkType: hard
"@storybook/theming@npm:8.6.7":
version: 8.6.7
resolution: "@storybook/theming@npm:8.6.7"
"@storybook/theming@npm:8.6.8":
version: 8.6.8
resolution: "@storybook/theming@npm:8.6.8"
peerDependencies:
storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0
checksum: 747a2377df65d5f0962dc8606d06247ad89fb7ecabab0bd9611055d599b5bd0fa15769e4c76e948ae34ae232ba756bf6795ccb3467b1adf35ff961db7350f4de
checksum: 1be0dea23178af562133f1047165e170f7e90bec4c3cedbdcb59df22685f314273a06a4677835ab84e6dbc682b803590adad6963217971c8136b076ce69800aa
languageName: node
linkType: hard
@@ -18820,7 +18819,7 @@ __metadata:
languageName: node
linkType: hard
"@testing-library/user-event@npm:14.5.2, @testing-library/user-event@npm:^14.0.0":
"@testing-library/user-event@npm:14.5.2":
version: 14.5.2
resolution: "@testing-library/user-event@npm:14.5.2"
peerDependencies:
@@ -18829,6 +18828,15 @@ __metadata:
languageName: node
linkType: hard
"@testing-library/user-event@npm:^14.0.0":
version: 14.6.1
resolution: "@testing-library/user-event@npm:14.6.1"
peerDependencies:
"@testing-library/dom": ">=7.21.4"
checksum: 4cb8a81fea1fea83a42619e9545137b51636bb7a3182c596bb468e5664f1e4699a275c2d0fb8b6dcc3fe2684f9d87b0637ab7cb4f566051539146872c9141fcb
languageName: node
linkType: hard
"@tokenizer/token@npm:^0.3.0":
version: 0.3.0
resolution: "@tokenizer/token@npm:0.3.0"
@@ -21300,14 +21308,14 @@ __metadata:
linkType: hard
"@vitest/expect@npm:>1.6.0":
version: 2.1.3
resolution: "@vitest/expect@npm:2.1.3"
version: 3.0.9
resolution: "@vitest/expect@npm:3.0.9"
dependencies:
"@vitest/spy": 2.1.3
"@vitest/utils": 2.1.3
chai: ^5.1.1
tinyrainbow: ^1.2.0
checksum: c0651cb19d50733169bbc0477ea84d063272200de73bcaf0b13436000c1c5b334589d9dbe2d4245619b3c283e9b477ae24f49117a40eb6eb83adc79f18fe2f63
"@vitest/spy": 3.0.9
"@vitest/utils": 3.0.9
chai: ^5.2.0
tinyrainbow: ^2.0.0
checksum: 6df325d45e0ad4b6ad73a55e5328f615f92171fc4dbf3875972c08013727cfa435b9916636c7f3902a45f1874db10805d449311b70125edf1422dceb325ac982
languageName: node
linkType: hard
@@ -21320,21 +21328,21 @@ __metadata:
languageName: node
linkType: hard
"@vitest/pretty-format@npm:2.1.3":
version: 2.1.3
resolution: "@vitest/pretty-format@npm:2.1.3"
"@vitest/pretty-format@npm:2.1.9":
version: 2.1.9
resolution: "@vitest/pretty-format@npm:2.1.9"
dependencies:
tinyrainbow: ^1.2.0
checksum: ff4aa144a49c0ee579bfae940745b70a0ca3c504f52c23f1e8f5c0642824785232f844040d31b48eea71b5a80519809810359a75d29186ab40341174c50a4a0d
checksum: 33f7ff0a9d356ddd6534390a0aea260dc04a3022a94901c87d141bacf71d2b3fff2e3bf08a55dd424c5355fd3b41656cb7871c76372fef45ffac1ea89d0dc508
languageName: node
linkType: hard
"@vitest/pretty-format@npm:2.1.6":
version: 2.1.6
resolution: "@vitest/pretty-format@npm:2.1.6"
"@vitest/pretty-format@npm:3.0.9":
version: 3.0.9
resolution: "@vitest/pretty-format@npm:3.0.9"
dependencies:
tinyrainbow: ^1.2.0
checksum: 4cab9152ac97fa190db85bbe7e1ae8f1b5d2312fa3ccf7e813119933b2aaf4c763c6156a6d91cb186d3ed4be81f5bb70da2c731fde2d12457fe0871087d2be74
tinyrainbow: ^2.0.0
checksum: 447b53bd962bc5978cf3e8c67f0600e38470ea63ab6ae24fb048dca79305828f37d9d854a7db1abc97ebde66a65187f87a99ca7969e43c750998c944e3ec48c6
languageName: node
linkType: hard
@@ -21347,12 +21355,12 @@ __metadata:
languageName: node
linkType: hard
"@vitest/spy@npm:2.1.3":
version: 2.1.3
resolution: "@vitest/spy@npm:2.1.3"
"@vitest/spy@npm:3.0.9":
version: 3.0.9
resolution: "@vitest/spy@npm:3.0.9"
dependencies:
tinyspy: ^3.0.0
checksum: b04aad8e458087202b7a16d332365a142be055db8c4653d916ebb8d47eacf23c3edef23b3918490eed9f8cb69da240d72844c3570f38521fbe7e0647e01d0271
tinyspy: ^3.0.2
checksum: 1b90f40c4ac34529e7d098c745396a51e9b2f187d31d50a664ac7374db56edb3792862a35d1b8049e421705db6445761d687f9f8c5e298a9ca6cfa47d55625d7
languageName: node
linkType: hard
@@ -21368,25 +21376,25 @@ __metadata:
languageName: node
linkType: hard
"@vitest/utils@npm:2.1.3":
version: 2.1.3
resolution: "@vitest/utils@npm:2.1.3"
"@vitest/utils@npm:3.0.9":
version: 3.0.9
resolution: "@vitest/utils@npm:3.0.9"
dependencies:
"@vitest/pretty-format": 2.1.3
loupe: ^3.1.1
tinyrainbow: ^1.2.0
checksum: 0c1e262600bc329fab43bb19d575326a6d38175c2bdc345bc5326b81cf34303f22a1b67a0197dc6a935c3019e2f21c4da52a49c609967bea9cb4790a44a347ce
"@vitest/pretty-format": 3.0.9
loupe: ^3.1.3
tinyrainbow: ^2.0.0
checksum: d31797594598817670cc49dfcd4ded2953d707c62e5dc7807737e8108073e97499cf7ef2eb3295f1fb52446a8a85ba50aacef21126689251092bc8566bff4bb6
languageName: node
linkType: hard
"@vitest/utils@npm:^2.1.1":
version: 2.1.6
resolution: "@vitest/utils@npm:2.1.6"
version: 2.1.9
resolution: "@vitest/utils@npm:2.1.9"
dependencies:
"@vitest/pretty-format": 2.1.6
"@vitest/pretty-format": 2.1.9
loupe: ^3.1.2
tinyrainbow: ^1.2.0
checksum: 8b9c994eccb724d76128e875e8438d519bfae0126e7431e8682e7f07d9faeff929db1afa2742b188883e42508d4cdcb2326f9ae27c1b53b5f746d283a9e75462
checksum: b24fb9c6765801f2e0578ad5c32fadf9541a833301eaed2877a427096cf05214244b361f94eda80be2b9c841f58ae3c67d37dedc5a902b2cb44041979bae4d8f
languageName: node
linkType: hard
@@ -24450,16 +24458,16 @@ __metadata:
languageName: node
linkType: hard
"chai@npm:^5.1.1":
version: 5.1.1
resolution: "chai@npm:5.1.1"
"chai@npm:^5.1.1, chai@npm:^5.2.0":
version: 5.2.0
resolution: "chai@npm:5.2.0"
dependencies:
assertion-error: ^2.0.1
check-error: ^2.1.1
deep-eql: ^5.0.1
loupe: ^3.1.0
pathval: ^2.0.0
checksum: 1e0a5e1b5febdfa8ceb97b9aff608286861ecb86533863119b2f39f07c08fb59f3c1791ab554947f009b9d71d509b9e4e734fb12133cb81f231c2c2ee7c1e738
checksum: 15e4ba12d02df3620fd59b4a6e8efe43b47872ce61f1c0ca77ac1205a2a5898f3b6f1f52408fd1a708b8d07fdfb5e65b97af40bad9fd94a69ed8d4264c7a69f1
languageName: node
linkType: hard
@@ -25384,24 +25392,6 @@ __metadata:
languageName: node
linkType: hard
"concurrently@npm:^9.1.2":
version: 9.1.2
resolution: "concurrently@npm:9.1.2"
dependencies:
chalk: ^4.1.2
lodash: ^4.17.21
rxjs: ^7.8.1
shell-quote: ^1.8.1
supports-color: ^8.1.1
tree-kill: ^1.2.2
yargs: ^17.7.2
bin:
conc: dist/bin/concurrently.js
concurrently: dist/bin/concurrently.js
checksum: 9e25e8ee6272ada26739aff1fb43e96ac458fafca82f45b8360bdd9115d60bbc679d282dfc52001b861b6e9f32b3063aed975691d8dec9e62807a9679763a1d8
languageName: node
linkType: hard
"conf@npm:^10.2.0":
version: 10.2.0
resolution: "conf@npm:10.2.0"
@@ -28264,16 +28254,15 @@ __metadata:
linkType: hard
"eslint-plugin-storybook@npm:^0.11.4":
version: 0.11.4
resolution: "eslint-plugin-storybook@npm:0.11.4"
version: 0.11.6
resolution: "eslint-plugin-storybook@npm:0.11.6"
dependencies:
"@storybook/csf": ^0.1.11
"@typescript-eslint/utils": ^8.8.1
ts-dedent: ^2.2.0
peerDependencies:
eslint: ">=8"
typescript: ">=4.8.4 <5.8.0"
checksum: c3909478f32862a4d2687af240f91df9190e6c23e7618fee366dd8e7c1fa7f31c1c8bf9d49c8b4c01bd0f7857f5f85ccdfd6897d56bde353da3192652a2e9ded
checksum: 0dbc32176a729761c2f77187f6a3f7a5560727dd746f5b425aa0b8c35d0f4e979e0a3e86e0d647425343ba33616455abe5a72f30757d89ce85049a39d6062b4f
languageName: node
linkType: hard
@@ -35260,10 +35249,10 @@ __metadata:
languageName: node
linkType: hard
"loupe@npm:^3.1.0, loupe@npm:^3.1.1, loupe@npm:^3.1.2":
version: 3.1.2
resolution: "loupe@npm:3.1.2"
checksum: 4a75bbe8877a1ced3603e08b1095cd6f4c987c50fe63719fdc3009029560f91e07a915e7f6eff1322bb62bfb2a2beeef06b13ccb3c12f81bda9f3674434dcab9
"loupe@npm:^3.1.0, loupe@npm:^3.1.1, loupe@npm:^3.1.2, loupe@npm:^3.1.3":
version: 3.1.3
resolution: "loupe@npm:3.1.3"
checksum: 9b2530b1d5a44d2c9fc5241f97ea00296dca257173c535b4832bc31f9516e10387991feb5b3fff23df116c8fcf907ce3980f82b215dcc5d19cde17ce9b9ec3e1
languageName: node
linkType: hard
@@ -42602,7 +42591,7 @@ __metadata:
languageName: node
linkType: hard
"rxjs@npm:^7.2.0, rxjs@npm:^7.5.5, rxjs@npm:^7.8.1":
"rxjs@npm:^7.2.0, rxjs@npm:^7.5.5":
version: 7.8.2
resolution: "rxjs@npm:7.8.2"
dependencies:
@@ -43892,11 +43881,11 @@ __metadata:
languageName: node
linkType: hard
"storybook@npm:^8.6.4":
version: 8.6.7
resolution: "storybook@npm:8.6.7"
"storybook@npm:^8.6.8":
version: 8.6.8
resolution: "storybook@npm:8.6.8"
dependencies:
"@storybook/core": 8.6.7
"@storybook/core": 8.6.8
peerDependencies:
prettier: ^2 || ^3
peerDependenciesMeta:
@@ -43906,7 +43895,7 @@ __metadata:
getstorybook: ./bin/index.cjs
sb: ./bin/index.cjs
storybook: ./bin/index.cjs
checksum: fe21ce4d9cd17069a5b409ed518603f97ec6ec421b7f41cff3e43b409820fcbc2c8dbcb3aed99dd7d0a99a0c6138c7576ddf72f78186b6f86085d503b3c8b32f
checksum: 93b92e53c00ff29b4864932c26c52dd4a45e76b3d46811a2bcdc0271ef37c96e2f8d1833982569ab6a6348d6e84d8348aecf74ee72164744459de4c78d0f6759
languageName: node
linkType: hard
@@ -45103,7 +45092,14 @@ __metadata:
languageName: node
linkType: hard
"tinyspy@npm:^3.0.0":
"tinyrainbow@npm:^2.0.0":
version: 2.0.0
resolution: "tinyrainbow@npm:2.0.0"
checksum: 26360631d97e43955a07cfb70fe40a154ce4e2bcd14fa3d37ce8e2ed8f4fa9e5ba00783e4906bbfefe6dcabef5d3510f5bee207cb693bee4e4e7553f5454bef1
languageName: node
linkType: hard
"tinyspy@npm:^3.0.0, tinyspy@npm:^3.0.2":
version: 3.0.2
resolution: "tinyspy@npm:3.0.2"
checksum: 5db671b2ff5cd309de650c8c4761ca945459d7204afb1776db9a04fb4efa28a75f08517a8620c01ee32a577748802231ad92f7d5b194dc003ee7f987a2a06337