@nocoo/basalt 2.0.0 → 2.0.3

package/dist/components/alert-dialog.js

@@ -14,6 +14,7 @@ var c = i.Root, l = i.Trigger, u = i.Portal, d = a.forwardRef(({ className: e, .
 d.displayName = i.Overlay.displayName;
 var f = a.forwardRef(({ className: e, size: t = "base", ...n }, a) => /* @__PURE__ */ s(u, { children: [/* @__PURE__ */ o(d, {}), /* @__PURE__ */ o(i.Content, {
 	ref: a,
+	"data-basalt-surface-root": "",
 	className: r({
 		size: t,
 		className: e
@@ -51,7 +52,7 @@ var _ = ({ className: t, ...n }) => /* @__PURE__ */ o("div", {
 });
 _.displayName = "AlertDialogHeader";
 var v = ({ className: t, ...n }) => /* @__PURE__ */ o("div", {
-	className: e("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
+	className: e("mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
 	...n
 });
 v.displayName = "AlertDialogFooter";

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

@@ -1 +1 @@
-{"version":3,"file":"alert-dialog.js","names":[],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { buttonVariants } from \"./button\";\nimport { type DialogSize, dialogOverlayClass, dialogPanelClass } from \"./dialog\";\n\nexport const AlertDialog = AlertDialogPrimitive.Root;\nexport const AlertDialogTrigger = AlertDialogPrimitive.Trigger;\nexport const AlertDialogPortal = AlertDialogPrimitive.Portal;\n\nexport const AlertDialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Overlay>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nAlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;\n\nexport type AlertDialogContentProps = React.ComponentPropsWithoutRef<\n\ttypeof AlertDialogPrimitive.Content\n> & {\n\tsize?: DialogSize;\n};\n\nexport const AlertDialogContent = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Content>,\n\tAlertDialogContentProps\n>(({ className, size = \"base\", ...props }, ref) => (\n\t<AlertDialogPortal>\n\t\t<AlertDialogOverlay />\n\t\t<AlertDialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t{...props}\n\t\t/>\n\t</AlertDialogPortal>\n));\nAlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;\n\nexport const AlertDialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Title>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-2xl font-semibold tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;\n\nexport const AlertDialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Description>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-base text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;\n\nexport const AlertDialogCancel = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Cancel>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Cancel\n\t\tref={ref}\n\t\tclassName={cn(buttonVariants({ variant: \"outline\" }), className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;\n\nexport const AlertDialogAction = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Action>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Action\n\t\tref={ref}\n\t\tclassName={cn(buttonVariants({ variant: \"destructive\" }), className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;\n\nexport const AlertDialogHeader = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cn(\"flex flex-col space-y-2 text-left\", className)} {...props} />\n);\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\nexport const AlertDialogFooter = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cn(\"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n\t\t{...props}\n\t/>\n);\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n"],"mappings":";;;;;;;;AAMA,IAAa,IAAc,EAAqB,MACnC,IAAqB,EAAqB,SAC1C,IAAoB,EAAqB,QAEzC,IAAqB,EAAM,YAGrC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,SAAtB;CAAmC;CAAK,WAAW,EAAmB,CAAS;CAAG,GAAI;AAAQ,CAAA,CAC9F;AACD,EAAmB,cAAc,EAAqB,QAAQ;AAQ9D,IAAa,IAAqB,EAAM,YAGrC,EAAE,cAAW,UAAO,QAAQ,GAAG,KAAS,MAC1C,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD,CAAqB,CAAA,GACrB,kBAAC,EAAqB,SAAtB;CACM;CACL,WAAW,EAAiB;EAAE;EAAM;CAAU,CAAC;CAC/C,GAAI;AACJ,CAAA,CACiB,EAAA,CAAA,CACnB;AACD,EAAmB,cAAc,EAAqB,QAAQ;AAE9D,IAAa,IAAmB,EAAM,YAGnC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,OAAtB;CACM;CACL,WAAW,EAAG,yCAAyC,CAAS;CAChE,GAAI;AACJ,CAAA,CACD;AACD,EAAiB,cAAc,EAAqB,MAAM;AAE1D,IAAa,IAAyB,EAAM,YAGzC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,aAAtB;CACM;CACL,WAAW,EAAG,0CAA0C,CAAS;CACjE,GAAI;AACJ,CAAA,CACD;AACD,EAAuB,cAAc,EAAqB,YAAY;AAEtE,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,QAAtB;CACM;CACL,WAAW,EAAG,EAAe,EAAE,SAAS,UAAU,CAAC,GAAG,CAAS;CAC/D,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAqB,OAAO;AAE5D,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,QAAtB;CACM;CACL,WAAW,EAAG,EAAe,EAAE,SAAS,cAAc,CAAC,GAAG,CAAS;CACnE,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAqB,OAAO;AAE5D,IAAa,KAAqB,EACjC,cACA,GAAG,QAEH,kBAAC,OAAD;CAAK,WAAW,EAAG,qCAAqC,CAAS;CAAG,GAAI;AAAQ,CAAA;AAEjF,EAAkB,cAAc;AAEhC,IAAa,KAAqB,EACjC,cACA,GAAG,QAEH,kBAAC,OAAD;CACC,WAAW,EAAG,0DAA0D,CAAS;CACjF,GAAI;AACJ,CAAA;AAEF,EAAkB,cAAc"}
+{"version":3,"file":"alert-dialog.js","names":[],"sources":["../../src/components/alert-dialog.tsx"],"sourcesContent":["import * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { buttonVariants } from \"./button\";\nimport { type DialogSize, dialogOverlayClass, dialogPanelClass } from \"./dialog\";\n\nexport const AlertDialog = AlertDialogPrimitive.Root;\nexport const AlertDialogTrigger = AlertDialogPrimitive.Trigger;\nexport const AlertDialogPortal = AlertDialogPrimitive.Portal;\n\nexport const AlertDialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Overlay>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nAlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;\n\nexport type AlertDialogContentProps = React.ComponentPropsWithoutRef<\n\ttypeof AlertDialogPrimitive.Content\n> & {\n\tsize?: DialogSize;\n};\n\nexport const AlertDialogContent = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Content>,\n\tAlertDialogContentProps\n>(({ className, size = \"base\", ...props }, ref) => (\n\t<AlertDialogPortal>\n\t\t<AlertDialogOverlay />\n\t\t<AlertDialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-basalt-surface-root=\"\"\n\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t{...props}\n\t\t/>\n\t</AlertDialogPortal>\n));\nAlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;\n\nexport const AlertDialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Title>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-2xl font-semibold tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;\n\nexport const AlertDialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Description>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-base text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;\n\nexport const AlertDialogCancel = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Cancel>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Cancel\n\t\tref={ref}\n\t\tclassName={cn(buttonVariants({ variant: \"outline\" }), className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;\n\nexport const AlertDialogAction = React.forwardRef<\n\tReact.ElementRef<typeof AlertDialogPrimitive.Action>,\n\tReact.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>\n>(({ className, ...props }, ref) => (\n\t<AlertDialogPrimitive.Action\n\t\tref={ref}\n\t\tclassName={cn(buttonVariants({ variant: \"destructive\" }), className)}\n\t\t{...props}\n\t/>\n));\nAlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;\n\nexport const AlertDialogHeader = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cn(\"flex flex-col space-y-2 text-left\", className)} {...props} />\n);\nAlertDialogHeader.displayName = \"AlertDialogHeader\";\n\nexport const AlertDialogFooter = ({\n\tclassName,\n\t...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cn(\"mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n\t\t{...props}\n\t/>\n);\nAlertDialogFooter.displayName = \"AlertDialogFooter\";\n"],"mappings":";;;;;;;;AAMA,IAAa,IAAc,EAAqB,MACnC,IAAqB,EAAqB,SAC1C,IAAoB,EAAqB,QAEzC,IAAqB,EAAM,YAGrC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,SAAtB;CAAmC;CAAK,WAAW,EAAmB,CAAS;CAAG,GAAI;AAAQ,CAAA,CAC9F;AACD,EAAmB,cAAc,EAAqB,QAAQ;AAQ9D,IAAa,IAAqB,EAAM,YAGrC,EAAE,cAAW,UAAO,QAAQ,GAAG,KAAS,MAC1C,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD,CAAqB,CAAA,GACrB,kBAAC,EAAqB,SAAtB;CACM;CACL,4BAAyB;CACzB,WAAW,EAAiB;EAAE;EAAM;CAAU,CAAC;CAC/C,GAAI;AACJ,CAAA,CACiB,EAAA,CAAA,CACnB;AACD,EAAmB,cAAc,EAAqB,QAAQ;AAE9D,IAAa,IAAmB,EAAM,YAGnC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,OAAtB;CACM;CACL,WAAW,EAAG,yCAAyC,CAAS;CAChE,GAAI;AACJ,CAAA,CACD;AACD,EAAiB,cAAc,EAAqB,MAAM;AAE1D,IAAa,IAAyB,EAAM,YAGzC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,aAAtB;CACM;CACL,WAAW,EAAG,0CAA0C,CAAS;CACjE,GAAI;AACJ,CAAA,CACD;AACD,EAAuB,cAAc,EAAqB,YAAY;AAEtE,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,QAAtB;CACM;CACL,WAAW,EAAG,EAAe,EAAE,SAAS,UAAU,CAAC,GAAG,CAAS;CAC/D,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAqB,OAAO;AAE5D,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAqB,QAAtB;CACM;CACL,WAAW,EAAG,EAAe,EAAE,SAAS,cAAc,CAAC,GAAG,CAAS;CACnE,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAqB,OAAO;AAE5D,IAAa,KAAqB,EACjC,cACA,GAAG,QAEH,kBAAC,OAAD;CAAK,WAAW,EAAG,qCAAqC,CAAS;CAAG,GAAI;AAAQ,CAAA;AAEjF,EAAkB,cAAc;AAEhC,IAAa,KAAqB,EACjC,cACA,GAAG,QAEH,kBAAC,OAAD;CACC,WAAW,EAAG,+DAA+D,CAAS;CACtF,GAAI;AACJ,CAAA;AAEF,EAAkB,cAAc"}

package/dist/components/button.js

@@ -11,9 +11,9 @@ var c = i(`inline-flex items-center justify-center gap-2 rounded-basalt-md text-
 	variants: {
 		variant: {
 			default: "bg-basalt-primary text-basalt-primary-foreground hover:bg-basalt-primary/90",
-			secondary: "bg-basalt-secondary text-basalt-foreground hover:bg-basalt-accent",
+			secondary: "bg-basalt-control text-basalt-foreground hover:bg-basalt-accent",
 			destructive: "bg-basalt-destructive text-basalt-destructive-foreground hover:bg-basalt-destructive/90",
-			outline: "border border-basalt-border bg-basalt-secondary hover:bg-basalt-accent hover:text-basalt-accent-foreground",
+			outline: "border border-basalt-border bg-basalt-control hover:bg-basalt-accent hover:text-basalt-accent-foreground",
 			ghost: "hover:bg-basalt-accent hover:text-basalt-accent-foreground",
 			link: "text-basalt-primary underline-offset-4 hover:underline"
 		},

package/dist/components/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":[],"sources":["../../src/components/button.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Loader2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { FOCUS_RING } from \"./overlay\";\n\nconst buttonVariants = cva(\n\t`inline-flex items-center justify-center gap-2 rounded-basalt-md text-sm font-medium transition-colors ${FOCUS_RING} disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0`,\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"bg-basalt-primary text-basalt-primary-foreground hover:bg-basalt-primary/90\",\n\t\t\t\tsecondary: \"bg-basalt-secondary text-basalt-foreground hover:bg-basalt-accent\",\n\t\t\t\tdestructive:\n\t\t\t\t\t\"bg-basalt-destructive text-basalt-destructive-foreground hover:bg-basalt-destructive/90\",\n\t\t\t\toutline:\n\t\t\t\t\t\"border border-basalt-border bg-basalt-secondary hover:bg-basalt-accent hover:text-basalt-accent-foreground\",\n\t\t\t\tghost: \"hover:bg-basalt-accent hover:text-basalt-accent-foreground\",\n\t\t\t\tlink: \"text-basalt-primary underline-offset-4 hover:underline\",\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: \"h-9 px-4 py-2\",\n\t\t\t\tsm: \"h-8 rounded-basalt-md px-3 text-xs\",\n\t\t\t\tlg: \"h-10 rounded-basalt-md px-6\",\n\t\t\t\ticon: \"h-9 w-9\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t\tsize: \"default\",\n\t\t},\n\t},\n);\n\nexport interface ButtonProps\n\textends React.ButtonHTMLAttributes<HTMLButtonElement>,\n\t\tVariantProps<typeof buttonVariants> {\n\tasChild?: boolean;\n\tloading?: boolean;\n\ticon?: React.ReactNode;\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tvariant,\n\t\t\tsize,\n\t\t\tasChild = false,\n\t\t\ttype = \"button\",\n\t\t\tloading = false,\n\t\t\ticon,\n\t\t\tchildren,\n\t\t\tdisabled,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Comp = asChild ? Slot : \"button\";\n\t\tif (asChild) {\n\t\t\treturn (\n\t\t\t\t<Comp className={cn(buttonVariants({ variant, size }), className)} ref={ref} {...props}>\n\t\t\t\t\t{children}\n\t\t\t\t</Comp>\n\t\t\t);\n\t\t}\n\t\tconst iconNode = loading ? (\n\t\t\t<Loader2 className=\"animate-basalt-spin\" aria-hidden=\"true\" />\n\t\t) : (\n\t\t\ticon\n\t\t);\n\t\treturn (\n\t\t\t<button\n\t\t\t\tclassName={cn(buttonVariants({ variant, size }), className)}\n\t\t\t\tref={ref}\n\t\t\t\ttype={type}\n\t\t\t\tdisabled={disabled || loading}\n\t\t\t\taria-busy={loading || undefined}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{iconNode}\n\t\t\t\t{children}\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport interface LinkButtonProps\n\textends React.AnchorHTMLAttributes<HTMLAnchorElement>,\n\t\tVariantProps<typeof buttonVariants> {\n\ticon?: React.ReactNode;\n}\n\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkButtonProps>(\n\t({ className, variant, size, icon, children, ...props }, ref) => (\n\t\t<a ref={ref} className={cn(buttonVariants({ variant, size }), className)} {...props}>\n\t\t\t{icon}\n\t\t\t{children}\n\t\t</a>\n\t),\n);\nLinkButton.displayName = \"LinkButton\";\n\nexport { buttonVariants };\n"],"mappings":";;;;;;;;;AAOA,IAAM,IAAiB,EACtB,yGAAyG,EAAW,gHACpH;CACC,UAAU;EACT,SAAS;GACR,SAAS;GACT,WAAW;GACX,aACC;GACD,SACC;GACD,OAAO;GACP,MAAM;EACP;EACA,MAAM;GACL,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,MAAM;EACP;CACD;CACA,iBAAiB;EAChB,SAAS;EACT,MAAM;CACP;AACD,CACD,GAUa,IAAS,EAAM,YAE1B,EACC,cACA,YACA,SACA,aAAU,IACV,UAAO,UACP,aAAU,IACV,SACA,aACA,aACA,GAAG,KAEJ,MACI;CACJ,IAAM,IAAO,IAAU,IAAO;CAC9B,IAAI,GACH,OACC,kBAAC,GAAD;EAAM,WAAW,EAAG,EAAe;GAAE;GAAS;EAAK,CAAC,GAAG,CAAS;EAAQ;EAAK,GAAI;EAC/E;CACI,CAAA;CAGR,IAAM,IAAW,IAChB,kBAAC,GAAD;EAAS,WAAU;EAAsB,eAAY;CAAQ,CAAA,IAE7D;CAED,OACC,kBAAC,UAAD;EACC,WAAW,EAAG,EAAe;GAAE;GAAS;EAAK,CAAC,GAAG,CAAS;EACrD;EACC;EACN,UAAU,KAAY;EACtB,aAAW,KAAW,KAAA;EACtB,GAAI;EANL,UAAA,CAQE,GACA,CACM;;AAEV,CACD;AACA,EAAO,cAAc;AAQrB,IAAa,IAAa,EAAM,YAC9B,EAAE,cAAW,YAAS,SAAM,SAAM,aAAU,GAAG,KAAS,MACxD,kBAAC,KAAD;CAAQ;CAAK,WAAW,EAAG,EAAe;EAAE;EAAS;CAAK,CAAC,GAAG,CAAS;CAAG,GAAI;CAA9E,UAAA,CACE,GACA,CACC;AAEL,CAAA,CAAA;AACA,EAAW,cAAc"}
+{"version":3,"file":"button.js","names":[],"sources":["../../src/components/button.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Loader2 } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { FOCUS_RING } from \"./overlay\";\n\nconst buttonVariants = cva(\n\t`inline-flex items-center justify-center gap-2 rounded-basalt-md text-sm font-medium transition-colors ${FOCUS_RING} disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0`,\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"bg-basalt-primary text-basalt-primary-foreground hover:bg-basalt-primary/90\",\n\t\t\t\tsecondary: \"bg-basalt-control text-basalt-foreground hover:bg-basalt-accent\",\n\t\t\t\tdestructive:\n\t\t\t\t\t\"bg-basalt-destructive text-basalt-destructive-foreground hover:bg-basalt-destructive/90\",\n\t\t\t\toutline:\n\t\t\t\t\t\"border border-basalt-border bg-basalt-control hover:bg-basalt-accent hover:text-basalt-accent-foreground\",\n\t\t\t\tghost: \"hover:bg-basalt-accent hover:text-basalt-accent-foreground\",\n\t\t\t\tlink: \"text-basalt-primary underline-offset-4 hover:underline\",\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: \"h-9 px-4 py-2\",\n\t\t\t\tsm: \"h-8 rounded-basalt-md px-3 text-xs\",\n\t\t\t\tlg: \"h-10 rounded-basalt-md px-6\",\n\t\t\t\ticon: \"h-9 w-9\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t\tsize: \"default\",\n\t\t},\n\t},\n);\n\nexport interface ButtonProps\n\textends React.ButtonHTMLAttributes<HTMLButtonElement>,\n\t\tVariantProps<typeof buttonVariants> {\n\tasChild?: boolean;\n\tloading?: boolean;\n\ticon?: React.ReactNode;\n}\n\nexport const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tvariant,\n\t\t\tsize,\n\t\t\tasChild = false,\n\t\t\ttype = \"button\",\n\t\t\tloading = false,\n\t\t\ticon,\n\t\t\tchildren,\n\t\t\tdisabled,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Comp = asChild ? Slot : \"button\";\n\t\tif (asChild) {\n\t\t\treturn (\n\t\t\t\t<Comp className={cn(buttonVariants({ variant, size }), className)} ref={ref} {...props}>\n\t\t\t\t\t{children}\n\t\t\t\t</Comp>\n\t\t\t);\n\t\t}\n\t\tconst iconNode = loading ? (\n\t\t\t<Loader2 className=\"animate-basalt-spin\" aria-hidden=\"true\" />\n\t\t) : (\n\t\t\ticon\n\t\t);\n\t\treturn (\n\t\t\t<button\n\t\t\t\tclassName={cn(buttonVariants({ variant, size }), className)}\n\t\t\t\tref={ref}\n\t\t\t\ttype={type}\n\t\t\t\tdisabled={disabled || loading}\n\t\t\t\taria-busy={loading || undefined}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{iconNode}\n\t\t\t\t{children}\n\t\t\t</button>\n\t\t);\n\t},\n);\nButton.displayName = \"Button\";\n\nexport interface LinkButtonProps\n\textends React.AnchorHTMLAttributes<HTMLAnchorElement>,\n\t\tVariantProps<typeof buttonVariants> {\n\ticon?: React.ReactNode;\n}\n\nexport const LinkButton = React.forwardRef<HTMLAnchorElement, LinkButtonProps>(\n\t({ className, variant, size, icon, children, ...props }, ref) => (\n\t\t<a ref={ref} className={cn(buttonVariants({ variant, size }), className)} {...props}>\n\t\t\t{icon}\n\t\t\t{children}\n\t\t</a>\n\t),\n);\nLinkButton.displayName = \"LinkButton\";\n\nexport { buttonVariants };\n"],"mappings":";;;;;;;;;AAOA,IAAM,IAAiB,EACtB,yGAAyG,EAAW,gHACpH;CACC,UAAU;EACT,SAAS;GACR,SAAS;GACT,WAAW;GACX,aACC;GACD,SACC;GACD,OAAO;GACP,MAAM;EACP;EACA,MAAM;GACL,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,MAAM;EACP;CACD;CACA,iBAAiB;EAChB,SAAS;EACT,MAAM;CACP;AACD,CACD,GAUa,IAAS,EAAM,YAE1B,EACC,cACA,YACA,SACA,aAAU,IACV,UAAO,UACP,aAAU,IACV,SACA,aACA,aACA,GAAG,KAEJ,MACI;CACJ,IAAM,IAAO,IAAU,IAAO;CAC9B,IAAI,GACH,OACC,kBAAC,GAAD;EAAM,WAAW,EAAG,EAAe;GAAE;GAAS;EAAK,CAAC,GAAG,CAAS;EAAQ;EAAK,GAAI;EAC/E;CACI,CAAA;CAGR,IAAM,IAAW,IAChB,kBAAC,GAAD;EAAS,WAAU;EAAsB,eAAY;CAAQ,CAAA,IAE7D;CAED,OACC,kBAAC,UAAD;EACC,WAAW,EAAG,EAAe;GAAE;GAAS;EAAK,CAAC,GAAG,CAAS;EACrD;EACC;EACN,UAAU,KAAY;EACtB,aAAW,KAAW,KAAA;EACtB,GAAI;EANL,UAAA,CAQE,GACA,CACM;;AAEV,CACD;AACA,EAAO,cAAc;AAQrB,IAAa,IAAa,EAAM,YAC9B,EAAE,cAAW,YAAS,SAAM,SAAM,aAAU,GAAG,KAAS,MACxD,kBAAC,KAAD;CAAQ;CAAK,WAAW,EAAG,EAAe;EAAE;EAAS;CAAK,CAAC,GAAG,CAAS;CAAG,GAAI;CAA9E,UAAA,CACE,GACA,CACC;AAEL,CAAA,CAAA;AACA,EAAW,cAAc"}

package/dist/components/chat-bubble.d.ts

@@ -0,0 +1,17 @@
+import type { ReactNode } from "react";
+export type ChatBubbleVariant = "assistant" | "system" | "user";
+export interface ChatBubbleProps {
+    /**
+     * Alignment and fill.
+     * @default "assistant"
+     */
+    variant?: ChatBubbleVariant;
+    /**
+     * Show a streaming caret after the body.
+     * @default false
+     */
+    streaming?: boolean;
+    className?: string;
+    children: ReactNode;
+}
+export declare function ChatBubble({ variant, streaming, className, children, }: ChatBubbleProps): import("react").JSX.Element;

package/dist/components/chat-bubble.js

@@ -0,0 +1,25 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/chat-bubble.tsx
+function r({ variant: r = "assistant", streaming: i = !1, className: a, children: o }) {
+	if (r === "system") return /* @__PURE__ */ t("p", {
+		className: e("px-1 text-center text-[11px] text-basalt-muted-foreground", a),
+		children: o
+	});
+	let s = r === "user";
+	return /* @__PURE__ */ t("div", {
+		className: e("flex w-full", s ? "justify-end" : "justify-start"),
+		children: /* @__PURE__ */ n("div", {
+			className: e("max-w-[92%] px-3.5 py-2 text-sm leading-5 shadow-sm", s ? "rounded-2xl rounded-br-md bg-basalt-primary text-basalt-primary-foreground" : "rounded-2xl rounded-bl-md bg-basalt-secondary text-basalt-foreground ring-1 ring-basalt-border/50", a),
+			children: [o, i ? /* @__PURE__ */ t("span", {
+				className: "mt-1 inline-block h-3 w-1.5 animate-pulse rounded-sm bg-basalt-primary/70 align-middle",
+				"aria-hidden": !0
+			}) : null]
+		})
+	});
+}
+//#endregion
+export { r as ChatBubble };
+
+//# sourceMappingURL=chat-bubble.js.map

package/dist/components/chat-bubble.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-bubble.js","names":[],"sources":["../../src/components/chat-bubble.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type ChatBubbleVariant = \"assistant\" | \"system\" | \"user\";\n\nexport interface ChatBubbleProps {\n\t/**\n\t * Alignment and fill.\n\t * @default \"assistant\"\n\t */\n\tvariant?: ChatBubbleVariant;\n\t/**\n\t * Show a streaming caret after the body.\n\t * @default false\n\t */\n\tstreaming?: boolean;\n\tclassName?: string;\n\tchildren: ReactNode;\n}\n\nexport function ChatBubble({\n\tvariant = \"assistant\",\n\tstreaming = false,\n\tclassName,\n\tchildren,\n}: ChatBubbleProps) {\n\tif (variant === \"system\") {\n\t\treturn (\n\t\t\t<p className={cn(\"px-1 text-center text-[11px] text-basalt-muted-foreground\", className)}>\n\t\t\t\t{children}\n\t\t\t</p>\n\t\t);\n\t}\n\tconst user = variant === \"user\";\n\treturn (\n\t\t<div className={cn(\"flex w-full\", user ? \"justify-end\" : \"justify-start\")}>\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"max-w-[92%] px-3.5 py-2 text-sm leading-5 shadow-sm\",\n\t\t\t\t\tuser\n\t\t\t\t\t\t? \"rounded-2xl rounded-br-md bg-basalt-primary text-basalt-primary-foreground\"\n\t\t\t\t\t\t: \"rounded-2xl rounded-bl-md bg-basalt-secondary text-basalt-foreground ring-1 ring-basalt-border/50\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t{streaming ? (\n\t\t\t\t\t<span\n\t\t\t\t\t\tclassName=\"mt-1 inline-block h-3 w-1.5 animate-pulse rounded-sm bg-basalt-primary/70 align-middle\"\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t/>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;AAoBA,SAAgB,EAAW,EAC1B,aAAU,aACV,eAAY,IACZ,cACA,eACmB;CACnB,IAAI,MAAY,UACf,OACC,kBAAC,KAAD;EAAG,WAAW,EAAG,6DAA6D,CAAS;EACrF;CACC,CAAA;CAGL,IAAM,IAAO,MAAY;CACzB,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,eAAe,IAAO,gBAAgB,eAAe;EACvE,UAAA,kBAAC,OAAD;GACC,WAAW,EACV,uDACA,IACG,+EACA,qGACH,CACD;GAPD,UAAA,CASE,GACA,IACA,kBAAC,QAAD;IACC,WAAU;IACV,eAAA;GACA,CAAA,IACE,IACA;;CACD,CAAA;AAEP"}

package/dist/components/chat-composer.d.ts

@@ -0,0 +1,41 @@
+export interface ChatComposerProps {
+    /**
+     * Disable the field and send.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Replace send with stop.
+     * @default false
+     */
+    streaming?: boolean;
+    /**
+     * Field accessible name.
+     * @default "Message"
+     */
+    label?: string;
+    /**
+     * Placeholder when empty.
+     */
+    placeholder?: string;
+    /**
+     * Called with trimmed text on send.
+     */
+    onSend: (text: string) => void;
+    /**
+     * Called when the stop control is pressed.
+     */
+    onCancel?: () => void;
+    /**
+     * Send control accessible name.
+     * @default "Send message"
+     */
+    sendLabel?: string;
+    /**
+     * Stop control accessible name.
+     * @default "Stop generating"
+     */
+    cancelLabel?: string;
+    className?: string;
+}
+export declare function ChatComposer({ disabled, streaming, label, placeholder, onSend, onCancel, sendLabel, cancelLabel, className, }: ChatComposerProps): import("react").JSX.Element;

package/dist/components/chat-composer.js

@@ -0,0 +1,74 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { Button as t } from "./button.js";
+import { InputArea as n } from "./input-area.js";
+import { useRef as r, useState as i } from "react";
+import { ArrowUp as a, Square as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/chat-composer.tsx
+function l({ disabled: l = !1, streaming: u = !1, label: d = "Message", placeholder: f, onSend: p, onCancel: m, sendLabel: h = "Send message", cancelLabel: g = "Stop generating", className: _ }) {
+	let [v, y] = i(""), b = r(null), x = r(!1), S = () => {
+		let e = b.current;
+		e && (e.style.height = "0px", e.style.height = `${Math.min(e.scrollHeight, 160)}px`);
+	}, C = () => {
+		let e = v.trim();
+		!e || l || u || (p(e), y(""), requestAnimationFrame(() => {
+			let e = b.current;
+			e && (e.style.height = "0px", e.style.height = `${Math.min(e.scrollHeight, 160)}px`, e.focus());
+		}));
+	};
+	return /* @__PURE__ */ s("form", {
+		className: e("border-t border-basalt-border/50 bg-basalt-card p-3", _),
+		onSubmit: (e) => {
+			e.preventDefault(), C();
+		},
+		children: /* @__PURE__ */ c("div", {
+			className: "flex items-end gap-2 rounded-2xl bg-basalt-secondary p-2 ring-1 ring-basalt-border/50",
+			children: [/* @__PURE__ */ s(n, {
+				ref: b,
+				value: v,
+				onChange: (e) => {
+					y(e.target.value), requestAnimationFrame(S);
+				},
+				onCompositionStart: () => {
+					x.current = !0;
+				},
+				onCompositionEnd: () => {
+					x.current = !1;
+				},
+				onKeyDown: (e) => {
+					x.current || e.nativeEvent.isComposing || e.key !== "Enter" || e.shiftKey || (e.preventDefault(), C());
+				},
+				rows: 1,
+				placeholder: f,
+				disabled: l,
+				"aria-label": d,
+				className: "max-h-40 min-h-[40px] flex-1 resize-none border-0 bg-transparent p-2 shadow-none ring-0"
+			}), u ? /* @__PURE__ */ s(t, {
+				type: "button",
+				size: "icon",
+				variant: "secondary",
+				onClick: m,
+				disabled: !m,
+				"aria-label": g,
+				children: /* @__PURE__ */ s(o, {
+					className: "h-3.5 w-3.5 fill-current",
+					strokeWidth: 0
+				})
+			}) : /* @__PURE__ */ s(t, {
+				type: "submit",
+				size: "icon",
+				disabled: l || !v.trim(),
+				"aria-label": h,
+				children: /* @__PURE__ */ s(a, {
+					className: "h-4 w-4",
+					strokeWidth: 2.25
+				})
+			})]
+		})
+	});
+}
+//#endregion
+export { l as ChatComposer };
+
+//# sourceMappingURL=chat-composer.js.map

package/dist/components/chat-composer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-composer.js","names":[],"sources":["../../src/components/chat-composer.tsx"],"sourcesContent":["import { ArrowUp, Square } from \"lucide-react\";\nimport { type FormEvent, type KeyboardEvent, useRef, useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { Button } from \"./button\";\nimport { InputArea } from \"./input-area\";\n\nexport interface ChatComposerProps {\n\t/**\n\t * Disable the field and send.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Replace send with stop.\n\t * @default false\n\t */\n\tstreaming?: boolean;\n\t/**\n\t * Field accessible name.\n\t * @default \"Message\"\n\t */\n\tlabel?: string;\n\t/**\n\t * Placeholder when empty.\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Called with trimmed text on send.\n\t */\n\tonSend: (text: string) => void;\n\t/**\n\t * Called when the stop control is pressed.\n\t */\n\tonCancel?: () => void;\n\t/**\n\t * Send control accessible name.\n\t * @default \"Send message\"\n\t */\n\tsendLabel?: string;\n\t/**\n\t * Stop control accessible name.\n\t * @default \"Stop generating\"\n\t */\n\tcancelLabel?: string;\n\tclassName?: string;\n}\n\nexport function ChatComposer({\n\tdisabled = false,\n\tstreaming = false,\n\tlabel = \"Message\",\n\tplaceholder,\n\tonSend,\n\tonCancel,\n\tsendLabel = \"Send message\",\n\tcancelLabel = \"Stop generating\",\n\tclassName,\n}: ChatComposerProps) {\n\tconst [value, setValue] = useState(\"\");\n\tconst ref = useRef<HTMLTextAreaElement>(null);\n\tconst composingRef = useRef(false);\n\n\tconst resize = () => {\n\t\tconst el = ref.current;\n\t\tif (!el) {\n\t\t\treturn;\n\t\t}\n\t\tel.style.height = \"0px\";\n\t\tel.style.height = `${Math.min(el.scrollHeight, 160)}px`;\n\t};\n\n\tconst submit = () => {\n\t\tconst text = value.trim();\n\t\tif (!text || disabled || streaming) {\n\t\t\treturn;\n\t\t}\n\t\tonSend(text);\n\t\tsetValue(\"\");\n\t\trequestAnimationFrame(() => {\n\t\t\tconst el = ref.current;\n\t\t\tif (el) {\n\t\t\t\tel.style.height = \"0px\";\n\t\t\t\tel.style.height = `${Math.min(el.scrollHeight, 160)}px`;\n\t\t\t\tel.focus();\n\t\t\t}\n\t\t});\n\t};\n\n\tconst onSubmit = (event: FormEvent) => {\n\t\tevent.preventDefault();\n\t\tsubmit();\n\t};\n\n\tconst onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\n\t\tif (composingRef.current || event.nativeEvent.isComposing) {\n\t\t\treturn;\n\t\t}\n\t\tif (event.key !== \"Enter\" || event.shiftKey) {\n\t\t\treturn;\n\t\t}\n\t\tevent.preventDefault();\n\t\tsubmit();\n\t};\n\n\treturn (\n\t\t<form\n\t\t\tclassName={cn(\"border-t border-basalt-border/50 bg-basalt-card p-3\", className)}\n\t\t\tonSubmit={onSubmit}\n\t\t>\n\t\t\t<div className=\"flex items-end gap-2 rounded-2xl bg-basalt-secondary p-2 ring-1 ring-basalt-border/50\">\n\t\t\t\t<InputArea\n\t\t\t\t\tref={ref}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tonChange={(event) => {\n\t\t\t\t\t\tsetValue(event.target.value);\n\t\t\t\t\t\trequestAnimationFrame(resize);\n\t\t\t\t\t}}\n\t\t\t\t\tonCompositionStart={() => {\n\t\t\t\t\t\tcomposingRef.current = true;\n\t\t\t\t\t}}\n\t\t\t\t\tonCompositionEnd={() => {\n\t\t\t\t\t\tcomposingRef.current = false;\n\t\t\t\t\t}}\n\t\t\t\t\tonKeyDown={onKeyDown}\n\t\t\t\t\trows={1}\n\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\taria-label={label}\n\t\t\t\t\tclassName=\"max-h-40 min-h-[40px] flex-1 resize-none border-0 bg-transparent p-2 shadow-none ring-0\"\n\t\t\t\t/>\n\t\t\t\t{streaming ? (\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tonClick={onCancel}\n\t\t\t\t\t\tdisabled={!onCancel}\n\t\t\t\t\t\taria-label={cancelLabel}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Square className=\"h-3.5 w-3.5 fill-current\" strokeWidth={0} />\n\t\t\t\t\t</Button>\n\t\t\t\t) : (\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\tdisabled={disabled || !value.trim()}\n\t\t\t\t\t\taria-label={sendLabel}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ArrowUp className=\"h-4 w-4\" strokeWidth={2.25} />\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</form>\n\t);\n}\n"],"mappings":";;;;;;;;AA+CA,SAAgB,EAAa,EAC5B,cAAW,IACX,eAAY,IACZ,WAAQ,WACR,gBACA,WACA,aACA,eAAY,gBACZ,iBAAc,mBACd,gBACqB;CACrB,IAAM,CAAC,GAAO,KAAY,EAAS,EAAE,GAC/B,IAAM,EAA4B,IAAI,GACtC,IAAe,EAAO,EAAK,GAE3B,UAAe;EACpB,IAAM,IAAK,EAAI;EACV,MAGL,EAAG,MAAM,SAAS,OAClB,EAAG,MAAM,SAAS,GAAG,KAAK,IAAI,EAAG,cAAc,GAAG,EAAE;CACrD,GAEM,UAAe;EACpB,IAAM,IAAO,EAAM,KAAK;EACpB,CAAC,KAAQ,KAAY,MAGzB,EAAO,CAAI,GACX,EAAS,EAAE,GACX,4BAA4B;GAC3B,IAAM,IAAK,EAAI;GACf,AAAI,MACH,EAAG,MAAM,SAAS,OAClB,EAAG,MAAM,SAAS,GAAG,KAAK,IAAI,EAAG,cAAc,GAAG,EAAE,KACpD,EAAG,MAAM;EAEX,CAAC;CACF;CAkBA,OACC,kBAAC,QAAD;EACC,WAAW,EAAG,uDAAuD,CAAS;EACpE,WAnBM,MAAqB;GAEtC,AADA,EAAM,eAAe,GACrB,EAAO;EACR;EAkBE,UAAA,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACC,kBAAC,GAAD;IACM;IACE;IACP,WAAW,MAAU;KAEpB,AADA,EAAS,EAAM,OAAO,KAAK,GAC3B,sBAAsB,CAAM;IAC7B;IACA,0BAA0B;KACzB,EAAa,UAAU;IACxB;IACA,wBAAwB;KACvB,EAAa,UAAU;IACxB;IACW,YA9BI,MAA8C;KAC5D,EAAa,WAAW,EAAM,YAAY,eAG1C,EAAM,QAAQ,WAAW,EAAM,aAGnC,EAAM,eAAe,GACrB,EAAO;IACR;IAsBI,MAAM;IACO;IACH;IACV,cAAY;IACZ,WAAU;GACV,CAAA,GACA,IACA,kBAAC,GAAD;IACC,MAAK;IACL,MAAK;IACL,SAAQ;IACR,SAAS;IACT,UAAU,CAAC;IACX,cAAY;IAEZ,UAAA,kBAAC,GAAD;KAAQ,WAAU;KAA2B,aAAa;IAAI,CAAA;GACvD,CAAA,IAER,kBAAC,GAAD;IACC,MAAK;IACL,MAAK;IACL,UAAU,KAAY,CAAC,EAAM,KAAK;IAClC,cAAY;IAEZ,UAAA,kBAAC,GAAD;KAAS,WAAU;KAAU,aAAa;IAAO,CAAA;GAC1C,CAAA,CAEL;;CACA,CAAA;AAER"}

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

@@ -0,0 +1,20 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface ChatHeaderProps extends Omit<HTMLAttributes<HTMLElement>, "title"> {
+    /**
+     * Conversation title.
+     */
+    title: ReactNode;
+    /**
+     * Secondary line under the title.
+     */
+    subtitle?: ReactNode;
+    /**
+     * Leading mark, usually an icon.
+     */
+    leading?: ReactNode;
+    /**
+     * Trailing actions.
+     */
+    children?: ReactNode;
+}
+export declare function ChatHeader({ title, subtitle, leading, children, className, ...props }: ChatHeaderProps): import("react").JSX.Element;

package/dist/components/chat-header.js

@@ -0,0 +1,33 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/chat-header.tsx
+function r({ title: r, subtitle: i, leading: a, children: o, className: s, ...c }) {
+	return /* @__PURE__ */ n("header", {
+		className: e("flex items-center justify-between gap-2 border-b border-basalt-border/50 px-3 py-2.5", s),
+		...c,
+		children: [/* @__PURE__ */ n("div", {
+			className: "flex min-w-0 items-center gap-2",
+			children: [a ? /* @__PURE__ */ t("span", {
+				className: "flex h-8 w-8 items-center justify-center",
+				children: a
+			}) : null, /* @__PURE__ */ n("div", {
+				className: "min-w-0",
+				children: [/* @__PURE__ */ t("p", {
+					className: "truncate text-sm font-semibold tracking-tight",
+					children: r
+				}), i ? /* @__PURE__ */ t("p", {
+					className: "truncate text-[11px] text-basalt-muted-foreground",
+					children: i
+				}) : null]
+			})]
+		}), o ? /* @__PURE__ */ t("div", {
+			className: "flex items-center gap-1",
+			children: o
+		}) : null]
+	});
+}
+//#endregion
+export { r as ChatHeader };
+
+//# sourceMappingURL=chat-header.js.map

package/dist/components/chat-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-header.js","names":[],"sources":["../../src/components/chat-header.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport interface ChatHeaderProps extends Omit<HTMLAttributes<HTMLElement>, \"title\"> {\n\t/**\n\t * Conversation title.\n\t */\n\ttitle: ReactNode;\n\t/**\n\t * Secondary line under the title.\n\t */\n\tsubtitle?: ReactNode;\n\t/**\n\t * Leading mark, usually an icon.\n\t */\n\tleading?: ReactNode;\n\t/**\n\t * Trailing actions.\n\t */\n\tchildren?: ReactNode;\n}\n\nexport function ChatHeader({\n\ttitle,\n\tsubtitle,\n\tleading,\n\tchildren,\n\tclassName,\n\t...props\n}: ChatHeaderProps) {\n\treturn (\n\t\t<header\n\t\t\tclassName={cn(\n\t\t\t\t\"flex items-center justify-between gap-2 border-b border-basalt-border/50 px-3 py-2.5\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div className=\"flex min-w-0 items-center gap-2\">\n\t\t\t\t{leading ? (\n\t\t\t\t\t<span className=\"flex h-8 w-8 items-center justify-center\">{leading}</span>\n\t\t\t\t) : null}\n\t\t\t\t<div className=\"min-w-0\">\n\t\t\t\t\t<p className=\"truncate text-sm font-semibold tracking-tight\">{title}</p>\n\t\t\t\t\t{subtitle ? (\n\t\t\t\t\t\t<p className=\"truncate text-[11px] text-basalt-muted-foreground\">{subtitle}</p>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{children ? <div className=\"flex items-center gap-1\">{children}</div> : null}\n\t\t</header>\n\t);\n}\n"],"mappings":";;;;AAsBA,SAAgB,EAAW,EAC1B,UACA,aACA,YACA,aACA,cACA,GAAG,KACgB;CACnB,OACC,kBAAC,UAAD;EACC,WAAW,EACV,wFACA,CACD;EACA,GAAI;EALL,UAAA,CAOC,kBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACE,IACA,kBAAC,QAAD;IAAM,WAAU;IAA4C,UAAA;GAAc,CAAA,IACvE,MACJ,kBAAC,OAAD;IAAK,WAAU;IAAf,UAAA,CACC,kBAAC,KAAD;KAAG,WAAU;KAAiD,UAAA;IAAS,CAAA,GACtE,IACA,kBAAC,KAAD;KAAG,WAAU;KAAqD,UAAA;IAAY,CAAA,IAC3E,IACA;GACD,CAAA,CAAA;EACJ,CAAA,GAAA,IAAW,kBAAC,OAAD;GAAK,WAAU;GAA2B;EAAc,CAAA,IAAI,IACjE;;AAEV"}

package/dist/components/chat-inbox.d.ts

@@ -0,0 +1,28 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export interface ChatInboxItem {
+    /** Stable id for selection. */
+    id: string;
+    /** Thread title. */
+    title: string;
+    /** Last-message preview. */
+    preview?: string;
+    /** Timestamp label. */
+    time?: string;
+    /** Optional leading mark. */
+    leading?: ReactNode;
+}
+export interface ChatInboxProps extends Omit<HTMLAttributes<HTMLElement>, "onSelect"> {
+    /**
+     * Threads to list.
+     */
+    items: readonly ChatInboxItem[];
+    /**
+     * Selected thread id.
+     */
+    activeId?: string;
+    /**
+     * Called when a thread is chosen.
+     */
+    onSelect: (id: string) => void;
+}
+export declare function ChatInbox({ items, activeId, onSelect, className, ...props }: ChatInboxProps): import("react").JSX.Element;

package/dist/components/chat-inbox.js

@@ -0,0 +1,44 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { Button as t } from "./button.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/chat-inbox.tsx
+function i({ items: i, activeId: a, onSelect: o, className: s, ...c }) {
+	return /* @__PURE__ */ n("nav", {
+		className: e("flex min-h-0 flex-col gap-0.5 overflow-y-auto p-2", s),
+		...c,
+		children: i.map((i) => {
+			let s = i.id === a;
+			return /* @__PURE__ */ r(t, {
+				type: "button",
+				variant: "ghost",
+				"aria-current": s ? "true" : void 0,
+				onClick: () => o(i.id),
+				className: e("h-auto w-full justify-start gap-2 rounded-basalt-md px-2 py-2 text-left", s ? "bg-basalt-accent" : ""),
+				children: [i.leading ? /* @__PURE__ */ n("span", {
+					className: "flex h-8 w-8 shrink-0 items-center justify-center",
+					children: i.leading
+				}) : null, /* @__PURE__ */ r("span", {
+					className: "min-w-0 flex-1",
+					children: [/* @__PURE__ */ r("span", {
+						className: "flex items-baseline justify-between gap-2",
+						children: [/* @__PURE__ */ n("span", {
+							className: "truncate text-sm font-medium text-basalt-foreground",
+							children: i.title
+						}), i.time ? /* @__PURE__ */ n("span", {
+							className: "shrink-0 text-[11px] text-basalt-muted-foreground",
+							children: i.time
+						}) : null]
+					}), i.preview ? /* @__PURE__ */ n("span", {
+						className: "mt-0.5 block truncate text-xs text-basalt-muted-foreground",
+						children: i.preview
+					}) : null]
+				})]
+			}, i.id);
+		})
+	});
+}
+//#endregion
+export { i as ChatInbox };
+
+//# sourceMappingURL=chat-inbox.js.map

package/dist/components/chat-inbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-inbox.js","names":[],"sources":["../../src/components/chat-inbox.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { Button } from \"./button\";\n\nexport interface ChatInboxItem {\n\t/** Stable id for selection. */\n\tid: string;\n\t/** Thread title. */\n\ttitle: string;\n\t/** Last-message preview. */\n\tpreview?: string;\n\t/** Timestamp label. */\n\ttime?: string;\n\t/** Optional leading mark. */\n\tleading?: ReactNode;\n}\n\nexport interface ChatInboxProps extends Omit<HTMLAttributes<HTMLElement>, \"onSelect\"> {\n\t/**\n\t * Threads to list.\n\t */\n\titems: readonly ChatInboxItem[];\n\t/**\n\t * Selected thread id.\n\t */\n\tactiveId?: string;\n\t/**\n\t * Called when a thread is chosen.\n\t */\n\tonSelect: (id: string) => void;\n}\n\nexport function ChatInbox({ items, activeId, onSelect, className, ...props }: ChatInboxProps) {\n\treturn (\n\t\t<nav className={cn(\"flex min-h-0 flex-col gap-0.5 overflow-y-auto p-2\", className)} {...props}>\n\t\t\t{items.map((item) => {\n\t\t\t\tconst active = item.id === activeId;\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\taria-current={active ? \"true\" : undefined}\n\t\t\t\t\t\tonClick={() => onSelect(item.id)}\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"h-auto w-full justify-start gap-2 rounded-basalt-md px-2 py-2 text-left\",\n\t\t\t\t\t\t\tactive ? \"bg-basalt-accent\" : \"\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{item.leading ? (\n\t\t\t\t\t\t\t<span className=\"flex h-8 w-8 shrink-0 items-center justify-center\">\n\t\t\t\t\t\t\t\t{item.leading}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t<span className=\"min-w-0 flex-1\">\n\t\t\t\t\t\t\t<span className=\"flex items-baseline justify-between gap-2\">\n\t\t\t\t\t\t\t\t<span className=\"truncate text-sm font-medium text-basalt-foreground\">\n\t\t\t\t\t\t\t\t\t{item.title}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t{item.time ? (\n\t\t\t\t\t\t\t\t\t<span className=\"shrink-0 text-[11px] text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t{item.time}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{item.preview ? (\n\t\t\t\t\t\t\t\t<span className=\"mt-0.5 block truncate text-xs text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t{item.preview}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\t})}\n\t\t</nav>\n\t);\n}\n"],"mappings":";;;;;AAgCA,SAAgB,EAAU,EAAE,UAAO,aAAU,aAAU,cAAW,GAAG,KAAyB;CAC7F,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,qDAAqD,CAAS;EAAG,GAAI;EACtF,UAAA,EAAM,KAAK,MAAS;GACpB,IAAM,IAAS,EAAK,OAAO;GAC3B,OACC,kBAAC,GAAD;IAEC,MAAK;IACL,SAAQ;IACR,gBAAc,IAAS,SAAS,KAAA;IAChC,eAAe,EAAS,EAAK,EAAE;IAC/B,WAAW,EACV,2EACA,IAAS,qBAAqB,EAC/B;IATD,UAAA,CAWE,EAAK,UACL,kBAAC,QAAD;KAAM,WAAU;KACd,UAAA,EAAK;IACD,CAAA,IACH,MACJ,kBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACC,kBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA,CACC,kBAAC,QAAD;OAAM,WAAU;OACd,UAAA,EAAK;MACD,CAAA,GACL,EAAK,OACL,kBAAC,QAAD;OAAM,WAAU;OACd,UAAA,EAAK;MACD,CAAA,IACH,IACC;KACL,CAAA,GAAA,EAAK,UACL,kBAAC,QAAD;MAAM,WAAU;MACd,UAAA,EAAK;KACD,CAAA,IACH,IACC;IACC,CAAA,CAAA;GAhCF,GAAA,EAAK,EAgCH;EAEV,CAAC;CACG,CAAA;AAEP"}

package/dist/components/description-list.d.ts

@@ -0,0 +1,21 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export type DescriptionListColumns = 1 | 2 | 3;
+export type DescriptionListProps = HTMLAttributes<HTMLDListElement> & {
+    /**
+     * Number of term/value columns from the small breakpoint up.
+     * @default 2
+     */
+    columns?: DescriptionListColumns;
+};
+declare function DescriptionListRoot({ className, columns, ...props }: DescriptionListProps): import("react").JSX.Element;
+export type DescriptionListItemProps = HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Term shown above the value.
+     */
+    term: ReactNode;
+};
+declare function DescriptionListItem({ term, className, children, ...props }: DescriptionListItemProps): import("react").JSX.Element;
+export declare const DescriptionList: typeof DescriptionListRoot & {
+    Item: typeof DescriptionListItem;
+};
+export {};

package/dist/components/description-list.js

@@ -0,0 +1,35 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/components/description-list.tsx
+var r = {
+	1: "sm:grid-cols-1",
+	2: "sm:grid-cols-2",
+	3: "sm:grid-cols-3"
+};
+function i({ className: n, columns: i = 2, ...a }) {
+	return /* @__PURE__ */ t("dl", {
+		className: e("grid gap-x-8 gap-y-3 text-sm", r[i], n),
+		...a
+	});
+}
+i.displayName = "DescriptionList";
+function a({ term: r, className: i, children: a, ...o }) {
+	return /* @__PURE__ */ n("div", {
+		className: e("min-w-0", i),
+		...o,
+		children: [/* @__PURE__ */ t("dt", {
+			className: "text-xs text-basalt-muted-foreground",
+			children: r
+		}), /* @__PURE__ */ t("dd", {
+			className: "mt-0.5 wrap-break-word text-basalt-foreground",
+			children: a
+		})]
+	});
+}
+a.displayName = "DescriptionList.Item";
+var o = Object.assign(i, { Item: a });
+//#endregion
+export { o as DescriptionList };
+
+//# sourceMappingURL=description-list.js.map

package/dist/components/description-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"description-list.js","names":[],"sources":["../../src/components/description-list.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type DescriptionListColumns = 1 | 2 | 3;\n\nexport type DescriptionListProps = HTMLAttributes<HTMLDListElement> & {\n\t/**\n\t * Number of term/value columns from the small breakpoint up.\n\t * @default 2\n\t */\n\tcolumns?: DescriptionListColumns;\n};\n\nconst COLUMN_CLASS: Record<DescriptionListColumns, string> = {\n\t1: \"sm:grid-cols-1\",\n\t2: \"sm:grid-cols-2\",\n\t3: \"sm:grid-cols-3\",\n};\n\nfunction DescriptionListRoot({ className, columns = 2, ...props }: DescriptionListProps) {\n\treturn (\n\t\t<dl\n\t\t\tclassName={cn(\"grid gap-x-8 gap-y-3 text-sm\", COLUMN_CLASS[columns], className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\nDescriptionListRoot.displayName = \"DescriptionList\";\n\nexport type DescriptionListItemProps = HTMLAttributes<HTMLDivElement> & {\n\t/**\n\t * Term shown above the value.\n\t */\n\tterm: ReactNode;\n};\n\nfunction DescriptionListItem({ term, className, children, ...props }: DescriptionListItemProps) {\n\treturn (\n\t\t<div className={cn(\"min-w-0\", className)} {...props}>\n\t\t\t<dt className=\"text-xs text-basalt-muted-foreground\">{term}</dt>\n\t\t\t<dd className=\"mt-0.5 wrap-break-word text-basalt-foreground\">{children}</dd>\n\t\t</div>\n\t);\n}\nDescriptionListItem.displayName = \"DescriptionList.Item\";\n\nexport const DescriptionList = Object.assign(DescriptionListRoot, {\n\tItem: DescriptionListItem,\n});\n"],"mappings":";;;;AAaA,IAAM,IAAuD;CAC5D,GAAG;CACH,GAAG;CACH,GAAG;AACJ;AAEA,SAAS,EAAoB,EAAE,cAAW,aAAU,GAAG,GAAG,KAA+B;CACxF,OACC,kBAAC,MAAD;EACC,WAAW,EAAG,gCAAgC,EAAa,IAAU,CAAS;EAC9E,GAAI;CACJ,CAAA;AAEH;AACA,EAAoB,cAAc;AASlC,SAAS,EAAoB,EAAE,SAAM,cAAW,aAAU,GAAG,KAAmC;CAC/F,OACC,kBAAC,OAAD;EAAK,WAAW,EAAG,WAAW,CAAS;EAAG,GAAI;EAA9C,UAAA,CACC,kBAAC,MAAD;GAAI,WAAU;GAAwC,UAAA;EAAS,CAAA,GAC/D,kBAAC,MAAD;GAAI,WAAU;GAAiD;EAAa,CAAA,CACxE;;AAEP;AACA,EAAoB,cAAc;AAElC,IAAa,IAAkB,OAAO,OAAO,GAAqB,EACjE,MAAM,EACP,CAAC"}

package/dist/components/dialog.js

@@ -15,7 +15,7 @@ function c(r) {
 	return e("fixed inset-0 bg-black/40 backdrop-blur-md", t, "data-[state=open]:animate-basalt-overlay-in data-[state=closed]:animate-basalt-overlay-out", n, r);
 }
 function l({ size: r = "base", className: i } = {}) {
-	return e("fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg bg-basalt-background p-8 text-basalt-foreground shadow-lg ring-1 ring-basalt-border", t, "data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out", n, s[r], i);
+	return e("fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg p-6 text-basalt-foreground shadow-lg ring-1 ring-basalt-border", t, "data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out", n, s[r], i);
 }
 var u = o.Root, d = o.Trigger, f = o.Close, p = o.Portal, m = r.forwardRef(({ className: e, ...t }, n) => /* @__PURE__ */ i(o.Overlay, {
 	ref: n,
@@ -25,6 +25,7 @@ var u = o.Root, d = o.Trigger, f = o.Close, p = o.Portal, m = r.forwardRef(({ cl
 m.displayName = o.Overlay.displayName;
 var h = r.forwardRef(({ className: e, children: t, size: n = "base", disablePointerDismissal: r = !1, onPointerDownOutside: s, onInteractOutside: c, ...u }, d) => /* @__PURE__ */ a(p, { children: [/* @__PURE__ */ i(m, {}), /* @__PURE__ */ i(o.Content, {
 	ref: d,
+	"data-basalt-surface-root": "",
 	className: l({
 		size: n,
 		className: e
@@ -57,7 +58,7 @@ var v = ({ className: t, ...n }) => /* @__PURE__ */ i("div", {
 });
 v.displayName = "DialogHeader";
 var y = ({ className: t, ...n }) => /* @__PURE__ */ i("div", {
-	className: e("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
+	className: e("mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
 	...n
 });
 y.displayName = "DialogFooter";

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","names":[],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const DIALOG_SIZES = {\n\tsm: \"sm:w-72\",\n\tbase: \"sm:w-96\",\n\tlg: \"sm:w-[32rem]\",\n\txl: \"sm:w-[48rem]\",\n} as const;\n\nexport type DialogSize = keyof typeof DIALOG_SIZES;\n\nexport function dialogOverlayClass(className?: string) {\n\treturn cn(\n\t\t\"fixed inset-0 bg-black/40 backdrop-blur-md\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-overlay-in data-[state=closed]:animate-basalt-overlay-out\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function dialogPanelClass({\n\tsize = \"base\",\n\tclassName,\n}: {\n\tsize?: DialogSize;\n\tclassName?: string;\n} = {}) {\n\treturn cn(\n\t\t\"fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg bg-basalt-background p-8 text-basalt-foreground shadow-lg ring-1 ring-basalt-border\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out\",\n\t\tOVERLAY_MOTION,\n\t\tDIALOG_SIZES[size],\n\t\tclassName,\n\t);\n}\n\nexport const Dialog = DialogPrimitive.Root;\nexport const DialogTrigger = DialogPrimitive.Trigger;\nexport const DialogClose = DialogPrimitive.Close;\nexport const DialogPortal = DialogPrimitive.Portal;\n\nexport const DialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Overlay>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nexport type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\tsize?: DialogSize;\n\tdisablePointerDismissal?: boolean;\n};\n\nexport const DialogContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tsize = \"base\",\n\t\t\tdisablePointerDismissal = false,\n\t\t\tonPointerDownOutside,\n\t\t\tonInteractOutside,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<DialogPortal>\n\t\t\t<DialogOverlay />\n\t\t\t<DialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</DialogPrimitive.Content>\n\t\t</DialogPortal>\n\t),\n);\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nexport const DialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-2xl font-semibold tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport const DialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-base text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cn(\"flex flex-col space-y-1.5 text-left\", className)} {...props} />\n);\nDialogHeader.displayName = \"DialogHeader\";\n\nexport const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cn(\"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n\t\t{...props}\n\t/>\n);\nDialogFooter.displayName = \"DialogFooter\";\n"],"mappings":";;;;;;;AAKA,IAAa,IAAe;CAC3B,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;AACL;AAIA,SAAgB,EAAmB,GAAoB;CACtD,OAAO,EACN,8CACA,GACA,8FACA,GACA,CACD;AACD;AAEA,SAAgB,EAAiB,EAChC,UAAO,QACP,iBAIG,CAAC,GAAG;CACP,OAAO,EACN,yPACA,GACA,4FACA,GACA,EAAa,IACb,CACD;AACD;AAEA,IAAa,IAAS,EAAgB,MACzB,IAAgB,EAAgB,SAChC,IAAc,EAAgB,OAC9B,IAAe,EAAgB,QAE/B,IAAgB,EAAM,YAGhC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,SAAjB;CAA8B;CAAK,WAAW,EAAmB,CAAS;CAAG,GAAI;AAAQ,CAAA,CACzF;AACD,EAAc,cAAc,EAAgB,QAAQ;AAOpD,IAAa,IAAgB,EAAM,YAKjC,EACC,cACA,aACA,UAAO,QACP,6BAA0B,IAC1B,yBACA,sBACA,GAAG,KAEJ,MAEA,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD,CAAgB,CAAA,GAChB,kBAAC,EAAgB,SAAjB;CACM;CACL,WAAW,EAAiB;EAAE;EAAM;CAAU,CAAC;CAC/C,uBAAuB,MAAU;EAIhC,AAHI,KACH,EAAM,eAAe,GAEtB,IAAuB,CAAK;CAC7B;CACA,oBAAoB,MAAU;EAI7B,AAHI,KACH,EAAM,eAAe,GAEtB,IAAoB,CAAK;CAC1B;CACA,GAAI;CAEH;AACuB,CAAA,CACZ,EAAA,CAAA,CAEhB;AACA,EAAc,cAAc,EAAgB,QAAQ;AAEpD,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,yCAAyC,CAAS;CAChE,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAgB,MAAM;AAEhD,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,aAAjB;CACM;CACL,WAAW,EAAG,0CAA0C,CAAS;CACjE,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAgB,YAAY;AAE5D,IAAa,KAAgB,EAAE,cAAW,GAAG,QAC5C,kBAAC,OAAD;CAAK,WAAW,EAAG,uCAAuC,CAAS;CAAG,GAAI;AAAQ,CAAA;AAEnF,EAAa,cAAc;AAE3B,IAAa,KAAgB,EAAE,cAAW,GAAG,QAC5C,kBAAC,OAAD;CACC,WAAW,EAAG,0DAA0D,CAAS;CACjF,GAAI;AACJ,CAAA;AAEF,EAAa,cAAc"}
+{"version":3,"file":"dialog.js","names":[],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\nexport const DIALOG_SIZES = {\n\tsm: \"sm:w-72\",\n\tbase: \"sm:w-96\",\n\tlg: \"sm:w-[32rem]\",\n\txl: \"sm:w-[48rem]\",\n} as const;\n\nexport type DialogSize = keyof typeof DIALOG_SIZES;\n\nexport function dialogOverlayClass(className?: string) {\n\treturn cn(\n\t\t\"fixed inset-0 bg-black/40 backdrop-blur-md\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-overlay-in data-[state=closed]:animate-basalt-overlay-out\",\n\t\tOVERLAY_MOTION,\n\t\tclassName,\n\t);\n}\n\nexport function dialogPanelClass({\n\tsize = \"base\",\n\tclassName,\n}: {\n\tsize?: DialogSize;\n\tclassName?: string;\n} = {}) {\n\treturn cn(\n\t\t\"fixed top-1/2 left-1/2 w-full max-h-[calc(100vh-2rem)] max-w-[calc(100vw-2rem)] origin-center -translate-x-1/2 -translate-y-1/2 overflow-y-auto rounded-basalt-lg p-6 text-basalt-foreground shadow-lg ring-1 ring-basalt-border\",\n\t\tOVERLAY_LAYER,\n\t\t\"data-[state=open]:animate-basalt-dialog-in data-[state=closed]:animate-basalt-dialog-out\",\n\t\tOVERLAY_MOTION,\n\t\tDIALOG_SIZES[size],\n\t\tclassName,\n\t);\n}\n\nexport const Dialog = DialogPrimitive.Root;\nexport const DialogTrigger = DialogPrimitive.Trigger;\nexport const DialogClose = DialogPrimitive.Close;\nexport const DialogPortal = DialogPrimitive.Portal;\n\nexport const DialogOverlay = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Overlay>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Overlay ref={ref} className={dialogOverlayClass(className)} {...props} />\n));\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\n\nexport type DialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n\tsize?: DialogSize;\n\tdisablePointerDismissal?: boolean;\n};\n\nexport const DialogContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tDialogContentProps\n>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tsize = \"base\",\n\t\t\tdisablePointerDismissal = false,\n\t\t\tonPointerDownOutside,\n\t\t\tonInteractOutside,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => (\n\t\t<DialogPortal>\n\t\t\t<DialogOverlay />\n\t\t\t<DialogPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tdata-basalt-surface-root=\"\"\n\t\t\t\tclassName={dialogPanelClass({ size, className })}\n\t\t\t\tonPointerDownOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonPointerDownOutside?.(event);\n\t\t\t\t}}\n\t\t\t\tonInteractOutside={(event) => {\n\t\t\t\t\tif (disablePointerDismissal) {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t}\n\t\t\t\t\tonInteractOutside?.(event);\n\t\t\t\t}}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</DialogPrimitive.Content>\n\t\t</DialogPortal>\n\t),\n);\nDialogContent.displayName = DialogPrimitive.Content.displayName;\n\nexport const DialogTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-2xl font-semibold tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport const DialogDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tReact.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-base text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport const DialogHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div className={cn(\"flex flex-col space-y-1.5 text-left\", className)} {...props} />\n);\nDialogHeader.displayName = \"DialogHeader\";\n\nexport const DialogFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n\t<div\n\t\tclassName={cn(\"mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\", className)}\n\t\t{...props}\n\t/>\n);\nDialogFooter.displayName = \"DialogFooter\";\n"],"mappings":";;;;;;;AAKA,IAAa,IAAe;CAC3B,IAAI;CACJ,MAAM;CACN,IAAI;CACJ,IAAI;AACL;AAIA,SAAgB,EAAmB,GAAoB;CACtD,OAAO,EACN,8CACA,GACA,8FACA,GACA,CACD;AACD;AAEA,SAAgB,EAAiB,EAChC,UAAO,QACP,iBAIG,CAAC,GAAG;CACP,OAAO,EACN,oOACA,GACA,4FACA,GACA,EAAa,IACb,CACD;AACD;AAEA,IAAa,IAAS,EAAgB,MACzB,IAAgB,EAAgB,SAChC,IAAc,EAAgB,OAC9B,IAAe,EAAgB,QAE/B,IAAgB,EAAM,YAGhC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,SAAjB;CAA8B;CAAK,WAAW,EAAmB,CAAS;CAAG,GAAI;AAAQ,CAAA,CACzF;AACD,EAAc,cAAc,EAAgB,QAAQ;AAOpD,IAAa,IAAgB,EAAM,YAKjC,EACC,cACA,aACA,UAAO,QACP,6BAA0B,IAC1B,yBACA,sBACA,GAAG,KAEJ,MAEA,kBAAC,GAAD,EAAA,UAAA,CACC,kBAAC,GAAD,CAAgB,CAAA,GAChB,kBAAC,EAAgB,SAAjB;CACM;CACL,4BAAyB;CACzB,WAAW,EAAiB;EAAE;EAAM;CAAU,CAAC;CAC/C,uBAAuB,MAAU;EAIhC,AAHI,KACH,EAAM,eAAe,GAEtB,IAAuB,CAAK;CAC7B;CACA,oBAAoB,MAAU;EAI7B,AAHI,KACH,EAAM,eAAe,GAEtB,IAAoB,CAAK;CAC1B;CACA,GAAI;CAEH;AACuB,CAAA,CACZ,EAAA,CAAA,CAEhB;AACA,EAAc,cAAc,EAAgB,QAAQ;AAEpD,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,yCAAyC,CAAS;CAChE,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAgB,MAAM;AAEhD,IAAa,IAAoB,EAAM,YAGpC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,aAAjB;CACM;CACL,WAAW,EAAG,0CAA0C,CAAS;CACjE,GAAI;AACJ,CAAA,CACD;AACD,EAAkB,cAAc,EAAgB,YAAY;AAE5D,IAAa,KAAgB,EAAE,cAAW,GAAG,QAC5C,kBAAC,OAAD;CAAK,WAAW,EAAG,uCAAuC,CAAS;CAAG,GAAI;AAAQ,CAAA;AAEnF,EAAa,cAAc;AAE3B,IAAa,KAAgB,EAAE,cAAW,GAAG,QAC5C,kBAAC,OAAD;CACC,WAAW,EAAG,+DAA+D,CAAS;CACtF,GAAI;AACJ,CAAA;AAEF,EAAa,cAAc"}

package/dist/components/dock.d.ts

@@ -0,0 +1,39 @@
+import { type ReactNode } from "react";
+export type DockMode = "overlay" | "push";
+export interface DockProps {
+    /**
+     * Whether the dock occupies its width.
+     */
+    open: boolean;
+    /**
+     * `push` shrinks the main column. `overlay` covers it with a Dialog scrim.
+     * @default "push"
+     */
+    mode?: DockMode;
+    /**
+     * Width when open.
+     * @default "clamp(300px, 32.5vw, 546px)"
+     */
+    width?: string;
+    /**
+     * Overlay scrim click. Ignored in push mode.
+     */
+    onDismiss?: () => void;
+    /**
+     * Overlay scrim accessible name.
+     * @default "Dismiss"
+     */
+    dismissLabel?: string;
+    /**
+     * Accessible name.
+     */
+    "aria-label": string;
+    className?: string;
+    children: ReactNode;
+}
+export interface DockBodyProps {
+    className?: string;
+    children: ReactNode;
+}
+export declare function DockBody({ className, children }: DockBodyProps): import("react").JSX.Element;
+export declare function Dock({ open, mode, width, onDismiss, dismissLabel, className, children, "aria-label": ariaLabel, }: DockProps): import("react").JSX.Element;