@kanzo-tech/ui 0.10.0 → 0.11.0

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/layouts/empty.d.ts

@@ -0,0 +1,54 @@
+import { ark } from '@ark-ui/react/factory';
+import { ComponentProps } from 'react';
+import { VariantProps } from 'tailwind-variants';
+/** Fills the region it sits in and centres what it holds, on both axes. */
+export declare function EmptyRoot({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace EmptyRoot {
+    var displayName: string;
+}
+/** Indicator, title and description as one block: a tighter gap than the root's, and a reading
+ *  measure. Without it the root's `gap-6` would fall between the title and its own sentence. */
+export declare function EmptyHeader({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace EmptyHeader {
+    var displayName: string;
+}
+declare const emptyIndicatorVariants: import('tailwind-variants').TVReturnType<{
+    variant: {
+        default: string;
+        icon: string;
+    };
+}, undefined, "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", {
+    variant: {
+        default: string;
+        icon: string;
+    };
+}, undefined, import('tailwind-variants').TVReturnType<{
+    variant: {
+        default: string;
+        icon: string;
+    };
+}, undefined, "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0", unknown, unknown, undefined>>;
+export interface EmptyIndicatorProps extends ComponentProps<typeof ark.div>, VariantProps<typeof emptyIndicatorVariants> {
+}
+/** The icon or image above the title. `icon` sets the glyph on a muted tile; `default` leaves an
+ *  avatar or an illustration as it is. */
+export declare function EmptyIndicator({ variant, className, slot, ...rest }: EmptyIndicatorProps): import("react").JSX.Element;
+export declare namespace EmptyIndicator {
+    var displayName: string;
+}
+/** A `div` by default: only the call site knows the outline, so a heading is `asChild` onto one. */
+export declare function EmptyTitle({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace EmptyTitle {
+    var displayName: string;
+}
+export declare function EmptyDescription({ className, slot, ...rest }: ComponentProps<typeof ark.p>): import("react").JSX.Element;
+export declare namespace EmptyDescription {
+    var displayName: string;
+}
+/** What the reader can do about it — actions, a link, a search field. */
+export declare function EmptyContent({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace EmptyContent {
+    var displayName: string;
+}
+export {};
+//# sourceMappingURL=empty.d.ts.map

package/dist/layouts/empty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.d.ts","sourceRoot":"","sources":["../../src/layouts/empty.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAO1D,2EAA2E;AAC3E,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BAWrF;yBAXe,SAAS;;;AAczB;gGACgG;AAChG,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BAQvF;yBARe,WAAW;;;AAW3B,QAAA,MAAM,sBAAsB;;;;;;;;;;;;;;;0IAS1B,CAAC;AAEH,MAAM,WAAW,mBACf,SAAQ,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,EACpC,YAAY,CAAC,OAAO,sBAAsB,CAAC;CAAG;AAElD;0CAC0C;AAC1C,wBAAgB,cAAc,CAAC,EAAE,OAAmB,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,mBAAmB,+BASpG;yBATe,cAAc;;;AAY9B,oGAAoG;AACpG,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BAQtF;yBARe,UAAU;;;AAW1B,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,+BAW1F;yBAXe,gBAAgB;;;AAchC,yEAAyE;AACzE,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BAWxF;yBAXe,YAAY"}

package/dist/layouts/empty.js

@@ -0,0 +1,99 @@
+import { jsx as n } from "react/jsx-runtime";
+import { ark as r } from "@ark-ui/react/factory";
+import { tv as s } from "tailwind-variants";
+import { cn as i } from "../lib/cn.js";
+function o({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ n(
+    r.div,
+    {
+      className: i(
+        "flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12",
+        t
+      ),
+      ...a,
+      "data-slot": e ?? "empty"
+    }
+  );
+}
+o.displayName = "EmptyRoot";
+function l({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ n(
+    r.div,
+    {
+      className: i("flex max-w-sm flex-col items-center gap-2 text-center", t),
+      ...a,
+      "data-slot": e ?? "empty-header"
+    }
+  );
+}
+l.displayName = "EmptyHeader";
+const d = s({
+  base: "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
+  variants: {
+    variant: {
+      default: "bg-transparent",
+      icon: "size-10 rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6"
+    }
+  },
+  defaultVariants: { variant: "default" }
+});
+function p({ variant: t = "default", className: e, slot: a, ...m }) {
+  return /* @__PURE__ */ n(
+    r.div,
+    {
+      className: i(d({ variant: t }), e),
+      "data-variant": t,
+      ...m,
+      "data-slot": a ?? "empty-indicator"
+    }
+  );
+}
+p.displayName = "EmptyIndicator";
+function c({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ n(
+    r.div,
+    {
+      className: i("font-medium text-lg tracking-tight", t),
+      ...a,
+      "data-slot": e ?? "empty-title"
+    }
+  );
+}
+c.displayName = "EmptyTitle";
+function f({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ n(
+    r.p,
+    {
+      className: i(
+        "text-muted-foreground text-sm/relaxed [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4",
+        t
+      ),
+      ...a,
+      "data-slot": e ?? "empty-description"
+    }
+  );
+}
+f.displayName = "EmptyDescription";
+function u({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ n(
+    r.div,
+    {
+      className: i(
+        "flex w-full min-w-0 max-w-sm flex-col items-center gap-4 text-balance text-sm",
+        t
+      ),
+      ...a,
+      "data-slot": e ?? "empty-content"
+    }
+  );
+}
+u.displayName = "EmptyContent";
+export {
+  u as EmptyContent,
+  f as EmptyDescription,
+  l as EmptyHeader,
+  p as EmptyIndicator,
+  o as EmptyRoot,
+  c as EmptyTitle
+};
+//# sourceMappingURL=empty.js.map

package/dist/layouts/empty.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty.js","sources":["../../src/layouts/empty.tsx"],"sourcesContent":["import { ark } from \"@ark-ui/react/factory\";\nimport type { ComponentProps } from \"react\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\nimport { cn } from \"../lib/cn.js\";\n\n// The zero state of a region: shadcn v4's `Empty` anatomy, under Ark's part vocabulary. Ark ships\n// no empty-state machine, so every part is presentational and carries no role — it is not a list\n// item, and it was being built from `Item`, whose `role=\"listitem\"` said it was.\n\n/** Fills the region it sits in and centres what it holds, on both axes. */\nexport function EmptyRoot({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\n        \"flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12\",\n        className,\n      )}\n      {...rest}\n      data-slot={slot ?? \"empty\"}\n    />\n  );\n}\nEmptyRoot.displayName = \"EmptyRoot\";\n\n/** Indicator, title and description as one block: a tighter gap than the root's, and a reading\n *  measure. Without it the root's `gap-6` would fall between the title and its own sentence. */\nexport function EmptyHeader({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"flex max-w-sm flex-col items-center gap-2 text-center\", className)}\n      {...rest}\n      data-slot={slot ?? \"empty-header\"}\n    />\n  );\n}\nEmptyHeader.displayName = \"EmptyHeader\";\n\nconst emptyIndicatorVariants = tv({\n  base: \"mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  variants: {\n    variant: {\n      default: \"bg-transparent\",\n      icon: \"size-10 rounded-lg bg-muted text-foreground [&_svg:not([class*='size-'])]:size-6\",\n    },\n  },\n  defaultVariants: { variant: \"default\" },\n});\n\nexport interface EmptyIndicatorProps\n  extends ComponentProps<typeof ark.div>,\n    VariantProps<typeof emptyIndicatorVariants> {}\n\n/** The icon or image above the title. `icon` sets the glyph on a muted tile; `default` leaves an\n *  avatar or an illustration as it is. */\nexport function EmptyIndicator({ variant = \"default\", className, slot, ...rest }: EmptyIndicatorProps) {\n  return (\n    <ark.div\n      className={cn(emptyIndicatorVariants({ variant }), className)}\n      data-variant={variant}\n      {...rest}\n      data-slot={slot ?? \"empty-indicator\"}\n    />\n  );\n}\nEmptyIndicator.displayName = \"EmptyIndicator\";\n\n/** A `div` by default: only the call site knows the outline, so a heading is `asChild` onto one. */\nexport function EmptyTitle({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"font-medium text-lg tracking-tight\", className)}\n      {...rest}\n      data-slot={slot ?? \"empty-title\"}\n    />\n  );\n}\nEmptyTitle.displayName = \"EmptyTitle\";\n\nexport function EmptyDescription({ className, slot, ...rest }: ComponentProps<typeof ark.p>) {\n  return (\n    <ark.p\n      className={cn(\n        \"text-muted-foreground text-sm/relaxed [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className,\n      )}\n      {...rest}\n      data-slot={slot ?? \"empty-description\"}\n    />\n  );\n}\nEmptyDescription.displayName = \"EmptyDescription\";\n\n/** What the reader can do about it — actions, a link, a search field. */\nexport function EmptyContent({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\n        \"flex w-full min-w-0 max-w-sm flex-col items-center gap-4 text-balance text-sm\",\n        className,\n      )}\n      {...rest}\n      data-slot={slot ?? \"empty-content\"}\n    />\n  );\n}\nEmptyContent.displayName = \"EmptyContent\";\n"],"names":["EmptyRoot","className","slot","rest","jsx","ark","cn","EmptyHeader","emptyIndicatorVariants","tv","EmptyIndicator","variant","EmptyTitle","EmptyDescription","EmptyContent"],"mappings":";;;;AAUO,SAASA,EAAU,EAAE,WAAAC,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AACtF,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAF,EAAU,cAAc;AAIjB,SAASO,EAAY,EAAE,WAAAN,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AACxF,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC,EAAG,yDAAyDL,CAAS;AAAA,MAC/E,GAAGE;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAK,EAAY,cAAc;AAE1B,MAAMC,IAAyBC,EAAG;AAAA,EAChC,MAAM;AAAA,EACN,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,iBAAiB,EAAE,SAAS,UAAA;AAC9B,CAAC;AAQM,SAASC,EAAe,EAAE,SAAAC,IAAU,WAAW,WAAAV,GAAW,MAAAC,GAAM,GAAGC,KAA6B;AACrG,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC,EAAGE,EAAuB,EAAE,SAAAG,EAAA,CAAS,GAAGV,CAAS;AAAA,MAC5D,gBAAcU;AAAA,MACb,GAAGR;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAQ,EAAe,cAAc;AAGtB,SAASE,EAAW,EAAE,WAAAX,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AACvF,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC,EAAG,sCAAsCL,CAAS;AAAA,MAC5D,GAAGE;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAU,EAAW,cAAc;AAElB,SAASC,EAAiB,EAAE,WAAAZ,GAAW,MAAAC,GAAM,GAAGC,KAAsC;AAC3F,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAW,EAAiB,cAAc;AAGxB,SAASC,EAAa,EAAE,WAAAb,GAAW,MAAAC,GAAM,GAAGC,KAAwC;AACzF,SACE,gBAAAC;AAAA,IAACC,EAAI;AAAA,IAAJ;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MACJ,aAAWD,KAAQ;AAAA,IAAA;AAAA,EAAA;AAGzB;AACAY,EAAa,cAAc;"}

package/dist/layouts/gated.d.ts

@@ -0,0 +1,24 @@
+import { ark } from '@ark-ui/react/factory';
+import { ComponentProps } from 'react';
+import { Badge } from '../simples/badge.js';
+import { FloatProps } from '../simples/float.js';
+export declare function GatedRoot({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace GatedRoot {
+    var displayName: string;
+}
+/** Takes what it holds out of focus, pointer and the accessibility tree, and mutes it. `inert`
+ *  already hit-tests as `pointer-events: none`, so the class is not repeated. */
+export declare function GatedContent({ className, slot, ...rest }: ComponentProps<typeof ark.div>): import("react").JSX.Element;
+export declare namespace GatedContent {
+    var displayName: string;
+}
+export interface GatedBadgeProps extends ComponentProps<typeof Badge> {
+    /** @default "top-end" */
+    placement?: FloatProps["placement"];
+}
+/** The reason, as a `Badge` pinned to a corner of the root. It is what describes the root. */
+export declare function GatedBadge({ placement, slot, ...rest }: GatedBadgeProps): import("react").JSX.Element;
+export declare namespace GatedBadge {
+    var displayName: string;
+}
+//# sourceMappingURL=gated.d.ts.map

package/dist/layouts/gated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"gated.d.ts","sourceRoot":"","sources":["../../src/layouts/gated.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EAAoC,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAE9E,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAe7D,wBAAgB,SAAS,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BAarF;yBAbe,SAAS;;;AAgBzB;iFACiF;AACjF,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,+BASxF;yBATe,YAAY;;;AAkB5B,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,OAAO,KAAK,CAAC;IACnE,yBAAyB;IACzB,SAAS,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;CACrC;AAED,8FAA8F;AAC9F,wBAAgB,UAAU,CAAC,EAAE,SAAqB,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAOnF;yBAPe,UAAU"}

package/dist/layouts/gated.js

@@ -0,0 +1,46 @@
+"use client";
+import { jsx as o } from "react/jsx-runtime";
+import { ark as r } from "@ark-ui/react/factory";
+import { useContext as s, useId as m, createContext as c } from "react";
+import { cn as n } from "../lib/cn.js";
+import { Badge as l } from "../simples/badge.js";
+import { Float as p } from "../simples/float.js";
+const i = c(void 0);
+function u({ className: t, slot: e, ...a }) {
+  const d = m();
+  return /* @__PURE__ */ o(i.Provider, { value: d, children: /* @__PURE__ */ o(
+    r.div,
+    {
+      role: "group",
+      "aria-describedby": d,
+      className: n("relative", t),
+      ...a,
+      "data-slot": e ?? "gated"
+    }
+  ) });
+}
+u.displayName = "GatedRoot";
+function f({ className: t, slot: e, ...a }) {
+  return /* @__PURE__ */ o(
+    r.div,
+    {
+      className: n("opacity-64", t),
+      inert: !0,
+      ...a,
+      "data-slot": e ?? "gated-content"
+    }
+  );
+}
+f.displayName = "GatedContent";
+const g = "data-[placement^=top]:-top-2 data-[placement^=bottom]:-bottom-2 data-[placement$=start]:-start-2 data-[placement$=end]:-end-2";
+function v({ placement: t = "top-end", slot: e, ...a }) {
+  const d = s(i);
+  return /* @__PURE__ */ o(p, { className: g, placement: t, children: /* @__PURE__ */ o(l, { id: d, size: "xs", variant: "secondary", ...a, slot: e ?? "gated-badge" }) });
+}
+v.displayName = "GatedBadge";
+export {
+  v as GatedBadge,
+  f as GatedContent,
+  u as GatedRoot
+};
+//# sourceMappingURL=gated.js.map

package/dist/layouts/gated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gated.js","sources":["../../src/layouts/gated.tsx"],"sourcesContent":["\"use client\";\n\nimport { ark } from \"@ark-ui/react/factory\";\nimport { createContext, useContext, useId, type ComponentProps } from \"react\";\nimport { cn } from \"../lib/cn.js\";\nimport { Badge } from \"../simples/badge.js\";\nimport { Float, type FloatProps } from \"../simples/float.js\";\n\n// A region shown but not yet usable. Ark ships nothing for it, so the ARIA contract is ours:\n//\n// - `GatedContent` is `inert`. Per HTML, inert content is unfocusable, is hit-tested as if it had\n//   `pointer-events: none`, and is withheld from the accessibility tree — it is NOT readable to a\n//   screen reader, which is what `aria-hidden` would have done too.\n// - So `GatedBadge` is the only readable part: plain text, outside the inert subtree, in reading\n//   order after the content it replaces.\n// - `GatedRoot` is `role=\"group\"`, described by the badge. Name it with `aria-label` after the\n//   feature — the visible title is inside the inert subtree and cannot name anything — and a\n//   screen reader announces \"Scheduled runs, group, Coming soon\" where the region was.\n\nconst GatedContext = createContext<string | undefined>(undefined);\n\nexport function GatedRoot({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  const id = useId();\n  return (\n    <GatedContext.Provider value={id}>\n      <ark.div\n        role=\"group\"\n        aria-describedby={id}\n        className={cn(\"relative\", className)}\n        {...rest}\n        data-slot={slot ?? \"gated\"}\n      />\n    </GatedContext.Provider>\n  );\n}\nGatedRoot.displayName = \"GatedRoot\";\n\n/** Takes what it holds out of focus, pointer and the accessibility tree, and mutes it. `inert`\n *  already hit-tests as `pointer-events: none`, so the class is not repeated. */\nexport function GatedContent({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"opacity-64\", className)}\n      inert\n      {...rest}\n      data-slot={slot ?? \"gated-content\"}\n    />\n  );\n}\nGatedContent.displayName = \"GatedContent\";\n\n// Straddles the edge it is pinned to by half an `xs` badge, read off `Float`'s own\n// `data-placement`. It overhangs the root, so leave room with MARGIN on the root: padding would move\n// the content and leave the badge where it was.\nconst straddle =\n  \"data-[placement^=top]:-top-2 data-[placement^=bottom]:-bottom-2 data-[placement$=start]:-start-2 data-[placement$=end]:-end-2\";\n\nexport interface GatedBadgeProps extends ComponentProps<typeof Badge> {\n  /** @default \"top-end\" */\n  placement?: FloatProps[\"placement\"];\n}\n\n/** The reason, as a `Badge` pinned to a corner of the root. It is what describes the root. */\nexport function GatedBadge({ placement = \"top-end\", slot, ...rest }: GatedBadgeProps) {\n  const id = useContext(GatedContext);\n  return (\n    <Float className={straddle} placement={placement}>\n      <Badge id={id} size=\"xs\" variant=\"secondary\" {...rest} slot={slot ?? \"gated-badge\"} />\n    </Float>\n  );\n}\nGatedBadge.displayName = \"GatedBadge\";\n"],"names":["GatedRoot","GatedContent","GatedBadge"],"mappings":";;;;;;;AAmBA;AAEO;AACL;AACA;AAEI;AAAK;AAAJ;AACM;AACa;AACiB;AAC/B;AACe;AAAA;AAI3B;AACAA;AAIO;AACL;AACE;AAAK;AAAJ;AACsC;AAChC;AACD;AACe;AAAA;AAGzB;AACAC;AAKA;AASO;AACL;AACA;AAKF;AACAC;;;;;;"}

package/dist/layouts/section.d.ts

@@ -21,10 +21,35 @@ import { VariantProps } from 'tailwind-variants';
  * Parts are FLAT exports. Statics are lost when a module becomes a client reference under RSC,
  * so `Section.Header` would read back as `undefined` — a bug we hit for real with `Preferences`.
  */
-export declare const sectionVariants: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "flex min-h-0 flex-1 flex-col", {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "flex min-h-0 flex-1 flex-col", unknown, unknown, undefined>>;
+export declare const sectionVariants: import('tailwind-variants').TVReturnType<{
+    /** `true` fills the region it sits in and scrolls its body — one section per region.
+     *  `false` takes its content's height, so several stack in one scrolling pane: the body
+     *  reads it off `data-fill` and stops scrolling on its own. */
+    fill: {
+        true: string;
+        false: string;
+    };
+}, undefined, "group/section flex min-h-0 flex-col", {
+    /** `true` fills the region it sits in and scrolls its body — one section per region.
+     *  `false` takes its content's height, so several stack in one scrolling pane: the body
+     *  reads it off `data-fill` and stops scrolling on its own. */
+    fill: {
+        true: string;
+        false: string;
+    };
+}, undefined, import('tailwind-variants').TVReturnType<{
+    /** `true` fills the region it sits in and scrolls its body — one section per region.
+     *  `false` takes its content's height, so several stack in one scrolling pane: the body
+     *  reads it off `data-fill` and stops scrolling on its own. */
+    fill: {
+        true: string;
+        false: string;
+    };
+}, undefined, "group/section flex min-h-0 flex-col", unknown, unknown, undefined>>;
 /** The container. Presentational — the scale lives on the parts that render text. */
-export type SectionRootProps = ComponentProps<typeof ark.div>;
-export declare function SectionRoot({ className, slot, ...rest }: SectionRootProps): import("react").JSX.Element;
+export interface SectionRootProps extends ComponentProps<typeof ark.div>, VariantProps<typeof sectionVariants> {
+}
+export declare function SectionRoot({ className, fill, slot, ...rest }: SectionRootProps): import("react").JSX.Element;
 export declare namespace SectionRoot {
     var displayName: string;
 }
@@ -134,7 +159,7 @@ declare const sectionBodyVariants: import('tailwind-variants').TVReturnType<{
         page: string;
         section: string;
     };
-}, undefined, "flex min-h-0 flex-1 flex-col gap-4 overflow-auto", {
+}, undefined, string[], {
     scale: {
         page: string;
         section: string;
@@ -144,7 +169,7 @@ declare const sectionBodyVariants: import('tailwind-variants').TVReturnType<{
         page: string;
         section: string;
     };
-}, undefined, "flex min-h-0 flex-1 flex-col gap-4 overflow-auto", unknown, unknown, undefined>>;
+}, undefined, string[], unknown, unknown, undefined>>;
 export interface SectionBodyProps extends ComponentProps<typeof ark.section>, VariantProps<typeof sectionBodyVariants> {
 }
 /**

package/dist/layouts/section.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"section.d.ts","sourceRoot":"","sources":["../../src/layouts/section.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"section.d.ts","sourceRoot":"","sources":["../../src/layouts/section.tsx"],"names":[],"mappings":"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"}

package/dist/layouts/section.js

@@ -1,15 +1,30 @@
 import { jsx as a } from "react/jsx-runtime";
-import { ark as i } from "@ark-ui/react/factory";
+import { ark as n } from "@ark-ui/react/factory";
 import { tv as r } from "tailwind-variants";
-import { cn as n } from "../lib/cn.js";
+import { cn as i } from "../lib/cn.js";
 const d = r({
-  base: "flex min-h-0 flex-1 flex-col"
+  base: "group/section flex min-h-0 flex-col",
+  variants: {
+    /** `true` fills the region it sits in and scrolls its body — one section per region.
+     *  `false` takes its content's height, so several stack in one scrolling pane: the body
+     *  reads it off `data-fill` and stops scrolling on its own. */
+    fill: { true: "flex-1", false: "flex-none" }
+  },
+  defaultVariants: { fill: !0 }
 });
-function m({ className: e, slot: t, ...o }) {
-  return /* @__PURE__ */ a(i.div, { className: n(d(), e), ...o, "data-slot": t ?? "section" });
+function f({ className: t, fill: e = !0, slot: o, ...s }) {
+  return /* @__PURE__ */ a(
+    n.div,
+    {
+      className: i(d({ fill: e }), t),
+      ...s,
+      "data-fill": e,
+      "data-slot": o ?? "section"
+    }
+  );
 }
-m.displayName = "SectionRoot";
-const f = r({
+f.displayName = "SectionRoot";
+const u = r({
   base: "flex items-start gap-3",
   variants: {
     /** `page` is the top of a screen; `section` is a block within one. The difference is
@@ -24,40 +39,40 @@ const f = r({
   },
   defaultVariants: { scale: "section", bordered: !1 }
 });
-function p({ className: e, scale: t, bordered: o, slot: s, ...c }) {
+function m({ className: t, scale: e, bordered: o, slot: s, ...c }) {
   return /* @__PURE__ */ a(
-    i.header,
+    n.header,
     {
-      className: n(f({ scale: t, bordered: o }), e),
+      className: i(u({ scale: e, bordered: o }), t),
       ...c,
       "data-slot": s ?? "section-header"
     }
   );
 }
-p.displayName = "SectionHeader";
-function u({ className: e, slot: t, ...o }) {
+m.displayName = "SectionHeader";
+function p({ className: t, slot: e, ...o }) {
   return /* @__PURE__ */ a(
-    i.div,
+    n.div,
     {
-      className: n("mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-5", e),
+      className: i("mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-5", t),
       ...o,
-      "data-slot": t ?? "section-icon"
+      "data-slot": e ?? "section-icon"
     }
   );
 }
-u.displayName = "SectionIcon";
-function b({ className: e, slot: t, ...o }) {
+p.displayName = "SectionIcon";
+function x({ className: t, slot: e, ...o }) {
   return /* @__PURE__ */ a(
-    i.div,
+    n.div,
     {
-      className: n("min-w-0 flex-1", e),
+      className: i("min-w-0 flex-1", t),
       ...o,
-      "data-slot": t ?? "section-title-group"
+      "data-slot": e ?? "section-title-group"
     }
   );
 }
-b.displayName = "SectionTitleGroup";
-const x = r({
+x.displayName = "SectionTitleGroup";
+const b = r({
   base: "truncate text-foreground",
   variants: {
     scale: {
@@ -67,87 +82,90 @@ const x = r({
   },
   defaultVariants: { scale: "section" }
 });
-function N({ level: e = 2, scale: t, className: o, slot: s, ...c }) {
-  const l = `h${e}`;
+function g({ level: t = 2, scale: e, className: o, slot: s, ...c }) {
+  const l = `h${t}`;
   return /* @__PURE__ */ a(
     l,
     {
-      className: n(x({ scale: t }), o),
+      className: i(b({ scale: e }), o),
       ...c,
       slot: s ?? "section-title"
     }
   );
 }
-N.displayName = "SectionTitle";
-function S({ className: e, slot: t, ...o }) {
+g.displayName = "SectionTitle";
+function N({ className: t, slot: e, ...o }) {
   return /* @__PURE__ */ a(
-    i.p,
+    n.p,
     {
-      className: n("mt-0.5 text-muted-foreground text-sm", e),
+      className: i("mt-0.5 text-muted-foreground text-sm", t),
       ...o,
-      "data-slot": t ?? "section-description"
+      "data-slot": e ?? "section-description"
     }
   );
 }
-S.displayName = "SectionDescription";
-function g({ className: e, slot: t, ...o }) {
+N.displayName = "SectionDescription";
+function S({ className: t, slot: e, ...o }) {
   return /* @__PURE__ */ a(
-    i.div,
+    n.div,
     {
-      className: n("ms-auto flex shrink-0 items-center gap-2 self-center", e),
+      className: i("ms-auto flex shrink-0 items-center gap-2 self-center", t),
       ...o,
-      "data-slot": t ?? "section-actions"
+      "data-slot": e ?? "section-actions"
     }
   );
 }
-g.displayName = "SectionActions";
+S.displayName = "SectionActions";
 const y = r({
-  base: "flex min-h-0 flex-1 flex-col gap-4 overflow-auto",
+  base: [
+    "flex min-h-0 flex-1 flex-col gap-4 overflow-auto",
+    "group-data-[fill=false]/section:flex-none group-data-[fill=false]/section:overflow-visible"
+  ],
   variants: {
     scale: { page: "p-4", section: "" }
   },
   defaultVariants: { scale: "section" }
 });
 function v({
-  className: e,
-  scale: t,
+  className: t,
+  scale: e,
   slot: o,
   ...s
 }) {
   return /* @__PURE__ */ a(
-    i.section,
+    n.section,
     {
-      className: n(y({ scale: t }), e),
+      className: i(y({ scale: e }), t),
       ...s,
       "data-slot": o ?? "section-body"
     }
   );
 }
 v.displayName = "SectionBody";
-function h({ className: e, slot: t, ...o }) {
+function h({ className: t, slot: e, ...o }) {
   return /* @__PURE__ */ a(
-    i.footer,
+    n.footer,
     {
-      className: n(
+      className: i(
         "flex shrink-0 items-center justify-between gap-2 border-t border-border bg-card px-4 py-3",
-        e
+        t
       ),
       ...o,
-      "data-slot": t ?? "section-footer"
+      "data-slot": e ?? "section-footer"
     }
   );
 }
 h.displayName = "SectionFooter";
 export {
-  g as SectionActions,
+  S as SectionActions,
   v as SectionBody,
-  S as SectionDescription,
+  N as SectionDescription,
   h as SectionFooter,
-  p as SectionHeader,
-  u as SectionIcon,
-  m as SectionRoot,
-  N as SectionTitle,
-  b as SectionTitleGroup,
+  m as SectionHeader,
+  p as SectionIcon,
+  f as SectionRoot,
+  g as SectionTitle,
+  x as SectionTitleGroup,
   d as sectionVariants
 };
 //# sourceMappingURL=section.js.map

package/dist/layouts/section.js.map

@@ -1 +1 @@
-{"version":3,"file":"section.js","sources":["../../src/layouts/section.tsx"],"sourcesContent":["import { ark } from \"@ark-ui/react/factory\";\nimport type { ComponentProps } from \"react\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\nimport { cn } from \"../lib/cn.js\";\n\n/**\n * Section — the content scaffolding that sits INSIDE a shell region.\n *\n * Different axis from `shell.tsx`: the Shell regions position the window, this positions the\n * content within them. They never compete, and a Section nests inside `ShellMain`.\n *\n * This is one vocabulary where there were three. `PageShell` (Header · Title · Description ·\n * Actions · Content · Footer), `SectionHeader` (Icon · Content · Title · Description ·\n * Actions) and `TopBarMain` (TitleGroup · Title · Subtitle · Actions) described the same row\n * — a heading with optional icon, supporting text and end-aligned controls — under three sets\n * of names. `scale` is what actually differed between them.\n *\n * NOT merged, deliberately: `CardHeader` and `DialogHeader` have this same shape but stay with\n * their components. A header wired to a machine belongs to that machine — `DialogHeader` wires\n * Ark's `aria-labelledby`. Precedent that the line is right: `TourHeader` *is* `DialogHeader`.\n * Sharing across machines is fine when the wiring is shared; merging layout with wiring is not.\n *\n * Parts are FLAT exports. Statics are lost when a module becomes a client reference under RSC,\n * so `Section.Header` would read back as `undefined` — a bug we hit for real with `Preferences`.\n */\n\nexport const sectionVariants = tv({\n  base: \"flex min-h-0 flex-1 flex-col\",\n});\n\n/** The container. Presentational — the scale lives on the parts that render text. */\nexport type SectionRootProps = ComponentProps<typeof ark.div>;\n\nexport function SectionRoot({ className, slot, ...rest }: SectionRootProps) {\n  return (\n    <ark.div className={cn(sectionVariants(), className)} {...rest} data-slot={slot ?? \"section\"} />\n  );\n}\nSectionRoot.displayName = \"SectionRoot\";\n\nconst sectionHeaderVariants = tv({\n  base: \"flex items-start gap-3\",\n  variants: {\n    /** `page` is the top of a screen; `section` is a block within one. The difference is\n     *  breathing room, and it is the only thing that ever really separated PageShellHeader\n     *  from SectionHeader. */\n    scale: {\n      page: \"px-4 pt-4 pb-2\",\n      section: \"\",\n    },\n    /** Draw a separator under the header. */\n    bordered: { true: \"border-b border-border pb-3\", false: \"\" },\n  },\n  defaultVariants: { scale: \"section\", bordered: false },\n});\n\nexport interface SectionHeaderProps\n  extends ComponentProps<typeof ark.header>,\n    VariantProps<typeof sectionHeaderVariants> {}\n\n/**\n * A flex row, not a grid. `PageShellHeader` used a two-column grid so its actions could span\n * both text rows; a flex row with a title group and `ms-auto` on the actions achieves the same\n * alignment, handles the optional icon that the grid could not, and mirrors under RTL without\n * a second code path.\n */\nexport function SectionHeader({ className, scale, bordered, slot, ...rest }: SectionHeaderProps) {\n  return (\n    <ark.header\n      className={cn(sectionHeaderVariants({ scale, bordered }), className)}\n      {...rest}\n      data-slot={slot ?? \"section-header\"}\n    />\n  );\n}\nSectionHeader.displayName = \"SectionHeader\";\n\n/** Leading icon or badge. `mt-0.5` optically aligns it with the title's cap height. */\nexport function SectionIcon({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-5\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-icon\"}\n    />\n  );\n}\nSectionIcon.displayName = \"SectionIcon\";\n\n/** The text column: title over description. `min-w-0` is what lets the title truncate rather\n *  than pushing the actions off the row. */\nexport function SectionTitleGroup({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"min-w-0 flex-1\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-title-group\"}\n    />\n  );\n}\nSectionTitleGroup.displayName = \"SectionTitleGroup\";\n\nconst sectionTitleVariants = tv({\n  base: \"truncate text-foreground\",\n  variants: {\n    scale: {\n      page: \"text-lg font-bold\",\n      section: \"text-lg font-semibold\",\n    },\n  },\n  defaultVariants: { scale: \"section\" },\n});\n\nexport interface SectionTitleProps\n  extends Omit<ComponentProps<\"h2\">, \"ref\">,\n    VariantProps<typeof sectionTitleVariants> {\n  /** Heading level, so the title slots into the surrounding document outline. Default 2.\n   *  Kept SEPARATE from `scale`: how big it looks and where it sits in the outline are\n   *  different questions, and tying them would force a visual choice to change semantics. */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n}\n\nexport function SectionTitle({ level = 2, scale, className, slot, ...rest }: SectionTitleProps) {\n  const Title = `h${level}` as const;\n  return (\n    <Title\n      className={cn(sectionTitleVariants({ scale }), className)}\n      {...rest}\n      slot={slot ?? \"section-title\"}\n    />\n  );\n}\nSectionTitle.displayName = \"SectionTitle\";\n\n/** Supporting text under the title. Was `TopBarSubtitle` and `PageShellDescription` too. */\nexport function SectionDescription({ className, slot, ...rest }: ComponentProps<typeof ark.p>) {\n  return (\n    <ark.p\n      className={cn(\"mt-0.5 text-muted-foreground text-sm\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-description\"}\n    />\n  );\n}\nSectionDescription.displayName = \"SectionDescription\";\n\n/** End-aligned controls. `ms-auto` rather than the root's `justify-between`: with an optional\n *  icon and text column ahead of it, one logical margin pushes the actions to the inline end\n *  and still mirrors in RTL. */\nexport function SectionActions({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"ms-auto flex shrink-0 items-center gap-2 self-center\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-actions\"}\n    />\n  );\n}\nSectionActions.displayName = \"SectionActions\";\n\nconst sectionBodyVariants = tv({\n  base: \"flex min-h-0 flex-1 flex-col gap-4 overflow-auto\",\n  variants: {\n    scale: { page: \"p-4\", section: \"\" },\n  },\n  defaultVariants: { scale: \"section\" },\n});\n\nexport interface SectionBodyProps\n  extends ComponentProps<typeof ark.section>,\n    VariantProps<typeof sectionBodyVariants> {}\n\n/**\n * The content region. Renders `<section>`, NEVER `<main>` — a Section nests inside a shell\n * that already owns the page's single `<main>` landmark, and two of those are a conformance\n * error that also makes \"skip to main content\" ambiguous.\n */\nexport function SectionBody({\n  className,\n  scale,\n  slot,\n  ...rest\n}: SectionBodyProps) {\n  return (\n    <ark.section\n      className={cn(sectionBodyVariants({ scale }), className)}\n      {...rest}\n      data-slot={slot ?? \"section-body\"}\n    />\n  );\n}\nSectionBody.displayName = \"SectionBody\";\n\n/** Pinned footer — form actions, a save bar. Unlike the header it carries a surface, because\n *  it sits against the bottom of a scrolling body and needs to separate from it. */\nexport function SectionFooter({ className, slot, ...rest }: ComponentProps<typeof ark.footer>) {\n  return (\n    <ark.footer\n      className={cn(\n        \"flex shrink-0 items-center justify-between gap-2 border-t border-border bg-card px-4 py-3\",\n        className,\n      )}\n      {...rest}\n      data-slot={slot ?? \"section-footer\"}\n    />\n  );\n}\nSectionFooter.displayName = \"SectionFooter\";\n"],"names":["sectionVariants","tv","SectionRoot","className","slot","rest","jsx","ark","cn","sectionHeaderVariants","SectionHeader","scale","bordered","SectionIcon","SectionTitleGroup","sectionTitleVariants","SectionTitle","level","Title","SectionDescription","SectionActions","sectionBodyVariants","SectionBody","SectionFooter"],"mappings":"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"}
+{"version":3,"file":"section.js","sources":["../../src/layouts/section.tsx"],"sourcesContent":["import { ark } from \"@ark-ui/react/factory\";\nimport type { ComponentProps } from \"react\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\nimport { cn } from \"../lib/cn.js\";\n\n/**\n * Section — the content scaffolding that sits INSIDE a shell region.\n *\n * Different axis from `shell.tsx`: the Shell regions position the window, this positions the\n * content within them. They never compete, and a Section nests inside `ShellMain`.\n *\n * This is one vocabulary where there were three. `PageShell` (Header · Title · Description ·\n * Actions · Content · Footer), `SectionHeader` (Icon · Content · Title · Description ·\n * Actions) and `TopBarMain` (TitleGroup · Title · Subtitle · Actions) described the same row\n * — a heading with optional icon, supporting text and end-aligned controls — under three sets\n * of names. `scale` is what actually differed between them.\n *\n * NOT merged, deliberately: `CardHeader` and `DialogHeader` have this same shape but stay with\n * their components. A header wired to a machine belongs to that machine — `DialogHeader` wires\n * Ark's `aria-labelledby`. Precedent that the line is right: `TourHeader` *is* `DialogHeader`.\n * Sharing across machines is fine when the wiring is shared; merging layout with wiring is not.\n *\n * Parts are FLAT exports. Statics are lost when a module becomes a client reference under RSC,\n * so `Section.Header` would read back as `undefined` — a bug we hit for real with `Preferences`.\n */\n\nexport const sectionVariants = tv({\n  base: \"group/section flex min-h-0 flex-col\",\n  variants: {\n    /** `true` fills the region it sits in and scrolls its body — one section per region.\n     *  `false` takes its content's height, so several stack in one scrolling pane: the body\n     *  reads it off `data-fill` and stops scrolling on its own. */\n    fill: { true: \"flex-1\", false: \"flex-none\" },\n  },\n  defaultVariants: { fill: true },\n});\n\n/** The container. Presentational — the scale lives on the parts that render text. */\nexport interface SectionRootProps\n  extends ComponentProps<typeof ark.div>,\n    VariantProps<typeof sectionVariants> {}\n\nexport function SectionRoot({ className, fill = true, slot, ...rest }: SectionRootProps) {\n  return (\n    <ark.div\n      className={cn(sectionVariants({ fill }), className)}\n      {...rest}\n      data-fill={fill}\n      data-slot={slot ?? \"section\"}\n    />\n  );\n}\nSectionRoot.displayName = \"SectionRoot\";\n\nconst sectionHeaderVariants = tv({\n  base: \"flex items-start gap-3\",\n  variants: {\n    /** `page` is the top of a screen; `section` is a block within one. The difference is\n     *  breathing room, and it is the only thing that ever really separated PageShellHeader\n     *  from SectionHeader. */\n    scale: {\n      page: \"px-4 pt-4 pb-2\",\n      section: \"\",\n    },\n    /** Draw a separator under the header. */\n    bordered: { true: \"border-b border-border pb-3\", false: \"\" },\n  },\n  defaultVariants: { scale: \"section\", bordered: false },\n});\n\nexport interface SectionHeaderProps\n  extends ComponentProps<typeof ark.header>,\n    VariantProps<typeof sectionHeaderVariants> {}\n\n/**\n * A flex row, not a grid. `PageShellHeader` used a two-column grid so its actions could span\n * both text rows; a flex row with a title group and `ms-auto` on the actions achieves the same\n * alignment, handles the optional icon that the grid could not, and mirrors under RTL without\n * a second code path.\n */\nexport function SectionHeader({ className, scale, bordered, slot, ...rest }: SectionHeaderProps) {\n  return (\n    <ark.header\n      className={cn(sectionHeaderVariants({ scale, bordered }), className)}\n      {...rest}\n      data-slot={slot ?? \"section-header\"}\n    />\n  );\n}\nSectionHeader.displayName = \"SectionHeader\";\n\n/** Leading icon or badge. `mt-0.5` optically aligns it with the title's cap height. */\nexport function SectionIcon({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"mt-0.5 shrink-0 text-muted-foreground [&_svg]:size-5\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-icon\"}\n    />\n  );\n}\nSectionIcon.displayName = \"SectionIcon\";\n\n/** The text column: title over description. `min-w-0` is what lets the title truncate rather\n *  than pushing the actions off the row. */\nexport function SectionTitleGroup({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"min-w-0 flex-1\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-title-group\"}\n    />\n  );\n}\nSectionTitleGroup.displayName = \"SectionTitleGroup\";\n\nconst sectionTitleVariants = tv({\n  base: \"truncate text-foreground\",\n  variants: {\n    scale: {\n      page: \"text-lg font-bold\",\n      section: \"text-lg font-semibold\",\n    },\n  },\n  defaultVariants: { scale: \"section\" },\n});\n\nexport interface SectionTitleProps\n  extends Omit<ComponentProps<\"h2\">, \"ref\">,\n    VariantProps<typeof sectionTitleVariants> {\n  /** Heading level, so the title slots into the surrounding document outline. Default 2.\n   *  Kept SEPARATE from `scale`: how big it looks and where it sits in the outline are\n   *  different questions, and tying them would force a visual choice to change semantics. */\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n}\n\nexport function SectionTitle({ level = 2, scale, className, slot, ...rest }: SectionTitleProps) {\n  const Title = `h${level}` as const;\n  return (\n    <Title\n      className={cn(sectionTitleVariants({ scale }), className)}\n      {...rest}\n      slot={slot ?? \"section-title\"}\n    />\n  );\n}\nSectionTitle.displayName = \"SectionTitle\";\n\n/** Supporting text under the title. Was `TopBarSubtitle` and `PageShellDescription` too. */\nexport function SectionDescription({ className, slot, ...rest }: ComponentProps<typeof ark.p>) {\n  return (\n    <ark.p\n      className={cn(\"mt-0.5 text-muted-foreground text-sm\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-description\"}\n    />\n  );\n}\nSectionDescription.displayName = \"SectionDescription\";\n\n/** End-aligned controls. `ms-auto` rather than the root's `justify-between`: with an optional\n *  icon and text column ahead of it, one logical margin pushes the actions to the inline end\n *  and still mirrors in RTL. */\nexport function SectionActions({ className, slot, ...rest }: ComponentProps<typeof ark.div>) {\n  return (\n    <ark.div\n      className={cn(\"ms-auto flex shrink-0 items-center gap-2 self-center\", className)}\n      {...rest}\n      data-slot={slot ?? \"section-actions\"}\n    />\n  );\n}\nSectionActions.displayName = \"SectionActions\";\n\nconst sectionBodyVariants = tv({\n  base: [\n    \"flex min-h-0 flex-1 flex-col gap-4 overflow-auto\",\n    \"group-data-[fill=false]/section:flex-none group-data-[fill=false]/section:overflow-visible\",\n  ],\n  variants: {\n    scale: { page: \"p-4\", section: \"\" },\n  },\n  defaultVariants: { scale: \"section\" },\n});\n\nexport interface SectionBodyProps\n  extends ComponentProps<typeof ark.section>,\n    VariantProps<typeof sectionBodyVariants> {}\n\n/**\n * The content region. Renders `<section>`, NEVER `<main>` — a Section nests inside a shell\n * that already owns the page's single `<main>` landmark, and two of those are a conformance\n * error that also makes \"skip to main content\" ambiguous.\n */\nexport function SectionBody({\n  className,\n  scale,\n  slot,\n  ...rest\n}: SectionBodyProps) {\n  return (\n    <ark.section\n      className={cn(sectionBodyVariants({ scale }), className)}\n      {...rest}\n      data-slot={slot ?? \"section-body\"}\n    />\n  );\n}\nSectionBody.displayName = \"SectionBody\";\n\n/** Pinned footer — form actions, a save bar. Unlike the header it carries a surface, because\n *  it sits against the bottom of a scrolling body and needs to separate from it. */\nexport function SectionFooter({ className, slot, ...rest }: ComponentProps<typeof ark.footer>) {\n  return (\n    <ark.footer\n      className={cn(\n        \"flex shrink-0 items-center justify-between gap-2 border-t border-border bg-card px-4 py-3\",\n        className,\n      )}\n      {...rest}\n      data-slot={slot ?? \"section-footer\"}\n    />\n  );\n}\nSectionFooter.displayName = \"SectionFooter\";\n"],"names":["sectionVariants","tv","SectionRoot","className","fill","slot","rest","jsx","ark","cn","sectionHeaderVariants","SectionHeader","scale","bordered","SectionIcon","SectionTitleGroup","sectionTitleVariants","SectionTitle","level","Title","SectionDescription","SectionActions","sectionBodyVariants","SectionBody","SectionFooter"],"mappings":"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"}

package/dist/simples/field.d.ts

@@ -46,7 +46,13 @@ export declare const FieldLegend: (props: FieldLegendProps) => React.JSX.Element
 export declare const FieldGroup: (props: React.ComponentProps<typeof ark.div>) => React.JSX.Element;
 export declare const FieldContent: (props: React.ComponentProps<typeof ark.div>) => React.JSX.Element;
 export declare const FieldLabel: (props: React.ComponentProps<typeof ArkField.Label>) => React.JSX.Element;
-export declare const FieldRequiredIndicator: (props: React.ComponentProps<typeof ark.span>) => React.JSX.Element;
+/**
+ * The `*` of a required field and, through Ark's `fallback`, what an optional one says instead —
+ * one part, so a form marks one of the two and never both. The asterisk is hidden from assistive
+ * tech because the control's `required` already announces it; the fallback is not, because nothing
+ * else says a field is optional. Its text is the host's: this library ships no product copy.
+ */
+export declare const FieldRequiredIndicator: (props: React.ComponentProps<typeof ArkField.RequiredIndicator>) => React.JSX.Element;
 export declare const FieldTitle: (props: React.ComponentProps<typeof ark.div>) => React.JSX.Element;
 export declare const FieldDescription: (props: React.ComponentProps<typeof ark.p>) => React.JSX.Element;
 export declare const FieldSeparator: (props: React.ComponentProps<typeof ark.div>) => React.JSX.Element;

package/dist/simples/field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/simples/field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EACL,KAAK,IAAI,QAAQ,EAElB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,eAAO,MAAM,QAAQ,+CAAqB,CAAC;AAE3C,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAqCjB,CAAC;AAEH,UAAU,UACR,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,EAChD,YAAY,CAAC,OAAO,aAAa,CAAC;CAAG;AAEzC,eAAO,MAAM,KAAK,GAAI,OAAO,UAAU,sBAWtC,CAAC;AAEF,eAAO,MAAM,QAAQ,GACnB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,sBAiBrD,CAAC;AAEF,UAAU,gBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,MAAM,CAAC;IACvD;;OAEG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,sBAgBlD,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAgBrE,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAevE,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,KAAK,CAAC,sBAoBnD,CAAC;AAEF,eAAO,MAAM,sBAAsB,GACjC,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,sBAiB7C,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAgBrE,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,sBAmBzE,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAiCzE,CAAC;AAEF,eAAO,MAAM,WAAW,GACtB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,UAAU,CAAC,sBAWxD,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,SAAS,CAAC,sBAcvD,CAAC;AAOF,eAAO,MAAM,cAAc,GACzB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,sBAW3D,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,SAAS,CAAC,sBAc1D,CAAC"}
+{"version":3,"file":"field.d.ts","sourceRoot":"","sources":["../../src/simples/field.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EACL,KAAK,IAAI,QAAQ,EAElB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,eAAO,MAAM,QAAQ,+CAAqB,CAAC;AAE3C,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;qDAqCjB,CAAC;AAEH,UAAU,UACR,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,EAChD,YAAY,CAAC,OAAO,aAAa,CAAC;CAAG;AAEzC,eAAO,MAAM,KAAK,GAAI,OAAO,UAAU,sBAWtC,CAAC;AAEF,eAAO,MAAM,QAAQ,GACnB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,sBAiBrD,CAAC;AAEF,UAAU,gBACR,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,MAAM,CAAC;IACvD;;OAEG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,sBAgBlD,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAgBrE,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAevE,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,KAAK,CAAC,sBAoBnD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,GACjC,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,iBAAiB,CAAC,sBA2B/D,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAgBrE,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,sBAmBzE,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG,CAAC,sBAiCzE,CAAC;AAEF,eAAO,MAAM,WAAW,GACtB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,UAAU,CAAC,sBAWxD,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,SAAS,CAAC,sBAcvD,CAAC;AAOF,eAAO,MAAM,cAAc,GACzB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,sBAW3D,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,OAAO,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,SAAS,CAAC,sBAc1D,CAAC"}