@uva-glass/component-library 3.50.11 → 3.50.13

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
- ._controls-input_ol6hz_1{aspect-ratio:unset;cursor:pointer;height:0;opacity:0;position:absolute;width:0}._controls-input_ol6hz_1:focus-visible+label{outline:.125rem dotted var(--color-navy-600);outline-offset:.125rem}._controls-input_ol6hz_1:checked+label{background-color:var(--color-navy-600);color:var(--color-uva-white);font-weight:var(--semibold)}._controls-input_ol6hz_1:disabled+label,._controls-input_ol6hz_1:disabled:hover+label{background-color:var(--color-grey-400);color:var(--color-grey-700);cursor:not-allowed}._controls-input_ol6hz_1:disabled:checked+label{background-color:var(--color-grey-500);color:var(--color-grey-900);font-weight:var(--semibold)}._controls-input_ol6hz_1:hover+label{background-color:var(--color-grey-300);color:var(--color-uva-black)}._controls-button_ol6hz_39{align-items:center;background-color:var(--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_ol6hz_57{width:2.25rem}._controls-button_ol6hz_39:after{content:"";min-height:2.625rem;min-width:2.625rem;position:absolute;width:100%}._controls-button--with-prefix_ol6hz_69{height:auto;padding:.125rem .5rem;width:auto}._controls-button--with-icon_ol6hz_75{gap:.5rem}._controls-button__wrapper_ol6hz_79{align-items:center;display:flex;flex-direction:column}._controls-button__prefix_ol6hz_85{color:var(--color-uva-700);font-size:var(--font-size-text-non-essential)}._controls-button__tooltip_ol6hz_90{background-color:var(--color-uva-white);box-shadow:0 0 .25rem #00000040;color:var(--color-grey-700);display:none;font-size:var(--font-size-text-non-essential);font-style:italic;font-weight:400;padding:.5rem 1rem;position:absolute;text-align:center;top:calc(100% + .5rem);z-index:1}._controls-button__tooltip--left_ol6hz_105{left:0rem}._controls-button__tooltip--center_ol6hz_109{left:50%;transform:translate(-50%)}._controls-button__tooltip--right_ol6hz_114{right:0rem}._controls-button__tooltip_ol6hz_90:before{border-color:transparent transparent var(--color-grey-400) transparent;border-style:solid;border-width:.5rem;bottom:calc(100% + .125rem);content:"";filter:blur(.125rem);position:absolute;z-index:-1}._controls-button__tooltip_ol6hz_90:after{border-color:transparent transparent var(--color-uva-white) transparent;border-style:solid;border-width:.5rem;bottom:100%;content:"";position:absolute}._controls-button_ol6hz_39:hover ._controls-button__tooltip_ol6hz_90,._controls-input_ol6hz_1:focus-visible+label ._controls-button__tooltip_ol6hz_90{display:block}._controls-button__tooltip--left_ol6hz_105:before,._controls-button__tooltip--left_ol6hz_105:after{left:.5rem}._controls-button__tooltip--center_ol6hz_109:before,._controls-button__tooltip--center_ol6hz_109:after{left:50%;transform:translate(-50%)}._controls-button__tooltip--right_ol6hz_114:before,._controls-button__tooltip--right_ol6hz_114:after{right:.5rem}
1
+ ._controls-input_17k7u_1{aspect-ratio:unset;cursor:pointer;height:0;opacity:0;position:absolute;width:0}._controls-input_17k7u_1:focus-visible+label{outline:.125rem dotted var(--color-navy-600);outline-offset:.125rem}._controls-input_17k7u_1:checked+label,[type=radio]:checked:hover+label{background-color:var(--color-navy-600);color:var(--color-uva-white);font-weight:var(--semibold)}._controls-input_17k7u_1:disabled+label,._controls-input_17k7u_1:disabled:hover+label{background-color:var(--color-grey-400);color:var(--color-grey-700);cursor:not-allowed}._controls-input_17k7u_1:disabled:checked+label{background-color:var(--color-grey-500);color:var(--color-grey-900);font-weight:var(--semibold)}._controls-input_17k7u_1:hover+label{background-color:var(--color-grey-300);color:var(--color-uva-black)}._controls-button_17k7u_40{align-items:center;background-color:var(--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_17k7u_58{width:2.25rem}._controls-button_17k7u_40:after{content:"";min-height:2.625rem;min-width:2.625rem;position:absolute;width:100%}._controls-button--with-prefix_17k7u_70{height:auto;padding:.125rem .5rem;width:auto}._controls-button--with-icon_17k7u_76{gap:.5rem}._controls-button__wrapper_17k7u_80{align-items:center;display:flex;flex-direction:column}._controls-button__prefix_17k7u_86{color:var(--color-uva-700);font-size:var(--font-size-text-non-essential)}._controls-button__tooltip_17k7u_91{background-color:var(--color-uva-white);box-shadow:0 0 .25rem #00000040;color:var(--color-grey-700);display:none;font-size:var(--font-size-text-non-essential);font-style:italic;font-weight:400;padding:.5rem 1rem;position:absolute;text-align:center;top:calc(100% + .5rem);z-index:1}._controls-button__tooltip--left_17k7u_106{left:0rem}._controls-button__tooltip--center_17k7u_110{left:50%;transform:translate(-50%)}._controls-button__tooltip--right_17k7u_115{right:0rem}._controls-button__tooltip_17k7u_91:before{border-color:transparent transparent var(--color-grey-400) transparent;border-style:solid;border-width:.5rem;bottom:calc(100% + .125rem);content:"";filter:blur(.125rem);position:absolute;z-index:-1}._controls-button__tooltip_17k7u_91:after{border-color:transparent transparent var(--color-uva-white) transparent;border-style:solid;border-width:.5rem;bottom:100%;content:"";position:absolute}._controls-button_17k7u_40:hover ._controls-button__tooltip_17k7u_91,._controls-input_17k7u_1:focus-visible+label ._controls-button__tooltip_17k7u_91{display:block}._controls-button__tooltip--left_17k7u_106:before,._controls-button__tooltip--left_17k7u_106:after{left:.5rem}._controls-button__tooltip--center_17k7u_110:before,._controls-button__tooltip--center_17k7u_110:after{left:50%;transform:translate(-50%)}._controls-button__tooltip--right_17k7u_115:before,._controls-button__tooltip--right_17k7u_115:after{right:.5rem}
@@ -1 +1 @@
1
- ._editor-header__container_18ifd_1{align-items:flex-start;display:flex;flex:1;flex-direction:column;justify-content:flex-start;max-width:calc(100% - 5rem)}._editor-header__info_18ifd_10{color:var(--color-grey-700);font-size:1rem}
1
+ ._editor-header__container_1y1mc_1{align-items:flex-start;display:flex;flex:1;flex-direction:column;justify-content:flex-start;max-width:calc(100% - 5rem)}._editor-header__info_1y1mc_10{color:var(--color-grey-700);font-size:var(--font-size-text-non-essential)}
@@ -1,10 +1,10 @@
1
- import { jsxs as F, jsx as c } from "react/jsx-runtime";
1
+ import { jsxs as F, jsx as b } from "react/jsx-runtime";
2
2
  import { useState as S } from "react";
3
- import { c as _ } from "../../clsx-OuTLNxxd.js";
3
+ import { c as a } from "../../clsx-OuTLNxxd.js";
4
4
  import { Label as L } from "../Label/Label.js";
5
5
  import { FeedbackBox as $ } from "../FeedbackBox/FeedbackBox.js";
6
6
  import { ControlsButton as C } from "../ControlsButton/ControlsButton.js";
7
- import '../../assets/CheckboxButtonBar.css';const t = {
7
+ import '../../assets/CheckboxButtonBar.css';const c = {
8
8
  "checkbox-button-bar__container": "_checkbox-button-bar__container_114ld_1",
9
9
  "checkbox-button-bar__container--label-left": "_checkbox-button-bar__container--label-left_114ld_6",
10
10
  "checkbox-button-bar__container--label-top": "_checkbox-button-bar__container--label-top_114ld_12",
@@ -13,15 +13,15 @@ import '../../assets/CheckboxButtonBar.css';const t = {
13
13
  "checkbox-button-bar__row": "_checkbox-button-bar__row_114ld_18",
14
14
  "checkbox-button-bar__row--not-validated": "_checkbox-button-bar__row--not-validated_114ld_39",
15
15
  "checkbox-button-bar__footer": "_checkbox-button-bar__footer_114ld_43"
16
- }, J = ({
16
+ }, K = ({
17
17
  checkboxes: x,
18
- defaultValues: r,
18
+ defaultValues: n,
19
19
  label: d,
20
20
  labelPosition: y = "top",
21
21
  required: j = !1,
22
22
  notValidated: m = !1,
23
- notValidatedText: n = "",
24
- actAsRadioButtonBar: a = !1,
23
+ notValidatedText: _ = "",
24
+ actAsRadioButtonBar: t = !1,
25
25
  footerText: u = "",
26
26
  disableGroup: f = !1,
27
27
  segmented: p = !1,
@@ -29,38 +29,38 @@ import '../../assets/CheckboxButtonBar.css';const t = {
29
29
  onSetValues: g
30
30
  }) => {
31
31
  const [l, v] = S(
32
- r && !a ? r.map(String) : r && a ? r.slice(0, 1) : []
32
+ n && !t ? n.map(String) : n && t ? n.slice(0, 1) : []
33
33
  ), N = (e) => {
34
34
  let o = l;
35
- a ? (v([e]), g([e])) : (o.includes(e) ? o = o.filter((b) => b !== e) : o = [...o, e], v(o), g(o));
35
+ t ? (v([e]), g([e])) : (o.includes(e) ? o = o.filter((r) => r !== e) : o = [...o, e], v(o), g(o));
36
36
  };
37
37
  return /* @__PURE__ */ F(
38
38
  "div",
39
39
  {
40
- className: _(
41
- t["checkbox-button-bar__container"],
42
- t[`checkbox-button-bar__container--label-${y}`]
40
+ className: a(
41
+ c["checkbox-button-bar__container"],
42
+ c[`checkbox-button-bar__container--label-${y}`]
43
43
  ),
44
44
  children: [
45
- d && /* @__PURE__ */ c(L, { htmlFor: "", required: j, children: d }),
46
- /* @__PURE__ */ c(
45
+ d && /* @__PURE__ */ b(L, { htmlFor: "", required: j, children: d }),
46
+ /* @__PURE__ */ b(
47
47
  "div",
48
48
  {
49
- className: _(t["checkbox-button-bar__row-container"], {
50
- [t["checkbox-button-bar__row-container--segmented"]]: p
49
+ className: a(c["checkbox-button-bar__row-container"], {
50
+ [c["checkbox-button-bar__row-container--segmented"]]: p
51
51
  }),
52
- children: p ? x.map(({ label: e, value: o, prefix: b, tooltip: h, tooltipPosition: i, disabled: s }) => /* @__PURE__ */ c(
52
+ children: p ? x.map(({ label: e, value: o, prefix: r, tooltip: h, tooltipPosition: i, disabled: s }) => /* @__PURE__ */ b(
53
53
  "div",
54
54
  {
55
- className: _(t["checkbox-button-bar__row"], {
56
- [t["checkbox-button-bar__row--not-validated"]]: m || n
55
+ className: a(c["checkbox-button-bar__row"], {
56
+ [c["checkbox-button-bar__row--not-validated"]]: m || _
57
57
  }),
58
- children: /* @__PURE__ */ c(
58
+ children: /* @__PURE__ */ b(
59
59
  C,
60
60
  {
61
- type: "checkbox",
61
+ type: t ? "radio" : "checkbox",
62
62
  label: e,
63
- prefix: b,
63
+ prefix: r,
64
64
  tooltip: h,
65
65
  tooltipPosition: i,
66
66
  forceSquared: w,
@@ -72,18 +72,18 @@ import '../../assets/CheckboxButtonBar.css';const t = {
72
72
  )
73
73
  },
74
74
  o
75
- )) : /* @__PURE__ */ c(
75
+ )) : /* @__PURE__ */ b(
76
76
  "div",
77
77
  {
78
- className: _(t["checkbox-button-bar__row"], {
79
- [t["checkbox-button-bar__row--not-validated"]]: m || n
78
+ className: a(c["checkbox-button-bar__row"], {
79
+ [c["checkbox-button-bar__row--not-validated"]]: m || _
80
80
  }),
81
- children: x.map(({ label: e, value: o, prefix: b, tooltip: h, tooltipPosition: i, disabled: s }) => /* @__PURE__ */ c(
81
+ children: x.map(({ label: e, value: o, prefix: r, tooltip: h, tooltipPosition: i, disabled: s }) => /* @__PURE__ */ b(
82
82
  C,
83
83
  {
84
- type: "checkbox",
84
+ type: t ? "radio" : "checkbox",
85
85
  label: e,
86
- prefix: b,
86
+ prefix: r,
87
87
  tooltip: h,
88
88
  tooltipPosition: i,
89
89
  forceSquared: w,
@@ -98,13 +98,13 @@ import '../../assets/CheckboxButtonBar.css';const t = {
98
98
  )
99
99
  }
100
100
  ),
101
- u && /* @__PURE__ */ c("div", { className: t["checkbox-button-bar__footer"], children: u }),
102
- n !== "" && /* @__PURE__ */ c($, { level: "error", feedback: n })
101
+ u && /* @__PURE__ */ b("div", { className: c["checkbox-button-bar__footer"], children: u }),
102
+ _ !== "" && /* @__PURE__ */ b($, { level: "error", feedback: _ })
103
103
  ]
104
104
  }
105
105
  );
106
106
  };
107
107
  export {
108
- J as CheckboxButtonBar
108
+ K as CheckboxButtonBar
109
109
  };
110
110
  //# 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 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 /** `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 notValidated = 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 {label}\n </Label>\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-validated']]: notValidated || notValidatedText,\n })}\n >\n <ControlsButton\n type=\"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-validated']]: notValidated || notValidatedText,\n })}\n >\n {checkboxes.map(({ label, value, prefix, tooltip, tooltipPosition, disabled }) => (\n <ControlsButton\n key={value}\n type=\"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__footer']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n );\n};\n"],"names":["CheckboxButtonBar","checkboxes","defaultValues","label","labelPosition","required","notValidated","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
+ {"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 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 /** `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 notValidated = 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 {label}\n </Label>\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-validated']]: notValidated || 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-validated']]: notValidated || 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__footer']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n );\n};\n"],"names":["CheckboxButtonBar","checkboxes","defaultValues","label","labelPosition","required","notValidated","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,71 +1,71 @@
1
- import { jsxs as c, Fragment as w, jsx as t } from "react/jsx-runtime";
1
+ import { jsxs as c, Fragment as w, jsx as o } from "react/jsx-runtime";
2
2
  import { useId as g } from "react";
3
3
  import { c as b } from "../../clsx-OuTLNxxd.js";
4
4
  import { Icon as I } from "../Icon/Icon.js";
5
- import '../../assets/ControlsButton.css';const o = {
6
- "controls-input": "_controls-input_ol6hz_1",
7
- "controls-button": "_controls-button_ol6hz_39",
8
- "controls-button--squared": "_controls-button--squared_ol6hz_57",
9
- "controls-button--with-prefix": "_controls-button--with-prefix_ol6hz_69",
10
- "controls-button--with-icon": "_controls-button--with-icon_ol6hz_75",
11
- "controls-button__wrapper": "_controls-button__wrapper_ol6hz_79",
12
- "controls-button__prefix": "_controls-button__prefix_ol6hz_85",
13
- "controls-button__tooltip": "_controls-button__tooltip_ol6hz_90",
14
- "controls-button__tooltip--left": "_controls-button__tooltip--left_ol6hz_105",
15
- "controls-button__tooltip--center": "_controls-button__tooltip--center_ol6hz_109",
16
- "controls-button__tooltip--right": "_controls-button__tooltip--right_ol6hz_114"
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
17
  }, j = ({
18
18
  type: p = "checkbox",
19
19
  label: n,
20
20
  value: i,
21
21
  iconName: r,
22
- prefix: l,
23
- tooltip: s,
24
- tooltipPosition: h = "center",
25
- name: a,
26
- forceSquared: d = !1,
22
+ prefix: s,
23
+ tooltip: _,
24
+ tooltipPosition: a = "center",
25
+ name: d,
26
+ forceSquared: h = !1,
27
27
  checked: m,
28
28
  disabled: f,
29
- onSetValue: z
29
+ onSetValue: k
30
30
  }) => {
31
- const x = g(), e = (typeof n == "string" ? n : i).replace(/\s+/g, "_"), _ = `${x}${e}`, u = `${_}-tooltip`;
31
+ const x = g(), u = (typeof n == "string" ? n : i).replace(/\s+/g, "_"), l = `${x}${u}`, e = `${l}-tooltip`;
32
32
  return /* @__PURE__ */ c(w, { children: [
33
- /* @__PURE__ */ t(
33
+ /* @__PURE__ */ o(
34
34
  "input",
35
35
  {
36
36
  type: p,
37
- id: _,
38
- name: a ?? e,
37
+ id: l,
38
+ name: d ?? u,
39
39
  disabled: f,
40
40
  value: i,
41
41
  checked: m,
42
- onChange: z,
43
- className: o["controls-input"],
44
- "aria-describedby": s ? u : void 0
42
+ onChange: k,
43
+ className: t["controls-input"],
44
+ "aria-describedby": _ ? e : void 0
45
45
  }
46
46
  ),
47
47
  /* @__PURE__ */ c(
48
48
  "label",
49
49
  {
50
- htmlFor: _,
51
- className: b(o["controls-button"], [
52
- d && o["controls-button--squared"],
53
- l && o["controls-button--with-prefix"],
54
- r && o["controls-button--with-icon"]
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"]
55
55
  ]),
56
56
  children: [
57
- r && /* @__PURE__ */ t(I, { name: r, size: 20 }),
58
- /* @__PURE__ */ c("div", { className: o["controls-button__wrapper"], children: [
59
- l && /* @__PURE__ */ t("div", { className: o["controls-button__prefix"], children: l }),
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
60
  n
61
61
  ] }),
62
- s && /* @__PURE__ */ t(
62
+ _ && /* @__PURE__ */ o(
63
63
  "div",
64
64
  {
65
- id: u,
65
+ id: e,
66
66
  role: "tooltip",
67
- className: b(o["controls-button__tooltip"], o[`controls-button__tooltip--${h}`]),
68
- children: s
67
+ className: b(t["controls-button__tooltip"], t[`controls-button__tooltip--${a}`]),
68
+ children: _
69
69
  }
70
70
  )
71
71
  ]
@@ -28,16 +28,16 @@ import "../../Sortable/components/SortableItem.js";
28
28
  import "../../../SortableProvider-BbwlEPIr.js";
29
29
  import "../../WeekSelector/components/WeekSelectorOptionContainer.js";
30
30
  import '../../../assets/EditorHeader.css';const t = {
31
- "editor-header__container": "_editor-header__container_18ifd_1",
32
- "editor-header__info": "_editor-header__info_18ifd_10"
33
- }, G = ({ label: i, info: o = "", required: m = !1 }) => {
31
+ "editor-header__container": "_editor-header__container_1y1mc_1",
32
+ "editor-header__info": "_editor-header__info_1y1mc_10"
33
+ }, B = ({ label: o, info: i = "", required: m = !1 }) => {
34
34
  const e = `info_${d()}`;
35
35
  return /* @__PURE__ */ p("div", { className: t["editor-header__container"], children: [
36
- i !== "" && /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(_, { htmlFor: e, required: m, children: i }) }),
37
- o !== "" && /* @__PURE__ */ r("div", { className: t["editor-header__info"], children: o })
36
+ o !== "" && /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(_, { htmlFor: e, required: m, children: o }) }),
37
+ i !== "" && /* @__PURE__ */ r("div", { className: t["editor-header__info"], dangerouslySetInnerHTML: { __html: i } })
38
38
  ] });
39
39
  };
40
40
  export {
41
- G as EditorHeader
41
+ B as EditorHeader
42
42
  };
43
43
  //# sourceMappingURL=EditorHeader.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EditorHeader.js","sources":["../../../../src/components/RteEditor/EditorHeader/EditorHeader.tsx"],"sourcesContent":["import { useId } from 'react';\n\nimport styles from './EditorHeader.module.css';\n\nimport { Label } from 'components';\n\ninterface EditorHeaderProps {\n label: string;\n info?: string;\n required?: boolean;\n}\n\nexport const EditorHeader = ({ label, info = '', required = false }: EditorHeaderProps) => {\n const infoId = `info_${useId()}`;\n\n return (\n <div className={styles['editor-header__container']}>\n {label !== '' && (\n <div>\n <Label htmlFor={infoId} required={required}>\n {label}\n </Label>\n </div>\n )}\n {info !== '' && <div className={styles['editor-header__info']}>{info}</div>}\n </div>\n );\n};\n"],"names":["EditorHeader","label","info","required","infoId","useId","jsxs","styles","jsx","Label"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAYaA,IAAe,CAAC,EAAE,OAAAC,GAAO,MAAAC,IAAO,IAAI,UAAAC,IAAW,SAA+B;AACzF,QAAMC,IAAS,QAAQC,EAAA,CAAO;AAE9B,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,0BAA0B,GAC9C,UAAA;AAAA,IAAAN,MAAU,wBACR,OAAA,EACC,UAAA,gBAAAO,EAACC,KAAM,SAASL,GAAQ,UAAAD,GACrB,UAAAF,EAAA,CACH,EAAA,CACF;AAAA,IAEDC,MAAS,MAAM,gBAAAM,EAAC,OAAA,EAAI,WAAWD,EAAO,qBAAqB,GAAI,UAAAL,EAAA,CAAK;AAAA,EAAA,GACvE;AAEJ;"}
1
+ {"version":3,"file":"EditorHeader.js","sources":["../../../../src/components/RteEditor/EditorHeader/EditorHeader.tsx"],"sourcesContent":["import { useId } from 'react';\n\nimport styles from './EditorHeader.module.css';\n\nimport { Label } from 'components';\n\ninterface EditorHeaderProps {\n label: string;\n info?: string;\n required?: boolean;\n}\n\nexport const EditorHeader = ({ label, info = '', required = false }: EditorHeaderProps) => {\n const infoId = `info_${useId()}`;\n\n return (\n <div className={styles['editor-header__container']}>\n {label !== '' && (\n <div>\n <Label htmlFor={infoId} required={required}>\n {label}\n </Label>\n </div>\n )}\n {info !== '' && <div className={styles['editor-header__info']} dangerouslySetInnerHTML={{ __html: info }} />}\n </div>\n );\n};\n"],"names":["EditorHeader","label","info","required","infoId","useId","jsxs","styles","jsx","Label"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAYaA,IAAe,CAAC,EAAE,OAAAC,GAAO,MAAAC,IAAO,IAAI,UAAAC,IAAW,SAA+B;AACzF,QAAMC,IAAS,QAAQC,EAAA,CAAO;AAE9B,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAO,0BAA0B,GAC9C,UAAA;AAAA,IAAAN,MAAU,wBACR,OAAA,EACC,UAAA,gBAAAO,EAACC,KAAM,SAASL,GAAQ,UAAAD,GACrB,UAAAF,EAAA,CACH,EAAA,CACF;AAAA,IAEDC,MAAS,MAAM,gBAAAM,EAAC,OAAA,EAAI,WAAWD,EAAO,qBAAqB,GAAG,yBAAyB,EAAE,QAAQL,EAAA,EAAK,CAAG;AAAA,EAAA,GAC5G;AAEJ;"}
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.50.11",
5
+ "version": "3.50.13",
6
6
  "type": "module",
7
7
  "main": "dist/index.js",
8
8
  "types": "dist/index.d.ts",