@uva-glass/component-library 3.27.1 → 3.27.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/ControlsButton.css +1 -1
- package/dist/assets/MultiSelectBox.css +1 -1
- package/dist/assets/TextArea.css +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.d.ts +2 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.js +14 -13
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.js.map +1 -1
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.d.ts +1 -0
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js +50 -8
- package/dist/components/CheckboxButtonBar/CheckboxButtonBar.stories.js.map +1 -1
- package/dist/components/ControlsButton/ControlsButton.d.ts +2 -1
- package/dist/components/ControlsButton/ControlsButton.js +34 -24
- package/dist/components/ControlsButton/ControlsButton.js.map +1 -1
- package/dist/components/ControlsButton/ControlsButton.stories.js +3 -3
- package/dist/components/ControlsButton/ControlsButton.stories.js.map +1 -1
- package/dist/components/MultiSelectBox/MultiSelectBox.d.ts +3 -1
- package/dist/components/MultiSelectBox/MultiSelectBox.js +82 -78
- package/dist/components/MultiSelectBox/MultiSelectBox.js.map +1 -1
- package/dist/components/SelectListbox/SelectListBox.stories.js +5 -0
- package/dist/components/SelectListbox/SelectListBox.stories.js.map +1 -1
- package/dist/components/SelectListbox/SelectProvider.js +24 -33
- package/dist/components/SelectListbox/SelectProvider.js.map +1 -1
- package/dist/components/TextArea/TextArea.js +14 -14
- package/package.json +15 -15
|
@@ -1,50 +1,41 @@
|
|
|
1
1
|
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
-
import { createContext as g, useContext as
|
|
3
|
-
const
|
|
4
|
-
const [
|
|
5
|
-
|
|
6
|
-
},
|
|
2
|
+
import { createContext as g, useContext as p, useState as l, useRef as C, useId as P } from "react";
|
|
3
|
+
const d = g({}), L = ({ options: e, defaultValue: o, children: i }) => {
|
|
4
|
+
const [c, v] = l({ value: "", label: "" }), [x, s] = l(!1), [f, r] = l(-1), I = C(P()), b = () => {
|
|
5
|
+
s((t) => !t);
|
|
6
|
+
}, u = (t) => e.find((n) => n.value === t) || {
|
|
7
7
|
value: -1,
|
|
8
8
|
label: "",
|
|
9
9
|
selectedLabel: "-"
|
|
10
|
-
},
|
|
11
|
-
const
|
|
12
|
-
|
|
10
|
+
}, a = (t) => {
|
|
11
|
+
const n = e.findIndex((S) => S.value === t.value);
|
|
12
|
+
r(n), v(t), s(!1);
|
|
13
13
|
};
|
|
14
|
-
return
|
|
15
|
-
|
|
16
|
-
const e = t.find((s) => s.value === l) || {
|
|
17
|
-
value: -1,
|
|
18
|
-
label: "",
|
|
19
|
-
selectedLabel: "-"
|
|
20
|
-
};
|
|
21
|
-
r(e);
|
|
22
|
-
}
|
|
23
|
-
}, [l]), /* @__PURE__ */ m(
|
|
24
|
-
a.Provider,
|
|
14
|
+
return o !== -1 && !c.value && a(u(o)), /* @__PURE__ */ m(
|
|
15
|
+
d.Provider,
|
|
25
16
|
{
|
|
26
17
|
value: {
|
|
27
|
-
options:
|
|
28
|
-
selectedValue:
|
|
29
|
-
setSelectedValue:
|
|
30
|
-
isOpen:
|
|
31
|
-
setIsOpen:
|
|
18
|
+
options: e,
|
|
19
|
+
selectedValue: c,
|
|
20
|
+
setSelectedValue: a,
|
|
21
|
+
isOpen: x,
|
|
22
|
+
setIsOpen: s,
|
|
32
23
|
toggleListbox: b,
|
|
33
|
-
getValue:
|
|
34
|
-
activeIndex:
|
|
35
|
-
setActiveIndex:
|
|
36
|
-
listboxId:
|
|
24
|
+
getValue: u,
|
|
25
|
+
activeIndex: f,
|
|
26
|
+
setActiveIndex: r,
|
|
27
|
+
listboxId: I.current
|
|
37
28
|
},
|
|
38
|
-
children:
|
|
29
|
+
children: i
|
|
39
30
|
}
|
|
40
31
|
);
|
|
41
32
|
}, O = () => {
|
|
42
|
-
const
|
|
43
|
-
if (
|
|
44
|
-
return
|
|
33
|
+
const e = p(d);
|
|
34
|
+
if (e === void 0) throw new Error("useSelect can only be used in an SelectProvider");
|
|
35
|
+
return e;
|
|
45
36
|
};
|
|
46
37
|
export {
|
|
47
|
-
|
|
38
|
+
L as SelectProvider,
|
|
48
39
|
O as useSelect
|
|
49
40
|
};
|
|
50
41
|
//# sourceMappingURL=SelectProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectProvider.js","sources":["../../../src/components/SelectListbox/SelectProvider.tsx"],"sourcesContent":["import { createContext, useContext, useState, useId, useRef
|
|
1
|
+
{"version":3,"file":"SelectProvider.js","sources":["../../../src/components/SelectListbox/SelectProvider.tsx"],"sourcesContent":["import { createContext, useContext, useState, useId, useRef } from 'react';\n\nimport type { PropsWithChildren } from 'react';\n\nexport type SelectValue = string | number | null;\n\nexport type OptionValue = {\n value: SelectValue;\n label: string;\n selectedLabel?: string;\n disabled?: boolean;\n};\nexport interface SelectListboxContext {\n options: OptionValue[];\n selectedValue: OptionValue;\n setSelectedValue: (v: OptionValue) => void;\n isOpen: boolean;\n setIsOpen: (v: boolean) => void;\n toggleListbox: () => void;\n getValue: (value: SelectValue) => OptionValue;\n activeIndex: number;\n setActiveIndex: (v: number) => void;\n listboxId: string;\n}\n\nconst SelectContext = createContext<SelectListboxContext>({} as SelectListboxContext);\n\ninterface Props {\n options: OptionValue[];\n defaultValue: SelectValue;\n}\n\nexport const SelectProvider = ({ options, defaultValue, children }: PropsWithChildren<Props>) => {\n const [value, setValue] = useState<OptionValue>({ value: '', label: '' });\n const [isOpen, setIsOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n const listboxId = useRef<string>(useId());\n\n const toggleListbox = () => {\n setIsOpen((status) => !status);\n };\n\n const getValue = (value: SelectValue) => {\n return (\n options.find((option) => option.value === value) || {\n value: -1,\n label: '',\n selectedLabel: '-',\n }\n );\n };\n\n const setSelectedValue = (value: OptionValue) => {\n const selectedIndex = options.findIndex((option) => option.value === value.value);\n setActiveIndex(selectedIndex);\n setValue(value);\n setIsOpen(false);\n };\n\n if (defaultValue !== -1 && !value.value) {\n setSelectedValue(getValue(defaultValue));\n }\n\n return (\n <SelectContext.Provider\n value={{\n options,\n selectedValue: value,\n setSelectedValue,\n isOpen,\n setIsOpen,\n toggleListbox,\n getValue,\n activeIndex,\n setActiveIndex,\n listboxId: listboxId.current,\n }}\n >\n {children}\n </SelectContext.Provider>\n );\n};\n\nexport const useSelect = () => {\n const context = useContext(SelectContext);\n\n if (context === undefined) throw new Error('useSelect can only be used in an SelectProvider');\n\n return context;\n};\n"],"names":["SelectContext","createContext","SelectProvider","options","defaultValue","children","value","setValue","useState","isOpen","setIsOpen","activeIndex","setActiveIndex","listboxId","useRef","useId","toggleListbox","status","getValue","option","setSelectedValue","selectedIndex","jsx","useSelect","context","useContext"],"mappings":";;AAyBA,MAAMA,IAAgBC,EAAoC,EAA0B,GAOvEC,IAAiB,CAAC,EAAE,SAAAC,GAAS,cAAAC,GAAc,UAAAC,QAAyC;AACzF,QAAA,CAACC,GAAOC,CAAQ,IAAIC,EAAsB,EAAE,OAAO,IAAI,OAAO,IAAI,GAClE,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK,GACpC,CAACG,GAAaC,CAAc,IAAIJ,EAAS,EAAE,GAC3CK,IAAYC,EAAeC,GAAO,GAElCC,IAAgB,MAAM;AAChB,IAAAN,EAAA,CAACO,MAAW,CAACA,CAAM;AAAA,EAC/B,GAEMC,IAAW,CAACZ,MAEdH,EAAQ,KAAK,CAACgB,MAAWA,EAAO,UAAUb,CAAK,KAAK;AAAA,IAClD,OAAO;AAAA,IACP,OAAO;AAAA,IACP,eAAe;AAAA,EACjB,GAIEc,IAAmB,CAACd,MAAuB;AACzC,UAAAe,IAAgBlB,EAAQ,UAAU,CAACgB,MAAWA,EAAO,UAAUb,EAAM,KAAK;AAChF,IAAAM,EAAeS,CAAa,GAC5Bd,EAASD,CAAK,GACdI,EAAU,EAAK;AAAA,EACjB;AAEA,SAAIN,MAAiB,MAAM,CAACE,EAAM,SACfc,EAAAF,EAASd,CAAY,CAAC,GAIvC,gBAAAkB;AAAA,IAACtB,EAAc;AAAA,IAAd;AAAA,MACC,OAAO;AAAA,QACL,SAAAG;AAAA,QACA,eAAeG;AAAA,QACf,kBAAAc;AAAA,QACA,QAAAX;AAAA,QACA,WAAAC;AAAA,QACA,eAAAM;AAAA,QACA,UAAAE;AAAA,QACA,aAAAP;AAAA,QACA,gBAAAC;AAAA,QACA,WAAWC,EAAU;AAAA,MACvB;AAAA,MAEC,UAAAR;AAAA,IAAA;AAAA,EACH;AAEJ,GAEakB,IAAY,MAAM;AACvB,QAAAC,IAAUC,EAAWzB,CAAa;AAExC,MAAIwB,MAAY,OAAiB,OAAA,IAAI,MAAM,iDAAiD;AAErF,SAAAA;AACT;"}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
import { jsxs as _, jsx as n } from "react/jsx-runtime";
|
|
2
|
-
import { useRef as x, useState as
|
|
3
|
-
import { c as
|
|
2
|
+
import { useRef as x, useState as p } from "react";
|
|
3
|
+
import { c as d } from "../../clsx-OuTLNxxd.js";
|
|
4
4
|
import '../../assets/TextArea.css';const r = {
|
|
5
|
-
"text-area__wrapper": "_text-
|
|
6
|
-
"text-area__header": "_text-
|
|
7
|
-
"text-area__label": "_text-
|
|
8
|
-
"text-area__word-count": "_text-area__word-
|
|
9
|
-
"text-area__word-count--alert": "_text-area__word-count--
|
|
10
|
-
"text-area": "_text-
|
|
5
|
+
"text-area__wrapper": "_text-area__wrapper_1pu93_1",
|
|
6
|
+
"text-area__header": "_text-area__header_1pu93_7",
|
|
7
|
+
"text-area__label": "_text-area__label_1pu93_13",
|
|
8
|
+
"text-area__word-count": "_text-area__word-count_1pu93_20",
|
|
9
|
+
"text-area__word-count--alert": "_text-area__word-count--alert_1pu93_25",
|
|
10
|
+
"text-area": "_text-area_1pu93_1"
|
|
11
11
|
};
|
|
12
|
-
function w({ onChange:
|
|
13
|
-
const e = x(null), [o,
|
|
14
|
-
e.current && (e.current.style.height = "auto", e.current.style.height = `${e.current.scrollHeight}px`,
|
|
12
|
+
function w({ onChange: u, label: a, maxCharacters: t = 0, defaultValue: c = "" }) {
|
|
13
|
+
const e = x(null), [o, l] = p(0), s = () => {
|
|
14
|
+
e.current && (e.current.style.height = "auto", e.current.style.height = `${e.current.scrollHeight}px`, l(e.current.value.length), u(e.current.value.trim()));
|
|
15
15
|
};
|
|
16
16
|
return /* @__PURE__ */ _("div", { className: r["text-area__wrapper"], children: [
|
|
17
17
|
(a || t > 0) && /* @__PURE__ */ _("div", { className: r["text-area__header"], children: [
|
|
18
18
|
a && /* @__PURE__ */ n("span", { className: r["text-area__label"], children: a }),
|
|
19
19
|
t > 0 && /* @__PURE__ */ _("div", { className: r["text-area__word-count"], children: [
|
|
20
|
-
/* @__PURE__ */ n("span", { className:
|
|
20
|
+
/* @__PURE__ */ n("span", { className: d({ [r["text-area__word-count--alert"]]: o === t }), children: o }),
|
|
21
21
|
" / ",
|
|
22
22
|
t
|
|
23
23
|
] })
|
|
@@ -28,8 +28,8 @@ function w({ onChange: c, label: a, maxCharacters: t = 0, defaultValue: l = "" }
|
|
|
28
28
|
ref: e,
|
|
29
29
|
className: r["text-area"],
|
|
30
30
|
maxLength: t > 0 ? t : void 0,
|
|
31
|
-
onInput:
|
|
32
|
-
defaultValue:
|
|
31
|
+
onInput: s,
|
|
32
|
+
defaultValue: c
|
|
33
33
|
}
|
|
34
34
|
)
|
|
35
35
|
] });
|
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.27.
|
|
5
|
+
"version": "3.27.3",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"types": "dist/index.d.ts",
|
|
@@ -45,10 +45,10 @@
|
|
|
45
45
|
"devDependencies": {
|
|
46
46
|
"@commitlint/cli": "^19.8.1",
|
|
47
47
|
"@commitlint/config-conventional": "^19.8.1",
|
|
48
|
-
"@react-aria/button": "^3.13.
|
|
49
|
-
"@react-aria/dialog": "^3.5.
|
|
50
|
-
"@react-aria/overlays": "^3.27.
|
|
51
|
-
"@react-types/dialog": "^3.5.
|
|
48
|
+
"@react-aria/button": "^3.13.2",
|
|
49
|
+
"@react-aria/dialog": "^3.5.26",
|
|
50
|
+
"@react-aria/overlays": "^3.27.2",
|
|
51
|
+
"@react-types/dialog": "^3.5.19",
|
|
52
52
|
"@semantic-release/git": "^10.0.1",
|
|
53
53
|
"@semantic-release/gitlab": "^13.2.5",
|
|
54
54
|
"@semantic-release/npm": "^12.0.1",
|
|
@@ -64,21 +64,21 @@
|
|
|
64
64
|
"@testing-library/jest-dom": "^6.6.3",
|
|
65
65
|
"@testing-library/react": "^16.3.0",
|
|
66
66
|
"@types/jest": "^29.5.14",
|
|
67
|
-
"@types/node": "^22.15.
|
|
67
|
+
"@types/node": "^22.15.31",
|
|
68
68
|
"@types/react-dom": "^19.1.6",
|
|
69
|
-
"@types/react": "^19.1.
|
|
69
|
+
"@types/react": "^19.1.7",
|
|
70
70
|
"@uva-glass/eslint-config": "^1.3.10",
|
|
71
71
|
"@uva-glass/stylelint-config": "^1.2.2",
|
|
72
|
-
"@vitejs/plugin-react": "^4.5.
|
|
73
|
-
"babel-jest": "^
|
|
72
|
+
"@vitejs/plugin-react": "^4.5.2",
|
|
73
|
+
"babel-jest": "^30.0.0",
|
|
74
74
|
"babel-plugin-transform-vite-meta-env": "^1.0.3",
|
|
75
75
|
"clsx": "^2.1.1",
|
|
76
76
|
"eslint-plugin-react-hooks": "^6.0.0",
|
|
77
77
|
"glob": "^11.0.2",
|
|
78
78
|
"husky": "^9.1.7",
|
|
79
79
|
"identity-obj-proxy": "^3.0.0",
|
|
80
|
-
"jest": "^
|
|
81
|
-
"jest-environment-jsdom": "^
|
|
80
|
+
"jest": "^30.0.0",
|
|
81
|
+
"jest-environment-jsdom": "^30.0.0",
|
|
82
82
|
"jest-junit": "^16.0.0",
|
|
83
83
|
"jsdom": "^26.1.0",
|
|
84
84
|
"npm-run-all2": "^8.0.4",
|
|
@@ -112,9 +112,9 @@
|
|
|
112
112
|
"lexical": "^0.32.1"
|
|
113
113
|
},
|
|
114
114
|
"optionalDependencies": {
|
|
115
|
-
"@rollup/rollup-linux-x64-gnu": "^4.
|
|
116
|
-
"@rspack/binding-darwin-arm64": "1.3.
|
|
117
|
-
"@rspack/binding-linux-x64-gnu": "1.3.
|
|
118
|
-
"@ast-grep/napi-linux-x64-gnu": "0.38.
|
|
115
|
+
"@rollup/rollup-linux-x64-gnu": "^4.42.0",
|
|
116
|
+
"@rspack/binding-darwin-arm64": "1.3.15",
|
|
117
|
+
"@rspack/binding-linux-x64-gnu": "1.3.15",
|
|
118
|
+
"@ast-grep/napi-linux-x64-gnu": "0.38.5"
|
|
119
119
|
}
|
|
120
120
|
}
|