@nocoo/basalt 2.1.8 → 3.0.0

package/dist/components/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":[],"sources":["../../src/components/select.tsx"],"sourcesContent":["import * as SelectPrimitive from \"@radix-ui/react-select\";\nimport { Check, ChevronDown } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { FOCUS_BORDER, OVERLAY_GAP, overlayItemClass, overlayPanelClass } from \"./overlay\";\n\nexport type SelectProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled value of the select.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial value of the select.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected value changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Select: React.FC<SelectProps> = SelectPrimitive.Root;\n\nexport type SelectValueProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Value>,\n\t\"placeholder\"\n> & {\n\t/**\n\t * Content shown when no value is selected.\n\t */\n\tplaceholder?: React.ReactNode;\n};\nexport const SelectValue: React.ForwardRefExoticComponent<\n\tSelectValueProps & React.RefAttributes<React.ElementRef<typeof SelectPrimitive.Value>>\n> = SelectPrimitive.Value;\n\ntype RadixSelectGroupProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Group>;\nexport type SelectGroupProps = Omit<RadixSelectGroupProps, \"asChild\"> & {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Group forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixSelectGroupProps[\"asChild\"];\n};\nexport const SelectGroup: React.ForwardRefExoticComponent<\n\tSelectGroupProps & React.RefAttributes<React.ElementRef<typeof SelectPrimitive.Group>>\n> = SelectPrimitive.Group;\n\nexport type SelectSize = \"sm\" | \"default\" | \"lg\";\n\nconst SELECT_SIZE_CLASS: Record<SelectSize, string> = {\n\tsm: \"h-8 px-2.5 text-xs\",\n\tdefault: \"h-9 px-3 text-sm\",\n\tlg: \"h-10 px-4 text-base\",\n};\n\nexport type SelectTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>,\n\t\"disabled\"\n> & {\n\t/**\n\t * The visual size of the trigger.\n\t * @default default\n\t */\n\tsize?: SelectSize;\n\t/**\n\t * Disable the trigger and mark it busy.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * Disable the trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const SelectTrigger = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Trigger>,\n\tSelectTriggerProps\n>(({ className, children, size = \"default\", loading = false, disabled = false, ...props }, ref) => (\n\t<SelectPrimitive.Trigger\n\t\tref={ref}\n\t\t{...props}\n\t\tdisabled={disabled || loading}\n\t\taria-busy={loading || undefined}\n\t\tclassName={controlSurfaceClass(\n\t\t\tcn(\n\t\t\t\t\"flex w-full items-center justify-between\",\n\t\t\t\tSELECT_SIZE_CLASS[size],\n\t\t\t\tFOCUS_BORDER,\n\t\t\t\t\"aria-invalid:border-basalt-destructive aria-invalid:focus-visible:border-basalt-destructive\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t>\n\t\t{children}\n\t\t<ChevronDown className=\"h-4 w-4 opacity-50\" />\n\t</SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\ntype RadixSelectLabelProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>;\nexport type SelectLabelProps = Omit<RadixSelectLabelProps, \"asChild\"> & {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Label forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixSelectLabelProps[\"asChild\"];\n};\n\nexport const SelectLabel = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Label>,\n\tSelectLabelProps\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\"px-2 py-1.5 text-xs text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\nexport type SelectContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>,\n\t\"position\" | \"sideOffset\"\n> & {\n\t/**\n\t * The positioning mode for the select content.\n\t * @default popper\n\t */\n\tposition?: \"item-aligned\" | \"popper\";\n\t/**\n\t * The distance between the trigger and the select content.\n\t * @default 4\n\t */\n\tsideOffset?: number;\n};\n\nexport const SelectContent = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Content>,\n\tSelectContentProps\n>(({ className, children, position = \"popper\", sideOffset = OVERLAY_GAP, ...props }, ref) => (\n\t<SelectPrimitive.Portal>\n\t\t<SelectPrimitive.Content\n\t\t\tref={ref}\n\t\t\tposition={position}\n\t\t\tsideOffset={sideOffset}\n\t\t\tclassName={overlayPanelClass(\n\t\t\t\tcn(position === \"popper\" && \"w-[var(--radix-select-trigger-width)]\", className),\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<SelectPrimitive.Viewport>{children}</SelectPrimitive.Viewport>\n\t\t</SelectPrimitive.Content>\n\t</SelectPrimitive.Portal>\n));\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\nexport type SelectItemProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>,\n\t\"value\"\n> & {\n\t/**\n\t * The value associated with the select item.\n\t */\n\tvalue: string;\n};\n\nexport const SelectItem = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Item>,\n\tSelectItemProps\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tref={ref}\n\t\tclassName={overlayItemClass(\n\t\t\tcn(\n\t\t\t\t\"relative pr-8 outline-hidden hover:bg-basalt-accent focus-visible:bg-basalt-accent data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[disabled]:hover:bg-transparent\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n\t\t<SelectPrimitive.ItemIndicator className=\"absolute right-2\">\n\t\t\t<Check className=\"h-3.5 w-3.5\" />\n\t\t</SelectPrimitive.ItemIndicator>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n"],"mappings":";;;;;;;;;AAwBA,IAAa,IAAgC,EAAgB,MAWhD,IAET,EAAgB,OAWP,IAET,EAAgB,OAId,IAAgD;CACrD,IAAI;CACJ,SAAS;CACT,IAAI;AACL,GAuBa,IAAgB,EAAM,YAGhC,EAAE,cAAW,aAAU,UAAO,WAAW,aAAU,IAAO,cAAW,IAAO,GAAG,KAAS,MAC1F,kBAAC,EAAgB,SAAjB;CACM;CACL,GAAI;CACJ,UAAU,KAAY;CACtB,aAAW,KAAW,KAAA;CACtB,WAAW,EACV,EACC,4CACA,EAAkB,IAClB,GACA,+FACA,CACD,CACD;CAbD,UAAA,CAeE,GACD,kBAAC,GAAD,EAAa,WAAU,qBAAsB,CAAA,CACrB;AACzB,CAAA,CAAA;AACD,EAAc,cAAc,EAAgB,QAAQ;AAYpD,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,oDAAoD,CAAS;CAC3E,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAgB,MAAM;AAkBhD,IAAa,IAAgB,EAAM,YAGhC,EAAE,cAAW,aAAU,cAAW,UAAU,gBAAA,GAA0B,GAAG,KAAS,MACpF,kBAAC,EAAgB,QAAjB,EAAA,UACC,kBAAC,EAAgB,SAAjB;CACM;CACK;CACE;CACZ,WAAW,EACV,EAAG,MAAa,YAAY,yCAAyC,CAAS,CAC/E;CACA,GAAI;CAEJ,UAAA,kBAAC,EAAgB,UAAjB,EAA2B,YAAmC,CAAA;AACtC,CAAA,EACF,CAAA,CACxB;AACD,EAAc,cAAc,EAAgB,QAAQ;AAYpD,IAAa,IAAa,EAAM,YAG7B,EAAE,cAAW,aAAU,GAAG,KAAS,MACrC,kBAAC,EAAgB,MAAjB;CACM;CACL,WAAW,EACV,EACC,0LACA,CACD,CACD;CACA,GAAI;CARL,UAAA,CAUC,kBAAC,EAAgB,UAAjB,EAA2B,YAAmC,CAAA,GAC9D,kBAAC,EAAgB,eAAjB;EAA+B,WAAU;EACxC,UAAA,kBAAC,GAAD,EAAO,WAAU,cAAe,CAAA;CACF,CAAA,CACV;AACtB,CAAA,CAAA;AACD,EAAW,cAAc,EAAgB,KAAK"}
+{"version":3,"file":"select.js","names":["React","SelectPrimitive","Select","SelectValue","SelectGroup","SELECT_SIZE_CLASS","SelectTrigger","props","disabled","loading","controlSurfaceClass","cn","size","FOCUS_BORDER","className","children","ChevronDown","SelectLabel","SelectContent","highlightRef","useHoverHighlight","overlayPanelClass","position","SelectItem","overlayItemClass","Check"],"sources":["../../src/components/select.tsx"],"sourcesContent":["import * as SelectPrimitive from \"@radix-ui/react-select\";\nimport { Check, ChevronDown } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\nimport { FOCUS_BORDER, OVERLAY_GAP, overlayItemClass, overlayPanelClass } from \"./overlay\";\n\nexport type SelectProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled value of the select.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial value of the select.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected value changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Select: React.FC<SelectProps> = SelectPrimitive.Root;\n\nexport type SelectValueProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Value>,\n\t\"placeholder\"\n> & {\n\t/**\n\t * Content shown when no value is selected.\n\t */\n\tplaceholder?: React.ReactNode;\n};\nexport const SelectValue: React.ForwardRefExoticComponent<\n\tSelectValueProps & React.RefAttributes<React.ElementRef<typeof SelectPrimitive.Value>>\n> = SelectPrimitive.Value;\n\ntype RadixSelectGroupProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Group>;\nexport type SelectGroupProps = Omit<RadixSelectGroupProps, \"asChild\"> & {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Group forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixSelectGroupProps[\"asChild\"];\n};\nexport const SelectGroup: React.ForwardRefExoticComponent<\n\tSelectGroupProps & React.RefAttributes<React.ElementRef<typeof SelectPrimitive.Group>>\n> = SelectPrimitive.Group;\n\nexport type SelectSize = \"sm\" | \"default\" | \"lg\";\n\nconst SELECT_SIZE_CLASS: Record<SelectSize, string> = {\n\tsm: \"basalt-action basalt-action-sm\",\n\tdefault: \"basalt-action\",\n\tlg: \"basalt-action basalt-action-lg\",\n};\n\nexport type SelectTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>,\n\t\"disabled\"\n> & {\n\t/**\n\t * The visual size of the trigger.\n\t * @default default\n\t */\n\tsize?: SelectSize;\n\t/**\n\t * Disable the trigger and mark it busy.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * Disable the trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const SelectTrigger = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Trigger>,\n\tSelectTriggerProps\n>(({ className, children, size = \"default\", loading = false, disabled = false, ...props }, ref) => (\n\t<SelectPrimitive.Trigger\n\t\tref={ref}\n\t\t{...props}\n\t\tdisabled={disabled || loading}\n\t\taria-busy={loading || undefined}\n\t\tclassName={controlSurfaceClass(\n\t\t\tcn(\n\t\t\t\t\"group/select flex w-full items-center justify-between\",\n\t\t\t\tSELECT_SIZE_CLASS[size],\n\t\t\t\tFOCUS_BORDER,\n\t\t\t\t\"aria-invalid:border-basalt-destructive aria-invalid:focus-visible:border-basalt-destructive\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t>\n\t\t{children}\n\t\t<ChevronDown\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName=\"h-basalt-4 w-basalt-4 opacity-50 transition-transform basalt-motion duration-basalt-normal group-data-[state=open]/select:rotate-180 motion-reduce:transition-none\"\n\t\t/>\n\t</SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\ntype RadixSelectLabelProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>;\nexport type SelectLabelProps = Omit<RadixSelectLabelProps, \"asChild\"> & {\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Label forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixSelectLabelProps[\"asChild\"];\n};\n\nexport const SelectLabel = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Label>,\n\tSelectLabelProps\n>(({ className, ...props }, ref) => (\n\t<SelectPrimitive.Label\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"px-basalt-space-lg py-basalt-space-md text-basalt-sm text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\nexport type SelectContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>,\n\t\"position\" | \"sideOffset\"\n> & {\n\t/**\n\t * The positioning mode for the select content.\n\t * @default popper\n\t */\n\tposition?: \"item-aligned\" | \"popper\";\n\t/**\n\t * The distance between the trigger and the select content.\n\t * @default 4\n\t */\n\tsideOffset?: number;\n};\n\nexport const SelectContent = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Content>,\n\tSelectContentProps\n>(({ className, children, position = \"popper\", sideOffset = OVERLAY_GAP, ...props }, ref) => {\n\tconst highlightRef = useHoverHighlight();\n\treturn (\n\t\t<SelectPrimitive.Portal>\n\t\t\t<SelectPrimitive.Content\n\t\t\t\tref={ref}\n\t\t\t\tposition={position}\n\t\t\t\tsideOffset={sideOffset}\n\t\t\t\tclassName={overlayPanelClass(\n\t\t\t\t\tcn(position === \"popper\" && \"w-[var(--radix-select-trigger-width)]\", className),\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t<SelectPrimitive.Viewport ref={highlightRef} className=\"basalt-hover-list\">\n\t\t\t\t\t{children}\n\t\t\t\t</SelectPrimitive.Viewport>\n\t\t\t</SelectPrimitive.Content>\n\t\t</SelectPrimitive.Portal>\n\t);\n});\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\nexport type SelectItemProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>,\n\t\"value\"\n> & {\n\t/**\n\t * The value associated with the select item.\n\t */\n\tvalue: string;\n};\n\nexport const SelectItem = React.forwardRef<\n\tReact.ElementRef<typeof SelectPrimitive.Item>,\n\tSelectItemProps\n>(({ className, children, ...props }, ref) => (\n\t<SelectPrimitive.Item\n\t\tdata-basalt-hover-item=\"\"\n\t\tref={ref}\n\t\tclassName={overlayItemClass(\n\t\t\tcn(\n\t\t\t\t\"relative outline-hidden data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[disabled]:hover:bg-transparent\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t)}\n\t\t{...props}\n\t>\n\t\t<SelectPrimitive.ItemText className=\"min-w-0 flex-1\">{children}</SelectPrimitive.ItemText>\n\t\t<span className=\"inline-flex w-basalt-icon shrink-0 justify-end\">\n\t\t\t<SelectPrimitive.ItemIndicator>\n\t\t\t\t<Check className=\"size-basalt-icon\" />\n\t\t\t</SelectPrimitive.ItemIndicator>\n\t\t</span>\n\t</SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n"],"mappings":";;;;;;;;;;AAyBA,IAAaE,IAAgCD,EAAgB,MAWhDE,IAETF,EAAgB,OAWPG,IAETH,EAAgB,OAIdI,IAAgD;CACrD,IAAI;CACJ,SAAS;CACT,IAAI;AACL,GAuBaC,IAAgBN,EAAM,YAGhC,EAAE,cAAW,aAAU,UAAO,WAAW,aAAU,IAAO,cAAW,IAAO,GAAGO,KAAS,MAC1F,kBAACN,EAAgB,SAAjB;CACM;CACL,GAAIM;CACJ,UAAUC,KAAYC;CACtB,aAAWA,KAAW,KAAA;CACtB,WAAWC,EACVC,EACC,yDACAN,EAAkBO,IAClBC,GACA,+FACAC,CACD,CACD;CAbD,UAAA,CAeEC,GACD,kBAACC,GAAD;EACC,eAAY;EACZ,WAAU;CACV,CAAA,CACuB;AACzB,CAAA,CAAA;AACD,EAAc,cAAcf,EAAgB,QAAQ;AAYpD,IAAagB,IAAcjB,EAAM,YAG9B,EAAE,cAAW,GAAGO,KAAS,MAC3B,kBAACN,EAAgB,OAAjB;CACM;CACL,WAAWU,EACV,qFACAG,CACD;CACA,GAAIP;AACJ,CAAA,CACD;AACD,EAAY,cAAcN,EAAgB,MAAM;AAkBhD,IAAaiB,IAAgBlB,EAAM,YAGhC,EAAE,cAAW,aAAU,cAAW,UAAU,gBAAA,GAA0B,GAAGO,KAAS,MAAQ;CAC5F,IAAMY,IAAeC,EAAkB;CACvC,OACC,kBAACnB,EAAgB,QAAjB,EAAA,UACC,kBAACA,EAAgB,SAAjB;EACM;EACK;EACE;EACZ,WAAWoB,EACVV,EAAGW,MAAa,YAAY,yCAAyCR,CAAS,CAC/E;EACA,GAAIP;EAEJ,UAAA,kBAACN,EAAgB,UAAjB;GAA0B,KAAKkB;GAAc,WAAU;GACrD;EACwB,CAAA;CACF,CAAA,EACF,CAAA;AAE1B,CAAC;AACD,EAAc,cAAclB,EAAgB,QAAQ;AAYpD,IAAasB,IAAavB,EAAM,YAG7B,EAAE,cAAW,aAAU,GAAGO,KAAS,MACrC,kBAACN,EAAgB,MAAjB;CACC,0BAAuB;CAClB;CACL,WAAWuB,EACVb,EACC,+HACAG,CACD,CACD;CACA,GAAIP;CATL,UAAA,CAWC,kBAACN,EAAgB,UAAjB;EAA0B,WAAU;EAAkB;CAAmC,CAAA,GACzF,kBAAC,QAAD;EAAM,WAAU;EACf,UAAA,kBAACA,EAAgB,eAAjB,EAAA,UACC,kBAACwB,GAAD,EAAO,WAAU,mBAAoB,CAAA,EACP,CAAA;CAC1B,CAAA,CACe;AACtB,CAAA,CAAA;AACD,EAAW,cAAcxB,EAAgB,KAAK"}

package/dist/components/sensitive-input.js

@@ -1,36 +1,34 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { Button as t } from "./button.js";
-import { Input as n } from "./input.js";
-import * as r from "react";
-import { Eye as i, EyeOff as a } from "lucide-react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { controlSurfaceClass as t } from "../utils/control-surface.js";
+import { Button as n } from "./button.js";
+import { Input as r } from "./input.js";
+import * as i from "react";
+import { Eye as a, EyeOff as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region src/components/sensitive-input.tsx
-var c = {
-	sm: "h-8 w-8",
-	default: "h-9 w-9",
-	lg: "h-10 w-10"
-}, l = r.forwardRef(({ className: l, revealLabel: u, hideLabel: d, disabled: f, size: p = "default", passwordManagerIgnore: m = !1, ...h }, g) => {
-	let [_, v] = r.useState(!1);
-	return /* @__PURE__ */ s("div", {
-		className: "relative",
-		children: [/* @__PURE__ */ o(n, {
+var l = i.forwardRef(({ className: l, revealLabel: u, hideLabel: d, disabled: f, size: p = "default", passwordManagerIgnore: m = !1, ...h }, g) => {
+	let [_, v] = i.useState(!1);
+	return /* @__PURE__ */ c("div", {
+		className: t("flex focus-within:border-basalt-ring has-[input[aria-invalid=true]]:border-basalt-destructive"),
+		children: [/* @__PURE__ */ s(r, {
 			ref: g,
 			type: _ ? "text" : "password",
 			size: p,
 			passwordManagerIgnore: m,
-			className: e("pr-10", l),
+			className: e("min-w-0 flex-1 border-0 bg-transparent shadow-none", l),
 			disabled: f,
 			...h
-		}), /* @__PURE__ */ o(t, {
+		}), /* @__PURE__ */ s(n, {
 			type: "button",
 			variant: "ghost",
-			className: e("absolute right-0 top-0", c[p]),
+			size: p === "default" ? "icon" : p,
+			className: "basalt-action-icon basalt-action-inset shrink-0",
 			"aria-label": _ ? d : u,
 			disabled: f,
 			onClick: () => v((e) => !e),
-			children: o(_ ? a : i, {
-				className: "h-4 w-4",
+			children: s(_ ? o : a, {
+				className: "h-basalt-4 w-basalt-4",
 				"aria-hidden": "true"
 			})
 		})]

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

@@ -1 +1 @@
-{"version":3,"file":"sensitive-input.js","names":[],"sources":["../../src/components/sensitive-input.tsx"],"sourcesContent":["import { Eye, EyeOff } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { Button } from \"./button\";\nimport { Input, type InputSize } from \"./input\";\n\nconst TOGGLE_SIZE_CLASS: Record<InputSize, string> = {\n\tsm: \"h-8 w-8\",\n\tdefault: \"h-9 w-9\",\n\tlg: \"h-10 w-10\",\n};\n\nexport type SensitiveInputProps = Omit<React.ComponentProps<\"input\">, \"type\" | \"size\"> & {\n\t/**\n\t * Accessible label for the reveal action.\n\t */\n\trevealLabel: string;\n\t/**\n\t * Accessible label for the hide action.\n\t */\n\thideLabel: string;\n\t/**\n\t * The visual size of the field.\n\t * @default default\n\t */\n\tsize?: InputSize;\n\t/**\n\t * Ignore password managers on this field.\n\t * @default false\n\t */\n\tpasswordManagerIgnore?: boolean;\n};\n\nexport const SensitiveInput = React.forwardRef<HTMLInputElement, SensitiveInputProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\trevealLabel,\n\t\t\thideLabel,\n\t\t\tdisabled,\n\t\t\tsize = \"default\",\n\t\t\tpasswordManagerIgnore = false,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst [revealed, setRevealed] = React.useState(false);\n\t\treturn (\n\t\t\t<div className=\"relative\">\n\t\t\t\t<Input\n\t\t\t\t\tref={ref}\n\t\t\t\t\ttype={revealed ? \"text\" : \"password\"}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tpasswordManagerIgnore={passwordManagerIgnore}\n\t\t\t\t\tclassName={cn(\"pr-10\", className)}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tclassName={cn(\"absolute right-0 top-0\", TOGGLE_SIZE_CLASS[size])}\n\t\t\t\t\taria-label={revealed ? hideLabel : revealLabel}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => setRevealed((value) => !value)}\n\t\t\t\t>\n\t\t\t\t\t{revealed ? (\n\t\t\t\t\t\t<EyeOff className=\"h-4 w-4\" aria-hidden=\"true\" />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Eye className=\"h-4 w-4\" aria-hidden=\"true\" />\n\t\t\t\t\t)}\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t);\n\t},\n);\nSensitiveInput.displayName = \"SensitiveInput\";\n"],"mappings":";;;;;;;;AAMA,IAAM,IAA+C;CACpD,IAAI;CACJ,SAAS;CACT,IAAI;AACL,GAuBa,IAAiB,EAAM,YAElC,EACC,cACA,gBACA,cACA,aACA,UAAO,WACP,2BAAwB,IACxB,GAAG,KAEJ,MACI;CACJ,IAAM,CAAC,GAAU,KAAe,EAAM,SAAS,EAAK;CACpD,OACC,kBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CACC,kBAAC,GAAD;GACM;GACL,MAAM,IAAW,SAAS;GACpB;GACiB;GACvB,WAAW,EAAG,SAAS,CAAS;GACtB;GACV,GAAI;EACJ,CAAA,GACD,kBAAC,GAAD;GACC,MAAK;GACL,SAAQ;GACR,WAAW,EAAG,0BAA0B,EAAkB,EAAK;GAC/D,cAAY,IAAW,IAAY;GACzB;GACV,eAAe,GAAa,MAAU,CAAC,CAAK;GAE3C,UACA,EADA,IACC,IAEA,GAFD;IAAQ,WAAU;IAAU,eAAY;GAAQ,CAEH;EAEvC,CAAA,CACJ;;AAEP,CACD;AACA,EAAe,cAAc"}
+{"version":3,"file":"sensitive-input.js","names":["React","SensitiveInput","props","revealed","setRevealed","controlSurfaceClass","Input","cn","className","Button","size","hideLabel","revealLabel","value","jsx","EyeOff","Eye"],"sources":["../../src/components/sensitive-input.tsx"],"sourcesContent":["import { Eye, EyeOff } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { controlSurfaceClass } from \"../utils/control-surface\";\nimport { Button } from \"./button\";\nimport { Input, type InputSize } from \"./input\";\n\nexport type SensitiveInputProps = Omit<React.ComponentProps<\"input\">, \"type\" | \"size\"> & {\n\t/**\n\t * Accessible label for the reveal action.\n\t */\n\trevealLabel: string;\n\t/**\n\t * Accessible label for the hide action.\n\t */\n\thideLabel: string;\n\t/**\n\t * The visual size of the field.\n\t * @default default\n\t */\n\tsize?: InputSize;\n\t/**\n\t * Ignore password managers on this field.\n\t * @default false\n\t */\n\tpasswordManagerIgnore?: boolean;\n};\n\nexport const SensitiveInput = React.forwardRef<HTMLInputElement, SensitiveInputProps>(\n\t(\n\t\t{\n\t\t\tclassName,\n\t\t\trevealLabel,\n\t\t\thideLabel,\n\t\t\tdisabled,\n\t\t\tsize = \"default\",\n\t\t\tpasswordManagerIgnore = false,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst [revealed, setRevealed] = React.useState(false);\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclassName={controlSurfaceClass(\n\t\t\t\t\t\"flex focus-within:border-basalt-ring has-[input[aria-invalid=true]]:border-basalt-destructive\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<Input\n\t\t\t\t\tref={ref}\n\t\t\t\t\ttype={revealed ? \"text\" : \"password\"}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tpasswordManagerIgnore={passwordManagerIgnore}\n\t\t\t\t\tclassName={cn(\"min-w-0 flex-1 border-0 bg-transparent shadow-none\", className)}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t{...props}\n\t\t\t\t/>\n\t\t\t\t<Button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\tsize={size === \"default\" ? \"icon\" : size}\n\t\t\t\t\tclassName=\"basalt-action-icon basalt-action-inset shrink-0\"\n\t\t\t\t\taria-label={revealed ? hideLabel : revealLabel}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tonClick={() => setRevealed((value) => !value)}\n\t\t\t\t>\n\t\t\t\t\t{revealed ? (\n\t\t\t\t\t\t<EyeOff className=\"h-basalt-4 w-basalt-4\" aria-hidden=\"true\" />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Eye className=\"h-basalt-4 w-basalt-4\" aria-hidden=\"true\" />\n\t\t\t\t\t)}\n\t\t\t\t</Button>\n\t\t\t</div>\n\t\t);\n\t},\n);\nSensitiveInput.displayName = \"SensitiveInput\";\n"],"mappings":";;;;;;;;;AA4BA,IAAaC,IAAiBD,EAAM,YAElC,EACC,cACA,gBACA,cACA,aACA,UAAO,WACP,2BAAwB,IACxB,GAAGE,KAEJ,MACI;CACJ,IAAM,CAACC,GAAUC,KAAeJ,EAAM,SAAS,EAAK;CACpD,OACC,kBAAC,OAAD;EACC,WAAWK,EACV,+FACD;EAHD,UAAA,CAKC,kBAACC,GAAD;GACM;GACL,MAAMH,IAAW,SAAS;GACpB;GACiB;GACvB,WAAWI,EAAG,sDAAsDC,CAAS;GACnE;GACV,GAAIN;EACJ,CAAA,GACD,kBAACO,GAAD;GACC,MAAK;GACL,SAAQ;GACR,MAAMC,MAAS,YAAY,SAASA;GACpC,WAAU;GACV,cAAYP,IAAWQ,IAAYC;GACzB;GACV,eAAeR,GAAa,MAAU,CAACS,CAAK;GAE3C,UACAC,EADAX,IACCY,IAEAC,GAFD;IAAQ,WAAU;IAAwB,eAAY;GAAQ,CAEH;EAErD,CAAA,CACJ;;AAEP,CACD;AACA,EAAe,cAAc"}

package/dist/components/separator.js.map

@@ -1 +1 @@
-{"version":3,"file":"separator.js","names":[],"sources":["../../src/components/separator.tsx"],"sourcesContent":["import * as SeparatorPrimitive from \"@radix-ui/react-separator\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type SeparatorProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>,\n\t\"orientation\" | \"decorative\"\n> & {\n\t/**\n\t * The orientation of the separator.\n\t * @default horizontal\n\t */\n\torientation?: \"horizontal\" | \"vertical\";\n\t/**\n\t * Whether the separator is purely decorative.\n\t * @default true\n\t */\n\tdecorative?: boolean;\n};\n\nexport const Separator = React.forwardRef<\n\tReact.ElementRef<typeof SeparatorPrimitive.Root>,\n\tSeparatorProps\n>(({ className, orientation = \"horizontal\", decorative = true, ...props }, ref) => (\n\t<SeparatorPrimitive.Root\n\t\tref={ref}\n\t\tdecorative={decorative}\n\t\torientation={orientation}\n\t\tclassName={cn(\n\t\t\t\"shrink-0 bg-basalt-border\",\n\t\t\torientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSeparator.displayName = SeparatorPrimitive.Root.displayName;\n"],"mappings":";;;;;;AAoBA,IAAa,IAAY,EAAM,YAG5B,EAAE,cAAW,iBAAc,cAAc,gBAAa,IAAM,GAAG,KAAS,MAC1E,kBAAC,EAAmB,MAApB;CACM;CACO;CACC;CACb,WAAW,EACV,6BACA,MAAgB,eAAe,gBAAgB,eAC/C,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAU,cAAc,EAAmB,KAAK"}
+{"version":3,"file":"separator.js","names":["React","SeparatorPrimitive","Separator","props","cn","orientation","className"],"sources":["../../src/components/separator.tsx"],"sourcesContent":["import * as SeparatorPrimitive from \"@radix-ui/react-separator\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type SeparatorProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>,\n\t\"orientation\" | \"decorative\"\n> & {\n\t/**\n\t * The orientation of the separator.\n\t * @default horizontal\n\t */\n\torientation?: \"horizontal\" | \"vertical\";\n\t/**\n\t * Whether the separator is purely decorative.\n\t * @default true\n\t */\n\tdecorative?: boolean;\n};\n\nexport const Separator = React.forwardRef<\n\tReact.ElementRef<typeof SeparatorPrimitive.Root>,\n\tSeparatorProps\n>(({ className, orientation = \"horizontal\", decorative = true, ...props }, ref) => (\n\t<SeparatorPrimitive.Root\n\t\tref={ref}\n\t\tdecorative={decorative}\n\t\torientation={orientation}\n\t\tclassName={cn(\n\t\t\t\"shrink-0 bg-basalt-border\",\n\t\t\torientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSeparator.displayName = SeparatorPrimitive.Root.displayName;\n"],"mappings":";;;;;;AAoBA,IAAaE,IAAYF,EAAM,YAG5B,EAAE,cAAW,iBAAc,cAAc,gBAAa,IAAM,GAAGG,KAAS,MAC1E,kBAACF,EAAmB,MAApB;CACM;CACO;CACC;CACb,WAAWG,EACV,6BACAC,MAAgB,eAAe,gBAAgB,eAC/CC,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAU,cAAcF,EAAmB,KAAK"}

package/dist/components/sheet.d.ts

@@ -64,10 +64,10 @@ export interface SheetDescriptionProps extends Omit<RadixDialogDescriptionProps,
 }
 export declare const SheetDescription: React.ForwardRefExoticComponent<SheetDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
 declare const SIDE: {
-    readonly right: "fixed inset-y-0 right-0 basalt-ui flex h-full w-80 flex-col gap-3 border-l border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg";
-    readonly left: "fixed inset-y-0 left-0 basalt-ui flex h-full w-80 flex-col gap-3 border-r border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg";
-    readonly top: "fixed inset-x-0 top-0 basalt-ui flex h-80 w-full flex-col gap-3 border-b border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg";
-    readonly bottom: "fixed inset-x-0 bottom-0 basalt-ui flex h-80 w-full flex-col gap-3 border-t border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg";
+    readonly right: "fixed inset-y-0 right-0 basalt-ui flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-l border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg";
+    readonly left: "fixed inset-y-0 left-0 basalt-ui flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-r border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg";
+    readonly top: "fixed inset-x-0 top-0 basalt-ui flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-b border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg";
+    readonly bottom: "fixed inset-x-0 bottom-0 basalt-ui flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-t border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg";
 };
 export type SheetSide = keyof typeof SIDE;
 export interface SheetContentProps extends Omit<RadixDialogContentProps, "side" | "asChild" | "forceMount" | "trapFocus" | "onOpenAutoFocus" | "onCloseAutoFocus" | "onEscapeKeyDown" | "onPointerDownOutside" | "onFocusOutside" | "onInteractOutside"> {

package/dist/components/sheet.js

@@ -8,30 +8,32 @@ import * as s from "@radix-ui/react-dialog";
 //#region src/components/sheet.tsx
 var c = s.Root, l = s.Trigger, u = s.Close, d = i.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a(s.Title, {
 	ref: r,
-	className: e("text-lg font-semibold leading-none tracking-tight", t),
+	className: e("text-basalt-lg font-semibold leading-basalt-tight tracking-tight", t),
 	...n
 }));
 d.displayName = s.Title.displayName;
 var f = i.forwardRef(({ className: t, ...n }, r) => /* @__PURE__ */ a(s.Description, {
 	ref: r,
-	className: e("text-sm text-basalt-muted-foreground", t),
+	className: e("text-basalt-base leading-[var(--basalt-line-body)] text-basalt-muted-foreground", t),
 	...n
 }));
 f.displayName = s.Description.displayName;
 var p = {
-	right: `fixed inset-y-0 right-0 ${t} flex h-full w-80 flex-col gap-3 border-l border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,
-	left: `fixed inset-y-0 left-0 ${t} flex h-full w-80 flex-col gap-3 border-r border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,
-	top: `fixed inset-x-0 top-0 ${t} flex h-80 w-full flex-col gap-3 border-b border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,
-	bottom: `fixed inset-x-0 bottom-0 ${t} flex h-80 w-full flex-col gap-3 border-t border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`
+	right: `fixed inset-y-0 right-0 ${t} flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-l border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,
+	left: `fixed inset-y-0 left-0 ${t} flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-r border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,
+	top: `fixed inset-x-0 top-0 ${t} flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-b border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,
+	bottom: `fixed inset-x-0 bottom-0 ${t} flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-t border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`
 }, m = i.forwardRef(({ className: t, side: i = "right", children: c, ...l }, u) => /* @__PURE__ */ o(s.Portal, {
 	forceMount: l.forceMount,
 	children: [/* @__PURE__ */ a(s.Overlay, {
 		forceMount: l.forceMount,
-		className: e("fixed inset-0 bg-black/50 backdrop-blur-xs", n, r)
+		className: e("basalt-sheet-overlay fixed inset-0 bg-basalt-backdrop/50", n, r)
 	}), /* @__PURE__ */ a(s.Content, {
 		ref: u,
+		"data-basalt-sheet": "",
+		"data-side": i,
 		"data-basalt-surface-root": "",
-		className: e(n, r, p[i], t),
+		className: e(n, r, "max-h-dvh max-w-full", p[i], t),
 		...l,
 		style: {
 			boxSizing: "border-box",
@@ -42,12 +44,12 @@ var p = {
 }));
 m.displayName = "SheetContent";
 var h = ({ className: t, ...n }) => /* @__PURE__ */ a("div", {
-	className: e("flex flex-col space-y-2 text-left", t),
+	className: e("flex flex-col space-y-basalt-space-lg text-left", t),
 	...n
 });
 h.displayName = "SheetHeader";
 var g = ({ className: t, ...n }) => /* @__PURE__ */ a("div", {
-	className: e("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
+	className: e("flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end", t),
 	...n
 });
 g.displayName = "SheetFooter";

package/dist/components/sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"sheet.js","names":[],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\ntype RadixDialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ntype RadixDialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ntype RadixDialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ntype RadixDialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ntype RadixDialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ntype RadixDialogDescriptionProps = React.ComponentPropsWithoutRef<\n\ttypeof DialogPrimitive.Description\n>;\n\nexport interface SheetProps\n\textends Omit<RadixDialogProps, \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Controlled open state of the sheet drawer.\n\t */\n\topen?: RadixDialogProps[\"open\"];\n\t/**\n\t * Uncontrolled default open state of the sheet on initial render.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDialogProps[\"defaultOpen\"];\n\t/**\n\t * Callback invoked when the open state changes.\n\t */\n\tonOpenChange?: RadixDialogProps[\"onOpenChange\"];\n\t/**\n\t * Whether the sheet renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default true\n\t */\n\tmodal?: RadixDialogProps[\"modal\"];\n}\n\nexport const Sheet: React.FC<SheetProps> = DialogPrimitive.Root;\n\nexport interface SheetTriggerProps extends Omit<RadixDialogTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Trigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTriggerProps[\"asChild\"];\n}\n\nexport const SheetTrigger = DialogPrimitive.Trigger;\n\nexport interface SheetCloseProps extends Omit<RadixDialogCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Close forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogCloseProps[\"asChild\"];\n}\n\nexport const SheetClose = DialogPrimitive.Close;\n\nexport interface SheetTitleProps extends Omit<RadixDialogTitleProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered heading element to the child element, merging props and behavior.\n\t * Title forwards ref to HTMLHeadingElement and inherits native h2 attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTitleProps[\"asChild\"];\n}\n\nexport const SheetTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tSheetTitleProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-lg font-semibold leading-none tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nSheetTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport interface SheetDescriptionProps extends Omit<RadixDialogDescriptionProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered paragraph element to the child element, merging props and behavior.\n\t * Description forwards ref to HTMLParagraphElement and inherits native p attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogDescriptionProps[\"asChild\"];\n}\n\nexport const SheetDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tSheetDescriptionProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\"text-sm text-basalt-muted-foreground\", className)}\n\t\t{...props}\n\t/>\n));\nSheetDescription.displayName = DialogPrimitive.Description.displayName;\n\nconst SIDE = {\n\tright: `fixed inset-y-0 right-0 ${BASALT_UI_CLASS} flex h-full w-80 flex-col gap-3 border-l border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,\n\tleft: `fixed inset-y-0 left-0 ${BASALT_UI_CLASS} flex h-full w-80 flex-col gap-3 border-r border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,\n\ttop: `fixed inset-x-0 top-0 ${BASALT_UI_CLASS} flex h-80 w-full flex-col gap-3 border-b border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,\n\tbottom: `fixed inset-x-0 bottom-0 ${BASALT_UI_CLASS} flex h-80 w-full flex-col gap-3 border-t border-basalt-border p-6 text-sm text-basalt-foreground shadow-lg`,\n} as const;\n\nexport type SheetSide = keyof typeof SIDE;\n\nexport interface SheetContentProps\n\textends Omit<\n\t\tRadixDialogContentProps,\n\t\t| \"side\"\n\t\t| \"asChild\"\n\t\t| \"forceMount\"\n\t\t| \"trapFocus\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Edge of the screen where the drawer panel is positioned and anchored.\n\t * @default \"right\"\n\t */\n\tside?: SheetSide;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Content forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogContentProps[\"asChild\"];\n\t/**\n\t * Force mounting content in DOM for external animation controls.\n\t * When forceMount is true, the content remains mounted even when closed.\n\t * The caller is responsible for visibility transitions and unmounting after animation completes.\n\t * Note: Keeping modal content forceMounted may isolate background interactions until unmounted.\n\t */\n\tforceMount?: RadixDialogContentProps[\"forceMount\"];\n\t/**\n\t * Event handler called when auto-focusing the first element on open. Can be prevented with event.preventDefault().\n\t */\n\tonOpenAutoFocus?: RadixDialogContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Event handler called when restoring focus on close. Can be prevented with event.preventDefault().\n\t */\n\tonCloseAutoFocus?: RadixDialogContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Event handler called when the Escape key is pressed. Can be prevented with event.preventDefault().\n\t */\n\tonEscapeKeyDown?: RadixDialogContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Event handler called when a pointer event occurs outside the sheet bounds.\n\t */\n\tonPointerDownOutside?: RadixDialogContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Event handler called when focus moves outside the sheet bounds.\n\t */\n\tonFocusOutside?: RadixDialogContentProps[\"onFocusOutside\"];\n\t/**\n\t * Event handler called when any interaction (pointer or focus) occurs outside the sheet bounds.\n\t */\n\tonInteractOutside?: RadixDialogContentProps[\"onInteractOutside\"];\n}\n\nexport const SheetContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tSheetContentProps\n>(({ className, side = \"right\", children, ...props }, ref) => (\n\t<DialogPrimitive.Portal forceMount={props.forceMount}>\n\t\t<DialogPrimitive.Overlay\n\t\t\tforceMount={props.forceMount}\n\t\t\tclassName={cn(\"fixed inset-0 bg-black/50 backdrop-blur-xs\", OVERLAY_LAYER, OVERLAY_MOTION)}\n\t\t/>\n\t\t<DialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-basalt-surface-root=\"\"\n\t\t\tclassName={cn(OVERLAY_LAYER, OVERLAY_MOTION, SIDE[side], className)}\n\t\t\t{...props}\n\t\t\tstyle={{ boxSizing: \"border-box\", ...props.style }}\n\t\t>\n\t\t\t{children}\n\t\t</DialogPrimitive.Content>\n\t</DialogPrimitive.Portal>\n));\nSheetContent.displayName = \"SheetContent\";\n\nexport interface SheetHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const SheetHeader = ({ className, ...props }: SheetHeaderProps) => (\n\t<div className={cn(\"flex flex-col space-y-2 text-left\", className)} {...props} />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nexport interface SheetFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const SheetFooter = ({ className, ...props }: SheetFooterProps) => (\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);\nSheetFooter.displayName = \"SheetFooter\";\n"],"mappings":";;;;;;;;AAqCA,IAAa,IAA8B,EAAgB,MAW9C,IAAe,EAAgB,SAW/B,IAAa,EAAgB,OAW7B,IAAa,EAAM,YAG7B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,qDAAqD,CAAS;CAC5E,GAAI;AACJ,CAAA,CACD;AACD,EAAW,cAAc,EAAgB,MAAM;AAW/C,IAAa,IAAmB,EAAM,YAGnC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,aAAjB;CACM;CACL,WAAW,EAAG,wCAAwC,CAAS;CAC/D,GAAI;AACJ,CAAA,CACD;AACD,EAAiB,cAAc,EAAgB,YAAY;AAE3D,IAAM,IAAO;CACZ,OAAO,2BAA2B,EAAgB;CAClD,MAAM,0BAA0B,EAAgB;CAChD,KAAK,yBAAyB,EAAgB;CAC9C,QAAQ,4BAA4B,EAAgB;AACrD,GA8Da,IAAe,EAAM,YAG/B,EAAE,cAAW,UAAO,SAAS,aAAU,GAAG,KAAS,MACrD,kBAAC,EAAgB,QAAjB;CAAwB,YAAY,EAAM;CAA1C,UAAA,CACC,kBAAC,EAAgB,SAAjB;EACC,YAAY,EAAM;EAClB,WAAW,EAAG,8CAA8C,GAAe,CAAc;CACzF,CAAA,GACD,kBAAC,EAAgB,SAAjB;EACM;EACL,4BAAyB;EACzB,WAAW,EAAG,GAAe,GAAgB,EAAK,IAAO,CAAS;EAClE,GAAI;EACJ,OAAO;GAAE,WAAW;GAAc,GAAG,EAAM;EAAM;EAEhD;CACuB,CAAA,CACF;AACxB,CAAA,CAAA;AACD,EAAa,cAAc;AAI3B,IAAa,KAAe,EAAE,cAAW,GAAG,QAC3C,kBAAC,OAAD;CAAK,WAAW,EAAG,qCAAqC,CAAS;CAAG,GAAI;AAAQ,CAAA;AAEjF,EAAY,cAAc;AAI1B,IAAa,KAAe,EAAE,cAAW,GAAG,QAC3C,kBAAC,OAAD;CACC,WAAW,EAAG,0DAA0D,CAAS;CACjF,GAAI;AACJ,CAAA;AAEF,EAAY,cAAc"}
+{"version":3,"file":"sheet.js","names":["React","DialogPrimitive","Sheet","SheetTrigger","SheetClose","SheetTitle","props","cn","className","SheetDescription","SIDE","BASALT_UI_CLASS","SheetContent","OVERLAY_LAYER","OVERLAY_MOTION","side","SheetHeader","SheetFooter"],"sources":["../../src/components/sheet.tsx"],"sourcesContent":["import * as DialogPrimitive from \"@radix-ui/react-dialog\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { OVERLAY_LAYER, OVERLAY_MOTION } from \"./overlay\";\n\ntype RadixDialogProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Root>;\ntype RadixDialogTriggerProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Trigger>;\ntype RadixDialogCloseProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>;\ntype RadixDialogContentProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>;\ntype RadixDialogTitleProps = React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>;\ntype RadixDialogDescriptionProps = React.ComponentPropsWithoutRef<\n\ttypeof DialogPrimitive.Description\n>;\n\nexport interface SheetProps\n\textends Omit<RadixDialogProps, \"open\" | \"defaultOpen\" | \"onOpenChange\" | \"modal\"> {\n\t/**\n\t * Controlled open state of the sheet drawer.\n\t */\n\topen?: RadixDialogProps[\"open\"];\n\t/**\n\t * Uncontrolled default open state of the sheet on initial render.\n\t * @default false\n\t */\n\tdefaultOpen?: RadixDialogProps[\"defaultOpen\"];\n\t/**\n\t * Callback invoked when the open state changes.\n\t */\n\tonOpenChange?: RadixDialogProps[\"onOpenChange\"];\n\t/**\n\t * Whether the sheet renders modally, preventing outside interaction and hiding background content from screen readers.\n\t * @default true\n\t */\n\tmodal?: RadixDialogProps[\"modal\"];\n}\n\nexport const Sheet: React.FC<SheetProps> = DialogPrimitive.Root;\n\nexport interface SheetTriggerProps extends Omit<RadixDialogTriggerProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Trigger forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTriggerProps[\"asChild\"];\n}\n\nexport const SheetTrigger = DialogPrimitive.Trigger;\n\nexport interface SheetCloseProps extends Omit<RadixDialogCloseProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered button element to the child element, merging props and behavior.\n\t * Close forwards ref to HTMLButtonElement and inherits native button attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogCloseProps[\"asChild\"];\n}\n\nexport const SheetClose = DialogPrimitive.Close;\n\nexport interface SheetTitleProps extends Omit<RadixDialogTitleProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered heading element to the child element, merging props and behavior.\n\t * Title forwards ref to HTMLHeadingElement and inherits native h2 attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogTitleProps[\"asChild\"];\n}\n\nexport const SheetTitle = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Title>,\n\tSheetTitleProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Title\n\t\tref={ref}\n\t\tclassName={cn(\"text-basalt-lg font-semibold leading-basalt-tight tracking-tight\", className)}\n\t\t{...props}\n\t/>\n));\nSheetTitle.displayName = DialogPrimitive.Title.displayName;\n\nexport interface SheetDescriptionProps extends Omit<RadixDialogDescriptionProps, \"asChild\"> {\n\t/**\n\t * Change the default rendered paragraph element to the child element, merging props and behavior.\n\t * Description forwards ref to HTMLParagraphElement and inherits native p attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogDescriptionProps[\"asChild\"];\n}\n\nexport const SheetDescription = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Description>,\n\tSheetDescriptionProps\n>(({ className, ...props }, ref) => (\n\t<DialogPrimitive.Description\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"text-basalt-base leading-[var(--basalt-line-body)] text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nSheetDescription.displayName = DialogPrimitive.Description.displayName;\n\nconst SIDE = {\n\tright: `fixed inset-y-0 right-0 ${BASALT_UI_CLASS} flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-l border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,\n\tleft: `fixed inset-y-0 left-0 ${BASALT_UI_CLASS} flex h-full w-basalt-80 flex-col gap-basalt-space-lg border-r border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,\n\ttop: `fixed inset-x-0 top-0 ${BASALT_UI_CLASS} flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-b border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,\n\tbottom: `fixed inset-x-0 bottom-0 ${BASALT_UI_CLASS} flex h-basalt-80 w-full flex-col gap-basalt-space-lg border-t border-basalt-border p-basalt-card sm:p-basalt-card-lg text-basalt-base text-basalt-foreground shadow-lg`,\n} as const;\n\nexport type SheetSide = keyof typeof SIDE;\n\nexport interface SheetContentProps\n\textends Omit<\n\t\tRadixDialogContentProps,\n\t\t| \"side\"\n\t\t| \"asChild\"\n\t\t| \"forceMount\"\n\t\t| \"trapFocus\"\n\t\t| \"onOpenAutoFocus\"\n\t\t| \"onCloseAutoFocus\"\n\t\t| \"onEscapeKeyDown\"\n\t\t| \"onPointerDownOutside\"\n\t\t| \"onFocusOutside\"\n\t\t| \"onInteractOutside\"\n\t> {\n\t/**\n\t * Edge of the screen where the drawer panel is positioned and anchored.\n\t * @default \"right\"\n\t */\n\tside?: SheetSide;\n\t/**\n\t * Change the default rendered div element to the child element, merging props and behavior.\n\t * Content forwards ref to HTMLDivElement and inherits native div attributes.\n\t * @default false\n\t */\n\tasChild?: RadixDialogContentProps[\"asChild\"];\n\t/**\n\t * Force mounting content in DOM for external animation controls.\n\t * When forceMount is true, the content remains mounted even when closed.\n\t * The caller is responsible for visibility transitions and unmounting after animation completes.\n\t * Note: Keeping modal content forceMounted may isolate background interactions until unmounted.\n\t */\n\tforceMount?: RadixDialogContentProps[\"forceMount\"];\n\t/**\n\t * Event handler called when auto-focusing the first element on open. Can be prevented with event.preventDefault().\n\t */\n\tonOpenAutoFocus?: RadixDialogContentProps[\"onOpenAutoFocus\"];\n\t/**\n\t * Event handler called when restoring focus on close. Can be prevented with event.preventDefault().\n\t */\n\tonCloseAutoFocus?: RadixDialogContentProps[\"onCloseAutoFocus\"];\n\t/**\n\t * Event handler called when the Escape key is pressed. Can be prevented with event.preventDefault().\n\t */\n\tonEscapeKeyDown?: RadixDialogContentProps[\"onEscapeKeyDown\"];\n\t/**\n\t * Event handler called when a pointer event occurs outside the sheet bounds.\n\t */\n\tonPointerDownOutside?: RadixDialogContentProps[\"onPointerDownOutside\"];\n\t/**\n\t * Event handler called when focus moves outside the sheet bounds.\n\t */\n\tonFocusOutside?: RadixDialogContentProps[\"onFocusOutside\"];\n\t/**\n\t * Event handler called when any interaction (pointer or focus) occurs outside the sheet bounds.\n\t */\n\tonInteractOutside?: RadixDialogContentProps[\"onInteractOutside\"];\n}\n\nexport const SheetContent = React.forwardRef<\n\tReact.ElementRef<typeof DialogPrimitive.Content>,\n\tSheetContentProps\n>(({ className, side = \"right\", children, ...props }, ref) => (\n\t<DialogPrimitive.Portal forceMount={props.forceMount}>\n\t\t<DialogPrimitive.Overlay\n\t\t\tforceMount={props.forceMount}\n\t\t\tclassName={cn(\n\t\t\t\t\"basalt-sheet-overlay fixed inset-0 bg-basalt-backdrop/50\",\n\t\t\t\tOVERLAY_LAYER,\n\t\t\t\tOVERLAY_MOTION,\n\t\t\t)}\n\t\t/>\n\t\t<DialogPrimitive.Content\n\t\t\tref={ref}\n\t\t\tdata-basalt-sheet=\"\"\n\t\t\tdata-side={side}\n\t\t\tdata-basalt-surface-root=\"\"\n\t\t\tclassName={cn(OVERLAY_LAYER, OVERLAY_MOTION, \"max-h-dvh max-w-full\", SIDE[side], className)}\n\t\t\t{...props}\n\t\t\tstyle={{ boxSizing: \"border-box\", ...props.style }}\n\t\t>\n\t\t\t{children}\n\t\t</DialogPrimitive.Content>\n\t</DialogPrimitive.Portal>\n));\nSheetContent.displayName = \"SheetContent\";\n\nexport interface SheetHeaderProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const SheetHeader = ({ className, ...props }: SheetHeaderProps) => (\n\t<div className={cn(\"flex flex-col space-y-basalt-space-lg text-left\", className)} {...props} />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nexport interface SheetFooterProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const SheetFooter = ({ className, ...props }: SheetFooterProps) => (\n\t<div\n\t\tclassName={cn(\n\t\t\t\"flex flex-col-reverse gap-basalt-space-lg sm:flex-row sm:justify-end\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\nSheetFooter.displayName = \"SheetFooter\";\n"],"mappings":";;;;;;;;AAqCA,IAAaE,IAA8BD,EAAgB,MAW9CE,IAAeF,EAAgB,SAW/BG,IAAaH,EAAgB,OAW7BI,IAAaL,EAAM,YAG7B,EAAE,cAAW,GAAGM,KAAS,MAC3B,kBAACL,EAAgB,OAAjB;CACM;CACL,WAAWM,EAAG,oEAAoEC,CAAS;CAC3F,GAAIF;AACJ,CAAA,CACD;AACD,EAAW,cAAcL,EAAgB,MAAM;AAW/C,IAAaQ,IAAmBT,EAAM,YAGnC,EAAE,cAAW,GAAGM,KAAS,MAC3B,kBAACL,EAAgB,aAAjB;CACM;CACL,WAAWM,EACV,mFACAC,CACD;CACA,GAAIF;AACJ,CAAA,CACD;AACD,EAAiB,cAAcL,EAAgB,YAAY;AAE3D,IAAMS,IAAO;CACZ,OAAO,2BAA2BC,EAAgB;CAClD,MAAM,0BAA0BA,EAAgB;CAChD,KAAK,yBAAyBA,EAAgB;CAC9C,QAAQ,4BAA4BA,EAAgB;AACrD,GA8DaC,IAAeZ,EAAM,YAG/B,EAAE,cAAW,UAAO,SAAS,aAAU,GAAGM,KAAS,MACrD,kBAACL,EAAgB,QAAjB;CAAwB,YAAYK,EAAM;CAA1C,UAAA,CACC,kBAACL,EAAgB,SAAjB;EACC,YAAYK,EAAM;EAClB,WAAWC,EACV,4DACAM,GACAC,CACD;CACA,CAAA,GACD,kBAACb,EAAgB,SAAjB;EACM;EACL,qBAAkB;EAClB,aAAWc;EACX,4BAAyB;EACzB,WAAWR,EAAGM,GAAeC,GAAgB,wBAAwBJ,EAAKK,IAAOP,CAAS;EAC1F,GAAIF;EACJ,OAAO;GAAE,WAAW;GAAc,GAAGA,EAAM;EAAM;EAEhD;CACuB,CAAA,CACF;AACxB,CAAA,CAAA;AACD,EAAa,cAAc;AAI3B,IAAaU,KAAe,EAAE,cAAW,GAAGV,QAC3C,kBAAC,OAAD;CAAK,WAAWC,EAAG,mDAAmDC,CAAS;CAAG,GAAIF;AAAQ,CAAA;AAE/F,EAAY,cAAc;AAI1B,IAAaW,KAAe,EAAE,cAAW,GAAGX,QAC3C,kBAAC,OAAD;CACC,WAAWC,EACV,wEACAC,CACD;CACA,GAAIF;AACJ,CAAA;AAEF,EAAY,cAAc"}

package/dist/components/sidebar.d.ts

@@ -189,5 +189,7 @@ export interface SidebarUserProps {
 }
 export declare function SidebarUser({ name, email, avatar, action, className }: SidebarUserProps): import("react").JSX.Element;
 export interface ContentIslandProps extends HTMLAttributes<HTMLDivElement> {
+    /** Mobile surface treatment; desktop remains an inset L1 island. @default "inset" */
+    mobileSurface?: "inset" | "edge-to-edge";
 }
-export declare function ContentIsland({ className, ...props }: ContentIslandProps): import("react").JSX.Element;
+export declare function ContentIsland({ mobileSurface, className, ...props }: ContentIslandProps): import("react").JSX.Element;