@nadicodeai/ui 6.3.4 → 6.4.0

package/dist/components/dropdown-menu.d.ts

@@ -10,7 +10,8 @@ declare function DropdownMenuGroup({ ...props }: MenuPrimitive.Group.Props): Rea
 declare function DropdownMenuLabel({ className, inset, ...props }: MenuPrimitive.GroupLabel.Props & {
     inset?: boolean;
 }): React.JSX.Element;
-declare function DropdownMenuItem({ className, inset, variant, ...props }: MenuPrimitive.Item.Props & {
+declare function DropdownMenuItem({ className, iconOnly, inset, variant, ...props }: MenuPrimitive.Item.Props & {
+    iconOnly?: boolean;
     inset?: boolean;
     variant?: "default" | "destructive";
 }): React.JSX.Element;

package/dist/components/dropdown-menu.d.ts.map

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

package/dist/components/dropdown-menu.js

@@ -21,8 +21,9 @@ function DropdownMenuGroup({ ...props }) {
 function DropdownMenuLabel({ className, inset, ...props }) {
     return (_jsx(MenuPrimitive.GroupLabel, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("px-1.5 py-1 text-xs font-medium text-muted-foreground data-inset:pl-7", className), ...props }));
 }
-function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
-    return (_jsx(MenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("group/dropdown-menu-item relative flex min-h-touch-target cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 group-data-[density=comfortable]/menu:px-3 group-data-[density=comfortable]/menu:py-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-[var(--nc-error-deep)] data-[variant=destructive]:focus:bg-[var(--nc-error-soft)] data-[variant=destructive]:focus:text-[var(--nc-error-deep)] data-disabled:pointer-events-none data-disabled:opacity-50 [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-[var(--nc-error-deep)]", className), ...props }));
+function DropdownMenuItem({ className, iconOnly = false, inset, variant = "default", ...props }) {
+    return (_jsx(MenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-icon-only": iconOnly || undefined, "data-inset": inset, "data-variant": variant, className: cn("group/dropdown-menu-item relative flex min-h-touch-target cursor-default items-center gap-1.5 rounded-md px-1.5 py-1 group-data-[density=comfortable]/menu:px-3 group-data-[density=comfortable]/menu:py-2 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-inset:pl-7 data-[variant=destructive]:text-[var(--nc-error-deep)] data-[variant=destructive]:focus:bg-[var(--nc-error-soft)] data-[variant=destructive]:focus:text-[var(--nc-error-deep)] data-disabled:pointer-events-none data-disabled:opacity-50 [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-[variant=destructive]:*:[svg]:text-[var(--nc-error-deep)]", iconOnly &&
+            "size-8 min-w-touch-target shrink-0 justify-center rounded-full p-0 group-data-[density=comfortable]/menu:p-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0", className), ...props }));
 }
 function DropdownMenuSub({ ...props }) {
     return _jsx(MenuPrimitive.SubmenuRoot, { "data-slot": "dropdown-menu-sub", ...props });

package/dist/components/fact-cell.js

@@ -13,7 +13,7 @@ import { cn } from "../lib/utils.js";
  * model), so sub-components stay style-light. Token-only; no `dark:` styling.
  */
 function FactCell({ className, surface = "canvas", size = "default", ...props }) {
-    return (_jsx("div", { "data-slot": "fact-cell", "data-surface": surface, "data-size": size, className: cn("grid content-center gap-1.5", size === "default" ? "min-h-24 p-[18px]" : "min-h-[86px] p-4", surface === "canvas" && "bg-card", surface === "ink" && [
+    return (_jsx("div", { "data-slot": "fact-cell", "data-surface": surface, "data-size": size, className: cn("grid content-center gap-1.5", size === "default" ? "min-h-24 p-6" : "min-h-[86px] p-4", surface === "canvas" && "bg-card", surface === "ink" && [
             "bg-primary",
             "[&_[data-slot=fact-cell-label]]:text-primary-foreground",
             "[&_[data-slot=fact-cell-claim]]:text-primary-foreground",

package/dist/components/faq-item.js

@@ -18,7 +18,7 @@ import { cn } from "../lib/utils.js";
  * no `dark:` styling.
  */
 function FaqItem({ className, question, name, open, children, ...props }) {
-    return (_jsxs("details", { "data-slot": "faq-item", name: name, open: open, className: cn("group bg-muted [&_summary::-webkit-details-marker]:hidden", className), ...props, children: [_jsx("summary", { className: cn("flex min-h-16 cursor-pointer list-none items-center justify-between gap-4 px-5 py-[18px]", "text-base font-medium text-foreground transition-colors hover:text-[var(--nc-link)]", 
+    return (_jsxs("details", { "data-slot": "faq-item", name: name, open: open, className: cn("group bg-muted [&_summary::-webkit-details-marker]:hidden", className), ...props, children: [_jsx("summary", { className: cn("flex min-h-16 cursor-pointer list-none items-center justify-between gap-4 px-5 py-4", "text-base font-medium text-foreground transition-colors hover:text-[var(--nc-link)]", 
                 // +/- marker: two crossed bars; the vertical bar hides when open (+ -> -)
                 "after:size-3 after:flex-none after:bg-[length:12px_1px,1px_12px] after:bg-center after:bg-no-repeat", "after:[background-image:linear-gradient(var(--muted-foreground),var(--muted-foreground)),linear-gradient(var(--muted-foreground),var(--muted-foreground))]", "group-open:after:bg-[length:12px_1px] group-open:after:[background-image:linear-gradient(var(--muted-foreground),var(--muted-foreground))]"), children: question }), _jsx("div", { "data-slot": "faq-item-answer", className: "border-t border-border px-5 pt-4 pb-5 text-sm text-muted-foreground", children: children })] }));
 }

package/dist/components/logo-tile.js

@@ -11,7 +11,7 @@ import { cn } from "../lib/utils.js";
  * Token-only; no `dark:` styling.
  */
 function LogoTile({ className, surface = "canvas", ...props }) {
-    return (_jsx("div", { "data-slot": "logo-tile", "data-surface": surface, className: cn("grid min-h-24 place-content-center justify-items-center gap-2 p-[18px]", surface === "ink" ? "bg-primary" : "bg-card", className), ...props }));
+    return (_jsx("div", { "data-slot": "logo-tile", "data-surface": surface, className: cn("grid min-h-24 place-content-center justify-items-center gap-2 p-6", surface === "ink" ? "bg-primary" : "bg-card", className), ...props }));
 }
 function LogoTileMark({ className, surface = "canvas", ...props }) {
     return (_jsx("span", { "data-slot": "logo-tile-mark", className: cn("block h-7 w-auto [&_svg]:h-full [&_svg]:w-auto [&_img]:h-full [&_img]:w-auto", 

package/dist/components/menu-choice-row.d.ts

@@ -0,0 +1,24 @@
+import * as React from "react";
+export type MenuChoiceOption<Value extends string = string> = {
+    /** The accessible name and tooltip for the option. */
+    label: string;
+    /** The glyph or short label the compact radio shows. */
+    content: React.ReactNode;
+    value: Value;
+};
+export type MenuChoiceRowProps<Value extends string = string> = Omit<React.ComponentProps<"div">, "children" | "onChange"> & {
+    label: string;
+    options: readonly MenuChoiceOption<Value>[];
+    onValueChange: (value: Value) => void;
+    value: Value;
+    disabled?: boolean;
+};
+/**
+ * A named preference inside a menu: the label reads at the leading edge and the
+ * exclusive choices sit together at the trailing edge, close enough to read as
+ * one control. Selecting keeps the menu open, so a reader can see the result
+ * without reopening it.
+ */
+declare function MenuChoiceRow<Value extends string = string>({ className, disabled, label, onValueChange, options, value, ...props }: MenuChoiceRowProps<Value>): React.JSX.Element;
+export { MenuChoiceRow };
+//# sourceMappingURL=menu-choice-row.d.ts.map

package/dist/components/menu-choice-row.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-choice-row.d.ts","sourceRoot":"","sources":["../../src/components/menu-choice-row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI;IAC5D,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAClE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,UAAU,GAAG,UAAU,CACxB,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,SAAS,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,EACpD,SAAS,EACT,QAAQ,EACR,KAAK,EACL,aAAa,EACb,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,KAAK,CAAC,qBAoC3B;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/menu-choice-row.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { DropdownMenuRadioGroup, DropdownMenuRadioItem } from "./dropdown-menu.js";
+import { cn } from "../lib/utils.js";
+/**
+ * A named preference inside a menu: the label reads at the leading edge and the
+ * exclusive choices sit together at the trailing edge, close enough to read as
+ * one control. Selecting keeps the menu open, so a reader can see the result
+ * without reopening it.
+ */
+function MenuChoiceRow({ className, disabled, label, onValueChange, options, value, ...props }) {
+    return (_jsxs("div", { "data-slot": "menu-choice-row", className: cn("flex min-h-touch-target items-center justify-between gap-4 px-3 py-1 text-sm", className), ...props, children: [_jsx("span", { children: label }), _jsx(DropdownMenuRadioGroup, { "aria-label": label, className: "flex shrink-0 items-center gap-0.5 rounded-full border border-border p-0.5", value: value, onValueChange: (next) => {
+                    const selected = options.find((option) => option.value === next);
+                    if (selected)
+                        onValueChange(selected.value);
+                }, children: options.map((option) => (_jsx(DropdownMenuRadioItem, { value: option.value, "aria-label": option.label, title: option.label, iconOnly: true, closeOnClick: false, disabled: disabled, children: option.content }, option.value))) })] }));
+}
+export { MenuChoiceRow };

package/dist/components/menubar.js

@@ -6,7 +6,7 @@ import { cn } from "../lib/utils.js";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from "./dropdown-menu.js";
 import { CheckIcon } from "lucide-react";
 function Menubar({ className, ...props }) {
-    return (_jsx(MenubarPrimitive, { "data-slot": "menubar", className: cn("flex h-control-height min-h-touch-target items-center gap-0.5 rounded-md border p-[3px] [@media(hover:hover)_and_(pointer:fine)]:min-h-0", className), ...props }));
+    return (_jsx(MenubarPrimitive, { "data-slot": "menubar", className: cn("flex h-control-height min-h-touch-target items-center gap-0.5 rounded-md border p-1 [@media(hover:hover)_and_(pointer:fine)]:min-h-0", className), ...props }));
 }
 function MenubarMenu({ ...props }) {
     return _jsx(DropdownMenu, { "data-slot": "menubar-menu", ...props });

package/dist/components/pricing-card.js

@@ -15,7 +15,7 @@ import { cn } from "../lib/utils.js";
  * differs. Server-renderable; token-only; no `dark:` styling.
  */
 function PricingCard({ className, variant = "default", ...props }) {
-    return (_jsx("div", { "data-slot": "pricing-card", "data-variant": variant, className: cn("flex h-full flex-col gap-[18px] p-8 text-card-foreground", variant === "default" && "bg-card", 
+    return (_jsx("div", { "data-slot": "pricing-card", "data-variant": variant, className: cn("flex h-full flex-col gap-4 p-8 text-card-foreground", variant === "default" && "bg-card", 
         // featured (V5): soft canvas surface — a quiet fill change only. The
         // `muted` role (== canvas-soft) flips with any `.dark` ancestor.
         variant === "featured" && "bg-muted", className), ...props }));
@@ -36,7 +36,7 @@ function PricingCardFeatures({ className, ...props }) {
     return (_jsx("ul", { "data-slot": "pricing-card-features", className: cn("m-0 grid list-none gap-2.5 p-0", className), ...props }));
 }
 function PricingCardFeature({ className, children, ...props }) {
-    return (_jsxs("li", { "data-slot": "pricing-card-feature", className: cn("grid grid-cols-[auto_minmax(0,1fr)] items-start gap-2.5 text-sm text-muted-foreground", className), ...props, children: [_jsx("span", { "data-slot": "pricing-card-feature-mark", "aria-hidden": "true", className: "mt-[3px] size-2.5 rounded-[1px] border border-primary bg-[var(--nc-link-bg-soft)]" }), _jsx("span", { children: children })] }));
+    return (_jsxs("li", { "data-slot": "pricing-card-feature", className: cn("grid grid-cols-[auto_minmax(0,1fr)] items-start gap-2.5 text-sm text-muted-foreground", className), ...props, children: [_jsx("span", { "data-slot": "pricing-card-feature-mark", "aria-hidden": "true", className: "mt-1 size-2.5 rounded-[1px] border border-primary bg-[var(--nc-link-bg-soft)]" }), _jsx("span", { children: children })] }));
 }
 function PricingCardCta({ className, ...props }) {
     return (_jsx("div", { "data-slot": "pricing-card-cta", className: cn("mt-auto pt-1.5 [&>*]:w-full", className), ...props }));

package/dist/components/quote-card.js

@@ -14,7 +14,7 @@ import { cn } from "../lib/utils.js";
  * `dark:` styling.
  */
 function QuoteCard({ className, surface = "canvas", ...props }) {
-    return (_jsx("figure", { "data-slot": "quote-card", "data-surface": surface, className: cn("m-0 grid content-start gap-[18px] p-6", surface === "canvas" && "bg-card", surface === "ink" && [
+    return (_jsx("figure", { "data-slot": "quote-card", "data-surface": surface, className: cn("m-0 grid content-start gap-4 p-6", surface === "canvas" && "bg-card", surface === "ink" && [
             "bg-primary",
             "[&_[data-slot=quote-card-body]]:text-primary-foreground",
             "[&_[data-slot=quote-card-name]]:text-primary-foreground",

package/dist/components/reading-column.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export type ReadingColumnWidth = "full" | "reading";
+/**
+ * The centered content column a settings region reads in. `reading` bounds the
+ * measure for stacked forms and record sections; `full` keeps the workspace
+ * width for a page whose table needs it. Both stay centered, so the column
+ * agrees with the centered heading above it whichever width a page takes.
+ */
+declare function ReadingColumn({ width, className, ...props }: React.ComponentProps<"div"> & {
+    width?: ReadingColumnWidth;
+}): React.JSX.Element;
+export { ReadingColumn };
+//# sourceMappingURL=reading-column.d.ts.map

package/dist/components/reading-column.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reading-column.d.ts","sourceRoot":"","sources":["../../src/components/reading-column.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,SAAS,CAAC;AAEpD;;;;;GAKG;AACH,iBAAS,aAAa,CAAC,EACrB,KAAiB,EACjB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,KAAK,CAAC,EAAE,kBAAkB,CAAA;CAAE,qBAa9D;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/reading-column.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+/**
+ * The centered content column a settings region reads in. `reading` bounds the
+ * measure for stacked forms and record sections; `full` keeps the workspace
+ * width for a page whose table needs it. Both stay centered, so the column
+ * agrees with the centered heading above it whichever width a page takes.
+ */
+function ReadingColumn({ width = "reading", className, ...props }) {
+    return (_jsx("div", { "data-slot": "reading-column", "data-width": width, className: cn("mx-auto flex w-full min-w-0 flex-col gap-6", width === "reading" && "max-w-3xl", className), ...props }));
+}
+export { ReadingColumn };

package/dist/components/stat-block.js

@@ -12,7 +12,7 @@ import { cn } from "../lib/utils.js";
  * Token-only; no `dark:` styling.
  */
 function StatBlock({ className, surface = "canvas", ...props }) {
-    return (_jsx("div", { "data-slot": "stat-block", "data-surface": surface, className: cn("grid min-h-24 content-center gap-1.5 p-[18px]", surface === "ink" ? "bg-primary" : "bg-card", className), ...props }));
+    return (_jsx("div", { "data-slot": "stat-block", "data-surface": surface, className: cn("grid min-h-24 content-center gap-1.5 p-6", surface === "ink" ? "bg-primary" : "bg-card", className), ...props }));
 }
 function StatBlockFigure({ className, surface = "canvas", ...props }) {
     return (_jsx("div", { "data-slot": "stat-block-figure", className: cn("text-[clamp(2rem,3.2vw,2.875rem)] leading-none font-bold tabular-nums", surface === "ink" ? "text-primary-foreground" : "text-foreground", className), ...props }));

package/dist/components/tabs.js

@@ -5,7 +5,7 @@ import { cn } from "../lib/utils.js";
 function Tabs({ className, orientation = "horizontal", ...props }) {
     return (_jsx(TabsPrimitive.Root, { "data-slot": "tabs", "data-orientation": orientation, orientation: orientation, className: cn("group/tabs flex gap-2 data-horizontal:flex-col", className), ...props }));
 }
-const tabsListVariants = cva("group/tabs-list inline-flex w-fit items-center justify-center rounded-md p-[3px] text-muted-foreground group-data-horizontal/tabs:h-control-height group-data-horizontal/tabs:min-h-touch-target group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none [@media(hover:hover)_and_(pointer:fine)]:group-data-horizontal/tabs:min-h-0", {
+const tabsListVariants = cva("group/tabs-list inline-flex w-fit items-center justify-center rounded-md p-1 text-muted-foreground group-data-horizontal/tabs:h-control-height group-data-horizontal/tabs:min-h-touch-target group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none [@media(hover:hover)_and_(pointer:fine)]:group-data-horizontal/tabs:min-h-0", {
     variants: {
         variant: {
             default: "bg-muted",
@@ -20,7 +20,7 @@ function TabsList({ className, variant = "default", ...props }) {
     return (_jsx(TabsPrimitive.List, { "data-slot": "tabs-list", "data-variant": variant, className: cn(tabsListVariants({ variant }), className), ...props }));
 }
 function TabsTrigger({ className, ...props }) {
-    return (_jsx(TabsPrimitive.Tab, { "data-slot": "tabs-trigger", className: cn("nc-transition-paint relative inline-flex h-[calc(100%-1px)] min-h-touch-target min-w-touch-target flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=default]/tabs-list:data-active:shadow-none group-data-[variant=line]/tabs-list:data-active:shadow-none [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent", "data-active:bg-background data-active:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity after:duration-[var(--nc-duration-confirm)] after:ease-[var(--nc-ease-out-strong)] group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100 motion-reduce:after:transition-none", className), ...props }));
+    return (_jsx(TabsPrimitive.Tab, { "data-slot": "tabs-trigger", className: cn("nc-transition-paint relative inline-flex h-[calc(100%-1px)] min-h-touch-target min-w-touch-target flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start hover:text-foreground disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=default]/tabs-list:data-active:shadow-none group-data-[variant=line]/tabs-list:data-active:shadow-none [@media(hover:hover)_and_(pointer:fine)]:min-h-0 [@media(hover:hover)_and_(pointer:fine)]:min-w-0 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent", "data-active:bg-background data-active:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity after:duration-[var(--nc-duration-confirm)] after:ease-[var(--nc-ease-out-strong)] group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:-bottom-1 group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100 motion-reduce:after:transition-none", className), ...props }));
 }
 function TabsContent({ className, ...props }) {
     return (_jsx(TabsPrimitive.Panel, { "data-slot": "tabs-content", className: cn("flex-1 text-sm outline-none", className), ...props }));

package/dist/components/theme-mode-switcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-mode-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-mode-switcher.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,UAAU,EAAkB,MAAM,0BAA0B,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG3E,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AACnC,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,EACvC,UAAU,GAAG,cAAc,GAAG,eAAe,GAAG,OAAO,CACxD,GAAG;IACF,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,qBAAqB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1D,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAQF,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,OAAe,EACf,QAAQ,EACR,aAAa,EACb,MAAM,EACN,aAAa,EACb,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,sBAAsB,qBAkDxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,aAAa,EACb,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,qBAAqB,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,qBAkCA"}
+{"version":3,"file":"theme-mode-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-mode-switcher.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,UAAU,EAAkB,MAAM,0BAA0B,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG3E,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AACnC,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,EACvC,UAAU,GAAG,cAAc,GAAG,eAAe,GAAG,OAAO,CACxD,GAAG;IACF,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,qBAAqB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1D,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAQF,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,OAAe,EACf,QAAQ,EACR,aAAa,EACb,MAAM,EACN,aAAa,EACb,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,sBAAsB,qBAkDxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,aAAa,EACb,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,qBAAqB,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,qBAkBA"}

package/dist/components/theme-mode-switcher.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { MonitorIcon, MoonIcon, SunIcon } from "lucide-react";
-import { DropdownMenuRadioGroup, DropdownMenuRadioItem } from "./dropdown-menu.js";
+import { MenuChoiceRow } from "./menu-choice-row.js";
 import { RadioGroup, RadioGroupItem } from "./radio-group.js";
 import { toggleVariants } from "./toggle.js";
 import { isThemeMode, themeModes } from "../lib/theme-mode.js";
@@ -32,11 +32,12 @@ function ThemeModeSwitcher({ "aria-label": ariaLabel, className, compact = false
 }
 export { ThemeModeSwitcher };
 export function ThemeModeMenu({ label, labels, value, onValueChange, disabled, }) {
-    return (_jsxs("div", { className: "flex min-h-touch-target items-center justify-between gap-4 px-3 py-1 text-sm", "data-slot": "theme-mode-menu", children: [_jsx("span", { children: label }), _jsx(DropdownMenuRadioGroup, { "aria-label": label, className: "flex shrink-0 items-center gap-0.5 rounded-full border border-border p-0.5", value: value, onValueChange: (next) => {
-                    if (isThemeMode(next))
-                        onValueChange(next);
-                }, children: ["system", "light", "dark"].map((mode) => {
-                    const Icon = themeModeIcons[mode];
-                    return (_jsx(DropdownMenuRadioItem, { value: mode, "aria-label": labels[mode], title: labels[mode], iconOnly: true, closeOnClick: false, disabled: disabled, children: _jsx(Icon, { "aria-hidden": "true" }) }, mode));
-                }) })] }));
+    return (_jsx(MenuChoiceRow, { "data-slot": "theme-mode-menu", label: label, disabled: disabled, value: value, onValueChange: onValueChange, options: ["system", "light", "dark"].map((mode) => {
+            const Icon = themeModeIcons[mode];
+            return {
+                value: mode,
+                label: labels[mode],
+                content: _jsx(Icon, { "aria-hidden": "true" }),
+            };
+        }) }));
 }

package/dist/eslint/index.js

@@ -1,8 +1,14 @@
 import { readFileSync } from "node:fs";
 
 import { confirmDestructiveAction } from "./rules/confirm-destructive-action.js";
+import { iconControlAccessibleName } from "./rules/icon-control-accessible-name.js";
 import { noAppFeatureComponent } from "./rules/no-app-feature-component.js";
 import { noElevatedEdge } from "./rules/no-elevated-edge.js";
+import { noNestedOverlay } from "./rules/no-nested-overlay.js";
+import { noOffGridSpacing } from "./rules/no-off-grid-spacing.js";
+import { noRawShadow } from "./rules/no-raw-shadow.js";
+import { noRouteWidthOverride } from "./rules/no-route-width-override.js";
+import { preferRadioForFewStaticOptions } from "./rules/prefer-radio-for-few-static-options.js";
 import { noDeprecatedZodApi } from "./rules/no-deprecated-zod-api.js";
 import { noMonoTitleRegister } from "./rules/no-mono-title-register.js";
 import { noPackageComponentRedefinition } from "./rules/no-package-component-redefinition.js";
@@ -49,11 +55,16 @@ function readPublishedVersion() {
 }
 
 export const strictDesignSystemRules = {
+  "nadicodeai/icon-control-accessible-name": "error",
   "nadicodeai/no-invalid-token-utility": "error",
   "nadicodeai/no-native-visible-control": "error",
+  "nadicodeai/no-nested-overlay": "error",
+  "nadicodeai/no-off-grid-spacing": "error",
+  "nadicodeai/no-raw-shadow": "error",
   "nadicodeai/no-repainted-focus": "error",
   "nadicodeai/no-shadcn-appearance-override": "error",
   "nadicodeai/no-token-category-bypass": "error",
+  "nadicodeai/prefer-radio-for-few-static-options": "error",
 };
 
 /** @type {import('eslint').ESLint.Plugin} */
@@ -65,13 +76,19 @@ const plugin = {
   configs: {},
   rules: {
     "confirm-destructive-action": confirmDestructiveAction,
+    "icon-control-accessible-name": iconControlAccessibleName,
     "no-app-feature-component": noAppFeatureComponent,
     "no-elevated-edge": noElevatedEdge,
     "no-deprecated-zod-api": noDeprecatedZodApi,
     "no-mono-title-register": noMonoTitleRegister,
+    "no-nested-overlay": noNestedOverlay,
+    "no-off-grid-spacing": noOffGridSpacing,
     "no-package-component-redefinition": noPackageComponentRedefinition,
     "no-paired-size-utility": noPairedSizeUtility,
+    "no-raw-shadow": noRawShadow,
     "no-resting-settings-control": noRestingSettingsControl,
+    "no-route-width-override": noRouteWidthOverride,
+    "prefer-radio-for-few-static-options": preferRadioForFewStaticOptions,
     "no-shadcn-appearance-override": noShadcnAppearanceOverride,
     "no-native-visible-control": noNativeVisibleControl,
     "no-repainted-focus": noRepaintedFocus,

package/dist/eslint/rules/icon-control-accessible-name.js

@@ -0,0 +1,156 @@
+/*
+ * A control whose whole content is an icon still has to say what it does.
+ *
+ * An icon is a picture, and a screen reader announces "button" and nothing else
+ * for one. Sighted readers recover the meaning from the glyph; a screen-reader
+ * user, and anyone addressing the control by name through voice control, gets an
+ * unnamed button. The name comes from `aria-label`, from `aria-labelledby`, or
+ * from text inside the control that is hidden visually rather than from the
+ * accessibility tree — the `sr-only` span this repository already writes beside
+ * its close buttons. That last spelling needs no separate test here: hidden text
+ * is text, so a control carrying one is not icon-only in the first place.
+ *
+ * `title` is NOT one of them. It does name the control for most screen readers,
+ * but it also mints a browser tooltip, and the copy contract (the Tooltip
+ * contract in `skills/design/product-design/references/copy.md`) says the title
+ * attribute is not this product's help system. Accepting it here would make the
+ * rule push authors toward the one tooltip the design system refuses.
+ *
+ * Two shapes are icon-only, and both are read off the element rather than out of
+ * a list: a `Button` on one of the icon size variants (`icon`, `icon-xs`,
+ * `icon-sm`, `icon-lg`), and any `Button` or `button` whose children render
+ * elements and no text at all.
+ *
+ * Two shapes are deliberately out of scope. A `Button` written as the value of a
+ * `render` prop is a STYLE carrier: the primitive that receives it owns the
+ * rendered element's children and its label, as `<DropdownMenuTrigger
+ * aria-label={label} render={<Button size="icon-sm" />}>` does in
+ * `packages/ui/src/components/action-menu.tsx`, so the name is not this element's
+ * to carry. An element with a `{...props}` spread may be handed a label by its
+ * caller, and this rule does not guess what a spread holds.
+ *
+ * Standard tool checked first: the root config runs jsx-a11y's `alt-text`,
+ * `aria-props`, `aria-proptypes`, `aria-unsupported-elements`,
+ * `role-has-required-aria-props` and `role-supports-aria-props`, and Next's
+ * core-web-vitals config adds no more. Every one of them judges an attribute
+ * that is already present; none asks whether a control has a name at all.
+ * `control-has-associated-label` is the upstream rule that would, and it is
+ * enabled nowhere, looks for a label element rather than an accessible name, and
+ * knows nothing about a size variant that means "icon".
+ */
+import { jsxComponentName } from "./jsx-class-utility.js";
+
+const CONTROL_TAGS = new Set(["Button", "button"]);
+const ICON_SIZES = new Set(["icon", "icon-xs", "icon-sm", "icon-lg"]);
+const NAME_ATTRIBUTES = new Set(["aria-label", "aria-labelledby"]);
+
+function attributeName(attribute) {
+  return attribute.type === "JSXAttribute" && attribute.name.type === "JSXIdentifier"
+    ? attribute.name.name
+    : undefined;
+}
+
+/** The literal string an attribute carries, or undefined for anything computed. */
+function literalAttributeValue(openingElement, name) {
+  for (const attribute of openingElement.attributes) {
+    if (attributeName(attribute) !== name) continue;
+    const value = attribute.value;
+    return value?.type === "Literal" && typeof value.value === "string" ? value.value : undefined;
+  }
+  return undefined;
+}
+
+/** True when this element stands in for another primitive's rendered element. */
+function isRenderProp(node, sourceCode) {
+  return sourceCode.getAncestors(node).some((ancestor) => attributeName(ancestor) === "render");
+}
+
+/*
+ * Whether an expression can only ever evaluate to JSX or to nothing. `{label}`
+ * and `{day.getDate()}` are text; `{copied ? <Check /> : <Copy />}` is not.
+ */
+function producesOnlyElements(expression) {
+  switch (expression.type) {
+    case "JSXEmptyExpression":
+    case "JSXElement":
+    case "JSXFragment":
+      return true;
+    case "ConditionalExpression":
+      return (
+        producesOnlyElements(expression.consequent) && producesOnlyElements(expression.alternate)
+      );
+    case "LogicalExpression":
+      return producesOnlyElements(expression.right);
+    case "Literal":
+      return expression.value === null || expression.value === false;
+    case "Identifier":
+      return expression.name === "undefined";
+    default:
+      return false;
+  }
+}
+
+/** Whether a subtree renders any text, visible or visually hidden. */
+function rendersText(node) {
+  for (const child of node.children ?? []) {
+    if (child.type === "JSXText") {
+      if (child.value.trim() !== "") return true;
+      continue;
+    }
+    if (child.type === "JSXElement" || child.type === "JSXFragment") {
+      if (rendersText(child)) return true;
+      continue;
+    }
+    if (child.type === "JSXExpressionContainer" && !producesOnlyElements(child.expression)) {
+      return true;
+    }
+  }
+  return false;
+}
+
+/** Whether a subtree renders at least one element of its own. */
+function rendersElement(node) {
+  return (node.children ?? []).some(
+    (child) =>
+      child.type === "JSXElement" ||
+      child.type === "JSXFragment" ||
+      (child.type === "JSXExpressionContainer" &&
+        child.expression.type !== "JSXEmptyExpression" &&
+        producesOnlyElements(child.expression)),
+  );
+}
+
+export const iconControlAccessibleName = {
+  meta: {
+    type: "problem",
+    docs: {
+      description: "Require an accessible name on a control whose only content is an icon",
+    },
+    schema: [],
+    messages: {
+      unnamedIconControl:
+        'A screen reader announces "{{tag}}" and nothing more for this control: its content is an icon, and an icon carries no name. Add aria-label with the action it performs, point aria-labelledby at the text that names it, or put that text in a child with the sr-only class.',
+    },
+  },
+  create(context) {
+    return {
+      JSXOpeningElement(node) {
+        const tag = jsxComponentName(node, context);
+        if (!tag || !CONTROL_TAGS.has(tag)) return;
+        if (node.attributes.some((attribute) => attribute.type === "JSXSpreadAttribute")) return;
+        if (
+          node.attributes.some((attribute) => NAME_ATTRIBUTES.has(attributeName(attribute) ?? ""))
+        )
+          return;
+        if (isRenderProp(node, context.sourceCode)) return;
+
+        const element = node.parent;
+        const iconSized = ICON_SIZES.has(literalAttributeValue(node, "size") ?? "");
+        if (!iconSized && !rendersElement(element)) return;
+        if (rendersText(element)) return;
+
+        context.report({ node, messageId: "unnamedIconControl", data: { tag } });
+      },
+    };
+  },
+};

package/dist/eslint/rules/no-nested-overlay.js

@@ -0,0 +1,56 @@
+/*
+ * One overlay at a time.
+ *
+ * `DialogContent`, `AlertDialogContent`, `SheetContent` and `DrawerContent` each
+ * mount a focus trap, a scrim and a layer of their own. Writing one inside
+ * another leaves both traps armed on the same tree: focus cannot leave the inner
+ * surface to reach the outer one's controls, Escape resolves against whichever
+ * trap won the race, and the two scrims composite into a second dim over content
+ * that is already dimmed. Nothing about this is visible while the inner overlay
+ * is closed, which is why it survives review and reaches the keyboard user.
+ *
+ * Standard tool checked first: `no-restricted-syntax` selects one node by its
+ * shape and cannot ask what encloses it. "An overlay inside an overlay" is a
+ * relationship between two elements, so it is read here, on the shared
+ * component-name reader that also resolves renamed imports.
+ */
+import { jsxComponentName } from "./jsx-class-utility.js";
+
+const OVERLAY_CONTENT = new Set([
+  "AlertDialogContent",
+  "DialogContent",
+  "DrawerContent",
+  "SheetContent",
+]);
+
+export const noNestedOverlay = {
+  meta: {
+    type: "problem",
+    docs: {
+      description: "Disallow an overlay surface rendered inside another overlay surface",
+    },
+    schema: [],
+    messages: {
+      nestedOverlay:
+        "<{{inner}}> is rendered inside <{{outer}}>. Two overlays on one tree keep both focus traps armed, so the keyboard cannot reach the outer surface and Escape closes the wrong layer, while the scrims stack. Render the second overlay as a sibling driven by state, or replace it with an inline disclosure inside the first.",
+    },
+  },
+  create(context) {
+    return {
+      JSXOpeningElement(node) {
+        const inner = jsxComponentName(node, context);
+        if (!inner || !OVERLAY_CONTENT.has(inner)) return;
+
+        for (const ancestor of context.sourceCode.getAncestors(node)) {
+          // The element this opening tag belongs to is an ancestor of it, and it
+          // is not nested inside itself.
+          if (ancestor.type !== "JSXElement" || ancestor.openingElement === node) continue;
+          const outer = jsxComponentName(ancestor.openingElement, context);
+          if (!outer || !OVERLAY_CONTENT.has(outer)) continue;
+          context.report({ node, messageId: "nestedOverlay", data: { inner, outer } });
+          return;
+        }
+      },
+    };
+  },
+};

package/dist/eslint/rules/no-off-grid-spacing.js

@@ -0,0 +1,115 @@
+/*
+ * The spacing ladder is closed. DESIGN.md, "Layout > Spacing": "One ladder
+ * carries every gap, pad, and stack step. A register picks the rungs it needs;
+ * it never interpolates."
+ *
+ * A pixel value typed into a spacing utility — `p-[13px]`, `gap-[7px]` — is that
+ * interpolation. It reads as deliberate and is usually an eyeballed nudge, it
+ * cannot move when the ladder does, and every one of them puts a second rhythm
+ * beside the one the rest of the surface is built on, which is what makes a
+ * layout look almost aligned.
+ *
+ * Only a bare pixel literal is a finding. `p-[var(--nc-cell-padding)]`,
+ * `px-[clamp(24px,5vw,64px)]` and `top-[calc(var(--titlebar-height)+0.5rem)]` are
+ * relationships to something the page owns rather than a measurement invented at
+ * the call site, so they are outside this rule. So is a value that already lands
+ * on a rung: it is the ladder, spelled the long way.
+ *
+ * Standard tool checked first: `better-tailwindcss`'s `no-restricted-classes`
+ * matches a class against a pattern and could refuse every arbitrary spacing
+ * value, but its message is the pattern's, one text for every hit. The fix here
+ * is a different token for every value, and naming the nearest rung is the whole
+ * point of the message, so the arithmetic lives in a rule.
+ */
+import { tokenUtilityVisitors } from "./jsx-class-utility.js";
+
+/*
+ * The ladder as the theme emits it: `--spacing-nadicode-*`, which Tailwind
+ * spells `p-nadicode-md`, `gap-nadicode-lg` and so on. These are the rungs a
+ * step may take and the ones a message offers.
+ */
+const LADDER = [
+  [0, "0"],
+  [4, "nadicode-xxs"],
+  [8, "nadicode-xs"],
+  [12, "nadicode-sm"],
+  [16, "nadicode-md"],
+  [24, "nadicode-lg"],
+  [32, "nadicode-xl"],
+  [40, "nadicode-2xl"],
+  [48, "nadicode-3xl"],
+  [64, "nadicode-4xl"],
+  [96, "nadicode-5xl"],
+  [128, "nadicode-6xl"],
+];
+
+/*
+ * Control geometry from the same section: the seam weight, the focus outline and
+ * its offset, a control's inline padding, and the coarse-pointer target. Each
+ * owns one role rather than the general rhythm, so a value that lands on one is
+ * legal and none of them is ever offered as the nearest rung for a gap.
+ */
+const CONTROL_GEOMETRY = new Set([1, 2, 10, 44]);
+
+const SPACING_PREFIX =
+  "(?:p|px|py|pt|pr|pb|pl|ps|pe|m|mx|my|mt|mr|mb|ml|ms|me|gap|gap-x|gap-y|space-x|space-y|inset|inset-x|inset-y|top|right|bottom|left|start|end)";
+const OFF_GRID = new RegExp(`^-?(${SPACING_PREFIX})-\\[(-?\\d+(?:\\.\\d+)?)px\\]$`);
+
+/** `md:hover:p-[13px]` → `p-[13px]`, with a colon inside brackets left alone. */
+function withoutVariants(token) {
+  let bracketDepth = 0;
+  let start = 0;
+  for (let index = 0; index < token.length; index += 1) {
+    if (token[index] === "[") bracketDepth += 1;
+    if (token[index] === "]") bracketDepth = Math.max(0, bracketDepth - 1);
+    if (token[index] === ":" && bracketDepth === 0) start = index + 1;
+  }
+  return token.slice(start);
+}
+
+/** The closest rung, and the larger of the two when a value sits between them. */
+function nearestRung(pixels) {
+  return LADDER.reduce((closest, rung) =>
+    Math.abs(rung[0] - pixels) <= Math.abs(closest[0] - pixels) ? rung : closest,
+  );
+}
+
+/*
+ * A step below zero is written both ways — `-mt-[3px]` puts the sign on the
+ * utility, `bottom-[-5px]` puts it in the value — and the replacement carries it
+ * on the utility either way, because a token holds a magnitude.
+ */
+function offGridFinding(utility) {
+  const unqualified = withoutVariants(utility);
+  const match = OFF_GRID.exec(unqualified);
+  if (!match) return undefined;
+  const [, prefix, value] = match;
+  const pixels = Math.abs(Number(value));
+  if (CONTROL_GEOMETRY.has(pixels)) return undefined;
+  const [rung, token] = nearestRung(pixels);
+  if (rung === pixels) return undefined;
+  const sign = unqualified.startsWith("-") || value.startsWith("-") ? "-" : "";
+  return { value: String(pixels), rung: String(rung), replacement: `${sign}${prefix}-${token}` };
+}
+
+export const noOffGridSpacing = {
+  meta: {
+    type: "problem",
+    docs: {
+      description:
+        "Disallow a pixel value typed into a spacing utility off the design-system ladder",
+    },
+    schema: [],
+    messages: {
+      offGridSpacing:
+        '"{{utility}}" puts a {{value}}px step beside a layout built on the design-system spacing ladder, so the rhythm reads as almost aligned and the value cannot follow the tokens. The nearest rung is {{rung}}px: use {{replacement}}.',
+    },
+  },
+  create(context) {
+    return tokenUtilityVisitors(context, (node, utility) => {
+      const finding = offGridFinding(utility);
+      if (!finding) return;
+      context.report({ node, messageId: "offGridSpacing", data: { utility, ...finding } });
+    });
+  },
+};

package/dist/eslint/rules/no-raw-shadow.js

@@ -0,0 +1,70 @@
+/*
+ * Depth comes off the ladder, not out of Tailwind's box.
+ *
+ * DESIGN.md, "Elevation & Depth": the four rungs are the four owned utilities,
+ * each authored per mode and carrying its own ring as the recipe's final layer.
+ * A stock `shadow-md` is a single light-mode drop shadow: it disappears against
+ * the true-black dark workspace, it leaves the surface without the ring its
+ * neighbours have, and it does not move when the tokens do. Two surfaces meant
+ * to sit at the same physical level then read as different objects.
+ *
+ * `shadow-none` stays legal — removing a shadow an inherited shape brought with
+ * it is the correct thing to write, and it is what `packages/ui` already writes.
+ *
+ * The two packages that BUILD the ladder are outside the rule: the design system
+ * authors the rung values, and `@nadicodeai/ui` composes the utilities onto its
+ * primitives. Everywhere else a shadow is a caller inventing depth.
+ *
+ * Standard tool checked first: `better-tailwindcss/no-unknown-classes` cannot
+ * see these, because the generated theme clears only the `--color-*` namespace
+ * and leaves Tailwind's own `--shadow-*` in place, so `shadow-lg` is a real
+ * class that really paints. `no-restricted-classes` in the Portal and the
+ * package configs carries `shadow-tooltip|menu|dialog|sheet` — the NAMED shadows
+ * the ladder replaced — and nothing about the size scale; `no-invalid-token-utility`
+ * judges `shadow-nc-*` against the generated colour tokens only; and the
+ * colour-boundary patterns fire on `-nc-` or on an arbitrary colour value. A
+ * probe file carrying `shadow-lg shadow-md shadow-[0_2px_4px_black]` linted
+ * clean in `apps/portal` before this rule existed. Holding it as a repo-wide
+ * restricted class would need the same entry restated in five configs, since a
+ * later `no-restricted-classes` entry replaces the earlier one rather than
+ * adding to it, so it is one rule instead.
+ */
+import { tokenUtilityVisitors } from "./jsx-class-utility.js";
+
+const RAW_SHADOW = /^shadow(?:-(?:2xs|xs|sm|md|lg|xl|2xl|inner|initial|\[.*\]))?$/;
+const PACKAGE_LADDER_PATHS = ["packages/ui/src/", "packages/design-system/"];
+
+function withoutVariants(token) {
+  let bracketDepth = 0;
+  let start = 0;
+  for (let index = 0; index < token.length; index += 1) {
+    if (token[index] === "[") bracketDepth += 1;
+    if (token[index] === "]") bracketDepth = Math.max(0, bracketDepth - 1);
+    if (token[index] === ":" && bracketDepth === 0) start = index + 1;
+  }
+  return token.slice(start);
+}
+
+export const noRawShadow = {
+  meta: {
+    type: "problem",
+    docs: {
+      description:
+        "Disallow Tailwind's stock shadow utilities outside the packages that own the material ladder",
+    },
+    schema: [],
+    messages: {
+      rawShadow:
+        '"{{utility}}" paints a light-mode drop shadow with no ring, so the surface loses its edge against the dark workspace and cannot follow the tokens. Choose the physical level instead: nc-elevation-resting, nc-elevation-raised, nc-elevation-floating, or nc-elevation-modal.',
+    },
+  },
+  create(context) {
+    const filename = context.filename.replaceAll("\\", "/");
+    if (PACKAGE_LADDER_PATHS.some((path) => filename.includes(path))) return {};
+
+    return tokenUtilityVisitors(context, (node, utility) => {
+      if (!RAW_SHADOW.test(withoutVariants(utility))) return;
+      context.report({ node, messageId: "rawShadow", data: { utility } });
+    });
+  },
+};

package/dist/eslint/rules/no-route-width-override.js

@@ -0,0 +1,135 @@
+/*
+ * A Portal route does not decide how wide it is.
+ *
+ * The signed-in chrome owns the content column: `(dashboard)/layout.tsx` renders
+ * `PortalShell`, and a reading-width surface takes `ReadingColumn` from
+ * `@nadicodeai/ui`. A route that caps its own width with `max-w-*` or centres
+ * itself with `mx-auto` makes a second owner for one measurement, which is how
+ * neighbouring pages end up at 42rem and 48rem with nothing to say which is
+ * right, and how a shell change stops reaching half the routes.
+ *
+ * What is read is the OUTERMOST element the route renders — the root of every
+ * expression its default export returns, descended through fragments and through
+ * the conditionals a route writes around a fallback. A width inside the page is
+ * a different statement: a skeleton that matches the field it stands in for, or
+ * a form column, constrains its own element, not the route, and those are
+ * ordinary. The rule's subject is the route's own frame.
+ *
+ * `max-w-full` and `max-w-none` are kept legal for the same reason: they remove
+ * a cap rather than set one, so neither can be the second owner of a width.
+ *
+ * Standard tool checked first: `better-tailwindcss/no-restricted-classes`
+ * matches a class wherever it is written and cannot ask whether the element
+ * carrying it is the one the route returns. That relationship is the rule, so it
+ * is read here.
+ */
+import { openingElementClassUtilities } from "./jsx-class-utility.js";
+
+const CENTERING = "mx-auto";
+const MAX_WIDTH = /^-?max-w-(.+)$/;
+const UNCAPPED = new Set(["full", "none"]);
+
+function withoutVariants(token) {
+  let bracketDepth = 0;
+  let start = 0;
+  for (let index = 0; index < token.length; index += 1) {
+    if (token[index] === "[") bracketDepth += 1;
+    if (token[index] === "]") bracketDepth = Math.max(0, bracketDepth - 1);
+    if (token[index] === ":" && bracketDepth === 0) start = index + 1;
+  }
+  return token.slice(start);
+}
+
+function isWidthOverride(utility) {
+  const unqualified = withoutVariants(utility);
+  if (unqualified === CENTERING) return true;
+  const capped = MAX_WIDTH.exec(unqualified);
+  return capped ? !UNCAPPED.has(capped[1]) : false;
+}
+
+/** The elements one returned expression renders at its outermost level. */
+function rootElements(node, found = []) {
+  if (!node) return found;
+  switch (node.type) {
+    case "JSXElement":
+      found.push(node);
+      return found;
+    case "JSXFragment":
+      for (const child of node.children) rootElements(child, found);
+      return found;
+    case "JSXExpressionContainer":
+      return rootElements(node.expression, found);
+    case "ConditionalExpression":
+      rootElements(node.consequent, found);
+      return rootElements(node.alternate, found);
+    case "LogicalExpression":
+      return rootElements(node.right, found);
+    default:
+      return found;
+  }
+}
+
+const FUNCTION_TYPES = new Set([
+  "ArrowFunctionExpression",
+  "FunctionDeclaration",
+  "FunctionExpression",
+]);
+
+/*
+ * Every expression the route function returns, its own returns only: a helper
+ * declared inside it renders something else, and its root is not the route's.
+ */
+function returnedExpressions(node, found = []) {
+  if (!node || typeof node.type !== "string") return found;
+  if (node.type === "ReturnStatement") {
+    if (node.argument) found.push(node.argument);
+    return found;
+  }
+  if (FUNCTION_TYPES.has(node.type)) return found;
+  for (const [key, value] of Object.entries(node)) {
+    if (key === "parent" || key === "loc" || key === "range") continue;
+    if (Array.isArray(value)) {
+      for (const child of value) returnedExpressions(child, found);
+    } else if (value && typeof value === "object") {
+      returnedExpressions(value, found);
+    }
+  }
+  return found;
+}
+
+function routeRoots(routeFunction) {
+  const body = routeFunction.body;
+  if (body.type !== "BlockStatement") return rootElements(body);
+  return returnedExpressions(body).flatMap((expression) => rootElements(expression));
+}
+
+export const noRouteWidthOverride = {
+  meta: {
+    type: "problem",
+    docs: {
+      description: "Disallow a Portal route file setting the width of the frame it returns",
+    },
+    schema: [],
+    messages: {
+      routeWidthOverride:
+        '"{{utility}}" makes this route a second owner of the content width, so neighbouring pages drift apart and a shell change stops reaching this one. Page width belongs to the shell column; a reading-width surface takes ReadingColumn from @nadicodeai/ui.',
+    },
+  },
+  create(context) {
+    return {
+      ExportDefaultDeclaration(node) {
+        if (!FUNCTION_TYPES.has(node.declaration.type)) return;
+        for (const root of routeRoots(node.declaration)) {
+          for (const utility of openingElementClassUtilities(root.openingElement, context)) {
+            if (!isWidthOverride(utility)) continue;
+            context.report({
+              node: root.openingElement,
+              messageId: "routeWidthOverride",
+              data: { utility },
+            });
+          }
+        }
+      },
+    };
+  },
+};

package/dist/eslint/rules/prefer-radio-for-few-static-options.js

@@ -0,0 +1,77 @@
+/*
+ * A short fixed set of choices is shown, not hidden.
+ *
+ * A `Select` spends a click and a popup to reveal what it holds. That trade pays
+ * for itself over a long or a loaded list; it does not pay for two or three
+ * options that are known at author time, where the popup costs the reader the
+ * one thing they came for — seeing what the alternatives are — and costs the
+ * keyboard user an open-then-arrow instead of a single arrow.
+ *
+ * The count has to be STATIC to be a finding. A `SelectContent` filled from
+ * `{items.map(...)}` holds however many rows the data has today, so its shape is
+ * not this rule's business and any expression child stands the rule down.
+ *
+ * Standard tool checked first: `no-restricted-syntax` can select a
+ * `SelectContent`, but not one whose children are exactly two or three elements
+ * of one name and nothing dynamic. That is a property of the subtree, so it is
+ * read here.
+ */
+import { jsxComponentName } from "./jsx-class-utility.js";
+
+const CONTENT_TAG = "SelectContent";
+const ITEM_TAG = "SelectItem";
+
+/*
+ * The items one content subtree renders, and whether anything in it is computed.
+ * Groups and separators are descended through; an item's own children are not,
+ * because a label built from a variable says nothing about how many items there
+ * are. Attributes are out of scope for the same reason: `value={option.value}`
+ * on a hand-written item is ordinary.
+ */
+function scanContent(node, context, found) {
+  for (const child of node.children) {
+    if (child.type === "JSXExpressionContainer") {
+      if (child.expression.type !== "JSXEmptyExpression") found.dynamic = true;
+      continue;
+    }
+    if (child.type === "JSXFragment") {
+      scanContent(child, context, found);
+      continue;
+    }
+    if (child.type !== "JSXElement") continue;
+    if (jsxComponentName(child.openingElement, context) === ITEM_TAG) {
+      found.items.push(child);
+      continue;
+    }
+    scanContent(child, context, found);
+  }
+  return found;
+}
+
+export const preferRadioForFewStaticOptions = {
+  meta: {
+    type: "suggestion",
+    docs: {
+      description: "Prefer RadioGroup over Select for two or three statically written options",
+    },
+    schema: [],
+    messages: {
+      fewStaticOptions:
+        "This Select holds {{count}} options fixed at author time, so a reader has to open it to learn what the alternatives are. RadioGroup shows all {{count}} at once and takes one arrow key instead of an open and an arrow. Use RadioGroup with a RadioGroupItem per option.",
+    },
+  },
+  create(context) {
+    return {
+      JSXElement(node) {
+        if (jsxComponentName(node.openingElement, context) !== CONTENT_TAG) return;
+        const { items, dynamic } = scanContent(node, context, { items: [], dynamic: false });
+        if (dynamic || items.length < 2 || items.length > 3) return;
+        context.report({
+          node: node.openingElement,
+          messageId: "fewStaticOptions",
+          data: { count: String(items.length) },
+        });
+      },
+    };
+  },
+};

package/dist/index.d.ts

@@ -83,6 +83,7 @@ export * from "./components/logo-band.js";
 export * from "./components/logo-tile.js";
 export * from "./components/media-mount.js";
 export * from "./components/memory-item.js";
+export * from "./components/menu-choice-row.js";
 export * from "./components/menubar.js";
 export * from "./components/native-select.js";
 export * from "./components/nav-bar.js";
@@ -99,6 +100,7 @@ export * from "./components/progress.js";
 export * from "./components/proof-slot.js";
 export * from "./components/quote-card.js";
 export * from "./components/radio-group.js";
+export * from "./components/reading-column.js";
 export * from "./components/resizable.js";
 export * from "./components/run-timeline.js";
 export * from "./components/scroll-area.js";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iCAAiC,CAAC;AAChD,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oCAAoC,CAAC;AACnD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,uCAAuC,CAAC;AACtD,cAAc,0BAA0B,CAAC;AACzC,cAAc,kCAAkC,CAAC;AACjD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uBAAuB,CAAC;AACtC,cAAc,iCAAiC,CAAC;AAChD,cAAc,0BAA0B,CAAC;AACzC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oBAAoB,CAAC;AACnC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,oBAAoB,CAAC;AACnC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,mBAAmB,CAAC;AAClC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,sBAAsB,CAAC;AACrC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC;AAClD,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,iCAAiC,CAAC;AAChD,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,kCAAkC,CAAC;AACjD,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,6BAA6B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -83,6 +83,7 @@ export * from "./components/logo-band.js";
 export * from "./components/logo-tile.js";
 export * from "./components/media-mount.js";
 export * from "./components/memory-item.js";
+export * from "./components/menu-choice-row.js";
 export * from "./components/menubar.js";
 export * from "./components/native-select.js";
 export * from "./components/nav-bar.js";
@@ -99,6 +100,7 @@ export * from "./components/progress.js";
 export * from "./components/proof-slot.js";
 export * from "./components/quote-card.js";
 export * from "./components/radio-group.js";
+export * from "./components/reading-column.js";
 export * from "./components/resizable.js";
 export * from "./components/run-timeline.js";
 export * from "./components/scroll-area.js";

package/docs/contract.md

@@ -208,6 +208,13 @@ missing: null and undefined values use the required localized
 unknown facts or replace them with indefinite loading skeletons. Editable
 controls remain in `SettingsSection`.
 
+`ReadingColumn` owns the centered content column a settings region reads in.
+`width="reading"` bounds the measure at `max-w-3xl` for stacked forms and record
+sections; `width="full"` keeps the workspace width for a page whose table needs
+it. Both stay centered, so the column agrees with the centered page heading
+above it at either width. Consumers supply the sections inside it and do not set
+their own container width or centering around them.
+
 `SettingsSection` composes Card's named header, divider, FieldGroup body, and
 optional divided `footer` for local save actions and feedback. The caller owns
 the form transaction and controls; the section owns their shared geometry.
@@ -258,7 +265,14 @@ seams. Empty states and operational notices remain distinct message owners.
 
 `DropdownMenuContent density="comfortable"` supplies roomier command rows
 through the shared owner. Account-menu consumers put the label first and the
-icon at the trailing edge. `ThemeModeMenu` supplies the named inline theme
-row with three exclusive menu radio items; `iconOnly` retains each radio's
-accessible name and checked state without a second checkmark. Theme selection
-keeps the menu open. Consumers bind preference persistence and localized labels.
+icon at the trailing edge. `MenuChoiceRow` owns a named inline preference row:
+the label reads at the leading edge and the exclusive choices sit together at
+the trailing edge as compact menu radio items, each carrying a glyph or a short
+code. `iconOnly` retains every radio's accessible name and checked state without
+a second checkmark, and selection keeps the menu open. `ThemeModeMenu` is the
+theme row built on it. The account menu shows two such rows, Theme and Language.
+
+The identity row names who is signed in and carries one `DropdownMenuItem
+iconOnly` gear at its trailing edge, linking to the account section; the menu
+does not repeat that section's pages as commands. Consumers bind preference
+persistence, routing, and localized labels.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/ui",
-  "version": "6.3.4",
+  "version": "6.4.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -70,7 +70,7 @@
     "@assistant-ui/react": "0.15.18",
     "@assistant-ui/react-markdown": "0.14.14",
     "@base-ui/react": "^1.8.0",
-    "@nadicodeai/design-system": "6.3.4",
+    "@nadicodeai/design-system": "6.4.0",
     "@paper-design/shaders": "0.0.80",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",