@burtson-labs/ui 0.3.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -3
- package/dist/components/alert-dialog.d.ts +20 -0
- package/dist/components/alert-dialog.js +80 -0
- package/dist/components/alert-dialog.js.map +1 -0
- package/dist/components/button.d.ts +1 -1
- package/dist/components/combobox.d.ts +32 -0
- package/dist/components/combobox.js +79 -0
- package/dist/components/combobox.js.map +1 -0
- package/dist/components/navigation-menu.d.ts +20 -0
- package/dist/components/navigation-menu.js +83 -0
- package/dist/components/navigation-menu.js.map +1 -0
- package/dist/components/pagination.d.ts +18 -0
- package/dist/components/pagination.js +92 -0
- package/dist/components/pagination.js.map +1 -0
- package/dist/components/select.js +1 -1
- package/dist/components/steps.d.ts +14 -0
- package/dist/components/steps.js +45 -0
- package/dist/components/steps.js.map +1 -0
- package/dist/components/toast.d.ts +20 -0
- package/dist/components/toast.js +70 -0
- package/dist/components/toast.js.map +1 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +10 -4
- package/dist/styles.css +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -7,9 +7,9 @@
|
|
|
7
7
|
|
|
8
8
|
# Burtson UI
|
|
9
9
|
|
|
10
|
-
**
|
|
10
|
+
**React components for Burtson Labs products.**
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
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.
|
|
13
13
|
|
|
14
14
|
[](https://ui.burtson.ai)
|
|
15
15
|
[](https://www.npmjs.com/package/@burtson-labs/ui)
|
|
@@ -58,7 +58,7 @@ npx shadcn@latest add https://ui.burtson.ai/r/button.json
|
|
|
58
58
|
|
|
59
59
|
## <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
|
|
60
60
|
|
|
61
|
-
Accordion · Alert · App Shell · Avatar · Badge · Breadcrumb · Button · Card · Checkbox · Collapsible · Command · Dialog · Dropdown Menu · Empty State · Field · Icon Button · Input · Kbd · Label · Page Header · Popover · Progress · Radio Group · Scroll Area · Select · Separator · Sheet · Skeleton · Spinner · Stat Card · Status · Switch · Table · Tabs · Textarea · Toolbar · Tooltip
|
|
61
|
+
Accordion · Alert · Alert Dialog · App Shell · Avatar · Badge · Breadcrumb · Button · Card · Checkbox · Collapsible · Combobox · Command · Dialog · Dropdown Menu · Empty State · Field · Icon Button · Input · Kbd · Label · Navigation Menu · Page Header · Pagination · Popover · Progress · Radio Group · Scroll Area · Select · Separator · Sheet · Skeleton · Spinner · Stat Card · Status · Steps · Switch · Table · Tabs · Textarea · Toast · Toolbar · Tooltip
|
|
62
62
|
|
|
63
63
|
Live previews and code for each one are at [ui.burtson.ai](https://ui.burtson.ai/docs/components/button).
|
|
64
64
|
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { AlertDialog as AlertDialogPrimitive } from 'radix-ui';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
/**
|
|
4
|
+
* A confirmation that interrupts: "Delete 3 keys?", "Revoke access?". Unlike
|
|
5
|
+
* Dialog it has no close button and ignores outside clicks, so the person
|
|
6
|
+
* answers it; Escape still cancels. Focus starts on Cancel.
|
|
7
|
+
*/
|
|
8
|
+
declare function AlertDialog(props: React.ComponentProps<typeof AlertDialogPrimitive.Root>): React.JSX.Element;
|
|
9
|
+
declare function AlertDialogTrigger(props: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): React.JSX.Element;
|
|
10
|
+
declare function AlertDialogContent({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content>): React.JSX.Element;
|
|
11
|
+
declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
12
|
+
declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
|
|
13
|
+
declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): React.JSX.Element;
|
|
14
|
+
declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): React.JSX.Element;
|
|
15
|
+
/** The confirming button. `destructive` paints it as a danger action. */
|
|
16
|
+
declare function AlertDialogAction({ className, destructive, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action> & {
|
|
17
|
+
destructive?: boolean;
|
|
18
|
+
}): React.JSX.Element;
|
|
19
|
+
declare function AlertDialogCancel({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>): React.JSX.Element;
|
|
20
|
+
export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, };
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { buttonVariants } from "./button.js";
|
|
3
|
+
import { AlertDialog } from "radix-ui";
|
|
4
|
+
import "react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
//#region src/components/alert-dialog.tsx
|
|
7
|
+
/**
|
|
8
|
+
* A confirmation that interrupts: "Delete 3 keys?", "Revoke access?". Unlike
|
|
9
|
+
* Dialog it has no close button and ignores outside clicks, so the person
|
|
10
|
+
* answers it; Escape still cancels. Focus starts on Cancel.
|
|
11
|
+
*/
|
|
12
|
+
function AlertDialog$1(props) {
|
|
13
|
+
return /* @__PURE__ */ jsx(AlertDialog.Root, {
|
|
14
|
+
"data-slot": "alert-dialog",
|
|
15
|
+
...props
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
function AlertDialogTrigger(props) {
|
|
19
|
+
return /* @__PURE__ */ jsx(AlertDialog.Trigger, {
|
|
20
|
+
"data-slot": "alert-dialog-trigger",
|
|
21
|
+
...props
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
function AlertDialogContent({ className, ...props }) {
|
|
25
|
+
return /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Overlay, {
|
|
26
|
+
"data-slot": "alert-dialog-overlay",
|
|
27
|
+
className: "fixed inset-0 z-50 bg-black/55 backdrop-blur-[3px] data-[state=closed]:animate-out data-[state=open]:animate-in"
|
|
28
|
+
}), /* @__PURE__ */ jsx(AlertDialog.Content, {
|
|
29
|
+
"data-slot": "alert-dialog-content",
|
|
30
|
+
className: cn("fixed top-1/2 left-1/2 z-50 grid w-[calc(100%-2rem)] max-w-md -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),
|
|
31
|
+
...props
|
|
32
|
+
})] });
|
|
33
|
+
}
|
|
34
|
+
function AlertDialogHeader({ className, ...props }) {
|
|
35
|
+
return /* @__PURE__ */ jsx("div", {
|
|
36
|
+
"data-slot": "alert-dialog-header",
|
|
37
|
+
className: cn("grid gap-1.5", className),
|
|
38
|
+
...props
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
function AlertDialogFooter({ className, ...props }) {
|
|
42
|
+
return /* @__PURE__ */ jsx("div", {
|
|
43
|
+
"data-slot": "alert-dialog-footer",
|
|
44
|
+
className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
|
|
45
|
+
...props
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
function AlertDialogTitle({ className, ...props }) {
|
|
49
|
+
return /* @__PURE__ */ jsx(AlertDialog.Title, {
|
|
50
|
+
"data-slot": "alert-dialog-title",
|
|
51
|
+
className: cn("text-base font-semibold tracking-[-0.02em]", className),
|
|
52
|
+
...props
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
function AlertDialogDescription({ className, ...props }) {
|
|
56
|
+
return /* @__PURE__ */ jsx(AlertDialog.Description, {
|
|
57
|
+
"data-slot": "alert-dialog-description",
|
|
58
|
+
className: cn("text-sm leading-5 text-muted-foreground", className),
|
|
59
|
+
...props
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
/** The confirming button. `destructive` paints it as a danger action. */
|
|
63
|
+
function AlertDialogAction({ className, destructive = false, ...props }) {
|
|
64
|
+
return /* @__PURE__ */ jsx(AlertDialog.Action, {
|
|
65
|
+
"data-slot": "alert-dialog-action",
|
|
66
|
+
className: cn(buttonVariants({ variant: destructive ? "destructive" : "default" }), className),
|
|
67
|
+
...props
|
|
68
|
+
});
|
|
69
|
+
}
|
|
70
|
+
function AlertDialogCancel({ className, ...props }) {
|
|
71
|
+
return /* @__PURE__ */ jsx(AlertDialog.Cancel, {
|
|
72
|
+
"data-slot": "alert-dialog-cancel",
|
|
73
|
+
className: cn(buttonVariants({ variant: "outline" }), className),
|
|
74
|
+
...props
|
|
75
|
+
});
|
|
76
|
+
}
|
|
77
|
+
//#endregion
|
|
78
|
+
export { AlertDialog$1 as AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger };
|
|
79
|
+
|
|
80
|
+
//# sourceMappingURL=alert-dialog.js.map
|
|
@@ -0,0 +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-out data-[state=open]:animate-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 w-[calc(100%-2rem)] max-w-md -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,8SACA,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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { type VariantProps } from 'class-variance-authority';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
declare const buttonVariants: (props?: ({
|
|
4
|
-
variant?: "secondary" | "destructive" | "brand" | "link" | "default" | "
|
|
4
|
+
variant?: "secondary" | "destructive" | "brand" | "link" | "default" | "soft" | "outline" | "ghost" | null | undefined;
|
|
5
5
|
size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
|
|
6
6
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
7
|
export interface ButtonProps extends React.ComponentProps<'button'>, VariantProps<typeof buttonVariants> {
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface ComboboxOption {
|
|
3
|
+
value: string;
|
|
4
|
+
label: string;
|
|
5
|
+
/** Second line, e.g. an email under a name. Also searched. */
|
|
6
|
+
description?: string;
|
|
7
|
+
disabled?: boolean;
|
|
8
|
+
}
|
|
9
|
+
export interface ComboboxProps {
|
|
10
|
+
options: ComboboxOption[];
|
|
11
|
+
value: string | null;
|
|
12
|
+
onValueChange: (value: string | null) => void;
|
|
13
|
+
placeholder?: string;
|
|
14
|
+
searchPlaceholder?: string;
|
|
15
|
+
emptyText?: string;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
/** Show a spinner in the list, e.g. while `onSearchChange` fetches. */
|
|
18
|
+
loading?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Called as the person types. Pass it to search on a server; the options
|
|
21
|
+
* you pass back are shown as-is (no client filtering).
|
|
22
|
+
*/
|
|
23
|
+
onSearchChange?: (search: string) => void;
|
|
24
|
+
/** Let the person clear the selection by picking it again. */
|
|
25
|
+
clearable?: boolean;
|
|
26
|
+
id?: string;
|
|
27
|
+
className?: string;
|
|
28
|
+
'aria-invalid'?: boolean;
|
|
29
|
+
}
|
|
30
|
+
/** Pick one value from a long or remote list by typing. */
|
|
31
|
+
declare function Combobox({ options, value, onValueChange, placeholder, searchPlaceholder, emptyText, disabled, loading, onSearchChange, clearable, id, className, ...aria }: ComboboxProps): React.JSX.Element;
|
|
32
|
+
export { Combobox };
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "./command.js";
|
|
3
|
+
import { fieldClasses } from "./input.js";
|
|
4
|
+
import { Popover, PopoverContent, PopoverTrigger } from "./popover.js";
|
|
5
|
+
import { Spinner } from "./spinner.js";
|
|
6
|
+
import * as React from "react";
|
|
7
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
import Check from "@burtson-labs/icons/react/check";
|
|
9
|
+
import ChevronsUpDown from "@burtson-labs/icons/react/chevrons-up-down";
|
|
10
|
+
//#region src/components/combobox.tsx
|
|
11
|
+
/** Pick one value from a long or remote list by typing. */
|
|
12
|
+
function Combobox({ options, value, onValueChange, placeholder = "Select…", searchPlaceholder = "Search…", emptyText = "No matches.", disabled, loading, onSearchChange, clearable = true, id, className, ...aria }) {
|
|
13
|
+
const [open, setOpen] = React.useState(false);
|
|
14
|
+
const listId = React.useId();
|
|
15
|
+
const selected = options.find((o) => o.value === value);
|
|
16
|
+
return /* @__PURE__ */ jsxs(Popover, {
|
|
17
|
+
open,
|
|
18
|
+
onOpenChange: setOpen,
|
|
19
|
+
children: [/* @__PURE__ */ jsx(PopoverTrigger, {
|
|
20
|
+
asChild: true,
|
|
21
|
+
children: /* @__PURE__ */ jsxs("button", {
|
|
22
|
+
type: "button",
|
|
23
|
+
id,
|
|
24
|
+
role: "combobox",
|
|
25
|
+
"aria-expanded": open,
|
|
26
|
+
"aria-controls": listId,
|
|
27
|
+
"aria-invalid": aria["aria-invalid"],
|
|
28
|
+
disabled,
|
|
29
|
+
"data-slot": "combobox-trigger",
|
|
30
|
+
className: cn(fieldClasses, "flex h-9 items-center justify-between gap-2 text-left", !selected && "text-muted-foreground", className),
|
|
31
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
32
|
+
className: "truncate",
|
|
33
|
+
children: selected?.label ?? value ?? placeholder
|
|
34
|
+
}), /* @__PURE__ */ jsx(ChevronsUpDown, {
|
|
35
|
+
className: "size-4 shrink-0 opacity-60",
|
|
36
|
+
"aria-hidden": true
|
|
37
|
+
})]
|
|
38
|
+
})
|
|
39
|
+
}), /* @__PURE__ */ jsx(PopoverContent, {
|
|
40
|
+
id: listId,
|
|
41
|
+
className: "w-(--radix-popover-trigger-width) min-w-64 p-0",
|
|
42
|
+
align: "start",
|
|
43
|
+
children: /* @__PURE__ */ jsxs(Command, {
|
|
44
|
+
shouldFilter: !onSearchChange,
|
|
45
|
+
children: [/* @__PURE__ */ jsx(CommandInput, {
|
|
46
|
+
placeholder: searchPlaceholder,
|
|
47
|
+
onValueChange: onSearchChange
|
|
48
|
+
}), /* @__PURE__ */ jsxs(CommandList, { children: [loading ? /* @__PURE__ */ jsxs("div", {
|
|
49
|
+
className: "flex items-center justify-center gap-2 py-6 text-sm text-muted-foreground",
|
|
50
|
+
children: [/* @__PURE__ */ jsx(Spinner, {}), " Searching…"]
|
|
51
|
+
}) : /* @__PURE__ */ jsx(CommandEmpty, { children: emptyText }), !loading && /* @__PURE__ */ jsx(CommandGroup, { children: options.map((o) => /* @__PURE__ */ jsxs(CommandItem, {
|
|
52
|
+
value: `${o.label} ${o.description ?? ""} ${o.value}`,
|
|
53
|
+
disabled: o.disabled,
|
|
54
|
+
onSelect: () => {
|
|
55
|
+
onValueChange(clearable && o.value === value ? null : o.value);
|
|
56
|
+
setOpen(false);
|
|
57
|
+
},
|
|
58
|
+
children: [/* @__PURE__ */ jsxs("span", {
|
|
59
|
+
className: "grid min-w-0 flex-1",
|
|
60
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
61
|
+
className: "truncate",
|
|
62
|
+
children: o.label
|
|
63
|
+
}), o.description && /* @__PURE__ */ jsx("span", {
|
|
64
|
+
className: "truncate text-xs text-muted-foreground",
|
|
65
|
+
children: o.description
|
|
66
|
+
})]
|
|
67
|
+
}), /* @__PURE__ */ jsx(Check, {
|
|
68
|
+
"aria-hidden": true,
|
|
69
|
+
className: cn("ml-auto size-4 text-brand", o.value === value ? "opacity-100" : "opacity-0")
|
|
70
|
+
})]
|
|
71
|
+
}, o.value)) })] })]
|
|
72
|
+
})
|
|
73
|
+
})]
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
//#endregion
|
|
77
|
+
export { Combobox };
|
|
78
|
+
|
|
79
|
+
//# sourceMappingURL=combobox.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"combobox.js","names":[],"sources":["../../src/components/combobox.tsx"],"sourcesContent":["import Check from '@burtson-labs/icons/react/check';\nimport ChevronsUpDown from '@burtson-labs/icons/react/chevrons-up-down';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n} from './command';\nimport { fieldClasses } from './input';\nimport { Popover, PopoverContent, PopoverTrigger } from './popover';\nimport { Spinner } from './spinner';\n\nexport interface ComboboxOption {\n value: string;\n label: string;\n /** Second line, e.g. an email under a name. Also searched. */\n description?: string;\n disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n options: ComboboxOption[];\n value: string | null;\n onValueChange: (value: string | null) => void;\n placeholder?: string;\n searchPlaceholder?: string;\n emptyText?: string;\n disabled?: boolean;\n /** Show a spinner in the list, e.g. while `onSearchChange` fetches. */\n loading?: boolean;\n /**\n * Called as the person types. Pass it to search on a server; the options\n * you pass back are shown as-is (no client filtering).\n */\n onSearchChange?: (search: string) => void;\n /** Let the person clear the selection by picking it again. */\n clearable?: boolean;\n id?: string;\n className?: string;\n 'aria-invalid'?: boolean;\n}\n\n/** Pick one value from a long or remote list by typing. */\nfunction Combobox({\n options,\n value,\n onValueChange,\n placeholder = 'Select…',\n searchPlaceholder = 'Search…',\n emptyText = 'No matches.',\n disabled,\n loading,\n onSearchChange,\n clearable = true,\n id,\n className,\n ...aria\n}: ComboboxProps) {\n const [open, setOpen] = React.useState(false);\n const listId = React.useId();\n const selected = options.find((o) => o.value === value);\n return (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild>\n <button\n type=\"button\"\n id={id}\n role=\"combobox\"\n aria-expanded={open}\n aria-controls={listId}\n aria-invalid={aria['aria-invalid']}\n disabled={disabled}\n data-slot=\"combobox-trigger\"\n className={cn(\n fieldClasses,\n 'flex h-9 items-center justify-between gap-2 text-left',\n !selected && 'text-muted-foreground',\n className,\n )}\n >\n <span className=\"truncate\">{selected?.label ?? value ?? placeholder}</span>\n <ChevronsUpDown className=\"size-4 shrink-0 opacity-60\" aria-hidden />\n </button>\n </PopoverTrigger>\n <PopoverContent\n id={listId}\n className=\"w-(--radix-popover-trigger-width) min-w-64 p-0\"\n align=\"start\"\n >\n <Command shouldFilter={!onSearchChange}>\n <CommandInput placeholder={searchPlaceholder} onValueChange={onSearchChange} />\n <CommandList>\n {loading ? (\n <div className=\"flex items-center justify-center gap-2 py-6 text-sm text-muted-foreground\">\n <Spinner /> Searching…\n </div>\n ) : (\n <CommandEmpty>{emptyText}</CommandEmpty>\n )}\n {!loading && (\n <CommandGroup>\n {options.map((o) => (\n <CommandItem\n key={o.value}\n value={`${o.label} ${o.description ?? ''} ${o.value}`}\n disabled={o.disabled}\n onSelect={() => {\n onValueChange(clearable && o.value === value ? null : o.value);\n setOpen(false);\n }}\n >\n <span className=\"grid min-w-0 flex-1\">\n <span className=\"truncate\">{o.label}</span>\n {o.description && (\n <span className=\"truncate text-xs text-muted-foreground\">\n {o.description}\n </span>\n )}\n </span>\n <Check\n aria-hidden\n className={cn(\n 'ml-auto size-4 text-brand',\n o.value === value ? 'opacity-100' : 'opacity-0',\n )}\n />\n </CommandItem>\n ))}\n </CommandGroup>\n )}\n </CommandList>\n </Command>\n </PopoverContent>\n </Popover>\n );\n}\n\nexport { Combobox };\n"],"mappings":";;;;;;;;;;;AAiDA,SAAS,SAAS,EAChB,SACA,OACA,eACA,cAAc,WACd,oBAAoB,WACpB,YAAY,eACZ,UACA,SACA,gBACA,YAAY,MACZ,IACA,WACA,GAAG,QACa;CAChB,MAAM,CAAC,MAAM,WAAW,MAAM,SAAS,KAAK;CAC5C,MAAM,SAAS,MAAM,MAAM;CAC3B,MAAM,WAAW,QAAQ,MAAM,MAAM,EAAE,UAAU,KAAK;CACtD,OACE,qBAAC,SAAD;EAAe;EAAM,cAAc;EAAnC,UAAA,CACE,oBAAC,gBAAD;GAAgB,SAAA;GACd,UAAA,qBAAC,UAAD;IACE,MAAK;IACD;IACJ,MAAK;IACL,iBAAe;IACf,iBAAe;IACf,gBAAc,KAAK;IACT;IACV,aAAU;IACV,WAAW,GACT,cACA,yDACA,CAAC,YAAY,yBACb,SACF;IAdF,UAAA,CAgBE,oBAAC,QAAD;KAAM,WAAU;KAAY,UAAA,UAAU,SAAS,SAAS;IAAkB,CAAA,GAC1E,oBAAC,gBAAD;KAAgB,WAAU;KAA6B,eAAA;IAAa,CAAA,CAC9D;;EACM,CAAA,GAChB,oBAAC,gBAAD;GACE,IAAI;GACJ,WAAU;GACV,OAAM;GAEN,UAAA,qBAAC,SAAD;IAAS,cAAc,CAAC;IAAxB,UAAA,CACE,oBAAC,cAAD;KAAc,aAAa;KAAmB,eAAe;IAAiB,CAAA,GAC9E,qBAAC,aAAD,EAAA,UAAA,CACG,UACC,qBAAC,OAAD;KAAK,WAAU;KAAf,UAAA,CACE,oBAAC,SAAD,CAAU,CAAA,GAAC,aACR;IAEL,CAAA,IAAA,oBAAC,cAAD,EAAA,UAAe,UAAwB,CAAA,GAExC,CAAC,WACA,oBAAC,cAAD,EAAA,UACG,QAAQ,KAAK,MACZ,qBAAC,aAAD;KAEE,OAAO,GAAG,EAAE,MAAM,GAAG,EAAE,eAAe,GAAG,GAAG,EAAE;KAC9C,UAAU,EAAE;KACZ,gBAAgB;MACd,cAAc,aAAa,EAAE,UAAU,QAAQ,OAAO,EAAE,KAAK;MAC7D,QAAQ,KAAK;KACf;KAPF,UAAA,CASE,qBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA,CACE,oBAAC,QAAD;OAAM,WAAU;OAAY,UAAA,EAAE;MAAY,CAAA,GACzC,EAAE,eACD,oBAAC,QAAD;OAAM,WAAU;OACb,UAAA,EAAE;MACC,CAAA,CAEJ;KACN,CAAA,GAAA,oBAAC,OAAD;MACE,eAAA;MACA,WAAW,GACT,6BACA,EAAE,UAAU,QAAQ,gBAAgB,WACtC;KACD,CAAA,CACU;IAvBN,GAAA,EAAE,KAuBI,CACd,EACW,CAAA,CAEL,EAAA,CAAA,CACN;;EACK,CAAA,CACT;;AAEb"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { NavigationMenu as NavigationMenuPrimitive } from 'radix-ui';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
/**
|
|
4
|
+
* Site navigation with dropdown panels (a products menu, docs sections).
|
|
5
|
+
* Keyboard and screen-reader behaviour come from Radix; the panel renders in
|
|
6
|
+
* a shared viewport under the bar, sized to its content.
|
|
7
|
+
*/
|
|
8
|
+
declare function NavigationMenu({ className, children, viewport, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {
|
|
9
|
+
viewport?: boolean;
|
|
10
|
+
}): React.JSX.Element;
|
|
11
|
+
declare function NavigationMenuList({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.List>): React.JSX.Element;
|
|
12
|
+
declare function NavigationMenuItem({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Item>): React.JSX.Element;
|
|
13
|
+
/** The look of a top-level entry, for links that sit beside triggers. */
|
|
14
|
+
declare const navigationMenuTriggerStyle = "group inline-flex h-9 w-max items-center justify-center gap-1 rounded-md px-3 text-sm font-semibold text-foreground/80 outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 data-[active]:text-foreground data-[state=open]:bg-muted data-[state=open]:text-foreground";
|
|
15
|
+
declare function NavigationMenuTrigger({ className, children, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>): React.JSX.Element;
|
|
16
|
+
declare function NavigationMenuContent({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Content>): React.JSX.Element;
|
|
17
|
+
declare function NavigationMenuViewport({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>): React.JSX.Element;
|
|
18
|
+
declare function NavigationMenuLink({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Link>): React.JSX.Element;
|
|
19
|
+
declare function NavigationMenuIndicator({ className, ...props }: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>): React.JSX.Element;
|
|
20
|
+
export { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle, NavigationMenuViewport, };
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import ChevronDown from "@burtson-labs/icons/react/chevron-down";
|
|
3
|
+
import { NavigationMenu } from "radix-ui";
|
|
4
|
+
import "react";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
//#region src/components/navigation-menu.tsx
|
|
7
|
+
/**
|
|
8
|
+
* Site navigation with dropdown panels (a products menu, docs sections).
|
|
9
|
+
* Keyboard and screen-reader behaviour come from Radix; the panel renders in
|
|
10
|
+
* a shared viewport under the bar, sized to its content.
|
|
11
|
+
*/
|
|
12
|
+
function NavigationMenu$1({ className, children, viewport = true, ...props }) {
|
|
13
|
+
return /* @__PURE__ */ jsxs(NavigationMenu.Root, {
|
|
14
|
+
"data-slot": "navigation-menu",
|
|
15
|
+
"data-viewport": viewport,
|
|
16
|
+
className: cn("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", className),
|
|
17
|
+
...props,
|
|
18
|
+
children: [children, viewport && /* @__PURE__ */ jsx(NavigationMenuViewport, {})]
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
function NavigationMenuList({ className, ...props }) {
|
|
22
|
+
return /* @__PURE__ */ jsx(NavigationMenu.List, {
|
|
23
|
+
"data-slot": "navigation-menu-list",
|
|
24
|
+
className: cn("group flex flex-1 list-none items-center justify-center gap-1", className),
|
|
25
|
+
...props
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
function NavigationMenuItem({ className, ...props }) {
|
|
29
|
+
return /* @__PURE__ */ jsx(NavigationMenu.Item, {
|
|
30
|
+
"data-slot": "navigation-menu-item",
|
|
31
|
+
className: cn("relative", className),
|
|
32
|
+
...props
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
/** The look of a top-level entry, for links that sit beside triggers. */
|
|
36
|
+
var navigationMenuTriggerStyle = "group inline-flex h-9 w-max items-center justify-center gap-1 rounded-md px-3 text-sm font-semibold text-foreground/80 outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 data-[active]:text-foreground data-[state=open]:bg-muted data-[state=open]:text-foreground";
|
|
37
|
+
function NavigationMenuTrigger({ className, children, ...props }) {
|
|
38
|
+
return /* @__PURE__ */ jsxs(NavigationMenu.Trigger, {
|
|
39
|
+
"data-slot": "navigation-menu-trigger",
|
|
40
|
+
className: cn(navigationMenuTriggerStyle, className),
|
|
41
|
+
...props,
|
|
42
|
+
children: [children, /* @__PURE__ */ jsx(ChevronDown, {
|
|
43
|
+
"aria-hidden": true,
|
|
44
|
+
className: "relative top-px size-3.5 transition-transform duration-200 group-data-[state=open]:rotate-180"
|
|
45
|
+
})]
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
function NavigationMenuContent({ className, ...props }) {
|
|
49
|
+
return /* @__PURE__ */ jsx(NavigationMenu.Content, {
|
|
50
|
+
"data-slot": "navigation-menu-content",
|
|
51
|
+
className: cn("top-0 left-0 w-full p-2 md:absolute md:w-auto data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out", className),
|
|
52
|
+
...props
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
function NavigationMenuViewport({ className, ...props }) {
|
|
56
|
+
return /* @__PURE__ */ jsx("div", {
|
|
57
|
+
className: "absolute top-full left-0 z-50 flex justify-center",
|
|
58
|
+
children: /* @__PURE__ */ jsx(NavigationMenu.Viewport, {
|
|
59
|
+
"data-slot": "navigation-menu-viewport",
|
|
60
|
+
className: cn("relative mt-2 h-(--radix-navigation-menu-viewport-height) w-full origin-top overflow-hidden rounded-lg border border-border-strong bg-surface-raised text-popover-foreground shadow-[0_16px_48px_rgb(0_0_0_/_0.18)] data-[state=closed]:animate-out data-[state=open]:animate-in md:w-(--radix-navigation-menu-viewport-width)", className),
|
|
61
|
+
...props
|
|
62
|
+
})
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
function NavigationMenuLink({ className, ...props }) {
|
|
66
|
+
return /* @__PURE__ */ jsx(NavigationMenu.Link, {
|
|
67
|
+
"data-slot": "navigation-menu-link",
|
|
68
|
+
className: cn("flex flex-col gap-1 rounded-sm p-2 text-sm outline-none transition-colors hover:bg-muted focus-visible:ring-[3px] focus-visible:ring-ring/20 data-[active=true]:bg-muted data-[active=true]:shadow-[inset_2px_0_0_var(--color-brand)] [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className),
|
|
69
|
+
...props
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
function NavigationMenuIndicator({ className, ...props }) {
|
|
73
|
+
return /* @__PURE__ */ jsx(NavigationMenu.Indicator, {
|
|
74
|
+
"data-slot": "navigation-menu-indicator",
|
|
75
|
+
className: cn("top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=visible]:animate-in", className),
|
|
76
|
+
...props,
|
|
77
|
+
children: /* @__PURE__ */ jsx("div", { className: "relative top-[60%] size-2 rotate-45 rounded-tl-sm bg-border-strong" })
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
//#endregion
|
|
81
|
+
export { NavigationMenu$1 as NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle };
|
|
82
|
+
|
|
83
|
+
//# sourceMappingURL=navigation-menu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"navigation-menu.js","names":["NavigationMenu","NavigationMenuPrimitive"],"sources":["../../src/components/navigation-menu.tsx"],"sourcesContent":["import ChevronDown from '@burtson-labs/icons/react/chevron-down';\nimport { NavigationMenu as NavigationMenuPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\n/**\n * Site navigation with dropdown panels (a products menu, docs sections).\n * Keyboard and screen-reader behaviour come from Radix; the panel renders in\n * a shared viewport under the bar, sized to its content.\n */\nfunction NavigationMenu({\n className,\n children,\n viewport = true,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & { viewport?: boolean }) {\n return (\n <NavigationMenuPrimitive.Root\n data-slot=\"navigation-menu\"\n data-viewport={viewport}\n className={cn(\n 'group/navigation-menu relative flex max-w-max flex-1 items-center justify-center',\n className,\n )}\n {...props}\n >\n {children}\n {viewport && <NavigationMenuViewport />}\n </NavigationMenuPrimitive.Root>\n );\n}\n\nfunction NavigationMenuList({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {\n return (\n <NavigationMenuPrimitive.List\n data-slot=\"navigation-menu-list\"\n className={cn('group flex flex-1 list-none items-center justify-center gap-1', className)}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuItem({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {\n return (\n <NavigationMenuPrimitive.Item\n data-slot=\"navigation-menu-item\"\n className={cn('relative', className)}\n {...props}\n />\n );\n}\n\n/** The look of a top-level entry, for links that sit beside triggers. */\nconst navigationMenuTriggerStyle =\n 'group inline-flex h-9 w-max items-center justify-center gap-1 rounded-md px-3 text-sm font-semibold text-foreground/80 outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:opacity-50 data-[active]:text-foreground data-[state=open]:bg-muted data-[state=open]:text-foreground';\n\nfunction NavigationMenuTrigger({\n className,\n children,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {\n return (\n <NavigationMenuPrimitive.Trigger\n data-slot=\"navigation-menu-trigger\"\n className={cn(navigationMenuTriggerStyle, className)}\n {...props}\n >\n {children}\n <ChevronDown\n aria-hidden\n className=\"relative top-px size-3.5 transition-transform duration-200 group-data-[state=open]:rotate-180\"\n />\n </NavigationMenuPrimitive.Trigger>\n );\n}\n\nfunction NavigationMenuContent({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {\n return (\n <NavigationMenuPrimitive.Content\n data-slot=\"navigation-menu-content\"\n className={cn(\n 'top-0 left-0 w-full p-2 md:absolute md:w-auto data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuViewport({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {\n return (\n <div className=\"absolute top-full left-0 z-50 flex justify-center\">\n <NavigationMenuPrimitive.Viewport\n data-slot=\"navigation-menu-viewport\"\n className={cn(\n 'relative mt-2 h-(--radix-navigation-menu-viewport-height) w-full origin-top overflow-hidden rounded-lg border border-border-strong bg-surface-raised text-popover-foreground shadow-[0_16px_48px_rgb(0_0_0_/_0.18)] data-[state=closed]:animate-out data-[state=open]:animate-in md:w-(--radix-navigation-menu-viewport-width)',\n className,\n )}\n {...props}\n />\n </div>\n );\n}\n\nfunction NavigationMenuLink({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {\n return (\n <NavigationMenuPrimitive.Link\n data-slot=\"navigation-menu-link\"\n className={cn(\n \"flex flex-col gap-1 rounded-sm p-2 text-sm outline-none transition-colors hover:bg-muted focus-visible:ring-[3px] focus-visible:ring-ring/20 data-[active=true]:bg-muted data-[active=true]:shadow-[inset_2px_0_0_var(--color-brand)] [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground\",\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction NavigationMenuIndicator({\n className,\n ...props\n}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {\n return (\n <NavigationMenuPrimitive.Indicator\n data-slot=\"navigation-menu-indicator\"\n className={cn(\n 'top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=visible]:animate-in',\n className,\n )}\n {...props}\n >\n <div className=\"relative top-[60%] size-2 rotate-45 rounded-tl-sm bg-border-strong\" />\n </NavigationMenuPrimitive.Indicator>\n );\n}\n\nexport {\n NavigationMenu,\n NavigationMenuContent,\n NavigationMenuIndicator,\n NavigationMenuItem,\n NavigationMenuLink,\n NavigationMenuList,\n NavigationMenuTrigger,\n navigationMenuTriggerStyle,\n NavigationMenuViewport,\n};\n"],"mappings":";;;;;;;;;;;AAWA,SAASA,iBAAe,EACtB,WACA,UACA,WAAW,MACX,GAAG,SACkF;CACrF,OACE,qBAACC,eAAwB,MAAzB;EACE,aAAU;EACV,iBAAe;EACf,WAAW,GACT,oFACA,SACF;EACA,GAAI;EAPN,UAAA,CASG,UACA,YAAY,oBAAC,wBAAD,CAAyB,CAAA,CACV;;AAElC;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,iEAAiE,SAAS;EACxF,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GAAG,YAAY,SAAS;EACnC,GAAI;CACL,CAAA;AAEL;;AAGA,IAAM,6BACJ;AAEF,SAAS,sBAAsB,EAC7B,WACA,UACA,GAAG,SAC4D;CAC/D,OACE,qBAACA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GAAG,4BAA4B,SAAS;EACnD,GAAI;EAHN,UAAA,CAKG,UACD,oBAAC,aAAD;GACE,eAAA;GACA,WAAU;EACX,CAAA,CAC8B;;AAErC;AAEA,SAAS,sBAAsB,EAC7B,WACA,GAAG,SAC4D;CAC/D,OACE,oBAACA,eAAwB,SAAzB;EACE,aAAU;EACV,WAAW,GACT,gHACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,uBAAuB,EAC9B,WACA,GAAG,SAC6D;CAChE,OACE,oBAAC,OAAD;EAAK,WAAU;EACb,UAAA,oBAACA,eAAwB,UAAzB;GACE,aAAU;GACV,WAAW,GACT,kUACA,SACF;GACA,GAAI;EACL,CAAA;CACE,CAAA;AAET;AAEA,SAAS,mBAAmB,EAC1B,WACA,GAAG,SACyD;CAC5D,OACE,oBAACA,eAAwB,MAAzB;EACE,aAAU;EACV,WAAW,GACT,kUACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,wBAAwB,EAC/B,WACA,GAAG,SAC8D;CACjE,OACE,oBAACA,eAAwB,WAAzB;EACE,aAAU;EACV,WAAW,GACT,sIACA,SACF;EACA,GAAI;EAEJ,UAAA,oBAAC,OAAD,EAAK,WAAU,qEAAsE,CAAA;CACpD,CAAA;AAEvC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* The page numbers to show: always the first and last page, `siblings` pages
|
|
4
|
+
* either side of the current one, and 'ellipsis' for the gaps.
|
|
5
|
+
*/
|
|
6
|
+
export declare function paginationRange(page: number, pageCount: number, siblings?: number): (number | 'ellipsis')[];
|
|
7
|
+
export interface PaginationProps extends Omit<React.ComponentProps<'nav'>, 'onChange'> {
|
|
8
|
+
/** 1-based current page. */
|
|
9
|
+
page: number;
|
|
10
|
+
pageCount: number;
|
|
11
|
+
onPageChange: (page: number) => void;
|
|
12
|
+
siblings?: number;
|
|
13
|
+
/** Optional summary on the left, e.g. "1–25 of 312". */
|
|
14
|
+
summary?: React.ReactNode;
|
|
15
|
+
}
|
|
16
|
+
/** Page controls for a table or list. Buttons are real buttons, keyboard-reachable. */
|
|
17
|
+
declare function Pagination({ page, pageCount, onPageChange, siblings, summary, className, ...props }: PaginationProps): React.JSX.Element;
|
|
18
|
+
export { Pagination };
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { Button } from "./button.js";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import ChevronRight from "@burtson-labs/icons/react/chevron-right";
|
|
6
|
+
import ChevronLeft from "@burtson-labs/icons/react/chevron-left";
|
|
7
|
+
//#region src/components/pagination.tsx
|
|
8
|
+
/**
|
|
9
|
+
* The page numbers to show: always the first and last page, `siblings` pages
|
|
10
|
+
* either side of the current one, and 'ellipsis' for the gaps.
|
|
11
|
+
*/
|
|
12
|
+
function paginationRange(page, pageCount, siblings = 1) {
|
|
13
|
+
if (pageCount <= 0) return [];
|
|
14
|
+
if (pageCount <= siblings * 2 + 5) return Array.from({ length: pageCount }, (_, i) => i + 1);
|
|
15
|
+
const start = Math.max(2, page - siblings);
|
|
16
|
+
const end = Math.min(pageCount - 1, page + siblings);
|
|
17
|
+
const out = [1];
|
|
18
|
+
if (start > 2) out.push("ellipsis");
|
|
19
|
+
for (let p = start; p <= end; p += 1) out.push(p);
|
|
20
|
+
if (end < pageCount - 1) out.push("ellipsis");
|
|
21
|
+
out.push(pageCount);
|
|
22
|
+
return out;
|
|
23
|
+
}
|
|
24
|
+
/** Page controls for a table or list. Buttons are real buttons, keyboard-reachable. */
|
|
25
|
+
function Pagination({ page, pageCount, onPageChange, siblings = 1, summary, className, ...props }) {
|
|
26
|
+
const pages = paginationRange(page, pageCount, siblings);
|
|
27
|
+
const go = (p) => onPageChange(Math.min(Math.max(1, p), Math.max(1, pageCount)));
|
|
28
|
+
return /* @__PURE__ */ jsxs("nav", {
|
|
29
|
+
"aria-label": "Pagination",
|
|
30
|
+
"data-slot": "pagination",
|
|
31
|
+
className: cn("flex flex-wrap items-center justify-between gap-3", className),
|
|
32
|
+
...props,
|
|
33
|
+
children: [/* @__PURE__ */ jsx("div", {
|
|
34
|
+
className: "text-xs text-muted-foreground tabular-nums",
|
|
35
|
+
children: summary
|
|
36
|
+
}), /* @__PURE__ */ jsxs("ul", {
|
|
37
|
+
className: "flex items-center gap-1",
|
|
38
|
+
children: [
|
|
39
|
+
/* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(Button, {
|
|
40
|
+
variant: "ghost",
|
|
41
|
+
size: "sm",
|
|
42
|
+
onClick: () => go(page - 1),
|
|
43
|
+
disabled: page <= 1,
|
|
44
|
+
"aria-label": "Previous page",
|
|
45
|
+
children: [/* @__PURE__ */ jsx(ChevronLeft, { "aria-hidden": true }), /* @__PURE__ */ jsx("span", {
|
|
46
|
+
className: "hidden sm:inline",
|
|
47
|
+
children: "Previous"
|
|
48
|
+
})]
|
|
49
|
+
}) }),
|
|
50
|
+
pages.map((p, i) => p === "ellipsis" ? /* @__PURE__ */ jsx("li", {
|
|
51
|
+
"aria-hidden": true,
|
|
52
|
+
className: "px-1 text-muted-foreground",
|
|
53
|
+
children: "…"
|
|
54
|
+
}, `e${i}`) : /* @__PURE__ */ jsx("li", {
|
|
55
|
+
className: "hidden sm:block",
|
|
56
|
+
children: /* @__PURE__ */ jsx(Button, {
|
|
57
|
+
variant: p === page ? "outline" : "ghost",
|
|
58
|
+
size: "icon-sm",
|
|
59
|
+
onClick: () => go(p),
|
|
60
|
+
"aria-current": p === page ? "page" : void 0,
|
|
61
|
+
"aria-label": `Page ${p}`,
|
|
62
|
+
className: cn("tabular-nums", p === page && "border-brand/40 text-brand"),
|
|
63
|
+
children: p
|
|
64
|
+
})
|
|
65
|
+
}, p)),
|
|
66
|
+
/* @__PURE__ */ jsxs("li", {
|
|
67
|
+
className: "px-2 text-xs text-muted-foreground tabular-nums sm:hidden",
|
|
68
|
+
children: [
|
|
69
|
+
page,
|
|
70
|
+
" / ",
|
|
71
|
+
pageCount
|
|
72
|
+
]
|
|
73
|
+
}),
|
|
74
|
+
/* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(Button, {
|
|
75
|
+
variant: "ghost",
|
|
76
|
+
size: "sm",
|
|
77
|
+
onClick: () => go(page + 1),
|
|
78
|
+
disabled: page >= pageCount,
|
|
79
|
+
"aria-label": "Next page",
|
|
80
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
81
|
+
className: "hidden sm:inline",
|
|
82
|
+
children: "Next"
|
|
83
|
+
}), /* @__PURE__ */ jsx(ChevronRight, { "aria-hidden": true })]
|
|
84
|
+
}) })
|
|
85
|
+
]
|
|
86
|
+
})]
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
//#endregion
|
|
90
|
+
export { Pagination, paginationRange };
|
|
91
|
+
|
|
92
|
+
//# sourceMappingURL=pagination.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pagination.js","names":[],"sources":["../../src/components/pagination.tsx"],"sourcesContent":["import ChevronLeft from '@burtson-labs/icons/react/chevron-left';\nimport ChevronRight from '@burtson-labs/icons/react/chevron-right';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\nimport { Button } from './button';\n\n/**\n * The page numbers to show: always the first and last page, `siblings` pages\n * either side of the current one, and 'ellipsis' for the gaps.\n */\nexport function paginationRange(\n page: number,\n pageCount: number,\n siblings = 1,\n): (number | 'ellipsis')[] {\n if (pageCount <= 0) return [];\n const window = siblings * 2 + 5; // first, last, current, siblings, two gaps\n if (pageCount <= window) return Array.from({ length: pageCount }, (_, i) => i + 1);\n const start = Math.max(2, page - siblings);\n const end = Math.min(pageCount - 1, page + siblings);\n const out: (number | 'ellipsis')[] = [1];\n if (start > 2) out.push('ellipsis');\n for (let p = start; p <= end; p += 1) out.push(p);\n if (end < pageCount - 1) out.push('ellipsis');\n out.push(pageCount);\n return out;\n}\n\nexport interface PaginationProps extends Omit<React.ComponentProps<'nav'>, 'onChange'> {\n /** 1-based current page. */\n page: number;\n pageCount: number;\n onPageChange: (page: number) => void;\n siblings?: number;\n /** Optional summary on the left, e.g. \"1–25 of 312\". */\n summary?: React.ReactNode;\n}\n\n/** Page controls for a table or list. Buttons are real buttons, keyboard-reachable. */\nfunction Pagination({\n page,\n pageCount,\n onPageChange,\n siblings = 1,\n summary,\n className,\n ...props\n}: PaginationProps) {\n const pages = paginationRange(page, pageCount, siblings);\n const go = (p: number) => onPageChange(Math.min(Math.max(1, p), Math.max(1, pageCount)));\n return (\n <nav\n aria-label=\"Pagination\"\n data-slot=\"pagination\"\n className={cn('flex flex-wrap items-center justify-between gap-3', className)}\n {...props}\n >\n <div className=\"text-xs text-muted-foreground tabular-nums\">{summary}</div>\n <ul className=\"flex items-center gap-1\">\n <li>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={() => go(page - 1)}\n disabled={page <= 1}\n aria-label=\"Previous page\"\n >\n <ChevronLeft aria-hidden />\n <span className=\"hidden sm:inline\">Previous</span>\n </Button>\n </li>\n {pages.map((p, i) =>\n p === 'ellipsis' ? (\n <li key={`e${i}`} aria-hidden className=\"px-1 text-muted-foreground\">\n …\n </li>\n ) : (\n <li key={p} className=\"hidden sm:block\">\n <Button\n variant={p === page ? 'outline' : 'ghost'}\n size=\"icon-sm\"\n onClick={() => go(p)}\n aria-current={p === page ? 'page' : undefined}\n aria-label={`Page ${p}`}\n className={cn('tabular-nums', p === page && 'border-brand/40 text-brand')}\n >\n {p}\n </Button>\n </li>\n ),\n )}\n <li className=\"px-2 text-xs text-muted-foreground tabular-nums sm:hidden\">\n {page} / {pageCount}\n </li>\n <li>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={() => go(page + 1)}\n disabled={page >= pageCount}\n aria-label=\"Next page\"\n >\n <span className=\"hidden sm:inline\">Next</span>\n <ChevronRight aria-hidden />\n </Button>\n </li>\n </ul>\n </nav>\n );\n}\n\nexport { Pagination };\n"],"mappings":";;;;;;;;;;;AAYA,SAAgB,gBACd,MACA,WACA,WAAW,GACc;CACzB,IAAI,aAAa,GAAG,OAAO,CAAC;CAE5B,IAAI,aADW,WAAW,IAAI,GACL,OAAO,MAAM,KAAK,EAAE,QAAQ,UAAU,IAAI,GAAG,MAAM,IAAI,CAAC;CACjF,MAAM,QAAQ,KAAK,IAAI,GAAG,OAAO,QAAQ;CACzC,MAAM,MAAM,KAAK,IAAI,YAAY,GAAG,OAAO,QAAQ;CACnD,MAAM,MAA+B,CAAC,CAAC;CACvC,IAAI,QAAQ,GAAG,IAAI,KAAK,UAAU;CAClC,KAAK,IAAI,IAAI,OAAO,KAAK,KAAK,KAAK,GAAG,IAAI,KAAK,CAAC;CAChD,IAAI,MAAM,YAAY,GAAG,IAAI,KAAK,UAAU;CAC5C,IAAI,KAAK,SAAS;CAClB,OAAO;AACT;;AAaA,SAAS,WAAW,EAClB,MACA,WACA,cACA,WAAW,GACX,SACA,WACA,GAAG,SACe;CAClB,MAAM,QAAQ,gBAAgB,MAAM,WAAW,QAAQ;CACvD,MAAM,MAAM,MAAc,aAAa,KAAK,IAAI,KAAK,IAAI,GAAG,CAAC,GAAG,KAAK,IAAI,GAAG,SAAS,CAAC,CAAC;CACvF,OACE,qBAAC,OAAD;EACE,cAAW;EACX,aAAU;EACV,WAAW,GAAG,qDAAqD,SAAS;EAC5E,GAAI;EAJN,UAAA,CAME,oBAAC,OAAD;GAAK,WAAU;GAA8C,UAAA;EAAa,CAAA,GAC1E,qBAAC,MAAD;GAAI,WAAU;GAAd,UAAA;IACE,oBAAC,MAAD,EAAA,UACE,qBAAC,QAAD;KACE,SAAQ;KACR,MAAK;KACL,eAAe,GAAG,OAAO,CAAC;KAC1B,UAAU,QAAQ;KAClB,cAAW;KALb,UAAA,CAOE,oBAAC,aAAD,EAAa,eAAA,KAAa,CAAA,GAC1B,oBAAC,QAAD;MAAM,WAAU;MAAmB,UAAA;KAAc,CAAA,CAC3C;IACN,CAAA,EAAA,CAAA;IACH,MAAM,KAAK,GAAG,MACb,MAAM,aACJ,oBAAC,MAAD;KAAkB,eAAA;KAAY,WAAU;KAA6B,UAAA;IAEjE,GAFK,IAAI,GAET,IAEJ,oBAAC,MAAD;KAAY,WAAU;KACpB,UAAA,oBAAC,QAAD;MACE,SAAS,MAAM,OAAO,YAAY;MAClC,MAAK;MACL,eAAe,GAAG,CAAC;MACnB,gBAAc,MAAM,OAAO,SAAS,KAAA;MACpC,cAAY,QAAQ;MACpB,WAAW,GAAG,gBAAgB,MAAM,QAAQ,4BAA4B;MAEvE,UAAA;KACK,CAAA;IACN,GAXK,CAWL,CAER;IACA,qBAAC,MAAD;KAAI,WAAU;KAAd,UAAA;MACG;MAAK;MAAI;KACR;;IACJ,oBAAC,MAAD,EAAA,UACE,qBAAC,QAAD;KACE,SAAQ;KACR,MAAK;KACL,eAAe,GAAG,OAAO,CAAC;KAC1B,UAAU,QAAQ;KAClB,cAAW;KALb,UAAA,CAOE,oBAAC,QAAD;MAAM,WAAU;MAAmB,UAAA;KAAU,CAAA,GAC7C,oBAAC,cAAD,EAAc,eAAA,KAAa,CAAA,CACrB;IACN,CAAA,EAAA,CAAA;GACF;EACD,CAAA,CAAA;;AAET"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { cn } from "../lib/utils.js";
|
|
2
|
-
import { surfaceClasses } from "./popover.js";
|
|
3
2
|
import { fieldClasses } from "./input.js";
|
|
3
|
+
import { surfaceClasses } from "./popover.js";
|
|
4
4
|
import ChevronDown from "@burtson-labs/icons/react/chevron-down";
|
|
5
5
|
import { Select } from "radix-ui";
|
|
6
6
|
import "react";
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export interface StepItem {
|
|
3
|
+
title: React.ReactNode;
|
|
4
|
+
description?: React.ReactNode;
|
|
5
|
+
}
|
|
6
|
+
export interface StepsProps extends React.ComponentProps<'ol'> {
|
|
7
|
+
items: StepItem[];
|
|
8
|
+
/** 0-based index of the step in progress; earlier steps show as done. */
|
|
9
|
+
current: number;
|
|
10
|
+
orientation?: 'horizontal' | 'vertical';
|
|
11
|
+
}
|
|
12
|
+
/** Progress through a short multi-step flow (a wizard, an onboarding). */
|
|
13
|
+
declare function Steps({ items, current, orientation, className, ...props }: StepsProps): React.JSX.Element;
|
|
14
|
+
export { Steps };
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import "react";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import Check from "@burtson-labs/icons/react/check";
|
|
5
|
+
//#region src/components/steps.tsx
|
|
6
|
+
/** Progress through a short multi-step flow (a wizard, an onboarding). */
|
|
7
|
+
function Steps({ items, current, orientation = "horizontal", className, ...props }) {
|
|
8
|
+
return /* @__PURE__ */ jsx("ol", {
|
|
9
|
+
"data-slot": "steps",
|
|
10
|
+
"data-orientation": orientation,
|
|
11
|
+
className: cn("flex gap-3", orientation === "horizontal" ? "flex-row items-start" : "flex-col", className),
|
|
12
|
+
...props,
|
|
13
|
+
children: items.map((item, i) => {
|
|
14
|
+
const state = i < current ? "complete" : i === current ? "current" : "upcoming";
|
|
15
|
+
return /* @__PURE__ */ jsxs("li", {
|
|
16
|
+
"data-state": state,
|
|
17
|
+
"aria-current": state === "current" ? "step" : void 0,
|
|
18
|
+
className: cn("flex min-w-0 items-start gap-2.5", orientation === "horizontal" && "flex-1"),
|
|
19
|
+
children: [/* @__PURE__ */ jsx("span", {
|
|
20
|
+
className: cn("grid size-6 shrink-0 place-items-center rounded-full border text-xs font-semibold tabular-nums", state === "complete" && "border-brand bg-brand text-primary-foreground", state === "current" && "border-brand bg-brand-soft text-brand", state === "upcoming" && "border-border-strong text-muted-foreground"),
|
|
21
|
+
children: state === "complete" ? /* @__PURE__ */ jsx(Check, {
|
|
22
|
+
className: "size-3.5",
|
|
23
|
+
"aria-hidden": true
|
|
24
|
+
}) : i + 1
|
|
25
|
+
}), /* @__PURE__ */ jsxs("span", {
|
|
26
|
+
className: "grid min-w-0 gap-0.5 pt-0.5",
|
|
27
|
+
children: [/* @__PURE__ */ jsxs("span", {
|
|
28
|
+
className: cn("truncate text-[13px] font-semibold", state === "upcoming" && "text-muted-foreground"),
|
|
29
|
+
children: [item.title, /* @__PURE__ */ jsx("span", {
|
|
30
|
+
className: "sr-only",
|
|
31
|
+
children: state === "complete" ? " (done)" : state === "current" ? " (current)" : ""
|
|
32
|
+
})]
|
|
33
|
+
}), item.description && /* @__PURE__ */ jsx("span", {
|
|
34
|
+
className: "text-xs text-muted-foreground",
|
|
35
|
+
children: item.description
|
|
36
|
+
})]
|
|
37
|
+
})]
|
|
38
|
+
}, i);
|
|
39
|
+
})
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
//#endregion
|
|
43
|
+
export { Steps };
|
|
44
|
+
|
|
45
|
+
//# sourceMappingURL=steps.js.map
|
|
@@ -0,0 +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-brand bg-brand 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 'truncate 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,iDACxB,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,sCACA,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"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
2
|
+
import { Toast as ToastPrimitive } from 'radix-ui';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
/**
|
|
5
|
+
* Brief, non-blocking notices ("Message sent", "Update available"). Put one
|
|
6
|
+
* `ToastProvider` + `ToastViewport` near the root and render `Toast`s with
|
|
7
|
+
* `open` state; Radix handles timing, swipe-to-dismiss and the live region.
|
|
8
|
+
*/
|
|
9
|
+
declare const ToastProvider: React.FC<ToastPrimitive.ToastProviderProps>;
|
|
10
|
+
declare function ToastViewport({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Viewport>): React.JSX.Element;
|
|
11
|
+
declare const toastVariants: (props?: ({
|
|
12
|
+
variant?: "destructive" | "success" | "default" | null | undefined;
|
|
13
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
|
+
declare function Toast({ className, variant, ...props }: React.ComponentProps<typeof ToastPrimitive.Root> & VariantProps<typeof toastVariants>): React.JSX.Element;
|
|
15
|
+
declare function ToastTitle({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Title>): React.JSX.Element;
|
|
16
|
+
declare function ToastDescription({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Description>): React.JSX.Element;
|
|
17
|
+
/** A button inside the toast; `altText` tells screen readers how to do it without the toast. */
|
|
18
|
+
declare function ToastAction({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Action>): React.JSX.Element;
|
|
19
|
+
declare function ToastClose({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Close>): React.JSX.Element;
|
|
20
|
+
export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, toastVariants, ToastViewport, };
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { cn } from "../lib/utils.js";
|
|
2
|
+
import { Toast } from "radix-ui";
|
|
3
|
+
import "react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
import { cva } from "class-variance-authority";
|
|
6
|
+
import X from "@burtson-labs/icons/react/x";
|
|
7
|
+
//#region src/components/toast.tsx
|
|
8
|
+
/**
|
|
9
|
+
* Brief, non-blocking notices ("Message sent", "Update available"). Put one
|
|
10
|
+
* `ToastProvider` + `ToastViewport` near the root and render `Toast`s with
|
|
11
|
+
* `open` state; Radix handles timing, swipe-to-dismiss and the live region.
|
|
12
|
+
*/
|
|
13
|
+
var ToastProvider = Toast.Provider;
|
|
14
|
+
function ToastViewport({ className, ...props }) {
|
|
15
|
+
return /* @__PURE__ */ jsx(Toast.Viewport, {
|
|
16
|
+
"data-slot": "toast-viewport",
|
|
17
|
+
className: cn("fixed right-0 bottom-0 z-[100] flex max-h-dvh w-full flex-col-reverse gap-2 p-4 outline-none sm:max-w-sm", className),
|
|
18
|
+
...props
|
|
19
|
+
});
|
|
20
|
+
}
|
|
21
|
+
var toastVariants = cva("group pointer-events-auto relative grid w-full grid-cols-[1fr_auto] items-start gap-x-3 gap-y-1 overflow-hidden rounded-lg border p-4 pr-10 text-sm shadow-[0_16px_48px_rgb(0_0_0_/_0.18)] data-[state=closed]:animate-out data-[state=open]:animate-in data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-(--radix-toast-swipe-end-x) data-[swipe=move]:translate-x-(--radix-toast-swipe-move-x) data-[swipe=move]:transition-none", {
|
|
22
|
+
variants: { variant: {
|
|
23
|
+
default: "border-border-strong bg-surface-raised text-foreground",
|
|
24
|
+
success: "border-success/30 bg-surface-raised text-foreground [&_[data-slot=toast-title]]:text-success",
|
|
25
|
+
destructive: "border-destructive/30 bg-surface-raised text-foreground [&_[data-slot=toast-title]]:text-destructive"
|
|
26
|
+
} },
|
|
27
|
+
defaultVariants: { variant: "default" }
|
|
28
|
+
});
|
|
29
|
+
function Toast$1({ className, variant, ...props }) {
|
|
30
|
+
return /* @__PURE__ */ jsx(Toast.Root, {
|
|
31
|
+
"data-slot": "toast",
|
|
32
|
+
className: cn(toastVariants({ variant }), className),
|
|
33
|
+
...props
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
function ToastTitle({ className, ...props }) {
|
|
37
|
+
return /* @__PURE__ */ jsx(Toast.Title, {
|
|
38
|
+
"data-slot": "toast-title",
|
|
39
|
+
className: cn("col-start-1 font-semibold tracking-[-0.01em]", className),
|
|
40
|
+
...props
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
function ToastDescription({ className, ...props }) {
|
|
44
|
+
return /* @__PURE__ */ jsx(Toast.Description, {
|
|
45
|
+
"data-slot": "toast-description",
|
|
46
|
+
className: cn("col-start-1 text-[13px] leading-5 text-muted-foreground", className),
|
|
47
|
+
...props
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
/** A button inside the toast; `altText` tells screen readers how to do it without the toast. */
|
|
51
|
+
function ToastAction({ className, ...props }) {
|
|
52
|
+
return /* @__PURE__ */ jsx(Toast.Action, {
|
|
53
|
+
"data-slot": "toast-action",
|
|
54
|
+
className: cn("col-start-2 row-span-2 row-start-1 inline-flex h-8 shrink-0 items-center justify-center self-center rounded-md border border-border-strong bg-surface px-3 text-[13px] font-semibold transition-colors outline-none hover:bg-muted focus-visible:ring-[3px] focus-visible:ring-ring/20", className),
|
|
55
|
+
...props
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
function ToastClose({ className, ...props }) {
|
|
59
|
+
return /* @__PURE__ */ jsx(Toast.Close, {
|
|
60
|
+
"data-slot": "toast-close",
|
|
61
|
+
"aria-label": "Dismiss",
|
|
62
|
+
className: cn("absolute top-3 right-3 grid size-6 place-items-center rounded-sm text-muted-foreground transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 [&_svg]:size-3.5", className),
|
|
63
|
+
...props,
|
|
64
|
+
children: /* @__PURE__ */ jsx(X, { "aria-hidden": true })
|
|
65
|
+
});
|
|
66
|
+
}
|
|
67
|
+
//#endregion
|
|
68
|
+
export { Toast$1 as Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, toastVariants };
|
|
69
|
+
|
|
70
|
+
//# sourceMappingURL=toast.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"toast.js","names":["ToastPrimitive","Toast"],"sources":["../../src/components/toast.tsx"],"sourcesContent":["import X from '@burtson-labs/icons/react/x';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Toast as ToastPrimitive } from 'radix-ui';\nimport * as React from 'react';\n\nimport { cn } from '../lib/utils';\n\n/**\n * Brief, non-blocking notices (\"Message sent\", \"Update available\"). Put one\n * `ToastProvider` + `ToastViewport` near the root and render `Toast`s with\n * `open` state; Radix handles timing, swipe-to-dismiss and the live region.\n */\nconst ToastProvider = ToastPrimitive.Provider;\n\nfunction ToastViewport({\n className,\n ...props\n}: React.ComponentProps<typeof ToastPrimitive.Viewport>) {\n return (\n <ToastPrimitive.Viewport\n data-slot=\"toast-viewport\"\n className={cn(\n 'fixed right-0 bottom-0 z-[100] flex max-h-dvh w-full flex-col-reverse gap-2 p-4 outline-none sm:max-w-sm',\n className,\n )}\n {...props}\n />\n );\n}\n\nconst toastVariants = cva(\n 'group pointer-events-auto relative grid w-full grid-cols-[1fr_auto] items-start gap-x-3 gap-y-1 overflow-hidden rounded-lg border p-4 pr-10 text-sm shadow-[0_16px_48px_rgb(0_0_0_/_0.18)] data-[state=closed]:animate-out data-[state=open]:animate-in data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-(--radix-toast-swipe-end-x) data-[swipe=move]:translate-x-(--radix-toast-swipe-move-x) data-[swipe=move]:transition-none',\n {\n variants: {\n variant: {\n default: 'border-border-strong bg-surface-raised text-foreground',\n success:\n 'border-success/30 bg-surface-raised text-foreground [&_[data-slot=toast-title]]:text-success',\n destructive:\n 'border-destructive/30 bg-surface-raised text-foreground [&_[data-slot=toast-title]]:text-destructive',\n },\n },\n defaultVariants: { variant: 'default' },\n },\n);\n\nfunction Toast({\n className,\n variant,\n ...props\n}: React.ComponentProps<typeof ToastPrimitive.Root> & VariantProps<typeof toastVariants>) {\n return (\n <ToastPrimitive.Root\n data-slot=\"toast\"\n className={cn(toastVariants({ variant }), className)}\n {...props}\n />\n );\n}\n\nfunction ToastTitle({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Title>) {\n return (\n <ToastPrimitive.Title\n data-slot=\"toast-title\"\n className={cn('col-start-1 font-semibold tracking-[-0.01em]', className)}\n {...props}\n />\n );\n}\n\nfunction ToastDescription({\n className,\n ...props\n}: React.ComponentProps<typeof ToastPrimitive.Description>) {\n return (\n <ToastPrimitive.Description\n data-slot=\"toast-description\"\n className={cn('col-start-1 text-[13px] leading-5 text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\n/** A button inside the toast; `altText` tells screen readers how to do it without the toast. */\nfunction ToastAction({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Action>) {\n return (\n <ToastPrimitive.Action\n data-slot=\"toast-action\"\n className={cn(\n 'col-start-2 row-span-2 row-start-1 inline-flex h-8 shrink-0 items-center justify-center self-center rounded-md border border-border-strong bg-surface px-3 text-[13px] font-semibold transition-colors outline-none hover:bg-muted focus-visible:ring-[3px] focus-visible:ring-ring/20',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction ToastClose({ className, ...props }: React.ComponentProps<typeof ToastPrimitive.Close>) {\n return (\n <ToastPrimitive.Close\n data-slot=\"toast-close\"\n aria-label=\"Dismiss\"\n className={cn(\n 'absolute top-3 right-3 grid size-6 place-items-center rounded-sm text-muted-foreground transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:ring-[3px] focus-visible:ring-ring/20 [&_svg]:size-3.5',\n className,\n )}\n {...props}\n >\n <X aria-hidden />\n </ToastPrimitive.Close>\n );\n}\n\nexport {\n Toast,\n ToastAction,\n ToastClose,\n ToastDescription,\n ToastProvider,\n ToastTitle,\n toastVariants,\n ToastViewport,\n};\n"],"mappings":";;;;;;;;;;;;AAYA,IAAM,gBAAgBA,MAAe;AAErC,SAAS,cAAc,EACrB,WACA,GAAG,SACoD;CACvD,OACE,oBAACA,MAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,4GACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,gBAAgB,IACpB,mbACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,SACE;EACF,aACE;CACJ,EACF;CACA,iBAAiB,EAAE,SAAS,UAAU;AACxC,CACF;AAEA,SAASC,QAAM,EACb,WACA,SACA,GAAG,SACqF;CACxF,OACE,oBAACD,MAAe,MAAhB;EACE,aAAU;EACV,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EACnD,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA4D;CAC9F,OACE,oBAACA,MAAe,OAAhB;EACE,aAAU;EACV,WAAW,GAAG,gDAAgD,SAAS;EACvE,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,GAAG,SACuD;CAC1D,OACE,oBAACA,MAAe,aAAhB;EACE,aAAU;EACV,WAAW,GAAG,2DAA2D,SAAS;EAClF,GAAI;CACL,CAAA;AAEL;;AAGA,SAAS,YAAY,EAAE,WAAW,GAAG,SAA6D;CAChG,OACE,oBAACA,MAAe,QAAhB;EACE,aAAU;EACV,WAAW,GACT,0RACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA4D;CAC9F,OACE,oBAACA,MAAe,OAAhB;EACE,aAAU;EACV,cAAW;EACX,WAAW,GACT,mOACA,SACF;EACA,GAAI;EAEJ,UAAA,oBAAC,GAAD,EAAG,eAAA,KAAa,CAAA;CACI,CAAA;AAE1B"}
|
package/dist/index.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ export { cn } from './lib/utils';
|
|
|
2
2
|
export * from './tokens';
|
|
3
3
|
export * from './components/accordion';
|
|
4
4
|
export * from './components/alert';
|
|
5
|
+
export * from './components/alert-dialog';
|
|
5
6
|
export * from './components/app-shell';
|
|
6
7
|
export * from './components/avatar';
|
|
7
8
|
export * from './components/badge';
|
|
@@ -10,6 +11,7 @@ export * from './components/button';
|
|
|
10
11
|
export * from './components/card';
|
|
11
12
|
export * from './components/checkbox';
|
|
12
13
|
export * from './components/collapsible';
|
|
14
|
+
export * from './components/combobox';
|
|
13
15
|
export * from './components/command';
|
|
14
16
|
export * from './components/dialog';
|
|
15
17
|
export * from './components/dropdown-menu';
|
|
@@ -19,7 +21,9 @@ export * from './components/icon-button';
|
|
|
19
21
|
export * from './components/input';
|
|
20
22
|
export * from './components/kbd';
|
|
21
23
|
export * from './components/label';
|
|
24
|
+
export * from './components/navigation-menu';
|
|
22
25
|
export * from './components/page-header';
|
|
26
|
+
export * from './components/pagination';
|
|
23
27
|
export * from './components/popover';
|
|
24
28
|
export * from './components/progress';
|
|
25
29
|
export * from './components/radio-group';
|
|
@@ -31,9 +35,11 @@ export * from './components/skeleton';
|
|
|
31
35
|
export * from './components/spinner';
|
|
32
36
|
export * from './components/stat-card';
|
|
33
37
|
export * from './components/status';
|
|
38
|
+
export * from './components/steps';
|
|
34
39
|
export * from './components/switch';
|
|
35
40
|
export * from './components/table';
|
|
36
41
|
export * from './components/tabs';
|
|
37
42
|
export * from './components/textarea';
|
|
43
|
+
export * from './components/toast';
|
|
38
44
|
export * from './components/toolbar';
|
|
39
45
|
export * from './components/tooltip';
|
package/dist/index.js
CHANGED
|
@@ -2,25 +2,30 @@ import { cn } from "./lib/utils.js";
|
|
|
2
2
|
import tokens, { brand, dark, fontMono, fontSans, light, radius, shadow } from "./tokens.js";
|
|
3
3
|
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./components/accordion.js";
|
|
4
4
|
import { Alert, AlertDescription, AlertTitle, alertVariants } from "./components/alert.js";
|
|
5
|
+
import { Button, buttonVariants } from "./components/button.js";
|
|
6
|
+
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from "./components/alert-dialog.js";
|
|
5
7
|
import { AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar } from "./components/app-shell.js";
|
|
6
8
|
import { Avatar, AvatarFallback, AvatarImage } from "./components/avatar.js";
|
|
7
9
|
import { Badge, badgeVariants } from "./components/badge.js";
|
|
8
10
|
import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "./components/breadcrumb.js";
|
|
9
|
-
import { Button, buttonVariants } from "./components/button.js";
|
|
10
11
|
import { Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, cardVariants } from "./components/card.js";
|
|
11
12
|
import { Checkbox } from "./components/checkbox.js";
|
|
12
13
|
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "./components/collapsible.js";
|
|
13
14
|
import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from "./components/dialog.js";
|
|
14
15
|
import { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from "./components/command.js";
|
|
16
|
+
import { Input, fieldClasses } from "./components/input.js";
|
|
15
17
|
import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger, surfaceClasses } from "./components/popover.js";
|
|
18
|
+
import { Spinner } from "./components/spinner.js";
|
|
19
|
+
import { Combobox } from "./components/combobox.js";
|
|
16
20
|
import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "./components/dropdown-menu.js";
|
|
17
21
|
import { EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateTitle } from "./components/empty-state.js";
|
|
18
22
|
import { Field, FieldDescription, FieldError, FieldHeader, FieldHint, FieldLabel } from "./components/field.js";
|
|
19
23
|
import { IconButton } from "./components/icon-button.js";
|
|
20
|
-
import { Input, fieldClasses } from "./components/input.js";
|
|
21
24
|
import { Kbd, KbdGroup } from "./components/kbd.js";
|
|
22
25
|
import { Label } from "./components/label.js";
|
|
26
|
+
import { NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, navigationMenuTriggerStyle } from "./components/navigation-menu.js";
|
|
23
27
|
import { PageHeader, PageHeaderActions, PageHeaderDescription, PageHeaderEyebrow, PageHeaderMain, PageHeaderTitle } from "./components/page-header.js";
|
|
28
|
+
import { Pagination, paginationRange } from "./components/pagination.js";
|
|
24
29
|
import { Progress } from "./components/progress.js";
|
|
25
30
|
import { RadioGroup, RadioGroupItem } from "./components/radio-group.js";
|
|
26
31
|
import { ScrollArea, ScrollBar } from "./components/scroll-area.js";
|
|
@@ -28,13 +33,14 @@ import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSepa
|
|
|
28
33
|
import { Separator } from "./components/separator.js";
|
|
29
34
|
import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "./components/sheet.js";
|
|
30
35
|
import { Skeleton } from "./components/skeleton.js";
|
|
31
|
-
import { Spinner } from "./components/spinner.js";
|
|
32
36
|
import { StatCard } from "./components/stat-card.js";
|
|
33
37
|
import { Status, StatusDot, statusDotVariants } from "./components/status.js";
|
|
38
|
+
import { Steps } from "./components/steps.js";
|
|
34
39
|
import { Switch } from "./components/switch.js";
|
|
35
40
|
import { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from "./components/table.js";
|
|
36
41
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "./components/tabs.js";
|
|
37
42
|
import { Textarea } from "./components/textarea.js";
|
|
43
|
+
import { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, toastVariants } from "./components/toast.js";
|
|
38
44
|
import { Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer } from "./components/toolbar.js";
|
|
39
45
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./components/tooltip.js";
|
|
40
|
-
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateTitle, Field, FieldDescription, FieldError, FieldHeader, FieldHint, FieldLabel, IconButton, Input, Kbd, KbdGroup, Label, PageHeader, PageHeaderActions, PageHeaderDescription, PageHeaderEyebrow, PageHeaderMain, PageHeaderTitle, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Spinner, StatCard, Status, StatusDot, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, badgeVariants, brand, buttonVariants, cardVariants, cn, dark, fieldClasses, fontMono, fontSans, light, radius, shadow, statusDotVariants, surfaceClasses, tokens };
|
|
46
|
+
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AppShell, AppShellBody, AppShellContent, AppShellHeader, AppShellMain, AppShellSidebar, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Card, CardAction, CardContent, CardDescription, CardEyebrow, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIcon, EmptyStateTitle, Field, FieldDescription, FieldError, FieldHeader, FieldHint, FieldLabel, IconButton, Input, Kbd, KbdGroup, Label, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, PageHeader, PageHeaderActions, PageHeaderDescription, PageHeaderEyebrow, PageHeaderMain, PageHeaderTitle, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, Spinner, StatCard, Status, StatusDot, Steps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport, Toolbar, ToolbarGroup, ToolbarSeparator, ToolbarSpacer, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, badgeVariants, brand, buttonVariants, cardVariants, cn, dark, fieldClasses, fontMono, fontSans, light, navigationMenuTriggerStyle, paginationRange, radius, shadow, statusDotVariants, surfaceClasses, toastVariants, tokens };
|
package/dist/styles.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
|
-
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-6xl:3.75rem;--text-6xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-xs:.375rem;--radius-sm:.5rem;--radius-md:.625rem;--radius-lg:.75rem;--radius-xl:1rem;--shadow-xs:0 1px 2px #0a080e0d;--shadow-sm:0 1px 3px #0a080e14, 0 1px 2px #0a080e0d;--shadow-md:0 10px 30px #0a080e1a, 0 2px 8px #0a080e0f;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0, 0, .2, 1) infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-md:12px;--blur-xl:24px;--blur-3xl:64px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-background:var(--background);--color-foreground:var(--foreground);--color-border:var(--border);--color-ring:var(--ring);--color-brand:var(--brand);--shadow-focus:0 0 0 3px var(--ring)}@supports (color:color-mix(in lab, red, red)){:root,:host{--shadow-focus:0 0 0 3px color-mix(in srgb, var(--ring) 22%, transparent)}}:root,:host{--animate-in:bl-in .16s cubic-bezier(.16, 1, .3, 1);--animate-out:bl-out .12s ease-in forwards;--animate-sheet-in:bl-sheet-in .22s cubic-bezier(.16, 1, .3, 1);--animate-sheet-out:bl-sheet-out .16s ease-in forwards;--animate-accordion-down:bl-accordion-down .18s ease-out;--animate-accordion-up:bl-accordion-up .16s ease-out;--animate-collapsible-down:bl-collapsible-down .18s ease-out;--animate-collapsible-up:bl-collapsible-up .16s ease-out}}@layer base{*{border-color:var(--color-border)}:focus-visible{outline-color:var(--color-ring)}html,body{background:var(--color-background);color:var(--color-foreground)}body{font-family:var(--font-sans)}::selection{background:var(--color-brand)}@supports (color:color-mix(in lab, red, red)){::selection{background:color-mix(in srgb, var(--color-brand) 28%, transparent)}}[data-slot],[data-slot] *,[data-slot]:before,[data-slot]:after{box-sizing:border-box;border:0 solid}button[data-slot]{font:inherit;cursor:pointer;background-color:#0000}}@layer components;@layer utilities{.\@container{container-type:inline-size}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-y-0{inset-block:0}.-top-40{top:calc(var(--spacing) * -40)}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-3\.5{top:calc(var(--spacing) * 3.5)}.top-14{top:calc(var(--spacing) * 14)}.top-\[20\%\]{top:20%}.-right-40{right:calc(var(--spacing) * -40)}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.right-3\.5{right:calc(var(--spacing) * 3.5)}.-bottom-56{bottom:calc(var(--spacing) * -56)}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.left-2\.5{left:calc(var(--spacing) * 2.5)}.isolate{isolation:isolate}.-z-10{z-index:calc(10 * -1)}.z-10{z-index:10}.z-40{z-index:40}.z-50{z-index:50}.col-span-2{grid-column:span 2/span 2}.col-span-full{grid-column:1/-1}.col-start-1{grid-column-start:1}.col-start-2{grid-column-start:2}.row-span-2{grid-row:span 2/span 2}.row-start-1{grid-row-start:1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-1{margin-inline:var(--spacing)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-2{margin-block:calc(var(--spacing) * 2)}.my-4{margin-block:calc(var(--spacing) * 4)}.-mt-4{margin-top:calc(var(--spacing) * -4)}.mt-1{margin-top:var(--spacing)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-14{margin-top:calc(var(--spacing) * 14)}.mt-16{margin-top:calc(var(--spacing) * 16)}.mt-auto{margin-top:auto}.mb-0\.5{margin-bottom:calc(var(--spacing) * .5)}.mb-1{margin-bottom:var(--spacing)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-5{margin-bottom:calc(var(--spacing) * 5)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.table-caption{display:table-caption}.table-cell{display:table-cell}.table-row{display:table-row}.aspect-square{aspect-ratio:1}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-3\.5{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-28{width:calc(var(--spacing) * 28);height:calc(var(--spacing) * 28)}.size-\[42rem\]{width:42rem;height:42rem}.size-\[46rem\]{width:46rem;height:46rem}.size-\[180px\]{width:180px;height:180px}.size-full{width:100%;height:100%}.h-\(--radix-select-trigger-height\){height:var(--radix-select-trigger-height)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-12{height:calc(var(--spacing) * 12)}.h-14{height:calc(var(--spacing) * 14)}.h-56{height:calc(var(--spacing) * 56)}.h-80{height:calc(var(--spacing) * 80)}.h-\[630px\]{height:630px}.h-\[calc\(100dvh-3\.5rem\)\]{height:calc(100dvh - 3.5rem)}.h-\[calc\(100dvh-4rem\)\]{height:calc(100dvh - 4rem)}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.max-h-\(--radix-dropdown-menu-content-available-height\){max-height:var(--radix-dropdown-menu-content-available-height)}.max-h-\(--radix-select-content-available-height\){max-height:var(--radix-select-content-available-height)}.max-h-80{max-height:calc(var(--spacing) * 80)}.min-h-0{min-height:0}.min-h-8{min-height:calc(var(--spacing) * 8)}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-56{min-height:calc(var(--spacing) * 56)}.min-h-64{min-height:calc(var(--spacing) * 64)}.min-h-72{min-height:calc(var(--spacing) * 72)}.min-h-80{min-height:calc(var(--spacing) * 80)}.min-h-dvh{min-height:100dvh}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3\/4{width:75%}.w-9{width:calc(var(--spacing) * 9)}.w-40{width:calc(var(--spacing) * 40)}.w-48{width:calc(var(--spacing) * 48)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-\[470px\]{width:470px}.w-\[560px\]{width:560px}.w-\[1200px\]{width:1200px}.w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.w-fit{width:fit-content}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[1600px\]{max-width:1600px}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.max-w-xs{max-width:var(--container-xs)}.min-w-\(--radix-select-trigger-width\){min-width:var(--radix-select-trigger-width)}.min-w-0{min-width:0}.min-w-2{min-width:calc(var(--spacing) * 2)}.min-w-5{min-width:calc(var(--spacing) * 5)}.min-w-\[8rem\]{min-width:8rem}.flex-1{flex:1}.shrink-0{flex-shrink:0}.caption-bottom{caption-side:bottom}.origin-\(--radix-dropdown-menu-content-transform-origin\){transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.origin-\(--radix-popover-content-transform-origin\){transform-origin:var(--radix-popover-content-transform-origin)}.origin-\(--radix-select-content-transform-origin\){transform-origin:var(--radix-select-content-transform-origin)}.origin-\(--radix-tooltip-content-transform-origin\){transform-origin:var(--radix-tooltip-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0\.5{--tw-translate-y:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-accordion-down{animation:.18s ease-out bl-accordion-down}.animate-accordion-up{animation:.16s ease-out bl-accordion-up}.animate-collapsible-down{animation:.18s ease-out bl-collapsible-down}.animate-collapsible-up{animation:.16s ease-out bl-collapsible-up}.animate-in{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.animate-out{animation:.12s ease-in forwards bl-out}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.animate-sheet-in{animation:.22s cubic-bezier(.16,1,.3,1) bl-sheet-in}.animate-sheet-out{animation:.16s ease-in forwards bl-sheet-out}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.touch-none{touch-action:none}.resize-y{resize:vertical}.scroll-my-1{scroll-margin-block:var(--spacing)}.scroll-py-1{scroll-padding-block:var(--spacing)}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-\[1fr_auto\]{grid-template-columns:1fr auto}.grid-cols-\[180px_1fr\]{grid-template-columns:180px 1fr}.grid-cols-\[auto_1fr\]{grid-template-columns:auto 1fr}.grid-rows-\[auto_1fr\]{grid-template-rows:auto 1fr}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.place-content-center{place-content:center}.place-items-center{place-items:center}.content-center{align-content:center}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0{gap:0}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-10{gap:calc(var(--spacing) * 10)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-3{column-gap:calc(var(--spacing) * 3)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.gap-y-1{row-gap:var(--spacing)}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded-\[inherit\]{border-radius:inherit}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:.75rem}.rounded-md{border-radius:.625rem}.rounded-none{border-radius:0}.rounded-sm{border-radius:.5rem}.rounded-xl{border-radius:1rem}.rounded-xs{border-radius:.375rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-border{border-color:var(--border)}.border-border-strong{border-color:var(--border-strong)}.border-border\/70{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/70{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.border-brand,.border-brand\/15{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/15{border-color:color-mix(in oklab, var(--brand) 15%, transparent)}}.border-brand\/20{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/20{border-color:color-mix(in oklab, var(--brand) 20%, transparent)}}.border-brand\/25{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/25{border-color:color-mix(in oklab, var(--brand) 25%, transparent)}}.border-current{border-color:currentColor}.border-destructive,.border-destructive\/20{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/20{border-color:color-mix(in oklab, var(--destructive) 20%, transparent)}}.border-destructive\/25{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/25{border-color:color-mix(in oklab, var(--destructive) 25%, transparent)}}.border-info\/20{border-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.border-info\/20{border-color:color-mix(in oklab, var(--info) 20%, transparent)}}.border-info\/25{border-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.border-info\/25{border-color:color-mix(in oklab, var(--info) 25%, transparent)}}.border-input{border-color:var(--input)}.border-primary{border-color:var(--primary)}.border-success\/20{border-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.border-success\/20{border-color:color-mix(in oklab, var(--success) 20%, transparent)}}.border-success\/25{border-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.border-success\/25{border-color:color-mix(in oklab, var(--success) 25%, transparent)}}.border-transparent{border-color:#0000}.border-warning\/20{border-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.border-warning\/20{border-color:color-mix(in oklab, var(--warning) 20%, transparent)}}.border-warning\/25{border-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.border-warning\/25{border-color:color-mix(in oklab, var(--warning) 25%, transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-t-transparent{border-top-color:#0000}.border-r-transparent{border-right-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-accent{background-color:var(--accent)}.bg-background,.bg-background\/80{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/80{background-color:color-mix(in oklab, var(--background) 80%, transparent)}}.bg-background\/90{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/90{background-color:color-mix(in oklab, var(--background) 90%, transparent)}}.bg-black\/55{background-color:#0000008c}@supports (color:color-mix(in lab, red, red)){.bg-black\/55{background-color:color-mix(in oklab, var(--color-black) 55%, transparent)}}.bg-border{background-color:var(--border)}.bg-border-strong{background-color:var(--border-strong)}.bg-brand{background-color:var(--brand)}.bg-brand-soft,.bg-brand-soft\/70{background-color:var(--brand-soft)}@supports (color:color-mix(in lab, red, red)){.bg-brand-soft\/70{background-color:color-mix(in oklab, var(--brand-soft) 70%, transparent)}}.bg-brand\/15{background-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.bg-brand\/15{background-color:color-mix(in oklab, var(--brand) 15%, transparent)}}.bg-brand\/20{background-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.bg-brand\/20{background-color:color-mix(in oklab, var(--brand) 20%, transparent)}}.bg-card{background-color:var(--card)}.bg-code{background-color:var(--code)}.bg-destructive,.bg-destructive\/10{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.bg-destructive\/10{background-color:color-mix(in oklab, var(--destructive) 10%, transparent)}}.bg-foreground,.bg-foreground\/\[0\.06\]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.bg-foreground\/\[0\.06\]{background-color:color-mix(in oklab, var(--foreground) 6%, transparent)}}.bg-info,.bg-info\/10{background-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.bg-info\/10{background-color:color-mix(in oklab, var(--info) 10%, transparent)}}.bg-muted{background-color:var(--muted)}.bg-muted-foreground{background-color:var(--muted-foreground)}.bg-muted\/40{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/40{background-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-success,.bg-success\/10{background-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.bg-success\/10{background-color:color-mix(in oklab, var(--success) 10%, transparent)}}.bg-surface{background-color:var(--surface)}.bg-surface-muted,.bg-surface-muted\/55{background-color:var(--surface-muted)}@supports (color:color-mix(in lab, red, red)){.bg-surface-muted\/55{background-color:color-mix(in oklab, var(--surface-muted) 55%, transparent)}}.bg-surface-muted\/60{background-color:var(--surface-muted)}@supports (color:color-mix(in lab, red, red)){.bg-surface-muted\/60{background-color:color-mix(in oklab, var(--surface-muted) 60%, transparent)}}.bg-surface-raised{background-color:var(--surface-raised)}.bg-transparent{background-color:#0000}.bg-warning,.bg-warning\/10{background-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.bg-warning\/10{background-color:color-mix(in oklab, var(--warning) 10%, transparent)}}.fill-code{fill:var(--code)}.object-cover{object-fit:cover}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-16{padding:calc(var(--spacing) * 16)}.p-px{padding:1px}.px-0{padding-inline:0}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-16{padding-block:calc(var(--spacing) * 16)}.pt-0{padding-top:0}.pt-1{padding-top:var(--spacing)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-7{padding-right:calc(var(--spacing) * 7)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-1{padding-bottom:var(--spacing)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pb-16{padding-bottom:calc(var(--spacing) * 16)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-mono{font-family:JetBrains Mono,SFMono-Regular,Consolas,Liberation Mono,monospace}.font-sans{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[11\.5px\]{font-size:11.5px}.text-\[11px\]{font-size:11px}.text-\[12\.5px\]{font-size:12.5px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-\[1\.02\]{--tw-leading:1.02;line-height:1.02}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-0\.01em\]{--tw-tracking:-.01em;letter-spacing:-.01em}.tracking-\[-0\.02em\]{--tw-tracking:-.02em;letter-spacing:-.02em}.tracking-\[-0\.015em\]{--tw-tracking:-.015em;letter-spacing:-.015em}.tracking-\[-0\.025em\]{--tw-tracking:-.025em;letter-spacing:-.025em}.tracking-\[-0\.035em\]{--tw-tracking:-.035em;letter-spacing:-.035em}.tracking-\[0\.2em\]{--tw-tracking:.2em;letter-spacing:.2em}.tracking-\[0\.06em\]{--tw-tracking:.06em;letter-spacing:.06em}.tracking-\[0\.08em\]{--tw-tracking:.08em;letter-spacing:.08em}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.text-balance{text-wrap:balance}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.text-accent-foreground{color:var(--accent-foreground)}.text-brand{color:var(--brand)}.text-brand-soft-foreground{color:var(--brand-soft-foreground)}.text-card-foreground{color:var(--card-foreground)}.text-code-foreground{color:var(--code-foreground)}.text-current{color:currentColor}.text-destructive{color:var(--destructive)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground{color:var(--foreground)}.text-info{color:var(--info)}.text-muted-foreground{color:var(--muted-foreground)}.text-popover-foreground{color:var(--popover-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.accent-foreground{accent-color:var(--foreground)}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_1px_2px_rgb\(68_8_94_\/_0\.18\)\]{--tw-shadow:0 1px 2px var(--tw-shadow-color,#44085e2e);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_16px_48px_rgb\(0_0_0_\/_0\.18\)\]{--tw-shadow:0 16px 48px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_24px_80px_rgb\(0_0_0_\/_0\.28\)\]{--tw-shadow:0 24px 80px var(--tw-shadow-color,#00000047);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[inset_2px_0_0_var\(--color-brand\)\]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 10px 30px var(--tw-shadow-color,#0a080e1a), 0 2px 8px var(--tw-shadow-color,#0a080e0f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px var(--tw-shadow-color,#0a080e14), 0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-current\/10{--tw-ring-color:currentcolor}@supports (color:color-mix(in lab, red, red)){.ring-current\/10{--tw-ring-color:color-mix(in oklab, currentcolor 10%, transparent)}}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur-3xl{--tw-blur:blur(var(--blur-3xl));filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.backdrop-blur-\[3px\]{--tw-backdrop-blur:blur(3px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-xl{--tw-backdrop-blur:blur(var(--blur-xl));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition-\[background-color\,border-color\,color\,box-shadow\,transform\]{transition-property:background-color,border-color,color,box-shadow,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,box-shadow\]{transition-property:background-color,color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,background-color\,box-shadow\,transform\]{transition-property:border-color,background-color,box-shadow,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,box-shadow\,background-color\]{transition-property:border-color,box-shadow,background-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,box-shadow\]{transition-property:border-color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.\[--bl-sheet-from\:-100\%\]{--bl-sheet-from:-100%}.\[--bl-sheet-from\:100\%\]{--bl-sheet-from:100%}.group-data-\[density\=compact\]\/table\:h-8:is(:where(.group\/table)[data-density=compact] *){height:calc(var(--spacing) * 8)}.group-data-\[disabled\=true\]\:pointer-events-none:is(:where(.group)[data-disabled=true] *){pointer-events:none}.group-data-\[disabled\=true\]\:opacity-50:is(:where(.group)[data-disabled=true] *){opacity:.5}.group-data-\[sticky\]\/table\:sticky:is(:where(.group\/table)[data-sticky] *){position:sticky}.group-data-\[sticky\]\/table\:top-0:is(:where(.group\/table)[data-sticky] *){top:0}.group-data-\[sticky\]\/table\:z-10:is(:where(.group\/table)[data-sticky] *){z-index:10}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-50:is(:where(.peer):disabled~*){opacity:.5}.file\:mr-3::file-selector-button{margin-right:calc(var(--spacing) * 3)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-semibold::file-selector-button{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.file\:text-foreground::file-selector-button{color:var(--foreground)}.placeholder\:text-muted-foreground::placeholder,.placeholder\:text-muted-foreground\/80::placeholder{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.placeholder\:text-muted-foreground\/80::placeholder{color:color-mix(in oklab, var(--muted-foreground) 80%, transparent)}}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-border-strong:hover{border-color:var(--border-strong)}.hover\:border-brand-hover:hover{border-color:var(--brand-hover)}.hover\:border-brand\/30:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/30:hover{border-color:color-mix(in oklab, var(--brand) 30%, transparent)}}.hover\:border-brand\/35:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/35:hover{border-color:color-mix(in oklab, var(--brand) 35%, transparent)}}.hover\:border-brand\/50:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/50:hover{border-color:color-mix(in oklab, var(--brand) 50%, transparent)}}.hover\:bg-accent:hover,.hover\:bg-accent\/60:hover{background-color:var(--accent)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-accent\/60:hover{background-color:color-mix(in oklab, var(--accent) 60%, transparent)}}.hover\:bg-brand-hover:hover{background-color:var(--brand-hover)}.hover\:bg-brand\/15:hover{background-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-brand\/15:hover{background-color:color-mix(in oklab, var(--brand) 15%, transparent)}}.hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--destructive) 90%, transparent)}}.hover\:bg-muted:hover,.hover\:bg-muted\/60:hover{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/60:hover{background-color:color-mix(in oklab, var(--muted) 60%, transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:text-brand:hover{color:var(--brand)}.hover\:text-brand-hover:hover{color:var(--brand-hover)}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:underline-offset-4:hover{text-underline-offset:4px}.hover\:shadow-md:hover{--tw-shadow:0 10px 30px var(--tw-shadow-color,#0a080e1a), 0 2px 8px var(--tw-shadow-color,#0a080e0f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:not-sr-only:focus{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.focus\:fixed:focus{position:fixed}.focus\:top-2:focus{top:calc(var(--spacing) * 2)}.focus\:left-2:focus{left:calc(var(--spacing) * 2)}.focus\:z-50:focus{z-index:50}.focus\:rounded-md:focus{border-radius:.625rem}.focus\:bg-background:focus{background-color:var(--background)}.focus\:bg-muted:focus{background-color:var(--muted)}.focus\:px-3:focus{padding-inline:calc(var(--spacing) * 3)}.focus\:py-2:focus{padding-block:calc(var(--spacing) * 2)}.focus\:text-foreground:focus{color:var(--foreground)}.focus-visible\:border-brand:focus-visible{border-color:var(--brand)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-ring\/15:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/15:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 15%, transparent)}}.focus-visible\:ring-ring\/20:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/20:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 20%, transparent)}}.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 50%, transparent)}}.active\:translate-y-0:active{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.active\:translate-y-px:active{--tw-translate-y:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-muted:disabled{background-color:var(--muted)}.disabled\:opacity-45:disabled{opacity:.45}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.aria-invalid\:border-destructive[aria-invalid=true]{border-color:var(--destructive)}.aria-invalid\:ring-destructive\/15[aria-invalid=true]{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:ring-destructive\/15[aria-invalid=true]{--tw-ring-color:color-mix(in oklab, var(--destructive) 15%, transparent)}}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[disabled\=true\]\:pointer-events-none[data-disabled=true]{pointer-events:none}.data-\[disabled\=true\]\:opacity-50[data-disabled=true]{opacity:.5}.data-\[inset\]\:pl-8[data-inset]{padding-left:calc(var(--spacing) * 8)}.data-\[orientation\=horizontal\]\:h-px[data-orientation=horizontal]{height:1px}.data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.data-\[orientation\=vertical\]\:w-px[data-orientation=vertical]{width:1px}.data-\[placeholder\]\:text-muted-foreground[data-placeholder]{color:var(--muted-foreground)}.data-\[selected\=true\]\:bg-muted[data-selected=true]{background-color:var(--muted)}.data-\[selected\=true\]\:text-foreground[data-selected=true]{color:var(--foreground)}.data-\[selected\=true\]\:shadow-\[inset_2px_0_0_var\(--color-brand\)\][data-selected=true]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[size\=default\]\:h-9[data-size=default]{height:calc(var(--spacing) * 9)}.data-\[size\=sm\]\:h-8[data-size=sm]{height:calc(var(--spacing) * 8)}:is(.\*\:data-\[slot\=select-value\]\:line-clamp-1>*)[data-slot=select-value]{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}:is(.\*\:data-\[slot\=select-value\]\:flex>*)[data-slot=select-value]{display:flex}:is(.\*\:data-\[slot\=select-value\]\:items-center>*)[data-slot=select-value]{align-items:center}:is(.\*\:data-\[slot\=select-value\]\:gap-2>*)[data-slot=select-value]{gap:calc(var(--spacing) * 2)}.data-\[state\=active\]\:bg-surface[data-state=active]{background-color:var(--surface)}.data-\[state\=active\]\:text-foreground[data-state=active]{color:var(--foreground)}.data-\[state\=active\]\:shadow-xs[data-state=active]{--tw-shadow:0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=checked\]\:translate-x-\[calc\(100\%-1px\)\][data-state=checked]{--tw-translate-x:calc(100% - 1px);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-primary[data-state=checked]{border-color:var(--primary)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--primary)}.data-\[state\=checked\]\:font-semibold[data-state=checked]{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.data-\[state\=checked\]\:text-primary-foreground[data-state=checked]{color:var(--primary-foreground)}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:.16s ease-out bl-accordion-up}.data-\[state\=closed\]\:animate-collapsible-up[data-state=closed]{animation:.16s ease-out bl-collapsible-up}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation:.12s ease-in forwards bl-out}.data-\[state\=closed\]\:animate-sheet-out[data-state=closed]{animation:.16s ease-in forwards bl-sheet-out}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:.18s ease-out bl-accordion-down}.data-\[state\=open\]\:animate-collapsible-down[data-state=open]{animation:.18s ease-out bl-collapsible-down}.data-\[state\=open\]\:animate-in[data-state=open]{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.data-\[state\=open\]\:animate-sheet-in[data-state=open]{animation:.22s cubic-bezier(.16,1,.3,1) bl-sheet-in}.data-\[state\=open\]\:bg-muted[data-state=open]{background-color:var(--muted)}.data-\[state\=selected\]\:bg-brand-soft\/60[data-state=selected]{background-color:var(--brand-soft)}@supports (color:color-mix(in lab, red, red)){.data-\[state\=selected\]\:bg-brand-soft\/60[data-state=selected]{background-color:color-mix(in oklab, var(--brand-soft) 60%, transparent)}}.data-\[state\=selected\]\:shadow-\[inset_2px_0_0_var\(--color-brand\)\][data-state=selected]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=unchecked\]\:translate-x-px[data-state=unchecked]{--tw-translate-x:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-border-strong[data-state=unchecked]{background-color:var(--border-strong)}.data-\[variant\=destructive\]\:text-destructive[data-variant=destructive]{color:var(--destructive)}.data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--destructive) 10%, transparent)}}@media (prefers-reduced-motion:reduce){.motion-reduce\:hidden{display:none}}@media (min-width:40rem){.sm\:max-w-sm{max-width:var(--container-sm)}.sm\:max-w-xl{max-width:var(--container-xl)}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-end{align-items:flex-end}.sm\:justify-between{justify-content:space-between}.sm\:justify-end{justify-content:flex-end}.sm\:p-0{padding:0}.sm\:p-6{padding:calc(var(--spacing) * 6)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-24{padding-block:calc(var(--spacing) * 24)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-6xl{font-size:var(--text-6xl);line-height:var(--tw-leading,var(--text-6xl--line-height))}}@media (min-width:48rem){.md\:col-span-2{grid-column:span 2/span 2}.md\:flex{display:flex}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:64rem){.lg\:block{display:block}.lg\:hidden{display:none}}@container (min-width:28rem){.\@md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.dark\:bg-surface-raised:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *){background-color:var(--surface-raised)}.dark\:data-\[state\=checked\]\:bg-primary-foreground:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=checked]{background-color:var(--primary-foreground)}.dark\:data-\[state\=unchecked\]\:bg-foreground\/80:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=unchecked]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark\:data-\[state\=unchecked\]\:bg-foreground\/80:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=unchecked]{background-color:color-mix(in oklab, var(--foreground) 80%, transparent)}}.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading]{padding-block:calc(var(--spacing) * 1.5)}.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading]{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading]{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading]{color:var(--muted-foreground)}.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-item\]\]\:py-2 [cmdk-item]{padding-block:calc(var(--spacing) * 2)}.\[\&_\[data-slot\=card-content\]\]\:px-4 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-content\]\]\:px-5 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-content\]\]\:px-6 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 6)}.\[\&_\[data-slot\=card-footer\]\]\:p-4 [data-slot=card-footer]{padding:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-footer\]\]\:p-5 [data-slot=card-footer]{padding:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-footer\]\]\:p-6 [data-slot=card-footer]{padding:calc(var(--spacing) * 6)}.\[\&_\[data-slot\=card-header\]\]\:p-4 [data-slot=card-header]{padding:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-header\]\]\:p-5 [data-slot=card-header]{padding:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-header\]\]\:p-6 [data-slot=card-header]{padding:calc(var(--spacing) * 6)}.\[\&_code\]\:font-mono code{font-family:JetBrains Mono,SFMono-Regular,Consolas,Liberation Mono,monospace}.\[\&_code\]\:text-foreground code{color:var(--foreground)}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-3 svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\]\:size-3\.5 svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:size-4\.5 svg{width:calc(var(--spacing) * 4.5);height:calc(var(--spacing) * 4.5)}.\[\&_svg\]\:size-5 svg{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*=text-]){color:var(--muted-foreground)}.\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3\.5 svg:not([class*=size-]){width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_tr\]\:border-b tr{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-style:var(--tw-border-style);border-width:0}.\[\&\:has\(\[role\=checkbox\]\)\]\:w-10:has([role=checkbox]){width:calc(var(--spacing) * 10)}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}:is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive[data-variant=destructive]>*):is(svg){color:var(--destructive)!important}.\[\&\>svg\]\:mt-0\.5>svg{margin-top:calc(var(--spacing) * .5)}.\[\&\>svg\]\:size-3>svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&\>svg\]\:size-3\.5>svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&\>svg\]\:size-4>svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&\>svg\]\:text-brand>svg{color:var(--brand)}.\[\&\>svg\]\:text-destructive>svg{color:var(--destructive)}.\[\&\>svg\]\:text-info>svg{color:var(--info)}.\[\&\>svg\]\:text-muted-foreground>svg{color:var(--muted-foreground)}.\[\&\>svg\]\:text-success>svg{color:var(--success)}.\[\&\>svg\]\:text-warning>svg{color:var(--warning)}.\[\&\>tr\]\:last\:border-b-0>tr:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}}:root{--background:#fbfafc;--foreground:#17131c;--surface:#fff;--surface-raised:#fff;--surface-muted:#f7f4f9;--card:#fff;--card-foreground:#17131c;--popover:#fff;--popover-foreground:#17131c;--primary:#8f0bc7;--primary-foreground:#fff;--secondary:#f1edf4;--secondary-foreground:#29212f;--muted:#f4f1f6;--muted-foreground:#6c6472;--accent:#f3e7fb;--accent-foreground:#561071;--destructive:#c92d3f;--destructive-foreground:#fff;--success:#0e7a56;--success-foreground:#fff;--warning:#9b5c08;--warning-foreground:#fff;--info:#2563eb;--info-foreground:#fff;--border:#e5dfe8;--border-strong:#cfc5d5;--input:#d8cfdd;--ring:#a60ee5;--brand:#a60ee5;--brand-hover:#8f0bc7;--brand-soft:#f5e8fc;--brand-soft-foreground:#5b1476;--code:#18141d;--code-foreground:#f5f0f7;--radius:.625rem;color-scheme:light}.dark,[data-theme=dark]{--background:#0d0d12;--foreground:#f2eef5;--surface:#121218;--surface-raised:#18171f;--surface-muted:#17151c;--card:#14131a;--card-foreground:#f2eef5;--popover:#18171f;--popover-foreground:#f2eef5;--primary:#b836ed;--primary-foreground:#fff;--secondary:#211e28;--secondary-foreground:#e7e0eb;--muted:#1b1921;--muted-foreground:#a49ca9;--accent:#291734;--accent-foreground:#efd7fa;--destructive:#ef5b65;--destructive-foreground:#1b090b;--success:#36c58d;--success-foreground:#07160f;--warning:#f3b24c;--warning-foreground:#201304;--info:#6ea8ff;--info-foreground:#071226;--border:#2a2732;--border-strong:#403a49;--input:#34303d;--ring:#c65ef1;--brand:#c65ef1;--brand-hover:#d384f3;--brand-soft:#291734;--brand-soft-foreground:#efd7fa;--code:#09090d;--code-foreground:#f5f0f7;color-scheme:dark}@keyframes bl-in{0%{opacity:0;transform:scale(.97)translateY(2px)}}@keyframes bl-out{to{opacity:0;transform:scale(.97)}}@keyframes bl-sheet-in{0%{transform:translateX(var(--bl-sheet-from,100%))}}@keyframes bl-sheet-out{to{transform:translateX(var(--bl-sheet-from,100%))}}@keyframes bl-accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes bl-accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}@keyframes bl-collapsible-down{0%{height:0}to{height:var(--radix-collapsible-content-height)}}@keyframes bl-collapsible-up{0%{height:var(--radix-collapsible-content-height)}to{height:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}
|
|
2
|
+
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-3xl:48rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-xs:.375rem;--radius-sm:.5rem;--radius-md:.625rem;--radius-lg:.75rem;--radius-xl:1rem;--shadow-xs:0 1px 2px #0a080e0d;--shadow-sm:0 1px 3px #0a080e14, 0 1px 2px #0a080e0d;--shadow-md:0 10px 30px #0a080e1a, 0 2px 8px #0a080e0f;--ease-in:cubic-bezier(.4, 0, 1, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0, 0, .2, 1) infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-md:12px;--blur-xl:24px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-background:var(--background);--color-foreground:var(--foreground);--color-border:var(--border);--color-ring:var(--ring);--color-brand:var(--brand);--shadow-focus:0 0 0 3px var(--ring)}@supports (color:color-mix(in lab, red, red)){:root,:host{--shadow-focus:0 0 0 3px color-mix(in srgb, var(--ring) 22%, transparent)}}:root,:host{--animate-in:bl-in .16s cubic-bezier(.16, 1, .3, 1);--animate-out:bl-out .12s ease-in forwards;--animate-sheet-in:bl-sheet-in .22s cubic-bezier(.16, 1, .3, 1);--animate-sheet-out:bl-sheet-out .16s ease-in forwards;--animate-accordion-down:bl-accordion-down .18s ease-out;--animate-accordion-up:bl-accordion-up .16s ease-out;--animate-collapsible-down:bl-collapsible-down .18s ease-out;--animate-collapsible-up:bl-collapsible-up .16s ease-out}}@layer base{*{border-color:var(--color-border)}:focus-visible{outline-color:var(--color-ring)}html,body{background:var(--color-background);color:var(--color-foreground)}body{font-family:var(--font-sans)}::selection{background:var(--color-brand)}@supports (color:color-mix(in lab, red, red)){::selection{background:color-mix(in srgb, var(--color-brand) 28%, transparent)}}[data-slot],[data-slot] *,[data-slot]:before,[data-slot]:after{box-sizing:border-box;border:0 solid}button[data-slot]{font:inherit;cursor:pointer;background-color:#0000}}@layer components;@layer utilities{.\@container{container-type:inline-size}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:0}.inset-y-0{inset-block:0}.top-0{top:0}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-3{top:calc(var(--spacing) * 3)}.top-3\.5{top:calc(var(--spacing) * 3.5)}.top-14{top:calc(var(--spacing) * 14)}.top-\[20\%\]{top:20%}.top-\[60\%\]{top:60%}.top-full{top:100%}.top-px{top:1px}.right-0{right:0}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-3\.5{right:calc(var(--spacing) * 3.5)}.bottom-0{bottom:0}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.left-2\.5{left:calc(var(--spacing) * 2.5)}.z-10{z-index:10}.z-40{z-index:40}.z-50{z-index:50}.z-\[1\]{z-index:1}.z-\[100\]{z-index:100}.col-span-2{grid-column:span 2/span 2}.col-span-full{grid-column:1/-1}.col-start-1{grid-column-start:1}.col-start-2{grid-column-start:2}.row-span-2{grid-row:span 2/span 2}.row-start-1{grid-row-start:1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-1{margin-inline:var(--spacing)}.mx-auto{margin-inline:auto}.my-1{margin-block:var(--spacing)}.my-2{margin-block:calc(var(--spacing) * 2)}.my-4{margin-block:calc(var(--spacing) * 4)}.-mt-4{margin-top:calc(var(--spacing) * -4)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-16{margin-top:calc(var(--spacing) * 16)}.mt-20{margin-top:calc(var(--spacing) * 20)}.mt-auto{margin-top:auto}.mb-0\.5{margin-bottom:calc(var(--spacing) * .5)}.mb-1{margin-bottom:var(--spacing)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.mb-8{margin-bottom:calc(var(--spacing) * 8)}.ml-4{margin-left:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.table{display:table}.table-caption{display:table-caption}.table-cell{display:table-cell}.table-row{display:table-row}.aspect-square{aspect-ratio:1}.size-2{width:calc(var(--spacing) * 2);height:calc(var(--spacing) * 2)}.size-3{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.size-3\.5{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.size-6{width:calc(var(--spacing) * 6);height:calc(var(--spacing) * 6)}.size-7{width:calc(var(--spacing) * 7);height:calc(var(--spacing) * 7)}.size-8{width:calc(var(--spacing) * 8);height:calc(var(--spacing) * 8)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.size-10{width:calc(var(--spacing) * 10);height:calc(var(--spacing) * 10)}.size-12{width:calc(var(--spacing) * 12);height:calc(var(--spacing) * 12)}.size-28{width:calc(var(--spacing) * 28);height:calc(var(--spacing) * 28)}.size-\[180px\]{width:180px;height:180px}.size-full{width:100%;height:100%}.h-\(--radix-navigation-menu-viewport-height\){height:var(--radix-navigation-menu-viewport-height)}.h-\(--radix-select-trigger-height\){height:var(--radix-select-trigger-height)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-12{height:calc(var(--spacing) * 12)}.h-14{height:calc(var(--spacing) * 14)}.h-56{height:calc(var(--spacing) * 56)}.h-80{height:calc(var(--spacing) * 80)}.h-\[630px\]{height:630px}.h-\[calc\(100dvh-3\.5rem\)\]{height:calc(100dvh - 3.5rem)}.h-\[calc\(100dvh-4rem\)\]{height:calc(100dvh - 4rem)}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.max-h-\(--radix-dropdown-menu-content-available-height\){max-height:var(--radix-dropdown-menu-content-available-height)}.max-h-\(--radix-select-content-available-height\){max-height:var(--radix-select-content-available-height)}.max-h-80{max-height:calc(var(--spacing) * 80)}.max-h-dvh{max-height:100dvh}.min-h-0{min-height:0}.min-h-8{min-height:calc(var(--spacing) * 8)}.min-h-10{min-height:calc(var(--spacing) * 10)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-56{min-height:calc(var(--spacing) * 56)}.min-h-64{min-height:calc(var(--spacing) * 64)}.min-h-72{min-height:calc(var(--spacing) * 72)}.min-h-80{min-height:calc(var(--spacing) * 80)}.min-h-dvh{min-height:100dvh}.w-\(--radix-popover-trigger-width\){width:var(--radix-popover-trigger-width)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3\/4{width:75%}.w-9{width:calc(var(--spacing) * 9)}.w-40{width:calc(var(--spacing) * 40)}.w-48{width:calc(var(--spacing) * 48)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-\[22rem\]{width:22rem}.w-\[470px\]{width:470px}.w-\[560px\]{width:560px}.w-\[1200px\]{width:1200px}.w-\[calc\(100\%-2rem\)\]{width:calc(100% - 2rem)}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.w-max{width:max-content}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[1600px\]{max-width:1600px}.max-w-lg{max-width:var(--container-lg)}.max-w-max{max-width:max-content}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.max-w-xs{max-width:var(--container-xs)}.min-w-\(--radix-select-trigger-width\){min-width:var(--radix-select-trigger-width)}.min-w-0{min-width:0}.min-w-2{min-width:calc(var(--spacing) * 2)}.min-w-5{min-width:calc(var(--spacing) * 5)}.min-w-64{min-width:calc(var(--spacing) * 64)}.min-w-\[8rem\]{min-width:8rem}.flex-1{flex:1}.shrink-0{flex-shrink:0}.caption-bottom{caption-side:bottom}.origin-\(--radix-dropdown-menu-content-transform-origin\){transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.origin-\(--radix-popover-content-transform-origin\){transform-origin:var(--radix-popover-content-transform-origin)}.origin-\(--radix-select-content-transform-origin\){transform-origin:var(--radix-select-content-transform-origin)}.origin-\(--radix-tooltip-content-transform-origin\){transform-origin:var(--radix-tooltip-content-transform-origin)}.origin-top{transform-origin:top}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-0\.5{--tw-translate-y:calc(var(--spacing) * .5);translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-45{rotate:45deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-accordion-down{animation:.18s ease-out bl-accordion-down}.animate-accordion-up{animation:.16s ease-out bl-accordion-up}.animate-collapsible-down{animation:.18s ease-out bl-collapsible-down}.animate-collapsible-up{animation:.16s ease-out bl-collapsible-up}.animate-in{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.animate-out{animation:.12s ease-in forwards bl-out}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.animate-sheet-in{animation:.22s cubic-bezier(.16,1,.3,1) bl-sheet-in}.animate-sheet-out{animation:.16s ease-in forwards bl-sheet-out}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.touch-none{touch-action:none}.resize-y{resize:vertical}.scroll-my-1{scroll-margin-block:var(--spacing)}.scroll-py-1{scroll-padding-block:var(--spacing)}.list-none{list-style-type:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-\[1fr_auto\]{grid-template-columns:1fr auto}.grid-cols-\[180px_1fr\]{grid-template-columns:180px 1fr}.grid-cols-\[auto_1fr\]{grid-template-columns:auto 1fr}.grid-rows-\[auto_1fr\]{grid-template-rows:auto 1fr}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.place-content-center{place-content:center}.place-items-center{place-items:center}.content-center{align-content:center}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0{gap:0}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-10{gap:calc(var(--spacing) * 10)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(var(--spacing) * var(--tw-space-y-reverse));margin-block-end:calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-3{column-gap:calc(var(--spacing) * 3)}.gap-x-4{column-gap:calc(var(--spacing) * 4)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-0\.5{row-gap:calc(var(--spacing) * .5)}.gap-y-1{row-gap:var(--spacing)}.self-center{align-self:center}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded-\[inherit\]{border-radius:inherit}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:.75rem}.rounded-md{border-radius:.625rem}.rounded-none{border-radius:0}.rounded-sm{border-radius:.5rem}.rounded-xl{border-radius:1rem}.rounded-xs{border-radius:.375rem}.rounded-tl-sm{border-top-left-radius:.5rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-border{border-color:var(--border)}.border-border-strong{border-color:var(--border-strong)}.border-border\/70{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/70{border-color:color-mix(in oklab, var(--border) 70%, transparent)}}.border-brand,.border-brand\/15{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/15{border-color:color-mix(in oklab, var(--brand) 15%, transparent)}}.border-brand\/20{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/20{border-color:color-mix(in oklab, var(--brand) 20%, transparent)}}.border-brand\/25{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/25{border-color:color-mix(in oklab, var(--brand) 25%, transparent)}}.border-brand\/40{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.border-brand\/40{border-color:color-mix(in oklab, var(--brand) 40%, transparent)}}.border-current{border-color:currentColor}.border-destructive,.border-destructive\/20{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/20{border-color:color-mix(in oklab, var(--destructive) 20%, transparent)}}.border-destructive\/25{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/25{border-color:color-mix(in oklab, var(--destructive) 25%, transparent)}}.border-destructive\/30{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/30{border-color:color-mix(in oklab, var(--destructive) 30%, transparent)}}.border-info\/20{border-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.border-info\/20{border-color:color-mix(in oklab, var(--info) 20%, transparent)}}.border-info\/25{border-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.border-info\/25{border-color:color-mix(in oklab, var(--info) 25%, transparent)}}.border-input{border-color:var(--input)}.border-primary{border-color:var(--primary)}.border-success\/20{border-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.border-success\/20{border-color:color-mix(in oklab, var(--success) 20%, transparent)}}.border-success\/25{border-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.border-success\/25{border-color:color-mix(in oklab, var(--success) 25%, transparent)}}.border-success\/30{border-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.border-success\/30{border-color:color-mix(in oklab, var(--success) 30%, transparent)}}.border-transparent{border-color:#0000}.border-warning\/20{border-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.border-warning\/20{border-color:color-mix(in oklab, var(--warning) 20%, transparent)}}.border-warning\/25{border-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.border-warning\/25{border-color:color-mix(in oklab, var(--warning) 25%, transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.border-white\/10{border-color:color-mix(in oklab, var(--color-white) 10%, transparent)}}.border-t-transparent{border-top-color:#0000}.border-r-transparent{border-right-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-accent{background-color:var(--accent)}.bg-background,.bg-background\/80{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/80{background-color:color-mix(in oklab, var(--background) 80%, transparent)}}.bg-background\/90{background-color:var(--background)}@supports (color:color-mix(in lab, red, red)){.bg-background\/90{background-color:color-mix(in oklab, var(--background) 90%, transparent)}}.bg-black\/55{background-color:#0000008c}@supports (color:color-mix(in lab, red, red)){.bg-black\/55{background-color:color-mix(in oklab, var(--color-black) 55%, transparent)}}.bg-border{background-color:var(--border)}.bg-border-strong{background-color:var(--border-strong)}.bg-brand{background-color:var(--brand)}.bg-brand-soft,.bg-brand-soft\/70{background-color:var(--brand-soft)}@supports (color:color-mix(in lab, red, red)){.bg-brand-soft\/70{background-color:color-mix(in oklab, var(--brand-soft) 70%, transparent)}}.bg-card{background-color:var(--card)}.bg-code{background-color:var(--code)}.bg-destructive,.bg-destructive\/10{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.bg-destructive\/10{background-color:color-mix(in oklab, var(--destructive) 10%, transparent)}}.bg-foreground,.bg-foreground\/\[0\.06\]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.bg-foreground\/\[0\.06\]{background-color:color-mix(in oklab, var(--foreground) 6%, transparent)}}.bg-info,.bg-info\/10{background-color:var(--info)}@supports (color:color-mix(in lab, red, red)){.bg-info\/10{background-color:color-mix(in oklab, var(--info) 10%, transparent)}}.bg-muted{background-color:var(--muted)}.bg-muted-foreground{background-color:var(--muted-foreground)}.bg-muted\/40{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/40{background-color:color-mix(in oklab, var(--muted) 40%, transparent)}}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-success,.bg-success\/10{background-color:var(--success)}@supports (color:color-mix(in lab, red, red)){.bg-success\/10{background-color:color-mix(in oklab, var(--success) 10%, transparent)}}.bg-surface{background-color:var(--surface)}.bg-surface-muted,.bg-surface-muted\/55{background-color:var(--surface-muted)}@supports (color:color-mix(in lab, red, red)){.bg-surface-muted\/55{background-color:color-mix(in oklab, var(--surface-muted) 55%, transparent)}}.bg-surface-muted\/60{background-color:var(--surface-muted)}@supports (color:color-mix(in lab, red, red)){.bg-surface-muted\/60{background-color:color-mix(in oklab, var(--surface-muted) 60%, transparent)}}.bg-surface-raised{background-color:var(--surface-raised)}.bg-transparent{background-color:#0000}.bg-warning,.bg-warning\/10{background-color:var(--warning)}@supports (color:color-mix(in lab, red, red)){.bg-warning\/10{background-color:color-mix(in oklab, var(--warning) 10%, transparent)}}.fill-code{fill:var(--code)}.object-cover{object-fit:cover}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-16{padding:calc(var(--spacing) * 16)}.p-px{padding:1px}.px-0{padding-inline:0}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-3\.5{padding-inline:calc(var(--spacing) * 3.5)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-5{padding-block:calc(var(--spacing) * 5)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-10{padding-block:calc(var(--spacing) * 10)}.py-12{padding-block:calc(var(--spacing) * 12)}.pt-0{padding-top:0}.pt-0\.5{padding-top:calc(var(--spacing) * .5)}.pt-1{padding-top:var(--spacing)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-7{padding-right:calc(var(--spacing) * 7)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pr-10{padding-right:calc(var(--spacing) * 10)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-1{padding-bottom:var(--spacing)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.pb-6{padding-bottom:calc(var(--spacing) * 6)}.pb-16{padding-bottom:calc(var(--spacing) * 16)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.align-middle{vertical-align:middle}.font-mono{font-family:JetBrains Mono,SFMono-Regular,Consolas,Liberation Mono,monospace}.font-sans{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[11\.5px\]{font-size:11.5px}.text-\[11px\]{font-size:11px}.text-\[12\.5px\]{font-size:12.5px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-0\.01em\]{--tw-tracking:-.01em;letter-spacing:-.01em}.tracking-\[-0\.02em\]{--tw-tracking:-.02em;letter-spacing:-.02em}.tracking-\[-0\.015em\]{--tw-tracking:-.015em;letter-spacing:-.015em}.tracking-\[-0\.025em\]{--tw-tracking:-.025em;letter-spacing:-.025em}.tracking-\[-0\.035em\]{--tw-tracking:-.035em;letter-spacing:-.035em}.tracking-\[0\.06em\]{--tw-tracking:.06em;letter-spacing:.06em}.tracking-\[0\.08em\]{--tw-tracking:.08em;letter-spacing:.08em}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.text-balance{text-wrap:balance}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.text-accent-foreground{color:var(--accent-foreground)}.text-brand{color:var(--brand)}.text-brand-soft-foreground{color:var(--brand-soft-foreground)}.text-card-foreground{color:var(--card-foreground)}.text-code-foreground{color:var(--code-foreground)}.text-current{color:currentColor}.text-destructive{color:var(--destructive)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground,.text-foreground\/80{color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.text-foreground\/80{color:color-mix(in oklab, var(--foreground) 80%, transparent)}}.text-info{color:var(--info)}.text-muted-foreground{color:var(--muted-foreground)}.text-popover-foreground{color:var(--popover-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.italic{font-style:italic}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.accent-foreground{accent-color:var(--foreground)}.opacity-0{opacity:0}.opacity-40{opacity:.4}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_1px_2px_rgb\(68_8_94_\/_0\.18\)\]{--tw-shadow:0 1px 2px var(--tw-shadow-color,#44085e2e);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_16px_48px_rgb\(0_0_0_\/_0\.18\)\]{--tw-shadow:0 16px 48px var(--tw-shadow-color,#0000002e);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_24px_80px_rgb\(0_0_0_\/_0\.28\)\]{--tw-shadow:0 24px 80px var(--tw-shadow-color,#00000047);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[inset_2px_0_0_var\(--color-brand\)\]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 10px 30px var(--tw-shadow-color,#0a080e1a), 0 2px 8px var(--tw-shadow-color,#0a080e0f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px var(--tw-shadow-color,#0a080e14), 0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-current\/10{--tw-ring-color:currentcolor}@supports (color:color-mix(in lab, red, red)){.ring-current\/10{--tw-ring-color:color-mix(in oklab, currentcolor 10%, transparent)}}.outline-hidden{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.outline-hidden{outline-offset:2px;outline:2px solid #0000}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.backdrop-blur-\[3px\]{--tw-backdrop-blur:blur(3px);-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.backdrop-blur-xl{--tw-backdrop-blur:blur(var(--blur-xl));-webkit-backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,)}.transition-\[background-color\,border-color\,color\,box-shadow\,transform\]{transition-property:background-color,border-color,color,box-shadow,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[background-color\,color\,box-shadow\]{transition-property:background-color,color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,background-color\,box-shadow\,transform\]{transition-property:border-color,background-color,box-shadow,transform;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,box-shadow\,background-color\]{transition-property:border-color,box-shadow,background-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[border-color\,box-shadow\]{transition-property:border-color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.\[--bl-sheet-from\:-100\%\]{--bl-sheet-from:-100%}.\[--bl-sheet-from\:100\%\]{--bl-sheet-from:100%}.group-data-\[density\=compact\]\/table\:h-8:is(:where(.group\/table)[data-density=compact] *){height:calc(var(--spacing) * 8)}.group-data-\[disabled\=true\]\:pointer-events-none:is(:where(.group)[data-disabled=true] *){pointer-events:none}.group-data-\[disabled\=true\]\:opacity-50:is(:where(.group)[data-disabled=true] *){opacity:.5}.group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state=open] *){rotate:180deg}.group-data-\[sticky\]\/table\:sticky:is(:where(.group\/table)[data-sticky] *){position:sticky}.group-data-\[sticky\]\/table\:top-0:is(:where(.group\/table)[data-sticky] *){top:0}.group-data-\[sticky\]\/table\:z-10:is(:where(.group\/table)[data-sticky] *){z-index:10}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-50:is(:where(.peer):disabled~*){opacity:.5}.file\:mr-3::file-selector-button{margin-right:calc(var(--spacing) * 3)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-semibold::file-selector-button{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.file\:text-foreground::file-selector-button{color:var(--foreground)}.placeholder\:text-muted-foreground::placeholder,.placeholder\:text-muted-foreground\/80::placeholder{color:var(--muted-foreground)}@supports (color:color-mix(in lab, red, red)){.placeholder\:text-muted-foreground\/80::placeholder{color:color-mix(in oklab, var(--muted-foreground) 80%, transparent)}}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-border-strong:hover{border-color:var(--border-strong)}.hover\:border-brand-hover:hover{border-color:var(--brand-hover)}.hover\:border-brand\/30:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/30:hover{border-color:color-mix(in oklab, var(--brand) 30%, transparent)}}.hover\:border-brand\/35:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/35:hover{border-color:color-mix(in oklab, var(--brand) 35%, transparent)}}.hover\:border-brand\/50:hover{border-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:border-brand\/50:hover{border-color:color-mix(in oklab, var(--brand) 50%, transparent)}}.hover\:bg-accent:hover,.hover\:bg-accent\/60:hover{background-color:var(--accent)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-accent\/60:hover{background-color:color-mix(in oklab, var(--accent) 60%, transparent)}}.hover\:bg-brand-hover:hover{background-color:var(--brand-hover)}.hover\:bg-brand\/15:hover{background-color:var(--brand)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-brand\/15:hover{background-color:color-mix(in oklab, var(--brand) 15%, transparent)}}.hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--destructive) 90%, transparent)}}.hover\:bg-muted:hover,.hover\:bg-muted\/60:hover{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/60:hover{background-color:color-mix(in oklab, var(--muted) 60%, transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:text-brand:hover{color:var(--brand)}.hover\:text-brand-hover:hover{color:var(--brand-hover)}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:underline-offset-4:hover{text-underline-offset:4px}.hover\:shadow-md:hover{--tw-shadow:0 10px 30px var(--tw-shadow-color,#0a080e1a), 0 2px 8px var(--tw-shadow-color,#0a080e0f);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:not-sr-only:focus{clip-path:none;white-space:normal;width:auto;height:auto;margin:0;padding:0;position:static;overflow:visible}.focus\:fixed:focus{position:fixed}.focus\:top-2:focus{top:calc(var(--spacing) * 2)}.focus\:left-2:focus{left:calc(var(--spacing) * 2)}.focus\:z-50:focus{z-index:50}.focus\:rounded-md:focus{border-radius:.625rem}.focus\:bg-background:focus{background-color:var(--background)}.focus\:bg-muted:focus{background-color:var(--muted)}.focus\:px-3:focus{padding-inline:calc(var(--spacing) * 3)}.focus\:py-2:focus{padding-block:calc(var(--spacing) * 2)}.focus\:text-foreground:focus{color:var(--foreground)}.focus-visible\:border-brand:focus-visible{border-color:var(--brand)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-ring\/15:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/15:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 15%, transparent)}}.focus-visible\:ring-ring\/20:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/20:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 20%, transparent)}}.focus-visible\:ring-ring\/30:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/30:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 30%, transparent)}}.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:color-mix(in oklab, var(--ring) 50%, transparent)}}.active\:translate-y-0:active{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.active\:translate-y-px:active{--tw-translate-y:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-muted:disabled{background-color:var(--muted)}.disabled\:opacity-45:disabled{opacity:.45}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.aria-invalid\:border-destructive[aria-invalid=true]{border-color:var(--destructive)}.aria-invalid\:ring-destructive\/15[aria-invalid=true]{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:ring-destructive\/15[aria-invalid=true]{--tw-ring-color:color-mix(in oklab, var(--destructive) 15%, transparent)}}.data-\[active\]\:text-foreground[data-active]{color:var(--foreground)}.data-\[active\=true\]\:bg-muted[data-active=true]{background-color:var(--muted)}.data-\[active\=true\]\:shadow-\[inset_2px_0_0_var\(--color-brand\)\][data-active=true]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[disabled\=true\]\:pointer-events-none[data-disabled=true]{pointer-events:none}.data-\[disabled\=true\]\:opacity-50[data-disabled=true]{opacity:.5}.data-\[inset\]\:pl-8[data-inset]{padding-left:calc(var(--spacing) * 8)}.data-\[motion\^\=from-\]\:animate-in[data-motion^=from-]{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.data-\[motion\^\=to-\]\:animate-out[data-motion^=to-]{animation:.12s ease-in forwards bl-out}.data-\[orientation\=horizontal\]\:h-px[data-orientation=horizontal]{height:1px}.data-\[orientation\=horizontal\]\:w-full[data-orientation=horizontal]{width:100%}.data-\[orientation\=vertical\]\:h-full[data-orientation=vertical]{height:100%}.data-\[orientation\=vertical\]\:w-px[data-orientation=vertical]{width:1px}.data-\[placeholder\]\:text-muted-foreground[data-placeholder]{color:var(--muted-foreground)}.data-\[selected\=true\]\:bg-muted[data-selected=true]{background-color:var(--muted)}.data-\[selected\=true\]\:text-foreground[data-selected=true]{color:var(--foreground)}.data-\[selected\=true\]\:shadow-\[inset_2px_0_0_var\(--color-brand\)\][data-selected=true]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[size\=default\]\:h-9[data-size=default]{height:calc(var(--spacing) * 9)}.data-\[size\=sm\]\:h-8[data-size=sm]{height:calc(var(--spacing) * 8)}:is(.\*\:data-\[slot\=select-value\]\:line-clamp-1>*)[data-slot=select-value]{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}:is(.\*\:data-\[slot\=select-value\]\:flex>*)[data-slot=select-value]{display:flex}:is(.\*\:data-\[slot\=select-value\]\:items-center>*)[data-slot=select-value]{align-items:center}:is(.\*\:data-\[slot\=select-value\]\:gap-2>*)[data-slot=select-value]{gap:calc(var(--spacing) * 2)}.data-\[state\=active\]\:bg-surface[data-state=active]{background-color:var(--surface)}.data-\[state\=active\]\:text-foreground[data-state=active]{color:var(--foreground)}.data-\[state\=active\]\:shadow-xs[data-state=active]{--tw-shadow:0 1px 2px var(--tw-shadow-color,#0a080e0d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=checked\]\:translate-x-\[calc\(100\%-1px\)\][data-state=checked]{--tw-translate-x:calc(100% - 1px);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:border-primary[data-state=checked]{border-color:var(--primary)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--primary)}.data-\[state\=checked\]\:font-semibold[data-state=checked]{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.data-\[state\=checked\]\:text-primary-foreground[data-state=checked]{color:var(--primary-foreground)}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:.16s ease-out bl-accordion-up}.data-\[state\=closed\]\:animate-collapsible-up[data-state=closed]{animation:.16s ease-out bl-collapsible-up}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation:.12s ease-in forwards bl-out}.data-\[state\=closed\]\:animate-sheet-out[data-state=closed]{animation:.16s ease-in forwards bl-sheet-out}.data-\[state\=hidden\]\:animate-out[data-state=hidden]{animation:.12s ease-in forwards bl-out}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:.18s ease-out bl-accordion-down}.data-\[state\=open\]\:animate-collapsible-down[data-state=open]{animation:.18s ease-out bl-collapsible-down}.data-\[state\=open\]\:animate-in[data-state=open]{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.data-\[state\=open\]\:animate-sheet-in[data-state=open]{animation:.22s cubic-bezier(.16,1,.3,1) bl-sheet-in}.data-\[state\=open\]\:bg-muted[data-state=open]{background-color:var(--muted)}.data-\[state\=open\]\:text-foreground[data-state=open]{color:var(--foreground)}.data-\[state\=selected\]\:bg-brand-soft\/60[data-state=selected]{background-color:var(--brand-soft)}@supports (color:color-mix(in lab, red, red)){.data-\[state\=selected\]\:bg-brand-soft\/60[data-state=selected]{background-color:color-mix(in oklab, var(--brand-soft) 60%, transparent)}}.data-\[state\=selected\]\:shadow-\[inset_2px_0_0_var\(--color-brand\)\][data-state=selected]{--tw-shadow:inset 2px 0 0 var(--tw-shadow-color,var(--color-brand));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=unchecked\]\:translate-x-px[data-state=unchecked]{--tw-translate-x:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-border-strong[data-state=unchecked]{background-color:var(--border-strong)}.data-\[state\=visible\]\:animate-in[data-state=visible]{animation:.16s cubic-bezier(.16,1,.3,1) bl-in}.data-\[swipe\=cancel\]\:translate-x-0[data-swipe=cancel]{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=end\]\:translate-x-\(--radix-toast-swipe-end-x\)[data-swipe=end]{--tw-translate-x:var(--radix-toast-swipe-end-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:translate-x-\(--radix-toast-swipe-move-x\)[data-swipe=move]{--tw-translate-x:var(--radix-toast-swipe-move-x);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[swipe\=move\]\:transition-none[data-swipe=move]{transition-property:none}.data-\[variant\=destructive\]\:text-destructive[data-variant=destructive]{color:var(--destructive)}.data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.data-\[variant\=destructive\]\:focus\:bg-destructive\/10[data-variant=destructive]:focus{background-color:color-mix(in oklab, var(--destructive) 10%, transparent)}}@media (prefers-reduced-motion:reduce){.motion-reduce\:hidden{display:none}}@media (min-width:40rem){.sm\:block{display:block}.sm\:hidden{display:none}.sm\:inline{display:inline}.sm\:max-w-sm{max-width:var(--container-sm)}.sm\:max-w-xl{max-width:var(--container-xl)}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-end{align-items:flex-end}.sm\:justify-between{justify-content:space-between}.sm\:justify-end{justify-content:flex-end}.sm\:p-0{padding:0}.sm\:p-6{padding:calc(var(--spacing) * 6)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:px-4{padding-inline:calc(var(--spacing) * 4)}.sm\:px-6{padding-inline:calc(var(--spacing) * 6)}.sm\:py-16{padding-block:calc(var(--spacing) * 16)}.sm\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.sm\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.sm\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.sm\:leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}}@media (min-width:48rem){.md\:absolute{position:absolute}.md\:col-span-2{grid-column:span 2/span 2}.md\:flex{display:flex}.md\:w-\(--radix-navigation-menu-viewport-width\){width:var(--radix-navigation-menu-viewport-width)}.md\:w-auto{width:auto}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:64rem){.lg\:block{display:block}.lg\:hidden{display:none}.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.lg\:grid-cols-\[minmax\(0\,1fr\)_26rem\]{grid-template-columns:minmax(0,1fr) 26rem}.lg\:items-end{align-items:flex-end}}@container (min-width:28rem){.\@md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.dark\:bg-surface-raised:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *){background-color:var(--surface-raised)}.dark\:data-\[state\=checked\]\:bg-primary-foreground:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=checked]{background-color:var(--primary-foreground)}.dark\:data-\[state\=unchecked\]\:bg-foreground\/80:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=unchecked]{background-color:var(--foreground)}@supports (color:color-mix(in lab, red, red)){.dark\:data-\[state\=unchecked\]\:bg-foreground\/80:where(.dark,.dark *,[data-theme=dark],[data-theme=dark] *)[data-state=unchecked]{background-color:color-mix(in oklab, var(--foreground) 80%, transparent)}}.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading]{padding-block:calc(var(--spacing) * 1.5)}.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading]{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading]{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading]{color:var(--muted-foreground)}.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-item\]\]\:py-2 [cmdk-item]{padding-block:calc(var(--spacing) * 2)}.\[\&_\[data-slot\=card-content\]\]\:px-4 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-content\]\]\:px-5 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-content\]\]\:px-6 [data-slot=card-content]{padding-inline:calc(var(--spacing) * 6)}.\[\&_\[data-slot\=card-footer\]\]\:p-4 [data-slot=card-footer]{padding:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-footer\]\]\:p-5 [data-slot=card-footer]{padding:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-footer\]\]\:p-6 [data-slot=card-footer]{padding:calc(var(--spacing) * 6)}.\[\&_\[data-slot\=card-header\]\]\:p-4 [data-slot=card-header]{padding:calc(var(--spacing) * 4)}.\[\&_\[data-slot\=card-header\]\]\:p-5 [data-slot=card-header]{padding:calc(var(--spacing) * 5)}.\[\&_\[data-slot\=card-header\]\]\:p-6 [data-slot=card-header]{padding:calc(var(--spacing) * 6)}.\[\&_\[data-slot\=toast-title\]\]\:text-destructive [data-slot=toast-title]{color:var(--destructive)}.\[\&_\[data-slot\=toast-title\]\]\:text-success [data-slot=toast-title]{color:var(--success)}.\[\&_code\]\:font-mono code{font-family:JetBrains Mono,SFMono-Regular,Consolas,Liberation Mono,monospace}.\[\&_code\]\:text-foreground code{color:var(--foreground)}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-3 svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&_svg\]\:size-3\.5 svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:size-4\.5 svg{width:calc(var(--spacing) * 4.5);height:calc(var(--spacing) * 4.5)}.\[\&_svg\]\:size-5 svg{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\:not\(\[class\*\=\'text-\'\]\)\]\:text-muted-foreground svg:not([class*=text-]){color:var(--muted-foreground)}.\[\&_svg\:not\(\[class\*\=size-\]\)\]\:size-3\.5 svg:not([class*=size-]){width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&_tr\]\:border-b tr{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-style:var(--tw-border-style);border-width:0}.\[\&\:has\(\[role\=checkbox\]\)\]\:w-10:has([role=checkbox]){width:calc(var(--spacing) * 10)}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}:is(.data-\[variant\=destructive\]\:\*\:\[svg\]\:\!text-destructive[data-variant=destructive]>*):is(svg){color:var(--destructive)!important}.\[\&\>svg\]\:mt-0\.5>svg{margin-top:calc(var(--spacing) * .5)}.\[\&\>svg\]\:size-3>svg{width:calc(var(--spacing) * 3);height:calc(var(--spacing) * 3)}.\[\&\>svg\]\:size-3\.5>svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&\>svg\]\:size-4>svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&\>svg\]\:text-brand>svg{color:var(--brand)}.\[\&\>svg\]\:text-destructive>svg{color:var(--destructive)}.\[\&\>svg\]\:text-info>svg{color:var(--info)}.\[\&\>svg\]\:text-muted-foreground>svg{color:var(--muted-foreground)}.\[\&\>svg\]\:text-success>svg{color:var(--success)}.\[\&\>svg\]\:text-warning>svg{color:var(--warning)}.\[\&\>tr\]\:last\:border-b-0>tr:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}}:root{--background:#fbfafc;--foreground:#17131c;--surface:#fff;--surface-raised:#fff;--surface-muted:#f7f4f9;--card:#fff;--card-foreground:#17131c;--popover:#fff;--popover-foreground:#17131c;--primary:#8f0bc7;--primary-foreground:#fff;--secondary:#f1edf4;--secondary-foreground:#29212f;--muted:#f4f1f6;--muted-foreground:#6c6472;--accent:#f3e7fb;--accent-foreground:#561071;--destructive:#c92d3f;--destructive-foreground:#fff;--success:#0e7a56;--success-foreground:#fff;--warning:#9b5c08;--warning-foreground:#fff;--info:#2563eb;--info-foreground:#fff;--border:#e5dfe8;--border-strong:#cfc5d5;--input:#d8cfdd;--ring:#a60ee5;--brand:#a60ee5;--brand-hover:#8f0bc7;--brand-soft:#f5e8fc;--brand-soft-foreground:#5b1476;--code:#18141d;--code-foreground:#f5f0f7;--radius:.625rem;color-scheme:light}.dark,[data-theme=dark]{--background:#0d0d12;--foreground:#f2eef5;--surface:#121218;--surface-raised:#18171f;--surface-muted:#17151c;--card:#14131a;--card-foreground:#f2eef5;--popover:#18171f;--popover-foreground:#f2eef5;--primary:#b836ed;--primary-foreground:#fff;--secondary:#211e28;--secondary-foreground:#e7e0eb;--muted:#1b1921;--muted-foreground:#a49ca9;--accent:#291734;--accent-foreground:#efd7fa;--destructive:#ef5b65;--destructive-foreground:#1b090b;--success:#36c58d;--success-foreground:#07160f;--warning:#f3b24c;--warning-foreground:#201304;--info:#6ea8ff;--info-foreground:#071226;--border:#2a2732;--border-strong:#403a49;--input:#34303d;--ring:#c65ef1;--brand:#c65ef1;--brand-hover:#d384f3;--brand-soft:#291734;--brand-soft-foreground:#efd7fa;--code:#09090d;--code-foreground:#f5f0f7;color-scheme:dark}@keyframes bl-in{0%{opacity:0;transform:scale(.97)translateY(2px)}}@keyframes bl-out{to{opacity:0;transform:scale(.97)}}@keyframes bl-sheet-in{0%{transform:translateX(var(--bl-sheet-from,100%))}}@keyframes bl-sheet-out{to{transform:translateX(var(--bl-sheet-from,100%))}}@keyframes bl-accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes bl-accordion-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}@keyframes bl-collapsible-down{0%{height:0}to{height:var(--radix-collapsible-content-height)}}@keyframes bl-collapsible-up{0%{height:var(--radix-collapsible-content-height)}to{height:0}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:1ms!important;animation-duration:1ms!important}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@burtson-labs/ui",
|
|
3
|
-
"version": "0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "0.5.0",
|
|
4
|
+
"description": "React components for Burtson Labs products: Radix accessibility, Tailwind v4 styling, Burtson Icons. Install the package or copy the source.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": {
|
|
7
7
|
"name": "Burtson Labs",
|