@nocoo/basalt 3.0.0 → 3.2.0

package/dist/components/dialog.js

@@ -46,13 +46,13 @@ var g = i.forwardRef(({ className: e, children: t, size: n = "base", disablePoin
 g.displayName = s.Content.displayName;
 var _ = i.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a(s.Title, {
 	ref: r,
-	className: e("text-basalt-3xl font-semibold tracking-tight", t),
+	className: e("min-w-0 text-basalt-xl font-semibold leading-basalt-tight tracking-tight wrap-anywhere", t),
 	...n
 }));
 _.displayName = s.Title.displayName;
 var v = i.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a(s.Description, {
 	ref: r,
-	className: e("text-basalt-lg text-basalt-muted-foreground", t),
+	className: e("text-basalt-base leading-[var(--basalt-line-relaxed)] text-basalt-muted-foreground", t),
 	...n
 }));
 v.displayName = s.Description.displayName;
@@ -62,7 +62,7 @@ var y = ({ className: t, ...n }) => /* @__PURE__ */ a("div", {
 });
 y.displayName = "DialogHeader";
 var b = ({ className: t, ...n }) => /* @__PURE__ */ a("div", {
-	className: e("mt-basalt-space-lg flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end", t),
+	className: e("mt-basalt-layout flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end", t),
 	...n
 });
 b.displayName = "DialogFooter";

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","names":["React","DialogPrimitive","DIALOG_SIZES","dialogOverlayClass","cn","OVERLAY_LAYER","OVERLAY_MOTION","className","dialogPanelClass","BASALT_UI_CLASS","size","Dialog","DialogTrigger","DialogClose","DialogPortal","DialogOverlay","props","DialogContent","disablePointerDismissal","event","onPointerDownOutside","onInteractOutside","DialogTitle","DialogDescription","DialogHeader","DialogFooter"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const DIALOG_SIZES = {\n\tsm: \"sm:w-basalt-72\",\n\tbase: \"sm:w-basalt-96\",\n\tlg: \"sm:w-[32rem]\",\n\txl: \"sm:w-[48rem]\",\n} as const;\n\nexport type DialogSize = keyof typeof DIALOG_SIZES;\n\nexport function dialogOverlayClass(className?: string) {\n\treturn cn(\n\t\t\"fixed inset-0 bg-basalt-backdrop/40 backdrop-blur-md\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-overlay-in data-[state=closed]:animate-basalt-overlay-out\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function dialogPanelClass({\n\tsize = \"base\",\n\tclassName,\n}: {\n\tsize?: DialogSize;\n\tclassName?: string;\n} = {}) {\n\treturn cn(\n\t\tBASALT_UI_CLASS,\n\t\t\"fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg p-basalt-card sm:p-basalt-card-lg text-basalt-foreground shadow-lg ring-1 ring-basalt-border\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out\",\n\t\tOVERLAY_MOTION,\n\t\tDIALOG_SIZES[size],\n\t\tclassName,\n\t);\n}\n\ntype RadixDialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ntype RadixDialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ntype RadixDialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ntype RadixDialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ntype RadixDialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ntype RadixDialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ntype RadixDialogDescriptionProps = React.ComponentPropsWithoutRef<\n\ttypeof DialogPrimitive.Description\n>;\ntype RadixDialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\n\nexport interface DialogProps\n\textends Omit<RadixDialogProps, \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Controlled open state of the dialog.\n\t */\n\topen?: RadixDialogProps[\"open\"];\n\t/**\n\t * Uncontrolled default open state of the dialog on initial render.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDialogProps[\"defaultOpen\"];\n\t/**\n\t * Callback invoked when the open state changes.\n\t */\n\tonOpenChange?: RadixDialogProps[\"onOpenChange\"];\n\t/**\n\t * Whether the dialog renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default true\n\t */\n\tmodal?: RadixDialogProps[\"modal\"];\n}\n\nexport const Dialog: React.FC<DialogProps> = DialogPrimitive.Root;\n\nexport interface DialogTriggerProps extends Omit<RadixDialogTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Trigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTriggerProps[\"asChild\"];\n}\n\nexport const DialogTrigger = DialogPrimitive.Trigger;\n\nexport interface DialogCloseProps extends Omit<RadixDialogCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Close forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogCloseProps[\"asChild\"];\n}\n\nexport const DialogClose = DialogPrimitive.Close;\n\nexport interface DialogPortalProps\n\textends Omit<RadixDialogPortalProps, \"container\" | \"forceMount\"> {\n\t/**\n\t * Target container element where the dialog overlay and content portal should mount.\n\t */\n\tcontainer?: RadixDialogPortalProps[\"container\"];\n\t/**\n\t * Used to force mounting when controlling transition animations externally.\n\t */\n\tforceMount?: RadixDialogPortalProps[\"forceMount\"];\n}\n\nexport const DialogPortal = DialogPrimitive.Portal;\n\nexport interface DialogOverlayProps\n\textends Omit<RadixDialogOverlayProps, \"asChild\" | \"forceMount\"> {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Overlay forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogOverlayProps[\"asChild\"];\n\t/**\n\t * Used to force mounting when controlling transition animations externally.\n\t */\n\tforceMount?: RadixDialogOverlayProps[\"forceMount\"];\n}\n\nexport const DialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Overlay>,\n\tDialogOverlayProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nexport interface DialogContentProps\n\textends Omit<\n\t\tRadixDialogContentProps,\n\t\t| \"size\"\n\t\t| \"disablePointerDismissal\"\n\t\t| \"asChild\"\n\t\t| \"forceMount\"\n\t\t| \"trapFocus\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Fixed desktop width preset. Dialog panel scrolls vertically when content overflows available viewport height.\n\t * @default \"base\"\n\t */\n\tsize?: DialogSize;\n\t/**\n\t * When true, pointer interactions outside the dialog panel are prevented from dismissing the dialog.\n\t * @default false\n\t */\n\tdisablePointerDismissal?: boolean;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Content forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogContentProps[\"asChild\"];\n\t/**\n\t * Force mounting content in DOM for external animation controls.\n\t * When forceMount is true, the content remains mounted even when closed.\n\t * The caller is responsible for visibility transitions and unmounting after animation completes.\n\t * Note: Keeping modal content forceMounted may isolate background interactions until unmounted.\n\t */\n\tforceMount?: RadixDialogContentProps[\"forceMount\"];\n\t/**\n\t * Event handler called when auto-focusing the first element on open. Can be prevented with event.preventDefault().\n\t */\n\tonOpenAutoFocus?: RadixDialogContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Event handler called when restoring focus on close. Can be prevented with event.preventDefault().\n\t */\n\tonCloseAutoFocus?: RadixDialogContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Event handler called when the Escape key is pressed. Can be prevented with event.preventDefault().\n\t */\n\tonEscapeKeyDown?: RadixDialogContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Event handler called when a pointer event occurs outside the dialog bounds.\n\t */\n\tonPointerDownOutside?: RadixDialogContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Event handler called when focus moves outside the dialog bounds.\n\t */\n\tonFocusOutside?: RadixDialogContentProps[\"onFocusOutside\"];\n\t/**\n\t * Event handler called when any interaction (pointer or focus) occurs outside the dialog bounds.\n\t */\n\tonInteractOutside?: RadixDialogContentProps[\"onInteractOutside\"];\n}\n\nexport const DialogContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tsize = \"base\",\n\t\t\tdisablePointerDismissal = false,\n\t\t\tonPointerDownOutside,\n\t\t\tonInteractOutside,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<DialogPortal forceMount={props.forceMount}>\n\t\t\t<DialogOverlay forceMount={props.forceMount} />\n\t\t\t<DialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tdata-basalt-surface-root=\"\"\n\t\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</DialogPrimitive.Content>\n\t\t</DialogPortal>\n\t),\n);\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nexport interface DialogTitleProps extends Omit<RadixDialogTitleProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered heading element to the child element, merging props and behavior.\n\t * Title forwards ref to HTMLHeadingElement and inherits native h2 attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTitleProps[\"asChild\"];\n}\n\nexport const DialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tDialogTitleProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-basalt-3xl font-semibold tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport interface DialogDescriptionProps extends Omit<RadixDialogDescriptionProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered paragraph element to the child element, merging props and behavior.\n\t * Description forwards ref to HTMLParagraphElement and inherits native p attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogDescriptionProps[\"asChild\"];\n}\n\nexport const DialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tDialogDescriptionProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-basalt-lg text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DialogHeader = ({ className, ...props }: DialogHeaderProps) => (\n\t<div className={cn(\"flex flex-col space-y-basalt-space-md text-left\", className)} {...props} />\n);\nDialogHeader.displayName = \"DialogHeader\";\n\nexport interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DialogFooter = ({ className, ...props }: DialogFooterProps) => (\n\t<div\n\t\tclassName={cn(\n\t\t\t\"mt-basalt-space-lg flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nDialogFooter.displayName = \"DialogFooter\";\n"],"mappings":";;;;;;;;AAMA,IAAaE,IAAe;CAC3B,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;AACL;AAIA,SAAgBC,EAAmB,GAAoB;CACtD,OAAOC,EACN,wDACAC,GACA,8FACAC,GACAC,CACD;AACD;AAEA,SAAgBC,EAAiB,EAChC,UAAO,QACP,iBAIG,CAAC,GAAG;CACP,OAAOJ,EACNK,GACA,kQACAJ,GACA,4FACAC,GACAJ,EAAaQ,IACbH,CACD;AACD;AAmCA,IAAaI,IAAgCV,EAAgB,MAWhDW,IAAgBX,EAAgB,SAWhCY,IAAcZ,EAAgB,OAc9Ba,IAAeb,EAAgB,QAgB/Bc,IAAgBf,EAAM,YAGhC,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,SAAjB;CAA8B;CAAK,WAAWE,EAAmBI,CAAS;CAAG,GAAIS;AAAQ,CAAA,CACzF;AACD,EAAc,cAAcf,EAAgB,QAAQ;AAkEpD,IAAagB,IAAgBjB,EAAM,YAKjC,EACC,cACA,aACA,UAAO,QACP,6BAA0B,IAC1B,yBACA,sBACA,GAAGgB,KAEJ,MAEA,kBAACF,GAAD;CAAc,YAAYE,EAAM;CAAhC,UAAA,CACC,kBAACD,GAAD,EAAe,YAAYC,EAAM,WAAa,CAAA,GAC9C,kBAACf,EAAgB,SAAjB;EACM;EACL,4BAAyB;EACzB,WAAWO,EAAiB;GAAE;GAAM;EAAU,CAAC;EAC/C,uBAAuB,MAAU;GAIhC,AAHIU,KACHC,EAAM,eAAe,GAEtBC,IAAuBD,CAAK;EAC7B;EACA,oBAAoB,MAAU;GAI7B,AAHID,KACHC,EAAM,eAAe,GAEtBE,IAAoBF,CAAK;EAC1B;EACA,GAAIH;EAEH;CACuB,CAAA,CACZ;AAEhB,CAAA,CAAA;AACA,EAAc,cAAcf,EAAgB,QAAQ;AAWpD,IAAaqB,IAActB,EAAM,YAG9B,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,OAAjB;CACM;CACL,WAAWG,EAAG,gDAAgDG,CAAS;CACvE,GAAIS;AACJ,CAAA,CACD;AACD,EAAY,cAAcf,EAAgB,MAAM;AAWhD,IAAasB,IAAoBvB,EAAM,YAGpC,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,aAAjB;CACM;CACL,WAAWG,EAAG,+CAA+CG,CAAS;CACtE,GAAIS;AACJ,CAAA,CACD;AACD,EAAkB,cAAcf,EAAgB,YAAY;AAI5D,IAAauB,KAAgB,EAAE,cAAW,GAAGR,QAC5C,kBAAC,OAAD;CAAK,WAAWZ,EAAG,mDAAmDG,CAAS;CAAG,GAAIS;AAAQ,CAAA;AAE/F,EAAa,cAAc;AAI3B,IAAaS,KAAgB,EAAE,cAAW,GAAGT,QAC5C,kBAAC,OAAD;CACC,WAAWZ,EACV,2FACAG,CACD;CACA,GAAIS;AACJ,CAAA;AAEF,EAAa,cAAc"}
+{"version":3,"file":"dialog.js","names":["React","DialogPrimitive","DIALOG_SIZES","dialogOverlayClass","cn","OVERLAY_LAYER","OVERLAY_MOTION","className","dialogPanelClass","BASALT_UI_CLASS","size","Dialog","DialogTrigger","DialogClose","DialogPortal","DialogOverlay","props","DialogContent","disablePointerDismissal","event","onPointerDownOutside","onInteractOutside","DialogTitle","DialogDescription","DialogHeader","DialogFooter"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const DIALOG_SIZES = {\n\tsm: \"sm:w-basalt-72\",\n\tbase: \"sm:w-basalt-96\",\n\tlg: \"sm:w-[32rem]\",\n\txl: \"sm:w-[48rem]\",\n} as const;\n\nexport type DialogSize = keyof typeof DIALOG_SIZES;\n\nexport function dialogOverlayClass(className?: string) {\n\treturn cn(\n\t\t\"fixed inset-0 bg-basalt-backdrop/40 backdrop-blur-md\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-overlay-in data-[state=closed]:animate-basalt-overlay-out\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function dialogPanelClass({\n\tsize = \"base\",\n\tclassName,\n}: {\n\tsize?: DialogSize;\n\tclassName?: string;\n} = {}) {\n\treturn cn(\n\t\tBASALT_UI_CLASS,\n\t\t\"fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg p-basalt-card sm:p-basalt-card-lg text-basalt-foreground shadow-lg ring-1 ring-basalt-border\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out\",\n\t\tOVERLAY_MOTION,\n\t\tDIALOG_SIZES[size],\n\t\tclassName,\n\t);\n}\n\ntype RadixDialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ntype RadixDialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ntype RadixDialogPortalProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Portal>;\ntype RadixDialogOverlayProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>;\ntype RadixDialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ntype RadixDialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ntype RadixDialogDescriptionProps = React.ComponentPropsWithoutRef<\n\ttypeof DialogPrimitive.Description\n>;\ntype RadixDialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\n\nexport interface DialogProps\n\textends Omit<RadixDialogProps, \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Controlled open state of the dialog.\n\t */\n\topen?: RadixDialogProps[\"open\"];\n\t/**\n\t * Uncontrolled default open state of the dialog on initial render.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDialogProps[\"defaultOpen\"];\n\t/**\n\t * Callback invoked when the open state changes.\n\t */\n\tonOpenChange?: RadixDialogProps[\"onOpenChange\"];\n\t/**\n\t * Whether the dialog renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default true\n\t */\n\tmodal?: RadixDialogProps[\"modal\"];\n}\n\nexport const Dialog: React.FC<DialogProps> = DialogPrimitive.Root;\n\nexport interface DialogTriggerProps extends Omit<RadixDialogTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Trigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTriggerProps[\"asChild\"];\n}\n\nexport const DialogTrigger = DialogPrimitive.Trigger;\n\nexport interface DialogCloseProps extends Omit<RadixDialogCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Close forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogCloseProps[\"asChild\"];\n}\n\nexport const DialogClose = DialogPrimitive.Close;\n\nexport interface DialogPortalProps\n\textends Omit<RadixDialogPortalProps, \"container\" | \"forceMount\"> {\n\t/**\n\t * Target container element where the dialog overlay and content portal should mount.\n\t */\n\tcontainer?: RadixDialogPortalProps[\"container\"];\n\t/**\n\t * Used to force mounting when controlling transition animations externally.\n\t */\n\tforceMount?: RadixDialogPortalProps[\"forceMount\"];\n}\n\nexport const DialogPortal = DialogPrimitive.Portal;\n\nexport interface DialogOverlayProps\n\textends Omit<RadixDialogOverlayProps, \"asChild\" | \"forceMount\"> {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Overlay forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogOverlayProps[\"asChild\"];\n\t/**\n\t * Used to force mounting when controlling transition animations externally.\n\t */\n\tforceMount?: RadixDialogOverlayProps[\"forceMount\"];\n}\n\nexport const DialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Overlay>,\n\tDialogOverlayProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nexport interface DialogContentProps\n\textends Omit<\n\t\tRadixDialogContentProps,\n\t\t| \"size\"\n\t\t| \"disablePointerDismissal\"\n\t\t| \"asChild\"\n\t\t| \"forceMount\"\n\t\t| \"trapFocus\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Fixed desktop width preset. Dialog panel scrolls vertically when content overflows available viewport height.\n\t * @default \"base\"\n\t */\n\tsize?: DialogSize;\n\t/**\n\t * When true, pointer interactions outside the dialog panel are prevented from dismissing the dialog.\n\t * @default false\n\t */\n\tdisablePointerDismissal?: boolean;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Content forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogContentProps[\"asChild\"];\n\t/**\n\t * Force mounting content in DOM for external animation controls.\n\t * When forceMount is true, the content remains mounted even when closed.\n\t * The caller is responsible for visibility transitions and unmounting after animation completes.\n\t * Note: Keeping modal content forceMounted may isolate background interactions until unmounted.\n\t */\n\tforceMount?: RadixDialogContentProps[\"forceMount\"];\n\t/**\n\t * Event handler called when auto-focusing the first element on open. Can be prevented with event.preventDefault().\n\t */\n\tonOpenAutoFocus?: RadixDialogContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Event handler called when restoring focus on close. Can be prevented with event.preventDefault().\n\t */\n\tonCloseAutoFocus?: RadixDialogContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Event handler called when the Escape key is pressed. Can be prevented with event.preventDefault().\n\t */\n\tonEscapeKeyDown?: RadixDialogContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Event handler called when a pointer event occurs outside the dialog bounds.\n\t */\n\tonPointerDownOutside?: RadixDialogContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Event handler called when focus moves outside the dialog bounds.\n\t */\n\tonFocusOutside?: RadixDialogContentProps[\"onFocusOutside\"];\n\t/**\n\t * Event handler called when any interaction (pointer or focus) occurs outside the dialog bounds.\n\t */\n\tonInteractOutside?: RadixDialogContentProps[\"onInteractOutside\"];\n}\n\nexport const DialogContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tsize = \"base\",\n\t\t\tdisablePointerDismissal = false,\n\t\t\tonPointerDownOutside,\n\t\t\tonInteractOutside,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<DialogPortal forceMount={props.forceMount}>\n\t\t\t<DialogOverlay forceMount={props.forceMount} />\n\t\t\t<DialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tdata-basalt-surface-root=\"\"\n\t\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</DialogPrimitive.Content>\n\t\t</DialogPortal>\n\t),\n);\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nexport interface DialogTitleProps extends Omit<RadixDialogTitleProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered heading element to the child element, merging props and behavior.\n\t * Title forwards ref to HTMLHeadingElement and inherits native h2 attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTitleProps[\"asChild\"];\n}\n\nexport const DialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tDialogTitleProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"min-w-0 text-basalt-xl font-semibold leading-basalt-tight tracking-tight wrap-anywhere\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport interface DialogDescriptionProps extends Omit<RadixDialogDescriptionProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered paragraph element to the child element, merging props and behavior.\n\t * Description forwards ref to HTMLParagraphElement and inherits native p attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogDescriptionProps[\"asChild\"];\n}\n\nexport const DialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tDialogDescriptionProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"text-basalt-base leading-[var(--basalt-line-relaxed)] text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DialogHeader = ({ className, ...props }: DialogHeaderProps) => (\n\t<div className={cn(\"flex flex-col space-y-basalt-space-md text-left\", className)} {...props} />\n);\nDialogHeader.displayName = \"DialogHeader\";\n\nexport interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const DialogFooter = ({ className, ...props }: DialogFooterProps) => (\n\t<div\n\t\tclassName={cn(\n\t\t\t\"mt-basalt-layout flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nDialogFooter.displayName = \"DialogFooter\";\n"],"mappings":";;;;;;;;AAMA,IAAaE,IAAe;CAC3B,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;AACL;AAIA,SAAgBC,EAAmB,GAAoB;CACtD,OAAOC,EACN,wDACAC,GACA,8FACAC,GACAC,CACD;AACD;AAEA,SAAgBC,EAAiB,EAChC,UAAO,QACP,iBAIG,CAAC,GAAG;CACP,OAAOJ,EACNK,GACA,kQACAJ,GACA,4FACAC,GACAJ,EAAaQ,IACbH,CACD;AACD;AAmCA,IAAaI,IAAgCV,EAAgB,MAWhDW,IAAgBX,EAAgB,SAWhCY,IAAcZ,EAAgB,OAc9Ba,IAAeb,EAAgB,QAgB/Bc,IAAgBf,EAAM,YAGhC,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,SAAjB;CAA8B;CAAK,WAAWE,EAAmBI,CAAS;CAAG,GAAIS;AAAQ,CAAA,CACzF;AACD,EAAc,cAAcf,EAAgB,QAAQ;AAkEpD,IAAagB,IAAgBjB,EAAM,YAKjC,EACC,cACA,aACA,UAAO,QACP,6BAA0B,IAC1B,yBACA,sBACA,GAAGgB,KAEJ,MAEA,kBAACF,GAAD;CAAc,YAAYE,EAAM;CAAhC,UAAA,CACC,kBAACD,GAAD,EAAe,YAAYC,EAAM,WAAa,CAAA,GAC9C,kBAACf,EAAgB,SAAjB;EACM;EACL,4BAAyB;EACzB,WAAWO,EAAiB;GAAE;GAAM;EAAU,CAAC;EAC/C,uBAAuB,MAAU;GAIhC,AAHIU,KACHC,EAAM,eAAe,GAEtBC,IAAuBD,CAAK;EAC7B;EACA,oBAAoB,MAAU;GAI7B,AAHID,KACHC,EAAM,eAAe,GAEtBE,IAAoBF,CAAK;EAC1B;EACA,GAAIH;EAEH;CACuB,CAAA,CACZ;AAEhB,CAAA,CAAA;AACA,EAAc,cAAcf,EAAgB,QAAQ;AAWpD,IAAaqB,IAActB,EAAM,YAG9B,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,OAAjB;CACM;CACL,WAAWG,EACV,0FACAG,CACD;CACA,GAAIS;AACJ,CAAA,CACD;AACD,EAAY,cAAcf,EAAgB,MAAM;AAWhD,IAAasB,IAAoBvB,EAAM,YAGpC,EAAE,cAAW,GAAGgB,KAAS,MAC3B,kBAACf,EAAgB,aAAjB;CACM;CACL,WAAWG,EACV,sFACAG,CACD;CACA,GAAIS;AACJ,CAAA,CACD;AACD,EAAkB,cAAcf,EAAgB,YAAY;AAI5D,IAAauB,KAAgB,EAAE,cAAW,GAAGR,QAC5C,kBAAC,OAAD;CAAK,WAAWZ,EAAG,mDAAmDG,CAAS;CAAG,GAAIS;AAAQ,CAAA;AAE/F,EAAa,cAAc;AAI3B,IAAaS,KAAgB,EAAE,cAAW,GAAGT,QAC5C,kBAAC,OAAD;CACC,WAAWZ,EACV,yFACAG,CACD;CACA,GAAIS;AACJ,CAAA;AAEF,EAAa,cAAc"}

package/dist/components/diff-table.js

@@ -20,7 +20,7 @@ function v({ title: v = "Proposed changes", columns: y, className: b, ...x }) {
 				className: "flex flex-wrap items-center justify-between gap-basalt-content-gap border-b border-basalt-border px-basalt-panel-x py-basalt-panel-y",
 				children: [/* @__PURE__ */ g("h3", {
 					id: C,
-					className: "text-basalt-code font-medium",
+					className: "text-basalt-base font-medium",
 					children: v
 				}), /* @__PURE__ */ g("span", {
 					className: "text-basalt-sm text-basalt-muted-foreground",
@@ -38,6 +38,7 @@ function v({ title: v = "Proposed changes", columns: y, className: b, ...x }) {
 					children: [/* @__PURE__ */ g(l, { children: /* @__PURE__ */ _(u, { children: [
 						/* @__PURE__ */ g(c, {
 							scope: "col",
+							className: "ps-basalt-table-edge",
 							children: "Change"
 						}),
 						y.map((e) => /* @__PURE__ */ g(c, {
@@ -47,6 +48,7 @@ function v({ title: v = "Proposed changes", columns: y, className: b, ...x }) {
 						}, e.id)),
 						/* @__PURE__ */ g(c, {
 							scope: "col",
+							className: "pe-basalt-table-edge",
 							children: /* @__PURE__ */ g("span", {
 								className: "sr-only",
 								children: "Include change"
@@ -64,16 +66,15 @@ function v({ title: v = "Proposed changes", columns: y, className: b, ...x }) {
 							},
 							children: [
 								/* @__PURE__ */ g(s, {
-									className: "whitespace-nowrap text-basalt-sm",
+									className: "whitespace-nowrap ps-basalt-table-edge text-basalt-sm",
 									children: /* @__PURE__ */ _("span", {
-										className: "inline-flex items-center gap-basalt-control-gap leading-[var(--basalt-line-body)]",
-										children: [t.change === "add" ? /* @__PURE__ */ g(m, {
+										className: e("inline-flex items-center gap-basalt-control-gap leading-[var(--basalt-line-body)]", t.change === "add" && "text-basalt-success", t.change === "remove" && "text-basalt-destructive"),
+										children: [/* @__PURE__ */ g("span", {
+											"data-diff-marker": "",
 											"aria-hidden": "true",
-											className: "size-basalt-icon-sm"
-										}) : t.change === "remove" ? /* @__PURE__ */ g(p, {
-											"aria-hidden": "true",
-											className: "size-basalt-icon-sm"
-										}) : null, t.change === "unchanged" ? "Keep" : t.change === "add" ? "Add" : "Remove"]
+											className: "inline-flex size-basalt-icon-sm shrink-0 items-center justify-center",
+											children: t.change === "add" ? /* @__PURE__ */ g(m, { className: "size-basalt-icon-sm" }) : t.change === "remove" ? /* @__PURE__ */ g(p, { className: "size-basalt-icon-sm" }) : null
+										}), t.change === "unchanged" ? "Keep" : t.change === "add" ? "Add" : "Remove"]
 									})
 								}),
 								y.map((n) => /* @__PURE__ */ g(s, {
@@ -81,16 +82,20 @@ function v({ title: v = "Proposed changes", columns: y, className: b, ...x }) {
 									style: { minWidth: n.width },
 									children: t.values[n.id] ?? "—"
 								}, n.id)),
-								/* @__PURE__ */ g(s, { children: t.change !== "unchanged" && /* @__PURE__ */ g(n, {
-									disabled: S.blocked,
-									checked: r,
-									"aria-label": `Include ${t.change === "add" ? "addition" : "removal"} ${t.label}`,
-									onCheckedChange: () => S.toggle(t.id)
-								}) })
+								/* @__PURE__ */ g(s, {
+									className: "pe-basalt-table-edge",
+									children: t.change !== "unchanged" && /* @__PURE__ */ g(n, {
+										disabled: S.blocked,
+										checked: r,
+										"aria-label": `Include ${t.change === "add" ? "addition" : "removal"} ${t.label}`,
+										onCheckedChange: () => S.toggle(t.id)
+									})
+								})
 							]
 						}, t.id);
 					}), x.rows.length === 0 && /* @__PURE__ */ g(u, { children: /* @__PURE__ */ g(s, {
 						colSpan: y.length + 2,
+						className: "ps-basalt-table-edge pe-basalt-table-edge",
 						children: /* @__PURE__ */ g("p", {
 							role: "status",
 							className: "text-basalt-muted-foreground",

package/dist/components/diff-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"diff-table.js","names":["_Fragment","Fragment$1","DiffTable","props","vm","useDiffTableViewModel","id","useId","LayerCard","cn","className","title","Table","TableHeader","TableRow","TableHead","columns","column","TableBody","included","row","event","TableCell","Plus","Minus","Checkbox","Check","Button"],"sources":["../../src/components/diff-table.tsx"],"sourcesContent":["import { Check, Minus, Plus } from \"lucide-react\";\nimport { useId } from \"react\";\nimport type { DiffTableColumn, DiffTableRow } from \"../models/diff-table\";\nimport { cn } from \"../utils/cn\";\nimport { useDiffTableViewModel } from \"../viewmodels/use-diff-table\";\nimport { Button } from \"./button\";\nimport { Checkbox } from \"./checkbox\";\nimport { LayerCard } from \"./layer-card\";\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"./table\";\n\nexport type { DiffTableColumn, DiffTableRow } from \"../models/diff-table\";\n\nexport interface DiffTableProps {\n\t/** Stable columns and text/number cells. */\n\tcolumns: readonly DiffTableColumn[];\n\t/** Proposed rows; remount with a new key for a different proposal. */\n\trows: readonly DiffTableRow[];\n\t/** Heading and accessible table name. @default \"Proposed changes\" */\n\ttitle?: string;\n\t/** Explicitly apply only selected changes; rejection keeps the selection for retry. */\n\tonApply: (changes: readonly DiffTableRow[]) => void | Promise<void>;\n\tdisabled?: boolean;\n\tclassName?: string;\n}\n\nexport function DiffTable({\n\ttitle = \"Proposed changes\",\n\tcolumns,\n\tclassName,\n\t...props\n}: DiffTableProps) {\n\tconst vm = useDiffTableViewModel(props);\n\tconst id = useId();\n\treturn (\n\t\t<LayerCard\n\t\t\tpadding=\"none\"\n\t\t\taria-labelledby={id}\n\t\t\tclassName={cn(\"min-w-0 overflow-hidden leading-[var(--basalt-line-body)]\", className)}\n\t\t>\n\t\t\t<header className=\"flex flex-wrap items-center justify-between gap-basalt-content-gap border-b border-basalt-border px-basalt-panel-x py-basalt-panel-y\">\n\t\t\t\t<h3 id={id} className=\"text-basalt-code font-medium\">\n\t\t\t\t\t{title}\n\t\t\t\t</h3>\n\t\t\t\t<span className=\"text-basalt-sm text-basalt-muted-foreground\">Select changes to apply</span>\n\t\t\t</header>\n\t\t\t<div\n\t\t\t\trole=\"region\"\n\t\t\t\taria-label={`${title} scroll area`}\n\t\t\t\t// biome-ignore lint/a11y/noNoninteractiveTabindex: Named overflow region supports keyboard scrolling.\n\t\t\t\ttabIndex={0}\n\t\t\t\tclassName=\"overflow-x-auto outline-hidden focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-basalt-ring\"\n\t\t\t>\n\t\t\t\t<Table aria-label={title} aria-busy={vm.status === \"applying\" || undefined}>\n\t\t\t\t\t<TableHeader>\n\t\t\t\t\t\t<TableRow>\n\t\t\t\t\t\t\t<TableHead scope=\"col\">Change</TableHead>\n\t\t\t\t\t\t\t{columns.map((column) => (\n\t\t\t\t\t\t\t\t<TableHead key={column.id} scope=\"col\" style={{ minWidth: column.width }}>\n\t\t\t\t\t\t\t\t\t{column.label}\n\t\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t<TableHead scope=\"col\">\n\t\t\t\t\t\t\t\t<span className=\"sr-only\">Include change</span>\n\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t</TableHeader>\n\t\t\t\t\t<TableBody>\n\t\t\t\t\t\t{props.rows.map((row) => {\n\t\t\t\t\t\t\tconst included = row.change !== \"unchanged\" && !vm.excluded.includes(row.id);\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\t\t\tdata-diff-change={row.change}\n\t\t\t\t\t\t\t\t\tdata-included={included}\n\t\t\t\t\t\t\t\t\taria-selected={row.change !== \"unchanged\" ? included : undefined}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"basalt-agent-reveal\",\n\t\t\t\t\t\t\t\t\t\trow.change !== \"unchanged\" && !vm.blocked && \"cursor-pointer\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\tif (event.target instanceof Element && event.target.closest(\"button, a, input\"))\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\tvm.toggle(row.id);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<TableCell className=\"whitespace-nowrap text-basalt-sm\">\n\t\t\t\t\t\t\t\t\t\t<span className=\"inline-flex items-center gap-basalt-control-gap leading-[var(--basalt-line-body)]\">\n\t\t\t\t\t\t\t\t\t\t\t{row.change === \"add\" ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<Plus aria-hidden=\"true\" className=\"size-basalt-icon-sm\" />\n\t\t\t\t\t\t\t\t\t\t\t) : row.change === \"remove\" ? (\n\t\t\t\t\t\t\t\t\t\t\t\t<Minus aria-hidden=\"true\" className=\"size-basalt-icon-sm\" />\n\t\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t\t\t{row.change === \"unchanged\"\n\t\t\t\t\t\t\t\t\t\t\t\t? \"Keep\"\n\t\t\t\t\t\t\t\t\t\t\t\t: row.change === \"add\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t? \"Add\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t: \"Remove\"}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t\t{columns.map((column) => (\n\t\t\t\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\t\t\t\tkey={column.id}\n\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\"whitespace-nowrap\",\n\t\t\t\t\t\t\t\t\t\t\t\tincluded && row.change === \"remove\" && \"line-through\",\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ minWidth: column.width }}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{row.values[column.id] ?? \"—\"}\n\t\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t<TableCell>\n\t\t\t\t\t\t\t\t\t\t{row.change !== \"unchanged\" && (\n\t\t\t\t\t\t\t\t\t\t\t<Checkbox\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={vm.blocked}\n\t\t\t\t\t\t\t\t\t\t\t\tchecked={included}\n\t\t\t\t\t\t\t\t\t\t\t\taria-label={`Include ${row.change === \"add\" ? \"addition\" : \"removal\"} ${row.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\tonCheckedChange={() => vm.toggle(row.id)}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t\t{props.rows.length === 0 && (\n\t\t\t\t\t\t\t<TableRow>\n\t\t\t\t\t\t\t\t<TableCell colSpan={columns.length + 2}>\n\t\t\t\t\t\t\t\t\t<p role=\"status\" className=\"text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\tNo proposed changes\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</TableBody>\n\t\t\t\t</Table>\n\t\t\t</div>\n\t\t\t{vm.error && (\n\t\t\t\t<p\n\t\t\t\t\trole=\"alert\"\n\t\t\t\t\tclassName=\"px-basalt-panel-x py-basalt-panel-y text-basalt-sm text-basalt-danger\"\n\t\t\t\t>\n\t\t\t\t\t{vm.error}\n\t\t\t\t</p>\n\t\t\t)}\n\t\t\t<footer className=\"flex flex-wrap items-center justify-between gap-basalt-content-gap border-t border-basalt-border px-basalt-panel-x py-basalt-panel-y\">\n\t\t\t\t{vm.status === \"applied\" ? (\n\t\t\t\t\t<p\n\t\t\t\t\t\trole=\"status\"\n\t\t\t\t\t\tclassName=\"inline-flex items-center gap-basalt-space-md text-basalt-base\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Check aria-hidden=\"true\" className=\"size-basalt-icon\" />\n\t\t\t\t\t\t{vm.selected.length} changes applied\n\t\t\t\t\t</p>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<span className=\"text-basalt-sm tabular-nums text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t{vm.removals} removals · {vm.additions} additions\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\tloading={vm.status === \"applying\"}\n\t\t\t\t\t\t\tdisabled={vm.blocked || vm.selected.length === 0}\n\t\t\t\t\t\t\tonClick={() => void vm.apply()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tApply {vm.selected.length} changes\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</footer>\n\t\t</LayerCard>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"file":"diff-table.js","names":["_Fragment","Fragment$1","DiffTable","props","vm","useDiffTableViewModel","id","useId","LayerCard","cn","className","title","Table","TableHeader","TableRow","TableHead","columns","column","TableBody","included","row","event","TableCell","Plus","Minus","Checkbox","Check","Button"],"sources":["../../src/components/diff-table.tsx"],"sourcesContent":["import { Check, Minus, Plus } from \"lucide-react\";\nimport { useId } from \"react\";\nimport type { DiffTableColumn, DiffTableRow } from \"../models/diff-table\";\nimport { cn } from \"../utils/cn\";\nimport { useDiffTableViewModel } from \"../viewmodels/use-diff-table\";\nimport { Button } from \"./button\";\nimport { Checkbox } from \"./checkbox\";\nimport { LayerCard } from \"./layer-card\";\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"./table\";\n\nexport type { DiffTableColumn, DiffTableRow } from \"../models/diff-table\";\n\nexport interface DiffTableProps {\n\t/** Stable columns and text/number cells. */\n\tcolumns: readonly DiffTableColumn[];\n\t/** Proposed rows; remount with a new key for a different proposal. */\n\trows: readonly DiffTableRow[];\n\t/** Heading and accessible table name. @default \"Proposed changes\" */\n\ttitle?: string;\n\t/** Explicitly apply only selected changes; rejection keeps the selection for retry. */\n\tonApply: (changes: readonly DiffTableRow[]) => void | Promise<void>;\n\tdisabled?: boolean;\n\tclassName?: string;\n}\n\nexport function DiffTable({\n\ttitle = \"Proposed changes\",\n\tcolumns,\n\tclassName,\n\t...props\n}: DiffTableProps) {\n\tconst vm = useDiffTableViewModel(props);\n\tconst id = useId();\n\treturn (\n\t\t<LayerCard\n\t\t\tpadding=\"none\"\n\t\t\taria-labelledby={id}\n\t\t\tclassName={cn(\"min-w-0 overflow-hidden leading-[var(--basalt-line-body)]\", className)}\n\t\t>\n\t\t\t<header className=\"flex flex-wrap items-center justify-between gap-basalt-content-gap border-b border-basalt-border px-basalt-panel-x py-basalt-panel-y\">\n\t\t\t\t<h3 id={id} className=\"text-basalt-base font-medium\">\n\t\t\t\t\t{title}\n\t\t\t\t</h3>\n\t\t\t\t<span className=\"text-basalt-sm text-basalt-muted-foreground\">Select changes to apply</span>\n\t\t\t</header>\n\t\t\t<div\n\t\t\t\trole=\"region\"\n\t\t\t\taria-label={`${title} scroll area`}\n\t\t\t\t// biome-ignore lint/a11y/noNoninteractiveTabindex: Named overflow region supports keyboard scrolling.\n\t\t\t\ttabIndex={0}\n\t\t\t\tclassName=\"overflow-x-auto outline-hidden focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-basalt-ring\"\n\t\t\t>\n\t\t\t\t<Table aria-label={title} aria-busy={vm.status === \"applying\" || undefined}>\n\t\t\t\t\t<TableHeader>\n\t\t\t\t\t\t<TableRow>\n\t\t\t\t\t\t\t<TableHead scope=\"col\" className=\"ps-basalt-table-edge\">\n\t\t\t\t\t\t\t\tChange\n\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t\t{columns.map((column) => (\n\t\t\t\t\t\t\t\t<TableHead key={column.id} scope=\"col\" style={{ minWidth: column.width }}>\n\t\t\t\t\t\t\t\t\t{column.label}\n\t\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t<TableHead scope=\"col\" className=\"pe-basalt-table-edge\">\n\t\t\t\t\t\t\t\t<span className=\"sr-only\">Include change</span>\n\t\t\t\t\t\t\t</TableHead>\n\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t</TableHeader>\n\t\t\t\t\t<TableBody>\n\t\t\t\t\t\t{props.rows.map((row) => {\n\t\t\t\t\t\t\tconst included = row.change !== \"unchanged\" && !vm.excluded.includes(row.id);\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<TableRow\n\t\t\t\t\t\t\t\t\tkey={row.id}\n\t\t\t\t\t\t\t\t\tdata-diff-change={row.change}\n\t\t\t\t\t\t\t\t\tdata-included={included}\n\t\t\t\t\t\t\t\t\taria-selected={row.change !== \"unchanged\" ? included : undefined}\n\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\"basalt-agent-reveal\",\n\t\t\t\t\t\t\t\t\t\trow.change !== \"unchanged\" && !vm.blocked && \"cursor-pointer\",\n\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\tonClick={(event) => {\n\t\t\t\t\t\t\t\t\t\tif (event.target instanceof Element && event.target.closest(\"button, a, input\"))\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\tvm.toggle(row.id);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<TableCell className=\"whitespace-nowrap ps-basalt-table-edge text-basalt-sm\">\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\"inline-flex items-center gap-basalt-control-gap leading-[var(--basalt-line-body)]\",\n\t\t\t\t\t\t\t\t\t\t\t\trow.change === \"add\" && \"text-basalt-success\",\n\t\t\t\t\t\t\t\t\t\t\t\trow.change === \"remove\" && \"text-basalt-destructive\",\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\tdata-diff-marker=\"\"\n\t\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"inline-flex size-basalt-icon-sm shrink-0 items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{row.change === \"add\" ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Plus className=\"size-basalt-icon-sm\" />\n\t\t\t\t\t\t\t\t\t\t\t\t) : row.change === \"remove\" ? (\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Minus className=\"size-basalt-icon-sm\" />\n\t\t\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t{row.change === \"unchanged\"\n\t\t\t\t\t\t\t\t\t\t\t\t? \"Keep\"\n\t\t\t\t\t\t\t\t\t\t\t\t: row.change === \"add\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t? \"Add\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t: \"Remove\"}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t\t{columns.map((column) => (\n\t\t\t\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\t\t\t\tkey={column.id}\n\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\"whitespace-nowrap\",\n\t\t\t\t\t\t\t\t\t\t\t\tincluded && row.change === \"remove\" && \"line-through\",\n\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ minWidth: column.width }}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{row.values[column.id] ?? \"—\"}\n\t\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t<TableCell className=\"pe-basalt-table-edge\">\n\t\t\t\t\t\t\t\t\t\t{row.change !== \"unchanged\" && (\n\t\t\t\t\t\t\t\t\t\t\t<Checkbox\n\t\t\t\t\t\t\t\t\t\t\t\tdisabled={vm.blocked}\n\t\t\t\t\t\t\t\t\t\t\t\tchecked={included}\n\t\t\t\t\t\t\t\t\t\t\t\taria-label={`Include ${row.change === \"add\" ? \"addition\" : \"removal\"} ${row.label}`}\n\t\t\t\t\t\t\t\t\t\t\t\tonCheckedChange={() => vm.toggle(row.id)}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t\t{props.rows.length === 0 && (\n\t\t\t\t\t\t\t<TableRow>\n\t\t\t\t\t\t\t\t<TableCell\n\t\t\t\t\t\t\t\t\tcolSpan={columns.length + 2}\n\t\t\t\t\t\t\t\t\tclassName=\"ps-basalt-table-edge pe-basalt-table-edge\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p role=\"status\" className=\"text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\tNo proposed changes\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t</TableCell>\n\t\t\t\t\t\t\t</TableRow>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</TableBody>\n\t\t\t\t</Table>\n\t\t\t</div>\n\t\t\t{vm.error && (\n\t\t\t\t<p\n\t\t\t\t\trole=\"alert\"\n\t\t\t\t\tclassName=\"px-basalt-panel-x py-basalt-panel-y text-basalt-sm text-basalt-danger\"\n\t\t\t\t>\n\t\t\t\t\t{vm.error}\n\t\t\t\t</p>\n\t\t\t)}\n\t\t\t<footer className=\"flex flex-wrap items-center justify-between gap-basalt-content-gap border-t border-basalt-border px-basalt-panel-x py-basalt-panel-y\">\n\t\t\t\t{vm.status === \"applied\" ? (\n\t\t\t\t\t<p\n\t\t\t\t\t\trole=\"status\"\n\t\t\t\t\t\tclassName=\"inline-flex items-center gap-basalt-space-md text-basalt-base\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<Check aria-hidden=\"true\" className=\"size-basalt-icon\" />\n\t\t\t\t\t\t{vm.selected.length} changes applied\n\t\t\t\t\t</p>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<span className=\"text-basalt-sm tabular-nums text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t{vm.removals} removals · {vm.additions} additions\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\tloading={vm.status === \"applying\"}\n\t\t\t\t\t\t\tdisabled={vm.blocked || vm.selected.length === 0}\n\t\t\t\t\t\t\tonClick={() => void vm.apply()}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tApply {vm.selected.length} changes\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</footer>\n\t\t</LayerCard>\n\t);\n}\n"],"mappings":"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"}

package/dist/components/input-area.js

@@ -8,7 +8,7 @@ import { jsx as i } from "react/jsx-runtime";
 var a = {
 	sm: "min-h-basalt-textarea-sm px-basalt-space-lg py-basalt-space-md text-basalt-sm",
 	default: "min-h-basalt-textarea px-basalt-control-x py-basalt-space-lg text-basalt-base",
-	lg: "min-h-basalt-textarea-lg px-basalt-control-x-lg py-basalt-space-lg text-basalt-lg"
+	lg: "min-h-basalt-textarea-lg px-basalt-control-x-lg py-basalt-space-lg text-basalt-base"
 }, o = {
 	"data-1p-ignore": "true",
 	"data-bwignore": "true",

package/dist/components/input-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-area.js","names":["React","INPUT_AREA_SIZE_CLASS","PASSWORD_MANAGER_MARKERS","InputArea","props","controlSurfaceClass","cn","size","FOCUS_BORDER","passwordManagerIgnore","className"],"sources":["../../src/components/input-area.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { FOCUS_BORDER } from \"./overlay\";\n\nexport type InputAreaSize = \"sm\" | \"default\" | \"lg\";\n\nconst INPUT_AREA_SIZE_CLASS: Record<InputAreaSize, string> = {\n\tsm: \"min-h-basalt-textarea-sm px-basalt-space-lg py-basalt-space-md text-basalt-sm\",\n\tdefault: \"min-h-basalt-textarea px-basalt-control-x py-basalt-space-lg text-basalt-base\",\n\tlg: \"min-h-basalt-textarea-lg px-basalt-control-x-lg py-basalt-space-lg text-basalt-lg\",\n};\n\nconst PASSWORD_MANAGER_MARKERS = {\n\t\"data-1p-ignore\": \"true\",\n\t\"data-bwignore\": \"true\",\n\t\"data-form-type\": \"other\",\n\t\"data-lpignore\": \"true\",\n} as const;\n\nexport type InputAreaProps = Omit<React.ComponentProps<\"textarea\">, \"rows\"> & {\n\t/**\n\t * The visible text row count.\n\t */\n\trows?: number;\n\t/**\n\t * The visual size of the text area.\n\t * @default default\n\t */\n\tsize?: InputAreaSize;\n\t/**\n\t * Ignore password managers on this field.\n\t * @default false\n\t */\n\tpasswordManagerIgnore?: boolean;\n};\n\nexport const InputArea = React.forwardRef<HTMLTextAreaElement, InputAreaProps>(\n\t({ className, size = \"default\", passwordManagerIgnore = false, ...props }, ref) => (\n\t\t<textarea\n\t\t\tref={ref}\n\t\t\tclassName={controlSurfaceClass(\n\t\t\t\tcn(\n\t\t\t\t\t\"flex w-full text-basalt-foreground shadow-xs placeholder:text-basalt-muted-foreground disabled:cursor-not-allowed disabled:border-transparent disabled:text-basalt-muted-foreground/40\",\n\t\t\t\t\tINPUT_AREA_SIZE_CLASS[size],\n\t\t\t\t\tFOCUS_BORDER,\n\t\t\t\t\t\"aria-invalid:border-basalt-destructive aria-invalid:focus-visible:border-basalt-destructive\",\n\t\t\t\t\tpasswordManagerIgnore && \"keeper-ignore\",\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t)}\n\t\t\t{...props}\n\t\t\t{...(passwordManagerIgnore ? PASSWORD_MANAGER_MARKERS : {})}\n\t\t/>\n\t),\n);\nInputArea.displayName = \"InputArea\";\n"],"mappings":";;;;;;;AAOA,IAAMC,IAAuD;CAC5D,IAAI;CACJ,SAAS;CACT,IAAI;AACL,GAEMC,IAA2B;CAChC,kBAAkB;CAClB,iBAAiB;CACjB,kBAAkB;CAClB,iBAAiB;AAClB,GAmBaC,IAAYH,EAAM,YAC7B,EAAE,cAAW,UAAO,WAAW,2BAAwB,IAAO,GAAGI,KAAS,MAC1E,kBAAC,YAAD;CACM;CACL,WAAWC,EACVC,EACC,0LACAL,EAAsBM,IACtBC,GACA,+FACAC,KAAyB,iBACzBC,CACD,CACD;CACA,GAAIN;CACJ,GAAKK,IAAwBP,IAA2B,CAAC;AACzD,CAAA,CAEH;AACA,EAAU,cAAc"}
+{"version":3,"file":"input-area.js","names":["React","INPUT_AREA_SIZE_CLASS","PASSWORD_MANAGER_MARKERS","InputArea","props","controlSurfaceClass","cn","size","FOCUS_BORDER","passwordManagerIgnore","className"],"sources":["../../src/components/input-area.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { FOCUS_BORDER } from \"./overlay\";\n\nexport type InputAreaSize = \"sm\" | \"default\" | \"lg\";\n\nconst INPUT_AREA_SIZE_CLASS: Record<InputAreaSize, string> = {\n\tsm: \"min-h-basalt-textarea-sm px-basalt-space-lg py-basalt-space-md text-basalt-sm\",\n\tdefault: \"min-h-basalt-textarea px-basalt-control-x py-basalt-space-lg text-basalt-base\",\n\tlg: \"min-h-basalt-textarea-lg px-basalt-control-x-lg py-basalt-space-lg text-basalt-base\",\n};\n\nconst PASSWORD_MANAGER_MARKERS = {\n\t\"data-1p-ignore\": \"true\",\n\t\"data-bwignore\": \"true\",\n\t\"data-form-type\": \"other\",\n\t\"data-lpignore\": \"true\",\n} as const;\n\nexport type InputAreaProps = Omit<React.ComponentProps<\"textarea\">, \"rows\"> & {\n\t/**\n\t * The visible text row count.\n\t */\n\trows?: number;\n\t/**\n\t * The visual size of the text area.\n\t * @default default\n\t */\n\tsize?: InputAreaSize;\n\t/**\n\t * Ignore password managers on this field.\n\t * @default false\n\t */\n\tpasswordManagerIgnore?: boolean;\n};\n\nexport const InputArea = React.forwardRef<HTMLTextAreaElement, InputAreaProps>(\n\t({ className, size = \"default\", passwordManagerIgnore = false, ...props }, ref) => (\n\t\t<textarea\n\t\t\tref={ref}\n\t\t\tclassName={controlSurfaceClass(\n\t\t\t\tcn(\n\t\t\t\t\t\"flex w-full text-basalt-foreground shadow-xs placeholder:text-basalt-muted-foreground disabled:cursor-not-allowed disabled:border-transparent disabled:text-basalt-muted-foreground/40\",\n\t\t\t\t\tINPUT_AREA_SIZE_CLASS[size],\n\t\t\t\t\tFOCUS_BORDER,\n\t\t\t\t\t\"aria-invalid:border-basalt-destructive aria-invalid:focus-visible:border-basalt-destructive\",\n\t\t\t\t\tpasswordManagerIgnore && \"keeper-ignore\",\n\t\t\t\t\tclassName,\n\t\t\t\t),\n\t\t\t)}\n\t\t\t{...props}\n\t\t\t{...(passwordManagerIgnore ? PASSWORD_MANAGER_MARKERS : {})}\n\t\t/>\n\t),\n);\nInputArea.displayName = \"InputArea\";\n"],"mappings":";;;;;;;AAOA,IAAMC,IAAuD;CAC5D,IAAI;CACJ,SAAS;CACT,IAAI;AACL,GAEMC,IAA2B;CAChC,kBAAkB;CAClB,iBAAiB;CACjB,kBAAkB;CAClB,iBAAiB;AAClB,GAmBaC,IAAYH,EAAM,YAC7B,EAAE,cAAW,UAAO,WAAW,2BAAwB,IAAO,GAAGI,KAAS,MAC1E,kBAAC,YAAD;CACM;CACL,WAAWC,EACVC,EACC,0LACAL,EAAsBM,IACtBC,GACA,+FACAC,KAAyB,iBACzBC,CACD,CACD;CACA,GAAIN;CACJ,GAAKK,IAAwBP,IAA2B,CAAC;AACzD,CAAA,CAEH;AACA,EAAU,cAAc"}

package/dist/components/layer-card.d.ts

@@ -13,7 +13,7 @@ export type LayerCardProps = Omit<HTMLAttributes<HTMLDivElement>, "className"> &
      */
     className?: string;
     /**
-     * Draw a hairline ring. Default grouping is luminance only.
+     * Strengthen the default perimeter hairline.
      * @default false
      */
     outlined?: boolean;
@@ -27,6 +27,8 @@ export type LayerCardSectionProps = HTMLAttributes<HTMLDivElement>;
 export type LayerCardHeaderProps = LayerCardSectionProps & {
     /** Apply header insets to one child, such as a CollapsibleTrigger, without another wrapper. @default false */
     asChild?: boolean;
+    /** Separate the header from its body with a divider. @default false */
+    divided?: boolean;
 };
 export type LayerCardWellProps = LayerCardSectionProps & {
     /**
@@ -65,11 +67,11 @@ export type LayerCardEmptyProps = Omit<HTMLAttributes<HTMLDivElement>, "title" |
      */
     children?: ReactNode;
 };
-declare function LayerCardHeader({ className, asChild, ...props }: LayerCardHeaderProps): import("react").JSX.Element;
+declare function LayerCardHeader({ className, asChild, divided, ...props }: LayerCardHeaderProps): import("react").JSX.Element;
 declare function LayerCardBody({ className, ...props }: LayerCardSectionProps): import("react").JSX.Element;
 declare function LayerCardWell({ className, outlined, ...props }: LayerCardWellProps): import("react").JSX.Element;
 declare function LayerCardPrimary(props: LayerCardWellProps): import("react").JSX.Element;
-declare function LayerCardSecondary(props: LayerCardSectionProps): import("react").JSX.Element;
+declare function LayerCardSecondary(props: LayerCardHeaderProps): import("react").JSX.Element;
 declare function LayerCardFooter({ className, ...props }: LayerCardSectionProps): import("react").JSX.Element;
 declare function LayerCardLoading({ label, className, ...props }: LayerCardLoadingProps): import("react").JSX.Element;
 declare function LayerCardEmpty({ title, className, ...props }: LayerCardEmptyProps): import("react").JSX.Element;
@@ -79,7 +81,7 @@ export declare const LayerCard: import("react").ForwardRefExoticComponent<Omit<H
      */
     className?: string;
     /**
-     * Draw a hairline ring. Default grouping is luminance only.
+     * Strengthen the default perimeter hairline.
      * @default false
      */
     outlined?: boolean;

package/dist/components/layer-card.js

@@ -3,136 +3,125 @@ import { cn as e } from "../utils/cn.js";
 import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
 import { Empty as n } from "./empty.js";
 import { SkeletonLine as r } from "./skeleton-line.js";
-import { Children as i, Fragment as a, cloneElement as o, forwardRef as s, isValidElement as c } from "react";
-import { Slot as l } from "@radix-ui/react-slot";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Children as i, Fragment as a, forwardRef as o, isValidElement as s } from "react";
+import { Slot as c } from "@radix-ui/react-slot";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/layer-card.tsx
-var f = `${t} overflow-hidden rounded-basalt-lg text-basalt-foreground`, p = {
+var d = `${t} overflow-hidden rounded-basalt-lg ring-1 ring-basalt-border/50 text-basalt-foreground`, f = {
 	none: "",
 	sm: "p-basalt-card-sm",
 	md: "p-basalt-card",
 	lg: "p-basalt-card-lg",
 	xl: "p-basalt-card-xl"
 };
-function m(e) {
-	return c(e);
+function p(e) {
+	return s(e);
 }
-function h(e, t) {
-	return i.toArray(e).some((e) => m(e) ? t(e.type) ? !0 : e.type === a && h(e.props.children, t) : !1);
+function m(e, t) {
+	return i.toArray(e).some((e) => p(e) ? t(e.type) ? !0 : e.type === a && m(e.props.children, t) : !1);
 }
-function g(t, n) {
-	return n ? i.map(t, (t) => {
-		if (!m(t)) return t;
-		if (t.type === a) return o(t, { children: g(t.props.children, n) });
-		if (t.type === v || t.type === S) {
-			let n = t;
-			return o(n, { className: e(n.props.className, "border-b border-basalt-border") });
-		}
-		return t;
-	}) : t;
-}
-var _ = s(({ className: t, children: n, outlined: r = !1, padding: i = "md", ...a }, o) => {
-	let s = h(n, (e) => E.has(e)), c = h(n, (e) => e === b || e === x), l = h(n, (e) => e === y) && !c;
-	return /* @__PURE__ */ u("div", {
+var h = o(({ className: t, children: n, outlined: r = !1, padding: i = "md", ...a }, o) => {
+	let s = m(n, (e) => w.has(e));
+	return /* @__PURE__ */ l("div", {
 		ref: o,
 		"data-basalt-surface": "",
 		"data-card-structured": s || void 0,
-		className: e(f, s ? "flex w-full flex-col" : p[i], r && "ring-1 ring-basalt-border/40", t),
+		className: e(d, s ? "flex w-full flex-col" : f[i], r && "ring-basalt-border", t),
 		...a,
-		children: g(n, l)
+		children: n
 	});
 });
-_.displayName = "LayerCard";
-function v({ className: t, asChild: n = !1, ...r }) {
-	return /* @__PURE__ */ u(n ? l : "div", {
+h.displayName = "LayerCard";
+function g({ className: t, asChild: n = !1, divided: r = !1, ...i }) {
+	return /* @__PURE__ */ l(n ? c : "div", {
 		"data-slot": "card-header",
-		className: e("flex min-w-0 justify-between gap-basalt-card px-basalt-card py-basalt-card-sm text-basalt-muted-foreground", n ? "w-full items-center" : "items-start", t),
-		...r
+		className: e("flex min-w-0 justify-between gap-basalt-space-lg text-basalt-base font-medium tracking-tight text-basalt-foreground", n ? "w-full items-center px-basalt-card py-basalt-card-sm data-[state=open]:border-b data-[state=open]:border-basalt-border" : r ? "items-start p-basalt-card border-b border-basalt-border" : "items-start px-basalt-card pt-basalt-card pb-0", t),
+		...i
 	});
 }
-v.displayName = "LayerCard.Header";
-function y({ className: t, ...n }) {
-	return /* @__PURE__ */ u("div", {
+g.displayName = "LayerCard.Header";
+function _({ className: t, ...n }) {
+	return /* @__PURE__ */ l("div", {
 		"data-slot": "card-body",
 		className: e("min-w-0 p-basalt-card", t),
 		...n
 	});
 }
-y.displayName = "LayerCard.Body";
-function b({ className: t, outlined: n = !1, ...r }) {
-	return /* @__PURE__ */ u("div", {
+_.displayName = "LayerCard.Body";
+function v({ className: t, outlined: n = !1, ...r }) {
+	return /* @__PURE__ */ l("div", {
 		"data-basalt-surface": "",
 		className: e("min-w-0 p-basalt-card", n && "ring-1 ring-basalt-border/40", t),
 		...r
 	});
 }
-b.displayName = "LayerCard.Well";
-function x(e) {
-	return /* @__PURE__ */ u(b, { ...e });
+v.displayName = "LayerCard.Well";
+function y(e) {
+	return /* @__PURE__ */ l(v, { ...e });
 }
-x.displayName = "LayerCard.Primary";
-function S(e) {
-	return /* @__PURE__ */ u(v, { ...e });
+y.displayName = "LayerCard.Primary";
+function b(e) {
+	return /* @__PURE__ */ l(g, { ...e });
 }
-S.displayName = "LayerCard.Secondary";
-function C({ className: t, ...n }) {
-	return /* @__PURE__ */ u("div", {
+b.displayName = "LayerCard.Secondary";
+function x({ className: t, ...n }) {
+	return /* @__PURE__ */ l("div", {
 		className: e("flex flex-wrap items-center justify-end gap-basalt-space-lg border-t border-basalt-border px-basalt-card py-basalt-card-sm", t),
 		...n
 	});
 }
-C.displayName = "LayerCard.Footer";
-function w({ label: t = "Loading", className: n, ...i }) {
-	return /* @__PURE__ */ d("div", {
+x.displayName = "LayerCard.Footer";
+function S({ label: t = "Loading", className: n, ...i }) {
+	return /* @__PURE__ */ u("div", {
 		role: "status",
 		"aria-label": t,
 		className: e("space-y-basalt-space-lg p-basalt-card", n),
 		...i,
 		children: [
-			/* @__PURE__ */ u(r, {
+			/* @__PURE__ */ l(r, {
 				minWidth: 100,
 				maxWidth: 100
 			}),
-			/* @__PURE__ */ u(r, {
+			/* @__PURE__ */ l(r, {
 				minWidth: 72,
 				maxWidth: 72
 			}),
-			/* @__PURE__ */ u(r, {
+			/* @__PURE__ */ l(r, {
 				minWidth: 88,
 				maxWidth: 88
 			})
 		]
 	});
 }
-w.displayName = "LayerCard.Loading";
-function T({ title: t = "No content", className: r, ...i }) {
-	return /* @__PURE__ */ u(n, {
+S.displayName = "LayerCard.Loading";
+function C({ title: t = "No content", className: r, ...i }) {
+	return /* @__PURE__ */ l(n, {
 		title: t,
 		className: e("p-basalt-card", r),
 		...i
 	});
 }
-T.displayName = "LayerCard.Empty";
-var E = /* @__PURE__ */ new Set([
+C.displayName = "LayerCard.Empty";
+var w = /* @__PURE__ */ new Set([
+	g,
+	_,
 	v,
-	y,
-	b,
-	C,
-	w,
-	T,
 	x,
-	S
-]), D = Object.assign(_, {
-	Primary: x,
-	Secondary: S,
-	Header: v,
-	Body: y,
-	Well: b,
-	Footer: C,
-	Loading: w,
-	Empty: T
+	S,
+	C,
+	y,
+	b
+]), T = Object.assign(h, {
+	Primary: y,
+	Secondary: b,
+	Header: g,
+	Body: _,
+	Well: v,
+	Footer: x,
+	Loading: S,
+	Empty: C
 });
 //#endregion
-export { D as LayerCard };
+export { T as LayerCard };
 
 //# sourceMappingURL=layer-card.js.map

package/dist/components/layer-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"layer-card.js","names":["ROOT_CLASSES","BASALT_UI_CLASS","PADDING_CLASSES","isElement","isValidElement","child","hasSlot","Children","children","match","Fragment","decorateHeaders","divided","cloneElement","LayerCardHeader","LayerCardSecondary","typed","cn","LayerCardRoot","forwardRef","props","structured","STRUCTURED_TYPES","type","hasWell","LayerCardWell","LayerCardPrimary","headerDivided","LayerCardBody","padding","outlined","className","asChild","Slot","LayerCardFooter","LayerCardLoading","label","SkeletonLine","LayerCardEmpty","Empty","LayerCard"],"sources":["../../src/components/layer-card.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport {\n\tChildren,\n\tcloneElement,\n\tFragment,\n\tforwardRef,\n\ttype HTMLAttributes,\n\tisValidElement,\n\ttype ReactElement,\n\ttype ReactNode,\n} from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Empty } from \"./empty\";\nimport { SkeletonLine } from \"./skeleton-line\";\n\nconst ROOT_CLASSES = `${BASALT_UI_CLASS} overflow-hidden rounded-basalt-lg text-basalt-foreground`;\nconst PADDING_CLASSES = {\n\tnone: \"\",\n\tsm: \"p-basalt-card-sm\",\n\tmd: \"p-basalt-card\",\n\tlg: \"p-basalt-card-lg\",\n\txl: \"p-basalt-card-xl\",\n} as const;\n\nexport type LayerCardPadding = keyof typeof PADDING_CLASSES;\n\nexport type LayerCardProps = Omit<HTMLAttributes<HTMLDivElement>, \"className\"> & {\n\t/**\n\t * Additional classes for the card root.\n\t */\n\tclassName?: string;\n\t/**\n\t * Draw a hairline ring. Default grouping is luminance only.\n\t * @default false\n\t */\n\toutlined?: boolean;\n\t/**\n\t * Inner spacing for unstructured card content.\n\t * @default \"md\"\n\t */\n\tpadding?: LayerCardPadding;\n};\nexport type LayerCardSectionProps = HTMLAttributes<HTMLDivElement>;\nexport type LayerCardHeaderProps = LayerCardSectionProps & {\n\t/** Apply header insets to one child, such as a CollapsibleTrigger, without another wrapper. @default false */\n\tasChild?: boolean;\n};\nexport type LayerCardWellProps = LayerCardSectionProps & {\n\t/**\n\t * Draw a hairline ring on a nested well.\n\t * @default false\n\t */\n\toutlined?: boolean;\n};\nexport type LayerCardLoadingProps = Omit<HTMLAttributes<HTMLDivElement>, \"aria-label\"> & {\n\t/**\n\t * Accessible label announced for the loading state.\n\t * @default \"Loading\"\n\t */\n\tlabel?: string;\n};\nexport type LayerCardEmptyProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"children\"> & {\n\t/**\n\t * Empty-state heading.\n\t * @default \"No content\"\n\t */\n\ttitle?: string;\n\t/**\n\t * Supporting empty-state text.\n\t */\n\tdescription?: string;\n\t/**\n\t * Optional empty-state icon.\n\t */\n\ticon?: ReactNode;\n\t/**\n\t * Optional interactive action element rendered below empty content.\n\t */\n\taction?: ReactNode;\n\t/**\n\t * Custom supporting content or custom layout rendered between description and action.\n\t */\n\tchildren?: ReactNode;\n};\n\nfunction isElement(child: ReactNode): child is ReactElement<{ children?: ReactNode }> {\n\treturn isValidElement(child);\n}\n\nfunction hasSlot(children: ReactNode, match: (type: unknown) => boolean): boolean {\n\treturn Children.toArray(children).some((child) => {\n\t\tif (!isElement(child)) {\n\t\t\treturn false;\n\t\t}\n\t\tif (match(child.type)) {\n\t\t\treturn true;\n\t\t}\n\t\tif (child.type === Fragment) {\n\t\t\treturn hasSlot(child.props.children, match);\n\t\t}\n\t\treturn false;\n\t});\n}\n\nfunction decorateHeaders(children: ReactNode, divided: boolean): ReactNode {\n\tif (!divided) {\n\t\treturn children;\n\t}\n\treturn Children.map(children, (child) => {\n\t\tif (!isElement(child)) {\n\t\t\treturn child;\n\t\t}\n\t\tif (child.type === Fragment) {\n\t\t\treturn cloneElement(child, {\n\t\t\t\tchildren: decorateHeaders(child.props.children, divided),\n\t\t\t});\n\t\t}\n\t\tif (child.type === LayerCardHeader || child.type === LayerCardSecondary) {\n\t\t\tconst typed = child as ReactElement<{ className?: string }>;\n\t\t\treturn cloneElement(typed, {\n\t\t\t\tclassName: cn(typed.props.className, \"border-b border-basalt-border\"),\n\t\t\t});\n\t\t}\n\t\treturn child;\n\t});\n}\n\nconst LayerCardRoot = forwardRef<HTMLDivElement, LayerCardProps>(\n\t({ className, children, outlined = false, padding = \"md\", ...props }, ref) => {\n\t\tconst structured = hasSlot(children, (type) => STRUCTURED_TYPES.has(type));\n\t\tconst hasWell = hasSlot(\n\t\t\tchildren,\n\t\t\t(type) => type === LayerCardWell || type === LayerCardPrimary,\n\t\t);\n\t\tconst hasBody = hasSlot(children, (type) => type === LayerCardBody);\n\t\tconst headerDivided = hasBody && !hasWell;\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-basalt-surface=\"\"\n\t\t\t\tdata-card-structured={structured || undefined}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tROOT_CLASSES,\n\t\t\t\t\tstructured ? \"flex w-full flex-col\" : PADDING_CLASSES[padding],\n\t\t\t\t\toutlined && \"ring-1 ring-basalt-border/40\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{decorateHeaders(children, headerDivided)}\n\t\t\t</div>\n\t\t);\n\t},\n);\nLayerCardRoot.displayName = \"LayerCard\";\n\nfunction LayerCardHeader({ className, asChild = false, ...props }: LayerCardHeaderProps) {\n\tconst Component = asChild ? Slot : \"div\";\n\treturn (\n\t\t<Component\n\t\t\tdata-slot=\"card-header\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex min-w-0 justify-between gap-basalt-card px-basalt-card py-basalt-card-sm text-basalt-muted-foreground\",\n\t\t\t\tasChild ? \"w-full items-center\" : \"items-start\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardHeader.displayName = \"LayerCard.Header\";\n\nfunction LayerCardBody({ className, ...props }: LayerCardSectionProps) {\n\treturn (\n\t\t<div data-slot=\"card-body\" className={cn(\"min-w-0 p-basalt-card\", className)} {...props} />\n\t);\n}\nLayerCardBody.displayName = \"LayerCard.Body\";\n\nfunction LayerCardWell({ className, outlined = false, ...props }: LayerCardWellProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-basalt-surface=\"\"\n\t\t\tclassName={cn(\"min-w-0 p-basalt-card\", outlined && \"ring-1 ring-basalt-border/40\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardWell.displayName = \"LayerCard.Well\";\n\nfunction LayerCardPrimary(props: LayerCardWellProps) {\n\treturn <LayerCardWell {...props} />;\n}\nLayerCardPrimary.displayName = \"LayerCard.Primary\";\n\nfunction LayerCardSecondary(props: LayerCardSectionProps) {\n\treturn <LayerCardHeader {...props} />;\n}\nLayerCardSecondary.displayName = \"LayerCard.Secondary\";\n\nfunction LayerCardFooter({ className, ...props }: LayerCardSectionProps) {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\t\"flex flex-wrap items-center justify-end gap-basalt-space-lg border-t border-basalt-border px-basalt-card py-basalt-card-sm\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardFooter.displayName = \"LayerCard.Footer\";\n\nfunction LayerCardLoading({ label = \"Loading\", className, ...props }: LayerCardLoadingProps) {\n\treturn (\n\t\t<div\n\t\t\trole=\"status\"\n\t\t\taria-label={label}\n\t\t\tclassName={cn(\"space-y-basalt-space-lg p-basalt-card\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SkeletonLine minWidth={100} maxWidth={100} />\n\t\t\t<SkeletonLine minWidth={72} maxWidth={72} />\n\t\t\t<SkeletonLine minWidth={88} maxWidth={88} />\n\t\t</div>\n\t);\n}\nLayerCardLoading.displayName = \"LayerCard.Loading\";\n\nfunction LayerCardEmpty({ title = \"No content\", className, ...props }: LayerCardEmptyProps) {\n\treturn <Empty title={title} className={cn(\"p-basalt-card\", className)} {...props} />;\n}\nLayerCardEmpty.displayName = \"LayerCard.Empty\";\n\nconst STRUCTURED_TYPES = new Set<unknown>([\n\tLayerCardHeader,\n\tLayerCardBody,\n\tLayerCardWell,\n\tLayerCardFooter,\n\tLayerCardLoading,\n\tLayerCardEmpty,\n\tLayerCardPrimary,\n\tLayerCardSecondary,\n]);\n\nexport const LayerCard = Object.assign(LayerCardRoot, {\n\tPrimary: LayerCardPrimary,\n\tSecondary: LayerCardSecondary,\n\tHeader: LayerCardHeader,\n\tBody: LayerCardBody,\n\tWell: LayerCardWell,\n\tFooter: LayerCardFooter,\n\tLoading: LayerCardLoading,\n\tEmpty: LayerCardEmpty,\n});\n"],"mappings":";;;;;;;;;AAgBA,IAAMA,IAAe,GAAGC,EAAgB,4DAClCC,IAAkB;CACvB,MAAM;CACN,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACL;AA+DA,SAASC,EAAU,GAAmE;CACrF,OAAOC,EAAeC,CAAK;AAC5B;AAEA,SAASC,EAAQ,GAAqB,GAA4C;CACjF,OAAOC,EAAS,QAAQC,CAAQ,CAAC,CAAC,MAAM,MAClCL,EAAUE,CAAK,IAGhBI,EAAMJ,EAAM,IAAI,IACZ,KAEJA,EAAM,SAASK,KACXJ,EAAQD,EAAM,MAAM,UAAUI,CAAK,IANnC,EASR;AACF;AAEA,SAASE,EAAgB,GAAqB,GAA6B;CAI1E,OAHKC,IAGEL,EAAS,IAAIC,IAAW,MAAU;EACxC,IAAI,CAACL,EAAUE,CAAK,GACnB,OAAOA;EAER,IAAIA,EAAM,SAASK,GAClB,OAAOG,EAAaR,GAAO,EAC1B,UAAUM,EAAgBN,EAAM,MAAM,UAAUO,CAAO,EACxD,CAAC;EAEF,IAAIP,EAAM,SAASS,KAAmBT,EAAM,SAASU,GAAoB;GACxE,IAAMC,IAAQX;GACd,OAAOQ,EAAaG,GAAO,EAC1B,WAAWC,EAAGD,EAAM,MAAM,WAAW,+BAA+B,EACrE,CAAC;EACF;EACA,OAAOX;CACR,CAAC,IAlBOG;AAmBT;AAEA,IAAMU,IAAgBC,GACpB,EAAE,cAAW,aAAU,cAAW,IAAO,aAAU,MAAM,GAAGC,KAAS,MAAQ;CAC7E,IAAMC,IAAaf,EAAQE,IAAW,MAASc,EAAiB,IAAIC,CAAI,CAAC,GACnEC,IAAUlB,EACfE,IACC,MAASe,MAASE,KAAiBF,MAASG,CAC9C,GAEMC,IADUrB,EAAQE,IAAW,MAASe,MAASK,CAC/B,KAAW,CAACJ;CAClC,OACC,kBAAC,OAAD;EACM;EACL,uBAAoB;EACpB,wBAAsBH,KAAc,KAAA;EACpC,WAAWJ,EACVjB,GACAqB,IAAa,yBAAyBnB,EAAgB2B,IACtDC,KAAY,gCACZC,CACD;EACA,GAAIX;EAEH,UAAAT,EAAgBH,GAAUmB,CAAa;CACpC,CAAA;AAEP,CACD;AACA,EAAc,cAAc;AAE5B,SAASb,EAAgB,EAAE,cAAW,aAAU,IAAO,GAAGM,KAA+B;CAExF,OACC,kBAFiBY,IAAUC,IAAO,OAElC;EACC,aAAU;EACV,WAAWhB,EACV,8GACAe,IAAU,wBAAwB,eAClCD,CACD;EACA,GAAIX;CACJ,CAAA;AAEH;AACA,EAAgB,cAAc;AAE9B,SAASQ,EAAc,EAAE,cAAW,GAAGR,KAAgC;CACtE,OACC,kBAAC,OAAD;EAAK,aAAU;EAAY,WAAWH,EAAG,yBAAyBc,CAAS;EAAG,GAAIX;CAAQ,CAAA;AAE5F;AACA,EAAc,cAAc;AAE5B,SAASK,EAAc,EAAE,cAAW,cAAW,IAAO,GAAGL,KAA6B;CACrF,OACC,kBAAC,OAAD;EACC,uBAAoB;EACpB,WAAWH,EAAG,yBAAyBa,KAAY,gCAAgCC,CAAS;EAC5F,GAAIX;CACJ,CAAA;AAEH;AACA,EAAc,cAAc;AAE5B,SAASM,EAAiB,GAA2B;CACpD,OAAO,kBAACD,GAAD,EAAe,GAAIL,EAAQ,CAAA;AACnC;AACA,EAAiB,cAAc;AAE/B,SAASL,EAAmB,GAA8B;CACzD,OAAO,kBAACD,GAAD,EAAiB,GAAIM,EAAQ,CAAA;AACrC;AACA,EAAmB,cAAc;AAEjC,SAASc,EAAgB,EAAE,cAAW,GAAGd,KAAgC;CACxE,OACC,kBAAC,OAAD;EACC,WAAWH,EACV,8HACAc,CACD;EACA,GAAIX;CACJ,CAAA;AAEH;AACA,EAAgB,cAAc;AAE9B,SAASe,EAAiB,EAAE,WAAQ,WAAW,cAAW,GAAGf,KAAgC;CAC5F,OACC,kBAAC,OAAD;EACC,MAAK;EACL,cAAYgB;EACZ,WAAWnB,EAAG,yCAAyCc,CAAS;EAChE,GAAIX;EAJL,UAAA;GAMC,kBAACiB,GAAD;IAAc,UAAU;IAAK,UAAU;GAAM,CAAA;GAC7C,kBAACA,GAAD;IAAc,UAAU;IAAI,UAAU;GAAK,CAAA;GAC3C,kBAACA,GAAD;IAAc,UAAU;IAAI,UAAU;GAAK,CAAA;EACvC;;AAEP;AACA,EAAiB,cAAc;AAE/B,SAASC,EAAe,EAAE,WAAQ,cAAc,cAAW,GAAGlB,KAA8B;CAC3F,OAAO,kBAACmB,GAAD;EAAc;EAAO,WAAWtB,EAAG,iBAAiBc,CAAS;EAAG,GAAIX;CAAQ,CAAA;AACpF;AACA,EAAe,cAAc;AAE7B,IAAME,oBAAmB,IAAI,IAAa;CACzCR;CACAc;CACAH;CACAS;CACAC;CACAG;CACAZ;CACAX;AACD,CAAC,GAEYyB,IAAY,OAAO,OAAOtB,GAAe;CACrD,SAASQ;CACT,WAAWX;CACX,QAAQD;CACR,MAAMc;CACN,MAAMH;CACN,QAAQS;CACR,SAASC;CACT,OAAOG;AACR,CAAC"}
+{"version":3,"file":"layer-card.js","names":["ROOT_CLASSES","BASALT_UI_CLASS","PADDING_CLASSES","isElement","isValidElement","child","hasSlot","Children","children","match","Fragment","LayerCardRoot","forwardRef","props","structured","STRUCTURED_TYPES","type","cn","padding","outlined","className","LayerCardHeader","asChild","Slot","divided","LayerCardBody","LayerCardWell","LayerCardPrimary","LayerCardSecondary","LayerCardFooter","LayerCardLoading","label","SkeletonLine","LayerCardEmpty","Empty","LayerCard"],"sources":["../../src/components/layer-card.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport {\n\tChildren,\n\tFragment,\n\tforwardRef,\n\ttype HTMLAttributes,\n\tisValidElement,\n\ttype ReactElement,\n\ttype ReactNode,\n} from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Empty } from \"./empty\";\nimport { SkeletonLine } from \"./skeleton-line\";\n\nconst ROOT_CLASSES = `${BASALT_UI_CLASS} overflow-hidden rounded-basalt-lg ring-1 ring-basalt-border/50 text-basalt-foreground`;\nconst PADDING_CLASSES = {\n\tnone: \"\",\n\tsm: \"p-basalt-card-sm\",\n\tmd: \"p-basalt-card\",\n\tlg: \"p-basalt-card-lg\",\n\txl: \"p-basalt-card-xl\",\n} as const;\n\nexport type LayerCardPadding = keyof typeof PADDING_CLASSES;\n\nexport type LayerCardProps = Omit<HTMLAttributes<HTMLDivElement>, \"className\"> & {\n\t/**\n\t * Additional classes for the card root.\n\t */\n\tclassName?: string;\n\t/**\n\t * Strengthen the default perimeter hairline.\n\t * @default false\n\t */\n\toutlined?: boolean;\n\t/**\n\t * Inner spacing for unstructured card content.\n\t * @default \"md\"\n\t */\n\tpadding?: LayerCardPadding;\n};\nexport type LayerCardSectionProps = HTMLAttributes<HTMLDivElement>;\nexport type LayerCardHeaderProps = LayerCardSectionProps & {\n\t/** Apply header insets to one child, such as a CollapsibleTrigger, without another wrapper. @default false */\n\tasChild?: boolean;\n\t/** Separate the header from its body with a divider. @default false */\n\tdivided?: boolean;\n};\nexport type LayerCardWellProps = LayerCardSectionProps & {\n\t/**\n\t * Draw a hairline ring on a nested well.\n\t * @default false\n\t */\n\toutlined?: boolean;\n};\nexport type LayerCardLoadingProps = Omit<HTMLAttributes<HTMLDivElement>, \"aria-label\"> & {\n\t/**\n\t * Accessible label announced for the loading state.\n\t * @default \"Loading\"\n\t */\n\tlabel?: string;\n};\nexport type LayerCardEmptyProps = Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"children\"> & {\n\t/**\n\t * Empty-state heading.\n\t * @default \"No content\"\n\t */\n\ttitle?: string;\n\t/**\n\t * Supporting empty-state text.\n\t */\n\tdescription?: string;\n\t/**\n\t * Optional empty-state icon.\n\t */\n\ticon?: ReactNode;\n\t/**\n\t * Optional interactive action element rendered below empty content.\n\t */\n\taction?: ReactNode;\n\t/**\n\t * Custom supporting content or custom layout rendered between description and action.\n\t */\n\tchildren?: ReactNode;\n};\n\nfunction isElement(child: ReactNode): child is ReactElement<{ children?: ReactNode }> {\n\treturn isValidElement(child);\n}\n\nfunction hasSlot(children: ReactNode, match: (type: unknown) => boolean): boolean {\n\treturn Children.toArray(children).some((child) => {\n\t\tif (!isElement(child)) {\n\t\t\treturn false;\n\t\t}\n\t\tif (match(child.type)) {\n\t\t\treturn true;\n\t\t}\n\t\tif (child.type === Fragment) {\n\t\t\treturn hasSlot(child.props.children, match);\n\t\t}\n\t\treturn false;\n\t});\n}\n\nconst LayerCardRoot = forwardRef<HTMLDivElement, LayerCardProps>(\n\t({ className, children, outlined = false, padding = \"md\", ...props }, ref) => {\n\t\tconst structured = hasSlot(children, (type) => STRUCTURED_TYPES.has(type));\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ref}\n\t\t\t\tdata-basalt-surface=\"\"\n\t\t\t\tdata-card-structured={structured || undefined}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tROOT_CLASSES,\n\t\t\t\t\tstructured ? \"flex w-full flex-col\" : PADDING_CLASSES[padding],\n\t\t\t\t\toutlined && \"ring-basalt-border\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t);\n\t},\n);\nLayerCardRoot.displayName = \"LayerCard\";\n\nfunction LayerCardHeader({\n\tclassName,\n\tasChild = false,\n\tdivided = false,\n\t...props\n}: LayerCardHeaderProps) {\n\tconst Component = asChild ? Slot : \"div\";\n\treturn (\n\t\t<Component\n\t\t\tdata-slot=\"card-header\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex min-w-0 justify-between gap-basalt-space-lg text-basalt-base font-medium tracking-tight text-basalt-foreground\",\n\t\t\t\tasChild\n\t\t\t\t\t? \"w-full items-center px-basalt-card py-basalt-card-sm data-[state=open]:border-b data-[state=open]:border-basalt-border\"\n\t\t\t\t\t: divided\n\t\t\t\t\t\t? \"items-start p-basalt-card border-b border-basalt-border\"\n\t\t\t\t\t\t: \"items-start px-basalt-card pt-basalt-card pb-0\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardHeader.displayName = \"LayerCard.Header\";\n\nfunction LayerCardBody({ className, ...props }: LayerCardSectionProps) {\n\treturn (\n\t\t<div data-slot=\"card-body\" className={cn(\"min-w-0 p-basalt-card\", className)} {...props} />\n\t);\n}\nLayerCardBody.displayName = \"LayerCard.Body\";\n\nfunction LayerCardWell({ className, outlined = false, ...props }: LayerCardWellProps) {\n\treturn (\n\t\t<div\n\t\t\tdata-basalt-surface=\"\"\n\t\t\tclassName={cn(\"min-w-0 p-basalt-card\", outlined && \"ring-1 ring-basalt-border/40\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardWell.displayName = \"LayerCard.Well\";\n\nfunction LayerCardPrimary(props: LayerCardWellProps) {\n\treturn <LayerCardWell {...props} />;\n}\nLayerCardPrimary.displayName = \"LayerCard.Primary\";\n\nfunction LayerCardSecondary(props: LayerCardHeaderProps) {\n\treturn <LayerCardHeader {...props} />;\n}\nLayerCardSecondary.displayName = \"LayerCard.Secondary\";\n\nfunction LayerCardFooter({ className, ...props }: LayerCardSectionProps) {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\t\"flex flex-wrap items-center justify-end gap-basalt-space-lg border-t border-basalt-border px-basalt-card py-basalt-card-sm\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nLayerCardFooter.displayName = \"LayerCard.Footer\";\n\nfunction LayerCardLoading({ label = \"Loading\", className, ...props }: LayerCardLoadingProps) {\n\treturn (\n\t\t<div\n\t\t\trole=\"status\"\n\t\t\taria-label={label}\n\t\t\tclassName={cn(\"space-y-basalt-space-lg p-basalt-card\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SkeletonLine minWidth={100} maxWidth={100} />\n\t\t\t<SkeletonLine minWidth={72} maxWidth={72} />\n\t\t\t<SkeletonLine minWidth={88} maxWidth={88} />\n\t\t</div>\n\t);\n}\nLayerCardLoading.displayName = \"LayerCard.Loading\";\n\nfunction LayerCardEmpty({ title = \"No content\", className, ...props }: LayerCardEmptyProps) {\n\treturn <Empty title={title} className={cn(\"p-basalt-card\", className)} {...props} />;\n}\nLayerCardEmpty.displayName = \"LayerCard.Empty\";\n\nconst STRUCTURED_TYPES = new Set<unknown>([\n\tLayerCardHeader,\n\tLayerCardBody,\n\tLayerCardWell,\n\tLayerCardFooter,\n\tLayerCardLoading,\n\tLayerCardEmpty,\n\tLayerCardPrimary,\n\tLayerCardSecondary,\n]);\n\nexport const LayerCard = Object.assign(LayerCardRoot, {\n\tPrimary: LayerCardPrimary,\n\tSecondary: LayerCardSecondary,\n\tHeader: LayerCardHeader,\n\tBody: LayerCardBody,\n\tWell: LayerCardWell,\n\tFooter: LayerCardFooter,\n\tLoading: LayerCardLoading,\n\tEmpty: LayerCardEmpty,\n});\n"],"mappings":"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"}

package/dist/components/loader.js

@@ -41,7 +41,7 @@ function o({ className: o, size: s = 16, label: c = "Loading", showLabel: l = !0
 				}, `pixel-${e}`))
 			}),
 			l && /* @__PURE__ */ r("span", {
-				className: e("text-basalt-code font-medium", p && f && "basalt-shimmer-label"),
+				className: e("text-basalt-base font-medium", p && f && "basalt-shimmer-label"),
 				children: c
 			}),
 			h.visible && /* @__PURE__ */ r("span", {

package/dist/components/loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader.js","names":["ORBIT_ORDER","Loader","props","vm","useLoaderViewModel","showElapsed","elapsedDelayMs","label","cn","BASALT_UI_CLASS","className","animate","size","step","cell","showLabel","shimmer"],"sources":["../../src/components/loader.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { useLoaderViewModel } from \"../viewmodels/use-loader\";\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n\t/** Width and height of the pixel grid in CSS pixels. @default 16 */\n\tsize?: number;\n\t/** Visible loading text and default accessible name. @default \"Loading\" */\n\tlabel?: string;\n\t/** Display the text next to the grid. @default true */\n\tshowLabel?: boolean;\n\t/** Display elapsed time after the delay. Time starts on mount. @default true */\n\tshowElapsed?: boolean;\n\t/** Milliseconds before elapsed time is shown. @default 5000 */\n\telapsedDelayMs?: number;\n\t/** Animate the clockwise trail around the eight perimeter cells. @default true */\n\tanimate?: boolean;\n\t/** Apply a sweeping highlight to the label. @default true */\n\tshimmer?: boolean;\n}\n\nconst ORBIT_ORDER = [0, 1, 2, 5, 8, 7, 6, 3];\n\nexport function Loader({\n\tclassName,\n\tsize = 16,\n\tlabel = \"Loading\",\n\tshowLabel = true,\n\tshowElapsed = true,\n\telapsedDelayMs = 5000,\n\tanimate = true,\n\tshimmer = true,\n\t...props\n}: LoaderProps) {\n\tconst vm = useLoaderViewModel(showElapsed, elapsedDelayMs);\n\treturn (\n\t\t<span\n\t\t\trole=\"status\"\n\t\t\taria-label={label}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex items-center gap-basalt-space-lg text-basalt-base text-basalt-muted-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tdata-basalt-loader=\"\"\n\t\t\t\tdata-animated={animate}\n\t\t\t\tclassName=\"grid shrink-0 grid-cols-3 gap-basalt-space-xs\"\n\t\t\t\tstyle={{ width: size, height: size }}\n\t\t\t>\n\t\t\t\t{ORBIT_ORDER.map((cell, step) => (\n\t\t\t\t\t<span\n\t\t\t\t\t\tkey={`pixel-${cell}`}\n\t\t\t\t\t\tdata-step={step}\n\t\t\t\t\t\tclassName=\"rounded-basalt-sm bg-current\"\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\"--basalt-pixel-delay\": `${step * 100 - 800}ms`,\n\t\t\t\t\t\t\t\tgridArea: `${Math.floor(cell / 3) + 1} / ${(cell % 3) + 1}`,\n\t\t\t\t\t\t\t} as CSSProperties\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</span>\n\t\t\t{showLabel && (\n\t\t\t\t<span\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"text-basalt-code font-medium\",\n\t\t\t\t\t\tshimmer && animate && \"basalt-shimmer-label\",\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t{vm.visible && (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-basalt-elapsed=\"\"\n\t\t\t\t\tclassName=\"font-mono text-basalt-sm tabular-nums\"\n\t\t\t\t>\n\t\t\t\t\t{vm.text}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;;AAsBA,IAAMA,IAAc;CAAC;CAAG;CAAG;CAAG;CAAG;CAAG;CAAG;CAAG;AAAC;AAE3C,SAAgBC,EAAO,EACtB,cACA,UAAO,IACP,WAAQ,WACR,eAAY,IACZ,iBAAc,IACd,oBAAiB,KACjB,aAAU,IACV,aAAU,IACV,GAAGC,KACY;CACf,IAAMC,IAAKC,EAAmBC,GAAaC,CAAc;CACzD,OACC,kBAAC,QAAD;EACC,MAAK;EACL,cAAYC;EACZ,WAAWC,EACVC,GACA,8FACAC,CACD;EACA,GAAIR;EARL,UAAA;GAUC,kBAAC,QAAD;IACC,eAAY;IACZ,sBAAmB;IACnB,iBAAeS;IACf,WAAU;IACV,OAAO;KAAE,OAAOC;KAAM,QAAQA;IAAK;IAElC,UAAAZ,EAAY,KAAK,GAAM,MACvB,kBAAC,QAAD;KAEC,aAAWa;KACX,WAAU;KACV,OACC;MACC,wBAAwB,GAAGA,IAAO,MAAM,IAAI;MAC5C,UAAU,GAAG,KAAK,MAAMC,IAAO,CAAC,IAAI,EAAE,KAAMA,IAAO,IAAK;KACzD;IAED,GATK,SAASA,GASd,CACD;GACI,CAAA;GACLC,KACA,kBAAC,QAAD;IACC,WAAWP,EACV,gCACAQ,KAAWL,KAAW,sBACvB;IAEC,UAAAJ;GACI,CAAA;GAENJ,EAAG,WACH,kBAAC,QAAD;IACC,eAAY;IACZ,uBAAoB;IACpB,WAAU;IAET,UAAAA,EAAG;GACC,CAAA;EAEF;;AAER"}
+{"version":3,"file":"loader.js","names":["ORBIT_ORDER","Loader","props","vm","useLoaderViewModel","showElapsed","elapsedDelayMs","label","cn","BASALT_UI_CLASS","className","animate","size","step","cell","showLabel","shimmer"],"sources":["../../src/components/loader.tsx"],"sourcesContent":["import type { CSSProperties, HTMLAttributes } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { useLoaderViewModel } from \"../viewmodels/use-loader\";\n\nexport interface LoaderProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n\t/** Width and height of the pixel grid in CSS pixels. @default 16 */\n\tsize?: number;\n\t/** Visible loading text and default accessible name. @default \"Loading\" */\n\tlabel?: string;\n\t/** Display the text next to the grid. @default true */\n\tshowLabel?: boolean;\n\t/** Display elapsed time after the delay. Time starts on mount. @default true */\n\tshowElapsed?: boolean;\n\t/** Milliseconds before elapsed time is shown. @default 5000 */\n\telapsedDelayMs?: number;\n\t/** Animate the clockwise trail around the eight perimeter cells. @default true */\n\tanimate?: boolean;\n\t/** Apply a sweeping highlight to the label. @default true */\n\tshimmer?: boolean;\n}\n\nconst ORBIT_ORDER = [0, 1, 2, 5, 8, 7, 6, 3];\n\nexport function Loader({\n\tclassName,\n\tsize = 16,\n\tlabel = \"Loading\",\n\tshowLabel = true,\n\tshowElapsed = true,\n\telapsedDelayMs = 5000,\n\tanimate = true,\n\tshimmer = true,\n\t...props\n}: LoaderProps) {\n\tconst vm = useLoaderViewModel(showElapsed, elapsedDelayMs);\n\treturn (\n\t\t<span\n\t\t\trole=\"status\"\n\t\t\taria-label={label}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex items-center gap-basalt-space-lg text-basalt-base text-basalt-muted-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<span\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tdata-basalt-loader=\"\"\n\t\t\t\tdata-animated={animate}\n\t\t\t\tclassName=\"grid shrink-0 grid-cols-3 gap-basalt-space-xs\"\n\t\t\t\tstyle={{ width: size, height: size }}\n\t\t\t>\n\t\t\t\t{ORBIT_ORDER.map((cell, step) => (\n\t\t\t\t\t<span\n\t\t\t\t\t\tkey={`pixel-${cell}`}\n\t\t\t\t\t\tdata-step={step}\n\t\t\t\t\t\tclassName=\"rounded-basalt-sm bg-current\"\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\"--basalt-pixel-delay\": `${step * 100 - 800}ms`,\n\t\t\t\t\t\t\t\tgridArea: `${Math.floor(cell / 3) + 1} / ${(cell % 3) + 1}`,\n\t\t\t\t\t\t\t} as CSSProperties\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</span>\n\t\t\t{showLabel && (\n\t\t\t\t<span\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"text-basalt-base font-medium\",\n\t\t\t\t\t\tshimmer && animate && \"basalt-shimmer-label\",\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t{vm.visible && (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-basalt-elapsed=\"\"\n\t\t\t\t\tclassName=\"font-mono text-basalt-sm tabular-nums\"\n\t\t\t\t>\n\t\t\t\t\t{vm.text}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;;AAsBA,IAAMA,IAAc;CAAC;CAAG;CAAG;CAAG;CAAG;CAAG;CAAG;CAAG;AAAC;AAE3C,SAAgBC,EAAO,EACtB,cACA,UAAO,IACP,WAAQ,WACR,eAAY,IACZ,iBAAc,IACd,oBAAiB,KACjB,aAAU,IACV,aAAU,IACV,GAAGC,KACY;CACf,IAAMC,IAAKC,EAAmBC,GAAaC,CAAc;CACzD,OACC,kBAAC,QAAD;EACC,MAAK;EACL,cAAYC;EACZ,WAAWC,EACVC,GACA,8FACAC,CACD;EACA,GAAIR;EARL,UAAA;GAUC,kBAAC,QAAD;IACC,eAAY;IACZ,sBAAmB;IACnB,iBAAeS;IACf,WAAU;IACV,OAAO;KAAE,OAAOC;KAAM,QAAQA;IAAK;IAElC,UAAAZ,EAAY,KAAK,GAAM,MACvB,kBAAC,QAAD;KAEC,aAAWa;KACX,WAAU;KACV,OACC;MACC,wBAAwB,GAAGA,IAAO,MAAM,IAAI;MAC5C,UAAU,GAAG,KAAK,MAAMC,IAAO,CAAC,IAAI,EAAE,KAAMA,IAAO,IAAK;KACzD;IAED,GATK,SAASA,GASd,CACD;GACI,CAAA;GACLC,KACA,kBAAC,QAAD;IACC,WAAWP,EACV,gCACAQ,KAAWL,KAAW,sBACvB;IAEC,UAAAJ;GACI,CAAA;GAENJ,EAAG,WACH,kBAAC,QAAD;IACC,eAAY;IACZ,uBAAoB;IACpB,WAAU;IAET,UAAAA,EAAG;GACC,CAAA;EAEF;;AAER"}

package/dist/components/page-header.d.ts

@@ -5,7 +5,7 @@ export interface PageHeaderBreadcrumb {
     icon?: React.ReactNode;
 }
 export interface PageHeaderProps {
-    /** Heading scale: workspace, dashboard, or reading-focused page. @default "md" */
+    /** Page preset; all presets share the same title and description scale. @default "md" */
     size?: "md" | "lg" | "xl";
     /** The page title, rendered as the only heading. */
     title: React.ReactNode;
@@ -18,4 +18,4 @@ export interface PageHeaderProps {
     /** Own-row filters. Keep short filters in actions. */
     filters?: React.ReactNode;
 }
-export declare function PageHeader({ actions, breadcrumbs, description, filters, size, title, }: PageHeaderProps): React.JSX.Element;
+export declare function PageHeader({ actions, breadcrumbs, description, filters, title }: PageHeaderProps): React.JSX.Element;