npm - @epilot/zenith-react - Versions diffs - 0.1.0-next.1 → 0.2.0-next.0 - Mend

@epilot/zenith-react 0.1.0-next.1 → 0.2.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (121) hide show

package/dist/components/breadcrumb/breadcrumb.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as x } from "react/jsx-runtime";
 import * as o from "react";
 import { SLOT_ATTR as c, mergeClasses as u, shorthands as b } from "@epilot/zenith-runtime/v1";
 import { makeZenithStyles as B } from "../../styles/make-styles.js";
-import { semGrayDefault as p, fontWeightSemibold as f, accentA8 as L, semGrayLight as g, leadingBase as R, textBase as S, spacingElement1 as I, spacingElement2 as N } from "../../tokens/index.js";
+import { grayDefault as p, fontWeightSemibold as f, accentA8 as L, grayLight as g, leadingBase as R, textBase as S, spacingElement1 as I, spacingElement2 as N } from "../../tokens/index.js";
 import { Root as T } from "../../vendor/.bun/@radix-ui_react-slot@1.2.4_0ac650c021fb1b59/vendor/@radix-ui/react-slot/dist/index.js";
 const h = B({
   list: {
@@ -45,24 +45,24 @@ const h = B({
     color: p
   }
 }), w = o.forwardRef(
-  function({ separator: t = "/", className: a, children: i, ...n }, s) {
-    const l = h(), m = o.Children.toArray(i).filter(o.isValidElement);
+  function({ separator: t = "/", className: a, children: i, ...n }, l) {
+    const s = h(), m = o.Children.toArray(i).filter(o.isValidElement);
     return /* @__PURE__ */ e(
       "nav",
       {
-        ref: s,
+        ref: l,
         "data-slot": "breadcrumb",
         [c]: "breadcrumb",
         "aria-label": "Breadcrumb",
         className: a,
         ...n,
-        children: /* @__PURE__ */ e("ol", { className: l.list, children: m.map((r, d) => /* @__PURE__ */ x(o.Fragment, { children: [
+        children: /* @__PURE__ */ e("ol", { className: s.list, children: m.map((r, d) => /* @__PURE__ */ x(o.Fragment, { children: [
           d > 0 && /* @__PURE__ */ e(
             "li",
             {
               role: "presentation",
               "aria-hidden": "true",
-              className: l.separator,
+              className: s.separator,
               children: t
             }
           ),
@@ -71,16 +71,16 @@ const h = B({
       }
     );
   }
-), z = o.forwardRef(function({ href: t, isCurrent: a = !1, className: i, children: n, asChild: s = !1, ...l }, m) {
-  const r = h(), y = !!t || s ? /* @__PURE__ */ e(
-    s ? T : "a",
+), z = o.forwardRef(function({ href: t, isCurrent: a = !1, className: i, children: n, asChild: l = !1, ...s }, m) {
+  const r = h(), y = !!t || l ? /* @__PURE__ */ e(
+    l ? T : "a",
     {
       "data-slot": "breadcrumb-link",
       [c]: "breadcrumb-link",
       ...t ? { href: t } : {},
       className: u(r.link, i),
       ...a ? { "aria-current": "page" } : {},
-      ...l,
+      ...s,
       children: n
     }
   ) : /* @__PURE__ */ e(

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

	@@ -1 +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 * 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\nconst useStyles = makeZenithStyles({\n list: {\n display: \"flex\",\n alignItems: \"center\",\n // gap-2\n ...shorthands.gap(tokens.spacingElement2),\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n },\n separator: {\n color: tokens.~~semGrayLight~~,\n },\n item: {\n display: \"inline-flex\",\n alignItems: \"center\",\n // gap-1\n ...shorthands.gap(tokens.spacingElement1),\n },\n link: {\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.~~semGrayLight~~,\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.~~semGrayDefault~~,\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.~~semGrayDefault~~,\n },\n})\n\nexport const Breadcrumb = React.forwardRef<HTMLElement, BreadcrumbProps>(\n function Breadcrumb({ separator = \"/\", className, children, ...props }, ref) {\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=\"Breadcrumb\"\n className={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\nexport const BreadcrumbItem = React.forwardRef<\n HTMLLIElement,\n BreadcrumbItemProps\n>(function BreadcrumbItem(\n { href, isCurrent = false, className, children, asChild = false, ...props },\n ref\n) {\n const styles = useStyles()\n const isLink = !!href\n\n const LinkRoot = asChild ? Slot : \"a\"\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, className)}\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, className)}\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 className={styles.item}\n >\n {content}\n </li>\n )\n})\n"],"names":["useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.textBase","tokens.leadingBase","tokens.~~semGrayLight~~","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.~~semGrayDefault~~","tokens.accentA8","Breadcrumb","React","separator","className","children","props","ref","styles","items","jsx","SLOT_ATTR","child","index","jsxs","BreadcrumbItem","href","isCurrent","asChild","content","Slot","mergeClasses"],"mappings":";;;;;;AAeA,MAAMA,IAAYC,EAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA;AAAA,IAEZ,GAAGC,EAAW,IAAIC,CAAsB;AAAA,IACxC,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAAA,EAErB,WAAW;AAAA,IACT,OAAOC;AAAAA,EAAO;AAAA,EAEhB,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA;AAAA,IAEZ,GAAGJ,EAAW,IAAIK,CAAsB;AAAA,EAAA;AAAA,EAE1C,MAAM;AAAA,IACJ,YAAYC;AAAAA,IACZ,OAAOF;AAAAA,IACP,oBACE;AAAA,IACF,oBAAoB;AAAA,IACpB,0BAA0B;AAAA,IAC1B,QAAQ;AAAA,IACR,UAAU;AAAA,MACR,OAAOG;AAAAA,MACP,oBAAoB;AAAA,IAAA;AAAA,IAEtB,kBAAkB;AAAA,MAChB,cAAc;AAAA,MACd,cAAc;AAAA,MACd,eAAe;AAAA,MACf,cAAcC;AAAAA,IAAO;AAAA,EACvB;AAAA,EAEF,MAAM;AAAA,IACJ,YAAYF;AAAAA,IACZ,OAAOC;AAAAA,EAAO;AAElB,CAAC,GAEYE,IAAaC,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAC,IAAY,KAAK,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAASC,GAAK;AAC3E,UAAMC,IAASlB,EAAA,GACTmB,IAAQP,EAAM,SAAS,QAAQG,CAAQ,EAAE,OAAOH,EAAM,cAAc;AAE1E,WACE,gBAAAQ;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAH;AAAA,QACA,aAAU;AAAA,QACJ,CAACI,CAAS,GAAG;AAAA,QACnB,cAAW;AAAA,QACX,WAAAP;AAAA,QACC,GAAGE;AAAA,QAEJ,UAAA,gBAAAI,EAAC,MAAA,EAAG,WAAWF,EAAO,MACnB,UAAAC,EAAM,IAAI,CAACG,GAAOC,MACjB,gBAAAC,EAACZ,EAAM,UAAN,EACE,UAAA;AAAA,UAAAW,IAAQ,KACP,gBAAAH;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,eAAY;AAAA,cACZ,WAAWF,EAAO;AAAA,cAEjB,UAAAL;AAAA,YAAA;AAAA,UAAA;AAAA,UAGJS;AAAA,QAAA,EAAA,GAVkBC,CAWrB,CACD,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF,GAaaE,IAAiBb,EAAM,WAGlC,SACA,EAAE,MAAAc,GAAM,WAAAC,IAAY,IAAO,WAAAb,GAAW,UAAAC,GAAU,SAAAa,IAAU,IAAO,GAAGZ,EAAA,GACpEC,GACA;AACA,QAAMC,IAASlB,EAAA,GAKT6B,IAJS,CAAC,CAACH,KAKLE,IACR,gBAAAR;AAAA,IAJaQ,IAAUE,IAAO;AAAA,IAI7B;AAAA,MACC,aAAU;AAAA,MACJ,CAACT,CAAS,GAAG;AAAA,MAClB,GAAIK,IAAO,EAAE,MAAAA,EAAA,IAAS,CAAA;AAAA,MACvB,WAAWK,EAAab,EAAO,MAAMJ,CAAS;AAAA,MAC7C,GAAIa,IAAY,EAAE,gBAAgB,OAAA,IAAoB,CAAA;AAAA,MACtD,GAAGX;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA,IAGH,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACJ,CAACC,CAAS,GAAG;AAAA,MACnB,WAAWU,EAAab,EAAO,MAAMJ,CAAS;AAAA,MAC7C,GAAIa,IAAY,EAAE,gBAAgB,OAAA,IAAoB,CAAA;AAAA,MAEtD,UAAAZ;AAAA,IAAA;AAAA,EAAA;AAIP,SACE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAH;AAAA,MACA,aAAU;AAAA,MACJ,CAACI,CAAS,GAAG;AAAA,MACnB,WAAWH,EAAO;AAAA,MAEjB,UAAAW;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
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 * 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\nconst useStyles = makeZenithStyles({\n list: {\n display: \"flex\",\n alignItems: \"center\",\n // gap-2\n ...shorthands.gap(tokens.spacingElement2),\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\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 link: {\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({ separator = \"/\", className, children, ...props }, ref) {\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=\"Breadcrumb\"\n className={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\nexport const BreadcrumbItem = React.forwardRef<\n HTMLLIElement,\n BreadcrumbItemProps\n>(function BreadcrumbItem(\n { href, isCurrent = false, className, children, asChild = false, ...props },\n ref\n) {\n const styles = useStyles()\n const isLink = !!href\n\n const LinkRoot = asChild ? Slot : \"a\"\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, className)}\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, className)}\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 className={styles.item}\n >\n {content}\n </li>\n )\n})\n"],"names":["useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.textBase","tokens.leadingBase","tokens.grayLight","tokens.spacingElement1","tokens.fontWeightSemibold","tokens.grayDefault","tokens.accentA8","Breadcrumb","React","separator","className","children","props","ref","styles","items","jsx","SLOT_ATTR","child","index","jsxs","BreadcrumbItem","href","isCurrent","asChild","content","Slot","mergeClasses"],"mappings":"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"}

package/dist/components/button/button.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import { jsx as b } from "react/jsx-runtime";
-import * as s from "react";
+import * as a from "react";
 import { mergeClasses as w, SLOT_ATTR as B, shorthands as n } from "@epilot/zenith-runtime/v1";
 import { makeZenithStyles as H } from "../../styles/make-styles.js";
-import { capTrim as E } from "../../styles/text-box.js";
-import { radiusLg as A, buttonIconSize as g, leadingLg as R, textLg as I, leadingBase as z, textBase as L, buttonBaseMinHeight as O, leadingSm as T, textSm as D, leadingXs as P, textXs as X, semErrorSoft as h, errorA11 as $, semErrorSoftHover as V, semErrorOnSoft as W, semErrorSolidHover as u, semErrorContrast as j, semErrorSolid as F, semAccentSoft as d, grayA12 as M, accentA11 as N, semAccentSoftHover as K, semAccentOnSoft as Z, semAccentSolidHover as p, semAccentContrast as _, semAccentSolid as q, semFocusRing as G, fontWeightSemibold as J, buttonBasePaddingInline as Q, spacingElement3 as U } from "../../tokens/index.js";
+import { capTrim as R } from "../../styles/text-box.js";
+import { radiusLg as I, buttonIconSize as m, leadingLg as z, textLg as E, leadingBase as L, textBase as O, buttonBaseMinHeight as T, leadingSm as A, textSm as D, leadingXs as P, textXs as X, errorSoft as h, errorA11 as $, errorSoftHover as V, errorOnSoft as W, errorSolidHover as u, errorContrast as j, errorSolid as M, accentSoft as d, grayA12 as N, accentA11 as F, accentSoftHover as K, accentOnSoft as Z, accentSolidHover as p, accentContrast as _, accentSolid as q, focusRing as G, fontWeightSemibold as J, buttonBasePaddingInline as Q, spacingElement3 as U } from "../../tokens/index.js";
 import { Root as Y } from "../../vendor/.bun/@radix-ui_react-slot@1.2.4_0ac650c021fb1b59/vendor/@radix-ui/react-slot/dist/index.js";
 const ee = "button", oe = H({
   root: {
@@ -33,7 +33,7 @@ const ee = "button", oe = H({
       color: "currentColor"
     }
   },
-  label: E,
+  label: R,
   primary: {
     backgroundColor: q,
     color: _,
@@ -47,16 +47,16 @@ const ee = "button", oe = H({
   },
   tertiary: {
     backgroundColor: "transparent",
-    color: N,
+    color: F,
     ":hover:not(:disabled)": { backgroundColor: d }
   },
   ghost: {
     backgroundColor: "transparent",
-    color: M,
+    color: N,
     ":hover:not(:disabled)": { backgroundColor: d }
   },
   primaryDestructive: {
-    backgroundColor: F,
+    backgroundColor: M,
     color: j,
     ":hover:not(:disabled)": { backgroundColor: u },
     ":active:not(:disabled)": { backgroundColor: u }
@@ -88,7 +88,7 @@ const ee = "button", oe = H({
     // As above, the fixed 28px size is part of Button's contract, independent of its label box.
     minHeight: "1.75rem",
     fontSize: D,
-    lineHeight: T,
+    lineHeight: A,
     gap: "0.375rem",
     "& svg": { width: "0.875rem", height: "0.875rem" }
   },
@@ -99,9 +99,9 @@ const ee = "button", oe = H({
     // explicit minHeight above the natural content box, same mechanism `lg` already uses).
     ...n.paddingInline(Q),
     ...n.paddingBlock("0.25rem"),
-    minHeight: O,
-    fontSize: L,
-    lineHeight: z,
+    minHeight: T,
+    fontSize: O,
+    lineHeight: L,
     gap: "0.5rem",
     "& svg": { width: "1rem", height: "1rem" }
   },
@@ -109,8 +109,8 @@ const ee = "button", oe = H({
     ...n.paddingInline("1.25rem"),
     ...n.paddingBlock("0.25rem"),
     minHeight: "2.5rem",
-    fontSize: I,
-    lineHeight: R,
+    fontSize: E,
+    lineHeight: z,
     gap: "0.5rem",
     "& svg": { width: "1rem", height: "1rem" }
   },
@@ -127,8 +127,8 @@ const ee = "button", oe = H({
   icon: {
     // Density-bound: a fixed square, no line-height floor (unlike `base`), so compact/comfortable
     // both move freely (DENSITY-SPEC.md §2.4).
-    width: g,
-    height: g,
+    width: m,
+    height: m,
     "& svg": { width: "1.125rem", height: "1.125rem" }
   },
   iconLg: {
@@ -136,13 +136,13 @@ const ee = "button", oe = H({
     height: "2.5rem",
     "& svg": { width: "1.5rem", height: "1.5rem" }
   },
-  normal: { borderRadius: A },
+  normal: { borderRadius: I },
   rounded: { borderRadius: "9999px" }
 });
 function f(c, i = "button") {
-  return s.Children.toArray(c).flatMap((e, t) => {
-    const l = s.isValidElement(e) && e.key !== null ? String(e.key) : String(t), o = `${i}/${l}`;
-    return s.isValidElement(e) && e.type === s.Fragment ? f(e.props.children, o) : [{ node: e, keyPath: o }];
+  return a.Children.toArray(c).flatMap((e, t) => {
+    const l = a.isValidElement(e) && e.key !== null ? String(e.key) : String(t), o = `${i}/${l}`;
+    return a.isValidElement(e) && e.type === a.Fragment ? f(e.props.children, o) : [{ node: e, keyPath: o }];
   });
 }
 function te(c, i) {
@@ -170,12 +170,12 @@ function te(c, i) {
       continue;
     }
     l(), e.push(
-      s.isValidElement(o.node) ? s.cloneElement(o.node, { key: o.keyPath }) : o.node
+      a.isValidElement(o.node) ? a.cloneElement(o.node, { key: o.keyPath }) : o.node
     );
   }
   return l(), e;
 }
-const ce = s.forwardRef(
+const ce = a.forwardRef(
   function({
     variant: i = "primary",
     size: e = "base",
@@ -183,10 +183,10 @@ const ce = s.forwardRef(
     destructive: l = !1,
     className: o,
     asChild: r = !1,
-    children: m,
+    children: g,
     ...S
   }, y) {
-    const a = oe(), k = l && i !== "ghost" ? `${i}Destructive` : i, v = {
+    const s = oe(), k = l && i !== "ghost" ? `${i}Destructive` : i, v = {
       xs: "xs",
       sm: "sm",
       base: "base",
@@ -195,7 +195,7 @@ const ce = s.forwardRef(
       "icon-sm": "iconSm",
       icon: "icon",
       "icon-lg": "iconLg"
-    }[e], C = r ? Y : ee, x = r ? m : te(m, a.label);
+    }[e], C = r ? Y : ee, x = r ? g : te(g, s.label);
     return /* @__PURE__ */ b(
       C,
       {
@@ -203,10 +203,10 @@ const ce = s.forwardRef(
         "data-slot": "button",
         [B]: "button",
         className: w(
-          a.root,
-          a[k],
-          a[v],
-          a[t],
+          s.root,
+          s[k],
+          s[v],
+          s[t],
           o
         ),
         ...S,

package/dist/components/button/button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"button.js","sources":["../../../src/components/button/button.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 { capTrim } from \"../../styles/text-box\"\nimport * as tokens from \"../../tokens\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\n/*\n Base UI's type declarations resolve `react` from the hoisted root's `@types/react` (v19), while\n * this package pins `@types/react` 18 in its own node_modules. Re-typing the primitive onto OUR\n * `React` keeps the button's pass-through props and ref on one React type for this package.\n /\n/\n A native `<button>`, no primitive.\n \n v1's only Radix use here is `Slot`, purely to implement `asChild`, and this does the same. Base\n * UI's button primitive supplied nothing v1 had: it added a dependency, and with it the\n * `@types/react` 19 requirement, for a plain element.\n /\nconst ButtonBase = \"button\" as const\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontWeight: tokens.fontWeightSemibold,\n whiteSpace: \"nowrap\",\n transitionProperty: \"all\",\n cursor: \"pointer\",\n flexShrink: 0,\n // Disabled keeps pointer events so a Tooltip can still explain why, but shows none of the\n // hover or press feedback (every variant guards those with `:not(:disabled)`) and no pointer.\n \":disabled\": { opacity: 0.5, cursor: \"not-allowed\" },\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.semFocusRing,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"& svg\": {\n flexShrink: 0,\n pointerEvents: \"none\",\n color: \"currentColor\",\n },\n },\n label: capTrim,\n primary: {\n backgroundColor: tokens.semAccentSolid,\n color: tokens.semAccentContrast,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semAccentSolidHover },\n \":active:not(:disabled)\": { backgroundColor: tokens.semAccentSolidHover },\n },\n secondary: {\n backgroundColor: tokens.semAccentSoft,\n color: tokens.semAccentOnSoft,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semAccentSoftHover },\n },\n tertiary: {\n backgroundColor: \"transparent\",\n color: tokens.accentA11,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semAccentSoft },\n },\n ghost: {\n backgroundColor: \"transparent\",\n color: tokens.grayA12,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semAccentSoft },\n },\n primaryDestructive: {\n backgroundColor: tokens.semErrorSolid,\n color: tokens.semErrorContrast,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semErrorSolidHover },\n \":active:not(:disabled)\": { backgroundColor: tokens.semErrorSolidHover },\n },\n secondaryDestructive: {\n backgroundColor: tokens.semErrorSoft,\n color: tokens.semErrorOnSoft,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semErrorSoftHover },\n },\n tertiaryDestructive: {\n backgroundColor: \"transparent\",\n color: tokens.errorA11,\n \":hover:not(:disabled)\": { backgroundColor: tokens.semErrorSoft },\n },\n xs: {\n ...shorthands.paddingInline(\"0.5rem\"),\n ...shorthands.paddingBlock(\"0.25rem\"),\n // Cap trimming removes the line-height's leading from direct text. Keep the established\n // 24px control geometry explicitly instead of relying on that incidental text height.\n minHeight: \"1.5rem\",\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n gap: \"4px\",\n \"& svg\": { width: \"0.75rem\", height: \"0.75rem\" },\n },\n sm: {\n ...shorthands.paddingInline(tokens.spacingElement3),\n ...shorthands.paddingBlock(\"0.25rem\"),\n // As above, the fixed 28px size is part of Button's contract, independent of its label box.\n minHeight: \"1.75rem\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n gap: \"0.375rem\",\n \"& svg\": { width: \"0.875rem\", height: \"0.875rem\" },\n },\n base: {\n // Density-bound (DENSITY-SPEC.md §2.4, WP9B1-ACCEPTANCE-WP9B2A): padding-inline is the\n // compact/comfortable lever; min-height is floored by the fixed line-height + padding-block\n // below and cannot shrink, so it is bound too (compact === normal, comfortable raised via an\n // explicit minHeight above the natural content box, same mechanism `lg` already uses).\n ...shorthands.paddingInline(tokens.buttonBasePaddingInline),\n ...shorthands.paddingBlock(\"0.25rem\"),\n minHeight: tokens.buttonBaseMinHeight,\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n gap: \"0.5rem\",\n \"& svg\": { width: \"1rem\", height: \"1rem\" },\n },\n lg: {\n ...shorthands.paddingInline(\"1.25rem\"),\n ...shorthands.paddingBlock(\"0.25rem\"),\n minHeight: \"2.5rem\",\n fontSize: tokens.textLg,\n lineHeight: tokens.leadingLg,\n gap: \"0.5rem\",\n \"& svg\": { width: \"1rem\", height: \"1rem\" },\n },\n iconXs: {\n width: \"1.5rem\",\n height: \"1.5rem\",\n \"& svg\": { width: \"0.75rem\", height: \"0.75rem\" },\n },\n iconSm: {\n width: \"1.75rem\",\n height: \"1.75rem\",\n \"& svg\": { width: \"0.875rem\", height: \"0.875rem\" },\n },\n icon: {\n // Density-bound: a fixed square, no line-height floor (unlike `base`), so compact/comfortable\n // both move freely (DENSITY-SPEC.md §2.4).\n width: tokens.buttonIconSize,\n height: tokens.buttonIconSize,\n \"& svg\": { width: \"1.125rem\", height: \"1.125rem\" },\n },\n iconLg: {\n width: \"2.5rem\",\n height: \"2.5rem\",\n \"& svg\": { width: \"1.5rem\", height: \"1.5rem\" },\n },\n normal: { borderRadius: tokens.radiusLg },\n rounded: { borderRadius: \"9999px\" },\n})\n\ntype FlatButtonChild = {\n node: React.ReactNode\n keyPath: string\n}\n\n/\n Fragments do not create boxes, so flatten them to the same leaf order the flex container sees.\n * React.Children.toArray handles nested arrays and gives keyed elements a stable local key; the\n * parent fragment path keeps equal keys from separate fragment scopes distinct.\n /\nfunction flattenButtonChildren(\n children: React.ReactNode,\n parentPath = \"button\"\n): FlatButtonChild[] {\n return React.Children.toArray(children).flatMap((node, index) => {\n const localKey =\n React.isValidElement(node) && node.key !== null\n ? String(node.key)\n : String(index)\n const keyPath = `${parentPath}/${localKey}`\n\n if (\n React.isValidElement<{ children?: React.ReactNode }>(node) &&\n node.type === React.Fragment\n ) {\n return flattenButtonChildren(node.props.children, keyPath)\n }\n\n return [{ node, keyPath }]\n })\n}\n\n/\n A flex container's direct text becomes an anonymous flex item, which `text-box` cannot select.\n * Recreate exactly those contiguous text runs as real label boxes. Consumer elements stay direct\n * children and whitespace-only runs stay raw, preserving today's element order and flex gaps.\n /\nfunction wrapButtonTextRuns(\n children: React.ReactNode,\n labelClassName: string\n): React.ReactNode[] {\n const output: React.ReactNode[] = []\n let textRun: FlatButtonChild[] = []\n\n const flushTextRun = () => {\n if (!textRun.length) return\n\n const whitespaceOnly = textRun.every(\n ({ node }) => typeof node === \"string\" && node.trim() === \"\"\n )\n if (whitespaceOnly) {\n output.push(...textRun.map(({ node }) => node))\n } else {\n output.push(\n <span\n key={`button-label:${textRun[0].keyPath}`}\n data-slot=\"button-label\"\n className={labelClassName}\n >\n {textRun.map(({ node }) => node)}\n </span>\n )\n }\n textRun = []\n }\n\n for (const child of flattenButtonChildren(children)) {\n if (typeof child.node === \"string\" \|\| typeof child.node === \"number\") {\n textRun.push(child)\n continue\n }\n\n flushTextRun()\n output.push(\n React.isValidElement(child.node)\n ? React.cloneElement(child.node, { key: child.keyPath })\n : child.node\n )\n }\n flushTextRun()\n\n return output\n}\n\nexport type ButtonVariant = \"primary\" \| \"secondary\" \| \"tertiary\" \| \"ghost\"\nexport type ButtonSize =\n \"xs\" \| \"sm\" \| \"base\" \| \"lg\" \| \"icon-xs\" \| \"icon-sm\" \| \"icon\" \| \"icon-lg\"\nexport type ButtonShape = \"normal\" \| \"rounded\"\n\nexport type ButtonProps = Omit<\n React.ComponentProps<\"button\">,\n \"variant\" \| \"size\" \| \"shape\" \| \"destructive\" \| \"className\" \| \"render\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n shape?: ButtonShape\n destructive?: boolean\n className?: string\n /\n Render the child element instead of a `button`, keeping Button's styling and slot markers.\n * v1 supports this and consumers rely on it to wrap links; it was dropped here while the package\n * was briefly on Base UI, and restored once it moved back to Radix.\n */\n asChild?: boolean\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n variant = \"primary\",\n size = \"base\",\n shape = \"rounded\",\n destructive = false,\n className,\n asChild = false,\n children,\n ...props\n },\n ref\n ) {\n const styles = useStyles()\n const variantSlot:\n \| ButtonVariant\n \| \"primaryDestructive\"\n \| \"secondaryDestructive\"\n \| \"tertiaryDestructive\" =\n destructive && variant !== \"ghost\"\n ? (`${variant}Destructive` as\n \| \"primaryDestructive\"\n \| \"secondaryDestructive\"\n \| \"tertiaryDestructive\")\n : variant\n const sizeSlot:\n \"xs\" \| \"sm\" \| \"base\" \| \"lg\" \| \"iconXs\" \| \"iconSm\" \| \"icon\" \| \"iconLg\" = (\n {\n xs: \"xs\",\n sm: \"sm\",\n base: \"base\",\n lg: \"lg\",\n \"icon-xs\": \"iconXs\",\n \"icon-sm\": \"iconSm\",\n icon: \"icon\",\n \"icon-lg\": \"iconLg\",\n } as const\n )[size]\n\n const Root = asChild ? Slot : ButtonBase\n const content = asChild\n ? children\n : wrapButtonTextRuns(children, styles.label)\n\n return (\n <Root\n ref={ref}\n data-slot=\"button\"\n {...{ [SLOT_ATTR]: \"button\" }}\n className={mergeClasses(\n styles.root,\n styles[variantSlot],\n styles[sizeSlot],\n styles[shape],\n className\n )}\n {...props}\n >\n {content}\n </Root>\n )\n }\n)\n"],"names":["ButtonBase","useStyles","makeZenithStyles","tokens.fontWeightSemibold","tokens.semFocusRing","capTrim","tokens.semAccentSolid","tokens.semAccentContrast","tokens.semAccentSolidHover","tokens.semAccentSoft","tokens.semAccentOnSoft","tokens.semAccentSoftHover","tokens.accentA11","tokens.grayA12","tokens.semErrorSolid","tokens.semErrorContrast","tokens.semErrorSolidHover","tokens.semErrorSoft","tokens.semErrorOnSoft","tokens.semErrorSoftHover","tokens.errorA11","shorthands","tokens.textXs","tokens.leadingXs","tokens.spacingElement3","tokens.textSm","tokens.leadingSm","tokens.buttonBasePaddingInline","tokens.buttonBaseMinHeight","tokens.textBase","tokens.leadingBase","tokens.textLg","tokens.leadingLg","tokens.buttonIconSize","tokens.radiusLg","flattenButtonChildren","children","parentPath","React","node","index","localKey","keyPath","wrapButtonTextRuns","labelClassName","output","textRun","flushTextRun","jsx","child","Button","variant","size","shape","destructive","className","asChild","props","ref","styles","variantSlot","sizeSlot","Root","Slot","content","SLOT_ATTR","mergeClasses"],"mappings":"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"}
1	+ {"version":3,"file":"button.js","sources":["../../../src/components/button/button.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 { capTrim } from \"../../styles/text-box\"\nimport * as tokens from \"../../tokens\"\nimport { Slot } from \"@radix-ui/react-slot\"\n\n/*\n Base UI's type declarations resolve `react` from the hoisted root's `@types/react` (v19), while\n * this package pins `@types/react` 18 in its own node_modules. Re-typing the primitive onto OUR\n * `React` keeps the button's pass-through props and ref on one React type for this package.\n /\n/\n A native `<button>`, no primitive.\n \n v1's only Radix use here is `Slot`, purely to implement `asChild`, and this does the same. Base\n * UI's button primitive supplied nothing v1 had: it added a dependency, and with it the\n * `@types/react` 19 requirement, for a plain element.\n /\nconst ButtonBase = \"button\" as const\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontWeight: tokens.fontWeightSemibold,\n whiteSpace: \"nowrap\",\n transitionProperty: \"all\",\n cursor: \"pointer\",\n flexShrink: 0,\n // Disabled keeps pointer events so a Tooltip can still explain why, but shows none of the\n // hover or press feedback (every variant guards those with `:not(:disabled)`) and no pointer.\n \":disabled\": { opacity: 0.5, cursor: \"not-allowed\" },\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"& svg\": {\n flexShrink: 0,\n pointerEvents: \"none\",\n color: \"currentColor\",\n },\n },\n label: capTrim,\n primary: {\n backgroundColor: tokens.accentSolid,\n color: tokens.accentContrast,\n \":hover:not(:disabled)\": { backgroundColor: tokens.accentSolidHover },\n \":active:not(:disabled)\": { backgroundColor: tokens.accentSolidHover },\n },\n secondary: {\n backgroundColor: tokens.accentSoft,\n color: tokens.accentOnSoft,\n \":hover:not(:disabled)\": { backgroundColor: tokens.accentSoftHover },\n },\n tertiary: {\n backgroundColor: \"transparent\",\n color: tokens.accentA11,\n \":hover:not(:disabled)\": { backgroundColor: tokens.accentSoft },\n },\n ghost: {\n backgroundColor: \"transparent\",\n color: tokens.grayA12,\n \":hover:not(:disabled)\": { backgroundColor: tokens.accentSoft },\n },\n primaryDestructive: {\n backgroundColor: tokens.errorSolid,\n color: tokens.errorContrast,\n \":hover:not(:disabled)\": { backgroundColor: tokens.errorSolidHover },\n \":active:not(:disabled)\": { backgroundColor: tokens.errorSolidHover },\n },\n secondaryDestructive: {\n backgroundColor: tokens.errorSoft,\n color: tokens.errorOnSoft,\n \":hover:not(:disabled)\": { backgroundColor: tokens.errorSoftHover },\n },\n tertiaryDestructive: {\n backgroundColor: \"transparent\",\n color: tokens.errorA11,\n \":hover:not(:disabled)\": { backgroundColor: tokens.errorSoft },\n },\n xs: {\n ...shorthands.paddingInline(\"0.5rem\"),\n ...shorthands.paddingBlock(\"0.25rem\"),\n // Cap trimming removes the line-height's leading from direct text. Keep the established\n // 24px control geometry explicitly instead of relying on that incidental text height.\n minHeight: \"1.5rem\",\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n gap: \"4px\",\n \"& svg\": { width: \"0.75rem\", height: \"0.75rem\" },\n },\n sm: {\n ...shorthands.paddingInline(tokens.spacingElement3),\n ...shorthands.paddingBlock(\"0.25rem\"),\n // As above, the fixed 28px size is part of Button's contract, independent of its label box.\n minHeight: \"1.75rem\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n gap: \"0.375rem\",\n \"& svg\": { width: \"0.875rem\", height: \"0.875rem\" },\n },\n base: {\n // Density-bound (DENSITY-SPEC.md §2.4, WP9B1-ACCEPTANCE-WP9B2A): padding-inline is the\n // compact/comfortable lever; min-height is floored by the fixed line-height + padding-block\n // below and cannot shrink, so it is bound too (compact === normal, comfortable raised via an\n // explicit minHeight above the natural content box, same mechanism `lg` already uses).\n ...shorthands.paddingInline(tokens.buttonBasePaddingInline),\n ...shorthands.paddingBlock(\"0.25rem\"),\n minHeight: tokens.buttonBaseMinHeight,\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n gap: \"0.5rem\",\n \"& svg\": { width: \"1rem\", height: \"1rem\" },\n },\n lg: {\n ...shorthands.paddingInline(\"1.25rem\"),\n ...shorthands.paddingBlock(\"0.25rem\"),\n minHeight: \"2.5rem\",\n fontSize: tokens.textLg,\n lineHeight: tokens.leadingLg,\n gap: \"0.5rem\",\n \"& svg\": { width: \"1rem\", height: \"1rem\" },\n },\n iconXs: {\n width: \"1.5rem\",\n height: \"1.5rem\",\n \"& svg\": { width: \"0.75rem\", height: \"0.75rem\" },\n },\n iconSm: {\n width: \"1.75rem\",\n height: \"1.75rem\",\n \"& svg\": { width: \"0.875rem\", height: \"0.875rem\" },\n },\n icon: {\n // Density-bound: a fixed square, no line-height floor (unlike `base`), so compact/comfortable\n // both move freely (DENSITY-SPEC.md §2.4).\n width: tokens.buttonIconSize,\n height: tokens.buttonIconSize,\n \"& svg\": { width: \"1.125rem\", height: \"1.125rem\" },\n },\n iconLg: {\n width: \"2.5rem\",\n height: \"2.5rem\",\n \"& svg\": { width: \"1.5rem\", height: \"1.5rem\" },\n },\n normal: { borderRadius: tokens.radiusLg },\n rounded: { borderRadius: \"9999px\" },\n})\n\ntype FlatButtonChild = {\n node: React.ReactNode\n keyPath: string\n}\n\n/\n Fragments do not create boxes, so flatten them to the same leaf order the flex container sees.\n * React.Children.toArray handles nested arrays and gives keyed elements a stable local key; the\n * parent fragment path keeps equal keys from separate fragment scopes distinct.\n /\nfunction flattenButtonChildren(\n children: React.ReactNode,\n parentPath = \"button\"\n): FlatButtonChild[] {\n return React.Children.toArray(children).flatMap((node, index) => {\n const localKey =\n React.isValidElement(node) && node.key !== null\n ? String(node.key)\n : String(index)\n const keyPath = `${parentPath}/${localKey}`\n\n if (\n React.isValidElement<{ children?: React.ReactNode }>(node) &&\n node.type === React.Fragment\n ) {\n return flattenButtonChildren(node.props.children, keyPath)\n }\n\n return [{ node, keyPath }]\n })\n}\n\n/\n A flex container's direct text becomes an anonymous flex item, which `text-box` cannot select.\n * Recreate exactly those contiguous text runs as real label boxes. Consumer elements stay direct\n * children and whitespace-only runs stay raw, preserving today's element order and flex gaps.\n /\nfunction wrapButtonTextRuns(\n children: React.ReactNode,\n labelClassName: string\n): React.ReactNode[] {\n const output: React.ReactNode[] = []\n let textRun: FlatButtonChild[] = []\n\n const flushTextRun = () => {\n if (!textRun.length) return\n\n const whitespaceOnly = textRun.every(\n ({ node }) => typeof node === \"string\" && node.trim() === \"\"\n )\n if (whitespaceOnly) {\n output.push(...textRun.map(({ node }) => node))\n } else {\n output.push(\n <span\n key={`button-label:${textRun[0].keyPath}`}\n data-slot=\"button-label\"\n className={labelClassName}\n >\n {textRun.map(({ node }) => node)}\n </span>\n )\n }\n textRun = []\n }\n\n for (const child of flattenButtonChildren(children)) {\n if (typeof child.node === \"string\" \|\| typeof child.node === \"number\") {\n textRun.push(child)\n continue\n }\n\n flushTextRun()\n output.push(\n React.isValidElement(child.node)\n ? React.cloneElement(child.node, { key: child.keyPath })\n : child.node\n )\n }\n flushTextRun()\n\n return output\n}\n\nexport type ButtonVariant = \"primary\" \| \"secondary\" \| \"tertiary\" \| \"ghost\"\nexport type ButtonSize =\n \"xs\" \| \"sm\" \| \"base\" \| \"lg\" \| \"icon-xs\" \| \"icon-sm\" \| \"icon\" \| \"icon-lg\"\nexport type ButtonShape = \"normal\" \| \"rounded\"\n\nexport type ButtonProps = Omit<\n React.ComponentProps<\"button\">,\n \"variant\" \| \"size\" \| \"shape\" \| \"destructive\" \| \"className\" \| \"render\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n shape?: ButtonShape\n destructive?: boolean\n className?: string\n /\n Render the child element instead of a `button`, keeping Button's styling and slot markers.\n * v1 supports this and consumers rely on it to wrap links; it was dropped here while the package\n * was briefly on Base UI, and restored once it moved back to Radix.\n */\n asChild?: boolean\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n function Button(\n {\n variant = \"primary\",\n size = \"base\",\n shape = \"rounded\",\n destructive = false,\n className,\n asChild = false,\n children,\n ...props\n },\n ref\n ) {\n const styles = useStyles()\n const variantSlot:\n \| ButtonVariant\n \| \"primaryDestructive\"\n \| \"secondaryDestructive\"\n \| \"tertiaryDestructive\" =\n destructive && variant !== \"ghost\"\n ? (`${variant}Destructive` as\n \| \"primaryDestructive\"\n \| \"secondaryDestructive\"\n \| \"tertiaryDestructive\")\n : variant\n const sizeSlot:\n \"xs\" \| \"sm\" \| \"base\" \| \"lg\" \| \"iconXs\" \| \"iconSm\" \| \"icon\" \| \"iconLg\" = (\n {\n xs: \"xs\",\n sm: \"sm\",\n base: \"base\",\n lg: \"lg\",\n \"icon-xs\": \"iconXs\",\n \"icon-sm\": \"iconSm\",\n icon: \"icon\",\n \"icon-lg\": \"iconLg\",\n } as const\n )[size]\n\n const Root = asChild ? Slot : ButtonBase\n const content = asChild\n ? children\n : wrapButtonTextRuns(children, styles.label)\n\n return (\n <Root\n ref={ref}\n data-slot=\"button\"\n {...{ [SLOT_ATTR]: \"button\" }}\n className={mergeClasses(\n styles.root,\n styles[variantSlot],\n styles[sizeSlot],\n styles[shape],\n className\n )}\n {...props}\n >\n {content}\n </Root>\n )\n }\n)\n"],"names":["ButtonBase","useStyles","makeZenithStyles","tokens.fontWeightSemibold","tokens.focusRing","capTrim","tokens.accentSolid","tokens.accentContrast","tokens.accentSolidHover","tokens.accentSoft","tokens.accentOnSoft","tokens.accentSoftHover","tokens.accentA11","tokens.grayA12","tokens.errorSolid","tokens.errorContrast","tokens.errorSolidHover","tokens.errorSoft","tokens.errorOnSoft","tokens.errorSoftHover","tokens.errorA11","shorthands","tokens.textXs","tokens.leadingXs","tokens.spacingElement3","tokens.textSm","tokens.leadingSm","tokens.buttonBasePaddingInline","tokens.buttonBaseMinHeight","tokens.textBase","tokens.leadingBase","tokens.textLg","tokens.leadingLg","tokens.buttonIconSize","tokens.radiusLg","flattenButtonChildren","children","parentPath","React","node","index","localKey","keyPath","wrapButtonTextRuns","labelClassName","output","textRun","flushTextRun","jsx","child","Button","variant","size","shape","destructive","className","asChild","props","ref","styles","variantSlot","sizeSlot","Root","Slot","content","SLOT_ATTR","mergeClasses"],"mappings":";;;;;;;AAsBA,MAAMA,KAAa,UAEbC,KAAYC,EAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,YAAYC;AAAAA,IACZ,YAAY;AAAA,IACZ,oBAAoB;AAAA,IACpB,QAAQ;AAAA,IACR,YAAY;AAAA;AAAA;AAAA,IAGZ,aAAa,EAAE,SAAS,KAAK,QAAQ,cAAA;AAAA,IACrC,kBAAkB;AAAA,MAChB,cAAc;AAAA,MACd,cAAc;AAAA,MACd,eAAe;AAAA,MACf,cAAcC;AAAAA,IAAO;AAAA,IAEvB,2CAA2C;AAAA,MACzC,oBAAoB;AAAA,IAAA;AAAA,IAEtB,SAAS;AAAA,MACP,YAAY;AAAA,MACZ,eAAe;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAAA,EAEF,OAAOC;AAAA,EACP,SAAS;AAAA,IACP,iBAAiBC;AAAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBC,EAAO;AAAA,IACnD,0BAA0B,EAAE,iBAAiBA,EAAO;AAAA,EAAiB;AAAA,EAEvE,WAAW;AAAA,IACT,iBAAiBC;AAAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBC,EAAO;AAAA,EAAgB;AAAA,EAErE,UAAU;AAAA,IACR,iBAAiB;AAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBH,EAAO;AAAA,EAAW;AAAA,EAEhE,OAAO;AAAA,IACL,iBAAiB;AAAA,IACjB,OAAOI;AAAAA,IACP,yBAAyB,EAAE,iBAAiBJ,EAAO;AAAA,EAAW;AAAA,EAEhE,oBAAoB;AAAA,IAClB,iBAAiBK;AAAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBC,EAAO;AAAA,IACnD,0BAA0B,EAAE,iBAAiBA,EAAO;AAAA,EAAgB;AAAA,EAEtE,sBAAsB;AAAA,IACpB,iBAAiBC;AAAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBC,EAAO;AAAA,EAAe;AAAA,EAEpE,qBAAqB;AAAA,IACnB,iBAAiB;AAAA,IACjB,OAAOC;AAAAA,IACP,yBAAyB,EAAE,iBAAiBH,EAAO;AAAA,EAAU;AAAA,EAE/D,IAAI;AAAA,IACF,GAAGI,EAAW,cAAc,QAAQ;AAAA,IACpC,GAAGA,EAAW,aAAa,SAAS;AAAA;AAAA;AAAA,IAGpC,WAAW;AAAA,IACX,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,KAAK;AAAA,IACL,SAAS,EAAE,OAAO,WAAW,QAAQ,UAAA;AAAA,EAAU;AAAA,EAEjD,IAAI;AAAA,IACF,GAAGF,EAAW,cAAcG,CAAsB;AAAA,IAClD,GAAGH,EAAW,aAAa,SAAS;AAAA;AAAA,IAEpC,WAAW;AAAA,IACX,UAAUI;AAAAA,IACV,YAAYC;AAAAA,IACZ,KAAK;AAAA,IACL,SAAS,EAAE,OAAO,YAAY,QAAQ,WAAA;AAAA,EAAW;AAAA,EAEnD,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,IAKJ,GAAGL,EAAW,cAAcM,CAA8B;AAAA,IAC1D,GAAGN,EAAW,aAAa,SAAS;AAAA,IACpC,WAAWO;AAAAA,IACX,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,KAAK;AAAA,IACL,SAAS,EAAE,OAAO,QAAQ,QAAQ,OAAA;AAAA,EAAO;AAAA,EAE3C,IAAI;AAAA,IACF,GAAGT,EAAW,cAAc,SAAS;AAAA,IACrC,GAAGA,EAAW,aAAa,SAAS;AAAA,IACpC,WAAW;AAAA,IACX,UAAUU;AAAAA,IACV,YAAYC;AAAAA,IACZ,KAAK;AAAA,IACL,SAAS,EAAE,OAAO,QAAQ,QAAQ,OAAA;AAAA,EAAO;AAAA,EAE3C,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS,EAAE,OAAO,WAAW,QAAQ,UAAA;AAAA,EAAU;AAAA,EAEjD,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS,EAAE,OAAO,YAAY,QAAQ,WAAA;AAAA,EAAW;AAAA,EAEnD,MAAM;AAAA;AAAA;AAAA,IAGJ,OAAOC;AAAAA,IACP,QAAQA;AAAAA,IACR,SAAS,EAAE,OAAO,YAAY,QAAQ,WAAA;AAAA,EAAW;AAAA,EAEnD,QAAQ;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS,EAAE,OAAO,UAAU,QAAQ,SAAA;AAAA,EAAS;AAAA,EAE/C,QAAQ,EAAE,cAAcC,EAAO;AAAA,EAC/B,SAAS,EAAE,cAAc,SAAA;AAC3B,CAAC;AAYD,SAASC,EACPC,GACAC,IAAa,UACM;AACnB,SAAOC,EAAM,SAAS,QAAQF,CAAQ,EAAE,QAAQ,CAACG,GAAMC,MAAU;AAC/D,UAAMC,IACJH,EAAM,eAAeC,CAAI,KAAKA,EAAK,QAAQ,OACvC,OAAOA,EAAK,GAAG,IACf,OAAOC,CAAK,GACZE,IAAU,GAAGL,CAAU,IAAII,CAAQ;AAEzC,WACEH,EAAM,eAA+CC,CAAI,KACzDA,EAAK,SAASD,EAAM,WAEbH,EAAsBI,EAAK,MAAM,UAAUG,CAAO,IAGpD,CAAC,EAAE,MAAAH,GAAM,SAAAG,GAAS;AAAA,EAC3B,CAAC;AACH;AAOA,SAASC,GACPP,GACAQ,GACmB;AACnB,QAAMC,IAA4B,CAAA;AAClC,MAAIC,IAA6B,CAAA;AAEjC,QAAMC,IAAe,MAAM;AACzB,QAAI,CAACD,EAAQ,OAAQ;AAKrB,IAHuBA,EAAQ;AAAA,MAC7B,CAAC,EAAE,MAAAP,EAAA,MAAW,OAAOA,KAAS,YAAYA,EAAK,WAAW;AAAA,IAAA,IAG1DM,EAAO,KAAK,GAAGC,EAAQ,IAAI,CAAC,EAAE,MAAAP,EAAA,MAAWA,CAAI,CAAC,IAE9CM,EAAO;AAAA,MACL,gBAAAG;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,aAAU;AAAA,UACV,WAAWJ;AAAA,UAEV,YAAQ,IAAI,CAAC,EAAE,MAAAL,EAAA,MAAWA,CAAI;AAAA,QAAA;AAAA,QAJ1B,gBAAgBO,EAAQ,CAAC,EAAE,OAAO;AAAA,MAAA;AAAA,IAKzC,GAGJA,IAAU,CAAA;AAAA,EACZ;AAEA,aAAWG,KAASd,EAAsBC,CAAQ,GAAG;AACnD,QAAI,OAAOa,EAAM,QAAS,YAAY,OAAOA,EAAM,QAAS,UAAU;AACpE,MAAAH,EAAQ,KAAKG,CAAK;AAClB;AAAA,IACF;AAEA,IAAAF,EAAA,GACAF,EAAO;AAAA,MACLP,EAAM,eAAeW,EAAM,IAAI,IAC3BX,EAAM,aAAaW,EAAM,MAAM,EAAE,KAAKA,EAAM,QAAA,CAAS,IACrDA,EAAM;AAAA,IAAA;AAAA,EAEd;AACA,SAAAF,EAAA,GAEOF;AACT;AAwBO,MAAMK,KAASZ,EAAM;AAAA,EAC1B,SACE;AAAA,IACE,SAAAa,IAAU;AAAA,IACV,MAAAC,IAAO;AAAA,IACP,OAAAC,IAAQ;AAAA,IACR,aAAAC,IAAc;AAAA,IACd,WAAAC;AAAA,IACA,SAAAC,IAAU;AAAA,IACV,UAAApB;AAAA,IACA,GAAGqB;AAAA,EAAA,GAELC,GACA;AACA,UAAMC,IAAS1D,GAAA,GACT2D,IAKJN,KAAeH,MAAY,UACtB,GAAGA,CAAO,gBAIXA,GACAU,IAEJ;AAAA,MACE,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,WAAW;AAAA,MACX,MAAM;AAAA,MACN,WAAW;AAAA,IAAA,EAEbT,CAAI,GAEAU,IAAON,IAAUO,IAAO/D,IACxBgE,IAAUR,IACZpB,IACAO,GAAmBP,GAAUuB,EAAO,KAAK;AAE7C,WACE,gBAAAX;AAAA,MAACc;AAAA,MAAA;AAAA,QACC,KAAAJ;AAAA,QACA,aAAU;AAAA,QACJ,CAACO,CAAS,GAAG;AAAA,QACnB,WAAWC;AAAA,UACTP,EAAO;AAAA,UACPA,EAAOC,CAAW;AAAA,UAClBD,EAAOE,CAAQ;AAAA,UACfF,EAAON,CAAK;AAAA,UACZE;AAAA,QAAA;AAAA,QAED,GAAGE;AAAA,QAEH,UAAAO;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/components/callout/callout.js CHANGED Viewed

@@ -1,12 +1,12 @@
 import { jsx as n, jsxs as k } from "react/jsx-runtime";
 import * as a from "react";
-import { mergeClasses as m, SLOT_ATTR as C, shorthands as I } from "@epilot/zenith-runtime/v1";
+import { mergeClasses as m, SLOT_ATTR as C, shorthands as w } from "@epilot/zenith-runtime/v1";
 import { makeZenithStyles as V } from "../../styles/make-styles.js";
-import { spacingGroup2 as w, spacingLayout1 as y, spacingElement2 as v, spacingLayout2 as E, leadingSm as S, textSm as R, fontWeightSemibold as N, leadingBase as $, textBase as j, spacingElement3 as c, spacingElement1 as z } from "../../tokens/index.js";
-import { ClearButton as G } from "../../lib/clear-button.js";
-import { CloseIcon as H } from "../../lib/icons.js";
-import { NS as W } from "../../tokens/core.meta.generated.js";
-const A = a.forwardRef(
+import { spacingGroup2 as v, spacingLayout1 as y, spacingElement2 as x, spacingLayout2 as E, leadingSm as S, textSm as R, fontWeightSemibold as N, leadingBase as $, textBase as j, spacingElement3 as c, spacingElement1 as z, radiusXl as G } from "../../tokens/index.js";
+import { ClearButton as H } from "../../lib/clear-button.js";
+import { CloseIcon as W } from "../../lib/icons.js";
+import { NS as A } from "../../tokens/core.meta.generated.js";
+const O = a.forwardRef(
   function(o, t) {
     return /* @__PURE__ */ n(
       "svg",
@@ -20,7 +20,7 @@ const A = a.forwardRef(
       }
     );
   }
-), O = a.forwardRef(function(o, t) {
+), _ = a.forwardRef(function(o, t) {
   return /* @__PURE__ */ n(
     "svg",
     {
@@ -32,7 +32,7 @@ const A = a.forwardRef(
       children: /* @__PURE__ */ n("path", { d: "M3.4255 20.5C3.256 20.5 3.10375 20.4586 2.96875 20.3757C2.83375 20.2929 2.72883 20.1837 2.654 20.048C2.576 19.9133 2.53308 19.7675 2.52525 19.6105C2.51742 19.4535 2.55975 19.298 2.65225 19.144L11.213 4.356C11.3057 4.202 11.4215 4.08817 11.5605 4.0145C11.6997 3.94083 11.8462 3.904 12 3.904C12.1538 3.904 12.3003 3.94083 12.4395 4.0145C12.5785 4.08817 12.6943 4.202 12.787 4.356L21.3477 19.144C21.4402 19.298 21.4826 19.4535 21.4747 19.6105C21.4669 19.7675 21.424 19.9133 21.346 20.048C21.2712 20.1837 21.1663 20.2929 21.0313 20.3757C20.8963 20.4586 20.744 20.5 20.5745 20.5H3.4255ZM12 17.8077C12.2288 17.8077 12.4207 17.7303 12.5755 17.5755C12.7303 17.4207 12.8078 17.2288 12.8078 17C12.8078 16.7712 12.7303 16.5793 12.5755 16.4245C12.4207 16.2697 12.2288 16.1923 12 16.1923C11.7712 16.1923 11.5793 16.2697 11.4245 16.4245C11.2697 16.5793 11.1923 16.7712 11.1923 17C11.1923 17.2288 11.2697 17.4207 11.4245 17.5755C11.5793 17.7303 11.7712 17.8077 12 17.8077ZM12.0003 15.1923C12.2129 15.1923 12.391 15.1204 12.5345 14.9768C12.6782 14.8329 12.75 14.6548 12.75 14.4423V10.9423C12.75 10.7298 12.6781 10.5517 12.5342 10.408C12.3904 10.2642 12.2122 10.1923 11.9997 10.1923C11.7871 10.1923 11.609 10.2642 11.4655 10.408C11.3218 10.5517 11.25 10.7298 11.25 10.9423V14.4423C11.25 14.6548 11.3219 14.8329 11.4658 14.9768C11.6096 15.1204 11.7878 15.1923 12.0003 15.1923Z" })
     }
   );
-}), _ = a.forwardRef(
+}), F = a.forwardRef(
   function(o, t) {
     return /* @__PURE__ */ n(
       "svg",
@@ -46,7 +46,7 @@ const A = a.forwardRef(
       }
     );
   }
-), F = a.forwardRef(
+), P = a.forwardRef(
   function(o, t) {
     return /* @__PURE__ */ n(
       "svg",
@@ -60,10 +60,10 @@ const A = a.forwardRef(
       }
     );
   }
-), x = a.createContext({
+), I = a.createContext({
   variant: "info",
   hideIcon: !1
-}), u = "--zenith-callout-bg", d = "--zenith-callout-fg", l = (i, o) => `var(--zenith-${W}-sem-${i}-${o})`, P = {
+}), u = "--zenith-callout-bg", d = "--zenith-callout-fg", l = (i, o) => `var(--zenith-${A}-${i}-${o})`, X = {
   info: () => ({
     [u]: l("accent", "soft"),
     [d]: l("accent", "default")
@@ -88,6 +88,8 @@ const A = a.forwardRef(
   root: {
     position: "relative",
     width: "100%",
+    // v1 `rounded-xl`, the same radius as Card so the two agree side by side.
+    ...w.borderRadius(G),
     // p-3 — no token for 0.75rem.
     paddingTop: c,
     paddingRight: c,
@@ -130,12 +132,12 @@ const A = a.forwardRef(
   },
   title: {
     gridColumnStart: 2,
-    ...I.overflow("hidden"),
+    ...w.overflow("hidden"),
     display: "-webkit-box",
     WebkitBoxOrient: "vertical",
     WebkitLineClamp: 1,
     // min-h-4
-    minHeight: w,
+    minHeight: v,
     fontSize: j,
     lineHeight: $,
     fontWeight: N
@@ -144,7 +146,7 @@ const A = a.forwardRef(
     gridColumnStart: 2,
     display: "grid",
     justifyItems: "start",
-    ...I.gap(z),
+    ...w.gap(z),
     fontSize: R,
     lineHeight: S,
     "& p": {
@@ -157,7 +159,7 @@ const A = a.forwardRef(
     width: "100%",
     gridColumnEnd: "span 3",
     // mt-2
-    marginTop: v
+    marginTop: x
   },
   actionStart: {
     justifyContent: "flex-start"
@@ -173,18 +175,18 @@ const A = a.forwardRef(
   dismiss: {
     position: "absolute",
     // top-2 right-2
-    top: v,
-    right: v,
+    top: x,
+    right: x,
     // size-6 — the ClearButton itself supplies centering, rounding, hover and focus.
     width: y,
     height: y
   },
   dismissIcon: {
     // size-4
-    width: w,
-    height: w
+    width: v,
+    height: v
   }
-}), o1 = a.forwardRef(
+}), n1 = a.forwardRef(
   function({
     className: o,
     variant: t = "info",
@@ -196,13 +198,13 @@ const A = a.forwardRef(
     children: L,
     ...T
   }, Z) {
-    const [M, b] = a.useState(!0), g = h();
-    if (!M)
+    const [b, M] = a.useState(!0), g = h();
+    if (!b)
       return null;
     const B = () => {
-      b(!1), s == null || s();
+      M(!1), s == null || s();
     };
-    return /* @__PURE__ */ n(x.Provider, { value: { variant: t, hideIcon: e }, children: /* @__PURE__ */ k(
+    return /* @__PURE__ */ n(I.Provider, { value: { variant: t, hideIcon: e }, children: /* @__PURE__ */ k(
       "div",
       {
         ref: Z,
@@ -217,25 +219,25 @@ const A = a.forwardRef(
           f && g.dismissible,
           o
         ),
-        style: { ...P[t](), ...p },
+        style: { ...X[t](), ...p },
         ...T,
         children: [
           !e && /* @__PURE__ */ n(D, { customIcon: r }),
           L,
           f && /* @__PURE__ */ n(
-            G,
+            H,
             {
               label: "Dismiss",
               onClick: B,
               className: g.dismiss,
-              children: /* @__PURE__ */ n(H, { className: g.dismissIcon })
+              children: /* @__PURE__ */ n(W, { className: g.dismissIcon })
             }
           )
         ]
       }
     ) });
   }
-), n1 = a.forwardRef(
+), e1 = a.forwardRef(
   function({ className: o, ...t }, e) {
     const r = h();
     return /* @__PURE__ */ n(
@@ -249,7 +251,7 @@ const A = a.forwardRef(
       }
     );
   }
-), e1 = a.forwardRef(function({ className: o, ...t }, e) {
+), a1 = a.forwardRef(function({ className: o, ...t }, e) {
   const r = h();
   return /* @__PURE__ */ n(
     "div",
@@ -261,8 +263,8 @@ const A = a.forwardRef(
       ...t
     }
   );
-}), a1 = a.forwardRef(function({ className: o, align: t = "start", ...e }, r) {
-  const { hideIcon: f } = a.useContext(x), s = h(), p = t === "end" ? s.actionEnd : f ? s.actionStart : s.actionStartIcon;
+}), i1 = a.forwardRef(function({ className: o, align: t = "start", ...e }, r) {
+  const { hideIcon: f } = a.useContext(I), s = h(), p = t === "end" ? s.actionEnd : f ? s.actionStart : s.actionStartIcon;
   return /* @__PURE__ */ n(
     "div",
     {
@@ -275,18 +277,18 @@ const A = a.forwardRef(
     }
   );
 }), q = a.forwardRef(function({ customIcon: o, ...t }, e) {
-  const { variant: r } = a.useContext(x);
+  const { variant: r } = a.useContext(I);
   if (o)
     return o;
   switch (r) {
     case "info":
-      return /* @__PURE__ */ n(A, { ref: e, ...t });
+      return /* @__PURE__ */ n(O, { ref: e, ...t });
     case "success":
-      return /* @__PURE__ */ n(_, { ref: e, ...t });
+      return /* @__PURE__ */ n(F, { ref: e, ...t });
     case "warning":
-      return /* @__PURE__ */ n(O, { ref: e, ...t });
+      return /* @__PURE__ */ n(_, { ref: e, ...t });
     case "destructive":
-      return /* @__PURE__ */ n(F, { ref: e, ...t });
+      return /* @__PURE__ */ n(P, { ref: e, ...t });
   }
   return null;
 }), D = a.forwardRef(
@@ -305,9 +307,9 @@ const A = a.forwardRef(
   }
 );
 export {
-  o1 as Callout,
-  a1 as CalloutAction,
-  e1 as CalloutDescription,
-  n1 as CalloutTitle
+  n1 as Callout,
+  i1 as CalloutAction,
+  a1 as CalloutDescription,
+  e1 as CalloutTitle
 };
 //# sourceMappingURL=callout.js.map