@uva-glass/component-library 3.53.2 → 3.53.4
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/{TablePlugin-Culqb83M.js → TablePlugin-BlXaQ0U6.js} +15 -15
- package/dist/TablePlugin-BlXaQ0U6.js.map +1 -0
- package/dist/assets/CheckboxButtonBar.css +1 -1
- package/dist/{chunk-GPBRNGY5-BSRMHXbx.js → chunk-MDLQUVZN-BSRMHXbx.js} +1 -1
- package/dist/{chunk-GPBRNGY5-BSRMHXbx.js.map → chunk-MDLQUVZN-BSRMHXbx.js.map} +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.d.ts +3 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.js +64 -60
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.js.map +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js +1 -0
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js.map +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.js +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.stories.js +1 -1
- package/dist/components/FormInput/FormInput.js +1 -1
- package/dist/components/InputField/InputField.stories.js +1 -1
- package/dist/components/MultiSelect/MultiSelect.js +1 -1
- package/dist/components/MultiSelect/MultiSelect.stories.js +1 -1
- package/dist/components/MultiSelect/components/MultiSelectHeader.js +1 -1
- package/dist/components/MultiSelect/index.js +1 -1
- package/dist/components/PageOverlay/PageOverlay.stories.js +71 -71
- package/dist/components/PageOverlay/PageOverlay.stories.js.map +1 -1
- package/dist/components/PeriodSelector/PeriodSelector.js +1 -1
- package/dist/components/ProgrammeCard/ProgrammeCard.stories.js +1 -1
- package/dist/components/RadioTabSelector/RadioTabSelector.js +1 -1
- package/dist/components/RteEditor/EditorHeader/EditorHeader.js +1 -1
- package/dist/components/RteEditor/Plugins/CourseCataloguePlugin/CourseCataloguePlugin.js +32 -32
- package/dist/components/RteEditor/Plugins/CourseCataloguePlugin/CourseCataloguePlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkForm/AddLinkFrom.js +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js +24 -24
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js +7 -7
- package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/index.js +1 -1
- package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js +1 -1
- package/dist/components/RteEditor/Plugins/index.js +1 -1
- package/dist/components/RteEditor/RteEditor.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/index.js +1 -1
- package/dist/storybook__react.d.js +1 -1
- package/package.json +22 -22
- package/dist/TablePlugin-Culqb83M.js.map +0 -1
|
@@ -12,6 +12,8 @@ export interface CheckboxButtonBarProps {
|
|
|
12
12
|
checkboxes: CheckboxProps[];
|
|
13
13
|
defaultValues?: string[];
|
|
14
14
|
label?: string;
|
|
15
|
+
/** optional sub-label text (only displayed when label is positioned 'top') */
|
|
16
|
+
subLabel?: string;
|
|
15
17
|
/** 'top' | 'left' */
|
|
16
18
|
labelPosition?: 'top' | 'left';
|
|
17
19
|
/** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */
|
|
@@ -32,5 +34,5 @@ export interface CheckboxButtonBarProps {
|
|
|
32
34
|
forceSquared?: boolean;
|
|
33
35
|
onSetValues: (value: string[]) => void;
|
|
34
36
|
}
|
|
35
|
-
export declare const CheckboxButtonBar: ({ checkboxes, defaultValues, label, labelPosition, required, notValid, notValidatedText, actAsRadioButtonBar, footerText, disableGroup, segmented, forceSquared, onSetValues, }: CheckboxButtonBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
37
|
+
export declare const CheckboxButtonBar: ({ checkboxes, defaultValues, label, subLabel, labelPosition, required, notValid, notValidatedText, actAsRadioButtonBar, footerText, disableGroup, segmented, forceSquared, onSetValues, }: CheckboxButtonBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
36
38
|
export {};
|
|
@@ -1,73 +1,77 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useState as
|
|
1
|
+
import { jsxs as y, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { useState as $ } from "react";
|
|
3
3
|
import { c as a } from "../../clsx-OuTLNxxd.js";
|
|
4
|
-
import { Label as
|
|
5
|
-
import { FeedbackBox as
|
|
6
|
-
import { ControlsButton as
|
|
4
|
+
import { Label as z } from "../Label/Label.js";
|
|
5
|
+
import { FeedbackBox as D } from "../FeedbackBox/FeedbackBox.js";
|
|
6
|
+
import { ControlsButton as F } from "../ControlsButton/ControlsButton.js";
|
|
7
7
|
import '../../assets/CheckboxButtonBar.css';const e = {
|
|
8
|
-
"checkbox-button-bar__container": "_checkbox-button-
|
|
9
|
-
"checkbox-button-bar__container--label-left": "_checkbox-button-bar__container--label-
|
|
10
|
-
"checkbox-button-bar__container--label-top": "_checkbox-button-bar__container--label-
|
|
11
|
-
"checkbox-button-bar__row-container": "_checkbox-button-bar__row-
|
|
12
|
-
"checkbox-button-bar__row-container--segmented": "_checkbox-button-bar__row-container--
|
|
13
|
-
"checkbox-button-bar__row": "_checkbox-button-
|
|
14
|
-
"checkbox-button-bar__row--not-valid": "_checkbox-button-bar__row--not-
|
|
15
|
-
"checkbox-button-
|
|
16
|
-
},
|
|
17
|
-
checkboxes:
|
|
8
|
+
"checkbox-button-bar__container": "_checkbox-button-bar__container_1jark_1",
|
|
9
|
+
"checkbox-button-bar__container--label-left": "_checkbox-button-bar__container--label-left_1jark_6",
|
|
10
|
+
"checkbox-button-bar__container--label-top": "_checkbox-button-bar__container--label-top_1jark_12",
|
|
11
|
+
"checkbox-button-bar__row-container": "_checkbox-button-bar__row-container_1jark_18",
|
|
12
|
+
"checkbox-button-bar__row-container--segmented": "_checkbox-button-bar__row-container--segmented_1jark_24",
|
|
13
|
+
"checkbox-button-bar__row": "_checkbox-button-bar__row_1jark_18",
|
|
14
|
+
"checkbox-button-bar__row--not-valid": "_checkbox-button-bar__row--not-valid_1jark_39",
|
|
15
|
+
"checkbox-button-bar__sub-text": "_checkbox-button-bar__sub-text_1jark_43"
|
|
16
|
+
}, O = ({
|
|
17
|
+
checkboxes: u,
|
|
18
18
|
defaultValues: n,
|
|
19
|
-
label:
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
label: h,
|
|
20
|
+
subLabel: l = "",
|
|
21
|
+
labelPosition: d = "top",
|
|
22
|
+
required: S = !1,
|
|
23
|
+
notValid: p = !1,
|
|
23
24
|
notValidatedText: _ = "",
|
|
24
|
-
actAsRadioButtonBar:
|
|
25
|
-
footerText:
|
|
26
|
-
disableGroup:
|
|
27
|
-
segmented:
|
|
28
|
-
forceSquared:
|
|
25
|
+
actAsRadioButtonBar: t = !1,
|
|
26
|
+
footerText: w = "",
|
|
27
|
+
disableGroup: f = !1,
|
|
28
|
+
segmented: j = !1,
|
|
29
|
+
forceSquared: v = !1,
|
|
29
30
|
onSetValues: g
|
|
30
31
|
}) => {
|
|
31
|
-
const [
|
|
32
|
-
n && !
|
|
33
|
-
),
|
|
34
|
-
let o =
|
|
35
|
-
|
|
32
|
+
const [i, N] = $(
|
|
33
|
+
n && !t ? n.map(String) : n && t ? n.slice(0, 1) : []
|
|
34
|
+
), C = (c) => {
|
|
35
|
+
let o = i;
|
|
36
|
+
t ? (N([c]), g([c])) : (o.includes(c) ? o = o.filter((b) => b !== c) : o = [...o, c], N(o), g(o));
|
|
36
37
|
};
|
|
37
|
-
return /* @__PURE__ */
|
|
38
|
+
return /* @__PURE__ */ y(
|
|
38
39
|
"div",
|
|
39
40
|
{
|
|
40
41
|
className: a(
|
|
41
42
|
e["checkbox-button-bar__container"],
|
|
42
|
-
e[`checkbox-button-bar__container--label-${
|
|
43
|
+
e[`checkbox-button-bar__container--label-${d}`]
|
|
43
44
|
),
|
|
44
45
|
children: [
|
|
45
|
-
|
|
46
|
+
(h || l) && /* @__PURE__ */ y("div", { children: [
|
|
47
|
+
h && /* @__PURE__ */ r(z, { htmlFor: "", required: S, children: h }),
|
|
48
|
+
l && d === "top" && /* @__PURE__ */ r("div", { className: e["checkbox-button-bar__sub-text"], children: l })
|
|
49
|
+
] }),
|
|
46
50
|
/* @__PURE__ */ r(
|
|
47
51
|
"div",
|
|
48
52
|
{
|
|
49
53
|
className: a(e["checkbox-button-bar__row-container"], {
|
|
50
|
-
[e["checkbox-button-bar__row-container--segmented"]]:
|
|
54
|
+
[e["checkbox-button-bar__row-container--segmented"]]: j
|
|
51
55
|
}),
|
|
52
|
-
children:
|
|
56
|
+
children: j ? u.map(({ label: c, value: o, prefix: b, tooltip: k, tooltipPosition: s, disabled: x }) => /* @__PURE__ */ r(
|
|
53
57
|
"div",
|
|
54
58
|
{
|
|
55
59
|
className: a(e["checkbox-button-bar__row"], {
|
|
56
|
-
[e["checkbox-button-bar__row--not-valid"]]:
|
|
60
|
+
[e["checkbox-button-bar__row--not-valid"]]: p || _
|
|
57
61
|
}),
|
|
58
62
|
children: /* @__PURE__ */ r(
|
|
59
|
-
|
|
63
|
+
F,
|
|
60
64
|
{
|
|
61
|
-
type:
|
|
62
|
-
label:
|
|
63
|
-
prefix:
|
|
64
|
-
tooltip:
|
|
65
|
-
tooltipPosition:
|
|
66
|
-
forceSquared:
|
|
65
|
+
type: t ? "radio" : "checkbox",
|
|
66
|
+
label: c,
|
|
67
|
+
prefix: b,
|
|
68
|
+
tooltip: k,
|
|
69
|
+
tooltipPosition: s,
|
|
70
|
+
forceSquared: v,
|
|
67
71
|
value: o,
|
|
68
|
-
checked:
|
|
69
|
-
disabled:
|
|
70
|
-
onSetValue: (
|
|
72
|
+
checked: i.includes(o),
|
|
73
|
+
disabled: x || f,
|
|
74
|
+
onSetValue: (m) => C(m.target.value)
|
|
71
75
|
}
|
|
72
76
|
)
|
|
73
77
|
},
|
|
@@ -76,21 +80,21 @@ import '../../assets/CheckboxButtonBar.css';const e = {
|
|
|
76
80
|
"div",
|
|
77
81
|
{
|
|
78
82
|
className: a(e["checkbox-button-bar__row"], {
|
|
79
|
-
[e["checkbox-button-bar__row--not-valid"]]:
|
|
83
|
+
[e["checkbox-button-bar__row--not-valid"]]: p || _
|
|
80
84
|
}),
|
|
81
|
-
children:
|
|
82
|
-
|
|
85
|
+
children: u.map(({ label: c, value: o, prefix: b, tooltip: k, tooltipPosition: s, disabled: x }) => /* @__PURE__ */ r(
|
|
86
|
+
F,
|
|
83
87
|
{
|
|
84
|
-
type:
|
|
85
|
-
label:
|
|
86
|
-
prefix:
|
|
87
|
-
tooltip:
|
|
88
|
-
tooltipPosition:
|
|
89
|
-
forceSquared:
|
|
88
|
+
type: t ? "radio" : "checkbox",
|
|
89
|
+
label: c,
|
|
90
|
+
prefix: b,
|
|
91
|
+
tooltip: k,
|
|
92
|
+
tooltipPosition: s,
|
|
93
|
+
forceSquared: v,
|
|
90
94
|
value: o,
|
|
91
|
-
checked:
|
|
92
|
-
disabled:
|
|
93
|
-
onSetValue: (
|
|
95
|
+
checked: i.includes(o),
|
|
96
|
+
disabled: x || f,
|
|
97
|
+
onSetValue: (m) => C(m.target.value)
|
|
94
98
|
},
|
|
95
99
|
o
|
|
96
100
|
))
|
|
@@ -98,13 +102,13 @@ import '../../assets/CheckboxButtonBar.css';const e = {
|
|
|
98
102
|
)
|
|
99
103
|
}
|
|
100
104
|
),
|
|
101
|
-
|
|
102
|
-
_ !== "" && /* @__PURE__ */ r(
|
|
105
|
+
w && /* @__PURE__ */ r("div", { className: e["checkbox-button-bar__sub-text"], children: w }),
|
|
106
|
+
_ !== "" && /* @__PURE__ */ r(D, { level: "error", feedback: _ })
|
|
103
107
|
]
|
|
104
108
|
}
|
|
105
109
|
);
|
|
106
110
|
};
|
|
107
111
|
export {
|
|
108
|
-
|
|
112
|
+
O as CheckboxButtonBar
|
|
109
113
|
};
|
|
110
114
|
//# sourceMappingURL=CheckboxButtonBar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxButtonBar.js","sources":["../../../src/components/CheckboxButtonBar/CheckboxButtonBar.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { ReactNode } from 'react';\n\nimport styles from './CheckboxButtonBar.module.css';\n\nimport { Label } from 'components/Label';\nimport { FeedbackBox } from 'components/FeedbackBox';\nimport { ControlsButton } from 'components/ControlsButton';\n\ntype CheckboxProps = {\n label: string | ReactNode;\n value: string;\n prefix?: string;\n tooltip?: ReactNode;\n tooltipPosition?: 'left' | 'center' | 'right';\n disabled?: boolean;\n};\n\nexport interface CheckboxButtonBarProps {\n /** array with objects with label, value, prefix and disabled*/\n checkboxes: CheckboxProps[];\n //** array with value(s) */\n defaultValues?: string[];\n label?: string;\n /** 'top' | 'left' */\n labelPosition?: 'top' | 'left';\n /** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */\n required?: boolean;\n /** `true` to color border red to show not valid; otherwise, `false`. */\n notValid?: boolean;\n /** error text to display under the bar */\n notValidatedText?: string;\n /** returns an array with only one value */\n actAsRadioButtonBar?: boolean;\n /** optional footer text */\n footerText?: string;\n /** disables all checkboxes in the bar */\n disableGroup?: boolean;\n /** `true` to sepearte each button in their own bordered container */\n segmented?: boolean;\n /** `true` sets forceSquared on all buttons */\n forceSquared?: boolean;\n onSetValues: (value: string[]) => void;\n}\n\nexport const CheckboxButtonBar = ({\n checkboxes,\n defaultValues,\n label,\n labelPosition = 'top',\n required = false,\n notValid = false,\n notValidatedText = '',\n actAsRadioButtonBar = false,\n footerText = '',\n disableGroup = false,\n segmented = false,\n forceSquared = false,\n onSetValues,\n}: CheckboxButtonBarProps) => {\n const [currentValues, setCurrentValues] = useState<string[]>(\n defaultValues && !actAsRadioButtonBar\n ? defaultValues.map(String)\n : defaultValues && actAsRadioButtonBar\n ? defaultValues.slice(0, 1)\n : []\n );\n\n const handleChange = (value: string) => {\n let values = currentValues;\n\n if (actAsRadioButtonBar) {\n setCurrentValues([value]);\n onSetValues([value]);\n } else {\n if (values.includes(value)) {\n values = values.filter((val) => val !== value);\n } else {\n values = [...values, value];\n }\n setCurrentValues(values);\n onSetValues(values);\n }\n };\n\n return (\n <div\n className={clsx(\n styles['checkbox-button-bar__container'],\n styles[`checkbox-button-bar__container--label-${labelPosition}`]\n )}\n >\n {label && (\n <Label htmlFor=\"\" required={required}>\n
|
|
1
|
+
{"version":3,"file":"CheckboxButtonBar.js","sources":["../../../src/components/CheckboxButtonBar/CheckboxButtonBar.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { clsx } from 'clsx';\n\nimport type { ReactNode } from 'react';\n\nimport styles from './CheckboxButtonBar.module.css';\n\nimport { Label } from 'components/Label';\nimport { FeedbackBox } from 'components/FeedbackBox';\nimport { ControlsButton } from 'components/ControlsButton';\n\ntype CheckboxProps = {\n label: string | ReactNode;\n value: string;\n prefix?: string;\n tooltip?: ReactNode;\n tooltipPosition?: 'left' | 'center' | 'right';\n disabled?: boolean;\n};\n\nexport interface CheckboxButtonBarProps {\n /** array with objects with label, value, prefix and disabled*/\n checkboxes: CheckboxProps[];\n //** array with value(s) */\n defaultValues?: string[];\n label?: string;\n /** optional sub-label text (only displayed when label is positioned 'top') */\n subLabel?: string;\n /** 'top' | 'left' */\n labelPosition?: 'top' | 'left';\n /** `true` to show an asterisk to indicate an item is required; otherwise, `false`. */\n required?: boolean;\n /** `true` to color border red to show not valid; otherwise, `false`. */\n notValid?: boolean;\n /** error text to display under the bar */\n notValidatedText?: string;\n /** returns an array with only one value */\n actAsRadioButtonBar?: boolean;\n /** optional footer text */\n footerText?: string;\n /** disables all checkboxes in the bar */\n disableGroup?: boolean;\n /** `true` to sepearte each button in their own bordered container */\n segmented?: boolean;\n /** `true` sets forceSquared on all buttons */\n forceSquared?: boolean;\n onSetValues: (value: string[]) => void;\n}\n\nexport const CheckboxButtonBar = ({\n checkboxes,\n defaultValues,\n label,\n subLabel = '',\n labelPosition = 'top',\n required = false,\n notValid = false,\n notValidatedText = '',\n actAsRadioButtonBar = false,\n footerText = '',\n disableGroup = false,\n segmented = false,\n forceSquared = false,\n onSetValues,\n}: CheckboxButtonBarProps) => {\n const [currentValues, setCurrentValues] = useState<string[]>(\n defaultValues && !actAsRadioButtonBar\n ? defaultValues.map(String)\n : defaultValues && actAsRadioButtonBar\n ? defaultValues.slice(0, 1)\n : []\n );\n\n const handleChange = (value: string) => {\n let values = currentValues;\n\n if (actAsRadioButtonBar) {\n setCurrentValues([value]);\n onSetValues([value]);\n } else {\n if (values.includes(value)) {\n values = values.filter((val) => val !== value);\n } else {\n values = [...values, value];\n }\n setCurrentValues(values);\n onSetValues(values);\n }\n };\n\n return (\n <div\n className={clsx(\n styles['checkbox-button-bar__container'],\n styles[`checkbox-button-bar__container--label-${labelPosition}`]\n )}\n >\n {(label || subLabel) && (\n <div>\n {label && (\n <Label htmlFor=\"\" required={required}>\n {label}\n </Label>\n )}\n\n {subLabel && labelPosition === 'top' && (\n <div className={styles['checkbox-button-bar__sub-text']}>{subLabel}</div>\n )}\n </div>\n )}\n\n <div\n className={clsx(styles['checkbox-button-bar__row-container'], {\n [styles['checkbox-button-bar__row-container--segmented']]: segmented,\n })}\n >\n {segmented ? (\n checkboxes.map(({ label, value, prefix, tooltip, tooltipPosition, disabled }) => (\n <div\n key={value}\n className={clsx(styles['checkbox-button-bar__row'], {\n [styles['checkbox-button-bar__row--not-valid']]: notValid || notValidatedText,\n })}\n >\n <ControlsButton\n type={actAsRadioButtonBar ? 'radio' : 'checkbox'}\n label={label}\n prefix={prefix}\n tooltip={tooltip}\n tooltipPosition={tooltipPosition}\n forceSquared={forceSquared}\n value={value}\n checked={currentValues.includes(value)}\n disabled={disabled || disableGroup}\n onSetValue={(event) => handleChange(event.target.value)}\n />\n </div>\n ))\n ) : (\n <div\n className={clsx(styles['checkbox-button-bar__row'], {\n [styles['checkbox-button-bar__row--not-valid']]: notValid || notValidatedText,\n })}\n >\n {checkboxes.map(({ label, value, prefix, tooltip, tooltipPosition, disabled }) => (\n <ControlsButton\n key={value}\n type={actAsRadioButtonBar ? 'radio' : 'checkbox'}\n label={label}\n prefix={prefix}\n tooltip={tooltip}\n tooltipPosition={tooltipPosition}\n forceSquared={forceSquared}\n value={value}\n checked={currentValues.includes(value)}\n disabled={disabled || disableGroup}\n onSetValue={(event) => handleChange(event.target.value)}\n />\n ))}\n </div>\n )}\n </div>\n\n {footerText && <div className={styles['checkbox-button-bar__sub-text']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n );\n};\n"],"names":["CheckboxButtonBar","checkboxes","defaultValues","label","subLabel","labelPosition","required","notValid","notValidatedText","actAsRadioButtonBar","footerText","disableGroup","segmented","forceSquared","onSetValues","currentValues","setCurrentValues","useState","handleChange","value","values","val","jsxs","clsx","styles","jsx","Label","prefix","tooltip","tooltipPosition","disabled","ControlsButton","event","FeedbackBox"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxButtonBar.stories.js","sources":["../../../src/components/CheckboxButtonBar/CheckboxButtonBar.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CheckboxButtonBarProps } from './CheckboxButtonBar';\n\nimport { CheckboxButtonBar } from './CheckboxButtonBar';\n\nimport { Periods } from 'components/Periods';\n\nconst codeString =\n '<CheckboxButtonBar checkboxes={} defaultValues={} label={} labelPosition={} required={} notValidatedText={} disableGroup={} onSetValues={} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Molecules/CheckboxButtonBar',\n component: CheckboxButtonBar,\n argTypes: {\n checkboxes: {\n table: {\n disable: true,\n },\n },\n defaultValues: {\n table: {\n disable: true,\n },\n },\n label: {\n control: 'text',\n },\n labelPosition: {\n control: 'radio',\n options: ['top', 'left'],\n },\n required: {\n control: 'boolean',\n },\n notValidatedText: {\n control: 'text',\n },\n disableGroup: {\n control: 'boolean',\n },\n actAsRadioButtonBar: {\n control: 'boolean',\n },\n onSetValues: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: CheckboxButtonBar,\n codeString: codeString,\n },\n} as Meta<CheckboxButtonBarProps>;\n\nconst Template: StoryFn<CheckboxButtonBarProps> = (args) => <CheckboxButtonBar {...args} />;\n\nexport const CheckboxButtonBarExample = Template.bind({});\nCheckboxButtonBarExample.args = {\n label: 'Periode',\n required: true,\n checkboxes: [\n {\n label: '1.1',\n value: '1',\n },\n {\n label: '1.2',\n value: '2',\n },\n {\n label: '1.3',\n value: '3',\n },\n {\n label: '4',\n value: '4',\n },\n {\n label: '5',\n value: '5',\n },\n {\n label: '6',\n value: '6',\n },\n ],\n defaultValues: ['1', '2'],\n labelPosition: 'top',\n footerText: 'Weken in periode 2',\n onSetValues: fn(),\n};\n\nexport const AsRadioButtonBar = Template.bind({});\nAsRadioButtonBar.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n },\n {\n label: '2',\n value: '2',\n },\n {\n label: '3',\n value: '3',\n },\n {\n label: '4',\n value: '4',\n },\n {\n label: '5',\n value: '5',\n },\n {\n label: '6',\n value: '6',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: true,\n onSetValues: fn(),\n};\n\nexport const WithPrefix = Template.bind({});\nWithPrefix.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n prefix: '13',\n },\n {\n label: '2',\n value: '2',\n prefix: '14',\n },\n {\n label: '3',\n value: '3',\n prefix: '15',\n },\n {\n label: '4',\n value: '4',\n prefix: '16',\n },\n {\n label: '5',\n value: '5',\n prefix: '17',\n },\n {\n label: '6',\n value: '6',\n prefix: '18',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n onSetValues: fn(),\n};\n\nexport const WithTooltip = Template.bind({});\nWithTooltip.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n prefix: '36',\n tooltip: (\n <>\n 1 sept - 5 sept\n <br />\n 2025\n </>\n ),\n tooltipPosition: 'left',\n },\n {\n label: '2',\n value: '2',\n prefix: '37',\n tooltip: (\n <>\n 8 sept - 12 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '3',\n value: '3',\n prefix: '38',\n tooltip: (\n <>\n 15 sept - 19 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '4',\n value: '4',\n prefix: '39',\n tooltip: (\n <>\n 22 sept - 26 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '5',\n value: '5',\n prefix: '40',\n tooltip: (\n <>\n 29 sept - 3 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '6',\n value: '6',\n prefix: '41',\n tooltip: (\n <>\n 6 okt - 10 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '7',\n value: '7',\n prefix: '42',\n tooltip: (\n <>\n 13 okt - 17 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '8',\n value: '8',\n prefix: '43',\n tooltip: (\n <>\n 20 okt - 24 okt\n <br />\n 2025\n </>\n ),\n tooltipPosition: 'right',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n onSetValues: fn(),\n};\n\nexport const Segmented = Template.bind({});\nSegmented.args = {\n label: 'Year(s)',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n tooltip: <>2023 - 2024</>,\n tooltipPosition: 'left',\n },\n {\n label: '2',\n value: '2',\n tooltip: <>2025 - 2026</>,\n },\n {\n label: '3',\n value: '3',\n tooltip: <>2026 - 2027</>,\n },\n {\n label: '4',\n value: '4',\n tooltip: <>2027 - 2028</>,\n tooltipPosition: 'right',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n segmented: true,\n onSetValues: fn(),\n};\n\nexport const WithPeriods = Template.bind({});\nWithPeriods.args = {\n label: 'Aanbieding',\n required: true,\n checkboxes: [\n {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n label: <Periods periods={[1, 2]} />,\n value: '1',\n },\n {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n label: <Periods periods={[2, 3]} />,\n value: '2',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n segmented: true,\n onSetValues: fn(),\n};\n"],"names":["codeString","CheckboxButtonBar_stories","CheckboxButtonBar","Template","args","jsx","CheckboxButtonBarExample","fn","AsRadioButtonBar","WithPrefix","WithTooltip","jsxs","Fragment","Segmented","WithPeriods","Periods"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CheckboxButtonBar.stories.js","sources":["../../../src/components/CheckboxButtonBar/CheckboxButtonBar.stories.tsx"],"sourcesContent":["import { fn } from 'storybook/test';\n\nimport type { Meta, StoryFn } from '@storybook/react';\nimport type { CheckboxButtonBarProps } from './CheckboxButtonBar';\n\nimport { CheckboxButtonBar } from './CheckboxButtonBar';\n\nimport { Periods } from 'components/Periods';\n\nconst codeString =\n '<CheckboxButtonBar checkboxes={} defaultValues={} label={} labelPosition={} required={} notValidatedText={} disableGroup={} onSetValues={} />';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n title: 'Molecules/CheckboxButtonBar',\n component: CheckboxButtonBar,\n argTypes: {\n checkboxes: {\n table: {\n disable: true,\n },\n },\n defaultValues: {\n table: {\n disable: true,\n },\n },\n label: {\n control: 'text',\n },\n labelPosition: {\n control: 'radio',\n options: ['top', 'left'],\n },\n required: {\n control: 'boolean',\n },\n notValidatedText: {\n control: 'text',\n },\n disableGroup: {\n control: 'boolean',\n },\n actAsRadioButtonBar: {\n control: 'boolean',\n },\n onSetValues: {\n table: {\n disable: true,\n },\n },\n },\n parameters: {\n inspectComponent: CheckboxButtonBar,\n codeString: codeString,\n },\n} as Meta<CheckboxButtonBarProps>;\n\nconst Template: StoryFn<CheckboxButtonBarProps> = (args) => <CheckboxButtonBar {...args} />;\n\nexport const CheckboxButtonBarExample = Template.bind({});\nCheckboxButtonBarExample.args = {\n label: 'Periode',\n required: true,\n checkboxes: [\n {\n label: '1.1',\n value: '1',\n },\n {\n label: '1.2',\n value: '2',\n },\n {\n label: '1.3',\n value: '3',\n },\n {\n label: '4',\n value: '4',\n },\n {\n label: '5',\n value: '5',\n },\n {\n label: '6',\n value: '6',\n },\n ],\n defaultValues: ['1', '2'],\n labelPosition: 'top',\n subLabel: 'Selecteer een week',\n footerText: 'Weken in periode 2',\n onSetValues: fn(),\n};\n\nexport const AsRadioButtonBar = Template.bind({});\nAsRadioButtonBar.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n },\n {\n label: '2',\n value: '2',\n },\n {\n label: '3',\n value: '3',\n },\n {\n label: '4',\n value: '4',\n },\n {\n label: '5',\n value: '5',\n },\n {\n label: '6',\n value: '6',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: true,\n onSetValues: fn(),\n};\n\nexport const WithPrefix = Template.bind({});\nWithPrefix.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n prefix: '13',\n },\n {\n label: '2',\n value: '2',\n prefix: '14',\n },\n {\n label: '3',\n value: '3',\n prefix: '15',\n },\n {\n label: '4',\n value: '4',\n prefix: '16',\n },\n {\n label: '5',\n value: '5',\n prefix: '17',\n },\n {\n label: '6',\n value: '6',\n prefix: '18',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n onSetValues: fn(),\n};\n\nexport const WithTooltip = Template.bind({});\nWithTooltip.args = {\n label: 'Weken',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n prefix: '36',\n tooltip: (\n <>\n 1 sept - 5 sept\n <br />\n 2025\n </>\n ),\n tooltipPosition: 'left',\n },\n {\n label: '2',\n value: '2',\n prefix: '37',\n tooltip: (\n <>\n 8 sept - 12 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '3',\n value: '3',\n prefix: '38',\n tooltip: (\n <>\n 15 sept - 19 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '4',\n value: '4',\n prefix: '39',\n tooltip: (\n <>\n 22 sept - 26 sept\n <br />\n 2025\n </>\n ),\n },\n {\n label: '5',\n value: '5',\n prefix: '40',\n tooltip: (\n <>\n 29 sept - 3 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '6',\n value: '6',\n prefix: '41',\n tooltip: (\n <>\n 6 okt - 10 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '7',\n value: '7',\n prefix: '42',\n tooltip: (\n <>\n 13 okt - 17 okt\n <br />\n 2025\n </>\n ),\n },\n {\n label: '8',\n value: '8',\n prefix: '43',\n tooltip: (\n <>\n 20 okt - 24 okt\n <br />\n 2025\n </>\n ),\n tooltipPosition: 'right',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n onSetValues: fn(),\n};\n\nexport const Segmented = Template.bind({});\nSegmented.args = {\n label: 'Year(s)',\n required: true,\n checkboxes: [\n {\n label: '1',\n value: '1',\n tooltip: <>2023 - 2024</>,\n tooltipPosition: 'left',\n },\n {\n label: '2',\n value: '2',\n tooltip: <>2025 - 2026</>,\n },\n {\n label: '3',\n value: '3',\n tooltip: <>2026 - 2027</>,\n },\n {\n label: '4',\n value: '4',\n tooltip: <>2027 - 2028</>,\n tooltipPosition: 'right',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n segmented: true,\n onSetValues: fn(),\n};\n\nexport const WithPeriods = Template.bind({});\nWithPeriods.args = {\n label: 'Aanbieding',\n required: true,\n checkboxes: [\n {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n label: <Periods periods={[1, 2]} />,\n value: '1',\n },\n {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n label: <Periods periods={[2, 3]} />,\n value: '2',\n },\n ],\n defaultValues: ['1'],\n labelPosition: 'top',\n actAsRadioButtonBar: false,\n segmented: true,\n onSetValues: fn(),\n};\n"],"names":["codeString","CheckboxButtonBar_stories","CheckboxButtonBar","Template","args","jsx","CheckboxButtonBarExample","fn","AsRadioButtonBar","WithPrefix","WithTooltip","jsxs","Fragment","Segmented","WithPeriods","Periods"],"mappings":"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"}
|
|
@@ -18,7 +18,7 @@ import "../IconButton/IconButton.js";
|
|
|
18
18
|
import "../Input/Input.js";
|
|
19
19
|
import "../InputField/InputField.js";
|
|
20
20
|
import "react-router";
|
|
21
|
-
import "../../TablePlugin-
|
|
21
|
+
import "../../TablePlugin-BlXaQ0U6.js";
|
|
22
22
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
23
23
|
import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
24
24
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as d, jsxs as y } from "react/jsx-runtime";
|
|
2
2
|
import { s as O, f as _ } from "../../index-Cfzi-sRQ.js";
|
|
3
|
-
import { I as C, a as v } from "../../chunk-
|
|
3
|
+
import { I as C, a as v } from "../../chunk-MDLQUVZN-BSRMHXbx.js";
|
|
4
4
|
import { useState as R } from "react";
|
|
5
5
|
import { CheckboxTree as u } from "./CheckboxTree.js";
|
|
6
6
|
import { Chip as w } from "../Chip/Chip.js";
|
|
@@ -17,7 +17,7 @@ import "../IconButton/IconButton.js";
|
|
|
17
17
|
import "../Input/Input.js";
|
|
18
18
|
import "../InputField/InputField.js";
|
|
19
19
|
import "react-router";
|
|
20
|
-
import "../../TablePlugin-
|
|
20
|
+
import "../../TablePlugin-BlXaQ0U6.js";
|
|
21
21
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
22
22
|
import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
23
23
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
@@ -17,7 +17,7 @@ import "../GridRow/GridRow.js";
|
|
|
17
17
|
import "../IconButton/IconButton.js";
|
|
18
18
|
import "../Input/Input.js";
|
|
19
19
|
import "react-router";
|
|
20
|
-
import "../../TablePlugin-
|
|
20
|
+
import "../../TablePlugin-BlXaQ0U6.js";
|
|
21
21
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
22
22
|
import "../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
23
23
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs as S, jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { f as d } from "../../index-Cfzi-sRQ.js";
|
|
3
3
|
import { useState as p } from "react";
|
|
4
|
-
import { M as e } from "../../TablePlugin-
|
|
4
|
+
import { M as e } from "../../TablePlugin-BlXaQ0U6.js";
|
|
5
5
|
import { Container as M } from "../../storyComponents/Container/Container.js";
|
|
6
6
|
const C = `
|
|
7
7
|
// MultiSelectHeader can be added optionally
|
|
@@ -16,7 +16,7 @@ import "../../IconButton/IconButton.js";
|
|
|
16
16
|
import "../../Input/Input.js";
|
|
17
17
|
import "../../InputField/InputField.js";
|
|
18
18
|
import "react-router";
|
|
19
|
-
import { a as C } from "../../../TablePlugin-
|
|
19
|
+
import { a as C } from "../../../TablePlugin-BlXaQ0U6.js";
|
|
20
20
|
import "../../RteEditor/Providers/LanguageProvider.js";
|
|
21
21
|
import "../../RteEditor/Plugins/LinkPlugin/LinkContextMenu/LinkContextMenu.js";
|
|
22
22
|
import "../../RteEditor/hooks/components/Flyout.js";
|
|
@@ -1,70 +1,70 @@
|
|
|
1
1
|
import { jsxs as o, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { OverlayProvider as P } from "@react-aria/overlays";
|
|
3
|
-
import { useState as
|
|
4
|
-
import { PageOverlay as
|
|
5
|
-
import { Button as
|
|
3
|
+
import q, { useState as V, useRef as C, useEffect as $, useReducer as E, useCallback as d } from "react";
|
|
4
|
+
import { PageOverlay as p } from "./PageOverlay.js";
|
|
5
|
+
import { Button as u } from "../Buttons/Button.js";
|
|
6
6
|
import "../Buttons/LinkButton.js";
|
|
7
7
|
import "@react-aria/button";
|
|
8
8
|
import { ButtonGroup as O } from "../ButtonGroup/ButtonGroup.js";
|
|
9
|
-
import { InputField as
|
|
10
|
-
import { GridRow as
|
|
11
|
-
import { Repeater as
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
9
|
+
import { InputField as j } from "../InputField/InputField.js";
|
|
10
|
+
import { GridRow as m } from "../GridRow/GridRow.js";
|
|
11
|
+
import { Repeater as I } from "../Repeater/Repeater.js";
|
|
12
|
+
var v;
|
|
13
|
+
const M = typeof document < "u" ? (v = q.useInsertionEffect) !== null && v !== void 0 ? v : q.useLayoutEffect : () => {
|
|
14
|
+
};
|
|
15
|
+
function R(t, a, i) {
|
|
16
|
+
let [s, f] = V(t || a), n = C(s), g = C(t !== void 0), r = t !== void 0;
|
|
17
|
+
$(() => {
|
|
18
|
+
let l = g.current;
|
|
19
|
+
l !== r && process.env.NODE_ENV !== "production" && console.warn(`WARN: A component changed from ${l ? "controlled" : "uncontrolled"} to ${r ? "controlled" : "uncontrolled"}.`), g.current = r;
|
|
17
20
|
}, [
|
|
18
|
-
|
|
21
|
+
r
|
|
19
22
|
]);
|
|
20
|
-
let
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
})) : (a || c(u), q(u, ...h));
|
|
23
|
+
let h = r ? t : s;
|
|
24
|
+
M(() => {
|
|
25
|
+
n.current = h;
|
|
26
|
+
});
|
|
27
|
+
let [, x] = E(() => ({}), {}), A = d((l, ...N) => {
|
|
28
|
+
let c = typeof l == "function" ? l(n.current) : l;
|
|
29
|
+
Object.is(n.current, c) || (n.current = c, f(c), x(), i?.(c, ...N));
|
|
28
30
|
}, [
|
|
29
|
-
a,
|
|
30
|
-
l,
|
|
31
31
|
i
|
|
32
32
|
]);
|
|
33
33
|
return [
|
|
34
|
-
|
|
35
|
-
|
|
34
|
+
h,
|
|
35
|
+
A
|
|
36
36
|
];
|
|
37
37
|
}
|
|
38
|
-
function
|
|
39
|
-
let [
|
|
40
|
-
const
|
|
38
|
+
function y(t) {
|
|
39
|
+
let [a, i] = R(t.isOpen, t.defaultOpen || !1, t.onOpenChange);
|
|
40
|
+
const s = d(() => {
|
|
41
41
|
i(!0);
|
|
42
42
|
}, [
|
|
43
43
|
i
|
|
44
|
-
]),
|
|
44
|
+
]), f = d(() => {
|
|
45
45
|
i(!1);
|
|
46
46
|
}, [
|
|
47
47
|
i
|
|
48
|
-
]),
|
|
49
|
-
i(!
|
|
48
|
+
]), n = d(() => {
|
|
49
|
+
i(!a);
|
|
50
50
|
}, [
|
|
51
51
|
i,
|
|
52
|
-
|
|
52
|
+
a
|
|
53
53
|
]);
|
|
54
54
|
return {
|
|
55
|
-
isOpen:
|
|
55
|
+
isOpen: a,
|
|
56
56
|
setOpen: i,
|
|
57
|
-
open:
|
|
58
|
-
close:
|
|
59
|
-
toggle:
|
|
57
|
+
open: s,
|
|
58
|
+
close: f,
|
|
59
|
+
toggle: n
|
|
60
60
|
};
|
|
61
61
|
}
|
|
62
|
-
const
|
|
62
|
+
const T = `
|
|
63
63
|
<PageOverlay isOpen={isOpen} title={title} onClose={onCloseFunction}
|
|
64
64
|
onSubmit={onSubmitFunction} buttons={buttons}> {children} </PageOverlay>
|
|
65
|
-
`,
|
|
65
|
+
`, H = {
|
|
66
66
|
title: "Molecules/PageOverlay",
|
|
67
|
-
component:
|
|
67
|
+
component: p,
|
|
68
68
|
argTypes: {
|
|
69
69
|
isOpen: {
|
|
70
70
|
table: {
|
|
@@ -91,62 +91,62 @@ const k = `
|
|
|
91
91
|
}
|
|
92
92
|
},
|
|
93
93
|
parameters: {
|
|
94
|
-
inspectComponent:
|
|
95
|
-
codeString:
|
|
94
|
+
inspectComponent: p,
|
|
95
|
+
codeString: T
|
|
96
96
|
}
|
|
97
|
-
},
|
|
98
|
-
const { open:
|
|
97
|
+
}, S = (t) => {
|
|
98
|
+
const { open: a, close: i, isOpen: s } = y({});
|
|
99
99
|
return /* @__PURE__ */ o(P, { children: [
|
|
100
|
-
/* @__PURE__ */ e(
|
|
100
|
+
/* @__PURE__ */ e(u, { variant: "primary", onClick: () => a(), children: "Open PageOverlay" }),
|
|
101
101
|
/* @__PURE__ */ e(
|
|
102
|
-
|
|
102
|
+
p,
|
|
103
103
|
{
|
|
104
104
|
...t,
|
|
105
|
-
isOpen:
|
|
105
|
+
isOpen: s,
|
|
106
106
|
buttons: /* @__PURE__ */ o(O, { reversed: !0, children: [
|
|
107
|
-
/* @__PURE__ */ e(
|
|
108
|
-
/* @__PURE__ */ e(
|
|
107
|
+
/* @__PURE__ */ e(u, { variant: "primary", onClick: () => i(), children: "OK" }),
|
|
108
|
+
/* @__PURE__ */ e(u, { variant: "secondary", onClick: () => i(), children: "Cancel" })
|
|
109
109
|
] }),
|
|
110
110
|
onClose: () => i(),
|
|
111
111
|
children: "Your content goes here"
|
|
112
112
|
}
|
|
113
113
|
)
|
|
114
114
|
] });
|
|
115
|
-
},
|
|
115
|
+
}, b = {
|
|
116
116
|
title: "Example Title",
|
|
117
117
|
closeButtonAriaValueText: "Close",
|
|
118
118
|
noValidate: !1
|
|
119
|
-
},
|
|
120
|
-
|
|
121
|
-
...
|
|
119
|
+
}, L = S.bind({});
|
|
120
|
+
L.args = {
|
|
121
|
+
...b
|
|
122
122
|
};
|
|
123
|
-
const
|
|
124
|
-
|
|
125
|
-
...
|
|
123
|
+
const k = S.bind({});
|
|
124
|
+
k.args = {
|
|
125
|
+
...b,
|
|
126
126
|
isLoading: !0,
|
|
127
127
|
spinnerAriaValueText: "Loading"
|
|
128
128
|
};
|
|
129
129
|
const D = (t) => {
|
|
130
|
-
const { open:
|
|
130
|
+
const { open: a, close: i, isOpen: s } = y({});
|
|
131
131
|
return /* @__PURE__ */ o(P, { children: [
|
|
132
|
-
/* @__PURE__ */ e(
|
|
132
|
+
/* @__PURE__ */ e(u, { variant: "primary", onClick: () => a(), children: "Open PageOverlay" }),
|
|
133
133
|
/* @__PURE__ */ e(
|
|
134
|
-
|
|
134
|
+
p,
|
|
135
135
|
{
|
|
136
136
|
...t,
|
|
137
|
-
isOpen:
|
|
138
|
-
buttons: /* @__PURE__ */ e(
|
|
139
|
-
/* @__PURE__ */ e(
|
|
140
|
-
/* @__PURE__ */ e(
|
|
137
|
+
isOpen: s,
|
|
138
|
+
buttons: /* @__PURE__ */ e(m, { children: /* @__PURE__ */ e(m.Column, { size: "8", mediumSize: "9", startPositon: "2", mediumStartPosition: "3", children: /* @__PURE__ */ o(O, { reversed: !0, children: [
|
|
139
|
+
/* @__PURE__ */ e(u, { variant: "primary", onClick: () => i(), children: "OK" }),
|
|
140
|
+
/* @__PURE__ */ e(u, { variant: "secondary", onClick: () => i(), children: "Cancel" })
|
|
141
141
|
] }) }) }),
|
|
142
142
|
onClose: () => i(),
|
|
143
|
-
children: /* @__PURE__ */ e(
|
|
143
|
+
children: /* @__PURE__ */ e(m, { marginTop: "100", children: /* @__PURE__ */ e(m.Column, { size: "8", mediumSize: "9", startPositon: "2", mediumStartPosition: "3", children: /* @__PURE__ */ o(I, { gap: "100", children: [
|
|
144
144
|
/* @__PURE__ */ e("div", { children: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac dui et nibh eleifend ultricies a id nulla. Pellentesque eleifend sem a tellus dictum tempus. Proin non leo id risus placerat vulputate at ac erat. Ut fringilla imperdiet sollicitudin. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Gijs molestie ante ac magna ornare rhoncus non at quam. Mauris elementum luctus euismod. Pellentesque molestie malesuada purus, sed egestas lacus interdum sit amet. Morbi blandit lacus sit amet dictum pulvinar. Ut semper nunc ac enim imperdiet, non interdum diam gravida. In nunc tortor, mollis ac molestie dignissim, elementum sed quam. Suspendisse mollis venenatis Laura, pellentesque vestibulum elit consequat et. Aliquam fringilla tellus id libero tempus, sit amet suscipit augue tristique. Quisque cursus neque vel justo tristique, eget semper turpis elementum. Etiam venenatis mattis sapien ac mattis. Mauris vitae ultrices erat." }),
|
|
145
145
|
/* @__PURE__ */ e("div", { children: "Aliquam facilisis massa sed justo rhoncus bibendum. Sed lobortis urna orci, vitae porta leo placerat nec. Nam porta porttitor ornare. Suspendisse vehicula nunc nec egestas finibus. Aliquam non luctus risus. Pien ac diam tincidunt, bibendum sem eget, sollicitudin neque. Curabitur mauris risus, feugiat ac euismod non, vulputate ac justo. Curabitur pretium vehicula augue, blandit porta odio rutrum sit amet. Proin semper enim ut sapien tempor, a ornare ipsum faucibus." }),
|
|
146
|
-
/* @__PURE__ */ e(
|
|
146
|
+
/* @__PURE__ */ e(u, { variant: "primary", children: "Test Button" }),
|
|
147
147
|
/* @__PURE__ */ e("div", { children: "Cras bibendum arcu vitae nulla venenatis, at cursus urna dapibus. In hac habitasse platea dictumst. In porttitor at lectus nec rhoncus. In hac habitasse platea dictumst. Sed nec lectus neque. Aliquam erat volutpat. Morbi elit orci, ultricies a porttitor eget, eleifend eu metus. Maarten sollicitudin vitae massa a tempor. Aliquam dignissim metus id sem sollicitudin, eget lacinia nulla imperdiet. Nullam nec vestibulum eros, ut aliquam libero. Nulla hendrerit cursus ante id auctor. Curabitur condimentum malesuada maximus. Aliquam felis diam, gravida nec eleifend quis, placerat et orci." }),
|
|
148
148
|
/* @__PURE__ */ e("div", { children: "Nulla leo ligula, hendrerit vel egestas in, suscipit vitae erat. Vivamus interdum quam lacinia, egestas felis non, volutpat velit. Vestibulum orci diam, tincidunt ac mattis quis, ornare posuere magna. Aliquam erat volutpat. Maecenas facilisis lacus id ante efficitur, non dignissim lorem suscipit. Praesent at posuere velit. Nulla imperdiet, dui rhoncus volutpat feugiat, eros mauris cursus justo, a tincidunt ipsum ipsum eu nisl. Nulla eu dui Thierry. Aliquam vitae risus ut velit fringilla sodales nec id lacus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Suspendisse ullamcorper purus quis nunc placerat, vel bibendum urna mollis. Nulla facilisi. Phasellus sed erat nec ex ullamcorper viverra. Phasellus convallis nibh sed dolor vulputate convallis. Phasellus ac posuere sapien, et elementum ipsum." }),
|
|
149
|
-
/* @__PURE__ */ e(
|
|
149
|
+
/* @__PURE__ */ e(j, { id: "test-input", placeholder: "Test Input" }),
|
|
150
150
|
/* @__PURE__ */ e("div", { children: "Sed malesuada ut nulla ut maximus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morten in libero rhoncus, maximus tortor sit amet, molestie ex. Mauris rhoncus et erat dapibus aliquam. Vestibulum placerat quam eget lorem tempor, vel venenatis lorem malesuada. Duis ut venenatis arcu. Cras lacinia mi ac dui sollicitudin semper sit amet eget nisl. Fusce viverra ex eget tortor molestie dictum. Cras ullamcorper faucibus nisi in congue. Sanne in tristique est. Praesent id rhoncus ligula, ut porta dui. Sed tincidunt, mi nec varius auctor, nunc diam venenatis felis, at facilisis tortor sem et magna. Aliquam erat volutpat." }),
|
|
151
151
|
/* @__PURE__ */ e("div", { children: "Proin ipsum ante, auctor id consectetur a, pulvinar id nibh. Phasellus molestie quam eu mi lacinia condimentum. Nullam fermentum id diam eu pharetra. Donec dictum sem vitae Jos scelerisque semper. Suspendisse sed facilisis orci. Sed ut scelerisque odio. Curabitur felis felis, finibus ac orci at, pellentesque efficitur risus. Sed et leo ac orci mollis tincidunt et pulvinar velit. Duis non nibh tincidunt, lacinia urna a, fringilla augue. Benjamin fermentum, massa a mollis cursus, ex dui tincidunt tellus, ut sollicitudin ex neque ac sapien." }),
|
|
152
152
|
/* @__PURE__ */ e("div", { children: "Nunc rhoncus imperdiet leo. Fusce interdum malesuada aliquet. Aenean porttitor, tortor et volutpat blandit, sapien diam scelerisque massa, ac facilisis metus turpis id quam. Donec ac elementum augue, congue pulvinar arcu. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras tempor convallis elit, id vehicula Robin semper nec. Sed ut ultrices nulla. Cras nec dolor justo. Proin mollis mauris ligula, luctus faucibus dolor ultrices ac. Nunc quis mauris fringilla, pellentesque massa nec, dictum metus. Praesent odio ligula, tincidunt ultrices maximus quis, accumsan ut odio. Nullam iaculis molestie nulla quis ultrices. Praesent quam velit, sagittis eget auctor a, dignissim ut massa. Donec mollis at lorem sit amet accumsan. Praesent nec nulla laoreet nunc pretium egestas. Malesuada Wim arcu pharetra, dictum nibh a, facilisis risus." })
|
|
@@ -154,14 +154,14 @@ const D = (t) => {
|
|
|
154
154
|
}
|
|
155
155
|
)
|
|
156
156
|
] });
|
|
157
|
-
},
|
|
158
|
-
|
|
159
|
-
...
|
|
157
|
+
}, _ = D.bind({});
|
|
158
|
+
_.args = {
|
|
159
|
+
...b
|
|
160
160
|
};
|
|
161
161
|
export {
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
162
|
+
k as Loading,
|
|
163
|
+
L as PageOverlayExample,
|
|
164
|
+
_ as WithLongComplexContent,
|
|
165
|
+
H as default
|
|
166
166
|
};
|
|
167
167
|
//# sourceMappingURL=PageOverlay.stories.js.map
|