@epilot/zenith-react 0.2.0-next.3 → 0.2.0-next.4

package/dist/components/breadcrumb/breadcrumb.js

@@ -1,11 +1,15 @@
-import { jsx as o, jsxs as w } from "react/jsx-runtime";
-import * as l from "react";
-import { mergeClasses as p, SLOT_ATTR as s, shorthands as n } from "@epilot/zenith-runtime/v1";
-import { makeZenithStyles as L } from "../../styles/make-styles.js";
-import { boxModel as h } from "../../styles/host-reset.js";
-import { grayDefault as y, fontWeightSemibold as x, accentA8 as R, grayLight as S, leadingBase as N, textBase as D, spacingElement1 as I, spacingElement2 as A } from "../../tokens/index.js";
-import { Root as E } from "../../vendor/.bun/@radix-ui_react-slot@1.2.4_0ac650c021fb1b59/vendor/@radix-ui/react-slot/dist/index.js";
-const k = L({
+import { jsx as o, jsxs as W } from "react/jsx-runtime";
+import * as i from "react";
+import { mergeClasses as p, SLOT_ATTR as s, shorthands as l } from "@epilot/zenith-runtime/v1";
+import { makeZenithStyles as w } from "../../styles/make-styles.js";
+import { boxModel as k } from "../../styles/host-reset.js";
+import { grayDefault as v, fontWeightSemibold as S, accentA8 as A, grayLight as C, leadingBase as L, textBase as D, spacingElement1 as I, spacingElement2 as R } from "../../tokens/index.js";
+import { ComposeAsChild as E } from "../slot/compose-as-child.js";
+function O(c) {
+  const e = i.Children.toArray(c);
+  return e.length === 1 ? e[0] : c;
+}
+const T = w({
   // A truncating crumb can only shrink if every box above it may shrink below its content too. The
   // nav is the box a flex row (a view header) actually sizes, so it carries the rule; plain trails
   // keep their content size.
@@ -15,142 +19,137 @@ const k = L({
     }
   },
   list: {
-    ...h,
+    ...k,
     // A layout row, not a numbered list: reset the browser's markers and indent so the trail does
     // not depend on the host shipping a CSS reset.
     listStyleType: "none",
-    ...n.margin(0),
-    ...n.padding(0),
+    ...l.margin(0),
+    ...l.padding(0),
     display: "flex",
     alignItems: "center",
     // gap-2
-    ...n.gap(A),
+    ...l.gap(R),
     fontSize: D,
-    lineHeight: N,
+    lineHeight: L,
     minWidth: 0
   },
   separator: {
-    color: S
+    color: C
   },
   item: {
     display: "inline-flex",
     alignItems: "center",
     // gap-1
-    ...n.gap(I)
+    ...l.gap(I)
   },
   itemTruncate: {
-    ...h,
+    ...k,
     minWidth: 0
   },
   truncate: {
-    ...n.overflow("hidden"),
+    ...l.overflow("hidden"),
     textOverflow: "ellipsis",
     whiteSpace: "nowrap"
   },
   link: {
     // A browser underlines a bare `<a>`; the underline is a hover affordance here.
     textDecorationLine: "none",
-    fontWeight: x,
-    color: S,
+    fontWeight: S,
+    color: C,
     transitionProperty: "color, background-color, border-color, text-decoration-color, fill, stroke",
     transitionDuration: "150ms",
     transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
     cursor: "pointer",
     ":hover": {
-      color: y,
+      color: v,
       textDecorationLine: "underline"
     },
     ":focus-visible": {
       outlineWidth: "2px",
       outlineStyle: "solid",
       outlineOffset: "2px",
-      outlineColor: R
+      outlineColor: A
     }
   },
   page: {
-    fontWeight: x,
-    color: y
+    fontWeight: S,
+    color: v
   }
-}), M = l.forwardRef(
+}), V = i.forwardRef(
   function({
-    separator: a = "/",
-    "aria-label": c = "Breadcrumb",
-    className: m,
+    separator: e = "/",
+    "aria-label": m = "Breadcrumb",
+    className: d,
     children: t,
-    ...d
-  }, r) {
-    const i = k(), b = l.Children.toArray(t).filter(l.isValidElement);
+    ...b
+  }, a) {
+    const n = T(), f = i.Children.toArray(t).filter(i.isValidElement);
     return /* @__PURE__ */ o(
       "nav",
       {
-        ref: r,
+        ref: a,
         "data-slot": "breadcrumb",
         [s]: "breadcrumb",
-        "aria-label": c,
-        className: p(i.root, m),
-        ...d,
-        children: /* @__PURE__ */ o("ol", { className: i.list, children: b.map((f, e) => /* @__PURE__ */ w(l.Fragment, { children: [
-          e > 0 && /* @__PURE__ */ o(
+        "aria-label": m,
+        className: p(n.root, d),
+        ...b,
+        children: /* @__PURE__ */ o("ol", { className: n.list, children: f.map((g, r) => /* @__PURE__ */ W(i.Fragment, { children: [
+          r > 0 && /* @__PURE__ */ o(
             "li",
             {
               role: "presentation",
               "aria-hidden": "true",
-              className: i.separator,
-              children: a
+              className: n.separator,
+              children: e
             }
           ),
-          f
-        ] }, e)) })
+          g
+        ] }, r)) })
       }
     );
   }
-), P = l.forwardRef(function({
-  href: a,
-  isCurrent: c = !1,
-  className: m,
+), Z = i.forwardRef(function({
+  href: e,
+  isCurrent: m = !1,
+  className: d,
   children: t,
-  asChild: d = !1,
-  truncate: r = !1,
-  title: i,
-  ...b
-}, f) {
-  const e = k(), T = !!a, B = d ? E : "a", g = r ? e.truncate : void 0, u = i ?? (r && (typeof t == "string" || typeof t == "number") ? String(t) : void 0), W = T || d ? /* @__PURE__ */ o(
-    B,
-    {
-      "data-slot": "breadcrumb-link",
-      [s]: "breadcrumb-link",
-      ...a ? { href: a } : {},
-      className: p(e.link, g, m),
-      ...u !== void 0 ? { title: u } : {},
-      ...c ? { "aria-current": "page" } : {},
-      ...b,
-      children: t
-    }
-  ) : /* @__PURE__ */ o(
+  asChild: b = !1,
+  truncate: a = !1,
+  title: n,
+  ...f
+}, g) {
+  const r = T(), B = !!e, h = a ? r.truncate : void 0, u = n ?? (a && (typeof t == "string" || typeof t == "number") ? String(t) : void 0), y = {
+    "data-slot": "breadcrumb-link",
+    [s]: "breadcrumb-link",
+    ...e ? { href: e } : {},
+    ...u !== void 0 ? { title: u } : {},
+    ...m ? { "aria-current": "page" } : {},
+    ...f
+  }, x = p(r.link, h, d), N = b ? /* @__PURE__ */ o(E, { ...y, className: x, children: O(t) }) : B ? /* @__PURE__ */ o("a", { ...y, className: x, children: t }) : /* @__PURE__ */ o(
     "span",
     {
       "data-slot": "breadcrumb-page",
       [s]: "breadcrumb-page",
-      className: p(e.page, g, m),
+      className: p(r.page, h, d),
       ...u !== void 0 ? { title: u } : {},
-      ...c ? { "aria-current": "page" } : {},
+      ...m ? { "aria-current": "page" } : {},
       children: t
     }
   );
   return /* @__PURE__ */ o(
     "li",
     {
-      ref: f,
+      ref: g,
       "data-slot": "breadcrumb-item",
       [s]: "breadcrumb-item",
-      ...r ? { "data-truncate": "" } : {},
-      className: p(e.item, r && e.itemTruncate),
-      children: W
+      ...a ? { "data-truncate": "" } : {},
+      className: p(r.item, a && r.itemTruncate),
+      children: N
     }
   );
 });
 export {
-  M as Breadcrumb,
-  P as BreadcrumbItem
+  V as Breadcrumb,
+  Z as BreadcrumbItem
 };
 //# sourceMappingURL=breadcrumb.js.map

package/dist/components/breadcrumb/breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.js","sources":["../../../src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\n/** Breadcrumb — Card's compound pattern applied to the nav / ol / li structure. */\n\nexport type BreadcrumbProps = React.ComponentProps<\"nav\"> & {\n  separator?: React.ReactNode\n  /**\n   * Accessible name of the navigation landmark, read by screen readers. Pass a translated string\n   * for any locale other than English. Defaults to \"Breadcrumb\".\n   */\n  \"aria-label\"?: string\n}\n\nconst useStyles = makeZenithStyles({\n  // A truncating crumb can only shrink if every box above it may shrink below its content too. The\n  // nav is the box a flex row (a view header) actually sizes, so it carries the rule; plain trails\n  // keep their content size.\n  root: {\n    [`&:has([${SLOT_ATTR}=\"breadcrumb-item\"][data-truncate])`]: {\n      minWidth: 0,\n    },\n  },\n  list: {\n    ...boxModel,\n    // A layout row, not a numbered list: reset the browser's markers and indent so the trail does\n    // not depend on the host shipping a CSS reset.\n    listStyleType: \"none\",\n    ...shorthands.margin(0),\n    ...shorthands.padding(0),\n    display: \"flex\",\n    alignItems: \"center\",\n    // gap-2\n    ...shorthands.gap(tokens.spacingElement2),\n    fontSize: tokens.textBase,\n    lineHeight: tokens.leadingBase,\n    minWidth: 0,\n  },\n  separator: {\n    color: tokens.grayLight,\n  },\n  item: {\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    // gap-1\n    ...shorthands.gap(tokens.spacingElement1),\n  },\n  itemTruncate: {\n    ...boxModel,\n    minWidth: 0,\n  },\n  truncate: {\n    ...shorthands.overflow(\"hidden\"),\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  link: {\n    // A browser underlines a bare `<a>`; the underline is a hover affordance here.\n    textDecorationLine: \"none\",\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayLight,\n    transitionProperty:\n      \"color, background-color, border-color, text-decoration-color, fill, stroke\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    cursor: \"pointer\",\n    \":hover\": {\n      color: tokens.grayDefault,\n      textDecorationLine: \"underline\",\n    },\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n  },\n  page: {\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayDefault,\n  },\n})\n\nexport const Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n  function Breadcrumb(\n    {\n      separator = \"/\",\n      \"aria-label\": ariaLabel = \"Breadcrumb\",\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const items = React.Children.toArray(children).filter(React.isValidElement)\n\n    return (\n      <nav\n        ref={ref}\n        data-slot=\"breadcrumb\"\n        {...{ [SLOT_ATTR]: \"breadcrumb\" }}\n        aria-label={ariaLabel}\n        className={mergeClasses(styles.root, className)}\n        {...props}\n      >\n        <ol className={styles.list}>\n          {items.map((child, index) => (\n            <React.Fragment key={index}>\n              {index > 0 && (\n                <li\n                  role=\"presentation\"\n                  aria-hidden=\"true\"\n                  className={styles.separator}\n                >\n                  {separator}\n                </li>\n              )}\n              {child}\n            </React.Fragment>\n          ))}\n        </ol>\n      </nav>\n    )\n  }\n)\n\nexport type BreadcrumbItemProps = Omit<React.ComponentProps<\"a\">, \"href\"> & {\n  href?: string\n  isCurrent?: boolean\n  /**\n   * Render the child instead of the built-in `a`, keeping the link styling and slot markers. This\n   * is how a consumer supplies a router link. v1 supports it; it was dropped here while the package\n   * was on Base UI and restored once it moved back to Radix.\n   */\n  asChild?: boolean\n  /**\n   * Keep the crumb on one line and cut it with an ellipsis when the trail runs out of room, with\n   * the full text as its `title`. Pass `title` yourself when the children are not plain text.\n   */\n  truncate?: boolean\n}\n\nexport const BreadcrumbItem = React.forwardRef<\n  HTMLLIElement,\n  BreadcrumbItemProps\n>(function BreadcrumbItem(\n  {\n    href,\n    isCurrent = false,\n    className,\n    children,\n    asChild = false,\n    truncate = false,\n    title,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n  const isLink = !!href\n\n  const LinkRoot = asChild ? Slot : \"a\"\n  const truncateClass = truncate ? styles.truncate : undefined\n  const fullText =\n    title ??\n    (truncate && (typeof children === \"string\" || typeof children === \"number\")\n      ? String(children)\n      : undefined)\n\n  const content =\n    isLink || asChild ? (\n      <LinkRoot\n        data-slot=\"breadcrumb-link\"\n        {...{ [SLOT_ATTR]: \"breadcrumb-link\" }}\n        {...(href ? { href } : {})}\n        className={mergeClasses(styles.link, truncateClass, className)}\n        {...(fullText !== undefined ? { title: fullText } : {})}\n        {...(isCurrent ? { \"aria-current\": \"page\" as const } : {})}\n        {...props}\n      >\n        {children}\n      </LinkRoot>\n    ) : (\n      <span\n        data-slot=\"breadcrumb-page\"\n        {...{ [SLOT_ATTR]: \"breadcrumb-page\" }}\n        className={mergeClasses(styles.page, truncateClass, className)}\n        {...(fullText !== undefined ? { title: fullText } : {})}\n        {...(isCurrent ? { \"aria-current\": \"page\" as const } : {})}\n      >\n        {children}\n      </span>\n    )\n\n  return (\n    <li\n      ref={ref}\n      data-slot=\"breadcrumb-item\"\n      {...{ [SLOT_ATTR]: \"breadcrumb-item\" }}\n      {...(truncate ? { \"data-truncate\": \"\" } : {})}\n      className={mergeClasses(styles.item, truncate && styles.itemTruncate)}\n    >\n      {content}\n    </li>\n  )\n})\n"],"names":["useStyles","makeZenithStyles","SLOT_ATTR","boxModel","shorthands","tokens.spacingElement2","tokens.textBase","tokens.leadingBase","tokens.grayLight","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.grayDefault","tokens.accentA8","Breadcrumb","React","separator","ariaLabel","className","children","props","ref","styles","items","jsx","mergeClasses","child","index","jsxs","BreadcrumbItem","href","isCurrent","asChild","truncate","title","isLink","LinkRoot","Slot","truncateClass","fullText","content"],"mappings":"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"}
+{"version":3,"file":"breadcrumb.js","sources":["../../../src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport { ComposeAsChild } from \"../slot/compose-as-child\"\n\n/** Breadcrumb — Card's compound pattern applied to the nav / ol / li structure. */\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime (MDX call\n// sites do this), which `React.Children.only` rejects. Radix's Slot normalised that.\nfunction onlyChild(children: React.ReactNode) {\n  const elements = React.Children.toArray(children)\n  return (elements.length === 1 ? elements[0] : children) as React.ReactElement\n}\n\nexport type BreadcrumbProps = React.ComponentProps<\"nav\"> & {\n  separator?: React.ReactNode\n  /**\n   * Accessible name of the navigation landmark, read by screen readers. Pass a translated string\n   * for any locale other than English. Defaults to \"Breadcrumb\".\n   */\n  \"aria-label\"?: string\n}\n\nconst useStyles = makeZenithStyles({\n  // A truncating crumb can only shrink if every box above it may shrink below its content too. The\n  // nav is the box a flex row (a view header) actually sizes, so it carries the rule; plain trails\n  // keep their content size.\n  root: {\n    [`&:has([${SLOT_ATTR}=\"breadcrumb-item\"][data-truncate])`]: {\n      minWidth: 0,\n    },\n  },\n  list: {\n    ...boxModel,\n    // A layout row, not a numbered list: reset the browser's markers and indent so the trail does\n    // not depend on the host shipping a CSS reset.\n    listStyleType: \"none\",\n    ...shorthands.margin(0),\n    ...shorthands.padding(0),\n    display: \"flex\",\n    alignItems: \"center\",\n    // gap-2\n    ...shorthands.gap(tokens.spacingElement2),\n    fontSize: tokens.textBase,\n    lineHeight: tokens.leadingBase,\n    minWidth: 0,\n  },\n  separator: {\n    color: tokens.grayLight,\n  },\n  item: {\n    display: \"inline-flex\",\n    alignItems: \"center\",\n    // gap-1\n    ...shorthands.gap(tokens.spacingElement1),\n  },\n  itemTruncate: {\n    ...boxModel,\n    minWidth: 0,\n  },\n  truncate: {\n    ...shorthands.overflow(\"hidden\"),\n    textOverflow: \"ellipsis\",\n    whiteSpace: \"nowrap\",\n  },\n  link: {\n    // A browser underlines a bare `<a>`; the underline is a hover affordance here.\n    textDecorationLine: \"none\",\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayLight,\n    transitionProperty:\n      \"color, background-color, border-color, text-decoration-color, fill, stroke\",\n    transitionDuration: \"150ms\",\n    transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    cursor: \"pointer\",\n    \":hover\": {\n      color: tokens.grayDefault,\n      textDecorationLine: \"underline\",\n    },\n    \":focus-visible\": {\n      outlineWidth: \"2px\",\n      outlineStyle: \"solid\",\n      outlineOffset: \"2px\",\n      outlineColor: tokens.accentA8,\n    },\n  },\n  page: {\n    fontWeight: tokens.fontWeightSemibold,\n    color: tokens.grayDefault,\n  },\n})\n\nexport const Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n  function Breadcrumb(\n    {\n      separator = \"/\",\n      \"aria-label\": ariaLabel = \"Breadcrumb\",\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) {\n    const styles = useStyles()\n    const items = React.Children.toArray(children).filter(React.isValidElement)\n\n    return (\n      <nav\n        ref={ref}\n        data-slot=\"breadcrumb\"\n        {...{ [SLOT_ATTR]: \"breadcrumb\" }}\n        aria-label={ariaLabel}\n        className={mergeClasses(styles.root, className)}\n        {...props}\n      >\n        <ol className={styles.list}>\n          {items.map((child, index) => (\n            <React.Fragment key={index}>\n              {index > 0 && (\n                <li\n                  role=\"presentation\"\n                  aria-hidden=\"true\"\n                  className={styles.separator}\n                >\n                  {separator}\n                </li>\n              )}\n              {child}\n            </React.Fragment>\n          ))}\n        </ol>\n      </nav>\n    )\n  }\n)\n\nexport type BreadcrumbItemProps = Omit<React.ComponentProps<\"a\">, \"href\"> & {\n  href?: string\n  isCurrent?: boolean\n  /**\n   * Render the child instead of the built-in `a`, keeping the link styling and slot markers. This\n   * is how a consumer supplies a router link. The child must be one real element, not a Fragment.\n   */\n  asChild?: boolean\n  /**\n   * Keep the crumb on one line and cut it with an ellipsis when the trail runs out of room, with\n   * the full text as its `title`. Pass `title` yourself when the children are not plain text.\n   */\n  truncate?: boolean\n}\n\nexport const BreadcrumbItem = React.forwardRef<\n  HTMLLIElement,\n  BreadcrumbItemProps\n>(function BreadcrumbItem(\n  {\n    href,\n    isCurrent = false,\n    className,\n    children,\n    asChild = false,\n    truncate = false,\n    title,\n    ...props\n  },\n  ref\n) {\n  const styles = useStyles()\n  const isLink = !!href\n\n  const truncateClass = truncate ? styles.truncate : undefined\n  const fullText =\n    title ??\n    (truncate && (typeof children === \"string\" || typeof children === \"number\")\n      ? String(children)\n      : undefined)\n\n  const linkProps = {\n    \"data-slot\": \"breadcrumb-link\",\n    [SLOT_ATTR]: \"breadcrumb-link\",\n    ...(href ? { href } : {}),\n    ...(fullText !== undefined ? { title: fullText } : {}),\n    ...(isCurrent ? { \"aria-current\": \"page\" as const } : {}),\n    ...props,\n  }\n  const linkClassName = mergeClasses(styles.link, truncateClass, className)\n\n  const content = asChild ? (\n    <ComposeAsChild {...linkProps} className={linkClassName}>\n      {onlyChild(children)}\n    </ComposeAsChild>\n  ) : isLink ? (\n    <a {...linkProps} className={linkClassName}>\n      {children}\n    </a>\n  ) : (\n    <span\n      data-slot=\"breadcrumb-page\"\n      {...{ [SLOT_ATTR]: \"breadcrumb-page\" }}\n      className={mergeClasses(styles.page, truncateClass, className)}\n      {...(fullText !== undefined ? { title: fullText } : {})}\n      {...(isCurrent ? { \"aria-current\": \"page\" as const } : {})}\n    >\n      {children}\n    </span>\n  )\n\n  return (\n    <li\n      ref={ref}\n      data-slot=\"breadcrumb-item\"\n      {...{ [SLOT_ATTR]: \"breadcrumb-item\" }}\n      {...(truncate ? { \"data-truncate\": \"\" } : {})}\n      className={mergeClasses(styles.item, truncate && styles.itemTruncate)}\n    >\n      {content}\n    </li>\n  )\n})\n"],"names":["onlyChild","children","elements","React","useStyles","makeZenithStyles","SLOT_ATTR","boxModel","shorthands","tokens.spacingElement2","tokens.textBase","tokens.leadingBase","tokens.grayLight","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.grayDefault","tokens.accentA8","Breadcrumb","separator","ariaLabel","className","props","ref","styles","items","jsx","mergeClasses","child","index","jsxs","BreadcrumbItem","href","isCurrent","asChild","truncate","title","isLink","truncateClass","fullText","linkProps","linkClassName","content","ComposeAsChild"],"mappings":"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"}

package/dist/components/button/button.js

@@ -1,18 +1,24 @@
-import { jsx as f } from "react/jsx-runtime";
-import * as l from "react";
-import { mergeClasses as B, SLOT_ATTR as H, shorthands as n } from "@epilot/zenith-runtime/v1";
-import { makeZenithStyles as R } from "../../styles/make-styles.js";
-import { boxModel as i, nativeControl as I } from "../../styles/host-reset.js";
-import { capTrim as z } from "../../styles/text-box.js";
-import { radiusLg as E, buttonIconSize as h, leadingLg as L, textLg as O, leadingBase as T, textBase as A, buttonBaseMinHeight as D, leadingSm as P, textSm as X, leadingXs as $, textXs as M, errorSoft as u, errorA11 as V, errorSoftHover as W, errorOnSoft as j, errorSolidHover as p, errorContrast as N, errorSolid as F, accentSoft as g, grayA12 as K, accentA11 as Z, accentSoftHover as _, accentOnSoft as q, accentSolidHover as b, accentContrast as G, accentSolid as J, focusRing as Q, fontWeightSemibold as U, buttonBasePaddingInline as Y, spacingElement3 as ee } from "../../tokens/index.js";
-import { Root as oe } from "../../vendor/.bun/@radix-ui_react-slot@1.2.4_0ac650c021fb1b59/vendor/@radix-ui/react-slot/dist/index.js";
-const te = "button", re = R({
+import { jsx as g } from "react/jsx-runtime";
+import * as n from "react";
+import { mergeClasses as R, SLOT_ATTR as S, shorthands as l } from "@epilot/zenith-runtime/v1";
+import { makeZenithStyles as I } from "../../styles/make-styles.js";
+import { boxModel as a, nativeControl as L } from "../../styles/host-reset.js";
+import { capTrim as O } from "../../styles/text-box.js";
+import { radiusLg as E, buttonIconSize as v, leadingLg as T, textLg as z, leadingBase as A, textBase as D, buttonBaseMinHeight as N, leadingSm as P, textSm as $, leadingXs as V, textXs as X, errorSoft as C, errorA11 as M, errorSoftHover as W, errorOnSoft as _, errorSolidHover as k, errorContrast as j, errorSolid as F, accentSoft as m, grayA12 as K, accentA11 as Z, accentSoftHover as q, accentOnSoft as G, accentSolidHover as x, accentContrast as J, accentSolid as Q, focusRing as U, fontWeightSemibold as Y, buttonBasePaddingInline as ee, spacingElement3 as te } from "../../tokens/index.js";
+import { Button as oe } from "../../_virtual/_zenith-runtime-family_button.js";
+import { useRender as re } from "../../_virtual/_zenith-runtime-family_use-render.js";
+const ne = /* @__PURE__ */ g("span", {});
+function ie(s) {
+  const r = n.Children.toArray(s).filter(n.isValidElement);
+  return r.length === 1 ? r[0] : void 0;
+}
+const le = I({
   root: {
-    ...I,
+    ...L,
     display: "inline-flex",
     alignItems: "center",
     justifyContent: "center",
-    fontWeight: U,
+    fontWeight: Y,
     whiteSpace: "nowrap",
     transitionProperty: "all",
     cursor: "pointer",
@@ -24,7 +30,7 @@ const te = "button", re = R({
       outlineWidth: "2px",
       outlineStyle: "solid",
       outlineOffset: "2px",
-      outlineColor: Q
+      outlineColor: U
     },
     "@media (prefers-reduced-motion: reduce)": {
       transitionDuration: "0.01ms"
@@ -35,113 +41,113 @@ const te = "button", re = R({
       color: "currentColor"
     }
   },
-  label: z,
+  label: O,
   primary: {
-    backgroundColor: J,
-    color: G,
-    ":hover:not(:disabled)": { backgroundColor: b },
-    ":active:not(:disabled)": { backgroundColor: b }
+    backgroundColor: Q,
+    color: J,
+    ":hover:not(:disabled)": { backgroundColor: x },
+    ":active:not(:disabled)": { backgroundColor: x }
   },
   secondary: {
-    backgroundColor: g,
-    color: q,
-    ":hover:not(:disabled)": { backgroundColor: _ }
+    backgroundColor: m,
+    color: G,
+    ":hover:not(:disabled)": { backgroundColor: q }
   },
   tertiary: {
     backgroundColor: "transparent",
     color: Z,
-    ":hover:not(:disabled)": { backgroundColor: g }
+    ":hover:not(:disabled)": { backgroundColor: m }
   },
   ghost: {
     backgroundColor: "transparent",
     color: K,
-    ":hover:not(:disabled)": { backgroundColor: g }
+    ":hover:not(:disabled)": { backgroundColor: m }
   },
   primaryDestructive: {
     backgroundColor: F,
-    color: N,
-    ":hover:not(:disabled)": { backgroundColor: p },
-    ":active:not(:disabled)": { backgroundColor: p }
+    color: j,
+    ":hover:not(:disabled)": { backgroundColor: k },
+    ":active:not(:disabled)": { backgroundColor: k }
   },
   secondaryDestructive: {
-    backgroundColor: u,
-    color: j,
+    backgroundColor: C,
+    color: _,
     ":hover:not(:disabled)": { backgroundColor: W }
   },
   tertiaryDestructive: {
     backgroundColor: "transparent",
-    color: V,
-    ":hover:not(:disabled)": { backgroundColor: u }
+    color: M,
+    ":hover:not(:disabled)": { backgroundColor: C }
   },
   xs: {
-    ...i,
-    ...n.paddingInline("0.5rem"),
-    ...n.paddingBlock("0.25rem"),
+    ...a,
+    ...l.paddingInline("0.5rem"),
+    ...l.paddingBlock("0.25rem"),
     // Cap trimming removes the line-height's leading from direct text. Keep the established
     // 24px control geometry explicitly instead of relying on that incidental text height.
     minHeight: "1.5rem",
-    fontSize: M,
-    lineHeight: $,
+    fontSize: X,
+    lineHeight: V,
     gap: "4px",
     "& svg": { width: "0.75rem", height: "0.75rem" }
   },
   sm: {
-    ...i,
-    ...n.paddingInline(ee),
-    ...n.paddingBlock("0.25rem"),
+    ...a,
+    ...l.paddingInline(te),
+    ...l.paddingBlock("0.25rem"),
     // As above, the fixed 28px size is part of Button's contract, independent of its label box.
     minHeight: "1.75rem",
-    fontSize: X,
+    fontSize: $,
     lineHeight: P,
     gap: "0.375rem",
     "& svg": { width: "0.875rem", height: "0.875rem" }
   },
   base: {
-    ...i,
+    ...a,
     // Density-bound (DENSITY-SPEC.md §2.4, WP9B1-ACCEPTANCE-WP9B2A): padding-inline is the
     // compact/comfortable lever; min-height is floored by the fixed line-height + padding-block
     // below and cannot shrink, so it is bound too (compact === normal, comfortable raised via an
     // explicit minHeight above the natural content box, same mechanism `lg` already uses).
-    ...n.paddingInline(Y),
-    ...n.paddingBlock("0.25rem"),
-    minHeight: D,
-    fontSize: A,
-    lineHeight: T,
+    ...l.paddingInline(ee),
+    ...l.paddingBlock("0.25rem"),
+    minHeight: N,
+    fontSize: D,
+    lineHeight: A,
     gap: "0.5rem",
     "& svg": { width: "1rem", height: "1rem" }
   },
   lg: {
-    ...i,
-    ...n.paddingInline("1.25rem"),
-    ...n.paddingBlock("0.25rem"),
+    ...a,
+    ...l.paddingInline("1.25rem"),
+    ...l.paddingBlock("0.25rem"),
     minHeight: "2.5rem",
-    fontSize: O,
-    lineHeight: L,
+    fontSize: z,
+    lineHeight: T,
     gap: "0.5rem",
     "& svg": { width: "1rem", height: "1rem" }
   },
   iconXs: {
-    ...i,
+    ...a,
     width: "1.5rem",
     height: "1.5rem",
     "& svg": { width: "0.75rem", height: "0.75rem" }
   },
   iconSm: {
-    ...i,
+    ...a,
     width: "1.75rem",
     height: "1.75rem",
     "& svg": { width: "0.875rem", height: "0.875rem" }
   },
   icon: {
-    ...i,
+    ...a,
     // Density-bound: a fixed square, no line-height floor (unlike `base`), so compact/comfortable
     // both move freely (DENSITY-SPEC.md §2.4).
-    width: h,
-    height: h,
+    width: v,
+    height: v,
     "& svg": { width: "1.125rem", height: "1.125rem" }
   },
   iconLg: {
-    ...i,
+    ...a,
     width: "2.5rem",
     height: "2.5rem",
     "& svg": { width: "1.5rem", height: "1.5rem" }
@@ -149,54 +155,54 @@ const te = "button", re = R({
   normal: { borderRadius: E },
   rounded: { borderRadius: "9999px" }
 });
-function S(d, a = "button") {
-  return l.Children.toArray(d).flatMap((e, t) => {
-    const s = l.isValidElement(e) && e.key !== null ? String(e.key) : String(t), o = `${a}/${s}`;
-    return l.isValidElement(e) && e.type === l.Fragment ? S(e.props.children, o) : [{ node: e, keyPath: o }];
+function w(s, r = "button") {
+  return n.Children.toArray(s).flatMap((e, o) => {
+    const d = n.isValidElement(e) && e.key !== null ? String(e.key) : String(o), t = `${r}/${d}`;
+    return n.isValidElement(e) && e.type === n.Fragment ? w(e.props.children, t) : [{ node: e, keyPath: t }];
   });
 }
-function ne(d, a) {
+function ae(s, r) {
   const e = [];
-  let t = [];
-  const s = () => {
-    if (!t.length) return;
-    t.every(
-      ({ node: r }) => typeof r == "string" && r.trim() === ""
-    ) ? e.push(...t.map(({ node: r }) => r)) : e.push(
-      /* @__PURE__ */ f(
+  let o = [];
+  const d = () => {
+    if (!o.length) return;
+    o.every(
+      ({ node: i }) => typeof i == "string" && i.trim() === ""
+    ) ? e.push(...o.map(({ node: i }) => i)) : e.push(
+      /* @__PURE__ */ g(
         "span",
         {
           "data-slot": "button-label",
-          className: a,
-          children: t.map(({ node: r }) => r)
+          className: r,
+          children: o.map(({ node: i }) => i)
         },
-        `button-label:${t[0].keyPath}`
+        `button-label:${o[0].keyPath}`
       )
-    ), t = [];
+    ), o = [];
   };
-  for (const o of S(d)) {
-    if (typeof o.node == "string" || typeof o.node == "number") {
-      t.push(o);
+  for (const t of w(s)) {
+    if (typeof t.node == "string" || typeof t.node == "number") {
+      o.push(t);
       continue;
     }
-    s(), e.push(
-      l.isValidElement(o.node) ? l.cloneElement(o.node, { key: o.keyPath }) : o.node
+    d(), e.push(
+      n.isValidElement(t.node) ? n.cloneElement(t.node, { key: t.keyPath }) : t.node
     );
   }
-  return s(), e;
+  return d(), e;
 }
-const me = l.forwardRef(
+const be = n.forwardRef(
   function({
-    variant: a = "primary",
+    variant: r = "primary",
     size: e = "base",
-    shape: t = "rounded",
-    destructive: s = !1,
-    className: o,
-    asChild: r = !1,
-    children: m,
-    ...y
-  }, k) {
-    const c = re(), v = s && a !== "ghost" ? `${a}Destructive` : a, C = {
+    shape: o = "rounded",
+    destructive: d = !1,
+    className: t,
+    asChild: i = !1,
+    children: h,
+    ...u
+  }, p) {
+    const c = le(), B = d && r !== "ghost" ? `${r}Destructive` : r, H = {
       xs: "xs",
       sm: "sm",
       base: "base",
@@ -205,27 +211,38 @@ const me = l.forwardRef(
       "icon-sm": "iconSm",
       icon: "icon",
       "icon-lg": "iconLg"
-    }[e], x = r ? oe : te, w = r ? m : ne(m, c.label);
-    return /* @__PURE__ */ f(
-      x,
+    }[e], b = R(
+      c.root,
+      c[B],
+      c[H],
+      c[o],
+      t
+    ), f = i ? ie(h) : void 0, y = re({
+      render: f ?? ne,
+      props: {
+        "data-slot": "button",
+        [S]: "button",
+        className: b,
+        ...u
+      },
+      ref: p,
+      enabled: f !== void 0
+    });
+    return y || /* @__PURE__ */ g(
+      oe,
       {
-        ref: k,
+        ref: p,
         "data-slot": "button",
-        [H]: "button",
-        className: B(
-          c.root,
-          c[v],
-          c[C],
-          c[t],
-          o
-        ),
-        ...y,
-        children: w
+        [S]: "button",
+        className: b,
+        type: "submit",
+        ...u,
+        children: ae(h, c.label)
       }
     );
   }
 );
 export {
-  me as Button
+  be as Button
 };
 //# sourceMappingURL=button.js.map