@thewaver/ss-components 0.0.1 → 0.0.2

package/dist/Fundamentals/ImageSwitcher/ImageSwitcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageSwitcher.js","names":["createEffect","createMemo","createSignal","onCleanup","untrack","MathUtils","access","ImageSwitcherProps","styles","DEFAULT_IMAGE_SWITCHER_TRANSITION_DURATION_MS","ImageSwitcher","props","getPrevImage","setPrevImage","getCurrentImage","setCurrentImage","getVersion","setVersion","getTransitionDurationMs","transitionDurationMs","isEven","src","onLoad","swap","prev","img","Image","onload","onerror","crossOrigin","e","call","console","warn","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$className","imageSwitcherRoot","imageSwitcherImage","_$effect","_p$","_v$","_v$2","_v$3","undefined","_v$4","_v$5","_v$6","_v$7","_v$8","_$setStyleProperty","t","a","o","_$setAttribute","i","n","s","h"],"sources":["../../../src/Fundamentals/ImageSwitcher/ImageSwitcher.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, onCleanup, untrack } from \"solid-js\";\n\nimport { MathUtils } from \"@thewaver/ss-utils\";\n\nimport { access } from \"../../Utils/propUtils\";\nimport type { ImageSwitcherProps } from \"./ImageSwitcher.types\";\n\nimport * as styles from \"./ImageSwitcher.css\";\n\nconst DEFAULT_IMAGE_SWITCHER_TRANSITION_DURATION_MS = 100;\n\nexport const ImageSwitcher = (props: ImageSwitcherProps) => {\n    const [getPrevImage, setPrevImage] = createSignal<string>();\n    const [getCurrentImage, setCurrentImage] = createSignal<string>();\n    const [getVersion, setVersion] = createSignal(0);\n\n    const getTransitionDurationMs = createMemo(\n        () => access(props.transitionDurationMs) ?? DEFAULT_IMAGE_SWITCHER_TRANSITION_DURATION_MS,\n    );\n\n    const isEven = createMemo(() => MathUtils.isEven(getVersion()));\n\n    createEffect(() => {\n        const src = access(props.src);\n        const onLoad = props.onLoad;\n\n        if (src === untrack(getCurrentImage)) return;\n\n        const swap = () => {\n            setPrevImage(untrack(getCurrentImage));\n            setCurrentImage(src);\n            setVersion((prev) => prev + 1);\n        };\n\n        if (!src) {\n            swap();\n            return;\n        }\n\n        const img = new Image();\n\n        onCleanup(() => {\n            img.onload = null;\n            img.onerror = null;\n            img.src = \"\";\n        });\n\n        img.crossOrigin = \"anonymous\";\n        img.onload = (e) => {\n            swap();\n            onLoad?.call(img, e);\n        };\n        img.onerror = () => {\n            console.warn(`ImageSwitcher: failed to preload image: ${src}`);\n            swap();\n        };\n        img.src = src;\n    });\n\n    return (\n        <div class={styles.imageSwitcherRoot}>\n            <img\n                class={styles.imageSwitcherImage}\n                style={{\n                    \"opacity\": isEven() ? 1 : 0,\n                    \"transition-duration\": `${getTransitionDurationMs()}ms`,\n                    \"visibility\": (isEven() ? getCurrentImage() : getPrevImage()) ? undefined : \"hidden\",\n                }}\n                src={isEven() ? getCurrentImage() : getPrevImage()}\n                alt=\"\"\n            />\n            <img\n                class={styles.imageSwitcherImage}\n                style={{\n                    \"opacity\": !isEven() ? 1 : 0,\n                    \"transition-duration\": `${getTransitionDurationMs()}ms`,\n                    \"visibility\": (!isEven() ? getCurrentImage() : getPrevImage()) ? undefined : \"hidden\",\n                }}\n                src={!isEven() ? getCurrentImage() : getPrevImage()}\n                alt=\"\"\n            />\n        </div>\n    );\n};\n"],"mappings":"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"}

package/dist/Fundamentals/Input/BinarySwitch/BinarySwitch.css.js

@@ -0,0 +1,7 @@
+/* empty css                                */
+//#region src/Fundamentals/Input/BinarySwitch/BinarySwitch.css.ts
+var binarySwitchElement = "_1xguq3u0";
+//#endregion
+export { binarySwitchElement };
+
+//# sourceMappingURL=BinarySwitch.css.js.map

package/dist/Fundamentals/Input/BinarySwitch/BinarySwitch.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BinarySwitch.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/BinarySwitch/BinarySwitch.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const binarySwitchElement = style({\n    appearance: \"none\",\n    position: \"absolute\",\n    inset: 0,\n    width: \"auto !important\",\n    height: \"auto !important\",\n    margin: \"0 !important\",\n    padding: \"0 !important\",\n    border: \"none !important\",\n    borderRadius: \"0 !important\",\n    background: \"transparent !important\",\n    boxShadow: \"none !important\",\n    pointerEvents: \"all\",\n    cursor: \"pointer\",\n\n    selectors: {\n        \"&[aria-disabled='true']\": {\n            cursor: \"not-allowed\",\n        },\n    },\n});\n"],"mappings":""}

package/dist/Fundamentals/Input/BinarySwitch/BinarySwitch.js

@@ -0,0 +1,123 @@
+import { access } from "../../../Utils/propUtils.js";
+import { LabelUtils } from "../Label/Label.utils.js";
+import { InteractionWrapper } from "../../InteractionWrapper/InteractionWrapper.js";
+import { FormFieldUtils } from "../FormField/FormField.utils.js";
+import { binarySwitchElement } from "./BinarySwitch.css.js";
+import { createRenderEffect, createSignal } from "solid-js";
+import { className, createComponent, delegateEvents, effect, memo, mergeProps, setAttribute, template, use } from "solid-js/web";
+//#region src/Fundamentals/Input/BinarySwitch/BinarySwitch.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<input>`);
+var BinarySwitchElement = (props) => {
+	const getAriaLabel = LabelUtils.resolveAriaLabel(props.ariaLabel === void 0 ? void 0 : () => access(props.ariaLabel));
+	const getAriaDescribedBy = FormFieldUtils.resolveAriaDescribedBy();
+	const [getElementRef, setElementRef] = createSignal();
+	const getIsDisabled = () => access(props.flags).isDisabled ?? false;
+	const getIsMixed = () => access(props.isMixed) ?? false;
+	const getRole = () => access(props.isSwitch) && !getIsMixed() ? "switch" : void 0;
+	const syncElement = (element) => {
+		element.checked = access(props.isChecked);
+		element.indeterminate = getIsMixed();
+	};
+	createRenderEffect(() => {
+		const element = getElementRef();
+		if (!element) return;
+		syncElement(element);
+	});
+	return [memo(() => props.renderContent(() => access(props.flags))), (() => {
+		var _el$ = _tmpl$();
+		_el$.addEventListener("mouseleave", (e) => {
+			if (getIsDisabled()) return;
+			props.onMouseLeave?.(e);
+		});
+		_el$.addEventListener("mouseenter", (e) => {
+			if (getIsDisabled()) return;
+			props.onMouseEnter?.(e);
+		});
+		_el$.addEventListener("change", (e) => {
+			const element = e.currentTarget;
+			if (getIsDisabled()) return;
+			props.onChange?.(element.checked);
+			syncElement(element);
+		});
+		_el$.$$click = (e) => {
+			if (getIsDisabled()) e.preventDefault();
+		};
+		use((element) => {
+			setElementRef(element);
+			props.ref?.(element);
+		}, _el$);
+		className(_el$, binarySwitchElement);
+		effect((_p$) => {
+			var _v$ = access(props.id), _v$2 = access(props.type), _v$3 = access(props.name), _v$4 = getRole(), _v$5 = getAriaLabel(), _v$6 = getAriaDescribedBy(), _v$7 = getIsDisabled() || void 0, _v$8 = access(props.flags).hasError || void 0;
+			_v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+			_v$2 !== _p$.t && setAttribute(_el$, "type", _p$.t = _v$2);
+			_v$3 !== _p$.a && setAttribute(_el$, "name", _p$.a = _v$3);
+			_v$4 !== _p$.o && setAttribute(_el$, "role", _p$.o = _v$4);
+			_v$5 !== _p$.i && setAttribute(_el$, "aria-label", _p$.i = _v$5);
+			_v$6 !== _p$.n && setAttribute(_el$, "aria-describedby", _p$.n = _v$6);
+			_v$7 !== _p$.s && setAttribute(_el$, "aria-disabled", _p$.s = _v$7);
+			_v$8 !== _p$.h && setAttribute(_el$, "aria-invalid", _p$.h = _v$8);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0,
+			o: void 0,
+			i: void 0,
+			n: void 0,
+			s: void 0,
+			h: void 0
+		});
+		return _el$;
+	})()];
+};
+var BinarySwitch = (props) => {
+	return createComponent(InteractionWrapper, mergeProps(props, {
+		extraFlags: () => ({ checkedState: access(props.isMixed) ? "mixed" : access(props.isChecked) }),
+		renderControl: (setElementRef, getFlags) => createComponent(BinarySwitchElement, {
+			ref(r$) {
+				var _ref$ = setElementRef;
+				typeof _ref$ === "function" ? _ref$(r$) : setElementRef = r$;
+			},
+			get id() {
+				return props.id;
+			},
+			get type() {
+				return props.type;
+			},
+			get isSwitch() {
+				return props.isSwitch;
+			},
+			get name() {
+				return props.name;
+			},
+			get ariaLabel() {
+				return props.ariaLabel;
+			},
+			flags: getFlags,
+			get isChecked() {
+				return props.isChecked;
+			},
+			get isMixed() {
+				return props.isMixed;
+			},
+			get renderContent() {
+				return props.renderContent;
+			},
+			get onChange() {
+				return props.onChange;
+			},
+			get onMouseEnter() {
+				return props.onMouseEnter;
+			},
+			get onMouseLeave() {
+				return props.onMouseLeave;
+			}
+		})
+	}));
+};
+delegateEvents(["click"]);
+//#endregion
+export { BinarySwitch };
+
+//# sourceMappingURL=BinarySwitch.js.map

package/dist/Fundamentals/Input/BinarySwitch/BinarySwitch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BinarySwitch.js","names":["createRenderEffect","createSignal","access","InteractionWrapper","FormFieldUtils","LabelUtils","BinarySwitchElementProps","BinarySwitchFlags","BinarySwitchProps","styles","BinarySwitchElement","props","getAriaLabel","resolveAriaLabel","ariaLabel","undefined","getAriaDescribedBy","resolveAriaDescribedBy","getElementRef","setElementRef","HTMLInputElement","getIsDisabled","flags","isDisabled","getIsMixed","isMixed","getRole","isSwitch","syncElement","element","checked","isChecked","indeterminate","_$memo","renderContent","_el$","_tmpl$","addEventListener","e","onMouseLeave","onMouseEnter","currentTarget","onChange","$$click","preventDefault","_$use","ref","_$className","binarySwitchElement","_$effect","_p$","_v$","id","_v$2","type","_v$3","name","_v$4","_v$5","_v$6","_v$7","_v$8","hasError","_$setAttribute","t","a","o","i","n","s","h","BinarySwitch","_$createComponent","_$mergeProps","extraFlags","checkedState","renderControl","getFlags","r$","_ref$","_$delegateEvents"],"sources":["../../../../src/Fundamentals/Input/BinarySwitch/BinarySwitch.tsx"],"sourcesContent":["import { createRenderEffect, createSignal } from \"solid-js\";\n\nimport { access } from \"../../../Utils/propUtils\";\nimport { InteractionWrapper } from \"../../InteractionWrapper/InteractionWrapper\";\nimport { FormFieldUtils } from \"../FormField/FormField.utils\";\nimport { LabelUtils } from \"../Label/Label.utils\";\nimport type { BinarySwitchElementProps, BinarySwitchFlags, BinarySwitchProps } from \"./BinarySwitch.types\";\n\nimport * as styles from \"./BinarySwitch.css\";\n\nconst BinarySwitchElement = (props: BinarySwitchElementProps) => {\n    const getAriaLabel = LabelUtils.resolveAriaLabel(\n        props.ariaLabel === undefined ? undefined : () => access(props.ariaLabel)!,\n    );\n    const getAriaDescribedBy = FormFieldUtils.resolveAriaDescribedBy();\n\n    const [getElementRef, setElementRef] = createSignal<HTMLInputElement>();\n\n    const getIsDisabled = () => access(props.flags).isDisabled ?? false;\n\n    const getIsMixed = () => access(props.isMixed) ?? false;\n\n    const getRole = () => (access(props.isSwitch) && !getIsMixed() ? \"switch\" : undefined);\n\n    const syncElement = (element: HTMLInputElement) => {\n        element.checked = access(props.isChecked);\n        element.indeterminate = getIsMixed();\n    };\n\n    createRenderEffect(() => {\n        const element = getElementRef();\n\n        if (!element) return;\n\n        syncElement(element);\n    });\n\n    return (\n        <>\n            {props.renderContent(() => access(props.flags))}\n\n            <input\n                id={access(props.id)}\n                ref={(element) => {\n                    setElementRef(element);\n                    props.ref?.(element);\n                }}\n                type={access(props.type)}\n                name={access(props.name)}\n                role={getRole()}\n                class={styles.binarySwitchElement}\n                aria-label={getAriaLabel()}\n                aria-describedby={getAriaDescribedBy()}\n                aria-disabled={getIsDisabled() || undefined}\n                aria-invalid={access(props.flags).hasError || undefined}\n                onClick={(e) => {\n                    if (getIsDisabled()) e.preventDefault();\n                }}\n                onChange={(e) => {\n                    const element = e.currentTarget;\n\n                    if (getIsDisabled()) return;\n\n                    void props.onChange?.(element.checked);\n\n                    syncElement(element);\n                }}\n                onMouseEnter={(e) => {\n                    if (getIsDisabled()) return;\n\n                    void props.onMouseEnter?.(e);\n                }}\n                onMouseLeave={(e) => {\n                    if (getIsDisabled()) return;\n\n                    void props.onMouseLeave?.(e);\n                }}\n            />\n        </>\n    );\n};\n\nexport const BinarySwitch = (props: BinarySwitchProps) => {\n    return (\n        <InteractionWrapper\n            {...props}\n            extraFlags={(): BinarySwitchFlags => ({\n                checkedState: access(props.isMixed) ? \"mixed\" : access(props.isChecked),\n            })}\n            renderControl={(setElementRef, getFlags) => (\n                <BinarySwitchElement\n                    ref={setElementRef}\n                    id={props.id}\n                    type={props.type}\n                    isSwitch={props.isSwitch}\n                    name={props.name}\n                    ariaLabel={props.ariaLabel}\n                    flags={getFlags}\n                    isChecked={props.isChecked}\n                    isMixed={props.isMixed}\n                    renderContent={props.renderContent}\n                    onChange={props.onChange}\n                    onMouseEnter={props.onMouseEnter}\n                    onMouseLeave={props.onMouseLeave}\n                />\n            )}\n        />\n    );\n};\n"],"mappings":"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"}

package/dist/Fundamentals/Input/Calendar/Calendar.css.js

@@ -0,0 +1,10 @@
+/* empty css                            */
+//#region src/Fundamentals/Input/Calendar/Calendar.css.ts
+var calendarRoot = "_3bwc2v0";
+var calendarRow = "_3bwc2v1";
+var calendarWeekday = "_3bwc2v2";
+var calendarDay = "_3bwc2v3";
+//#endregion
+export { calendarDay, calendarRoot, calendarRow, calendarWeekday };
+
+//# sourceMappingURL=Calendar.css.js.map

package/dist/Fundamentals/Input/Calendar/Calendar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/Calendar/Calendar.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nconst WEEK_COLUMNS = 7;\n\nexport const calendarRoot = style({\n    display: \"grid\",\n    gridTemplateColumns: `repeat(${WEEK_COLUMNS}, 1fr)`,\n    width: \"fit-content\",\n});\n\nexport const calendarRow = style({\n    display: \"grid\",\n    gridColumn: `span ${WEEK_COLUMNS}`,\n    gridTemplateColumns: \"subgrid\",\n});\n\nexport const calendarWeekday = style({\n    display: \"flex\",\n});\n\nexport const calendarDay = style({\n    display: \"flex\",\n    pointerEvents: \"all\",\n    width: \"100%\",\n\n    selectors: {\n        \"&:focus-visible\": {\n            zIndex: 1,\n        },\n    },\n});\n"],"mappings":""}

package/dist/Fundamentals/Input/Calendar/Calendar.js

@@ -0,0 +1,240 @@
+import { access, accessSignal } from "../../../Utils/propUtils.js";
+import { LiveAnnouncer } from "../../../Abstracts/LiveAnnouncer/LiveAnnouncer.js";
+import { DateValueUtils } from "../../../Abstracts/DateValue/DateValue.utils.js";
+import { NavigatorUtils } from "../../../Abstracts/Navigator/Navigator.utils.js";
+import { InteractionWrapper } from "../../InteractionWrapper/InteractionWrapper.js";
+import { calendarDay, calendarRoot, calendarRow, calendarWeekday } from "./Calendar.css.js";
+import { Index, createEffect, createMemo, createSignal, createUniqueId } from "solid-js";
+import { className, createComponent, delegateEvents, effect, insert, mergeProps, setAttribute, setStyleProperty, template, use } from "solid-js/web";
+//#region src/Fundamentals/Input/Calendar/Calendar.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div role=gridcell>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<div role=grid><div role=row>`);
+var _tmpl$3 = /*#__PURE__*/ template(`<div role=columnheader>`);
+var _tmpl$4 = /*#__PURE__*/ template(`<div role=row>`);
+var DEFAULT_CALENDAR_WEEK_STARTS_ON = 1;
+var DEFAULT_CALENDAR_WEEKDAY_WIDTH = "short";
+var DEFAULT_CALENDAR_GAP = 0;
+var DAYS_PER_WEEK = 7;
+var GRID_WEEKS = 6;
+var MONTH_STEP = 1;
+var YEAR_STEP = 1;
+var SELECT_KEYS = ["Enter", " "];
+var DAY_LABEL_OPTIONS = {
+	day: "numeric",
+	month: "long",
+	year: "numeric"
+};
+var MONTH_ANNOUNCE_OPTIONS = {
+	month: "long",
+	year: "numeric"
+};
+var PAST_ERA_DAY_LABEL_OPTIONS = {
+	...DAY_LABEL_OPTIONS,
+	era: "short"
+};
+var PAST_ERA_MONTH_ANNOUNCE_OPTIONS = {
+	...MONTH_ANNOUNCE_OPTIONS,
+	era: "short"
+};
+var CalendarDay = (props) => {
+	const getIsDisabled = () => access(props.flags).isDisabled ?? false;
+	return (() => {
+		var _el$ = _tmpl$();
+		_el$.$$click = () => {
+			if (getIsDisabled()) return;
+			props.onSelect();
+		};
+		use((element) => props.ref?.(element), _el$);
+		className(_el$, calendarDay);
+		insert(_el$, () => props.renderContent(() => access(props.flags)));
+		effect((_p$) => {
+			var _v$ = access(props.id), _v$2 = access(props.ariaLabel), _v$3 = access(props.flags).isSelected, _v$4 = access(props.flags).isToday ? "date" : void 0, _v$5 = getIsDisabled() || void 0;
+			_v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+			_v$2 !== _p$.t && setAttribute(_el$, "aria-label", _p$.t = _v$2);
+			_v$3 !== _p$.a && setAttribute(_el$, "aria-selected", _p$.a = _v$3);
+			_v$4 !== _p$.o && setAttribute(_el$, "aria-current", _p$.o = _v$4);
+			_v$5 !== _p$.i && setAttribute(_el$, "aria-disabled", _p$.i = _v$5);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0,
+			o: void 0,
+			i: void 0
+		});
+		return _el$;
+	})();
+};
+var CalendarComposite = (props) => {
+	const monthSignal = accessSignal(() => props.monthSignal);
+	const gridId = createUniqueId();
+	const [getRootRef, setRootRef] = createSignal();
+	const [getDayRefs, setDayRefs] = createSignal([]);
+	const [getHighlighted, setHighlighted] = createSignal();
+	const getWeekStartsOn = createMemo(() => access(props.weekStartsOn) ?? DEFAULT_CALENDAR_WEEK_STARTS_ON);
+	const getMonth = createMemo(() => monthSignal[0]());
+	const getToday = createMemo(() => DateValueUtils.withCalendar(access(props.today) ?? DateValueUtils.fromDate(/* @__PURE__ */ new Date()), DateValueUtils.getCalendarId(getMonth())));
+	const getGrid = createMemo(() => DateValueUtils.getMonthGrid(getMonth(), getWeekStartsOn()));
+	const getCurrentEraId = createMemo(() => {
+		const eras = DateValueUtils.getEras(getMonth(), access(props.locale));
+		return eras[eras.length - 1].id;
+	});
+	const getDayLabelOptions = (day) => day.era === getCurrentEraId() ? DAY_LABEL_OPTIONS : PAST_ERA_DAY_LABEL_OPTIONS;
+	const getGridStart = createMemo(() => getGrid().weeks[0][0]);
+	const getWeekdayNames = createMemo(() => DateValueUtils.getWeekdayNames(getWeekStartsOn(), access(props.weekdayWidth) ?? DEFAULT_CALENDAR_WEEKDAY_WIDTH, access(props.locale)));
+	const getIsDayDisabled = (day) => (access(props.isDisabled) ?? false) || !DateValueUtils.getIsInRange(day, access(props.min), access(props.max)) || (props.computeIsDayDisabled?.(day) ?? false);
+	const getRovingDay = createMemo(() => {
+		const highlighted = getHighlighted();
+		if (highlighted && DateValueUtils.getCellOf(getGrid(), highlighted)) return highlighted;
+		const anchor = props.computeAnchorDay?.();
+		if (anchor && DateValueUtils.getCellOf(getGrid(), anchor)) return anchor;
+		const today = getToday();
+		if (DateValueUtils.getCellOf(getGrid(), today)) return today;
+		return DateValueUtils.getStartOfMonth(getMonth());
+	});
+	const setDayRef = (index, element) => {
+		setDayRefs((prev) => {
+			const next = [...prev];
+			next[index] = element;
+			return next;
+		});
+	};
+	const moveTo = (day) => {
+		const clamped = DateValueUtils.clamp(day, access(props.min), access(props.max));
+		const month = DateValueUtils.getStartOfMonth(clamped);
+		setHighlighted(() => clamped);
+		if (!DateValueUtils.isSame(month, DateValueUtils.getStartOfMonth(getMonth()))) monthSignal[1](() => month);
+	};
+	const pickDay = (day) => {
+		if (getIsDayDisabled(day)) return;
+		setHighlighted(() => day);
+		props.onPick(day);
+	};
+	const getPaintedRange = createMemo(() => props.computeRange?.(getRovingDay()));
+	createEffect(() => {
+		const anchor = props.computeAnchorDay?.();
+		if (!anchor) return;
+		setHighlighted(() => anchor);
+	});
+	createEffect((previous) => {
+		const month = getMonth();
+		if (previous && !DateValueUtils.isSame(DateValueUtils.getStartOfMonth(previous), DateValueUtils.getStartOfMonth(month))) LiveAnnouncer.announce(DateValueUtils.format(month, month.era === getCurrentEraId() ? MONTH_ANNOUNCE_OPTIONS : PAST_ERA_MONTH_ANNOUNCE_OPTIONS, access(props.locale)));
+		return month;
+	});
+	createEffect(() => {
+		const cell = DateValueUtils.getCellOf(getGrid(), getRovingDay());
+		const root = getRootRef();
+		if (!cell || !root?.contains(document.activeElement) || root === document.activeElement) return;
+		getDayRefs()[cell.y * DAYS_PER_WEEK + cell.x]?.focus();
+	});
+	const handleKeyDown = (e) => {
+		const roving = getRovingDay();
+		if (SELECT_KEYS.includes(e.key)) {
+			e.preventDefault();
+			pickDay(roving);
+			return;
+		}
+		if (e.key === "PageUp" || e.key === "PageDown") {
+			const direction = e.key === "PageUp" ? -1 : 1;
+			e.preventDefault();
+			moveTo(e.shiftKey ? DateValueUtils.addYears(roving, direction * YEAR_STEP) : DateValueUtils.addMonths(roving, direction * MONTH_STEP));
+			return;
+		}
+		const cell = DateValueUtils.getCellOf(getGrid(), roving);
+		if (!cell) return;
+		const next = NavigatorUtils.computeNextCell(e.key, cell, {
+			width: DAYS_PER_WEEK,
+			height: GRID_WEEKS
+		}, { hasPageKeys: false });
+		if (!next) return;
+		e.preventDefault();
+		moveTo(DateValueUtils.addDays(getGridStart(), next.y * DAYS_PER_WEEK + next.x));
+	};
+	return (() => {
+		var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild;
+		_el$2.$$keydown = handleKeyDown;
+		use(setRootRef, _el$2);
+		setAttribute(_el$2, "id", gridId);
+		className(_el$2, calendarRoot);
+		className(_el$3, calendarRow);
+		insert(_el$3, createComponent(Index, {
+			get each() {
+				return getWeekdayNames();
+			},
+			children: (getName, index) => (() => {
+				var _el$4 = _tmpl$3();
+				className(_el$4, calendarWeekday);
+				insert(_el$4, () => props.renderWeekday?.(getName(), index));
+				effect(() => setAttribute(_el$4, "aria-label", getName()));
+				return _el$4;
+			})()
+		}));
+		insert(_el$2, createComponent(Index, {
+			get each() {
+				return getGrid().weeks;
+			},
+			children: (getWeek, weekIndex) => (() => {
+				var _el$5 = _tmpl$4();
+				className(_el$5, calendarRow);
+				insert(_el$5, createComponent(Index, {
+					get each() {
+						return getWeek();
+					},
+					children: (getDay, dayIndex) => createComponent(InteractionWrapper, {
+						sizing: "fill",
+						isDisabled: () => getIsDayDisabled(getDay()),
+						isTabbable: () => DateValueUtils.isSame(getDay(), getRovingDay()),
+						extraFlags: () => ({
+							day: getDay(),
+							isSelected: props.computeIsSelected(getDay()),
+							isToday: DateValueUtils.isSame(getDay(), getToday()),
+							isOutsideMonth: getDay().month !== getMonth().month,
+							isHighlighted: DateValueUtils.isSame(getDay(), getRovingDay()),
+							isInRange: DateValueUtils.getIsWithin(getDay(), getPaintedRange()),
+							isRangeStart: DateValueUtils.isSame(getDay(), getPaintedRange()?.start),
+							isRangeEnd: DateValueUtils.isSame(getDay(), getPaintedRange()?.end)
+						}),
+						ref: (element) => setDayRef(weekIndex * DAYS_PER_WEEK + dayIndex, element),
+						renderControl: (setElementRef, getRenderProps) => createComponent(CalendarDay, {
+							ref(r$) {
+								var _ref$ = setElementRef;
+								typeof _ref$ === "function" ? _ref$(r$) : setElementRef = r$;
+							},
+							id: () => `${gridId}-day-${DateValueUtils.toIso(getDay())}`,
+							flags: getRenderProps,
+							ariaLabel: () => DateValueUtils.format(getDay(), getDayLabelOptions(getDay()), access(props.locale)),
+							renderContent: (getDayFlags) => props.renderDay(getDay, getDayFlags),
+							onSelect: () => pickDay(getDay())
+						})
+					})
+				}));
+				return _el$5;
+			})()
+		}), null);
+		effect((_p$) => {
+			var _v$6 = `${access(props.gap) ?? DEFAULT_CALENDAR_GAP}px`, _v$7 = access(props.ariaLabel), _v$8 = access(props.isDisabled) || void 0;
+			_v$6 !== _p$.e && setStyleProperty(_el$2, "gap", _p$.e = _v$6);
+			_v$7 !== _p$.t && setAttribute(_el$2, "aria-label", _p$.t = _v$7);
+			_v$8 !== _p$.a && setAttribute(_el$2, "aria-disabled", _p$.a = _v$8);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0
+		});
+		return _el$2;
+	})();
+};
+var Calendar = (props) => {
+	const valueSignal = accessSignal(() => props.valueSignal);
+	return createComponent(CalendarComposite, mergeProps(props, {
+		computeIsSelected: (day) => DateValueUtils.isSame(day, valueSignal[0]()),
+		computeAnchorDay: () => valueSignal[0](),
+		onPick: (day) => valueSignal[1](() => day)
+	}));
+};
+delegateEvents(["click", "keydown"]);
+//#endregion
+export { Calendar, CalendarComposite };
+
+//# sourceMappingURL=Calendar.js.map

package/dist/Fundamentals/Input/Calendar/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.js","names":["Index","createEffect","createMemo","createSignal","createUniqueId","DateValue","DateValueWeekStart","DateValueWeekdayWidth","DateValueUtils","LiveAnnouncer","NavigatorUtils","access","accessSignal","InteractionWrapper","CalendarCompositeProps","CalendarDayProps","CalendarProps","CalendarRenderProps","styles","DEFAULT_CALENDAR_WEEK_STARTS_ON","DEFAULT_CALENDAR_WEEKDAY_WIDTH","DEFAULT_CALENDAR_GAP","DAYS_PER_WEEK","GRID_WEEKS","MONTH_STEP","YEAR_STEP","SELECT_KEYS","DAY_LABEL_OPTIONS","Intl","DateTimeFormatOptions","day","month","year","MONTH_ANNOUNCE_OPTIONS","PAST_ERA_DAY_LABEL_OPTIONS","era","PAST_ERA_MONTH_ANNOUNCE_OPTIONS","CalendarDay","props","getIsDisabled","flags","isDisabled","_el$","_tmpl$","$$click","onSelect","_$use","element","ref","_$className","calendarDay","_$insert","renderContent","_$effect","_p$","_v$","id","_v$2","ariaLabel","_v$3","isSelected","_v$4","isToday","undefined","_v$5","e","_$setAttribute","t","a","o","i","CalendarComposite","monthSignal","gridId","getRootRef","setRootRef","HTMLElement","getDayRefs","setDayRefs","getHighlighted","setHighlighted","getWeekStartsOn","weekStartsOn","getMonth","getToday","withCalendar","today","fromDate","Date","getCalendarId","getGrid","getMonthGrid","getCurrentEraId","eras","getEras","locale","length","getDayLabelOptions","getGridStart","weeks","getWeekdayNames","weekdayWidth","getIsDayDisabled","getIsInRange","min","max","computeIsDayDisabled","getRovingDay","highlighted","getCellOf","anchor","computeAnchorDay","getStartOfMonth","setDayRef","index","prev","next","moveTo","clamped","clamp","isSame","pickDay","onPick","getPaintedRange","computeRange","previous","announce","format","cell","root","contains","document","activeElement","y","x","focus","handleKeyDown","KeyboardEvent","roving","includes","key","preventDefault","direction","shiftKey","addYears","addMonths","computeNextCell","width","height","hasPageKeys","addDays","_el$2","_tmpl$2","_el$3","firstChild","$$keydown","calendarRoot","calendarRow","_$createComponent","each","children","getName","_el$4","_tmpl$3","calendarWeekday","renderWeekday","getWeek","weekIndex","_el$5","_tmpl$4","getDay","dayIndex","sizing","isTabbable","extraFlags","computeIsSelected","isOutsideMonth","isHighlighted","isInRange","getIsWithin","isRangeStart","start","isRangeEnd","end","renderControl","setElementRef","getRenderProps","r$","_ref$","toIso","getDayFlags","renderDay","_v$6","gap","_v$7","_v$8","_$setStyleProperty","Calendar","valueSignal","_$mergeProps","_$delegateEvents"],"sources":["../../../../src/Fundamentals/Input/Calendar/Calendar.tsx"],"sourcesContent":["import { Index, createEffect, createMemo, createSignal, createUniqueId } from \"solid-js\";\n\nimport type {\n    DateValue,\n    DateValueWeekStart,\n    DateValueWeekdayWidth,\n} from \"../../../Abstracts/DateValue/DateValue.types\";\nimport { DateValueUtils } from \"../../../Abstracts/DateValue/DateValue.utils\";\nimport { LiveAnnouncer } from \"../../../Abstracts/LiveAnnouncer/LiveAnnouncer\";\nimport { NavigatorUtils } from \"../../../Abstracts/Navigator/Navigator.utils\";\nimport { access, accessSignal } from \"../../../Utils/propUtils\";\nimport { InteractionWrapper } from \"../../InteractionWrapper/InteractionWrapper\";\nimport type { CalendarCompositeProps, CalendarDayProps, CalendarProps, CalendarRenderProps } from \"./Calendar.types\";\n\nimport * as styles from \"./Calendar.css\";\n\nconst DEFAULT_CALENDAR_WEEK_STARTS_ON: DateValueWeekStart = 1;\nconst DEFAULT_CALENDAR_WEEKDAY_WIDTH: DateValueWeekdayWidth = \"short\";\nconst DEFAULT_CALENDAR_GAP = 0;\nconst DAYS_PER_WEEK = 7;\nconst GRID_WEEKS = 6;\nconst MONTH_STEP = 1;\nconst YEAR_STEP = 1;\nconst SELECT_KEYS = [\"Enter\", \" \"];\n\nconst DAY_LABEL_OPTIONS: Intl.DateTimeFormatOptions = { day: \"numeric\", month: \"long\", year: \"numeric\" };\nconst MONTH_ANNOUNCE_OPTIONS: Intl.DateTimeFormatOptions = { month: \"long\", year: \"numeric\" };\nconst PAST_ERA_DAY_LABEL_OPTIONS: Intl.DateTimeFormatOptions = { ...DAY_LABEL_OPTIONS, era: \"short\" };\nconst PAST_ERA_MONTH_ANNOUNCE_OPTIONS: Intl.DateTimeFormatOptions = { ...MONTH_ANNOUNCE_OPTIONS, era: \"short\" };\n\nconst CalendarDay = (props: CalendarDayProps) => {\n    const getIsDisabled = () => access(props.flags).isDisabled ?? false;\n\n    return (\n        <div\n            id={access(props.id)}\n            ref={(element) => props.ref?.(element)}\n            class={styles.calendarDay}\n            role=\"gridcell\"\n            aria-label={access(props.ariaLabel)}\n            aria-selected={access(props.flags).isSelected}\n            aria-current={access(props.flags).isToday ? \"date\" : undefined}\n            aria-disabled={getIsDisabled() || undefined}\n            onClick={() => {\n                if (getIsDisabled()) return;\n\n                props.onSelect();\n            }}\n        >\n            {props.renderContent(() => access(props.flags))}\n        </div>\n    );\n};\n\nexport const CalendarComposite = (props: CalendarCompositeProps) => {\n    const monthSignal = accessSignal(() => props.monthSignal);\n\n    const gridId = createUniqueId();\n\n    const [getRootRef, setRootRef] = createSignal<HTMLElement>();\n    const [getDayRefs, setDayRefs] = createSignal<(HTMLElement | undefined)[]>([]);\n    const [getHighlighted, setHighlighted] = createSignal<DateValue | undefined>();\n\n    const getWeekStartsOn = createMemo(() => access(props.weekStartsOn) ?? DEFAULT_CALENDAR_WEEK_STARTS_ON);\n\n    const getMonth = createMemo(() => monthSignal[0]());\n\n    const getToday = createMemo(() =>\n        DateValueUtils.withCalendar(\n            access(props.today) ?? DateValueUtils.fromDate(new Date()),\n            DateValueUtils.getCalendarId(getMonth()),\n        ),\n    );\n\n    const getGrid = createMemo(() => DateValueUtils.getMonthGrid(getMonth(), getWeekStartsOn()));\n\n    const getCurrentEraId = createMemo(() => {\n        const eras = DateValueUtils.getEras(getMonth(), access(props.locale));\n\n        return eras[eras.length - 1].id;\n    });\n\n    const getDayLabelOptions = (day: DateValue) =>\n        day.era === getCurrentEraId() ? DAY_LABEL_OPTIONS : PAST_ERA_DAY_LABEL_OPTIONS;\n\n    const getGridStart = createMemo(() => getGrid().weeks[0][0]);\n\n    const getWeekdayNames = createMemo(() =>\n        DateValueUtils.getWeekdayNames(\n            getWeekStartsOn(),\n            access(props.weekdayWidth) ?? DEFAULT_CALENDAR_WEEKDAY_WIDTH,\n            access(props.locale),\n        ),\n    );\n\n    const getIsDayDisabled = (day: DateValue) =>\n        (access(props.isDisabled) ?? false) ||\n        !DateValueUtils.getIsInRange(day, access(props.min), access(props.max)) ||\n        (props.computeIsDayDisabled?.(day) ?? false);\n\n    const getRovingDay = createMemo(() => {\n        const highlighted = getHighlighted();\n\n        if (highlighted && DateValueUtils.getCellOf(getGrid(), highlighted)) return highlighted;\n\n        const anchor = props.computeAnchorDay?.();\n\n        if (anchor && DateValueUtils.getCellOf(getGrid(), anchor)) return anchor;\n\n        const today = getToday();\n\n        if (DateValueUtils.getCellOf(getGrid(), today)) return today;\n\n        return DateValueUtils.getStartOfMonth(getMonth());\n    });\n\n    const setDayRef = (index: number, element: HTMLElement) => {\n        setDayRefs((prev) => {\n            const next = [...prev];\n\n            next[index] = element;\n\n            return next;\n        });\n    };\n\n    const moveTo = (day: DateValue) => {\n        const clamped = DateValueUtils.clamp(day, access(props.min), access(props.max));\n\n        const month = DateValueUtils.getStartOfMonth(clamped);\n\n        setHighlighted(() => clamped);\n\n        if (!DateValueUtils.isSame(month, DateValueUtils.getStartOfMonth(getMonth()))) {\n            monthSignal[1](() => month);\n        }\n    };\n\n    const pickDay = (day: DateValue) => {\n        if (getIsDayDisabled(day)) return;\n\n        setHighlighted(() => day);\n        props.onPick(day);\n    };\n\n    const getPaintedRange = createMemo(() => props.computeRange?.(getRovingDay()));\n\n    createEffect(() => {\n        const anchor = props.computeAnchorDay?.();\n\n        if (!anchor) return;\n\n        setHighlighted(() => anchor);\n    });\n\n    createEffect<DateValue | undefined>((previous) => {\n        const month = getMonth();\n\n        if (\n            previous &&\n            !DateValueUtils.isSame(DateValueUtils.getStartOfMonth(previous), DateValueUtils.getStartOfMonth(month))\n        ) {\n            LiveAnnouncer.announce(\n                DateValueUtils.format(\n                    month,\n                    month.era === getCurrentEraId() ? MONTH_ANNOUNCE_OPTIONS : PAST_ERA_MONTH_ANNOUNCE_OPTIONS,\n                    access(props.locale),\n                ),\n            );\n        }\n\n        return month;\n    });\n\n    createEffect(() => {\n        const cell = DateValueUtils.getCellOf(getGrid(), getRovingDay());\n        const root = getRootRef();\n\n        if (!cell || !root?.contains(document.activeElement) || root === document.activeElement) return;\n\n        getDayRefs()[cell.y * DAYS_PER_WEEK + cell.x]?.focus();\n    });\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n        const roving = getRovingDay();\n\n        if (SELECT_KEYS.includes(e.key)) {\n            e.preventDefault();\n            pickDay(roving);\n\n            return;\n        }\n\n        if (e.key === \"PageUp\" || e.key === \"PageDown\") {\n            const direction = e.key === \"PageUp\" ? -1 : 1;\n\n            e.preventDefault();\n            moveTo(\n                e.shiftKey\n                    ? DateValueUtils.addYears(roving, direction * YEAR_STEP)\n                    : DateValueUtils.addMonths(roving, direction * MONTH_STEP),\n            );\n\n            return;\n        }\n\n        const cell = DateValueUtils.getCellOf(getGrid(), roving);\n\n        if (!cell) return;\n\n        const next = NavigatorUtils.computeNextCell(\n            e.key,\n            cell,\n            { width: DAYS_PER_WEEK, height: GRID_WEEKS },\n            { hasPageKeys: false },\n        );\n\n        if (!next) return;\n\n        e.preventDefault();\n        moveTo(DateValueUtils.addDays(getGridStart(), next.y * DAYS_PER_WEEK + next.x));\n    };\n\n    return (\n        <div\n            ref={setRootRef}\n            id={gridId}\n            class={styles.calendarRoot}\n            style={{ gap: `${access(props.gap) ?? DEFAULT_CALENDAR_GAP}px` }}\n            role=\"grid\"\n            aria-label={access(props.ariaLabel)}\n            aria-disabled={access(props.isDisabled) || undefined}\n            onKeyDown={handleKeyDown}\n        >\n            <div class={styles.calendarRow} role=\"row\">\n                <Index each={getWeekdayNames()}>\n                    {(getName, index) => (\n                        <div class={styles.calendarWeekday} role=\"columnheader\" aria-label={getName()}>\n                            {props.renderWeekday?.(getName(), index)}\n                        </div>\n                    )}\n                </Index>\n            </div>\n\n            <Index each={getGrid().weeks}>\n                {(getWeek, weekIndex) => (\n                    <div class={styles.calendarRow} role=\"row\">\n                        <Index each={getWeek()}>\n                            {(getDay, dayIndex) => (\n                                <InteractionWrapper\n                                    sizing={\"fill\"}\n                                    isDisabled={() => getIsDayDisabled(getDay())}\n                                    isTabbable={() => DateValueUtils.isSame(getDay(), getRovingDay())}\n                                    extraFlags={(): CalendarRenderProps => ({\n                                        day: getDay(),\n                                        isSelected: props.computeIsSelected(getDay()),\n                                        isToday: DateValueUtils.isSame(getDay(), getToday()),\n                                        isOutsideMonth: getDay().month !== getMonth().month,\n                                        isHighlighted: DateValueUtils.isSame(getDay(), getRovingDay()),\n                                        isInRange: DateValueUtils.getIsWithin(getDay(), getPaintedRange()),\n                                        isRangeStart: DateValueUtils.isSame(getDay(), getPaintedRange()?.start),\n                                        isRangeEnd: DateValueUtils.isSame(getDay(), getPaintedRange()?.end),\n                                    })}\n                                    ref={(element) => setDayRef(weekIndex * DAYS_PER_WEEK + dayIndex, element)}\n                                    renderControl={(setElementRef, getRenderProps) => (\n                                        <CalendarDay\n                                            ref={setElementRef}\n                                            id={() => `${gridId}-day-${DateValueUtils.toIso(getDay())}`}\n                                            flags={getRenderProps}\n                                            ariaLabel={() =>\n                                                DateValueUtils.format(\n                                                    getDay(),\n                                                    getDayLabelOptions(getDay()),\n                                                    access(props.locale),\n                                                )\n                                            }\n                                            renderContent={(getDayFlags) => props.renderDay(getDay, getDayFlags)}\n                                            onSelect={() => pickDay(getDay())}\n                                        />\n                                    )}\n                                />\n                            )}\n                        </Index>\n                    </div>\n                )}\n            </Index>\n        </div>\n    );\n};\n\nexport const Calendar = (props: CalendarProps) => {\n    const valueSignal = accessSignal(() => props.valueSignal);\n\n    return (\n        <CalendarComposite\n            {...props}\n            computeIsSelected={(day) => DateValueUtils.isSame(day, valueSignal[0]())}\n            computeAnchorDay={() => valueSignal[0]()}\n            onPick={(day) => valueSignal[1](() => day)}\n        />\n    );\n};\n"],"mappings":";;;;;;;;;;;;;AAgBA,IAAMmB,kCAAsD;AAC5D,IAAMC,iCAAwD;AAC9D,IAAMC,uBAAuB;AAC7B,IAAMC,gBAAgB;AACtB,IAAMC,aAAa;AACnB,IAAMC,aAAa;AACnB,IAAMC,YAAY;AAClB,IAAMC,cAAc,CAAC,SAAS,GAAG;AAEjC,IAAMC,oBAAgD;CAAEG,KAAK;CAAWC,OAAO;CAAQC,MAAM;AAAU;AACvG,IAAMC,yBAAqD;CAAEF,OAAO;CAAQC,MAAM;AAAU;AAC5F,IAAME,6BAAyD;CAAE,GAAGP;CAAmBQ,KAAK;AAAQ;AACpG,IAAMC,kCAA8D;CAAE,GAAGH;CAAwBE,KAAK;AAAQ;AAE9G,IAAME,eAAeC,UAA4B;CAC7C,MAAMC,sBAAsB5B,OAAO2B,MAAME,KAAK,CAAC,CAACC,cAAc;CAE9D,cAAA;EAAA,IAAAC,OAAAC,OAAA;EAAAD,KAAAE,gBAUuB;GACX,IAAIL,cAAc,GAAG;GAErBD,MAAMO,SAAS;EACnB;EAACC,KAXKC,YAAYT,MAAMU,MAAMD,OAAO,GAACL,IAAA;EAAAO,UAAAP,MAC/BxB,WAAkB;EAAAiC,OAAAT,YAYxBJ,MAAMc,oBAAoBzC,OAAO2B,MAAME,KAAK,CAAC,CAAC;EAAAa,QAAAC,QAAA;GAAA,IAAAC,MAd3C5C,OAAO2B,MAAMkB,EAAE,GAACC,OAIR9C,OAAO2B,MAAMoB,SAAS,GAACC,OACpBhD,OAAO2B,MAAME,KAAK,CAAC,CAACoB,YAAUC,OAC/BlD,OAAO2B,MAAME,KAAK,CAAC,CAACsB,UAAU,SAASC,KAAAA,GAASC,OAC/CzB,cAAc,KAAKwB,KAAAA;GAASR,QAAAD,IAAAW,KAAAC,aAAAxB,MAAA,MAAAY,IAAAW,IAAAV,GAAA;GAAAE,SAAAH,IAAAa,KAAAD,aAAAxB,MAAA,cAAAY,IAAAa,IAAAV,IAAA;GAAAE,SAAAL,IAAAc,KAAAF,aAAAxB,MAAA,iBAAAY,IAAAc,IAAAT,IAAA;GAAAE,SAAAP,IAAAe,KAAAH,aAAAxB,MAAA,gBAAAY,IAAAe,IAAAR,IAAA;GAAAG,SAAAV,IAAAgB,KAAAJ,aAAAxB,MAAA,iBAAAY,IAAAgB,IAAAN,IAAA;GAAA,OAAAV;EAAA,GAAA;GAAAW,GAAAF,KAAAA;GAAAI,GAAAJ,KAAAA;GAAAK,GAAAL,KAAAA;GAAAM,GAAAN,KAAAA;GAAAO,GAAAP,KAAAA;EAAA,CAAA;EAAA,OAAArB;CAAA,EAAA,CAAA;AAUvD;AAEA,IAAa6B,qBAAqBjC,UAAkC;CAChE,MAAMkC,cAAc5D,mBAAmB0B,MAAMkC,WAAW;CAExD,MAAMC,SAASrE,eAAe;CAE9B,MAAM,CAACsE,YAAYC,cAAcxE,aAA0B;CAC3D,MAAM,CAAC0E,YAAYC,cAAc3E,aAA0C,CAAA,CAAE;CAC7E,MAAM,CAAC4E,gBAAgBC,kBAAkB7E,aAAoC;CAE7E,MAAM8E,kBAAkB/E,iBAAiBS,OAAO2B,MAAM4C,YAAY,KAAK/D,+BAA+B;CAEtG,MAAMgE,WAAWjF,iBAAiBsE,YAAY,EAAE,CAAC,CAAC;CAElD,MAAMY,WAAWlF,iBACbM,eAAe6E,aACX1E,OAAO2B,MAAMgD,KAAK,KAAK9E,eAAe+E,yBAAS,IAAIC,KAAK,CAAC,GACzDhF,eAAeiF,cAAcN,SAAS,CAAC,CAC3C,CACJ;CAEA,MAAMO,UAAUxF,iBAAiBM,eAAemF,aAAaR,SAAS,GAAGF,gBAAgB,CAAC,CAAC;CAE3F,MAAMW,kBAAkB1F,iBAAiB;EACrC,MAAM2F,OAAOrF,eAAesF,QAAQX,SAAS,GAAGxE,OAAO2B,MAAMyD,MAAM,CAAC;EAEpE,OAAOF,KAAKA,KAAKG,SAAS,EAAE,CAACxC;CACjC,CAAC;CAED,MAAMyC,sBAAsBnE,QACxBA,IAAIK,QAAQyD,gBAAgB,IAAIjE,oBAAoBO;CAExD,MAAMgE,eAAehG,iBAAiBwF,QAAQ,CAAC,CAACS,MAAM,EAAE,CAAC,EAAE;CAE3D,MAAMC,kBAAkBlG,iBACpBM,eAAe4F,gBACXnB,gBAAgB,GAChBtE,OAAO2B,MAAM+D,YAAY,KAAKjF,gCAC9BT,OAAO2B,MAAMyD,MAAM,CACvB,CACJ;CAEA,MAAMO,oBAAoBxE,SACrBnB,OAAO2B,MAAMG,UAAU,KAAK,UAC7B,CAACjC,eAAe+F,aAAazE,KAAKnB,OAAO2B,MAAMkE,GAAG,GAAG7F,OAAO2B,MAAMmE,GAAG,CAAC,MACrEnE,MAAMoE,uBAAuB5E,GAAG,KAAK;CAE1C,MAAM6E,eAAezG,iBAAiB;EAClC,MAAM0G,cAAc7B,eAAe;EAEnC,IAAI6B,eAAepG,eAAeqG,UAAUnB,QAAQ,GAAGkB,WAAW,GAAG,OAAOA;EAE5E,MAAME,SAASxE,MAAMyE,mBAAmB;EAExC,IAAID,UAAUtG,eAAeqG,UAAUnB,QAAQ,GAAGoB,MAAM,GAAG,OAAOA;EAElE,MAAMxB,QAAQF,SAAS;EAEvB,IAAI5E,eAAeqG,UAAUnB,QAAQ,GAAGJ,KAAK,GAAG,OAAOA;EAEvD,OAAO9E,eAAewG,gBAAgB7B,SAAS,CAAC;CACpD,CAAC;CAED,MAAM8B,aAAaC,OAAenE,YAAyB;EACvD+B,YAAYqC,SAAS;GACjB,MAAMC,OAAO,CAAC,GAAGD,IAAI;GAErBC,KAAKF,SAASnE;GAEd,OAAOqE;EACX,CAAC;CACL;CAEA,MAAMC,UAAUvF,QAAmB;EAC/B,MAAMwF,UAAU9G,eAAe+G,MAAMzF,KAAKnB,OAAO2B,MAAMkE,GAAG,GAAG7F,OAAO2B,MAAMmE,GAAG,CAAC;EAE9E,MAAM1E,QAAQvB,eAAewG,gBAAgBM,OAAO;EAEpDtC,qBAAqBsC,OAAO;EAE5B,IAAI,CAAC9G,eAAegH,OAAOzF,OAAOvB,eAAewG,gBAAgB7B,SAAS,CAAC,CAAC,GACxEX,YAAY,EAAE,OAAOzC,KAAK;CAElC;CAEA,MAAM0F,WAAW3F,QAAmB;EAChC,IAAIwE,iBAAiBxE,GAAG,GAAG;EAE3BkD,qBAAqBlD,GAAG;EACxBQ,MAAMoF,OAAO5F,GAAG;CACpB;CAEA,MAAM6F,kBAAkBzH,iBAAiBoC,MAAMsF,eAAejB,aAAa,CAAC,CAAC;CAE7E1G,mBAAmB;EACf,MAAM6G,SAASxE,MAAMyE,mBAAmB;EAExC,IAAI,CAACD,QAAQ;EAEb9B,qBAAqB8B,MAAM;CAC/B,CAAC;CAED7G,cAAqC4H,aAAa;EAC9C,MAAM9F,QAAQoD,SAAS;EAEvB,IACI0C,YACA,CAACrH,eAAegH,OAAOhH,eAAewG,gBAAgBa,QAAQ,GAAGrH,eAAewG,gBAAgBjF,KAAK,CAAC,GAEtGtB,cAAcqH,SACVtH,eAAeuH,OACXhG,OACAA,MAAMI,QAAQyD,gBAAgB,IAAI3D,yBAAyBG,iCAC3DzB,OAAO2B,MAAMyD,MAAM,CACvB,CACJ;EAGJ,OAAOhE;CACX,CAAC;CAED9B,mBAAmB;EACf,MAAM+H,OAAOxH,eAAeqG,UAAUnB,QAAQ,GAAGiB,aAAa,CAAC;EAC/D,MAAMsB,OAAOvD,WAAW;EAExB,IAAI,CAACsD,QAAQ,CAACC,MAAMC,SAASC,SAASC,aAAa,KAAKH,SAASE,SAASC,eAAe;EAEzFvD,WAAW,CAAC,CAACmD,KAAKK,IAAI/G,gBAAgB0G,KAAKM,EAAE,EAAEC,MAAM;CACzD,CAAC;CAED,MAAMC,iBAAiBvE,MAAqB;EACxC,MAAMyE,SAAS/B,aAAa;EAE5B,IAAIjF,YAAYiH,SAAS1E,EAAE2E,GAAG,GAAG;GAC7B3E,EAAE4E,eAAe;GACjBpB,QAAQiB,MAAM;GAEd;EACJ;EAEA,IAAIzE,EAAE2E,QAAQ,YAAY3E,EAAE2E,QAAQ,YAAY;GAC5C,MAAME,YAAY7E,EAAE2E,QAAQ,WAAW,KAAK;GAE5C3E,EAAE4E,eAAe;GACjBxB,OACIpD,EAAE8E,WACIvI,eAAewI,SAASN,QAAQI,YAAYrH,SAAS,IACrDjB,eAAeyI,UAAUP,QAAQI,YAAYtH,UAAU,CACjE;GAEA;EACJ;EAEA,MAAMwG,OAAOxH,eAAeqG,UAAUnB,QAAQ,GAAGgD,MAAM;EAEvD,IAAI,CAACV,MAAM;EAEX,MAAMZ,OAAO1G,eAAewI,gBACxBjF,EAAE2E,KACFZ,MACA;GAAEmB,OAAO7H;GAAe8H,QAAQ7H;EAAW,GAC3C,EAAE8H,aAAa,MAAM,CACzB;EAEA,IAAI,CAACjC,MAAM;EAEXnD,EAAE4E,eAAe;EACjBxB,OAAO7G,eAAe8I,QAAQpD,aAAa,GAAGkB,KAAKiB,IAAI/G,gBAAgB8F,KAAKkB,CAAC,CAAC;CAClF;CAEA,cAAA;EAAA,IAAAiB,QAAAC,QAAA,GAAAC,QAAAF,MAAAG;EAAAH,MAAAI,YASmBnB;EAAa1F,IAPnB6B,YAAU4E,KAAA;EAAArF,aAAAqF,OAAA,MACX9E,MAAM;EAAAxB,UAAAsG,OACHrI,YAAmB;EAAA+B,UAAAwG,OAOdvI,WAAkB;EAAAiC,OAAAsG,OAAAK,gBACzB9J,OAAK;GAAA,IAAC+J,OAAI;IAAA,OAAE3D,gBAAgB;GAAC;GAAA4D,WACxBC,SAAS/C,iBAAK;IAAA,IAAAgD,QAAAC,QAAA;IAAAlH,UAAAiH,OACAhJ,eAAsB;IAAAiC,OAAA+G,aAC7B5H,MAAM+H,gBAAgBJ,QAAQ,GAAG/C,KAAK,CAAC;IAAA7D,aAAAa,aAAAgG,OAAA,cADwBD,QAAQ,CAAC,CAAA;IAAA,OAAAC;GAAA,EAAA,CAAA;EAGhF,CAAA,CAAA;EAAA/G,OAAAoG,OAAAO,gBAIR9J,OAAK;GAAA,IAAC+J,OAAI;IAAA,OAAErE,QAAQ,CAAC,CAACS;GAAK;GAAA6D,WACtBM,SAASC,qBAAS;IAAA,IAAAC,QAAAC,QAAA;IAAAxH,UAAAuH,OACJtJ,WAAkB;IAAAiC,OAAAqH,OAAAV,gBACzB9J,OAAK;KAAA,IAAC+J,OAAI;MAAA,OAAEO,QAAQ;KAAC;KAAAN,WAChBU,QAAQC,aAAQb,gBACbjJ,oBAAkB;MACf+J,QAAQ;MACRnI,kBAAkB6D,iBAAiBoE,OAAO,CAAC;MAC3CG,kBAAkBrK,eAAegH,OAAOkD,OAAO,GAAG/D,aAAa,CAAC;MAChEmE,mBAAwC;OACpChJ,KAAK4I,OAAO;OACZ9G,YAAYtB,MAAMyI,kBAAkBL,OAAO,CAAC;OAC5C5G,SAAStD,eAAegH,OAAOkD,OAAO,GAAGtF,SAAS,CAAC;OACnD4F,gBAAgBN,OAAO,CAAC,CAAC3I,UAAUoD,SAAS,CAAC,CAACpD;OAC9CkJ,eAAezK,eAAegH,OAAOkD,OAAO,GAAG/D,aAAa,CAAC;OAC7DuE,WAAW1K,eAAe2K,YAAYT,OAAO,GAAG/C,gBAAgB,CAAC;OACjEyD,cAAc5K,eAAegH,OAAOkD,OAAO,GAAG/C,gBAAgB,CAAC,EAAE0D,KAAK;OACtEC,YAAY9K,eAAegH,OAAOkD,OAAO,GAAG/C,gBAAgB,CAAC,EAAE4D,GAAG;MACtE;MAAEvI,MACID,YAAYkE,UAAUsD,YAAYjJ,gBAAgBqJ,UAAU5H,OAAO;MACzEyI,gBAAgBC,eAAeC,mBAAc5B,gBACxCzH,aAAW;OAAAW,IAAA2I,IAAA;QAAA,IAAAC,QACHH;QAAa,OAAAG,UAAA,aAAAA,MAAAD,EAAA,IAAbF,gBAAaE;OAAA;OAClBnI,UAAU,GAAGiB,OAAM,OAAQjE,eAAeqL,MAAMnB,OAAO,CAAC;OACxDlI,OAAOkJ;OACPhI,iBACIlD,eAAeuH,OACX2C,OAAO,GACPzE,mBAAmByE,OAAO,CAAC,GAC3B/J,OAAO2B,MAAMyD,MAAM,CACvB;OAEJ3C,gBAAgB0I,gBAAgBxJ,MAAMyJ,UAAUrB,QAAQoB,WAAW;OACnEjJ,gBAAgB4E,QAAQiD,OAAO,CAAC;MAAC,CAAA;KAExC,CAAA;IAER,CAAA,CAAA;IAAA,OAAAF;GAAA,EAAA,CAAA;EAGZ,CAAA,GAAA,IAAA;EAAAnH,QAAAC,QAAA;GAAA,IAAA0I,OAxDS,GAAGrL,OAAO2B,MAAM2J,GAAG,KAAK5K,qBAAoB,KAAI6K,OAElDvL,OAAO2B,MAAMoB,SAAS,GAACyI,OACpBxL,OAAO2B,MAAMG,UAAU,KAAKsB,KAAAA;GAASiI,SAAA1I,IAAAW,KAAAmI,iBAAA7C,OAAA,OAAAjG,IAAAW,IAAA+H,IAAA;GAAAE,SAAA5I,IAAAa,KAAAD,aAAAqF,OAAA,cAAAjG,IAAAa,IAAA+H,IAAA;GAAAC,SAAA7I,IAAAc,KAAAF,aAAAqF,OAAA,iBAAAjG,IAAAc,IAAA+H,IAAA;GAAA,OAAA7I;EAAA,GAAA;GAAAW,GAAAF,KAAAA;GAAAI,GAAAJ,KAAAA;GAAAK,GAAAL,KAAAA;EAAA,CAAA;EAAA,OAAAwF;CAAA,EAAA,CAAA;AAyDhE;AAEA,IAAa8C,YAAY/J,UAAyB;CAC9C,MAAMgK,cAAc1L,mBAAmB0B,MAAMgK,WAAW;CAExD,OAAAxC,gBACKvF,mBAAiBgI,WACVjK,OAAK;EACTyI,oBAAoBjJ,QAAQtB,eAAegH,OAAO1F,KAAKwK,YAAY,EAAE,CAAC,CAAC;EACvEvF,wBAAwBuF,YAAY,EAAE,CAAC;EACvC5E,SAAS5F,QAAQwK,YAAY,EAAE,OAAOxK,GAAG;CAAC,CAAA,CAAA;AAGtD;AAAE0K,eAAA,CAAA,SAAA,SAAA,CAAA"}

package/dist/Fundamentals/Input/Checkbox/Checkbox.js

@@ -0,0 +1,17 @@
+import { BinarySwitch } from "../BinarySwitch/BinarySwitch.js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Fundamentals/Input/Checkbox/Checkbox.tsx
+var Checkbox = (props) => {
+	return createComponent(BinarySwitch, mergeProps(props, {
+		type: "checkbox",
+		isChecked: () => props.checkedSignal[0](),
+		onChange: (isChecked) => {
+			props.checkedSignal[1](isChecked);
+			props.onChange?.(isChecked);
+		}
+	}));
+};
+//#endregion
+export { Checkbox };
+
+//# sourceMappingURL=Checkbox.js.map

package/dist/Fundamentals/Input/Checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","names":["BinarySwitch","CheckboxProps","Checkbox","props","_$createComponent","_$mergeProps","type","isChecked","checkedSignal","onChange"],"sources":["../../../../src/Fundamentals/Input/Checkbox/Checkbox.tsx"],"sourcesContent":["import { BinarySwitch } from \"../BinarySwitch/BinarySwitch\";\nimport type { CheckboxProps } from \"./Checkbox.types\";\n\nexport const Checkbox = (props: CheckboxProps) => {\n    return (\n        <BinarySwitch\n            {...props}\n            type={\"checkbox\"}\n            isChecked={() => props.checkedSignal[0]()}\n            onChange={(isChecked) => {\n                props.checkedSignal[1](isChecked);\n\n                void props.onChange?.(isChecked);\n            }}\n        />\n    );\n};\n"],"mappings":";;;AAGA,IAAaE,YAAYC,UAAyB;CAC9C,OAAAC,gBACKJ,cAAYK,WACLF,OAAK;EACTG,MAAM;EACNC,iBAAiBJ,MAAMK,cAAc,EAAE,CAAC;EACxCC,WAAWF,cAAc;GACrBJ,MAAMK,cAAc,EAAE,CAACD,SAAS;GAEhC,MAAWE,WAAWF,SAAS;EACnC;CAAC,CAAA,CAAA;AAGb"}

package/dist/Fundamentals/Input/Clock/Clock.css.js

@@ -0,0 +1,11 @@
+/* empty css                         */
+//#region src/Fundamentals/Input/Clock/Clock.css.ts
+var clockRoot = "_18k93d00";
+var clockColumn = "_18k93d01";
+var clockUnit = "_18k93d02";
+var clockList = "_18k93d03";
+var clockOption = "_18k93d04";
+//#endregion
+export { clockColumn, clockList, clockOption, clockRoot, clockUnit };
+
+//# sourceMappingURL=Clock.css.js.map

package/dist/Fundamentals/Input/Clock/Clock.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Clock.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/Clock/Clock.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const clockRoot = style({\n    display: \"flex\",\n    width: \"fit-content\",\n});\n\nexport const clockColumn = style({\n    display: \"flex\",\n    flexDirection: \"column\",\n});\n\nexport const clockUnit = style({\n    display: \"flex\",\n});\n\nexport const clockList = style({\n    display: \"flex\",\n    flexDirection: \"column\",\n});\n\nexport const clockOption = style({\n    display: \"flex\",\n    pointerEvents: \"all\",\n    width: \"100%\",\n\n    selectors: {\n        \"&:focus-visible\": {\n            zIndex: 1,\n        },\n    },\n});\n"],"mappings":""}