@thewaver/ss-components 0.0.1 → 0.0.2

package/dist/Fundamentals/Toasts/Toasts.utils.js

@@ -0,0 +1,32 @@
+//#region src/Fundamentals/Toasts/Toasts.utils.ts
+var EDGE_BY_ALIGNMENT = {
+	top: "flex-start",
+	middle: "center",
+	bottom: "flex-end",
+	left: "flex-start",
+	center: "center",
+	right: "flex-end"
+};
+var OPPOSITE_EDGE = {
+	"flex-start": "flex-end",
+	"center": "center",
+	"flex-end": "flex-start"
+};
+var ToastsUtils;
+(function(_ToastsUtils) {
+	_ToastsUtils.computeStackAlignment = (alignment, dir) => {
+		const [vertical, horizontal] = alignment.split("-");
+		const isColumn = dir === "column" || dir === "column-reverse";
+		const isReversed = dir === "column-reverse" || dir === "row-reverse";
+		const main = EDGE_BY_ALIGNMENT[isColumn ? vertical : horizontal];
+		const cross = EDGE_BY_ALIGNMENT[isColumn ? horizontal : vertical];
+		return {
+			justifyContent: isReversed ? OPPOSITE_EDGE[main] : main,
+			alignItems: cross
+		};
+	};
+})(ToastsUtils || (ToastsUtils = {}));
+//#endregion
+export { ToastsUtils };
+
+//# sourceMappingURL=Toasts.utils.js.map

package/dist/Fundamentals/Toasts/Toasts.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toasts.utils.js","names":[],"sources":["../../../src/Fundamentals/Toasts/Toasts.utils.ts"],"sourcesContent":["import type {\n    ToastsAlignment,\n    ToastsDir,\n    ToastsHorizontalAlignment,\n    ToastsStackAlignment,\n    ToastsVerticalAlignment,\n} from \"./Toasts.types\";\n\nconst EDGE_BY_ALIGNMENT = {\n    top: \"flex-start\",\n    middle: \"center\",\n    bottom: \"flex-end\",\n    left: \"flex-start\",\n    center: \"center\",\n    right: \"flex-end\",\n} as const;\n\nconst OPPOSITE_EDGE = {\n    \"flex-start\": \"flex-end\",\n    \"center\": \"center\",\n    \"flex-end\": \"flex-start\",\n} as const;\n\nexport namespace ToastsUtils {\n    export const computeStackAlignment = (alignment: ToastsAlignment, dir: ToastsDir): ToastsStackAlignment => {\n        const [vertical, horizontal] = alignment.split(\"-\") as [ToastsVerticalAlignment, ToastsHorizontalAlignment];\n        const isColumn = dir === \"column\" || dir === \"column-reverse\";\n        const isReversed = dir === \"column-reverse\" || dir === \"row-reverse\";\n\n        const main = EDGE_BY_ALIGNMENT[isColumn ? vertical : horizontal];\n        const cross = EDGE_BY_ALIGNMENT[isColumn ? horizontal : vertical];\n\n        return {\n            justifyContent: isReversed ? OPPOSITE_EDGE[main] : main,\n            alignItems: cross,\n        };\n    };\n}\n"],"mappings":";AAQA,IAAM,oBAAoB;CACtB,KAAK;CACL,QAAQ;CACR,QAAQ;CACR,MAAM;CACN,QAAQ;CACR,OAAO;AACX;AAEA,IAAM,gBAAgB;CAClB,cAAc;CACd,UAAU;CACV,YAAY;AAChB;AAEO,IAAU;CAAV,SAAA,cAAA;CACU,aAAA,yBAAyB,WAA4B,QAAyC;EACvG,MAAM,CAAC,UAAU,cAAc,UAAU,MAAM,GAAG;EAClD,MAAM,WAAW,QAAQ,YAAY,QAAQ;EAC7C,MAAM,aAAa,QAAQ,oBAAoB,QAAQ;EAEvD,MAAM,OAAO,kBAAkB,WAAW,WAAW;EACrD,MAAM,QAAQ,kBAAkB,WAAW,aAAa;EAExD,OAAO;GACH,gBAAgB,aAAa,cAAc,QAAQ;GACnD,YAAY;EAChB;CACJ;AACH,EAAA,CAAA,gBAAA,cAAA,CAAA,EAAD"}

package/dist/Fundamentals/Toolbar/Toolbar.css.js

@@ -0,0 +1,11 @@
+/* empty css                                  */
+/* empty css                           */
+//#region src/Fundamentals/Toolbar/Toolbar.css.ts
+var toolbarRoot = "_1dthp0t0";
+var toolbarItem = "_1dthp0t1";
+var toolbarMeasuredItem = "_1dthp0t2";
+var toolbarButton = "_1dthp0t3 _1lgjca40";
+//#endregion
+export { toolbarButton, toolbarItem, toolbarMeasuredItem, toolbarRoot };
+
+//# sourceMappingURL=Toolbar.css.js.map

package/dist/Fundamentals/Toolbar/Toolbar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.css.js","names":[],"sources":["../../../src/Fundamentals/Toolbar/Toolbar.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nimport { buttonElement } from \"../Button/Button.css\";\n\nexport const toolbarRoot = style({\n    position: \"relative\",\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    width: \"100%\",\n    minWidth: 0,\n});\n\nexport const toolbarItem = style({\n    flex: \"none\",\n});\n\nexport const toolbarMeasuredItem = style({\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    visibility: \"hidden\",\n    pointerEvents: \"none\",\n});\n\nexport const toolbarButton = style([buttonElement, {}]);\n"],"mappings":""}

package/dist/Fundamentals/Toolbar/Toolbar.js

@@ -0,0 +1,163 @@
+import { ElementObserver } from "../../Abstracts/ElementObserver/ElementObserver.js";
+import { access } from "../../Utils/propUtils.js";
+import { NavigatorUtils } from "../../Abstracts/Navigator/Navigator.utils.js";
+import { InteractionWrapper } from "../InteractionWrapper/InteractionWrapper.js";
+import { Menu } from "../Menu/Menu.js";
+import { ToolbarUtils } from "./Toolbar.utils.js";
+import { toolbarButton, toolbarItem, toolbarMeasuredItem, toolbarRoot } from "./Toolbar.css.js";
+import { Index, createEffect, createMemo, createSignal } from "solid-js";
+import { className, createComponent, delegateEvents, effect, insert, setAttribute, setStyleProperty, template, use } from "solid-js/web";
+//#region src/Fundamentals/Toolbar/Toolbar.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div role=toolbar><div role=presentation>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<div role=presentation>`);
+var _tmpl$3 = /*#__PURE__*/ template(`<button type=button>`);
+var DEFAULT_TOOLBAR_GAP = 0;
+var OVERFLOW_STOP = -1;
+var NO_WIDTH = 0;
+var Toolbar = (props) => {
+	const [getRootRef, setRootRef] = createSignal();
+	const [getOverflowRef, setOverflowRef] = createSignal();
+	const [getItemRefs, setItemRefs] = createSignal([]);
+	const [getFocusedStop, setFocusedStop] = createSignal();
+	const getGap = createMemo(() => access(props.gap) ?? DEFAULT_TOOLBAR_GAP);
+	const getActions = createMemo(() => access(props.actions));
+	const getRootSize = ElementObserver.createBorderBoxSizeObserver(getRootRef);
+	const getItemSizes = ElementObserver.createBorderBoxSizeListObserver(getItemRefs);
+	const getOverflowSize = ElementObserver.createBorderBoxSizeObserver(getOverflowRef);
+	const setItemRef = (index, element) => {
+		setItemRefs((previous) => {
+			const next = [...previous];
+			next[index] = element;
+			return next;
+		});
+	};
+	const getHasMeasured = createMemo(() => getRootSize().width > NO_WIDTH && getItemSizes().length === getActions().length);
+	const getCut = createMemo(() => ToolbarUtils.computeCut({
+		widths: getItemSizes().map((size) => size.width),
+		collapses: getActions().map((action) => action.collapse ?? "auto"),
+		available: getRootSize().width,
+		overflowWidth: getOverflowSize().width,
+		gap: getGap()
+	}));
+	const getIsShown = (index) => getCut().shownIndexes.includes(index);
+	const getOverflowItems = createMemo(() => getCut().collapsedIndexes.map((index) => ({
+		value: getActions()[index].value,
+		isDisabled: getActions()[index].isDisabled
+	})));
+	const getHasOverflow = createMemo(() => getOverflowItems().length > 0);
+	const getStops = createMemo(() => getCut().shownIndexes.filter((index) => !getActions()[index].isDisabled));
+	const getRovingStop = createMemo(() => {
+		const stops = getStops();
+		const focused = getFocusedStop();
+		if (focused === OVERFLOW_STOP && getHasOverflow()) return focused;
+		if (focused !== void 0 && stops.includes(focused)) return focused;
+		return stops[0] ?? (getHasOverflow() ? OVERFLOW_STOP : void 0);
+	});
+	createEffect(() => {
+		const stops = getStops();
+		const focused = getFocusedStop();
+		if (focused === void 0 || focused === OVERFLOW_STOP || stops.includes(focused)) return;
+		const hadFocus = getItemRefs()[focused]?.contains(document.activeElement);
+		const landing = getHasOverflow() ? OVERFLOW_STOP : stops[0];
+		setFocusedStop(landing);
+		if (!hadFocus) return;
+		if (landing === OVERFLOW_STOP) getOverflowRef()?.focus();
+		else if (landing !== void 0) getItemRefs()[landing]?.focus();
+	});
+	const handleKeyDown = (e) => {
+		const stops = [...getStops(), ...getHasOverflow() ? [OVERFLOW_STOP] : []];
+		const from = stops.indexOf(getRovingStop() ?? stops[0]);
+		if (stops.length < 2 || from < 0) return;
+		const position = NavigatorUtils.computeNextPosition(e.key, from, stops.length, { orientation: "row" });
+		if (position === void 0) return;
+		e.preventDefault();
+		const next = stops[position];
+		setFocusedStop(next);
+		if (next === OVERFLOW_STOP) getOverflowRef()?.focus();
+		else getItemRefs()[next]?.focus();
+	};
+	return (() => {
+		var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+		_el$.$$keydown = handleKeyDown;
+		use(setRootRef, _el$);
+		className(_el$, toolbarRoot);
+		insert(_el$, createComponent(Index, {
+			get each() {
+				return getActions();
+			},
+			children: (getAction, index) => (() => {
+				var _el$3 = _tmpl$2();
+				insert(_el$3, createComponent(InteractionWrapper, {
+					isDisabled: () => getAction().isDisabled ?? false,
+					isTabbable: () => index === getRovingStop(),
+					ref: (element) => setItemRef(index, element),
+					onActivation: () => props.onActivate(getAction().value),
+					renderControl: (setElementRef, getFlags) => (() => {
+						var _el$4 = _tmpl$3();
+						var _ref$ = setElementRef;
+						typeof _ref$ === "function" ? use(_ref$, _el$4) : setElementRef = _el$4;
+						className(_el$4, toolbarButton);
+						insert(_el$4, () => props.renderAction(getAction, getFlags));
+						effect(() => setAttribute(_el$4, "aria-disabled", getFlags().isDisabled || void 0));
+						return _el$4;
+					})()
+				}));
+				effect((_p$) => {
+					var _v$7 = [toolbarItem, getIsShown(index) ? "" : toolbarMeasuredItem].join(" "), _v$8 = getIsShown(index) ? void 0 : "true", _v$9 = getIsShown(index) ? void 0 : true;
+					_v$7 !== _p$.e && className(_el$3, _p$.e = _v$7);
+					_v$8 !== _p$.t && setAttribute(_el$3, "aria-hidden", _p$.t = _v$8);
+					_v$9 !== _p$.a && (_el$3.inert = _p$.a = _v$9);
+					return _p$;
+				}, {
+					e: void 0,
+					t: void 0,
+					a: void 0
+				});
+				return _el$3;
+			})()
+		}), _el$2);
+		insert(_el$2, createComponent(Menu, {
+			items: getOverflowItems,
+			get ariaLabel() {
+				return props.overflowAriaLabel;
+			},
+			isTabbable: () => getRovingStop() === OVERFLOW_STOP,
+			ref: setOverflowRef,
+			get renderContent() {
+				return props.renderOverflowTrigger;
+			},
+			get renderItem() {
+				return props.renderOverflowItem;
+			},
+			get renderPopup() {
+				return props.renderOverflowPopup;
+			},
+			get onActivate() {
+				return props.onActivate;
+			}
+		}));
+		effect((_p$) => {
+			var _v$ = `${getGap()}px`, _v$2 = getHasMeasured() ? void 0 : "hidden", _v$3 = access(props.ariaLabel), _v$4 = [toolbarItem, getHasOverflow() ? "" : toolbarMeasuredItem].join(" "), _v$5 = getHasOverflow() ? void 0 : "true", _v$6 = getHasOverflow() ? void 0 : true;
+			_v$ !== _p$.e && setStyleProperty(_el$, "gap", _p$.e = _v$);
+			_v$2 !== _p$.t && setStyleProperty(_el$, "visibility", _p$.t = _v$2);
+			_v$3 !== _p$.a && setAttribute(_el$, "aria-label", _p$.a = _v$3);
+			_v$4 !== _p$.o && className(_el$2, _p$.o = _v$4);
+			_v$5 !== _p$.i && setAttribute(_el$2, "aria-hidden", _p$.i = _v$5);
+			_v$6 !== _p$.n && (_el$2.inert = _p$.n = _v$6);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0,
+			o: void 0,
+			i: void 0,
+			n: void 0
+		});
+		return _el$;
+	})();
+};
+delegateEvents(["keydown"]);
+//#endregion
+export { Toolbar };
+
+//# sourceMappingURL=Toolbar.js.map

package/dist/Fundamentals/Toolbar/Toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.js","names":["Index","createEffect","createMemo","createSignal","ElementObserver","NavigatorUtils","access","InteractionWrapper","Menu","MenuItem","ToolbarProps","ToolbarUtils","styles","DEFAULT_TOOLBAR_GAP","OVERFLOW_STOP","NO_WIDTH","Toolbar","props","T","getRootRef","setRootRef","HTMLElement","getOverflowRef","setOverflowRef","getItemRefs","setItemRefs","getFocusedStop","setFocusedStop","getGap","gap","getActions","actions","getRootSize","createBorderBoxSizeObserver","getItemSizes","createBorderBoxSizeListObserver","getOverflowSize","setItemRef","index","element","previous","next","getHasMeasured","width","length","getCut","computeCut","widths","map","size","collapses","action","collapse","available","overflowWidth","getIsShown","shownIndexes","includes","getOverflowItems","collapsedIndexes","value","isDisabled","getHasOverflow","getStops","filter","getRovingStop","stops","focused","undefined","hadFocus","contains","document","activeElement","landing","focus","handleKeyDown","e","KeyboardEvent","from","indexOf","position","computeNextPosition","key","orientation","preventDefault","_el$","_tmpl$","_el$2","firstChild","$$keydown","_$use","_$className","toolbarRoot","_$insert","_$createComponent","each","children","getAction","_el$3","_tmpl$2","isTabbable","ref","onActivation","onActivate","renderControl","setElementRef","getFlags","_el$4","_tmpl$3","_ref$","toolbarButton","renderAction","_$effect","_$setAttribute","_p$","_v$7","toolbarItem","toolbarMeasuredItem","join","_v$8","_v$9","t","a","inert","items","ariaLabel","overflowAriaLabel","renderContent","renderOverflowTrigger","renderItem","renderOverflowItem","renderPopup","renderOverflowPopup","_v$","_v$2","_v$3","_v$4","_v$5","_v$6","_$setStyleProperty","o","i","n","_$delegateEvents"],"sources":["../../../src/Fundamentals/Toolbar/Toolbar.tsx"],"sourcesContent":["import { Index, createEffect, createMemo, createSignal } from \"solid-js\";\n\nimport { ElementObserver } from \"../../Abstracts/ElementObserver/ElementObserver\";\nimport { NavigatorUtils } from \"../../Abstracts/Navigator/Navigator.utils\";\nimport { access } from \"../../Utils/propUtils\";\nimport { InteractionWrapper } from \"../InteractionWrapper/InteractionWrapper\";\nimport { Menu } from \"../Menu/Menu\";\nimport type { MenuItem } from \"../Menu/Menu.types\";\nimport type { ToolbarProps } from \"./Toolbar.types\";\nimport { ToolbarUtils } from \"./Toolbar.utils\";\n\nimport * as styles from \"./Toolbar.css\";\n\nconst DEFAULT_TOOLBAR_GAP = 0;\nconst OVERFLOW_STOP = -1;\nconst NO_WIDTH = 0;\n\nexport const Toolbar = <T,>(props: ToolbarProps<T>) => {\n    const [getRootRef, setRootRef] = createSignal<HTMLElement>();\n    const [getOverflowRef, setOverflowRef] = createSignal<HTMLElement>();\n    const [getItemRefs, setItemRefs] = createSignal<(HTMLElement | undefined)[]>([]);\n    const [getFocusedStop, setFocusedStop] = createSignal<number>();\n\n    const getGap = createMemo(() => access(props.gap) ?? DEFAULT_TOOLBAR_GAP);\n\n    const getActions = createMemo(() => access(props.actions));\n\n    const getRootSize = ElementObserver.createBorderBoxSizeObserver(getRootRef);\n\n    const getItemSizes = ElementObserver.createBorderBoxSizeListObserver(getItemRefs);\n\n    const getOverflowSize = ElementObserver.createBorderBoxSizeObserver(getOverflowRef);\n\n    const setItemRef = (index: number, element: HTMLElement) => {\n        setItemRefs((previous) => {\n            const next = [...previous];\n\n            next[index] = element;\n\n            return next;\n        });\n    };\n\n    const getHasMeasured = createMemo(\n        () => getRootSize().width > NO_WIDTH && getItemSizes().length === getActions().length,\n    );\n\n    const getCut = createMemo(() =>\n        ToolbarUtils.computeCut({\n            widths: getItemSizes().map((size) => size.width),\n            collapses: getActions().map((action) => action.collapse ?? \"auto\"),\n            available: getRootSize().width,\n            overflowWidth: getOverflowSize().width,\n            gap: getGap(),\n        }),\n    );\n\n    const getIsShown = (index: number) => getCut().shownIndexes.includes(index);\n\n    const getOverflowItems = createMemo((): MenuItem<T>[] =>\n        getCut().collapsedIndexes.map((index) => ({\n            value: getActions()[index].value,\n            isDisabled: getActions()[index].isDisabled,\n        })),\n    );\n\n    const getHasOverflow = createMemo(() => getOverflowItems().length > 0);\n\n    const getStops = createMemo(() => getCut().shownIndexes.filter((index) => !getActions()[index].isDisabled));\n\n    const getRovingStop = createMemo(() => {\n        const stops = getStops();\n        const focused = getFocusedStop();\n\n        if (focused === OVERFLOW_STOP && getHasOverflow()) return focused;\n        if (focused !== undefined && stops.includes(focused)) return focused;\n\n        return stops[0] ?? (getHasOverflow() ? OVERFLOW_STOP : undefined);\n    });\n\n    createEffect(() => {\n        const stops = getStops();\n        const focused = getFocusedStop();\n\n        if (focused === undefined || focused === OVERFLOW_STOP || stops.includes(focused)) return;\n\n        const hadFocus = getItemRefs()[focused]?.contains(document.activeElement);\n        const landing = getHasOverflow() ? OVERFLOW_STOP : stops[0];\n\n        setFocusedStop(landing);\n\n        if (!hadFocus) return;\n\n        if (landing === OVERFLOW_STOP) getOverflowRef()?.focus();\n        else if (landing !== undefined) getItemRefs()[landing]?.focus();\n    });\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n        const stops = [...getStops(), ...(getHasOverflow() ? [OVERFLOW_STOP] : [])];\n        const from = stops.indexOf(getRovingStop() ?? stops[0]);\n\n        if (stops.length < 2 || from < 0) return;\n\n        const position = NavigatorUtils.computeNextPosition(e.key, from, stops.length, { orientation: \"row\" });\n\n        if (position === undefined) return;\n\n        e.preventDefault();\n\n        const next = stops[position];\n\n        setFocusedStop(next);\n\n        if (next === OVERFLOW_STOP) getOverflowRef()?.focus();\n        else getItemRefs()[next]?.focus();\n    };\n\n    return (\n        <div\n            ref={setRootRef}\n            class={styles.toolbarRoot}\n            style={{ gap: `${getGap()}px`, visibility: getHasMeasured() ? undefined : \"hidden\" }}\n            role=\"toolbar\"\n            aria-label={access(props.ariaLabel)}\n            onKeyDown={handleKeyDown}\n        >\n            <Index each={getActions()}>\n                {(getAction, index) => (\n                    <div\n                        class={[styles.toolbarItem, getIsShown(index) ? \"\" : styles.toolbarMeasuredItem].join(\" \")}\n                        role=\"presentation\"\n                        aria-hidden={getIsShown(index) ? undefined : \"true\"}\n                        inert={getIsShown(index) ? undefined : true}\n                    >\n                        <InteractionWrapper\n                            isDisabled={() => getAction().isDisabled ?? false}\n                            isTabbable={() => index === getRovingStop()}\n                            ref={(element) => setItemRef(index, element)}\n                            onActivation={() => props.onActivate(getAction().value)}\n                            renderControl={(setElementRef, getFlags) => (\n                                <button\n                                    type=\"button\"\n                                    ref={setElementRef}\n                                    class={styles.toolbarButton}\n                                    aria-disabled={getFlags().isDisabled || undefined}\n                                >\n                                    {props.renderAction(getAction, getFlags)}\n                                </button>\n                            )}\n                        />\n                    </div>\n                )}\n            </Index>\n\n            <div\n                class={[styles.toolbarItem, getHasOverflow() ? \"\" : styles.toolbarMeasuredItem].join(\" \")}\n                role=\"presentation\"\n                aria-hidden={getHasOverflow() ? undefined : \"true\"}\n                inert={getHasOverflow() ? undefined : true}\n            >\n                <Menu\n                    items={getOverflowItems}\n                    ariaLabel={props.overflowAriaLabel}\n                    isTabbable={() => getRovingStop() === OVERFLOW_STOP}\n                    ref={setOverflowRef}\n                    renderContent={props.renderOverflowTrigger}\n                    renderItem={props.renderOverflowItem}\n                    renderPopup={props.renderOverflowPopup}\n                    onActivate={props.onActivate}\n                />\n            </div>\n        </div>\n    );\n};\n"],"mappings":"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"}

package/dist/Fundamentals/Toolbar/Toolbar.utils.js

@@ -0,0 +1,36 @@
+//#region src/Fundamentals/Toolbar/Toolbar.utils.ts
+var NOTHING = 0;
+var SINGLE = 1;
+var ToolbarUtils;
+(function(_ToolbarUtils) {
+	_ToolbarUtils.computeCut = (defs) => {
+		const indexes = defs.widths.map((_unused, index) => index);
+		const collapseOf = (index) => defs.collapses[index] ?? "auto";
+		const widthOf = (index) => defs.widths[index] ?? NOTHING;
+		const wholeRow = defs.widths.reduce((total, width) => total + width, NOTHING) + defs.gap * Math.max(defs.widths.length - SINGLE, NOTHING);
+		if (!indexes.some((index) => collapseOf(index) === "always") && wholeRow <= defs.available) return {
+			shownIndexes: indexes,
+			collapsedIndexes: []
+		};
+		const kept = indexes.filter((index) => collapseOf(index) === "never");
+		const budget = defs.available - defs.overflowWidth;
+		let used = kept.reduce((total, index) => total + widthOf(index) + defs.gap, NOTHING);
+		const fitted = [];
+		for (const index of indexes) {
+			if (collapseOf(index) !== "auto") continue;
+			const next = used + widthOf(index) + defs.gap;
+			if (next > budget) break;
+			used = next;
+			fitted.push(index);
+		}
+		const shownIndexes = [...kept, ...fitted].sort((first, second) => first - second);
+		return {
+			shownIndexes,
+			collapsedIndexes: indexes.filter((index) => !shownIndexes.includes(index))
+		};
+	};
+})(ToolbarUtils || (ToolbarUtils = {}));
+//#endregion
+export { ToolbarUtils };
+
+//# sourceMappingURL=Toolbar.utils.js.map

package/dist/Fundamentals/Toolbar/Toolbar.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.utils.js","names":[],"sources":["../../../src/Fundamentals/Toolbar/Toolbar.utils.ts"],"sourcesContent":["import type { ToolbarCut, ToolbarCutDefs } from \"./Toolbar.types\";\n\nconst NOTHING = 0;\nconst SINGLE = 1;\n\nexport namespace ToolbarUtils {\n    export const computeCut = (defs: ToolbarCutDefs): ToolbarCut => {\n        const indexes = defs.widths.map((_unused, index) => index);\n        const collapseOf = (index: number) => defs.collapses[index] ?? \"auto\";\n        const widthOf = (index: number) => defs.widths[index] ?? NOTHING;\n\n        const wholeRow =\n            defs.widths.reduce((total, width) => total + width, NOTHING) +\n            defs.gap * Math.max(defs.widths.length - SINGLE, NOTHING);\n\n        if (!indexes.some((index) => collapseOf(index) === \"always\") && wholeRow <= defs.available) {\n            return { shownIndexes: indexes, collapsedIndexes: [] };\n        }\n\n        const kept = indexes.filter((index) => collapseOf(index) === \"never\");\n        const budget = defs.available - defs.overflowWidth;\n\n        let used = kept.reduce((total, index) => total + widthOf(index) + defs.gap, NOTHING);\n\n        const fitted: number[] = [];\n\n        for (const index of indexes) {\n            if (collapseOf(index) !== \"auto\") continue;\n\n            const next = used + widthOf(index) + defs.gap;\n\n            if (next > budget) break;\n\n            used = next;\n            fitted.push(index);\n        }\n\n        const shownIndexes = [...kept, ...fitted].sort((first, second) => first - second);\n\n        return {\n            shownIndexes,\n            collapsedIndexes: indexes.filter((index) => !shownIndexes.includes(index)),\n        };\n    };\n}\n"],"mappings":";AAEA,IAAM,UAAU;AAChB,IAAM,SAAS;AAER,IAAU;CAAV,SAAA,eAAA;CACU,cAAA,cAAc,SAAqC;EAC5D,MAAM,UAAU,KAAK,OAAO,KAAK,SAAS,UAAU,KAAK;EACzD,MAAM,cAAc,UAAkB,KAAK,UAAU,UAAU;EAC/D,MAAM,WAAW,UAAkB,KAAK,OAAO,UAAU;EAEzD,MAAM,WACF,KAAK,OAAO,QAAQ,OAAO,UAAU,QAAQ,OAAO,OAAO,IAC3D,KAAK,MAAM,KAAK,IAAI,KAAK,OAAO,SAAS,QAAQ,OAAO;EAE5D,IAAI,CAAC,QAAQ,MAAM,UAAU,WAAW,KAAK,MAAM,QAAQ,KAAK,YAAY,KAAK,WAC7E,OAAO;GAAE,cAAc;GAAS,kBAAkB,CAAC;EAAE;EAGzD,MAAM,OAAO,QAAQ,QAAQ,UAAU,WAAW,KAAK,MAAM,OAAO;EACpE,MAAM,SAAS,KAAK,YAAY,KAAK;EAErC,IAAI,OAAO,KAAK,QAAQ,OAAO,UAAU,QAAQ,QAAQ,KAAK,IAAI,KAAK,KAAK,OAAO;EAEnF,MAAM,SAAmB,CAAC;EAE1B,KAAK,MAAM,SAAS,SAAS;GACzB,IAAI,WAAW,KAAK,MAAM,QAAQ;GAElC,MAAM,OAAO,OAAO,QAAQ,KAAK,IAAI,KAAK;GAE1C,IAAI,OAAO,QAAQ;GAEnB,OAAO;GACP,OAAO,KAAK,KAAK;EACrB;EAEA,MAAM,eAAe,CAAC,GAAG,MAAM,GAAG,MAAM,CAAC,CAAC,MAAM,OAAO,WAAW,QAAQ,MAAM;EAEhF,OAAO;GACH;GACA,kBAAkB,QAAQ,QAAQ,UAAU,CAAC,aAAa,SAAS,KAAK,CAAC;EAC7E;CACJ;AACH,EAAA,CAAA,iBAAA,eAAA,CAAA,EAAD"}

package/dist/Fundamentals/Tooltip/Tooltip.css.js

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

package/dist/Fundamentals/Tooltip/Tooltip.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.css.js","names":[],"sources":["../../../src/Fundamentals/Tooltip/Tooltip.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const tooltipRoot = style({\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    pointerEvents: \"none\",\n});\n"],"mappings":""}

package/dist/Fundamentals/Tooltip/Tooltip.js

@@ -0,0 +1,124 @@
+import { useViewportContext } from "../../Exotics/Viewport/Viewport.context.js";
+import { Anchor } from "../../Abstracts/Anchor/Anchor.js";
+import { access } from "../../Utils/propUtils.js";
+import { ElementFader } from "../../Abstracts/ElementFader/ElementFader.js";
+import { FocusManager } from "../../Abstracts/FocusManager/FocusManager.js";
+import { tooltipRoot } from "./Tooltip.css.js";
+import { Show, createEffect, createMemo, createSignal, createUniqueId, onCleanup } from "solid-js";
+import { Portal, className, createComponent, effect, insert, setAttribute, setStyleProperty, template, use } from "solid-js/web";
+//#region src/Fundamentals/Tooltip/Tooltip.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div role=tooltip>`);
+var DEFAULT_TOOLTIP_TRANSITION_DURATION_MS = 200;
+var DEFAULT_TOOLTIP_SHOW_ON_FOCUS_DELAY_MS = 500;
+var DEFAULT_ARIA_DESCRIBED_BY = "aria-describedby";
+var Tooltip = (props) => {
+	const viewportContext = useViewportContext();
+	const tooltipId = createUniqueId();
+	let focusTimeout;
+	onCleanup(() => {
+		clearTimeout(focusTimeout);
+	});
+	const [getShouldShow, setShouldShow] = createSignal(false);
+	const getTransitionDurationMs = createMemo(() => access(props.transitionDurationMs) ?? DEFAULT_TOOLTIP_TRANSITION_DURATION_MS);
+	const getFocusShowDelayMs = createMemo(() => access(props.focusShowDelayMs) ?? DEFAULT_TOOLTIP_SHOW_ON_FOCUS_DELAY_MS);
+	const { getIsVisible, getTransitionTarget } = ElementFader.createFader(getShouldShow, { getTransitionDurationMs });
+	const { getPlacement, getPosition, getZIndex, setContentRef } = Anchor.createPortalPosition(() => access(props.anchorRef), getIsVisible, {
+		getPlacement: () => access(props.placement),
+		getOffset: props.offset === void 0 ? void 0 : () => access(props.offset),
+		getReservedScreenSize: props.reservedScreenSize === void 0 ? void 0 : () => access(props.reservedScreenSize)
+	});
+	const handleMouseEnter = () => {
+		clearTimeout(focusTimeout);
+		setShouldShow(true);
+	};
+	const handleMouseLeave = () => {
+		clearTimeout(focusTimeout);
+		setShouldShow(false);
+	};
+	const handleKeyDown = (e) => {
+		if (!getIsVisible()) return;
+		if (e.key === "Escape") {
+			clearTimeout(focusTimeout);
+			setShouldShow(false);
+		}
+	};
+	const handleFocus = () => {
+		clearTimeout(focusTimeout);
+		const anchorRef = access(props.anchorRef);
+		if (FocusManager.getIsRestoringFocus()) return;
+		if (anchorRef && !anchorRef.matches(":focus-visible")) return;
+		focusTimeout = setTimeout(() => {
+			setShouldShow(true);
+		}, getFocusShowDelayMs());
+	};
+	const handleBlur = () => {
+		clearTimeout(focusTimeout);
+		setShouldShow(false);
+	};
+	createEffect(() => {
+		const anchorRef = access(props.anchorRef);
+		onCleanup(() => {
+			anchorRef?.removeEventListener("mouseenter", handleMouseEnter);
+			anchorRef?.removeEventListener("mouseleave", handleMouseLeave);
+			anchorRef?.removeEventListener("keydown", handleKeyDown);
+			anchorRef?.removeEventListener("focus", handleFocus);
+			anchorRef?.removeEventListener("blur", handleBlur);
+		});
+		if (!anchorRef) return;
+		anchorRef.addEventListener("mouseenter", handleMouseEnter);
+		anchorRef.addEventListener("mouseleave", handleMouseLeave);
+		anchorRef.addEventListener("keydown", handleKeyDown);
+		anchorRef.addEventListener("focus", handleFocus);
+		anchorRef.addEventListener("blur", handleBlur);
+	});
+	createEffect(() => {
+		const anchorRef = access(props.anchorRef);
+		const isVisible = getIsVisible();
+		if (!anchorRef || !isVisible) return;
+		const describedBy = anchorRef.getAttribute(DEFAULT_ARIA_DESCRIBED_BY);
+		const ids = describedBy ? describedBy.split(/\s+/).filter(Boolean) : [];
+		if (!ids.includes(tooltipId)) anchorRef.setAttribute(DEFAULT_ARIA_DESCRIBED_BY, [...ids, tooltipId].join(" "));
+		onCleanup(() => {
+			const current = anchorRef.getAttribute(DEFAULT_ARIA_DESCRIBED_BY);
+			if (!current) return;
+			const remaining = current.split(/\s+/).filter((id) => id && id !== tooltipId);
+			if (remaining.length) anchorRef.setAttribute(DEFAULT_ARIA_DESCRIBED_BY, remaining.join(" "));
+			else anchorRef.removeAttribute(DEFAULT_ARIA_DESCRIBED_BY);
+		});
+	});
+	return createComponent(Show, {
+		get when() {
+			return getIsVisible();
+		},
+		get children() {
+			return createComponent(Portal, {
+				get mount() {
+					return viewportContext.getPortalRef();
+				},
+				get children() {
+					var _el$ = _tmpl$();
+					use(setContentRef, _el$);
+					setAttribute(_el$, "id", tooltipId);
+					className(_el$, tooltipRoot);
+					insert(_el$, () => props.renderContent(getTransitionTarget, getTransitionDurationMs, getPlacement));
+					effect((_p$) => {
+						var _v$ = getPosition() ? "visible" : "hidden", _v$2 = `translate(${getPosition()?.x ?? 0}px, ${getPosition()?.y ?? 0}px)`, _v$3 = getZIndex();
+						_v$ !== _p$.e && setStyleProperty(_el$, "visibility", _p$.e = _v$);
+						_v$2 !== _p$.t && setStyleProperty(_el$, "transform", _p$.t = _v$2);
+						_v$3 !== _p$.a && setStyleProperty(_el$, "z-index", _p$.a = _v$3);
+						return _p$;
+					}, {
+						e: void 0,
+						t: void 0,
+						a: void 0
+					});
+					return _el$;
+				}
+			});
+		}
+	});
+};
+//#endregion
+export { Tooltip };
+
+//# sourceMappingURL=Tooltip.js.map

package/dist/Fundamentals/Tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","names":["Show","createEffect","createMemo","createSignal","createUniqueId","onCleanup","Portal","Anchor","ElementFader","FocusManager","useViewportContext","access","TooltipProps","styles","DEFAULT_TOOLTIP_TRANSITION_DURATION_MS","DEFAULT_TOOLTIP_SHOW_ON_FOCUS_DELAY_MS","DEFAULT_ARIA_DESCRIBED_BY","Tooltip","props","viewportContext","tooltipId","focusTimeout","ReturnType","setTimeout","clearTimeout","getShouldShow","setShouldShow","getTransitionDurationMs","transitionDurationMs","getFocusShowDelayMs","focusShowDelayMs","getIsVisible","getTransitionTarget","createFader","getPlacement","getPosition","getZIndex","setContentRef","createPortalPosition","anchorRef","placement","getOffset","offset","undefined","getReservedScreenSize","reservedScreenSize","handleMouseEnter","handleMouseLeave","handleKeyDown","e","KeyboardEvent","key","handleFocus","getIsRestoringFocus","matches","handleBlur","removeEventListener","addEventListener","isVisible","describedBy","getAttribute","ids","split","filter","Boolean","includes","setAttribute","join","current","remaining","id","length","removeAttribute","_$createComponent","when","children","mount","getPortalRef","_el$","_tmpl$","_$use","_$setAttribute","_$className","tooltipRoot","_$insert","renderContent","_$effect","_p$","_v$","_v$2","x","y","_v$3","_$setStyleProperty","t","a"],"sources":["../../../src/Fundamentals/Tooltip/Tooltip.tsx"],"sourcesContent":["import { Show, createEffect, createMemo, createSignal, createUniqueId, onCleanup } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\n\nimport { Anchor } from \"../../Abstracts/Anchor/Anchor\";\nimport { ElementFader } from \"../../Abstracts/ElementFader/ElementFader\";\nimport { FocusManager } from \"../../Abstracts/FocusManager/FocusManager\";\nimport { useViewportContext } from \"../../Exotics/Viewport/Viewport.context\";\nimport { access } from \"../../Utils/propUtils\";\nimport type { TooltipProps } from \"./Tooltip.types\";\n\nimport * as styles from \"./Tooltip.css\";\n\nconst DEFAULT_TOOLTIP_TRANSITION_DURATION_MS = 200;\nconst DEFAULT_TOOLTIP_SHOW_ON_FOCUS_DELAY_MS = 500;\nconst DEFAULT_ARIA_DESCRIBED_BY = \"aria-describedby\";\n\nexport const Tooltip = (props: TooltipProps) => {\n    const viewportContext = useViewportContext();\n\n    const tooltipId = createUniqueId();\n\n    let focusTimeout: ReturnType<typeof setTimeout> | undefined;\n\n    onCleanup(() => {\n        clearTimeout(focusTimeout);\n    });\n\n    const [getShouldShow, setShouldShow] = createSignal(false);\n\n    const getTransitionDurationMs = createMemo(\n        () => access(props.transitionDurationMs) ?? DEFAULT_TOOLTIP_TRANSITION_DURATION_MS,\n    );\n\n    const getFocusShowDelayMs = createMemo(\n        () => access(props.focusShowDelayMs) ?? DEFAULT_TOOLTIP_SHOW_ON_FOCUS_DELAY_MS,\n    );\n\n    const { getIsVisible, getTransitionTarget } = ElementFader.createFader(getShouldShow, {\n        getTransitionDurationMs,\n    });\n\n    const { getPlacement, getPosition, getZIndex, setContentRef } = Anchor.createPortalPosition(\n        () => access(props.anchorRef),\n        getIsVisible,\n        {\n            getPlacement: () => access(props.placement),\n            getOffset: props.offset === undefined ? undefined : () => access(props.offset)!,\n            getReservedScreenSize:\n                props.reservedScreenSize === undefined ? undefined : () => access(props.reservedScreenSize)!,\n        },\n    );\n\n    const handleMouseEnter = () => {\n        clearTimeout(focusTimeout);\n        setShouldShow(true);\n    };\n\n    const handleMouseLeave = () => {\n        clearTimeout(focusTimeout);\n        setShouldShow(false);\n    };\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n        if (!getIsVisible()) return;\n\n        if (e.key === \"Escape\") {\n            clearTimeout(focusTimeout);\n            setShouldShow(false);\n        }\n    };\n\n    const handleFocus = () => {\n        clearTimeout(focusTimeout);\n\n        const anchorRef = access(props.anchorRef);\n\n        if (FocusManager.getIsRestoringFocus()) return;\n        if (anchorRef && !anchorRef.matches(\":focus-visible\")) return;\n\n        focusTimeout = setTimeout(() => {\n            setShouldShow(true);\n        }, getFocusShowDelayMs());\n    };\n\n    const handleBlur = () => {\n        clearTimeout(focusTimeout);\n        setShouldShow(false);\n    };\n\n    createEffect(() => {\n        const anchorRef = access(props.anchorRef);\n\n        onCleanup(() => {\n            anchorRef?.removeEventListener(\"mouseenter\", handleMouseEnter);\n            anchorRef?.removeEventListener(\"mouseleave\", handleMouseLeave);\n            anchorRef?.removeEventListener(\"keydown\", handleKeyDown);\n            anchorRef?.removeEventListener(\"focus\", handleFocus);\n            anchorRef?.removeEventListener(\"blur\", handleBlur);\n        });\n\n        if (!anchorRef) return;\n\n        anchorRef.addEventListener(\"mouseenter\", handleMouseEnter);\n        anchorRef.addEventListener(\"mouseleave\", handleMouseLeave);\n        anchorRef.addEventListener(\"keydown\", handleKeyDown);\n        anchorRef.addEventListener(\"focus\", handleFocus);\n        anchorRef.addEventListener(\"blur\", handleBlur);\n    });\n\n    createEffect(() => {\n        const anchorRef = access(props.anchorRef);\n        const isVisible = getIsVisible();\n\n        if (!anchorRef || !isVisible) return;\n\n        const describedBy = anchorRef.getAttribute(DEFAULT_ARIA_DESCRIBED_BY);\n        const ids = describedBy ? describedBy.split(/\\s+/).filter(Boolean) : [];\n\n        if (!ids.includes(tooltipId)) {\n            anchorRef.setAttribute(DEFAULT_ARIA_DESCRIBED_BY, [...ids, tooltipId].join(\" \"));\n        }\n\n        onCleanup(() => {\n            const current = anchorRef.getAttribute(DEFAULT_ARIA_DESCRIBED_BY);\n\n            if (!current) return;\n\n            const remaining = current.split(/\\s+/).filter((id) => id && id !== tooltipId);\n\n            if (remaining.length) {\n                anchorRef.setAttribute(DEFAULT_ARIA_DESCRIBED_BY, remaining.join(\" \"));\n            } else {\n                anchorRef.removeAttribute(DEFAULT_ARIA_DESCRIBED_BY);\n            }\n        });\n    });\n\n    return (\n        <Show when={getIsVisible()}>\n            <Portal mount={viewportContext.getPortalRef()}>\n                <div\n                    ref={setContentRef}\n                    id={tooltipId}\n                    class={styles.tooltipRoot}\n                    style={{\n                        \"visibility\": getPosition() ? \"visible\" : \"hidden\",\n                        \"transform\": `translate(${getPosition()?.x ?? 0}px, ${getPosition()?.y ?? 0}px)`,\n                        \"z-index\": getZIndex(),\n                    }}\n                    role=\"tooltip\"\n                >\n                    {props.renderContent(getTransitionTarget, getTransitionDurationMs, getPlacement)}\n                </div>\n            </Portal>\n        </Show>\n    );\n};\n"],"mappings":";;;;;;;;;;AAYA,IAAMc,yCAAyC;AAC/C,IAAMC,yCAAyC;AAC/C,IAAMC,4BAA4B;AAElC,IAAaC,WAAWC,UAAwB;CAC5C,MAAMC,kBAAkBT,mBAAmB;CAE3C,MAAMU,YAAYhB,eAAe;CAEjC,IAAIiB;CAEJhB,gBAAgB;EACZmB,aAAaH,YAAY;CAC7B,CAAC;CAED,MAAM,CAACI,eAAeC,iBAAiBvB,aAAa,KAAK;CAEzD,MAAMwB,0BAA0BzB,iBACtBS,OAAOO,MAAMU,oBAAoB,KAAKd,sCAChD;CAEA,MAAMe,sBAAsB3B,iBAClBS,OAAOO,MAAMY,gBAAgB,KAAKf,sCAC5C;CAEA,MAAM,EAAEgB,cAAcC,wBAAwBxB,aAAayB,YAAYR,eAAe,EAClFE,wBACJ,CAAC;CAED,MAAM,EAAEO,cAAcC,aAAaC,WAAWC,kBAAkB9B,OAAO+B,2BAC7D3B,OAAOO,MAAMqB,SAAS,GAC5BR,cACA;EACIG,oBAAoBvB,OAAOO,MAAMsB,SAAS;EAC1CC,WAAWvB,MAAMwB,WAAWC,KAAAA,IAAYA,KAAAA,UAAkBhC,OAAOO,MAAMwB,MAAM;EAC7EE,uBACI1B,MAAM2B,uBAAuBF,KAAAA,IAAYA,KAAAA,UAAkBhC,OAAOO,MAAM2B,kBAAkB;CAClG,CACJ;CAEA,MAAMC,yBAAyB;EAC3BtB,aAAaH,YAAY;EACzBK,cAAc,IAAI;CACtB;CAEA,MAAMqB,yBAAyB;EAC3BvB,aAAaH,YAAY;EACzBK,cAAc,KAAK;CACvB;CAEA,MAAMsB,iBAAiBC,MAAqB;EACxC,IAAI,CAAClB,aAAa,GAAG;EAErB,IAAIkB,EAAEE,QAAQ,UAAU;GACpB3B,aAAaH,YAAY;GACzBK,cAAc,KAAK;EACvB;CACJ;CAEA,MAAM0B,oBAAoB;EACtB5B,aAAaH,YAAY;EAEzB,MAAMkB,YAAY5B,OAAOO,MAAMqB,SAAS;EAExC,IAAI9B,aAAa4C,oBAAoB,GAAG;EACxC,IAAId,aAAa,CAACA,UAAUe,QAAQ,gBAAgB,GAAG;EAEvDjC,eAAeE,iBAAiB;GAC5BG,cAAc,IAAI;EACtB,GAAGG,oBAAoB,CAAC;CAC5B;CAEA,MAAM0B,mBAAmB;EACrB/B,aAAaH,YAAY;EACzBK,cAAc,KAAK;CACvB;CAEAzB,mBAAmB;EACf,MAAMsC,YAAY5B,OAAOO,MAAMqB,SAAS;EAExClC,gBAAgB;GACZkC,WAAWiB,oBAAoB,cAAcV,gBAAgB;GAC7DP,WAAWiB,oBAAoB,cAAcT,gBAAgB;GAC7DR,WAAWiB,oBAAoB,WAAWR,aAAa;GACvDT,WAAWiB,oBAAoB,SAASJ,WAAW;GACnDb,WAAWiB,oBAAoB,QAAQD,UAAU;EACrD,CAAC;EAED,IAAI,CAAChB,WAAW;EAEhBA,UAAUkB,iBAAiB,cAAcX,gBAAgB;EACzDP,UAAUkB,iBAAiB,cAAcV,gBAAgB;EACzDR,UAAUkB,iBAAiB,WAAWT,aAAa;EACnDT,UAAUkB,iBAAiB,SAASL,WAAW;EAC/Cb,UAAUkB,iBAAiB,QAAQF,UAAU;CACjD,CAAC;CAEDtD,mBAAmB;EACf,MAAMsC,YAAY5B,OAAOO,MAAMqB,SAAS;EACxC,MAAMmB,YAAY3B,aAAa;EAE/B,IAAI,CAACQ,aAAa,CAACmB,WAAW;EAE9B,MAAMC,cAAcpB,UAAUqB,aAAa5C,yBAAyB;EACpE,MAAM6C,MAAMF,cAAcA,YAAYG,MAAM,KAAK,CAAC,CAACC,OAAOC,OAAO,IAAI,CAAA;EAErE,IAAI,CAACH,IAAII,SAAS7C,SAAS,GACvBmB,UAAU2B,aAAalD,2BAA2B,CAAC,GAAG6C,KAAKzC,SAAS,CAAC,CAAC+C,KAAK,GAAG,CAAC;EAGnF9D,gBAAgB;GACZ,MAAM+D,UAAU7B,UAAUqB,aAAa5C,yBAAyB;GAEhE,IAAI,CAACoD,SAAS;GAEd,MAAMC,YAAYD,QAAQN,MAAM,KAAK,CAAC,CAACC,QAAQO,OAAOA,MAAMA,OAAOlD,SAAS;GAE5E,IAAIiD,UAAUE,QACVhC,UAAU2B,aAAalD,2BAA2BqD,UAAUF,KAAK,GAAG,CAAC;QAErE5B,UAAUiC,gBAAgBxD,yBAAyB;EAE3D,CAAC;CACL,CAAC;CAED,OAAAyD,gBACKzE,MAAI;EAAA,IAAC0E,OAAI;GAAA,OAAE3C,aAAa;EAAC;EAAA,IAAA4C,WAAA;GAAA,OAAAF,gBACrBnE,QAAM;IAAA,IAACsE,QAAK;KAAA,OAAEzD,gBAAgB0D,aAAa;IAAC;IAAA,IAAAF,WAAA;KAAA,IAAAG,OAAAC,OAAA;KAAAC,IAEhC3C,eAAayC,IAAA;KAAAG,aAAAH,MAAA,MACd1D,SAAS;KAAA8D,UAAAJ,MACNjE,WAAkB;KAAAuE,OAAAN,YAQxB5D,MAAMmE,cAAcrD,qBAAqBL,yBAAyBO,YAAY,CAAC;KAAAoD,QAAAC,QAAA;MAAA,IAAAC,MAN9DrD,YAAY,IAAI,YAAY,UAAQsD,OACrC,aAAatD,YAAY,CAAC,EAAEuD,KAAK,EAAC,MAAOvD,YAAY,CAAC,EAAEwD,KAAK,EAAC,MAAKC,OACrExD,UAAU;MAACoD,QAAAD,IAAAtC,KAAA4C,iBAAAf,MAAA,cAAAS,IAAAtC,IAAAuC,GAAA;MAAAC,SAAAF,IAAAO,KAAAD,iBAAAf,MAAA,aAAAS,IAAAO,IAAAL,IAAA;MAAAG,SAAAL,IAAAQ,KAAAF,iBAAAf,MAAA,WAAAS,IAAAQ,IAAAH,IAAA;MAAA,OAAAL;KAAA,GAAA;MAAAtC,GAAAN,KAAAA;MAAAmD,GAAAnD,KAAAA;MAAAoD,GAAApD,KAAAA;KAAA,CAAA;KAAA,OAAAmC;IAAA;GAAA,CAAA;EAAA;CAAA,CAAA;AAS9C"}

package/dist/Fundamentals/TrackCarousel/TrackCarousel.js

@@ -0,0 +1,8 @@
+import { Carousel } from "../Carousel/Carousel.js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Fundamentals/TrackCarousel/TrackCarousel.tsx
+var TrackCarousel = (props) => createComponent(Carousel, mergeProps(props, { variant: "track" }));
+//#endregion
+export { TrackCarousel };
+
+//# sourceMappingURL=TrackCarousel.js.map

package/dist/Fundamentals/TrackCarousel/TrackCarousel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TrackCarousel.js","names":["Carousel","TrackCarouselProps","TrackCarousel","props","T","_$createComponent","_$mergeProps","variant"],"sources":["../../../src/Fundamentals/TrackCarousel/TrackCarousel.tsx"],"sourcesContent":["import { Carousel } from \"../Carousel/Carousel\";\nimport type { TrackCarouselProps } from \"../Carousel/Carousel.types\";\n\nexport const TrackCarousel = <T,>(props: TrackCarouselProps<T>) => <Carousel<T> {...props} variant={\"track\"} />;\n"],"mappings":";;;AAGA,IAAaE,iBAAqBC,UAA4BE,gBAAML,UAAQM,WAAQH,OAAK,EAAEI,SAAS,QAAO,CAAA,CAAA"}

package/dist/Fundamentals/Tree/Tree.css.js

@@ -0,0 +1,9 @@
+/* empty css                        */
+//#region src/Fundamentals/Tree/Tree.css.ts
+var treeNode = "_1pbzag80";
+var treeSizer = "_1pbzag81";
+var treeSizerRow = "_1pbzag82";
+//#endregion
+export { treeNode, treeSizer, treeSizerRow };
+
+//# sourceMappingURL=Tree.css.js.map

package/dist/Fundamentals/Tree/Tree.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tree.css.js","names":[],"sources":["../../../src/Fundamentals/Tree/Tree.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const treeNode = style({\n    width: \"100%\",\n    cursor: \"pointer\",\n    pointerEvents: \"all\",\n\n    selectors: {\n        \"&[aria-disabled='true']\": {\n            cursor: \"not-allowed\",\n        },\n    },\n});\n\nexport const treeSizer = style({\n    position: \"relative\",\n    width: \"100%\",\n});\n\nexport const treeSizerRow = style({\n    position: \"absolute\",\n    top: 0,\n    left: 0,\n    width: \"100%\",\n});\n"],"mappings":""}