@uva-glass/component-library 3.34.10 → 3.34.11

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.
@@ -1 +1 @@
1
- ._checkbox-button-bar__container_148ge_1{display:grid;gap:.5rem;grid-template-columns:1fr;grid-template-rows:auto auto auto;width:fit-content}._checkbox-button-bar__container--label-left_148ge_9{grid-template-columns:auto 1fr;grid-template-rows:auto auto}._checkbox-button-bar__label_148ge_14{align-self:center;grid-column:1;grid-row:1}._checkbox-button-bar__bar_148ge_20{grid-column:1;grid-row:2}._checkbox-button-bar__bar--label-left_148ge_25{grid-column:2;grid-row:1}._checkbox-button-bar__footer_148ge_30{grid-column:1;grid-row:3}._checkbox-button-bar__footer-text_148ge_35{color:var(--new-color-grey-700);font-size:var(--font-size-text-non-essential)}._checkbox-button-bar__footer--label-left_148ge_40{grid-column:2;grid-row:2}._checkbox-button-bar__row_148ge_45{align-items:center;background-color:var(--new-color-uva-white);border:1px solid var(--new-color-grey-700);border-radius:.5rem;display:flex;flex-wrap:nowrap;gap:.25rem;padding:.25rem;width:fit-content}._checkbox-button-bar__row--not-validated_148ge_57{border-color:var(--new-color-red-600)}
1
+ ._checkbox-button-bar__container_5gd9n_1{display:flex;flex-wrap:wrap}._checkbox-button-bar__container--label-left_5gd9n_5{align-items:baseline;flex-direction:row;gap:1rem}._checkbox-button-bar__container--label-top_5gd9n_10{align-items:flex-start;flex-direction:column;gap:.5rem}._checkbox-button-bar__row-container_5gd9n_15{display:flex;flex-direction:column;gap:.5rem}._checkbox-button-bar__row_5gd9n_15{align-items:center;background-color:var(--new-color-uva-white);border:1px solid var(--new-color-grey-700);border-radius:.5rem;display:flex;flex-wrap:nowrap;gap:.25rem;padding:.25rem}._checkbox-button-bar__row--not-validated_5gd9n_30{border-color:var(--new-color-red-600)}._checkbox-button-bar__footer_5gd9n_33{color:var(--new-color-grey-700);font-size:var(--font-size-text-non-essential)}
@@ -1 +1 @@
1
- ._controls-button_1jd0n_1{align-items:center;background-color:var(--new-color-uva-white);border-radius:.25rem;cursor:pointer;display:inline-flex;font-size:var(--font-size-default);height:2.25rem;justify-content:center;min-width:2.25rem;padding:.5rem;position:relative;-webkit-user-select:none;user-select:none;white-space:nowrap}._controls-button--squared_1jd0n_17{width:2.25rem}._controls-input_1jd0n_21{aspect-ratio:unset;cursor:pointer;height:0;opacity:0;position:absolute;width:0}._controls-button_1jd0n_1:after{content:"";min-height:2.625rem;min-width:2.625rem;position:absolute;width:100%}._controls-input_1jd0n_21:focus-visible+label{outline:.125rem dotted var(--new-color-navy-600);outline-offset:.125rem}._controls-input_1jd0n_21:checked+label{background-color:var(--new-color-grey-200);border:1px solid var(--new-color-grey-700);font-weight:var(--semibold)}._controls-input_1jd0n_21:disabled+label,._controls-input_1jd0n_21:disabled:hover+label{background-color:var(--new-color-grey-400);color:var(--new-color-grey-700);cursor:not-allowed}._controls-input_1jd0n_21:hover+label{background-color:var(--new-color-grey-300)}._controls-button--with-prefix_1jd0n_60{height:auto;padding:.125rem .5rem;width:auto}._controls-button__wrapper_1jd0n_66{align-items:center;display:flex;flex-direction:column}._controls-button__prefix_1jd0n_72{color:var(--new-color-grey-700);font-size:var(--font-size-text-non-essential)}
1
+ ._controls-button_1jiif_1{align-items:center;background-color:var(--new-color-uva-white);border:1px solid transparent;border-radius:.25rem;box-sizing:border-box;cursor:pointer;display:inline-flex;font-size:var(--font-size-default);height:2.25rem;justify-content:center;min-width:2.25rem;padding:.5rem;position:relative;-webkit-user-select:none;user-select:none;white-space:nowrap}._controls-button--squared_1jiif_19{width:2.25rem}._controls-input_1jiif_23{aspect-ratio:unset;cursor:pointer;height:0;opacity:0;position:absolute;width:0}._controls-button_1jiif_1:after{content:"";min-height:2.625rem;min-width:2.625rem;position:absolute;width:100%}._controls-input_1jiif_23:focus-visible+label{outline:.125rem dotted var(--new-color-navy-600);outline-offset:.125rem}._controls-input_1jiif_23:checked+label{background-color:var(--new-color-grey-200);border:1px solid var(--new-color-grey-700);font-weight:var(--semibold)}._controls-input_1jiif_23:disabled+label,._controls-input_1jiif_23:disabled:hover+label{background-color:var(--new-color-grey-400);color:var(--new-color-grey-700);cursor:not-allowed}._controls-input_1jiif_23:hover+label{background-color:var(--new-color-grey-300)}._controls-button--with-prefix_1jiif_62{height:auto;padding:.125rem .5rem;width:auto}._controls-button__wrapper_1jiif_68{align-items:center;display:flex;flex-direction:column}._controls-button__prefix_1jiif_74{color:var(--new-color-grey-700);font-size:var(--font-size-text-non-essential)}
@@ -1 +1 @@
1
- ._period-selector__container_d1p0j_1{display:flex;flex-wrap:wrap}._period-selector__container--label-left_d1p0j_6{flex-direction:row;gap:1rem;align-items:baseline}._period-selector__container--label-top_d1p0j_12{align-items:flex-start;flex-direction:column;gap:.5rem}._period-selector__selector-container_d1p0j_18{display:flex;flex-direction:column;line-height:1.5}._period-selector__selector-row_d1p0j_24{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
1
+ ._period-selector__container_1txwd_1{display:flex;flex-wrap:wrap}._period-selector__container--label-left_1txwd_6{flex-direction:row;gap:1rem;align-items:baseline}._period-selector__container--label-top_1txwd_12{align-items:flex-start;flex-direction:column;gap:.5rem}._period-selector__selector-container_1txwd_18{display:flex;flex-direction:column;gap:.5rem}._period-selector__selector-row_1txwd_24{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem}
@@ -1,89 +1,71 @@
1
- import { jsxs as u, jsx as o } from "react/jsx-runtime";
2
- import { useState as N } from "react";
3
- import { c as r } from "../../clsx-OuTLNxxd.js";
4
- import { Label as C } from "../Label/Label.js";
1
+ import { jsxs as k, jsx as c } from "react/jsx-runtime";
2
+ import { useState as C } from "react";
3
+ import { c as x } from "../../clsx-OuTLNxxd.js";
4
+ import { Label as N } from "../Label/Label.js";
5
5
  import { FeedbackBox as S } from "../FeedbackBox/FeedbackBox.js";
6
6
  import { ControlsButton as j } from "../ControlsButton/ControlsButton.js";
7
- import '../../assets/CheckboxButtonBar.css';const b = {
8
- "checkbox-button-bar__container": "_checkbox-button-bar__container_148ge_1",
9
- "checkbox-button-bar__container--label-left": "_checkbox-button-bar__container--label-left_148ge_9",
10
- "checkbox-button-bar__label": "_checkbox-button-bar__label_148ge_14",
11
- "checkbox-button-bar__bar": "_checkbox-button-bar__bar_148ge_20",
12
- "checkbox-button-bar__bar--label-left": "_checkbox-button-bar__bar--label-left_148ge_25",
13
- "checkbox-button-bar__footer": "_checkbox-button-bar__footer_148ge_30",
14
- "checkbox-button-bar__footer-text": "_checkbox-button-bar__footer-text_148ge_35",
15
- "checkbox-button-bar__footer--label-left": "_checkbox-button-bar__footer--label-left_148ge_40",
16
- "checkbox-button-bar__row": "_checkbox-button-bar__row_148ge_45",
17
- "checkbox-button-bar__row--not-validated": "_checkbox-button-bar__row--not-validated_148ge_57"
7
+ import '../../assets/CheckboxButtonBar.css';const t = {
8
+ "checkbox-button-bar__container": "_checkbox-button-bar__container_5gd9n_1",
9
+ "checkbox-button-bar__container--label-left": "_checkbox-button-bar__container--label-left_5gd9n_5",
10
+ "checkbox-button-bar__container--label-top": "_checkbox-button-bar__container--label-top_5gd9n_10",
11
+ "checkbox-button-bar__row-container": "_checkbox-button-bar__row-container_5gd9n_15",
12
+ "checkbox-button-bar__row": "_checkbox-button-bar__row_5gd9n_15",
13
+ "checkbox-button-bar__row--not-validated": "_checkbox-button-bar__row--not-validated_5gd9n_30",
14
+ "checkbox-button-bar__footer": "_checkbox-button-bar__footer_5gd9n_33"
18
15
  }, B = ({
19
- checkboxes: i,
20
- defaultValues: c,
21
- label: h,
22
- labelPosition: _ = "top",
16
+ checkboxes: d,
17
+ defaultValues: r,
18
+ label: a,
19
+ labelPosition: u = "top",
23
20
  required: m = !1,
24
- notValidated: d = !1,
25
- notValidatedText: a = "",
21
+ notValidated: f = !1,
22
+ notValidatedText: b = "",
26
23
  actAsRadioButtonBar: n = !1,
27
- footerText: x = "",
28
- disableGroup: g = !1,
29
- onSetValues: k
24
+ footerText: l = "",
25
+ disableGroup: p = !1,
26
+ onSetValues: i
30
27
  }) => {
31
- const [f, s] = N(
32
- c && !n ? c.map(String) : c && n ? c.slice(0, 1) : []
33
- ), p = (t) => {
34
- let e = f;
35
- n ? (s([t]), k([t])) : (e.includes(t) ? e = e.filter((l) => l !== t) : e = [...e, t], s(e), k(e));
28
+ const [h, s] = C(
29
+ r && !n ? r.map(String) : r && n ? r.slice(0, 1) : []
30
+ ), g = (e) => {
31
+ let o = h;
32
+ n ? (s([e]), i([e])) : (o.includes(e) ? o = o.filter((_) => _ !== e) : o = [...o, e], s(o), i(o));
36
33
  };
37
- return /* @__PURE__ */ u(
34
+ return /* @__PURE__ */ k(
38
35
  "div",
39
36
  {
40
- className: r(b["checkbox-button-bar__container"], [
41
- _ === "left" && b["checkbox-button-bar__container--label-left"]
42
- ]),
37
+ className: x(
38
+ t["checkbox-button-bar__container"],
39
+ t[`checkbox-button-bar__container--label-${u}`]
40
+ ),
43
41
  children: [
44
- /* @__PURE__ */ o("div", { className: b["checkbox-button-bar__label"], children: h && /* @__PURE__ */ o(C, { htmlFor: "", required: m, children: h }) }),
45
- /* @__PURE__ */ o(
46
- "div",
47
- {
48
- className: r(b["checkbox-button-bar__bar"], [
49
- _ === "left" && b["checkbox-button-bar__bar--label-left"]
50
- ]),
51
- children: /* @__PURE__ */ o(
52
- "div",
53
- {
54
- className: r(b["checkbox-button-bar__row"], {
55
- [b["checkbox-button-bar__row--not-validated"]]: d || a
56
- }),
57
- children: i.map(({ label: t, value: e, prefix: l, disabled: v }) => /* @__PURE__ */ o(
58
- j,
59
- {
60
- type: "checkbox",
61
- label: t,
62
- prefix: l,
63
- forceSquared: !0,
64
- value: e,
65
- checked: f.includes(e),
66
- disabled: v || g,
67
- onSetValue: (w) => p(w.target.value)
68
- },
69
- `${e}`
70
- ))
71
- }
72
- )
73
- }
74
- ),
75
- /* @__PURE__ */ u(
76
- "div",
77
- {
78
- className: r(b["checkbox-button-bar__footer"], [
79
- _ === "left" && b["checkbox-button-bar__footer--label-left"]
80
- ]),
81
- children: [
82
- x && /* @__PURE__ */ o("div", { className: b["checkbox-button-bar__footer-text"], children: x }),
83
- a !== "" && /* @__PURE__ */ o(S, { level: "error", feedback: a })
84
- ]
85
- }
86
- )
42
+ a && /* @__PURE__ */ c(N, { htmlFor: "", required: m, children: a }),
43
+ /* @__PURE__ */ k("div", { className: t["checkbox-button-bar__row-container"], children: [
44
+ /* @__PURE__ */ c(
45
+ "div",
46
+ {
47
+ className: x(t["checkbox-button-bar__row"], {
48
+ [t["checkbox-button-bar__row--not-validated"]]: f || b
49
+ }),
50
+ children: d.map(({ label: e, value: o, prefix: _, disabled: w }) => /* @__PURE__ */ c(
51
+ j,
52
+ {
53
+ type: "checkbox",
54
+ label: e,
55
+ prefix: _,
56
+ forceSquared: !0,
57
+ value: o,
58
+ checked: h.includes(o),
59
+ disabled: w || p,
60
+ onSetValue: (v) => g(v.target.value)
61
+ },
62
+ `${o}`
63
+ ))
64
+ }
65
+ ),
66
+ l && /* @__PURE__ */ c("div", { className: t["checkbox-button-bar__footer"], children: l }),
67
+ b !== "" && /* @__PURE__ */ c(S, { level: "error", feedback: b })
68
+ ] })
87
69
  ]
88
70
  }
89
71
  );
@@ -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 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;\n value: string;\n prefix?: string;\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 missing in validation; otherwise, `false`. */\n notValidated?: 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 onSetValues: (value: string[]) => void;\n}\n\nexport const CheckboxButtonBar = ({\n checkboxes,\n defaultValues,\n label,\n labelPosition = 'top',\n required = false,\n notValidated = false,\n notValidatedText = '',\n actAsRadioButtonBar = false,\n footerText = '',\n disableGroup = 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(styles['checkbox-button-bar__container'], [\n labelPosition === 'left' && styles['checkbox-button-bar__container--label-left'],\n ])}\n >\n <div className={styles['checkbox-button-bar__label']}>\n {label && (\n <Label htmlFor=\"\" required={required}>\n {label}\n </Label>\n )}\n </div>\n <div\n className={clsx(styles['checkbox-button-bar__bar'], [\n labelPosition === 'left' && styles['checkbox-button-bar__bar--label-left'],\n ])}\n >\n <div\n className={clsx(styles['checkbox-button-bar__row'], {\n [styles['checkbox-button-bar__row--not-validated']]: notValidated || notValidatedText,\n })}\n >\n {checkboxes.map(({ label, value, prefix, disabled }) => (\n <ControlsButton\n key={`${value}`}\n type=\"checkbox\"\n label={label}\n prefix={prefix}\n forceSquared={true}\n value={value}\n checked={currentValues.includes(value)}\n disabled={disabled || disableGroup}\n onSetValue={(event) => handleChange(event.target.value)}\n />\n ))}\n </div>\n </div>\n <div\n className={clsx(styles['checkbox-button-bar__footer'], [\n labelPosition === 'left' && styles['checkbox-button-bar__footer--label-left'],\n ])}\n >\n {footerText && <div className={styles['checkbox-button-bar__footer-text']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n </div>\n );\n};\n"],"names":["CheckboxButtonBar","checkboxes","defaultValues","label","labelPosition","required","notValidated","notValidatedText","actAsRadioButtonBar","footerText","disableGroup","onSetValues","currentValues","setCurrentValues","useState","handleChange","value","values","val","jsxs","clsx","styles","jsx","Label","prefix","disabled","ControlsButton","event","FeedbackBox"],"mappings":";;;;;;;;;;;;;;;;;GAuCaA,IAAoB,CAAC;AAAA,EAChC,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC,IAAW;AAAA,EACX,cAAAC,IAAe;AAAA,EACf,kBAAAC,IAAmB;AAAA,EACnB,qBAAAC,IAAsB;AAAA,EACtB,YAAAC,IAAa;AAAA,EACb,cAAAC,IAAe;AAAA,EACf,aAAAC;AACF,MAA8B;AAC5B,QAAM,CAACC,GAAeC,CAAgB,IAAIC;AAAA,IACxCZ,KAAiB,CAACM,IACdN,EAAc,IAAI,MAAM,IACxBA,KAAiBM,IACfN,EAAc,MAAM,GAAG,CAAC,IACxB,CAAA;AAAA,EAAC,GAGHa,IAAe,CAACC,MAAkB;AACtC,QAAIC,IAASL;AAEb,IAAIJ,KACFK,EAAiB,CAACG,CAAK,CAAC,GACxBL,EAAY,CAACK,CAAK,CAAC,MAEfC,EAAO,SAASD,CAAK,IACvBC,IAASA,EAAO,OAAO,CAACC,MAAQA,MAAQF,CAAK,IAE7CC,IAAS,CAAC,GAAGA,GAAQD,CAAK,GAE5BH,EAAiBI,CAAM,GACvBN,EAAYM,CAAM;AAAA,EACpB;AAGF,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,gCAAgC,GAAG;AAAA,QACxDjB,MAAkB,UAAUiB,EAAO,4CAA4C;AAAA,MAAA,CAChF;AAAA,MAED,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,4BAA4B,GAChD,UAAAlB,KACC,gBAAAmB,EAACC,GAAA,EAAM,SAAQ,IAAG,UAAAlB,GACf,UAAAF,EAAA,CACH,GAEJ;AAAA,QACA,gBAAAmB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWF,EAAKC,EAAO,0BAA0B,GAAG;AAAA,cAClDjB,MAAkB,UAAUiB,EAAO,sCAAsC;AAAA,YAAA,CAC1E;AAAA,YAED,UAAA,gBAAAC;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWF,EAAKC,EAAO,0BAA0B,GAAG;AAAA,kBAClD,CAACA,EAAO,yCAAyC,CAAC,GAAGf,KAAgBC;AAAA,gBAAA,CACtE;AAAA,gBAEA,UAAAN,EAAW,IAAI,CAAC,EAAE,OAAAE,GAAO,OAAAa,GAAO,QAAAQ,GAAQ,UAAAC,EAAA,MACvC,gBAAAH;AAAA,kBAACI;AAAA,kBAAA;AAAA,oBAEC,MAAK;AAAA,oBACL,OAAOvB;AAAAA,oBACP,QAAAqB;AAAA,oBACA,cAAc;AAAA,oBACd,OAAAR;AAAA,oBACA,SAASJ,EAAc,SAASI,CAAK;AAAA,oBACrC,UAAUS,KAAYf;AAAA,oBACtB,YAAY,CAACiB,MAAUZ,EAAaY,EAAM,OAAO,KAAK;AAAA,kBAAA;AAAA,kBARjD,GAAGX,CAAK;AAAA,gBAAA,CAUhB;AAAA,cAAA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA;AAAA,QAEF,gBAAAG;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWC,EAAKC,EAAO,6BAA6B,GAAG;AAAA,cACrDjB,MAAkB,UAAUiB,EAAO,yCAAyC;AAAA,YAAA,CAC7E;AAAA,YAEA,UAAA;AAAA,cAAAZ,uBAAe,OAAA,EAAI,WAAWY,EAAO,kCAAkC,GAAI,UAAAZ,GAAW;AAAA,cACtFF,MAAqB,MAAM,gBAAAe,EAACM,KAAY,OAAM,SAAQ,UAAUrB,EAAA,CAAkB;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACrF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
1
+ {"version":3,"file":"CheckboxButtonBar.js","sources":["../../../src/components/CheckboxButtonBar/CheckboxButtonBar.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { clsx } from 'clsx';\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;\n value: string;\n prefix?: string;\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 missing in validation; otherwise, `false`. */\n notValidated?: 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 onSetValues: (value: string[]) => void;\n}\n\nexport const CheckboxButtonBar = ({\n checkboxes,\n defaultValues,\n label,\n labelPosition = 'top',\n required = false,\n notValidated = false,\n notValidatedText = '',\n actAsRadioButtonBar = false,\n footerText = '',\n disableGroup = 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 {label}\n </Label>\n )}\n <div className={styles['checkbox-button-bar__row-container']}>\n <div\n className={clsx(styles['checkbox-button-bar__row'], {\n [styles['checkbox-button-bar__row--not-validated']]: notValidated || notValidatedText,\n })}\n >\n {checkboxes.map(({ label, value, prefix, disabled }) => (\n <ControlsButton\n key={`${value}`}\n type=\"checkbox\"\n label={label}\n prefix={prefix}\n forceSquared={true}\n value={value}\n checked={currentValues.includes(value)}\n disabled={disabled || disableGroup}\n onSetValue={(event) => handleChange(event.target.value)}\n />\n ))}\n </div>\n {footerText && <div className={styles['checkbox-button-bar__footer']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n </div>\n );\n};\n"],"names":["CheckboxButtonBar","checkboxes","defaultValues","label","labelPosition","required","notValidated","notValidatedText","actAsRadioButtonBar","footerText","disableGroup","onSetValues","currentValues","setCurrentValues","useState","handleChange","value","values","val","jsxs","clsx","styles","jsx","Label","prefix","disabled","ControlsButton","event","FeedbackBox"],"mappings":";;;;;;;;;;;;;;GAuCaA,IAAoB,CAAC;AAAA,EAChC,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC,IAAW;AAAA,EACX,cAAAC,IAAe;AAAA,EACf,kBAAAC,IAAmB;AAAA,EACnB,qBAAAC,IAAsB;AAAA,EACtB,YAAAC,IAAa;AAAA,EACb,cAAAC,IAAe;AAAA,EACf,aAAAC;AACF,MAA8B;AAC5B,QAAM,CAACC,GAAeC,CAAgB,IAAIC;AAAA,IACxCZ,KAAiB,CAACM,IACdN,EAAc,IAAI,MAAM,IACxBA,KAAiBM,IACfN,EAAc,MAAM,GAAG,CAAC,IACxB,CAAA;AAAA,EAAC,GAGHa,IAAe,CAACC,MAAkB;AACtC,QAAIC,IAASL;AAEb,IAAIJ,KACFK,EAAiB,CAACG,CAAK,CAAC,GACxBL,EAAY,CAACK,CAAK,CAAC,MAEfC,EAAO,SAASD,CAAK,IACvBC,IAASA,EAAO,OAAO,CAACC,MAAQA,MAAQF,CAAK,IAE7CC,IAAS,CAAC,GAAGA,GAAQD,CAAK,GAE5BH,EAAiBI,CAAM,GACvBN,EAAYM,CAAM;AAAA,EACpB;AAGF,SACE,gBAAAE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACTC,EAAO,gCAAgC;AAAA,QACvCA,EAAO,yCAAyCjB,CAAa,EAAE;AAAA,MAAA;AAAA,MAGhE,UAAA;AAAA,QAAAD,KACC,gBAAAmB,EAACC,GAAA,EAAM,SAAQ,IAAG,UAAAlB,GACf,UAAAF,GACH;AAAA,QAEF,gBAAAgB,EAAC,OAAA,EAAI,WAAWE,EAAO,oCAAoC,GACzD,UAAA;AAAA,UAAA,gBAAAC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWF,EAAKC,EAAO,0BAA0B,GAAG;AAAA,gBAClD,CAACA,EAAO,yCAAyC,CAAC,GAAGf,KAAgBC;AAAA,cAAA,CACtE;AAAA,cAEA,UAAAN,EAAW,IAAI,CAAC,EAAE,OAAAE,GAAO,OAAAa,GAAO,QAAAQ,GAAQ,UAAAC,EAAA,MACvC,gBAAAH;AAAA,gBAACI;AAAA,gBAAA;AAAA,kBAEC,MAAK;AAAA,kBACL,OAAOvB;AAAAA,kBACP,QAAAqB;AAAA,kBACA,cAAc;AAAA,kBACd,OAAAR;AAAA,kBACA,SAASJ,EAAc,SAASI,CAAK;AAAA,kBACrC,UAAUS,KAAYf;AAAA,kBACtB,YAAY,CAACiB,MAAUZ,EAAaY,EAAM,OAAO,KAAK;AAAA,gBAAA;AAAA,gBARjD,GAAGX,CAAK;AAAA,cAAA,CAUhB;AAAA,YAAA;AAAA,UAAA;AAAA,UAEFP,KAAc,gBAAAa,EAAC,OAAA,EAAI,WAAWD,EAAO,6BAA6B,GAAI,UAAAZ,GAAW;AAAA,UACjFF,MAAqB,MAAM,gBAAAe,EAACM,KAAY,OAAM,SAAQ,UAAUrB,EAAA,CAAkB;AAAA,QAAA,EAAA,CACrF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
@@ -1,49 +1,49 @@
1
- import { jsxs as _, Fragment as b, jsx as r } from "react/jsx-runtime";
2
- import { useId as m } from "react";
3
- import { c as h } from "../../clsx-OuTLNxxd.js";
1
+ import { jsxs as i, Fragment as b, jsx as n } from "react/jsx-runtime";
2
+ import { useId as d } from "react";
3
+ import { c as m } from "../../clsx-OuTLNxxd.js";
4
4
  import '../../assets/ControlsButton.css';const t = {
5
- "controls-button": "_controls-button_1jd0n_1",
6
- "controls-button--squared": "_controls-button--squared_1jd0n_17",
7
- "controls-input": "_controls-input_1jd0n_21",
8
- "controls-button--with-prefix": "_controls-button--with-prefix_1jd0n_60",
9
- "controls-button__wrapper": "_controls-button__wrapper_1jd0n_66",
10
- "controls-button__prefix": "_controls-button__prefix_1jd0n_72"
5
+ "controls-button": "_controls-button_1jiif_1",
6
+ "controls-button--squared": "_controls-button--squared_1jiif_19",
7
+ "controls-input": "_controls-input_1jiif_23",
8
+ "controls-button--with-prefix": "_controls-button--with-prefix_1jiif_62",
9
+ "controls-button__wrapper": "_controls-button__wrapper_1jiif_68",
10
+ "controls-button__prefix": "_controls-button__prefix_1jiif_74"
11
11
  }, w = ({
12
- type: e = "checkbox",
12
+ type: _ = "checkbox",
13
13
  label: o,
14
- value: l,
15
- prefix: n,
14
+ value: e,
15
+ prefix: r,
16
16
  name: s,
17
- forceSquared: u = !1,
18
- checked: i,
17
+ forceSquared: l = !1,
18
+ checked: u,
19
19
  disabled: p,
20
20
  onSetValue: a
21
21
  }) => {
22
- const c = m();
23
- return /* @__PURE__ */ _(b, { children: [
24
- /* @__PURE__ */ r(
22
+ const c = d();
23
+ return /* @__PURE__ */ i(b, { children: [
24
+ /* @__PURE__ */ n(
25
25
  "input",
26
26
  {
27
- type: e,
27
+ type: _,
28
28
  id: `${c}${o.replace(/\s+/g, "_")}`,
29
29
  name: s || o.replace(/\s+/g, "_"),
30
30
  disabled: p,
31
- value: l,
32
- checked: i,
33
- onChange: (d) => a(d),
31
+ value: e,
32
+ checked: u,
33
+ onChange: (f) => a(f),
34
34
  className: t["controls-input"]
35
35
  }
36
36
  ),
37
- /* @__PURE__ */ r(
37
+ /* @__PURE__ */ n(
38
38
  "label",
39
39
  {
40
40
  htmlFor: `${c}${o.replace(/\s+/g, "_")}`,
41
- className: h(t["controls-button"], [
42
- u && t["controls-button--squared"],
43
- n && t["controls-button--with-prefix"]
41
+ className: m(t["controls-button"], [
42
+ l && t["controls-button--squared"],
43
+ r && t["controls-button--with-prefix"]
44
44
  ]),
45
- children: /* @__PURE__ */ _("div", { className: t["controls-button__wrapper"], children: [
46
- n && /* @__PURE__ */ r("div", { className: t["controls-button__prefix"], children: n }),
45
+ children: /* @__PURE__ */ i("div", { className: t["controls-button__wrapper"], children: [
46
+ r && /* @__PURE__ */ n("div", { className: t["controls-button__prefix"], children: r }),
47
47
  o
48
48
  ] })
49
49
  }
@@ -1,5 +1,5 @@
1
1
  import { jsxs as f, jsx as l } from "react/jsx-runtime";
2
- import { c as x } from "../../clsx-OuTLNxxd.js";
2
+ import { c as k } from "../../clsx-OuTLNxxd.js";
3
3
  import { useRef as v, useState as M, useEffect as $ } from "react";
4
4
  import "../Buttons/Button.js";
5
5
  import "../Buttons/LinkButton.js";
@@ -10,12 +10,12 @@ import "@react-aria/dialog";
10
10
  import "@react-aria/focus";
11
11
  import "@react-aria/overlays";
12
12
  import "../OverlayCloseButton/OverlayCloseButton.js";
13
- import { FeedbackBox as w } from "../FeedbackBox/FeedbackBox.js";
13
+ import { FeedbackBox as B } from "../FeedbackBox/FeedbackBox.js";
14
14
  import "../GridRow/GridRow.js";
15
15
  import "../IconButton/IconButton.js";
16
16
  import "../Input/Input.js";
17
17
  import "../InputField/InputField.js";
18
- import { Label as B } from "../Label/Label.js";
18
+ import { Label as D } from "../Label/Label.js";
19
19
  import "react-router";
20
20
  import "../../TablePlugin-CI_6HCsd.js";
21
21
  import "../RteEditor/Providers/LanguageProvider.js";
@@ -27,60 +27,60 @@ import "../SelectListbox/SelectProvider.js";
27
27
  import "../Sortable/components/SortableItem.js";
28
28
  import "../../SortableProvider-l8-7ClBJ.js";
29
29
  import '../../assets/PeriodSelector.css';const s = {
30
- "period-selector__container": "_period-selector__container_d1p0j_1",
31
- "period-selector__container--label-left": "_period-selector__container--label-left_d1p0j_6",
32
- "period-selector__container--label-top": "_period-selector__container--label-top_d1p0j_12",
33
- "period-selector__selector-container": "_period-selector__selector-container_d1p0j_18",
34
- "period-selector__selector-row": "_period-selector__selector-row_d1p0j_24"
35
- }, h = 0, S = 1, E = 2, _ = 3, D = 7, I = (i) => {
30
+ "period-selector__container": "_period-selector__container_1txwd_1",
31
+ "period-selector__container--label-left": "_period-selector__container--label-left_1txwd_6",
32
+ "period-selector__container--label-top": "_period-selector__container--label-top_1txwd_12",
33
+ "period-selector__selector-container": "_period-selector__selector-container_1txwd_18",
34
+ "period-selector__selector-row": "_period-selector__selector-row_1txwd_24"
35
+ }, h = 0, S = 1, E = 2, _ = 3, I = 7, j = (i) => {
36
36
  const n = [];
37
- for (let t = 0; t < i.length; t += _)
38
- n.push(i.slice(t, t + _));
37
+ for (let o = 0; o < i.length; o += _)
38
+ n.push(i.slice(o, o + _));
39
39
  return n;
40
40
  }, se = ({
41
- maxPeriods: i = D,
41
+ maxPeriods: i = I,
42
42
  defaultValues: n,
43
- label: t,
43
+ label: o,
44
44
  labelPosition: b = "top",
45
45
  required: m = !1,
46
46
  notValidatedText: p = "",
47
- onChange: g
47
+ onChange: x
48
48
  }) => {
49
- const R = Array.from({ length: i }, (e, r) => r + 1), a = I(R), j = a.map((e, r) => e.map((o) => ({
50
- label: `${r + 1}${e.length === 1 ? "" : `.${(o - 1) % _ + 1}`}`,
51
- value: o.toString()
49
+ const g = Array.from({ length: i }, (e, r) => r + 1), a = j(g), w = a.map((e, r) => e.map((t) => ({
50
+ label: `${r + 1}${e.length === 1 ? "" : `.${(t - 1) % _ + 1}`}`,
51
+ value: t.toString()
52
52
  }))), c = v(
53
53
  a.map(
54
- (e) => e.reduce((r, o) => (n?.includes(o) && r.push(o), r), [])
54
+ (e) => e.reduce((r, t) => (n?.includes(t) && r.push(t), r), [])
55
55
  )
56
- ), [P, d] = M([]), u = (e) => e[h].length !== 0 || e[S].length !== 0 ? [E] : e[E].length !== 0 ? [h, S] : [], k = (e, r) => {
57
- c.current[r] = e.map((o) => Number(o)), d(u(c.current)), g([...c.current.flat()].sort());
56
+ ), [R, d] = M([]), u = (e) => e[h].length !== 0 || e[S].length !== 0 ? [E] : e[E].length !== 0 ? [h, S] : [], P = (e, r) => {
57
+ c.current[r] = e.map((t) => Number(t)), d(u(c.current)), x([...c.current.flat()].sort());
58
58
  };
59
59
  return $(() => {
60
60
  d(u(c.current));
61
61
  }, []), /* @__PURE__ */ f(
62
62
  "div",
63
63
  {
64
- className: x(
64
+ className: k(
65
65
  s["period-selector__container"],
66
66
  s[`period-selector__container--label-${b}`]
67
67
  ),
68
68
  children: [
69
- t && /* @__PURE__ */ l(B, { htmlFor: "", required: m, children: t }),
69
+ o && /* @__PURE__ */ l(D, { htmlFor: "", required: m, children: o }),
70
70
  /* @__PURE__ */ f("div", { className: s["period-selector__selector-container"], children: [
71
- /* @__PURE__ */ l("div", { className: s["period-selector__selector-row"], children: j.map((e, r) => /* @__PURE__ */ l(
71
+ /* @__PURE__ */ l("div", { className: s["period-selector__selector-row"], children: w.map((e, r) => /* @__PURE__ */ l(
72
72
  N,
73
73
  {
74
74
  checkboxes: e,
75
- defaultValues: c.current[r].map((o) => o.toString()),
76
- disableGroup: P.includes(r),
75
+ defaultValues: c.current[r].map((t) => t.toString()),
76
+ disableGroup: R.includes(r),
77
77
  required: m,
78
- onSetValues: (o) => k(o, r),
78
+ onSetValues: (t) => P(t, r),
79
79
  notValidated: p !== ""
80
80
  },
81
81
  `group_${r}`
82
82
  )) }),
83
- p !== "" && /* @__PURE__ */ l(w, { level: "error", feedback: p })
83
+ p !== "" && /* @__PURE__ */ l(B, { level: "error", feedback: p })
84
84
  ] })
85
85
  ]
86
86
  }
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@uva-glass/component-library",
3
3
  "author": "Team Glass - Frontend vrienden",
4
4
  "private": false,
5
- "version": "3.34.10",
5
+ "version": "3.34.11",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
8
8
  "types": "dist/index.d.ts",