@burtson-labs/ui 0.13.1 → 0.14.1

package/LICENSES/Radix-MIT.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 WorkOS
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LICENSES/cmdk-MIT.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Paco Coursey
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/LICENSES/overrides/react-remove-scroll-bar.txt

@@ -0,0 +1,26 @@
+Source: https://github.com/theKashey/react-remove-scroll-bar/blob/master/LICENSE
+Git blob: 7c08c3990396ecefd90f99ff5d9a34f26f5b5616
+Retrieved to supply the license omitted from the 2.3.8 npm archive.
+
+MIT License
+
+Copyright (c) 2025 Anton Korzunov <thekashey@gmail.com>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/LICENSES/shadcn-MIT.txt

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 shadcn
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -9,7 +9,7 @@
 
 **React components for Burtson Labs products.**
 
-Used in Bandit Stealth, Sentinel, our cluster tools and client apps. Radix primitives handle focus and keyboard behaviour, Tailwind v4 handles styling, and the icons are [Burtson Icons](https://icons.burtson.ai). No runtime provider. Install the package, or copy a component's source and change it.
+Used in Bandit Stealth, Sentinel, our cluster tools and client apps. Locally maintained MIT-licensed Radix primitives handle focus and keyboard behaviour, Tailwind v4 handles styling, and the icons are [Burtson Icons](https://icons.burtson.ai). No runtime provider. Install the package, or copy a component's source and change it.
 
 [![Docs](https://img.shields.io/badge/docs-ui.burtson.ai-a60ee5)](https://ui.burtson.ai)
 [![npm](https://img.shields.io/npm/v/@burtson-labs/ui?logo=npm)](https://www.npmjs.com/package/@burtson-labs/ui)
@@ -58,9 +58,11 @@ npx shadcn@latest add https://ui.burtson.ai/r/button.json
 
 ## <picture><source media="(prefers-color-scheme: dark)" srcset="https://icons.burtson.ai/svg-white/panel-grid.svg"/><img src="https://icons.burtson.ai/svg-black/panel-grid.svg" align="center" alt=""/></picture> Components
 
-Accordion · Alert · Alert Dialog · App Shell · Attachment · Audio Player · Avatar · Badge · Breadcrumb · Button · Card · Chat History · Chat Layout · Checkbox · Checkbox Card · Collapsible · Combobox · Command · Composer · Connection Status · Context Menu · Conversation · Copy Button · Data Table · Dialog · Dropdown Menu · Editor Tabs · Empty State · Field · Icon Button · Input · Kbd · Label · Markdown · Menubar · Message · Message Actions · Mobile Nav · Navigation Menu · Onboarding Checklist · Page Header · Pagination · Popover · Progress · Radio Group · Reasoning · Resizable · Scroll Area · Secret Input · Select · Separator · Sheet · Skeleton · Slider · Source · Spinner · Stat Card · Status · Steps · Switch · Table · Tabs · Textarea · Toast · Toaster · Tool Call · Toolbar · Tooltip · Tour · Tree View · Voice Recorder
+Accordion · Alert · Alert Dialog · App Shell · Attachment · Audio Player · Avatar · Badge · Breadcrumb · Button · Card · Chat History · Chat Layout · Checkbox · Checkbox Card · Collapsible · Combobox · Command · Composer · Connection Status · Context Menu · Conversation · Copy Button · Data Table · Dialog · Dropdown Menu · Editor Tabs · Empty State · Error Summary · Field · Form Actions · Icon Button · Input · Kbd · Label · Markdown · Menubar · Message · Message Actions · Mobile Nav · Native Select · Navigation Menu · Number Input · Onboarding Checklist · Page Header · Pagination · Popover · Progress · Radio Group · Reasoning · Resizable · Scroll Area · Secret Input · Select · Separator · Sheet · Skeleton · Slider · Source · Spinner · Stat Card · Status · Steps · Switch · Table · Tabs · Textarea · Toast · Toaster · Tool Call · Toolbar · Tooltip · Tour · Tree View · Voice Recorder
 
-Live previews and code for each one are at [ui.burtson.ai](https://ui.burtson.ai/docs/components/button). Building a chat app? The [chat recipe](https://ui.burtson.ai/docs/recipes/chat) puts history, attachments, streaming, voice notes and full screen together, with the complete source.
+Live previews, when-to-use notes, accessibility notes and code for each one are at [ui.burtson.ai](https://ui.burtson.ai/docs/components/button). Building a chat app? The [chat recipe](https://ui.burtson.ai/docs/recipes/chat) puts history, attachments, streaming, voice notes and full screen together, with the complete source. Building a form? `Field` wires label, help and error onto any control, `FieldGrid` lines fields up and `FormActions` places the buttons, on phones too.
+
+Every control is at least 44px on touch screens, shows one focus style per kind of control (`focusRingClasses`, `fieldFocusClasses`) and meets 4.5:1 for text and 3:1 for boundaries in both palettes and any accent; a Playwright smoke in CI measures it.
 
 ## <picture><source media="(prefers-color-scheme: dark)" srcset="https://icons.burtson.ai/svg-white/palette.svg"/><img src="https://icons.burtson.ai/svg-black/palette.svg" align="center" alt=""/></picture> Theming
 
@@ -80,7 +82,7 @@ import { createBurtsonTheme } from '@burtson-labs/ui/mui';
 createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' });
 ```
 
-`@burtson-labs/ui/tokens` also exports `accentTokens(accent, mode)` for the CSS side, and the motion timing (`duration`, `easing`) and `elevation` levels that `theme.css` exposes as `--duration-*` and `--ease-*`.
+`@burtson-labs/ui/tokens` also exports `accentTokens(accent, mode)` for the CSS side, the motion timing (`duration`, `easing`) that `theme.css` exposes as `--duration-*` and `--ease-*` and every `transition-*` utility runs on, the `elevation` levels (`shadow.lg` for floating surfaces, `shadow.xl` for modal ones) and the `layer` z-index scale (raised 10, chrome 40, overlay 50, toast 100).
 
 ## <picture><source media="(prefers-color-scheme: dark)" srcset="https://icons.burtson.ai/svg-white/terminal.svg"/><img src="https://icons.burtson.ai/svg-black/terminal.svg" align="center" alt=""/></picture> Develop
 
@@ -88,20 +90,26 @@ createBurtsonTheme({ mode: 'dark', accent: '#2563eb', density: 'compact' });
 npm install
 npm run dev        # docs site with live components, http://localhost:5173
 npm run check      # typecheck, lint, format, tests, package build, site build
+npm run smoke      # Playwright: touch targets, focus, overflow, keyboard (needs npm run site)
 ```
 
-| Path              | What                                                                             |
-| ----------------- | -------------------------------------------------------------------------------- |
-| `src/components/` | One file per component; also the registry source                                 |
-| `src/tokens.ts`   | Design tokens (edit here, then `npm run theme`)                                  |
-| `src/mui/`        | MUI theme adapter                                                                |
-| `site/`           | Docs site for [ui.burtson.ai](https://ui.burtson.ai); demos in `site/src/demos/` |
-| `scripts/`        | Package build, theme and registry generators, link-preview card                  |
+| Path              | What                                                                                                                                                             |
+| ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `src/components/` | One file per component; also the registry source                                                                                                                 |
+| `src/tokens.ts`   | Design tokens (edit here, then `npm run theme`)                                                                                                                  |
+| `src/mui/`        | MUI theme adapter                                                                                                                                                |
+| `site/`           | Docs site for [ui.burtson.ai](https://ui.burtson.ai); demos in `site/src/demos/`, notes in `site/src/usage.ts`; `/matrix` renders every component in every state |
+| `e2e/`            | Browser smoke (Playwright, Chromium at 1440 and 390 touch)                                                                                                       |
+| `scripts/`        | Package build, theme and registry generators, link-preview card                                                                                                  |
 
-Adding a component: write `src/components/<name>.tsx`, export it from `src/index.ts`, add a demo in `site/src/demos/<name>.tsx` and an entry in `site/src/docs.ts`. The registry picks it up on the next build.
+Adding a component: write `src/components/<name>.tsx` (forwardRef, `data-slot` on every part, `focusRingClasses` or `fieldFocusClasses` for focus, 44px on touch), export it from `src/index.ts`, add a demo in `site/src/demos/<name>.tsx`, an entry in `site/src/docs.ts`, its notes in `site/src/usage.ts` and a cell in `site/src/matrix.tsx`. The registry picks it up on the next build.
 
 Linting and formatting follow [Burtson Labs frontend standards](https://github.com/Burtson-Labs/frontend-standards). Every push is audited by [Sentinel](https://github.com/Burtson-Labs/sentinel-audit).
 
+## Local primitives and API references
+
+The primitive implementations and cmdk live in this repository; no external Radix or cmdk package is required. See [VENDORING.md](VENDORING.md) for provenance, retained dependencies, and maintenance, and [API_REFERENCE.md](API_REFERENCE.md) for the generated component references. Original licenses are retained in [THIRD_PARTY_NOTICES.md](THIRD_PARTY_NOTICES.md) and `LICENSES/`.
+
 ## License
 
 [MIT](LICENSE) © Burtson Labs. Inspired by and partly adapted from [shadcn/ui](https://github.com/shadcn-ui/ui) (MIT); see [THIRD_PARTY_NOTICES.md](THIRD_PARTY_NOTICES.md).

package/THIRD_PARTY_NOTICES.md

@@ -1,6 +1,6 @@
 # Third-party notices
 
-Burtson UI is original work by Burtson Labs, released under the MIT license
+Burtson UI includes Burtson Labs components and vendored third-party primitives, released under the MIT license
 (see [LICENSE](LICENSE)). Its component API, the `data-slot` convention, the
 colour-token names and the registry format follow
 [shadcn/ui](https://github.com/shadcn-ui/ui), and several components adapt
@@ -30,5 +30,17 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 ```
 
-Behaviour and accessibility come from [Radix UI](https://www.radix-ui.com)
-primitives (MIT, © WorkOS), installed as the `radix-ui` dependency.
+## Locally maintained primitives
+
+Radix Primitives and cmdk are maintained as TypeScript source under
+`src/primitives/vendor`. They are no longer installed as runtime packages.
+Their original MIT licenses are included in `LICENSES/Radix-MIT.txt` and
+`LICENSES/cmdk-MIT.txt`. `vendor-manifest.json` records exact versions,
+source origins, hashes, and local modifications. See `VENDORING.md`.
+
+Floating UI, aria-hidden, react-remove-scroll and the other declared
+dependencies remain external dependencies with their own licenses.
+`LICENSES/DEPENDENCIES.txt` preserves the installed runtime dependency and
+peer dependency notices, including class-variance-authority (Apache-2.0).
+The documentation site's `/licenses.txt` includes these notices too.
+Registry source files carry the applicable full MIT notices.

package/dist/components/accordion.d.ts

@@ -1,7 +1,7 @@
-import { Accordion as AccordionPrimitive } from 'radix-ui';
 import * as React from 'react';
+import * as AccordionPrimitive from '../primitives/vendor/radix/react-accordion';
 declare function Accordion(props: React.ComponentProps<typeof AccordionPrimitive.Root>): React.JSX.Element;
-declare function AccordionItem({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Item>): React.JSX.Element;
-declare function AccordionTrigger({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Trigger>): React.JSX.Element;
-declare function AccordionContent({ className, children, ...props }: React.ComponentProps<typeof AccordionPrimitive.Content>): React.JSX.Element;
+declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AccordionContent: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/components/accordion.js

@@ -1,38 +1,42 @@
-import { cn } from "../lib/utils.js";
+"use client";
+import { cn, focusRingClasses } from "../lib/utils.js";
+import { Content, Header, Item, Root, Trigger } from "../primitives/vendor/radix/react-accordion/accordion.js";
+import * as React from "react";
 import ChevronDown from "@burtson-labs/icons/react/chevron-down";
-import { Accordion } from "radix-ui";
-import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/accordion.tsx
-function Accordion$1(props) {
-	return /* @__PURE__ */ jsx(Accordion.Root, {
+function Accordion(props) {
+	return /* @__PURE__ */ jsx(Root, {
 		"data-slot": "accordion",
 		...props
 	});
 }
-function AccordionItem({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Accordion.Item, {
+var AccordionItem = React.forwardRef(function AccordionItem({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Item, {
+		ref,
 		"data-slot": "accordion-item",
 		className: cn("border-b last:border-b-0", className),
 		...props
 	});
-}
-function AccordionTrigger({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx(Accordion.Header, {
+});
+var AccordionTrigger = React.forwardRef(function AccordionTrigger({ className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Header, {
 		className: "flex",
-		children: /* @__PURE__ */ jsxs(Accordion.Trigger, {
+		children: /* @__PURE__ */ jsxs(Trigger, {
+			ref,
 			"data-slot": "accordion-trigger",
-			className: cn("flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-semibold transition-all outline-none hover:text-brand focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180", className),
+			className: cn("flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-semibold transition-colors hover:text-brand disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180", focusRingClasses, "focus-visible:outline-offset-[-2px]", className),
 			...props,
 			children: [children, /* @__PURE__ */ jsx(ChevronDown, {
-				className: "pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-200",
+				className: "pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-(--duration-standard)",
 				"aria-hidden": true
 			})]
 		})
 	});
-}
-function AccordionContent({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx(Accordion.Content, {
+});
+var AccordionContent = React.forwardRef(function AccordionContent({ className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Content, {
+		ref,
 		"data-slot": "accordion-content",
 		className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
 		...props,
@@ -41,8 +45,8 @@ function AccordionContent({ className, children, ...props }) {
 			children
 		})
 	});
-}
+});
 //#endregion
-export { Accordion$1 as Accordion, AccordionContent, AccordionItem, AccordionTrigger };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
 
 //# sourceMappingURL=accordion.js.map

package/dist/components/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","names":["Accordion","AccordionPrimitive"],"sources":["../../src/components/accordion.tsx"],"sourcesContent":["import ChevronDown from '@burtson-labs/icons/react/chevron-down';\nimport { Accordion as AccordionPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nfunction Accordion(props: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />;\n}\n\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn('border-b last:border-b-0', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          'flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-semibold transition-all outline-none hover:text-brand focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDown\n          className=\"pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-200\"\n          aria-hidden\n        />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  );\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n      {...props}\n    >\n      <div className={cn('pt-0 pb-4', className)}>{children}</div>\n    </AccordionPrimitive.Content>\n  );\n}\n\nexport { Accordion, AccordionContent, AccordionItem, AccordionTrigger };\n"],"mappings":";;;;;;AAMA,SAASA,YAAU,OAA6D;CAC9E,OAAO,oBAACC,UAAmB,MAApB;EAAyB,aAAU;EAAY,GAAI;CAAQ,CAAA;AACpE;AAEA,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,UAAmB,MAApB;EACE,aAAU;EACV,WAAW,GAAG,4BAA4B,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,oBAACA,UAAmB,QAApB;EAA2B,WAAU;EACnC,UAAA,qBAACA,UAAmB,SAApB;GACE,aAAU;GACV,WAAW,GACT,uRACA,SACF;GACA,GAAI;GANN,UAAA,CAQG,UACD,oBAAC,aAAD;IACE,WAAU;IACV,eAAA;GACD,CAAA,CACyB;;CACH,CAAA;AAE/B;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,GAAG,SACuD;CAC1D,OACE,oBAACA,UAAmB,SAApB;EACE,aAAU;EACV,WAAU;EACV,GAAI;EAEJ,UAAA,oBAAC,OAAD;GAAK,WAAW,GAAG,aAAa,SAAS;GAAI;EAAc,CAAA;CACjC,CAAA;AAEhC"}
+{"version":3,"file":"accordion.js","names":["AccordionPrimitive.Root","AccordionPrimitive.Item","AccordionPrimitive.Header","AccordionPrimitive.Trigger","AccordionPrimitive.Content"],"sources":["../../src/components/accordion.tsx"],"sourcesContent":["import ChevronDown from '@burtson-labs/icons/react/chevron-down';\nimport * as React from 'react';\n\nimport { cn, focusRingClasses } from '../lib/utils';\nimport * as AccordionPrimitive from '../primitives/vendor/radix/react-accordion';\n\nfunction Accordion(props: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />;\n}\n\nconst AccordionItem = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<typeof AccordionPrimitive.Item>\n>(function AccordionItem({ className, ...props }, ref) {\n  return (\n    <AccordionPrimitive.Item\n      ref={ref}\n      data-slot=\"accordion-item\"\n      className={cn('border-b last:border-b-0', className)}\n      {...props}\n    />\n  );\n});\n\nconst AccordionTrigger = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof AccordionPrimitive.Trigger>\n>(function AccordionTrigger({ className, children, ...props }, ref) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        ref={ref}\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          'flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-semibold transition-colors hover:text-brand disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',\n          focusRingClasses,\n          'focus-visible:outline-offset-[-2px]',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDown\n          className=\"pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-(--duration-standard)\"\n          aria-hidden\n        />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  );\n});\n\nconst AccordionContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<typeof AccordionPrimitive.Content>\n>(function AccordionContent({ className, children, ...props }, ref) {\n  return (\n    <AccordionPrimitive.Content\n      ref={ref}\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n      {...props}\n    >\n      <div className={cn('pt-0 pb-4', className)}>{children}</div>\n    </AccordionPrimitive.Content>\n  );\n});\n\nexport { Accordion, AccordionContent, AccordionItem, AccordionTrigger };\n"],"mappings":";;;;;;;AAMA,SAAS,UAAU,OAA6D;CAC9E,OAAO,oBAACA,MAAD;EAAyB,aAAU;EAAY,GAAI;CAAQ,CAAA;AACpE;AAEA,IAAM,gBAAgB,MAAM,WAG1B,SAAS,cAAc,EAAE,WAAW,GAAG,SAAS,KAAK;CACrD,OACE,oBAACC,MAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,4BAA4B,SAAS;EACnD,GAAI;CACL,CAAA;AAEL,CAAC;AAED,IAAM,mBAAmB,MAAM,WAG7B,SAAS,iBAAiB,EAAE,WAAW,UAAU,GAAG,SAAS,KAAK;CAClE,OACE,oBAACC,QAAD;EAA2B,WAAU;EACnC,UAAA,qBAACC,SAAD;GACO;GACL,aAAU;GACV,WAAW,GACT,yNACA,kBACA,uCACA,SACF;GACA,GAAI;GATN,UAAA,CAWG,UACD,oBAAC,aAAD;IACE,WAAU;IACV,eAAA;GACD,CAAA,CACyB;;CACH,CAAA;AAE/B,CAAC;AAED,IAAM,mBAAmB,MAAM,WAG7B,SAAS,iBAAiB,EAAE,WAAW,UAAU,GAAG,SAAS,KAAK;CAClE,OACE,oBAACC,SAAD;EACO;EACL,aAAU;EACV,WAAU;EACV,GAAI;EAEJ,UAAA,oBAAC,OAAD;GAAK,WAAW,GAAG,aAAa,SAAS;GAAI;EAAc,CAAA;CACjC,CAAA;AAEhC,CAAC"}

package/dist/components/alert-dialog.d.ts

@@ -1,20 +1,22 @@
-import { AlertDialog as AlertDialogPrimitive } from 'radix-ui';
 import * as React from 'react';
+import * as AlertDialogPrimitive from '../primitives/vendor/radix/react-alert-dialog';
 /**
  * A confirmation that interrupts: "Delete 3 keys?", "Revoke access?". Unlike
  * Dialog it has no close button and ignores outside clicks, so the person
  * answers it; Escape still cancels. Focus starts on Cancel.
  */
 declare function AlertDialog(props: React.ComponentProps<typeof AlertDialogPrimitive.Root>): React.JSX.Element;
-declare function AlertDialogTrigger(props: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): React.JSX.Element;
-declare function AlertDialogContent({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content>): React.JSX.Element;
-declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
-declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
-declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): React.JSX.Element;
-declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): React.JSX.Element;
-/** The confirming button. `destructive` paints it as a danger action. */
-declare function AlertDialogAction({ className, destructive, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action> & {
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogFooter: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export interface AlertDialogActionProps extends React.ComponentProps<typeof AlertDialogPrimitive.Action> {
+    /** Paints the confirming button as a danger action. */
     destructive?: boolean;
-}): React.JSX.Element;
-declare function AlertDialogCancel({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>): React.JSX.Element;
+}
+/** The confirming button. */
+declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<AlertDialogActionProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, };

package/dist/components/alert-dialog.js

@@ -1,7 +1,9 @@
+"use client";
 import { cn } from "../lib/utils.js";
+import { Action, Cancel, Content, Description, Overlay, Portal, Root, Title, Trigger } from "../primitives/vendor/radix/react-alert-dialog/alert-dialog.js";
 import { buttonVariants } from "./button.js";
-import { AlertDialog } from "radix-ui";
-import "react";
+import { overlayClasses } from "./dialog.js";
+import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/alert-dialog.tsx
 /**
@@ -9,72 +11,80 @@ import { jsx, jsxs } from "react/jsx-runtime";
 * Dialog it has no close button and ignores outside clicks, so the person
 * answers it; Escape still cancels. Focus starts on Cancel.
 */
-function AlertDialog$1(props) {
-	return /* @__PURE__ */ jsx(AlertDialog.Root, {
+function AlertDialog(props) {
+	return /* @__PURE__ */ jsx(Root, {
 		"data-slot": "alert-dialog",
 		...props
 	});
 }
-function AlertDialogTrigger(props) {
-	return /* @__PURE__ */ jsx(AlertDialog.Trigger, {
+var AlertDialogTrigger = React.forwardRef(function AlertDialogTrigger(props, ref) {
+	return /* @__PURE__ */ jsx(Trigger, {
+		ref,
 		"data-slot": "alert-dialog-trigger",
 		...props
 	});
-}
-function AlertDialogContent({ className, ...props }) {
-	return /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Overlay, {
+});
+var AlertDialogContent = React.forwardRef(function AlertDialogContent({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Overlay, {
 		"data-slot": "alert-dialog-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"
-	}), /* @__PURE__ */ jsx(AlertDialog.Content, {
+		className: overlayClasses
+	}), /* @__PURE__ */ jsx(Content, {
+		ref,
 		"data-slot": "alert-dialog-content",
-		className: cn("fixed top-1/2 left-1/2 z-50 grid [--bl-scale:0.95] [--bl-ty:8px] w-[calc(100%-2rem)] max-w-md max-h-[calc(100dvh-2rem)] overflow-y-auto overscroll-contain -translate-x-1/2 -translate-y-1/2 gap-5 rounded-xl border border-border-strong bg-surface-raised p-5 text-foreground shadow-[0_24px_80px_rgb(0_0_0_/_0.28)] outline-none data-[state=closed]:animate-out data-[state=open]:animate-in sm:p-6", className),
+		className: cn("fixed top-1/2 left-1/2 z-50 grid [--bl-scale:0.95] [--bl-ty:8px] w-[calc(100%-2rem)] max-w-md max-h-[calc(100dvh-2rem)] overflow-y-auto overscroll-contain -translate-x-1/2 -translate-y-1/2 gap-5 rounded-xl border border-border-strong bg-surface-raised p-5 text-foreground shadow-xl outline-none data-[state=closed]:animate-out data-[state=open]:animate-in sm:p-6", className),
 		...props
 	})] });
-}
-function AlertDialogHeader({ className, ...props }) {
+});
+var AlertDialogHeader = React.forwardRef(function AlertDialogHeader({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
+		ref,
 		"data-slot": "alert-dialog-header",
 		className: cn("grid gap-1.5", className),
 		...props
 	});
-}
-function AlertDialogFooter({ className, ...props }) {
+});
+var AlertDialogFooter = React.forwardRef(function AlertDialogFooter({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
+		ref,
 		"data-slot": "alert-dialog-footer",
 		className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
 		...props
 	});
-}
-function AlertDialogTitle({ className, ...props }) {
-	return /* @__PURE__ */ jsx(AlertDialog.Title, {
+});
+var AlertDialogTitle = React.forwardRef(function AlertDialogTitle({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Title, {
+		ref,
 		"data-slot": "alert-dialog-title",
 		className: cn("text-base font-semibold tracking-[-0.02em]", className),
 		...props
 	});
-}
-function AlertDialogDescription({ className, ...props }) {
-	return /* @__PURE__ */ jsx(AlertDialog.Description, {
+});
+var AlertDialogDescription = React.forwardRef(function AlertDialogDescription({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Description, {
+		ref,
 		"data-slot": "alert-dialog-description",
 		className: cn("text-sm leading-5 text-muted-foreground", className),
 		...props
 	});
-}
-/** The confirming button. `destructive` paints it as a danger action. */
-function AlertDialogAction({ className, destructive = false, ...props }) {
-	return /* @__PURE__ */ jsx(AlertDialog.Action, {
+});
+/** The confirming button. */
+var AlertDialogAction = React.forwardRef(function AlertDialogAction({ className, destructive = false, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Action, {
+		ref,
 		"data-slot": "alert-dialog-action",
 		className: cn(buttonVariants({ variant: destructive ? "destructive" : "default" }), className),
 		...props
 	});
-}
-function AlertDialogCancel({ className, ...props }) {
-	return /* @__PURE__ */ jsx(AlertDialog.Cancel, {
+});
+var AlertDialogCancel = React.forwardRef(function AlertDialogCancel({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Cancel, {
+		ref,
 		"data-slot": "alert-dialog-cancel",
 		className: cn(buttonVariants({ variant: "outline" }), className),
 		...props
 	});
-}
+});
 //#endregion
-export { AlertDialog$1 as AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger };
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger };
 
 //# sourceMappingURL=alert-dialog.js.map

package/dist/components/alert-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":["AlertDialog","AlertDialogPrimitive"],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import { AlertDialog as AlertDialogPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nimport { buttonVariants } from './button';\n\n/**\n * A confirmation that interrupts: \"Delete 3 keys?\", \"Revoke access?\". Unlike\n * Dialog it has no close button and ignores outside clicks, so the person\n * answers it; Escape still cancels. Focus starts on Cancel.\n */\nfunction AlertDialog(props: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger(props: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n  return <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />;\n}\n\nfunction AlertDialogContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content>) {\n  return (\n    <AlertDialogPrimitive.Portal>\n      <AlertDialogPrimitive.Overlay\n        data-slot=\"alert-dialog-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      <AlertDialogPrimitive.Content\n        data-slot=\"alert-dialog-content\"\n        className={cn(\n          'fixed top-1/2 left-1/2 z-50 grid [--bl-scale:0.95] [--bl-ty:8px] w-[calc(100%-2rem)] max-w-md max-h-[calc(100dvh-2rem)] overflow-y-auto overscroll-contain -translate-x-1/2 -translate-y-1/2 gap-5 rounded-xl border border-border-strong bg-surface-raised p-5 text-foreground shadow-[0_24px_80px_rgb(0_0_0_/_0.28)] outline-none data-[state=closed]:animate-out data-[state=open]:animate-in sm:p-6',\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPrimitive.Portal>\n  );\n}\n\nfunction AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div data-slot=\"alert-dialog-header\" className={cn('grid gap-1.5', className)} {...props} />\n  );\n}\n\nfunction AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-dialog-footer\"\n      className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogTitle({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n  return (\n    <AlertDialogPrimitive.Title\n      data-slot=\"alert-dialog-title\"\n      className={cn('text-base font-semibold tracking-[-0.02em]', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogDescription({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n  return (\n    <AlertDialogPrimitive.Description\n      data-slot=\"alert-dialog-description\"\n      className={cn('text-sm leading-5 text-muted-foreground', className)}\n      {...props}\n    />\n  );\n}\n\n/** The confirming button. `destructive` paints it as a danger action. */\nfunction AlertDialogAction({\n  className,\n  destructive = false,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action> & { destructive?: boolean }) {\n  return (\n    <AlertDialogPrimitive.Action\n      data-slot=\"alert-dialog-action\"\n      className={cn(\n        buttonVariants({ variant: destructive ? 'destructive' : 'default' }),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDialogCancel({\n  className,\n  ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(buttonVariants({ variant: 'outline' }), className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;;;;;;AAYA,SAASA,cAAY,OAA+D;CAClF,OAAO,oBAACC,YAAqB,MAAtB;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE;AAEA,SAAS,mBAAmB,OAAkE;CAC5F,OAAO,oBAACA,YAAqB,SAAtB;EAA8B,aAAU;EAAuB,GAAI;CAAQ,CAAA;AACpF;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,qBAACA,YAAqB,QAAtB,EAAA,UAAA,CACE,oBAACA,YAAqB,SAAtB;EACE,aAAU;EACV,WAAU;CACX,CAAA,GACD,oBAACA,YAAqB,SAAtB;EACE,aAAU;EACV,WAAW,GACT,2YACA,SACF;EACA,GAAI;CACL,CAAA,CAC0B,EAAA,CAAA;AAEjC;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,oBAAC,OAAD;EAAK,aAAU;EAAsB,WAAW,GAAG,gBAAgB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAE/F;AAEA,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAsC;CAC/E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,0DAA0D,SAAS;EACjF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,YAAqB,OAAtB;EACE,aAAU;EACV,WAAW,GAAG,8CAA8C,SAAS;EACrE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAACA,YAAqB,aAAtB;EACE,aAAU;EACV,WAAW,GAAG,2CAA2C,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,kBAAkB,EACzB,WACA,cAAc,OACd,GAAG,SACoF;CACvF,OACE,oBAACA,YAAqB,QAAtB;EACE,aAAU;EACV,WAAW,GACT,eAAe,EAAE,SAAS,cAAc,gBAAgB,UAAU,CAAC,GACnE,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,kBAAkB,EACzB,WACA,GAAG,SACwD;CAC3D,OACE,oBAACA,YAAqB,QAAtB;EACE,aAAU;EACV,WAAW,GAAG,eAAe,EAAE,SAAS,UAAU,CAAC,GAAG,SAAS;EAC/D,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"alert-dialog.js","names":["AlertDialogPrimitive.Root","AlertDialogPrimitive.Trigger","AlertDialogPrimitive.Portal","AlertDialogPrimitive.Overlay","AlertDialogPrimitive.Content","AlertDialogPrimitive.Title","AlertDialogPrimitive.Description","AlertDialogPrimitive.Action","AlertDialogPrimitive.Cancel"],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '../lib/utils';\nimport * as AlertDialogPrimitive from '../primitives/vendor/radix/react-alert-dialog';\n\nimport { buttonVariants } from './button';\nimport { overlayClasses } from './dialog';\n\n/**\n * A confirmation that interrupts: \"Delete 3 keys?\", \"Revoke access?\". Unlike\n * Dialog it has no close button and ignores outside clicks, so the person\n * answers it; Escape still cancels. Focus starts on Cancel.\n */\nfunction AlertDialog(props: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n  return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nconst AlertDialogTrigger = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof AlertDialogPrimitive.Trigger>\n>(function AlertDialogTrigger(props, ref) {\n  return <AlertDialogPrimitive.Trigger ref={ref} data-slot=\"alert-dialog-trigger\" {...props} />;\n});\n\nconst AlertDialogContent = React.forwardRef<\n  HTMLDivElement,\n  React.ComponentProps<typeof AlertDialogPrimitive.Content>\n>(function AlertDialogContent({ className, ...props }, ref) {\n  return (\n    <AlertDialogPrimitive.Portal>\n      <AlertDialogPrimitive.Overlay data-slot=\"alert-dialog-overlay\" className={overlayClasses} />\n      <AlertDialogPrimitive.Content\n        ref={ref}\n        data-slot=\"alert-dialog-content\"\n        className={cn(\n          'fixed top-1/2 left-1/2 z-50 grid [--bl-scale:0.95] [--bl-ty:8px] w-[calc(100%-2rem)] max-w-md max-h-[calc(100dvh-2rem)] overflow-y-auto overscroll-contain -translate-x-1/2 -translate-y-1/2 gap-5 rounded-xl border border-border-strong bg-surface-raised p-5 text-foreground shadow-xl outline-none data-[state=closed]:animate-out data-[state=open]:animate-in sm:p-6',\n          className,\n        )}\n        {...props}\n      />\n    </AlertDialogPrimitive.Portal>\n  );\n});\n\nconst AlertDialogHeader = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  function AlertDialogHeader({ className, ...props }, ref) {\n    return (\n      <div\n        ref={ref}\n        data-slot=\"alert-dialog-header\"\n        className={cn('grid gap-1.5', className)}\n        {...props}\n      />\n    );\n  },\n);\n\nconst AlertDialogFooter = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  function AlertDialogFooter({ className, ...props }, ref) {\n    return (\n      <div\n        ref={ref}\n        data-slot=\"alert-dialog-footer\"\n        className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\n        {...props}\n      />\n    );\n  },\n);\n\nconst AlertDialogTitle = React.forwardRef<\n  HTMLHeadingElement,\n  React.ComponentProps<typeof AlertDialogPrimitive.Title>\n>(function AlertDialogTitle({ className, ...props }, ref) {\n  return (\n    <AlertDialogPrimitive.Title\n      ref={ref}\n      data-slot=\"alert-dialog-title\"\n      className={cn('text-base font-semibold tracking-[-0.02em]', className)}\n      {...props}\n    />\n  );\n});\n\nconst AlertDialogDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.ComponentProps<typeof AlertDialogPrimitive.Description>\n>(function AlertDialogDescription({ className, ...props }, ref) {\n  return (\n    <AlertDialogPrimitive.Description\n      ref={ref}\n      data-slot=\"alert-dialog-description\"\n      className={cn('text-sm leading-5 text-muted-foreground', className)}\n      {...props}\n    />\n  );\n});\n\nexport interface AlertDialogActionProps extends React.ComponentProps<\n  typeof AlertDialogPrimitive.Action\n> {\n  /** Paints the confirming button as a danger action. */\n  destructive?: boolean;\n}\n\n/** The confirming button. */\nconst AlertDialogAction = React.forwardRef<HTMLButtonElement, AlertDialogActionProps>(\n  function AlertDialogAction({ className, destructive = false, ...props }, ref) {\n    return (\n      <AlertDialogPrimitive.Action\n        ref={ref}\n        data-slot=\"alert-dialog-action\"\n        className={cn(\n          buttonVariants({ variant: destructive ? 'destructive' : 'default' }),\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\n\nconst AlertDialogCancel = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentProps<typeof AlertDialogPrimitive.Cancel>\n>(function AlertDialogCancel({ className, ...props }, ref) {\n  return (\n    <AlertDialogPrimitive.Cancel\n      ref={ref}\n      data-slot=\"alert-dialog-cancel\"\n      className={cn(buttonVariants({ variant: 'outline' }), className)}\n      {...props}\n    />\n  );\n});\n\nexport {\n  AlertDialog,\n  AlertDialogAction,\n  AlertDialogCancel,\n  AlertDialogContent,\n  AlertDialogDescription,\n  AlertDialogFooter,\n  AlertDialogHeader,\n  AlertDialogTitle,\n  AlertDialogTrigger,\n};\n"],"mappings":";;;;;;;;;;;;;AAaA,SAAS,YAAY,OAA+D;CAClF,OAAO,oBAACA,MAAD;EAA2B,aAAU;EAAe,GAAI;CAAQ,CAAA;AACzE;AAEA,IAAM,qBAAqB,MAAM,WAG/B,SAAS,mBAAmB,OAAO,KAAK;CACxC,OAAO,oBAACC,SAAD;EAAmC;EAAK,aAAU;EAAuB,GAAI;CAAQ,CAAA;AAC9F,CAAC;AAED,IAAM,qBAAqB,MAAM,WAG/B,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAAS,KAAK;CAC1D,OACE,qBAACC,QAAD,EAAA,UAAA,CACE,oBAACC,SAAD;EAA8B,aAAU;EAAuB,WAAW;CAAiB,CAAA,GAC3F,oBAACC,SAAD;EACO;EACL,aAAU;EACV,WAAW,GACT,8WACA,SACF;EACA,GAAI;CACL,CAAA,CAC0B,EAAA,CAAA;AAEjC,CAAC;AAED,IAAM,oBAAoB,MAAM,WAC9B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,gBAAgB,SAAS;EACvC,GAAI;CACL,CAAA;AAEL,CACF;AAEA,IAAM,oBAAoB,MAAM,WAC9B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACvD,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,0DAA0D,SAAS;EACjF,GAAI;CACL,CAAA;AAEL,CACF;AAEA,IAAM,mBAAmB,MAAM,WAG7B,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAS,KAAK;CACxD,OACE,oBAACC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,8CAA8C,SAAS;EACrE,GAAI;CACL,CAAA;AAEL,CAAC;AAED,IAAM,yBAAyB,MAAM,WAGnC,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAAS,KAAK;CAC9D,OACE,oBAACC,aAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,2CAA2C,SAAS;EAClE,GAAI;CACL,CAAA;AAEL,CAAC;;AAUD,IAAM,oBAAoB,MAAM,WAC9B,SAAS,kBAAkB,EAAE,WAAW,cAAc,OAAO,GAAG,SAAS,KAAK;CAC5E,OACE,oBAACC,QAAD;EACO;EACL,aAAU;EACV,WAAW,GACT,eAAe,EAAE,SAAS,cAAc,gBAAgB,UAAU,CAAC,GACnE,SACF;EACA,GAAI;CACL,CAAA;AAEL,CACF;AAEA,IAAM,oBAAoB,MAAM,WAG9B,SAAS,kBAAkB,EAAE,WAAW,GAAG,SAAS,KAAK;CACzD,OACE,oBAACC,QAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,eAAe,EAAE,SAAS,UAAU,CAAC,GAAG,SAAS;EAC/D,GAAI;CACL,CAAA;AAEL,CAAC"}

package/dist/components/alert.d.ts

@@ -3,7 +3,9 @@ import * as React from 'react';
 declare const alertVariants: (props?: ({
     variant?: "destructive" | "success" | "warning" | "info" | "brand" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Alert({ className, variant, ...props }: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>): React.JSX.Element;
-declare function AlertTitle({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
-declare function AlertDescription({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+export interface AlertProps extends React.ComponentProps<'div'>, VariantProps<typeof alertVariants> {
+}
+declare const Alert: React.ForwardRefExoticComponent<Omit<AlertProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertTitle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Alert, AlertDescription, AlertTitle, alertVariants };

package/dist/components/alert.js

@@ -1,5 +1,6 @@
+"use client";
 import { cn } from "../lib/utils.js";
-import "react";
+import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/components/alert.tsx
@@ -14,28 +15,32 @@ var alertVariants = cva("group/alert relative grid w-full grid-cols-1 has-[>svg]
 	} },
 	defaultVariants: { variant: "default" }
 });
-function Alert({ className, variant, ...props }) {
+var Alert = React.forwardRef(function Alert({ className, variant, ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
+		ref,
 		"data-slot": "alert",
+		"data-variant": variant ?? "default",
 		role: "alert",
 		className: cn(alertVariants({ variant }), className),
 		...props
 	});
-}
-function AlertTitle({ className, ...props }) {
+});
+var AlertTitle = React.forwardRef(function AlertTitle({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
+		ref,
 		"data-slot": "alert-title",
 		className: cn("font-semibold tracking-[-0.01em]", className),
 		...props
 	});
-}
-function AlertDescription({ className, ...props }) {
+});
+var AlertDescription = React.forwardRef(function AlertDescription({ className, ...props }, ref) {
 	return /* @__PURE__ */ jsx("div", {
+		ref,
 		"data-slot": "alert-description",
 		className: cn("col-start-1 group-has-[>svg]/alert:col-start-2 text-[13px] leading-5 text-muted-foreground", className),
 		...props
 	});
-}
+});
 //#endregion
 export { Alert, AlertDescription, AlertTitle, alertVariants };
 

package/dist/components/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","names":[],"sources":["../../src/components/alert.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nconst alertVariants = cva(\n  'group/alert relative grid w-full grid-cols-1 has-[>svg]:grid-cols-[auto_1fr] gap-x-3 gap-y-0.5 rounded-lg border px-4 py-3.5 text-sm shadow-xs [&>svg]:mt-0.5 [&>svg]:size-4',\n  {\n    variants: {\n      variant: {\n        default: 'border-border bg-surface text-foreground [&>svg]:text-muted-foreground',\n        brand: 'border-brand/25 bg-brand-soft/70 text-foreground [&>svg]:text-brand',\n        success: 'border-success/25 bg-success/10 text-foreground [&>svg]:text-success',\n        warning: 'border-warning/25 bg-warning/10 text-foreground [&>svg]:text-warning',\n        destructive:\n          'border-destructive/25 bg-destructive/10 text-foreground [&>svg]:text-destructive',\n        info: 'border-info/25 bg-info/10 text-foreground [&>svg]:text-info',\n      },\n    },\n    defaultVariants: { variant: 'default' },\n  },\n);\n\nfunction Alert({\n  className,\n  variant,\n  ...props\n}: React.ComponentProps<'div'> & VariantProps<typeof alertVariants>) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertTitle({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn('font-semibold tracking-[-0.01em]', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AlertDescription({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        'col-start-1 group-has-[>svg]/alert:col-start-2 text-[13px] leading-5 text-muted-foreground',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Alert, AlertDescription, AlertTitle, alertVariants };\n"],"mappings":";;;;;AAKA,IAAM,gBAAgB,IACpB,gLACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,OAAO;EACP,SAAS;EACT,SAAS;EACT,aACE;EACF,MAAM;CACR,EACF;CACA,iBAAiB,EAAE,SAAS,UAAU;AACxC,CACF;AAEA,SAAS,MAAM,EACb,WACA,SACA,GAAG,SACgE;CACnE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,MAAK;EACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;CACxE,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAsC;CAC9E,OACE,oBAAC,OAAD;EACE,aAAU;EACV,WAAW,GACT,8FACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"alert.js","names":[],"sources":["../../src/components/alert.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nconst alertVariants = cva(\n  'group/alert relative grid w-full grid-cols-1 has-[>svg]:grid-cols-[auto_1fr] gap-x-3 gap-y-0.5 rounded-lg border px-4 py-3.5 text-sm shadow-xs [&>svg]:mt-0.5 [&>svg]:size-4',\n  {\n    variants: {\n      variant: {\n        default: 'border-border bg-surface text-foreground [&>svg]:text-muted-foreground',\n        brand: 'border-brand/25 bg-brand-soft/70 text-foreground [&>svg]:text-brand',\n        success: 'border-success/25 bg-success/10 text-foreground [&>svg]:text-success',\n        warning: 'border-warning/25 bg-warning/10 text-foreground [&>svg]:text-warning',\n        destructive:\n          'border-destructive/25 bg-destructive/10 text-foreground [&>svg]:text-destructive',\n        info: 'border-info/25 bg-info/10 text-foreground [&>svg]:text-info',\n      },\n    },\n    defaultVariants: { variant: 'default' },\n  },\n);\n\nexport interface AlertProps\n  extends React.ComponentProps<'div'>, VariantProps<typeof alertVariants> {}\n\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(\n  { className, variant, ...props },\n  ref,\n) {\n  return (\n    <div\n      ref={ref}\n      data-slot=\"alert\"\n      data-variant={variant ?? 'default'}\n      role=\"alert\"\n      className={cn(alertVariants({ variant }), className)}\n      {...props}\n    />\n  );\n});\n\nconst AlertTitle = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  function AlertTitle({ className, ...props }, ref) {\n    return (\n      <div\n        ref={ref}\n        data-slot=\"alert-title\"\n        className={cn('font-semibold tracking-[-0.01em]', className)}\n        {...props}\n      />\n    );\n  },\n);\n\nconst AlertDescription = React.forwardRef<HTMLDivElement, React.ComponentProps<'div'>>(\n  function AlertDescription({ className, ...props }, ref) {\n    return (\n      <div\n        ref={ref}\n        data-slot=\"alert-description\"\n        className={cn(\n          'col-start-1 group-has-[>svg]/alert:col-start-2 text-[13px] leading-5 text-muted-foreground',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\n\nexport { Alert, AlertDescription, AlertTitle, alertVariants };\n"],"mappings":";;;;;;AAKA,IAAM,gBAAgB,IACpB,gLACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,OAAO;EACP,SAAS;EACT,SAAS;EACT,aACE;EACF,MAAM;CACR,EACF;CACA,iBAAiB,EAAE,SAAS,UAAU;AACxC,CACF;AAKA,IAAM,QAAQ,MAAM,WAAuC,SAAS,MAClE,EAAE,WAAW,SAAS,GAAG,SACzB,KACA;CACA,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,gBAAc,WAAW;EACzB,MAAK;EACL,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL,CAAC;AAED,IAAM,aAAa,MAAM,WACvB,SAAS,WAAW,EAAE,WAAW,GAAG,SAAS,KAAK;CAChD,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GAAG,oCAAoC,SAAS;EAC3D,GAAI;CACL,CAAA;AAEL,CACF;AAEA,IAAM,mBAAmB,MAAM,WAC7B,SAAS,iBAAiB,EAAE,WAAW,GAAG,SAAS,KAAK;CACtD,OACE,oBAAC,OAAD;EACO;EACL,aAAU;EACV,WAAW,GACT,8FACA,SACF;EACA,GAAI;CACL,CAAA;AAEL,CACF"}

package/dist/components/app-shell.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
-declare function AppShell({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
-declare function AppShellHeader({ className, ...props }: React.ComponentProps<'header'>): React.JSX.Element;
-declare function AppShellBody({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
-declare function AppShellSidebar({ className, ...props }: React.ComponentProps<'aside'>): React.JSX.Element;
-declare function AppShellMain({ className, ...props }: React.ComponentProps<'main'>): React.JSX.Element;
-declare function AppShellContent({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
+declare const AppShell: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** The top bar: sticky, over the page (z 40), clear of the notch. */
+declare const AppShellHeader: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const AppShellBody: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AppShellSidebar: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const AppShellMain: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const AppShellContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar };