npm - @uva-glass/component-library - Versions diffs - 3.55.4 → 3.55.6 - Mend

@uva-glass/component-library 3.55.4 → 3.55.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.

Files changed (330) 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/ActionList-O9w1hqNg.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActionList-O9w1hqNg.js","names":[],"sources":["../src/components/ActionList/ActionList.module.css","../src/components/ActionList/ActionList.tsx"],"sourcesContent":[".action-list {\n background-color: var(--color-uva-white);\n border-radius: 0.5rem;\n box-shadow: 0 0 6px 2px rgb(0 0 0 / 15%);\n display: none;\n padding: 0.25rem;\n position: absolute;\n right: 0;\n top: calc(100% + 0.5rem);\n z-index: 100;\n}\n\n.action-list--open {\n display: block;\n}\n\n.action-list-container {\n position: relative;\n}\n\n.action-list [role=\"menuitem\"] > * {\n background: 0;\n border: 0;\n border-radius: 0.25rem;\n cursor: pointer;\n display: block;\n font: inherit;\n margin: 0;\n padding: 0.5rem 0.75rem;\n text-align: left;\n white-space: pre;\n width: 100%;\n}\n\n.action-list [role=\"menuitem\"] > :not(:last-of-type) {\n border-bottom: 1px solid var(--color-grey-300);\n}\n\n.action-list [role=\"menuitem\"] > :hover {\n background-color: var(--color-grey-200);\n}\n","import { clsx } from 'clsx';\nimport { Children, useEffect, useId, useRef, useState } from 'react';\n\nimport type { KeyboardEvent, MouseEvent as ReactMouseEvent, ReactElement, RefObject } from 'react';\nimport type { IconProps } from 'components/Icon';\nimport type { UIButtonVariant } from 'types/UserInterface';\n\nimport styles from './ActionList.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { MenuButton } from 'components/Buttons';\n\nexport interface ActionListProps {\n /** The label that is displayed before the icon. /\n label: string;\n /* The icon that is shown in front of the label. /\n prefixIcon?: IconProps['name'];\n /* The icon that is shown to toggle the menu. If none is specified, CheveronUp and CheveronDown is used depending on whether the menu is opened or closed. /\n iconName?: IconProps['name'];\n /* Determines the button variant. /\n variant?: UIButtonVariant;\n /* The child component(s). /\n children: ReactElement \| ReactElement[];\n}\n\nconst inactiveIndex = -1;\nconst indexIncrement = 1;\n\n/* A component to show an action list to toggle a menu. */\nexport function ActionList({ label, prefixIcon, iconName, variant = 'secondary', children }: ActionListProps) {\n const listId = useId();\n const triggerRef = useRef<HTMLButtonElement>(null);\n const listRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const numberOfChildren = Children.count(children);\n\n const [activeIndex, setActiveIndex] = useState(inactiveIndex);\n const [isOpen, setIsOpen] = useState(false);\n\n function open() {\n setIsOpen(true);\n\n document.addEventListener('click', onClickOutside, { once: true, capture: true });\n }\n\n function close(event?: ReactMouseEvent<HTMLDivElement>) {\n // When a click occurs on an element that is not an immediate descendant of the action list container\n // (can happen when a modal window is triggered from a button in the action list), the setIsOpen state\n // handler should not be called, because this causes a re-render of the entire component and can lead\n // to undesired effects, like a select element closing immediately after it has been clicked.\n if (event && containerRef.current && !containerRef.current.contains(event.target as Node)) {\n return;\n }\n\n setActiveIndex(inactiveIndex);\n setIsOpen(false);\n\n document.removeEventListener('click', onClickOutside, { capture: true });\n }\n\n function toggle() {\n if (isOpen) close();\n else open();\n }\n\n function onKeyDown(event: KeyboardEvent) {\n if (!isOpen) return;\n\n const eventPreventCodes = ['ArrowUp', 'ArrowDown', 'Home', 'End'];\n\n if (eventPreventCodes.includes(event.code)) {\n // prevent page from scrolling when navigating through items in list\n event.preventDefault();\n }\n\n if (event.code === 'Tab') {\n close();\n }\n }\n\n function onKeyUp(event: KeyboardEvent) {\n if (event.code === 'Space' \|\| event.key === 'Enter') {\n if (event.target === triggerRef.current) {\n toggle();\n } else if (event.key === 'Enter' && event.target !== listRef.current) {\n if ('firstChild' in event.target) {\n const firstChild = event.target.firstChild as HTMLButtonElement;\n\n firstChild.click();\n }\n }\n }\n\n if (event.code === 'Escape') close();\n\n if (event.code === 'ArrowUp') {\n setActiveIndex((prevState) => {\n if (prevState === 0) return numberOfChildren - indexIncrement;\n\n return prevState - indexIncrement;\n });\n }\n\n if (event.code === 'ArrowDown') {\n setActiveIndex((prevState) => {\n if (prevState === numberOfChildren - indexIncrement) return 0;\n\n return prevState + indexIncrement;\n });\n }\n\n if (event.code === 'Home') {\n setActiveIndex(0);\n }\n\n if (event.code === 'End') {\n setActiveIndex(numberOfChildren - indexIncrement);\n }\n }\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n\n if (!target \|\| !containerRef.current) return;\n\n if (!containerRef.current.contains(target as Node)) {\n close();\n }\n };\n\n useEffect(() => {\n if (activeIndex < 0 \|\| !listRef.current) return;\n\n const listItem = listRef.current.children.item(activeIndex);\n\n if (listItem) {\n (listItem as HTMLDivElement).focus();\n }\n }, [activeIndex]);\n\n useEffect(() => {\n if (!listRef.current \|\| !listRef.current.hasChildNodes()) return;\n\n Array.from(listRef.current.children)\n .filter((overlayChild) => overlayChild.nodeType === Node.ELEMENT_NODE && overlayChild.hasChildNodes())\n .forEach((overlayChild) => {\n Array.from(overlayChild.children)\n .filter((childOfChild) => childOfChild.nodeType === Node.ELEMENT_NODE)\n .forEach((childOfChild) => {\n // internal children may be buttons and can get focus when tab is pressed; preventing those elements\n // from getting focus so that list can be tabbed over and traversed with arrow keys\n childOfChild.setAttribute('tabIndex', '-1');\n });\n });\n }, [children]);\n\n return (\n <div className={styles['action-list-container']} ref={containerRef}>\n <MenuButton\n onClick={toggle}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n buttonRef={triggerRef as RefObject<HTMLButtonElement>}\n variant={variant}\n >\n {prefixIcon && <Icon size={24} name={prefixIcon} />}\n {label}\n {iconName ? (\n <Icon size={24} name={iconName} />\n ) : (\n <Icon size={16} name={isOpen ? 'CheveronUp' : 'CheveronDown'} />\n )}\n </MenuButton>\n <div\n aria-activedescendant={`${listId}-child-${activeIndex}`}\n aria-label={label}\n className={clsx(styles['action-list'], {\n [styles['action-list--open']]: isOpen,\n })}\n onClickCapture={close}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n ref={listRef}\n role=\"menu\"\n tabIndex={-1}\n >\n {Children.map(children, (child, index) => (\n <div key={`${listId}-child-${index}`} role=\"menuitem\" tabIndex={-1}>\n {child}\n </div>\n ))}\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;GCyBM,IAAgB,IAChB,IAAiB;AAGvB,SAAgB,EAAW,EAAE,UAAO,eAAY,aAAU,aAAU,aAAa,eAA6B;CAC5G,IAAM,IAAS,GAAO,EAChB,IAAa,EAA0B,KAAK,EAC5C,IAAU,EAAuB,KAAK,EACtC,IAAe,EAAuB,KAAK,EAE3C,IAAmB,EAAS,MAAM,EAAS,EAE3C,CAAC,GAAa,KAAkB,EAAS,EAAc,EACvD,CAAC,GAAQ,KAAa,EAAS,GAAM;CAE3C,SAAS,IAAO;AAGd,EAFA,EAAU,GAAK,EAEf,SAAS,iBAAiB,SAAS,GAAgB;GAAE,MAAM;GAAM,SAAS;GAAM,CAAC;;CAGnF,SAAS,EAAM,GAAyC;AAKlD,OAAS,EAAa,WAAW,CAAC,EAAa,QAAQ,SAAS,EAAM,OAAe,KAIzF,EAAe,EAAc,EAC7B,EAAU,GAAM,EAEhB,SAAS,oBAAoB,SAAS,GAAgB,EAAE,SAAS,IAAM,CAAC;;CAG1E,SAAS,IAAS;AAChB,EAAI,IAAQ,GAAO,GACd,GAAM;;CAGb,SAAS,EAAU,GAAsB;AAClC,~~QAEqB~~;~~GAAC~~;GAAW;GAAa;GAAQ;~~GAAM~~,~~CAE3C~~,SAAS,EAAM,KAAK,IAExC,EAAM,gBAAgB,EAGpB,EAAM,SAAS,SACjB,GAAO;;CAIX,SAAS,EAAQ,GAAsB;AAmCrC,GAlCI,EAAM,SAAS,WAAW,EAAM,QAAQ,aACtC,EAAM,WAAW,EAAW,UAC9B,GAAQ,GACC,EAAM,QAAQ,WAAW,EAAM,WAAW,EAAQ,WACvD,gBAAgB,EAAM,UACL,EAAM,OAAO,WAErB,OAAO,GAKpB,EAAM,SAAS,YAAU,GAAO,EAEhC,EAAM,SAAS,aACjB,GAAgB,MACV,MAAc,IAAU,IAAmB,IAExC,IAAY,EACnB,EAGA,EAAM,SAAS,eACjB,GAAgB,MACV,MAAc,IAAmB,IAAuB,IAErD,IAAY,EACnB,EAGA,EAAM,SAAS,UACjB,EAAe,EAAE,EAGf,EAAM,SAAS,SACjB,EAAe,IAAmB,EAAe;;CAIrD,IAAM,KAAkB,MAAsB;EAC5C,IAAM,EAAE,cAAW;AAEf,GAAC,KAAU,CAAC,EAAa,WAExB,EAAa,QAAQ,SAAS,EAAe,IAChD,GAAO;;AA8BX,QA1BA,QAAgB;AACd,MAAI,IAAc,KAAK,CAAC,EAAQ,QAAS;EAEzC,IAAM,IAAW,EAAQ,QAAQ,SAAS,KAAK,EAAY;AAE3D,EAAI,KACD,EAA4B,OAAO;IAErC,CAAC,EAAY,CAAC,EAEjB,QAAgB;AACV,GAAC,EAAQ,WAAW,CAAC,EAAQ,QAAQ,eAAe,IAExD,MAAM,KAAK,EAAQ,QAAQ,SAAS,CACjC,QAAQ,MAAiB,EAAa,aAAa,KAAK,gBAAgB,EAAa,eAAe,CAAC,CACrG,SAAS,MAAiB;AACzB,SAAM,KAAK,EAAa,SAAS,CAC9B,QAAQ,MAAiB,EAAa,aAAa,KAAK,aAAa,CACrE,SAAS,MAAiB;AAGzB,MAAa,aAAa,YAAY,KAAK;KAC3C;IACJ;IACH,CAAC,EAAS,CAAC,EAGZ,kBAAC,OAAD;EAAK,WAAW,EAAO;EAA0B,KAAK;YAAtD,CACE,kBAAC,GAAD;GACE,SAAS;GACE;GACF;GACT,WAAW;GACF;aALX;IAOG,KAAc,kBAAC,GAAD;KAAM,MAAM;KAAI,MAAM;KAAc,CAAA;IAClD;IACA,IACC,kBAAC,GAAD;KAAM,MAAM;KAAI,MAAM;KAAY,CAAA,GAElC,kBAAC,GAAD;KAAM,MAAM;KAAI,MAAM,IAAS,eAAe;KAAkB,CAAA;IAEvD;MACb,kBAAC,OAAD;GACE,yBAAuB,GAAG,EAAO,SAAS;GAC1C,cAAY;GACZ,WAAW,EAAK,EAAO,gBAAgB,GACpC,EAAO,uBAAuB,GAChC,CAAC;GACF,gBAAgB;GACL;GACF;GACT,KAAK;GACL,MAAK;GACL,UAAU;aAET,EAAS,IAAI,IAAW,GAAO,MAC9B,kBAAC,OAAD;IAAsC,MAAK;IAAW,UAAU;cAC7D;IACG,EAFI,GAAG,EAAO,SAAS,IAEvB,CACN;GACE,CAAA,CACF"}
1	+ {"version":3,"file":"ActionList-O9w1hqNg.js","names":[],"sources":["../src/components/ActionList/ActionList.module.css","../src/components/ActionList/ActionList.tsx"],"sourcesContent":[".action-list {\n background-color: var(--color-uva-white);\n border-radius: 0.5rem;\n box-shadow: 0 0 6px 2px rgb(0 0 0 / 15%);\n display: none;\n padding: 0.25rem;\n position: absolute;\n right: 0;\n top: calc(100% + 0.5rem);\n z-index: 100;\n}\n\n.action-list--open {\n display: block;\n}\n\n.action-list-container {\n position: relative;\n}\n\n.action-list [role=\"menuitem\"] > * {\n background: 0;\n border: 0;\n border-radius: 0.25rem;\n cursor: pointer;\n display: block;\n font: inherit;\n margin: 0;\n padding: 0.5rem 0.75rem;\n text-align: left;\n white-space: pre;\n width: 100%;\n}\n\n.action-list [role=\"menuitem\"] > :not(:last-of-type) {\n border-bottom: 1px solid var(--color-grey-300);\n}\n\n.action-list [role=\"menuitem\"] > :hover {\n background-color: var(--color-grey-200);\n}\n","import { clsx } from 'clsx';\nimport { Children, useEffect, useId, useRef, useState } from 'react';\n\nimport type { KeyboardEvent, MouseEvent as ReactMouseEvent, ReactElement, RefObject } from 'react';\nimport type { IconProps } from 'components/Icon';\nimport type { UIButtonVariant } from 'types/UserInterface';\n\nimport styles from './ActionList.module.css';\n\nimport { Icon } from 'components/Icon';\nimport { MenuButton } from 'components/Buttons';\n\nexport interface ActionListProps {\n /** The label that is displayed before the icon. /\n label: string;\n /* The icon that is shown in front of the label. /\n prefixIcon?: IconProps['name'];\n /* The icon that is shown to toggle the menu. If none is specified, CheveronUp and CheveronDown is used depending on whether the menu is opened or closed. /\n iconName?: IconProps['name'];\n /* Determines the button variant. /\n variant?: UIButtonVariant;\n /* The child component(s). /\n children: ReactElement \| ReactElement[];\n}\n\nconst inactiveIndex = -1;\nconst indexIncrement = 1;\n\n/* A component to show an action list to toggle a menu. */\nexport function ActionList({ label, prefixIcon, iconName, variant = 'secondary', children }: ActionListProps) {\n const listId = useId();\n const triggerRef = useRef<HTMLButtonElement>(null);\n const listRef = useRef<HTMLDivElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n\n const numberOfChildren = Children.count(children);\n\n const [activeIndex, setActiveIndex] = useState(inactiveIndex);\n const [isOpen, setIsOpen] = useState(false);\n\n function open() {\n setIsOpen(true);\n\n document.addEventListener('click', onClickOutside, { once: true, capture: true });\n }\n\n function close(event?: ReactMouseEvent<HTMLDivElement>) {\n // When a click occurs on an element that is not an immediate descendant of the action list container\n // (can happen when a modal window is triggered from a button in the action list), the setIsOpen state\n // handler should not be called, because this causes a re-render of the entire component and can lead\n // to undesired effects, like a select element closing immediately after it has been clicked.\n if (event && containerRef.current && !containerRef.current.contains(event.target as Node)) {\n return;\n }\n\n setActiveIndex(inactiveIndex);\n setIsOpen(false);\n\n document.removeEventListener('click', onClickOutside, { capture: true });\n }\n\n function toggle() {\n if (isOpen) close();\n else open();\n }\n\n function onKeyDown(event: KeyboardEvent) {\n if (!isOpen) return;\n\n const eventPreventCodes = ['ArrowUp', 'ArrowDown', 'Home', 'End'];\n\n if (eventPreventCodes.includes(event.code)) {\n // prevent page from scrolling when navigating through items in list\n event.preventDefault();\n }\n\n if (event.code === 'Tab') {\n close();\n }\n }\n\n function onKeyUp(event: KeyboardEvent) {\n if (event.code === 'Space' \|\| event.key === 'Enter') {\n if (event.target === triggerRef.current) {\n toggle();\n } else if (event.key === 'Enter' && event.target !== listRef.current) {\n if ('firstChild' in event.target) {\n const firstChild = event.target.firstChild as HTMLButtonElement;\n\n firstChild.click();\n }\n }\n }\n\n if (event.code === 'Escape') close();\n\n if (event.code === 'ArrowUp') {\n setActiveIndex((prevState) => {\n if (prevState === 0) return numberOfChildren - indexIncrement;\n\n return prevState - indexIncrement;\n });\n }\n\n if (event.code === 'ArrowDown') {\n setActiveIndex((prevState) => {\n if (prevState === numberOfChildren - indexIncrement) return 0;\n\n return prevState + indexIncrement;\n });\n }\n\n if (event.code === 'Home') {\n setActiveIndex(0);\n }\n\n if (event.code === 'End') {\n setActiveIndex(numberOfChildren - indexIncrement);\n }\n }\n\n const onClickOutside = (event: MouseEvent) => {\n const { target } = event;\n\n if (!target \|\| !containerRef.current) return;\n\n if (!containerRef.current.contains(target as Node)) {\n close();\n }\n };\n\n useEffect(() => {\n if (activeIndex < 0 \|\| !listRef.current) return;\n\n const listItem = listRef.current.children.item(activeIndex);\n\n if (listItem) {\n (listItem as HTMLDivElement).focus();\n }\n }, [activeIndex]);\n\n useEffect(() => {\n if (!listRef.current \|\| !listRef.current.hasChildNodes()) return;\n\n Array.from(listRef.current.children)\n .filter((overlayChild) => overlayChild.nodeType === Node.ELEMENT_NODE && overlayChild.hasChildNodes())\n .forEach((overlayChild) => {\n Array.from(overlayChild.children)\n .filter((childOfChild) => childOfChild.nodeType === Node.ELEMENT_NODE)\n .forEach((childOfChild) => {\n // internal children may be buttons and can get focus when tab is pressed; preventing those elements\n // from getting focus so that list can be tabbed over and traversed with arrow keys\n childOfChild.setAttribute('tabIndex', '-1');\n });\n });\n }, [children]);\n\n return (\n <div className={styles['action-list-container']} ref={containerRef}>\n <MenuButton\n onClick={toggle}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n buttonRef={triggerRef as RefObject<HTMLButtonElement>}\n variant={variant}\n >\n {prefixIcon && <Icon size={24} name={prefixIcon} />}\n {label}\n {iconName ? (\n <Icon size={24} name={iconName} />\n ) : (\n <Icon size={16} name={isOpen ? 'CheveronUp' : 'CheveronDown'} />\n )}\n </MenuButton>\n <div\n aria-activedescendant={`${listId}-child-${activeIndex}`}\n aria-label={label}\n className={clsx(styles['action-list'], {\n [styles['action-list--open']]: isOpen,\n })}\n onClickCapture={close}\n onKeyDown={onKeyDown}\n onKeyUp={onKeyUp}\n ref={listRef}\n role=\"menu\"\n tabIndex={-1}\n >\n {Children.map(children, (child, index) => (\n <div key={`${listId}-child-${index}`} role=\"menuitem\" tabIndex={-1}>\n {child}\n </div>\n ))}\n </div>\n </div>\n );\n}\n"],"mappings":"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"}

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