@nocoo/basalt 2.0.3 → 2.1.0

package/dist/components/table.js.map

@@ -1 +1 @@
-{"version":3,"file":"table.js","names":[],"sources":["../../src/components/table.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type TableProps = {\n\t/**\n\t * Additional classes for the table.\n\t */\n\tclassName?: string;\n};\n\nexport const Table = React.forwardRef<\n\tHTMLTableElement,\n\tTableProps & React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n\t<table\n\t\tref={ref}\n\t\tdata-basalt-table=\"\"\n\t\tclassName={cn(\n\t\t\t\"w-full border-separate border-spacing-0 caption-bottom text-left text-sm text-basalt-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTable.displayName = \"Table\";\n\nexport const TableHeader = (props: React.HTMLAttributes<HTMLTableSectionElement>) => (\n\t<thead {...props} />\n);\nexport const TableBody = (props: React.HTMLAttributes<HTMLTableSectionElement>) => (\n\t<tbody {...props} />\n);\nexport const TableFooter = (props: React.HTMLAttributes<HTMLTableSectionElement>) => (\n\t<tfoot {...props} />\n);\n\nexport type TableRowVariant = \"default\" | \"selected\";\n\nexport type TableRowProps = {\n\t/**\n\t * Highlight the row as selected.\n\t * @default \"default\"\n\t */\n\tvariant?: TableRowVariant;\n\t/**\n\t * Additional classes for the row.\n\t */\n\tclassName?: string;\n};\n\nexport const TableRow = ({\n\tclassName,\n\tvariant = \"default\",\n\t...props\n}: TableRowProps & React.HTMLAttributes<HTMLTableRowElement>) => (\n\t<tr\n\t\t{...props}\n\t\taria-selected={variant === \"selected\" ? true : props[\"aria-selected\"]}\n\t\tclassName={className}\n\t/>\n);\n\nexport type TableHeadProps = {\n\t/**\n\t * Additional classes for the header cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableHead = ({\n\tclassName,\n\t...props\n}: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => (\n\t<th\n\t\tclassName={cn(\n\t\t\t\"border-b border-basalt-border p-3 text-left text-xs font-medium text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCellProps = {\n\t/**\n\t * Additional classes for the cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableCell = ({\n\tclassName,\n\t...props\n}: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => (\n\t<td className={cn(\"p-3\", className)} {...props} />\n);\n\nexport type TableCaptionProps = {\n\t/**\n\t * Additional classes for the caption.\n\t */\n\tclassName?: string;\n};\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: TableCaptionProps & React.HTMLAttributes<HTMLTableCaptionElement>) {\n\treturn (\n\t\t<caption className={cn(\"mt-2 text-sm text-basalt-muted-foreground\", className)} {...props} />\n\t);\n}\n"],"mappings":";;;;;AAUA,IAAa,IAAQ,EAAM,YAGxB,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,SAAD;CACM;CACL,qBAAkB;CAClB,WAAW,EACV,mGACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAM,cAAc;AAEpB,IAAa,KAAe,MAC3B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAEP,KAAa,MACzB,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAEP,KAAe,MAC3B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAiBP,KAAY,EACxB,cACA,aAAU,WACV,GAAG,QAEH,kBAAC,MAAD;CACC,GAAI;CACJ,iBAAe,MAAY,cAAoB,EAAM;CAC1C;AACX,CAAA,GAUW,KAAa,EACzB,cACA,GAAG,QAEH,kBAAC,MAAD;CACC,WAAW,EACV,gGACA,CACD;CACA,GAAI;AACJ,CAAA,GAUW,KAAa,EACzB,cACA,GAAG,QAEH,kBAAC,MAAD;CAAI,WAAW,EAAG,OAAO,CAAS;CAAG,GAAI;AAAQ,CAAA;AAUlD,SAAgB,EAAa,EAC5B,cACA,GAAG,KACkE;CACrE,OACC,kBAAC,WAAD;EAAS,WAAW,EAAG,6CAA6C,CAAS;EAAG,GAAI;CAAQ,CAAA;AAE9F"}
+{"version":3,"file":"table.js","names":[],"sources":["../../src/components/table.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport type TableProps = {\n\t/**\n\t * Additional classes for the table.\n\t */\n\tclassName?: string;\n};\n\nexport const Table = React.forwardRef<\n\tHTMLTableElement,\n\tTableProps & React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n\t<table\n\t\tref={ref}\n\t\tdata-basalt-table=\"\"\n\t\tclassName={cn(\n\t\t\tBASALT_UI_CLASS,\n\t\t\t\"w-full border-separate border-spacing-0 caption-bottom text-left text-sm text-basalt-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTable.displayName = \"Table\";\n\nexport interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableHeader = (props: TableHeaderProps) => <thead {...props} />;\n\nexport interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableBody = (props: TableBodyProps) => <tbody {...props} />;\n\nexport interface TableFooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableFooter = (props: TableFooterProps) => <tfoot {...props} />;\n\nexport type TableRowVariant = \"default\" | \"selected\";\n\nexport type TableRowProps = {\n\t/**\n\t * Highlight the row as selected.\n\t * @default \"default\"\n\t */\n\tvariant?: TableRowVariant;\n\t/**\n\t * Additional classes for the row.\n\t */\n\tclassName?: string;\n};\n\nexport const TableRow = ({\n\tclassName,\n\tvariant = \"default\",\n\t...props\n}: TableRowProps & React.HTMLAttributes<HTMLTableRowElement>) => (\n\t<tr\n\t\t{...props}\n\t\taria-selected={variant === \"selected\" ? true : props[\"aria-selected\"]}\n\t\tclassName={className}\n\t/>\n);\n\nexport type TableHeadProps = {\n\t/**\n\t * Additional classes for the header cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableHead = ({\n\tclassName,\n\t...props\n}: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => (\n\t<th\n\t\tclassName={cn(\n\t\t\t\"border-b border-basalt-border p-3 text-left text-xs font-medium text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCellProps = {\n\t/**\n\t * Additional classes for the cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableCell = ({\n\tclassName,\n\t...props\n}: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => (\n\t<td className={cn(\"p-3\", className)} {...props} />\n);\n\nexport type TableCaptionProps = {\n\t/**\n\t * Additional classes for the caption.\n\t */\n\tclassName?: string;\n};\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: TableCaptionProps & React.HTMLAttributes<HTMLTableCaptionElement>) {\n\treturn (\n\t\t<caption className={cn(\"mt-2 text-sm text-basalt-muted-foreground\", className)} {...props} />\n\t);\n}\n"],"mappings":";;;;;;AAWA,IAAa,IAAQ,EAAM,YAGxB,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,SAAD;CACM;CACL,qBAAkB;CAClB,WAAW,EACV,GACA,mGACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAM,cAAc;AAIpB,IAAa,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAI9D,KAAa,MAA0B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAI1D,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAI,EAAQ,CAAA,GAgB9D,KAAY,EACxB,cACA,aAAU,WACV,GAAG,QAEH,kBAAC,MAAD;CACC,GAAI;CACJ,iBAAe,MAAY,cAAoB,EAAM;CAC1C;AACX,CAAA,GAUW,KAAa,EACzB,cACA,GAAG,QAEH,kBAAC,MAAD;CACC,WAAW,EACV,gGACA,CACD;CACA,GAAI;AACJ,CAAA,GAUW,KAAa,EACzB,cACA,GAAG,QAEH,kBAAC,MAAD;CAAI,WAAW,EAAG,OAAO,CAAS;CAAG,GAAI;AAAQ,CAAA;AAUlD,SAAgB,EAAa,EAC5B,cACA,GAAG,KACkE;CACrE,OACC,kBAAC,WAAD;EAAS,WAAW,EAAG,6CAA6C,CAAS;EAAG,GAAI;CAAQ,CAAA;AAE9F"}

package/dist/components/tabs.js

@@ -1,12 +1,13 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { OVERLAY_MOTION as t } from "./overlay.js";
-import { useSelectionIndicator as n } from "../utils/selection-indicator.js";
-import * as r from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import * as o from "@radix-ui/react-tabs";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { OVERLAY_MOTION as n } from "./overlay.js";
+import { useSelectionIndicator as r } from "../utils/selection-indicator.js";
+import * as i from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import * as s from "@radix-ui/react-tabs";
 //#region src/components/tabs.tsx
-function s(e) {
+function c(e) {
 	return {
 		left: e.offsetLeft,
 		width: e.offsetWidth,
@@ -14,18 +15,24 @@ function s(e) {
 		height: 0
 	};
 }
-var c = o.Root, l = r.forwardRef(({ className: t, children: r, showIndicator: c = !0, ...l }, u) => {
-	let { ref: d, state: f, motionClassName: p } = n({
+var l = i.forwardRef(({ className: n, ...r }, i) => /* @__PURE__ */ a(s.Root, {
+	ref: i,
+	className: e(t, n),
+	...r
+}));
+l.displayName = s.Root.displayName;
+var u = i.forwardRef(({ className: t, children: n, showIndicator: i = !0, ...l }, u) => {
+	let { ref: d, state: f, motionClassName: p } = r({
 		itemSelector: "[role=\"tab\"][data-state=\"active\"]",
-		enabled: c,
-		mapGeometry: s,
+		enabled: i,
+		mapGeometry: c,
 		ref: u
 	});
-	return /* @__PURE__ */ a(o.List, {
+	return /* @__PURE__ */ o(s.List, {
 		ref: d,
 		className: e("relative flex flex-wrap items-center gap-1 border-b border-basalt-border", t),
 		...l,
-		children: [r, c ? /* @__PURE__ */ i("span", {
+		children: [n, i ? /* @__PURE__ */ a("span", {
 			"aria-hidden": "true",
 			"data-slot": "selection-indicator",
 			className: e("pointer-events-none absolute h-0.5 bg-basalt-primary", p),
@@ -37,20 +44,20 @@ var c = o.Root, l = r.forwardRef(({ className: t, children: r, showIndicator: c
 		}) : null]
 	});
 });
-l.displayName = o.List.displayName;
-var u = r.forwardRef(({ className: n, ...r }, a) => /* @__PURE__ */ i(o.Trigger, {
-	ref: a,
-	className: e("inline-flex items-center justify-center px-3 py-2 text-sm font-medium text-basalt-muted-foreground transition-colors hover:text-basalt-foreground data-[state=active]:text-basalt-primary", t, n),
+u.displayName = s.List.displayName;
+var d = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ a(s.Trigger, {
+	ref: i,
+	className: e("inline-flex items-center justify-center px-3 py-2 text-sm font-medium text-basalt-muted-foreground transition-colors hover:text-basalt-foreground data-[state=active]:text-basalt-primary", n, t),
 	...r
 }));
-u.displayName = o.Trigger.displayName;
-var d = r.forwardRef(({ className: n, ...r }, a) => /* @__PURE__ */ i(o.Content, {
-	ref: a,
-	className: e("mt-3 text-sm text-basalt-foreground data-[state=active]:animate-basalt-tab-in", t, n),
+d.displayName = s.Trigger.displayName;
+var f = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ a(s.Content, {
+	ref: i,
+	className: e("mt-3 text-sm text-basalt-foreground data-[state=active]:animate-basalt-tab-in", n, t),
 	...r
 }));
-d.displayName = o.Content.displayName;
+f.displayName = s.Content.displayName;
 //#endregion
-export { c as Tabs, d as TabsContent, l as TabsList, u as TabsTrigger };
+export { l as Tabs, f as TabsContent, u as TabsList, d as TabsTrigger };
 
 //# sourceMappingURL=tabs.js.map

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":[],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { useSelectionIndicator } from \"../utils/selection-indicator\";\nimport { OVERLAY_MOTION } from \"./overlay\";\n\nfunction measureTabUnderline(item: HTMLElement): {\n\tleft: number;\n\twidth: number;\n\ttop: number;\n\theight: number;\n} {\n\treturn {\n\t\tleft: item.offsetLeft,\n\t\twidth: item.offsetWidth,\n\t\ttop: item.offsetTop + item.offsetHeight,\n\t\theight: 0,\n\t};\n}\n\nexport type TabsProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected tab.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial tab.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected tab changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Tabs: React.FC<TabsProps> = TabsPrimitive.Root;\n\nexport type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {\n\t/**\n\t * Show the sliding active underline.\n\t * @default true\n\t */\n\tshowIndicator?: boolean;\n};\n\nexport const TabsList = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.List>,\n\tTabsListProps\n>(({ className, children, showIndicator = true, ...props }, ref) => {\n\tconst {\n\t\tref: listRef,\n\t\tstate,\n\t\tmotionClassName,\n\t} = useSelectionIndicator({\n\t\titemSelector: '[role=\"tab\"][data-state=\"active\"]',\n\t\tenabled: showIndicator,\n\t\tmapGeometry: measureTabUnderline,\n\t\tref,\n\t});\n\n\treturn (\n\t\t<TabsPrimitive.List\n\t\t\tref={listRef}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex flex-wrap items-center gap-1 border-b border-basalt-border\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t{showIndicator ? (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-slot=\"selection-indicator\"\n\t\t\t\t\tclassName={cn(\"pointer-events-none absolute h-0.5 bg-basalt-primary\", motionClassName)}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tleft: state.left,\n\t\t\t\t\t\twidth: state.visible ? state.width : 0,\n\t\t\t\t\t\ttop: state.top,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t</TabsPrimitive.List>\n\t);\n});\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nexport type TabsTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,\n\t\"disabled\" | \"value\"\n> & {\n\t/**\n\t * The tab value.\n\t */\n\tvalue: string;\n\t/**\n\t * Disable the tab trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const TabsTrigger = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Trigger>,\n\tTabsTriggerProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"inline-flex items-center justify-center px-3 py-2 text-sm font-medium text-basalt-muted-foreground transition-colors hover:text-basalt-foreground data-[state=active]:text-basalt-primary\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nexport type TabsContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>,\n\t\"value\"\n> & {\n\t/**\n\t * The tab value this panel belongs to.\n\t */\n\tvalue: string;\n};\n\nexport const TabsContent = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Content>,\n\tTabsContentProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"mt-3 text-sm text-basalt-foreground data-[state=active]:animate-basalt-tab-in\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n"],"mappings":";;;;;;;;AAMA,SAAS,EAAoB,GAK3B;CACD,OAAO;EACN,MAAM,EAAK;EACX,OAAO,EAAK;EACZ,KAAK,EAAK,YAAY,EAAK;EAC3B,QAAQ;CACT;AACD;AAmBA,IAAa,IAA4B,EAAc,MAU1C,IAAW,EAAM,YAG3B,EAAE,cAAW,aAAU,mBAAgB,IAAM,GAAG,KAAS,MAAQ;CACnE,IAAM,EACL,KAAK,GACL,UACA,uBACG,EAAsB;EACzB,cAAc;EACd,SAAS;EACT,aAAa;EACb;CACD,CAAC;CAED,OACC,kBAAC,EAAc,MAAf;EACC,KAAK;EACL,WAAW,EACV,4EACA,CACD;EACA,GAAI;EANL,UAAA,CAQE,GACA,IACA,kBAAC,QAAD;GACC,eAAY;GACZ,aAAU;GACV,WAAW,EAAG,wDAAwD,CAAe;GACrF,OAAO;IACN,MAAM,EAAM;IACZ,OAAO,EAAM,UAAU,EAAM,QAAQ;IACrC,KAAK,EAAM;GACZ;EACA,CAAA,IACE,IACe;;AAEtB,CAAC;AACD,EAAS,cAAc,EAAc,KAAK;AAiB1C,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAc,SAAf;CACM;CACL,WAAW,EACV,6LACA,GACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAc,QAAQ;AAYhD,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAc,SAAf;CACM;CACL,WAAW,EACV,iFACA,GACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAc,QAAQ"}
+{"version":3,"file":"tabs.js","names":[],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { useSelectionIndicator } from \"../utils/selection-indicator\";\nimport { OVERLAY_MOTION } from \"./overlay\";\n\nfunction measureTabUnderline(item: HTMLElement): {\n\tleft: number;\n\twidth: number;\n\ttop: number;\n\theight: number;\n} {\n\treturn {\n\t\tleft: item.offsetLeft,\n\t\twidth: item.offsetWidth,\n\t\ttop: item.offsetTop + item.offsetHeight,\n\t\theight: 0,\n\t};\n}\n\nexport type TabsProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected tab.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial tab.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected tab changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Tabs: React.FC<TabsProps> = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Root>,\n\tTabsProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Root ref={ref} className={cn(BASALT_UI_CLASS, className)} {...props} />\n));\nTabs.displayName = TabsPrimitive.Root.displayName;\n\nexport type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {\n\t/**\n\t * Show the sliding active underline.\n\t * @default true\n\t */\n\tshowIndicator?: boolean;\n};\n\nexport const TabsList = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.List>,\n\tTabsListProps\n>(({ className, children, showIndicator = true, ...props }, ref) => {\n\tconst {\n\t\tref: listRef,\n\t\tstate,\n\t\tmotionClassName,\n\t} = useSelectionIndicator({\n\t\titemSelector: '[role=\"tab\"][data-state=\"active\"]',\n\t\tenabled: showIndicator,\n\t\tmapGeometry: measureTabUnderline,\n\t\tref,\n\t});\n\n\treturn (\n\t\t<TabsPrimitive.List\n\t\t\tref={listRef}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex flex-wrap items-center gap-1 border-b border-basalt-border\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t{showIndicator ? (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-slot=\"selection-indicator\"\n\t\t\t\t\tclassName={cn(\"pointer-events-none absolute h-0.5 bg-basalt-primary\", motionClassName)}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tleft: state.left,\n\t\t\t\t\t\twidth: state.visible ? state.width : 0,\n\t\t\t\t\t\ttop: state.top,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t</TabsPrimitive.List>\n\t);\n});\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nexport type TabsTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,\n\t\"disabled\" | \"value\"\n> & {\n\t/**\n\t * The tab value.\n\t */\n\tvalue: string;\n\t/**\n\t * Disable the tab trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const TabsTrigger = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Trigger>,\n\tTabsTriggerProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"inline-flex items-center justify-center px-3 py-2 text-sm font-medium text-basalt-muted-foreground transition-colors hover:text-basalt-foreground data-[state=active]:text-basalt-primary\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nexport type TabsContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>,\n\t\"value\"\n> & {\n\t/**\n\t * The tab value this panel belongs to.\n\t */\n\tvalue: string;\n};\n\nexport const TabsContent = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Content>,\n\tTabsContentProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"mt-3 text-sm text-basalt-foreground data-[state=active]:animate-basalt-tab-in\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n"],"mappings":";;;;;;;;;AAOA,SAAS,EAAoB,GAK3B;CACD,OAAO;EACN,MAAM,EAAK;EACX,OAAO,EAAK;EACZ,KAAK,EAAK,YAAY,EAAK;EAC3B,QAAQ;CACT;AACD;AAmBA,IAAa,IAA4B,EAAM,YAG5C,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAc,MAAf;CAAyB;CAAK,WAAW,EAAG,GAAiB,CAAS;CAAG,GAAI;AAAQ,CAAA,CACrF;AACD,EAAK,cAAc,EAAc,KAAK;AAUtC,IAAa,IAAW,EAAM,YAG3B,EAAE,cAAW,aAAU,mBAAgB,IAAM,GAAG,KAAS,MAAQ;CACnE,IAAM,EACL,KAAK,GACL,UACA,uBACG,EAAsB;EACzB,cAAc;EACd,SAAS;EACT,aAAa;EACb;CACD,CAAC;CAED,OACC,kBAAC,EAAc,MAAf;EACC,KAAK;EACL,WAAW,EACV,4EACA,CACD;EACA,GAAI;EANL,UAAA,CAQE,GACA,IACA,kBAAC,QAAD;GACC,eAAY;GACZ,aAAU;GACV,WAAW,EAAG,wDAAwD,CAAe;GACrF,OAAO;IACN,MAAM,EAAM;IACZ,OAAO,EAAM,UAAU,EAAM,QAAQ;IACrC,KAAK,EAAM;GACZ;EACA,CAAA,IACE,IACe;;AAEtB,CAAC;AACD,EAAS,cAAc,EAAc,KAAK;AAiB1C,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAc,SAAf;CACM;CACL,WAAW,EACV,6LACA,GACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAc,QAAQ;AAYhD,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAc,SAAf;CACM;CACL,WAAW,EACV,iFACA,GACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAc,QAAQ"}

package/dist/components/tag-badge.d.ts

@@ -0,0 +1,58 @@
+import type { ComponentProps } from "react";
+/** Stable identifiers, labels and opaque foreground/background pairs for both themes. */
+export declare const TAG_COLORS: {
+    readonly slate: {
+        readonly label: "Slate";
+        readonly className: "border-slate-300 bg-slate-100 text-slate-800 basalt-dark:border-slate-600 basalt-dark:bg-slate-800 basalt-dark:text-slate-100";
+    };
+    readonly blue: {
+        readonly label: "Blue";
+        readonly className: "border-blue-300 bg-blue-50 text-blue-800 basalt-dark:border-blue-700 basalt-dark:bg-blue-950 basalt-dark:text-blue-200";
+    };
+    readonly violet: {
+        readonly label: "Violet";
+        readonly className: "border-violet-300 bg-violet-50 text-violet-800 basalt-dark:border-violet-700 basalt-dark:bg-violet-950 basalt-dark:text-violet-200";
+    };
+    readonly teal: {
+        readonly label: "Teal";
+        readonly className: "border-teal-300 bg-teal-50 text-teal-800 basalt-dark:border-teal-700 basalt-dark:bg-teal-950 basalt-dark:text-teal-200";
+    };
+    readonly amber: {
+        readonly label: "Amber";
+        readonly className: "border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200";
+    };
+    readonly rose: {
+        readonly label: "Rose";
+        readonly className: "border-rose-300 bg-rose-50 text-rose-800 basalt-dark:border-rose-700 basalt-dark:bg-rose-950 basalt-dark:text-rose-200";
+    };
+    readonly success: {
+        readonly label: "Success";
+        readonly className: "border-emerald-300 bg-emerald-50 text-emerald-800 basalt-dark:border-emerald-700 basalt-dark:bg-emerald-950 basalt-dark:text-emerald-200";
+    };
+    readonly warning: {
+        readonly label: "Warning";
+        readonly className: "border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200";
+    };
+    readonly danger: {
+        readonly label: "Danger";
+        readonly className: "border-red-300 bg-red-50 text-red-800 basalt-dark:border-red-700 basalt-dark:bg-red-950 basalt-dark:text-red-200";
+    };
+    readonly info: {
+        readonly label: "Info";
+        readonly className: "border-sky-300 bg-sky-50 text-sky-800 basalt-dark:border-sky-700 basalt-dark:bg-sky-950 basalt-dark:text-sky-200";
+    };
+};
+export type TagColor = keyof typeof TAG_COLORS;
+/** Stable FNV-1a assignment to six non-semantic colors; does not infer business meaning. */
+export declare function tagColorFor(key: string): TagColor;
+export interface TagBadgeProps extends Omit<ComponentProps<"span">, "children" | "color"> {
+    /** Visible tag name; color is always accompanied by text. */
+    name: string;
+    /** Stable hash input, defaults to name. Use an entity ID to retain color after renaming. */
+    colorKey?: string;
+    /** Explicit hue or semantic color, overriding the deterministic assignment. */
+    color?: TagColor;
+    /** Badge size. @default "md" */
+    size?: "sm" | "md";
+}
+export declare function TagBadge({ name, colorKey, color, size, className, ...props }: TagBadgeProps): import("react").JSX.Element;

package/dist/components/tag-badge.js

@@ -0,0 +1,72 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/tag-badge.tsx
+var r = {
+	slate: {
+		label: "Slate",
+		className: "border-slate-300 bg-slate-100 text-slate-800 basalt-dark:border-slate-600 basalt-dark:bg-slate-800 basalt-dark:text-slate-100"
+	},
+	blue: {
+		label: "Blue",
+		className: "border-blue-300 bg-blue-50 text-blue-800 basalt-dark:border-blue-700 basalt-dark:bg-blue-950 basalt-dark:text-blue-200"
+	},
+	violet: {
+		label: "Violet",
+		className: "border-violet-300 bg-violet-50 text-violet-800 basalt-dark:border-violet-700 basalt-dark:bg-violet-950 basalt-dark:text-violet-200"
+	},
+	teal: {
+		label: "Teal",
+		className: "border-teal-300 bg-teal-50 text-teal-800 basalt-dark:border-teal-700 basalt-dark:bg-teal-950 basalt-dark:text-teal-200"
+	},
+	amber: {
+		label: "Amber",
+		className: "border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200"
+	},
+	rose: {
+		label: "Rose",
+		className: "border-rose-300 bg-rose-50 text-rose-800 basalt-dark:border-rose-700 basalt-dark:bg-rose-950 basalt-dark:text-rose-200"
+	},
+	success: {
+		label: "Success",
+		className: "border-emerald-300 bg-emerald-50 text-emerald-800 basalt-dark:border-emerald-700 basalt-dark:bg-emerald-950 basalt-dark:text-emerald-200"
+	},
+	warning: {
+		label: "Warning",
+		className: "border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200"
+	},
+	danger: {
+		label: "Danger",
+		className: "border-red-300 bg-red-50 text-red-800 basalt-dark:border-red-700 basalt-dark:bg-red-950 basalt-dark:text-red-200"
+	},
+	info: {
+		label: "Info",
+		className: "border-sky-300 bg-sky-50 text-sky-800 basalt-dark:border-sky-700 basalt-dark:bg-sky-950 basalt-dark:text-sky-200"
+	}
+}, i = [
+	"slate",
+	"blue",
+	"violet",
+	"teal",
+	"amber",
+	"rose"
+];
+function a(e) {
+	let t = 2166136261;
+	for (let n = 0; n < e.length; n++) t = Math.imul(t ^ e.charCodeAt(n), 16777619);
+	return i[(t >>> 0) % i.length];
+}
+function o({ name: i, colorKey: o, color: s, size: c = "md", className: l, ...u }) {
+	let d = s ?? a(o ?? i);
+	return /* @__PURE__ */ n("span", {
+		...u,
+		"data-tag-color": d,
+		className: e(t, "inline-flex max-w-full items-center break-words rounded-full border font-medium", c === "sm" ? "px-2 py-0.5 text-xs" : "px-2.5 py-1 text-sm", r[d].className, l),
+		children: i
+	});
+}
+//#endregion
+export { r as TAG_COLORS, o as TagBadge, a as tagColorFor };
+
+//# sourceMappingURL=tag-badge.js.map

package/dist/components/tag-badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-badge.js","names":[],"sources":["../../src/components/tag-badge.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Stable identifiers, labels and opaque foreground/background pairs for both themes. */\nexport const TAG_COLORS = {\n\tslate: {\n\t\tlabel: \"Slate\",\n\t\tclassName:\n\t\t\t\"border-slate-300 bg-slate-100 text-slate-800 basalt-dark:border-slate-600 basalt-dark:bg-slate-800 basalt-dark:text-slate-100\",\n\t},\n\tblue: {\n\t\tlabel: \"Blue\",\n\t\tclassName:\n\t\t\t\"border-blue-300 bg-blue-50 text-blue-800 basalt-dark:border-blue-700 basalt-dark:bg-blue-950 basalt-dark:text-blue-200\",\n\t},\n\tviolet: {\n\t\tlabel: \"Violet\",\n\t\tclassName:\n\t\t\t\"border-violet-300 bg-violet-50 text-violet-800 basalt-dark:border-violet-700 basalt-dark:bg-violet-950 basalt-dark:text-violet-200\",\n\t},\n\tteal: {\n\t\tlabel: \"Teal\",\n\t\tclassName:\n\t\t\t\"border-teal-300 bg-teal-50 text-teal-800 basalt-dark:border-teal-700 basalt-dark:bg-teal-950 basalt-dark:text-teal-200\",\n\t},\n\tamber: {\n\t\tlabel: \"Amber\",\n\t\tclassName:\n\t\t\t\"border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200\",\n\t},\n\trose: {\n\t\tlabel: \"Rose\",\n\t\tclassName:\n\t\t\t\"border-rose-300 bg-rose-50 text-rose-800 basalt-dark:border-rose-700 basalt-dark:bg-rose-950 basalt-dark:text-rose-200\",\n\t},\n\tsuccess: {\n\t\tlabel: \"Success\",\n\t\tclassName:\n\t\t\t\"border-emerald-300 bg-emerald-50 text-emerald-800 basalt-dark:border-emerald-700 basalt-dark:bg-emerald-950 basalt-dark:text-emerald-200\",\n\t},\n\twarning: {\n\t\tlabel: \"Warning\",\n\t\tclassName:\n\t\t\t\"border-amber-300 bg-amber-50 text-amber-900 basalt-dark:border-amber-700 basalt-dark:bg-amber-950 basalt-dark:text-amber-200\",\n\t},\n\tdanger: {\n\t\tlabel: \"Danger\",\n\t\tclassName:\n\t\t\t\"border-red-300 bg-red-50 text-red-800 basalt-dark:border-red-700 basalt-dark:bg-red-950 basalt-dark:text-red-200\",\n\t},\n\tinfo: {\n\t\tlabel: \"Info\",\n\t\tclassName:\n\t\t\t\"border-sky-300 bg-sky-50 text-sky-800 basalt-dark:border-sky-700 basalt-dark:bg-sky-950 basalt-dark:text-sky-200\",\n\t},\n} as const;\nexport type TagColor = keyof typeof TAG_COLORS;\nconst HASH_COLORS = [\"slate\", \"blue\", \"violet\", \"teal\", \"amber\", \"rose\"] as const;\n/** Stable FNV-1a assignment to six non-semantic colors; does not infer business meaning. */\nexport function tagColorFor(key: string): TagColor {\n\tlet hash = 2166136261;\n\tfor (let i = 0; i < key.length; i++) hash = Math.imul(hash ^ key.charCodeAt(i), 16777619);\n\treturn HASH_COLORS[(hash >>> 0) % HASH_COLORS.length];\n}\nexport interface TagBadgeProps extends Omit<ComponentProps<\"span\">, \"children\" | \"color\"> {\n\t/** Visible tag name; color is always accompanied by text. */\n\tname: string;\n\t/** Stable hash input, defaults to name. Use an entity ID to retain color after renaming. */\n\tcolorKey?: string;\n\t/** Explicit hue or semantic color, overriding the deterministic assignment. */\n\tcolor?: TagColor;\n\t/** Badge size. @default \"md\" */\n\tsize?: \"sm\" | \"md\";\n}\nexport function TagBadge({\n\tname,\n\tcolorKey,\n\tcolor,\n\tsize = \"md\",\n\tclassName,\n\t...props\n}: TagBadgeProps) {\n\tconst resolved = color ?? tagColorFor(colorKey ?? name);\n\treturn (\n\t\t<span\n\t\t\t{...props}\n\t\t\tdata-tag-color={resolved}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex max-w-full items-center break-words rounded-full border font-medium\",\n\t\t\t\tsize === \"sm\" ? \"px-2 py-0.5 text-xs\" : \"px-2.5 py-1 text-sm\",\n\t\t\t\tTAG_COLORS[resolved].className,\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t{name}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;AAKA,IAAa,IAAa;CACzB,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WACC;CACF;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WACC;CACF;CACA,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WACC;CACF;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WACC;CACF;AACD,GAEM,IAAc;CAAC;CAAS;CAAQ;CAAU;CAAQ;CAAS;AAAM;AAEvE,SAAgB,EAAY,GAAuB;CAClD,IAAI,IAAO;CACX,KAAK,IAAI,IAAI,GAAG,IAAI,EAAI,QAAQ,KAAK,IAAO,KAAK,KAAK,IAAO,EAAI,WAAW,CAAC,GAAG,QAAQ;CACxF,OAAO,GAAa,MAAS,KAAK,EAAY;AAC/C;AAWA,SAAgB,EAAS,EACxB,SACA,aACA,UACA,UAAO,MACP,cACA,GAAG,KACc;CACjB,IAAM,IAAW,KAAS,EAAY,KAAY,CAAI;CACtD,OACC,kBAAC,QAAD;EACC,GAAI;EACJ,kBAAgB;EAChB,WAAW,EACV,GACA,mFACA,MAAS,OAAO,wBAAwB,uBACxC,EAAW,EAAS,CAAC,WACrB,CACD;EAEC,UAAA;CACI,CAAA;AAER"}

package/dist/components/tag-color-picker.d.ts

@@ -0,0 +1,20 @@
+import { type TagColor } from "./tag-badge.js";
+export interface TagColorPickerProps {
+    /** Accessible group name. */
+    label: string;
+    /** Controlled named color. */
+    value?: TagColor;
+    /** Initial uncontrolled color. @default "slate" */
+    defaultValue?: TagColor;
+    /** Color selection request. */
+    onValueChange?: (value: TagColor) => void;
+    /** Allowed color subset, in caller-defined order. */
+    colors?: readonly TagColor[];
+    /** Localized visible and accessible color names. */
+    labels?: Partial<Record<TagColor, string>>;
+    /** Disable the picker. @default false */
+    disabled?: boolean;
+    /** Additional root classes. */
+    className?: string;
+}
+export declare function TagColorPicker({ label, value, defaultValue, onValueChange, colors, labels, disabled, className, }: TagColorPickerProps): import("react").JSX.Element;

package/dist/components/tag-color-picker.js

@@ -0,0 +1,42 @@
+"use client";
+import { cn as e } from "../utils/cn.js";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { ToggleGroup as n, ToggleGroupItem as r } from "./toggle-group.js";
+import { TAG_COLORS as i } from "./tag-badge.js";
+import { useState as a } from "react";
+import { Check as o } from "lucide-react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/tag-color-picker.tsx
+var l = Object.keys(i);
+function u({ label: u, value: d, defaultValue: f = "slate", onValueChange: p, colors: m = l, labels: h, disabled: g = !1, className: _ }) {
+	let [v, y] = a(f), b = d ?? v;
+	return /* @__PURE__ */ s(n, {
+		type: "single",
+		value: b,
+		"aria-label": u,
+		disabled: g,
+		className: e(t, "flex h-auto flex-wrap justify-start gap-2 rounded-basalt-lg p-1", _),
+		onValueChange: (e) => {
+			if (!e) return;
+			let t = e;
+			d === void 0 && y(t), p?.(t);
+		},
+		children: m.map((t) => /* @__PURE__ */ c(r, {
+			value: t,
+			"aria-label": h?.[t] ?? i[t].label,
+			className: "h-auto min-w-16 flex-col gap-1.5 rounded-basalt-md px-2 py-2",
+			children: [/* @__PURE__ */ s("span", {
+				"aria-hidden": "true",
+				className: e("flex size-7 items-center justify-center rounded-full border", i[t].className),
+				children: b === t && /* @__PURE__ */ s(o, { className: "size-4" })
+			}), /* @__PURE__ */ s("span", {
+				className: "text-xs",
+				children: h?.[t] ?? i[t].label
+			})]
+		}, t))
+	});
+}
+//#endregion
+export { u as TagColorPicker };
+
+//# sourceMappingURL=tag-color-picker.js.map

package/dist/components/tag-color-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-color-picker.js","names":[],"sources":["../../src/components/tag-color-picker.tsx"],"sourcesContent":["import { Check } from \"lucide-react\";\nimport { useState } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { TAG_COLORS, type TagColor } from \"./tag-badge\";\nimport { ToggleGroup, ToggleGroupItem } from \"./toggle-group\";\n\nexport interface TagColorPickerProps {\n\t/** Accessible group name. */\n\tlabel: string;\n\t/** Controlled named color. */\n\tvalue?: TagColor;\n\t/** Initial uncontrolled color. @default \"slate\" */\n\tdefaultValue?: TagColor;\n\t/** Color selection request. */\n\tonValueChange?: (value: TagColor) => void;\n\t/** Allowed color subset, in caller-defined order. */\n\tcolors?: readonly TagColor[];\n\t/** Localized visible and accessible color names. */\n\tlabels?: Partial<Record<TagColor, string>>;\n\t/** Disable the picker. @default false */\n\tdisabled?: boolean;\n\t/** Additional root classes. */\n\tclassName?: string;\n}\nconst ALL_COLORS = Object.keys(TAG_COLORS) as TagColor[];\nexport function TagColorPicker({\n\tlabel,\n\tvalue,\n\tdefaultValue = \"slate\",\n\tonValueChange,\n\tcolors = ALL_COLORS,\n\tlabels,\n\tdisabled = false,\n\tclassName,\n}: TagColorPickerProps) {\n\tconst [localValue, setLocalValue] = useState(defaultValue);\n\tconst selected = value ?? localValue;\n\treturn (\n\t\t<ToggleGroup\n\t\t\ttype=\"single\"\n\t\t\tvalue={selected}\n\t\t\taria-label={label}\n\t\t\tdisabled={disabled}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"flex h-auto flex-wrap justify-start gap-2 rounded-basalt-lg p-1\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tonValueChange={(next) => {\n\t\t\t\tif (!next) return;\n\t\t\t\tconst color = next as TagColor;\n\t\t\t\tif (value === undefined) setLocalValue(color);\n\t\t\t\tonValueChange?.(color);\n\t\t\t}}\n\t\t>\n\t\t\t{colors.map((color) => (\n\t\t\t\t<ToggleGroupItem\n\t\t\t\t\tkey={color}\n\t\t\t\t\tvalue={color}\n\t\t\t\t\taria-label={labels?.[color] ?? TAG_COLORS[color].label}\n\t\t\t\t\tclassName=\"h-auto min-w-16 flex-col gap-1.5 rounded-basalt-md px-2 py-2\"\n\t\t\t\t>\n\t\t\t\t\t<span\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"flex size-7 items-center justify-center rounded-full border\",\n\t\t\t\t\t\t\tTAG_COLORS[color].className,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{selected === color && <Check className=\"size-4\" />}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span className=\"text-xs\">{labels?.[color] ?? TAG_COLORS[color].label}</span>\n\t\t\t\t</ToggleGroupItem>\n\t\t\t))}\n\t\t</ToggleGroup>\n\t);\n}\n"],"mappings":";;;;;;;;;AAyBA,IAAM,IAAa,OAAO,KAAK,CAAU;AACzC,SAAgB,EAAe,EAC9B,UACA,UACA,kBAAe,SACf,kBACA,YAAS,GACT,WACA,cAAW,IACX,gBACuB;CACvB,IAAM,CAAC,GAAY,KAAiB,EAAS,CAAY,GACnD,IAAW,KAAS;CAC1B,OACC,kBAAC,GAAD;EACC,MAAK;EACL,OAAO;EACP,cAAY;EACF;EACV,WAAW,EACV,GACA,mEACA,CACD;EACA,gBAAgB,MAAS;GACxB,IAAI,CAAC,GAAM;GACX,IAAM,IAAQ;GAEd,AADI,MAAU,KAAA,KAAW,EAAc,CAAK,GAC5C,IAAgB,CAAK;EACtB;EAEC,UAAA,EAAO,KAAK,MACZ,kBAAC,GAAD;GAEC,OAAO;GACP,cAAY,IAAS,MAAU,EAAW,EAAM,CAAC;GACjD,WAAU;GAJX,UAAA,CAMC,kBAAC,QAAD;IACC,eAAY;IACZ,WAAW,EACV,+DACA,EAAW,EAAM,CAAC,SACnB;IAEC,UAAA,MAAa,KAAS,kBAAC,GAAD,EAAO,WAAU,SAAU,CAAA;GAC7C,CAAA,GACN,kBAAC,QAAD;IAAM,WAAU;IAAW,UAAA,IAAS,MAAU,EAAW,EAAM,CAAC;GAAY,CAAA,CAC5D;EAfX,GAAA,CAeW,CACjB;CACW,CAAA;AAEf"}

package/dist/components/text.js

@@ -1,9 +1,10 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import * as t from "react";
-import { cva as n } from "class-variance-authority";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import * as n from "react";
+import { cva as r } from "class-variance-authority";
 //#region src/components/text.tsx
-var r = n("text-basalt-foreground", {
+var i = r("text-basalt-foreground", {
 	variants: {
 		size: {
 			xs: "text-xs",
@@ -22,25 +23,25 @@ var r = n("text-basalt-foreground", {
 		tone: "default"
 	}
 });
-function i(e) {
+function a(e) {
 	return e === "body" ? "p" : "span";
 }
-function a(e) {
+function o(e) {
 	return e === "heading" ? "lg" : e === "mono" ? "sm" : "md";
 }
-var o = t.forwardRef(({ as: n, bold: o = !1, className: s, size: c, tone: l = "default", truncate: u = !1, variant: d = "body", ...f }, p) => {
-	let m = n ?? i(d);
-	return t.createElement(m, {
-		...f,
-		ref: p,
-		className: e(r({
-			size: c ?? a(d),
-			tone: l
-		}), d === "heading" && "font-semibold", d === "mono" && "font-mono", o && "font-semibold", u && "min-w-0 truncate", s)
+var s = n.forwardRef(({ as: r, bold: s = !1, className: c, size: l, tone: u = "default", truncate: d = !1, variant: f = "body", ...p }, m) => {
+	let h = r ?? a(f);
+	return n.createElement(h, {
+		...p,
+		ref: m,
+		className: e(t, i({
+			size: l ?? o(f),
+			tone: u
+		}), f === "heading" && "font-semibold", f === "mono" && "font-mono", s && "font-semibold", d && "min-w-0 truncate", c)
 	});
 });
-o.displayName = "Text";
+s.displayName = "Text";
 //#endregion
-export { o as Text };
+export { s as Text };
 
 //# sourceMappingURL=text.js.map

package/dist/components/text.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.js","names":[],"sources":["../../src/components/text.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type TextVariant = \"body\" | \"heading\" | \"mono\";\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextTone = \"default\" | \"muted\";\nexport type TextElement =\n\t| \"h1\"\n\t| \"h2\"\n\t| \"h3\"\n\t| \"h4\"\n\t| \"h5\"\n\t| \"h6\"\n\t| \"p\"\n\t| \"span\"\n\t| \"label\"\n\t| \"dt\"\n\t| \"dd\"\n\t| \"li\"\n\t| \"figcaption\"\n\t| \"legend\"\n\t| \"pre\"\n\t| \"code\"\n\t| \"em\"\n\t| \"strong\"\n\t| \"small\"\n\t| \"abbr\"\n\t| \"time\";\n\nconst textVariants = cva(\"text-basalt-foreground\", {\n\tvariants: {\n\t\tsize: {\n\t\t\txs: \"text-xs\",\n\t\t\tsm: \"text-sm\",\n\t\t\tmd: \"text-sm leading-6\",\n\t\t\tlg: \"text-base\",\n\t\t\txl: \"text-lg\",\n\t\t},\n\t\ttone: {\n\t\t\tdefault: \"text-basalt-foreground\",\n\t\t\tmuted: \"text-basalt-muted-foreground\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t\ttone: \"default\",\n\t},\n});\n\nexport interface TextProps extends React.HTMLAttributes<HTMLElement> {\n\t/**\n\t * Visual role. Does not infer document outline.\n\t * @default \"body\"\n\t */\n\tvariant?: TextVariant;\n\t/** Type scale. Defaults by variant: body md, heading lg, mono sm. */\n\tsize?: TextSize;\n\t/**\n\t * Foreground tone.\n\t * @default \"default\"\n\t */\n\ttone?: TextTone;\n\t/** Rendered HTML element. Defaults by variant: body p, heading/mono span. */\n\tas?: TextElement;\n\t/**\n\t * Apply semibold weight.\n\t * @default false\n\t */\n\tbold?: boolean;\n\t/**\n\t * Ellipsize overflow on one line.\n\t * @default false\n\t */\n\ttruncate?: boolean;\n}\n\nfunction defaultElement(variant: TextVariant): TextElement {\n\treturn variant === \"body\" ? \"p\" : \"span\";\n}\n\nfunction defaultSize(variant: TextVariant): TextSize {\n\tif (variant === \"heading\") {\n\t\treturn \"lg\";\n\t}\n\tif (variant === \"mono\") {\n\t\treturn \"sm\";\n\t}\n\treturn \"md\";\n}\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(\n\t(\n\t\t{\n\t\t\tas,\n\t\t\tbold = false,\n\t\t\tclassName,\n\t\t\tsize,\n\t\t\ttone = \"default\",\n\t\t\ttruncate = false,\n\t\t\tvariant = \"body\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = as ?? defaultElement(variant);\n\t\treturn React.createElement(Component, {\n\t\t\t...props,\n\t\t\tref,\n\t\t\tclassName: cn(\n\t\t\t\ttextVariants({ size: size ?? defaultSize(variant), tone }),\n\t\t\t\tvariant === \"heading\" && \"font-semibold\",\n\t\t\t\tvariant === \"mono\" && \"font-mono\",\n\t\t\t\tbold && \"font-semibold\",\n\t\t\t\ttruncate && \"min-w-0 truncate\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t});\n\t},\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;AA8BA,IAAM,IAAe,EAAI,0BAA0B;CAClD,UAAU;EACT,MAAM;GACL,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACL;EACA,MAAM;GACL,SAAS;GACT,OAAO;EACR;CACD;CACA,iBAAiB;EAChB,MAAM;EACN,MAAM;CACP;AACD,CAAC;AA6BD,SAAS,EAAe,GAAmC;CAC1D,OAAO,MAAY,SAAS,MAAM;AACnC;AAEA,SAAS,EAAY,GAAgC;CAOpD,OANI,MAAY,YACR,OAEJ,MAAY,SACR,OAED;AACR;AAEA,IAAa,IAAO,EAAM,YAExB,EACC,OACA,UAAO,IACP,cACA,SACA,UAAO,WACP,cAAW,IACX,aAAU,QACV,GAAG,KAEJ,MACI;CACJ,IAAM,IAAY,KAAM,EAAe,CAAO;CAC9C,OAAO,EAAM,cAAc,GAAW;EACrC,GAAG;EACH;EACA,WAAW,EACV,EAAa;GAAE,MAAM,KAAQ,EAAY,CAAO;GAAG;EAAK,CAAC,GACzD,MAAY,aAAa,iBACzB,MAAY,UAAU,aACtB,KAAQ,iBACR,KAAY,oBACZ,CACD;CACD,CAAC;AACF,CACD;AACA,EAAK,cAAc"}
+{"version":3,"file":"text.js","names":[],"sources":["../../src/components/text.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport type TextVariant = \"body\" | \"heading\" | \"mono\";\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextTone = \"default\" | \"muted\";\nexport type TextElement =\n\t| \"h1\"\n\t| \"h2\"\n\t| \"h3\"\n\t| \"h4\"\n\t| \"h5\"\n\t| \"h6\"\n\t| \"p\"\n\t| \"span\"\n\t| \"label\"\n\t| \"dt\"\n\t| \"dd\"\n\t| \"li\"\n\t| \"figcaption\"\n\t| \"legend\"\n\t| \"pre\"\n\t| \"code\"\n\t| \"em\"\n\t| \"strong\"\n\t| \"small\"\n\t| \"abbr\"\n\t| \"time\";\n\nconst textVariants = cva(\"text-basalt-foreground\", {\n\tvariants: {\n\t\tsize: {\n\t\t\txs: \"text-xs\",\n\t\t\tsm: \"text-sm\",\n\t\t\tmd: \"text-sm leading-6\",\n\t\t\tlg: \"text-base\",\n\t\t\txl: \"text-lg\",\n\t\t},\n\t\ttone: {\n\t\t\tdefault: \"text-basalt-foreground\",\n\t\t\tmuted: \"text-basalt-muted-foreground\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t\ttone: \"default\",\n\t},\n});\n\nexport interface TextProps extends React.HTMLAttributes<HTMLElement> {\n\t/**\n\t * Visual role. Does not infer document outline.\n\t * @default \"body\"\n\t */\n\tvariant?: TextVariant;\n\t/** Type scale. Defaults by variant: body md, heading lg, mono sm. */\n\tsize?: TextSize;\n\t/**\n\t * Foreground tone.\n\t * @default \"default\"\n\t */\n\ttone?: TextTone;\n\t/** Rendered HTML element. Defaults by variant: body p, heading/mono span. */\n\tas?: TextElement;\n\t/**\n\t * Apply semibold weight.\n\t * @default false\n\t */\n\tbold?: boolean;\n\t/**\n\t * Ellipsize overflow on one line.\n\t * @default false\n\t */\n\ttruncate?: boolean;\n}\n\nfunction defaultElement(variant: TextVariant): TextElement {\n\treturn variant === \"body\" ? \"p\" : \"span\";\n}\n\nfunction defaultSize(variant: TextVariant): TextSize {\n\tif (variant === \"heading\") {\n\t\treturn \"lg\";\n\t}\n\tif (variant === \"mono\") {\n\t\treturn \"sm\";\n\t}\n\treturn \"md\";\n}\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(\n\t(\n\t\t{\n\t\t\tas,\n\t\t\tbold = false,\n\t\t\tclassName,\n\t\t\tsize,\n\t\t\ttone = \"default\",\n\t\t\ttruncate = false,\n\t\t\tvariant = \"body\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = as ?? defaultElement(variant);\n\t\treturn React.createElement(Component, {\n\t\t\t...props,\n\t\t\tref,\n\t\t\tclassName: cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\ttextVariants({ size: size ?? defaultSize(variant), tone }),\n\t\t\t\tvariant === \"heading\" && \"font-semibold\",\n\t\t\t\tvariant === \"mono\" && \"font-mono\",\n\t\t\t\tbold && \"font-semibold\",\n\t\t\t\ttruncate && \"min-w-0 truncate\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t});\n\t},\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;AA+BA,IAAM,IAAe,EAAI,0BAA0B;CAClD,UAAU;EACT,MAAM;GACL,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACL;EACA,MAAM;GACL,SAAS;GACT,OAAO;EACR;CACD;CACA,iBAAiB;EAChB,MAAM;EACN,MAAM;CACP;AACD,CAAC;AA6BD,SAAS,EAAe,GAAmC;CAC1D,OAAO,MAAY,SAAS,MAAM;AACnC;AAEA,SAAS,EAAY,GAAgC;CAOpD,OANI,MAAY,YACR,OAEJ,MAAY,SACR,OAED;AACR;AAEA,IAAa,IAAO,EAAM,YAExB,EACC,OACA,UAAO,IACP,cACA,SACA,UAAO,WACP,cAAW,IACX,aAAU,QACV,GAAG,KAEJ,MACI;CACJ,IAAM,IAAY,KAAM,EAAe,CAAO;CAC9C,OAAO,EAAM,cAAc,GAAW;EACrC,GAAG;EACH;EACA,WAAW,EACV,GACA,EAAa;GAAE,MAAM,KAAQ,EAAY,CAAO;GAAG;EAAK,CAAC,GACzD,MAAY,aAAa,iBACzB,MAAY,UAAU,aACtB,KAAQ,iBACR,KAAY,oBACZ,CACD;CACD,CAAC;AACF,CACD;AACA,EAAK,cAAc"}

package/dist/components/toast.d.ts

@@ -2,26 +2,196 @@ import type { ComponentProps, ReactNode } from "react";
 import { Toaster as Sonner } from "sonner";
 export type ToastVariant = "default" | "success" | "error" | "warning" | "info";
 export type ToastOptions = {
+    /**
+     * Secondary supporting text or node displayed below the main message.
+     */
     description?: ReactNode;
+    /**
+     * Custom icon override. When set to `false`, suppresses default status or notification icons.
+     */
     icon?: ReactNode | false;
+    /**
+     * Whether a close button is displayed on this individual toast notification.
+     * @default true
+     */
     close?: boolean;
+    /**
+     * Visibility duration in milliseconds before auto-dismissal. Resolved as `toast.duration || (Toaster.toastOptions.duration ?? Toaster.duration) || 4000`. Infinity disables auto-closing. Setting to 0 treats it as falsy and falls back through container duration before defaulting to 4000ms.
+     * @default "inherited from container, finally 4000ms"
+     */
     duration?: number;
+    /**
+     * Unique identifier for this toast notification. Can be used with `toast.dismiss(id)` to manually dismiss this specific toast.
+     */
     id?: string | number;
+    /**
+     * Optional action button configuration with label and onClick handler.
+     */
     action?: {
         label: string;
         onClick: () => void;
     };
 };
-declare function show(message: ReactNode, options?: ToastOptions & {
+/**
+ * Options accepted by the root `toast(message, options)` dispatch function, extending `ToastOptions` with an optional `variant`.
+ */
+export type ToastCallOptions = ToastOptions & {
+    /**
+     * Visual status variant style for this toast.
+     * @default "default"
+     */
     variant?: ToastVariant;
-}): string | number;
+};
+/**
+ * Dispatches a toast notification with the given message and options.
+ * @param message Main notification content or React node.
+ * @param options Notification customization options including optional variant.
+ * @returns The unique toast identifier (string or number).
+ */
+declare function show(message: ReactNode, options?: ToastCallOptions): string | number;
+/**
+ * Imperative notification dispatcher. Directly callable as `toast(message, options)` to display a default notification, with helper methods for status variants (`success`, `error`, `warning`, `info`) and dismissal (`dismiss`).
+ */
 export declare const toast: typeof show & {
+    /**
+     * Dispatches a success status toast notification.
+     * @param message Main notification content or React node.
+     * @param options Notification customization options.
+     * @returns The unique toast identifier (string or number).
+     */
     success: (message: ReactNode, options?: ToastOptions) => string | number;
+    /**
+     * Dispatches an error status toast notification.
+     * @param message Main notification content or React node.
+     * @param options Notification customization options.
+     * @returns The unique toast identifier (string or number).
+     */
     error: (message: ReactNode, options?: ToastOptions) => string | number;
+    /**
+     * Dispatches a warning status toast notification.
+     * @param message Main notification content or React node.
+     * @param options Notification customization options.
+     * @returns The unique toast identifier (string or number).
+     */
     warning: (message: ReactNode, options?: ToastOptions) => string | number;
+    /**
+     * Dispatches an info status toast notification.
+     * @param message Main notification content or React node.
+     * @param options Notification customization options.
+     * @returns The unique toast identifier (string or number).
+     */
     info: (message: ReactNode, options?: ToastOptions) => string | number;
+    /**
+     * Dismisses an active toast by its identifier, or dismisses all toasts when called without arguments. Note: Calling without arguments returns `undefined` at runtime; calling with `id` returns the dismissed `id`.
+     * @param id Optional identifier of the toast to dismiss. When omitted, all toasts are dismissed.
+     * @returns The dismissed toast identifier if provided, or undefined if dismissed without arguments.
+     */
     dismiss: (id?: number | string) => string | number;
 };
-export declare function Toaster({ closeButton, ...props }: ComponentProps<typeof Sonner>): import("react").JSX.Element;
+type SonnerComponentProps = ComponentProps<typeof Sonner>;
+export type ToasterToastOptions = NonNullable<SonnerComponentProps["toastOptions"]>;
+export type ToasterIcons = NonNullable<SonnerComponentProps["icons"]>;
+export type ToasterSwipeDirection = NonNullable<SonnerComponentProps["swipeDirections"]>[number];
+export interface ToasterProps extends Omit<SonnerComponentProps, "id" | "invert" | "theme" | "position" | "hotkey" | "richColors" | "expand" | "duration" | "gap" | "visibleToasts" | "closeButton" | "toastOptions" | "className" | "style" | "offset" | "mobileOffset" | "dir" | "swipeDirections" | "icons" | "containerAriaLabel" | "customAriaLabel"> {
+    /**
+     * Unique identifier for this toaster instance. When set, only toasts dispatched with a matching toasterId will display here. Basalt standard toast options do not expose toasterId, so global un-identified mounting is recommended.
+     */
+    id?: SonnerComponentProps["id"];
+    /**
+     * Invert toast foreground and background colors.
+     * @default false
+     */
+    invert?: SonnerComponentProps["invert"];
+    /**
+     * Color scheme theme override for toast notifications.
+     * @default "light"
+     */
+    theme?: SonnerComponentProps["theme"];
+    /**
+     * Screen positioning for the toast viewport stack.
+     * @default "bottom-right"
+     */
+    position?: SonnerComponentProps["position"];
+    /**
+     * Keyboard hotkey combination to expand and focus the toast viewport.
+     * @default ["altKey", "KeyT"]
+     */
+    hotkey?: SonnerComponentProps["hotkey"];
+    /**
+     * Whether rich semantic colors should be applied to default notification styles.
+     * @default false
+     */
+    richColors?: SonnerComponentProps["richColors"];
+    /**
+     * Whether toasts should be expanded by default rather than collapsed into a stacked pile.
+     * @default false
+     */
+    expand?: SonnerComponentProps["expand"];
+    /**
+     * Default visibility duration in milliseconds before auto-dismissal. Resolved as `toast.duration || (Toaster.toastOptions.duration ?? Toaster.duration) || 4000`. Passing Infinity prevents auto-closing. When `toastOptions.duration === 0`, it is treated as falsy and bypasses `Toaster.duration`, falling back to 4000.
+     * @default 4000
+     */
+    duration?: SonnerComponentProps["duration"];
+    /**
+     * Pixel gap between stacked toasts.
+     * @default 14
+     */
+    gap?: SonnerComponentProps["gap"];
+    /**
+     * Maximum number of toasts visible simultaneously in the stack.
+     * @default 3
+     */
+    visibleToasts?: SonnerComponentProps["visibleToasts"];
+    /**
+     * Whether a close button is displayed on each toast notification. Basalt enables this by default (`closeButton = true`), and Basalt single-toast calls also default to `close: true`, overriding `Toaster.closeButton = false`. To hide the close button on an individual toast, pass `close: false` in the dispatch options.
+     * @default true
+     */
+    closeButton?: SonnerComponentProps["closeButton"];
+    /**
+     * Default options and custom class names applied to all rendered toasts. Passing a custom `toastOptions` object will override Basalt default styling rather than deep-merging.
+     */
+    toastOptions?: ToasterToastOptions;
+    /**
+     * Additional CSS class name applied to each rendered ordered list (`ol`) toast viewport.
+     */
+    className?: SonnerComponentProps["className"];
+    /**
+     * Inline style properties applied to each rendered ordered list (`ol`) toast viewport.
+     */
+    style?: SonnerComponentProps["style"];
+    /**
+     * Viewport offset margin from screen edges on desktop screens.
+     * @default "24px"
+     */
+    offset?: SonnerComponentProps["offset"];
+    /**
+     * Viewport offset margin from screen edges on mobile devices.
+     * @default "16px"
+     */
+    mobileOffset?: SonnerComponentProps["mobileOffset"];
+    /**
+     * Layout direction of the notification viewport ('ltr', 'rtl', or document direction when unspecified).
+     * @default document direction
+     */
+    dir?: SonnerComponentProps["dir"];
+    /**
+     * Allowed swipe directions to dismiss toasts. Defaults based on position orientation (e.g. ['bottom', 'right'] for bottom-right).
+     */
+    swipeDirections?: ToasterSwipeDirection[];
+    /**
+     * Custom icon overrides for toast status variants. Basalt preconfigures Lucide icons; passing an `icons` object replaces defaults rather than deep-merging. Basalt status variant dispatches (`toast.success`, `error`, `warning`, `info`) supply default status icons directly, which take precedence over `Toaster.icons`; custom individual toast icons should be passed via `options.icon`.
+     */
+    icons?: ToasterIcons;
+    /**
+     * Accessible label for the notification region container.
+     * @default "Notifications"
+     */
+    containerAriaLabel?: SonnerComponentProps["containerAriaLabel"];
+    /**
+     * Custom accessible label overriding both containerAriaLabel and hotkey text on the section wrapper.
+     */
+    customAriaLabel?: SonnerComponentProps["customAriaLabel"];
+}
+export declare function Toaster({ closeButton, ...props }: ToasterProps): import("react").JSX.Element;
 export declare const Toast: typeof Toaster;
 export {};

package/dist/components/toast.js

@@ -17,7 +17,7 @@ var c = {
 	info: /* @__PURE__ */ a(n, { className: "size-4" })
 };
 function u(e, t) {
-	return t === !1 ? !1 : t ?? l[e] ?? void 0;
+	return t === !1 ? null : t ?? l[e] ?? void 0;
 }
 function d(e, t = {}) {
 	let { variant: n = "default", icon: r, close: i = !0, ...a } = t, o = {