@uva-glass/component-library 1.62.4 → 1.62.6
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/{ListPlugin-BaGD7Mnf.js → ListPlugin-B-2w9EIN.js} +2 -2
- package/dist/{ListPlugin-BaGD7Mnf.js.map → ListPlugin-B-2w9EIN.js.map} +1 -1
- package/dist/RteEditor.module-XCAFrP3U.js +28 -0
- package/dist/RteEditor.module-XCAFrP3U.js.map +1 -0
- package/dist/TablePlugin-C4BuRRYL.js +310 -0
- package/dist/TablePlugin-C4BuRRYL.js.map +1 -0
- package/dist/assets/EditorHeader.css +1 -1
- package/dist/assets/FormInput.css +1 -1
- package/dist/assets/PeriodSelector.css +1 -1
- package/dist/assets/RteEditor.css +1 -1
- package/dist/components/CheckboxTree/CheckboxTree.js +1 -1
- package/dist/components/FeedbackBox/FeedbackBox.js +2 -2
- package/dist/components/FeedbackBox/FeedbackBox.js.map +1 -1
- package/dist/components/FormInput/FormInput.js +23 -27
- package/dist/components/FormInput/FormInput.js.map +1 -1
- package/dist/components/InputField/InputField.stories.js +1 -1
- package/dist/components/MultiSelect/MultiSelect.js +1 -1
- package/dist/components/MultiSelect/MultiSelect.stories.js +1 -1
- package/dist/components/MultiSelect/components/MultiSelectHeader.js +1 -1
- package/dist/components/MultiSelect/index.js +1 -1
- package/dist/components/PeriodSelector/PeriodSelector.js +65 -50
- package/dist/components/PeriodSelector/PeriodSelector.js.map +1 -1
- package/dist/components/ProgrammeCard/ProgrammeCard.stories.js +1 -1
- package/dist/components/RteEditor/EditorHeader/EditorHeader.js +7 -7
- package/dist/components/RteEditor/Plugins/BlockFormatPlugin/BlockFormatPlugin.js +1 -1
- package/dist/components/RteEditor/Plugins/HistoryPlugin/HistoryPlugin.js +2 -2
- package/dist/components/RteEditor/Plugins/LinkPlugin/AddLinkFrom.js +1 -1
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js +75 -75
- package/dist/components/RteEditor/Plugins/LinkPlugin/LinkPlugin.js.map +1 -1
- package/dist/components/RteEditor/Plugins/ListPlugin/ListPlugin.js +2 -2
- package/dist/components/RteEditor/Plugins/ListPlugin/index.js +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/AddTableFrom.js +1 -1
- package/dist/components/RteEditor/Plugins/TablePlugin/TablePlugin.js +2 -2
- package/dist/components/RteEditor/Plugins/TablePlugin/index.js +1 -1
- package/dist/components/RteEditor/Plugins/ToolbarPlugin/ToolbarPlugin.js +3 -3
- package/dist/components/RteEditor/Plugins/index.js +2 -2
- package/dist/components/RteEditor/RteEditor.js +132 -135
- package/dist/components/RteEditor/RteEditor.js.map +1 -1
- package/dist/components/RteEditor/UvaTheme/UvaTheme.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/dist/RteEditor.module-D98nXtwi.js +0 -29
- package/dist/RteEditor.module-D98nXtwi.js.map +0 -1
- package/dist/TablePlugin-Dhg4yUqE.js +0 -308
- package/dist/TablePlugin-Dhg4yUqE.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
._form-
|
|
1
|
+
._form-field__container_130e1_1{align-items:center;display:flex;flex-wrap:wrap}._form-field__container--label-left_130e1_7{align-items:flex-start;flex-direction:row;gap:1rem;line-height:2.5rem}._form-field__container--label-left_130e1_7>label:after{line-height:3.6}._form-field__container--label-top_130e1_18{align-items:flex-start;flex-direction:column;gap:.5rem;line-height:normal}._form-field__input-container_130e1_25{display:flex;flex:1;flex-direction:column;line-height:1;position:relative;width:100%}._form-field__input_130e1_25{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid;border-radius:.5rem;color:var(--color-black);flex:1;font-family:inherit;font-size:inherit;height:2.75rem;margin:0 0 .5rem;min-height:2.5rem;padding:0 1rem;text-align:inherit}._form-field__input_130e1_25::-webkit-outer-spin-button,._form-field__input_130e1_25::-webkit-inner-spin-button{margin:0}._form-field__input--error_130e1_55{border-color:var(--color-red-500)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
._period-
|
|
1
|
+
._period-selector__container_1v02t_1{display:flex;flex-wrap:wrap}._period-selector__container--label-left_1v02t_6{flex-direction:row;gap:1rem;line-height:2.5rem}._period-selector__container--label-top_1v02t_12{align-items:flex-start;flex-direction:column;gap:.5rem;line-height:normal}._period-selector__selector-container_1v02t_19{display:flex;flex-direction:column}._period-selector__selector-row_1v02t_24{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._editor__container_1appy_1{background-color:var(--color-white);display:flex;flex-direction:column}._editor__header_1appy_7{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem;min-height:1.5rem}._editor__header-word-count_1appy_15{align-self:flex-end;font-size:.875rem;margin-left:.5rem;text-align:right;white-space:nowrap;width:4.5rem}._editor__header-word-count--alert_1appy_24{color:var(--color-red-500);font-weight:700}._editor_1appy_1{border:1px solid var(--color-grey-400);border-radius:4px;margin-bottom:.5rem;padding:.25rem}._editor_1appy_1:has(._editor__field_1appy_36:focus-visible){outline:1px solid var(--color-blue-500)}._editor__toolbar_1appy_40{align-items:center;display:flex;gap:.25rem;justify-content:flex-start;margin-bottom:.25rem;padding:.25rem}._editor__toolbar-button-group_1appy_49{align-items:center;display:flex;gap:.125rem;justify-content:center}._editor__toolbar-button_1appy_49{align-items:center;background-color:var(--color-white);border:none;border-radius:.25rem;cursor:pointer;display:flex;font-size:1.1rem;height:2rem;justify-content:center;width:2rem}._editor__toolbar-button_1appy_49:hover{background-color:var(--color-grey-200);border:1px solid var(--color-grey-500)}._editor__toolbar-button_1appy_49:focus-visible{outline:.125rem dotted var(--color-cobalt);outline-offset:.125rem;z-index:1}._editor__toolbar-button_1appy_49:disabled{border-color:var(--color-grey-100);color:var(--color-grey-200);cursor:not-allowed}._editor__toolbar-button_1appy_49:hover:disabled{background-color:var(--color-grey-100);border-color:var(--color-grey-100);color:var(--color-grey-300);cursor:not-allowed}._editor__toolbar-button--bold_1appy_93{font-weight:700}._editor__toolbar-button--italic_1appy_97{font-style:italic}._editor__toolbar-button--active_1appy_101,._editor__toolbar-button_1appy_49:active{background-color:var(--color-black);border-color:var(--color-black);color:var(--color-white)}._editor__toolbar-button_1appy_49:active:hover{color:var(--color-white)}._editor__toolbar-button--active_1appy_101:hover{color:var(--color-black)}._editor__toolbar-button--active_1appy_101:disabled{background-color:var(--color-grey-100);border-color:var(--color-grey-100);color:var(--color-grey-300);cursor:not-allowed}._editor__toolbar-button-flyoutwrapper_1appy_123,._editor__field-wrapper_1appy_127{position:relative}._editor__field-wrapper_1appy_127:before{border-top:1px solid var(--color-grey-400);content:"";display:block;height:0;left:-.25rem;position:absolute;top:-.3rem;width:calc(100% + .5rem);z-index:1}._editor__field_1appy_36{background-color:var(--color-white);margin-top:.5rem;min-height:8rem;overflow-x:hidden;padding:0 .5rem .5rem;position:relative}._editor__field_1appy_36::-webkit-scrollbar{cursor:default;width:12px}._editor__field_1appy_36::-webkit-scrollbar-track{background:var(--color-white)}._editor__field_1appy_36::-webkit-scrollbar-thumb{background-color:var(--color-grey-300);border:3px solid var(--color-white);border-radius:20px;cursor:default}._editor__field_1appy_36:focus-visible{outline:none}._editor__placeholder_1appy_172{color:var(--color-grey-300);left:.5rem;pointer-events:none;position:absolute;top:0}._editor__field_1appy_36 p{margin:0}._editor__text--bold_1appy_185{font-weight:700}._editor__text--italic_1appy_189{font-style:italic}._editor__list--ul_1appy_193,._editor__list--ol_1appy_194{margin:0;padding:0}._editor__list--ul_1appy_193>._editor__listitem_1appy_199{list-style-type:disc;margin-left:1rem}._editor__list--ol_1appy_194>._editor__listitem_1appy_199{list-style-type:decimal;margin-left:1rem}._editor__link_1appy_209{color:var(--color-blue-500);cursor:pointer;text-decoration:underline}._editor__table_1appy_215{border:1px solid var(--color-grey-300);border-collapse:collapse;margin:.5rem 0;width:100%}._editor__table_1appy_215 tr{width:100%}._editor__table_1appy_215 td{border:1px solid var(--color-grey-300);padding:.125rem .25rem;vertical-align:top;width:auto}
|
|
@@ -17,7 +17,7 @@ import "../IconButton/IconButton.js";
|
|
|
17
17
|
import "../Input/Input.js";
|
|
18
18
|
import "../InputField/InputField.js";
|
|
19
19
|
import "react-router-dom";
|
|
20
|
-
import "../../TablePlugin-
|
|
20
|
+
import "../../TablePlugin-C4BuRRYL.js";
|
|
21
21
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
22
22
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
23
23
|
import "../SelectListbox/SelectListbox.js";
|
|
@@ -8,8 +8,8 @@ import '../../assets/FeedbackBox.css';const c = {
|
|
|
8
8
|
"feedback-box__error": "_feedback-box__error_1th4y_23"
|
|
9
9
|
}, n = {
|
|
10
10
|
success: "CheckCircle",
|
|
11
|
-
warning: "
|
|
12
|
-
error: "
|
|
11
|
+
warning: "ExclamationCircle",
|
|
12
|
+
error: "ExclamationTriangleMini"
|
|
13
13
|
}, f = ({ id: _, level: e, feedback: o }) => /* @__PURE__ */ r(
|
|
14
14
|
"div",
|
|
15
15
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedbackBox.js","sources":["../../../src/components/FeedbackBox/FeedbackBox.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport type { IconProps } from 'components/Icon';\n\nimport styles from './FeedbackBox.module.css';\n\nimport { Icon } from 'components/Icon';\n\ntype FeedbackLevel = 'success' | 'warning' | 'error';\n\nconst LEVEL_ICON_MAP: Record<FeedbackLevel, IconProps['name']> = {\n success: 'CheckCircle',\n warning: '
|
|
1
|
+
{"version":3,"file":"FeedbackBox.js","sources":["../../../src/components/FeedbackBox/FeedbackBox.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport type { IconProps } from 'components/Icon';\n\nimport styles from './FeedbackBox.module.css';\n\nimport { Icon } from 'components/Icon';\n\ntype FeedbackLevel = 'success' | 'warning' | 'error';\n\nconst LEVEL_ICON_MAP: Record<FeedbackLevel, IconProps['name']> = {\n success: 'CheckCircle',\n warning: 'ExclamationCircle',\n error: 'ExclamationTriangleMini',\n};\n\nexport interface FeedbackBoxProps {\n /** The id of the element. */\n id?: string;\n /** The feedback level, indicates what icon is used. */\n level: FeedbackLevel;\n /** The feedback value. */\n feedback: string;\n}\n\n/** Represents a component to show feedback. */\nexport const FeedbackBox = ({ id, level, feedback }: FeedbackBoxProps) => (\n <div\n className={clsx(styles['feedback-box'], {\n [styles['feedback-box__success']]: level === 'success',\n [styles['feedback-box__warning']]: level === 'warning',\n [styles['feedback-box__error']]: level === 'error',\n })}\n id={id}\n >\n <Icon name={LEVEL_ICON_MAP[level]} size={16} />\n {feedback}\n </div>\n);\n"],"names":["LEVEL_ICON_MAP","FeedbackBox","id","level","feedback","jsxs","clsx","styles","jsx","Icon"],"mappings":";;;;;;;;GAUMA,IAA2D;AAAA,EAC/D,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT,GAYaC,IAAc,CAAC,EAAE,IAAAC,GAAI,OAAAC,GAAO,UAAAC,EACvC,MAAA,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAKC,EAAO,cAAc,GAAG;AAAA,MACtC,CAACA,EAAO,uBAAuB,CAAC,GAAGJ,MAAU;AAAA,MAC7C,CAACI,EAAO,uBAAuB,CAAC,GAAGJ,MAAU;AAAA,MAC7C,CAACI,EAAO,qBAAqB,CAAC,GAAGJ,MAAU;AAAA,IAAA,CAC5C;AAAA,IACD,IAAAD;AAAA,IAEA,UAAA;AAAA,MAAA,gBAAAM,EAACC,KAAK,MAAMT,EAAeG,CAAK,GAAG,MAAM,IAAI;AAAA,MAC5CC;AAAA,IAAA;AAAA,EAAA;AACH;"}
|
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as f, jsx as i } from "react/jsx-runtime";
|
|
2
2
|
import { c as l } from "../../clsx-OuTLNxxd.js";
|
|
3
3
|
import "react";
|
|
4
|
-
import { Icon as s } from "../Icon/Icon.js";
|
|
5
4
|
import "../Buttons/Button.js";
|
|
6
5
|
import "../Buttons/LinkButton.js";
|
|
7
6
|
import "@react-aria/button";
|
|
8
|
-
import { Label as
|
|
7
|
+
import { Label as s } from "../Label/Label.js";
|
|
9
8
|
import "@react-aria/dialog";
|
|
10
9
|
import "@react-aria/focus";
|
|
11
10
|
import "@react-aria/overlays";
|
|
12
11
|
import "../OverlayCloseButton/OverlayCloseButton.js";
|
|
12
|
+
import { FeedbackBox as u } from "../FeedbackBox/FeedbackBox.js";
|
|
13
13
|
import "../GridRow/GridRow.js";
|
|
14
14
|
import "../IconButton/IconButton.js";
|
|
15
15
|
import "../Input/Input.js";
|
|
16
16
|
import "../InputField/InputField.js";
|
|
17
17
|
import "react-router-dom";
|
|
18
|
-
import "../../TablePlugin-
|
|
18
|
+
import "../../TablePlugin-C4BuRRYL.js";
|
|
19
19
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
20
20
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
21
21
|
import "../SelectListbox/SelectListbox.js";
|
|
@@ -23,42 +23,38 @@ import "../SelectListbox/SelectProvider.js";
|
|
|
23
23
|
import "../Sortable/components/SortableItem.js";
|
|
24
24
|
import "../../SortableProvider-BUsvniX7.js";
|
|
25
25
|
import '../../assets/FormInput.css';const r = {
|
|
26
|
-
"form-field__container": "_form-
|
|
27
|
-
"form-field__container--label-left": "_form-field__container--label-
|
|
28
|
-
"form-field__container--label-top": "_form-field__container--label-
|
|
29
|
-
"form-field__input-container": "_form-field__input-
|
|
30
|
-
"form-field__input": "_form-
|
|
31
|
-
"form-field__input--error": "_form-field__input--
|
|
32
|
-
"form-field__error": "_form-field__error_4b905_58"
|
|
26
|
+
"form-field__container": "_form-field__container_130e1_1",
|
|
27
|
+
"form-field__container--label-left": "_form-field__container--label-left_130e1_7",
|
|
28
|
+
"form-field__container--label-top": "_form-field__container--label-top_130e1_18",
|
|
29
|
+
"form-field__input-container": "_form-field__input-container_130e1_25",
|
|
30
|
+
"form-field__input": "_form-field__input_130e1_25",
|
|
31
|
+
"form-field__input--error": "_form-field__input--error_130e1_55"
|
|
33
32
|
}, J = ({
|
|
34
33
|
id: t,
|
|
35
|
-
label:
|
|
34
|
+
label: _,
|
|
36
35
|
labelPosition: p = "top",
|
|
37
|
-
type:
|
|
36
|
+
type: m = "text",
|
|
38
37
|
required: a = !1,
|
|
39
|
-
notValidatedText:
|
|
40
|
-
onChange:
|
|
38
|
+
notValidatedText: e = "",
|
|
39
|
+
onChange: n
|
|
41
40
|
}) => {
|
|
42
41
|
const c = (o) => ["e", "E", "+", "-"].includes(o.key) && o.preventDefault(), d = (o) => {
|
|
43
|
-
typeof
|
|
42
|
+
typeof n == "function" && n(o.target.value);
|
|
44
43
|
};
|
|
45
|
-
return /* @__PURE__ */
|
|
46
|
-
|
|
47
|
-
/* @__PURE__ */
|
|
48
|
-
/* @__PURE__ */
|
|
44
|
+
return /* @__PURE__ */ f("div", { className: l(r["form-field__container"], r[`form-field__container--label-${p}`]), children: [
|
|
45
|
+
_ && /* @__PURE__ */ i(s, { htmlFor: t, required: a, children: _ }),
|
|
46
|
+
/* @__PURE__ */ f("div", { className: r["form-field__input-container"], children: [
|
|
47
|
+
/* @__PURE__ */ i(
|
|
49
48
|
"input",
|
|
50
49
|
{
|
|
51
50
|
id: t,
|
|
52
|
-
type:
|
|
53
|
-
...
|
|
51
|
+
type: m,
|
|
52
|
+
...m === "number" && { onKeyDown: c },
|
|
54
53
|
onChange: d,
|
|
55
|
-
className: l(r["form-field__input"], [
|
|
54
|
+
className: l(r["form-field__input"], [e !== "" && r["form-field__input--error"]])
|
|
56
55
|
}
|
|
57
56
|
),
|
|
58
|
-
|
|
59
|
-
/* @__PURE__ */ _(s, { name: "ExclamationTriangleFill", size: 24 }),
|
|
60
|
-
i
|
|
61
|
-
] })
|
|
57
|
+
e !== "" && /* @__PURE__ */ i(u, { level: "error", feedback: e })
|
|
62
58
|
] })
|
|
63
59
|
] });
|
|
64
60
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormInput.js","sources":["../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport styles from './FormInput.module.css';\n\nimport {
|
|
1
|
+
{"version":3,"file":"FormInput.js","sources":["../../../src/components/FormInput/FormInput.tsx"],"sourcesContent":["import clsx from 'clsx';\n\nimport styles from './FormInput.module.css';\n\nimport { FeedbackBox, Label } from 'components';\n\nexport interface FormInputProps {\n /** The id of the input element. */\n id: string;\n /** label text if empthy the label is not renderd */\n label: string;\n /** label position `top` or `left`. The default is `top`. */\n labelPosition?: 'top' | 'left';\n /** The type of the input element. */\n type?: 'text' | 'password' | 'email' | 'number';\n /** Shows red * */\n required?: boolean;\n /** error text to display if set */\n notValidatedText?: string;\n /** Returns array of selected values as number */\n onChange: (value: string) => void;\n}\n\nexport const FormInput = ({\n id,\n label,\n labelPosition = 'top',\n type = 'text',\n required = false,\n notValidatedText = '',\n onChange,\n}: FormInputProps) => {\n const blockInvalidChar = (event: React.KeyboardEvent<HTMLInputElement>) =>\n ['e', 'E', '+', '-'].includes(event.key) && event.preventDefault();\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (typeof onChange === 'function') {\n onChange(event.target.value);\n }\n };\n\n return (\n <div className={clsx(styles['form-field__container'], styles[`form-field__container--label-${labelPosition}`])}>\n {label && (\n <Label htmlFor={id} required={required}>\n {label}\n </Label>\n )}\n\n <div className={styles['form-field__input-container']}>\n <input\n id={id}\n type={type}\n {...(type === 'number' && { onKeyDown: blockInvalidChar })}\n onChange={handleChange}\n className={clsx(styles['form-field__input'], [notValidatedText !== '' && styles['form-field__input--error']])}\n />\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n </div>\n );\n};\n"],"names":["FormInput","id","label","labelPosition","type","required","notValidatedText","onChange","blockInvalidChar","event","handleChange","jsxs","clsx","styles","jsx","Label","FeedbackBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuBaA,IAAY,CAAC;AAAA,EACxB,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,kBAAAC,IAAmB;AAAA,EACnB,UAAAC;AACF,MAAsB;AACpB,QAAMC,IAAmB,CAACC,MACxB,CAAC,KAAK,KAAK,KAAK,GAAG,EAAE,SAASA,EAAM,GAAG,KAAKA,EAAM,eAAe,GAE7DC,IAAe,CAACD,MAA+C;AAC/D,IAAA,OAAOF,KAAa,cACbA,EAAAE,EAAM,OAAO,KAAK;AAAA,EAC7B;AAGF,SACG,gBAAAE,EAAA,OAAA,EAAI,WAAWC,EAAKC,EAAO,uBAAuB,GAAGA,EAAO,gCAAgCV,CAAa,EAAE,CAAC,GAC1G,UAAA;AAAA,IAAAD,KACE,gBAAAY,EAAAC,GAAA,EAAM,SAASd,GAAI,UAAAI,GACjB,UACHH,GAAA;AAAA,IAGD,gBAAAS,EAAA,OAAA,EAAI,WAAWE,EAAO,6BAA6B,GAClD,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAAb;AAAA,UACA,MAAAG;AAAA,UACC,GAAIA,MAAS,YAAY,EAAE,WAAWI,EAAiB;AAAA,UACxD,UAAUE;AAAA,UACV,WAAWE,EAAKC,EAAO,mBAAmB,GAAG,CAACP,MAAqB,MAAMO,EAAO,0BAA0B,CAAC,CAAC;AAAA,QAAA;AAAA,MAC9G;AAAA,MACCP,MAAqB,MAAM,gBAAAQ,EAACE,KAAY,OAAM,SAAQ,UAAUV,GAAkB;AAAA,IAAA,GACrF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
|
|
@@ -15,7 +15,7 @@ import "../GridRow/GridRow.js";
|
|
|
15
15
|
import "../IconButton/IconButton.js";
|
|
16
16
|
import "../Input/Input.js";
|
|
17
17
|
import "react-router-dom";
|
|
18
|
-
import "../../TablePlugin-
|
|
18
|
+
import "../../TablePlugin-C4BuRRYL.js";
|
|
19
19
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
20
20
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
21
21
|
import "../SelectListbox/SelectListbox.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsxs as S, jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { fn as d } from "../../index-C9QoqAAt.js";
|
|
3
3
|
import { useState as p } from "react";
|
|
4
|
-
import { M as e } from "../../TablePlugin-
|
|
4
|
+
import { M as e } from "../../TablePlugin-C4BuRRYL.js";
|
|
5
5
|
import { Container as M } from "../../storyComponents/Container/Container.js";
|
|
6
6
|
const C = `
|
|
7
7
|
// MultiSelectHeader can be added optionally
|
|
@@ -14,7 +14,7 @@ import "../../IconButton/IconButton.js";
|
|
|
14
14
|
import "../../Input/Input.js";
|
|
15
15
|
import "../../InputField/InputField.js";
|
|
16
16
|
import "react-router-dom";
|
|
17
|
-
import { a as q } from "../../../TablePlugin-
|
|
17
|
+
import { a as q } from "../../../TablePlugin-C4BuRRYL.js";
|
|
18
18
|
import "../../RteEditor/Providers/LanguageProvider.js";
|
|
19
19
|
import "../../RteEditor/hooks/components/Flyout.js";
|
|
20
20
|
import "../../SelectListbox/SelectListbox.js";
|
|
@@ -1,74 +1,89 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { c as
|
|
3
|
-
import { useRef as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
1
|
+
import { jsxs as h, jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { c as k } from "../../clsx-OuTLNxxd.js";
|
|
3
|
+
import { useRef as M, useState as N, useEffect as $ } from "react";
|
|
4
|
+
import "../Buttons/Button.js";
|
|
5
|
+
import "../Buttons/LinkButton.js";
|
|
6
|
+
import "@react-aria/button";
|
|
7
|
+
import { CheckboxButtonBar as w } from "../CheckboxButtonBar/CheckboxButtonBar.js";
|
|
8
|
+
import "@react-aria/dialog";
|
|
9
|
+
import "@react-aria/focus";
|
|
10
|
+
import "@react-aria/overlays";
|
|
11
|
+
import "../OverlayCloseButton/OverlayCloseButton.js";
|
|
12
|
+
import { FeedbackBox as B } from "../FeedbackBox/FeedbackBox.js";
|
|
13
|
+
import "../GridRow/GridRow.js";
|
|
14
|
+
import "../IconButton/IconButton.js";
|
|
15
|
+
import "../Input/Input.js";
|
|
16
|
+
import "../InputField/InputField.js";
|
|
17
|
+
import { Label as D } from "../Label/Label.js";
|
|
18
|
+
import "react-router-dom";
|
|
19
|
+
import "../../TablePlugin-C4BuRRYL.js";
|
|
20
|
+
import "../RteEditor/Providers/LanguageProvider.js";
|
|
21
|
+
import "../RteEditor/hooks/components/Flyout.js";
|
|
22
|
+
import "../SelectListbox/SelectListbox.js";
|
|
23
|
+
import "../SelectListbox/SelectProvider.js";
|
|
24
|
+
import "../Sortable/components/SortableItem.js";
|
|
25
|
+
import "../../SortableProvider-BUsvniX7.js";
|
|
26
|
+
import '../../assets/PeriodSelector.css';const s = {
|
|
27
|
+
"period-selector__container": "_period-selector__container_1v02t_1",
|
|
28
|
+
"period-selector__container--label-left": "_period-selector__container--label-left_1v02t_6",
|
|
29
|
+
"period-selector__container--label-top": "_period-selector__container--label-top_1v02t_12",
|
|
30
|
+
"period-selector__selector-container": "_period-selector__selector-container_1v02t_19",
|
|
31
|
+
"period-selector__selector-row": "_period-selector__selector-row_1v02t_24"
|
|
32
|
+
}, S = 0, f = 1, E = 2, _ = 3, I = 7, T = (l) => {
|
|
33
|
+
const c = [];
|
|
34
|
+
for (let t = 0; t < l.length; t += _)
|
|
35
|
+
c.push(l.slice(t, t + _));
|
|
36
|
+
return c;
|
|
37
|
+
}, nr = ({
|
|
38
|
+
maxPeriods: l = I,
|
|
39
|
+
defaultValues: c,
|
|
22
40
|
label: t,
|
|
23
41
|
labelPosition: b = "top",
|
|
24
42
|
required: p = !1,
|
|
25
|
-
notValidatedText:
|
|
26
|
-
onChange:
|
|
43
|
+
notValidatedText: m = "",
|
|
44
|
+
onChange: v
|
|
27
45
|
}) => {
|
|
28
|
-
const
|
|
29
|
-
label: `${
|
|
46
|
+
const g = Array.from({ length: l }, (r, e) => e + 1), a = T(g), R = a.map((r, e) => r.map((o) => ({
|
|
47
|
+
label: `${e + 1}${r.length === 1 ? "" : `.${(o - 1) % _ + 1}`}`,
|
|
30
48
|
value: o.toString()
|
|
31
|
-
}))),
|
|
32
|
-
|
|
33
|
-
(
|
|
49
|
+
}))), n = M(
|
|
50
|
+
a.map(
|
|
51
|
+
(r) => r.reduce((e, o) => (c != null && c.includes(o) && e.push(o), e), [])
|
|
34
52
|
)
|
|
35
|
-
), [
|
|
36
|
-
|
|
53
|
+
), [x, d] = N([]), u = (r) => r[S].length !== 0 || r[f].length !== 0 ? [E] : r[E].length !== 0 ? [S, f] : [], P = (r, e) => {
|
|
54
|
+
n.current[e] = r.map((o) => Number(o)), d(u(n.current)), v([...n.current.flat()].sort());
|
|
37
55
|
};
|
|
38
56
|
return $(() => {
|
|
39
|
-
u(
|
|
40
|
-
}, []), /* @__PURE__ */
|
|
57
|
+
d(u(n.current));
|
|
58
|
+
}, []), /* @__PURE__ */ h(
|
|
41
59
|
"div",
|
|
42
60
|
{
|
|
43
|
-
className:
|
|
44
|
-
|
|
45
|
-
|
|
61
|
+
className: k(
|
|
62
|
+
s["period-selector__container"],
|
|
63
|
+
s[`period-selector__container--label-${b}`]
|
|
46
64
|
),
|
|
47
65
|
children: [
|
|
48
|
-
t && /* @__PURE__ */
|
|
49
|
-
/* @__PURE__ */
|
|
50
|
-
/* @__PURE__ */
|
|
51
|
-
|
|
66
|
+
t && /* @__PURE__ */ i(D, { htmlFor: "", required: p, children: t }),
|
|
67
|
+
/* @__PURE__ */ h("div", { className: s["period-selector__selector-container"], children: [
|
|
68
|
+
/* @__PURE__ */ i("div", { className: s["period-selector__selector-row"], children: R.map((r, e) => /* @__PURE__ */ i(
|
|
69
|
+
w,
|
|
52
70
|
{
|
|
53
|
-
checkboxes:
|
|
54
|
-
defaultValues:
|
|
55
|
-
disableGroup:
|
|
71
|
+
checkboxes: r,
|
|
72
|
+
defaultValues: n.current[e].map((o) => o.toString()),
|
|
73
|
+
disableGroup: x.includes(e),
|
|
56
74
|
required: p,
|
|
57
|
-
onSetValues: (o) => P(o,
|
|
75
|
+
onSetValues: (o) => P(o, e)
|
|
58
76
|
},
|
|
59
|
-
`group_${
|
|
77
|
+
`group_${e}`
|
|
60
78
|
)) }),
|
|
61
|
-
/* @__PURE__ */
|
|
62
|
-
|
|
63
|
-
/* @__PURE__ */ l(T, { name: "ExclamationTriangleFill", size: 24 }),
|
|
64
|
-
d
|
|
65
|
-
] })
|
|
79
|
+
/* @__PURE__ */ i("div", { className: s["period-selector__error"] }),
|
|
80
|
+
m !== "" && /* @__PURE__ */ i(B, { level: "error", feedback: m })
|
|
66
81
|
] })
|
|
67
82
|
]
|
|
68
83
|
}
|
|
69
84
|
);
|
|
70
85
|
};
|
|
71
86
|
export {
|
|
72
|
-
|
|
87
|
+
nr as PeriodSelector
|
|
73
88
|
};
|
|
74
89
|
//# sourceMappingURL=PeriodSelector.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PeriodSelector.js","sources":["../../../src/components/PeriodSelector/PeriodSelector.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport styles from './PeriodSelector.module.css';\n\nimport { Label
|
|
1
|
+
{"version":3,"file":"PeriodSelector.js","sources":["../../../src/components/PeriodSelector/PeriodSelector.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport styles from './PeriodSelector.module.css';\n\nimport { Label, CheckboxButtonBar, FeedbackBox } from 'components';\n\nexport interface PeriodSelectorProps {\n /** Indicates how many periods are shown. */\n // eslint-disable-next-line @typescript-eslint/no-magic-numbers\n maxPeriods: 6 | 7;\n /** array of period values [3, 5 ...] */\n defaultValues?: number[];\n label: string;\n labelPosition?: 'top' | 'left';\n /** Shows red * */\n required?: boolean;\n /** error text to display if set */\n notValidatedText?: string;\n /** Returns array of selected values as number */\n onChange: (values: number[]) => void;\n}\n\nconst SEMESTER_1 = 0;\nconst SEMESTER_2 = 1;\nconst SEMESTER_3 = 2;\n\nconst PERIODS_PER_SEMESTER = 3;\nconst MAX_PERIODS = 7;\n\nconst chunkPeriods = (array: number[]): number[][] => {\n const result: number[][] = [];\n for (let count = 0; count < array.length; count += PERIODS_PER_SEMESTER) {\n result.push(array.slice(count, count + PERIODS_PER_SEMESTER));\n }\n return result;\n};\n\n/** Checkbox group for selecting periods */\nexport const PeriodSelector = ({\n maxPeriods = MAX_PERIODS,\n defaultValues,\n label,\n labelPosition = 'top',\n required = false,\n notValidatedText = '',\n onChange,\n}: PeriodSelectorProps) => {\n const maxPeriodsList = Array.from({ length: maxPeriods }, (_, index) => index + 1);\n const chunkedPeriods = chunkPeriods(maxPeriodsList);\n\n const checkboxItems = chunkedPeriods.map((periods, semester) => {\n return periods.map((period) => ({\n label: `${semester + 1}${periods.length === 1 ? '' : `.${((period - 1) % PERIODS_PER_SEMESTER) + 1}`}`,\n value: period.toString(),\n }));\n });\n\n const returnValues = useRef<number[][]>(\n chunkedPeriods.map((semester) =>\n semester.reduce((periods, period) => {\n if (defaultValues?.includes(period)) periods.push(period);\n return periods;\n }, [] as number[])\n )\n );\n const [disableSemesters, setDisableSemesters] = useState<number[]>([]);\n\n const disableGroups = (selects: number[][]) => {\n if (selects[SEMESTER_1].length !== 0 || selects[SEMESTER_2].length !== 0) return [SEMESTER_3];\n if (selects[SEMESTER_3].length !== 0) return [SEMESTER_1, SEMESTER_2];\n return [];\n };\n\n const handleChange = (values: string[], index: number) => {\n returnValues.current[index] = values.map((num) => Number(num));\n setDisableSemesters(disableGroups(returnValues.current));\n onChange([...returnValues.current.flat()].sort());\n };\n\n useEffect(() => {\n setDisableSemesters(disableGroups(returnValues.current));\n }, []);\n\n return (\n <div\n className={clsx(\n styles['period-selector__container'],\n styles[`period-selector__container--label-${labelPosition}`]\n )}\n >\n {label && (\n <Label htmlFor=\"\" required={required}>\n {label}\n </Label>\n )}\n <div className={styles['period-selector__selector-container']}>\n <div className={styles['period-selector__selector-row']}>\n {checkboxItems.map((checkboxes, semester) => (\n <CheckboxButtonBar\n key={`group_${semester}`}\n checkboxes={checkboxes}\n defaultValues={returnValues.current[semester].map((num) => num.toString())}\n disableGroup={disableSemesters.includes(semester)}\n required={required}\n onSetValues={(event) => handleChange(event, semester)}\n />\n ))}\n </div>\n <div className={styles['period-selector__error']}></div>\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n </div>\n );\n};\n"],"names":["SEMESTER_1","SEMESTER_2","SEMESTER_3","PERIODS_PER_SEMESTER","MAX_PERIODS","chunkPeriods","array","result","count","PeriodSelector","maxPeriods","defaultValues","label","labelPosition","required","notValidatedText","onChange","maxPeriodsList","_","index","chunkedPeriods","checkboxItems","periods","semester","period","returnValues","useRef","disableSemesters","setDisableSemesters","useState","disableGroups","selects","handleChange","values","num","useEffect","jsxs","clsx","styles","jsx","Label","checkboxes","CheckboxButtonBar","event","FeedbackBox"],"mappings":"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"}
|
|
@@ -16,7 +16,7 @@ import "../IconButton/IconButton.js";
|
|
|
16
16
|
import "../Input/Input.js";
|
|
17
17
|
import "../InputField/InputField.js";
|
|
18
18
|
import "react-router-dom";
|
|
19
|
-
import "../../TablePlugin-
|
|
19
|
+
import "../../TablePlugin-C4BuRRYL.js";
|
|
20
20
|
import { Repeater as i } from "../Repeater/Repeater.js";
|
|
21
21
|
import "../RteEditor/Providers/LanguageProvider.js";
|
|
22
22
|
import "../RteEditor/hooks/components/Flyout.js";
|
|
@@ -3,7 +3,7 @@ import { useId as p } from "react";
|
|
|
3
3
|
import "../../Buttons/Button.js";
|
|
4
4
|
import "../../Buttons/LinkButton.js";
|
|
5
5
|
import "@react-aria/button";
|
|
6
|
-
import { Label as
|
|
6
|
+
import { Label as n } from "../../Label/Label.js";
|
|
7
7
|
import "@react-aria/dialog";
|
|
8
8
|
import "@react-aria/focus";
|
|
9
9
|
import "@react-aria/overlays";
|
|
@@ -13,7 +13,7 @@ import "../../IconButton/IconButton.js";
|
|
|
13
13
|
import "../../Input/Input.js";
|
|
14
14
|
import "../../InputField/InputField.js";
|
|
15
15
|
import "react-router-dom";
|
|
16
|
-
import "../../../TablePlugin-
|
|
16
|
+
import "../../../TablePlugin-C4BuRRYL.js";
|
|
17
17
|
import "../Providers/LanguageProvider.js";
|
|
18
18
|
import "../hooks/components/Flyout.js";
|
|
19
19
|
import "../../SelectListbox/SelectListbox.js";
|
|
@@ -21,13 +21,13 @@ import "../../SelectListbox/SelectProvider.js";
|
|
|
21
21
|
import "../../Sortable/components/SortableItem.js";
|
|
22
22
|
import "../../../SortableProvider-BUsvniX7.js";
|
|
23
23
|
import '../../../assets/EditorHeader.css';const t = {
|
|
24
|
-
"editor-header__container": "_editor-
|
|
25
|
-
"editor-header__info": "_editor-
|
|
26
|
-
}, q = ({ label:
|
|
24
|
+
"editor-header__container": "_editor-header__container_nsi6h_1",
|
|
25
|
+
"editor-header__info": "_editor-header__info_nsi6h_10"
|
|
26
|
+
}, q = ({ label: i, info: o = "", required: e = !1 }) => {
|
|
27
27
|
const m = `info_${p()}`;
|
|
28
28
|
return /* @__PURE__ */ d("div", { className: t["editor-header__container"], children: [
|
|
29
|
-
|
|
30
|
-
|
|
29
|
+
i !== "" && /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(n, { htmlFor: m, required: e, children: i }) }),
|
|
30
|
+
o !== "" && /* @__PURE__ */ r("div", { className: t["editor-header__info"], children: o })
|
|
31
31
|
] });
|
|
32
32
|
};
|
|
33
33
|
export {
|
|
@@ -4,7 +4,7 @@ import { c as f } from "../../../../clsx-OuTLNxxd.js";
|
|
|
4
4
|
import { A as _, x as p, d as h } from "../../../../Lexical.prod-eo-UKDld.js";
|
|
5
5
|
import { useState as l, useEffect as k } from "react";
|
|
6
6
|
import { Icon as I } from "../../../Icon/Icon.js";
|
|
7
|
-
import { s as a } from "../../../../RteEditor.module-
|
|
7
|
+
import { s as a } from "../../../../RteEditor.module-XCAFrP3U.js";
|
|
8
8
|
import { useTranslation as B } from "../../hooks/useTranslation.js";
|
|
9
9
|
const x = {
|
|
10
10
|
bold: "Bold",
|
|
@@ -16,8 +16,8 @@ import "../../../IconButton/IconButton.js";
|
|
|
16
16
|
import "../../../Input/Input.js";
|
|
17
17
|
import "../../../InputField/InputField.js";
|
|
18
18
|
import "react-router-dom";
|
|
19
|
-
import "../../../../TablePlugin-
|
|
20
|
-
import { s as r } from "../../../../RteEditor.module-
|
|
19
|
+
import "../../../../TablePlugin-C4BuRRYL.js";
|
|
20
|
+
import { s as r } from "../../../../RteEditor.module-XCAFrP3U.js";
|
|
21
21
|
import { useTranslation as g } from "../../hooks/useTranslation.js";
|
|
22
22
|
import "../../hooks/components/Flyout.js";
|
|
23
23
|
import "../../Providers/LanguageProvider.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import "react/jsx-runtime";
|
|
2
2
|
import "react";
|
|
3
3
|
import "../../../../helpers-BD3Y_bqE.js";
|
|
4
|
-
import { A as z } from "../../../../TablePlugin-
|
|
4
|
+
import { A as z } from "../../../../TablePlugin-C4BuRRYL.js";
|
|
5
5
|
import "../../../Icon/Icon.js";
|
|
6
6
|
import "../../../Buttons/Button.js";
|
|
7
7
|
import "../../../Buttons/LinkButton.js";
|