@thewaver/ss-components 0.0.1 → 0.0.2

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

@@ -0,0 +1 @@
+{"version":3,"file":"Label.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/Label/Label.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const labelRoot = style({\n    display: \"flex\",\n    alignItems: \"center\",\n    width: \"fit-content\",\n});\n"],"mappings":""}

package/dist/Fundamentals/Input/Label/Label.js

@@ -0,0 +1,36 @@
+import { access } from "../../../Utils/propUtils.js";
+import { LABEL_CONTEXT, LabelContextProvider, useLabelContext } from "./Label.context.js";
+import { labelRoot } from "./Label.css.js";
+import { createMemo } from "solid-js";
+import { Dynamic, createComponent } from "solid-js/web";
+//#region src/Fundamentals/Input/Label/Label.tsx
+var DEFAULT_LABEL_DIR = "row";
+var DEFAULT_LABEL_GAP = 10;
+var Label = (props) => {
+	const context = useLabelContext();
+	const getDir = createMemo(() => access(props.dir) ?? DEFAULT_LABEL_DIR);
+	return createComponent(Dynamic, {
+		get component() {
+			return context.getIsLabelled() ? "div" : "label";
+		},
+		"class": labelRoot,
+		get style() {
+			return {
+				"flex-direction": getDir(),
+				"gap": `${access(props.gap) ?? DEFAULT_LABEL_GAP}px`
+			};
+		},
+		get children() {
+			return createComponent(LabelContextProvider, {
+				value: LABEL_CONTEXT,
+				get children() {
+					return props.children;
+				}
+			});
+		}
+	});
+};
+//#endregion
+export { Label };
+
+//# sourceMappingURL=Label.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Label.js","names":["createMemo","Dynamic","access","LABEL_CONTEXT","LabelContextProvider","useLabelContext","LabelDir","LabelProps","styles","DEFAULT_LABEL_DIR","DEFAULT_LABEL_GAP","Label","props","context","getDir","dir","_$createComponent","component","getIsLabelled","labelRoot","style","gap","children","value"],"sources":["../../../../src/Fundamentals/Input/Label/Label.tsx"],"sourcesContent":["import { createMemo } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\n\nimport { access } from \"../../../Utils/propUtils\";\nimport { LABEL_CONTEXT, LabelContextProvider, useLabelContext } from \"./Label.context\";\nimport type { LabelDir, LabelProps } from \"./Label.types\";\n\nimport * as styles from \"./Label.css\";\n\nconst DEFAULT_LABEL_DIR: LabelDir = \"row\";\nconst DEFAULT_LABEL_GAP = 10;\n\nexport const Label = (props: LabelProps) => {\n    const context = useLabelContext();\n\n    const getDir = createMemo(() => access(props.dir) ?? DEFAULT_LABEL_DIR);\n\n    return (\n        <Dynamic\n            component={context.getIsLabelled() ? \"div\" : \"label\"}\n            class={styles.labelRoot}\n            style={{\n                \"flex-direction\": getDir(),\n                \"gap\": `${access(props.gap) ?? DEFAULT_LABEL_GAP}px`,\n            }}\n        >\n            <LabelContextProvider value={LABEL_CONTEXT}>{props.children}</LabelContextProvider>\n        </Dynamic>\n    );\n};\n"],"mappings":";;;;;;AASA,IAAMS,oBAA8B;AACpC,IAAMC,oBAAoB;AAE1B,IAAaC,SAASC,UAAsB;CACxC,MAAMC,UAAUR,gBAAgB;CAEhC,MAAMS,SAASd,iBAAiBE,OAAOU,MAAMG,GAAG,KAAKN,iBAAiB;CAEtE,OAAAO,gBACKf,SAAO;EAAA,IACJgB,YAAS;GAAA,OAAEJ,QAAQK,cAAc,IAAI,QAAQ;EAAO;EAAA,SAC7CV;EAAgB,IACvBY,QAAK;GAAA,OAAE;IACH,kBAAkBN,OAAO;IACzB,OAAO,GAAGZ,OAAOU,MAAMS,GAAG,KAAKX,kBAAiB;GACpD;EAAC;EAAA,IAAAY,WAAA;GAAA,OAAAN,gBAEAZ,sBAAoB;IAACmB,OAAOpB;IAAa,IAAAmB,WAAA;KAAA,OAAGV,MAAMU;IAAQ;GAAA,CAAA;EAAA;CAAA,CAAA;AAGvE"}

package/dist/Fundamentals/Input/Label/Label.utils.js

@@ -0,0 +1,14 @@
+import { useLabelContext } from "./Label.context.js";
+//#region src/Fundamentals/Input/Label/Label.utils.ts
+var LabelUtils;
+(function(_LabelUtils) {
+	_LabelUtils.resolveAriaLabel = (getAriaLabel) => {
+		const labelContext = useLabelContext();
+		if (labelContext.getIsLabelled() && getAriaLabel) console.warn("Label: getAriaLabel was given inside a Label, and is being ignored. An aria-label overrides the visible caption as the accessible name, which leaves the two disagreeing — drop one of them.");
+		return () => labelContext.getIsLabelled() ? void 0 : getAriaLabel?.();
+	};
+})(LabelUtils || (LabelUtils = {}));
+//#endregion
+export { LabelUtils };
+
+//# sourceMappingURL=Label.utils.js.map

package/dist/Fundamentals/Input/Label/Label.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Label.utils.js","names":[],"sources":["../../../../src/Fundamentals/Input/Label/Label.utils.ts"],"sourcesContent":["import { useLabelContext } from \"./Label.context\";\n\nexport namespace LabelUtils {\n    export const resolveAriaLabel = (getAriaLabel?: () => string) => {\n        const labelContext = useLabelContext();\n\n        if (labelContext.getIsLabelled() && getAriaLabel) {\n            console.warn(\n                \"Label: getAriaLabel was given inside a Label, and is being ignored. An aria-label overrides the visible caption as the accessible name, which leaves the two disagreeing — drop one of them.\",\n            );\n        }\n\n        return () => (labelContext.getIsLabelled() ? undefined : getAriaLabel?.());\n    };\n}\n"],"mappings":";;AAEO,IAAU;CAAV,SAAA,aAAA;CACU,YAAA,oBAAoB,iBAAgC;EAC7D,MAAM,eAAe,gBAAgB;EAErC,IAAI,aAAa,cAAc,KAAK,cAChC,QAAQ,KACJ,8LACJ;EAGJ,aAAc,aAAa,cAAc,IAAI,KAAA,IAAY,eAAe;CAC5E;AACH,EAAA,CAAA,eAAA,aAAA,CAAA,EAAD"}

package/dist/Fundamentals/Input/MultiSelect/MultiSelect.js

@@ -0,0 +1,31 @@
+import { access, accessSignal } from "../../../Utils/propUtils.js";
+import { SelectUtils } from "../Select/Select.utils.js";
+import { SelectComposite } from "../Select/Select.js";
+import { createMemo } from "solid-js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Fundamentals/Input/MultiSelect/MultiSelect.tsx
+var MultiSelect = (props) => {
+	const valuesSignal = accessSignal(() => props.valuesSignal);
+	const getSelectedOptions = createMemo(() => {
+		const selectedValues = valuesSignal[0]();
+		return SelectUtils.getFlatOptions(access(props.options)).filter((option) => selectedValues.includes(option.value));
+	});
+	return createComponent(SelectComposite, mergeProps(props, {
+		isMultiple: true,
+		selectedOptions: getSelectedOptions,
+		computeIsSelected: (value) => valuesSignal[0]().includes(value),
+		get renderContent() {
+			return props.renderContent;
+		},
+		onPick: (value) => {
+			const selectedValues = valuesSignal[0]();
+			const nextValues = selectedValues.includes(value) ? selectedValues.filter((selectedValue) => selectedValue !== value) : [...selectedValues, value];
+			valuesSignal[1](() => nextValues);
+			props.onSelectionChange?.(nextValues);
+		}
+	}));
+};
+//#endregion
+export { MultiSelect };
+
+//# sourceMappingURL=MultiSelect.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MultiSelect.js","names":["createMemo","access","accessSignal","SelectComposite","SelectUtils","MultiSelectProps","MultiSelect","props","T","valuesSignal","getSelectedOptions","selectedValues","getFlatOptions","options","filter","option","includes","value","_$createComponent","_$mergeProps","isMultiple","selectedOptions","computeIsSelected","renderContent","onPick","nextValues","selectedValue","onSelectionChange"],"sources":["../../../../src/Fundamentals/Input/MultiSelect/MultiSelect.tsx"],"sourcesContent":["import { createMemo } from \"solid-js\";\r\n\r\nimport { access, accessSignal } from \"../../../Utils/propUtils\";\r\nimport { SelectComposite } from \"../Select/Select\";\r\nimport { SelectUtils } from \"../Select/Select.utils\";\r\nimport type { MultiSelectProps } from \"./MultiSelect.types\";\r\n\r\nexport const MultiSelect = <T,>(props: MultiSelectProps<T>) => {\r\n    const valuesSignal = accessSignal(() => props.valuesSignal);\r\n\r\n    const getSelectedOptions = createMemo(() => {\r\n        const selectedValues = valuesSignal[0]();\r\n\r\n        return SelectUtils.getFlatOptions(access(props.options)).filter((option) =>\r\n            selectedValues.includes(option.value),\r\n        );\r\n    });\r\n\r\n    return (\r\n        <SelectComposite\r\n            {...props}\r\n            isMultiple={true}\r\n            selectedOptions={getSelectedOptions}\r\n            computeIsSelected={(value) => valuesSignal[0]().includes(value)}\r\n            renderContent={props.renderContent}\r\n            onPick={(value) => {\r\n                const selectedValues = valuesSignal[0]();\r\n                const nextValues = selectedValues.includes(value)\r\n                    ? selectedValues.filter((selectedValue) => selectedValue !== value)\r\n                    : [...selectedValues, value];\r\n\r\n                valuesSignal[1](() => nextValues);\r\n\r\n                void props.onSelectionChange?.(nextValues);\r\n            }}\r\n        />\r\n    );\r\n};\r\n"],"mappings":";;;;;;AAOA,IAAaM,eAAmBC,UAA+B;CAC3D,MAAME,eAAeP,mBAAmBK,MAAME,YAAY;CAE1D,MAAMC,qBAAqBV,iBAAiB;EACxC,MAAMW,iBAAiBF,aAAa,EAAE,CAAC;EAEvC,OAAOL,YAAYQ,eAAeX,OAAOM,MAAMM,OAAO,CAAC,CAAC,CAACC,QAAQC,WAC7DJ,eAAeK,SAASD,OAAOE,KAAK,CACxC;CACJ,CAAC;CAED,OAAAC,gBACKf,iBAAegB,WACRZ,OAAK;EACTa,YAAY;EACZC,iBAAiBX;EACjBY,oBAAoBL,UAAUR,aAAa,EAAE,CAAC,CAAC,CAACO,SAASC,KAAK;EAAC,IAC/DM,gBAAa;GAAA,OAAEhB,MAAMgB;EAAa;EAClCC,SAASP,UAAU;GACf,MAAMN,iBAAiBF,aAAa,EAAE,CAAC;GACvC,MAAMgB,aAAad,eAAeK,SAASC,KAAK,IAC1CN,eAAeG,QAAQY,kBAAkBA,kBAAkBT,KAAK,IAChE,CAAC,GAAGN,gBAAgBM,KAAK;GAE/BR,aAAa,EAAE,OAAOgB,UAAU;GAEhC,MAAWE,oBAAoBF,UAAU;EAC7C;CAAC,CAAA,CAAA;AAGb"}

package/dist/Fundamentals/Input/NumberInput/NumberInput.js

@@ -0,0 +1,117 @@
+import { access } from "../../../Utils/propUtils.js";
+import { TextField } from "../TextField/TextField.js";
+import { NumberInputUtils } from "./NumberInput.utils.js";
+import { createEffect, createMemo, createSignal, onCleanup, untrack } from "solid-js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Fundamentals/Input/NumberInput/NumberInput.tsx
+var DEFAULT_NUMBER_INPUT_STEP = 1;
+var DEFAULT_NUMBER_INPUT_MODE = "decimal";
+var DEFAULT_NUMBER_INPUT_REPEAT_DELAY_MS = 400;
+var DEFAULT_NUMBER_INPUT_REPEAT_INTERVAL_MS = 60;
+var NumberInput = (props) => {
+	const textSignal = createSignal(NumberInputUtils.formatValue(props.valueSignal[0]()));
+	const getStepDefs = createMemo(() => ({
+		min: access(props.min),
+		max: access(props.max),
+		step: access(props.step) ?? DEFAULT_NUMBER_INPUT_STEP
+	}));
+	const getIsWritable = () => !(access(props.isDisabled) ?? false) && !(access(props.isReadOnly) ?? false);
+	const getTypedValue = () => NumberInputUtils.parseValue(textSignal[0]());
+	const getHasRangeIssue = () => {
+		const value = getTypedValue();
+		return value !== void 0 && !NumberInputUtils.getIsInRange(value, getStepDefs());
+	};
+	const reportValue = (value) => {
+		props.valueSignal[1](value);
+		props.onInput?.(value);
+	};
+	const applyValue = (value) => {
+		textSignal[1](NumberInputUtils.formatValue(value));
+		reportValue(value);
+	};
+	const stepValue = (direction) => {
+		if (!getIsWritable()) return;
+		applyValue(NumberInputUtils.computeStep(getTypedValue(), direction, getStepDefs()));
+	};
+	let repeatDelay;
+	let repeatInterval;
+	const stopStepping = () => {
+		clearTimeout(repeatDelay);
+		clearInterval(repeatInterval);
+		repeatDelay = void 0;
+		repeatInterval = void 0;
+	};
+	const startStepping = (direction) => {
+		stopStepping();
+		stepValue(direction);
+		repeatDelay = setTimeout(() => {
+			repeatInterval = setInterval(() => stepValue(direction), access(props.repeatIntervalMs) ?? DEFAULT_NUMBER_INPUT_REPEAT_INTERVAL_MS);
+		}, access(props.repeatDelayMs) ?? DEFAULT_NUMBER_INPUT_REPEAT_DELAY_MS);
+	};
+	onCleanup(stopStepping);
+	const stepper = {
+		getIsAtMin: () => {
+			const value = getTypedValue();
+			const min = getStepDefs().min;
+			return min !== void 0 && value !== void 0 && value <= min;
+		},
+		getIsAtMax: () => {
+			const value = getTypedValue();
+			const max = getStepDefs().max;
+			return max !== void 0 && value !== void 0 && value >= max;
+		},
+		stepUp: () => stepValue(1),
+		stepDown: () => stepValue(-1),
+		startSteppingUp: () => startStepping(1),
+		startSteppingDown: () => startStepping(-1),
+		stopStepping
+	};
+	createEffect(() => {
+		const value = props.valueSignal[0]();
+		if (NumberInputUtils.parseValue(untrack(textSignal[0])) === value) return;
+		textSignal[1](NumberInputUtils.formatValue(value));
+	});
+	return createComponent(TextField, mergeProps(props, {
+		valueSignal: textSignal,
+		element: "input",
+		type: "text",
+		inputMode: () => access(props.inputMode) ?? DEFAULT_NUMBER_INPUT_MODE,
+		isSpinButton: true,
+		hasError: () => (access(props.hasError) ?? false) || getHasRangeIssue(),
+		get renderTrailing() {
+			return props.renderTrailing && ((getFlags) => props.renderTrailing(getFlags, stepper));
+		},
+		onInput: (text) => {
+			const sanitized = NumberInputUtils.sanitizeText(text);
+			textSignal[1](sanitized);
+			const value = NumberInputUtils.parseValue(sanitized);
+			if (value !== void 0 && !NumberInputUtils.getIsInRange(value, getStepDefs())) return;
+			reportValue(value);
+		},
+		onKeyDown: (e) => {
+			if (!getIsWritable()) return;
+			const { min, max } = getStepDefs();
+			if (e.key === "ArrowUp") {
+				e.preventDefault();
+				stepValue(1);
+			} else if (e.key === "ArrowDown") {
+				e.preventDefault();
+				stepValue(-1);
+			} else if (e.key === "Home" && min !== void 0) {
+				e.preventDefault();
+				applyValue(min);
+			} else if (e.key === "End" && max !== void 0) {
+				e.preventDefault();
+				applyValue(max);
+			}
+		},
+		onBlur: () => {
+			const value = getTypedValue();
+			applyValue(value === void 0 ? void 0 : NumberInputUtils.clampValue(value, getStepDefs()));
+		}
+	}));
+};
+//#endregion
+export { NumberInput };
+
+//# sourceMappingURL=NumberInput.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","names":["createEffect","createMemo","createSignal","onCleanup","untrack","access","TextField","TextFieldMode","NumberInputProps","NumberInputStepDefs","NumberInputStepper","NumberInputUtils","DEFAULT_NUMBER_INPUT_STEP","DEFAULT_NUMBER_INPUT_MODE","DEFAULT_NUMBER_INPUT_REPEAT_DELAY_MS","DEFAULT_NUMBER_INPUT_REPEAT_INTERVAL_MS","NumberInput","props","textSignal","formatValue","valueSignal","getStepDefs","min","max","step","getIsWritable","isDisabled","isReadOnly","getTypedValue","parseValue","getHasRangeIssue","value","undefined","getIsInRange","reportValue","onInput","applyValue","stepValue","direction","computeStep","repeatDelay","ReturnType","setTimeout","repeatInterval","setInterval","stopStepping","clearTimeout","clearInterval","startStepping","repeatIntervalMs","repeatDelayMs","stepper","getIsAtMin","getIsAtMax","stepUp","stepDown","startSteppingUp","startSteppingDown","_$createComponent","_$mergeProps","element","type","inputMode","isSpinButton","hasError","renderTrailing","getFlags","text","sanitized","sanitizeText","onKeyDown","e","key","preventDefault","onBlur","clampValue"],"sources":["../../../../src/Fundamentals/Input/NumberInput/NumberInput.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, onCleanup, untrack } from \"solid-js\";\r\n\r\nimport { access } from \"../../../Utils/propUtils\";\r\nimport { TextField } from \"../TextField/TextField\";\r\nimport type { TextFieldMode } from \"../TextField/TextField.types\";\r\nimport type { NumberInputProps, NumberInputStepDefs, NumberInputStepper } from \"./NumberInput.types\";\r\nimport { NumberInputUtils } from \"./NumberInput.utils\";\r\n\r\nconst DEFAULT_NUMBER_INPUT_STEP = 1;\r\nconst DEFAULT_NUMBER_INPUT_MODE: TextFieldMode = \"decimal\";\r\nconst DEFAULT_NUMBER_INPUT_REPEAT_DELAY_MS = 400;\r\nconst DEFAULT_NUMBER_INPUT_REPEAT_INTERVAL_MS = 60;\r\n\r\nexport const NumberInput = (props: NumberInputProps) => {\r\n    const textSignal = createSignal(NumberInputUtils.formatValue(props.valueSignal[0]()));\r\n\r\n    const getStepDefs = createMemo((): NumberInputStepDefs => ({\r\n        min: access(props.min),\r\n        max: access(props.max),\r\n        step: access(props.step) ?? DEFAULT_NUMBER_INPUT_STEP,\r\n    }));\r\n\r\n    const getIsWritable = () => !(access(props.isDisabled) ?? false) && !(access(props.isReadOnly) ?? false);\r\n\r\n    const getTypedValue = () => NumberInputUtils.parseValue(textSignal[0]());\r\n\r\n    const getHasRangeIssue = () => {\r\n        const value = getTypedValue();\r\n\r\n        return value !== undefined && !NumberInputUtils.getIsInRange(value, getStepDefs());\r\n    };\r\n\r\n    const reportValue = (value: number | undefined) => {\r\n        props.valueSignal[1](value);\r\n\r\n        void props.onInput?.(value);\r\n    };\r\n\r\n    const applyValue = (value: number | undefined) => {\r\n        textSignal[1](NumberInputUtils.formatValue(value));\r\n\r\n        reportValue(value);\r\n    };\r\n\r\n    const stepValue = (direction: 1 | -1) => {\r\n        if (!getIsWritable()) return;\r\n\r\n        applyValue(NumberInputUtils.computeStep(getTypedValue(), direction, getStepDefs()));\r\n    };\r\n\r\n    let repeatDelay: ReturnType<typeof setTimeout> | undefined;\r\n    let repeatInterval: ReturnType<typeof setInterval> | undefined;\r\n\r\n    const stopStepping = () => {\r\n        clearTimeout(repeatDelay);\r\n        clearInterval(repeatInterval);\r\n\r\n        repeatDelay = undefined;\r\n        repeatInterval = undefined;\r\n    };\r\n\r\n    const startStepping = (direction: 1 | -1) => {\r\n        stopStepping();\r\n        stepValue(direction);\r\n\r\n        repeatDelay = setTimeout(\r\n            () => {\r\n                repeatInterval = setInterval(\r\n                    () => stepValue(direction),\r\n                    access(props.repeatIntervalMs) ?? DEFAULT_NUMBER_INPUT_REPEAT_INTERVAL_MS,\r\n                );\r\n            },\r\n            access(props.repeatDelayMs) ?? DEFAULT_NUMBER_INPUT_REPEAT_DELAY_MS,\r\n        );\r\n    };\r\n\r\n    onCleanup(stopStepping);\r\n\r\n    const stepper: NumberInputStepper = {\r\n        getIsAtMin: () => {\r\n            const value = getTypedValue();\r\n            const min = getStepDefs().min;\r\n\r\n            return min !== undefined && value !== undefined && value <= min;\r\n        },\r\n        getIsAtMax: () => {\r\n            const value = getTypedValue();\r\n            const max = getStepDefs().max;\r\n\r\n            return max !== undefined && value !== undefined && value >= max;\r\n        },\r\n        stepUp: () => stepValue(1),\r\n        stepDown: () => stepValue(-1),\r\n        startSteppingUp: () => startStepping(1),\r\n        startSteppingDown: () => startStepping(-1),\r\n        stopStepping,\r\n    };\r\n\r\n    createEffect(() => {\r\n        const value = props.valueSignal[0]();\r\n\r\n        if (NumberInputUtils.parseValue(untrack(textSignal[0])) === value) return;\r\n\r\n        textSignal[1](NumberInputUtils.formatValue(value));\r\n    });\r\n\r\n    return (\r\n        <TextField\r\n            {...props}\r\n            valueSignal={textSignal}\r\n            element={\"input\"}\r\n            type={\"text\"}\r\n            inputMode={() => access(props.inputMode) ?? DEFAULT_NUMBER_INPUT_MODE}\r\n            isSpinButton={true}\r\n            hasError={() => (access(props.hasError) ?? false) || getHasRangeIssue()}\r\n            renderTrailing={props.renderTrailing && ((getFlags) => props.renderTrailing!(getFlags, stepper))}\r\n            onInput={(text) => {\r\n                const sanitized = NumberInputUtils.sanitizeText(text);\r\n\r\n                textSignal[1](sanitized);\r\n\r\n                const value = NumberInputUtils.parseValue(sanitized);\r\n\r\n                if (value !== undefined && !NumberInputUtils.getIsInRange(value, getStepDefs())) return;\r\n\r\n                reportValue(value);\r\n            }}\r\n            onKeyDown={(e) => {\r\n                if (!getIsWritable()) return;\r\n\r\n                const { min, max } = getStepDefs();\r\n\r\n                if (e.key === \"ArrowUp\") {\r\n                    e.preventDefault();\r\n                    stepValue(1);\r\n                } else if (e.key === \"ArrowDown\") {\r\n                    e.preventDefault();\r\n                    stepValue(-1);\r\n                } else if (e.key === \"Home\" && min !== undefined) {\r\n                    e.preventDefault();\r\n                    applyValue(min);\r\n                } else if (e.key === \"End\" && max !== undefined) {\r\n                    e.preventDefault();\r\n                    applyValue(max);\r\n                }\r\n            }}\r\n            onBlur={() => {\r\n                const value = getTypedValue();\r\n\r\n                applyValue(value === undefined ? undefined : NumberInputUtils.clampValue(value, getStepDefs()));\r\n            }}\r\n        />\r\n    );\r\n};\r\n"],"mappings":"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"}

package/dist/Fundamentals/Input/NumberInput/NumberInput.utils.js

@@ -0,0 +1,62 @@
+import { MathUtils } from "@thewaver/ss-utils";
+//#region src/Fundamentals/Input/NumberInput/NumberInput.utils.ts
+var MAX_STEP_DECIMALS = 12;
+var EXPONENT_CHARACTERS = "eE";
+var getDecimalCount = (value) => {
+	const [mantissa, exponent] = String(Math.abs(value)).split(/[eE]/);
+	const fraction = mantissa.split(".")[1]?.length ?? 0;
+	return Math.max(fraction - Number(exponent ?? 0), 0);
+};
+var NumberInputUtils;
+(function(_NumberInputUtils) {
+	_NumberInputUtils.sanitizeText = (text) => {
+		let result = "";
+		let hasPoint = false;
+		let hasExponent = false;
+		let hasDigit = false;
+		for (const character of text) {
+			const previous = result[result.length - 1] ?? "";
+			const isAfterExponent = hasExponent && EXPONENT_CHARACTERS.includes(previous);
+			if (character >= "0" && character <= "9") {
+				result += character;
+				if (!hasExponent) hasDigit = true;
+			} else if (character === "-" && (result === "" || isAfterExponent)) result += character;
+			else if (character === "+" && isAfterExponent) result += character;
+			else if (character === "." && !hasPoint && !hasExponent) {
+				result += character;
+				hasPoint = true;
+			} else if (EXPONENT_CHARACTERS.includes(character) && !hasExponent && hasDigit) {
+				result += character;
+				hasExponent = true;
+			}
+		}
+		return result;
+	};
+	_NumberInputUtils.parseValue = (text) => {
+		if (text === "") return void 0;
+		const parsed = Number(text);
+		return Number.isFinite(parsed) ? parsed : void 0;
+	};
+	_NumberInputUtils.formatValue = (value) => value === void 0 ? "" : String(value);
+	_NumberInputUtils.getIsInRange = (value, defs) => (defs.min === void 0 || value >= defs.min) && (defs.max === void 0 || value <= defs.max);
+	const clampValue = _NumberInputUtils.clampValue = (value, defs) => {
+		const floored = defs.min === void 0 ? value : Math.max(value, defs.min);
+		return defs.max === void 0 ? floored : Math.min(floored, defs.max);
+	};
+	_NumberInputUtils.computeStep = (value, direction, defs) => {
+		const base = defs.min ?? 0;
+		if (value === void 0) return clampValue(base, defs);
+		const decimals = Math.min(Math.max(getDecimalCount(defs.step), getDecimalCount(base), getDecimalCount(value)), MAX_STEP_DECIMALS);
+		const scale = 10 ** decimals;
+		const stepUnits = Math.round(defs.step * scale);
+		if (stepUnits <= 0) return clampValue(value, defs);
+		const offsetUnits = Math.round((value - base) * scale);
+		const remainder = (offsetUnits % stepUnits + stepUnits) % stepUnits;
+		const nextUnits = remainder === 0 ? offsetUnits + direction * stepUnits : offsetUnits - remainder + (direction > 0 ? stepUnits : 0);
+		return clampValue(MathUtils.roundToDecimalPlaces(base + nextUnits / scale, decimals), defs);
+	};
+})(NumberInputUtils || (NumberInputUtils = {}));
+//#endregion
+export { NumberInputUtils };
+
+//# sourceMappingURL=NumberInput.utils.js.map

package/dist/Fundamentals/Input/NumberInput/NumberInput.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.utils.js","names":[],"sources":["../../../../src/Fundamentals/Input/NumberInput/NumberInput.utils.ts"],"sourcesContent":["import { MathUtils } from \"@thewaver/ss-utils\";\r\n\r\nimport type { NumberInputRangeDefs, NumberInputStepDefs } from \"./NumberInput.types\";\r\n\r\nconst MAX_STEP_DECIMALS = 12;\r\n\r\nconst EXPONENT_CHARACTERS = \"eE\";\r\n\r\nconst getDecimalCount = (value: number) => {\r\n    const [mantissa, exponent] = String(Math.abs(value)).split(/[eE]/);\r\n    const fraction = mantissa.split(\".\")[1]?.length ?? 0;\r\n\r\n    return Math.max(fraction - Number(exponent ?? 0), 0);\r\n};\r\n\r\nexport namespace NumberInputUtils {\r\n    export const sanitizeText = (text: string) => {\r\n        let result = \"\";\r\n        let hasPoint = false;\r\n        let hasExponent = false;\r\n        let hasDigit = false;\r\n\r\n        for (const character of text) {\r\n            const previous = result[result.length - 1] ?? \"\";\r\n            const isAfterExponent = hasExponent && EXPONENT_CHARACTERS.includes(previous);\r\n\r\n            if (character >= \"0\" && character <= \"9\") {\r\n                result += character;\r\n\r\n                if (!hasExponent) hasDigit = true;\r\n            } else if (character === \"-\" && (result === \"\" || isAfterExponent)) {\r\n                result += character;\r\n            } else if (character === \"+\" && isAfterExponent) {\r\n                result += character;\r\n            } else if (character === \".\" && !hasPoint && !hasExponent) {\r\n                result += character;\r\n                hasPoint = true;\r\n            } else if (EXPONENT_CHARACTERS.includes(character) && !hasExponent && hasDigit) {\r\n                result += character;\r\n                hasExponent = true;\r\n            }\r\n        }\r\n\r\n        return result;\r\n    };\r\n\r\n    export const parseValue = (text: string) => {\r\n        if (text === \"\") return undefined;\r\n\r\n        const parsed = Number(text);\r\n\r\n        return Number.isFinite(parsed) ? parsed : undefined;\r\n    };\r\n\r\n    export const formatValue = (value: number | undefined) => (value === undefined ? \"\" : String(value));\r\n\r\n    export const getIsInRange = (value: number, defs: NumberInputRangeDefs) =>\r\n        (defs.min === undefined || value >= defs.min) && (defs.max === undefined || value <= defs.max);\r\n\r\n    export const clampValue = (value: number, defs: NumberInputRangeDefs) => {\r\n        const floored = defs.min === undefined ? value : Math.max(value, defs.min);\r\n\r\n        return defs.max === undefined ? floored : Math.min(floored, defs.max);\r\n    };\r\n\r\n    export const computeStep = (value: number | undefined, direction: 1 | -1, defs: NumberInputStepDefs) => {\r\n        const base = defs.min ?? 0;\r\n\r\n        if (value === undefined) return clampValue(base, defs);\r\n\r\n        const decimals = Math.min(\r\n            Math.max(getDecimalCount(defs.step), getDecimalCount(base), getDecimalCount(value)),\r\n            MAX_STEP_DECIMALS,\r\n        );\r\n        const scale = 10 ** decimals;\r\n        const stepUnits = Math.round(defs.step * scale);\r\n\r\n        if (stepUnits <= 0) return clampValue(value, defs);\r\n\r\n        const offsetUnits = Math.round((value - base) * scale);\r\n        const remainder = ((offsetUnits % stepUnits) + stepUnits) % stepUnits;\r\n        const nextUnits =\r\n            remainder === 0\r\n                ? offsetUnits + direction * stepUnits\r\n                : offsetUnits - remainder + (direction > 0 ? stepUnits : 0);\r\n\r\n        return clampValue(MathUtils.roundToDecimalPlaces(base + nextUnits / scale, decimals), defs);\r\n    };\r\n}\r\n"],"mappings":";;AAIA,IAAM,oBAAoB;AAE1B,IAAM,sBAAsB;AAE5B,IAAM,mBAAmB,UAAkB;CACvC,MAAM,CAAC,UAAU,YAAY,OAAO,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,MAAM,MAAM;CACjE,MAAM,WAAW,SAAS,MAAM,GAAG,CAAC,CAAC,EAAE,EAAE,UAAU;CAEnD,OAAO,KAAK,IAAI,WAAW,OAAO,YAAY,CAAC,GAAG,CAAC;AACvD;AAEO,IAAU;CAAV,SAAA,mBAAA;CACU,kBAAA,gBAAgB,SAAiB;EAC1C,IAAI,SAAS;EACb,IAAI,WAAW;EACf,IAAI,cAAc;EAClB,IAAI,WAAW;EAEf,KAAK,MAAM,aAAa,MAAM;GAC1B,MAAM,WAAW,OAAO,OAAO,SAAS,MAAM;GAC9C,MAAM,kBAAkB,eAAe,oBAAoB,SAAS,QAAQ;GAE5E,IAAI,aAAa,OAAO,aAAa,KAAK;IACtC,UAAU;IAEV,IAAI,CAAC,aAAa,WAAW;GACjC,OAAO,IAAI,cAAc,QAAQ,WAAW,MAAM,kBAC9C,UAAU;QACP,IAAI,cAAc,OAAO,iBAC5B,UAAU;QACP,IAAI,cAAc,OAAO,CAAC,YAAY,CAAC,aAAa;IACvD,UAAU;IACV,WAAW;GACf,OAAO,IAAI,oBAAoB,SAAS,SAAS,KAAK,CAAC,eAAe,UAAU;IAC5E,UAAU;IACV,cAAc;GAClB;EACJ;EAEA,OAAO;CACX;CAEa,kBAAA,cAAc,SAAiB;EACxC,IAAI,SAAS,IAAI,OAAO,KAAA;EAExB,MAAM,SAAS,OAAO,IAAI;EAE1B,OAAO,OAAO,SAAS,MAAM,IAAI,SAAS,KAAA;CAC9C;CAEa,kBAAA,eAAe,UAA+B,UAAU,KAAA,IAAY,KAAK,OAAO,KAAK;CAErF,kBAAA,gBAAgB,OAAe,UACvC,KAAK,QAAQ,KAAA,KAAa,SAAS,KAAK,SAAS,KAAK,QAAQ,KAAA,KAAa,SAAS,KAAK;CAEvF,MAAM,aAAA,kBAAA,cAAc,OAAe,SAA+B;EACrE,MAAM,UAAU,KAAK,QAAQ,KAAA,IAAY,QAAQ,KAAK,IAAI,OAAO,KAAK,GAAG;EAEzE,OAAO,KAAK,QAAQ,KAAA,IAAY,UAAU,KAAK,IAAI,SAAS,KAAK,GAAG;CACxE;CAEa,kBAAA,eAAe,OAA2B,WAAmB,SAA8B;EACpG,MAAM,OAAO,KAAK,OAAO;EAEzB,IAAI,UAAU,KAAA,GAAW,OAAO,WAAW,MAAM,IAAI;EAErD,MAAM,WAAW,KAAK,IAClB,KAAK,IAAI,gBAAgB,KAAK,IAAI,GAAG,gBAAgB,IAAI,GAAG,gBAAgB,KAAK,CAAC,GAClF,iBACJ;EACA,MAAM,QAAQ,MAAM;EACpB,MAAM,YAAY,KAAK,MAAM,KAAK,OAAO,KAAK;EAE9C,IAAI,aAAa,GAAG,OAAO,WAAW,OAAO,IAAI;EAEjD,MAAM,cAAc,KAAK,OAAO,QAAQ,QAAQ,KAAK;EACrD,MAAM,aAAc,cAAc,YAAa,aAAa;EAC5D,MAAM,YACF,cAAc,IACR,cAAc,YAAY,YAC1B,cAAc,aAAa,YAAY,IAAI,YAAY;EAEjE,OAAO,WAAW,UAAU,qBAAqB,OAAO,YAAY,OAAO,QAAQ,GAAG,IAAI;CAC9F;AACH,EAAA,CAAA,qBAAA,mBAAA,CAAA,EAAD"}

package/dist/Fundamentals/Input/Radio/Radio.js

@@ -0,0 +1,37 @@
+import { access } from "../../../Utils/propUtils.js";
+import { InteractionTracker } from "../../../Abstracts/InteractionTracker/InteractionTracker.js";
+import { BinarySwitch } from "../BinarySwitch/BinarySwitch.js";
+import { useRadioGroupContext } from "../RadioGroup/RadioGroup.context.js";
+import { createSignal } from "solid-js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Fundamentals/Input/Radio/Radio.tsx
+var Radio = (props) => {
+	const getValue = () => access(props.value);
+	const context = useRadioGroupContext();
+	const [getElementRef, setElementRef] = createSignal();
+	const getIsDisabled = () => access(props.isDisabled) ?? false;
+	const getIsReachable = () => InteractionTracker.computeIsReachable(getIsDisabled(), access(props.isReachableWhenDisabled) ?? false, props.tooltipDefs !== void 0);
+	context.register({
+		getElementRef,
+		getIsDisabled,
+		getIsReachable,
+		getValue
+	});
+	return createComponent(BinarySwitch, mergeProps(props, {
+		ref: setElementRef,
+		type: "radio",
+		get name() {
+			return context.getName;
+		},
+		isChecked: () => context.getValue() === getValue(),
+		isTabbable: () => context.computeIsTabbable(getValue()),
+		onChange: (isChecked) => {
+			context.setValue(getValue());
+			props.onChange?.(isChecked);
+		}
+	}));
+};
+//#endregion
+export { Radio };
+
+//# sourceMappingURL=Radio.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Radio.js","names":["createSignal","InteractionTracker","access","BinarySwitch","useRadioGroupContext","RadioProps","Radio","props","T","getValue","value","context","getElementRef","setElementRef","HTMLElement","getIsDisabled","isDisabled","getIsReachable","computeIsReachable","isReachableWhenDisabled","tooltipDefs","undefined","register","_$createComponent","_$mergeProps","ref","type","name","getName","isChecked","isTabbable","computeIsTabbable","onChange","setValue"],"sources":["../../../../src/Fundamentals/Input/Radio/Radio.tsx"],"sourcesContent":["import { createSignal } from \"solid-js\";\n\nimport { InteractionTracker } from \"../../../Abstracts/InteractionTracker/InteractionTracker\";\nimport { access } from \"../../../Utils/propUtils\";\nimport { BinarySwitch } from \"../BinarySwitch/BinarySwitch\";\nimport { useRadioGroupContext } from \"../RadioGroup/RadioGroup.context\";\nimport type { RadioProps } from \"./Radio.types\";\n\nexport const Radio = <T,>(props: RadioProps<T>) => {\n    const getValue = () => access(props.value);\n\n    const context = useRadioGroupContext();\n\n    const [getElementRef, setElementRef] = createSignal<HTMLElement>();\n\n    const getIsDisabled = () => access(props.isDisabled) ?? false;\n\n    const getIsReachable = () =>\n        InteractionTracker.computeIsReachable(\n            getIsDisabled(),\n            access(props.isReachableWhenDisabled) ?? false,\n            props.tooltipDefs !== undefined,\n        );\n\n    context.register({\n        getElementRef,\n        getIsDisabled,\n        getIsReachable,\n        getValue,\n    });\n\n    return (\n        <BinarySwitch\n            {...props}\n            ref={setElementRef}\n            type={\"radio\"}\n            name={context.getName}\n            isChecked={() => context.getValue() === (getValue() as unknown)}\n            isTabbable={() => context.computeIsTabbable(getValue())}\n            onChange={(isChecked) => {\n                context.setValue(getValue());\n\n                void props.onChange?.(isChecked);\n            }}\n        />\n    );\n};\n"],"mappings":";;;;;;;AAQA,IAAaM,SAAaC,UAAyB;CAC/C,MAAME,iBAAiBP,OAAOK,MAAMG,KAAK;CAEzC,MAAMC,UAAUP,qBAAqB;CAErC,MAAM,CAACQ,eAAeC,iBAAiBb,aAA0B;CAEjE,MAAMe,sBAAsBb,OAAOK,MAAMS,UAAU,KAAK;CAExD,MAAMC,uBACFhB,mBAAmBiB,mBACfH,cAAc,GACdb,OAAOK,MAAMY,uBAAuB,KAAK,OACzCZ,MAAMa,gBAAgBC,KAAAA,CAC1B;CAEJV,QAAQW,SAAS;EACbV;EACAG;EACAE;EACAR;CACJ,CAAC;CAED,OAAAc,gBACKpB,cAAYqB,WACLjB,OAAK;EAAAkB,KACJZ;EACLa,MAAM;EAAO,IACbC,OAAI;GAAA,OAAEhB,QAAQiB;EAAO;EACrBC,iBAAiBlB,QAAQF,SAAS,MAAOA,SAAS;EAClDqB,kBAAkBnB,QAAQoB,kBAAkBtB,SAAS,CAAC;EACtDuB,WAAWH,cAAc;GACrBlB,QAAQsB,SAASxB,SAAS,CAAC;GAE3B,MAAWuB,WAAWH,SAAS;EACnC;CAAC,CAAA,CAAA;AAGb"}

package/dist/Fundamentals/Input/RadioGroup/RadioGroup.context.js

@@ -0,0 +1,20 @@
+import { createContext, useContext } from "solid-js";
+//#region src/Fundamentals/Input/RadioGroup/RadioGroup.context.ts
+var RadioGroupContext = createContext();
+var RadioGroupContextProvider = RadioGroupContext.Provider;
+var ORPHAN_RADIO_CONTEXT = {
+	getName: () => "",
+	getValue: () => void 0,
+	setValue: () => void 0,
+	computeIsTabbable: () => true,
+	register: () => void 0
+};
+var useRadioGroupContext = () => {
+	const context = useContext(RadioGroupContext);
+	if (!context) console.warn("Radio: no RadioGroup ancestor found — the radio cannot read or write a selection, and mutual exclusion, arrow-key navigation and the group's single tab stop are all inert.");
+	return context ?? ORPHAN_RADIO_CONTEXT;
+};
+//#endregion
+export { RadioGroupContextProvider, useRadioGroupContext };
+
+//# sourceMappingURL=RadioGroup.context.js.map

package/dist/Fundamentals/Input/RadioGroup/RadioGroup.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.context.js","names":[],"sources":["../../../../src/Fundamentals/Input/RadioGroup/RadioGroup.context.ts"],"sourcesContent":["import { createContext, useContext } from \"solid-js\";\n\nimport type { RadioGroupContextType } from \"./RadioGroup.context.types\";\n\nconst RadioGroupContext = createContext<RadioGroupContextType>();\n\nexport const RadioGroupContextProvider = RadioGroupContext.Provider;\n\nconst ORPHAN_RADIO_CONTEXT: RadioGroupContextType = {\n    getName: () => \"\",\n    getValue: () => undefined,\n    setValue: () => undefined,\n    computeIsTabbable: () => true,\n    register: () => undefined,\n};\n\nexport const useRadioGroupContext = (): RadioGroupContextType => {\n    const context = useContext(RadioGroupContext);\n\n    if (!context) {\n        console.warn(\n            \"Radio: no RadioGroup ancestor found — the radio cannot read or write a selection, and mutual exclusion, arrow-key navigation and the group's single tab stop are all inert.\",\n        );\n    }\n\n    return context ?? ORPHAN_RADIO_CONTEXT;\n};\n"],"mappings":";;AAIA,IAAM,oBAAoB,cAAqC;AAE/D,IAAa,4BAA4B,kBAAkB;AAE3D,IAAM,uBAA8C;CAChD,eAAe;CACf,gBAAgB,KAAA;CAChB,gBAAgB,KAAA;CAChB,yBAAyB;CACzB,gBAAgB,KAAA;AACpB;AAEA,IAAa,6BAAoD;CAC7D,MAAM,UAAU,WAAW,iBAAiB;CAE5C,IAAI,CAAC,SACD,QAAQ,KACJ,6KACJ;CAGJ,OAAO,WAAW;AACtB"}

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

@@ -0,0 +1,8 @@
+/* empty css                              */
+//#region src/Fundamentals/Input/RadioGroup/RadioGroup.css.ts
+var radioGroupRoot = "_2d47780";
+var radioGroupFloater = "_2d47781";
+//#endregion
+export { radioGroupFloater, radioGroupRoot };
+
+//# sourceMappingURL=RadioGroup.css.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/RadioGroup/RadioGroup.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const radioGroupRoot = style({\n    position: \"relative\",\n    isolation: \"isolate\",\n    display: \"flex\",\n    alignItems: \"flex-start\",\n    width: \"fit-content\",\n});\n\nexport const radioGroupFloater = style({\n    position: \"absolute\",\n    zIndex: -1,\n\n    display: \"grid\",\n    transition: \"width, height, left, top\",\n});\n"],"mappings":""}

package/dist/Fundamentals/Input/RadioGroup/RadioGroup.js

@@ -0,0 +1,128 @@
+import { access, accessSignal } from "../../../Utils/propUtils.js";
+import { ElementFader } from "../../../Abstracts/ElementFader/ElementFader.js";
+import { NavigatorUtils } from "../../../Abstracts/Navigator/Navigator.utils.js";
+import { RadioGroupContextProvider } from "./RadioGroup.context.js";
+import { radioGroupRoot } from "./RadioGroup.css.js";
+import { createEffect, createMemo, createSignal, createUniqueId, onCleanup } from "solid-js";
+import { className, createComponent, delegateEvents, effect, insert, memo, setAttribute, setStyleProperty, style, template, use } from "solid-js/web";
+//#region src/Fundamentals/Input/RadioGroup/RadioGroup.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div role=radiogroup>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<div>`);
+var DEFAULT_RADIO_GROUP_DIR = "row";
+var DEFAULT_RADIO_GROUP_GAP = 0;
+var DEFAULT_RADIO_GROUP_TRANSITION_DURATION_MS = 200;
+var RadioGroup = (props) => {
+	const valueSignal = accessSignal(() => props.valueSignal);
+	const fallbackName = createUniqueId();
+	const [getEntries, setEntries] = createSignal([]);
+	const [getRootRef, setRootRef] = createSignal();
+	const [getFloaterBounds, setFloaterBounds] = createSignal();
+	const getDir = createMemo(() => access(props.dir) ?? DEFAULT_RADIO_GROUP_DIR);
+	const getTransitionDurationMs = createMemo(() => access(props.transitionDurationMs) ?? DEFAULT_RADIO_GROUP_TRANSITION_DURATION_MS);
+	const getOrderedEntries = createMemo(() => [...getEntries()].sort((a, b) => {
+		const first = a.getElementRef();
+		const second = b.getElementRef();
+		if (!first || !second) return 0;
+		return first.compareDocumentPosition(second) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+	}));
+	const getNavigableEntries = createMemo(() => getOrderedEntries().filter((entry) => !entry.getIsDisabled() || entry.getIsReachable()));
+	const getRovingEntry = createMemo(() => {
+		const navigable = getNavigableEntries();
+		const value = valueSignal[0]();
+		return navigable.find((entry) => entry.getValue() === value) ?? navigable[0];
+	});
+	const getSelectedEntry = createMemo(() => getOrderedEntries().find((entry) => entry.getValue() === valueSignal[0]()));
+	const getIsFloaterShown = createMemo(() => getSelectedEntry() !== void 0 && getFloaterBounds() !== void 0);
+	const floaterFader = ElementFader.createFader(getIsFloaterShown, { getTransitionDurationMs });
+	createEffect(() => {
+		if (floaterFader.getIsVisible()) return;
+		setFloaterBounds(void 0);
+	});
+	createEffect(() => {
+		let selectedItemObserver;
+		onCleanup(() => {
+			selectedItemObserver?.disconnect();
+		});
+		if (!props.renderFloater) return;
+		const rootRef = getRootRef();
+		const selectedWrapper = (getSelectedEntry()?.getElementRef())?.offsetParent;
+		if (!rootRef || !selectedWrapper) return;
+		selectedItemObserver = new ResizeObserver(() => {
+			setFloaterBounds({
+				top: `${selectedWrapper.offsetTop}px`,
+				left: `${selectedWrapper.offsetLeft}px`,
+				width: `${selectedWrapper.offsetWidth}px`,
+				height: `${selectedWrapper.offsetHeight}px`
+			});
+		});
+		selectedItemObserver.observe(rootRef);
+		selectedItemObserver.observe(selectedWrapper);
+	});
+	const context = {
+		getName: () => access(props.name) ?? fallbackName,
+		getValue: () => valueSignal[0](),
+		setValue: (value) => valueSignal[1](() => value),
+		computeIsTabbable: (value) => getRovingEntry()?.getValue() === value,
+		register: (entry) => {
+			setEntries((prev) => [...prev, entry]);
+			onCleanup(() => {
+				setEntries((prev) => prev.filter((item) => item !== entry));
+			});
+		}
+	};
+	const handleKeyDown = (e) => {
+		const navigable = getNavigableEntries();
+		if (navigable.length < 1) return;
+		const from = navigable.find((entry) => entry.getElementRef() === document.activeElement) ?? getRovingEntry();
+		const position = NavigatorUtils.computeNextPosition(e.key, from ? navigable.indexOf(from) : 0, navigable.length, { orientation: "both" });
+		if (position === void 0) return;
+		e.preventDefault();
+		const next = navigable[position];
+		next.getElementRef()?.focus();
+		if (!next.getIsDisabled()) context.setValue(next.getValue());
+	};
+	return (() => {
+		var _el$ = _tmpl$();
+		_el$.$$keydown = handleKeyDown;
+		use(setRootRef, _el$);
+		className(_el$, radioGroupRoot);
+		insert(_el$, (() => {
+			var _c$ = memo(() => !!(props.renderFloater && floaterFader.getIsVisible() && getFloaterBounds()));
+			return () => _c$() && (() => {
+				var _el$2 = _tmpl$2();
+				className(_el$2, "_2d47781");
+				insert(_el$2, () => props.renderFloater(floaterFader.getTransitionTarget, getTransitionDurationMs));
+				effect((_$p) => style(_el$2, {
+					...getFloaterBounds(),
+					"transition-duration": `${getTransitionDurationMs()}ms`
+				}, _$p));
+				return _el$2;
+			})();
+		})(), null);
+		insert(_el$, createComponent(RadioGroupContextProvider, {
+			value: context,
+			get children() {
+				return props.children;
+			}
+		}), null);
+		effect((_p$) => {
+			var _v$ = getDir(), _v$2 = `${access(props.gap) ?? DEFAULT_RADIO_GROUP_GAP}px`, _v$3 = access(props.ariaLabel), _v$4 = access(props.hasError) || void 0;
+			_v$ !== _p$.e && setStyleProperty(_el$, "flex-direction", _p$.e = _v$);
+			_v$2 !== _p$.t && setStyleProperty(_el$, "gap", _p$.t = _v$2);
+			_v$3 !== _p$.a && setAttribute(_el$, "aria-label", _p$.a = _v$3);
+			_v$4 !== _p$.o && setAttribute(_el$, "aria-invalid", _p$.o = _v$4);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0,
+			o: void 0
+		});
+		return _el$;
+	})();
+};
+delegateEvents(["keydown"]);
+//#endregion
+export { RadioGroup };
+
+//# sourceMappingURL=RadioGroup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.js","names":["createEffect","createMemo","createSignal","createUniqueId","onCleanup","ElementFader","NavigatorUtils","access","accessSignal","RadioGroupContextProvider","RadioGroupContextType","RadioGroupEntry","RadioGroupDir","RadioGroupProps","styles","DEFAULT_RADIO_GROUP_DIR","DEFAULT_RADIO_GROUP_GAP","DEFAULT_RADIO_GROUP_TRANSITION_DURATION_MS","RadioGroup","props","T","valueSignal","fallbackName","getEntries","setEntries","getRootRef","setRootRef","HTMLElement","getFloaterBounds","setFloaterBounds","getDir","dir","getTransitionDurationMs","transitionDurationMs","getOrderedEntries","sort","a","b","first","getElementRef","second","compareDocumentPosition","Node","DOCUMENT_POSITION_FOLLOWING","getNavigableEntries","filter","entry","getIsDisabled","getIsReachable","getRovingEntry","navigable","value","find","getValue","getSelectedEntry","getIsFloaterShown","undefined","floaterFader","createFader","getIsVisible","selectedItemObserver","ResizeObserver","disconnect","renderFloater","rootRef","selectedItem","selectedWrapper","offsetParent","top","offsetTop","left","offsetLeft","width","offsetWidth","height","offsetHeight","observe","context","getName","name","setValue","computeIsTabbable","register","prev","item","handleKeyDown","e","KeyboardEvent","length","focused","document","activeElement","from","position","computeNextPosition","key","indexOf","orientation","preventDefault","next","focus","_el$","_tmpl$","$$keydown","_$use","_$className","radioGroupRoot","_$insert","_c$","_$memo","_el$2","_tmpl$2","radioGroupFloater","getTransitionTarget","_$effect","_$p","_$style","_$createComponent","children","_p$","_v$","_v$2","gap","_v$3","ariaLabel","_v$4","hasError","_$setStyleProperty","t","_$setAttribute","o","_$delegateEvents"],"sources":["../../../../src/Fundamentals/Input/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, createUniqueId, onCleanup } from \"solid-js\";\r\n\r\nimport { ElementFader } from \"../../../Abstracts/ElementFader/ElementFader\";\r\nimport { NavigatorUtils } from \"../../../Abstracts/Navigator/Navigator.utils\";\r\nimport { access, accessSignal } from \"../../../Utils/propUtils\";\r\nimport { RadioGroupContextProvider } from \"./RadioGroup.context\";\r\nimport type { RadioGroupContextType, RadioGroupEntry } from \"./RadioGroup.context.types\";\r\nimport type { RadioGroupDir, RadioGroupProps } from \"./RadioGroup.types\";\r\n\r\nimport * as styles from \"./RadioGroup.css\";\r\n\r\nconst DEFAULT_RADIO_GROUP_DIR: RadioGroupDir = \"row\";\r\nconst DEFAULT_RADIO_GROUP_GAP = 0;\r\nconst DEFAULT_RADIO_GROUP_TRANSITION_DURATION_MS = 200;\r\n\r\nexport const RadioGroup = <T,>(props: RadioGroupProps<T>) => {\r\n    const valueSignal = accessSignal(() => props.valueSignal);\r\n\r\n    const fallbackName = createUniqueId();\r\n\r\n    const [getEntries, setEntries] = createSignal<RadioGroupEntry[]>([]);\r\n    const [getRootRef, setRootRef] = createSignal<HTMLElement>();\r\n    const [getFloaterBounds, setFloaterBounds] = createSignal<\r\n        { [k in \"top\" | \"left\" | \"width\" | \"height\"]: string } | undefined\r\n    >();\r\n\r\n    const getDir = createMemo(() => access(props.dir) ?? DEFAULT_RADIO_GROUP_DIR);\r\n\r\n    const getTransitionDurationMs = createMemo(\r\n        () => access(props.transitionDurationMs) ?? DEFAULT_RADIO_GROUP_TRANSITION_DURATION_MS,\r\n    );\r\n\r\n    const getOrderedEntries = createMemo(() =>\r\n        [...getEntries()].sort((a, b) => {\r\n            const first = a.getElementRef();\r\n            const second = b.getElementRef();\r\n\r\n            if (!first || !second) return 0;\r\n\r\n            return first.compareDocumentPosition(second) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;\r\n        }),\r\n    );\r\n\r\n    const getNavigableEntries = createMemo(() =>\r\n        getOrderedEntries().filter((entry) => !entry.getIsDisabled() || entry.getIsReachable()),\r\n    );\r\n\r\n    const getRovingEntry = createMemo(() => {\r\n        const navigable = getNavigableEntries();\r\n        const value = valueSignal[0]();\r\n\r\n        return navigable.find((entry) => entry.getValue() === value) ?? navigable[0];\r\n    });\r\n\r\n    const getSelectedEntry = createMemo(() =>\r\n        getOrderedEntries().find((entry) => entry.getValue() === valueSignal[0]()),\r\n    );\r\n\r\n    const getIsFloaterShown = createMemo(() => getSelectedEntry() !== undefined && getFloaterBounds() !== undefined);\r\n\r\n    const floaterFader = ElementFader.createFader(getIsFloaterShown, { getTransitionDurationMs });\r\n\r\n    createEffect(() => {\r\n        if (floaterFader.getIsVisible()) return;\r\n\r\n        setFloaterBounds(undefined);\r\n    });\r\n\r\n    createEffect(() => {\r\n        let selectedItemObserver: ResizeObserver | undefined;\r\n\r\n        onCleanup(() => {\r\n            selectedItemObserver?.disconnect();\r\n        });\r\n\r\n        if (!props.renderFloater) return;\r\n\r\n        const rootRef = getRootRef();\r\n        const selectedItem = getSelectedEntry()?.getElementRef();\r\n        const selectedWrapper = selectedItem?.offsetParent as HTMLElement | null;\r\n\r\n        if (!rootRef || !selectedWrapper) return;\r\n\r\n        selectedItemObserver = new ResizeObserver(() => {\r\n            setFloaterBounds({\r\n                top: `${selectedWrapper.offsetTop}px`,\r\n                left: `${selectedWrapper.offsetLeft}px`,\r\n                width: `${selectedWrapper.offsetWidth}px`,\r\n                height: `${selectedWrapper.offsetHeight}px`,\r\n            });\r\n        });\r\n        selectedItemObserver.observe(rootRef);\r\n        selectedItemObserver.observe(selectedWrapper);\r\n    });\r\n\r\n    const context: RadioGroupContextType = {\r\n        getName: () => access(props.name) ?? fallbackName,\r\n        getValue: () => valueSignal[0](),\r\n        setValue: (value) => valueSignal[1](() => value as T),\r\n        computeIsTabbable: (value) => getRovingEntry()?.getValue() === value,\r\n        register: (entry) => {\r\n            setEntries((prev) => [...prev, entry]);\r\n\r\n            onCleanup(() => {\r\n                setEntries((prev) => prev.filter((item) => item !== entry));\r\n            });\r\n        },\r\n    };\r\n\r\n    const handleKeyDown = (e: KeyboardEvent) => {\r\n        const navigable = getNavigableEntries();\r\n\r\n        if (navigable.length < 1) return;\r\n\r\n        const focused = navigable.find((entry) => entry.getElementRef() === document.activeElement);\r\n        const from = focused ?? getRovingEntry();\r\n        const position = NavigatorUtils.computeNextPosition(\r\n            e.key,\r\n            from ? navigable.indexOf(from) : 0,\r\n            navigable.length,\r\n            { orientation: \"both\" },\r\n        );\r\n\r\n        if (position === undefined) return;\r\n\r\n        e.preventDefault();\r\n\r\n        const next = navigable[position];\r\n\r\n        next.getElementRef()?.focus();\r\n\r\n        if (!next.getIsDisabled()) context.setValue(next.getValue());\r\n    };\r\n\r\n    return (\r\n        <div\r\n            ref={setRootRef}\r\n            class={styles.radioGroupRoot}\r\n            style={{\r\n                \"flex-direction\": getDir(),\r\n                \"gap\": `${access(props.gap) ?? DEFAULT_RADIO_GROUP_GAP}px`,\r\n            }}\r\n            role=\"radiogroup\"\r\n            aria-label={access(props.ariaLabel)}\r\n            aria-invalid={access(props.hasError) || undefined}\r\n            onKeyDown={handleKeyDown}\r\n        >\r\n            {props.renderFloater && floaterFader.getIsVisible() && getFloaterBounds() && (\r\n                <div\r\n                    class={styles.radioGroupFloater}\r\n                    style={{ ...getFloaterBounds(), \"transition-duration\": `${getTransitionDurationMs()}ms` }}\r\n                >\r\n                    {props.renderFloater(floaterFader.getTransitionTarget, getTransitionDurationMs)}\r\n                </div>\r\n            )}\r\n\r\n            <RadioGroupContextProvider value={context}>{props.children}</RadioGroupContextProvider>\r\n        </div>\r\n    );\r\n};\r\n"],"mappings":"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"}

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

@@ -0,0 +1,12 @@
+/* empty css                         */
+//#region src/Fundamentals/Input/Range/Range.css.ts
+var thumbSizeVar = "var(--_1s7rvo40)";
+var rangeElement = "_1s7rvo41";
+var rangeOrientationVariants = {
+	horizontal: "_1s7rvo42",
+	vertical: "_1s7rvo43"
+};
+//#endregion
+export { rangeElement, rangeOrientationVariants, thumbSizeVar };
+
+//# sourceMappingURL=Range.css.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Range.css.js","names":[],"sources":["../../../../src/Fundamentals/Input/Range/Range.css.ts"],"sourcesContent":["import { createVar, style, styleVariants } from \"@vanilla-extract/css\";\n\nexport const thumbSizeVar = createVar();\n\nconst thumbHitArea = {\n    appearance: \"none\",\n    width: thumbSizeVar,\n    height: thumbSizeVar,\n    border: \"none\",\n    borderRadius: 0,\n    background: \"transparent\",\n    pointerEvents: \"all\",\n} as const;\n\nexport const rangeElement = style({\n    appearance: \"none\",\n    position: \"absolute\",\n    inset: 0,\n    width: \"auto !important\",\n    height: \"auto !important\",\n    minWidth: \"0 !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        \"&::-webkit-slider-runnable-track\": {\n            background: \"transparent\",\n            border: \"none\",\n        },\n        \"&::-moz-range-track\": {\n            background: \"transparent\",\n            border: \"none\",\n        },\n        \"&::-webkit-slider-thumb\": thumbHitArea,\n        \"&::-moz-range-thumb\": thumbHitArea,\n        \"&[aria-disabled='true']\": {\n            cursor: \"not-allowed\",\n        },\n    },\n});\n\nexport const rangeOrientationVariants = styleVariants({\n    horizontal: {},\n    vertical: {\n        writingMode: \"vertical-lr\",\n        direction: \"rtl\",\n    },\n});\n"],"mappings":""}