solid-tiny-ui 0.5.0 → 0.6.0

package/dist/root-provider/context.d.ts

@@ -1,34 +1,41 @@
-import * as solid_js20 from "solid-js";
-import * as solid_tiny_context3 from "solid-tiny-context";
-import * as solid_js_store7 from "solid-js/store";
+import * as solid_js47 from "solid-js";
+import * as solid_tiny_context13 from "solid-tiny-context";
+import * as solid_js_store23 from "solid-js/store";
 
 //#region src/root-provider/context.d.ts
 declare const context: {
   useContext: () => [Readonly<{
     hue: number;
+    neutralHue: number;
   } & {}>, Omit<{}, "setState"> & {
-    setState: solid_js_store7.SetStoreFunction<{
+    setState: solid_js_store23.SetStoreFunction<{
       hue: number;
+      neutralHue: number;
     }>;
   }, {}];
-  initial(initialState?: Partial<solid_tiny_context3.MaybeSignals<{
+  initial(initialState?: Partial<solid_tiny_context13.MaybeSignals<{
     hue: number;
+    neutralHue: number;
   }>> | undefined): {
     Provider(props: {
-      children?: solid_js20.JSX.Element;
-    }): solid_js20.JSX.Element;
+      children?: solid_js47.JSX.Element;
+    }): solid_js47.JSX.Element;
     value: [Readonly<{
       hue: number;
-    } & {}>, Omit<ThisType<solid_tiny_context3.RealContextThis<{
+      neutralHue: number;
+    } & {}>, Omit<ThisType<solid_tiny_context13.RealContextThis<{
       hue: number;
+      neutralHue: number;
     }, {}, {}, {}>>, "setState"> & {
-      setState: solid_js_store7.SetStoreFunction<{
+      setState: solid_js_store23.SetStoreFunction<{
         hue: number;
+        neutralHue: number;
       }>;
     }, {}];
   };
   defaultValue: () => {
     hue: number;
+    neutralHue: number;
   };
 };
 //#endregion

package/dist/root-provider/context.js

@@ -1,7 +1,10 @@
 import { createComponentState } from "solid-tiny-context";
 
 //#region src/root-provider/context.ts
-const context = createComponentState({ state: () => ({ hue: 210 }) });
+const context = createComponentState({ state: () => ({
+	hue: 210,
+	neutralHue: 210
+}) });
 
 //#endregion
 export { context };

package/dist/root-provider/context.jsx

@@ -1,7 +1,10 @@
 import { createComponentState } from "solid-tiny-context";
 
 //#region src/root-provider/context.ts
-const context = createComponentState({ state: () => ({ hue: 210 }) });
+const context = createComponentState({ state: () => ({
+	hue: 210,
+	neutralHue: 210
+}) });
 
 //#endregion
 export { context };

package/dist/root-provider/gen-colors.js

@@ -0,0 +1,138 @@
+import { oklchToRgb } from "solid-tiny-utils";
+
+//#region src/root-provider/gen-colors.ts
+const lightRamp = [
+	[96, .021],
+	[91.5, .04],
+	[85, .09],
+	[79, .13],
+	[73, .17],
+	[64, .22],
+	[55, .21],
+	[48, .19],
+	[36, .16],
+	[28, .13]
+];
+const darkRamp = [
+	[21, .03],
+	[29, .06],
+	[37, .08],
+	[44, .11],
+	[51, .15],
+	[57, .19],
+	[63, .16],
+	[71, .12],
+	[79, .09],
+	[88, .05]
+];
+const INFO_HUE = 220;
+const SUCCESS_HUE = 140;
+const WARNING_HUE = 48;
+const DANGER_HUE = 25;
+const lightStatusRamp = [
+	[47, .17],
+	[59, .21],
+	[80, .09]
+];
+const darkStatusRamp = [
+	[68, .16],
+	[54, .19],
+	[36, .07]
+];
+function genStatusColors() {
+	const light = {};
+	const dark = {};
+	const statuses = [
+		{
+			name: "info",
+			hue: INFO_HUE
+		},
+		{
+			name: "success",
+			hue: SUCCESS_HUE
+		},
+		{
+			name: "warning",
+			hue: WARNING_HUE
+		},
+		{
+			name: "danger",
+			hue: DANGER_HUE
+		}
+	];
+	const levels = [
+		"fg",
+		"base",
+		"surface"
+	];
+	for (const status of statuses) for (let i = 0; i < lightStatusRamp.length; i++) {
+		const level = levels[i];
+		const [l, c] = lightStatusRamp[i];
+		const [lD, cD] = darkStatusRamp[i];
+		const lightC = oklch2rgb(l, c || .16, status.hue);
+		const darkC = oklch2rgb(lD, cD, status.hue);
+		light[`${status.name}-${level}`] = lightC;
+		dark[`${status.name}-${level}`] = darkC;
+	}
+	return {
+		light,
+		dark
+	};
+}
+function getBrandColors(hue) {
+	return genPaletteByHue(hue, [lightRamp, darkRamp], "brand");
+}
+function getNeutralColors(hue) {
+	const neutralizeRamp = (ramp) => {
+		return ramp.map(([l, c]) => {
+			const newC = c * .06;
+			return [l + (c - newC) * .5, newC];
+		});
+	};
+	return genPaletteByHue(hue, [neutralizeRamp(lightRamp), neutralizeRamp(darkRamp)], "neutral");
+}
+/**
+* Generate a color palette based on a given hue and ramp.
+*
+* @param hue - The hue value for the color palette.
+* @param ramp - [lightRamp, darkRamp] defining lightness and chroma for light and dark themes.
+* @param name - The base name for the color palette.
+* @returns An object containing light and dark color palettes.
+*/
+function genPaletteByHue(hue, ramp, name) {
+	const light = {};
+	const dark = {};
+	for (let i = 0; i < 10; i++) {
+		const [l, c] = ramp[0][i];
+		const [lD, cD] = ramp[1][i];
+		const lightC = oklch2rgb(l, c, hue);
+		const darkC = oklch2rgb(lD, cD, hue);
+		light[`${name}-${i}`] = lightC;
+		dark[`${name}-${i}`] = darkC;
+	}
+	return {
+		light,
+		dark
+	};
+}
+function genColorStyles(colors, sel) {
+	const selector = sel ? `${sel}, .light ${sel}` : ":root, .light";
+	const darkSelector = sel ? `.dark ${sel}` : ".dark";
+	let css = `${selector}{`;
+	for (const [name, value] of Object.entries(colors.light)) css += `--tiny-rgb-${name}:${value};`;
+	css += `}${darkSelector}{`;
+	for (const [name, value] of Object.entries(colors.dark)) css += `--tiny-rgb-${name}:${value};`;
+	css += "}";
+	return css;
+}
+function oklch2rgb(l, c, h) {
+	const { r, g, b } = oklchToRgb({
+		l: l / 100,
+		c,
+		h
+	});
+	return `${r} ${g} ${b}`;
+}
+
+//#endregion
+export { genColorStyles, genStatusColors, getBrandColors, getNeutralColors };

package/dist/root-provider/gen-colors.jsx

@@ -0,0 +1,138 @@
+import { oklchToRgb } from "solid-tiny-utils";
+
+//#region src/root-provider/gen-colors.ts
+const lightRamp = [
+	[96, .021],
+	[91.5, .04],
+	[85, .09],
+	[79, .13],
+	[73, .17],
+	[64, .22],
+	[55, .21],
+	[48, .19],
+	[36, .16],
+	[28, .13]
+];
+const darkRamp = [
+	[21, .03],
+	[29, .06],
+	[37, .08],
+	[44, .11],
+	[51, .15],
+	[57, .19],
+	[63, .16],
+	[71, .12],
+	[79, .09],
+	[88, .05]
+];
+const INFO_HUE = 220;
+const SUCCESS_HUE = 140;
+const WARNING_HUE = 48;
+const DANGER_HUE = 25;
+const lightStatusRamp = [
+	[47, .17],
+	[59, .21],
+	[80, .09]
+];
+const darkStatusRamp = [
+	[68, .16],
+	[54, .19],
+	[36, .07]
+];
+function genStatusColors() {
+	const light = {};
+	const dark = {};
+	const statuses = [
+		{
+			name: "info",
+			hue: INFO_HUE
+		},
+		{
+			name: "success",
+			hue: SUCCESS_HUE
+		},
+		{
+			name: "warning",
+			hue: WARNING_HUE
+		},
+		{
+			name: "danger",
+			hue: DANGER_HUE
+		}
+	];
+	const levels = [
+		"fg",
+		"base",
+		"surface"
+	];
+	for (const status of statuses) for (let i = 0; i < lightStatusRamp.length; i++) {
+		const level = levels[i];
+		const [l, c] = lightStatusRamp[i];
+		const [lD, cD] = darkStatusRamp[i];
+		const lightC = oklch2rgb(l, c || .16, status.hue);
+		const darkC = oklch2rgb(lD, cD, status.hue);
+		light[`${status.name}-${level}`] = lightC;
+		dark[`${status.name}-${level}`] = darkC;
+	}
+	return {
+		light,
+		dark
+	};
+}
+function getBrandColors(hue) {
+	return genPaletteByHue(hue, [lightRamp, darkRamp], "brand");
+}
+function getNeutralColors(hue) {
+	const neutralizeRamp = (ramp) => {
+		return ramp.map(([l, c]) => {
+			const newC = c * .06;
+			return [l + (c - newC) * .5, newC];
+		});
+	};
+	return genPaletteByHue(hue, [neutralizeRamp(lightRamp), neutralizeRamp(darkRamp)], "neutral");
+}
+/**
+* Generate a color palette based on a given hue and ramp.
+*
+* @param hue - The hue value for the color palette.
+* @param ramp - [lightRamp, darkRamp] defining lightness and chroma for light and dark themes.
+* @param name - The base name for the color palette.
+* @returns An object containing light and dark color palettes.
+*/
+function genPaletteByHue(hue, ramp, name) {
+	const light = {};
+	const dark = {};
+	for (let i = 0; i < 10; i++) {
+		const [l, c] = ramp[0][i];
+		const [lD, cD] = ramp[1][i];
+		const lightC = oklch2rgb(l, c, hue);
+		const darkC = oklch2rgb(lD, cD, hue);
+		light[`${name}-${i}`] = lightC;
+		dark[`${name}-${i}`] = darkC;
+	}
+	return {
+		light,
+		dark
+	};
+}
+function genColorStyles(colors, sel) {
+	const selector = sel ? `${sel}, .light ${sel}` : ":root, .light";
+	const darkSelector = sel ? `.dark ${sel}` : ".dark";
+	let css = `${selector}{`;
+	for (const [name, value] of Object.entries(colors.light)) css += `--tiny-rgb-${name}:${value};`;
+	css += `}${darkSelector}{`;
+	for (const [name, value] of Object.entries(colors.dark)) css += `--tiny-rgb-${name}:${value};`;
+	css += "}";
+	return css;
+}
+function oklch2rgb(l, c, h) {
+	const { r, g, b } = oklchToRgb({
+		l: l / 100,
+		c,
+		h
+	});
+	return `${r} ${g} ${b}`;
+}
+
+//#endregion
+export { genColorStyles, genStatusColors, getBrandColors, getNeutralColors };

package/dist/root-provider/provider.js

@@ -1,16 +1,17 @@
 import { context } from "./context.js";
 import global_default from "../_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/root-provider/global.js";
-import { genVars } from "./gen-brand.js";
-import { createComponent } from "solid-js/web";
+import { genColorStyles, genStatusColors, getBrandColors, getNeutralColors } from "./gen-colors.js";
+import { createComponent, effect, insert, setAttribute, template } from "solid-js/web";
 import { createWatch, mountStyle } from "solid-tiny-utils";
 
 //#region src/root-provider/provider.tsx
 function RootProvider(props) {
 	const Context = context.initial({ hue: () => props.hue });
 	mountStyle(global_default, "solid-tiny-globals");
+	mountStyle(genColorStyles(genStatusColors()), "tiny-c-status");
 	const [state] = Context.value;
 	createWatch(() => [state.hue], ([hue]) => {
-		mountStyle(genVars(hue), "solid-tiny-brand", true);
+		mountStyle(genColorStyles(getBrandColors(hue)) + genColorStyles(getNeutralColors(hue)), "tiny-c-theme", true);
 	});
 	return createComponent(Context.Provider, { get children() {
 		return props.children;

package/dist/root-provider/provider.jsx

@@ -1,15 +1,16 @@
 import { context } from "./context.jsx";
 import global_default from "../_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/root-provider/global.jsx";
-import { genVars } from "./gen-brand.jsx";
+import { genColorStyles, genStatusColors, getBrandColors, getNeutralColors } from "./gen-colors.jsx";
 import { createWatch, mountStyle } from "solid-tiny-utils";
 
 //#region src/root-provider/provider.tsx
 function RootProvider(props) {
 	const Context = context.initial({ hue: () => props.hue });
 	mountStyle(global_default, "solid-tiny-globals");
+	mountStyle(genColorStyles(genStatusColors()), "tiny-c-status");
 	const [state] = Context.value;
 	createWatch(() => [state.hue], ([hue]) => {
-		mountStyle(genVars(hue), "solid-tiny-brand", true);
+		mountStyle(genColorStyles(getBrandColors(hue)) + genColorStyles(getNeutralColors(hue)), "tiny-c-theme", true);
 	});
 	return <Context.Provider>{props.children}</Context.Provider>;
 }

package/dist/utils/duration.js

@@ -0,0 +1,10 @@
+//#region src/utils/duration.ts
+function getAnimationDurationMs(element) {
+	if (!element) return 0;
+	const durationString = getComputedStyle(element).animationDuration || "0s";
+	const duration = Number.parseFloat(durationString);
+	return durationString.endsWith("ms") ? duration : duration * 1e3;
+}
+
+//#endregion
+export { getAnimationDurationMs };

package/dist/utils/duration.jsx

@@ -0,0 +1,10 @@
+//#region src/utils/duration.ts
+function getAnimationDurationMs(element) {
+	if (!element) return 0;
+	const durationString = getComputedStyle(element).animationDuration || "0s";
+	const duration = Number.parseFloat(durationString);
+	return durationString.endsWith("ms") ? duration : duration * 1e3;
+}
+
+//#endregion
+export { getAnimationDurationMs };

package/dist/utils/index.js

@@ -21,9 +21,6 @@ function makeStyles(styles, state, extraTokens) {
 		}
 	}) : styles };
 }
-function mergeClassNames(classNames) {
-	return classNames.filter((cn) => !!cn).join(" ");
-}
 function createClassStyles(classNames, styles, state) {
 	const realState = createMemo(() => {
 		if (isDefined(state)) return state();
@@ -41,4 +38,4 @@ function extraAriasAndDatasets(obj) {
 }
 
 //#endregion
-export { createClassStyles, extraAriasAndDatasets, getGlobalToken, makeClassNames, makeStyles, mergeClassNames };
+export { createClassStyles, extraAriasAndDatasets, getGlobalToken, makeClassNames, makeStyles };

package/dist/utils/index.jsx

@@ -21,9 +21,6 @@ function makeStyles(styles, state, extraTokens) {
 		}
 	}) : styles };
 }
-function mergeClassNames(classNames) {
-	return classNames.filter((cn) => !!cn).join(" ");
-}
 function createClassStyles(classNames, styles, state) {
 	const realState = createMemo(() => {
 		if (isDefined(state)) return state();
@@ -41,4 +38,4 @@ function extraAriasAndDatasets(obj) {
 }
 
 //#endregion
-export { createClassStyles, extraAriasAndDatasets, getGlobalToken, makeClassNames, makeStyles, mergeClassNames };
+export { createClassStyles, extraAriasAndDatasets, getGlobalToken, makeClassNames, makeStyles };

package/dist/utils/types.d.ts

@@ -1,4 +1,4 @@
-import { JSX } from "solid-js";
+import { ComponentProps, JSX, ValidComponent } from "solid-js";
 
 //#region src/utils/types.d.ts
 type ClassNames<Fields extends string, State extends object = {}> = { [Key in Fields]?: string } | ((params: {
@@ -10,12 +10,8 @@ type Styles<Fields extends string, State extends object = {}, ExtraTokens extend
   state: Readonly<State>;
   getToken: (key: keyof ExtraTokens | GlobalToken) => string;
 }) => { [Key in Fields]?: JSX.CSSProperties | string });
-type TokenNames = ["c-text", "c-text-heading", "c-text-label", "c-text-description", "c-text-disabled", "c-white", "c-black", "c-link", "c-info", "c-danger", "c-success", "c-warning", "c-border", "c-neutral-0", "c-neutral-1", "c-neutral-2", "c-neutral-3", "c-neutral-4", "c-neutral-5", "c-neutral-6", "c-neutral-7", "c-neutral-8", "c-neutral-9", "c-brand-0", "c-brand-1", "c-brand-2", "c-brand-3", "c-brand-4", "c-brand-5", "c-brand-6", "c-brand-7", "c-brand-8", "c-brand-9", "shadow-1", "shadow-2", "shadow-3", "fs-xs", "fs-sm", "fs-md", "fs-lg", "fs-xl", "fs-2xl", "fs-3xl", "fs-4xl", "lh-tight", "lh-base", "lh-relaxed", "space-xs", "space-sm", "space-md", "space-lg", "space-xl", "space-2xl", "space-3xl", "radius-sm", "radius-md", "radius-lg", "radius-xl", "radius-round"];
+type TokenNames = ["c-text", "c-text-heading", "c-text-label", "c-text-description", "c-text-disabled", "c-white", "c-black", "rgb-neutral-0", "rgb-neutral-1", "rgb-neutral-2", "rgb-neutral-3", "rgb-neutral-4", "rgb-neutral-5", "rgb-neutral-6", "rgb-neutral-7", "rgb-neutral-8", "rgb-neutral-9", "rgb-brand-0", "rgb-brand-1", "rgb-brand-2", "rgb-brand-3", "rgb-brand-4", "rgb-brand-5", "rgb-brand-6", "rgb-brand-7", "rgb-brand-8", "rgb-brand-9", "shadow-1", "shadow-2", "shadow-3", "fs-xs", "fs-sm", "fs-md", "fs-lg", "fs-xl", "fs-2xl", "fs-3xl", "fs-4xl", "lh-tight", "lh-base", "lh-relaxed", "space-xs", "space-sm", "space-md", "space-lg", "space-xl", "space-2xl", "space-3xl", "radius-sm", "radius-md", "radius-lg", "radius-xl", "radius-round"];
 type GlobalToken = TokenNames[number];
-type ContextChild<T extends [Record<string, unknown>, Record<string, unknown>, Record<string, unknown>]> = (state: T[0], actions: T[1], staticData: T[2]) => JSX.Element;
-interface Context {
-  useContext: () => [Record<string, unknown>, Record<string, unknown>, Record<string, unknown>];
-}
-type MaybeContextChild<T extends Context> = ContextChild<ReturnType<T["useContext"]>> | JSX.Element;
+type OmitComponentProps<T extends ValidComponent, K extends keyof ComponentProps<T>> = Omit<ComponentProps<T>, K>;
 //#endregion
-export { ClassNames, GlobalToken, MaybeContextChild, Styles };
+export { ClassNames, GlobalToken, OmitComponentProps, Styles };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-tiny-ui",
   "type": "module",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "Core package for solid tiny UI library",
   "author": "solid tiny",
   "license": "MIT",
@@ -38,7 +38,7 @@
     "@floating-ui/dom": "^1.7.4",
     "@solid-primitives/refs": "^1.1.2",
     "solid-tiny-context": "0.2.3",
-    "solid-tiny-utils": "0.11.0",
+    "solid-tiny-utils": "0.12.0",
     "time-core": "^0.1.0"
   },
   "devDependencies": {
@@ -49,14 +49,14 @@
     "@vitest/browser-playwright": "^4.0.16",
     "rolldown-plugin-solid": "^0.2.1",
     "rollup-plugin-inline-import": "^0.3.0",
-    "tsdown": "^0.18.3",
+    "tsdown": "^0.19.0",
     "typescript": "^5.9.3",
     "unocss": "66.5.10",
     "vite": "^7.1.10",
     "vite-plugin-solid": "^2.11.10",
     "vite-plugin-solid-pages": "^0.3.0",
     "vitest": "^4.0.16",
-    "@solid-tiny-ui/unocss-preset": "0.5.0"
+    "@solid-tiny-ui/unocss-preset": "0.6.0"
   },
   "scripts": {
     "build": "tsdown",

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/combobox/combobox.js

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/combobox/combobox.scss__viteSafe__
-var combobox_default = ".tiny-combobox-vars{--tiny-combobox-padding:var(--tiny-space-sm);--tiny-combobox-c-disabled:var(--tiny-c-text-disabled);--tiny-combobox-c-bg-disabled:var(--tiny-c-neutral-3);--tiny-combobox-c-border:var(--tiny-c-border);--tiny-combobox-c-border-hover:var(--tiny-c-brand-5);--tiny-combobox-c-border-active:var(--tiny-c-brand-5);--tiny-combobox-border-radius:var(--tiny-radius-sm);--tiny-combobox-suffix-c-text:var(--tiny-c-text-label);--tiny-combobox-scrollbar-color:var(--tiny-c-neutral-2)transparent;--tiny-combobox-options-padding:var(--tiny-space-sm);--tiny-combobox-option-padding:var(--tiny-space-xs);--tiny-combobox-option-c-bg-hover:var(--tiny-c-neutral-2);--tiny-combobox-option-c-bg-selected:var(--tiny-c-brand-5);--tiny-combobox-option-c-selected:var(--tiny-c-white);--tiny-combobox-option-border-radius:var(--tiny-radius-sm);--tiny-combobox-option-c-disabled:var(--tiny-c-text-disabled)}.tiny-combobox__trigger{padding-left:var(--tiny-combobox-padding);padding-right:var(--tiny-combobox-padding);border-style:solid;border-width:1px;border-color:var(--tiny-combobox-c-border);border-radius:var(--tiny-combobox-border-radius);flex-wrap:nowrap;align-items:flex-start;transition:border-color .15s;display:inline-flex;position:relative}.tiny-combobox__trigger[data-size=small]{height:24px}.tiny-combobox__trigger[data-size=medium]{height:32px}.tiny-combobox__trigger[data-size=large]{height:40px}.tiny-combobox__trigger:hover,.tiny-combobox__trigger[data-open]{border-color:var(--tiny-combobox-c-border-hover)}.tiny-combobox__trigger input[readonly]{cursor:pointer}.tiny-combobox__trigger[data-disabled]{color:var(--tiny-combobox-c-disabled);background-color:var(--tiny-combobox-c-bg-disabled);pointer-events:none;user-select:none}.tiny-combobox__trigger[data-disabled] .tiny-combobox__suffix{color:var(--tiny-combobox-c-disabled)}.tiny-combobox__suffix{color:var(--tiny-combobox-suffix-c-text);align-self:center}.tiny-combobox__options{max-height:224px;padding:var(--tiny-combobox-options-padding);scrollbar-width:thin;scrollbar-color:var(--tiny-combobox-scrollbar-color);scrollbar-gutter:auto;width:var(--tiny-combobox-trigger-width);overflow-y:auto}.tiny-combobox__option{padding:var(--tiny-combobox-option-padding);border-radius:var(--tiny-combobox-option-border-radius);cursor:pointer}.tiny-combobox__option[data-focused],.tiny-combobox__option:hover{background-color:var(--tiny-combobox-option-c-bg-hover)}.tiny-combobox__option[data-selected]{background-color:var(--tiny-combobox-option-c-bg-selected);color:var(--tiny-combobox-option-c-selected)}.tiny-combobox__option[data-disabled]{color:var(--tiny-combobox-option-c-disabled);pointer-events:none;user-select:none}.tiny-combobox__option:focus{outline:none}";
-
-//#endregion
-export { combobox_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/combobox/combobox.jsx

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/combobox/combobox.scss__viteSafe__
-var combobox_default = ".tiny-combobox-vars{--tiny-combobox-padding:var(--tiny-space-sm);--tiny-combobox-c-disabled:var(--tiny-c-text-disabled);--tiny-combobox-c-bg-disabled:var(--tiny-c-neutral-3);--tiny-combobox-c-border:var(--tiny-c-border);--tiny-combobox-c-border-hover:var(--tiny-c-brand-5);--tiny-combobox-c-border-active:var(--tiny-c-brand-5);--tiny-combobox-border-radius:var(--tiny-radius-sm);--tiny-combobox-suffix-c-text:var(--tiny-c-text-label);--tiny-combobox-scrollbar-color:var(--tiny-c-neutral-2)transparent;--tiny-combobox-options-padding:var(--tiny-space-sm);--tiny-combobox-option-padding:var(--tiny-space-xs);--tiny-combobox-option-c-bg-hover:var(--tiny-c-neutral-2);--tiny-combobox-option-c-bg-selected:var(--tiny-c-brand-5);--tiny-combobox-option-c-selected:var(--tiny-c-white);--tiny-combobox-option-border-radius:var(--tiny-radius-sm);--tiny-combobox-option-c-disabled:var(--tiny-c-text-disabled)}.tiny-combobox__trigger{padding-left:var(--tiny-combobox-padding);padding-right:var(--tiny-combobox-padding);border-style:solid;border-width:1px;border-color:var(--tiny-combobox-c-border);border-radius:var(--tiny-combobox-border-radius);flex-wrap:nowrap;align-items:flex-start;transition:border-color .15s;display:inline-flex;position:relative}.tiny-combobox__trigger[data-size=small]{height:24px}.tiny-combobox__trigger[data-size=medium]{height:32px}.tiny-combobox__trigger[data-size=large]{height:40px}.tiny-combobox__trigger:hover,.tiny-combobox__trigger[data-open]{border-color:var(--tiny-combobox-c-border-hover)}.tiny-combobox__trigger input[readonly]{cursor:pointer}.tiny-combobox__trigger[data-disabled]{color:var(--tiny-combobox-c-disabled);background-color:var(--tiny-combobox-c-bg-disabled);pointer-events:none;user-select:none}.tiny-combobox__trigger[data-disabled] .tiny-combobox__suffix{color:var(--tiny-combobox-c-disabled)}.tiny-combobox__suffix{color:var(--tiny-combobox-suffix-c-text);align-self:center}.tiny-combobox__options{max-height:224px;padding:var(--tiny-combobox-options-padding);scrollbar-width:thin;scrollbar-color:var(--tiny-combobox-scrollbar-color);scrollbar-gutter:auto;width:var(--tiny-combobox-trigger-width);overflow-y:auto}.tiny-combobox__option{padding:var(--tiny-combobox-option-padding);border-radius:var(--tiny-combobox-option-border-radius);cursor:pointer}.tiny-combobox__option[data-focused],.tiny-combobox__option:hover{background-color:var(--tiny-combobox-option-c-bg-hover)}.tiny-combobox__option[data-selected]{background-color:var(--tiny-combobox-option-c-bg-selected);color:var(--tiny-combobox-option-c-selected)}.tiny-combobox__option[data-disabled]{color:var(--tiny-combobox-option-c-disabled);pointer-events:none;user-select:none}.tiny-combobox__option:focus{outline:none}";
-
-//#endregion
-export { combobox_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/input/input.js

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/input/input.scss__viteSafe__
-var input_default = ".tiny-input-vars{--tiny-input-c-border:var(--tiny-c-border);--tiny-input-c-border-hover:var(--tiny-c-brand-5);--tiny-input-c-border-active:var(--tiny-c-brand-5);--tiny-input-border-radius:var(--tiny-radius-sm);--tiny-input-padding:var(--tiny-space-sm);--tiny-input-c-bg-disabled:var(--tiny-c-neutral-2)}.tiny-input{border-style:solid;border-width:1px;border-color:var(--tiny-input-c-border);border-radius:var(--tiny-input-border-radius);padding-left:var(--tiny-input-padding);padding-right:var(--tiny-input-padding);width:100%;transition:border-color .15s}.tiny-input:focus-within{border-color:var(--tiny-input-c-border-active)}.tiny-input:hover{border-color:var(--tiny-input-c-border-hover)}.tiny-input[data-size=small]{height:24px}.tiny-input[data-size=medium]{height:32px}.tiny-input[data-size=large]{height:40px}.tiny-input[data-disabled]{pointer-events:none;user-select:none;background-color:var(--tiny-input-c-bg-disabled);opacity:.6}";
-
-//#endregion
-export { input_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/input/input.jsx

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/input/input.scss__viteSafe__
-var input_default = ".tiny-input-vars{--tiny-input-c-border:var(--tiny-c-border);--tiny-input-c-border-hover:var(--tiny-c-brand-5);--tiny-input-c-border-active:var(--tiny-c-brand-5);--tiny-input-border-radius:var(--tiny-radius-sm);--tiny-input-padding:var(--tiny-space-sm);--tiny-input-c-bg-disabled:var(--tiny-c-neutral-2)}.tiny-input{border-style:solid;border-width:1px;border-color:var(--tiny-input-c-border);border-radius:var(--tiny-input-border-radius);padding-left:var(--tiny-input-padding);padding-right:var(--tiny-input-padding);width:100%;transition:border-color .15s}.tiny-input:focus-within{border-color:var(--tiny-input-c-border-active)}.tiny-input:hover{border-color:var(--tiny-input-c-border-hover)}.tiny-input[data-size=small]{height:24px}.tiny-input[data-size=medium]{height:32px}.tiny-input[data-size=large]{height:40px}.tiny-input[data-disabled]{pointer-events:none;user-select:none;background-color:var(--tiny-input-c-bg-disabled);opacity:.6}";
-
-//#endregion
-export { input_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/textarea/textarea.js

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/textarea/textarea.scss__viteSafe__
-var textarea_default = ".tiny-textarea-vars{--tiny-textarea-border-hover:var(--tiny-c-brand-5);--tiny-textarea-scrollbar:var(--tiny-c-neutral-4);--tiny-textarea-border:var(--tiny-c-border)}.tiny-textarea{padding:var(--tiny-space-sm);border-radius:var(--tiny-radius-sm);border:1px solid var(--tiny-textarea-border);transition:border-color .2s}.tiny-textarea:focus-within{border-color:var(--tiny-textarea-border-hover)}.tiny-textarea{scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:var(--tiny-textarea-scrollbar)transparent}";
-
-//#endregion
-export { textarea_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/textarea/textarea.jsx

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/textarea/textarea.scss__viteSafe__
-var textarea_default = ".tiny-textarea-vars{--tiny-textarea-border-hover:var(--tiny-c-brand-5);--tiny-textarea-scrollbar:var(--tiny-c-neutral-4);--tiny-textarea-border:var(--tiny-c-border)}.tiny-textarea{padding:var(--tiny-space-sm);border-radius:var(--tiny-radius-sm);border:1px solid var(--tiny-textarea-border);transition:border-color .2s}.tiny-textarea:focus-within{border-color:var(--tiny-textarea-border-hover)}.tiny-textarea{scrollbar-width:thin;scrollbar-gutter:stable;scrollbar-color:var(--tiny-textarea-scrollbar)transparent}";
-
-//#endregion
-export { textarea_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/time-picker/time-picker.js

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/time-picker/time-picker.scss__viteSafe__
-var time_picker_default = ".tiny-time-picker-trigger-vars{--tiny-time-picker-trigger-c-border:var(--tiny-c-border);--tiny-time-picker-trigger-radius:var(--tiny-radius-sm);--tiny-time-picker-trigger-width:116px;--tiny-time-picker-trigger-height:32px;--tiny-time-picker-trigger-font-size:var(--tiny-fs-sm);--tiny-time-picker-c-text-placeholder:var(--tiny-c-text-description);--tiny-time-picker-trigger-c-bg-disabled:var(--tiny-c-neutral-2)}.tiny-time-picker-trigger{border:1px solid var(--tiny-time-picker-trigger-c-border);border-radius:var(--tiny-time-picker-trigger-radius);width:fit-content;width:var(--tiny-time-picker-trigger-width);height:var(--tiny-time-picker-trigger-height);font-size:var(--tiny-time-picker-trigger-font-size);align-items:center;display:inline-flex}.tiny-time-picker-trigger[data-size=small]{--tiny-time-picker-trigger-width:96px;--tiny-time-picker-trigger-height:24px}.tiny-time-picker-trigger[data-size=large]{--tiny-time-picker-trigger-width:132px;--tiny-time-picker-trigger-height:40px;--tiny-time-picker-trigger-font-size:var(--tiny-fs-md)}.tiny-time-picker-trigger[data-disabled]{pointer-events:none;user-select:none;background-color:var(--tiny-time-picker-trigger-c-bg-disabled);opacity:.6}.tiny-time-picker-trigger__item{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.tiny-time-picker-trigger__item:not(:last-child):after{content:\":\";align-items:center;width:2px;display:flex;position:absolute;top:-1px;bottom:0;right:-1px}.tiny-time-picker-trigger__item[data-empty]{color:var(--tiny-time-picker-c-text-placeholder)}.tiny-time-picker-popover-vars{--tiny-time-picker-thumb-c-bg:var(--tiny-c-brand-2)}.tiny-popover__content.tiny-time-picker-popover[data-opening]{transform-origin:50%;animation:.125s both time-picker-clip-open}.tiny-popover__content.tiny-time-picker-popover[data-size=large]{font-size:var(--tiny-fs-md)}.tiny-popover__content.tiny-time-picker-popover{padding:0}@keyframes time-picker-clip-open{0%{opacity:0;transform:scaleY(.8)}50%{opacity:1}to{opacity:1;transform:scaleY(1)}}.tiny-time-picker__listbox-item{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.tiny-time-picker__thumb{top:var(--tiny-time-picker-thumb-top);height:var(--tiny-time-picker-thumb-height);background-color:var(--tiny-time-picker-thumb-c-bg);width:100%;position:absolute}.tiny-time-picker__action{border-top:1px solid var(--tiny-c-border);padding:var(--tiny-space-xs);align-items:center;display:flex}.tiny-time-picker__action>button{width:100%;height:100%;font-size:var(--tiny-fs-md);opacity:.5;border-radius:var(--tiny-radius-sm);justify-content:center;align-items:center;display:flex}.tiny-time-picker__action>button:hover{opacity:.6;background-color:var(--tiny-c-neutral-2)}";
-
-//#endregion
-export { time_picker_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/time-picker/time-picker.jsx

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/components/time-picker/time-picker.scss__viteSafe__
-var time_picker_default = ".tiny-time-picker-trigger-vars{--tiny-time-picker-trigger-c-border:var(--tiny-c-border);--tiny-time-picker-trigger-radius:var(--tiny-radius-sm);--tiny-time-picker-trigger-width:116px;--tiny-time-picker-trigger-height:32px;--tiny-time-picker-trigger-font-size:var(--tiny-fs-sm);--tiny-time-picker-c-text-placeholder:var(--tiny-c-text-description);--tiny-time-picker-trigger-c-bg-disabled:var(--tiny-c-neutral-2)}.tiny-time-picker-trigger{border:1px solid var(--tiny-time-picker-trigger-c-border);border-radius:var(--tiny-time-picker-trigger-radius);width:fit-content;width:var(--tiny-time-picker-trigger-width);height:var(--tiny-time-picker-trigger-height);font-size:var(--tiny-time-picker-trigger-font-size);align-items:center;display:inline-flex}.tiny-time-picker-trigger[data-size=small]{--tiny-time-picker-trigger-width:96px;--tiny-time-picker-trigger-height:24px}.tiny-time-picker-trigger[data-size=large]{--tiny-time-picker-trigger-width:132px;--tiny-time-picker-trigger-height:40px;--tiny-time-picker-trigger-font-size:var(--tiny-fs-md)}.tiny-time-picker-trigger[data-disabled]{pointer-events:none;user-select:none;background-color:var(--tiny-time-picker-trigger-c-bg-disabled);opacity:.6}.tiny-time-picker-trigger__item{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.tiny-time-picker-trigger__item:not(:last-child):after{content:\":\";align-items:center;width:2px;display:flex;position:absolute;top:-1px;bottom:0;right:-1px}.tiny-time-picker-trigger__item[data-empty]{color:var(--tiny-time-picker-c-text-placeholder)}.tiny-time-picker-popover-vars{--tiny-time-picker-thumb-c-bg:var(--tiny-c-brand-2)}.tiny-popover__content.tiny-time-picker-popover[data-opening]{transform-origin:50%;animation:.125s both time-picker-clip-open}.tiny-popover__content.tiny-time-picker-popover[data-size=large]{font-size:var(--tiny-fs-md)}.tiny-popover__content.tiny-time-picker-popover{padding:0}@keyframes time-picker-clip-open{0%{opacity:0;transform:scaleY(.8)}50%{opacity:1}to{opacity:1;transform:scaleY(1)}}.tiny-time-picker__listbox-item{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.tiny-time-picker__thumb{top:var(--tiny-time-picker-thumb-top);height:var(--tiny-time-picker-thumb-height);background-color:var(--tiny-time-picker-thumb-c-bg);width:100%;position:absolute}.tiny-time-picker__action{border-top:1px solid var(--tiny-c-border);padding:var(--tiny-space-xs);align-items:center;display:flex}.tiny-time-picker__action>button{width:100%;height:100%;font-size:var(--tiny-fs-md);opacity:.5;border-radius:var(--tiny-radius-sm);justify-content:center;align-items:center;display:flex}.tiny-time-picker__action>button:hover{opacity:.6;background-color:var(--tiny-c-neutral-2)}";
-
-//#endregion
-export { time_picker_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/layout/input-compact/input-compact.js

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/layout/input-compact/input-compact.scss__viteSafe__
-var input_compact_default = ".tiny-input-compact{width:100%;display:inline-flex}.tiny-input-compact[data-block]{display:flex}.tiny-input-compact .tiny-input-compact__item{border-radius:0}.tiny-input-compact .tiny-input-compact__first{border-start-end-radius:0;border-end-end-radius:0}.tiny-input-compact .tiny-input-compact__last{border-start-start-radius:0;border-end-start-radius:0}";
-
-//#endregion
-export { input_compact_default as default };

package/dist/_virtual/__viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/layout/input-compact/input-compact.jsx

@@ -1,5 +0,0 @@
-//#region __viteSafe__/home/runner/work/solid-tiny-ui/solid-tiny-ui/packages/core/src/layout/input-compact/input-compact.scss__viteSafe__
-var input_compact_default = ".tiny-input-compact{width:100%;display:inline-flex}.tiny-input-compact[data-block]{display:flex}.tiny-input-compact .tiny-input-compact__item{border-radius:0}.tiny-input-compact .tiny-input-compact__first{border-start-end-radius:0;border-end-end-radius:0}.tiny-input-compact .tiny-input-compact__last{border-start-start-radius:0;border-end-start-radius:0}";
-
-//#endregion
-export { input_compact_default as default };

package/dist/components/input/index.d.ts

@@ -1 +0,0 @@
-import { Input, InputProps } from "./input.js";

package/dist/components/input/index.js

@@ -1 +0,0 @@
-import { Input } from "./input.js";

package/dist/components/input/index.jsx

@@ -1 +0,0 @@
-import { Input } from "./input.jsx";

package/dist/components/input/input.d.ts

@@ -1,15 +0,0 @@
-import * as solid_js16 from "solid-js";
-
-//#region src/components/input/input.d.ts
-interface InputProps {
-  value?: string;
-  placeholder?: string;
-  disabled?: boolean;
-  onChange?: (value: string) => void;
-  onPressEnter?: () => void;
-  size?: "small" | "medium" | "large";
-  id?: string;
-}
-declare function Input(props: InputProps): solid_js16.JSX.Element;
-//#endregion
-export { Input, InputProps };