@thewaver/ss-components 0.0.1 → 0.0.2

package/dist/Abstracts/TextSync/TextSync.utils.js

@@ -0,0 +1,128 @@
+//#region src/Abstracts/TextSync/TextSync.utils.ts
+var DIGIT_FIRST = "0";
+var DIGIT_LAST = "9";
+var MINUS_SIGN = "-";
+var GROUP_SAMPLE_VALUE = 1234567890;
+var FALLBACK_GROUP_SIZE = 3;
+var getIsDigit = (char) => char >= DIGIT_FIRST && char <= DIGIT_LAST;
+var getDigits = (text) => [...text].filter(getIsDigit).join("");
+var getGroups = (whole, sizes) => {
+	const groups = [];
+	let end = whole.length;
+	let index = 0;
+	while (end > 0) {
+		const size = sizes[Math.min(index, sizes.length - 1)];
+		if (size === void 0 || size < 1) {
+			groups.unshift(whole.slice(0, end));
+			break;
+		}
+		groups.unshift(whole.slice(Math.max(0, end - size), end));
+		end -= size;
+		index += 1;
+	}
+	return groups;
+};
+var splitSign = (text, hasSign) => hasSign && text.includes(MINUS_SIGN) ? {
+	sign: MINUS_SIGN,
+	rest: text.split(MINUS_SIGN).join("")
+} : {
+	sign: "",
+	rest: text
+};
+var TextSyncUtils;
+(function(_TextSyncUtils) {
+	const MASK_DIGIT = _TextSyncUtils.MASK_DIGIT = "#";
+	const applyMask = _TextSyncUtils.applyMask = (pattern, previous, next, caret) => {
+		const previousDigits = getDigits(previous);
+		const isDeletion = next.length < previous.length;
+		let digits = getDigits(next);
+		let digitIndex = getDigits(next.slice(0, caret)).length;
+		if (isDeletion && digits.length === previousDigits.length && digitIndex > 0) {
+			digits = digits.slice(0, digitIndex - 1) + digits.slice(digitIndex);
+			digitIndex -= 1;
+		}
+		const offsetsAfterDigit = [];
+		let text = "";
+		let used = 0;
+		for (const char of pattern) if (char === MASK_DIGIT) {
+			if (used >= digits.length) break;
+			text += digits[used];
+			used += 1;
+			offsetsAfterDigit.push(text.length);
+		} else {
+			if (digits.length === 0) break;
+			text += char;
+		}
+		const clampedIndex = Math.min(digitIndex, offsetsAfterDigit.length);
+		if (clampedIndex === offsetsAfterDigit.length) return {
+			text,
+			caret: text.length
+		};
+		return {
+			text,
+			caret: clampedIndex === 0 ? 0 : offsetsAfterDigit[clampedIndex - 1]
+		};
+	};
+	_TextSyncUtils.getMaskedDigits = getDigits;
+	_TextSyncUtils.readGroups = (digits, lengths) => {
+		const groups = [];
+		let offset = 0;
+		for (const length of lengths) {
+			if (offset + length > digits.length) break;
+			groups.push(Number(digits.slice(offset, offset + length)));
+			offset += length;
+		}
+		return groups;
+	};
+	_TextSyncUtils.formatWithMask = (pattern, digits) => applyMask(pattern, "", getDigits(digits), digits.length).text;
+	_TextSyncUtils.MASK_MINUS = MINUS_SIGN;
+	_TextSyncUtils.getGroupSizes = (locale) => {
+		const sizes = new Intl.NumberFormat(locale).formatToParts(GROUP_SAMPLE_VALUE).filter((part) => part.type === "integer").map((part) => part.value.length).slice(1).reverse();
+		if (sizes.length === 0) return [FALLBACK_GROUP_SIZE];
+		while (sizes.length > 1 && sizes[sizes.length - 1] === sizes[sizes.length - 2]) sizes.pop();
+		return sizes;
+	};
+	const applyGroupedMask = _TextSyncUtils.applyGroupedMask = (defs, previous, next, caret) => {
+		const { sign } = splitSign(next, defs.hasSign);
+		const previousDigits = getDigits(previous);
+		const isDeletion = next.length < previous.length;
+		let digits = getDigits(next);
+		let digitsAfter = getDigits(next.slice(caret)).length;
+		if (isDeletion && digits.length === previousDigits.length && digits.length > digitsAfter) {
+			const index = digits.length - digitsAfter;
+			digits = digits.slice(0, index - 1) + digits.slice(index);
+		}
+		digits = digits.replace(/^0+(?=\d)/, "");
+		if (digits.length === 0) return {
+			text: sign,
+			caret: sign.length
+		};
+		const padded = digits.padStart(defs.decimals + 1, "0");
+		const whole = padded.slice(0, padded.length - defs.decimals);
+		const fraction = padded.slice(padded.length - defs.decimals);
+		const text = sign + getGroups(whole, defs.groupSizes).join(defs.groupSeparator) + (defs.decimals > 0 ? defs.decimalSeparator + fraction : "");
+		digitsAfter = Math.min(digitsAfter, padded.length);
+		let seen = 0;
+		let offset = text.length;
+		while (offset > 0 && seen < digitsAfter) {
+			offset -= 1;
+			if (getIsDigit(text[offset])) seen += 1;
+		}
+		return {
+			text,
+			caret: offset
+		};
+	};
+	_TextSyncUtils.formatWithGroups = (defs, digits) => {
+		const { sign, rest } = splitSign(digits, defs.hasSign);
+		return applyGroupedMask(defs, "", sign + getDigits(rest), 0).text;
+	};
+	_TextSyncUtils.readSignedDigits = (text) => {
+		const { sign, rest } = splitSign(text, true);
+		return sign + getDigits(rest);
+	};
+})(TextSyncUtils || (TextSyncUtils = {}));
+//#endregion
+export { TextSyncUtils };
+
+//# sourceMappingURL=TextSync.utils.js.map

package/dist/Abstracts/TextSync/TextSync.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextSync.utils.js","names":[],"sources":["../../../src/Abstracts/TextSync/TextSync.utils.ts"],"sourcesContent":["export type TextSyncMaskResult = {\n    text: string;\n    caret: number;\n};\n\nexport type TextSyncGroupDefs = {\n    groupSizes: number[];\n    groupSeparator: string;\n    decimalSeparator: string;\n    decimals: number;\n    hasSign?: boolean;\n};\n\nconst DIGIT_FIRST = \"0\";\nconst DIGIT_LAST = \"9\";\n\nconst MINUS_SIGN = \"-\";\n\nconst GROUP_SAMPLE_VALUE = 1234567890;\n\nconst FALLBACK_GROUP_SIZE = 3;\n\nconst getIsDigit = (char: string) => char >= DIGIT_FIRST && char <= DIGIT_LAST;\n\nconst getDigits = (text: string) => [...text].filter(getIsDigit).join(\"\");\n\nconst getGroups = (whole: string, sizes: number[]) => {\n    const groups: string[] = [];\n\n    let end = whole.length;\n    let index = 0;\n\n    while (end > 0) {\n        const size = sizes[Math.min(index, sizes.length - 1)];\n\n        if (size === undefined || size < 1) {\n            groups.unshift(whole.slice(0, end));\n            break;\n        }\n\n        groups.unshift(whole.slice(Math.max(0, end - size), end));\n\n        end -= size;\n        index += 1;\n    }\n\n    return groups;\n};\n\nconst splitSign = (text: string, hasSign: boolean | undefined) =>\n    hasSign && text.includes(MINUS_SIGN)\n        ? { sign: MINUS_SIGN, rest: text.split(MINUS_SIGN).join(\"\") }\n        : { sign: \"\", rest: text };\n\nexport namespace TextSyncUtils {\n    export const MASK_DIGIT = \"#\";\n\n    export const applyMask = (pattern: string, previous: string, next: string, caret: number): TextSyncMaskResult => {\n        const previousDigits = getDigits(previous);\n        const isDeletion = next.length < previous.length;\n\n        let digits = getDigits(next);\n        let digitIndex = getDigits(next.slice(0, caret)).length;\n\n        if (isDeletion && digits.length === previousDigits.length && digitIndex > 0) {\n            digits = digits.slice(0, digitIndex - 1) + digits.slice(digitIndex);\n            digitIndex -= 1;\n        }\n\n        const offsetsAfterDigit: number[] = [];\n\n        let text = \"\";\n        let used = 0;\n\n        for (const char of pattern) {\n            if (char === MASK_DIGIT) {\n                if (used >= digits.length) break;\n\n                text += digits[used];\n                used += 1;\n                offsetsAfterDigit.push(text.length);\n            } else {\n                if (digits.length === 0) break;\n\n                text += char;\n            }\n        }\n\n        const clampedIndex = Math.min(digitIndex, offsetsAfterDigit.length);\n\n        if (clampedIndex === offsetsAfterDigit.length) return { text, caret: text.length };\n\n        return { text, caret: clampedIndex === 0 ? 0 : offsetsAfterDigit[clampedIndex - 1] };\n    };\n\n    export const getMaskedDigits = getDigits;\n\n    export const readGroups = (digits: string, lengths: number[]) => {\n        const groups: number[] = [];\n\n        let offset = 0;\n\n        for (const length of lengths) {\n            if (offset + length > digits.length) break;\n\n            groups.push(Number(digits.slice(offset, offset + length)));\n            offset += length;\n        }\n\n        return groups;\n    };\n\n    export const formatWithMask = (pattern: string, digits: string) =>\n        applyMask(pattern, \"\", getDigits(digits), digits.length).text;\n\n    export const MASK_MINUS = MINUS_SIGN;\n\n    export const getGroupSizes = (locale?: string) => {\n        const lengths = new Intl.NumberFormat(locale)\n            .formatToParts(GROUP_SAMPLE_VALUE)\n            .filter((part) => part.type === \"integer\")\n            .map((part) => part.value.length);\n\n        const sizes = lengths.slice(1).reverse();\n\n        if (sizes.length === 0) return [FALLBACK_GROUP_SIZE];\n\n        while (sizes.length > 1 && sizes[sizes.length - 1] === sizes[sizes.length - 2]) sizes.pop();\n\n        return sizes;\n    };\n\n    export const applyGroupedMask = (\n        defs: TextSyncGroupDefs,\n        previous: string,\n        next: string,\n        caret: number,\n    ): TextSyncMaskResult => {\n        const { sign } = splitSign(next, defs.hasSign);\n        const previousDigits = getDigits(previous);\n        const isDeletion = next.length < previous.length;\n\n        let digits = getDigits(next);\n        let digitsAfter = getDigits(next.slice(caret)).length;\n\n        if (isDeletion && digits.length === previousDigits.length && digits.length > digitsAfter) {\n            const index = digits.length - digitsAfter;\n\n            digits = digits.slice(0, index - 1) + digits.slice(index);\n        }\n\n        digits = digits.replace(/^0+(?=\\d)/, \"\");\n\n        if (digits.length === 0) return { text: sign, caret: sign.length };\n\n        const padded = digits.padStart(defs.decimals + 1, \"0\");\n        const whole = padded.slice(0, padded.length - defs.decimals);\n        const fraction = padded.slice(padded.length - defs.decimals);\n\n        const groups = getGroups(whole, defs.groupSizes);\n\n        const text =\n            sign + groups.join(defs.groupSeparator) + (defs.decimals > 0 ? defs.decimalSeparator + fraction : \"\");\n\n        digitsAfter = Math.min(digitsAfter, padded.length);\n\n        let seen = 0;\n        let offset = text.length;\n\n        while (offset > 0 && seen < digitsAfter) {\n            offset -= 1;\n\n            if (getIsDigit(text[offset])) seen += 1;\n        }\n\n        return { text, caret: offset };\n    };\n\n    export const formatWithGroups = (defs: TextSyncGroupDefs, digits: string) => {\n        const { sign, rest } = splitSign(digits, defs.hasSign);\n\n        return applyGroupedMask(defs, \"\", sign + getDigits(rest), 0).text;\n    };\n\n    export const readSignedDigits = (text: string) => {\n        const { sign, rest } = splitSign(text, true);\n\n        return sign + getDigits(rest);\n    };\n}\n"],"mappings":";AAaA,IAAM,cAAc;AACpB,IAAM,aAAa;AAEnB,IAAM,aAAa;AAEnB,IAAM,qBAAqB;AAE3B,IAAM,sBAAsB;AAE5B,IAAM,cAAc,SAAiB,QAAQ,eAAe,QAAQ;AAEpE,IAAM,aAAa,SAAiB,CAAC,GAAG,IAAI,CAAC,CAAC,OAAO,UAAU,CAAC,CAAC,KAAK,EAAE;AAExE,IAAM,aAAa,OAAe,UAAoB;CAClD,MAAM,SAAmB,CAAC;CAE1B,IAAI,MAAM,MAAM;CAChB,IAAI,QAAQ;CAEZ,OAAO,MAAM,GAAG;EACZ,MAAM,OAAO,MAAM,KAAK,IAAI,OAAO,MAAM,SAAS,CAAC;EAEnD,IAAI,SAAS,KAAA,KAAa,OAAO,GAAG;GAChC,OAAO,QAAQ,MAAM,MAAM,GAAG,GAAG,CAAC;GAClC;EACJ;EAEA,OAAO,QAAQ,MAAM,MAAM,KAAK,IAAI,GAAG,MAAM,IAAI,GAAG,GAAG,CAAC;EAExD,OAAO;EACP,SAAS;CACb;CAEA,OAAO;AACX;AAEA,IAAM,aAAa,MAAc,YAC7B,WAAW,KAAK,SAAS,UAAU,IAC7B;CAAE,MAAM;CAAY,MAAM,KAAK,MAAM,UAAU,CAAC,CAAC,KAAK,EAAE;AAAE,IAC1D;CAAE,MAAM;CAAI,MAAM;AAAK;AAE1B,IAAU;CAAV,SAAA,gBAAA;CACI,MAAM,aAAA,eAAA,aAAa;CAEnB,MAAM,YAAA,eAAA,aAAa,SAAiB,UAAkB,MAAc,UAAsC;EAC7G,MAAM,iBAAiB,UAAU,QAAQ;EACzC,MAAM,aAAa,KAAK,SAAS,SAAS;EAE1C,IAAI,SAAS,UAAU,IAAI;EAC3B,IAAI,aAAa,UAAU,KAAK,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC;EAEjD,IAAI,cAAc,OAAO,WAAW,eAAe,UAAU,aAAa,GAAG;GACzE,SAAS,OAAO,MAAM,GAAG,aAAa,CAAC,IAAI,OAAO,MAAM,UAAU;GAClE,cAAc;EAClB;EAEA,MAAM,oBAA8B,CAAC;EAErC,IAAI,OAAO;EACX,IAAI,OAAO;EAEX,KAAK,MAAM,QAAQ,SACf,IAAI,SAAS,YAAY;GACrB,IAAI,QAAQ,OAAO,QAAQ;GAE3B,QAAQ,OAAO;GACf,QAAQ;GACR,kBAAkB,KAAK,KAAK,MAAM;EACtC,OAAO;GACH,IAAI,OAAO,WAAW,GAAG;GAEzB,QAAQ;EACZ;EAGJ,MAAM,eAAe,KAAK,IAAI,YAAY,kBAAkB,MAAM;EAElE,IAAI,iBAAiB,kBAAkB,QAAQ,OAAO;GAAE;GAAM,OAAO,KAAK;EAAO;EAEjF,OAAO;GAAE;GAAM,OAAO,iBAAiB,IAAI,IAAI,kBAAkB,eAAe;EAAG;CACvF;CAEa,eAAA,kBAAkB;CAElB,eAAA,cAAc,QAAgB,YAAsB;EAC7D,MAAM,SAAmB,CAAC;EAE1B,IAAI,SAAS;EAEb,KAAK,MAAM,UAAU,SAAS;GAC1B,IAAI,SAAS,SAAS,OAAO,QAAQ;GAErC,OAAO,KAAK,OAAO,OAAO,MAAM,QAAQ,SAAS,MAAM,CAAC,CAAC;GACzD,UAAU;EACd;EAEA,OAAO;CACX;CAEa,eAAA,kBAAkB,SAAiB,WAC5C,UAAU,SAAS,IAAI,UAAU,MAAM,GAAG,OAAO,MAAM,CAAC,CAAC;CAEhD,eAAA,aAAa;CAEb,eAAA,iBAAiB,WAAoB;EAM9C,MAAM,QALU,IAAI,KAAK,aAAa,MAAM,CAAC,CACxC,cAAc,kBAAkB,CAAC,CACjC,QAAQ,SAAS,KAAK,SAAS,SAAS,CAAC,CACzC,KAAK,SAAS,KAAK,MAAM,MAEhB,CAAA,CAAQ,MAAM,CAAC,CAAC,CAAC,QAAQ;EAEvC,IAAI,MAAM,WAAW,GAAG,OAAO,CAAC,mBAAmB;EAEnD,OAAO,MAAM,SAAS,KAAK,MAAM,MAAM,SAAS,OAAO,MAAM,MAAM,SAAS,IAAI,MAAM,IAAI;EAE1F,OAAO;CACX;CAEO,MAAM,mBAAA,eAAA,oBACT,MACA,UACA,MACA,UACqB;EACrB,MAAM,EAAE,SAAS,UAAU,MAAM,KAAK,OAAO;EAC7C,MAAM,iBAAiB,UAAU,QAAQ;EACzC,MAAM,aAAa,KAAK,SAAS,SAAS;EAE1C,IAAI,SAAS,UAAU,IAAI;EAC3B,IAAI,cAAc,UAAU,KAAK,MAAM,KAAK,CAAC,CAAC,CAAC;EAE/C,IAAI,cAAc,OAAO,WAAW,eAAe,UAAU,OAAO,SAAS,aAAa;GACtF,MAAM,QAAQ,OAAO,SAAS;GAE9B,SAAS,OAAO,MAAM,GAAG,QAAQ,CAAC,IAAI,OAAO,MAAM,KAAK;EAC5D;EAEA,SAAS,OAAO,QAAQ,aAAa,EAAE;EAEvC,IAAI,OAAO,WAAW,GAAG,OAAO;GAAE,MAAM;GAAM,OAAO,KAAK;EAAO;EAEjE,MAAM,SAAS,OAAO,SAAS,KAAK,WAAW,GAAG,GAAG;EACrD,MAAM,QAAQ,OAAO,MAAM,GAAG,OAAO,SAAS,KAAK,QAAQ;EAC3D,MAAM,WAAW,OAAO,MAAM,OAAO,SAAS,KAAK,QAAQ;EAI3D,MAAM,OACF,OAHW,UAAU,OAAO,KAAK,UAG1B,CAAA,CAAO,KAAK,KAAK,cAAc,KAAK,KAAK,WAAW,IAAI,KAAK,mBAAmB,WAAW;EAEtG,cAAc,KAAK,IAAI,aAAa,OAAO,MAAM;EAEjD,IAAI,OAAO;EACX,IAAI,SAAS,KAAK;EAElB,OAAO,SAAS,KAAK,OAAO,aAAa;GACrC,UAAU;GAEV,IAAI,WAAW,KAAK,OAAO,GAAG,QAAQ;EAC1C;EAEA,OAAO;GAAE;GAAM,OAAO;EAAO;CACjC;CAEa,eAAA,oBAAoB,MAAyB,WAAmB;EACzE,MAAM,EAAE,MAAM,SAAS,UAAU,QAAQ,KAAK,OAAO;EAErD,OAAO,iBAAiB,MAAM,IAAI,OAAO,UAAU,IAAI,GAAG,CAAC,CAAC,CAAC;CACjE;CAEa,eAAA,oBAAoB,SAAiB;EAC9C,MAAM,EAAE,MAAM,SAAS,UAAU,MAAM,IAAI;EAE3C,OAAO,OAAO,UAAU,IAAI;CAChC;AACH,EAAA,CAAA,kBAAA,gBAAA,CAAA,EAAD"}

package/dist/Abstracts/Typeahead/Typeahead.js

@@ -0,0 +1,34 @@
+import { TypeaheadUtils } from "./Typeahead.utils.js";
+import { createSignal, onCleanup } from "solid-js";
+//#region src/Abstracts/Typeahead/Typeahead.ts
+var DEFAULT_TYPEAHEAD_TIMEOUT_MS = 1e3;
+var EMPTY_QUERY = "";
+var Typeahead;
+(function(_Typeahead) {
+	_Typeahead.createBuffer = (defs) => {
+		const [getQuery, setQuery] = createSignal(EMPTY_QUERY);
+		let timer;
+		const clear = () => {
+			clearTimeout(timer);
+			timer = void 0;
+			setQuery(EMPTY_QUERY);
+		};
+		onCleanup(clear);
+		return {
+			getQuery,
+			clear,
+			push: (e) => {
+				if (!TypeaheadUtils.getIsQueryKey(e, getQuery() !== EMPTY_QUERY)) return;
+				const next = getQuery() + e.key;
+				clearTimeout(timer);
+				timer = setTimeout(clear, defs?.getTimeoutMs?.() ?? DEFAULT_TYPEAHEAD_TIMEOUT_MS);
+				setQuery(next);
+				return next;
+			}
+		};
+	};
+})(Typeahead || (Typeahead = {}));
+//#endregion
+export { Typeahead };
+
+//# sourceMappingURL=Typeahead.js.map

package/dist/Abstracts/Typeahead/Typeahead.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typeahead.js","names":[],"sources":["../../../src/Abstracts/Typeahead/Typeahead.ts"],"sourcesContent":["import { createSignal, onCleanup } from \"solid-js\";\n\nimport type { TypeaheadDefs, TypeaheadHandle } from \"./Typeahead.types\";\nimport { TypeaheadUtils } from \"./Typeahead.utils\";\n\nconst DEFAULT_TYPEAHEAD_TIMEOUT_MS = 1000;\nconst EMPTY_QUERY = \"\";\n\nexport namespace Typeahead {\n    export const createBuffer = (defs?: TypeaheadDefs): TypeaheadHandle => {\n        const [getQuery, setQuery] = createSignal(EMPTY_QUERY);\n\n        let timer: ReturnType<typeof setTimeout> | undefined;\n\n        const clear = () => {\n            clearTimeout(timer);\n            timer = undefined;\n            setQuery(EMPTY_QUERY);\n        };\n\n        onCleanup(clear);\n\n        return {\n            getQuery,\n            clear,\n            push: (e) => {\n                if (!TypeaheadUtils.getIsQueryKey(e, getQuery() !== EMPTY_QUERY)) return;\n\n                const next = getQuery() + e.key;\n\n                clearTimeout(timer);\n                timer = setTimeout(clear, defs?.getTimeoutMs?.() ?? DEFAULT_TYPEAHEAD_TIMEOUT_MS);\n                setQuery(next);\n\n                return next;\n            },\n        };\n    };\n}\n"],"mappings":";;;AAKA,IAAM,+BAA+B;AACrC,IAAM,cAAc;AAEb,IAAU;CAAV,SAAA,YAAA;CACU,WAAA,gBAAgB,SAA0C;EACnE,MAAM,CAAC,UAAU,YAAY,aAAa,WAAW;EAErD,IAAI;EAEJ,MAAM,cAAc;GAChB,aAAa,KAAK;GAClB,QAAQ,KAAA;GACR,SAAS,WAAW;EACxB;EAEA,UAAU,KAAK;EAEf,OAAO;GACH;GACA;GACA,OAAO,MAAM;IACT,IAAI,CAAC,eAAe,cAAc,GAAG,SAAS,MAAM,WAAW,GAAG;IAElE,MAAM,OAAO,SAAS,IAAI,EAAE;IAE5B,aAAa,KAAK;IAClB,QAAQ,WAAW,OAAO,MAAM,eAAe,KAAK,4BAA4B;IAChF,SAAS,IAAI;IAEb,OAAO;GACX;EACJ;CACJ;AACH,EAAA,CAAA,cAAA,YAAA,CAAA,EAAD"}

package/dist/Abstracts/Typeahead/Typeahead.utils.js

@@ -0,0 +1,34 @@
+//#region src/Abstracts/Typeahead/Typeahead.utils.ts
+var SPACE_KEY = " ";
+var SINGLE_CHARACTER = 1;
+var NOT_HIDDEN = "false";
+var readText = (node) => {
+	if (node.nodeType === Node.TEXT_NODE) return node.nodeValue ?? "";
+	if (!(node instanceof Element)) return "";
+	const hidden = node.getAttribute("aria-hidden");
+	if (hidden !== null && hidden !== NOT_HIDDEN) return "";
+	return [...node.childNodes].map(readText).join("");
+};
+var TypeaheadUtils;
+(function(_TypeaheadUtils) {
+	_TypeaheadUtils.getElementText = (element) => element ? readText(element) : "";
+	_TypeaheadUtils.getIsQueryKey = (e, hasQuery) => {
+		if (e.ctrlKey || e.metaKey || e.altKey) return false;
+		if ([...e.key].length !== SINGLE_CHARACTER) return false;
+		return e.key !== SPACE_KEY || hasQuery;
+	};
+	const getIsRepeat = _TypeaheadUtils.getIsRepeat = (query) => query.length > SINGLE_CHARACTER && [...query].every((character) => character === query[0]);
+	_TypeaheadUtils.computeNextIndex = (query, from, length, computeText) => {
+		if (length < 1 || query.length < 1) return;
+		const search = (getIsRepeat(query) ? query[0] : query).toLowerCase();
+		const start = search.length === SINGLE_CHARACTER ? 1 : 0;
+		for (let offset = start; offset < length; offset++) {
+			const index = (Math.max(from, 0) + offset) % length;
+			if (computeText(index).trimStart().toLowerCase().startsWith(search)) return index;
+		}
+	};
+})(TypeaheadUtils || (TypeaheadUtils = {}));
+//#endregion
+export { TypeaheadUtils };
+
+//# sourceMappingURL=Typeahead.utils.js.map

package/dist/Abstracts/Typeahead/Typeahead.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typeahead.utils.js","names":[],"sources":["../../../src/Abstracts/Typeahead/Typeahead.utils.ts"],"sourcesContent":["const SPACE_KEY = \" \";\nconst SINGLE_CHARACTER = 1;\nconst NOT_HIDDEN = \"false\";\n\nconst readText = (node: Node): string => {\n    if (node.nodeType === Node.TEXT_NODE) return node.nodeValue ?? \"\";\n    if (!(node instanceof Element)) return \"\";\n\n    const hidden = node.getAttribute(\"aria-hidden\");\n\n    if (hidden !== null && hidden !== NOT_HIDDEN) return \"\";\n\n    return [...node.childNodes].map(readText).join(\"\");\n};\n\nexport namespace TypeaheadUtils {\n    export const getElementText = (element: Element | null | undefined) => (element ? readText(element) : \"\");\n\n    export const getIsQueryKey = (e: KeyboardEvent, hasQuery: boolean) => {\n        if (e.ctrlKey || e.metaKey || e.altKey) return false;\n        if ([...e.key].length !== SINGLE_CHARACTER) return false;\n\n        return e.key !== SPACE_KEY || hasQuery;\n    };\n\n    export const getIsRepeat = (query: string) =>\n        query.length > SINGLE_CHARACTER && [...query].every((character) => character === query[0]);\n\n    export const computeNextIndex = (\n        query: string,\n        from: number,\n        length: number,\n        computeText: (index: number) => string,\n    ) => {\n        if (length < 1 || query.length < 1) return;\n\n        const search = (getIsRepeat(query) ? query[0] : query).toLowerCase();\n        const start = search.length === SINGLE_CHARACTER ? 1 : 0;\n\n        for (let offset = start; offset < length; offset++) {\n            const index = (Math.max(from, 0) + offset) % length;\n\n            if (computeText(index).trimStart().toLowerCase().startsWith(search)) return index;\n        }\n    };\n}\n"],"mappings":";AAAA,IAAM,YAAY;AAClB,IAAM,mBAAmB;AACzB,IAAM,aAAa;AAEnB,IAAM,YAAY,SAAuB;CACrC,IAAI,KAAK,aAAa,KAAK,WAAW,OAAO,KAAK,aAAa;CAC/D,IAAI,EAAE,gBAAgB,UAAU,OAAO;CAEvC,MAAM,SAAS,KAAK,aAAa,aAAa;CAE9C,IAAI,WAAW,QAAQ,WAAW,YAAY,OAAO;CAErD,OAAO,CAAC,GAAG,KAAK,UAAU,CAAC,CAAC,IAAI,QAAQ,CAAC,CAAC,KAAK,EAAE;AACrD;AAEO,IAAU;CAAV,SAAA,iBAAA;CACU,gBAAA,kBAAkB,YAAyC,UAAU,SAAS,OAAO,IAAI;CAEzF,gBAAA,iBAAiB,GAAkB,aAAsB;EAClE,IAAI,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,OAAO;EAC/C,IAAI,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,WAAW,kBAAkB,OAAO;EAEnD,OAAO,EAAE,QAAQ,aAAa;CAClC;CAEO,MAAM,cAAA,gBAAA,eAAe,UACxB,MAAM,SAAS,oBAAoB,CAAC,GAAG,KAAK,CAAC,CAAC,OAAO,cAAc,cAAc,MAAM,EAAE;CAEhF,gBAAA,oBACT,OACA,MACA,QACA,gBACC;EACD,IAAI,SAAS,KAAK,MAAM,SAAS,GAAG;EAEpC,MAAM,UAAU,YAAY,KAAK,IAAI,MAAM,KAAK,MAAA,CAAO,YAAY;EACnE,MAAM,QAAQ,OAAO,WAAW,mBAAmB,IAAI;EAEvD,KAAK,IAAI,SAAS,OAAO,SAAS,QAAQ,UAAU;GAChD,MAAM,SAAS,KAAK,IAAI,MAAM,CAAC,IAAI,UAAU;GAE7C,IAAI,YAAY,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC,WAAW,MAAM,GAAG,OAAO;EAChF;CACJ;AACH,EAAA,CAAA,mBAAA,iBAAA,CAAA,EAAD"}

package/dist/Abstracts/Virtualizer/Virtualizer.js

@@ -0,0 +1,84 @@
+import { createEffect, createMemo, createSignal, onMount } from "solid-js";
+import { createVirtualizer, defaultRangeExtractor, measureElement } from "@tanstack/solid-virtual";
+//#region src/Abstracts/Virtualizer/Virtualizer.ts
+var SCROLLING_OVERFLOWS = /* @__PURE__ */ new Set([
+	"auto",
+	"scroll",
+	"overlay"
+]);
+var Virtualizer;
+(function(_Virtualizer) {
+	const createScrollParent = _Virtualizer.createScrollParent = (getRef, getIsEnabled) => {
+		const [getScrollParent, setScrollParent] = createSignal();
+		createEffect(() => {
+			const ref = getRef();
+			if (!ref || !getIsEnabled()) {
+				setScrollParent(void 0);
+				return;
+			}
+			let element = ref.parentElement;
+			while (element) {
+				if (SCROLLING_OVERFLOWS.has(getComputedStyle(element).overflowY)) break;
+				element = element.parentElement;
+			}
+			setScrollParent(element ?? void 0);
+		});
+		return getScrollParent;
+	};
+	_Virtualizer.createRowWindow = (getRef, getCount, opts) => {
+		const getScrollParent = createScrollParent(getRef, opts.getIsEnabled);
+		const [getScrollMargin, setScrollMargin] = createSignal(0);
+		createEffect(() => {
+			const ref = getRef();
+			const scrollParent = getScrollParent();
+			if (!ref || !scrollParent) {
+				setScrollMargin(0);
+				return;
+			}
+			const scrollParentRect = scrollParent.getBoundingClientRect();
+			const scale = scrollParent.offsetHeight ? scrollParentRect.height / scrollParent.offsetHeight : 1;
+			const inset = (ref.getBoundingClientRect().top - scrollParentRect.top) / (scale || 1);
+			setScrollMargin(inset - scrollParent.clientTop + scrollParent.scrollTop);
+		});
+		const virtualizer = createVirtualizer({
+			get count() {
+				return getCount();
+			},
+			get enabled() {
+				return opts.getIsEnabled() && getScrollParent() !== void 0;
+			},
+			get estimateSize() {
+				return opts.computeEstimatedSize;
+			},
+			get scrollMargin() {
+				return getScrollMargin();
+			},
+			get rangeExtractor() {
+				const pinned = opts.getPinnedRows?.() ?? [];
+				return (range) => [.../* @__PURE__ */ new Set([...pinned, ...defaultRangeExtractor(range)])].sort((a, b) => a - b);
+			},
+			getScrollElement: () => getScrollParent() ?? null,
+			measureElement: (element, entry, instance) => {
+				const box = entry?.borderBoxSize?.[0];
+				if (!box) return measureElement(element, entry, instance);
+				return instance.options.horizontal ? box.inlineSize : box.blockSize;
+			},
+			overscan: opts.getOverscan?.()
+		});
+		return {
+			getIsLive: () => opts.getIsEnabled() && getScrollParent() !== void 0,
+			getRows: createMemo(() => opts.getIsEnabled() ? virtualizer.getVirtualItems() : []),
+			getTotalSize: createMemo(() => opts.getIsEnabled() ? virtualizer.getTotalSize() : 0),
+			getRowStart: (row) => row.start - getScrollMargin(),
+			measureRow: (element, index) => {
+				element.dataset.index = String(index);
+				onMount(() => virtualizer.measureElement(element));
+			},
+			scrollToRow: (index) => virtualizer.scrollToIndex(index, { align: "auto" })
+		};
+	};
+})(Virtualizer || (Virtualizer = {}));
+//#endregion
+export { Virtualizer };
+
+//# sourceMappingURL=Virtualizer.js.map

package/dist/Abstracts/Virtualizer/Virtualizer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Virtualizer.js","names":[],"sources":["../../../src/Abstracts/Virtualizer/Virtualizer.ts"],"sourcesContent":["import type { Accessor } from \"solid-js\";\nimport { createEffect, createMemo, createSignal, onMount } from \"solid-js\";\n\nimport { createVirtualizer, defaultRangeExtractor, measureElement } from \"@tanstack/solid-virtual\";\n\nimport type { VirtualizerRowWindow, VirtualizerRowWindowOpts } from \"./Virtualizer.types\";\n\nconst SCROLLING_OVERFLOWS = new Set([\"auto\", \"scroll\", \"overlay\"]);\n\nexport namespace Virtualizer {\n    export const createScrollParent = (getRef: Accessor<HTMLElement | undefined>, getIsEnabled: Accessor<boolean>) => {\n        const [getScrollParent, setScrollParent] = createSignal<HTMLElement>();\n\n        createEffect(() => {\n            const ref = getRef();\n\n            if (!ref || !getIsEnabled()) {\n                setScrollParent(undefined);\n\n                return;\n            }\n\n            let element = ref.parentElement;\n\n            while (element) {\n                if (SCROLLING_OVERFLOWS.has(getComputedStyle(element).overflowY)) break;\n\n                element = element.parentElement;\n            }\n\n            setScrollParent(element ?? undefined);\n        });\n\n        return getScrollParent;\n    };\n\n    export const createRowWindow = (\n        getRef: Accessor<HTMLElement | undefined>,\n        getCount: Accessor<number>,\n        opts: VirtualizerRowWindowOpts,\n    ): VirtualizerRowWindow => {\n        const getScrollParent = createScrollParent(getRef, opts.getIsEnabled);\n\n        const [getScrollMargin, setScrollMargin] = createSignal(0);\n\n        createEffect(() => {\n            const ref = getRef();\n            const scrollParent = getScrollParent();\n\n            if (!ref || !scrollParent) {\n                setScrollMargin(0);\n\n                return;\n            }\n\n            const scrollParentRect = scrollParent.getBoundingClientRect();\n            const scale = scrollParent.offsetHeight ? scrollParentRect.height / scrollParent.offsetHeight : 1;\n            const inset = (ref.getBoundingClientRect().top - scrollParentRect.top) / (scale || 1);\n\n            setScrollMargin(inset - scrollParent.clientTop + scrollParent.scrollTop);\n        });\n\n        const virtualizer = createVirtualizer({\n            get count() {\n                return getCount();\n            },\n            get enabled() {\n                return opts.getIsEnabled() && getScrollParent() !== undefined;\n            },\n            get estimateSize() {\n                return opts.computeEstimatedSize;\n            },\n            get scrollMargin() {\n                return getScrollMargin();\n            },\n            get rangeExtractor() {\n                const pinned = opts.getPinnedRows?.() ?? [];\n\n                return (range: Parameters<typeof defaultRangeExtractor>[0]) =>\n                    [...new Set([...pinned, ...defaultRangeExtractor(range)])].sort((a, b) => a - b);\n            },\n            getScrollElement: () => getScrollParent() ?? null,\n            measureElement: (element, entry, instance) => {\n                const box = entry?.borderBoxSize?.[0];\n\n                if (!box) return measureElement(element, entry, instance);\n\n                return instance.options.horizontal ? box.inlineSize : box.blockSize;\n            },\n            overscan: opts.getOverscan?.(),\n        });\n\n        const getRows = createMemo(() => (opts.getIsEnabled() ? virtualizer.getVirtualItems() : []));\n\n        const getTotalSize = createMemo(() => (opts.getIsEnabled() ? virtualizer.getTotalSize() : 0));\n\n        return {\n            getIsLive: () => opts.getIsEnabled() && getScrollParent() !== undefined,\n            getRows,\n            getTotalSize,\n            getRowStart: (row) => row.start - getScrollMargin(),\n            measureRow: (element, index) => {\n                element.dataset.index = String(index);\n\n                onMount(() => virtualizer.measureElement(element));\n            },\n            scrollToRow: (index) => virtualizer.scrollToIndex(index, { align: \"auto\" }),\n        };\n    };\n}\n"],"mappings":";;;AAOA,IAAM,sCAAsB,IAAI,IAAI;CAAC;CAAQ;CAAU;AAAS,CAAC;AAE1D,IAAU;CAAV,SAAA,cAAA;CACI,MAAM,qBAAA,aAAA,sBAAsB,QAA2C,iBAAoC;EAC9G,MAAM,CAAC,iBAAiB,mBAAmB,aAA0B;EAErE,mBAAmB;GACf,MAAM,MAAM,OAAO;GAEnB,IAAI,CAAC,OAAO,CAAC,aAAa,GAAG;IACzB,gBAAgB,KAAA,CAAS;IAEzB;GACJ;GAEA,IAAI,UAAU,IAAI;GAElB,OAAO,SAAS;IACZ,IAAI,oBAAoB,IAAI,iBAAiB,OAAO,CAAC,CAAC,SAAS,GAAG;IAElE,UAAU,QAAQ;GACtB;GAEA,gBAAgB,WAAW,KAAA,CAAS;EACxC,CAAC;EAED,OAAO;CACX;CAEa,aAAA,mBACT,QACA,UACA,SACuB;EACvB,MAAM,kBAAkB,mBAAmB,QAAQ,KAAK,YAAY;EAEpE,MAAM,CAAC,iBAAiB,mBAAmB,aAAa,CAAC;EAEzD,mBAAmB;GACf,MAAM,MAAM,OAAO;GACnB,MAAM,eAAe,gBAAgB;GAErC,IAAI,CAAC,OAAO,CAAC,cAAc;IACvB,gBAAgB,CAAC;IAEjB;GACJ;GAEA,MAAM,mBAAmB,aAAa,sBAAsB;GAC5D,MAAM,QAAQ,aAAa,eAAe,iBAAiB,SAAS,aAAa,eAAe;GAChG,MAAM,SAAS,IAAI,sBAAsB,CAAC,CAAC,MAAM,iBAAiB,QAAQ,SAAS;GAEnF,gBAAgB,QAAQ,aAAa,YAAY,aAAa,SAAS;EAC3E,CAAC;EAED,MAAM,cAAc,kBAAkB;GAClC,IAAI,QAAQ;IACR,OAAO,SAAS;GACpB;GACA,IAAI,UAAU;IACV,OAAO,KAAK,aAAa,KAAK,gBAAgB,MAAM,KAAA;GACxD;GACA,IAAI,eAAe;IACf,OAAO,KAAK;GAChB;GACA,IAAI,eAAe;IACf,OAAO,gBAAgB;GAC3B;GACA,IAAI,iBAAiB;IACjB,MAAM,SAAS,KAAK,gBAAgB,KAAK,CAAC;IAE1C,QAAQ,UACJ,CAAC,mBAAG,IAAI,IAAI,CAAC,GAAG,QAAQ,GAAG,sBAAsB,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,MAAM,IAAI,CAAC;GACvF;GACA,wBAAwB,gBAAgB,KAAK;GAC7C,iBAAiB,SAAS,OAAO,aAAa;IAC1C,MAAM,MAAM,OAAO,gBAAgB;IAEnC,IAAI,CAAC,KAAK,OAAO,eAAe,SAAS,OAAO,QAAQ;IAExD,OAAO,SAAS,QAAQ,aAAa,IAAI,aAAa,IAAI;GAC9D;GACA,UAAU,KAAK,cAAc;EACjC,CAAC;EAMD,OAAO;GACH,iBAAiB,KAAK,aAAa,KAAK,gBAAgB,MAAM,KAAA;GAC9D,SANY,iBAAkB,KAAK,aAAa,IAAI,YAAY,gBAAgB,IAAI,CAAC,CAMrF;GACA,cALiB,iBAAkB,KAAK,aAAa,IAAI,YAAY,aAAa,IAAI,CAKtF;GACA,cAAc,QAAQ,IAAI,QAAQ,gBAAgB;GAClD,aAAa,SAAS,UAAU;IAC5B,QAAQ,QAAQ,QAAQ,OAAO,KAAK;IAEpC,cAAc,YAAY,eAAe,OAAO,CAAC;GACrD;GACA,cAAc,UAAU,YAAY,cAAc,OAAO,EAAE,OAAO,OAAO,CAAC;EAC9E;CACJ;AACH,EAAA,CAAA,gBAAA,cAAA,CAAA,EAAD"}

package/dist/Composites/Surface/Surface.css.js

@@ -0,0 +1,12 @@
+/* empty css                           */
+//#region src/Composites/Surface/Surface.css.ts
+var fillColorVar = "var(--_19wufxy0)";
+var fillOpacityVar = "var(--_19wufxy1)";
+var strokeColorVar = "var(--_19wufxy2)";
+var strokeOpacityVar = "var(--_19wufxy3)";
+var surfaceDivRoot = "_19wufxy4";
+var surfaceDivBorder = "_19wufxy5";
+//#endregion
+export { fillColorVar, fillOpacityVar, strokeColorVar, strokeOpacityVar, surfaceDivBorder, surfaceDivRoot };
+
+//# sourceMappingURL=Surface.css.js.map

package/dist/Composites/Surface/Surface.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Surface.css.js","names":[],"sources":["../../../src/Composites/Surface/Surface.css.ts"],"sourcesContent":["import { createVar, style } from \"@vanilla-extract/css\";\n\nexport const fillColorVar = createVar();\nexport const fillOpacityVar = createVar();\nexport const strokeColorVar = createVar();\nexport const strokeOpacityVar = createVar();\n\nexport const surfaceDivRoot = style({\n    position: \"relative\",\n    overflow: \"hidden\",\n    backgroundColor: [fillColorVar, `rgb(from ${fillColorVar} r g b / ${fillOpacityVar})`],\n});\n\nexport const surfaceDivBorder = style({\n    position: \"absolute\",\n    inset: 0,\n    zIndex: 1,\n    pointerEvents: \"none\",\n\n    borderRadius: \"inherit\",\n    borderStyle: \"solid\",\n    borderColor: [strokeColorVar, `rgb(from ${strokeColorVar} r g b / ${strokeOpacityVar})`],\n});\n"],"mappings":""}

package/dist/Composites/Surface/Surface.js

@@ -0,0 +1,113 @@
+import { access } from "../../Utils/propUtils.js";
+import { assignInlineVars } from "../../_external/@vanilla-extract/dynamic/dist/vanilla-extract-dynamic.esm.js";
+import { Shape } from "../../Exotics/Shape/Shape.js";
+import { fillColorVar, fillOpacityVar, surfaceDivRoot } from "./Surface.css.js";
+import { createMemo } from "solid-js";
+import { ShapeConst, StringUtils } from "@thewaver/ss-utils";
+import { Dynamic, className, createComponent, effect, insert, memo, mergeProps, setStyleProperty, style, template } from "solid-js/web";
+//#region src/Composites/Surface/Surface.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div>`);
+var MOCK_SIZE = {
+	width: 0,
+	height: 0
+};
+var MOCK_GET_SIZE = () => MOCK_SIZE;
+var IS_COMPLEX_SVG_DEFS = (v) => !!v.blend || !!v.clipPath || !!v.filter || !!v.gradientOrPattern;
+var SurfaceSVG = (props) => {
+	const getBorderWidths = createMemo(() => {
+		const namedWidths = access(props.borderWidths);
+		return [
+			namedWidths.borderTopWidth,
+			namedWidths.borderRightWidth,
+			namedWidths.borderBottomWidth,
+			namedWidths.borderLeftWidth
+		];
+	});
+	const getJoinRadii = createMemo(() => {
+		const namedRadii = access(props.borderRadii);
+		return [
+			namedRadii.borderTopLeftRadius,
+			namedRadii.borderTopRightRadius,
+			namedRadii.borderBottomRightRadius,
+			namedRadii.borderBottomLeftRadius
+		];
+	});
+	const getLameExponents = createMemo(() => {
+		const namedShapes = access(props.lameExponents);
+		if (!namedShapes) return [ShapeConst.CORNER_SHAPE_LAME_EXPONENTS.round];
+		return [
+			namedShapes.cornerTopLeftShape,
+			namedShapes.cornerTopRightShape,
+			namedShapes.cornerBottomRightShape,
+			namedShapes.cornerBottomLeftShape
+		];
+	});
+	return createComponent(Shape, {
+		computePoints: (size) => ShapeConst.getDefaultShapePoints("square", size),
+		get computeFillDefs() {
+			return props.computeFillDefs;
+		},
+		get computeStrokeDefs() {
+			return props.computeStrokeDefs;
+		},
+		get strokeGeom() {
+			return props.computeStrokeDefs ? () => [{ thicknesses: getBorderWidths() }] : void 0;
+		},
+		joinRadii: getJoinRadii,
+		lameExponents: getLameExponents,
+		renderChildren: (_, getClipPath) => (() => {
+			var _el$ = _tmpl$();
+			insert(_el$, () => props.children);
+			effect((_$p) => setStyleProperty(_el$, "clip-path", `path("${getClipPath()}")`));
+			return _el$;
+		})()
+	});
+};
+var SurfaceDiv = (props) => {
+	const getFillColorDef = createMemo(() => props.computeFillDefs?.(MOCK_GET_SIZE)?.find((v) => !!v.color));
+	const getStrokeColorDef = createMemo(() => props.computeStrokeDefs?.(MOCK_GET_SIZE)?.find((v) => !!v.color));
+	const getHasBorder = createMemo(() => !!getStrokeColorDef() && Object.values(access(props.borderWidths)).some((v) => v > 0));
+	return (() => {
+		var _el$2 = _tmpl$();
+		className(_el$2, surfaceDivRoot);
+		insert(_el$2, () => props.children, null);
+		insert(_el$2, (() => {
+			var _c$ = memo(() => !!getHasBorder());
+			return () => _c$() && (() => {
+				var _el$3 = _tmpl$();
+				className(_el$3, "_19wufxy5");
+				effect((_$p) => style(_el$3, {
+					...assignInlineVars({
+						["var(--_19wufxy2)"]: getStrokeColorDef()?.color ?? "transparent",
+						["var(--_19wufxy3)"]: `${(getStrokeColorDef()?.opacity ?? 1) * 100}%`
+					}),
+					...Object.fromEntries(Object.entries(access(props.borderWidths)).map(([key, value]) => [StringUtils.camelToKebabCase(key), `${value}px`]))
+				}, _$p));
+				return _el$3;
+			})();
+		})(), null);
+		effect((_$p) => style(_el$2, {
+			...assignInlineVars({
+				[fillColorVar]: getFillColorDef()?.color ?? "transparent",
+				[fillOpacityVar]: `${(getFillColorDef()?.opacity ?? 1) * 100}%`
+			}),
+			...Object.fromEntries(Object.entries(access(props.borderRadii)).map(([key, value]) => [StringUtils.camelToKebabCase(key), `${value}px`]))
+		}, _$p));
+		return _el$2;
+	})();
+};
+var Surface = (props) => {
+	const getIsComplex = () => {
+		const fillDefs = props.computeFillDefs?.(MOCK_GET_SIZE);
+		const strokeDefs = props.computeStrokeDefs?.(MOCK_GET_SIZE);
+		const lameExponents = access(props.lameExponents);
+		return fillDefs?.some(IS_COMPLEX_SVG_DEFS) || strokeDefs?.some(IS_COMPLEX_SVG_DEFS) || lameExponents && Object.values(lameExponents).some((v) => v !== ShapeConst.CORNER_SHAPE_LAME_EXPONENTS.round);
+	};
+	return createComponent(Dynamic, mergeProps({ get component() {
+		return getIsComplex() ? SurfaceSVG : SurfaceDiv;
+	} }, props));
+};
+//#endregion
+export { Surface };
+
+//# sourceMappingURL=Surface.js.map

package/dist/Composites/Surface/Surface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Surface.js","names":["ParentProps","createMemo","Dynamic","ShapeConst","Size2d","StringUtils","assignInlineVars","SVGDefs","Shape","access","SurfaceProps","styles","MOCK_SIZE","width","height","MOCK_GET_SIZE","IS_COMPLEX_SVG_DEFS","v","blend","clipPath","filter","gradientOrPattern","SurfaceSVG","props","getBorderWidths","namedWidths","borderWidths","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","getJoinRadii","namedRadii","borderRadii","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","getLameExponents","namedShapes","lameExponents","CORNER_SHAPE_LAME_EXPONENTS","round","cornerTopLeftShape","cornerTopRightShape","cornerBottomRightShape","cornerBottomLeftShape","_$createComponent","computePoints","size","getDefaultShapePoints","computeFillDefs","computeStrokeDefs","strokeGeom","thicknesses","undefined","joinRadii","renderChildren","_","getClipPath","_el$","_tmpl$","_$insert","children","_$effect","_$p","_$setStyleProperty","SurfaceDiv","getFillColorDef","find","color","getStrokeColorDef","getHasBorder","Object","values","some","_el$2","_$className","surfaceDivRoot","_c$","_$memo","_el$3","surfaceDivBorder","_$style","strokeColorVar","strokeOpacityVar","opacity","fromEntries","entries","map","key","value","camelToKebabCase","fillColorVar","fillOpacityVar","Surface","getIsComplex","fillDefs","strokeDefs","_$mergeProps","component"],"sources":["../../../src/Composites/Surface/Surface.tsx"],"sourcesContent":["import { type ParentProps, createMemo } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\n\nimport { ShapeConst, Size2d, StringUtils } from \"@thewaver/ss-utils\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\n\nimport type { SVGDefs } from \"../../Abstracts/SVG/Defs/SVGDefs.types\";\nimport { Shape } from \"../../Exotics/Shape/Shape\";\nimport { access } from \"../../Utils/propUtils\";\nimport type { SurfaceProps } from \"./Surface.types\";\n\nimport * as styles from \"./Surface.css\";\n\nconst MOCK_SIZE: Size2d = { width: 0, height: 0 };\nconst MOCK_GET_SIZE = () => MOCK_SIZE;\nconst IS_COMPLEX_SVG_DEFS = (v: SVGDefs) => !!v.blend || !!v.clipPath || !!v.filter || !!v.gradientOrPattern;\n\nconst SurfaceSVG = (props: ParentProps<SurfaceProps>) => {\n    const getBorderWidths = createMemo(() => {\n        const namedWidths = access(props.borderWidths);\n\n        return [\n            namedWidths.borderTopWidth,\n            namedWidths.borderRightWidth,\n            namedWidths.borderBottomWidth,\n            namedWidths.borderLeftWidth,\n        ];\n    });\n\n    const getJoinRadii = createMemo(() => {\n        const namedRadii = access(props.borderRadii);\n\n        return [\n            namedRadii.borderTopLeftRadius,\n            namedRadii.borderTopRightRadius,\n            namedRadii.borderBottomRightRadius,\n            namedRadii.borderBottomLeftRadius,\n        ];\n    });\n\n    const getLameExponents = createMemo(() => {\n        const namedShapes = access(props.lameExponents);\n\n        if (!namedShapes) return [ShapeConst.CORNER_SHAPE_LAME_EXPONENTS.round];\n\n        return [\n            namedShapes.cornerTopLeftShape,\n            namedShapes.cornerTopRightShape,\n            namedShapes.cornerBottomRightShape,\n            namedShapes.cornerBottomLeftShape,\n        ];\n    });\n\n    return (\n        <Shape\n            computePoints={(size) => ShapeConst.getDefaultShapePoints(\"square\", size)}\n            computeFillDefs={props.computeFillDefs}\n            computeStrokeDefs={props.computeStrokeDefs}\n            strokeGeom={props.computeStrokeDefs ? () => [{ thicknesses: getBorderWidths() }] : undefined}\n            joinRadii={getJoinRadii}\n            lameExponents={getLameExponents}\n            renderChildren={(_, getClipPath) => (\n                <div style={{ \"clip-path\": `path(\"${getClipPath()}\")` }}>{props.children}</div>\n            )}\n        />\n    );\n};\n\nconst SurfaceDiv = (props: ParentProps<SurfaceProps>) => {\n    const getFillColorDef = createMemo(() => props.computeFillDefs?.(MOCK_GET_SIZE)?.find((v) => !!v.color));\n    const getStrokeColorDef = createMemo(() => props.computeStrokeDefs?.(MOCK_GET_SIZE)?.find((v) => !!v.color));\n\n    const getHasBorder = createMemo(\n        () => !!getStrokeColorDef() && Object.values(access(props.borderWidths)).some((v) => v > 0),\n    );\n\n    return (\n        <div\n            class={styles.surfaceDivRoot}\n            style={{\n                ...assignInlineVars({\n                    [styles.fillColorVar]: getFillColorDef()?.color ?? \"transparent\",\n                    [styles.fillOpacityVar]: `${(getFillColorDef()?.opacity ?? 1) * 100}%`,\n                }),\n                ...Object.fromEntries(\n                    Object.entries(access(props.borderRadii)).map(([key, value]) => [\n                        StringUtils.camelToKebabCase(key),\n                        `${value}px`,\n                    ]),\n                ),\n            }}\n        >\n            {props.children}\n            {getHasBorder() && (\n                <div\n                    class={styles.surfaceDivBorder}\n                    style={{\n                        ...assignInlineVars({\n                            [styles.strokeColorVar]: getStrokeColorDef()?.color ?? \"transparent\",\n                            [styles.strokeOpacityVar]: `${(getStrokeColorDef()?.opacity ?? 1) * 100}%`,\n                        }),\n                        ...Object.fromEntries(\n                            Object.entries(access(props.borderWidths)).map(([key, value]) => [\n                                StringUtils.camelToKebabCase(key),\n                                `${value}px`,\n                            ]),\n                        ),\n                    }}\n                />\n            )}\n        </div>\n    );\n};\n\nexport const Surface = (props: SurfaceProps) => {\n    const getIsComplex = () => {\n        const fillDefs = props.computeFillDefs?.(MOCK_GET_SIZE);\n        const strokeDefs = props.computeStrokeDefs?.(MOCK_GET_SIZE);\n        const lameExponents = access(props.lameExponents);\n\n        return (\n            fillDefs?.some(IS_COMPLEX_SVG_DEFS) ||\n            strokeDefs?.some(IS_COMPLEX_SVG_DEFS) ||\n            (lameExponents &&\n                Object.values(lameExponents).some((v) => v !== ShapeConst.CORNER_SHAPE_LAME_EXPONENTS.round))\n        );\n    };\n\n    return <Dynamic component={getIsComplex() ? SurfaceSVG : SurfaceDiv} {...props} />;\n};\n"],"mappings":"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"}

package/dist/Exotics/Bracket/Bracket.css.js

@@ -0,0 +1,11 @@
+/* empty css                           */
+//#region src/Exotics/Bracket/Bracket.css.ts
+var bracketRoot = "xn16gc0";
+var bracketConnectors = "xn16gc1";
+var bracketList = "xn16gc2";
+var bracketItem = "xn16gc3";
+var bracketNode = "xn16gc4";
+//#endregion
+export { bracketConnectors, bracketItem, bracketList, bracketNode, bracketRoot };
+
+//# sourceMappingURL=Bracket.css.js.map

package/dist/Exotics/Bracket/Bracket.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Bracket.css.js","names":[],"sources":["../../../src/Exotics/Bracket/Bracket.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const bracketRoot = style({\n    position: \"relative\",\n});\n\nexport const bracketConnectors = style({\n    position: \"absolute\",\n    inset: 0,\n    pointerEvents: \"none\",\n    overflow: \"visible\",\n});\n\nexport const bracketList = style({\n    listStyle: \"none\",\n    margin: 0,\n    padding: 0,\n});\n\nexport const bracketItem = style({\n    position: \"absolute\",\n});\n\nexport const bracketNode = style({\n    width: \"100%\",\n    height: \"100%\",\n    outline: \"0 none\",\n});\n"],"mappings":""}