npm - @uva-glass/component-library - Versions diffs - 3.55.3 → 3.55.5 - Mend

@uva-glass/component-library 3.55.3 → 3.55.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (253) hide show

package/dist/{Accordion-BpnBHYIx.js → Accordion-DvblEUVu.js} RENAMED Viewed

@@ -2,10 +2,9 @@ import { t as e } from "./clsx-BD2qMUU1.js";
 import { Icon as t } from "./components/Icon/Icon.js";
 import { forwardRef as n, useId as r, useImperativeHandle as i, useState as a } from "react";
 import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import './assets/Accordion.css';//#region src/components/Accordion/Accordion.module.css
-var c = "_accordion_19w0n_1", l = "_accordion__title_19w0n_6", u = "_accordion__content_19w0n_66", d = {
-	accordion: c,
-	accordion__title: l,
+import './assets/Accordion.css';var c = {
+	accordion: "_accordion_19w0n_1",
+	accordion__title: "_accordion__title_19w0n_6",
 	"accordion__title-icon": "_accordion__title-icon_19w0n_21",
 	"accordion__title-icon-right": "_accordion__title-icon-right_19w0n_22",
 	"accordion__title-icon--margin-0": "_accordion__title-icon--margin-0_19w0n_28",
@@ -17,10 +16,10 @@ var c = "_accordion_19w0n_1", l = "_accordion__title_19w0n_6", u = "_accordion__
 	"accordion__title-icon--margin-200": "_accordion__title-icon--margin-200_19w0n_52",
 	"accordion__title-icon--expanded": "_accordion__title-icon--expanded_19w0n_60",
 	"accordion__title-icon-right--expanded": "_accordion__title-icon-right--expanded_19w0n_61",
-	accordion__content: u,
+	accordion__content: "_accordion__content_19w0n_66",
 	"accordion__content--expanded": "_accordion__content--expanded_19w0n_70"
-}, f = n(({ title: n, content: c, expanded: l = !1, cheveronPlacement: u = "right", cheveronMargin: f = "050" }, p) => {
-	let [m, h] = a(l), g = r();
+}, l = n(({ title: n, content: l, expanded: u = !1, cheveronPlacement: d = "right", cheveronMargin: f = "050" }, p) => {
+	let [m, h] = a(u), g = r();
 	function _(e) {
 		let { code: t } = e;
 		(t === "Enter" || t === "Space") && h(!m);
@@ -34,9 +33,9 @@ var c = "_accordion_19w0n_1", l = "_accordion__title_19w0n_6", u = "_accordion__
 		closeContent: v,
 		openContent: y
 	})), /* @__PURE__ */ o("div", { children: /* @__PURE__ */ s("div", {
-		className: d.accordion,
+		className: c.accordion,
 		children: [/* @__PURE__ */ s("div", {
-			className: d.accordion__title,
+			className: c.accordion__title,
 			id: g,
 			role: "button",
 			tabIndex: 0,
@@ -44,26 +43,26 @@ var c = "_accordion_19w0n_1", l = "_accordion__title_19w0n_6", u = "_accordion__
 			onKeyUp: _,
 			"aria-expanded": m,
 			children: [
-				u === "left" && /* @__PURE__ */ o(t, {
-					className: e(d["accordion__title-icon"], d[`accordion__title-icon--margin-${f}`], { [d["accordion__title-icon--expanded"]]: m }),
+				d === "left" && /* @__PURE__ */ o(t, {
+					className: e(c["accordion__title-icon"], c[`accordion__title-icon--margin-${f}`], { [c["accordion__title-icon--expanded"]]: m }),
 					name: "CheveronLeft",
 					size: 16
 				}),
 				n,
-				u === "right" && /* @__PURE__ */ o(t, {
-					className: e(d["accordion__title-icon-right"], d[`accordion__title-icon--margin-${f}`], { [d["accordion__title-icon-right--expanded"]]: m }),
+				d === "right" && /* @__PURE__ */ o(t, {
+					className: e(c["accordion__title-icon-right"], c[`accordion__title-icon--margin-${f}`], { [c["accordion__title-icon-right--expanded"]]: m }),
 					name: "CheveronLeft",
 					size: 16
 				})
 			]
 		}), /* @__PURE__ */ o("div", {
 			"aria-labelledby": g,
-			className: e(d.accordion__content, { [d["accordion__content--expanded"]]: m }),
-			children: c
+			className: e(c.accordion__content, { [c["accordion__content--expanded"]]: m }),
+			children: l
 		})]
 	}) });
 });
 //#endregion
-export { f as t };
+export { l as t };
-//# sourceMappingURL=Accordion-BpnBHYIx.js.map
+//# sourceMappingURL=Accordion-DvblEUVu.js.map

package/dist/{Accordion-BpnBHYIx.js.map → Accordion-DvblEUVu.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Accordion-~~BpnBHYIx~~.js","names":[],"sources":["../src/components/Accordion/Accordion.module.css","../src/components/Accordion/Accordion.tsx"],"sourcesContent":[".accordion {\n overflow: hidden;\n position: relative;\n}\n\n.accordion__title {\n align-items: center;\n display: flex;\n gap: 0.5rem;\n}\n\n.accordion__title:hover {\n cursor: pointer;\n text-decoration: underline;\n}\n\n.accordion__title:focus-visible {\n text-decoration: underline;\n}\n\n.accordion__title-icon,\n.accordion__title-icon-right {\n transform: rotate(-90deg);\n transition: transform 300ms ease-in;\n margin-right: 0.25rem;\n}\n\n.accordion__title-icon--margin-0 {\n margin: 0;\n}\n\n.accordion__title-icon--margin-025 {\n margin: 0 0.25rem;\n}\n\n.accordion__title-icon--margin-050 {\n margin: 0 0.5rem;\n}\n\n.accordion__title-icon--margin-075 {\n margin: 0 0.75rem;\n}\n\n.accordion__title-icon--margin-100 {\n margin: 0 1rem;\n}\n\n.accordion__title-icon--margin-150 {\n margin: 0 1.5rem;\n}\n\n.accordion__title-icon--margin-200 {\n margin: 0 2rem;\n}\n\n.accordion__title-icon-right {\n margin-left: auto;\n}\n\n.accordion__title-icon--expanded,\n.accordion__title-icon-right--expanded {\n transform: rotate(90deg);\n transition: transform 300ms ease-out;\n}\n\n.accordion__content {\n display: none;\n}\n\n.accordion__content--expanded {\n display: block;\n}\n","import { clsx } from 'clsx';\nimport { forwardRef, useId, useImperativeHandle, useState } from 'react';\n\nimport type { KeyboardEvent, ReactNode } from 'react';\n\nimport styles from './Accordion.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface AccordionProps {\n /** Clickable title (always visible). /\n title: ReactNode;\n /* Main content (hidden when expanded is false). /\n content: ReactNode;\n /* Indicator if Accordion should be expanded by default./\n expanded?: boolean;\n /* Indicator for cheveron icon placement./\n cheveronPlacement?: 'left' \| 'right';\n /* Indicator for cheveron icon margin. By default '050'. /\n cheveronMargin?: '0' \| '025' \| '050' \| '075' \| '100' \| '150' \| '200';\n}\n\nexport interface AccordionMethods {\n closeContent: () => void;\n openContent: () => void;\n}\n\n/* A controller for accordion display toggling of content with click on a title. */\nexport const Accordion = forwardRef<AccordionMethods, AccordionProps>(\n ({ title, content, expanded = false, cheveronPlacement = 'right', cheveronMargin = '050' }, ref) => {\n const [isExpanded, setIsExpanded] = useState(expanded);\n const accordionId = useId();\n\n function onKeyUp(event: KeyboardEvent<HTMLDivElement>) {\n const { code } = event;\n\n if (code === 'Enter' \|\| code === 'Space') {\n setIsExpanded(!isExpanded);\n }\n }\n\n const closeContent = () => {\n setIsExpanded(false);\n };\n\n const openContent = () => {\n setIsExpanded(true);\n };\n\n useImperativeHandle(ref, () => ({\n closeContent,\n openContent,\n }));\n\n return (\n <div>\n <div className={styles['accordion']}>\n <div\n className={styles['accordion__title']}\n id={accordionId}\n role=\"button\"\n tabIndex={0}\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyUp={onKeyUp}\n aria-expanded={isExpanded}\n >\n {cheveronPlacement === 'left' && (\n <Icon\n className={clsx(\n styles['accordion__title-icon'],\n styles[`accordion__title-icon--margin-${cheveronMargin}`],\n {\n [styles['accordion__title-icon--expanded']]: isExpanded,\n }\n )}\n name=\"CheveronLeft\"\n size={16}\n />\n )}\n\n {title}\n {cheveronPlacement === 'right' && (\n <Icon\n className={clsx(\n styles['accordion__title-icon-right'],\n styles[`accordion__title-icon--margin-${cheveronMargin}`],\n {\n [styles['accordion__title-icon-right--expanded']]: isExpanded,\n }\n )}\n name=\"CheveronLeft\"\n size={16}\n />\n )}\n </div>\n <div\n aria-labelledby={accordionId}\n className={clsx(styles.accordion__content, { [styles['accordion__content--expanded']]: isExpanded })}\n >\n {content}\n </div>\n </div>\n </div>\n );\n }\n);\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;~~GC4Ba,IAAY,GACtB,EAAE,UAAO,YAAS,cAAW,IAAO,uBAAoB,SAAS,oBAAiB,SAAS,MAAQ;CAClG,IAAM,CAAC,GAAY,KAAiB,EAAS,EAAS,EAChD,IAAc,GAAO;CAE3B,SAAS,EAAQ,GAAsC;EACrD,IAAM,EAAE,YAAS;AAEjB,GAAI,MAAS,WAAW,MAAS,YAC/B,EAAc,CAAC,EAAW;;CAI9B,IAAM,UAAqB;AACzB,IAAc,GAAM;IAGhB,UAAoB;AACxB,IAAc,GAAK;;AAQrB,QALA,EAAoB,UAAY;EAC9B;EACA;EACD,EAAE,EAGD,kBAAC,OAAD,EAAA,UACE,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACE,kBAAC,OAAD;GACE,WAAW,EAAO;GAClB,IAAI;GACJ,MAAK;GACL,UAAU;GACV,eAAe,EAAc,CAAC,EAAW;GAChC;GACT,iBAAe;aAPjB;IASG,MAAsB,UACrB,kBAAC,GAAD;KACE,WAAW,EACT,EAAO,0BACP,EAAO,iCAAiC,MACxC,GACG,EAAO,qCAAqC,GAC9C,CACF;KACD,MAAK;KACL,MAAM;KACN,CAAA;IAGH;IACA,MAAsB,WACrB,kBAAC,GAAD;KACE,WAAW,EACT,EAAO,gCACP,EAAO,iCAAiC,MACxC,GACG,EAAO,2CAA2C,GACpD,CACF;KACD,MAAK;KACL,MAAM;KACN,CAAA;IAEA;MACN,kBAAC,OAAD;GACE,mBAAiB;GACjB,WAAW,EAAK,EAAO,oBAAoB,GAAG,EAAO,kCAAkC,GAAY,CAAC;aAEnG;GACG,CAAA,CACF;KACF,CAAA;EAGX"}
1	+ {"version":3,"file":"Accordion-DvblEUVu.js","names":[],"sources":["../src/components/Accordion/Accordion.module.css","../src/components/Accordion/Accordion.tsx"],"sourcesContent":[".accordion {\n overflow: hidden;\n position: relative;\n}\n\n.accordion__title {\n align-items: center;\n display: flex;\n gap: 0.5rem;\n}\n\n.accordion__title:hover {\n cursor: pointer;\n text-decoration: underline;\n}\n\n.accordion__title:focus-visible {\n text-decoration: underline;\n}\n\n.accordion__title-icon,\n.accordion__title-icon-right {\n transform: rotate(-90deg);\n transition: transform 300ms ease-in;\n margin-right: 0.25rem;\n}\n\n.accordion__title-icon--margin-0 {\n margin: 0;\n}\n\n.accordion__title-icon--margin-025 {\n margin: 0 0.25rem;\n}\n\n.accordion__title-icon--margin-050 {\n margin: 0 0.5rem;\n}\n\n.accordion__title-icon--margin-075 {\n margin: 0 0.75rem;\n}\n\n.accordion__title-icon--margin-100 {\n margin: 0 1rem;\n}\n\n.accordion__title-icon--margin-150 {\n margin: 0 1.5rem;\n}\n\n.accordion__title-icon--margin-200 {\n margin: 0 2rem;\n}\n\n.accordion__title-icon-right {\n margin-left: auto;\n}\n\n.accordion__title-icon--expanded,\n.accordion__title-icon-right--expanded {\n transform: rotate(90deg);\n transition: transform 300ms ease-out;\n}\n\n.accordion__content {\n display: none;\n}\n\n.accordion__content--expanded {\n display: block;\n}\n","import { clsx } from 'clsx';\nimport { forwardRef, useId, useImperativeHandle, useState } from 'react';\n\nimport type { KeyboardEvent, ReactNode } from 'react';\n\nimport styles from './Accordion.module.css';\n\nimport { Icon } from 'components/Icon';\n\nexport interface AccordionProps {\n /** Clickable title (always visible). /\n title: ReactNode;\n /* Main content (hidden when expanded is false). /\n content: ReactNode;\n /* Indicator if Accordion should be expanded by default./\n expanded?: boolean;\n /* Indicator for cheveron icon placement./\n cheveronPlacement?: 'left' \| 'right';\n /* Indicator for cheveron icon margin. By default '050'. /\n cheveronMargin?: '0' \| '025' \| '050' \| '075' \| '100' \| '150' \| '200';\n}\n\nexport interface AccordionMethods {\n closeContent: () => void;\n openContent: () => void;\n}\n\n/* A controller for accordion display toggling of content with click on a title. */\nexport const Accordion = forwardRef<AccordionMethods, AccordionProps>(\n ({ title, content, expanded = false, cheveronPlacement = 'right', cheveronMargin = '050' }, ref) => {\n const [isExpanded, setIsExpanded] = useState(expanded);\n const accordionId = useId();\n\n function onKeyUp(event: KeyboardEvent<HTMLDivElement>) {\n const { code } = event;\n\n if (code === 'Enter' \|\| code === 'Space') {\n setIsExpanded(!isExpanded);\n }\n }\n\n const closeContent = () => {\n setIsExpanded(false);\n };\n\n const openContent = () => {\n setIsExpanded(true);\n };\n\n useImperativeHandle(ref, () => ({\n closeContent,\n openContent,\n }));\n\n return (\n <div>\n <div className={styles['accordion']}>\n <div\n className={styles['accordion__title']}\n id={accordionId}\n role=\"button\"\n tabIndex={0}\n onClick={() => setIsExpanded(!isExpanded)}\n onKeyUp={onKeyUp}\n aria-expanded={isExpanded}\n >\n {cheveronPlacement === 'left' && (\n <Icon\n className={clsx(\n styles['accordion__title-icon'],\n styles[`accordion__title-icon--margin-${cheveronMargin}`],\n {\n [styles['accordion__title-icon--expanded']]: isExpanded,\n }\n )}\n name=\"CheveronLeft\"\n size={16}\n />\n )}\n\n {title}\n {cheveronPlacement === 'right' && (\n <Icon\n className={clsx(\n styles['accordion__title-icon-right'],\n styles[`accordion__title-icon--margin-${cheveronMargin}`],\n {\n [styles['accordion__title-icon-right--expanded']]: isExpanded,\n }\n )}\n name=\"CheveronLeft\"\n size={16}\n />\n )}\n </div>\n <div\n aria-labelledby={accordionId}\n className={clsx(styles.accordion__content, { [styles['accordion__content--expanded']]: isExpanded })}\n >\n {content}\n </div>\n </div>\n </div>\n );\n }\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;GC4Ba,IAAY,GACtB,EAAE,UAAO,YAAS,cAAW,IAAO,uBAAoB,SAAS,oBAAiB,SAAS,MAAQ;CAClG,IAAM,CAAC,GAAY,KAAiB,EAAS,EAAS,EAChD,IAAc,GAAO;CAE3B,SAAS,EAAQ,GAAsC;EACrD,IAAM,EAAE,YAAS;AAEjB,GAAI,MAAS,WAAW,MAAS,YAC/B,EAAc,CAAC,EAAW;;CAI9B,IAAM,UAAqB;AACzB,IAAc,GAAM;IAGhB,UAAoB;AACxB,IAAc,GAAK;;AAQrB,QALA,EAAoB,UAAY;EAC9B;EACA;EACD,EAAE,EAGD,kBAAC,OAAD,EAAA,UACE,kBAAC,OAAD;EAAK,WAAW,EAAO;YAAvB,CACE,kBAAC,OAAD;GACE,WAAW,EAAO;GAClB,IAAI;GACJ,MAAK;GACL,UAAU;GACV,eAAe,EAAc,CAAC,EAAW;GAChC;GACT,iBAAe;aAPjB;IASG,MAAsB,UACrB,kBAAC,GAAD;KACE,WAAW,EACT,EAAO,0BACP,EAAO,iCAAiC,MACxC,GACG,EAAO,qCAAqC,GAC9C,CACF;KACD,MAAK;KACL,MAAM;KACN,CAAA;IAGH;IACA,MAAsB,WACrB,kBAAC,GAAD;KACE,WAAW,EACT,EAAO,gCACP,EAAO,iCAAiC,MACxC,GACG,EAAO,2CAA2C,GACpD,CACF;KACD,MAAK;KACL,MAAM;KACN,CAAA;IAEA;MACN,kBAAC,OAAD;GACE,mBAAiB;GACjB,WAAW,EAAK,EAAO,oBAAoB,GAAG,EAAO,kCAAkC,GAAY,CAAC;aAEnG;GACG,CAAA,CACF;KACF,CAAA;EAGX"}

package/dist/{AddCatalogueLinkForm-Cy6fPNvN.js → AddCatalogueLinkForm-rph4K9P0.js} RENAMED Viewed

@@ -7,22 +7,21 @@ import { useLanguage as a } from "./components/RteEditor/Providers/LanguageProvi
 import { useTranslation as o } from "./components/RteEditor/hooks/useTranslation.js";
 import { useEffect as s, useId as c, useRef as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
-import './assets/AddCatalogueLinkForm.css';//#region src/components/RteEditor/Plugins/CourseCataloguePlugin/AddCatalogueLinkForm/AddCatalogueLinkForm.module.css
-var f = "_courselinkform_16a4f_1", p = "_courselinkform__footer_16a4f_13", m = "_courselinkform__results_16a4f_20", h = {
-	courselinkform: f,
+import './assets/AddCatalogueLinkForm.css';var f = {
+	courselinkform: "_courselinkform_16a4f_1",
 	"courselinkform__input-field": "_courselinkform__input-field_16a4f_7",
-	courselinkform__footer: p,
+	courselinkform__footer: "_courselinkform__footer_16a4f_13",
 	"courselinkform__results-wrapper": "_courselinkform__results-wrapper_16a4f_20",
 	"courselinkform__results-header": "_courselinkform__results-header_16a4f_24",
-	courselinkform__results: m,
+	courselinkform__results: "_courselinkform__results_16a4f_20",
 	"courselinkform__result-message": "_courselinkform__result-message_16a4f_41",
 	"courselinkform__result-item": "_courselinkform__result-item_16a4f_51"
-}, g = ({ linkType: f, onCloseHandler: p, onSearchHandler: m, searchResponse: g, onSelect: _ }) => {
+}, p = ({ linkType: p, onCloseHandler: m, onSearchHandler: h, searchResponse: g, onSelect: _ }) => {
 	let v = o(), y = `search_${c()}`, b = l(null), x = l(null), { currentLanguage: S } = a(), C = (e) => {
 		let t = e.target.value;
-		m && m(t, f);
+		h && h(t, p);
 	}, w = () => {
-		p();
+		m();
 	}, T = (e) => {
 		e.key === "ArrowDown" && (e.preventDefault(), (x.current?.querySelector("button"))?.focus());
 	}, E = (e, t, n, r) => {
@@ -48,19 +47,19 @@ var f = "_courselinkform_16a4f_1", p = "_courselinkform__footer_16a4f_13", m = "
 		}
 	};
 	return s(() => {
-		b.current && (m("", f), b.current.value = "", b.current.focus());
+		b.current && (h("", p), b.current.value = "", b.current.focus());
 	}, []), /* @__PURE__ */ d("div", {
-		className: h.courselinkform,
+		className: f.courselinkform,
 		children: [/* @__PURE__ */ d(n, {
 			gap: "050",
 			children: [
 				/* @__PURE__ */ d(r, {
-					className: h["courselinkform__input-field"],
+					className: f["courselinkform__input-field"],
 					children: [/* @__PURE__ */ u(t, {
 						htmlFor: y,
-						children: v.cataloguelinks[f === "course" ? "searchCourseFieldLabel" : "searchProgrammeFieldLabel"]
+						children: v.cataloguelinks[p === "course" ? "searchCourseFieldLabel" : "searchProgrammeFieldLabel"]
 					}), /* @__PURE__ */ u("div", {
-						className: h["linkform__input-url-wrapper"],
+						className: f["linkform__input-url-wrapper"],
 						children: /* @__PURE__ */ u(i, {
 							id: y,
 							placeholder: v.cataloguelinks.searchFieldPlaceholder,
@@ -72,26 +71,26 @@ var f = "_courselinkform_16a4f_1", p = "_courselinkform__footer_16a4f_13", m = "
 					})]
 				}),
 				g && g.state === "pending" && /* @__PURE__ */ u("div", {
-					className: h["courselinkform__result-message"],
+					className: f["courselinkform__result-message"],
 					children: v.cataloguelinks.loading
 				}),
 				g && g.results.length === 0 && g.state === "ready" && /* @__PURE__ */ u("div", {
-					className: h["courselinkform__result-message"],
+					className: f["courselinkform__result-message"],
 					children: v.cataloguelinks.noResults
 				}),
 				g && g.results.length > 0 && /* @__PURE__ */ d("div", {
-					className: h["courselinkform__results-wrapper"],
+					className: f["courselinkform__results-wrapper"],
 					children: [/* @__PURE__ */ d("div", {
-						className: h["courselinkform__results-header"],
-						children: [/* @__PURE__ */ u("span", { children: v.cataloguelinks[f === "course" ? "resultCourseListCatalogNumber" : "resultProgrammeListCatalogNumber"] }), /* @__PURE__ */ u("span", { children: v.cataloguelinks.resultListName })]
+						className: f["courselinkform__results-header"],
+						children: [/* @__PURE__ */ u("span", { children: v.cataloguelinks[p === "course" ? "resultCourseListCatalogNumber" : "resultProgrammeListCatalogNumber"] }), /* @__PURE__ */ u("span", { children: v.cataloguelinks.resultListName })]
 					}), /* @__PURE__ */ u("div", {
-						className: h.courselinkform__results,
+						className: f.courselinkform__results,
 						ref: x,
 						children: g.results.map(({ id: e, code: t, name: n }) => /* @__PURE__ */ d("button", {
 							type: "button",
-							className: h["courselinkform__result-item"],
-							onClick: () => _ && _(t, n[S], f),
-							onKeyDown: (e) => E(e, t, n[S], f),
+							className: f["courselinkform__result-item"],
+							onClick: () => _ && _(t, n[S], p),
+							onKeyDown: (e) => E(e, t, n[S], p),
 							tabIndex: 0,
 							"aria-label": `${t} ${n[S]}`,
 							children: [/* @__PURE__ */ u("span", { children: t }), /* @__PURE__ */ u("span", { children: n[S] })]
@@ -100,7 +99,7 @@ var f = "_courselinkform_16a4f_1", p = "_courselinkform__footer_16a4f_13", m = "
 				})
 			]
 		}), /* @__PURE__ */ u("div", {
-			className: h.courselinkform__footer,
+			className: f.courselinkform__footer,
 			children: /* @__PURE__ */ u(e, {
 				variant: "secondary",
 				onClick: w,
@@ -112,6 +111,6 @@ var f = "_courselinkform_16a4f_1", p = "_courselinkform__footer_16a4f_13", m = "
 	});
 };
 //#endregion
-export { g as t };
+export { p as t };
-//# sourceMappingURL=AddCatalogueLinkForm-Cy6fPNvN.js.map
+//# sourceMappingURL=AddCatalogueLinkForm-rph4K9P0.js.map

package/dist/{AddCatalogueLinkForm-Cy6fPNvN.js.map → AddCatalogueLinkForm-rph4K9P0.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AddCatalogueLinkForm-Cy6fPNvN.js","names":[],"sources":["../src/components/RteEditor/Plugins/CourseCataloguePlugin/AddCatalogueLinkForm/AddCatalogueLinkForm.module.css","../src/components/RteEditor/Plugins/CourseCataloguePlugin/AddCatalogueLinkForm/AddCatalogueLinkForm.tsx"],"sourcesContent":[".courselinkform {\n font-family: inherit;\n font-size: inherit;\n width: 30rem;\n}\n\n.courselinkform__input-field {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.courselinkform__footer {\n display: flex;\n gap: 0.5rem;\n justify-content: flex-end;\n margin-top: 1rem;\n}\n\n.courselinkform__results-wrapper {\n position: relative;\n}\n\n.courselinkform__results-header {\n align-items: center;\n display: flex;\n font-size: var(--font-size-text-base);\n gap: 0.5rem;\n padding: 0.5rem;\n text-align: left;\n width: 100%;\n}\n\n.courselinkform__results {\n border: 1px solid var(--color-grey-300);\n border-radius: 0.25rem;\n max-height: 10rem;\n overflow-y: auto;\n}\n\n.courselinkform__result-message {\n align-items: center;\n color: var(--color-grey-600);\n display: flex;\n font-size: var(--font-size-text-non-essential);\n height: 2rem;\n justify-content: flex-start;\n padding: 0 0.5rem;\n}\n\n.courselinkform__result-item {\n align-items: center;\n appearance: none;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n font-family: inherit;\n font-size: var(--font-size-text-base);\n gap: 0.5rem;\n min-height: 2.5rem;\n padding: 0.5rem;\n text-align: left;\n width: 100%;\n}\n\n.courselinkform__results-header span,\n.courselinkform__result-item span {\n line-height: 1.4;\n width: calc(100% - 9rem);\n}\n\n.courselinkform__results-header span:first-child,\n.courselinkform__result-item span:first-child {\n width: 9rem;\n}\n\n.courselinkform__result-item:focus-visible {\n background-color: var(--color-grey-300);\n outline: none;\n}\n\n.courselinkform__result-item:hover,\n.courselinkform__result-item:focus-visible {\n background-color: var(--color-grey-300);\n}\n\n.courselinkform__result-item:not(:last-child) {\n border-bottom: 1px solid var(--color-grey-300);\n}\n","import { useEffect, useId, useRef } from 'react';\r\n\r\nimport type { KeyboardEvent } from 'react';\r\n\r\nimport styles from './AddCatalogueLinkForm.module.css';\r\n\r\nimport { Button } from 'components/Buttons';\r\nimport { FormField } from 'components/FormField';\r\nimport { Label } from 'components/Label';\r\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\r\nimport { InputField } from 'components/InputField';\r\nimport { useLanguage } from 'components/RteEditor/Providers/LanguageProvider';\r\nimport { Repeater } from 'components/Repeater';\r\n\r\ntype SearchResult = {\r\n code: string;\r\n id: string;\r\n name: {\r\n EN: string;\r\n NL: string;\r\n };\r\n programmeType: string;\r\n};\r\n\r\nexport type SearchResponse = {\r\n state: 'idle' \| 'pending' \| 'ready';\r\n results: SearchResult[];\r\n};\r\n\r\ninterface AddCatalogueLinkFormProps {\r\n linkType: 'course' \| 'programme';\r\n onCloseHandler: () => void;\r\n onSearchHandler: (query: string, type: 'course' \| 'programme') => void;\r\n searchResponse?: SearchResponse;\r\n onSelect?: (code: string, label: string, type: 'course' \| 'programme') => void;\r\n}\r\n\r\nexport const AddCatalogueLinkForm = ({\r\n linkType,\r\n onCloseHandler,\r\n onSearchHandler,\r\n searchResponse,\r\n onSelect,\r\n}: AddCatalogueLinkFormProps) => {\r\n const t = useTranslation();\r\n const searchId = `search_${useId()}`;\r\n const searchFieldRef = useRef<HTMLInputElement>(null);\r\n const resultListRef = useRef<HTMLDivElement>(null);\r\n const { currentLanguage } = useLanguage();\r\n\r\n const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n const query = event.target.value;\r\n if (onSearchHandler) {\r\n onSearchHandler(query, linkType);\r\n }\r\n };\r\n\r\n const handleClose = () => {\r\n onCloseHandler();\r\n };\r\n\r\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n if (event.key === 'ArrowDown') {\r\n event.preventDefault();\r\n const container = resultListRef.current;\r\n const firstFocusable = container?.querySelector<HTMLElement>('button');\r\n firstFocusable?.focus();\r\n }\r\n };\r\n\r\n const onResultKeyDown = (\r\n event: KeyboardEvent<HTMLButtonElement>,\r\n code: string,\r\n name: string,\r\n linkType: 'course' \| 'programme'\r\n ) => {\r\n switch (event.key) {\r\n case 'Escape':\r\n event.preventDefault();\r\n event.stopPropagation();\r\n handleClose();\r\n break;\r\n case 'Enter':\r\n event.preventDefault();\r\n onSelect && onSelect(code, name, linkType);\r\n break;\r\n case 'ArrowDown': {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n const nextElement = event.currentTarget.nextElementSibling;\r\n (nextElement as HTMLButtonElement)?.focus();\r\n break;\r\n }\r\n case 'ArrowUp': {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n const previousElement = event.currentTarget.previousElementSibling;\r\n (previousElement as HTMLButtonElement)?.focus();\r\n break;\r\n }\r\n case 'Tab':\r\n event.preventDefault();\r\n handleClose();\r\n break;\r\n default:\r\n event.preventDefault();\r\n break;\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (searchFieldRef.current) {\r\n onSearchHandler('', linkType);\r\n searchFieldRef.current.value = '';\r\n searchFieldRef.current.focus();\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return (\r\n <div className={styles['courselinkform']}>\r\n <Repeater gap=\"050\">\r\n <FormField className={styles['courselinkform__input-field']}>\r\n <Label htmlFor={searchId}>\r\n {t.cataloguelinks[linkType === 'course' ? 'searchCourseFieldLabel' : 'searchProgrammeFieldLabel']}\r\n </Label>\r\n <div className={styles['linkform__input-url-wrapper']}>\r\n <InputField\r\n id={searchId}\r\n placeholder={t.cataloguelinks.searchFieldPlaceholder}\r\n onChange={handleSearch}\r\n onKeyDown={handleKeyDown}\r\n ref={searchFieldRef}\r\n aria-label={t.aria.labels.searchField}\r\n />\r\n </div>\r\n </FormField>\r\n {searchResponse && searchResponse.state === 'pending' && (\r\n <div className={styles['courselinkform__result-message']}>{t.cataloguelinks.loading}</div>\r\n )}\r\n {searchResponse && searchResponse.results.length === 0 && searchResponse.state === 'ready' && (\r\n <div className={styles['courselinkform__result-message']}>{t.cataloguelinks.noResults}</div>\r\n )}\r\n {searchResponse && searchResponse.results.length > 0 && (\r\n <div className={styles['courselinkform__results-wrapper']}>\r\n <div className={styles['courselinkform__results-header']}>\r\n <span>\r\n {\r\n t.cataloguelinks[\r\n linkType === 'course' ? 'resultCourseListCatalogNumber' : 'resultProgrammeListCatalogNumber'\r\n ]\r\n }\r\n </span>\r\n <span>{t.cataloguelinks.resultListName}</span>\r\n </div>\r\n <div className={styles['courselinkform__results']} ref={resultListRef}>\r\n {searchResponse.results.map(({ id, code, name }) => (\r\n <button\r\n key={id}\r\n type=\"button\"\r\n className={styles['courselinkform__result-item']}\r\n onClick={() => onSelect && onSelect(code, name[currentLanguage], linkType)}\r\n onKeyDown={(event) => onResultKeyDown(event, code, name[currentLanguage], linkType)}\r\n tabIndex={0}\r\n aria-label={`${code} ${name[currentLanguage]}`}\r\n >\r\n <span>{code}</span>\r\n <span>{name[currentLanguage]}</span>\r\n </button>\r\n ))}\r\n </div>\r\n </div>\r\n )}\r\n </Repeater>\r\n <div className={styles['courselinkform__footer']}>\r\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\r\n {t.common.cancel}\r\n </Button>\r\n </div>\r\n </div>\r\n );\r\n};\r\n"],"mappings":"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"}
1	+ {"version":3,"file":"AddCatalogueLinkForm-rph4K9P0.js","names":[],"sources":["../src/components/RteEditor/Plugins/CourseCataloguePlugin/AddCatalogueLinkForm/AddCatalogueLinkForm.module.css","../src/components/RteEditor/Plugins/CourseCataloguePlugin/AddCatalogueLinkForm/AddCatalogueLinkForm.tsx"],"sourcesContent":[".courselinkform {\n font-family: inherit;\n font-size: inherit;\n width: 30rem;\n}\n\n.courselinkform__input-field {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.courselinkform__footer {\n display: flex;\n gap: 0.5rem;\n justify-content: flex-end;\n margin-top: 1rem;\n}\n\n.courselinkform__results-wrapper {\n position: relative;\n}\n\n.courselinkform__results-header {\n align-items: center;\n display: flex;\n font-size: var(--font-size-text-base);\n gap: 0.5rem;\n padding: 0.5rem;\n text-align: left;\n width: 100%;\n}\n\n.courselinkform__results {\n border: 1px solid var(--color-grey-300);\n border-radius: 0.25rem;\n max-height: 10rem;\n overflow-y: auto;\n}\n\n.courselinkform__result-message {\n align-items: center;\n color: var(--color-grey-600);\n display: flex;\n font-size: var(--font-size-text-non-essential);\n height: 2rem;\n justify-content: flex-start;\n padding: 0 0.5rem;\n}\n\n.courselinkform__result-item {\n align-items: center;\n appearance: none;\n background-color: transparent;\n border: none;\n cursor: pointer;\n display: flex;\n font-family: inherit;\n font-size: var(--font-size-text-base);\n gap: 0.5rem;\n min-height: 2.5rem;\n padding: 0.5rem;\n text-align: left;\n width: 100%;\n}\n\n.courselinkform__results-header span,\n.courselinkform__result-item span {\n line-height: 1.4;\n width: calc(100% - 9rem);\n}\n\n.courselinkform__results-header span:first-child,\n.courselinkform__result-item span:first-child {\n width: 9rem;\n}\n\n.courselinkform__result-item:focus-visible {\n background-color: var(--color-grey-300);\n outline: none;\n}\n\n.courselinkform__result-item:hover,\n.courselinkform__result-item:focus-visible {\n background-color: var(--color-grey-300);\n}\n\n.courselinkform__result-item:not(:last-child) {\n border-bottom: 1px solid var(--color-grey-300);\n}\n","import { useEffect, useId, useRef } from 'react';\r\n\r\nimport type { KeyboardEvent } from 'react';\r\n\r\nimport styles from './AddCatalogueLinkForm.module.css';\r\n\r\nimport { Button } from 'components/Buttons';\r\nimport { FormField } from 'components/FormField';\r\nimport { Label } from 'components/Label';\r\nimport { useTranslation } from 'components/RteEditor/hooks/useTranslation';\r\nimport { InputField } from 'components/InputField';\r\nimport { useLanguage } from 'components/RteEditor/Providers/LanguageProvider';\r\nimport { Repeater } from 'components/Repeater';\r\n\r\ntype SearchResult = {\r\n code: string;\r\n id: string;\r\n name: {\r\n EN: string;\r\n NL: string;\r\n };\r\n programmeType: string;\r\n};\r\n\r\nexport type SearchResponse = {\r\n state: 'idle' \| 'pending' \| 'ready';\r\n results: SearchResult[];\r\n};\r\n\r\ninterface AddCatalogueLinkFormProps {\r\n linkType: 'course' \| 'programme';\r\n onCloseHandler: () => void;\r\n onSearchHandler: (query: string, type: 'course' \| 'programme') => void;\r\n searchResponse?: SearchResponse;\r\n onSelect?: (code: string, label: string, type: 'course' \| 'programme') => void;\r\n}\r\n\r\nexport const AddCatalogueLinkForm = ({\r\n linkType,\r\n onCloseHandler,\r\n onSearchHandler,\r\n searchResponse,\r\n onSelect,\r\n}: AddCatalogueLinkFormProps) => {\r\n const t = useTranslation();\r\n const searchId = `search_${useId()}`;\r\n const searchFieldRef = useRef<HTMLInputElement>(null);\r\n const resultListRef = useRef<HTMLDivElement>(null);\r\n const { currentLanguage } = useLanguage();\r\n\r\n const handleSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n const query = event.target.value;\r\n if (onSearchHandler) {\r\n onSearchHandler(query, linkType);\r\n }\r\n };\r\n\r\n const handleClose = () => {\r\n onCloseHandler();\r\n };\r\n\r\n const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {\r\n if (event.key === 'ArrowDown') {\r\n event.preventDefault();\r\n const container = resultListRef.current;\r\n const firstFocusable = container?.querySelector<HTMLElement>('button');\r\n firstFocusable?.focus();\r\n }\r\n };\r\n\r\n const onResultKeyDown = (\r\n event: KeyboardEvent<HTMLButtonElement>,\r\n code: string,\r\n name: string,\r\n linkType: 'course' \| 'programme'\r\n ) => {\r\n switch (event.key) {\r\n case 'Escape':\r\n event.preventDefault();\r\n event.stopPropagation();\r\n handleClose();\r\n break;\r\n case 'Enter':\r\n event.preventDefault();\r\n onSelect && onSelect(code, name, linkType);\r\n break;\r\n case 'ArrowDown': {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n const nextElement = event.currentTarget.nextElementSibling;\r\n (nextElement as HTMLButtonElement)?.focus();\r\n break;\r\n }\r\n case 'ArrowUp': {\r\n event.preventDefault();\r\n event.stopPropagation();\r\n const previousElement = event.currentTarget.previousElementSibling;\r\n (previousElement as HTMLButtonElement)?.focus();\r\n break;\r\n }\r\n case 'Tab':\r\n event.preventDefault();\r\n handleClose();\r\n break;\r\n default:\r\n event.preventDefault();\r\n break;\r\n }\r\n };\r\n\r\n useEffect(() => {\r\n if (searchFieldRef.current) {\r\n onSearchHandler('', linkType);\r\n searchFieldRef.current.value = '';\r\n searchFieldRef.current.focus();\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n return (\r\n <div className={styles['courselinkform']}>\r\n <Repeater gap=\"050\">\r\n <FormField className={styles['courselinkform__input-field']}>\r\n <Label htmlFor={searchId}>\r\n {t.cataloguelinks[linkType === 'course' ? 'searchCourseFieldLabel' : 'searchProgrammeFieldLabel']}\r\n </Label>\r\n <div className={styles['linkform__input-url-wrapper']}>\r\n <InputField\r\n id={searchId}\r\n placeholder={t.cataloguelinks.searchFieldPlaceholder}\r\n onChange={handleSearch}\r\n onKeyDown={handleKeyDown}\r\n ref={searchFieldRef}\r\n aria-label={t.aria.labels.searchField}\r\n />\r\n </div>\r\n </FormField>\r\n {searchResponse && searchResponse.state === 'pending' && (\r\n <div className={styles['courselinkform__result-message']}>{t.cataloguelinks.loading}</div>\r\n )}\r\n {searchResponse && searchResponse.results.length === 0 && searchResponse.state === 'ready' && (\r\n <div className={styles['courselinkform__result-message']}>{t.cataloguelinks.noResults}</div>\r\n )}\r\n {searchResponse && searchResponse.results.length > 0 && (\r\n <div className={styles['courselinkform__results-wrapper']}>\r\n <div className={styles['courselinkform__results-header']}>\r\n <span>\r\n {\r\n t.cataloguelinks[\r\n linkType === 'course' ? 'resultCourseListCatalogNumber' : 'resultProgrammeListCatalogNumber'\r\n ]\r\n }\r\n </span>\r\n <span>{t.cataloguelinks.resultListName}</span>\r\n </div>\r\n <div className={styles['courselinkform__results']} ref={resultListRef}>\r\n {searchResponse.results.map(({ id, code, name }) => (\r\n <button\r\n key={id}\r\n type=\"button\"\r\n className={styles['courselinkform__result-item']}\r\n onClick={() => onSelect && onSelect(code, name[currentLanguage], linkType)}\r\n onKeyDown={(event) => onResultKeyDown(event, code, name[currentLanguage], linkType)}\r\n tabIndex={0}\r\n aria-label={`${code} ${name[currentLanguage]}`}\r\n >\r\n <span>{code}</span>\r\n <span>{name[currentLanguage]}</span>\r\n </button>\r\n ))}\r\n </div>\r\n </div>\r\n )}\r\n </Repeater>\r\n <div className={styles['courselinkform__footer']}>\r\n <Button variant={'secondary'} onClick={handleClose} aria-label={t.common.cancel} type=\"button\">\r\n {t.common.cancel}\r\n </Button>\r\n </div>\r\n </div>\r\n );\r\n};\r\n"],"mappings":"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"}

package/dist/{CheckboxButtonBar-CalU0IYK.js → CheckboxButtonBar-5UMIFMKH.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 import { t as e } from "./clsx-BD2qMUU1.js";
 import { t } from "./Label-o0BcWTUS.js";
 import { t as n } from "./FeedbackBox-Bu7uB9DP.js";
-import { t as r } from "./ControlsButton-zemVxTlg.js";
+import { t as r } from "./ControlsButton-B1XRpMUM.js";
 import { useState as i } from "react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 import './assets/CheckboxButtonBar.css';//#region src/components/CheckboxButtonBar/CheckboxButtonBar.module.css
@@ -76,4 +76,4 @@ var s = {
 //#endregion
 export { c as t };
-//# sourceMappingURL=CheckboxButtonBar-CalU0IYK.js.map
+//# sourceMappingURL=CheckboxButtonBar-5UMIFMKH.js.map

package/dist/{CheckboxButtonBar-CalU0IYK.js.map → CheckboxButtonBar-5UMIFMKH.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxButtonBar-~~CalU0IYK~~.js","names":[],"sources":["../src/components/CheckboxButtonBar/CheckboxButtonBar.module.css","../src/components/CheckboxButtonBar/CheckboxButtonBar.tsx"],"sourcesContent":[".checkbox-button-bar__container {\n display: flex;\n flex-wrap: wrap;\n}\n\n.checkbox-button-bar__container--label-left {\n align-items: baseline;\n flex-direction: row;\n gap: 1rem;\n}\n\n.checkbox-button-bar__container--label-top {\n align-items: flex-start;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.checkbox-button-bar__row-container {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.checkbox-button-bar__row-container--segmented {\n flex-direction: row;\n}\n\n.checkbox-button-bar__row {\n align-items: center;\n background-color: var(--color-uva-white);\n border: 1px solid var(--color-grey-700);\n border-radius: 0.5rem;\n display: flex;\n flex-wrap: nowrap;\n gap: 0.25rem;\n padding: 0.25rem;\n}\n\n.checkbox-button-bar__row--not-valid {\n border-color: var(--color-red-600);\n}\n\n.checkbox-button-bar__sub-text {\n color: var(--color-grey-700);\n font-size: var(--font-size-text-non-essential);\n}\n","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 /* optional sub-label text (only displayed when label is positioned 'top') /\n subLabel?: 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 not valid; otherwise, `false`. /\n notValid?: 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 subLabel = '',\n labelPosition = 'top',\n required = false,\n notValid = 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 \|\| subLabel) && (\n <div>\n {label && (\n <Label htmlFor=\"\" required={required}>\n {label}\n </Label>\n )}\n\n {subLabel && labelPosition === 'top' && (\n <div className={styles['checkbox-button-bar__sub-text']}>{subLabel}</div>\n )}\n </div>\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-valid']]: notValid \|\| 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-valid']]: notValid \|\| 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__sub-text']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;GCiDa,KAAqB,EAChC,eACA,kBACA,UACA,cAAW,IACX,mBAAgB,OAChB,cAAW,IACX,cAAW,IACX,sBAAmB,IACnB,yBAAsB,IACtB,gBAAa,IACb,kBAAe,IACf,eAAY,IACZ,kBAAe,IACf,qBAC4B;CAC5B,IAAM,CAAC,GAAe,KAAoB,EACxC,KAAiB,CAAC,IACd,EAAc,IAAI,OAAO,GACzB,KAAiB,IACf,EAAc,MAAM,GAAG,EAAE,GACzB,EAAE,CACT,EAEK,KAAgB,MAAkB;EACtC,IAAI,IAAS;AAEb,EAAI,KACF,EAAiB,CAAC,EAAM,CAAC,EACzB,EAAY,CAAC,EAAM,CAAC,KAEpB,AAGE,IAHE,EAAO,SAAS,EAAM,GACf,EAAO,QAAQ,MAAQ,MAAQ,EAAM,GAErC,CAAC,GAAG,GAAQ,EAAM,EAE7B,EAAiB,EAAO,EACxB,EAAY,EAAO;;AAIvB,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAAO,mCACP,EAAO,yCAAyC,KACjD;YAJH;IAMI,KAAS,MACT,kBAAC,OAAD,EAAA,UAAA,CACG,KACC,kBAAC,GAAD;IAAO,SAAQ;IAAa;cACzB;IACK,CAAA,EAGT,KAAY,MAAkB,SAC7B,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAmC;IAAe,CAAA,CAEvE,EAAA,CAAA;GAGR,kBAAC,OAAD;IACE,WAAW,EAAK,EAAO,uCAAuC,GAC3D,EAAO,mDAAmD,GAC5D,CAAC;cAED,IACC,EAAW,KAAK,EAAE,UAAO,UAAO,WAAQ,YAAS,oBAAiB,kBAChE,kBAAC,OAAD;KAEE,WAAW,EAAK,EAAO,6BAA6B,GACjD,EAAO,yCAAyC,KAAY,GAC9D,CAAC;eAEF,kBAAC,GAAD;MACE,MAAM,IAAsB,UAAU;MAC/B;MACC;MACC;MACQ;MACH;MACP;MACP,SAAS,EAAc,SAAS,EAAM;MACtC,UAAU,KAAY;MACtB,aAAa,MAAU,EAAa,EAAM,OAAO,MAAM;MACvD,CAAA;KACE,EAjBC,EAiBD,CACN,GAEF,kBAAC,OAAD;KACE,WAAW,EAAK,EAAO,6BAA6B,GACjD,EAAO,yCAAyC,KAAY,GAC9D,CAAC;eAED,EAAW,KAAK,EAAE,UAAO,UAAO,WAAQ,YAAS,oBAAiB,kBACjE,kBAAC,GAAD;MAEE,MAAM,IAAsB,UAAU;MAC/B;MACC;MACC;MACQ;MACH;MACP;MACP,SAAS,EAAc,SAAS,EAAM;MACtC,UAAU,KAAY;MACtB,aAAa,MAAU,EAAa,EAAM,OAAO,MAAM;MACvD,EAXK,EAWL,CACF;KACE,CAAA;IAEJ,CAAA;GAEL,KAAc,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAmC;IAAiB,CAAA;GACzF,MAAqB,MAAM,kBAAC,GAAD;IAAa,OAAM;IAAQ,UAAU;IAAoB,CAAA;GACjF"}
1	+ {"version":3,"file":"CheckboxButtonBar-5UMIFMKH.js","names":[],"sources":["../src/components/CheckboxButtonBar/CheckboxButtonBar.module.css","../src/components/CheckboxButtonBar/CheckboxButtonBar.tsx"],"sourcesContent":[".checkbox-button-bar__container {\n display: flex;\n flex-wrap: wrap;\n}\n\n.checkbox-button-bar__container--label-left {\n align-items: baseline;\n flex-direction: row;\n gap: 1rem;\n}\n\n.checkbox-button-bar__container--label-top {\n align-items: flex-start;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.checkbox-button-bar__row-container {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\n.checkbox-button-bar__row-container--segmented {\n flex-direction: row;\n}\n\n.checkbox-button-bar__row {\n align-items: center;\n background-color: var(--color-uva-white);\n border: 1px solid var(--color-grey-700);\n border-radius: 0.5rem;\n display: flex;\n flex-wrap: nowrap;\n gap: 0.25rem;\n padding: 0.25rem;\n}\n\n.checkbox-button-bar__row--not-valid {\n border-color: var(--color-red-600);\n}\n\n.checkbox-button-bar__sub-text {\n color: var(--color-grey-700);\n font-size: var(--font-size-text-non-essential);\n}\n","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 /* optional sub-label text (only displayed when label is positioned 'top') /\n subLabel?: 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 not valid; otherwise, `false`. /\n notValid?: 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 subLabel = '',\n labelPosition = 'top',\n required = false,\n notValid = 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 \|\| subLabel) && (\n <div>\n {label && (\n <Label htmlFor=\"\" required={required}>\n {label}\n </Label>\n )}\n\n {subLabel && labelPosition === 'top' && (\n <div className={styles['checkbox-button-bar__sub-text']}>{subLabel}</div>\n )}\n </div>\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-valid']]: notValid \|\| 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-valid']]: notValid \|\| 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__sub-text']}>{footerText}</div>}\n {notValidatedText !== '' && <FeedbackBox level=\"error\" feedback={notValidatedText} />}\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;;;;;;;GCiDa,KAAqB,EAChC,eACA,kBACA,UACA,cAAW,IACX,mBAAgB,OAChB,cAAW,IACX,cAAW,IACX,sBAAmB,IACnB,yBAAsB,IACtB,gBAAa,IACb,kBAAe,IACf,eAAY,IACZ,kBAAe,IACf,qBAC4B;CAC5B,IAAM,CAAC,GAAe,KAAoB,EACxC,KAAiB,CAAC,IACd,EAAc,IAAI,OAAO,GACzB,KAAiB,IACf,EAAc,MAAM,GAAG,EAAE,GACzB,EAAE,CACT,EAEK,KAAgB,MAAkB;EACtC,IAAI,IAAS;AAEb,EAAI,KACF,EAAiB,CAAC,EAAM,CAAC,EACzB,EAAY,CAAC,EAAM,CAAC,KAEpB,AAGE,IAHE,EAAO,SAAS,EAAM,GACf,EAAO,QAAQ,MAAQ,MAAQ,EAAM,GAErC,CAAC,GAAG,GAAQ,EAAM,EAE7B,EAAiB,EAAO,EACxB,EAAY,EAAO;;AAIvB,QACE,kBAAC,OAAD;EACE,WAAW,EACT,EAAO,mCACP,EAAO,yCAAyC,KACjD;YAJH;IAMI,KAAS,MACT,kBAAC,OAAD,EAAA,UAAA,CACG,KACC,kBAAC,GAAD;IAAO,SAAQ;IAAa;cACzB;IACK,CAAA,EAGT,KAAY,MAAkB,SAC7B,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAmC;IAAe,CAAA,CAEvE,EAAA,CAAA;GAGR,kBAAC,OAAD;IACE,WAAW,EAAK,EAAO,uCAAuC,GAC3D,EAAO,mDAAmD,GAC5D,CAAC;cAED,IACC,EAAW,KAAK,EAAE,UAAO,UAAO,WAAQ,YAAS,oBAAiB,kBAChE,kBAAC,OAAD;KAEE,WAAW,EAAK,EAAO,6BAA6B,GACjD,EAAO,yCAAyC,KAAY,GAC9D,CAAC;eAEF,kBAAC,GAAD;MACE,MAAM,IAAsB,UAAU;MAC/B;MACC;MACC;MACQ;MACH;MACP;MACP,SAAS,EAAc,SAAS,EAAM;MACtC,UAAU,KAAY;MACtB,aAAa,MAAU,EAAa,EAAM,OAAO,MAAM;MACvD,CAAA;KACE,EAjBC,EAiBD,CACN,GAEF,kBAAC,OAAD;KACE,WAAW,EAAK,EAAO,6BAA6B,GACjD,EAAO,yCAAyC,KAAY,GAC9D,CAAC;eAED,EAAW,KAAK,EAAE,UAAO,UAAO,WAAQ,YAAS,oBAAiB,kBACjE,kBAAC,GAAD;MAEE,MAAM,IAAsB,UAAU;MAC/B;MACC;MACC;MACQ;MACH;MACP;MACP,SAAS,EAAc,SAAS,EAAM;MACtC,UAAU,KAAY;MACtB,aAAa,MAAU,EAAa,EAAM,OAAO,MAAM;MACvD,EAXK,EAWL,CACF;KACE,CAAA;IAEJ,CAAA;GAEL,KAAc,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAmC;IAAiB,CAAA;GACzF,MAAqB,MAAM,kBAAC,GAAD;IAAa,OAAM;IAAQ,UAAU;IAAoB,CAAA;GACjF"}

package/dist/{ControlsButton-zemVxTlg.js → ControlsButton-B1XRpMUM.js} RENAMED Viewed

@@ -2,8 +2,7 @@ import { t as e } from "./clsx-BD2qMUU1.js";
 import { Icon as t } from "./components/Icon/Icon.js";
 import { useId as n } from "react";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
-import './assets/ControlsButton.css';//#region src/components/ControlsButton/ControlsButton.module.css
-var o = "_periods__item_t81b2_160", s = {
+import './assets/ControlsButton.css';var o = {
 	"controls-input": "_controls-input_t81b2_1",
 	"controls-button": "_controls-button_t81b2_40",
 	"controls-button--squared": "_controls-button--squared_t81b2_58",
@@ -16,26 +15,26 @@ var o = "_periods__item_t81b2_160", s = {
 	"controls-button__tooltip--center": "_controls-button__tooltip--center_t81b2_110",
 	"controls-button__tooltip--right": "_controls-button__tooltip--right_t81b2_115",
 	"controls-button--checked": "_controls-button--checked_t81b2_160",
-	periods__item: o
-}, c = ({ type: o = "checkbox", label: c, value: l, iconName: u, prefix: d, tooltip: f, tooltipPosition: p = "center", name: m, forceSquared: h = !1, checked: g, disabled: _, onSetValue: v }) => {
+	periods__item: "_periods__item_t81b2_160"
+}, s = ({ type: s = "checkbox", label: c, value: l, iconName: u, prefix: d, tooltip: f, tooltipPosition: p = "center", name: m, forceSquared: h = !1, checked: g, disabled: _, onSetValue: v }) => {
 	let y = n(), b = (typeof c == "string" ? c : l).replace(/\s+/g, "_"), x = `${y}${b}`, S = `${x}-tooltip`;
 	return /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("input", {
-		type: o,
+		type: s,
 		id: x,
 		name: m ?? b,
 		disabled: _,
 		value: l,
 		checked: g,
 		onChange: v,
-		className: s["controls-input"],
+		className: o["controls-input"],
 		"aria-describedby": f ? S : void 0
 	}), /* @__PURE__ */ a("label", {
 		htmlFor: x,
-		className: e(s["controls-button"], [
-			h && s["controls-button--squared"],
-			d && s["controls-button--with-prefix"],
-			u && s["controls-button--with-icon"],
-			g && s["controls-button--checked"]
+		className: e(o["controls-button"], [
+			h && o["controls-button--squared"],
+			d && o["controls-button--with-prefix"],
+			u && o["controls-button--with-icon"],
+			g && o["controls-button--checked"]
 		]),
 		children: [
 			u && /* @__PURE__ */ i(t, {
@@ -43,22 +42,22 @@ var o = "_periods__item_t81b2_160", s = {
 				size: 20
 			}),
 			/* @__PURE__ */ a("div", {
-				className: s["controls-button__wrapper"],
+				className: o["controls-button__wrapper"],
 				children: [d && /* @__PURE__ */ i("div", {
-					className: s["controls-button__prefix"],
+					className: o["controls-button__prefix"],
 					children: d
 				}), c]
 			}),
 			f && /* @__PURE__ */ i("div", {
 				id: S,
 				role: "tooltip",
-				className: e(s["controls-button__tooltip"], s[`controls-button__tooltip--${p}`]),
+				className: e(o["controls-button__tooltip"], o[`controls-button__tooltip--${p}`]),
 				children: f
 			})
 		]
 	})] });
 };
 //#endregion
-export { c as t };
+export { s as t };
-//# sourceMappingURL=ControlsButton-zemVxTlg.js.map
+//# sourceMappingURL=ControlsButton-B1XRpMUM.js.map

package/dist/{ControlsButton-zemVxTlg.js.map → ControlsButton-B1XRpMUM.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ControlsButton-~~zemVxTlg~~.js","names":[],"sources":["../src/components/ControlsButton/ControlsButton.module.css","../src/components/ControlsButton/ControlsButton.tsx"],"sourcesContent":[".controls-input {\n aspect-ratio: unset;\n cursor: pointer;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n}\n\n.controls-input:focus-visible + label {\n outline: 0.125rem dotted var(--color-navy-600);\n outline-offset: 0.125rem;\n}\n\n.controls-input:checked + label,\n[type=\"radio\"]:checked:hover + label {\n background-color: var(--color-navy-600);\n color: var(--color-uva-white);\n font-weight: var(--semibold);\n}\n\n.controls-input:disabled + label,\n.controls-input:disabled:hover + label {\n background-color: var(--color-grey-400);\n color: var(--color-grey-700);\n cursor: not-allowed;\n}\n\n.controls-input:disabled:checked + label {\n background-color: var(--color-grey-500);\n color: var(--color-grey-900);\n font-weight: var(--semibold);\n}\n\n.controls-input:hover + label {\n background-color: var(--color-grey-300);\n color: var(--color-uva-black);\n}\n\n.controls-button {\n align-items: center;\n background-color: var(--color-uva-white);\n border: 1px solid transparent;\n border-radius: 0.25rem;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-flex;\n font-size: var(--font-size-default);\n height: 2.25rem;\n justify-content: center;\n min-width: 2.25rem;\n padding: 0.5rem;\n position: relative;\n user-select: none;\n white-space: nowrap;\n}\n\n.controls-button--squared {\n width: 2.25rem;\n}\n\n.controls-button::after {\n content: \"\";\n min-height: 2.625rem;\n min-width: 2.625rem;\n position: absolute;\n width: 100%;\n}\n\n.controls-button--with-prefix {\n height: auto;\n padding: 0.125rem 0.5rem;\n width: auto;\n}\n\n.controls-button--with-icon {\n gap: 0.5rem;\n}\n\n.controls-button__wrapper {\n align-items: center;\n display: flex;\n flex-direction: column;\n}\n\n.controls-button__prefix {\n color: var(--color-uva-700);\n font-size: var(--font-size-text-non-essential);\n}\n\n.controls-button__tooltip {\n background-color: var(--color-uva-white);\n box-shadow: 0 0 0.25rem 0 rgba(0 0 0 / 25%);\n color: var(--color-grey-700);\n display: none;\n font-size: var(--font-size-text-non-essential);\n font-style: italic;\n font-weight: normal;\n padding: 0.5rem 1rem;\n position: absolute;\n text-align: center;\n top: calc(100% + 0.5rem);\n z-index: 1;\n}\n\n.controls-button__tooltip--left {\n left: 0rem;\n}\n\n.controls-button__tooltip--center {\n left: 50%;\n transform: translateX(-50%);\n}\n\n.controls-button__tooltip--right {\n right: 0rem;\n}\n\n.controls-button__tooltip::before {\n border-color: transparent transparent var(--color-grey-400) transparent;\n border-style: solid;\n border-width: 0.5rem;\n bottom: calc(100% + 0.125rem);\n content: \"\";\n filter: blur(0.125rem);\n position: absolute;\n z-index: -1;\n}\n\n.controls-button__tooltip::after {\n border-color: transparent transparent var(--color-uva-white) transparent;\n border-style: solid;\n border-width: 0.5rem;\n bottom: 100%;\n content: \"\";\n position: absolute;\n}\n\n.controls-button:hover .controls-button__tooltip,\n.controls-input:focus-visible + label .controls-button__tooltip {\n display: block;\n}\n\n.controls-button__tooltip--left::before,\n.controls-button__tooltip--left::after {\n left: 0.5rem;\n}\n\n.controls-button__tooltip--center::before,\n.controls-button__tooltip--center::after {\n left: 50%;\n transform: translateX(-50%);\n}\n\n.controls-button__tooltip--right::before,\n.controls-button__tooltip--right::after {\n right: 0.5rem;\n}\n\n.controls-button--checked span.periods__item,\n.controls-button--checked [data-period-item] {\n border: 1px solid var(--color-uva-white) !important;\n}\n","import { useId } from 'react';\r\nimport { clsx } from 'clsx';\r\n\r\nimport type { ChangeEvent, ReactNode } from 'react';\r\nimport type { IconProps } from 'components/Icon';\r\n\r\nimport styles from './ControlsButton.module.css';\r\n\r\nimport { Icon } from 'components/Icon';\r\n\r\nexport interface ControlsButtonProps {\r\n /** to set type/behaviour of input radio or checkbox /\r\n type?: 'radio' \| 'checkbox';\r\n /* button label /\r\n label: string \| ReactNode;\r\n /* button value /\r\n value: string;\r\n /* set if icon is needed in font of label /\r\n iconName?: IconProps['name'];\r\n /* set if prefix is needed above of label /\r\n prefix?: string;\r\n /* set tooltip /\r\n tooltip?: ReactNode;\r\n /* set horizontal position of the tooltip /\r\n tooltipPosition?: 'left' \| 'center' \| 'right';\r\n /* set if used as radiogroup /\r\n name?: string;\r\n /* `true` to set squared button; otherwise, `false`. The default is `false`. Note: hides icon /\r\n forceSquared?: boolean;\r\n /* to set default status /\r\n checked?: boolean;\r\n /* `true` to disable the button; otherwise, `false`. The default is `false`. /\r\n disabled?: boolean;\r\n /* The callback function that is invoked when the radio button changes value. */\r\n onSetValue: (event: ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport const ControlsButton = ({\r\n type = 'checkbox',\r\n label,\r\n value,\r\n iconName,\r\n prefix,\r\n tooltip,\r\n tooltipPosition = 'center',\r\n name,\r\n forceSquared = false,\r\n checked,\r\n disabled,\r\n onSetValue,\r\n}: ControlsButtonProps) => {\r\n const idPrefix = useId();\r\n const labelString = typeof label === 'string' ? label : value;\r\n const sanitizedLabel = labelString.replace(/\\s+/g, '_');\r\n const baseId = `${idPrefix}${sanitizedLabel}`;\r\n const tooltipId = `${baseId}-tooltip`;\r\n\r\n return (\r\n <>\r\n <input\r\n type={type}\r\n id={baseId}\r\n name={name ?? sanitizedLabel}\r\n disabled={disabled}\r\n value={value}\r\n checked={checked}\r\n onChange={onSetValue}\r\n className={styles['controls-input']}\r\n aria-describedby={tooltip ? tooltipId : undefined}\r\n />\r\n <label\r\n htmlFor={baseId}\r\n className={clsx(styles['controls-button'], [\r\n forceSquared && styles['controls-button--squared'],\r\n prefix && styles['controls-button--with-prefix'],\r\n iconName && styles['controls-button--with-icon'],\r\n checked && styles['controls-button--checked'],\r\n ])}\r\n >\r\n {iconName && <Icon name={iconName} size={20} />}\r\n <div className={styles['controls-button__wrapper']}>\r\n {prefix && <div className={styles['controls-button__prefix']}>{prefix}</div>}\r\n {label}\r\n </div>\r\n {tooltip && (\r\n <div\r\n id={tooltipId}\r\n role=\"tooltip\"\r\n className={clsx(styles['controls-button__tooltip'], styles[`controls-button__tooltip--${tooltipPosition}`])}\r\n >\r\n {tooltip}\r\n </div>\r\n )}\r\n </label>\r\n </>\r\n );\r\n};\r\n"],"mappings":"~~;;;;;;;;;;;;;;;;;;;~~GCqCa,KAAkB,EAC7B,UAAO,YACP,UACA,UACA,aACA,WACA,YACA,qBAAkB,UAClB,SACA,kBAAe,IACf,YACA,aACA,oBACyB;CACzB,IAAM,IAAW,GAAO,EAElB,KADc,OAAO,KAAU,WAAW,IAAQ,GACrB,QAAQ,QAAQ,IAAI,EACjD,IAAS,GAAG,IAAW,KACvB,IAAY,GAAG,EAAO;AAE5B,QACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,SAAD;EACQ;EACN,IAAI;EACJ,MAAM,KAAQ;EACJ;EACH;EACE;EACT,UAAU;EACV,WAAW,EAAO;EAClB,oBAAkB,IAAU,IAAY,KAAA;EACxC,CAAA,EACF,kBAAC,SAAD;EACE,SAAS;EACT,WAAW,EAAK,EAAO,oBAAoB;GACzC,KAAgB,EAAO;GACvB,KAAU,EAAO;GACjB,KAAY,EAAO;GACnB,KAAW,EAAO;GACnB,CAAC;YAPJ;GASG,KAAY,kBAAC,GAAD;IAAM,MAAM;IAAU,MAAM;IAAM,CAAA;GAC/C,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB,CACG,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAA6B;KAAa,CAAA,EAC3E,EACG;;GACL,KACC,kBAAC,OAAD;IACE,IAAI;IACJ,MAAK;IACL,WAAW,EAAK,EAAO,6BAA6B,EAAO,6BAA6B,KAAmB;cAE1G;IACG,CAAA;GAEF;IACP,EAAA,CAAA"}
1	+ {"version":3,"file":"ControlsButton-B1XRpMUM.js","names":[],"sources":["../src/components/ControlsButton/ControlsButton.module.css","../src/components/ControlsButton/ControlsButton.tsx"],"sourcesContent":[".controls-input {\n aspect-ratio: unset;\n cursor: pointer;\n height: 0;\n opacity: 0;\n position: absolute;\n width: 0;\n}\n\n.controls-input:focus-visible + label {\n outline: 0.125rem dotted var(--color-navy-600);\n outline-offset: 0.125rem;\n}\n\n.controls-input:checked + label,\n[type=\"radio\"]:checked:hover + label {\n background-color: var(--color-navy-600);\n color: var(--color-uva-white);\n font-weight: var(--semibold);\n}\n\n.controls-input:disabled + label,\n.controls-input:disabled:hover + label {\n background-color: var(--color-grey-400);\n color: var(--color-grey-700);\n cursor: not-allowed;\n}\n\n.controls-input:disabled:checked + label {\n background-color: var(--color-grey-500);\n color: var(--color-grey-900);\n font-weight: var(--semibold);\n}\n\n.controls-input:hover + label {\n background-color: var(--color-grey-300);\n color: var(--color-uva-black);\n}\n\n.controls-button {\n align-items: center;\n background-color: var(--color-uva-white);\n border: 1px solid transparent;\n border-radius: 0.25rem;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-flex;\n font-size: var(--font-size-default);\n height: 2.25rem;\n justify-content: center;\n min-width: 2.25rem;\n padding: 0.5rem;\n position: relative;\n user-select: none;\n white-space: nowrap;\n}\n\n.controls-button--squared {\n width: 2.25rem;\n}\n\n.controls-button::after {\n content: \"\";\n min-height: 2.625rem;\n min-width: 2.625rem;\n position: absolute;\n width: 100%;\n}\n\n.controls-button--with-prefix {\n height: auto;\n padding: 0.125rem 0.5rem;\n width: auto;\n}\n\n.controls-button--with-icon {\n gap: 0.5rem;\n}\n\n.controls-button__wrapper {\n align-items: center;\n display: flex;\n flex-direction: column;\n}\n\n.controls-button__prefix {\n color: var(--color-uva-700);\n font-size: var(--font-size-text-non-essential);\n}\n\n.controls-button__tooltip {\n background-color: var(--color-uva-white);\n box-shadow: 0 0 0.25rem 0 rgba(0 0 0 / 25%);\n color: var(--color-grey-700);\n display: none;\n font-size: var(--font-size-text-non-essential);\n font-style: italic;\n font-weight: normal;\n padding: 0.5rem 1rem;\n position: absolute;\n text-align: center;\n top: calc(100% + 0.5rem);\n z-index: 1;\n}\n\n.controls-button__tooltip--left {\n left: 0rem;\n}\n\n.controls-button__tooltip--center {\n left: 50%;\n transform: translateX(-50%);\n}\n\n.controls-button__tooltip--right {\n right: 0rem;\n}\n\n.controls-button__tooltip::before {\n border-color: transparent transparent var(--color-grey-400) transparent;\n border-style: solid;\n border-width: 0.5rem;\n bottom: calc(100% + 0.125rem);\n content: \"\";\n filter: blur(0.125rem);\n position: absolute;\n z-index: -1;\n}\n\n.controls-button__tooltip::after {\n border-color: transparent transparent var(--color-uva-white) transparent;\n border-style: solid;\n border-width: 0.5rem;\n bottom: 100%;\n content: \"\";\n position: absolute;\n}\n\n.controls-button:hover .controls-button__tooltip,\n.controls-input:focus-visible + label .controls-button__tooltip {\n display: block;\n}\n\n.controls-button__tooltip--left::before,\n.controls-button__tooltip--left::after {\n left: 0.5rem;\n}\n\n.controls-button__tooltip--center::before,\n.controls-button__tooltip--center::after {\n left: 50%;\n transform: translateX(-50%);\n}\n\n.controls-button__tooltip--right::before,\n.controls-button__tooltip--right::after {\n right: 0.5rem;\n}\n\n.controls-button--checked span.periods__item,\n.controls-button--checked [data-period-item] {\n border: 1px solid var(--color-uva-white) !important;\n}\n","import { useId } from 'react';\r\nimport { clsx } from 'clsx';\r\n\r\nimport type { ChangeEvent, ReactNode } from 'react';\r\nimport type { IconProps } from 'components/Icon';\r\n\r\nimport styles from './ControlsButton.module.css';\r\n\r\nimport { Icon } from 'components/Icon';\r\n\r\nexport interface ControlsButtonProps {\r\n /** to set type/behaviour of input radio or checkbox /\r\n type?: 'radio' \| 'checkbox';\r\n /* button label /\r\n label: string \| ReactNode;\r\n /* button value /\r\n value: string;\r\n /* set if icon is needed in font of label /\r\n iconName?: IconProps['name'];\r\n /* set if prefix is needed above of label /\r\n prefix?: string;\r\n /* set tooltip /\r\n tooltip?: ReactNode;\r\n /* set horizontal position of the tooltip /\r\n tooltipPosition?: 'left' \| 'center' \| 'right';\r\n /* set if used as radiogroup /\r\n name?: string;\r\n /* `true` to set squared button; otherwise, `false`. The default is `false`. Note: hides icon /\r\n forceSquared?: boolean;\r\n /* to set default status /\r\n checked?: boolean;\r\n /* `true` to disable the button; otherwise, `false`. The default is `false`. /\r\n disabled?: boolean;\r\n /* The callback function that is invoked when the radio button changes value. */\r\n onSetValue: (event: ChangeEvent<HTMLInputElement>) => void;\r\n}\r\n\r\nexport const ControlsButton = ({\r\n type = 'checkbox',\r\n label,\r\n value,\r\n iconName,\r\n prefix,\r\n tooltip,\r\n tooltipPosition = 'center',\r\n name,\r\n forceSquared = false,\r\n checked,\r\n disabled,\r\n onSetValue,\r\n}: ControlsButtonProps) => {\r\n const idPrefix = useId();\r\n const labelString = typeof label === 'string' ? label : value;\r\n const sanitizedLabel = labelString.replace(/\\s+/g, '_');\r\n const baseId = `${idPrefix}${sanitizedLabel}`;\r\n const tooltipId = `${baseId}-tooltip`;\r\n\r\n return (\r\n <>\r\n <input\r\n type={type}\r\n id={baseId}\r\n name={name ?? sanitizedLabel}\r\n disabled={disabled}\r\n value={value}\r\n checked={checked}\r\n onChange={onSetValue}\r\n className={styles['controls-input']}\r\n aria-describedby={tooltip ? tooltipId : undefined}\r\n />\r\n <label\r\n htmlFor={baseId}\r\n className={clsx(styles['controls-button'], [\r\n forceSquared && styles['controls-button--squared'],\r\n prefix && styles['controls-button--with-prefix'],\r\n iconName && styles['controls-button--with-icon'],\r\n checked && styles['controls-button--checked'],\r\n ])}\r\n >\r\n {iconName && <Icon name={iconName} size={20} />}\r\n <div className={styles['controls-button__wrapper']}>\r\n {prefix && <div className={styles['controls-button__prefix']}>{prefix}</div>}\r\n {label}\r\n </div>\r\n {tooltip && (\r\n <div\r\n id={tooltipId}\r\n role=\"tooltip\"\r\n className={clsx(styles['controls-button__tooltip'], styles[`controls-button__tooltip--${tooltipPosition}`])}\r\n >\r\n {tooltip}\r\n </div>\r\n )}\r\n </label>\r\n </>\r\n );\r\n};\r\n"],"mappings":";;;;;;;;;;;;;;;;;;GCqCa,KAAkB,EAC7B,UAAO,YACP,UACA,UACA,aACA,WACA,YACA,qBAAkB,UAClB,SACA,kBAAe,IACf,YACA,aACA,oBACyB;CACzB,IAAM,IAAW,GAAO,EAElB,KADc,OAAO,KAAU,WAAW,IAAQ,GACrB,QAAQ,QAAQ,IAAI,EACjD,IAAS,GAAG,IAAW,KACvB,IAAY,GAAG,EAAO;AAE5B,QACE,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,SAAD;EACQ;EACN,IAAI;EACJ,MAAM,KAAQ;EACJ;EACH;EACE;EACT,UAAU;EACV,WAAW,EAAO;EAClB,oBAAkB,IAAU,IAAY,KAAA;EACxC,CAAA,EACF,kBAAC,SAAD;EACE,SAAS;EACT,WAAW,EAAK,EAAO,oBAAoB;GACzC,KAAgB,EAAO;GACvB,KAAU,EAAO;GACjB,KAAY,EAAO;GACnB,KAAW,EAAO;GACnB,CAAC;YAPJ;GASG,KAAY,kBAAC,GAAD;IAAM,MAAM;IAAU,MAAM;IAAM,CAAA;GAC/C,kBAAC,OAAD;IAAK,WAAW,EAAO;cAAvB,CACG,KAAU,kBAAC,OAAD;KAAK,WAAW,EAAO;eAA6B;KAAa,CAAA,EAC3E,EACG;;GACL,KACC,kBAAC,OAAD;IACE,IAAI;IACJ,MAAK;IACL,WAAW,EAAK,EAAO,6BAA6B,EAAO,6BAA6B,KAAmB;cAE1G;IACG,CAAA;GAEF;IACP,EAAA,CAAA"}

package/dist/{Drawer-Ggofac6y.js → Drawer-e7UFHVg9.js} RENAMED Viewed

@@ -6,32 +6,31 @@ import { jsx as o, jsxs as s } from "react/jsx-runtime";
 import { useDialog as c } from "@react-aria/dialog";
 import { FocusScope as l } from "@react-aria/focus";
 import { OverlayContainer as u, useModal as d, useOverlay as f, usePreventScroll as p } from "@react-aria/overlays";
-import './assets/Drawer.css';//#region src/components/Drawer/Drawer.module.css
-var m = "_drawer_1g9hi_1", h = "_drawer__content_1g9hi_22", g = "_drawer__header_1g9hi_32", _ = "_drawer__footer_1g9hi_39", v = "_drawer__heading_1g9hi_26", y = "_drawer__buttons_1g9hi_64", b = {
-	drawer: m,
-	drawer__content: h,
-	drawer__header: g,
-	drawer__footer: _,
-	drawer__heading: v,
+import './assets/Drawer.css';var m = {
+	drawer: "_drawer_1g9hi_1",
+	drawer__content: "_drawer__content_1g9hi_22",
+	drawer__header: "_drawer__header_1g9hi_32",
+	drawer__footer: "_drawer__footer_1g9hi_39",
+	drawer__heading: "_drawer__heading_1g9hi_26",
 	"drawer--open": "_drawer--open_1g9hi_59",
-	drawer__buttons: y
-}, x = 200;
-function S({ buttons: m, children: h, isOpen: g, onClose: _, title: v, closeButtonAriaValueText: y = "Close", ...S }) {
-	let [C, w] = a(b.drawer), { modalProps: T } = d({ isDisabled: !g }), E = i(null);
+	drawer__buttons: "_drawer__buttons_1g9hi_64"
+}, h = 200;
+function g({ buttons: g, children: _, isOpen: v, onClose: y, title: b, closeButtonAriaValueText: x = "Close", ...S }) {
+	let [C, w] = a(m.drawer), { modalProps: T } = d({ isDisabled: !v }), E = i(null);
 	function D() {
-		w(b.drawer), globalThis.setTimeout(() => {
-			_();
-		}, x);
+		w(m.drawer), globalThis.setTimeout(() => {
+			y();
+		}, h);
 	}
 	let { overlayProps: O, underlayProps: k } = f({
 		isDismissable: !0,
 		isKeyboardDismissDisabled: !1,
-		isOpen: g,
+		isOpen: v,
 		onClose: D
 	}, E), { dialogProps: A, titleProps: j } = c({}, E);
-	return p({ isDisabled: !g }), r(() => {
-		w(e(b.drawer, { [b["drawer--open"]]: g }));
-	}, [g]), /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(t, {
+	return p({ isDisabled: !v }), r(() => {
+		w(e(m.drawer, { [m["drawer--open"]]: v }));
+	}, [v]), /* @__PURE__ */ o(u, { children: /* @__PURE__ */ o(t, {
 		...k,
 		children: /* @__PURE__ */ o(l, {
 			contain: !0,
@@ -45,25 +44,25 @@ function S({ buttons: m, children: h, isOpen: g, onClose: _, title: v, closeButt
 				ref: E,
 				children: [
 					/* @__PURE__ */ s("header", {
-						className: b.drawer__header,
+						className: m.drawer__header,
 						children: [/* @__PURE__ */ o("h1", {
-							className: b.drawer__heading,
+							className: m.drawer__heading,
 							...j,
-							children: v
+							children: b
 						}), /* @__PURE__ */ o(n, {
-							"aria-label": y,
+							"aria-label": x,
 							onClick: D
 						})]
 					}),
 					/* @__PURE__ */ o("div", {
-						className: b.drawer__content,
-						children: h
+						className: m.drawer__content,
+						children: _
 					}),
-					m && /* @__PURE__ */ o("footer", {
-						className: b.drawer__footer,
+					g && /* @__PURE__ */ o("footer", {
+						className: m.drawer__footer,
 						children: /* @__PURE__ */ o("div", {
-							className: b.drawer__buttons,
-							children: m
+							className: m.drawer__buttons,
+							children: g
 						})
 					})
 				]
@@ -72,6 +71,6 @@ function S({ buttons: m, children: h, isOpen: g, onClose: _, title: v, closeButt
 	}) });
 }
 //#endregion
-export { S as t };
+export { g as t };
-//# sourceMappingURL=Drawer-Ggofac6y.js.map
+//# sourceMappingURL=Drawer-e7UFHVg9.js.map

package/dist/{Drawer-Ggofac6y.js.map → Drawer-e7UFHVg9.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Drawer-~~Ggofac6y~~.js","names":[],"sources":["../src/components/Drawer/Drawer.module.css","../src/components/Drawer/Drawer.tsx"],"sourcesContent":[".drawer {\n background-color: var(--color-uva-white);\n bottom: 0;\n box-shadow: 0 0 0.75rem 0.25rem rgb(0 0 0 / 10%);\n display: flex;\n flex-direction: column;\n left: 10vw;\n max-width: 90vw;\n min-width: 25rem;\n padding: 2.5rem 2rem;\n position: fixed;\n right: 0;\n top: 0;\n transform: translateX(100%);\n transform-origin: right;\n transition-duration: 200ms;\n transition-property: transform;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n width: 100%;\n}\n\n.drawer__content {\n /*\n Drawer content height cannot exceed the available height, dictated by its parent.\n * Subtracting top and bottom padding from .drawer as well as the height and bottom margin of\n * .drawer__heading from the parent's height gives us the maximum height the content should be.\n /\n max-height: calc(100vh - 7rem);\n overflow-y: auto;\n}\n\n.drawer__header {\n display: flex;\n gap: 2rem;\n justify-content: space-between;\n position: relative;\n}\n\n.drawer__footer {\n gap: 2rem;\n justify-content: flex-end;\n margin-top: auto;\n}\n\n.drawer__heading {\n font-size: var(--font-size-s);\n line-height: var(--line-height-s);\n margin: 0.25rem 0 0.5rem;\n padding-right: 2rem;\n}\n\n@media only screen and (min-width: 40rem) {\n .drawer {\n left: auto;\n max-width: 37.5rem;\n }\n}\n\n.drawer--open {\n transform: translateX(0);\n transition-duration: 250ms;\n}\n\n.drawer__buttons {\n display: flex;\n flex-flow: row wrap;\n gap: 0.75rem;\n justify-content: flex-end;\n margin: 2.5rem 0 0;\n}\n","import { useDialog } from '@react-aria/dialog';\nimport { FocusScope } from '@react-aria/focus';\nimport { OverlayContainer, useModal, useOverlay, usePreventScroll } from '@react-aria/overlays';\nimport { clsx } from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { HTMLAttributes, PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './Drawer.module.css';\n\nimport { Backdrop } from 'components/Backdrop/Backdrop';\nimport { OverlayCloseButton } from 'components/OverlayCloseButton';\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'style' \| 'className'> {\n /* The buttons to render in the drawer. /\n buttons?: ReactNode;\n /* true if the drawer should be open; otherwise, false. The default is false. /\n isOpen?: boolean;\n /* The callback method that is invoked when the drawer is closed. /\n onClose: () => void;\n /* The title of the drawer. /\n title: string;\n /* The aria-label of the close button. /\n closeButtonAriaValueText?: string;\n}\n\nconst closingDelay = 200;\n\n/* Represents a Drawer component. */\nexport function Drawer({\n buttons,\n children,\n isOpen,\n onClose,\n title,\n closeButtonAriaValueText = 'Close',\n ...restProps\n}: PropsWithChildren<DrawerProps>) {\n const [containerClassNames, setContainerClassNames] = useState(styles.drawer);\n // Hide content outside the modal from screen readers.\n const { modalProps } = useModal({ isDisabled: !isOpen });\n const contentRef = useRef<HTMLDivElement>(null);\n\n function onCloseDrawer() {\n setContainerClassNames(styles.drawer);\n\n globalThis.setTimeout(() => {\n onClose();\n }, closingDelay);\n }\n\n // Handle interacting outside the dialog and pressing\n // the Escape key to close the modal.\n const { overlayProps, underlayProps } = useOverlay(\n { isDismissable: true, isKeyboardDismissDisabled: false, isOpen, onClose: onCloseDrawer },\n contentRef\n );\n\n // Get props for the dialog and its title\n const { dialogProps, titleProps } = useDialog({}, contentRef);\n\n usePreventScroll({ isDisabled: !isOpen });\n\n useEffect(() => {\n // setting class name after render so that element can slide in after it is mounted and slide out\n // before it is unmounted\n setContainerClassNames(clsx(styles.drawer, { [styles['drawer--open']]: isOpen }));\n }, [isOpen]);\n\n return (\n <OverlayContainer>\n <Backdrop {...underlayProps}>\n <FocusScope contain restoreFocus>\n <aside\n {...modalProps}\n {...overlayProps}\n {...dialogProps}\n {...restProps}\n className={containerClassNames}\n ref={contentRef}\n >\n <header className={styles.drawer__header}>\n <h1 className={styles.drawer__heading} {...titleProps}>\n {title}\n </h1>\n\n <OverlayCloseButton aria-label={closeButtonAriaValueText} onClick={onCloseDrawer} />\n </header>\n\n <div className={styles.drawer__content}>{children}</div>\n\n {buttons && (\n <footer className={styles.drawer__footer}>\n <div className={styles.drawer__buttons}>{buttons}</div>\n </footer>\n )}\n </aside>\n </FocusScope>\n </Backdrop>\n </OverlayContainer>\n );\n}\n"],"mappings":"~~;;;;;;;;;;;;;;;;;~~GC0BM,IAAe;AAGrB,SAAgB,EAAO,EACrB,YACA,aACA,WACA,YACA,UACA,8BAA2B,SAC3B,GAAG,KAC8B;CACjC,IAAM,CAAC,GAAqB,KAA0B,EAAS,EAAO,OAAO,EAEvE,EAAE,kBAAe,EAAS,EAAE,YAAY,CAAC,GAAQ,CAAC,EAClD,IAAa,EAAuB,KAAK;CAE/C,SAAS,IAAgB;AAGvB,EAFA,EAAuB,EAAO,OAAO,EAErC,WAAW,iBAAiB;AAC1B,MAAS;KACR,EAAa;;CAKlB,IAAM,EAAE,iBAAc,qBAAkB,EACtC;EAAE,eAAe;EAAM,2BAA2B;EAAO;EAAQ,SAAS;EAAe,EACzF,EACD,EAGK,EAAE,gBAAa,kBAAe,EAAU,EAAE,EAAE,EAAW;AAU7D,QARA,EAAiB,EAAE,YAAY,CAAC,GAAQ,CAAC,EAEzC,QAAgB;AAGd,IAAuB,EAAK,EAAO,QAAQ,GAAG,EAAO,kBAAkB,GAAQ,CAAC,CAAC;IAChF,CAAC,EAAO,CAAC,EAGV,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;EAAU,GAAI;YACZ,kBAAC,GAAD;GAAY,SAAA;GAAQ,cAAA;aAClB,kBAAC,SAAD;IACE,GAAI;IACJ,GAAI;IACJ,GAAI;IACJ,GAAI;IACJ,WAAW;IACX,KAAK;cANP;KAQE,kBAAC,UAAD;MAAQ,WAAW,EAAO;gBAA1B,CACE,kBAAC,MAAD;OAAI,WAAW,EAAO;OAAiB,GAAI;iBACxC;OACE,CAAA,EAEL,kBAAC,GAAD;OAAoB,cAAY;OAA0B,SAAS;OAAiB,CAAA,CAC7E;;KAET,kBAAC,OAAD;MAAK,WAAW,EAAO;MAAkB;MAAe,CAAA;KAEvD,KACC,kBAAC,UAAD;MAAQ,WAAW,EAAO;gBACxB,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAkB;OAAc,CAAA;MAChD,CAAA;KAEL;;GACG,CAAA;EACJ,CAAA,EACM,CAAA"}
1	+ {"version":3,"file":"Drawer-e7UFHVg9.js","names":[],"sources":["../src/components/Drawer/Drawer.module.css","../src/components/Drawer/Drawer.tsx"],"sourcesContent":[".drawer {\n background-color: var(--color-uva-white);\n bottom: 0;\n box-shadow: 0 0 0.75rem 0.25rem rgb(0 0 0 / 10%);\n display: flex;\n flex-direction: column;\n left: 10vw;\n max-width: 90vw;\n min-width: 25rem;\n padding: 2.5rem 2rem;\n position: fixed;\n right: 0;\n top: 0;\n transform: translateX(100%);\n transform-origin: right;\n transition-duration: 200ms;\n transition-property: transform;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n width: 100%;\n}\n\n.drawer__content {\n /*\n Drawer content height cannot exceed the available height, dictated by its parent.\n * Subtracting top and bottom padding from .drawer as well as the height and bottom margin of\n * .drawer__heading from the parent's height gives us the maximum height the content should be.\n /\n max-height: calc(100vh - 7rem);\n overflow-y: auto;\n}\n\n.drawer__header {\n display: flex;\n gap: 2rem;\n justify-content: space-between;\n position: relative;\n}\n\n.drawer__footer {\n gap: 2rem;\n justify-content: flex-end;\n margin-top: auto;\n}\n\n.drawer__heading {\n font-size: var(--font-size-s);\n line-height: var(--line-height-s);\n margin: 0.25rem 0 0.5rem;\n padding-right: 2rem;\n}\n\n@media only screen and (min-width: 40rem) {\n .drawer {\n left: auto;\n max-width: 37.5rem;\n }\n}\n\n.drawer--open {\n transform: translateX(0);\n transition-duration: 250ms;\n}\n\n.drawer__buttons {\n display: flex;\n flex-flow: row wrap;\n gap: 0.75rem;\n justify-content: flex-end;\n margin: 2.5rem 0 0;\n}\n","import { useDialog } from '@react-aria/dialog';\nimport { FocusScope } from '@react-aria/focus';\nimport { OverlayContainer, useModal, useOverlay, usePreventScroll } from '@react-aria/overlays';\nimport { clsx } from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\n\nimport type { HTMLAttributes, PropsWithChildren, ReactNode } from 'react';\n\nimport styles from './Drawer.module.css';\n\nimport { Backdrop } from 'components/Backdrop/Backdrop';\nimport { OverlayCloseButton } from 'components/OverlayCloseButton';\n\nexport interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, 'style' \| 'className'> {\n /* The buttons to render in the drawer. /\n buttons?: ReactNode;\n /* true if the drawer should be open; otherwise, false. The default is false. /\n isOpen?: boolean;\n /* The callback method that is invoked when the drawer is closed. /\n onClose: () => void;\n /* The title of the drawer. /\n title: string;\n /* The aria-label of the close button. /\n closeButtonAriaValueText?: string;\n}\n\nconst closingDelay = 200;\n\n/* Represents a Drawer component. */\nexport function Drawer({\n buttons,\n children,\n isOpen,\n onClose,\n title,\n closeButtonAriaValueText = 'Close',\n ...restProps\n}: PropsWithChildren<DrawerProps>) {\n const [containerClassNames, setContainerClassNames] = useState(styles.drawer);\n // Hide content outside the modal from screen readers.\n const { modalProps } = useModal({ isDisabled: !isOpen });\n const contentRef = useRef<HTMLDivElement>(null);\n\n function onCloseDrawer() {\n setContainerClassNames(styles.drawer);\n\n globalThis.setTimeout(() => {\n onClose();\n }, closingDelay);\n }\n\n // Handle interacting outside the dialog and pressing\n // the Escape key to close the modal.\n const { overlayProps, underlayProps } = useOverlay(\n { isDismissable: true, isKeyboardDismissDisabled: false, isOpen, onClose: onCloseDrawer },\n contentRef\n );\n\n // Get props for the dialog and its title\n const { dialogProps, titleProps } = useDialog({}, contentRef);\n\n usePreventScroll({ isDisabled: !isOpen });\n\n useEffect(() => {\n // setting class name after render so that element can slide in after it is mounted and slide out\n // before it is unmounted\n setContainerClassNames(clsx(styles.drawer, { [styles['drawer--open']]: isOpen }));\n }, [isOpen]);\n\n return (\n <OverlayContainer>\n <Backdrop {...underlayProps}>\n <FocusScope contain restoreFocus>\n <aside\n {...modalProps}\n {...overlayProps}\n {...dialogProps}\n {...restProps}\n className={containerClassNames}\n ref={contentRef}\n >\n <header className={styles.drawer__header}>\n <h1 className={styles.drawer__heading} {...titleProps}>\n {title}\n </h1>\n\n <OverlayCloseButton aria-label={closeButtonAriaValueText} onClick={onCloseDrawer} />\n </header>\n\n <div className={styles.drawer__content}>{children}</div>\n\n {buttons && (\n <footer className={styles.drawer__footer}>\n <div className={styles.drawer__buttons}>{buttons}</div>\n </footer>\n )}\n </aside>\n </FocusScope>\n </Backdrop>\n </OverlayContainer>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;GC0BM,IAAe;AAGrB,SAAgB,EAAO,EACrB,YACA,aACA,WACA,YACA,UACA,8BAA2B,SAC3B,GAAG,KAC8B;CACjC,IAAM,CAAC,GAAqB,KAA0B,EAAS,EAAO,OAAO,EAEvE,EAAE,kBAAe,EAAS,EAAE,YAAY,CAAC,GAAQ,CAAC,EAClD,IAAa,EAAuB,KAAK;CAE/C,SAAS,IAAgB;AAGvB,EAFA,EAAuB,EAAO,OAAO,EAErC,WAAW,iBAAiB;AAC1B,MAAS;KACR,EAAa;;CAKlB,IAAM,EAAE,iBAAc,qBAAkB,EACtC;EAAE,eAAe;EAAM,2BAA2B;EAAO;EAAQ,SAAS;EAAe,EACzF,EACD,EAGK,EAAE,gBAAa,kBAAe,EAAU,EAAE,EAAE,EAAW;AAU7D,QARA,EAAiB,EAAE,YAAY,CAAC,GAAQ,CAAC,EAEzC,QAAgB;AAGd,IAAuB,EAAK,EAAO,QAAQ,GAAG,EAAO,kBAAkB,GAAQ,CAAC,CAAC;IAChF,CAAC,EAAO,CAAC,EAGV,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;EAAU,GAAI;YACZ,kBAAC,GAAD;GAAY,SAAA;GAAQ,cAAA;aAClB,kBAAC,SAAD;IACE,GAAI;IACJ,GAAI;IACJ,GAAI;IACJ,GAAI;IACJ,WAAW;IACX,KAAK;cANP;KAQE,kBAAC,UAAD;MAAQ,WAAW,EAAO;gBAA1B,CACE,kBAAC,MAAD;OAAI,WAAW,EAAO;OAAiB,GAAI;iBACxC;OACE,CAAA,EAEL,kBAAC,GAAD;OAAoB,cAAY;OAA0B,SAAS;OAAiB,CAAA,CAC7E;;KAET,kBAAC,OAAD;MAAK,WAAW,EAAO;MAAkB;MAAe,CAAA;KAEvD,KACC,kBAAC,UAAD;MAAQ,WAAW,EAAO;gBACxB,kBAAC,OAAD;OAAK,WAAW,EAAO;iBAAkB;OAAc,CAAA;MAChD,CAAA;KAEL;;GACG,CAAA;EACJ,CAAA,EACM,CAAA"}

package/dist/{FieldHint-D0HtbTnt.js → FieldHint-fxnEOsVZ.js} RENAMED Viewed

@@ -1,4 +1,4 @@
-import { t as e } from "./Spinner-D8tWqg9j.js";
+import { t as e } from "./Spinner-BpElTDIu.js";
 import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
 import './assets/FieldHint.css';//#region src/components/FieldHint/FieldHint.module.css
 var i = { "field-hint": "_field-hint_f5ej1_1" };
@@ -13,4 +13,4 @@ function a({ value: a, spinnerAriaValueText: o, loading: s }) {
 //#endregion
 export { a as t };
-//# sourceMappingURL=FieldHint-D0HtbTnt.js.map
+//# sourceMappingURL=FieldHint-fxnEOsVZ.js.map

package/dist/{FieldHint-D0HtbTnt.js.map → FieldHint-fxnEOsVZ.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FieldHint-~~D0HtbTnt~~.js","names":[],"sources":["../src/components/FieldHint/FieldHint.module.css","../src/components/FieldHint/FieldHint.tsx"],"sourcesContent":[".field-hint {\n font-size: 0.875rem;\n}\n","import styles from './FieldHint.module.css';\n\nimport { Spinner } from 'components/Spinner/Spinner';\n\nexport interface FieldHintProps {\n /** The value to display. /\n value?: string;\n /* The aria-valuetext value of the spinner component. /\n spinnerAriaValueText: string;\n /* true if the field hint is loading; otherwise, false. The default is false. /\n loading?: boolean;\n}\n\n/* Represents a component to show a hint for an input element. */\nexport function FieldHint({ value, spinnerAriaValueText, loading }: FieldHintProps) {\n return (\n <span className={styles['field-hint']}>\n {value && <>{value}</>}\n {!value && loading && <Spinner ariaValueText={spinnerAriaValueText} />}\n </span>\n );\n}\n"],"mappings":";;;;;;ACcA,SAAgB,EAAU,EAAE,UAAO,yBAAsB,cAA2B;AAClF,QACE,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACG,KAAS,kBAAA,GAAA,EAAA,UAAG,GAAS,CAAA,EACrB,CAAC,KAAS,KAAW,kBAAC,GAAD,EAAS,eAAe,GAAwB,CAAA,CACjE"}
1	+ {"version":3,"file":"FieldHint-fxnEOsVZ.js","names":[],"sources":["../src/components/FieldHint/FieldHint.module.css","../src/components/FieldHint/FieldHint.tsx"],"sourcesContent":[".field-hint {\n font-size: 0.875rem;\n}\n","import styles from './FieldHint.module.css';\n\nimport { Spinner } from 'components/Spinner/Spinner';\n\nexport interface FieldHintProps {\n /** The value to display. /\n value?: string;\n /* The aria-valuetext value of the spinner component. /\n spinnerAriaValueText: string;\n /* true if the field hint is loading; otherwise, false. The default is false. /\n loading?: boolean;\n}\n\n/* Represents a component to show a hint for an input element. */\nexport function FieldHint({ value, spinnerAriaValueText, loading }: FieldHintProps) {\n return (\n <span className={styles['field-hint']}>\n {value && <>{value}</>}\n {!value && loading && <Spinner ariaValueText={spinnerAriaValueText} />}\n </span>\n );\n}\n"],"mappings":";;;;;;ACcA,SAAgB,EAAU,EAAE,UAAO,yBAAsB,cAA2B;AAClF,QACE,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACG,KAAS,kBAAA,GAAA,EAAA,UAAG,GAAS,CAAA,EACrB,CAAC,KAAS,KAAW,kBAAC,GAAD,EAAS,eAAe,GAAwB,CAAA,CACjE"}