@burtson-labs/ui 0.12.3 → 0.13.0

package/dist/components/sheet.d.ts

@@ -9,8 +9,13 @@ declare const sideClasses: {
     readonly top: "inset-x-0 top-0 max-h-[85dvh] rounded-b-xl border-b pt-[env(safe-area-inset-top)] [--bl-sheet-x:0] [--bl-sheet-y:-100%]";
     readonly bottom: "inset-x-0 bottom-0 max-h-[85dvh] rounded-t-xl border-t pb-[env(safe-area-inset-bottom)] [--bl-sheet-x:0] [--bl-sheet-y:100%]";
 };
-declare function SheetContent({ className, children, side, handle, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & {
+declare function SheetContent({ className, children, side, handle, showCloseButton, ...props }: React.ComponentProps<typeof SheetPrimitive.Content> & {
     side?: keyof typeof sideClasses;
+    /**
+     * The X in the corner. Turn it off when the sheet draws its own header
+     * with a close control (a SheetClose), so there are not two.
+     */
+    showCloseButton?: boolean;
     /**
      * A grab bar at the top edge, the cue that this is a drawer. Visual only:
      * it does not drag; close with the button, Escape or the overlay. On by

package/dist/components/sheet.js

@@ -28,7 +28,7 @@ var sideClasses = {
 	top: "inset-x-0 top-0 max-h-[85dvh] rounded-b-xl border-b pt-[env(safe-area-inset-top)] [--bl-sheet-x:0] [--bl-sheet-y:-100%]",
 	bottom: "inset-x-0 bottom-0 max-h-[85dvh] rounded-t-xl border-t pb-[env(safe-area-inset-bottom)] [--bl-sheet-x:0] [--bl-sheet-y:100%]"
 };
-function SheetContent({ className, children, side = "right", handle = side === "bottom", ...props }) {
+function SheetContent({ className, children, side = "right", handle = side === "bottom", showCloseButton = true, ...props }) {
 	return /* @__PURE__ */ jsxs(Dialog.Portal, { children: [/* @__PURE__ */ jsx(Dialog.Overlay, {
 		"data-slot": "sheet-overlay",
 		className: "fixed inset-0 z-50 bg-black/55 backdrop-blur-[3px] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in"
@@ -43,7 +43,7 @@ function SheetContent({ className, children, side = "right", handle = side === "
 				className: "mx-auto mt-2 -mb-2 h-1 w-10 shrink-0 rounded-full bg-border-strong"
 			}),
 			children,
-			/* @__PURE__ */ jsxs(Dialog.Close, {
+			showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
 				className: cn("absolute right-3 grid size-8 place-items-center rounded-md text-muted-foreground transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 pointer-coarse:size-11 [&_svg]:size-4 pointer-coarse:[&_svg]:size-5", side === "top" ? "top-[calc(env(safe-area-inset-top)+0.75rem)]" : "top-3"),
 				children: [/* @__PURE__ */ jsx(X, { "aria-hidden": true }), /* @__PURE__ */ jsx("span", {
 					className: "sr-only",

package/dist/components/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import X from '@burtson-labs/icons/react/x';\nimport { Dialog as SheetPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\nfunction SheetTrigger(props: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\nfunction SheetClose(props: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\nconst sideClasses = {\n  right: 'inset-y-0 right-0 h-full w-3/4 border-l [--bl-sheet-x:100%] sm:max-w-sm',\n  left: 'inset-y-0 left-0 h-full w-3/4 border-r [--bl-sheet-x:-100%] sm:max-w-sm',\n  // Top and bottom sheets are the mobile drawers. Each keeps clear of the\n  // notch or home indicator on its edge (safe-area insets).\n  top: 'inset-x-0 top-0 max-h-[85dvh] rounded-b-xl border-b pt-[env(safe-area-inset-top)] [--bl-sheet-x:0] [--bl-sheet-y:-100%]',\n  bottom:\n    'inset-x-0 bottom-0 max-h-[85dvh] rounded-t-xl border-t pb-[env(safe-area-inset-bottom)] [--bl-sheet-x:0] [--bl-sheet-y:100%]',\n} as const;\n\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  handle = side === 'bottom',\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  side?: keyof typeof sideClasses;\n  /**\n   * A grab bar at the top edge, the cue that this is a drawer. Visual only:\n   * it does not drag; close with the button, Escape or the overlay. On by\n   * default for bottom sheets.\n   */\n  handle?: boolean;\n}) {\n  return (\n    <SheetPrimitive.Portal>\n      <SheetPrimitive.Overlay\n        data-slot=\"sheet-overlay\"\n        className=\"fixed inset-0 z-50 bg-black/55 backdrop-blur-[3px] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\"\n      />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'fixed z-50 max-h-dvh overflow-y-auto overscroll-contain flex flex-col gap-4 border-border-strong bg-surface-raised text-foreground shadow-[0_24px_80px_rgb(0_0_0_/_0.28)] outline-none data-[state=closed]:animate-sheet-out data-[state=open]:animate-sheet-in',\n          sideClasses[side],\n          className,\n        )}\n        {...props}\n      >\n        {handle && (\n          <div\n            data-slot=\"sheet-handle\"\n            aria-hidden\n            className=\"mx-auto mt-2 -mb-2 h-1 w-10 shrink-0 rounded-full bg-border-strong\"\n          />\n        )}\n        {children}\n        {/* 44px on touch screens, 32px with a mouse. */}\n        <SheetPrimitive.Close\n          className={cn(\n            'absolute right-3 grid size-8 place-items-center rounded-md text-muted-foreground transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 pointer-coarse:size-11 [&_svg]:size-4 pointer-coarse:[&_svg]:size-5',\n            side === 'top' ? 'top-[calc(env(safe-area-inset-top)+0.75rem)]' : 'top-3',\n          )}\n        >\n          <X aria-hidden />\n          <span className=\"sr-only\">Close</span>\n        </SheetPrimitive.Close>\n      </SheetPrimitive.Content>\n    </SheetPrimitive.Portal>\n  );\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn('flex flex-col gap-1.5 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn('mt-auto flex flex-col gap-2 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn('text-base font-semibold tracking-[-0.02em] text-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"mappings":";;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,oBAACA,OAAe,MAAhB;EAAqB,aAAU;EAAQ,GAAI;CAAQ,CAAA;AAC5D;AAEA,SAAS,aAAa,OAA4D;CAChF,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAEA,SAAS,WAAW,OAA0D;CAC5E,OAAO,oBAACA,OAAe,OAAhB;EAAsB,aAAU;EAAc,GAAI;CAAQ,CAAA;AACnE;AAEA,IAAM,cAAc;CAClB,OAAO;CACP,MAAM;CAGN,KAAK;CACL,QACE;AACJ;AAEA,SAAS,aAAa,EACpB,WACA,UACA,OAAO,SACP,SAAS,SAAS,UAClB,GAAG,SASF;CACD,OACE,qBAACA,OAAe,QAAhB,EAAA,UAAA,CACE,oBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAU;CACX,CAAA,GACD,qBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAW,GACT,mQACA,YAAY,OACZ,SACF;EACA,GAAI;EAPN,UAAA;GASG,UACC,oBAAC,OAAD;IACE,aAAU;IACV,eAAA;IACA,WAAU;GACX,CAAA;GAEF;GAED,qBAACA,OAAe,OAAhB;IACE,WAAW,GACT,gRACA,SAAS,QAAQ,iDAAiD,OACpE;IAJF,UAAA,CAME,oBAAC,GAAD,EAAG,eAAA,KAAa,CAAA,GAChB,oBAAC,QAAD;KAAM,WAAU;KAAU,UAAA;IAAW,CAAA,CACjB;;EACA;CACH,CAAA,CAAA,EAAA,CAAA;AAE3B;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,6BAA6B,SAAS;EACpD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA4D;CAC9F,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,8DAA8D,SAAS;EACrF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"sheet.js","names":["SheetPrimitive"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import X from '@burtson-labs/icons/react/x';\nimport { Dialog as SheetPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nfunction Sheet(props: React.ComponentProps<typeof SheetPrimitive.Root>) {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n}\n\nfunction SheetTrigger(props: React.ComponentProps<typeof SheetPrimitive.Trigger>) {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n}\n\nfunction SheetClose(props: React.ComponentProps<typeof SheetPrimitive.Close>) {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n}\n\nconst sideClasses = {\n  right: 'inset-y-0 right-0 h-full w-3/4 border-l [--bl-sheet-x:100%] sm:max-w-sm',\n  left: 'inset-y-0 left-0 h-full w-3/4 border-r [--bl-sheet-x:-100%] sm:max-w-sm',\n  // Top and bottom sheets are the mobile drawers. Each keeps clear of the\n  // notch or home indicator on its edge (safe-area insets).\n  top: 'inset-x-0 top-0 max-h-[85dvh] rounded-b-xl border-b pt-[env(safe-area-inset-top)] [--bl-sheet-x:0] [--bl-sheet-y:-100%]',\n  bottom:\n    'inset-x-0 bottom-0 max-h-[85dvh] rounded-t-xl border-t pb-[env(safe-area-inset-bottom)] [--bl-sheet-x:0] [--bl-sheet-y:100%]',\n} as const;\n\nfunction SheetContent({\n  className,\n  children,\n  side = 'right',\n  handle = side === 'bottom',\n  showCloseButton = true,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Content> & {\n  side?: keyof typeof sideClasses;\n  /**\n   * The X in the corner. Turn it off when the sheet draws its own header\n   * with a close control (a SheetClose), so there are not two.\n   */\n  showCloseButton?: boolean;\n  /**\n   * A grab bar at the top edge, the cue that this is a drawer. Visual only:\n   * it does not drag; close with the button, Escape or the overlay. On by\n   * default for bottom sheets.\n   */\n  handle?: boolean;\n}) {\n  return (\n    <SheetPrimitive.Portal>\n      <SheetPrimitive.Overlay\n        data-slot=\"sheet-overlay\"\n        className=\"fixed inset-0 z-50 bg-black/55 backdrop-blur-[3px] data-[state=closed]:animate-fade-out data-[state=open]:animate-fade-in\"\n      />\n      <SheetPrimitive.Content\n        data-slot=\"sheet-content\"\n        className={cn(\n          'fixed z-50 max-h-dvh overflow-y-auto overscroll-contain flex flex-col gap-4 border-border-strong bg-surface-raised text-foreground shadow-[0_24px_80px_rgb(0_0_0_/_0.28)] outline-none data-[state=closed]:animate-sheet-out data-[state=open]:animate-sheet-in',\n          sideClasses[side],\n          className,\n        )}\n        {...props}\n      >\n        {handle && (\n          <div\n            data-slot=\"sheet-handle\"\n            aria-hidden\n            className=\"mx-auto mt-2 -mb-2 h-1 w-10 shrink-0 rounded-full bg-border-strong\"\n          />\n        )}\n        {children}\n        {/* 44px on touch screens, 32px with a mouse. */}\n        {showCloseButton && (\n          <SheetPrimitive.Close\n            className={cn(\n              'absolute right-3 grid size-8 place-items-center rounded-md text-muted-foreground transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 pointer-coarse:size-11 [&_svg]:size-4 pointer-coarse:[&_svg]:size-5',\n              side === 'top' ? 'top-[calc(env(safe-area-inset-top)+0.75rem)]' : 'top-3',\n            )}\n          >\n            <X aria-hidden />\n            <span className=\"sr-only\">Close</span>\n          </SheetPrimitive.Close>\n        )}\n      </SheetPrimitive.Content>\n    </SheetPrimitive.Portal>\n  );\n}\n\nfunction SheetHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-header\"\n      className={cn('flex flex-col gap-1.5 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"sheet-footer\"\n      className={cn('mt-auto flex flex-col gap-2 p-4', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetTitle({ className, ...props }: React.ComponentProps<typeof SheetPrimitive.Title>) {\n  return (\n    <SheetPrimitive.Title\n      data-slot=\"sheet-title\"\n      className={cn('text-base font-semibold tracking-[-0.02em] text-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nfunction SheetDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof SheetPrimitive.Description>) {\n  return (\n    <SheetPrimitive.Description\n      data-slot=\"sheet-description\"\n      className={cn('text-sm text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n};\n"],"mappings":";;;;;;AAMA,SAAS,MAAM,OAAyD;CACtE,OAAO,oBAACA,OAAe,MAAhB;EAAqB,aAAU;EAAQ,GAAI;CAAQ,CAAA;AAC5D;AAEA,SAAS,aAAa,OAA4D;CAChF,OAAO,oBAACA,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAEA,SAAS,WAAW,OAA0D;CAC5E,OAAO,oBAACA,OAAe,OAAhB;EAAsB,aAAU;EAAc,GAAI;CAAQ,CAAA;AACnE;AAEA,IAAM,cAAc;CAClB,OAAO;CACP,MAAM;CAGN,KAAK;CACL,QACE;AACJ;AAEA,SAAS,aAAa,EACpB,WACA,UACA,OAAO,SACP,SAAS,SAAS,UAClB,kBAAkB,MAClB,GAAG,SAcF;CACD,OACE,qBAACA,OAAe,QAAhB,EAAA,UAAA,CACE,oBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAU;CACX,CAAA,GACD,qBAACA,OAAe,SAAhB;EACE,aAAU;EACV,WAAW,GACT,mQACA,YAAY,OACZ,SACF;EACA,GAAI;EAPN,UAAA;GASG,UACC,oBAAC,OAAD;IACE,aAAU;IACV,eAAA;IACA,WAAU;GACX,CAAA;GAEF;GAEA,mBACC,qBAACA,OAAe,OAAhB;IACE,WAAW,GACT,gRACA,SAAS,QAAQ,iDAAiD,OACpE;IAJF,UAAA,CAME,oBAAC,GAAD,EAAG,eAAA,KAAa,CAAA,GAChB,oBAAC,QAAD;KAAM,WAAU;KAAU,UAAA;IAAW,CAAA,CACjB;;EAEF;CACH,CAAA,CAAA,EAAA,CAAA;AAE3B;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,6BAA6B,SAAS;EACpD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CACzE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA4D;CAC9F,OACE,oBAACA,OAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,8DAA8D,SAAS;EACrF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,OAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,iCAAiC,SAAS;EACxD,GAAI;CACL,CAAA;AAEL"}

package/dist/components/steps.d.ts

@@ -3,12 +3,25 @@ export interface StepItem {
     title: React.ReactNode;
     description?: React.ReactNode;
 }
+export type StepsBreakpoint = 'sm' | 'md' | 'lg';
 export interface StepsProps extends React.ComponentProps<'ol'> {
     items: StepItem[];
     /** 0-based index of the step in progress; earlier steps show as done. */
     current: number;
     orientation?: 'horizontal' | 'vertical';
+    /**
+     * Below this width a horizontal Steps shows only where you are: the step's
+     * title, "Step 2 of 5" and a segmented progress bar. `sm` (640px) by
+     * default for horizontal steps; `false` keeps every step visible.
+     */
+    compactBelow?: StepsBreakpoint | false;
+    /** The compact counter's text. */
+    formatCounter?: (step: number, total: number) => string;
 }
-/** Progress through a short multi-step flow (a wizard, an onboarding). */
-declare function Steps({ items, current, orientation, className, ...props }: StepsProps): React.JSX.Element;
+/**
+ * Progress through a short multi-step flow (a wizard, an onboarding). On a
+ * phone a horizontal Steps collapses to the current step, "Step 2 of 5" and
+ * a progress bar, instead of squeezing every title into a few letters.
+ */
+declare function Steps({ items, current, orientation, compactBelow, formatCounter, className, ...props }: StepsProps): React.JSX.Element;
 export { Steps };

package/dist/components/steps.js

@@ -1,10 +1,42 @@
 import { cn } from "../lib/utils.js";
 import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import Check from "@burtson-labs/icons/react/check";
 //#region src/components/steps.tsx
-/** Progress through a short multi-step flow (a wizard, an onboarding). */
-function Steps({ items, current, orientation = "horizontal", className, ...props }) {
+var compactClasses = {
+	sm: {
+		other: "max-sm:hidden",
+		item: "max-sm:grid max-sm:grid-cols-[minmax(0,1fr)_auto] max-sm:items-baseline max-sm:gap-x-3 max-sm:gap-y-2",
+		marker: "max-sm:hidden",
+		counter: "hidden max-sm:block",
+		bar: "hidden max-sm:flex max-sm:col-span-2",
+		text: "max-sm:pt-0"
+	},
+	md: {
+		other: "max-md:hidden",
+		item: "max-md:grid max-md:grid-cols-[minmax(0,1fr)_auto] max-md:items-baseline max-md:gap-x-3 max-md:gap-y-2",
+		marker: "max-md:hidden",
+		counter: "hidden max-md:block",
+		bar: "hidden max-md:flex max-md:col-span-2",
+		text: "max-md:pt-0"
+	},
+	lg: {
+		other: "max-lg:hidden",
+		item: "max-lg:grid max-lg:grid-cols-[minmax(0,1fr)_auto] max-lg:items-baseline max-lg:gap-x-3 max-lg:gap-y-2",
+		marker: "max-lg:hidden",
+		counter: "hidden max-lg:block",
+		bar: "hidden max-lg:flex max-lg:col-span-2",
+		text: "max-lg:pt-0"
+	}
+};
+/**
+* Progress through a short multi-step flow (a wizard, an onboarding). On a
+* phone a horizontal Steps collapses to the current step, "Step 2 of 5" and
+* a progress bar, instead of squeezing every title into a few letters.
+*/
+function Steps({ items, current, orientation = "horizontal", compactBelow = orientation === "horizontal" ? "sm" : false, formatCounter = (step, total) => `Step ${step} of ${total}`, className, ...props }) {
+	const compact = compactBelow ? compactClasses[compactBelow] : null;
+	const focus = Math.min(Math.max(0, current), items.length - 1);
 	return /* @__PURE__ */ jsx("ol", {
 		"data-slot": "steps",
 		"data-orientation": orientation,
@@ -12,29 +44,43 @@ function Steps({ items, current, orientation = "horizontal", className, ...props
 		...props,
 		children: items.map((item, i) => {
 			const state = i < current ? "complete" : i === current ? "current" : "upcoming";
+			const isFocus = compact && i === focus;
 			return /* @__PURE__ */ jsxs("li", {
 				"data-state": state,
 				"aria-current": state === "current" ? "step" : void 0,
-				className: cn("flex min-w-0 items-start gap-2.5", orientation === "horizontal" && "flex-1"),
-				children: [/* @__PURE__ */ jsx("span", {
-					className: cn("grid size-6 shrink-0 place-items-center rounded-full border text-xs font-semibold tabular-nums", state === "complete" && "border-primary bg-primary text-primary-foreground", state === "current" && "border-brand bg-brand-soft text-brand", state === "upcoming" && "border-border-strong text-muted-foreground"),
-					children: state === "complete" ? /* @__PURE__ */ jsx(Check, {
-						className: "size-3.5",
-						"aria-hidden": true
-					}) : i + 1
-				}), /* @__PURE__ */ jsxs("span", {
-					className: "grid min-w-0 gap-0.5 pt-0.5",
-					children: [/* @__PURE__ */ jsxs("span", {
-						className: cn("break-words text-[13px] font-semibold", state === "upcoming" && "text-muted-foreground"),
-						children: [item.title, /* @__PURE__ */ jsx("span", {
-							className: "sr-only",
-							children: state === "complete" ? " (done)" : state === "current" ? " (current)" : ""
+				className: cn("flex min-w-0 items-start gap-2.5", orientation === "horizontal" && "flex-1", compact && (isFocus ? compact.item : compact.other)),
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: cn("grid size-6 shrink-0 place-items-center rounded-full border text-xs font-semibold tabular-nums", state === "complete" && "border-primary bg-primary text-primary-foreground", state === "current" && "border-brand bg-brand-soft text-brand", state === "upcoming" && "border-border-strong text-muted-foreground", isFocus && compact.marker),
+						children: state === "complete" ? /* @__PURE__ */ jsx(Check, {
+							className: "size-3.5",
+							"aria-hidden": true
+						}) : i + 1
+					}),
+					/* @__PURE__ */ jsxs("span", {
+						className: cn("grid min-w-0 gap-0.5 pt-0.5", isFocus && compact.text),
+						children: [/* @__PURE__ */ jsxs("span", {
+							className: cn("break-words text-[13px] font-semibold", state === "upcoming" && "text-muted-foreground"),
+							children: [item.title, /* @__PURE__ */ jsx("span", {
+								className: "sr-only",
+								children: state === "complete" ? " (done)" : state === "current" ? " (current)" : ""
+							})]
+						}), item.description && /* @__PURE__ */ jsx("span", {
+							className: "text-xs text-muted-foreground",
+							children: item.description
 						})]
-					}), item.description && /* @__PURE__ */ jsx("span", {
-						className: "text-xs text-muted-foreground",
-						children: item.description
-					})]
-				})]
+					}),
+					isFocus && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+						"data-slot": "steps-counter",
+						className: cn("text-xs whitespace-nowrap text-muted-foreground tabular-nums", compact.counter),
+						children: formatCounter(focus + 1, items.length)
+					}), /* @__PURE__ */ jsx("span", {
+						"data-slot": "steps-bar",
+						"aria-hidden": true,
+						className: cn("gap-1", compact.bar),
+						children: items.map((_, j) => /* @__PURE__ */ jsx("span", { className: cn("h-1 flex-1 rounded-full", j <= current ? "bg-brand" : "bg-muted") }, j))
+					})] })
+				]
 			}, i);
 		})
 	});

package/dist/components/steps.js.map

@@ -1 +1 @@
-{"version":3,"file":"steps.js","names":[],"sources":["../../src/components/steps.tsx"],"sourcesContent":["import Check from '@burtson-labs/icons/react/check';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nexport interface StepItem {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n}\n\nexport interface StepsProps extends React.ComponentProps<'ol'> {\n  items: StepItem[];\n  /** 0-based index of the step in progress; earlier steps show as done. */\n  current: number;\n  orientation?: 'horizontal' | 'vertical';\n}\n\n/** Progress through a short multi-step flow (a wizard, an onboarding). */\nfunction Steps({ items, current, orientation = 'horizontal', className, ...props }: StepsProps) {\n  return (\n    <ol\n      data-slot=\"steps\"\n      data-orientation={orientation}\n      className={cn(\n        'flex gap-3',\n        orientation === 'horizontal' ? 'flex-row items-start' : 'flex-col',\n        className,\n      )}\n      {...props}\n    >\n      {items.map((item, i) => {\n        const state = i < current ? 'complete' : i === current ? 'current' : 'upcoming';\n        return (\n          <li\n            key={i}\n            data-state={state}\n            aria-current={state === 'current' ? 'step' : undefined}\n            className={cn(\n              'flex min-w-0 items-start gap-2.5',\n              orientation === 'horizontal' && 'flex-1',\n            )}\n          >\n            <span\n              className={cn(\n                'grid size-6 shrink-0 place-items-center rounded-full border text-xs font-semibold tabular-nums',\n                state === 'complete' && 'border-primary bg-primary text-primary-foreground',\n                state === 'current' && 'border-brand bg-brand-soft text-brand',\n                state === 'upcoming' && 'border-border-strong text-muted-foreground',\n              )}\n            >\n              {state === 'complete' ? <Check className=\"size-3.5\" aria-hidden /> : i + 1}\n            </span>\n            <span className=\"grid min-w-0 gap-0.5 pt-0.5\">\n              <span\n                className={cn(\n                  'break-words text-[13px] font-semibold',\n                  state === 'upcoming' && 'text-muted-foreground',\n                )}\n              >\n                {item.title}\n                <span className=\"sr-only\">\n                  {state === 'complete' ? ' (done)' : state === 'current' ? ' (current)' : ''}\n                </span>\n              </span>\n              {item.description && (\n                <span className=\"text-xs text-muted-foreground\">{item.description}</span>\n              )}\n            </span>\n          </li>\n        );\n      })}\n    </ol>\n  );\n}\n\nexport { Steps };\n"],"mappings":";;;;;;AAkBA,SAAS,MAAM,EAAE,OAAO,SAAS,cAAc,cAAc,WAAW,GAAG,SAAqB;CAC9F,OACE,oBAAC,MAAD;EACE,aAAU;EACV,oBAAkB;EAClB,WAAW,GACT,cACA,gBAAgB,eAAe,yBAAyB,YACxD,SACF;EACA,GAAI;EAEH,UAAA,MAAM,KAAK,MAAM,MAAM;GACtB,MAAM,QAAQ,IAAI,UAAU,aAAa,MAAM,UAAU,YAAY;GACrE,OACE,qBAAC,MAAD;IAEE,cAAY;IACZ,gBAAc,UAAU,YAAY,SAAS,KAAA;IAC7C,WAAW,GACT,oCACA,gBAAgB,gBAAgB,QAClC;IAPF,UAAA,CASE,oBAAC,QAAD;KACE,WAAW,GACT,kGACA,UAAU,cAAc,qDACxB,UAAU,aAAa,yCACvB,UAAU,cAAc,4CAC1B;KAEC,UAAA,UAAU,aAAa,oBAAC,OAAD;MAAO,WAAU;MAAW,eAAA;KAAa,CAAA,IAAI,IAAI;IACrE,CAAA,GACN,qBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACE,qBAAC,QAAD;MACE,WAAW,GACT,yCACA,UAAU,cAAc,uBAC1B;MAJF,UAAA,CAMG,KAAK,OACN,oBAAC,QAAD;OAAM,WAAU;OACb,UAAA,UAAU,aAAa,YAAY,UAAU,YAAY,eAAe;MACrE,CAAA,CACF;KACL,CAAA,GAAA,KAAK,eACJ,oBAAC,QAAD;MAAM,WAAU;MAAiC,UAAA,KAAK;KAAkB,CAAA,CAEtE;IACJ,CAAA,CAAA;GAlCG,GAAA,CAkCH;EAER,CAAC;CACC,CAAA;AAER"}
+{"version":3,"file":"steps.js","names":["_Fragment"],"sources":["../../src/components/steps.tsx"],"sourcesContent":["import Check from '@burtson-labs/icons/react/check';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nexport interface StepItem {\n  title: React.ReactNode;\n  description?: React.ReactNode;\n}\n\nexport type StepsBreakpoint = 'sm' | 'md' | 'lg';\n\nexport interface StepsProps extends React.ComponentProps<'ol'> {\n  items: StepItem[];\n  /** 0-based index of the step in progress; earlier steps show as done. */\n  current: number;\n  orientation?: 'horizontal' | 'vertical';\n  /**\n   * Below this width a horizontal Steps shows only where you are: the step's\n   * title, \"Step 2 of 5\" and a segmented progress bar. `sm` (640px) by\n   * default for horizontal steps; `false` keeps every step visible.\n   */\n  compactBelow?: StepsBreakpoint | false;\n  /** The compact counter's text. */\n  formatCounter?: (step: number, total: number) => string;\n}\n\n// Written out in full per breakpoint so Tailwind finds every class.\nconst compactClasses: Record<\n  StepsBreakpoint,\n  { other: string; item: string; marker: string; counter: string; bar: string; text: string }\n> = {\n  sm: {\n    other: 'max-sm:hidden',\n    item: 'max-sm:grid max-sm:grid-cols-[minmax(0,1fr)_auto] max-sm:items-baseline max-sm:gap-x-3 max-sm:gap-y-2',\n    marker: 'max-sm:hidden',\n    counter: 'hidden max-sm:block',\n    bar: 'hidden max-sm:flex max-sm:col-span-2',\n    text: 'max-sm:pt-0',\n  },\n  md: {\n    other: 'max-md:hidden',\n    item: 'max-md:grid max-md:grid-cols-[minmax(0,1fr)_auto] max-md:items-baseline max-md:gap-x-3 max-md:gap-y-2',\n    marker: 'max-md:hidden',\n    counter: 'hidden max-md:block',\n    bar: 'hidden max-md:flex max-md:col-span-2',\n    text: 'max-md:pt-0',\n  },\n  lg: {\n    other: 'max-lg:hidden',\n    item: 'max-lg:grid max-lg:grid-cols-[minmax(0,1fr)_auto] max-lg:items-baseline max-lg:gap-x-3 max-lg:gap-y-2',\n    marker: 'max-lg:hidden',\n    counter: 'hidden max-lg:block',\n    bar: 'hidden max-lg:flex max-lg:col-span-2',\n    text: 'max-lg:pt-0',\n  },\n};\n\n/**\n * Progress through a short multi-step flow (a wizard, an onboarding). On a\n * phone a horizontal Steps collapses to the current step, \"Step 2 of 5\" and\n * a progress bar, instead of squeezing every title into a few letters.\n */\nfunction Steps({\n  items,\n  current,\n  orientation = 'horizontal',\n  compactBelow = orientation === 'horizontal' ? 'sm' : false,\n  formatCounter = (step, total) => `Step ${step} of ${total}`,\n  className,\n  ...props\n}: StepsProps) {\n  const compact = compactBelow ? compactClasses[compactBelow] : null;\n  // The step the compact form shows: the current one, or the last when all are done.\n  const focus = Math.min(Math.max(0, current), items.length - 1);\n  return (\n    <ol\n      data-slot=\"steps\"\n      data-orientation={orientation}\n      className={cn(\n        'flex gap-3',\n        orientation === 'horizontal' ? 'flex-row items-start' : 'flex-col',\n        className,\n      )}\n      {...props}\n    >\n      {items.map((item, i) => {\n        const state = i < current ? 'complete' : i === current ? 'current' : 'upcoming';\n        const isFocus = compact && i === focus;\n        return (\n          <li\n            key={i}\n            data-state={state}\n            aria-current={state === 'current' ? 'step' : undefined}\n            className={cn(\n              'flex min-w-0 items-start gap-2.5',\n              orientation === 'horizontal' && 'flex-1',\n              compact && (isFocus ? compact.item : compact.other),\n            )}\n          >\n            <span\n              className={cn(\n                'grid size-6 shrink-0 place-items-center rounded-full border text-xs font-semibold tabular-nums',\n                state === 'complete' && 'border-primary bg-primary text-primary-foreground',\n                state === 'current' && 'border-brand bg-brand-soft text-brand',\n                state === 'upcoming' && 'border-border-strong text-muted-foreground',\n                isFocus && compact.marker,\n              )}\n            >\n              {state === 'complete' ? <Check className=\"size-3.5\" aria-hidden /> : i + 1}\n            </span>\n            <span className={cn('grid min-w-0 gap-0.5 pt-0.5', isFocus && compact.text)}>\n              <span\n                className={cn(\n                  'break-words text-[13px] font-semibold',\n                  state === 'upcoming' && 'text-muted-foreground',\n                )}\n              >\n                {item.title}\n                <span className=\"sr-only\">\n                  {state === 'complete' ? ' (done)' : state === 'current' ? ' (current)' : ''}\n                </span>\n              </span>\n              {item.description && (\n                <span className=\"text-xs text-muted-foreground\">{item.description}</span>\n              )}\n            </span>\n            {isFocus && (\n              <>\n                <span\n                  data-slot=\"steps-counter\"\n                  className={cn(\n                    'text-xs whitespace-nowrap text-muted-foreground tabular-nums',\n                    compact.counter,\n                  )}\n                >\n                  {formatCounter(focus + 1, items.length)}\n                </span>\n                <span data-slot=\"steps-bar\" aria-hidden className={cn('gap-1', compact.bar)}>\n                  {items.map((_, j) => (\n                    <span\n                      key={j}\n                      className={cn(\n                        'h-1 flex-1 rounded-full',\n                        j <= current ? 'bg-brand' : 'bg-muted',\n                      )}\n                    />\n                  ))}\n                </span>\n              </>\n            )}\n          </li>\n        );\n      })}\n    </ol>\n  );\n}\n\nexport { Steps };\n"],"mappings":";;;;;AA4BA,IAAM,iBAGF;CACF,IAAI;EACF,OAAO;EACP,MAAM;EACN,QAAQ;EACR,SAAS;EACT,KAAK;EACL,MAAM;CACR;CACA,IAAI;EACF,OAAO;EACP,MAAM;EACN,QAAQ;EACR,SAAS;EACT,KAAK;EACL,MAAM;CACR;CACA,IAAI;EACF,OAAO;EACP,MAAM;EACN,QAAQ;EACR,SAAS;EACT,KAAK;EACL,MAAM;CACR;AACF;;;;;;AAOA,SAAS,MAAM,EACb,OACA,SACA,cAAc,cACd,eAAe,gBAAgB,eAAe,OAAO,OACrD,iBAAiB,MAAM,UAAU,QAAQ,KAAK,MAAM,SACpD,WACA,GAAG,SACU;CACb,MAAM,UAAU,eAAe,eAAe,gBAAgB;CAE9D,MAAM,QAAQ,KAAK,IAAI,KAAK,IAAI,GAAG,OAAO,GAAG,MAAM,SAAS,CAAC;CAC7D,OACE,oBAAC,MAAD;EACE,aAAU;EACV,oBAAkB;EAClB,WAAW,GACT,cACA,gBAAgB,eAAe,yBAAyB,YACxD,SACF;EACA,GAAI;EAEH,UAAA,MAAM,KAAK,MAAM,MAAM;GACtB,MAAM,QAAQ,IAAI,UAAU,aAAa,MAAM,UAAU,YAAY;GACrE,MAAM,UAAU,WAAW,MAAM;GACjC,OACE,qBAAC,MAAD;IAEE,cAAY;IACZ,gBAAc,UAAU,YAAY,SAAS,KAAA;IAC7C,WAAW,GACT,oCACA,gBAAgB,gBAAgB,UAChC,YAAY,UAAU,QAAQ,OAAO,QAAQ,MAC/C;IARF,UAAA;KAUE,oBAAC,QAAD;MACE,WAAW,GACT,kGACA,UAAU,cAAc,qDACxB,UAAU,aAAa,yCACvB,UAAU,cAAc,8CACxB,WAAW,QAAQ,MACrB;MAEC,UAAA,UAAU,aAAa,oBAAC,OAAD;OAAO,WAAU;OAAW,eAAA;MAAa,CAAA,IAAI,IAAI;KACrE,CAAA;KACN,qBAAC,QAAD;MAAM,WAAW,GAAG,+BAA+B,WAAW,QAAQ,IAAI;MAA1E,UAAA,CACE,qBAAC,QAAD;OACE,WAAW,GACT,yCACA,UAAU,cAAc,uBAC1B;OAJF,UAAA,CAMG,KAAK,OACN,oBAAC,QAAD;QAAM,WAAU;QACb,UAAA,UAAU,aAAa,YAAY,UAAU,YAAY,eAAe;OACrE,CAAA,CACF;MACL,CAAA,GAAA,KAAK,eACJ,oBAAC,QAAD;OAAM,WAAU;OAAiC,UAAA,KAAK;MAAkB,CAAA,CAEtE;;KACL,WACC,qBAAAA,UAAA,EAAA,UAAA,CACE,oBAAC,QAAD;MACE,aAAU;MACV,WAAW,GACT,gEACA,QAAQ,OACV;MAEC,UAAA,cAAc,QAAQ,GAAG,MAAM,MAAM;KAClC,CAAA,GACN,oBAAC,QAAD;MAAM,aAAU;MAAY,eAAA;MAAY,WAAW,GAAG,SAAS,QAAQ,GAAG;MACvE,UAAA,MAAM,KAAK,GAAG,MACb,oBAAC,QAAD,EAEE,WAAW,GACT,2BACA,KAAK,UAAU,aAAa,UAC9B,EACD,GALM,CAKN,CACF;KACG,CAAA,CACN,EAAA,CAAA;IAEF;GA5DG,GAAA,CA4DH;EAER,CAAC;CACC,CAAA;AAER"}

package/dist/index.d.ts

@@ -15,6 +15,7 @@ export * from './components/card';
 export * from './components/chat-history';
 export * from './components/chat-layout';
 export * from './components/checkbox';
+export * from './components/checkbox-card';
 export * from './components/collapsible';
 export * from './components/combobox';
 export * from './components/command';

package/dist/index.js

@@ -16,16 +16,17 @@ import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, Breadcr
 import { Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, cardVariants } from "./components/card.js";
 import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger, menuItemClasses, surfaceClasses } from "./components/popover.js";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./components/dropdown-menu.js";
+import { Input, fieldClasses, fieldFocusClasses } from "./components/input.js";
 import { ChatHistory, groupConversations, matchesConversation } from "./components/chat-history.js";
 import { IconButton } from "./components/icon-button.js";
 import { ResizablePanel, ResizablePanelGroup, ResizeHandle, useGroupRef, usePanelRef } from "./components/resizable.js";
 import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./components/sheet.js";
 import { ChatLayout, useFullscreen } from "./components/chat-layout.js";
 import { Checkbox } from "./components/checkbox.js";
+import { CheckboxCard, CheckboxCardGroup } from "./components/checkbox-card.js";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./components/collapsible.js";
 import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from "./components/dialog.js";
 import { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from "./components/command.js";
-import { Input, fieldClasses } from "./components/input.js";
 import { Combobox } from "./components/combobox.js";
 import { Composer, Suggestions, acceptsFile } from "./components/composer.js";
 import { Status, StatusDot, statusDotVariants } from "./components/status.js";
@@ -36,7 +37,8 @@ import { Conversation } from "./components/conversation.js";
 import { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, toastVariants } from "./components/toast.js";
 import { Toaster, toast } from "./components/toaster.js";
 import { CopyButton } from "./components/copy-button.js";
-import { Pagination, paginationRange } from "./components/pagination.js";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue } from "./components/select.js";
+import { DEFAULT_PAGE_SIZES, Pagination, clampPage, pageCountFor, pageWindow, paginate, paginationRange, paginationSummary, usePagination } from "./components/pagination.js";
 import { Skeleton } from "./components/skeleton.js";
 import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./components/table.js";
 import { DataTable } from "./components/data-table.js";
@@ -57,7 +59,6 @@ import { RadioGroup, RadioGroupItem } from "./components/radio-group.js";
 import { Reasoning, StreamingIndicator } from "./components/reasoning.js";
 import { ScrollArea, ScrollBar } from "./components/scroll-area.js";
 import { SecretInput } from "./components/secret-input.js";
-import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue } from "./components/select.js";
 import { Separator } from "./components/separator.js";
 import { Slider } from "./components/slider.js";
 import { SourceCitation, SourceList, safeSourceHref } from "./components/source.js";
@@ -71,4 +72,4 @@ import { Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer } from "./compon
 import { Spotlight, Tour, TourAnchor, findTourTarget, tourTarget, waitForTourTarget } from "./components/tour.js";
 import { TreeView, flattenTree } from "./components/tree-view.js";
 import { VoiceRecorder } from "./components/voice-recorder.js";
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar, AttachmentItem, AttachmentTray, AudioPlayer, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, ChatHistory, ChatLayout, Checkbox, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Composer, ConnectionBanner, ConnectionStatus, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Conversation, CopyButton, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EditorTabs, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateTitle, Field, FieldDescription, FieldError, FieldHeader, FieldHint, FieldLabel, IconButton, Input, Kbd, KbdGroup, Label, Markdown, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Message, MessageActions, MessageAttachments, MessageEditor, MobileNav, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, OnboardingChecklist, PageHeader, PageHeaderActions, PageHeaderDescription, PageHeaderEyebrow, PageHeaderMain, PageHeaderTitle, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, Reasoning, ResizablePanel, ResizablePanelGroup, ResizeHandle, ScrollArea, ScrollBar, SecretInput, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, SourceCitation, SourceList, Spinner, Spotlight, StatCard, Status, StatusDot, Steps, StreamingIndicator, Suggestions, Switch, SyncStatus, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, ToolApproval, ToolCall, Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tour, TourAnchor, TreeView, UploadQueue, VoiceMessage, VoiceRecorder, accentTokens, acceptsFile, alertVariants, badgeVariants, brand, buttonVariants, cardVariants, cn, computePeaks, contrast, dark, duration, easing, elevation, fieldClasses, findTourTarget, flattenTree, fontMono, fontSans, formatBytes, formatDuration, groupConversations, isApplePlatform, light, matchesConversation, menuItemClasses, mix, modKeyLabel, motion, navigationMenuTriggerStyle, paginationRange, parseMarkdown, peaksFromChannelData, radius, safeSourceHref, shadow, shortcutLabel, statusDotVariants, surfaceClasses, toast, toastVariants, tokens, tourTarget, useFullscreen, useGroupRef, usePanelRef, waitForTourTarget };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar, AttachmentItem, AttachmentTray, AudioPlayer, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, ChatHistory, ChatLayout, Checkbox, CheckboxCard, CheckboxCardGroup, CodeBlock, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Composer, ConnectionBanner, ConnectionStatus, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Conversation, CopyButton, DEFAULT_PAGE_SIZES, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EditorTabs, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateTitle, Field, FieldDescription, FieldError, FieldHeader, FieldHint, FieldLabel, IconButton, Input, Kbd, KbdGroup, Label, Markdown, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Message, MessageActions, MessageAttachments, MessageEditor, MobileNav, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, OnboardingChecklist, PageHeader, PageHeaderActions, PageHeaderDescription, PageHeaderEyebrow, PageHeaderMain, PageHeaderTitle, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, Reasoning, ResizablePanel, ResizablePanelGroup, ResizeHandle, ScrollArea, ScrollBar, SecretInput, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Slider, SourceCitation, SourceList, Spinner, Spotlight, StatCard, Status, StatusDot, Steps, StreamingIndicator, Suggestions, Switch, SyncStatus, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toaster, ToolApproval, ToolCall, Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Tour, TourAnchor, TreeView, UploadQueue, VoiceMessage, VoiceRecorder, accentTokens, acceptsFile, alertVariants, badgeVariants, brand, buttonVariants, cardVariants, clampPage, cn, computePeaks, contrast, dark, duration, easing, elevation, fieldClasses, fieldFocusClasses, findTourTarget, flattenTree, fontMono, fontSans, formatBytes, formatDuration, groupConversations, isApplePlatform, light, matchesConversation, menuItemClasses, mix, modKeyLabel, motion, navigationMenuTriggerStyle, pageCountFor, pageWindow, paginate, paginationRange, paginationSummary, parseMarkdown, peaksFromChannelData, radius, safeSourceHref, shadow, shortcutLabel, statusDotVariants, surfaceClasses, toast, toastVariants, tokens, tourTarget, useFullscreen, useGroupRef, usePagination, usePanelRef, waitForTourTarget };

package/dist/mui/index.js

@@ -189,11 +189,17 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 				border: `1px solid ${p.border}`,
 				boxShadow: shadow.md
 			} } },
-			MuiMenu: { styleOverrides: { paper: {
-				borderRadius: radius.lg,
-				border: `1px solid ${p.border}`,
-				boxShadow: shadow.md
-			} } },
+			MuiMenu: { styleOverrides: {
+				paper: {
+					borderRadius: radius.lg,
+					border: `1px solid ${p["border-strong"]}`,
+					boxShadow: shadow.md
+				},
+				list: {
+					paddingTop: 4,
+					paddingBottom: 4
+				}
+			} },
 			MuiPopover: { styleOverrides: { paper: {
 				borderRadius: radius.lg,
 				border: `1px solid ${p.border}`
@@ -222,10 +228,38 @@ function burtsonThemeOptions(modeOrConfig = "dark") {
 				"&:hover .MuiOutlinedInput-notchedOutline": { borderColor: p["border-strong"] },
 				"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
 					borderColor: p.ring,
-					borderWidth: 1
+					borderWidth: 2
 				},
-				"&.Mui-focused": { boxShadow: focusRing }
+				"&.Mui-error .MuiOutlinedInput-notchedOutline": { borderColor: p.destructive }
 			} } },
+			MuiMenuItem: { styleOverrides: { root: {
+				margin: "0 4px",
+				borderRadius: radius.sm,
+				"&.Mui-focusVisible, &:hover": { backgroundColor: p.secondary },
+				"&.Mui-selected": {
+					backgroundColor: "transparent",
+					fontWeight: 600
+				},
+				"&.Mui-selected.Mui-focusVisible, &.Mui-selected:hover": { backgroundColor: p.secondary }
+			} } },
+			MuiAutocomplete: { styleOverrides: {
+				paper: {
+					borderRadius: radius.lg,
+					border: `1px solid ${p["border-strong"]}`
+				},
+				listbox: {
+					padding: 4,
+					"& .MuiAutocomplete-option": {
+						borderRadius: radius.sm,
+						"&.Mui-focused, &.Mui-focusVisible": { backgroundColor: p.secondary },
+						"&[aria-selected=\"true\"]": {
+							backgroundColor: "transparent",
+							fontWeight: 600
+						},
+						"&[aria-selected=\"true\"].Mui-focused": { backgroundColor: p.secondary }
+					}
+				}
+			} },
 			MuiTextField: { defaultProps: { size: compact ? "small" : "medium" } },
 			MuiAlert: { styleOverrides: { root: { borderRadius: radius.md } } },
 			MuiTooltip: { styleOverrides: { tooltip: {

package/dist/mui/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/mui/index.ts"],"sourcesContent":["/**\n * The Burtson palette for MUI apps, so a screen built with MUI and one built\n * with Burtson UI components look like the same product.\n *\n *   import { ThemeProvider } from '@mui/material/styles';\n *   import { createBurtsonTheme } from '@burtson-labs/ui/mui';\n *   <ThemeProvider theme={createBurtsonTheme('dark')}>…</ThemeProvider>\n *   <ThemeProvider theme={createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' })}>\n *\n * MUI is an adapter here: every colour, radius, shadow and timing comes from\n * the Burtson tokens, and the component overrides give MUI controls the same\n * shape and states as the Burtson components (focus ring, radius per role,\n * no uppercase buttons, quiet borders instead of heavy shadows).\n */\nimport { createTheme, type Shadows, type Theme, type ThemeOptions } from '@mui/material/styles';\n\nimport {\n  accentTokens,\n  contrast,\n  dark,\n  duration,\n  easing,\n  fontMono,\n  fontSans,\n  light,\n  type Palette,\n  radius,\n  shadow,\n} from '../tokens';\n\nexport type BurtsonMode = 'light' | 'dark';\nexport type BurtsonDensity = 'comfortable' | 'compact';\n\nexport interface BurtsonThemeConfig {\n  mode?: BurtsonMode;\n  /** Any hex colour; primary, brand, soft and ring tones are derived with contrast kept. */\n  accent?: string;\n  /** `compact` for admin and data-dense screens: smaller controls, dense lists and tables. */\n  density?: BurtsonDensity;\n  /** Replace individual palette tokens (a product skin's tinted surfaces). */\n  palette?: Partial<Palette>;\n}\n\nconst px = (rem: string) => Math.round(parseFloat(rem) * 16);\n\n/** The full token palette for a config: base mode, accent-derived brand tones, then explicit overrides. */\nexport function burtsonPalette(config: BurtsonThemeConfig = {}): Palette {\n  const mode = config.mode ?? 'dark';\n  const base = mode === 'dark' ? dark : light;\n  return {\n    ...base,\n    ...(config.accent ? accentTokens(config.accent, mode) : {}),\n    ...config.palette,\n  };\n}\n\nfunction shadows(): Shadows {\n  // MUI indexes elevation 0–24; the Burtson scale has three real levels.\n  const levels = ['none', shadow.xs, shadow.xs, shadow.sm, shadow.sm, shadow.sm];\n  return Array.from({ length: 25 }, (_, i) => levels[i] ?? shadow.md) as Shadows;\n}\n\n/** Theme options only, for apps that deep-merge their own overrides first. */\nexport function burtsonThemeOptions(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n): ThemeOptions {\n  const config = typeof modeOrConfig === 'string' ? { mode: modeOrConfig } : modeOrConfig;\n  const mode = config.mode ?? 'dark';\n  const compact = config.density === 'compact';\n  const p = burtsonPalette(config);\n  const focusRing = `0 0 0 3px color-mix(in srgb, ${p.ring} 24%, transparent)`;\n  return {\n    palette: {\n      mode,\n      primary: { main: p.primary, contrastText: p['primary-foreground'] },\n      // Secondary fills use the brand text tone, which is light in dark mode;\n      // their text is whichever of white or the page background reads.\n      secondary: {\n        main: p.brand,\n        contrastText: contrast(p.brand, '#ffffff') >= 4.5 ? '#ffffff' : p.background,\n      },\n      info: { main: p.info, contrastText: p['info-foreground'] },\n      error: { main: p.destructive, contrastText: p['destructive-foreground'] },\n      warning: { main: p.warning, contrastText: p['warning-foreground'] },\n      success: { main: p.success, contrastText: p['success-foreground'] },\n      background: { default: p.background, paper: p.surface },\n      text: { primary: p.foreground, secondary: p['muted-foreground'] },\n      divider: p.border,\n      action: { hover: p.muted, selected: p['brand-soft'], focus: p['brand-soft'] },\n    },\n    shape: { borderRadius: px(radius.md) },\n    shadows: shadows(),\n    typography: {\n      fontFamily: fontSans,\n      fontSize: compact ? 13 : 14,\n      button: { textTransform: 'none', fontWeight: 600, letterSpacing: '-0.01em' },\n      h1: { fontWeight: 700, letterSpacing: '-0.03em' },\n      h2: { fontWeight: 700, letterSpacing: '-0.025em' },\n      h3: { fontWeight: 650, letterSpacing: '-0.02em' },\n      h4: { fontWeight: 650, letterSpacing: '-0.015em' },\n      h5: { fontWeight: 600 },\n      h6: { fontWeight: 600 },\n      overline: { fontWeight: 600, letterSpacing: '0.08em' },\n    },\n    transitions: {\n      duration: {\n        shortest: duration.fast,\n        shorter: duration.fast,\n        short: duration.standard,\n        standard: duration.standard,\n        complex: duration.emphasis,\n        enteringScreen: duration.emphasis,\n        leavingScreen: duration.exit,\n      },\n      easing: {\n        easeInOut: easing.standard,\n        easeOut: easing.emphasized,\n        easeIn: easing.exit,\n        sharp: easing.standard,\n      },\n    },\n    components: {\n      MuiCssBaseline: {\n        styleOverrides: {\n          'code, kbd, pre, samp': { fontFamily: fontMono },\n          '@media (prefers-reduced-motion: reduce)': {\n            '*, ::before, ::after': {\n              animationDuration: '1ms !important',\n              transitionDuration: '1ms !important',\n            },\n          },\n        },\n      },\n      MuiButtonBase: { defaultProps: { disableRipple: true } },\n      MuiButton: {\n        defaultProps: { disableElevation: true, size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': {\n              boxShadow: focusRing,\n              outline: `2px solid ${p.ring}`,\n              outlineOffset: 2,\n            },\n          },\n          outlined: { borderColor: p['border-strong'] },\n        },\n      },\n      MuiIconButton: {\n        defaultProps: { size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': { outline: `2px solid ${p.ring}`, outlineOffset: 2 },\n          },\n        },\n      },\n      MuiPaper: {\n        styleOverrides: {\n          root: { backgroundImage: 'none' },\n          outlined: { borderColor: p.border },\n          rounded: { borderRadius: radius.lg },\n        },\n      },\n      MuiCard: {\n        defaultProps: { variant: 'outlined' },\n        styleOverrides: {\n          root: { borderRadius: radius.lg, backgroundColor: p.card, borderColor: p.border },\n        },\n      },\n      MuiDialog: {\n        styleOverrides: {\n          paper: { borderRadius: radius.xl, border: `1px solid ${p.border}`, boxShadow: shadow.md },\n        },\n      },\n      MuiMenu: {\n        styleOverrides: {\n          paper: { borderRadius: radius.lg, border: `1px solid ${p.border}`, boxShadow: shadow.md },\n        },\n      },\n      MuiPopover: {\n        styleOverrides: { paper: { borderRadius: radius.lg, border: `1px solid ${p.border}` } },\n      },\n      MuiChip: {\n        defaultProps: { size: 'small' },\n        styleOverrides: { root: { borderRadius: radius.full, fontWeight: 500 } },\n      },\n      MuiTabs: {\n        styleOverrides: { indicator: { backgroundColor: p.brand, height: 2 } },\n      },\n      MuiTab: {\n        styleOverrides: {\n          root: {\n            textTransform: 'none',\n            fontWeight: 500,\n            minHeight: compact ? 36 : 44,\n            '&.Mui-selected': { color: p.foreground },\n          },\n        },\n      },\n      MuiOutlinedInput: {\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            backgroundColor: p.surface,\n            '& .MuiOutlinedInput-notchedOutline': { borderColor: p.input },\n            '&:hover .MuiOutlinedInput-notchedOutline': { borderColor: p['border-strong'] },\n            '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n              borderColor: p.ring,\n              borderWidth: 1,\n            },\n            '&.Mui-focused': { boxShadow: focusRing },\n          },\n        },\n      },\n      MuiTextField: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiAlert: { styleOverrides: { root: { borderRadius: radius.md } } },\n      MuiTooltip: {\n        styleOverrides: {\n          tooltip: {\n            backgroundColor: p.code,\n            color: p['code-foreground'],\n            fontSize: 12,\n            borderRadius: radius.sm,\n          },\n        },\n      },\n      MuiSwitch: {\n        styleOverrides: {\n          switchBase: {\n            '&.Mui-checked + .MuiSwitch-track': { backgroundColor: p.brand, opacity: 1 },\n          },\n          track: { backgroundColor: p['border-strong'], opacity: 1 },\n        },\n      },\n      MuiList: { defaultProps: { dense: compact } },\n      MuiTable: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiToolbar: { defaultProps: { variant: compact ? 'dense' : 'regular' } },\n      MuiDivider: { styleOverrides: { root: { borderColor: p.border } } },\n    },\n  };\n}\n\n/**\n * `createBurtsonTheme('dark')` or `createBurtsonTheme({ mode, accent, density })`,\n * then any MUI overrides, merged in order.\n */\nexport function createBurtsonTheme(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n  ...overrides: ThemeOptions[]\n): Theme {\n  return createTheme(burtsonThemeOptions(modeOrConfig), ...overrides);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AA2CA,IAAM,MAAM,QAAgB,KAAK,MAAM,WAAW,GAAG,IAAI,EAAE;;AAG3D,SAAgB,eAAe,SAA6B,CAAC,GAAY;CACvE,MAAM,OAAO,OAAO,QAAQ;CAE5B,OAAO;EACL,GAFW,SAAS,SAAS,OAAO;EAGpC,GAAI,OAAO,SAAS,aAAa,OAAO,QAAQ,IAAI,IAAI,CAAC;EACzD,GAAG,OAAO;CACZ;AACF;AAEA,SAAS,UAAmB;CAE1B,MAAM,SAAS;EAAC;EAAQ,OAAO;EAAI,OAAO;EAAI,OAAO;EAAI,OAAO;EAAI,OAAO;CAAE;CAC7E,OAAO,MAAM,KAAK,EAAE,QAAQ,GAAG,IAAI,GAAG,MAAM,OAAO,MAAM,OAAO,EAAE;AACpE;;AAGA,SAAgB,oBACd,eAAiD,QACnC;CACd,MAAM,SAAS,OAAO,iBAAiB,WAAW,EAAE,MAAM,aAAa,IAAI;CAC3E,MAAM,OAAO,OAAO,QAAQ;CAC5B,MAAM,UAAU,OAAO,YAAY;CACnC,MAAM,IAAI,eAAe,MAAM;CAC/B,MAAM,YAAY,gCAAgC,EAAE,KAAK;CACzD,OAAO;EACL,SAAS;GACP;GACA,SAAS;IAAE,MAAM,EAAE;IAAS,cAAc,EAAE;GAAsB;GAGlE,WAAW;IACT,MAAM,EAAE;IACR,cAAc,SAAS,EAAE,OAAO,SAAS,KAAK,MAAM,YAAY,EAAE;GACpE;GACA,MAAM;IAAE,MAAM,EAAE;IAAM,cAAc,EAAE;GAAmB;GACzD,OAAO;IAAE,MAAM,EAAE;IAAa,cAAc,EAAE;GAA0B;GACxE,SAAS;IAAE,MAAM,EAAE;IAAS,cAAc,EAAE;GAAsB;GAClE,SAAS;IAAE,MAAM,EAAE;IAAS,cAAc,EAAE;GAAsB;GAClE,YAAY;IAAE,SAAS,EAAE;IAAY,OAAO,EAAE;GAAQ;GACtD,MAAM;IAAE,SAAS,EAAE;IAAY,WAAW,EAAE;GAAoB;GAChE,SAAS,EAAE;GACX,QAAQ;IAAE,OAAO,EAAE;IAAO,UAAU,EAAE;IAAe,OAAO,EAAE;GAAc;EAC9E;EACA,OAAO,EAAE,cAAc,GAAG,OAAO,EAAE,EAAE;EACrC,SAAS,QAAQ;EACjB,YAAY;GACV,YAAY;GACZ,UAAU,UAAU,KAAK;GACzB,QAAQ;IAAE,eAAe;IAAQ,YAAY;IAAK,eAAe;GAAU;GAC3E,IAAI;IAAE,YAAY;IAAK,eAAe;GAAU;GAChD,IAAI;IAAE,YAAY;IAAK,eAAe;GAAW;GACjD,IAAI;IAAE,YAAY;IAAK,eAAe;GAAU;GAChD,IAAI;IAAE,YAAY;IAAK,eAAe;GAAW;GACjD,IAAI,EAAE,YAAY,IAAI;GACtB,IAAI,EAAE,YAAY,IAAI;GACtB,UAAU;IAAE,YAAY;IAAK,eAAe;GAAS;EACvD;EACA,aAAa;GACX,UAAU;IACR,UAAU,SAAS;IACnB,SAAS,SAAS;IAClB,OAAO,SAAS;IAChB,UAAU,SAAS;IACnB,SAAS,SAAS;IAClB,gBAAgB,SAAS;IACzB,eAAe,SAAS;GAC1B;GACA,QAAQ;IACN,WAAW,OAAO;IAClB,SAAS,OAAO;IAChB,QAAQ,OAAO;IACf,OAAO,OAAO;GAChB;EACF;EACA,YAAY;GACV,gBAAgB,EACd,gBAAgB;IACd,wBAAwB,EAAE,YAAY,SAAS;IAC/C,2CAA2C,EACzC,wBAAwB;KACtB,mBAAmB;KACnB,oBAAoB;IACtB,EACF;GACF,EACF;GACA,eAAe,EAAE,cAAc,EAAE,eAAe,KAAK,EAAE;GACvD,WAAW;IACT,cAAc;KAAE,kBAAkB;KAAM,MAAM,UAAU,UAAU;IAAS;IAC3E,gBAAgB;KACd,MAAM;MACJ,cAAc,OAAO;MACrB,mBAAmB;OACjB,WAAW;OACX,SAAS,aAAa,EAAE;OACxB,eAAe;MACjB;KACF;KACA,UAAU,EAAE,aAAa,EAAE,iBAAiB;IAC9C;GACF;GACA,eAAe;IACb,cAAc,EAAE,MAAM,UAAU,UAAU,SAAS;IACnD,gBAAgB,EACd,MAAM;KACJ,cAAc,OAAO;KACrB,mBAAmB;MAAE,SAAS,aAAa,EAAE;MAAQ,eAAe;KAAE;IACxE,EACF;GACF;GACA,UAAU,EACR,gBAAgB;IACd,MAAM,EAAE,iBAAiB,OAAO;IAChC,UAAU,EAAE,aAAa,EAAE,OAAO;IAClC,SAAS,EAAE,cAAc,OAAO,GAAG;GACrC,EACF;GACA,SAAS;IACP,cAAc,EAAE,SAAS,WAAW;IACpC,gBAAgB,EACd,MAAM;KAAE,cAAc,OAAO;KAAI,iBAAiB,EAAE;KAAM,aAAa,EAAE;IAAO,EAClF;GACF;GACA,WAAW,EACT,gBAAgB,EACd,OAAO;IAAE,cAAc,OAAO;IAAI,QAAQ,aAAa,EAAE;IAAU,WAAW,OAAO;GAAG,EAC1F,EACF;GACA,SAAS,EACP,gBAAgB,EACd,OAAO;IAAE,cAAc,OAAO;IAAI,QAAQ,aAAa,EAAE;IAAU,WAAW,OAAO;GAAG,EAC1F,EACF;GACA,YAAY,EACV,gBAAgB,EAAE,OAAO;IAAE,cAAc,OAAO;IAAI,QAAQ,aAAa,EAAE;GAAS,EAAE,EACxF;GACA,SAAS;IACP,cAAc,EAAE,MAAM,QAAQ;IAC9B,gBAAgB,EAAE,MAAM;KAAE,cAAc,OAAO;KAAM,YAAY;IAAI,EAAE;GACzE;GACA,SAAS,EACP,gBAAgB,EAAE,WAAW;IAAE,iBAAiB,EAAE;IAAO,QAAQ;GAAE,EAAE,EACvE;GACA,QAAQ,EACN,gBAAgB,EACd,MAAM;IACJ,eAAe;IACf,YAAY;IACZ,WAAW,UAAU,KAAK;IAC1B,kBAAkB,EAAE,OAAO,EAAE,WAAW;GAC1C,EACF,EACF;GACA,kBAAkB,EAChB,gBAAgB,EACd,MAAM;IACJ,cAAc,OAAO;IACrB,iBAAiB,EAAE;IACnB,sCAAsC,EAAE,aAAa,EAAE,MAAM;IAC7D,4CAA4C,EAAE,aAAa,EAAE,iBAAiB;IAC9E,kDAAkD;KAChD,aAAa,EAAE;KACf,aAAa;IACf;IACA,iBAAiB,EAAE,WAAW,UAAU;GAC1C,EACF,EACF;GACA,cAAc,EAAE,cAAc,EAAE,MAAM,UAAU,UAAU,SAAS,EAAE;GACrE,UAAU,EAAE,gBAAgB,EAAE,MAAM,EAAE,cAAc,OAAO,GAAG,EAAE,EAAE;GAClE,YAAY,EACV,gBAAgB,EACd,SAAS;IACP,iBAAiB,EAAE;IACnB,OAAO,EAAE;IACT,UAAU;IACV,cAAc,OAAO;GACvB,EACF,EACF;GACA,WAAW,EACT,gBAAgB;IACd,YAAY,EACV,oCAAoC;KAAE,iBAAiB,EAAE;KAAO,SAAS;IAAE,EAC7E;IACA,OAAO;KAAE,iBAAiB,EAAE;KAAkB,SAAS;IAAE;GAC3D,EACF;GACA,SAAS,EAAE,cAAc,EAAE,OAAO,QAAQ,EAAE;GAC5C,UAAU,EAAE,cAAc,EAAE,MAAM,UAAU,UAAU,SAAS,EAAE;GACjE,YAAY,EAAE,cAAc,EAAE,SAAS,UAAU,UAAU,UAAU,EAAE;GACvE,YAAY,EAAE,gBAAgB,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,EAAE;EACpE;CACF;AACF;;;;;AAMA,SAAgB,mBACd,eAAiD,QACjD,GAAG,WACI;CACP,OAAO,YAAY,oBAAoB,YAAY,GAAG,GAAG,SAAS;AACpE"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/mui/index.ts"],"sourcesContent":["/**\n * The Burtson palette for MUI apps, so a screen built with MUI and one built\n * with Burtson UI components look like the same product.\n *\n *   import { ThemeProvider } from '@mui/material/styles';\n *   import { createBurtsonTheme } from '@burtson-labs/ui/mui';\n *   <ThemeProvider theme={createBurtsonTheme('dark')}>…</ThemeProvider>\n *   <ThemeProvider theme={createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' })}>\n *\n * MUI is an adapter here: every colour, radius, shadow and timing comes from\n * the Burtson tokens, and the component overrides give MUI controls the same\n * shape and states as the Burtson components (focus ring, radius per role,\n * no uppercase buttons, quiet borders instead of heavy shadows).\n */\nimport { createTheme, type Shadows, type Theme, type ThemeOptions } from '@mui/material/styles';\n\nimport {\n  accentTokens,\n  contrast,\n  dark,\n  duration,\n  easing,\n  fontMono,\n  fontSans,\n  light,\n  type Palette,\n  radius,\n  shadow,\n} from '../tokens';\n\nexport type BurtsonMode = 'light' | 'dark';\nexport type BurtsonDensity = 'comfortable' | 'compact';\n\nexport interface BurtsonThemeConfig {\n  mode?: BurtsonMode;\n  /** Any hex colour; primary, brand, soft and ring tones are derived with contrast kept. */\n  accent?: string;\n  /** `compact` for admin and data-dense screens: smaller controls, dense lists and tables. */\n  density?: BurtsonDensity;\n  /** Replace individual palette tokens (a product skin's tinted surfaces). */\n  palette?: Partial<Palette>;\n}\n\nconst px = (rem: string) => Math.round(parseFloat(rem) * 16);\n\n/** The full token palette for a config: base mode, accent-derived brand tones, then explicit overrides. */\nexport function burtsonPalette(config: BurtsonThemeConfig = {}): Palette {\n  const mode = config.mode ?? 'dark';\n  const base = mode === 'dark' ? dark : light;\n  return {\n    ...base,\n    ...(config.accent ? accentTokens(config.accent, mode) : {}),\n    ...config.palette,\n  };\n}\n\nfunction shadows(): Shadows {\n  // MUI indexes elevation 0–24; the Burtson scale has three real levels.\n  const levels = ['none', shadow.xs, shadow.xs, shadow.sm, shadow.sm, shadow.sm];\n  return Array.from({ length: 25 }, (_, i) => levels[i] ?? shadow.md) as Shadows;\n}\n\n/** Theme options only, for apps that deep-merge their own overrides first. */\nexport function burtsonThemeOptions(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n): ThemeOptions {\n  const config = typeof modeOrConfig === 'string' ? { mode: modeOrConfig } : modeOrConfig;\n  const mode = config.mode ?? 'dark';\n  const compact = config.density === 'compact';\n  const p = burtsonPalette(config);\n  const focusRing = `0 0 0 3px color-mix(in srgb, ${p.ring} 24%, transparent)`;\n  return {\n    palette: {\n      mode,\n      primary: { main: p.primary, contrastText: p['primary-foreground'] },\n      // Secondary fills use the brand text tone, which is light in dark mode;\n      // their text is whichever of white or the page background reads.\n      secondary: {\n        main: p.brand,\n        contrastText: contrast(p.brand, '#ffffff') >= 4.5 ? '#ffffff' : p.background,\n      },\n      info: { main: p.info, contrastText: p['info-foreground'] },\n      error: { main: p.destructive, contrastText: p['destructive-foreground'] },\n      warning: { main: p.warning, contrastText: p['warning-foreground'] },\n      success: { main: p.success, contrastText: p['success-foreground'] },\n      background: { default: p.background, paper: p.surface },\n      text: { primary: p.foreground, secondary: p['muted-foreground'] },\n      divider: p.border,\n      action: { hover: p.muted, selected: p['brand-soft'], focus: p['brand-soft'] },\n    },\n    shape: { borderRadius: px(radius.md) },\n    shadows: shadows(),\n    typography: {\n      fontFamily: fontSans,\n      fontSize: compact ? 13 : 14,\n      button: { textTransform: 'none', fontWeight: 600, letterSpacing: '-0.01em' },\n      h1: { fontWeight: 700, letterSpacing: '-0.03em' },\n      h2: { fontWeight: 700, letterSpacing: '-0.025em' },\n      h3: { fontWeight: 650, letterSpacing: '-0.02em' },\n      h4: { fontWeight: 650, letterSpacing: '-0.015em' },\n      h5: { fontWeight: 600 },\n      h6: { fontWeight: 600 },\n      overline: { fontWeight: 600, letterSpacing: '0.08em' },\n    },\n    transitions: {\n      duration: {\n        shortest: duration.fast,\n        shorter: duration.fast,\n        short: duration.standard,\n        standard: duration.standard,\n        complex: duration.emphasis,\n        enteringScreen: duration.emphasis,\n        leavingScreen: duration.exit,\n      },\n      easing: {\n        easeInOut: easing.standard,\n        easeOut: easing.emphasized,\n        easeIn: easing.exit,\n        sharp: easing.standard,\n      },\n    },\n    components: {\n      MuiCssBaseline: {\n        styleOverrides: {\n          'code, kbd, pre, samp': { fontFamily: fontMono },\n          '@media (prefers-reduced-motion: reduce)': {\n            '*, ::before, ::after': {\n              animationDuration: '1ms !important',\n              transitionDuration: '1ms !important',\n            },\n          },\n        },\n      },\n      MuiButtonBase: { defaultProps: { disableRipple: true } },\n      MuiButton: {\n        defaultProps: { disableElevation: true, size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': {\n              boxShadow: focusRing,\n              outline: `2px solid ${p.ring}`,\n              outlineOffset: 2,\n            },\n          },\n          outlined: { borderColor: p['border-strong'] },\n        },\n      },\n      MuiIconButton: {\n        defaultProps: { size: compact ? 'small' : 'medium' },\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            '&:focus-visible': { outline: `2px solid ${p.ring}`, outlineOffset: 2 },\n          },\n        },\n      },\n      MuiPaper: {\n        styleOverrides: {\n          root: { backgroundImage: 'none' },\n          outlined: { borderColor: p.border },\n          rounded: { borderRadius: radius.lg },\n        },\n      },\n      MuiCard: {\n        defaultProps: { variant: 'outlined' },\n        styleOverrides: {\n          root: { borderRadius: radius.lg, backgroundColor: p.card, borderColor: p.border },\n        },\n      },\n      MuiDialog: {\n        styleOverrides: {\n          paper: { borderRadius: radius.xl, border: `1px solid ${p.border}`, boxShadow: shadow.md },\n        },\n      },\n      MuiMenu: {\n        styleOverrides: {\n          paper: {\n            borderRadius: radius.lg,\n            border: `1px solid ${p['border-strong']}`,\n            boxShadow: shadow.md,\n          },\n          list: { paddingTop: 4, paddingBottom: 4 },\n        },\n      },\n      MuiPopover: {\n        styleOverrides: { paper: { borderRadius: radius.lg, border: `1px solid ${p.border}` } },\n      },\n      MuiChip: {\n        defaultProps: { size: 'small' },\n        styleOverrides: { root: { borderRadius: radius.full, fontWeight: 500 } },\n      },\n      MuiTabs: {\n        styleOverrides: { indicator: { backgroundColor: p.brand, height: 2 } },\n      },\n      MuiTab: {\n        styleOverrides: {\n          root: {\n            textTransform: 'none',\n            fontWeight: 500,\n            minHeight: compact ? 36 : 44,\n            '&.Mui-selected': { color: p.foreground },\n          },\n        },\n      },\n      MuiOutlinedInput: {\n        styleOverrides: {\n          root: {\n            borderRadius: radius.md,\n            backgroundColor: p.surface,\n            '& .MuiOutlinedInput-notchedOutline': { borderColor: p.input },\n            '&:hover .MuiOutlinedInput-notchedOutline': { borderColor: p['border-strong'] },\n            // Same focus as the Tailwind fields: a 2px ring-coloured edge inside\n            // the radius, no outer halo that a scroll container could clip.\n            '&.Mui-focused .MuiOutlinedInput-notchedOutline': {\n              borderColor: p.ring,\n              borderWidth: 2,\n            },\n            '&.Mui-error .MuiOutlinedInput-notchedOutline': { borderColor: p.destructive },\n          },\n        },\n      },\n      // Menu, Select and Autocomplete rows: inset 4px in a 12px surface, 8px\n      // radius, a quiet secondary fill for the active row (as MenuItem and\n      // SelectItem in the Tailwind kit).\n      MuiMenuItem: {\n        styleOverrides: {\n          root: {\n            margin: '0 4px',\n            borderRadius: radius.sm,\n            '&.Mui-focusVisible, &:hover': { backgroundColor: p.secondary },\n            '&.Mui-selected': { backgroundColor: 'transparent', fontWeight: 600 },\n            '&.Mui-selected.Mui-focusVisible, &.Mui-selected:hover': {\n              backgroundColor: p.secondary,\n            },\n          },\n        },\n      },\n      MuiAutocomplete: {\n        styleOverrides: {\n          paper: { borderRadius: radius.lg, border: `1px solid ${p['border-strong']}` },\n          listbox: {\n            padding: 4,\n            '& .MuiAutocomplete-option': {\n              borderRadius: radius.sm,\n              '&.Mui-focused, &.Mui-focusVisible': { backgroundColor: p.secondary },\n              '&[aria-selected=\"true\"]': { backgroundColor: 'transparent', fontWeight: 600 },\n              '&[aria-selected=\"true\"].Mui-focused': { backgroundColor: p.secondary },\n            },\n          },\n        },\n      },\n      MuiTextField: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiAlert: { styleOverrides: { root: { borderRadius: radius.md } } },\n      MuiTooltip: {\n        styleOverrides: {\n          tooltip: {\n            backgroundColor: p.code,\n            color: p['code-foreground'],\n            fontSize: 12,\n            borderRadius: radius.sm,\n          },\n        },\n      },\n      MuiSwitch: {\n        styleOverrides: {\n          switchBase: {\n            '&.Mui-checked + .MuiSwitch-track': { backgroundColor: p.brand, opacity: 1 },\n          },\n          track: { backgroundColor: p['border-strong'], opacity: 1 },\n        },\n      },\n      MuiList: { defaultProps: { dense: compact } },\n      MuiTable: { defaultProps: { size: compact ? 'small' : 'medium' } },\n      MuiToolbar: { defaultProps: { variant: compact ? 'dense' : 'regular' } },\n      MuiDivider: { styleOverrides: { root: { borderColor: p.border } } },\n    },\n  };\n}\n\n/**\n * `createBurtsonTheme('dark')` or `createBurtsonTheme({ mode, accent, density })`,\n * then any MUI overrides, merged in order.\n */\nexport function createBurtsonTheme(\n  modeOrConfig: BurtsonMode | BurtsonThemeConfig = 'dark',\n  ...overrides: ThemeOptions[]\n): Theme {\n  return createTheme(burtsonThemeOptions(modeOrConfig), ...overrides);\n}\n"],"mappings":"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"}