@almadar/shell-web 0.0.0-stage → 1.0.0

package/dist/design-classes/index.d.ts

@@ -0,0 +1,165 @@
+import { OrbitalSchema } from '@almadar/core';
+
+/**
+ * The Tailwind class vocabulary a visual editor may write onto a pattern's
+ * `className`. Declared once here: editors pick from it, and
+ * `@almadar/ui/tailwind-preset` safelists exactly it, so every class an
+ * editor writes is compiled into the builder and every generated app.
+ *
+ * Color and radius classes are backed by theme tokens (`bg-primary` reads
+ * `--color-primary`), so an edit can target the class (this element) or the
+ * token (every element using it). Spacing steps 0–12 read `--space-N` theme
+ * tokens (not linear: the base theme's `--space-4` is 14px); the rest are
+ * Tailwind's rem steps. What a step renders at is therefore a theme question —
+ * callers that convert pixels pass the rendered size of each step.
+ */
+
+/** Color tokens the preset maps to `--color-<token>` (`tailwind-preset.cjs` `colors`). */
+declare const DESIGN_COLOR_TOKENS: readonly ["primary", "primary-foreground", "primary-hover", "secondary", "secondary-foreground", "secondary-hover", "muted", "muted-foreground", "accent", "accent-foreground", "background", "foreground", "card", "card-foreground", "surface", "border", "input", "ring", "error", "error-foreground", "success", "success-foreground", "warning", "warning-foreground", "info", "info-foreground"];
+type DesignColorToken = (typeof DESIGN_COLOR_TOKENS)[number];
+/** Utilities that take a color token. */
+declare const DESIGN_COLOR_UTILITIES: readonly ["bg", "text", "border"];
+type DesignColorUtility = (typeof DESIGN_COLOR_UTILITIES)[number];
+/** Radius tokens the preset maps to `--radius-<token>` (`rounded-<token>`). */
+declare const DESIGN_RADIUS_TOKENS: readonly ["none", "sm", "md", "lg", "xl", "full"];
+type DesignRadiusToken = (typeof DESIGN_RADIUS_TOKENS)[number];
+/** Tailwind's spacing scale (1 step = 0.25rem = 4px at a 16px root). */
+declare const DESIGN_SPACING_SCALE: readonly [0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 5, 6, 7, 8, 9, 10, 11, 12, 14, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 72, 80, 96];
+type DesignSpacingStep = (typeof DESIGN_SPACING_SCALE)[number];
+/** Utilities that take a spacing step. */
+declare const DESIGN_SPACING_UTILITIES: readonly ["w", "h", "min-w", "max-w", "min-h", "max-h", "p", "px", "py", "pt", "pr", "pb", "pl", "m", "mx", "my", "gap"];
+/** Figma's non-fixed sizing modes per axis: Hug contents (`fit`) and Fill container (`full`). */
+declare const DESIGN_SIZING_CLASSES: readonly ["w-fit", "w-full", "h-fit", "h-full"];
+type DesignSpacingUtility = (typeof DESIGN_SPACING_UTILITIES)[number];
+/** Figma auto layout: direction, the 3×3 alignment grid (main axis `justify`, cross axis `items`), space-between and wrap. */
+declare const DESIGN_LAYOUT_CLASSES: readonly ["flex-row", "flex-col", "items-start", "items-center", "items-end", "justify-start", "justify-center", "justify-end", "justify-between", "flex-wrap"];
+/** Absolute position: the element, its positioning context, and the Center constraint's class pairs. Pixel and % offsets are arbitrary values. */
+declare const DESIGN_POSITION_CLASSES: readonly ["absolute", "relative", "left-0", "right-0", "top-0", "bottom-0", "left-1/2", "-translate-x-1/2", "top-1/2", "-translate-y-1/2"];
+/** Pixels per spacing step at the default 16px root. */
+declare const DESIGN_SPACING_STEP_PX = 4;
+declare function colorClass(utility: DesignColorUtility, token: DesignColorToken): string;
+declare function radiusClass(token: DesignRadiusToken): string;
+declare function spacingClass(utility: DesignSpacingUtility, step: DesignSpacingStep): string;
+/** What a spacing step renders at, in px. */
+type SpacingStepPx = (step: DesignSpacingStep) => number;
+/** Tailwind's default: 0.25rem per step at a 16px root. */
+declare const defaultSpacingStepPx: SpacingStepPx;
+/** Steps the preset maps to `--space-N` theme tokens (`tailwind-preset.cjs` `spacing`). */
+declare const DESIGN_SPACING_TOKEN_STEPS: readonly DesignSpacingStep[];
+/** The theme token a spacing step reads, or null for a plain rem step. */
+declare function spacingTokenOf(step: DesignSpacingStep): `--space-${number}` | null;
+/**
+ * The spacing step whose rendered size is nearest `px`. On a tie a
+ * token-backed step wins (it follows the theme), then the smaller step.
+ */
+declare function snapToSpacingStep(px: number, pxOf?: SpacingStepPx): DesignSpacingStep;
+/** Every class in the vocabulary — the preset's safelist. */
+declare function allDesignClasses(): string[];
+/** Figma's per-axis resizing: Fixed (a spacing step), Hug contents, or Fill container. */
+type DesignSizing = {
+    mode: 'fixed';
+    step: DesignSpacingStep;
+} | {
+    mode: 'hug';
+} | {
+    mode: 'fill';
+};
+type DesignAxis = 'w' | 'h';
+declare function sizingOf(classes: readonly string[], axis: DesignAxis): DesignSizing;
+/** Replace this axis's base size class with the one for `sizing`; everything else stays. */
+declare function withSizing(classes: readonly string[], axis: DesignAxis, sizing: DesignSizing): string[];
+type DesignSizeLimit = 'min' | 'max';
+/** The spacing step a `min-*` / `max-*` class sets on this axis, or null (a custom `[…]` value is not a step). */
+declare function sizeLimitOf(classes: readonly string[], axis: DesignAxis, limit: DesignSizeLimit): DesignSpacingStep | null;
+/** Replace this axis's base `min-*` / `max-*` class (a step or a custom value) with `step`, or clear it with null. */
+declare function withSizeLimit(classes: readonly string[], axis: DesignAxis, limit: DesignSizeLimit, step: DesignSpacingStep | null): string[];
+/** Gap between children and padding per side, in spacing steps. */
+interface DesignSpacing {
+    gap: DesignSpacingStep;
+    top: DesignSpacingStep;
+    right: DesignSpacingStep;
+    bottom: DesignSpacingStep;
+    left: DesignSpacingStep;
+}
+/** Current spacing; a side-specific class beats an axis class, which beats `p-*`. */
+declare function spacingOf(classes: readonly string[]): DesignSpacing;
+/** Apply `change` and write the smallest class set for the result (`p-*`, else `px-* py-*`, else each side). */
+declare function withSpacing(classes: readonly string[], change: Partial<DesignSpacing>): string[];
+/** One grid position on an axis. */
+type DesignAlignment = 'start' | 'center' | 'end';
+type DesignDirection = 'horizontal' | 'vertical';
+/** Main-axis distribution: a grid position, or Figma's space-between. */
+type DesignJustify = DesignAlignment | 'between';
+/** Auto layout as the classes set it; null where no base class decides it (the element's own default applies). */
+interface DesignLayout {
+    direction: DesignDirection | null;
+    /** Cross axis (`items-*`). */
+    align: DesignAlignment | null;
+    /** Main axis (`justify-*`). */
+    justify: DesignJustify | null;
+    wrap: boolean;
+}
+declare function layoutOf(classes: readonly string[]): DesignLayout;
+/** Replace the base class for each changed part of the layout; everything else (variants included) stays. */
+declare function withLayout(classes: readonly string[], change: Partial<{
+    direction: DesignDirection;
+    align: DesignAlignment;
+    justify: DesignJustify;
+    wrap: boolean;
+}>): string[];
+/**
+ * How an absolute element keeps its place when its parent resizes, per axis
+ * (Figma constraints): pinned to the start (left/top) or end (right/bottom)
+ * side, to both (stretches), centred, or scaled (offsets in % of the parent).
+ */
+type DesignConstraint = 'start' | 'end' | 'both' | 'center' | 'scale';
+/** One axis: its constraint and the start/end offsets it uses — px, or % for `scale`; for `center`, `start` is the px offset from the centre. */
+interface DesignAxisPosition {
+    constraint: DesignConstraint;
+    start: number;
+    end: number;
+}
+interface DesignPosition {
+    absolute: boolean;
+    x: DesignAxisPosition;
+    y: DesignAxisPosition;
+}
+declare function positionOf(classes: readonly string[]): DesignPosition;
+/** Replace every base position class with the ones `position` needs; not absolute → none at all. */
+declare function withPosition(classes: readonly string[], position: DesignPosition): string[];
+/** Make an element the positioning context for its absolute children (`relative`, unless it is already positioned). */
+declare function withPositioningContext(classes: readonly string[]): string[];
+/** The theme token a class reads, when it reads one. */
+type DesignClassToken = {
+    group: 'colors';
+    key: DesignColorToken;
+} | {
+    group: 'radii';
+    key: DesignRadiusToken;
+} | {
+    group: 'spacing';
+    key: string;
+};
+/**
+ * The theme token behind one class (`hover:bg-primary` → colors `primary`,
+ * `p-4` → spacing `4`, i.e. `--space-4`), or null when the class is outside
+ * the vocabulary or not token-backed.
+ */
+declare function tokenOfDesignClass(className: string): DesignClassToken | null;
+/**
+ * An arbitrary-value class — one class (no spaces) ending in a `[…]` value,
+ * variants allowed: `w-[243px]`, `hover:bg-[#e14b2a]`. The designer's custom
+ * field accepts only these; scale and token classes have their own editors.
+ */
+declare function isArbitraryClass(className: string): boolean;
+/**
+ * Every arbitrary-value class in the schema's literal `className`s, once,
+ * sorted. Tailwind only compiles classes it saw at build time, so a runtime
+ * that renders a schema compiles these on demand (the scale and token classes
+ * are safelisted by the preset). Bound (expression) classNames are skipped.
+ * `_metadata` and `ledger` are provenance and identity records, never render trees.
+ */
+declare function arbitraryClassesOf(schema: OrbitalSchema): string[];
+
+export { DESIGN_COLOR_TOKENS, DESIGN_COLOR_UTILITIES, DESIGN_LAYOUT_CLASSES, DESIGN_POSITION_CLASSES, DESIGN_RADIUS_TOKENS, DESIGN_SIZING_CLASSES, DESIGN_SPACING_SCALE, DESIGN_SPACING_STEP_PX, DESIGN_SPACING_TOKEN_STEPS, DESIGN_SPACING_UTILITIES, allDesignClasses, arbitraryClassesOf, colorClass, defaultSpacingStepPx, isArbitraryClass, layoutOf, positionOf, radiusClass, sizeLimitOf, sizingOf, snapToSpacingStep, spacingClass, spacingOf, spacingTokenOf, tokenOfDesignClass, withLayout, withPosition, withPositioningContext, withSizeLimit, withSizing, withSpacing };
+export type { DesignAlignment, DesignAxis, DesignAxisPosition, DesignClassToken, DesignColorToken, DesignColorUtility, DesignConstraint, DesignDirection, DesignJustify, DesignLayout, DesignPosition, DesignRadiusToken, DesignSizeLimit, DesignSizing, DesignSpacing, DesignSpacingStep, DesignSpacingUtility, SpacingStepPx };

package/dist/design-classes/index.js

@@ -0,0 +1,399 @@
+import { toPayloadValue } from '@almadar/core';
+
+// src/lib/design-classes.ts
+var DESIGN_COLOR_TOKENS = [
+  "primary",
+  "primary-foreground",
+  "primary-hover",
+  "secondary",
+  "secondary-foreground",
+  "secondary-hover",
+  "muted",
+  "muted-foreground",
+  "accent",
+  "accent-foreground",
+  "background",
+  "foreground",
+  "card",
+  "card-foreground",
+  "surface",
+  "border",
+  "input",
+  "ring",
+  "error",
+  "error-foreground",
+  "success",
+  "success-foreground",
+  "warning",
+  "warning-foreground",
+  "info",
+  "info-foreground"
+];
+var DESIGN_COLOR_UTILITIES = ["bg", "text", "border"];
+var DESIGN_RADIUS_TOKENS = ["none", "sm", "md", "lg", "xl", "full"];
+var DESIGN_SPACING_SCALE = [
+  0,
+  0.5,
+  1,
+  1.5,
+  2,
+  2.5,
+  3,
+  3.5,
+  4,
+  5,
+  6,
+  7,
+  8,
+  9,
+  10,
+  11,
+  12,
+  14,
+  16,
+  20,
+  24,
+  28,
+  32,
+  36,
+  40,
+  44,
+  48,
+  52,
+  56,
+  60,
+  64,
+  72,
+  80,
+  96
+];
+var DESIGN_SPACING_UTILITIES = [
+  "w",
+  "h",
+  "min-w",
+  "max-w",
+  "min-h",
+  "max-h",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "m",
+  "mx",
+  "my",
+  "gap"
+];
+var DESIGN_SIZING_CLASSES = ["w-fit", "w-full", "h-fit", "h-full"];
+var DESIGN_LAYOUT_CLASSES = [
+  "flex-row",
+  "flex-col",
+  "items-start",
+  "items-center",
+  "items-end",
+  "justify-start",
+  "justify-center",
+  "justify-end",
+  "justify-between",
+  "flex-wrap"
+];
+var DESIGN_POSITION_CLASSES = [
+  "absolute",
+  "relative",
+  "left-0",
+  "right-0",
+  "top-0",
+  "bottom-0",
+  "left-1/2",
+  "-translate-x-1/2",
+  "top-1/2",
+  "-translate-y-1/2"
+];
+var DESIGN_SPACING_STEP_PX = 4;
+function colorClass(utility, token) {
+  return `${utility}-${token}`;
+}
+function radiusClass(token) {
+  return `rounded-${token}`;
+}
+function spacingClass(utility, step) {
+  return `${utility}-${step}`;
+}
+var defaultSpacingStepPx = (step) => step * DESIGN_SPACING_STEP_PX;
+var DESIGN_SPACING_TOKEN_STEPS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+function spacingTokenOf(step) {
+  return DESIGN_SPACING_TOKEN_STEPS.includes(step) ? `--space-${step}` : null;
+}
+function snapToSpacingStep(px, pxOf = defaultSpacingStepPx) {
+  const target = Math.max(0, px);
+  let best = DESIGN_SPACING_SCALE[0];
+  for (const step of DESIGN_SPACING_SCALE) {
+    const d = Math.abs(pxOf(step) - target);
+    const bestD = Math.abs(pxOf(best) - target);
+    if (d < bestD || d === bestD && spacingTokenOf(step) !== null && spacingTokenOf(best) === null) best = step;
+  }
+  return best;
+}
+function allDesignClasses() {
+  return [
+    ...DESIGN_COLOR_UTILITIES.flatMap((u) => DESIGN_COLOR_TOKENS.map((t) => colorClass(u, t))),
+    ...DESIGN_RADIUS_TOKENS.map(radiusClass),
+    ...DESIGN_SPACING_UTILITIES.flatMap((u) => DESIGN_SPACING_SCALE.map((s) => spacingClass(u, s))),
+    ...DESIGN_SIZING_CLASSES,
+    ...DESIGN_LAYOUT_CLASSES,
+    ...DESIGN_POSITION_CLASSES
+  ];
+}
+var SPACING_STEP_BY_TEXT = new Map(
+  DESIGN_SPACING_SCALE.map((step) => [String(step), step])
+);
+function stepOf(className, utility) {
+  if (!className.startsWith(`${utility}-`)) return void 0;
+  return SPACING_STEP_BY_TEXT.get(className.slice(utility.length + 1));
+}
+function isAxisSizeClass(className, axis) {
+  return className.startsWith(`${axis}-`);
+}
+function sizingOf(classes, axis) {
+  for (const c of classes) {
+    if (c === `${axis}-full`) return { mode: "fill" };
+    if (c === `${axis}-fit`) return { mode: "hug" };
+    const step = stepOf(c, axis);
+    if (step !== void 0) return { mode: "fixed", step };
+  }
+  return { mode: "hug" };
+}
+function withSizing(classes, axis, sizing) {
+  const kept = classes.filter((c) => !isAxisSizeClass(c, axis));
+  const next = sizing.mode === "fixed" ? `${axis}-${sizing.step}` : sizing.mode === "hug" ? `${axis}-fit` : `${axis}-full`;
+  return [...kept, next];
+}
+function sizeLimitOf(classes, axis, limit) {
+  for (const c of classes) {
+    const step = stepOf(c, `${limit}-${axis}`);
+    if (step !== void 0) return step;
+  }
+  return null;
+}
+function withSizeLimit(classes, axis, limit, step) {
+  const kept = classes.filter((c) => !c.startsWith(`${limit}-${axis}-`));
+  return step === null ? kept : [...kept, `${limit}-${axis}-${step}`];
+}
+var PADDING_UTILITIES = ["p", "px", "py", "pt", "pr", "pb", "pl"];
+function isSpacingClass(className) {
+  return stepOf(className, "gap") !== void 0 || PADDING_UTILITIES.some((u) => stepOf(className, u) !== void 0);
+}
+function spacingOf(classes) {
+  const find = (utility) => {
+    for (const c of classes) {
+      const step = stepOf(c, utility);
+      if (step !== void 0) return step;
+    }
+    return void 0;
+  };
+  const all = find("p") ?? 0;
+  const x = find("px") ?? all;
+  const y = find("py") ?? all;
+  return {
+    gap: find("gap") ?? 0,
+    top: find("pt") ?? y,
+    right: find("pr") ?? x,
+    bottom: find("pb") ?? y,
+    left: find("pl") ?? x
+  };
+}
+function withSpacing(classes, change) {
+  const next = { ...spacingOf(classes), ...change };
+  const kept = classes.filter((c) => !isSpacingClass(c));
+  const out = [...kept];
+  if (next.gap !== 0) out.push(`gap-${next.gap}`);
+  const { top, right, bottom, left } = next;
+  if (top === right && right === bottom && bottom === left) {
+    if (top !== 0) out.push(`p-${top}`);
+  } else if (top === bottom && left === right) {
+    out.push(`px-${left}`, `py-${top}`);
+  } else {
+    out.push(`pt-${top}`, `pr-${right}`, `pb-${bottom}`, `pl-${left}`);
+  }
+  return out;
+}
+var DIRECTION_CLASSES = ["flex-row", "flex-row-reverse", "flex-col", "flex-col-reverse"];
+var ALIGNMENTS = ["start", "center", "end"];
+var JUSTIFIES = [...ALIGNMENTS, "between"];
+var WRAP_CLASSES = ["flex-wrap", "flex-nowrap", "flex-wrap-reverse"];
+function firstOf(classes, utility, values) {
+  for (const c of classes) {
+    for (const v of values) if (c === `${utility}-${v}`) return v;
+  }
+  return null;
+}
+function layoutOf(classes) {
+  const direction = classes.find((c) => DIRECTION_CLASSES.includes(c));
+  return {
+    direction: direction === void 0 ? null : direction.startsWith("flex-row") ? "horizontal" : "vertical",
+    align: firstOf(classes, "items", ALIGNMENTS),
+    justify: firstOf(classes, "justify", JUSTIFIES),
+    wrap: classes.includes("flex-wrap")
+  };
+}
+function withLayout(classes, change) {
+  let next = [...classes];
+  if (change.direction) {
+    next = next.filter((c) => !DIRECTION_CLASSES.includes(c));
+    next.push(change.direction === "horizontal" ? "flex-row" : "flex-col");
+  }
+  if (change.align) {
+    next = next.filter((c) => !c.startsWith("items-"));
+    next.push(`items-${change.align}`);
+  }
+  if (change.justify) {
+    next = next.filter((c) => !c.startsWith("justify-"));
+    next.push(`justify-${change.justify}`);
+  }
+  if (change.wrap !== void 0) {
+    next = next.filter((c) => !WRAP_CLASSES.includes(c));
+    if (change.wrap) next.push("flex-wrap");
+  }
+  return next;
+}
+var AXIS_SIDES = { x: ["left", "right"], y: ["top", "bottom"] };
+var CENTER_CLASSES = { x: ["left-1/2", "-translate-x-1/2"], y: ["top-1/2", "-translate-y-1/2"] };
+function offsetOf(classes, side) {
+  for (const c of classes) {
+    if (!c.startsWith(`${side}-`)) continue;
+    const step = stepOf(c, side);
+    if (step !== void 0) return { value: defaultSpacingStepPx(step), unit: "px" };
+    const m = /^\[(-?\d+(?:\.\d+)?)(px|%)\]$/.exec(c.slice(side.length + 1));
+    if (m) return { value: Number(m[1]), unit: m[2] === "%" ? "%" : "px" };
+  }
+  return null;
+}
+function centerOffsetOf(classes, side) {
+  for (const c of classes) {
+    if (c === `${side}-1/2`) return 0;
+    const m = new RegExp(`^${side}-\\[calc\\(50%([+-])(\\d+(?:\\.\\d+)?)px\\)\\]$`).exec(c);
+    if (m) return (m[1] === "-" ? -1 : 1) * Number(m[2]);
+  }
+  return null;
+}
+function axisPositionOf(classes, axis) {
+  const [startSide, endSide] = AXIS_SIDES[axis];
+  const center = centerOffsetOf(classes, startSide);
+  if (center !== null && classes.includes(CENTER_CLASSES[axis][1])) return { constraint: "center", start: center, end: 0 };
+  const start = offsetOf(classes, startSide);
+  const end = offsetOf(classes, endSide);
+  if (start?.unit === "%" || end?.unit === "%") {
+    return { constraint: "scale", start: start?.value ?? 0, end: end?.value ?? 0 };
+  }
+  if (start && end) return { constraint: "both", start: start.value, end: end.value };
+  if (end) return { constraint: "end", start: 0, end: end.value };
+  return { constraint: "start", start: start?.value ?? 0, end: 0 };
+}
+function positionOf(classes) {
+  return {
+    absolute: classes.includes("absolute"),
+    x: axisPositionOf(classes, "x"),
+    y: axisPositionOf(classes, "y")
+  };
+}
+function isPositionClass(className) {
+  if (className === "absolute") return true;
+  if (CENTER_CLASSES.x.some((c) => c === className) || CENTER_CLASSES.y.some((c) => c === className)) return true;
+  return [...AXIS_SIDES.x, ...AXIS_SIDES.y].some((side) => className.startsWith(`${side}-`));
+}
+function offsetClass(side, value, unit) {
+  const rounded = unit === "%" ? Math.round(value * 10) / 10 : Math.round(value);
+  return rounded === 0 ? `${side}-0` : `${side}-[${rounded}${unit}]`;
+}
+function axisClasses(axis, p) {
+  const [startSide, endSide] = AXIS_SIDES[axis];
+  switch (p.constraint) {
+    case "center": {
+      const offset = Math.round(p.start);
+      const pin = offset === 0 ? CENTER_CLASSES[axis][0] : `${startSide}-[calc(50%${offset < 0 ? "-" : "+"}${Math.abs(offset)}px)]`;
+      return [pin, CENTER_CLASSES[axis][1]];
+    }
+    case "end":
+      return [offsetClass(endSide, p.end, "px")];
+    case "both":
+      return [offsetClass(startSide, p.start, "px"), offsetClass(endSide, p.end, "px")];
+    case "scale":
+      return [offsetClass(startSide, p.start, "%"), offsetClass(endSide, p.end, "%")];
+    case "start":
+      return [offsetClass(startSide, p.start, "px")];
+  }
+}
+function withPosition(classes, position) {
+  const kept = classes.filter((c) => !isPositionClass(c));
+  if (!position.absolute) return kept;
+  return [...kept, "absolute", ...axisClasses("x", position.x), ...axisClasses("y", position.y)];
+}
+function withPositioningContext(classes) {
+  return classes.includes("relative") || classes.includes("absolute") ? [...classes] : [...classes, "relative"];
+}
+var COLOR_TOKEN_SET = new Set(DESIGN_COLOR_TOKENS);
+var RADIUS_TOKEN_SET = new Set(DESIGN_RADIUS_TOKENS);
+function isColorToken(value) {
+  return COLOR_TOKEN_SET.has(value);
+}
+function isRadiusToken(value) {
+  return RADIUS_TOKEN_SET.has(value);
+}
+function tokenOfDesignClass(className) {
+  const base = className.slice(className.lastIndexOf(":") + 1);
+  if (base.startsWith("rounded-")) {
+    const key = base.slice("rounded-".length);
+    return isRadiusToken(key) ? { group: "radii", key } : null;
+  }
+  for (const utility of DESIGN_COLOR_UTILITIES) {
+    const prefix = `${utility}-`;
+    if (!base.startsWith(prefix)) continue;
+    const key = base.slice(prefix.length);
+    if (isColorToken(key)) return { group: "colors", key };
+  }
+  for (const utility of DESIGN_SPACING_UTILITIES) {
+    const step = stepOf(base, utility);
+    if (step !== void 0 && spacingTokenOf(step) !== null) return { group: "spacing", key: String(step) };
+  }
+  return null;
+}
+function isArbitraryClass(className) {
+  return /^[a-z0-9:@/-]*-\[[^\]\s]+\]$/i.test(className);
+}
+function collectClasses(value, found) {
+  if (Array.isArray(value)) {
+    for (const item of value) collectClasses(item, found);
+    return;
+  }
+  if (value === null || typeof value !== "object") return;
+  for (const [key, child] of Object.entries(value)) {
+    if (key === "className" && typeof child === "string") {
+      for (const cls of child.split(/\s+/)) if (cls && isArbitraryClass(cls)) found.add(cls);
+    } else {
+      collectClasses(child, found);
+    }
+  }
+}
+function classesOfPart(part) {
+  const found = /* @__PURE__ */ new Set();
+  collectClasses(toPayloadValue(part), found);
+  return [...found];
+}
+var classesByOrbital = /* @__PURE__ */ new WeakMap();
+function arbitraryClassesOf(schema) {
+  const { orbitals, _metadata: _provenance, ledger: _identities, ...rest } = schema;
+  const found = new Set(classesOfPart(rest));
+  for (const orbital of orbitals ?? []) {
+    let classes = classesByOrbital.get(orbital);
+    if (!classes) {
+      classes = classesOfPart(orbital);
+      classesByOrbital.set(orbital, classes);
+    }
+    for (const cls of classes) found.add(cls);
+  }
+  return [...found].sort();
+}
+
+export { DESIGN_COLOR_TOKENS, DESIGN_COLOR_UTILITIES, DESIGN_LAYOUT_CLASSES, DESIGN_POSITION_CLASSES, DESIGN_RADIUS_TOKENS, DESIGN_SIZING_CLASSES, DESIGN_SPACING_SCALE, DESIGN_SPACING_STEP_PX, DESIGN_SPACING_TOKEN_STEPS, DESIGN_SPACING_UTILITIES, allDesignClasses, arbitraryClassesOf, colorClass, defaultSpacingStepPx, isArbitraryClass, layoutOf, positionOf, radiusClass, sizeLimitOf, sizingOf, snapToSpacingStep, spacingClass, spacingOf, spacingTokenOf, tokenOfDesignClass, withLayout, withPosition, withPositioningContext, withSizeLimit, withSizing, withSpacing };

package/dist/emojiItems-QGSNAABW.js

@@ -0,0 +1,20 @@
+import './chunk-G7DCAZ22.js';
+import emojilib from 'emojilib';
+
+var { lib, ordered } = emojilib;
+var EMOJI_ITEMS = (() => {
+  const items = [];
+  for (const name of ordered) {
+    const entry = lib[name];
+    if (entry === void 0 || entry.char === null || entry.char === "") continue;
+    items.push({
+      id: entry.char,
+      label: name.replace(/_/g, " "),
+      category: entry.category.replace(/_/g, " "),
+      keywords: entry.keywords
+    });
+  }
+  return items;
+})();
+
+export { EMOJI_ITEMS };