@hex-core/components 1.3.1 → 1.4.0

package/dist/sidebar.js

@@ -0,0 +1,201 @@
+"use client";
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import * as React from 'react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var SidebarContext = React.createContext(null);
+function useSidebar() {
+  const ctx = React.useContext(SidebarContext);
+  if (!ctx) {
+    throw new Error("useSidebar must be used inside <SidebarProvider>");
+  }
+  return ctx;
+}
+function SidebarProvider({
+  open: openProp,
+  defaultOpen = true,
+  onOpenChange,
+  children,
+  className
+}) {
+  const [internalOpen, setInternalOpen] = React.useState(defaultOpen);
+  const isControlled = openProp !== void 0;
+  const open = isControlled ? openProp : internalOpen;
+  const setOpen = React.useCallback(
+    (next) => {
+      if (!isControlled) {
+        setInternalOpen(next);
+      }
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const value = React.useMemo(() => ({ open, setOpen }), [open, setOpen]);
+  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-state": open ? "open" : "closed",
+      className: cn("flex min-h-screen w-full", className),
+      children
+    }
+  ) });
+}
+SidebarProvider.displayName = "SidebarProvider";
+var sidebarVariants = cva(
+  cn(
+    "flex h-full shrink-0 flex-col border-foreground/[0.08] border-r bg-background text-foreground",
+    "transition-[width] duration-[var(--duration-normal,200ms)] ease-out"
+  ),
+  {
+    variants: {
+      side: {
+        left: "border-r",
+        right: "order-last border-l border-r-0"
+      },
+      state: {
+        open: "w-64",
+        closed: "w-0 overflow-hidden border-r-0"
+      }
+    },
+    defaultVariants: {
+      side: "left",
+      state: "open"
+    }
+  }
+);
+var Sidebar = React.forwardRef(
+  ({ className, side = "left", children, ...props }, ref) => {
+    const { open } = useSidebar();
+    return /* @__PURE__ */ jsx(
+      "aside",
+      {
+        ref,
+        "data-state": open ? "open" : "closed",
+        "aria-hidden": !open || void 0,
+        inert: !open,
+        className: cn(sidebarVariants({ side, state: open ? "open" : "closed" }), className),
+        ...props,
+        children
+      }
+    );
+  }
+);
+Sidebar.displayName = "Sidebar";
+var SidebarTrigger = React.forwardRef(
+  ({ asChild, className, onClick, "aria-label": ariaLabel, ...props }, ref) => {
+    const { open, setOpen } = useSidebar();
+    const Comp = asChild ? Slot : "button";
+    const resolvedAriaLabel = ariaLabel ?? (asChild ? void 0 : open ? "Collapse sidebar" : "Expand sidebar");
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        type: asChild ? void 0 : "button",
+        "aria-label": resolvedAriaLabel,
+        "aria-expanded": open,
+        onClick: (event) => {
+          onClick?.(event);
+          if (!event.defaultPrevented) {
+            setOpen(!open);
+          }
+        },
+        className: cn(
+          "inline-flex h-[var(--control-height-sm,2.25rem)] w-[var(--control-height-sm,2.25rem)] items-center justify-center rounded-md text-muted-foreground",
+          "transition-all duration-[var(--duration-normal,200ms)] ease-out hover:bg-accent hover:text-accent-foreground",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          className
+        ),
+        ...props,
+        children: asChild ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(
+            "svg",
+            {
+              xmlns: "http://www.w3.org/2000/svg",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              className: "h-4 w-4",
+              "aria-hidden": "true",
+              children: [
+                /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
+                /* @__PURE__ */ jsx("line", { x1: "9", y1: "3", x2: "9", y2: "21" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle sidebar" })
+        ] })
+      }
+    );
+  }
+);
+SidebarTrigger.displayName = "SidebarTrigger";
+var SidebarHeader = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex items-center gap-[var(--gap-sm,0.5rem)] border-b border-b-foreground/[0.08] p-[var(--space-4,1rem)]", className),
+      ...props
+    }
+  )
+);
+SidebarHeader.displayName = "SidebarHeader";
+var SidebarContent = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex-1 overflow-auto p-[var(--space-2,0.5rem)]", className),
+      ...props
+    }
+  )
+);
+SidebarContent.displayName = "SidebarContent";
+var SidebarFooter = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn("mt-auto border-t border-t-foreground/[0.08] p-[var(--space-4,1rem)]", className),
+      ...props
+    }
+  )
+);
+SidebarFooter.displayName = "SidebarFooter";
+var SidebarItem = React.forwardRef(
+  ({ asChild, active, className, ...props }, ref) => {
+    const Comp = asChild ? Slot : "button";
+    return /* @__PURE__ */ jsx(
+      Comp,
+      {
+        ref,
+        type: asChild ? void 0 : "button",
+        "aria-current": active ? "page" : void 0,
+        "data-active": active ? "" : void 0,
+        className: cn(
+          "inline-flex w-full items-center gap-[var(--gap-sm,0.5rem)] rounded-md px-[var(--space-3,0.75rem)] py-[var(--space-2,0.5rem)] text-sm font-medium",
+          "transition-all duration-[var(--duration-normal,200ms)] ease-out",
+          "hover:bg-accent hover:text-accent-foreground",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+          "data-[active]:bg-accent data-[active]:text-accent-foreground",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+SidebarItem.displayName = "SidebarItem";
+
+export { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarItem, SidebarProvider, SidebarTrigger, useSidebar };
+//# sourceMappingURL=sidebar.js.map
+//# sourceMappingURL=sidebar.js.map

package/dist/sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/components/sidebar/sidebar.tsx"],"names":[],"mappings":"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","file":"sidebar.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\ninterface SidebarContextValue {\n\t/** Current open/collapsed state. */\n\topen: boolean;\n\t/** Toggle or set open state. */\n\tsetOpen: (open: boolean) => void;\n}\n\nconst SidebarContext = React.createContext<SidebarContextValue | null>(null);\n\n/**\n * Reads sidebar state from context. Throws if used outside SidebarProvider.\n * @returns `{ open, setOpen }` bound to the nearest SidebarProvider.\n */\nfunction useSidebar(): SidebarContextValue {\n\tconst ctx = React.useContext(SidebarContext);\n\tif (!ctx) {\n\t\tthrow new Error(\"useSidebar must be used inside <SidebarProvider>\");\n\t}\n\treturn ctx;\n}\n\ninterface SidebarProviderProps {\n\t/** Controlled open state. */\n\topen?: boolean;\n\t/** Uncontrolled initial open state (defaults to true). */\n\tdefaultOpen?: boolean;\n\t/** Callback fired when open state changes. */\n\tonOpenChange?: (open: boolean) => void;\n\t/** Children — typically a Sidebar + app content sibling. */\n\tchildren: React.ReactNode;\n\t/** Extra class names on the provider wrapper. */\n\tclassName?: string;\n}\n\n/**\n * Hosts sidebar state. Wrap your app shell (Sidebar + main content) in this.\n * @returns A flex container with a SidebarContext provider.\n */\nfunction SidebarProvider({\n\topen: openProp,\n\tdefaultOpen = true,\n\tonOpenChange,\n\tchildren,\n\tclassName,\n}: SidebarProviderProps) {\n\tconst [internalOpen, setInternalOpen] = React.useState(defaultOpen);\n\tconst isControlled = openProp !== undefined;\n\tconst open = isControlled ? openProp : internalOpen;\n\n\tconst setOpen = React.useCallback(\n\t\t(next: boolean) => {\n\t\t\tif (!isControlled) {\n\t\t\t\tsetInternalOpen(next);\n\t\t\t}\n\t\t\tonOpenChange?.(next);\n\t\t},\n\t\t[isControlled, onOpenChange],\n\t);\n\n\tconst value = React.useMemo(() => ({ open, setOpen }), [open, setOpen]);\n\n\treturn (\n\t\t<SidebarContext.Provider value={value}>\n\t\t\t<div\n\t\t\t\tdata-state={open ? \"open\" : \"closed\"}\n\t\t\t\tclassName={cn(\"flex min-h-screen w-full\", className)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</SidebarContext.Provider>\n\t);\n}\nSidebarProvider.displayName = \"SidebarProvider\";\n\nconst sidebarVariants = cva(\n\tcn(\n\t\t\"flex h-full shrink-0 flex-col border-foreground/[0.08] border-r bg-background text-foreground\",\n\t\t\"transition-[width] duration-[var(--duration-normal,200ms)] ease-out\",\n\t),\n\t{\n\t\tvariants: {\n\t\t\tside: {\n\t\t\t\tleft: \"border-r\",\n\t\t\t\tright: \"order-last border-l border-r-0\",\n\t\t\t},\n\t\t\tstate: {\n\t\t\t\topen: \"w-64\",\n\t\t\t\tclosed: \"w-0 overflow-hidden border-r-0\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tside: \"left\",\n\t\t\tstate: \"open\",\n\t\t},\n\t},\n);\n\ninterface SidebarProps\n\textends React.HTMLAttributes<HTMLElement>,\n\t\tPick<VariantProps<typeof sidebarVariants>, \"side\"> {}\n\n/**\n * App-shell sidebar. Reads open state from SidebarProvider and animates width.\n * @returns An aside element that expands/collapses.\n */\nconst Sidebar = React.forwardRef<HTMLElement, SidebarProps>(\n\t({ className, side = \"left\", children, ...props }, ref) => {\n\t\tconst { open } = useSidebar();\n\t\treturn (\n\t\t\t<aside\n\t\t\t\tref={ref}\n\t\t\t\tdata-state={open ? \"open\" : \"closed\"}\n\t\t\t\taria-hidden={!open || undefined}\n\t\t\t\tinert={!open}\n\t\t\t\tclassName={cn(sidebarVariants({ side, state: open ? \"open\" : \"closed\" }), className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</aside>\n\t\t);\n\t},\n);\nSidebar.displayName = \"Sidebar\";\n\ninterface SidebarTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n\t/** Render as the child element (Button, etc.) using Radix Slot. */\n\tasChild?: boolean;\n}\n\n/**\n * Toggles the sidebar open/closed. Renders a button by default; use asChild to style.\n * @returns A button that flips SidebarProvider state.\n */\nconst SidebarTrigger = React.forwardRef<HTMLButtonElement, SidebarTriggerProps>(\n\t({ asChild, className, onClick, \"aria-label\": ariaLabel, ...props }, ref) => {\n\t\tconst { open, setOpen } = useSidebar();\n\t\tconst Comp = asChild ? Slot : \"button\";\n\t\t// When asChild, prefer the consumer's aria-label (or visible text) — don't force ours.\n\t\tconst resolvedAriaLabel =\n\t\t\tariaLabel ?? (asChild ? undefined : open ? \"Collapse sidebar\" : \"Expand sidebar\");\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\ttype={asChild ? undefined : \"button\"}\n\t\t\t\taria-label={resolvedAriaLabel}\n\t\t\t\taria-expanded={open}\n\t\t\t\tonClick={(event: React.MouseEvent<HTMLElement>) => {\n\t\t\t\t\tonClick?.(event as React.MouseEvent<HTMLButtonElement>);\n\t\t\t\t\tif (!event.defaultPrevented) {\n\t\t\t\t\t\tsetOpen(!open);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"inline-flex h-[var(--control-height-sm,2.25rem)] w-[var(--control-height-sm,2.25rem)] items-center justify-center rounded-md text-muted-foreground\",\n\t\t\t\t\t\"transition-all duration-[var(--duration-normal,200ms)] ease-out hover:bg-accent hover:text-accent-foreground\",\n\t\t\t\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{asChild ? null : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<svg\n\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t\t\t\t\tclassName=\"h-4 w-4\"\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" />\n\t\t\t\t\t\t\t<line x1=\"9\" y1=\"3\" x2=\"9\" y2=\"21\" />\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t<span className=\"sr-only\">Toggle sidebar</span>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</Comp>\n\t\t);\n\t},\n);\nSidebarTrigger.displayName = \"SidebarTrigger\";\n\n/** Header container at the top of the sidebar. */\nconst SidebarHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"flex items-center gap-[var(--gap-sm,0.5rem)] border-b border-b-foreground/[0.08] p-[var(--space-4,1rem)]\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nSidebarHeader.displayName = \"SidebarHeader\";\n\n/** Scrollable main area of the sidebar. */\nconst SidebarContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"flex-1 overflow-auto p-[var(--space-2,0.5rem)]\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nSidebarContent.displayName = \"SidebarContent\";\n\n/** Footer container at the bottom of the sidebar. */\nconst SidebarFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n\t({ className, ...props }, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"mt-auto border-t border-t-foreground/[0.08] p-[var(--space-4,1rem)]\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nSidebarFooter.displayName = \"SidebarFooter\";\n\ninterface SidebarItemProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n\t/** Render as the child element (next/link, etc.) via Slot. */\n\tasChild?: boolean;\n\t/** Mark as the current/selected item. */\n\tactive?: boolean;\n}\n\n/**\n * Single selectable row inside SidebarContent. Compose icon + label in children.\n * @returns An accessible button (or Slot) styled as a sidebar row.\n */\nconst SidebarItem = React.forwardRef<HTMLButtonElement, SidebarItemProps>(\n\t({ asChild, active, className, ...props }, ref) => {\n\t\tconst Comp = asChild ? Slot : \"button\";\n\t\treturn (\n\t\t\t<Comp\n\t\t\t\tref={ref}\n\t\t\t\ttype={asChild ? undefined : \"button\"}\n\t\t\t\taria-current={active ? \"page\" : undefined}\n\t\t\t\tdata-active={active ? \"\" : undefined}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"inline-flex w-full items-center gap-[var(--gap-sm,0.5rem)] rounded-md px-[var(--space-3,0.75rem)] py-[var(--space-2,0.5rem)] text-sm font-medium\",\n\t\t\t\t\t\"transition-all duration-[var(--duration-normal,200ms)] ease-out\",\n\t\t\t\t\t\"hover:bg-accent hover:text-accent-foreground\",\n\t\t\t\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n\t\t\t\t\t\"data-[active]:bg-accent data-[active]:text-accent-foreground\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t);\n\t},\n);\nSidebarItem.displayName = \"SidebarItem\";\n\nexport {\n\tSidebarProvider,\n\tSidebar,\n\tSidebarTrigger,\n\tSidebarHeader,\n\tSidebarContent,\n\tSidebarFooter,\n\tSidebarItem,\n\tuseSidebar,\n};\n"]}

package/dist/skeleton.d.ts

@@ -0,0 +1,11 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+/**
+ * A placeholder shimmer element shown while content is loading.
+ * Pair with explicit width/height via className.
+ * @returns A div with pulsing muted background
+ */
+declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
+
+export { Skeleton };

package/dist/skeleton.js

@@ -0,0 +1,21 @@
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+// src/lib/utils.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("animate-pulse rounded-md border border-foreground/[0.06] bg-muted", className),
+      ...props
+    }
+  );
+}
+
+export { Skeleton };
+//# sourceMappingURL=skeleton.js.map
+//# sourceMappingURL=skeleton.js.map

package/dist/skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/primitives/skeleton/skeleton.tsx"],"names":[],"mappings":";;;;;AAQO,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACFA,SAAS,QAAA,CAAS,EAAE,SAAA,EAAW,GAAG,OAAM,EAAyC;AAChF,EAAA,uBACC,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,EAAA,CAAG,mEAAA,EAAqE,SAAS,CAAA;AAAA,MAC3F,GAAG;AAAA;AAAA,GACL;AAEF","file":"skeleton.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","import * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\n/**\n * A placeholder shimmer element shown while content is loading.\n * Pair with explicit width/height via className.\n * @returns A div with pulsing muted background\n */\nfunction Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"animate-pulse rounded-md border border-foreground/[0.06] bg-muted\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport { Skeleton };\n"]}

package/dist/slider.d.ts

@@ -0,0 +1,20 @@
+import * as SliderPrimitive from '@radix-ui/react-slider';
+import * as React from 'react';
+
+interface SliderProps extends React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root> {
+    /**
+     * Per-thumb accessible labels. When the slider has multiple thumbs, pass
+     * one entry per thumb (e.g. ["Minimum", "Maximum"]). For a single-thumb
+     * slider, the Root's `aria-label` / `aria-labelledby` is mirrored onto
+     * the thumb automatically — pass `thumbLabels` only when those defaults
+     * are insufficient.
+     */
+    thumbLabels?: string[];
+}
+/**
+ * A range input with one or more draggable thumbs.
+ * Built on Radix UI Slider with keyboard controls (arrows, Home, End, PageUp/Down).
+ */
+declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLSpanElement>>;
+
+export { Slider, type SliderProps };

package/dist/slider.js

@@ -0,0 +1,55 @@
+"use client";
+import * as SliderPrimitive from '@radix-ui/react-slider';
+import * as React from 'react';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var Slider = React.forwardRef(({ className, thumbLabels, ...props }, ref) => {
+  const values = props.value ?? props.defaultValue ?? [0];
+  const rootLabel = props["aria-label"];
+  const rootLabelledBy = props["aria-labelledby"];
+  if (typeof process !== "undefined" && process.env?.NODE_ENV !== "production" && thumbLabels && thumbLabels.length !== values.length) {
+    console.warn(
+      `Slider: thumbLabels.length (${thumbLabels.length}) does not match value.length (${values.length}). Missing labels fall back to indexed names; extra labels are ignored.`
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    SliderPrimitive.Root,
+    {
+      ref,
+      className: cn("relative flex w-full touch-none select-none items-center", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx(SliderPrimitive.Track, { className: "relative h-2 w-full grow overflow-hidden rounded-full border border-foreground/[0.08] bg-secondary", children: /* @__PURE__ */ jsx(SliderPrimitive.Range, { className: "absolute h-full bg-primary" }) }),
+        values.map((_, i) => {
+          const explicit = thumbLabels?.[i];
+          const fallback = values.length === 1 ? rootLabel : rootLabel ? `${rootLabel} (${i + 1} of ${values.length})` : void 0;
+          return /* @__PURE__ */ jsx(
+            SliderPrimitive.Thumb,
+            {
+              "aria-label": explicit ?? fallback,
+              "aria-labelledby": explicit || fallback ? void 0 : rootLabelledBy,
+              className: cn(
+                "block h-5 w-5 rounded-full border-2 border-primary bg-background",
+                "transition-all duration-[var(--duration-normal,200ms)] ease-out shadow-md",
+                "hover:shadow-lg hover:scale-110",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+                "disabled:pointer-events-none disabled:opacity-50"
+              )
+            },
+            i
+          );
+        })
+      ]
+    }
+  );
+});
+Slider.displayName = "Slider";
+
+export { Slider };
+//# sourceMappingURL=slider.js.map
+//# sourceMappingURL=slider.js.map

package/dist/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/primitives/slider/slider.tsx"],"names":[],"mappings":";;;;;;AAQO,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACiBA,IAAM,MAAA,GAAe,iBAGnB,CAAC,EAAE,WAAW,WAAA,EAAa,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAChD,EAAA,MAAM,SAAS,KAAA,CAAM,KAAA,IAAS,KAAA,CAAM,YAAA,IAAgB,CAAC,CAAC,CAAA;AACtD,EAAA,MAAM,SAAA,GAAY,MAAM,YAAY,CAAA;AACpC,EAAA,MAAM,cAAA,GAAiB,MAAM,iBAAiB,CAAA;AAE9C,EAAA,IACC,OAAO,OAAA,KAAY,WAAA,IACnB,OAAA,CAAQ,GAAA,EAAK,QAAA,KAAa,YAAA,IAC1B,WAAA,IACA,WAAA,CAAY,MAAA,KAAW,MAAA,CAAO,MAAA,EAC7B;AACD,IAAA,OAAA,CAAQ,IAAA;AAAA,MACP,CAAA,4BAAA,EAA+B,WAAA,CAAY,MAAM,CAAA,+BAAA,EAAkC,OAAO,MAAM,CAAA,uEAAA;AAAA,KAEjG;AAAA,EACD;AAEA,EAAA,uBACC,IAAA;AAAA,IAAiB,eAAA,CAAA,IAAA;AAAA,IAAhB;AAAA,MACA,GAAA;AAAA,MACA,SAAA,EAAW,EAAA,CAAG,0DAAA,EAA4D,SAAS,CAAA;AAAA,MAClF,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAiB,eAAA,CAAA,KAAA,EAAhB,EAAsB,SAAA,EAAU,oGAAA,EAChC,8BAAiB,eAAA,CAAA,KAAA,EAAhB,EAAsB,SAAA,EAAU,4BAAA,EAA6B,CAAA,EAC/D,CAAA;AAAA,QACC,MAAA,CAAO,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,KAAM;AACrB,UAAA,MAAM,QAAA,GAAW,cAAc,CAAC,CAAA;AAChC,UAAA,MAAM,QAAA,GACL,MAAA,CAAO,MAAA,KAAW,CAAA,GACf,YACA,SAAA,GACC,CAAA,EAAG,SAAS,CAAA,EAAA,EAAK,CAAA,GAAI,CAAC,CAAA,IAAA,EAAO,MAAA,CAAO,MAAM,CAAA,CAAA,CAAA,GAC1C,MAAA;AACL,UAAA,uBACC,GAAA;AAAA,YAAiB,eAAA,CAAA,KAAA;AAAA,YAAhB;AAAA,cAGA,cAAY,QAAA,IAAY,QAAA;AAAA,cACxB,iBAAA,EACC,QAAA,IAAY,QAAA,GAAW,MAAA,GAAY,cAAA;AAAA,cAEpC,SAAA,EAAW,EAAA;AAAA,gBACV,kEAAA;AAAA,gBACA,2EAAA;AAAA,gBACA,iCAAA;AAAA,gBACA,qGAAA;AAAA,gBACA;AAAA;AACD,aAAA;AAAA,YAXK;AAAA,WAYN;AAAA,QAEF,CAAC;AAAA;AAAA;AAAA,GACF;AAEF,CAAC;AACD,MAAA,CAAO,WAAA,GAAc,QAAA","file":"slider.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport * as SliderPrimitive from \"@radix-ui/react-slider\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\n// Local ambient — components run in browsers where bundlers (Next, Vite, tsup)\n// replace `process.env.NODE_ENV` at build time. Avoids pulling @types/node into\n// the components package just for one dev-mode warning.\ndeclare const process: { env?: { NODE_ENV?: string } } | undefined;\n\ninterface SliderProps\n\textends React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root> {\n\t/**\n\t * Per-thumb accessible labels. When the slider has multiple thumbs, pass\n\t * one entry per thumb (e.g. [\"Minimum\", \"Maximum\"]). For a single-thumb\n\t * slider, the Root's `aria-label` / `aria-labelledby` is mirrored onto\n\t * the thumb automatically — pass `thumbLabels` only when those defaults\n\t * are insufficient.\n\t */\n\tthumbLabels?: string[];\n}\n\n/**\n * A range input with one or more draggable thumbs.\n * Built on Radix UI Slider with keyboard controls (arrows, Home, End, PageUp/Down).\n */\nconst Slider = React.forwardRef<\n\tReact.ComponentRef<typeof SliderPrimitive.Root>,\n\tSliderProps\n>(({ className, thumbLabels, ...props }, ref) => {\n\tconst values = props.value ?? props.defaultValue ?? [0];\n\tconst rootLabel = props[\"aria-label\"];\n\tconst rootLabelledBy = props[\"aria-labelledby\"];\n\n\tif (\n\t\ttypeof process !== \"undefined\" &&\n\t\tprocess.env?.NODE_ENV !== \"production\" &&\n\t\tthumbLabels &&\n\t\tthumbLabels.length !== values.length\n\t) {\n\t\tconsole.warn(\n\t\t\t`Slider: thumbLabels.length (${thumbLabels.length}) does not match value.length (${values.length}). ` +\n\t\t\t\t`Missing labels fall back to indexed names; extra labels are ignored.`,\n\t\t);\n\t}\n\n\treturn (\n\t\t<SliderPrimitive.Root\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"relative flex w-full touch-none select-none items-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SliderPrimitive.Track className=\"relative h-2 w-full grow overflow-hidden rounded-full border border-foreground/[0.08] bg-secondary\">\n\t\t\t\t<SliderPrimitive.Range className=\"absolute h-full bg-primary\" />\n\t\t\t</SliderPrimitive.Track>\n\t\t\t{values.map((_, i) => {\n\t\t\t\tconst explicit = thumbLabels?.[i];\n\t\t\t\tconst fallback =\n\t\t\t\t\tvalues.length === 1\n\t\t\t\t\t\t? rootLabel\n\t\t\t\t\t\t: rootLabel\n\t\t\t\t\t\t\t? `${rootLabel} (${i + 1} of ${values.length})`\n\t\t\t\t\t\t\t: undefined;\n\t\t\t\treturn (\n\t\t\t\t\t<SliderPrimitive.Thumb\n\t\t\t\t\t\t// biome-ignore lint/suspicious/noArrayIndexKey: Radix renders one thumb per value by index\n\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\taria-label={explicit ?? fallback}\n\t\t\t\t\t\taria-labelledby={\n\t\t\t\t\t\t\texplicit || fallback ? undefined : rootLabelledBy\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"block h-5 w-5 rounded-full border-2 border-primary bg-background\",\n\t\t\t\t\t\t\t\"transition-all duration-[var(--duration-normal,200ms)] ease-out shadow-md\",\n\t\t\t\t\t\t\t\"hover:shadow-lg hover:scale-110\",\n\t\t\t\t\t\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\",\n\t\t\t\t\t\t\t\"disabled:pointer-events-none disabled:opacity-50\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</SliderPrimitive.Root>\n\t);\n});\nSlider.displayName = \"Slider\";\n\nexport type { SliderProps };\n\nexport { Slider };\n"]}

package/dist/sonner.d.ts

@@ -0,0 +1,14 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Toaster as Toaster$1 } from 'sonner';
+export { toast } from 'sonner';
+
+type ToasterProps = React.ComponentProps<typeof Toaster$1>;
+/**
+ * The global toast container. Render once in your app root.
+ * Re-export of Sonner's Toaster styled to use Hex UI theme tokens.
+ * @param props - Sonner Toaster props (position, richColors, etc.)
+ * @returns A styled portal container for toast notifications
+ */
+declare function Toaster({ ...props }: ToasterProps): react_jsx_runtime.JSX.Element;
+
+export { Toaster };

package/dist/sonner.js

@@ -0,0 +1,27 @@
+"use client";
+import { Toaster as Toaster$1 } from 'sonner';
+export { toast } from 'sonner';
+import { jsx } from 'react/jsx-runtime';
+
+function Toaster({ ...props }) {
+  return /* @__PURE__ */ jsx(
+    Toaster$1,
+    {
+      theme: "system",
+      className: "toaster group",
+      toastOptions: {
+        classNames: {
+          toast: "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+          description: "group-[.toast]:text-muted-foreground",
+          actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+          cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground"
+        }
+      },
+      ...props
+    }
+  );
+}
+
+export { Toaster };
+//# sourceMappingURL=sonner.js.map
+//# sourceMappingURL=sonner.js.map

package/dist/sonner.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/sonner/sonner.tsx"],"names":["SonnerToaster"],"mappings":";;;;AAYA,SAAS,OAAA,CAAQ,EAAE,GAAG,KAAA,EAAM,EAAiB;AAC5C,EAAA,uBACC,GAAA;AAAA,IAACA,SAAA;AAAA,IAAA;AAAA,MACA,KAAA,EAAM,QAAA;AAAA,MACN,SAAA,EAAU,eAAA;AAAA,MACV,YAAA,EAAc;AAAA,QACb,UAAA,EAAY;AAAA,UACX,KAAA,EACC,uIAAA;AAAA,UACD,WAAA,EAAa,sCAAA;AAAA,UACb,YAAA,EACC,kEAAA;AAAA,UACD,YAAA,EACC;AAAA;AACF,OACD;AAAA,MACC,GAAG;AAAA;AAAA,GACL;AAEF","file":"sonner.js","sourcesContent":["\"use client\";\n\nimport { Toaster as SonnerToaster, toast } from \"sonner\";\n\ntype ToasterProps = React.ComponentProps<typeof SonnerToaster>;\n\n/**\n * The global toast container. Render once in your app root.\n * Re-export of Sonner's Toaster styled to use Hex UI theme tokens.\n * @param props - Sonner Toaster props (position, richColors, etc.)\n * @returns A styled portal container for toast notifications\n */\nfunction Toaster({ ...props }: ToasterProps) {\n\treturn (\n\t\t<SonnerToaster\n\t\t\ttheme=\"system\"\n\t\t\tclassName=\"toaster group\"\n\t\t\ttoastOptions={{\n\t\t\t\tclassNames: {\n\t\t\t\t\ttoast:\n\t\t\t\t\t\t\"group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg\",\n\t\t\t\t\tdescription: \"group-[.toast]:text-muted-foreground\",\n\t\t\t\t\tactionButton:\n\t\t\t\t\t\t\"group-[.toast]:bg-primary group-[.toast]:text-primary-foreground\",\n\t\t\t\t\tcancelButton:\n\t\t\t\t\t\t\"group-[.toast]:bg-muted group-[.toast]:text-muted-foreground\",\n\t\t\t\t},\n\t\t\t}}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport { Toaster, toast };\n"]}

package/dist/spacer.d.ts

@@ -0,0 +1,38 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * CVA variants for Spacer — declarative whitespace.
+ * `size` sets `--spacer-size` to a `--space-*` token (with inline fallback);
+ * `axis` consumes that var via the bracket form used everywhere else in the
+ * package, so the height or width can never collapse to zero if the size
+ * variant is dropped.
+ */
+declare const spacerVariants: (props?: ({
+    size?: "sm" | "lg" | "md" | "xl" | "xs" | null | undefined;
+    axis?: "both" | "horizontal" | "vertical" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/** Props for the Spacer component. */
+interface SpacerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children">, VariantProps<typeof spacerVariants> {
+}
+/**
+ * A declarative whitespace block. Use when you want to insert space between two
+ * siblings without relying on margin or gap (e.g. inside a flex container that
+ * doesn't own the spacing decision).
+ *
+ * Renders an empty `<div>` with `aria-hidden` since it has no semantic content.
+ *
+ * @param props - Spacer props including `size` and `axis` variant keys.
+ * @returns An empty div with the requested dimension.
+ * @example
+ * ```tsx
+ * <h1>Title</h1>
+ * <Spacer size="lg" />
+ * <p>Body</p>
+ * ```
+ */
+declare function Spacer({ className, size, axis, ...props }: SpacerProps): react_jsx_runtime.JSX.Element;
+
+export { Spacer, type SpacerProps, spacerVariants };

package/dist/spacer.js

@@ -0,0 +1,43 @@
+import { cva } from 'class-variance-authority';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+// src/primitives/spacer/spacer.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+var spacerVariants = cva("shrink-0", {
+  variants: {
+    size: {
+      xs: "[--spacer-size:var(--space-1,0.25rem)]",
+      sm: "[--spacer-size:var(--space-2,0.5rem)]",
+      md: "[--spacer-size:var(--space-4,1rem)]",
+      lg: "[--spacer-size:var(--space-8,2rem)]",
+      xl: "[--spacer-size:var(--space-16,4rem)]"
+    },
+    axis: {
+      vertical: "h-[var(--spacer-size)] w-0",
+      horizontal: "w-[var(--spacer-size)] h-0",
+      both: "h-[var(--spacer-size)] w-[var(--spacer-size)]"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    axis: "vertical"
+  }
+});
+function Spacer({ className, size, axis, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn(spacerVariants({ size, axis }), className),
+      ...props
+    }
+  );
+}
+
+export { Spacer, spacerVariants };
+//# sourceMappingURL=spacer.js.map
+//# sourceMappingURL=spacer.js.map

package/dist/spacer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/primitives/spacer/spacer.tsx"],"names":[],"mappings":";;;;;;AAQO,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACCA,IAAM,cAAA,GAAiB,IAAI,UAAA,EAAY;AAAA,EACtC,QAAA,EAAU;AAAA,IACT,IAAA,EAAM;AAAA,MACL,EAAA,EAAI,wCAAA;AAAA,MACJ,EAAA,EAAI,uCAAA;AAAA,MACJ,EAAA,EAAI,qCAAA;AAAA,MACJ,EAAA,EAAI,qCAAA;AAAA,MACJ,EAAA,EAAI;AAAA,KACL;AAAA,IACA,IAAA,EAAM;AAAA,MACL,QAAA,EAAU,4BAAA;AAAA,MACV,UAAA,EAAY,4BAAA;AAAA,MACZ,IAAA,EAAM;AAAA;AACP,GACD;AAAA,EACA,eAAA,EAAiB;AAAA,IAChB,IAAA,EAAM,IAAA;AAAA,IACN,IAAA,EAAM;AAAA;AAER,CAAC;AAuBD,SAAS,OAAO,EAAE,SAAA,EAAW,MAAM,IAAA,EAAM,GAAG,OAAM,EAAgB;AACjE,EAAA,uBACC,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,aAAA,EAAY,MAAA;AAAA,MACZ,SAAA,EAAW,GAAG,cAAA,CAAe,EAAE,MAAM,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MACtD,GAAG;AAAA;AAAA,GACL;AAEF","file":"spacer.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","import { type VariantProps, cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\n\n/**\n * CVA variants for Spacer — declarative whitespace.\n * `size` sets `--spacer-size` to a `--space-*` token (with inline fallback);\n * `axis` consumes that var via the bracket form used everywhere else in the\n * package, so the height or width can never collapse to zero if the size\n * variant is dropped.\n */\nconst spacerVariants = cva(\"shrink-0\", {\n\tvariants: {\n\t\tsize: {\n\t\t\txs: \"[--spacer-size:var(--space-1,0.25rem)]\",\n\t\t\tsm: \"[--spacer-size:var(--space-2,0.5rem)]\",\n\t\t\tmd: \"[--spacer-size:var(--space-4,1rem)]\",\n\t\t\tlg: \"[--spacer-size:var(--space-8,2rem)]\",\n\t\t\txl: \"[--spacer-size:var(--space-16,4rem)]\",\n\t\t},\n\t\taxis: {\n\t\t\tvertical: \"h-[var(--spacer-size)] w-0\",\n\t\t\thorizontal: \"w-[var(--spacer-size)] h-0\",\n\t\t\tboth: \"h-[var(--spacer-size)] w-[var(--spacer-size)]\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t\taxis: \"vertical\",\n\t},\n});\n\n/** Props for the Spacer component. */\nexport interface SpacerProps\n\textends Omit<React.HTMLAttributes<HTMLDivElement>, \"children\">,\n\t\tVariantProps<typeof spacerVariants> {}\n\n/**\n * A declarative whitespace block. Use when you want to insert space between two\n * siblings without relying on margin or gap (e.g. inside a flex container that\n * doesn't own the spacing decision).\n *\n * Renders an empty `<div>` with `aria-hidden` since it has no semantic content.\n *\n * @param props - Spacer props including `size` and `axis` variant keys.\n * @returns An empty div with the requested dimension.\n * @example\n * ```tsx\n * <h1>Title</h1>\n * <Spacer size=\"lg\" />\n * <p>Body</p>\n * ```\n */\nfunction Spacer({ className, size, axis, ...props }: SpacerProps) {\n\treturn (\n\t\t<div\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName={cn(spacerVariants({ size, axis }), className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport { Spacer, spacerVariants };\n"]}

package/dist/stack.d.ts

@@ -0,0 +1,34 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+/**
+ * CVA variants for Stack — vertical flex flow. `gap`, `align`, and `justify`
+ * pull from the shared layout-variant maps so any change to the gap scale
+ * propagates to Cluster and Grid simultaneously.
+ */
+declare const stackVariants: (props?: ({
+    gap?: "sm" | "lg" | "md" | "xl" | "xs" | null | undefined;
+    align?: "center" | "start" | "end" | "stretch" | null | undefined;
+    justify?: "center" | "start" | "end" | "between" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/** Props for the Stack component. */
+interface StackProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof stackVariants> {
+}
+/**
+ * Vertical flex flow with token-bound gap. Children stack top-to-bottom.
+ * @param props - Stack props including `gap`, `align`, and `justify` variant keys.
+ * @returns A flex column with consistent vertical spacing.
+ * @example
+ * ```tsx
+ * <Stack gap="lg">
+ *   <h2>Section title</h2>
+ *   <p>Paragraph one.</p>
+ *   <p>Paragraph two.</p>
+ * </Stack>
+ * ```
+ */
+declare function Stack({ className, gap, align, justify, ...props }: StackProps): react_jsx_runtime.JSX.Element;
+
+export { Stack, type StackProps, stackVariants };

package/dist/stack.js

@@ -0,0 +1,49 @@
+import { cva } from 'class-variance-authority';
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { jsx } from 'react/jsx-runtime';
+
+// src/primitives/stack/stack.tsx
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/primitives/_shared/layout-variants.ts
+var gapVariants = {
+  xs: "gap-[var(--gap-xs,0.25rem)]",
+  sm: "gap-[var(--gap-sm,0.5rem)]",
+  md: "gap-[var(--gap-md,1rem)]",
+  lg: "gap-[var(--gap-lg,1.5rem)]",
+  xl: "gap-[var(--gap-xl,2rem)]"
+};
+var justifyVariants = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between"
+};
+var flexAlignVariants = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+};
+var stackVariants = cva("flex flex-col", {
+  variants: {
+    gap: gapVariants,
+    align: flexAlignVariants,
+    justify: justifyVariants
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "stretch",
+    justify: "start"
+  }
+});
+function Stack({ className, gap, align, justify, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn(stackVariants({ gap, align, justify }), className), ...props });
+}
+
+export { Stack, stackVariants };
+//# sourceMappingURL=stack.js.map
+//# sourceMappingURL=stack.js.map

package/dist/stack.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/utils.ts","../src/primitives/_shared/layout-variants.ts","../src/primitives/stack/stack.tsx"],"names":[],"mappings":";;;;;;AAQO,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;;;ACCO,IAAM,WAAA,GAAc;AAAA,EAC1B,EAAA,EAAI,6BAAA;AAAA,EACJ,EAAA,EAAI,4BAAA;AAAA,EACJ,EAAA,EAAI,0BAAA;AAAA,EACJ,EAAA,EAAI,4BAAA;AAAA,EACJ,EAAA,EAAI;AACL,CAAA;AAGO,IAAM,eAAA,GAAkB;AAAA,EAC9B,KAAA,EAAO,eAAA;AAAA,EACP,MAAA,EAAQ,gBAAA;AAAA,EACR,GAAA,EAAK,aAAA;AAAA,EACL,OAAA,EAAS;AACV,CAAA;AAGO,IAAM,iBAAA,GAAoB;AAAA,EAChC,KAAA,EAAO,aAAA;AAAA,EACP,MAAA,EAAQ,cAAA;AAAA,EACR,GAAA,EAAK,WAAA;AAAA,EACL,OAAA,EAAS;AACV,CAAA;ACnBA,IAAM,aAAA,GAAgB,IAAI,eAAA,EAAiB;AAAA,EAC1C,QAAA,EAAU;AAAA,IACT,GAAA,EAAK,WAAA;AAAA,IACL,KAAA,EAAO,iBAAA;AAAA,IACP,OAAA,EAAS;AAAA,GACV;AAAA,EACA,eAAA,EAAiB;AAAA,IAChB,GAAA,EAAK,IAAA;AAAA,IACL,KAAA,EAAO,SAAA;AAAA,IACP,OAAA,EAAS;AAAA;AAEX,CAAC;AAoBD,SAAS,KAAA,CAAM,EAAE,SAAA,EAAW,GAAA,EAAK,OAAO,OAAA,EAAS,GAAG,OAAM,EAAe;AACxE,EAAA,uBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,cAAc,EAAE,GAAA,EAAK,KAAA,EAAO,OAAA,EAAS,CAAA,EAAG,SAAS,CAAA,EAAI,GAAG,KAAA,EAAO,CAAA;AAEpF","file":"stack.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * Merge class names with Tailwind CSS conflict resolution.\n * @param inputs - Class values (strings, arrays, objects) to merge\n * @returns A single merged class string with Tailwind conflicts resolved\n */\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","/**\n * Single source of truth for layout-primitive CVA variant maps.\n *\n * Stack, Cluster, Grid all share `gap` and `justify` value sets; align values\n * differ slightly (`stretch` for column-like flows, `baseline` for row flows).\n * Centralizing the maps here keeps token names and Tailwind classes in one\n * file — when the gap scale changes (renamed token, new step, etc.), all\n * three components update together.\n */\n\n/** Gap scale bound to `--gap-*` tokens. Used by Stack, Cluster, Grid. */\nexport const gapVariants = {\n\txs: \"gap-[var(--gap-xs,0.25rem)]\",\n\tsm: \"gap-[var(--gap-sm,0.5rem)]\",\n\tmd: \"gap-[var(--gap-md,1rem)]\",\n\tlg: \"gap-[var(--gap-lg,1.5rem)]\",\n\txl: \"gap-[var(--gap-xl,2rem)]\",\n} as const;\n\n/** `justify-content` values shared by Stack and Cluster. */\nexport const justifyVariants = {\n\tstart: \"justify-start\",\n\tcenter: \"justify-center\",\n\tend: \"justify-end\",\n\tbetween: \"justify-between\",\n} as const;\n\n/** Cross-axis `align-items` values for vertical/grid flows (column-like). */\nexport const flexAlignVariants = {\n\tstart: \"items-start\",\n\tcenter: \"items-center\",\n\tend: \"items-end\",\n\tstretch: \"items-stretch\",\n} as const;\n\n/** Cross-axis `align-items` values for horizontal flows. Includes `baseline`. */\nexport const clusterAlignVariants = {\n\tstart: \"items-start\",\n\tcenter: \"items-center\",\n\tend: \"items-end\",\n\tstretch: \"items-stretch\",\n\tbaseline: \"items-baseline\",\n} as const;\n","import { type VariantProps, cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../../lib/utils.js\";\nimport {\n\tflexAlignVariants,\n\tgapVariants,\n\tjustifyVariants,\n} from \"../_shared/layout-variants.js\";\n\n/**\n * CVA variants for Stack — vertical flex flow. `gap`, `align`, and `justify`\n * pull from the shared layout-variant maps so any change to the gap scale\n * propagates to Cluster and Grid simultaneously.\n */\nconst stackVariants = cva(\"flex flex-col\", {\n\tvariants: {\n\t\tgap: gapVariants,\n\t\talign: flexAlignVariants,\n\t\tjustify: justifyVariants,\n\t},\n\tdefaultVariants: {\n\t\tgap: \"md\",\n\t\talign: \"stretch\",\n\t\tjustify: \"start\",\n\t},\n});\n\n/** Props for the Stack component. */\nexport interface StackProps\n\textends React.HTMLAttributes<HTMLDivElement>,\n\t\tVariantProps<typeof stackVariants> {}\n\n/**\n * Vertical flex flow with token-bound gap. Children stack top-to-bottom.\n * @param props - Stack props including `gap`, `align`, and `justify` variant keys.\n * @returns A flex column with consistent vertical spacing.\n * @example\n * ```tsx\n * <Stack gap=\"lg\">\n *   <h2>Section title</h2>\n *   <p>Paragraph one.</p>\n *   <p>Paragraph two.</p>\n * </Stack>\n * ```\n */\nfunction Stack({ className, gap, align, justify, ...props }: StackProps) {\n\treturn (\n\t\t<div className={cn(stackVariants({ gap, align, justify }), className)} {...props} />\n\t);\n}\n\nexport { Stack, stackVariants };\n"]}