@askrjs/themes 0.0.9 → 0.0.10

package/templates/theme/tokens.css

@@ -2,10 +2,11 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   --ak-font-family-body:
-    "Aptos", "Segoe UI Variable Text", "Segoe UI", "SF Pro Text", Inter, ui-sans-serif, system-ui,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+    "Inter", "Geist", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji";
+  --ak-font-family-display: var(--ak-font-family-body);
   --ak-font-family-mono:
-    "IBM Plex Mono", "SFMono-Regular", "Menlo", "Consolas", ui-monospace, monospace,
+    "Geist Mono", "IBM Plex Mono", "SFMono-Regular", "Menlo", "Consolas", ui-monospace, monospace,
     "Apple Color Emoji", "Segoe UI Emoji";
   --ak-font-family-emphasis: var(--ak-font-family-body);
   --ak-font-family-quote: "Iowan Old Style", "Palatino Linotype", ui-serif, serif;
@@ -18,11 +19,12 @@
   --ak-font-size-xl: 1.25rem;
   --ak-font-size-2xl: 1.5rem;
   --ak-font-size-3xl: 1.75rem;
-  --ak-font-size-heading: clamp(1.25rem, 1.08rem + 0.62vw, 1.75rem);
-  --ak-font-size-display: clamp(2.35rem, 1.7rem + 2.05vw, 3.65rem);
+  --ak-font-size-heading: var(--ak-type-6-size);
+  --ak-font-size-display: var(--ak-type-9-size);
 
   --ak-font-weight-light: 300;
   --ak-font-weight-regular: 400;
+  --ak-font-weight-normal: var(--ak-font-weight-regular);
   --ak-font-weight-medium: 500;
   --ak-font-weight-semibold: 600;
   --ak-font-weight-bold: 700;
@@ -33,7 +35,7 @@
 
   --ak-type-1-size: 0.75rem;
   --ak-type-1-line-height: 1rem;
-  --ak-type-1-letter-spacing: 0.0025em;
+  --ak-type-1-letter-spacing: 0em;
   --ak-type-2-size: 0.875rem;
   --ak-type-2-line-height: 1.25rem;
   --ak-type-2-letter-spacing: 0em;
@@ -42,22 +44,22 @@
   --ak-type-3-letter-spacing: 0em;
   --ak-type-4-size: 1.125rem;
   --ak-type-4-line-height: 1.625rem;
-  --ak-type-4-letter-spacing: -0.0025em;
+  --ak-type-4-letter-spacing: 0em;
   --ak-type-5-size: 1.25rem;
   --ak-type-5-line-height: 1.75rem;
-  --ak-type-5-letter-spacing: -0.005em;
+  --ak-type-5-letter-spacing: 0em;
   --ak-type-6-size: 1.625rem;
   --ak-type-6-line-height: 2rem;
-  --ak-type-6-letter-spacing: -0.02em;
+  --ak-type-6-letter-spacing: 0em;
   --ak-type-7-size: 2rem;
   --ak-type-7-line-height: 2.35rem;
-  --ak-type-7-letter-spacing: -0.03em;
+  --ak-type-7-letter-spacing: 0em;
   --ak-type-8-size: 2.625rem;
   --ak-type-8-line-height: 2.85rem;
-  --ak-type-8-letter-spacing: -0.032em;
+  --ak-type-8-letter-spacing: 0em;
   --ak-type-9-size: 4.25rem;
   --ak-type-9-line-height: 4.2rem;
-  --ak-type-9-letter-spacing: -0.045em;
+  --ak-type-9-letter-spacing: 0em;
 
   /* Semantic spacing is the authored scale. Numeric steps are compatibility aliases. */
   --ak-space-xs: 0.25rem;
@@ -80,16 +82,34 @@
   --ak-radius-sm: 6px;
   --ak-radius-md: 8px;
   --ak-radius-lg: 10px;
-  --ak-radius-xl: 14px;
+  --ak-radius-xl: 12px;
   --ak-radius-round: 9999px;
 
   --ak-border-width-sm: 1px;
   --ak-border-width-md: 2px;
-  --ak-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.08), 0 1px 1px rgba(15, 23, 42, 0.04);
-  --ak-shadow-md: 0 16px 36px -24px rgba(15, 23, 42, 0.36), 0 4px 12px -8px rgba(15, 23, 42, 0.18);
-  --ak-shadow-lg:
-    0 28px 72px -36px rgba(15, 23, 42, 0.48), 0 12px 30px -18px rgba(15, 23, 42, 0.28);
-  --ak-focus-ring-width: 2px;
+  --ak-border-base: 0 solid transparent;
+  --ak-border-sm: var(--ak-border-width-sm) solid var(--ak-color-border);
+  --ak-border-md: var(--ak-border-width-md) solid var(--ak-color-border);
+  --ak-border-bottom-base: var(--ak-border-base);
+  --ak-border-bottom-sm: var(--ak-border-sm);
+  --ak-border-bottom-md: var(--ak-border-md);
+  --ak-border-right-base: var(--ak-border-base);
+  --ak-border-right-sm: var(--ak-border-sm);
+  --ak-border-right-md: var(--ak-border-md);
+  --ak-border-radius-base: 0;
+  --ak-border-radius-sm: var(--ak-radius-sm);
+  --ak-border-radius-md: var(--ak-radius-md);
+  --ak-background-base: transparent;
+  --ak-background-sm: var(--ak-color-surface);
+  --ak-background-md: var(--ak-color-surface-muted);
+  --ak-shadow-xs: none;
+  --ak-shadow-sm: none;
+  --ak-shadow-md: 0 8px 18px -12px rgb(0 0 0 / 0.24);
+  --ak-shadow-lg: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+  --ak-box-shadow-base: none;
+  --ak-box-shadow-sm: var(--ak-shadow-sm);
+  --ak-box-shadow-md: var(--ak-shadow-md);
+  --ak-focus-ring-width: 3px;
   --ak-focus-ring-offset: 2px;
   --ak-duration-fast: 160ms;
   --ak-duration-normal: 220ms;
@@ -121,12 +141,14 @@
   --ak-layout-page-gutter: clamp(1rem, 0.7rem + 1.25vw, 1.75rem);
   --ak-layout-panel-padding: clamp(0.9rem, 0.78rem + 0.45vw, 1.2rem);
   --ak-container-inline-size: 100%;
+  --ak-density-control-height-xs: 1.5rem;
   --ak-density-control-height-sm: 2rem;
-  --ak-density-control-height-md: 2.375rem;
-  --ak-density-control-height-lg: 2.75rem;
+  --ak-density-control-height-md: 2.25rem;
+  --ak-density-control-height-lg: 2.5rem;
+  --ak-density-control-padding-x-xs: 0.5rem;
   --ak-density-control-padding-x-sm: 0.75rem;
-  --ak-density-control-padding-x-md: 0.95rem;
-  --ak-density-control-padding-x-lg: 1.1rem;
+  --ak-density-control-padding-x-md: 1rem;
+  --ak-density-control-padding-x-lg: 1.5rem;
   --ak-container-1: 30rem;
   --ak-container-2: 42rem;
   --ak-container-3: 58rem;
@@ -137,6 +159,9 @@
   --ak-section-4: var(--ak-space-7);
 
   --ak-z-dropdown: 1000;
+  --ak-z-index-base: auto;
+  --ak-z-index-sm: 10;
+  --ak-z-index-md: 100;
   --ak-z-sticky: 1100;
   --ak-z-fixed: 1200;
   --ak-z-modal-backdrop: 1300;
@@ -145,80 +170,81 @@
   --ak-z-toast: 1550;
   --ak-z-tooltip: 1600;
 
-  --ak-dark-color-primary: #60a5fa;
-  --ak-dark-color-primary-hover: #7ab8ff;
-  --ak-dark-color-primary-active: #4d92ef;
-  --ak-dark-color-primary-soft: rgba(96, 165, 250, 0.2);
-  --ak-dark-color-primary-ink: #dcedff;
+  --ak-dark-color-primary: oklch(0.922 0 0);
+  --ak-dark-color-primary-hover: color-mix(in oklch, var(--ak-dark-color-primary) 90%, transparent);
+  --ak-dark-color-primary-active: color-mix(in oklch, var(--ak-dark-color-primary) 84%, black);
+  --ak-dark-color-primary-soft: oklch(0.269 0 0);
+  --ak-dark-color-primary-ink: oklch(0.205 0 0);
 
-  --ak-dark-color-text: #edf3ff;
-  --ak-dark-color-text-muted: #a9b7cc;
-  --ak-dark-color-text-subtle: #8090a8;
-  --ak-dark-color-text-inverse: #0e1320;
+  --ak-dark-color-text: oklch(0.985 0 0);
+  --ak-dark-color-text-muted: oklch(0.708 0 0);
+  --ak-dark-color-text-subtle: oklch(0.556 0 0);
+  --ak-dark-color-text-inverse: oklch(0.205 0 0);
 
-  --ak-dark-color-bg: #0f1420;
-  --ak-dark-color-surface: #171d2b;
-  --ak-dark-color-surface-muted: #20283a;
-  --ak-dark-color-surface-raised: #263249;
-  --ak-dark-color-surface-overlay: rgba(23, 29, 43, 0.88);
+  --ak-dark-color-bg: oklch(0.145 0 0);
+  --ak-dark-color-surface: oklch(0.205 0 0);
+  --ak-dark-color-surface-muted: oklch(0.269 0 0);
+  --ak-dark-color-surface-raised: oklch(0.205 0 0);
+  --ak-dark-color-surface-overlay: oklch(0.205 0 0);
 
-  --ak-dark-color-border-subtle: #2a3449;
-  --ak-dark-color-border: #38445c;
-  --ak-dark-color-border-strong: #59698a;
+  --ak-dark-color-border-subtle: oklch(0.269 0 0);
+  --ak-dark-color-border: oklch(1 0 0 / 10%);
+  --ak-dark-color-border-strong: oklch(0.439 0 0);
 
   --ak-dark-color-success: #4ade80;
-  --ak-dark-color-success-soft: rgba(74, 222, 128, 0.18);
-  --ak-dark-color-success-ink: #dcfce7;
+  --ak-dark-color-success-soft: #052e16;
+  --ak-dark-color-success-ink: #bbf7d0;
   --ak-dark-color-warning: #fbbf24;
-  --ak-dark-color-warning-soft: rgba(251, 191, 36, 0.18);
-  --ak-dark-color-warning-ink: #fef3c7;
-  --ak-dark-color-danger: #fb7185;
-  --ak-dark-color-danger-soft: rgba(251, 113, 133, 0.18);
+  --ak-dark-color-warning-soft: #422006;
+  --ak-dark-color-warning-ink: #fde68a;
+  --ak-dark-color-danger: oklch(0.704 0.191 22.216);
+  --ak-dark-color-danger-soft: oklch(0.704 0.191 22.216 / 0.2);
   --ak-dark-color-danger-ink: #ffe4e6;
   --ak-dark-color-info: #38bdf8;
-  --ak-dark-color-info-soft: rgba(56, 189, 248, 0.18);
-  --ak-dark-color-info-ink: #e0f2fe;
-
-  --ak-dark-color-link: var(--ak-dark-color-primary);
-  --ak-dark-color-link-hover: var(--ak-dark-color-primary-hover);
-  --ak-dark-color-focus-ring: rgba(96, 165, 250, 0.22);
-  --ak-dark-color-disabled-bg: #1e2737;
-  --ak-dark-color-disabled-surface: #171d2b;
-  --ak-dark-color-disabled-border: #2f3b50;
-  --ak-dark-color-disabled-text: #74849d;
-  --ak-dark-color-selected: rgba(110, 168, 254, 0.15);
-  --ak-dark-color-selected-border: #60a5fa;
-  --ak-dark-color-hover: rgba(237, 243, 255, 0.06);
-  --ak-dark-color-active: rgba(237, 243, 255, 0.12);
-  --ak-dark-color-backdrop: rgba(2, 6, 12, 0.66);
-
-  --ak-dark-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(255, 255, 255, 0.03);
-  --ak-dark-shadow-md: 0 16px 40px -24px rgba(0, 0, 0, 0.64), 0 4px 14px -8px rgba(0, 0, 0, 0.42);
-  --ak-dark-shadow-lg: 0 30px 78px -38px rgba(0, 0, 0, 0.72), 0 14px 34px -20px rgba(0, 0, 0, 0.52);
+  --ak-dark-color-info-soft: #082f49;
+  --ak-dark-color-info-ink: #bae6fd;
+
+  --ak-dark-color-link: var(--ak-dark-color-text);
+  --ak-dark-color-link-hover: color-mix(in oklch, var(--ak-dark-color-link) 88%, transparent);
+  --ak-dark-color-focus-ring: oklch(0.556 0 0 / 0.5);
+  --ak-dark-color-disabled-bg: oklch(0.269 0 0);
+  --ak-dark-color-disabled-surface: oklch(0.205 0 0);
+  --ak-dark-color-disabled-border: oklch(1 0 0 / 10%);
+  --ak-dark-color-disabled-text: oklch(0.708 0 0);
+  --ak-dark-color-selected: oklch(0.269 0 0);
+  --ak-dark-color-selected-border: oklch(1 0 0 / 10%);
+  --ak-dark-color-hover: oklch(0.269 0 0);
+  --ak-dark-color-active: color-mix(in oklch, var(--ak-dark-color-hover) 82%, white);
+  --ak-dark-color-backdrop: rgb(0 0 0 / 0.5);
+
+  --ak-dark-shadow-xs: none;
+  --ak-dark-shadow-sm: none;
+  --ak-dark-shadow-md: 0 8px 18px -12px rgb(0 0 0 / 0.6);
+  --ak-dark-shadow-lg: 0 25px 50px -12px rgb(0 0 0 / 0.7);
 }
 
 :root,
 [data-theme="light"] {
-  --ak-color-primary: #2563eb;
-  --ak-color-primary-hover: #1d4ed8;
-  --ak-color-primary-active: #1e40af;
-  --ak-color-primary-soft: #dbeafe;
-  --ak-color-primary-ink: #163b8a;
-
-  --ak-color-text: #1b2434;
-  --ak-color-text-muted: #5d6b85;
-  --ak-color-text-subtle: #8b96ab;
-  --ak-color-text-inverse: #ffffff;
-
-  --ak-color-bg: #f6f7fb;
-  --ak-color-surface: #ffffff;
-  --ak-color-surface-muted: #f1f4fa;
-  --ak-color-surface-raised: #ffffff;
-  --ak-color-surface-overlay: rgba(255, 255, 255, 0.86);
-
-  --ak-color-border-subtle: #e6ebf5;
-  --ak-color-border: #d7deec;
-  --ak-color-border-strong: #b7c2d8;
+  --ak-color-primary: oklch(0.205 0 0);
+  --ak-color-primary-hover: color-mix(in oklch, var(--ak-color-primary) 90%, transparent);
+  --ak-color-primary-active: color-mix(in oklch, var(--ak-color-primary) 88%, black);
+  --ak-color-primary-soft: oklch(0.97 0 0);
+  --ak-color-primary-ink: oklch(0.205 0 0);
+
+  --ak-color-text: oklch(0.145 0 0);
+  --ak-color-text-muted: oklch(0.556 0 0);
+  --ak-color-text-subtle: oklch(0.708 0 0);
+  --ak-color-text-inverse: oklch(0.985 0 0);
+
+  --ak-color-bg: oklch(1 0 0);
+  --ak-color-surface: oklch(1 0 0);
+  --ak-color-surface-muted: oklch(0.97 0 0);
+  --ak-color-surface-raised: oklch(1 0 0);
+  --ak-color-surface-overlay: oklch(1 0 0);
+
+  --ak-color-border-subtle: oklch(0.922 0 0);
+  --ak-color-border: oklch(0.922 0 0);
+  --ak-color-border-strong: oklch(0.708 0 0);
 
   --ak-color-success: #16a34a;
   --ak-color-success-soft: rgba(22, 163, 74, 0.14);
@@ -226,25 +252,32 @@
   --ak-color-warning: #f59e0b;
   --ak-color-warning-soft: rgba(245, 158, 11, 0.16);
   --ak-color-warning-ink: #854d0e;
-  --ak-color-danger: #ef4444;
-  --ak-color-danger-soft: rgba(239, 68, 68, 0.15);
+  --ak-color-danger: oklch(0.577 0.245 27.325);
+  --ak-color-danger-soft: oklch(0.577 0.245 27.325 / 0.2);
   --ak-color-danger-ink: #991b1b;
   --ak-color-info: #0ea5e9;
   --ak-color-info-soft: rgba(14, 165, 233, 0.16);
   --ak-color-info-ink: #0c4a6e;
 
-  --ak-color-link: #1d4ed8;
-  --ak-color-link-hover: #1e40af;
-  --ak-color-focus-ring: rgba(37, 99, 235, 0.18);
-  --ak-color-disabled-bg: #ecf0f7;
-  --ak-color-disabled-surface: #f7f9fc;
-  --ak-color-disabled-border: #d9e0ec;
-  --ak-color-disabled-text: #9aa6bc;
-  --ak-color-selected: #e4edff;
-  --ak-color-selected-border: #93c5fd;
-  --ak-color-hover: rgba(37, 99, 235, 0.06);
-  --ak-color-active: rgba(37, 99, 235, 0.11);
-  --ak-color-backdrop: rgba(10, 17, 33, 0.42);
+  --ak-color-link: var(--ak-color-primary);
+  --ak-color-link-hover: color-mix(in oklch, var(--ak-color-link) 88%, transparent);
+  --ak-color-focus-ring: oklch(0.708 0 0 / 0.5);
+  --ak-color-disabled-bg: oklch(0.97 0 0);
+  --ak-color-disabled-surface: oklch(1 0 0);
+  --ak-color-disabled-border: oklch(0.922 0 0);
+  --ak-color-disabled-text: oklch(0.556 0 0);
+  --ak-color-selected: oklch(0.97 0 0);
+  --ak-color-selected-border: oklch(0.922 0 0);
+  --ak-color-hover: oklch(0.97 0 0);
+  --ak-color-active: color-mix(in oklch, var(--ak-color-hover) 82%, black);
+  --ak-color-backdrop: rgb(0 0 0 / 0.1);
+
+  --ak-color-accent: var(--ak-color-hover);
+  --ak-color-accent-ink: var(--ak-color-text);
+  --ak-color-input: var(--ak-color-border);
+  --ak-color-popover: var(--ak-color-surface-overlay);
+  --ak-color-popover-ink: var(--ak-color-text);
+  --ak-color-ring: var(--ak-color-border-strong);
 
   --ak-color-fg: var(--ak-color-text);
   --ak-color-muted: var(--ak-color-text-muted);
@@ -303,9 +336,16 @@
   --ak-shadow-sm: var(--ak-dark-shadow-sm);
   --ak-shadow-md: var(--ak-dark-shadow-md);
   --ak-shadow-lg: var(--ak-dark-shadow-lg);
+  --ak-shadow-xs: var(--ak-dark-shadow-xs);
 
   --ak-color-fg: var(--ak-color-text);
   --ak-color-muted: var(--ak-color-text-muted);
+  --ak-color-accent: var(--ak-color-hover);
+  --ak-color-accent-ink: var(--ak-color-text);
+  --ak-color-input: var(--ak-color-border);
+  --ak-color-popover: var(--ak-color-surface-overlay);
+  --ak-color-popover-ink: var(--ak-color-text);
+  --ak-color-ring: var(--ak-color-border-strong);
 
   color-scheme: dark;
 }
@@ -370,9 +410,16 @@
     --ak-shadow-sm: var(--ak-dark-shadow-sm);
     --ak-shadow-md: var(--ak-dark-shadow-md);
     --ak-shadow-lg: var(--ak-dark-shadow-lg);
+    --ak-shadow-xs: var(--ak-dark-shadow-xs);
 
     --ak-color-fg: var(--ak-color-text);
     --ak-color-muted: var(--ak-color-text-muted);
+    --ak-color-accent: var(--ak-color-hover);
+    --ak-color-accent-ink: var(--ak-color-text);
+    --ak-color-input: var(--ak-color-border);
+    --ak-color-popover: var(--ak-color-surface-overlay);
+    --ak-color-popover-ink: var(--ak-color-text);
+    --ak-color-ring: var(--ak-color-border-strong);
 
     color-scheme: dark;
   }

package/dist/components/_internal/box-layout.js

@@ -1,116 +0,0 @@
-import { styleDeclarationsToClass } from "./style.js";
-import { mergeLayoutStyles, resolveSpaceValue, setResponsiveStyleVar } from "./layout.js";
-//#region src/components/_internal/box-layout.ts
-const SPACE_PROP_KEYS = new Set([
-	"m",
-	"mx",
-	"my",
-	"mt",
-	"mr",
-	"mb",
-	"ml",
-	"p",
-	"px",
-	"py",
-	"pt",
-	"pr",
-	"pb",
-	"pl",
-	"inset",
-	"top",
-	"right",
-	"bottom",
-	"left"
-]);
-const BOX_PROP_KEYS = new Set([
-	"display",
-	"m",
-	"mx",
-	"my",
-	"mt",
-	"mr",
-	"mb",
-	"ml",
-	"p",
-	"px",
-	"py",
-	"pt",
-	"pr",
-	"pb",
-	"pl",
-	"width",
-	"minWidth",
-	"maxWidth",
-	"height",
-	"minHeight",
-	"maxHeight",
-	"position",
-	"inset",
-	"top",
-	"right",
-	"bottom",
-	"left",
-	"overflow",
-	"overflowX",
-	"overflowY",
-	"flexBasis",
-	"flexGrow",
-	"flexShrink",
-	"gridArea",
-	"gridColumn",
-	"gridColumnStart",
-	"gridColumnEnd",
-	"gridRow",
-	"gridRowStart",
-	"gridRowEnd"
-]);
-function variableNameForProp(prop) {
-	switch (prop) {
-		case "overflowX": return "overflow-x";
-		case "overflowY": return "overflow-y";
-		case "minWidth": return "min-width";
-		case "maxWidth": return "max-width";
-		case "minHeight": return "min-height";
-		case "maxHeight": return "max-height";
-		case "flexBasis": return "flex-basis";
-		case "flexGrow": return "flex-grow";
-		case "flexShrink": return "flex-shrink";
-		case "gridArea": return "grid-area";
-		case "gridColumn": return "grid-column";
-		case "gridColumnStart": return "grid-column-start";
-		case "gridColumnEnd": return "grid-column-end";
-		case "gridRow": return "grid-row";
-		case "gridRowStart": return "grid-row-start";
-		case "gridRowEnd": return "grid-row-end";
-		default: return prop;
-	}
-}
-function splitBoxLayoutProps(props) {
-	const boxProps = {};
-	const rest = {};
-	for (const [key, value] of Object.entries(props)) if (BOX_PROP_KEYS.has(key)) boxProps[key] = value;
-	else rest[key] = value;
-	return {
-		boxProps,
-		rest
-	};
-}
-function applyBoxLayoutStyles(styles, boxProps) {
-	for (const key of BOX_PROP_KEYS) {
-		const value = boxProps[key];
-		if (value === void 0) continue;
-		const variable = variableNameForProp(key);
-		if (SPACE_PROP_KEYS.has(key)) {
-			setResponsiveStyleVar(styles, variable, value, resolveSpaceValue);
-			continue;
-		}
-		setResponsiveStyleVar(styles, variable, value, (input) => input);
-	}
-}
-function withBoxLayoutClass(styles, userStyle) {
-	return styleDeclarationsToClass(mergeLayoutStyles(styles, userStyle));
-}
-//#endregion
-export { applyBoxLayoutStyles, splitBoxLayoutProps, withBoxLayoutClass };
-
-//# sourceMappingURL=box-layout.js.map

package/dist/components/_internal/box-layout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"box-layout.js","names":[],"sources":["../../../src/components/_internal/box-layout.ts"],"sourcesContent":["import { mergeLayoutStyles, resolveSpaceValue, setResponsiveStyleVar } from \"./layout\";\nimport { styleDeclarationsToClass } from \"./style\";\nimport type { BoxLayoutOwnProps } from \"../box/box.types\";\n\nconst SPACE_PROP_KEYS = new Set([\n  \"m\",\n  \"mx\",\n  \"my\",\n  \"mt\",\n  \"mr\",\n  \"mb\",\n  \"ml\",\n  \"p\",\n  \"px\",\n  \"py\",\n  \"pt\",\n  \"pr\",\n  \"pb\",\n  \"pl\",\n  \"inset\",\n  \"top\",\n  \"right\",\n  \"bottom\",\n  \"left\",\n]);\n\nconst BOX_PROP_KEYS = new Set<keyof BoxLayoutOwnProps>([\n  \"display\",\n  \"m\",\n  \"mx\",\n  \"my\",\n  \"mt\",\n  \"mr\",\n  \"mb\",\n  \"ml\",\n  \"p\",\n  \"px\",\n  \"py\",\n  \"pt\",\n  \"pr\",\n  \"pb\",\n  \"pl\",\n  \"width\",\n  \"minWidth\",\n  \"maxWidth\",\n  \"height\",\n  \"minHeight\",\n  \"maxHeight\",\n  \"position\",\n  \"inset\",\n  \"top\",\n  \"right\",\n  \"bottom\",\n  \"left\",\n  \"overflow\",\n  \"overflowX\",\n  \"overflowY\",\n  \"flexBasis\",\n  \"flexGrow\",\n  \"flexShrink\",\n  \"gridArea\",\n  \"gridColumn\",\n  \"gridColumnStart\",\n  \"gridColumnEnd\",\n  \"gridRow\",\n  \"gridRowStart\",\n  \"gridRowEnd\",\n]);\n\nfunction variableNameForProp(prop: keyof BoxLayoutOwnProps): string {\n  switch (prop) {\n    case \"overflowX\":\n      return \"overflow-x\";\n    case \"overflowY\":\n      return \"overflow-y\";\n    case \"minWidth\":\n      return \"min-width\";\n    case \"maxWidth\":\n      return \"max-width\";\n    case \"minHeight\":\n      return \"min-height\";\n    case \"maxHeight\":\n      return \"max-height\";\n    case \"flexBasis\":\n      return \"flex-basis\";\n    case \"flexGrow\":\n      return \"flex-grow\";\n    case \"flexShrink\":\n      return \"flex-shrink\";\n    case \"gridArea\":\n      return \"grid-area\";\n    case \"gridColumn\":\n      return \"grid-column\";\n    case \"gridColumnStart\":\n      return \"grid-column-start\";\n    case \"gridColumnEnd\":\n      return \"grid-column-end\";\n    case \"gridRow\":\n      return \"grid-row\";\n    case \"gridRowStart\":\n      return \"grid-row-start\";\n    case \"gridRowEnd\":\n      return \"grid-row-end\";\n    default:\n      return prop;\n  }\n}\n\nexport function splitBoxLayoutProps<T extends Record<string, unknown>>(\n  props: T,\n): {\n  boxProps: Partial<BoxLayoutOwnProps>;\n  rest: Omit<T, keyof BoxLayoutOwnProps>;\n} {\n  const boxProps: Partial<BoxLayoutOwnProps> = {};\n  const rest: Record<string, unknown> = {};\n\n  for (const [key, value] of Object.entries(props)) {\n    if (BOX_PROP_KEYS.has(key as keyof BoxLayoutOwnProps)) {\n      (boxProps as Record<string, unknown>)[key] = value;\n    } else {\n      rest[key] = value;\n    }\n  }\n\n  return { boxProps, rest: rest as Omit<T, keyof BoxLayoutOwnProps> };\n}\n\nexport function applyBoxLayoutStyles(\n  styles: Record<string, string | number>,\n  boxProps: Partial<BoxLayoutOwnProps>,\n) {\n  for (const key of BOX_PROP_KEYS) {\n    const value = boxProps[key];\n    if (value === undefined) continue;\n\n    const variable = variableNameForProp(key);\n    if (SPACE_PROP_KEYS.has(key)) {\n      setResponsiveStyleVar(styles, variable, value as string | number, resolveSpaceValue);\n      continue;\n    }\n\n    setResponsiveStyleVar(\n      styles,\n      variable,\n      value as string | number,\n      (input) => input as string | number,\n    );\n  }\n}\n\nexport function withBoxLayoutStyle(\n  styles: Record<string, string | number>,\n  userStyle: unknown,\n): string | undefined {\n  return mergeLayoutStyles(styles, userStyle);\n}\n\nexport function withBoxLayoutClass(\n  styles: Record<string, string | number>,\n  userStyle: unknown,\n): string | undefined {\n  return styleDeclarationsToClass(mergeLayoutStyles(styles, userStyle));\n}\n"],"mappings":";;;AAIA,MAAM,kBAAkB,IAAI,IAAI;CAC9B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC;AAED,MAAM,gBAAgB,IAAI,IAA6B;CACrD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,CAAC;AAED,SAAS,oBAAoB,MAAuC;CAClE,QAAQ,MAAR;EACE,KAAK,aACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,KAAK,YACH,OAAO;EACT,KAAK,YACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,KAAK,aACH,OAAO;EACT,KAAK,YACH,OAAO;EACT,KAAK,cACH,OAAO;EACT,KAAK,YACH,OAAO;EACT,KAAK,cACH,OAAO;EACT,KAAK,mBACH,OAAO;EACT,KAAK,iBACH,OAAO;EACT,KAAK,WACH,OAAO;EACT,KAAK,gBACH,OAAO;EACT,KAAK,cACH,OAAO;EACT,SACE,OAAO;CACX;AACF;AAEA,SAAgB,oBACd,OAIA;CACA,MAAM,WAAuC,CAAC;CAC9C,MAAM,OAAgC,CAAC;CAEvC,KAAK,MAAM,CAAC,KAAK,UAAU,OAAO,QAAQ,KAAK,GAC7C,IAAI,cAAc,IAAI,GAA8B,GAClD,SAAsC,OAAO;MAE7C,KAAK,OAAO;CAIhB,OAAO;EAAE;EAAgB;CAAyC;AACpE;AAEA,SAAgB,qBACd,QACA,UACA;CACA,KAAK,MAAM,OAAO,eAAe;EAC/B,MAAM,QAAQ,SAAS;EACvB,IAAI,UAAU,KAAA,GAAW;EAEzB,MAAM,WAAW,oBAAoB,GAAG;EACxC,IAAI,gBAAgB,IAAI,GAAG,GAAG;GAC5B,sBAAsB,QAAQ,UAAU,OAA0B,iBAAiB;GACnF;EACF;EAEA,sBACE,QACA,UACA,QACC,UAAU,KACb;CACF;AACF;AASA,SAAgB,mBACd,QACA,WACoB;CACpB,OAAO,yBAAyB,kBAAkB,QAAQ,SAAS,CAAC;AACtE"}

package/dist/components/_internal/layout.d.ts

@@ -1,9 +0,0 @@
-//#region src/components/_internal/layout.d.ts
-/**
- * Layout helpers shared by headless layout primitives.
- */
-type LayoutBreakpoint = "initial" | "sm" | "md" | "lg" | "xl";
-type ResponsiveValue<T> = T | Partial<Record<LayoutBreakpoint, T>>;
-//#endregion
-export { ResponsiveValue };
-//# sourceMappingURL=layout.d.ts.map

package/dist/components/_internal/layout.js

@@ -1,142 +0,0 @@
-import { serializeCssDeclarations } from "./style.js";
-//#region src/components/_internal/layout.ts
-const BREAKPOINTS = [
-	"initial",
-	"sm",
-	"md",
-	"lg",
-	"xl"
-];
-/** Units and patterns that identify a concrete CSS length value. */
-const CSS_UNIT_RE = /^-?[\d.]+(%|px|em|rem|ex|ch|ic|lh|rlh|vw|vh|vmin|vmax|svw|svh|dvw|dvh|cqw|cqh|cqi|cqb|fr|cm|mm|in|pt|pc|Q)$/;
-const SPACE_TOKEN_MAP = {
-	"1": "var(--ak-space-1)",
-	"2": "var(--ak-space-2)",
-	"3": "var(--ak-space-3)",
-	"4": "var(--ak-space-4)",
-	"5": "var(--ak-space-5)",
-	"6": "var(--ak-space-6)",
-	"7": "var(--ak-space-7)",
-	"8": "var(--ak-space-8)",
-	"9": "var(--ak-space-9)",
-	xs: "var(--ak-space-xs)",
-	sm: "var(--ak-space-sm)",
-	md: "var(--ak-space-md)",
-	lg: "var(--ak-space-lg)",
-	xl: "var(--ak-space-xl)",
-	"2xl": "var(--ak-space-2xl)",
-	"3xl": "var(--ak-space-3xl)"
-};
-const CONTAINER_SIZE_MAP = {
-	"1": "var(--ak-container-1)",
-	"2": "var(--ak-container-2)",
-	"3": "var(--ak-container-3)",
-	"4": "var(--ak-container-4)",
-	sm: "var(--ak-container-1)",
-	md: "var(--ak-container-2)",
-	lg: "var(--ak-container-3)",
-	xl: "var(--ak-container-4)",
-	fluid: "100%"
-};
-/**
-* Returns true when `value` is a concrete CSS length/size that can be serialized
-* into a CSS declaration without token translation.
-*/
-function isCssLength(value) {
-	if (typeof value !== "string") return false;
-	const v = value.trim();
-	if (v === "0") return true;
-	if (CSS_UNIT_RE.test(v)) return true;
-	if (/^[a-z][a-z-]*\(/.test(v)) return true;
-	return false;
-}
-function isResponsiveValue(value) {
-	if (!value || typeof value !== "object" || Array.isArray(value)) return false;
-	return BREAKPOINTS.some((breakpoint) => breakpoint in value);
-}
-function normalizeResponsiveValue(value) {
-	if (value === void 0) return void 0;
-	if (isResponsiveValue(value)) return value;
-	return { initial: value };
-}
-function serializeResponsiveValue(value) {
-	const normalized = normalizeResponsiveValue(value);
-	if (!normalized) return void 0;
-	return BREAKPOINTS.map((breakpoint) => {
-		const breakpointValue = normalized[breakpoint];
-		if (breakpointValue === void 0) return "";
-		return `${breakpoint}:${String(breakpointValue)}`;
-	}).filter(Boolean).join("|");
-}
-function serializeResponsiveValueIf(value, predicate) {
-	const normalized = normalizeResponsiveValue(value);
-	if (!normalized) return void 0;
-	for (const breakpoint of BREAKPOINTS) {
-		const breakpointValue = normalized[breakpoint];
-		if (breakpointValue === void 0) continue;
-		if (!predicate(breakpointValue)) return void 0;
-	}
-	return serializeResponsiveValue(value);
-}
-function setResponsiveStyleVar(styles, variable, value, resolve = (input) => input) {
-	const normalized = normalizeResponsiveValue(value);
-	if (!normalized) return;
-	for (const breakpoint of BREAKPOINTS) {
-		const breakpointValue = normalized[breakpoint];
-		if (breakpointValue === void 0) continue;
-		const resolved = resolve(breakpointValue);
-		if (resolved === void 0 || resolved === null || resolved === "") continue;
-		styles[`--ak-${variable}-${breakpoint}`] = resolved;
-	}
-}
-function resolveSpaceValue(value) {
-	if (typeof value === "number") return String(value);
-	const trimmed = value.trim();
-	return SPACE_TOKEN_MAP[trimmed] ?? trimmed;
-}
-function resolveContainerSizeValue(value) {
-	const trimmed = value.trim();
-	return CONTAINER_SIZE_MAP[trimmed] ?? trimmed;
-}
-function resolveJustifyValue(value) {
-	const trimmed = value.trim();
-	if (trimmed === "between") return "space-between";
-	if (trimmed === "start") return "flex-start";
-	if (trimmed === "end") return "flex-end";
-	return trimmed;
-}
-function resolveAlignValue(value) {
-	const trimmed = value.trim();
-	if (trimmed === "start") return "flex-start";
-	if (trimmed === "end") return "flex-end";
-	return trimmed;
-}
-function resolveInlineAlignValue(value) {
-	if (value === "left") return {
-		marginLeft: "0",
-		marginRight: "auto"
-	};
-	if (value === "right") return {
-		marginLeft: "auto",
-		marginRight: "0"
-	};
-	return {
-		marginLeft: "auto",
-		marginRight: "auto"
-	};
-}
-/**
-* Merges a record of computed layout declarations with a user-supplied style
-* value. The user's declarations take precedence for conflicting keys.
-*/
-function mergeLayoutStyles(layout, user) {
-	const merged = { ...layout };
-	if (user !== null && user !== void 0 && typeof user === "object") Object.assign(merged, user);
-	const mergedString = serializeCssDeclarations(merged);
-	if (typeof user === "string" && user.trim()) return mergedString ? `${mergedString};${user.trim()}` : user.trim();
-	return mergedString || void 0;
-}
-//#endregion
-export { isCssLength, isResponsiveValue, mergeLayoutStyles, resolveAlignValue, resolveContainerSizeValue, resolveInlineAlignValue, resolveJustifyValue, resolveSpaceValue, serializeResponsiveValueIf, setResponsiveStyleVar };
-
-//# sourceMappingURL=layout.js.map

package/dist/components/_internal/layout.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"layout.js","names":[],"sources":["../../../src/components/_internal/layout.ts"],"sourcesContent":["import { serializeCssDeclarations } from \"./style\";\n\n/**\n * Layout helpers shared by headless layout primitives.\n */\n\nexport type LayoutBreakpoint = \"initial\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type ResponsiveValue<T> = T | Partial<Record<LayoutBreakpoint, T>>;\n\nconst BREAKPOINTS: readonly LayoutBreakpoint[] = [\"initial\", \"sm\", \"md\", \"lg\", \"xl\"];\n\n/** Units and patterns that identify a concrete CSS length value. */\nconst CSS_UNIT_RE =\n  /^-?[\\d.]+(%|px|em|rem|ex|ch|ic|lh|rlh|vw|vh|vmin|vmax|svw|svh|dvw|dvh|cqw|cqh|cqi|cqb|fr|cm|mm|in|pt|pc|Q)$/;\n\nconst SPACE_TOKEN_MAP: Record<string, string> = {\n  \"1\": \"var(--ak-space-1)\",\n  \"2\": \"var(--ak-space-2)\",\n  \"3\": \"var(--ak-space-3)\",\n  \"4\": \"var(--ak-space-4)\",\n  \"5\": \"var(--ak-space-5)\",\n  \"6\": \"var(--ak-space-6)\",\n  \"7\": \"var(--ak-space-7)\",\n  \"8\": \"var(--ak-space-8)\",\n  \"9\": \"var(--ak-space-9)\",\n  xs: \"var(--ak-space-xs)\",\n  sm: \"var(--ak-space-sm)\",\n  md: \"var(--ak-space-md)\",\n  lg: \"var(--ak-space-lg)\",\n  xl: \"var(--ak-space-xl)\",\n  \"2xl\": \"var(--ak-space-2xl)\",\n  \"3xl\": \"var(--ak-space-3xl)\",\n};\n\nconst CONTAINER_SIZE_MAP: Record<string, string> = {\n  \"1\": \"var(--ak-container-1)\",\n  \"2\": \"var(--ak-container-2)\",\n  \"3\": \"var(--ak-container-3)\",\n  \"4\": \"var(--ak-container-4)\",\n  sm: \"var(--ak-container-1)\",\n  md: \"var(--ak-container-2)\",\n  lg: \"var(--ak-container-3)\",\n  xl: \"var(--ak-container-4)\",\n  fluid: \"100%\",\n};\n\nconst SECTION_SIZE_MAP: Record<string, string> = {\n  \"1\": \"var(--ak-section-1)\",\n  \"2\": \"var(--ak-section-2)\",\n  \"3\": \"var(--ak-section-3)\",\n  \"4\": \"var(--ak-section-4)\",\n};\n\n/**\n * Returns true when `value` is a concrete CSS length/size that can be serialized\n * into a CSS declaration without token translation.\n */\nexport function isCssLength(value: unknown): value is string {\n  if (typeof value !== \"string\") return false;\n  const v = value.trim();\n  if (v === \"0\") return true;\n  if (CSS_UNIT_RE.test(v)) return true;\n  // CSS functions: calc(), min(), max(), clamp(), fit-content(), env(), var()\n  if (/^[a-z][a-z-]*\\(/.test(v)) return true;\n  return false;\n}\n\nexport function isResponsiveValue<T>(\n  value: ResponsiveValue<T> | undefined,\n): value is Partial<Record<LayoutBreakpoint, T>> {\n  if (!value || typeof value !== \"object\" || Array.isArray(value)) return false;\n  return BREAKPOINTS.some((breakpoint) => breakpoint in value);\n}\n\nexport function normalizeResponsiveValue<T>(\n  value: ResponsiveValue<T> | undefined,\n): Partial<Record<LayoutBreakpoint, T>> | undefined {\n  if (value === undefined) return undefined;\n  if (isResponsiveValue(value)) return value;\n  return { initial: value };\n}\n\nexport function serializeResponsiveValue<T>(\n  value: ResponsiveValue<T> | undefined,\n): string | undefined {\n  const normalized = normalizeResponsiveValue(value);\n  if (!normalized) return undefined;\n\n  return BREAKPOINTS.map((breakpoint) => {\n    const breakpointValue = normalized[breakpoint];\n    if (breakpointValue === undefined) return \"\";\n    return `${breakpoint}:${String(breakpointValue)}`;\n  })\n    .filter(Boolean)\n    .join(\"|\");\n}\n\nexport function serializeResponsiveValueIf<T>(\n  value: ResponsiveValue<T> | undefined,\n  predicate: (value: T) => boolean,\n): string | undefined {\n  const normalized = normalizeResponsiveValue(value);\n  if (!normalized) return undefined;\n\n  for (const breakpoint of BREAKPOINTS) {\n    const breakpointValue = normalized[breakpoint];\n    if (breakpointValue === undefined) continue;\n    if (!predicate(breakpointValue)) return undefined;\n  }\n\n  return serializeResponsiveValue(value);\n}\n\nexport function serializeValueIf<T>(\n  value: T | undefined,\n  predicate: (value: T) => boolean,\n): string | undefined {\n  if (value === undefined || !predicate(value)) return undefined;\n  return String(value);\n}\n\nexport function setResponsiveStyleVar<T>(\n  styles: Record<string, string | number>,\n  variable: string,\n  value: ResponsiveValue<T> | undefined,\n  resolve: (value: T) => string | number | undefined = (input) =>\n    input as string | number | undefined,\n) {\n  const normalized = normalizeResponsiveValue(value);\n  if (!normalized) return;\n\n  for (const breakpoint of BREAKPOINTS) {\n    const breakpointValue = normalized[breakpoint];\n    if (breakpointValue === undefined) continue;\n    const resolved = resolve(breakpointValue);\n    if (resolved === undefined || resolved === null || resolved === \"\") continue;\n    styles[`--ak-${variable}-${breakpoint}`] = resolved;\n  }\n}\n\nexport function resolveSpaceValue(value: string | number): string | number {\n  if (typeof value === \"number\") return String(value);\n  const trimmed = value.trim();\n  return SPACE_TOKEN_MAP[trimmed] ?? trimmed;\n}\n\nexport function resolveContainerSizeValue(value: string): string {\n  const trimmed = value.trim();\n  return CONTAINER_SIZE_MAP[trimmed] ?? trimmed;\n}\n\nexport function resolveSectionSizeValue(value: string): string {\n  const trimmed = value.trim();\n  return SECTION_SIZE_MAP[trimmed] ?? trimmed;\n}\n\nexport function resolveJustifyValue(value: string): string {\n  const trimmed = value.trim();\n  if (trimmed === \"between\") return \"space-between\";\n  if (trimmed === \"start\") return \"flex-start\";\n  if (trimmed === \"end\") return \"flex-end\";\n  return trimmed;\n}\n\nexport function resolveAlignValue(value: string): string {\n  const trimmed = value.trim();\n  if (trimmed === \"start\") return \"flex-start\";\n  if (trimmed === \"end\") return \"flex-end\";\n  return trimmed;\n}\n\nexport function resolveInlineAlignValue(value: \"left\" | \"center\" | \"right\"): {\n  marginLeft?: string;\n  marginRight?: string;\n} {\n  if (value === \"left\") return { marginLeft: \"0\", marginRight: \"auto\" };\n  if (value === \"right\") return { marginLeft: \"auto\", marginRight: \"0\" };\n  return { marginLeft: \"auto\", marginRight: \"auto\" };\n}\n\n/**\n * Merges a record of computed layout declarations with a user-supplied style\n * value. The user's declarations take precedence for conflicting keys.\n */\nexport function mergeLayoutStyles(\n  layout: Record<string, string | number>,\n  user: unknown,\n): string | undefined {\n  const merged: Record<string, unknown> = { ...layout };\n\n  if (user !== null && user !== undefined && typeof user === \"object\") {\n    Object.assign(merged, user as Record<string, unknown>);\n  }\n\n  const mergedString = serializeCssDeclarations(merged);\n\n  if (typeof user === \"string\" && user.trim()) {\n    return mergedString ? `${mergedString};${user.trim()}` : user.trim();\n  }\n\n  return mergedString || undefined;\n}\n"],"mappings":"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"}