@uva-glass/component-library 1.47.1 → 1.47.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Backdrop/Backdrop.stories.js +8 -5
- package/dist/components/Backdrop/Backdrop.stories.js.map +1 -1
- package/dist/components/Button/Button.stories.js +15 -12
- package/dist/components/Button/Button.stories.js.map +1 -1
- package/dist/components/Card/Card.stories.js +21 -18
- package/dist/components/Card/Card.stories.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.stories.js +14 -11
- package/dist/components/Checkbox/Checkbox.stories.js.map +1 -1
- package/dist/components/FieldHint/FieldHint.stories.js +15 -12
- package/dist/components/FieldHint/FieldHint.stories.js.map +1 -1
- package/dist/components/Fieldset/Fieldset.stories.js +15 -12
- package/dist/components/Fieldset/Fieldset.stories.js.map +1 -1
- package/dist/components/FormField/FormField.stories.js +21 -18
- package/dist/components/FormField/FormField.stories.js.map +1 -1
- package/dist/components/HorizontalList/HorizontalList.stories.js +11 -8
- package/dist/components/HorizontalList/HorizontalList.stories.js.map +1 -1
- package/dist/components/Icon/Icon.stories.js +19 -16
- package/dist/components/Icon/Icon.stories.js.map +1 -1
- package/dist/components/IconButton/IconButton.stories.js +18 -13
- package/dist/components/IconButton/IconButton.stories.js.map +1 -1
- package/package.json +5 -5
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { Backdrop as
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { Backdrop as o } from "./Backdrop.js";
|
|
3
3
|
import { Container as i } from "../storyComponents/Container/Container.js";
|
|
4
|
-
import '../../assets/Backdrop2.css';const s = {
|
|
4
|
+
import '../../assets/Backdrop2.css';const t = "<Backdrop>{children}</Backdrop>", s = {
|
|
5
5
|
title: "Atoms/Backdrop",
|
|
6
|
-
component:
|
|
6
|
+
component: o,
|
|
7
7
|
argTypes: {
|
|
8
8
|
children: {
|
|
9
9
|
control: "text"
|
|
@@ -12,8 +12,11 @@ import '../../assets/Backdrop2.css';const s = {
|
|
|
12
12
|
control: "boolean",
|
|
13
13
|
name: "Show Backdrop"
|
|
14
14
|
}
|
|
15
|
+
},
|
|
16
|
+
parameters: {
|
|
17
|
+
codeString: t
|
|
15
18
|
}
|
|
16
|
-
},
|
|
19
|
+
}, c = (e) => /* @__PURE__ */ r(i, { visible: e.visible, children: /* @__PURE__ */ r(o, { children: /* @__PURE__ */ r("div", { className: "container", children: e.children }) }) }), n = c.bind({});
|
|
17
20
|
n.args = {
|
|
18
21
|
visible: !0,
|
|
19
22
|
children: "Dummy Overlay"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Backdrop.stories.js","sources":["../../../src/components/Backdrop/Backdrop.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { BackdropProps } from './Backdrop';\n\nimport { Backdrop } from './Backdrop';\n\nimport { Container } from 'components/storyComponents/Container';\n\nimport './Backdrop.stories.css';\n\ntype BackdropStoryProps = BackdropProps & { visible: boolean };\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Backdrop',\n component: Backdrop,\n argTypes: {\n children: {\n control: 'text',\n },\n visible: {\n control: 'boolean',\n name: 'Show Backdrop',\n },\n },\n} as Meta<BackdropStoryProps>;\n\nconst Template: StoryFn<BackdropStoryProps> = (args) => {\n return (\n <Container visible={args.visible}>\n <Backdrop>\n <div className=\"container\">{args.children}</div>\n </Backdrop>\n </Container>\n );\n};\n\nexport const BackdropExample = Template.bind({});\nBackdropExample.args = {\n visible: true,\n children: 'Dummy Overlay',\n};\n"],"names":["Backdrop_stories","Backdrop","Template","args","jsx","Container","BackdropExample"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Backdrop.stories.js","sources":["../../../src/components/Backdrop/Backdrop.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { BackdropProps } from './Backdrop';\n\nimport { Backdrop } from './Backdrop';\n\nimport { Container } from 'components/storyComponents/Container';\n\nimport './Backdrop.stories.css';\n\ntype BackdropStoryProps = BackdropProps & { visible: boolean };\n\nconst codeString = '<Backdrop>{children}</Backdrop>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Backdrop',\n component: Backdrop,\n argTypes: {\n children: {\n control: 'text',\n },\n visible: {\n control: 'boolean',\n name: 'Show Backdrop',\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<BackdropStoryProps>;\n\nconst Template: StoryFn<BackdropStoryProps> = (args) => {\n return (\n <Container visible={args.visible}>\n <Backdrop>\n <div className=\"container\">{args.children}</div>\n </Backdrop>\n </Container>\n );\n};\n\nexport const BackdropExample = Template.bind({});\nBackdropExample.args = {\n visible: true,\n children: 'Dummy Overlay',\n};\n"],"names":["codeString","Backdrop_stories","Backdrop","Template","args","jsx","Container","BackdropExample"],"mappings":";;;AAWA,MAAMA,IAAa,mCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,UAAU;AAAA,MACR,SAAS;AAAA,IACX;AAAA,IACA,SAAS;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAwC,CAACC,MAE1C,gBAAAC,EAAAC,GAAA,EAAU,SAASF,EAAK,SACvB,UAAC,gBAAAC,EAAAH,GAAA,EACC,UAAC,gBAAAG,EAAA,OAAA,EAAI,WAAU,aAAa,UAAKD,EAAA,SAAS,CAAA,GAC5C,EACF,CAAA,GAISG,IAAkBJ,EAAS,KAAK,EAAE;AAC/CI,EAAgB,OAAO;AAAA,EACrB,SAAS;AAAA,EACT,UAAU;AACZ;"}
|
|
@@ -1,29 +1,32 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as a, Fragment as s, jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { f as l } from "../../index-C7tAT8j7.js";
|
|
3
|
-
import { Button as
|
|
4
|
-
const
|
|
3
|
+
import { Button as n } from "./Button.js";
|
|
4
|
+
const d = "<Button variant={variant} onClick={onClictFunction}>{children}</Button>", h = {
|
|
5
5
|
title: "Atoms/Button",
|
|
6
|
-
component:
|
|
6
|
+
component: n,
|
|
7
7
|
argTypes: {
|
|
8
8
|
variant: {
|
|
9
9
|
options: ["primary", "secondary", "destructive-primary", "destructive-secondary", "blank"],
|
|
10
10
|
control: { type: "radio" }
|
|
11
11
|
}
|
|
12
|
+
},
|
|
13
|
+
parameters: {
|
|
14
|
+
codeString: d
|
|
12
15
|
}
|
|
13
|
-
}, i = (
|
|
16
|
+
}, i = (o) => /* @__PURE__ */ t(n, { ...o }), e = {
|
|
14
17
|
variant: "primary",
|
|
15
18
|
disabled: !1,
|
|
16
19
|
displayColumn: !1,
|
|
17
20
|
onClick: l()
|
|
18
|
-
},
|
|
19
|
-
|
|
21
|
+
}, c = i.bind({});
|
|
22
|
+
c.args = {
|
|
20
23
|
children: "Click me!",
|
|
21
|
-
...
|
|
24
|
+
...e
|
|
22
25
|
};
|
|
23
26
|
const r = i.bind({});
|
|
24
27
|
r.args = {
|
|
25
|
-
...
|
|
26
|
-
children: /* @__PURE__ */
|
|
28
|
+
...e,
|
|
29
|
+
children: /* @__PURE__ */ a(s, { children: [
|
|
27
30
|
/* @__PURE__ */ t("div", { children: "Child 1" }),
|
|
28
31
|
/* @__PURE__ */ t("div", { children: "Child 2" })
|
|
29
32
|
] })
|
|
@@ -38,8 +41,8 @@ r.argTypes = {
|
|
|
38
41
|
}
|
|
39
42
|
};
|
|
40
43
|
export {
|
|
41
|
-
|
|
44
|
+
c as ButtonExample,
|
|
42
45
|
r as WithMultipleChildren,
|
|
43
|
-
|
|
46
|
+
h as default
|
|
44
47
|
};
|
|
45
48
|
//# sourceMappingURL=Button.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.js","sources":["../../../src/components/Button/Button.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ButtonProps } from './Button';\n\nimport { Button } from './Button';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Button',\n component: Button,\n argTypes: {\n variant: {\n options: ['primary', 'secondary', 'destructive-primary', 'destructive-secondary', 'blank'],\n control: { type: 'radio' },\n },\n },\n} as Meta<ButtonProps>;\n\nconst Template: StoryFn<ButtonProps> = (args) => <Button {...args} />;\n\nconst defaultArgs: Partial<ButtonProps> = {\n variant: 'primary',\n disabled: false,\n displayColumn: false,\n onClick: fn(),\n};\n\nexport const ButtonExample = Template.bind({});\nButtonExample.args = {\n children: 'Click me!',\n ...defaultArgs,\n};\n\nexport const WithMultipleChildren = Template.bind({});\nWithMultipleChildren.args = {\n ...defaultArgs,\n children: (\n <>\n <div>Child 1</div>\n <div>Child 2</div>\n </>\n ),\n};\nWithMultipleChildren.argTypes = {\n ...WithMultipleChildren.argTypes,\n children: {\n table: {\n disable: true, // Disable children controls for this specific story\n },\n },\n};\n"],"names":["Button_stories","Button","Template","args","jsx","defaultArgs","fn","ButtonExample","WithMultipleChildren","jsxs","Fragment"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Button.stories.js","sources":["../../../src/components/Button/Button.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { ButtonProps } from './Button';\n\nimport { Button } from './Button';\n\nconst codeString = '<Button variant={variant} onClick={onClictFunction}>{children}</Button>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Button',\n component: Button,\n argTypes: {\n variant: {\n options: ['primary', 'secondary', 'destructive-primary', 'destructive-secondary', 'blank'],\n control: { type: 'radio' },\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<ButtonProps>;\n\nconst Template: StoryFn<ButtonProps> = (args) => <Button {...args} />;\n\nconst defaultArgs: Partial<ButtonProps> = {\n variant: 'primary',\n disabled: false,\n displayColumn: false,\n onClick: fn(),\n};\n\nexport const ButtonExample = Template.bind({});\nButtonExample.args = {\n children: 'Click me!',\n ...defaultArgs,\n};\n\nexport const WithMultipleChildren = Template.bind({});\nWithMultipleChildren.args = {\n ...defaultArgs,\n children: (\n <>\n <div>Child 1</div>\n <div>Child 2</div>\n </>\n ),\n};\nWithMultipleChildren.argTypes = {\n ...WithMultipleChildren.argTypes,\n children: {\n table: {\n disable: true, // Disable children controls for this specific story\n },\n },\n};\n"],"names":["codeString","Button_stories","Button","Template","args","jsx","defaultArgs","fn","ButtonExample","WithMultipleChildren","jsxs","Fragment"],"mappings":";;;AAOA,MAAMA,IAAa,2EAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,WAAW,aAAa,uBAAuB,yBAAyB,OAAO;AAAA,MACzF,SAAS,EAAE,MAAM,QAAQ;AAAA,IAC3B;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAiC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAQ,GAAGE,EAAM,CAAA,GAE7DE,IAAoC;AAAA,EACxC,SAAS;AAAA,EACT,UAAU;AAAA,EACV,eAAe;AAAA,EACf,SAASC,EAAG;AACd,GAEaC,IAAgBL,EAAS,KAAK,EAAE;AAC7CK,EAAc,OAAO;AAAA,EACnB,UAAU;AAAA,EACV,GAAGF;AACL;AAEO,MAAMG,IAAuBN,EAAS,KAAK,EAAE;AACpDM,EAAqB,OAAO;AAAA,EAC1B,GAAGH;AAAA,EACH,UAEI,gBAAAI,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAN,EAAC,SAAI,UAAO,UAAA,CAAA;AAAA,IACZ,gBAAAA,EAAC,SAAI,UAAO,UAAA,CAAA;AAAA,EAAA,GACd;AAEJ;AACAI,EAAqB,WAAW;AAAA,EAC9B,GAAGA,EAAqB;AAAA,EACxB,UAAU;AAAA,IACR,OAAO;AAAA,MACL,SAAS;AAAA;AAAA,IACX;AAAA,EACF;AACF;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { Card as
|
|
3
|
-
const
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { Card as t } from "./Card.js";
|
|
3
|
+
const o = "<Card header={header}>{children}</Card>", d = {
|
|
4
4
|
title: "Atoms/Card",
|
|
5
|
-
component:
|
|
5
|
+
component: t,
|
|
6
6
|
argTypes: {
|
|
7
7
|
highContrast: {
|
|
8
8
|
controle: "boolean"
|
|
@@ -19,31 +19,34 @@ const c = {
|
|
|
19
19
|
children: {
|
|
20
20
|
control: "text"
|
|
21
21
|
}
|
|
22
|
+
},
|
|
23
|
+
parameters: {
|
|
24
|
+
codeString: o
|
|
22
25
|
}
|
|
23
|
-
}, e = (
|
|
26
|
+
}, e = (r) => /* @__PURE__ */ i(t, { ...r }), a = {
|
|
24
27
|
padding: "regular",
|
|
25
28
|
highContrast: !1,
|
|
26
29
|
alignCenter: !1,
|
|
27
30
|
header: "Example Header"
|
|
28
|
-
},
|
|
29
|
-
r.args = {
|
|
30
|
-
...t,
|
|
31
|
-
notification: ""
|
|
32
|
-
};
|
|
33
|
-
const n = e.bind({});
|
|
31
|
+
}, n = e.bind({});
|
|
34
32
|
n.args = {
|
|
35
|
-
...
|
|
36
|
-
notification: "
|
|
33
|
+
...a,
|
|
34
|
+
notification: ""
|
|
37
35
|
};
|
|
38
36
|
const s = e.bind({});
|
|
39
37
|
s.args = {
|
|
40
|
-
...
|
|
38
|
+
...a,
|
|
39
|
+
notification: "This is an example notification"
|
|
40
|
+
};
|
|
41
|
+
const h = e.bind({});
|
|
42
|
+
h.args = {
|
|
43
|
+
...a,
|
|
41
44
|
children: "Chuck Norris is the reason why Waldo is hiding Remember the Soviet Union? They decided to quit after watching a DeltaForce marathon on Satellite TV, Chuck Norris CAN eat soup with a fork Morgan Freeman is the only person that could narrate Chuck Norris's life, other than himself, The quickest way to a man's heart is with Chuck Norris' fist. Chuck Norris ran in Nascar and came in 1st place. Then again, Chuck Norris wins everything."
|
|
42
45
|
};
|
|
43
46
|
export {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
47
|
+
n as CardExample,
|
|
48
|
+
h as WithChildren,
|
|
49
|
+
s as WithNotification,
|
|
50
|
+
d as default
|
|
48
51
|
};
|
|
49
52
|
//# sourceMappingURL=Card.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.stories.js","sources":["../../../src/components/Card/Card.stories.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CardProps } from './Card';\n\nimport { Card } from './Card';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Card',\n component: Card,\n argTypes: {\n highContrast: {\n controle: 'boolean',\n },\n padding: {\n controle: {\n type: 'select',\n options: ['small', 'regular', 'large'],\n },\n },\n alignCenter: {\n controle: 'boolean',\n },\n children: {\n control: 'text',\n },\n },\n} as Meta<PropsWithChildren<CardProps>>;\n\nconst Template: StoryFn<PropsWithChildren<CardProps>> = (args) => <Card {...args} />;\n\nconst defaultArgs: Partial<PropsWithChildren<CardProps>> = {\n padding: 'regular',\n highContrast: false,\n alignCenter: false,\n header: 'Example Header',\n};\n\nexport const CardExample = Template.bind({});\nCardExample.args = {\n ...defaultArgs,\n notification: '',\n};\n\nexport const WithNotification = Template.bind({});\nWithNotification.args = {\n ...defaultArgs,\n notification: 'This is an example notification',\n};\n\nexport const WithChildren = Template.bind({});\nWithChildren.args = {\n ...defaultArgs,\n children:\n \"Chuck Norris is the reason why Waldo is hiding Remember the Soviet Union? They decided to quit after watching a DeltaForce marathon on Satellite TV, Chuck Norris CAN eat soup with a fork Morgan Freeman is the only person that could narrate Chuck Norris's life, other than himself, The quickest way to a man's heart is with Chuck Norris' fist. Chuck Norris ran in Nascar and came in 1st place. Then again, Chuck Norris wins everything.\",\n};\n"],"names":["Card_stories","Card","Template","args","jsx","defaultArgs","CardExample","WithNotification","WithChildren"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"Card.stories.js","sources":["../../../src/components/Card/Card.stories.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CardProps } from './Card';\n\nimport { Card } from './Card';\n\nconst codeString = '<Card header={header}>{children}</Card>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Card',\n component: Card,\n argTypes: {\n highContrast: {\n controle: 'boolean',\n },\n padding: {\n controle: {\n type: 'select',\n options: ['small', 'regular', 'large'],\n },\n },\n alignCenter: {\n controle: 'boolean',\n },\n children: {\n control: 'text',\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<PropsWithChildren<CardProps>>;\n\nconst Template: StoryFn<PropsWithChildren<CardProps>> = (args) => <Card {...args} />;\n\nconst defaultArgs: Partial<PropsWithChildren<CardProps>> = {\n padding: 'regular',\n highContrast: false,\n alignCenter: false,\n header: 'Example Header',\n};\n\nexport const CardExample = Template.bind({});\nCardExample.args = {\n ...defaultArgs,\n notification: '',\n};\n\nexport const WithNotification = Template.bind({});\nWithNotification.args = {\n ...defaultArgs,\n notification: 'This is an example notification',\n};\n\nexport const WithChildren = Template.bind({});\nWithChildren.args = {\n ...defaultArgs,\n children:\n \"Chuck Norris is the reason why Waldo is hiding Remember the Soviet Union? They decided to quit after watching a DeltaForce marathon on Satellite TV, Chuck Norris CAN eat soup with a fork Morgan Freeman is the only person that could narrate Chuck Norris's life, other than himself, The quickest way to a man's heart is with Chuck Norris' fist. Chuck Norris ran in Nascar and came in 1st place. Then again, Chuck Norris wins everything.\",\n};\n"],"names":["codeString","Card_stories","Card","Template","args","jsx","defaultArgs","CardExample","WithNotification","WithChildren"],"mappings":";;AAMA,MAAMA,IAAa,2CAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,cAAc;AAAA,MACZ,UAAU;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP,UAAU;AAAA,QACR,MAAM;AAAA,QACN,SAAS,CAAC,SAAS,WAAW,OAAO;AAAA,MACvC;AAAA,IACF;AAAA,IACA,aAAa;AAAA,MACX,UAAU;AAAA,IACZ;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAkD,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAM,GAAGE,EAAM,CAAA,GAE5EE,IAAqD;AAAA,EACzD,SAAS;AAAA,EACT,cAAc;AAAA,EACd,aAAa;AAAA,EACb,QAAQ;AACV,GAEaC,IAAcJ,EAAS,KAAK,EAAE;AAC3CI,EAAY,OAAO;AAAA,EACjB,GAAGD;AAAA,EACH,cAAc;AAChB;AAEO,MAAME,IAAmBL,EAAS,KAAK,EAAE;AAChDK,EAAiB,OAAO;AAAA,EACtB,GAAGF;AAAA,EACH,cAAc;AAChB;AAEO,MAAMG,IAAeN,EAAS,KAAK,EAAE;AAC5CM,EAAa,OAAO;AAAA,EAClB,GAAGH;AAAA,EACH,UACE;AACJ;"}
|
|
@@ -3,17 +3,20 @@ import { f as e } from "../../index-C7tAT8j7.js";
|
|
|
3
3
|
import { Checkbox as l } from "./Checkbox.js";
|
|
4
4
|
import { FormField as t } from "../FormField/FormField.js";
|
|
5
5
|
import { Label as i } from "../Label/Label.js";
|
|
6
|
-
const
|
|
6
|
+
const r = "<Checkbox checked={checked} id={id} onChange={onChangeFunction} />", C = {
|
|
7
7
|
title: "Atoms/Checkbox",
|
|
8
|
-
component: l
|
|
9
|
-
|
|
8
|
+
component: l,
|
|
9
|
+
parameters: {
|
|
10
|
+
codeString: r
|
|
11
|
+
}
|
|
12
|
+
}, c = (n) => /* @__PURE__ */ g(t, { inline: !0, children: [
|
|
10
13
|
/* @__PURE__ */ o(l, { id: "72103b4d", ...n }),
|
|
11
14
|
/* @__PURE__ */ o(i, { htmlFor: "72103b4d", children: "Example Checkbox" })
|
|
12
|
-
] }),
|
|
13
|
-
|
|
15
|
+
] }), a = c.bind({});
|
|
16
|
+
a.args = {
|
|
14
17
|
onChange: e()
|
|
15
18
|
};
|
|
16
|
-
const
|
|
19
|
+
const h = (n) => /* @__PURE__ */ g(t, { inline: !0, children: [
|
|
17
20
|
/* @__PURE__ */ o(
|
|
18
21
|
"div",
|
|
19
22
|
{
|
|
@@ -25,13 +28,13 @@ const a = (n) => /* @__PURE__ */ g(t, { inline: !0, children: [
|
|
|
25
28
|
}
|
|
26
29
|
),
|
|
27
30
|
/* @__PURE__ */ o(i, { htmlFor: "72103b4e", children: "Example Checkbox with long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long long label" })
|
|
28
|
-
] }),
|
|
29
|
-
|
|
31
|
+
] }), m = h.bind({});
|
|
32
|
+
m.args = {
|
|
30
33
|
onChange: e()
|
|
31
34
|
};
|
|
32
35
|
export {
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
+
a as CheckboxExample,
|
|
37
|
+
m as WithLongLabel,
|
|
38
|
+
C as default
|
|
36
39
|
};
|
|
37
40
|
//# sourceMappingURL=Checkbox.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.stories.js","sources":["../../../src/components/Checkbox/Checkbox.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CheckboxProps } from './Checkbox';\n\nimport { Checkbox } from './Checkbox';\n\nimport { FormField } from 'components/FormField';\nimport { Label } from 'components/Label';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Checkbox',\n component: Checkbox,\n} as Meta<CheckboxProps>;\n\nconst Template: StoryFn<CheckboxProps> = (args) => (\n <FormField inline>\n <Checkbox id=\"72103b4d\" {...args} />\n <Label htmlFor=\"72103b4d\">Example Checkbox</Label>\n </FormField>\n);\n\nexport const CheckboxExample = Template.bind({});\nCheckboxExample.args = {\n onChange: fn(),\n};\n\n// Extra story created for UX to see how we can solve placement of checkbox when paired with long content\n// TODO: should this component be refactored to always include a label? (see RadioButton)\nconst WithLongLabelTemplate: StoryFn<CheckboxProps> = (args) => (\n <FormField inline>\n <div\n style={{\n alignSelf: 'flex-start',\n marginTop: '0.18rem',\n }}\n >\n <Checkbox id=\"72103b4e\" {...args} />\n </div>\n <Label htmlFor=\"72103b4e\">\n Example Checkbox with long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long label\n </Label>\n </FormField>\n);\n\nexport const WithLongLabel = WithLongLabelTemplate.bind({});\nWithLongLabel.args = {\n onChange: fn(),\n};\n"],"names":["Checkbox_stories","Checkbox","Template","args","jsxs","FormField","jsx","Label","CheckboxExample","fn","WithLongLabelTemplate","WithLongLabel"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"Checkbox.stories.js","sources":["../../../src/components/Checkbox/Checkbox.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CheckboxProps } from './Checkbox';\n\nimport { Checkbox } from './Checkbox';\n\nimport { FormField } from 'components/FormField';\nimport { Label } from 'components/Label';\n\nconst codeString = '<Checkbox checked={checked} id={id} onChange={onChangeFunction} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Checkbox',\n component: Checkbox,\n parameters: {\n codeString: codeString,\n },\n} as Meta<CheckboxProps>;\n\nconst Template: StoryFn<CheckboxProps> = (args) => (\n <FormField inline>\n <Checkbox id=\"72103b4d\" {...args} />\n <Label htmlFor=\"72103b4d\">Example Checkbox</Label>\n </FormField>\n);\n\nexport const CheckboxExample = Template.bind({});\nCheckboxExample.args = {\n onChange: fn(),\n};\n\n// Extra story created for UX to see how we can solve placement of checkbox when paired with long content\n// TODO: should this component be refactored to always include a label? (see RadioButton)\nconst WithLongLabelTemplate: StoryFn<CheckboxProps> = (args) => (\n <FormField inline>\n <div\n style={{\n alignSelf: 'flex-start',\n marginTop: '0.18rem',\n }}\n >\n <Checkbox id=\"72103b4e\" {...args} />\n </div>\n <Label htmlFor=\"72103b4e\">\n Example Checkbox with long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long long long long long long long long long long long long long\n long long long long long long long long long long long label\n </Label>\n </FormField>\n);\n\nexport const WithLongLabel = WithLongLabelTemplate.bind({});\nWithLongLabel.args = {\n onChange: fn(),\n};\n"],"names":["codeString","Checkbox_stories","Checkbox","Template","args","jsxs","FormField","jsx","Label","CheckboxExample","fn","WithLongLabelTemplate","WithLongLabel"],"mappings":";;;;;AAUA,MAAMA,IAAa,sEAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAmC,CAACC,MACvC,gBAAAC,EAAAC,GAAA,EAAU,QAAM,IACf,UAAA;AAAA,EAAA,gBAAAC,EAACL,GAAS,EAAA,IAAG,YAAY,GAAGE,EAAM,CAAA;AAAA,EACjC,gBAAAG,EAAAC,GAAA,EAAM,SAAQ,YAAW,UAAgB,oBAAA;AAAA,EAC5C,CAAA,GAGWC,IAAkBN,EAAS,KAAK,EAAE;AAC/CM,EAAgB,OAAO;AAAA,EACrB,UAAUC,EAAG;AACf;AAIA,MAAMC,IAAgD,CAACP,MACpD,gBAAAC,EAAAC,GAAA,EAAU,QAAM,IACf,UAAA;AAAA,EAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,MACb;AAAA,MAEA,UAAC,gBAAAA,EAAAL,GAAA,EAAS,IAAG,YAAY,GAAGE,GAAM;AAAA,IAAA;AAAA,EACpC;AAAA,EACC,gBAAAG,EAAAC,GAAA,EAAM,SAAQ,YAAW,UAK1B,sZAAA;AAAA,EACF,CAAA,GAGWI,IAAgBD,EAAsB,KAAK,EAAE;AAC1DC,EAAc,OAAO;AAAA,EACnB,UAAUF,EAAG;AACf;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { FieldHint as
|
|
3
|
-
const
|
|
1
|
+
import { jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { FieldHint as e } from "./FieldHint.js";
|
|
3
|
+
const l = "<FieldHint value={value} loading={loading} spinnerAriaValueText={spinnerAriaValueText} />", p = {
|
|
4
4
|
title: "Atoms/FieldHint",
|
|
5
|
-
component:
|
|
5
|
+
component: e,
|
|
6
6
|
argTypes: {
|
|
7
7
|
value: {
|
|
8
8
|
control: "text"
|
|
@@ -10,24 +10,27 @@ const d = {
|
|
|
10
10
|
spinnerAriaValueText: {
|
|
11
11
|
control: "text"
|
|
12
12
|
}
|
|
13
|
+
},
|
|
14
|
+
parameters: {
|
|
15
|
+
codeString: l
|
|
13
16
|
}
|
|
14
|
-
},
|
|
17
|
+
}, i = (n) => /* @__PURE__ */ a(e, { ...n }), t = {
|
|
15
18
|
spinnerAriaValueText: "FieldHint Loading"
|
|
16
|
-
}, o =
|
|
19
|
+
}, o = i.bind({});
|
|
17
20
|
o.args = {
|
|
18
21
|
value: "This is a FieldHint",
|
|
19
22
|
loading: !1,
|
|
20
|
-
...
|
|
23
|
+
...t
|
|
21
24
|
};
|
|
22
|
-
const
|
|
23
|
-
|
|
25
|
+
const r = i.bind({});
|
|
26
|
+
r.args = {
|
|
24
27
|
value: "",
|
|
25
28
|
loading: !0,
|
|
26
|
-
...
|
|
29
|
+
...t
|
|
27
30
|
};
|
|
28
31
|
export {
|
|
29
32
|
o as FieldHintExample,
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
r as LoadingFieldHint,
|
|
34
|
+
p as default
|
|
32
35
|
};
|
|
33
36
|
//# sourceMappingURL=FieldHint.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldHint.stories.js","sources":["../../../src/components/FieldHint/FieldHint.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { FieldHintProps } from './FieldHint';\n\nimport { FieldHint } from './FieldHint';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/FieldHint',\n component: FieldHint,\n argTypes: {\n value: {\n control: 'text',\n },\n spinnerAriaValueText: {\n control: 'text',\n },\n },\n} as Meta<FieldHintProps>;\n\nconst Template: StoryFn<FieldHintProps> = (args) => <FieldHint {...args} />;\n\nconst defaultArgs: Partial<FieldHintProps> = {\n spinnerAriaValueText: 'FieldHint Loading',\n};\n\nexport const FieldHintExample = Template.bind({});\nFieldHintExample.args = {\n value: 'This is a FieldHint',\n loading: false,\n ...defaultArgs,\n};\n\nexport const LoadingFieldHint = Template.bind({});\nLoadingFieldHint.args = {\n value: '',\n loading: true,\n ...defaultArgs,\n};\n"],"names":["FieldHint_stories","FieldHint","Template","args","jsx","defaultArgs","FieldHintExample","LoadingFieldHint"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"FieldHint.stories.js","sources":["../../../src/components/FieldHint/FieldHint.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { FieldHintProps } from './FieldHint';\n\nimport { FieldHint } from './FieldHint';\n\nconst codeString = '<FieldHint value={value} loading={loading} spinnerAriaValueText={spinnerAriaValueText} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/FieldHint',\n component: FieldHint,\n argTypes: {\n value: {\n control: 'text',\n },\n spinnerAriaValueText: {\n control: 'text',\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<FieldHintProps>;\n\nconst Template: StoryFn<FieldHintProps> = (args) => <FieldHint {...args} />;\n\nconst defaultArgs: Partial<FieldHintProps> = {\n spinnerAriaValueText: 'FieldHint Loading',\n};\n\nexport const FieldHintExample = Template.bind({});\nFieldHintExample.args = {\n value: 'This is a FieldHint',\n loading: false,\n ...defaultArgs,\n};\n\nexport const LoadingFieldHint = Template.bind({});\nLoadingFieldHint.args = {\n value: '',\n loading: true,\n ...defaultArgs,\n};\n"],"names":["codeString","FieldHint_stories","FieldHint","Template","args","jsx","defaultArgs","FieldHintExample","LoadingFieldHint"],"mappings":";;AAKA,MAAMA,IAAa,6FAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,IACA,sBAAsB;AAAA,MACpB,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAoC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAW,GAAGE,EAAM,CAAA,GAEnEE,IAAuC;AAAA,EAC3C,sBAAsB;AACxB,GAEaC,IAAmBJ,EAAS,KAAK,EAAE;AAChDI,EAAiB,OAAO;AAAA,EACtB,OAAO;AAAA,EACP,SAAS;AAAA,EACT,GAAGD;AACL;AAEO,MAAME,IAAmBL,EAAS,KAAK,EAAE;AAChDK,EAAiB,OAAO;AAAA,EACtB,OAAO;AAAA,EACP,SAAS;AAAA,EACT,GAAGF;AACL;"}
|
|
@@ -4,7 +4,7 @@ import { InputField as i } from "../InputField/InputField.js";
|
|
|
4
4
|
import { Label as t } from "../Label/Label.js";
|
|
5
5
|
import { Container as n } from "../storyComponents/Container/Container.js";
|
|
6
6
|
import { FormField as r } from "../FormField/FormField.js";
|
|
7
|
-
const
|
|
7
|
+
const m = "<Fieldset legend={legend} description={description}>{children}</Fieldset>", u = {
|
|
8
8
|
title: "Atoms/Fieldset",
|
|
9
9
|
component: s,
|
|
10
10
|
argTypes: {
|
|
@@ -13,8 +13,11 @@ const g = {
|
|
|
13
13
|
disable: !0
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
|
+
},
|
|
17
|
+
parameters: {
|
|
18
|
+
codeString: m
|
|
16
19
|
}
|
|
17
|
-
},
|
|
20
|
+
}, d = (a) => /* @__PURE__ */ e(n, { size: "large", children: /* @__PURE__ */ l(s, { ...a, children: [
|
|
18
21
|
/* @__PURE__ */ l(r, { children: [
|
|
19
22
|
/* @__PURE__ */ e(t, { htmlFor: "d6aa53fd", children: "Example label 1" }),
|
|
20
23
|
/* @__PURE__ */ e(i, { id: "d6aa53fd" })
|
|
@@ -23,21 +26,21 @@ const g = {
|
|
|
23
26
|
/* @__PURE__ */ e(t, { htmlFor: "4e7a2f22", children: "Example label 2" }),
|
|
24
27
|
/* @__PURE__ */ e(i, { id: "4e7a2f22" })
|
|
25
28
|
] })
|
|
26
|
-
] }) }),
|
|
29
|
+
] }) }), o = {
|
|
27
30
|
legend: "Fieldset example",
|
|
28
31
|
inline: !1
|
|
29
|
-
},
|
|
30
|
-
m.args = {
|
|
31
|
-
...a
|
|
32
|
-
};
|
|
33
|
-
const p = o.bind({});
|
|
32
|
+
}, p = d.bind({});
|
|
34
33
|
p.args = {
|
|
35
|
-
...
|
|
34
|
+
...o
|
|
35
|
+
};
|
|
36
|
+
const c = d.bind({});
|
|
37
|
+
c.args = {
|
|
38
|
+
...o,
|
|
36
39
|
description: "A Fieldset groups several controls as well as labels"
|
|
37
40
|
};
|
|
38
41
|
export {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
+
p as FieldsetExample,
|
|
43
|
+
c as WithDescriptionExample,
|
|
44
|
+
u as default
|
|
42
45
|
};
|
|
43
46
|
//# sourceMappingURL=Fieldset.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fieldset.stories.js","sources":["../../../src/components/Fieldset/Fieldset.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { PropsWithChildren } from 'react';\nimport type { FieldsetProps } from './Fieldset';\n\nimport { Fieldset } from './Fieldset';\n\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\nimport { Container } from 'components/storyComponents/Container';\nimport { FormField } from 'components/FormField';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Fieldset',\n component: Fieldset,\n argTypes: {\n descriptionId: {\n table: {\n disable: true,\n },\n },\n },\n} as Meta<PropsWithChildren<FieldsetProps>>;\n\nconst Template: StoryFn<PropsWithChildren<FieldsetProps>> = (args) => (\n <Container size=\"large\">\n <Fieldset {...args}>\n <FormField>\n <Label htmlFor=\"d6aa53fd\">Example label 1</Label>\n <InputField id=\"d6aa53fd\" />\n </FormField>\n <FormField>\n <Label htmlFor=\"4e7a2f22\">Example label 2</Label>\n <InputField id=\"4e7a2f22\" />\n </FormField>\n </Fieldset>\n </Container>\n);\n\nconst defaultArgs: Partial<PropsWithChildren<FieldsetProps>> = {\n legend: 'Fieldset example',\n inline: false,\n};\n\nexport const FieldsetExample = Template.bind({});\nFieldsetExample.args = {\n ...defaultArgs,\n};\n\nexport const WithDescriptionExample = Template.bind({});\nWithDescriptionExample.args = {\n ...defaultArgs,\n description: 'A Fieldset groups several controls as well as labels',\n};\n"],"names":["Fieldset_stories","Fieldset","Template","args","jsx","Container","jsxs","FormField","Label","InputField","defaultArgs","FieldsetExample","WithDescriptionExample"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"Fieldset.stories.js","sources":["../../../src/components/Fieldset/Fieldset.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { PropsWithChildren } from 'react';\nimport type { FieldsetProps } from './Fieldset';\n\nimport { Fieldset } from './Fieldset';\n\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\nimport { Container } from 'components/storyComponents/Container';\nimport { FormField } from 'components/FormField';\n\nconst codeString = '<Fieldset legend={legend} description={description}>{children}</Fieldset>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Fieldset',\n component: Fieldset,\n argTypes: {\n descriptionId: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<PropsWithChildren<FieldsetProps>>;\n\nconst Template: StoryFn<PropsWithChildren<FieldsetProps>> = (args) => (\n <Container size=\"large\">\n <Fieldset {...args}>\n <FormField>\n <Label htmlFor=\"d6aa53fd\">Example label 1</Label>\n <InputField id=\"d6aa53fd\" />\n </FormField>\n <FormField>\n <Label htmlFor=\"4e7a2f22\">Example label 2</Label>\n <InputField id=\"4e7a2f22\" />\n </FormField>\n </Fieldset>\n </Container>\n);\n\nconst defaultArgs: Partial<PropsWithChildren<FieldsetProps>> = {\n legend: 'Fieldset example',\n inline: false,\n};\n\nexport const FieldsetExample = Template.bind({});\nFieldsetExample.args = {\n ...defaultArgs,\n};\n\nexport const WithDescriptionExample = Template.bind({});\nWithDescriptionExample.args = {\n ...defaultArgs,\n description: 'A Fieldset groups several controls as well as labels',\n};\n"],"names":["codeString","Fieldset_stories","Fieldset","Template","args","jsx","Container","jsxs","FormField","Label","InputField","defaultArgs","FieldsetExample","WithDescriptionExample"],"mappings":";;;;;;AAWA,MAAMA,IAAa,6EAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,eAAe;AAAA,MACb,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAsD,CAACC,MAC1D,gBAAAC,EAAAC,GAAA,EAAU,MAAK,SACd,UAAA,gBAAAC,EAACL,GAAU,EAAA,GAAGE,GACZ,UAAA;AAAA,EAAA,gBAAAG,EAACC,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAM,SAAQ,YAAW,UAAe,mBAAA;AAAA,IACzC,gBAAAJ,EAACK,GAAW,EAAA,IAAG,WAAW,CAAA;AAAA,EAAA,GAC5B;AAAA,oBACCF,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAM,SAAQ,YAAW,UAAe,mBAAA;AAAA,IACzC,gBAAAJ,EAACK,GAAW,EAAA,IAAG,WAAW,CAAA;AAAA,EAAA,GAC5B;AAAA,EACF,CAAA,EACF,CAAA,GAGIC,IAAyD;AAAA,EAC7D,QAAQ;AAAA,EACR,QAAQ;AACV,GAEaC,IAAkBT,EAAS,KAAK,EAAE;AAC/CS,EAAgB,OAAO;AAAA,EACrB,GAAGD;AACL;AAEO,MAAME,IAAyBV,EAAS,KAAK,EAAE;AACtDU,EAAuB,OAAO;AAAA,EAC5B,GAAGF;AAAA,EACH,aAAa;AACf;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsxs as o, jsx as e } from "react/jsx-runtime";
|
|
2
|
-
import { FormField as
|
|
3
|
-
import { InputField as
|
|
4
|
-
import { Label as
|
|
2
|
+
import { FormField as r } from "./FormField.js";
|
|
3
|
+
import { InputField as i } from "../InputField/InputField.js";
|
|
4
|
+
import { Label as t } from "../Label/Label.js";
|
|
5
5
|
import { Container as a } from "../storyComponents/Container/Container.js";
|
|
6
|
-
const
|
|
6
|
+
const n = "<FormField>{children}</FormField>", b = {
|
|
7
7
|
title: "Atoms/FormField",
|
|
8
|
-
component:
|
|
8
|
+
component: r,
|
|
9
9
|
argTypes: {
|
|
10
10
|
outerSpace: {
|
|
11
11
|
control: "boolean"
|
|
@@ -13,25 +13,28 @@ const h = {
|
|
|
13
13
|
inline: {
|
|
14
14
|
control: "boolean"
|
|
15
15
|
}
|
|
16
|
+
},
|
|
17
|
+
parameters: {
|
|
18
|
+
codeString: n
|
|
16
19
|
}
|
|
17
|
-
},
|
|
18
|
-
/* @__PURE__ */ o(
|
|
19
|
-
/* @__PURE__ */ e(
|
|
20
|
-
/* @__PURE__ */ e(
|
|
20
|
+
}, m = (l) => /* @__PURE__ */ o(a, { children: [
|
|
21
|
+
/* @__PURE__ */ o(r, { ...l, children: [
|
|
22
|
+
/* @__PURE__ */ e(t, { htmlFor: "d6aa53fd", children: "Example label 1" }),
|
|
23
|
+
/* @__PURE__ */ e(i, { id: "d6aa53fd" })
|
|
21
24
|
] }),
|
|
22
|
-
/* @__PURE__ */ o(
|
|
23
|
-
/* @__PURE__ */ e(
|
|
24
|
-
/* @__PURE__ */ e(
|
|
25
|
+
/* @__PURE__ */ o(r, { ...l, children: [
|
|
26
|
+
/* @__PURE__ */ e(t, { htmlFor: "4e7a2f22", children: "Example label 2" }),
|
|
27
|
+
/* @__PURE__ */ e(i, { id: "4e7a2f22" })
|
|
25
28
|
] })
|
|
26
|
-
] }),
|
|
29
|
+
] }), d = {
|
|
27
30
|
outerSpace: !1,
|
|
28
31
|
inline: !1
|
|
29
|
-
},
|
|
30
|
-
|
|
31
|
-
...
|
|
32
|
+
}, c = m.bind({});
|
|
33
|
+
c.args = {
|
|
34
|
+
...d
|
|
32
35
|
};
|
|
33
36
|
export {
|
|
34
|
-
|
|
35
|
-
|
|
37
|
+
c as FormFieldExample,
|
|
38
|
+
b as default
|
|
36
39
|
};
|
|
37
40
|
//# sourceMappingURL=FormField.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormField.stories.js","sources":["../../../src/components/FormField/FormField.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { PropsWithChildren } from 'react';\nimport type { FormFieldProps } from './FormField';\n\nimport { FormField } from './FormField';\n\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\nimport { Container } from 'components/storyComponents/Container';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/FormField',\n component: FormField,\n argTypes: {\n outerSpace: {\n control: 'boolean',\n },\n inline: {\n control: 'boolean',\n },\n },\n} as Meta<PropsWithChildren<FormFieldProps>>;\n\nconst Template: StoryFn<PropsWithChildren<FormFieldProps>> = (args) => (\n <Container>\n <FormField {...args}>\n <Label htmlFor=\"d6aa53fd\">Example label 1</Label>\n <InputField id=\"d6aa53fd\" />\n </FormField>\n <FormField {...args}>\n <Label htmlFor=\"4e7a2f22\">Example label 2</Label>\n <InputField id=\"4e7a2f22\" />\n </FormField>\n </Container>\n);\n\nconst defaultArgs: Partial<PropsWithChildren<FormFieldProps>> = {\n outerSpace: false,\n inline: false,\n};\n\nexport const FormFieldExample = Template.bind({});\nFormFieldExample.args = {\n ...defaultArgs,\n};\n"],"names":["FormField_stories","FormField","Template","args","jsxs","Container","jsx","Label","InputField","defaultArgs","FormFieldExample"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"FormField.stories.js","sources":["../../../src/components/FormField/FormField.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { PropsWithChildren } from 'react';\nimport type { FormFieldProps } from './FormField';\n\nimport { FormField } from './FormField';\n\nimport { InputField } from 'components/InputField';\nimport { Label } from 'components/Label';\nimport { Container } from 'components/storyComponents/Container';\n\nconst codeString = '<FormField>{children}</FormField>';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/FormField',\n component: FormField,\n argTypes: {\n outerSpace: {\n control: 'boolean',\n },\n inline: {\n control: 'boolean',\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<PropsWithChildren<FormFieldProps>>;\n\nconst Template: StoryFn<PropsWithChildren<FormFieldProps>> = (args) => (\n <Container>\n <FormField {...args}>\n <Label htmlFor=\"d6aa53fd\">Example label 1</Label>\n <InputField id=\"d6aa53fd\" />\n </FormField>\n <FormField {...args}>\n <Label htmlFor=\"4e7a2f22\">Example label 2</Label>\n <InputField id=\"4e7a2f22\" />\n </FormField>\n </Container>\n);\n\nconst defaultArgs: Partial<PropsWithChildren<FormFieldProps>> = {\n outerSpace: false,\n inline: false,\n};\n\nexport const FormFieldExample = Template.bind({});\nFormFieldExample.args = {\n ...defaultArgs,\n};\n"],"names":["codeString","FormField_stories","FormField","Template","args","jsxs","Container","jsx","Label","InputField","defaultArgs","FormFieldExample"],"mappings":";;;;;AAUA,MAAMA,IAAa,qCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,YAAY;AAAA,MACV,SAAS;AAAA,IACX;AAAA,IACA,QAAQ;AAAA,MACN,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAuD,CAACC,MAC5D,gBAAAC,EAACC,GACC,EAAA,UAAA;AAAA,EAAC,gBAAAD,EAAAH,GAAA,EAAW,GAAGE,GACb,UAAA;AAAA,IAAC,gBAAAG,EAAAC,GAAA,EAAM,SAAQ,YAAW,UAAe,mBAAA;AAAA,IACzC,gBAAAD,EAACE,GAAW,EAAA,IAAG,WAAW,CAAA;AAAA,EAAA,GAC5B;AAAA,EACA,gBAAAJ,EAACH,GAAW,EAAA,GAAGE,GACb,UAAA;AAAA,IAAC,gBAAAG,EAAAC,GAAA,EAAM,SAAQ,YAAW,UAAe,mBAAA;AAAA,IACzC,gBAAAD,EAACE,GAAW,EAAA,IAAG,WAAW,CAAA;AAAA,EAAA,GAC5B;AAAA,EACF,CAAA,GAGIC,IAA0D;AAAA,EAC9D,YAAY;AAAA,EACZ,QAAQ;AACV,GAEaC,IAAmBR,EAAS,KAAK,EAAE;AAChDQ,EAAiB,OAAO;AAAA,EACtB,GAAGD;AACL;"}
|
|
@@ -1,22 +1,25 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as o } from "react/jsx-runtime";
|
|
2
2
|
import { HorizontalList as t } from "./HorizontalList.js";
|
|
3
|
-
const
|
|
3
|
+
const a = '<HorizontalList values={values} separator="•" />', u = {
|
|
4
4
|
title: "Atoms/HorizontalList",
|
|
5
5
|
component: t,
|
|
6
6
|
argTypes: {
|
|
7
7
|
separator: {
|
|
8
8
|
control: "text"
|
|
9
9
|
}
|
|
10
|
+
},
|
|
11
|
+
parameters: {
|
|
12
|
+
codeString: a
|
|
10
13
|
}
|
|
11
|
-
},
|
|
14
|
+
}, r = (s) => /* @__PURE__ */ o(t, { ...s }), e = {
|
|
12
15
|
values: ["Curabitur consequat", "Lectus sit amet luctus vulputate", "Nisi semi mattis"],
|
|
13
16
|
separator: "•"
|
|
14
|
-
},
|
|
15
|
-
|
|
16
|
-
...
|
|
17
|
+
}, i = r.bind({});
|
|
18
|
+
i.args = {
|
|
19
|
+
...e
|
|
17
20
|
};
|
|
18
21
|
export {
|
|
19
|
-
|
|
20
|
-
|
|
22
|
+
i as HorizontalListExample,
|
|
23
|
+
u as default
|
|
21
24
|
};
|
|
22
25
|
//# sourceMappingURL=HorizontalList.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalList.stories.js","sources":["../../../src/components/HorizontalList/HorizontalList.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { HorizontalListProps } from './HorizontalList';\n\nimport { HorizontalList } from './HorizontalList';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/HorizontalList',\n component: HorizontalList,\n argTypes: {\n separator: {\n control: 'text',\n },\n },\n} as Meta<HorizontalListProps>;\n\nconst Template: StoryFn<HorizontalListProps> = (args) => <HorizontalList {...args} />;\n\nconst defaultArgs: Partial<HorizontalListProps> = {\n values: ['Curabitur consequat', 'Lectus sit amet luctus vulputate', 'Nisi semi mattis'],\n separator: '•',\n};\n\nexport const HorizontalListExample = Template.bind({});\nHorizontalListExample.args = {\n ...defaultArgs,\n};\n"],"names":["HorizontalList_stories","HorizontalList","Template","args","jsx","defaultArgs","HorizontalListExample"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"HorizontalList.stories.js","sources":["../../../src/components/HorizontalList/HorizontalList.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { HorizontalListProps } from './HorizontalList';\n\nimport { HorizontalList } from './HorizontalList';\n\nconst codeString = '<HorizontalList values={values} separator=\"•\" />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/HorizontalList',\n component: HorizontalList,\n argTypes: {\n separator: {\n control: 'text',\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<HorizontalListProps>;\n\nconst Template: StoryFn<HorizontalListProps> = (args) => <HorizontalList {...args} />;\n\nconst defaultArgs: Partial<HorizontalListProps> = {\n values: ['Curabitur consequat', 'Lectus sit amet luctus vulputate', 'Nisi semi mattis'],\n separator: '•',\n};\n\nexport const HorizontalListExample = Template.bind({});\nHorizontalListExample.args = {\n ...defaultArgs,\n};\n"],"names":["codeString","HorizontalList_stories","HorizontalList","Template","args","jsx","defaultArgs","HorizontalListExample"],"mappings":";;AAKA,MAAMA,IAAa,oDAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,WAAW;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAyC,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAgB,GAAGE,EAAM,CAAA,GAE7EE,IAA4C;AAAA,EAChD,QAAQ,CAAC,uBAAuB,oCAAoC,kBAAkB;AAAA,EACtF,WAAW;AACb,GAEaC,IAAwBJ,EAAS,KAAK,EAAE;AACrDI,EAAsB,OAAO;AAAA,EAC3B,GAAGD;AACL;"}
|
|
@@ -1,20 +1,23 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as o, jsxs as n } from "react/jsx-runtime";
|
|
2
2
|
import { Icon as i } from "./Icon.js";
|
|
3
3
|
import { Icons as r } from "./icons/index.js";
|
|
4
4
|
import { ClipboardButton as c } from "../storyComponents/ClipboardButton/ClipboardButton.js";
|
|
5
|
-
import '../../assets/Icon.css';const s = "_icon__wrapper_lse0u_1", p = "_icon__item_lse0u_13",
|
|
5
|
+
import '../../assets/Icon.css';const s = "_icon__wrapper_lse0u_1", p = "_icon__item_lse0u_13", t = {
|
|
6
6
|
icon__wrapper: s,
|
|
7
7
|
icon__item: p
|
|
8
|
-
},
|
|
8
|
+
}, a = "<Icon name={iconName} size={size} />", w = {
|
|
9
9
|
title: "Atoms/Icon",
|
|
10
|
-
component: i
|
|
11
|
-
|
|
12
|
-
a
|
|
10
|
+
component: i,
|
|
11
|
+
parameters: {
|
|
12
|
+
codeString: a
|
|
13
|
+
}
|
|
14
|
+
}, m = (e) => /* @__PURE__ */ o(i, { ...e }), _ = m.bind({});
|
|
15
|
+
_.args = {
|
|
13
16
|
name: "ArrowDownOnSquare",
|
|
14
17
|
size: 32,
|
|
15
18
|
title: "Optional Icon title"
|
|
16
19
|
};
|
|
17
|
-
const
|
|
20
|
+
const x = () => /* @__PURE__ */ o(
|
|
18
21
|
"div",
|
|
19
22
|
{
|
|
20
23
|
style: {
|
|
@@ -24,18 +27,18 @@ const w = () => /* @__PURE__ */ e(
|
|
|
24
27
|
padding: "1rem",
|
|
25
28
|
maxWidth: "1024px"
|
|
26
29
|
},
|
|
27
|
-
children: Object.keys(r).map((
|
|
28
|
-
/* @__PURE__ */
|
|
29
|
-
/* @__PURE__ */
|
|
30
|
-
/* @__PURE__ */
|
|
31
|
-
/* @__PURE__ */
|
|
30
|
+
children: Object.keys(r).map((e) => /* @__PURE__ */ n("div", { className: t.icon__wrapper, children: [
|
|
31
|
+
/* @__PURE__ */ o(i, { name: e, size: 48 }),
|
|
32
|
+
/* @__PURE__ */ n("div", { className: t.icon__item, children: [
|
|
33
|
+
/* @__PURE__ */ o("span", { children: e }),
|
|
34
|
+
/* @__PURE__ */ o(c, { text: `<Icon icon={${e}} />` })
|
|
32
35
|
] })
|
|
33
|
-
] },
|
|
36
|
+
] }, e))
|
|
34
37
|
}
|
|
35
38
|
);
|
|
36
39
|
export {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
+
_ as IconExample,
|
|
41
|
+
x as IconOverview,
|
|
42
|
+
w as default
|
|
40
43
|
};
|
|
41
44
|
//# sourceMappingURL=Icon.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.stories.js","sources":["../../../src/components/Icon/Icon.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { IconProps } from './Icon';\n\nimport { Icon } from './Icon';\nimport { Icons } from './icons';\nimport styles from './story.module.css';\n\nimport { ClipboardButton } from 'components/storyComponents/ClipboardButton/';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Icon',\n component: Icon,\n} as Meta<IconProps>;\n\nconst Template: StoryFn<IconProps> = (args) => <Icon {...args} />;\n\nexport const IconExample = Template.bind({});\nIconExample.args = {\n name: 'ArrowDownOnSquare',\n size: 32,\n title: 'Optional Icon title',\n};\n\nexport const IconOverview = () => {\n return (\n <div\n style={{\n display: 'grid',\n gridTemplateColumns: 'repeat(4, 1fr)',\n gridGap: '1rem',\n padding: '1rem',\n maxWidth: '1024px',\n }}\n >\n {Object.keys(Icons).map((name) => (\n <div key={name} className={styles.icon__wrapper}>\n <Icon name={name as keyof typeof Icons} size={48} />\n <div className={styles.icon__item}>\n <span>{name}</span>\n <ClipboardButton text={`<Icon icon={${name}} />`} />\n </div>\n </div>\n ))}\n </div>\n );\n};\n"],"names":["Icon_stories","Icon","Template","args","jsx","IconExample","IconOverview","Icons","name","jsxs","styles","ClipboardButton"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"Icon.stories.js","sources":["../../../src/components/Icon/Icon.stories.tsx"],"sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport type { IconProps } from './Icon';\n\nimport { Icon } from './Icon';\nimport { Icons } from './icons';\nimport styles from './story.module.css';\n\nimport { ClipboardButton } from 'components/storyComponents/ClipboardButton/';\n\nconst codeString = '<Icon name={iconName} size={size} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/Icon',\n component: Icon,\n parameters: {\n codeString: codeString,\n },\n} as Meta<IconProps>;\n\nconst Template: StoryFn<IconProps> = (args) => <Icon {...args} />;\n\nexport const IconExample = Template.bind({});\nIconExample.args = {\n name: 'ArrowDownOnSquare',\n size: 32,\n title: 'Optional Icon title',\n};\n\nexport const IconOverview = () => {\n return (\n <div\n style={{\n display: 'grid',\n gridTemplateColumns: 'repeat(4, 1fr)',\n gridGap: '1rem',\n padding: '1rem',\n maxWidth: '1024px',\n }}\n >\n {Object.keys(Icons).map((name) => (\n <div key={name} className={styles.icon__wrapper}>\n <Icon name={name as keyof typeof Icons} size={48} />\n <div className={styles.icon__item}>\n <span>{name}</span>\n <ClipboardButton text={`<Icon icon={${name}} />`} />\n </div>\n </div>\n ))}\n </div>\n );\n};\n"],"names":["codeString","Icon_stories","Icon","Template","args","jsx","IconExample","IconOverview","Icons","name","jsxs","styles","ClipboardButton"],"mappings":";;;;;;;GASMA,IAAa,wCAGJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAA+B,CAACC,MAAU,gBAAAC,EAAAH,GAAA,EAAM,GAAGE,EAAM,CAAA,GAElDE,IAAcH,EAAS,KAAK,EAAE;AAC3CG,EAAY,OAAO;AAAA,EACjB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AACT;AAEO,MAAMC,IAAe,MAExB,gBAAAF;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAO;AAAA,MACL,SAAS;AAAA,MACT,qBAAqB;AAAA,MACrB,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,IACZ;AAAA,IAEC,UAAA,OAAO,KAAKG,CAAK,EAAE,IAAI,CAACC,MACtB,gBAAAC,EAAA,OAAA,EAAe,WAAWC,EAAO,eAChC,UAAA;AAAA,MAAC,gBAAAN,EAAAH,GAAA,EAAK,MAAAO,GAAkC,MAAM,GAAI,CAAA;AAAA,MACjD,gBAAAC,EAAA,OAAA,EAAI,WAAWC,EAAO,YACrB,UAAA;AAAA,QAAA,gBAAAN,EAAC,UAAM,UAAKI,EAAA,CAAA;AAAA,QACX,gBAAAJ,EAAAO,GAAA,EAAgB,MAAM,eAAeH,CAAI,QAAQ;AAAA,MAAA,GACpD;AAAA,IAAA,EAAA,GALQA,CAMV,CACD;AAAA,EAAA;AAAA;"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { jsx as o } from "react/jsx-runtime";
|
|
2
|
-
import { f as
|
|
3
|
-
import { IconButton as
|
|
4
|
-
import { Icon as
|
|
5
|
-
const
|
|
2
|
+
import { f as r } from "../../index-C7tAT8j7.js";
|
|
3
|
+
import { IconButton as n } from "./IconButton.js";
|
|
4
|
+
import { Icon as i } from "../Icon/Icon.js";
|
|
5
|
+
const l = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>
|
|
6
|
+
<Icon name={iconName} size={size} />
|
|
7
|
+
</IconButton>`, b = {
|
|
6
8
|
title: "Atoms/IconButton",
|
|
7
|
-
component:
|
|
9
|
+
component: n,
|
|
8
10
|
argTypes: {
|
|
9
11
|
variant: {
|
|
10
12
|
options: ["destructive"],
|
|
@@ -32,22 +34,25 @@ const m = {
|
|
|
32
34
|
disable: !0
|
|
33
35
|
}
|
|
34
36
|
}
|
|
37
|
+
},
|
|
38
|
+
parameters: {
|
|
39
|
+
codeString: l
|
|
35
40
|
}
|
|
36
41
|
}, s = (t) => {
|
|
37
|
-
const
|
|
38
|
-
return /* @__PURE__ */ o(
|
|
39
|
-
},
|
|
40
|
-
|
|
42
|
+
const e = t.variant ?? [], a = { ...t, variant: e.toString() };
|
|
43
|
+
return /* @__PURE__ */ o(n, { ...a });
|
|
44
|
+
}, c = s.bind({});
|
|
45
|
+
c.args = {
|
|
41
46
|
"aria-label": "Trash",
|
|
42
47
|
variant: "destructive",
|
|
43
48
|
noBorder: !1,
|
|
44
49
|
wide: !1,
|
|
45
50
|
disabled: !1,
|
|
46
|
-
children: /* @__PURE__ */ o(
|
|
47
|
-
onClick:
|
|
51
|
+
children: /* @__PURE__ */ o(i, { name: "Trash" }),
|
|
52
|
+
onClick: r()
|
|
48
53
|
};
|
|
49
54
|
export {
|
|
50
|
-
|
|
51
|
-
|
|
55
|
+
c as IconButtonExample,
|
|
56
|
+
b as default
|
|
52
57
|
};
|
|
53
58
|
//# sourceMappingURL=IconButton.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.stories.js","sources":["../../../src/components/IconButton/IconButton.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { IconButtonProps } from 'components/IconButton';\n\nimport { IconButton } from 'components/IconButton';\nimport { Icon } from 'components/Icon';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/IconButton',\n component: IconButton,\n argTypes: {\n variant: {\n options: ['destructive'],\n control: { type: 'check' },\n },\n noBorder: {\n control: 'boolean',\n default: false,\n },\n wide: {\n control: 'boolean',\n default: false,\n },\n 'aria-label': {\n table: {\n disable: true,\n },\n },\n type: {\n options: ['button', 'submit', 'reset'],\n control: { type: 'select' },\n },\n children: {\n table: {\n disable: true,\n },\n },\n },\n} as Meta<IconButtonProps>;\n\nconst Template: StoryFn<IconButtonProps> = (args) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n const iconButtonArgs = { ...args, ...{ variant: variantArray.toString() } } as IconButtonProps;\n\n return <IconButton {...iconButtonArgs} />;\n};\n\nexport const IconButtonExample = Template.bind({});\nIconButtonExample.args = {\n 'aria-label': 'Trash',\n variant: 'destructive',\n noBorder: false,\n wide: false,\n disabled: false,\n children: <Icon name=\"Trash\" />,\n onClick: fn(),\n};\n"],"names":["IconButton_stories","IconButton","Template","args","variantArray","iconButtonArgs","jsx","IconButtonExample","Icon","fn"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"IconButton.stories.js","sources":["../../../src/components/IconButton/IconButton.stories.tsx"],"sourcesContent":["import { fn } from '@storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { IconButtonProps } from 'components/IconButton';\n\nimport { IconButton } from 'components/IconButton';\nimport { Icon } from 'components/Icon';\n\nconst codeString = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>\n <Icon name={iconName} size={size} />\n </IconButton>`;\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Atoms/IconButton',\n component: IconButton,\n argTypes: {\n variant: {\n options: ['destructive'],\n control: { type: 'check' },\n },\n noBorder: {\n control: 'boolean',\n default: false,\n },\n wide: {\n control: 'boolean',\n default: false,\n },\n 'aria-label': {\n table: {\n disable: true,\n },\n },\n type: {\n options: ['button', 'submit', 'reset'],\n control: { type: 'select' },\n },\n children: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n codeString: codeString,\n },\n} as Meta<IconButtonProps>;\n\nconst Template: StoryFn<IconButtonProps> = (args) => {\n // args.variant is provided as an array because the control type is set to a checkbox. So this transforms the selected value into its proper value: a string\n const variantArray = (args.variant as unknown as string[]) ?? [];\n const iconButtonArgs = { ...args, ...{ variant: variantArray.toString() } } as IconButtonProps;\n\n return <IconButton {...iconButtonArgs} />;\n};\n\nexport const IconButtonExample = Template.bind({});\nIconButtonExample.args = {\n 'aria-label': 'Trash',\n variant: 'destructive',\n noBorder: false,\n wide: false,\n disabled: false,\n children: <Icon name=\"Trash\" />,\n onClick: fn(),\n};\n"],"names":["codeString","IconButton_stories","IconButton","Template","args","variantArray","iconButtonArgs","jsx","IconButtonExample","Icon","fn"],"mappings":";;;;AAQA,MAAMA,IAAa;AAAA;AAAA,kBAKJC,IAAA;AAAA,EACb,OAAO;AAAA,EACP,WAAWC;AAAA,EACX,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS,CAAC,aAAa;AAAA,MACvB,SAAS,EAAE,MAAM,QAAQ;AAAA,IAC3B;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,cAAc;AAAA,MACZ,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,SAAS,CAAC,UAAU,UAAU,OAAO;AAAA,MACrC,SAAS,EAAE,MAAM,SAAS;AAAA,IAC5B;AAAA,IACA,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,MACX;AAAA,IACF;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,YAAAF;AAAA,EACF;AACF,GAEMG,IAAqC,CAACC,MAAS;AAE7C,QAAAC,IAAgBD,EAAK,WAAmC,IACxDE,IAAiB,EAAE,GAAGF,GAAW,SAASC,EAAa,SAAS;AAE/D,SAAA,gBAAAE,EAACL,GAAY,EAAA,GAAGI,EAAgB,CAAA;AACzC,GAEaE,IAAoBL,EAAS,KAAK,EAAE;AACjDK,EAAkB,OAAO;AAAA,EACvB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU,gBAAAD,EAACE,GAAK,EAAA,MAAK,QAAQ,CAAA;AAAA,EAC7B,SAASC,EAAG;AACd;"}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@uva-glass/component-library",
|
|
3
3
|
"author": "Team Glass - Frontend vrienden",
|
|
4
4
|
"private": false,
|
|
5
|
-
"version": "1.47.
|
|
5
|
+
"version": "1.47.3",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"types": "dist/index.d.ts",
|
|
@@ -39,8 +39,8 @@
|
|
|
39
39
|
"react-dom": "^18.3.1"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
|
-
"@commitlint/cli": "^19.
|
|
43
|
-
"@commitlint/config-conventional": "^19.
|
|
42
|
+
"@commitlint/cli": "^19.5.0",
|
|
43
|
+
"@commitlint/config-conventional": "^19.5.0",
|
|
44
44
|
"@react-aria/button": "^3.9.8",
|
|
45
45
|
"@react-aria/dialog": "^3.5.17",
|
|
46
46
|
"@react-aria/overlays": "^3.23.2",
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
"react": "^18.3.1",
|
|
81
81
|
"react-dom": "^18.3.1",
|
|
82
82
|
"react-router-dom": "^6.26.2",
|
|
83
|
-
"semantic-release": "^24.1.
|
|
83
|
+
"semantic-release": "^24.1.1",
|
|
84
84
|
"storybook": "^8.2.9",
|
|
85
85
|
"style-dictionary": "^4.1.0",
|
|
86
86
|
"stylelint": "^16.9.0",
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"stylelint-config-standard": "^36.0.1",
|
|
89
89
|
"stylelint-order": "^6.0.4",
|
|
90
90
|
"typescript": "^5.6.2",
|
|
91
|
-
"vite": "^5.4.
|
|
91
|
+
"vite": "^5.4.4",
|
|
92
92
|
"vite-plugin-dts": "^4.2.1",
|
|
93
93
|
"vite-plugin-lib-inject-css": "^2.1.1",
|
|
94
94
|
"vite-plugin-static-copy": "^1.0.6",
|