@uva-glass/component-library 3.52.7 → 3.52.9

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.
Files changed (62) hide show
  1. package/dist/assets/Backdrop.css +1 -1
  2. package/dist/assets/Card.css +1 -1
  3. package/dist/assets/Column.css +1 -1
  4. package/dist/assets/ControlsButton.css +1 -1
  5. package/dist/assets/Drawer.css +1 -1
  6. package/dist/assets/IconButton.css +1 -1
  7. package/dist/assets/ModalDialog.css +1 -1
  8. package/dist/assets/OverlayCloseButton.css +1 -1
  9. package/dist/assets/OverlayStepBar.css +1 -1
  10. package/dist/assets/PageOverlay.css +1 -1
  11. package/dist/assets/Spinner.css +1 -1
  12. package/dist/assets/Tooltip.css +1 -1
  13. package/dist/chunk-RW5PKMWM-Dn7TLZUE.js +11292 -0
  14. package/dist/chunk-RW5PKMWM-Dn7TLZUE.js.map +1 -0
  15. package/dist/client-CFLMKOFW.js.map +1 -1
  16. package/dist/components/Buttons/Button.stories.js +8 -8
  17. package/dist/components/Buttons/LinkButton.stories.js +10 -10
  18. package/dist/components/Buttons/MenuButton.stories.js +14 -14
  19. package/dist/components/Checkbox/Checkbox.stories.js +1 -1
  20. package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.d.ts +1 -0
  21. package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js +36 -12
  22. package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js.map +1 -1
  23. package/dist/components/CheckboxTree/CheckboxTree.stories.js +57 -114
  24. package/dist/components/CheckboxTree/CheckboxTree.stories.js.map +1 -1
  25. package/dist/components/Chip/Chip.stories.js +5 -5
  26. package/dist/components/ControlsButton/ControlsButton.js +50 -47
  27. package/dist/components/ControlsButton/ControlsButton.js.map +1 -1
  28. package/dist/components/ControlsButton/ControlsButton.stories.js +1 -1
  29. package/dist/components/Drawer/Drawer.stories.js +9 -9
  30. package/dist/components/FormInput/FormInput.stories.js +1 -1
  31. package/dist/components/IconButton/IconButton.stories.js +5 -5
  32. package/dist/components/InputField/InputField.stories.js +11 -11
  33. package/dist/components/ModalDialog/ModalDialog.stories.js +12 -12
  34. package/dist/components/MultiSelect/MultiSelect.stories.js +1 -1
  35. package/dist/components/MultiSelectBox/MultiSelectBox.stories.js +15 -15
  36. package/dist/components/Notification/Notification.stories.js +8 -8
  37. package/dist/components/OverlayCloseButton/OverlayCloseButton.stories.js +4 -4
  38. package/dist/components/PeriodSelector/PeriodSelector.stories.js +4 -4
  39. package/dist/components/Periods/Periods.js +2 -1
  40. package/dist/components/Periods/Periods.js.map +1 -1
  41. package/dist/components/RadioGroup/RadioGroup.stories.js +1 -1
  42. package/dist/components/RadioTabSelector/RadioTabSelector.stories.js +1 -1
  43. package/dist/components/SelectListbox/SelectListBox.stories.js +1 -1
  44. package/dist/components/Sortable/Sortable.stories.js +1 -1
  45. package/dist/components/TextArea/TextArea.stories.js +3 -3
  46. package/dist/components/TextArea/TextArea.test.js +8 -8
  47. package/dist/components/TextArea/TextArea.test.js.map +1 -1
  48. package/dist/components/ToggleSwitch/ToggleSwitch.stories.js +1 -1
  49. package/dist/components/VarIndicator/VarIndicator.stories.js +1 -1
  50. package/dist/index-DGI4ZxSQ.js +24456 -0
  51. package/dist/index-DGI4ZxSQ.js.map +1 -0
  52. package/dist/react-18-C6foUf2n.js +42 -0
  53. package/dist/react-18-C6foUf2n.js.map +1 -0
  54. package/dist/storybook__react.d.js +7466 -7955
  55. package/dist/storybook__react.d.js.map +1 -1
  56. package/package.json +18 -18
  57. package/dist/index-BJRrLdmi.js +0 -34071
  58. package/dist/index-BJRrLdmi.js.map +0 -1
  59. package/dist/index-fdIFY6eP.js +0 -11566
  60. package/dist/index-fdIFY6eP.js.map +0 -1
  61. package/dist/react-18-CJB15f47.js +0 -38
  62. package/dist/react-18-CJB15f47.js.map +0 -1
@@ -1,71 +1,74 @@
1
- import { jsxs as c, Fragment as w, jsx as o } from "react/jsx-runtime";
2
- import { useId as g } from "react";
3
- import { c as b } from "../../clsx-OuTLNxxd.js";
4
- import { Icon as I } from "../Icon/Icon.js";
5
- import '../../assets/ControlsButton.css';const t = {
6
- "controls-input": "_controls-input_17k7u_1",
7
- "controls-button": "_controls-button_17k7u_40",
8
- "controls-button--squared": "_controls-button--squared_17k7u_58",
9
- "controls-button--with-prefix": "_controls-button--with-prefix_17k7u_70",
10
- "controls-button--with-icon": "_controls-button--with-icon_17k7u_76",
11
- "controls-button__wrapper": "_controls-button__wrapper_17k7u_80",
12
- "controls-button__prefix": "_controls-button__prefix_17k7u_86",
13
- "controls-button__tooltip": "_controls-button__tooltip_17k7u_91",
14
- "controls-button__tooltip--left": "_controls-button__tooltip--left_17k7u_106",
15
- "controls-button__tooltip--center": "_controls-button__tooltip--center_17k7u_110",
16
- "controls-button__tooltip--right": "_controls-button__tooltip--right_17k7u_115"
17
- }, j = ({
18
- type: p = "checkbox",
1
+ import { jsxs as l, Fragment as g, jsx as o } from "react/jsx-runtime";
2
+ import { useId as I } from "react";
3
+ import { c as p } from "../../clsx-OuTLNxxd.js";
4
+ import { Icon as $ } from "../Icon/Icon.js";
5
+ import '../../assets/ControlsButton.css';const k = "_periods__item_t81b2_160", t = {
6
+ "controls-input": "_controls-input_t81b2_1",
7
+ "controls-button": "_controls-button_t81b2_40",
8
+ "controls-button--squared": "_controls-button--squared_t81b2_58",
9
+ "controls-button--with-prefix": "_controls-button--with-prefix_t81b2_70",
10
+ "controls-button--with-icon": "_controls-button--with-icon_t81b2_76",
11
+ "controls-button__wrapper": "_controls-button__wrapper_t81b2_80",
12
+ "controls-button__prefix": "_controls-button__prefix_t81b2_86",
13
+ "controls-button__tooltip": "_controls-button__tooltip_t81b2_91",
14
+ "controls-button__tooltip--left": "_controls-button__tooltip--left_t81b2_106",
15
+ "controls-button__tooltip--center": "_controls-button__tooltip--center_t81b2_110",
16
+ "controls-button__tooltip--right": "_controls-button__tooltip--right_t81b2_115",
17
+ "controls-button--checked": "_controls-button--checked_t81b2_160",
18
+ periods__item: k
19
+ }, z = ({
20
+ type: a = "checkbox",
19
21
  label: n,
20
22
  value: i,
21
23
  iconName: r,
22
- prefix: s,
23
- tooltip: _,
24
- tooltipPosition: a = "center",
25
- name: d,
26
- forceSquared: h = !1,
27
- checked: m,
24
+ prefix: _,
25
+ tooltip: s,
26
+ tooltipPosition: d = "center",
27
+ name: h,
28
+ forceSquared: m = !1,
29
+ checked: e,
28
30
  disabled: f,
29
- onSetValue: k
31
+ onSetValue: x
30
32
  }) => {
31
- const x = g(), u = (typeof n == "string" ? n : i).replace(/\s+/g, "_"), l = `${x}${u}`, e = `${l}-tooltip`;
32
- return /* @__PURE__ */ c(w, { children: [
33
+ const w = I(), b = (typeof n == "string" ? n : i).replace(/\s+/g, "_"), c = `${w}${b}`, u = `${c}-tooltip`;
34
+ return /* @__PURE__ */ l(g, { children: [
33
35
  /* @__PURE__ */ o(
34
36
  "input",
35
37
  {
36
- type: p,
37
- id: l,
38
- name: d ?? u,
38
+ type: a,
39
+ id: c,
40
+ name: h ?? b,
39
41
  disabled: f,
40
42
  value: i,
41
- checked: m,
42
- onChange: k,
43
+ checked: e,
44
+ onChange: x,
43
45
  className: t["controls-input"],
44
- "aria-describedby": _ ? e : void 0
46
+ "aria-describedby": s ? u : void 0
45
47
  }
46
48
  ),
47
- /* @__PURE__ */ c(
49
+ /* @__PURE__ */ l(
48
50
  "label",
49
51
  {
50
- htmlFor: l,
51
- className: b(t["controls-button"], [
52
- h && t["controls-button--squared"],
53
- s && t["controls-button--with-prefix"],
54
- r && t["controls-button--with-icon"]
52
+ htmlFor: c,
53
+ className: p(t["controls-button"], [
54
+ m && t["controls-button--squared"],
55
+ _ && t["controls-button--with-prefix"],
56
+ r && t["controls-button--with-icon"],
57
+ e && t["controls-button--checked"]
55
58
  ]),
56
59
  children: [
57
- r && /* @__PURE__ */ o(I, { name: r, size: 20 }),
58
- /* @__PURE__ */ c("div", { className: t["controls-button__wrapper"], children: [
59
- s && /* @__PURE__ */ o("div", { className: t["controls-button__prefix"], children: s }),
60
+ r && /* @__PURE__ */ o($, { name: r, size: 20 }),
61
+ /* @__PURE__ */ l("div", { className: t["controls-button__wrapper"], children: [
62
+ _ && /* @__PURE__ */ o("div", { className: t["controls-button__prefix"], children: _ }),
60
63
  n
61
64
  ] }),
62
- _ && /* @__PURE__ */ o(
65
+ s && /* @__PURE__ */ o(
63
66
  "div",
64
67
  {
65
- id: e,
68
+ id: u,
66
69
  role: "tooltip",
67
- className: b(t["controls-button__tooltip"], t[`controls-button__tooltip--${a}`]),
68
- children: _
70
+ className: p(t["controls-button__tooltip"], t[`controls-button__tooltip--${d}`]),
71
+ children: s
69
72
  }
70
73
  )
71
74
  ]
@@ -74,6 +77,6 @@ import '../../assets/ControlsButton.css';const t = {
74
77
  ] });
75
78
  };
76
79
  export {
77
- j as ControlsButton
80
+ z as ControlsButton
78
81
  };
79
82
  //# sourceMappingURL=ControlsButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ControlsButton.js","sources":["../../../src/components/ControlsButton/ControlsButton.tsx"],"sourcesContent":["import { useId } from 'react';\r\nimport { clsx } from 'clsx';\r\n\r\nimport type { ChangeEvent, ReactNode } from 'react';\r\nimport type { IconProps } from 'components/Icon';\r\n\r\nimport styles from './ControlsButton.module.css';\r\n\r\nimport { Icon } from 'components/Icon';\r\n\r\nexport interface ControlsButtonProps {\r\n /** to set type/behaviour of input radio or checkbox */\r\n type?: 'radio' | 'checkbox';\r\n /** button label */\r\n label: string | ReactNode;\r\n /** button value */\r\n value: string;\r\n /** set if icon is needed in font of label */\r\n iconName?: IconProps['name'];\r\n /** set if prefix is needed above of label */\r\n prefix?: string;\r\n /** set tooltip */\r\n tooltip?: ReactNode;\r\n /** set horizontal position of the tooltip */\r\n tooltipPosition?: 'left' | 'center' | 'right';\r\n /** set if used as radiogroup */\r\n name?: string;\r\n /** `true` to set squared button; otherwise, `false`. The default is `false`. Note: hides icon */\r\n forceSquared?: boolean;\r\n /** to set default status */\r\n checked?: boolean;\r\n /** `true` to disable the button; otherwise, `false`. The default is `false`. */\r\n disabled?: boolean;\r\n /** The callback function that is invoked when the radio button changes value. */\r\n onSetValue: (event: ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport const ControlsButton = ({\r\n type = 'checkbox',\r\n label,\r\n value,\r\n iconName,\r\n prefix,\r\n tooltip,\r\n tooltipPosition = 'center',\r\n name,\r\n forceSquared = false,\r\n checked,\r\n disabled,\r\n onSetValue,\r\n}: ControlsButtonProps) => {\r\n const idPrefix = useId();\r\n const labelString = typeof label === 'string' ? label : value;\r\n const sanitizedLabel = labelString.replace(/\\s+/g, '_');\r\n const baseId = `${idPrefix}${sanitizedLabel}`;\r\n const tooltipId = `${baseId}-tooltip`;\r\n\r\n return (\r\n <>\r\n <input\r\n type={type}\r\n id={baseId}\r\n name={name ?? sanitizedLabel}\r\n disabled={disabled}\r\n value={value}\r\n checked={checked}\r\n onChange={onSetValue}\r\n className={styles['controls-input']}\r\n aria-describedby={tooltip ? tooltipId : undefined}\r\n />\r\n <label\r\n htmlFor={baseId}\r\n className={clsx(styles['controls-button'], [\r\n forceSquared && styles['controls-button--squared'],\r\n prefix && styles['controls-button--with-prefix'],\r\n iconName && styles['controls-button--with-icon'],\r\n ])}\r\n >\r\n {iconName && <Icon name={iconName} size={20} />}\r\n <div className={styles['controls-button__wrapper']}>\r\n {prefix && <div className={styles['controls-button__prefix']}>{prefix}</div>}\r\n {label}\r\n </div>\r\n {tooltip && (\r\n <div\r\n id={tooltipId}\r\n role=\"tooltip\"\r\n className={clsx(styles['controls-button__tooltip'], styles[`controls-button__tooltip--${tooltipPosition}`])}\r\n >\r\n {tooltip}\r\n </div>\r\n )}\r\n </label>\r\n </>\r\n );\r\n};\r\n"],"names":["ControlsButton","type","label","value","iconName","prefix","tooltip","tooltipPosition","name","forceSquared","checked","disabled","onSetValue","idPrefix","useId","sanitizedLabel","baseId","tooltipId","jsxs","Fragment","jsx","styles","clsx","Icon"],"mappings":";;;;;;;;;;;;;;;;GAqCaA,IAAiB,CAAC;AAAA,EAC7B,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AACF,MAA2B;AACzB,QAAMC,IAAWC,EAAA,GAEXC,KADc,OAAOb,KAAU,WAAWA,IAAQC,GACrB,QAAQ,QAAQ,GAAG,GAChDa,IAAS,GAAGH,CAAQ,GAAGE,CAAc,IACrCE,IAAY,GAAGD,CAAM;AAE3B,SACE,gBAAAE,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAAnB;AAAA,QACA,IAAIe;AAAA,QACJ,MAAMR,KAAQO;AAAA,QACd,UAAAJ;AAAA,QACA,OAAAR;AAAA,QACA,SAAAO;AAAA,QACA,UAAUE;AAAA,QACV,WAAWS,EAAO,gBAAgB;AAAA,QAClC,oBAAkBf,IAAUW,IAAY;AAAA,MAAA;AAAA,IAAA;AAAA,IAE1C,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASF;AAAA,QACT,WAAWM,EAAKD,EAAO,iBAAiB,GAAG;AAAA,UACzCZ,KAAgBY,EAAO,0BAA0B;AAAA,UACjDhB,KAAUgB,EAAO,8BAA8B;AAAA,UAC/CjB,KAAYiB,EAAO,4BAA4B;AAAA,QAAA,CAChD;AAAA,QAEA,UAAA;AAAA,UAAAjB,KAAY,gBAAAgB,EAACG,GAAA,EAAK,MAAMnB,GAAU,MAAM,IAAI;AAAA,UAC7C,gBAAAc,EAAC,OAAA,EAAI,WAAWG,EAAO,0BAA0B,GAC9C,UAAA;AAAA,YAAAhB,uBAAW,OAAA,EAAI,WAAWgB,EAAO,yBAAyB,GAAI,UAAAhB,GAAO;AAAA,YACrEH;AAAA,UAAA,GACH;AAAA,UACCI,KACC,gBAAAc;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAIH;AAAA,cACJ,MAAK;AAAA,cACL,WAAWK,EAAKD,EAAO,0BAA0B,GAAGA,EAAO,6BAA6Bd,CAAe,EAAE,CAAC;AAAA,cAEzG,UAAAD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;"}
1
+ {"version":3,"file":"ControlsButton.js","sources":["../../../src/components/ControlsButton/ControlsButton.tsx"],"sourcesContent":["import { useId } from 'react';\r\nimport { clsx } from 'clsx';\r\n\r\nimport type { ChangeEvent, ReactNode } from 'react';\r\nimport type { IconProps } from 'components/Icon';\r\n\r\nimport styles from './ControlsButton.module.css';\r\n\r\nimport { Icon } from 'components/Icon';\r\n\r\nexport interface ControlsButtonProps {\r\n /** to set type/behaviour of input radio or checkbox */\r\n type?: 'radio' | 'checkbox';\r\n /** button label */\r\n label: string | ReactNode;\r\n /** button value */\r\n value: string;\r\n /** set if icon is needed in font of label */\r\n iconName?: IconProps['name'];\r\n /** set if prefix is needed above of label */\r\n prefix?: string;\r\n /** set tooltip */\r\n tooltip?: ReactNode;\r\n /** set horizontal position of the tooltip */\r\n tooltipPosition?: 'left' | 'center' | 'right';\r\n /** set if used as radiogroup */\r\n name?: string;\r\n /** `true` to set squared button; otherwise, `false`. The default is `false`. Note: hides icon */\r\n forceSquared?: boolean;\r\n /** to set default status */\r\n checked?: boolean;\r\n /** `true` to disable the button; otherwise, `false`. The default is `false`. */\r\n disabled?: boolean;\r\n /** The callback function that is invoked when the radio button changes value. */\r\n onSetValue: (event: ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport const ControlsButton = ({\r\n type = 'checkbox',\r\n label,\r\n value,\r\n iconName,\r\n prefix,\r\n tooltip,\r\n tooltipPosition = 'center',\r\n name,\r\n forceSquared = false,\r\n checked,\r\n disabled,\r\n onSetValue,\r\n}: ControlsButtonProps) => {\r\n const idPrefix = useId();\r\n const labelString = typeof label === 'string' ? label : value;\r\n const sanitizedLabel = labelString.replace(/\\s+/g, '_');\r\n const baseId = `${idPrefix}${sanitizedLabel}`;\r\n const tooltipId = `${baseId}-tooltip`;\r\n\r\n return (\r\n <>\r\n <input\r\n type={type}\r\n id={baseId}\r\n name={name ?? sanitizedLabel}\r\n disabled={disabled}\r\n value={value}\r\n checked={checked}\r\n onChange={onSetValue}\r\n className={styles['controls-input']}\r\n aria-describedby={tooltip ? tooltipId : undefined}\r\n />\r\n <label\r\n htmlFor={baseId}\r\n className={clsx(styles['controls-button'], [\r\n forceSquared && styles['controls-button--squared'],\r\n prefix && styles['controls-button--with-prefix'],\r\n iconName && styles['controls-button--with-icon'],\r\n checked && styles['controls-button--checked'],\r\n ])}\r\n >\r\n {iconName && <Icon name={iconName} size={20} />}\r\n <div className={styles['controls-button__wrapper']}>\r\n {prefix && <div className={styles['controls-button__prefix']}>{prefix}</div>}\r\n {label}\r\n </div>\r\n {tooltip && (\r\n <div\r\n id={tooltipId}\r\n role=\"tooltip\"\r\n className={clsx(styles['controls-button__tooltip'], styles[`controls-button__tooltip--${tooltipPosition}`])}\r\n >\r\n {tooltip}\r\n </div>\r\n )}\r\n </label>\r\n </>\r\n );\r\n};\r\n"],"names":["ControlsButton","type","label","value","iconName","prefix","tooltip","tooltipPosition","name","forceSquared","checked","disabled","onSetValue","idPrefix","useId","sanitizedLabel","baseId","tooltipId","jsxs","Fragment","jsx","styles","clsx","Icon"],"mappings":";;;;;;;;;;;;;;;;;;GAqCaA,IAAiB,CAAC;AAAA,EAC7B,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,MAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AACF,MAA2B;AACzB,QAAMC,IAAWC,EAAA,GAEXC,KADc,OAAOb,KAAU,WAAWA,IAAQC,GACrB,QAAQ,QAAQ,GAAG,GAChDa,IAAS,GAAGH,CAAQ,GAAGE,CAAc,IACrCE,IAAY,GAAGD,CAAM;AAE3B,SACE,gBAAAE,EAAAC,GAAA,EACE,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAAnB;AAAA,QACA,IAAIe;AAAA,QACJ,MAAMR,KAAQO;AAAA,QACd,UAAAJ;AAAA,QACA,OAAAR;AAAA,QACA,SAAAO;AAAA,QACA,UAAUE;AAAA,QACV,WAAWS,EAAO,gBAAgB;AAAA,QAClC,oBAAkBf,IAAUW,IAAY;AAAA,MAAA;AAAA,IAAA;AAAA,IAE1C,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASF;AAAA,QACT,WAAWM,EAAKD,EAAO,iBAAiB,GAAG;AAAA,UACzCZ,KAAgBY,EAAO,0BAA0B;AAAA,UACjDhB,KAAUgB,EAAO,8BAA8B;AAAA,UAC/CjB,KAAYiB,EAAO,4BAA4B;AAAA,UAC/CX,KAAWW,EAAO,0BAA0B;AAAA,QAAA,CAC7C;AAAA,QAEA,UAAA;AAAA,UAAAjB,KAAY,gBAAAgB,EAACG,GAAA,EAAK,MAAMnB,GAAU,MAAM,IAAI;AAAA,UAC7C,gBAAAc,EAAC,OAAA,EAAI,WAAWG,EAAO,0BAA0B,GAC9C,UAAA;AAAA,YAAAhB,uBAAW,OAAA,EAAI,WAAWgB,EAAO,yBAAyB,GAAI,UAAAhB,GAAO;AAAA,YACrEH;AAAA,UAAA,GACH;AAAA,UACCI,KACC,gBAAAc;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAIH;AAAA,cACJ,MAAK;AAAA,cACL,WAAWK,EAAKD,EAAO,0BAA0B,GAAGA,EAAO,6BAA6Bd,CAAe,EAAE,CAAC;AAAA,cAEzG,UAAAD;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;"}
@@ -1,5 +1,5 @@
1
1
  import { jsx as r, jsxs as l, Fragment as s } from "react/jsx-runtime";
2
- import { l as e } from "../../index-BJRrLdmi.js";
2
+ import { f as e } from "../../index-DGI4ZxSQ.js";
3
3
  import { ControlsButton as t } from "./ControlsButton.js";
4
4
  import { Icons as a } from "../Icon/icons/index.js";
5
5
  import { Periods as i } from "../Periods/Periods.js";
@@ -1,6 +1,6 @@
1
- import { jsxs as a, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as a, jsx as e } from "react/jsx-runtime";
2
2
  import { OverlayProvider as p } from "@react-aria/overlays";
3
- import { l as m } from "../../index-BJRrLdmi.js";
3
+ import { f as m } from "../../index-DGI4ZxSQ.js";
4
4
  import { useState as c } from "react";
5
5
  import { Drawer as r } from "./Drawer.js";
6
6
  import { Button as o } from "../Buttons/Button.js";
@@ -34,15 +34,15 @@ const d = `
34
34
  codeString: d
35
35
  }
36
36
  }, i = (l) => {
37
- const [e, n] = c(!1);
37
+ const [t, n] = c(!1);
38
38
  return /* @__PURE__ */ a(p, { children: [
39
- /* @__PURE__ */ t(o, { onClick: () => n(!e), variant: "primary", children: "Open drawer" }),
40
- e && /* @__PURE__ */ t(
39
+ /* @__PURE__ */ e(o, { onClick: () => n(!t), variant: "primary", children: "Open drawer" }),
40
+ t && /* @__PURE__ */ e(
41
41
  r,
42
42
  {
43
43
  ...l,
44
- isOpen: e,
45
- onClose: () => (m()(), n(!e)),
44
+ isOpen: t,
45
+ onClose: () => (m()(), n(!t)),
46
46
  children: "Example Drawer Content"
47
47
  }
48
48
  )
@@ -58,8 +58,8 @@ const f = i.bind({});
58
58
  f.args = {
59
59
  ...s,
60
60
  buttons: /* @__PURE__ */ a(u, { children: [
61
- /* @__PURE__ */ t(o, { variant: "primary", children: "Primary Example Button" }),
62
- /* @__PURE__ */ t(o, { variant: "secondary", children: "Secondary Example Button" })
61
+ /* @__PURE__ */ e(o, { variant: "primary", children: "Primary Example Button" }),
62
+ /* @__PURE__ */ e(o, { variant: "secondary", children: "Secondary Example Button" })
63
63
  ] })
64
64
  };
65
65
  export {
@@ -1,5 +1,5 @@
1
1
  import { jsx as t } from "react/jsx-runtime";
2
- import { l as i } from "../../index-BJRrLdmi.js";
2
+ import { f as i } from "../../index-DGI4ZxSQ.js";
3
3
  import { FormInput as a } from "./FormInput.js";
4
4
  import { SelectListbox as o } from "../SelectListbox/SelectListbox.js";
5
5
  const m = `
@@ -1,5 +1,5 @@
1
- import { jsx as e } from "react/jsx-runtime";
2
- import { l as r } from "../../index-BJRrLdmi.js";
1
+ import { jsx as n } from "react/jsx-runtime";
2
+ import { f as r } from "../../index-DGI4ZxSQ.js";
3
3
  import { IconButton as t } from "./IconButton.js";
4
4
  import { Icon as i } from "../Icon/Icon.js";
5
5
  const l = `<IconButton variant={variant} aria-label={aria-label} onClick={onClickFunction}>
@@ -40,8 +40,8 @@ const l = `<IconButton variant={variant} aria-label={aria-label} onClick={onClic
40
40
  codeString: l
41
41
  }
42
42
  }, s = (o) => {
43
- const n = o.variant ?? [], a = { ...o, variant: n.toString() };
44
- return /* @__PURE__ */ e(t, { ...a });
43
+ const e = o.variant ?? [], a = { ...o, variant: e.toString() };
44
+ return /* @__PURE__ */ n(t, { ...a });
45
45
  }, c = s.bind({});
46
46
  c.args = {
47
47
  "aria-label": "Trash",
@@ -49,7 +49,7 @@ c.args = {
49
49
  noBorder: !1,
50
50
  wide: !1,
51
51
  disabled: !1,
52
- children: /* @__PURE__ */ e(i, { name: "Trash" }),
52
+ children: /* @__PURE__ */ n(i, { name: "Trash" }),
53
53
  onClick: r()
54
54
  };
55
55
  export {
@@ -1,6 +1,6 @@
1
1
  import { jsx as o } from "react/jsx-runtime";
2
2
  import { useState as d, useRef as g } from "react";
3
- import { l as p } from "../../index-BJRrLdmi.js";
3
+ import { f as p } from "../../index-DGI4ZxSQ.js";
4
4
  import { InputField as e } from "./InputField.js";
5
5
  import { Container as u } from "../../storyComponents/Container/Container.js";
6
6
  import "../Accordion/Accordion.js";
@@ -29,11 +29,11 @@ import "../SelectListbox/SelectProvider.js";
29
29
  import "../Sortable/components/SortableItem.js";
30
30
  import "../../SortableProvider-BbwlEPIr.js";
31
31
  import "../WeekSelector/components/WeekSelectorOptionContainer.js";
32
- const C = `
32
+ const f = `
33
33
  // Has all HTMLInputElement props available except "className" and "style"
34
34
  <InputField aria-labelledby={aria-labelledby} id={id} onChange={onChangeFunction}
35
35
  value={value} type={type} clearTrigger={clearTrigger} />
36
- `, f = (t) => {
36
+ `, C = (t) => {
37
37
  const r = t.variant ?? [];
38
38
  return { ...t, variant: r.toString() };
39
39
  }, Z = {
@@ -67,7 +67,7 @@ const C = `
67
67
  },
68
68
  parameters: {
69
69
  inspectComponent: e,
70
- codeString: C
70
+ codeString: f
71
71
  }
72
72
  }, i = (t) => {
73
73
  const [r, n] = d(""), l = g(null), m = (c) => {
@@ -78,7 +78,7 @@ const C = `
78
78
  return /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(
79
79
  e,
80
80
  {
81
- ...f(t),
81
+ ...C(t),
82
82
  value: r,
83
83
  onChange: m,
84
84
  onClear: s,
@@ -89,12 +89,12 @@ const C = `
89
89
  type: "text",
90
90
  variant: void 0,
91
91
  id: "4f9ca77d"
92
- }, b = i.bind({});
93
- b.args = {
92
+ }, v = i.bind({});
93
+ v.args = {
94
94
  ...a
95
95
  };
96
- const v = i.bind({});
97
- v.args = {
96
+ const b = i.bind({});
97
+ b.args = {
98
98
  ...a,
99
99
  clearTrigger: "Clear"
100
100
  };
@@ -104,9 +104,9 @@ y.args = {
104
104
  clearTrigger: /* @__PURE__ */ o(h, { name: "Cross" })
105
105
  };
106
106
  export {
107
- b as InputFieldExample,
107
+ v as InputFieldExample,
108
108
  y as WithIconClearTrigger,
109
- v as WithStringClearTrigger,
109
+ b as WithStringClearTrigger,
110
110
  Z as default
111
111
  };
112
112
  //# sourceMappingURL=InputField.stories.js.map
@@ -1,12 +1,12 @@
1
1
  import { jsxs as a, jsx as e } from "react/jsx-runtime";
2
- import { ModalProvider as n } from "@react-aria/overlays";
3
- import { l as i } from "../../index-BJRrLdmi.js";
2
+ import { ModalProvider as r } from "@react-aria/overlays";
3
+ import { f as i } from "../../index-DGI4ZxSQ.js";
4
4
  import { ModalDialog as t } from "./ModalDialog.js";
5
- import { Button as l } from "../Buttons/Button.js";
5
+ import { Button as s } from "../Buttons/Button.js";
6
6
  import "../Buttons/LinkButton.js";
7
7
  import "@react-aria/button";
8
8
  import { ButtonGroup as m } from "../ButtonGroup/ButtonGroup.js";
9
- import { FormField as r } from "../FormField/FormField.js";
9
+ import { FormField as l } from "../FormField/FormField.js";
10
10
  import { InputField as d } from "../InputField/InputField.js";
11
11
  import { Label as c } from "../Label/Label.js";
12
12
  const p = `
@@ -50,10 +50,10 @@ const p = `
50
50
  inspectComponent: t,
51
51
  codeString: p
52
52
  }
53
- }, u = (o) => /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(t, { ...o, children: /* @__PURE__ */ a(r, { outerSpace: !0, children: [
53
+ }, u = (o) => /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(t, { ...o, children: /* @__PURE__ */ a(l, { outerSpace: !0, children: [
54
54
  /* @__PURE__ */ e(c, { htmlFor: "text-field", children: "Example Text Field" }),
55
55
  /* @__PURE__ */ e(d, { id: "text-field" })
56
- ] }) }) }), s = {
56
+ ] }) }) }), n = {
57
57
  padded: !1,
58
58
  size: "regular",
59
59
  noButtonBorder: !1,
@@ -65,26 +65,26 @@ const p = `
65
65
  onSubmit: i(),
66
66
  onClose: i(),
67
67
  buttons: /* @__PURE__ */ a(m, { reversed: !0, children: [
68
- /* @__PURE__ */ e(l, { variant: "primary", onClick: i(), children: "OK" }),
69
- /* @__PURE__ */ e(l, { variant: "secondary", onClick: i(), children: "Cancel" })
68
+ /* @__PURE__ */ e(s, { variant: "primary", onClick: i(), children: "OK" }),
69
+ /* @__PURE__ */ e(s, { variant: "secondary", onClick: i(), children: "Cancel" })
70
70
  ] }),
71
71
  isOpen: !0
72
72
  }, b = u.bind({});
73
73
  b.args = {
74
- ...s
74
+ ...n
75
75
  };
76
76
  const g = u.bind({});
77
77
  g.args = {
78
- ...s,
78
+ ...n,
79
79
  isLoading: !0,
80
80
  spinnerAriaValueText: "Loading"
81
81
  };
82
- const f = (o) => /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(t, { ...o, children: /* @__PURE__ */ a(r, { outerSpace: !0, children: [
82
+ const f = (o) => /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(t, { ...o, children: /* @__PURE__ */ a(l, { outerSpace: !0, children: [
83
83
  /* @__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; Cras 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 libero, 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." }),
84
84
  /* @__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. Phasellus 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." })
85
85
  ] }) }) }), h = f.bind({});
86
86
  h.args = {
87
- ...s,
87
+ ...n,
88
88
  noButtonBorder: !0
89
89
  };
90
90
  export {
@@ -1,5 +1,5 @@
1
1
  import { jsxs as S, jsx as r } from "react/jsx-runtime";
2
- import { l as d } from "../../index-BJRrLdmi.js";
2
+ import { f as d } from "../../index-DGI4ZxSQ.js";
3
3
  import { useState as p } from "react";
4
4
  import { M as e } from "../../TablePlugin-CqCjNBW_.js";
5
5
  import { Container as M } from "../../storyComponents/Container/Container.js";
@@ -1,10 +1,10 @@
1
1
  import { jsxs as m, jsx as a } from "react/jsx-runtime";
2
- import { l as u } from "../../index-BJRrLdmi.js";
2
+ import { f as u } from "../../index-DGI4ZxSQ.js";
3
3
  import { useState as r } from "react";
4
- import { MultiSelectBox as t } from "./MultiSelectBox.js";
5
- const b = "<MultiSelectBox selectData={[{label, value}]} onChange={fn} labelSuffix={string} />", S = {
4
+ import { MultiSelectBox as l } from "./MultiSelectBox.js";
5
+ const d = "<MultiSelectBox selectData={[{label, value}]} onChange={fn} labelSuffix={string} />", S = {
6
6
  title: "Organisms/MultiSelectBox",
7
- component: t,
7
+ component: l,
8
8
  argTypes: {
9
9
  onChange: {
10
10
  action: "Selected values",
@@ -14,10 +14,10 @@ const b = "<MultiSelectBox selectData={[{label, value}]} onChange={fn} labelSuff
14
14
  }
15
15
  },
16
16
  parameters: {
17
- inspectComponent: t,
18
- codeString: b
17
+ inspectComponent: l,
18
+ codeString: d
19
19
  }
20
- }, d = [
20
+ }, f = [
21
21
  { label: "A.B. Docent", value: "1" },
22
22
  { label: "B.C. Docent met lange achternaam", value: "2" },
23
23
  {
@@ -35,12 +35,12 @@ const b = "<MultiSelectBox selectData={[{label, value}]} onChange={fn} labelSuff
35
35
  { label: "H.I. Docent", value: "9" },
36
36
  { label: "K.L. Docent ", value: "10" }
37
37
  ], n = (e) => {
38
- const [c, s] = r(e.defaultSelectedItems || []), i = (l) => {
39
- e.onChange && e.onChange(l), s(l);
38
+ const [c, s] = r(e.defaultSelectedItems || []), i = (t) => {
39
+ e.onChange && e.onChange(t), s(t);
40
40
  };
41
41
  return /* @__PURE__ */ m("div", { style: { width: "30rem", margin: "0rem auto 0 auto" }, children: [
42
- /* @__PURE__ */ a("span", { children: c.map((l) => l.label).join(", ") }),
43
- /* @__PURE__ */ a(t, { ...e, onChange: i })
42
+ /* @__PURE__ */ a("span", { children: c.map((t) => t.label).join(", ") }),
43
+ /* @__PURE__ */ a(l, { ...e, onChange: i })
44
44
  ] });
45
45
  }, o = {
46
46
  fullWidth: !1,
@@ -48,10 +48,10 @@ const b = "<MultiSelectBox selectData={[{label, value}]} onChange={fn} labelSuff
48
48
  maxOptionHeight: "20rem",
49
49
  optionPositionRight: !1,
50
50
  disabled: !1,
51
- selectData: d,
51
+ selectData: f,
52
52
  onChange: u()
53
- }, f = n.bind({});
54
- f.args = {
53
+ }, b = n.bind({});
54
+ b.args = {
55
55
  ...o
56
56
  };
57
57
  const g = n.bind({});
@@ -64,7 +64,7 @@ g.args = {
64
64
  ]
65
65
  };
66
66
  export {
67
- f as MultiSelectBoxExample,
67
+ b as MultiSelectBoxExample,
68
68
  g as WithDefaultSelectedItems,
69
69
  S as default
70
70
  };
@@ -1,8 +1,8 @@
1
1
  import { jsx as i } from "react/jsx-runtime";
2
- import { l as a } from "../../index-BJRrLdmi.js";
2
+ import { f as a } from "../../index-DGI4ZxSQ.js";
3
3
  import { Notification as t } from "./Notification.js";
4
- const l = `<Notification title={title} subtitle={subtitle} action={action}
5
- level={level} variant={variant} onClose={() => {}} />`, m = {
4
+ const r = `<Notification title={title} subtitle={subtitle} action={action}
5
+ level={level} variant={variant} onClose={() => {}} />`, p = {
6
6
  title: "Molecules/Notification",
7
7
  component: t,
8
8
  argTypes: {
@@ -17,14 +17,14 @@ const l = `<Notification title={title} subtitle={subtitle} action={action}
17
17
  },
18
18
  parameters: {
19
19
  inspectComponent: t,
20
- codeString: l
20
+ codeString: r
21
21
  }
22
22
  }, e = (n) => /* @__PURE__ */ i(t, { ...n }), o = {
23
23
  level: "information",
24
24
  title: "Titel van de melding",
25
25
  onClose: a()
26
- }, r = e.bind({});
27
- r.args = {
26
+ }, l = e.bind({});
27
+ l.args = {
28
28
  ...o,
29
29
  variant: "default",
30
30
  subtitle: "Subtekst ter verduidelijking van de melding.",
@@ -37,7 +37,7 @@ s.args = {
37
37
  };
38
38
  export {
39
39
  s as AsBar,
40
- r as NotificationExample,
41
- m as default
40
+ l as NotificationExample,
41
+ p as default
42
42
  };
43
43
  //# sourceMappingURL=Notification.stories.js.map
@@ -1,7 +1,7 @@
1
1
  import { jsx as e } from "react/jsx-runtime";
2
- import { l as t } from "../../index-BJRrLdmi.js";
2
+ import { f as a } from "../../index-DGI4ZxSQ.js";
3
3
  import { OverlayCloseButton as o } from "./OverlayCloseButton.js";
4
- import { Container as a } from "../../storyComponents/Container/Container.js";
4
+ import { Container as l } from "../../storyComponents/Container/Container.js";
5
5
  const r = "<OverlayCloseButton aria-label={aria-label} onClick={onClickFunction} />", c = {
6
6
  title: "Atoms/OverlayCloseButton",
7
7
  component: o,
@@ -17,11 +17,11 @@ const r = "<OverlayCloseButton aria-label={aria-label} onClick={onClickFunction}
17
17
  inspectComponent: o,
18
18
  codeString: r
19
19
  }
20
- }, n = (l) => /* @__PURE__ */ e(a, { size: "small", padded: !1, children: /* @__PURE__ */ e(o, { ...l }) }), s = n.bind({});
20
+ }, n = (t) => /* @__PURE__ */ e(l, { size: "small", padded: !1, children: /* @__PURE__ */ e(o, { ...t }) }), s = n.bind({});
21
21
  s.args = {
22
22
  paddedModal: !1,
23
23
  "aria-label": "Close",
24
- onClick: t()
24
+ onClick: a()
25
25
  };
26
26
  export {
27
27
  s as OverlayCloseButtonExample,
@@ -1,5 +1,5 @@
1
1
  import { jsx as r } from "react/jsx-runtime";
2
- import { l as t } from "../../index-BJRrLdmi.js";
2
+ import { f as t } from "../../index-DGI4ZxSQ.js";
3
3
  import { PeriodSelector as e } from "./PeriodSelector.js";
4
4
  const i = "<PeriodSelector maxPeriods={} defaultValues={} label={} labelPosition={} required={} onChange={} />", m = {
5
5
  title: "Organisms/PeriodSelector",
@@ -8,8 +8,8 @@ const i = "<PeriodSelector maxPeriods={} defaultValues={} label={} labelPosition
8
8
  inspectComponent: e,
9
9
  codeString: i
10
10
  }
11
- }, l = (o) => /* @__PURE__ */ r(e, { ...o }), a = l.bind({});
12
- a.args = {
11
+ }, a = (o) => /* @__PURE__ */ r(e, { ...o }), l = a.bind({});
12
+ l.args = {
13
13
  maxPeriods: 7,
14
14
  // eslint-disable-next-line @typescript-eslint/no-magic-numbers
15
15
  defaultValues: [1, 5, 6],
@@ -19,7 +19,7 @@ a.args = {
19
19
  onChange: t()
20
20
  };
21
21
  export {
22
- a as PeriodSelectorExample,
22
+ l as PeriodSelectorExample,
23
23
  m as default
24
24
  };
25
25
  //# sourceMappingURL=PeriodSelector.stories.js.map
@@ -34,7 +34,8 @@ import '../../assets/Periods.css';const N = "_periods__container_1dwwu_1", g = "
34
34
  className: P(
35
35
  _.periods__item,
36
36
  h(e) ? _["periods__item--active"] : ""
37
- )
37
+ ),
38
+ "data-period-item": !0
38
39
  },
39
40
  `${$}-${e}`
40
41
  )) });
@@ -1 +1 @@
1
- {"version":3,"file":"Periods.js","sources":["../../../src/components/Periods/Periods.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId } from 'react';\n\nimport styles from './Periods.module.css';\n\ninterface Period {\n id: string;\n number: number;\n semesterNumber: number;\n periodInSemester: number;\n}\n\ninterface TooltipTranslations {\n period: string;\n periods: string;\n and: string;\n}\n\nexport interface PeriodsProps {\n /** Indicates which periods are selected. */\n periods: Period[] | number[];\n /** Indicates the maximum number of periods to show in the selector. */\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n maxPeriods?: 6 | 7;\n /** A object of translations for the tooltip. */\n tooltipTranslations?: TooltipTranslations;\n}\n\nconst MAX_PERIODS = 6;\n\n/** Represents a component for a period indicator. */\nexport const Periods = ({ periods, tooltipTranslations, maxPeriods = MAX_PERIODS }: PeriodsProps) => {\n const maxPeriodsList = Array.from({ length: maxPeriods }, (_, index) => index + 1);\n const idPrefix = useId();\n\n const isArrayOfNumbers = periods.some((value) => {\n return typeof value === 'number';\n });\n\n const getTitles = (tooltipTranslations: TooltipTranslations): string => {\n const semesterPeriods: Record<number, number[]> = {};\n\n // Group periods by semester\n isArrayOfNumbers\n ? periods.forEach((period) => {\n if (typeof period === 'number') {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n const groupKey = Math.ceil(period / 3); // Determine the semester (1, 2, or 3)\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n const mappedValue = ((period - 1) % 3) + 1; // Map period to semester\n\n if (!semesterPeriods[groupKey]) {\n semesterPeriods[groupKey] = [];\n }\n semesterPeriods[groupKey].push(mappedValue);\n }\n })\n : periods.forEach((period) => {\n const { semesterNumber, periodInSemester } = period as Period;\n\n if (!semesterPeriods[semesterNumber]) {\n semesterPeriods[semesterNumber] = [];\n }\n semesterPeriods[semesterNumber].push(periodInSemester);\n });\n\n // Build the title string\n const title = Object.keys(semesterPeriods).reduce((acc, semesterKey, index) => {\n const semesterNumber = Number(semesterKey);\n const periodsInSemester = semesterPeriods[semesterNumber];\n let periodTitle = '';\n\n // Determine if we need singular or plural form for \"period\"\n const blokLabel = periodsInSemester.length > 1 ? tooltipTranslations.periods : tooltipTranslations.period;\n\n // Build period sequence for the current semester\n if (periodsInSemester.length > 1) {\n const lastPeriod = periodsInSemester.pop();\n periodTitle = `Semester ${semesterNumber} ${blokLabel} ${periodsInSemester.join(', ')} ${tooltipTranslations.and} ${lastPeriod}`;\n } else {\n periodTitle = `Semester ${semesterNumber} ${blokLabel} ${periodsInSemester[0]}`;\n }\n\n // Add proper spacing and periods\n return `${acc}${index > 0 ? '. ' : ''}${periodTitle}`;\n }, '');\n\n return title.trim() + '.';\n };\n\n const isPeriodActive = (periodIndex: number): boolean => {\n if (isArrayOfNumbers) {\n return (periods as number[]).includes(periodIndex);\n } else {\n return periods.find((period) => (period as Period).number === periodIndex) ? true : false;\n }\n };\n\n return (\n <div className={styles['periods__container']} title={tooltipTranslations ? getTitles(tooltipTranslations) : ''}>\n {maxPeriodsList.map((periodIndex) => {\n return (\n <span\n className={clsx(\n styles['periods__item'],\n isPeriodActive(periodIndex) ? styles['periods__item--active'] : ''\n )}\n key={`${idPrefix}-${periodIndex}`}\n />\n );\n })}\n </div>\n );\n};\n"],"names":["MAX_PERIODS","Periods","periods","tooltipTranslations","maxPeriods","maxPeriodsList","_","index","idPrefix","useId","isArrayOfNumbers","value","getTitles","semesterPeriods","period","groupKey","mappedValue","semesterNumber","periodInSemester","acc","semesterKey","periodsInSemester","periodTitle","blokLabel","lastPeriod","isPeriodActive","periodIndex","jsx","styles","clsx"],"mappings":";;;;;;;GA4BMA,IAAc,GAGPC,IAAU,CAAC,EAAE,SAAAC,GAAS,qBAAAC,GAAqB,YAAAC,IAAaJ,QAAgC;AACnG,QAAMK,IAAiB,MAAM,KAAK,EAAE,QAAQD,EAAA,GAAc,CAACE,GAAGC,MAAUA,IAAQ,CAAC,GAC3EC,IAAWC,EAAA,GAEXC,IAAmBR,EAAQ,KAAK,CAACS,MAC9B,OAAOA,KAAU,QACzB,GAEKC,IAAY,CAACT,MAAqD;AACtE,UAAMU,IAA4C,CAAA;AAGlD,WAAAH,IACIR,EAAQ,QAAQ,CAACY,MAAW;AAC1B,UAAI,OAAOA,KAAW,UAAU;AAE9B,cAAMC,IAAW,KAAK,KAAKD,IAAS,CAAC,GAE/BE,KAAgBF,IAAS,KAAK,IAAK;AAEzC,QAAKD,EAAgBE,CAAQ,MAC3BF,EAAgBE,CAAQ,IAAI,CAAA,IAE9BF,EAAgBE,CAAQ,EAAE,KAAKC,CAAW;AAAA,MAC5C;AAAA,IACF,CAAC,IACDd,EAAQ,QAAQ,CAACY,MAAW;AAC1B,YAAM,EAAE,gBAAAG,GAAgB,kBAAAC,EAAA,IAAqBJ;AAE7C,MAAKD,EAAgBI,CAAc,MACjCJ,EAAgBI,CAAc,IAAI,CAAA,IAEpCJ,EAAgBI,CAAc,EAAE,KAAKC,CAAgB;AAAA,IACvD,CAAC,GAGS,OAAO,KAAKL,CAAe,EAAE,OAAO,CAACM,GAAKC,GAAab,MAAU;AAC7E,YAAMU,IAAiB,OAAOG,CAAW,GACnCC,IAAoBR,EAAgBI,CAAc;AACxD,UAAIK,IAAc;AAGlB,YAAMC,IAAYF,EAAkB,SAAS,IAAIlB,EAAoB,UAAUA,EAAoB;AAGnG,UAAIkB,EAAkB,SAAS,GAAG;AAChC,cAAMG,IAAaH,EAAkB,IAAA;AACrC,QAAAC,IAAc,YAAYL,CAAc,IAAIM,CAAS,IAAIF,EAAkB,KAAK,IAAI,CAAC,IAAIlB,EAAoB,GAAG,IAAIqB,CAAU;AAAA,MAChI;AACE,QAAAF,IAAc,YAAYL,CAAc,IAAIM,CAAS,IAAIF,EAAkB,CAAC,CAAC;AAI/E,aAAO,GAAGF,CAAG,GAAGZ,IAAQ,IAAI,OAAO,EAAE,GAAGe,CAAW;AAAA,IACrD,GAAG,EAAE,EAEQ,SAAS;AAAA,EACxB,GAEMG,IAAiB,CAACC,MAClBhB,IACMR,EAAqB,SAASwB,CAAW,IAE1C,EAAAxB,EAAQ,KAAK,CAACY,MAAYA,EAAkB,WAAWY,CAAW;AAI7E,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,oBAAuB,OAAOzB,IAAsBS,EAAUT,CAAmB,IAAI,IACzG,UAAAE,EAAe,IAAI,CAACqB,MAEjB,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWE;AAAA,QACTD,EAAO;AAAA,QACPH,EAAeC,CAAW,IAAIE,EAAO,uBAAuB,IAAI;AAAA,MAAA;AAAA,IAClE;AAAA,IACK,GAAGpB,CAAQ,IAAIkB,CAAW;AAAA,EAAA,CAGpC,EAAA,CACH;AAEJ;"}
1
+ {"version":3,"file":"Periods.js","sources":["../../../src/components/Periods/Periods.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useId } from 'react';\n\nimport styles from './Periods.module.css';\n\ninterface Period {\n id: string;\n number: number;\n semesterNumber: number;\n periodInSemester: number;\n}\n\ninterface TooltipTranslations {\n period: string;\n periods: string;\n and: string;\n}\n\nexport interface PeriodsProps {\n /** Indicates which periods are selected. */\n periods: Period[] | number[];\n /** Indicates the maximum number of periods to show in the selector. */\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n maxPeriods?: 6 | 7;\n /** A object of translations for the tooltip. */\n tooltipTranslations?: TooltipTranslations;\n}\n\nconst MAX_PERIODS = 6;\n\n/** Represents a component for a period indicator. */\nexport const Periods = ({ periods, tooltipTranslations, maxPeriods = MAX_PERIODS }: PeriodsProps) => {\n const maxPeriodsList = Array.from({ length: maxPeriods }, (_, index) => index + 1);\n const idPrefix = useId();\n\n const isArrayOfNumbers = periods.some((value) => {\n return typeof value === 'number';\n });\n\n const getTitles = (tooltipTranslations: TooltipTranslations): string => {\n const semesterPeriods: Record<number, number[]> = {};\n\n // Group periods by semester\n isArrayOfNumbers\n ? periods.forEach((period) => {\n if (typeof period === 'number') {\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n const groupKey = Math.ceil(period / 3); // Determine the semester (1, 2, or 3)\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n const mappedValue = ((period - 1) % 3) + 1; // Map period to semester\n\n if (!semesterPeriods[groupKey]) {\n semesterPeriods[groupKey] = [];\n }\n semesterPeriods[groupKey].push(mappedValue);\n }\n })\n : periods.forEach((period) => {\n const { semesterNumber, periodInSemester } = period as Period;\n\n if (!semesterPeriods[semesterNumber]) {\n semesterPeriods[semesterNumber] = [];\n }\n semesterPeriods[semesterNumber].push(periodInSemester);\n });\n\n // Build the title string\n const title = Object.keys(semesterPeriods).reduce((acc, semesterKey, index) => {\n const semesterNumber = Number(semesterKey);\n const periodsInSemester = semesterPeriods[semesterNumber];\n let periodTitle = '';\n\n // Determine if we need singular or plural form for \"period\"\n const blokLabel = periodsInSemester.length > 1 ? tooltipTranslations.periods : tooltipTranslations.period;\n\n // Build period sequence for the current semester\n if (periodsInSemester.length > 1) {\n const lastPeriod = periodsInSemester.pop();\n periodTitle = `Semester ${semesterNumber} ${blokLabel} ${periodsInSemester.join(', ')} ${tooltipTranslations.and} ${lastPeriod}`;\n } else {\n periodTitle = `Semester ${semesterNumber} ${blokLabel} ${periodsInSemester[0]}`;\n }\n\n // Add proper spacing and periods\n return `${acc}${index > 0 ? '. ' : ''}${periodTitle}`;\n }, '');\n\n return title.trim() + '.';\n };\n\n const isPeriodActive = (periodIndex: number): boolean => {\n if (isArrayOfNumbers) {\n return (periods as number[]).includes(periodIndex);\n } else {\n return periods.find((period) => (period as Period).number === periodIndex) ? true : false;\n }\n };\n\n return (\n <div className={styles['periods__container']} title={tooltipTranslations ? getTitles(tooltipTranslations) : ''}>\n {maxPeriodsList.map((periodIndex) => {\n return (\n <span\n className={clsx(\n styles['periods__item'],\n isPeriodActive(periodIndex) ? styles['periods__item--active'] : ''\n )}\n data-period-item\n key={`${idPrefix}-${periodIndex}`}\n />\n );\n })}\n </div>\n );\n};\n"],"names":["MAX_PERIODS","Periods","periods","tooltipTranslations","maxPeriods","maxPeriodsList","_","index","idPrefix","useId","isArrayOfNumbers","value","getTitles","semesterPeriods","period","groupKey","mappedValue","semesterNumber","periodInSemester","acc","semesterKey","periodsInSemester","periodTitle","blokLabel","lastPeriod","isPeriodActive","periodIndex","jsx","styles","clsx"],"mappings":";;;;;;;GA4BMA,IAAc,GAGPC,IAAU,CAAC,EAAE,SAAAC,GAAS,qBAAAC,GAAqB,YAAAC,IAAaJ,QAAgC;AACnG,QAAMK,IAAiB,MAAM,KAAK,EAAE,QAAQD,EAAA,GAAc,CAACE,GAAGC,MAAUA,IAAQ,CAAC,GAC3EC,IAAWC,EAAA,GAEXC,IAAmBR,EAAQ,KAAK,CAACS,MAC9B,OAAOA,KAAU,QACzB,GAEKC,IAAY,CAACT,MAAqD;AACtE,UAAMU,IAA4C,CAAA;AAGlD,WAAAH,IACIR,EAAQ,QAAQ,CAACY,MAAW;AAC1B,UAAI,OAAOA,KAAW,UAAU;AAE9B,cAAMC,IAAW,KAAK,KAAKD,IAAS,CAAC,GAE/BE,KAAgBF,IAAS,KAAK,IAAK;AAEzC,QAAKD,EAAgBE,CAAQ,MAC3BF,EAAgBE,CAAQ,IAAI,CAAA,IAE9BF,EAAgBE,CAAQ,EAAE,KAAKC,CAAW;AAAA,MAC5C;AAAA,IACF,CAAC,IACDd,EAAQ,QAAQ,CAACY,MAAW;AAC1B,YAAM,EAAE,gBAAAG,GAAgB,kBAAAC,EAAA,IAAqBJ;AAE7C,MAAKD,EAAgBI,CAAc,MACjCJ,EAAgBI,CAAc,IAAI,CAAA,IAEpCJ,EAAgBI,CAAc,EAAE,KAAKC,CAAgB;AAAA,IACvD,CAAC,GAGS,OAAO,KAAKL,CAAe,EAAE,OAAO,CAACM,GAAKC,GAAab,MAAU;AAC7E,YAAMU,IAAiB,OAAOG,CAAW,GACnCC,IAAoBR,EAAgBI,CAAc;AACxD,UAAIK,IAAc;AAGlB,YAAMC,IAAYF,EAAkB,SAAS,IAAIlB,EAAoB,UAAUA,EAAoB;AAGnG,UAAIkB,EAAkB,SAAS,GAAG;AAChC,cAAMG,IAAaH,EAAkB,IAAA;AACrC,QAAAC,IAAc,YAAYL,CAAc,IAAIM,CAAS,IAAIF,EAAkB,KAAK,IAAI,CAAC,IAAIlB,EAAoB,GAAG,IAAIqB,CAAU;AAAA,MAChI;AACE,QAAAF,IAAc,YAAYL,CAAc,IAAIM,CAAS,IAAIF,EAAkB,CAAC,CAAC;AAI/E,aAAO,GAAGF,CAAG,GAAGZ,IAAQ,IAAI,OAAO,EAAE,GAAGe,CAAW;AAAA,IACrD,GAAG,EAAE,EAEQ,SAAS;AAAA,EACxB,GAEMG,IAAiB,CAACC,MAClBhB,IACMR,EAAqB,SAASwB,CAAW,IAE1C,EAAAxB,EAAQ,KAAK,CAACY,MAAYA,EAAkB,WAAWY,CAAW;AAI7E,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,oBAAuB,OAAOzB,IAAsBS,EAAUT,CAAmB,IAAI,IACzG,UAAAE,EAAe,IAAI,CAACqB,MAEjB,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWE;AAAA,QACTD,EAAO;AAAA,QACPH,EAAeC,CAAW,IAAIE,EAAO,uBAAuB,IAAI;AAAA,MAAA;AAAA,MAElE,oBAAgB;AAAA,IAAA;AAAA,IACX,GAAGpB,CAAQ,IAAIkB,CAAW;AAAA,EAAA,CAGpC,EAAA,CACH;AAEJ;"}
@@ -1,5 +1,5 @@
1
1
  import { jsx as t } from "react/jsx-runtime";
2
- import { l as a } from "../../index-BJRrLdmi.js";
2
+ import { f as a } from "../../index-DGI4ZxSQ.js";
3
3
  import { RadioGroup as o } from "./RadioGroup.js";
4
4
  const l = `
5
5
  <RadioGroup label={label} options={options}
@@ -1,5 +1,5 @@
1
1
  import { jsx as o } from "react/jsx-runtime";
2
- import { l as t } from "../../index-BJRrLdmi.js";
2
+ import { f as t } from "../../index-DGI4ZxSQ.js";
3
3
  import { RadioTabSelector as e } from "./RadioTabSelector.js";
4
4
  const i = "<RadioTabSelector radioButtons={} defaultValue={} label={} labelPosition={} required={} notValidatedText={} onSetValue={} />", b = {
5
5
  title: "Molecules/RadioTabSelector",
@@ -1,5 +1,5 @@
1
1
  import { jsx as a, jsxs as M } from "react/jsx-runtime";
2
- import { l as i } from "../../index-BJRrLdmi.js";
2
+ import { f as i } from "../../index-DGI4ZxSQ.js";
3
3
  import { SelectListbox as r } from "./SelectListbox.js";
4
4
  import * as e from "react";
5
5
  const E = ({
@@ -1,5 +1,5 @@
1
1
  import { jsx as e, jsxs as i, Fragment as m } from "react/jsx-runtime";
2
- import { l as s } from "../../index-BJRrLdmi.js";
2
+ import { f as s } from "../../index-DGI4ZxSQ.js";
3
3
  import { Sortable as l } from "./Sortable.js";
4
4
  import { InputField as d } from "../InputField/InputField.js";
5
5
  import { Icon as c } from "../Icon/Icon.js";