@nocoo/basalt 2.0.3 → 2.1.2

package/dist/components/autocomplete.js.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.js","names":[],"sources":["../../src/components/autocomplete.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport type { InputSize } from \"./input\";\nimport { TypeaheadField, type TypeaheadItem } from \"./typeahead-field\";\n\nexport type AutocompleteItem = TypeaheadItem;\n\nexport type AutocompleteProps = Omit<\n\tComponentPropsWithoutRef<\"div\">,\n\t\"children\" | \"defaultValue\" | \"onChange\"\n> & {\n\t/**\n\t * Suggestions shown as the query matches. Values outside the list are allowed.\n\t */\n\titems: AutocompleteItem[];\n\t/**\n\t * The controlled value.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial value.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the value changes, including freeform text.\n\t */\n\tonValueChange?: (value: string) => void;\n\t/**\n\t * Native form field name.\n\t */\n\tname?: string;\n\t/**\n\t * Placeholder shown when the field is empty.\n\t * @default Search…\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Disable the field.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Disable the field and mark it busy.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * The visual size of the field.\n\t * @default default\n\t */\n\tsize?: InputSize;\n};\n\nexport function Autocomplete({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tname,\n\tplaceholder = \"Search…\",\n\tdisabled,\n\tloading,\n\tsize,\n\tclassName,\n\tid,\n\t\"aria-label\": ariaLabel,\n\t\"aria-describedby\": ariaDescribedBy,\n\t\"aria-invalid\": ariaInvalid,\n\t...rest\n}: AutocompleteProps) {\n\treturn (\n\t\t<TypeaheadField\n\t\t\titems={items}\n\t\t\tvalue={value}\n\t\t\tdefaultValue={defaultValue}\n\t\t\tonValueChange={onValueChange}\n\t\t\tname={name}\n\t\t\tplaceholder={placeholder}\n\t\t\tdisabled={disabled}\n\t\t\tloading={loading}\n\t\t\tsize={size}\n\t\t\tclassName={className}\n\t\t\tid={id}\n\t\t\tallowFreeform\n\t\t\taria-label={ariaLabel}\n\t\t\taria-describedby={ariaDescribedBy}\n\t\t\taria-invalid={ariaInvalid}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;AAoDA,SAAgB,EAAa,EAC5B,UACA,UACA,iBACA,kBACA,SACA,iBAAc,WACd,aACA,YACA,SACA,cACA,OACA,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,GAAG,KACkB;CACrB,OACC,kBAAC,GAAD;EACQ;EACA;EACO;EACC;EACT;EACO;EACH;EACD;EACH;EACK;EACP;EACJ,eAAA;EACA,cAAY;EACZ,oBAAkB;EAClB,gBAAc;EACd,GAAI;CACJ,CAAA;AAEH"}
+{"version":3,"file":"autocomplete.js","names":[],"sources":["../../src/components/autocomplete.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\nimport type { InputSize } from \"./input\";\nimport { TypeaheadField, type TypeaheadItem } from \"./typeahead-field\";\n\nexport type AutocompleteItem = TypeaheadItem;\n\nexport type AutocompleteProps = Omit<\n\tComponentPropsWithoutRef<\"div\">,\n\t\"children\" | \"defaultValue\" | \"onChange\"\n> & {\n\t/**\n\t * Suggestions shown as the query matches. Values outside the list are allowed.\n\t *\n\t * Note: When focus leaves the field (via pointer click or Tab/Shift+Tab navigation),\n\t * any uncommitted text or matching suggestion is committed once without stealing focus\n\t * back to the input, allowing natural focus traversal.\n\t */\n\titems: AutocompleteItem[];\n\t/**\n\t * The controlled value.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial value.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the value changes, including freeform text.\n\t */\n\tonValueChange?: (value: string) => void;\n\t/**\n\t * Native form field name.\n\t */\n\tname?: string;\n\t/**\n\t * Placeholder shown when the field is empty.\n\t * @default Search…\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Disable the field.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Disable the field and mark it busy.\n\t * @default false\n\t */\n\tloading?: boolean;\n\t/**\n\t * The visual size of the field.\n\t * @default default\n\t */\n\tsize?: InputSize;\n};\n\nexport function Autocomplete({\n\titems,\n\tvalue,\n\tdefaultValue,\n\tonValueChange,\n\tname,\n\tplaceholder = \"Search…\",\n\tdisabled,\n\tloading,\n\tsize,\n\tclassName,\n\tid,\n\t\"aria-label\": ariaLabel,\n\t\"aria-describedby\": ariaDescribedBy,\n\t\"aria-invalid\": ariaInvalid,\n\t...rest\n}: AutocompleteProps) {\n\treturn (\n\t\t<TypeaheadField\n\t\t\titems={items}\n\t\t\tvalue={value}\n\t\t\tdefaultValue={defaultValue}\n\t\t\tonValueChange={onValueChange}\n\t\t\tname={name}\n\t\t\tplaceholder={placeholder}\n\t\t\tdisabled={disabled}\n\t\t\tloading={loading}\n\t\t\tsize={size}\n\t\t\tclassName={className}\n\t\t\tid={id}\n\t\t\tallowFreeform\n\t\t\taria-label={ariaLabel}\n\t\t\taria-describedby={ariaDescribedBy}\n\t\t\taria-invalid={ariaInvalid}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;AAwDA,SAAgB,EAAa,EAC5B,UACA,UACA,iBACA,kBACA,SACA,iBAAc,WACd,aACA,YACA,SACA,cACA,OACA,cAAc,GACd,oBAAoB,GACpB,gBAAgB,GAChB,GAAG,KACkB;CACrB,OACC,kBAAC,GAAD;EACQ;EACA;EACO;EACC;EACT;EACO;EACH;EACD;EACH;EACK;EACP;EACJ,eAAA;EACA,cAAY;EACZ,oBAAkB;EAClB,gBAAc;EACd,GAAI;CACJ,CAAA;AAEH"}

package/dist/components/avatar.d.ts

@@ -1,5 +1,78 @@
 import * as AvatarPrimitive from "@radix-ui/react-avatar";
 import * as React from "react";
-export declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
-export declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
-export declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export type AvatarProps = Omit<React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>, "asChild"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+};
+export declare const Avatar: React.ForwardRefExoticComponent<Omit<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref">, "asChild"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+} & React.RefAttributes<HTMLSpanElement>>;
+export type AvatarImageProps = Omit<React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>, "asChild" | "onLoadingStatusChange" | "src" | "alt"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Image source URL for the avatar image.
+     */
+    src?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["src"];
+    /**
+     * Text description of the image for accessibility and screen readers.
+     */
+    alt?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["alt"];
+    /**
+     * A callback providing the current loading status of the image ('idle' | 'loading' | 'loaded' | 'error').
+     */
+    onLoadingStatusChange?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["onLoadingStatusChange"];
+};
+export declare const AvatarImage: React.ForwardRefExoticComponent<Omit<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref">, "alt" | "asChild" | "onLoadingStatusChange" | "src"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Image source URL for the avatar image.
+     */
+    src?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["src"];
+    /**
+     * Text description of the image for accessibility and screen readers.
+     */
+    alt?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["alt"];
+    /**
+     * A callback providing the current loading status of the image ('idle' | 'loading' | 'loaded' | 'error').
+     */
+    onLoadingStatusChange?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>["onLoadingStatusChange"];
+} & React.RefAttributes<HTMLImageElement>>;
+export type AvatarFallbackProps = Omit<React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>, "asChild" | "delayMs"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Useful for delaying rendering so it only appears for those with slower connections.
+     * Unset by default, rendering immediately without delay.
+     */
+    delayMs?: number;
+};
+export declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref">, "asChild" | "delayMs"> & {
+    /**
+     * Change the default rendered element for the one passed as a child, merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Useful for delaying rendering so it only appears for those with slower connections.
+     * Unset by default, rendering immediately without delay.
+     */
+    delayMs?: number;
+} & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.js","names":[],"sources":["../../src/components/avatar.tsx"],"sourcesContent":["import * as AvatarPrimitive from \"@radix-ui/react-avatar\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport const Avatar = React.forwardRef<\n\tReact.ElementRef<typeof AvatarPrimitive.Root>,\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Root\n\t\tref={ref}\n\t\tclassName={cn(\"relative flex h-9 w-9 shrink-0 overflow-hidden rounded-full\", className)}\n\t\t{...props}\n\t/>\n));\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nexport const AvatarImage = React.forwardRef<\n\tReact.ElementRef<typeof AvatarPrimitive.Image>,\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Image\n\t\tref={ref}\n\t\tclassName={cn(\"aspect-square h-full w-full\", className)}\n\t\t{...props}\n\t/>\n));\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nexport const AvatarFallback = React.forwardRef<\n\tReact.ElementRef<typeof AvatarPrimitive.Fallback>,\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Fallback\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-full w-full items-center justify-center rounded-full bg-basalt-muted text-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n"],"mappings":";;;;;;AAIA,IAAa,IAAS,EAAM,YAGzB,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,MAAjB;CACM;CACL,WAAW,EAAG,+DAA+D,CAAS;CACtF,GAAI;AACJ,CAAA,CACD;AACD,EAAO,cAAc,EAAgB,KAAK;AAE1C,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,+BAA+B,CAAS;CACtD,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAgB,MAAM;AAEhD,IAAa,IAAiB,EAAM,YAGjC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,UAAjB;CACM;CACL,WAAW,EACV,uFACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAe,cAAc,EAAgB,SAAS"}
+{"version":3,"file":"avatar.js","names":[],"sources":["../../src/components/avatar.tsx"],"sourcesContent":["import * as AvatarPrimitive from \"@radix-ui/react-avatar\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type AvatarProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>,\n\t\"asChild\"\n> & {\n\t/**\n\t * Change the default rendered element for the one passed as a child, merging their props and behavior.\n\t * @default false\n\t */\n\tasChild?: boolean;\n};\n\nexport const Avatar = React.forwardRef<React.ElementRef<typeof AvatarPrimitive.Root>, AvatarProps>(\n\t({ className, ...props }, ref) => (\n\t\t<AvatarPrimitive.Root\n\t\t\tref={ref}\n\t\t\tclassName={cn(\"relative flex h-9 w-9 shrink-0 overflow-hidden rounded-full\", className)}\n\t\t\t{...props}\n\t\t/>\n\t),\n);\nAvatar.displayName = AvatarPrimitive.Root.displayName;\n\nexport type AvatarImageProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>,\n\t\"asChild\" | \"onLoadingStatusChange\" | \"src\" | \"alt\"\n> & {\n\t/**\n\t * Change the default rendered element for the one passed as a child, merging their props and behavior.\n\t * @default false\n\t */\n\tasChild?: boolean;\n\t/**\n\t * Image source URL for the avatar image.\n\t */\n\tsrc?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>[\"src\"];\n\t/**\n\t * Text description of the image for accessibility and screen readers.\n\t */\n\talt?: React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>[\"alt\"];\n\t/**\n\t * A callback providing the current loading status of the image ('idle' | 'loading' | 'loaded' | 'error').\n\t */\n\tonLoadingStatusChange?: React.ComponentPropsWithoutRef<\n\t\ttypeof AvatarPrimitive.Image\n\t>[\"onLoadingStatusChange\"];\n};\n\nexport const AvatarImage = React.forwardRef<\n\tReact.ElementRef<typeof AvatarPrimitive.Image>,\n\tAvatarImageProps\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Image\n\t\tref={ref}\n\t\tclassName={cn(\"aspect-square h-full w-full\", className)}\n\t\t{...props}\n\t/>\n));\nAvatarImage.displayName = AvatarPrimitive.Image.displayName;\n\nexport type AvatarFallbackProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>,\n\t\"asChild\" | \"delayMs\"\n> & {\n\t/**\n\t * Change the default rendered element for the one passed as a child, merging their props and behavior.\n\t * @default false\n\t */\n\tasChild?: boolean;\n\t/**\n\t * Useful for delaying rendering so it only appears for those with slower connections.\n\t * Unset by default, rendering immediately without delay.\n\t */\n\tdelayMs?: number;\n};\n\nexport const AvatarFallback = React.forwardRef<\n\tReact.ElementRef<typeof AvatarPrimitive.Fallback>,\n\tAvatarFallbackProps\n>(({ className, ...props }, ref) => (\n\t<AvatarPrimitive.Fallback\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"flex h-full w-full items-center justify-center rounded-full bg-basalt-muted text-xs\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nAvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;\n"],"mappings":";;;;;;AAeA,IAAa,IAAS,EAAM,YAC1B,EAAE,cAAW,GAAG,KAAS,MACzB,kBAAC,EAAgB,MAAjB;CACM;CACL,WAAW,EAAG,+DAA+D,CAAS;CACtF,GAAI;AACJ,CAAA,CAEH;AACA,EAAO,cAAc,EAAgB,KAAK;AA2B1C,IAAa,IAAc,EAAM,YAG9B,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,OAAjB;CACM;CACL,WAAW,EAAG,+BAA+B,CAAS;CACtD,GAAI;AACJ,CAAA,CACD;AACD,EAAY,cAAc,EAAgB,MAAM;AAkBhD,IAAa,IAAiB,EAAM,YAGjC,EAAE,cAAW,GAAG,KAAS,MAC3B,kBAAC,EAAgB,UAAjB;CACM;CACL,WAAW,EACV,uFACA,CACD;CACA,GAAI;AACJ,CAAA,CACD;AACD,EAAe,cAAc,EAAgB,SAAS"}

package/dist/components/badge.d.ts

@@ -3,7 +3,21 @@ import type * as React from "react";
 declare const badgeVariants: (props?: ({
     variant?: "blue" | "default" | "destructive" | "error" | "info" | "orange" | "outline" | "purple" | "red" | "secondary" | "success" | "teal" | "warning" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeVariants> {
+export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement>, Omit<VariantProps<typeof badgeVariants>, "variant"> {
+    /**
+     * Visual style variant for the badge.
+     *
+     * Note: Supports standard semantic tones and decorative color tokens.
+     * Pass null to omit variant styling.
+     *
+     * @default "default"
+     */
+    variant?: VariantProps<typeof badgeVariants>["variant"];
+    /**
+     * Renders a small circular dot indicator before children.
+     *
+     * @default false
+     */
     dot?: boolean;
 }
 export declare function Badge({ className, variant, dot, children, ...props }: BadgeProps): React.JSX.Element;

package/dist/components/badge.js

@@ -1,9 +1,10 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { cva as t } from "class-variance-authority";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { cva as n } from "class-variance-authority";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
 //#region src/components/badge.tsx
-var i = t("inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-medium", {
+var a = n("inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-medium", {
 	variants: { variant: {
 		default: "border-transparent bg-basalt-primary text-basalt-primary-foreground",
 		secondary: "border-transparent bg-basalt-secondary text-basalt-foreground",
@@ -15,23 +16,23 @@ var i = t("inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 te
 		error: "border-transparent bg-basalt-danger-tint text-basalt-danger",
 		red: "border-transparent bg-basalt-danger text-white",
 		orange: "border-transparent bg-basalt-warning text-white",
-		teal: "border-transparent bg-basalt-chart-3 text-white",
+		teal: "border-transparent bg-basalt-badge-teal text-white",
 		blue: "border-transparent bg-basalt-info text-white",
-		purple: "border-transparent bg-basalt-chart-14 text-white"
+		purple: "border-transparent bg-basalt-badge-purple text-white"
 	} },
 	defaultVariants: { variant: "default" }
 });
-function a({ className: t, variant: a, dot: o, children: s, ...c }) {
-	return /* @__PURE__ */ r("span", {
-		className: e(i({ variant: a }), t),
-		...c,
-		children: [o ? /* @__PURE__ */ n("span", {
+function o({ className: n, variant: o, dot: s, children: c, ...l }) {
+	return /* @__PURE__ */ i("span", {
+		className: e(t, a({ variant: o }), n),
+		...l,
+		children: [s ? /* @__PURE__ */ r("span", {
 			className: "size-1.5 rounded-full bg-current",
 			"aria-hidden": "true"
-		}) : null, s]
+		}) : null, c]
 	});
 }
 //#endregion
-export { a as Badge };
+export { o as Badge };
 
 //# sourceMappingURL=badge.js.map

package/dist/components/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","names":[],"sources":["../../src/components/badge.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { cn } from \"../utils/cn\";\n\nconst badgeVariants = cva(\n\t\"inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-medium\",\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"border-transparent bg-basalt-primary text-basalt-primary-foreground\",\n\t\t\t\tsecondary: \"border-transparent bg-basalt-secondary text-basalt-foreground\",\n\t\t\t\tdestructive: \"border-transparent bg-basalt-destructive text-basalt-destructive-foreground\",\n\t\t\t\toutline: \"border-basalt-border text-basalt-foreground\",\n\t\t\t\tinfo: \"border-transparent bg-basalt-info-tint text-basalt-info\",\n\t\t\t\tsuccess: \"border-transparent bg-basalt-heatmap-green-3 text-white\",\n\t\t\t\twarning: \"border-transparent bg-basalt-warning-tint text-basalt-warning\",\n\t\t\t\terror: \"border-transparent bg-basalt-danger-tint text-basalt-danger\",\n\t\t\t\tred: \"border-transparent bg-basalt-danger text-white\",\n\t\t\t\torange: \"border-transparent bg-basalt-warning text-white\",\n\t\t\t\tteal: \"border-transparent bg-basalt-chart-3 text-white\",\n\t\t\t\tblue: \"border-transparent bg-basalt-info text-white\",\n\t\t\t\tpurple: \"border-transparent bg-basalt-chart-14 text-white\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: { variant: \"default\" },\n\t},\n);\n\nexport interface BadgeProps\n\textends React.HTMLAttributes<HTMLSpanElement>,\n\t\tVariantProps<typeof badgeVariants> {\n\tdot?: boolean;\n}\n\nexport function Badge({ className, variant, dot, children, ...props }: BadgeProps) {\n\treturn (\n\t\t<span className={cn(badgeVariants({ variant }), className)} {...props}>\n\t\t\t{dot ? <span className=\"size-1.5 rounded-full bg-current\" aria-hidden=\"true\" /> : null}\n\t\t\t{children}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;AAIA,IAAM,IAAgB,EACrB,0FACA;CACC,UAAU,EACT,SAAS;EACR,SAAS;EACT,WAAW;EACX,aAAa;EACb,SAAS;EACT,MAAM;EACN,SAAS;EACT,SAAS;EACT,OAAO;EACP,KAAK;EACL,QAAQ;EACR,MAAM;EACN,MAAM;EACN,QAAQ;CACT,EACD;CACA,iBAAiB,EAAE,SAAS,UAAU;AACvC,CACD;AAQA,SAAgB,EAAM,EAAE,cAAW,YAAS,QAAK,aAAU,GAAG,KAAqB;CAClF,OACC,kBAAC,QAAD;EAAM,WAAW,EAAG,EAAc,EAAE,WAAQ,CAAC,GAAG,CAAS;EAAG,GAAI;EAAhE,UAAA,CACE,IAAM,kBAAC,QAAD;GAAM,WAAU;GAAmC,eAAY;EAAQ,CAAA,IAAI,MACjF,CACI;;AAER"}
+{"version":3,"file":"badge.js","names":[],"sources":["../../src/components/badge.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nconst badgeVariants = cva(\n\t\"inline-flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-medium\",\n\t{\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"border-transparent bg-basalt-primary text-basalt-primary-foreground\",\n\t\t\t\tsecondary: \"border-transparent bg-basalt-secondary text-basalt-foreground\",\n\t\t\t\tdestructive: \"border-transparent bg-basalt-destructive text-basalt-destructive-foreground\",\n\t\t\t\toutline: \"border-basalt-border text-basalt-foreground\",\n\t\t\t\tinfo: \"border-transparent bg-basalt-info-tint text-basalt-info\",\n\t\t\t\tsuccess: \"border-transparent bg-basalt-heatmap-green-3 text-white\",\n\t\t\t\twarning: \"border-transparent bg-basalt-warning-tint text-basalt-warning\",\n\t\t\t\terror: \"border-transparent bg-basalt-danger-tint text-basalt-danger\",\n\t\t\t\tred: \"border-transparent bg-basalt-danger text-white\",\n\t\t\t\torange: \"border-transparent bg-basalt-warning text-white\",\n\t\t\t\tteal: \"border-transparent bg-basalt-badge-teal text-white\",\n\t\t\t\tblue: \"border-transparent bg-basalt-info text-white\",\n\t\t\t\tpurple: \"border-transparent bg-basalt-badge-purple text-white\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: { variant: \"default\" },\n\t},\n);\n\nexport interface BadgeProps\n\textends React.HTMLAttributes<HTMLSpanElement>,\n\t\tOmit<VariantProps<typeof badgeVariants>, \"variant\"> {\n\t/**\n\t * Visual style variant for the badge.\n\t *\n\t * Note: Supports standard semantic tones and decorative color tokens.\n\t * Pass null to omit variant styling.\n\t *\n\t * @default \"default\"\n\t */\n\tvariant?: VariantProps<typeof badgeVariants>[\"variant\"];\n\n\t/**\n\t * Renders a small circular dot indicator before children.\n\t *\n\t * @default false\n\t */\n\tdot?: boolean;\n}\n\nexport function Badge({ className, variant, dot, children, ...props }: BadgeProps) {\n\treturn (\n\t\t<span className={cn(BASALT_UI_CLASS, badgeVariants({ variant }), className)} {...props}>\n\t\t\t{dot ? <span className=\"size-1.5 rounded-full bg-current\" aria-hidden=\"true\" /> : null}\n\t\t\t{children}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;;AAKA,IAAM,IAAgB,EACrB,0FACA;CACC,UAAU,EACT,SAAS;EACR,SAAS;EACT,WAAW;EACX,aAAa;EACb,SAAS;EACT,MAAM;EACN,SAAS;EACT,SAAS;EACT,OAAO;EACP,KAAK;EACL,QAAQ;EACR,MAAM;EACN,MAAM;EACN,QAAQ;CACT,EACD;CACA,iBAAiB,EAAE,SAAS,UAAU;AACvC,CACD;AAuBA,SAAgB,EAAM,EAAE,cAAW,YAAS,QAAK,aAAU,GAAG,KAAqB;CAClF,OACC,kBAAC,QAAD;EAAM,WAAW,EAAG,GAAiB,EAAc,EAAE,WAAQ,CAAC,GAAG,CAAS;EAAG,GAAI;EAAjF,UAAA,CACE,IAAM,kBAAC,QAAD;GAAM,WAAU;GAAmC,eAAY;EAAQ,CAAA,IAAI,MACjF,CACI;;AAER"}

package/dist/components/banner.d.ts

@@ -5,14 +5,100 @@ declare const bannerVariants: (props?: ({
     variant?: "alert" | "default" | "error" | "secondary" | null | undefined;
     size?: "base" | "sm" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-export interface BannerProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof bannerVariants> {
+export interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title" | "children">, Omit<VariantProps<typeof bannerVariants>, "variant" | "size"> {
+    /**
+     * Visual tone variant of the banner.
+     *
+     * Note: Defaults to "default" (informational). Passing null falls back to "default".
+     *
+     * @default "default"
+     */
+    variant?: VariantProps<typeof bannerVariants>["variant"];
+    /**
+     * Sizing preset controlling padding geometry and action placement.
+     *
+     * Note: Defaults to "base". In compact mode ("sm"), only direct `<Banner.Action>` elements
+     * are placed in the trailing slot, while other action content renders inline next to the description.
+     * Passing null falls back to "base".
+     *
+     * @default "base"
+     */
+    size?: VariantProps<typeof bannerVariants>["size"];
+    /**
+     * Primary heading text.
+     *
+     * Note: When present (or when description is present), structured mode is enabled
+     * and standard children are not rendered.
+     */
     title?: string;
+    /**
+     * Secondary copy rendered below the title.
+     */
     description?: ReactNode;
+    /**
+     * Visual icon rendered before the banner content.
+     */
     icon?: ReactNode;
+    /**
+     * Trailing or inline call-to-action slot.
+     * Pass `<Banner.Action>` elements for contextual styling.
+     * In compact mode ("sm"), only direct `<Banner.Action>` elements are placed in the trailing slot,
+     * while other action content renders inline next to the description.
+     */
     action?: ReactNode;
+    /**
+     * Unstructured child content rendered only when both title and description are null or undefined.
+     * When title or description is non-null/non-undefined (including empty string or false),
+     * structured mode is active and children are ignored.
+     */
+    children?: HTMLAttributes<HTMLDivElement>["children"];
+}
+export interface BannerActionProps extends Omit<ButtonProps, "variant" | "size" | "asChild" | "type" | "loading" | "icon" | "children"> {
+    /**
+     * Visual style variant. Preserves "ghost" and "secondary"; all other values
+     * are mapped contextually to "destructive" (when parent Banner variant is "error")
+     * or "default".
+     *
+     * Note: Ordinary function component without forwarded ref.
+     *
+     * @default "default"
+     */
+    variant?: ButtonProps["variant"];
+    /**
+     * Sizing preset. When unspecified or null, resolves to "icon" if children are omitted,
+     * null, or an empty string, "sm" when parent Banner is compact ("sm"), or "default" otherwise.
+     * When iconOnly mode is resolved, an additional "size-8" class is attached.
+     */
+    size?: ButtonProps["size"];
+    /**
+     * Pass control to child element slot.
+     *
+     * @default false
+     */
+    asChild?: ButtonProps["asChild"];
+    /**
+     * Button type attribute.
+     *
+     * @default "button"
+     */
+    type?: ButtonProps["type"];
+    /**
+     * Display loading spinner and disable interactions.
+     *
+     * @default false
+     */
+    loading?: ButtonProps["loading"];
+    /**
+     * Optional leading icon slot.
+     */
+    icon?: ButtonProps["icon"];
+    /**
+     * Action label content. When null, undefined, or empty string, enables iconOnly sizing mode.
+     */
+    children?: ButtonProps["children"];
 }
 declare function BannerRoot({ className, variant, size, title, description, icon, action, children, ...props }: BannerProps): import("react").JSX.Element;
-export declare function BannerAction({ className, variant, size, icon, children, ...props }: ButtonProps): import("react").JSX.Element;
+export declare function BannerAction({ className, variant, size, icon, children, ...props }: BannerActionProps): import("react").JSX.Element;
 export declare namespace BannerAction {
     var displayName: string;
 }

package/dist/components/banner.js

@@ -1,11 +1,12 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { Button as t } from "./button.js";
-import { Children as n, createContext as r, useContext as i } from "react";
-import { cva as a } from "class-variance-authority";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
+import { Button as n } from "./button.js";
+import { Children as r, createContext as i, useContext as a } from "react";
+import { cva as o } from "class-variance-authority";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/banner.tsx
-var l = a("flex w-full items-start gap-3 rounded-basalt-md text-sm", {
+var u = o("flex w-full items-start gap-3 rounded-basalt-md text-sm", {
 	variants: {
 		variant: {
 			default: "bg-basalt-info-tint text-basalt-info",
@@ -22,67 +23,67 @@ var l = a("flex w-full items-start gap-3 rounded-basalt-md text-sm", {
 		variant: "default",
 		size: "base"
 	}
-}), u = r({
+}), d = i({
 	variant: "default",
 	size: "base"
 });
-function d(e) {
-	return typeof e == "object" && !!e && "type" in e && e.type === p;
+function f(e) {
+	return typeof e == "object" && !!e && "type" in e && e.type === m;
 }
-function f({ className: t, variant: r = "default", size: i = "base", title: a, description: f, icon: p, action: m, children: h, ...g }) {
-	let _ = r ?? "default", v = i ?? "base", y = a != null || f != null, b = n.toArray(m), x = b.filter(d), S = b.filter((e) => !d(e)), C = v === "sm" ? x : [...S, ...x], w = v === "sm" ? S : [];
-	return /* @__PURE__ */ s(u.Provider, {
+function p({ className: n, variant: i = "default", size: a = "base", title: o, description: p, icon: m, action: h, children: g, ..._ }) {
+	let v = i ?? "default", y = a ?? "base", b = o != null || p != null, x = r.toArray(h), S = x.filter(f), C = x.filter((e) => !f(e)), w = y === "sm" ? S : [...C, ...S], T = y === "sm" ? C : [];
+	return /* @__PURE__ */ c(d.Provider, {
 		value: {
-			variant: _,
-			size: v
+			variant: v,
+			size: y
 		},
-		children: /* @__PURE__ */ c("div", {
-			className: e(l({
-				variant: _,
-				size: v
-			}), t),
-			...g,
+		children: /* @__PURE__ */ l("div", {
+			className: e(t, u({
+				variant: v,
+				size: y
+			}), n),
+			..._,
 			children: [
-				p ? /* @__PURE__ */ s("span", {
+				m ? /* @__PURE__ */ c("span", {
 					className: "mt-0.5 inline-flex shrink-0 [&_svg]:size-5",
-					children: p
+					children: m
 				}) : null,
-				/* @__PURE__ */ c("div", {
+				/* @__PURE__ */ l("div", {
 					className: "min-w-0 flex-1 space-y-0.5",
 					children: [
-						a ? /* @__PURE__ */ s("p", {
+						o ? /* @__PURE__ */ c("p", {
 							className: "font-medium",
-							children: a
+							children: o
 						}) : null,
-						f ? /* @__PURE__ */ c("div", {
-							className: e(_ === "secondary" ? "text-basalt-muted-foreground" : "text-current"),
-							children: [f, w.length > 0 ? /* @__PURE__ */ c(o, { children: [" ", w] }) : null]
-						}) : w.length > 0 ? /* @__PURE__ */ s("div", { children: w }) : null,
-						y ? null : h
+						p ? /* @__PURE__ */ l("div", {
+							className: e(v === "secondary" ? "text-basalt-muted-foreground" : "text-current"),
+							children: [p, T.length > 0 ? /* @__PURE__ */ l(s, { children: [" ", T] }) : null]
+						}) : T.length > 0 ? /* @__PURE__ */ c("div", { children: T }) : null,
+						b ? null : g
 					]
 				}),
-				C.length > 0 ? /* @__PURE__ */ s("div", {
+				w.length > 0 ? /* @__PURE__ */ c("div", {
 					className: "flex shrink-0 items-center gap-2",
-					children: C
+					children: w
 				}) : null
 			]
 		})
 	});
 }
-function p({ className: n, variant: r = "default", size: a, icon: o, children: c, ...l }) {
-	let d = i(u), f = r === "ghost" ? "ghost" : r === "secondary" ? "secondary" : d.variant === "error" ? "destructive" : "default", p = c == null || c === "";
-	return /* @__PURE__ */ s(t, {
+function m({ className: t, variant: r = "default", size: i, icon: o, children: s, ...l }) {
+	let u = a(d), f = r === "ghost" ? "ghost" : r === "secondary" ? "secondary" : u.variant === "error" ? "destructive" : "default", p = s == null || s === "";
+	return /* @__PURE__ */ c(n, {
 		variant: f,
-		size: a ?? (p ? "icon" : d.size === "sm" ? "sm" : "default"),
+		size: i ?? (p ? "icon" : u.size === "sm" ? "sm" : "default"),
 		icon: o,
-		className: e(p && "size-8", n),
+		className: e(p && "size-8", t),
 		...l,
-		children: c
+		children: s
 	});
 }
-p.displayName = "Banner.Action";
-var m = Object.assign(f, { Action: p });
+m.displayName = "Banner.Action";
+var h = Object.assign(p, { Action: m });
 //#endregion
-export { m as Banner, p as BannerAction };
+export { h as Banner, m as BannerAction };
 
 //# sourceMappingURL=banner.js.map

package/dist/components/banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"banner.js","names":[],"sources":["../../src/components/banner.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport { Children, createContext, type HTMLAttributes, type ReactNode, useContext } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { Button, type ButtonProps } from \"./button\";\n\nconst bannerVariants = cva(\"flex w-full items-start gap-3 rounded-basalt-md text-sm\", {\n\tvariants: {\n\t\tvariant: {\n\t\t\tdefault: \"bg-basalt-info-tint text-basalt-info\",\n\t\t\talert: \"bg-basalt-warning-tint text-basalt-warning\",\n\t\t\terror: \"bg-basalt-danger-tint text-basalt-danger\",\n\t\t\tsecondary: \"bg-basalt-muted text-basalt-foreground\",\n\t\t},\n\t\tsize: {\n\t\t\tbase: \"px-4 py-3\",\n\t\t\tsm: \"px-3 py-2\",\n\t\t},\n\t},\n\tdefaultVariants: { variant: \"default\", size: \"base\" },\n});\n\ntype BannerVariant = NonNullable<VariantProps<typeof bannerVariants>[\"variant\"]>;\ntype BannerSize = NonNullable<VariantProps<typeof bannerVariants>[\"size\"]>;\n\nconst BannerContext = createContext<{ variant: BannerVariant; size: BannerSize }>({\n\tvariant: \"default\",\n\tsize: \"base\",\n});\n\nexport interface BannerProps\n\textends HTMLAttributes<HTMLDivElement>,\n\t\tVariantProps<typeof bannerVariants> {\n\ttitle?: string;\n\tdescription?: ReactNode;\n\ticon?: ReactNode;\n\taction?: ReactNode;\n}\n\nfunction isBannerAction(node: ReactNode): boolean {\n\treturn (\n\t\ttypeof node === \"object\" &&\n\t\tnode !== null &&\n\t\t\"type\" in node &&\n\t\t(node as { type: unknown }).type === BannerAction\n\t);\n}\n\nfunction BannerRoot({\n\tclassName,\n\tvariant = \"default\",\n\tsize = \"base\",\n\ttitle,\n\tdescription,\n\ticon,\n\taction,\n\tchildren,\n\t...props\n}: BannerProps) {\n\tconst resolvedVariant = variant ?? \"default\";\n\tconst resolvedSize = size ?? \"base\";\n\tconst structured = title != null || description != null;\n\tconst nodes = Children.toArray(action);\n\tconst ctas = nodes.filter(isBannerAction);\n\tconst other = nodes.filter((node) => !isBannerAction(node));\n\tconst trailing = resolvedSize === \"sm\" ? ctas : [...other, ...ctas];\n\tconst inlineActions = resolvedSize === \"sm\" ? other : [];\n\n\treturn (\n\t\t<BannerContext.Provider value={{ variant: resolvedVariant, size: resolvedSize }}>\n\t\t\t<div\n\t\t\t\tclassName={cn(bannerVariants({ variant: resolvedVariant, size: resolvedSize }), className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{icon ? <span className=\"mt-0.5 inline-flex shrink-0 [&_svg]:size-5\">{icon}</span> : null}\n\t\t\t\t<div className=\"min-w-0 flex-1 space-y-0.5\">\n\t\t\t\t\t{title ? <p className=\"font-medium\">{title}</p> : null}\n\t\t\t\t\t{description ? (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\tresolvedVariant === \"secondary\" ? \"text-basalt-muted-foreground\" : \"text-current\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{description}\n\t\t\t\t\t\t\t{inlineActions.length > 0 ? <> {inlineActions}</> : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : inlineActions.length > 0 ? (\n\t\t\t\t\t\t<div>{inlineActions}</div>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{structured ? null : children}\n\t\t\t\t</div>\n\t\t\t\t{trailing.length > 0 ? (\n\t\t\t\t\t<div className=\"flex shrink-0 items-center gap-2\">{trailing}</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t</BannerContext.Provider>\n\t);\n}\n\nexport function BannerAction({\n\tclassName,\n\tvariant = \"default\",\n\tsize,\n\ticon,\n\tchildren,\n\t...props\n}: ButtonProps) {\n\tconst banner = useContext(BannerContext);\n\tconst mapped =\n\t\tvariant === \"ghost\"\n\t\t\t? \"ghost\"\n\t\t\t: variant === \"secondary\"\n\t\t\t\t? \"secondary\"\n\t\t\t\t: banner.variant === \"error\"\n\t\t\t\t\t? \"destructive\"\n\t\t\t\t\t: \"default\";\n\tconst iconOnly = children == null || children === \"\";\n\treturn (\n\t\t<Button\n\t\t\tvariant={mapped}\n\t\t\tsize={size ?? (iconOnly ? \"icon\" : banner.size === \"sm\" ? \"sm\" : \"default\")}\n\t\t\ticon={icon}\n\t\t\tclassName={cn(iconOnly && \"size-8\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Button>\n\t);\n}\nBannerAction.displayName = \"Banner.Action\";\n\nexport const Banner = Object.assign(BannerRoot, { Action: BannerAction });\n"],"mappings":";;;;;;;AAKA,IAAM,IAAiB,EAAI,2DAA2D;CACrF,UAAU;EACT,SAAS;GACR,SAAS;GACT,OAAO;GACP,OAAO;GACP,WAAW;EACZ;EACA,MAAM;GACL,MAAM;GACN,IAAI;EACL;CACD;CACA,iBAAiB;EAAE,SAAS;EAAW,MAAM;CAAO;AACrD,CAAC,GAKK,IAAgB,EAA4D;CACjF,SAAS;CACT,MAAM;AACP,CAAC;AAWD,SAAS,EAAe,GAA0B;CACjD,OACC,OAAO,KAAS,cAChB,KACA,UAAU,KACT,EAA2B,SAAS;AAEvC;AAEA,SAAS,EAAW,EACnB,cACA,aAAU,WACV,UAAO,QACP,UACA,gBACA,SACA,WACA,aACA,GAAG,KACY;CACf,IAAM,IAAkB,KAAW,WAC7B,IAAe,KAAQ,QACvB,IAAa,KAAS,QAAQ,KAAe,MAC7C,IAAQ,EAAS,QAAQ,CAAM,GAC/B,IAAO,EAAM,OAAO,CAAc,GAClC,IAAQ,EAAM,QAAQ,MAAS,CAAC,EAAe,CAAI,CAAC,GACpD,IAAW,MAAiB,OAAO,IAAO,CAAC,GAAG,GAAO,GAAG,CAAI,GAC5D,IAAgB,MAAiB,OAAO,IAAQ,CAAC;CAEvD,OACC,kBAAC,EAAc,UAAf;EAAwB,OAAO;GAAE,SAAS;GAAiB,MAAM;EAAa;EAC7E,UAAA,kBAAC,OAAD;GACC,WAAW,EAAG,EAAe;IAAE,SAAS;IAAiB,MAAM;GAAa,CAAC,GAAG,CAAS;GACzF,GAAI;GAFL,UAAA;IAIE,IAAO,kBAAC,QAAD;KAAM,WAAU;KAA8C,UAAA;IAAW,CAAA,IAAI;IACrF,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA;MACE,IAAQ,kBAAC,KAAD;OAAG,WAAU;OAAe,UAAA;MAAS,CAAA,IAAI;MACjD,IACA,kBAAC,OAAD;OACC,WAAW,EACV,MAAoB,cAAc,iCAAiC,cACpE;OAHD,UAAA,CAKE,GACA,EAAc,SAAS,IAAI,kBAAA,GAAA,EAAA,UAAA,CAAE,KAAE,CAAgB,EAAA,CAAA,IAAI,IAChD;MACF,CAAA,IAAA,EAAc,SAAS,IAC1B,kBAAC,OAAD,EAAA,UAAM,EAAmB,CAAA,IACtB;MACH,IAAa,OAAO;KACjB;;IACJ,EAAS,SAAS,IAClB,kBAAC,OAAD;KAAK,WAAU;KAAoC,UAAA;IAAc,CAAA,IAC9D;GACA;;CACkB,CAAA;AAE1B;AAEA,SAAgB,EAAa,EAC5B,cACA,aAAU,WACV,SACA,SACA,aACA,GAAG,KACY;CACf,IAAM,IAAS,EAAW,CAAa,GACjC,IACL,MAAY,UACT,UACA,MAAY,cACX,cACA,EAAO,YAAY,UAClB,gBACA,WACA,IAAW,KAAY,QAAQ,MAAa;CAClD,OACC,kBAAC,GAAD;EACC,SAAS;EACT,MAAM,MAAS,IAAW,SAAS,EAAO,SAAS,OAAO,OAAO;EAC3D;EACN,WAAW,EAAG,KAAY,UAAU,CAAS;EAC7C,GAAI;EAEH;CACM,CAAA;AAEV;AACA,EAAa,cAAc;AAE3B,IAAa,IAAS,OAAO,OAAO,GAAY,EAAE,QAAQ,EAAa,CAAC"}
+{"version":3,"file":"banner.js","names":[],"sources":["../../src/components/banner.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport { Children, createContext, type HTMLAttributes, type ReactNode, useContext } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { Button, type ButtonProps } from \"./button\";\n\nconst bannerVariants = cva(\"flex w-full items-start gap-3 rounded-basalt-md text-sm\", {\n\tvariants: {\n\t\tvariant: {\n\t\t\tdefault: \"bg-basalt-info-tint text-basalt-info\",\n\t\t\talert: \"bg-basalt-warning-tint text-basalt-warning\",\n\t\t\terror: \"bg-basalt-danger-tint text-basalt-danger\",\n\t\t\tsecondary: \"bg-basalt-muted text-basalt-foreground\",\n\t\t},\n\t\tsize: {\n\t\t\tbase: \"px-4 py-3\",\n\t\t\tsm: \"px-3 py-2\",\n\t\t},\n\t},\n\tdefaultVariants: { variant: \"default\", size: \"base\" },\n});\n\ntype BannerVariant = NonNullable<VariantProps<typeof bannerVariants>[\"variant\"]>;\ntype BannerSize = NonNullable<VariantProps<typeof bannerVariants>[\"size\"]>;\n\nconst BannerContext = createContext<{ variant: BannerVariant; size: BannerSize }>({\n\tvariant: \"default\",\n\tsize: \"base\",\n});\n\nexport interface BannerProps\n\textends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"children\">,\n\t\tOmit<VariantProps<typeof bannerVariants>, \"variant\" | \"size\"> {\n\t/**\n\t * Visual tone variant of the banner.\n\t *\n\t * Note: Defaults to \"default\" (informational). Passing null falls back to \"default\".\n\t *\n\t * @default \"default\"\n\t */\n\tvariant?: VariantProps<typeof bannerVariants>[\"variant\"];\n\n\t/**\n\t * Sizing preset controlling padding geometry and action placement.\n\t *\n\t * Note: Defaults to \"base\". In compact mode (\"sm\"), only direct `<Banner.Action>` elements\n\t * are placed in the trailing slot, while other action content renders inline next to the description.\n\t * Passing null falls back to \"base\".\n\t *\n\t * @default \"base\"\n\t */\n\tsize?: VariantProps<typeof bannerVariants>[\"size\"];\n\n\t/**\n\t * Primary heading text.\n\t *\n\t * Note: When present (or when description is present), structured mode is enabled\n\t * and standard children are not rendered.\n\t */\n\ttitle?: string;\n\n\t/**\n\t * Secondary copy rendered below the title.\n\t */\n\tdescription?: ReactNode;\n\n\t/**\n\t * Visual icon rendered before the banner content.\n\t */\n\ticon?: ReactNode;\n\n\t/**\n\t * Trailing or inline call-to-action slot.\n\t * Pass `<Banner.Action>` elements for contextual styling.\n\t * In compact mode (\"sm\"), only direct `<Banner.Action>` elements are placed in the trailing slot,\n\t * while other action content renders inline next to the description.\n\t */\n\taction?: ReactNode;\n\n\t/**\n\t * Unstructured child content rendered only when both title and description are null or undefined.\n\t * When title or description is non-null/non-undefined (including empty string or false),\n\t * structured mode is active and children are ignored.\n\t */\n\tchildren?: HTMLAttributes<HTMLDivElement>[\"children\"];\n}\n\nexport interface BannerActionProps\n\textends Omit<\n\t\tButtonProps,\n\t\t\"variant\" | \"size\" | \"asChild\" | \"type\" | \"loading\" | \"icon\" | \"children\"\n\t> {\n\t/**\n\t * Visual style variant. Preserves \"ghost\" and \"secondary\"; all other values\n\t * are mapped contextually to \"destructive\" (when parent Banner variant is \"error\")\n\t * or \"default\".\n\t *\n\t * Note: Ordinary function component without forwarded ref.\n\t *\n\t * @default \"default\"\n\t */\n\tvariant?: ButtonProps[\"variant\"];\n\n\t/**\n\t * Sizing preset. When unspecified or null, resolves to \"icon\" if children are omitted,\n\t * null, or an empty string, \"sm\" when parent Banner is compact (\"sm\"), or \"default\" otherwise.\n\t * When iconOnly mode is resolved, an additional \"size-8\" class is attached.\n\t */\n\tsize?: ButtonProps[\"size\"];\n\n\t/**\n\t * Pass control to child element slot.\n\t *\n\t * @default false\n\t */\n\tasChild?: ButtonProps[\"asChild\"];\n\n\t/**\n\t * Button type attribute.\n\t *\n\t * @default \"button\"\n\t */\n\ttype?: ButtonProps[\"type\"];\n\n\t/**\n\t * Display loading spinner and disable interactions.\n\t *\n\t * @default false\n\t */\n\tloading?: ButtonProps[\"loading\"];\n\n\t/**\n\t * Optional leading icon slot.\n\t */\n\ticon?: ButtonProps[\"icon\"];\n\n\t/**\n\t * Action label content. When null, undefined, or empty string, enables iconOnly sizing mode.\n\t */\n\tchildren?: ButtonProps[\"children\"];\n}\n\nfunction isBannerAction(node: ReactNode): boolean {\n\treturn (\n\t\ttypeof node === \"object\" &&\n\t\tnode !== null &&\n\t\t\"type\" in node &&\n\t\t(node as { type: unknown }).type === BannerAction\n\t);\n}\n\nfunction BannerRoot({\n\tclassName,\n\tvariant = \"default\",\n\tsize = \"base\",\n\ttitle,\n\tdescription,\n\ticon,\n\taction,\n\tchildren,\n\t...props\n}: BannerProps) {\n\tconst resolvedVariant = variant ?? \"default\";\n\tconst resolvedSize = size ?? \"base\";\n\tconst structured = title != null || description != null;\n\tconst nodes = Children.toArray(action);\n\tconst ctas = nodes.filter(isBannerAction);\n\tconst other = nodes.filter((node) => !isBannerAction(node));\n\tconst trailing = resolvedSize === \"sm\" ? ctas : [...other, ...ctas];\n\tconst inlineActions = resolvedSize === \"sm\" ? other : [];\n\n\treturn (\n\t\t<BannerContext.Provider value={{ variant: resolvedVariant, size: resolvedSize }}>\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\tbannerVariants({ variant: resolvedVariant, size: resolvedSize }),\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{icon ? <span className=\"mt-0.5 inline-flex shrink-0 [&_svg]:size-5\">{icon}</span> : null}\n\t\t\t\t<div className=\"min-w-0 flex-1 space-y-0.5\">\n\t\t\t\t\t{title ? <p className=\"font-medium\">{title}</p> : null}\n\t\t\t\t\t{description ? (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\tresolvedVariant === \"secondary\" ? \"text-basalt-muted-foreground\" : \"text-current\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{description}\n\t\t\t\t\t\t\t{inlineActions.length > 0 ? <> {inlineActions}</> : null}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : inlineActions.length > 0 ? (\n\t\t\t\t\t\t<div>{inlineActions}</div>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{structured ? null : children}\n\t\t\t\t</div>\n\t\t\t\t{trailing.length > 0 ? (\n\t\t\t\t\t<div className=\"flex shrink-0 items-center gap-2\">{trailing}</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t</BannerContext.Provider>\n\t);\n}\n\nexport function BannerAction({\n\tclassName,\n\tvariant = \"default\",\n\tsize,\n\ticon,\n\tchildren,\n\t...props\n}: BannerActionProps) {\n\tconst banner = useContext(BannerContext);\n\tconst mapped =\n\t\tvariant === \"ghost\"\n\t\t\t? \"ghost\"\n\t\t\t: variant === \"secondary\"\n\t\t\t\t? \"secondary\"\n\t\t\t\t: banner.variant === \"error\"\n\t\t\t\t\t? \"destructive\"\n\t\t\t\t\t: \"default\";\n\tconst iconOnly = children == null || children === \"\";\n\treturn (\n\t\t<Button\n\t\t\tvariant={mapped}\n\t\t\tsize={size ?? (iconOnly ? \"icon\" : banner.size === \"sm\" ? \"sm\" : \"default\")}\n\t\t\ticon={icon}\n\t\t\tclassName={cn(iconOnly && \"size-8\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Button>\n\t);\n}\nBannerAction.displayName = \"Banner.Action\";\n\nexport const Banner = Object.assign(BannerRoot, { Action: BannerAction });\n"],"mappings":";;;;;;;;AAMA,IAAM,IAAiB,EAAI,2DAA2D;CACrF,UAAU;EACT,SAAS;GACR,SAAS;GACT,OAAO;GACP,OAAO;GACP,WAAW;EACZ;EACA,MAAM;GACL,MAAM;GACN,IAAI;EACL;CACD;CACA,iBAAiB;EAAE,SAAS;EAAW,MAAM;CAAO;AACrD,CAAC,GAKK,IAAgB,EAA4D;CACjF,SAAS;CACT,MAAM;AACP,CAAC;AAkHD,SAAS,EAAe,GAA0B;CACjD,OACC,OAAO,KAAS,cAChB,KACA,UAAU,KACT,EAA2B,SAAS;AAEvC;AAEA,SAAS,EAAW,EACnB,cACA,aAAU,WACV,UAAO,QACP,UACA,gBACA,SACA,WACA,aACA,GAAG,KACY;CACf,IAAM,IAAkB,KAAW,WAC7B,IAAe,KAAQ,QACvB,IAAa,KAAS,QAAQ,KAAe,MAC7C,IAAQ,EAAS,QAAQ,CAAM,GAC/B,IAAO,EAAM,OAAO,CAAc,GAClC,IAAQ,EAAM,QAAQ,MAAS,CAAC,EAAe,CAAI,CAAC,GACpD,IAAW,MAAiB,OAAO,IAAO,CAAC,GAAG,GAAO,GAAG,CAAI,GAC5D,IAAgB,MAAiB,OAAO,IAAQ,CAAC;CAEvD,OACC,kBAAC,EAAc,UAAf;EAAwB,OAAO;GAAE,SAAS;GAAiB,MAAM;EAAa;EAC7E,UAAA,kBAAC,OAAD;GACC,WAAW,EACV,GACA,EAAe;IAAE,SAAS;IAAiB,MAAM;GAAa,CAAC,GAC/D,CACD;GACA,GAAI;GANL,UAAA;IAQE,IAAO,kBAAC,QAAD;KAAM,WAAU;KAA8C,UAAA;IAAW,CAAA,IAAI;IACrF,kBAAC,OAAD;KAAK,WAAU;KAAf,UAAA;MACE,IAAQ,kBAAC,KAAD;OAAG,WAAU;OAAe,UAAA;MAAS,CAAA,IAAI;MACjD,IACA,kBAAC,OAAD;OACC,WAAW,EACV,MAAoB,cAAc,iCAAiC,cACpE;OAHD,UAAA,CAKE,GACA,EAAc,SAAS,IAAI,kBAAA,GAAA,EAAA,UAAA,CAAE,KAAE,CAAgB,EAAA,CAAA,IAAI,IAChD;MACF,CAAA,IAAA,EAAc,SAAS,IAC1B,kBAAC,OAAD,EAAA,UAAM,EAAmB,CAAA,IACtB;MACH,IAAa,OAAO;KACjB;;IACJ,EAAS,SAAS,IAClB,kBAAC,OAAD;KAAK,WAAU;KAAoC,UAAA;IAAc,CAAA,IAC9D;GACA;;CACkB,CAAA;AAE1B;AAEA,SAAgB,EAAa,EAC5B,cACA,aAAU,WACV,SACA,SACA,aACA,GAAG,KACkB;CACrB,IAAM,IAAS,EAAW,CAAa,GACjC,IACL,MAAY,UACT,UACA,MAAY,cACX,cACA,EAAO,YAAY,UAClB,gBACA,WACA,IAAW,KAAY,QAAQ,MAAa;CAClD,OACC,kBAAC,GAAD;EACC,SAAS;EACT,MAAM,MAAS,IAAW,SAAS,EAAO,SAAS,OAAO,OAAO;EAC3D;EACN,WAAW,EAAG,KAAY,UAAU,CAAS;EAC7C,GAAI;EAEH;CACM,CAAA;AAEV;AACA,EAAa,cAAc;AAE3B,IAAa,IAAS,OAAO,OAAO,GAAY,EAAE,QAAQ,EAAa,CAAC"}

package/dist/components/basalt-mark.js

@@ -1,17 +1,23 @@
 "use client";
 import { cn as e } from "../utils/cn.js";
-import { Mountain as t } from "lucide-react";
-import { jsx as n } from "react/jsx-runtime";
+import { basaltMarkPng as t } from "../assets/brand-mark.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/basalt-mark.tsx
-function r({ className: r, ...i }) {
-	return /* @__PURE__ */ n(t, {
-		className: e("h-5 w-5 text-basalt-primary", r),
-		strokeWidth: 1.5,
+function i({ className: i, ...a }) {
+	return /* @__PURE__ */ r("svg", {
+		className: e("h-5 w-5", i),
+		viewBox: "0 0 128 128",
+		role: "img",
 		"aria-label": "Basalt",
-		...i
+		...a,
+		children: [/* @__PURE__ */ n("title", { children: "Basalt" }), /* @__PURE__ */ n("image", {
+			href: t,
+			width: "128",
+			height: "128"
+		})]
 	});
 }
 //#endregion
-export { r as BasaltMark };
+export { i as BasaltMark };
 
 //# sourceMappingURL=basalt-mark.js.map

package/dist/components/basalt-mark.js.map

@@ -1 +1 @@
-{"version":3,"file":"basalt-mark.js","names":[],"sources":["../../src/components/basalt-mark.tsx"],"sourcesContent":["import { Mountain } from \"lucide-react\";\nimport type { SVGAttributes } from \"react\";\nimport { cn } from \"../utils/cn\";\n\nexport type BasaltMarkProps = Omit<SVGAttributes<SVGSVGElement>, \"className\"> & {\n\t/**\n\t * Additional classes for the mark.\n\t */\n\tclassName?: string;\n};\n\nexport function BasaltMark({ className, ...props }: BasaltMarkProps) {\n\treturn (\n\t\t<Mountain\n\t\t\tclassName={cn(\"h-5 w-5 text-basalt-primary\", className)}\n\t\t\tstrokeWidth={1.5}\n\t\t\taria-label=\"Basalt\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;AAWA,SAAgB,EAAW,EAAE,cAAW,GAAG,KAA0B;CACpE,OACC,kBAAC,GAAD;EACC,WAAW,EAAG,+BAA+B,CAAS;EACtD,aAAa;EACb,cAAW;EACX,GAAI;CACJ,CAAA;AAEH"}
+{"version":3,"file":"basalt-mark.js","names":[],"sources":["../../src/components/basalt-mark.tsx"],"sourcesContent":["import type { SVGAttributes } from \"react\";\nimport { basaltMarkPng } from \"../assets/brand-mark\";\nimport { cn } from \"../utils/cn\";\n\nexport type BasaltMarkProps = Omit<SVGAttributes<SVGSVGElement>, \"className\"> & {\n\t/**\n\t * Additional classes for the mark.\n\t */\n\tclassName?: string;\n};\n\nexport function BasaltMark({ className, ...props }: BasaltMarkProps) {\n\treturn (\n\t\t<svg\n\t\t\tclassName={cn(\"h-5 w-5\", className)}\n\t\t\tviewBox=\"0 0 128 128\"\n\t\t\trole=\"img\"\n\t\t\taria-label=\"Basalt\"\n\t\t\t{...props}\n\t\t>\n\t\t\t<title>Basalt</title>\n\t\t\t<image href={basaltMarkPng} width=\"128\" height=\"128\" />\n\t\t</svg>\n\t);\n}\n"],"mappings":";;;;;AAWA,SAAgB,EAAW,EAAE,cAAW,GAAG,KAA0B;CACpE,OACC,kBAAC,OAAD;EACC,WAAW,EAAG,WAAW,CAAS;EAClC,SAAQ;EACR,MAAK;EACL,cAAW;EACX,GAAI;EALL,UAAA,CAOC,kBAAC,SAAD,EAAA,UAAO,SAAa,CAAA,GACpB,kBAAC,SAAD;GAAO,MAAM;GAAe,OAAM;GAAM,QAAO;EAAO,CAAA,CAClD;;AAEP"}

package/dist/components/battery-meter.d.ts

@@ -0,0 +1,10 @@
+import type { HTMLAttributes } from "react";
+export interface BatteryMeterProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    /** Battery charge in percent, clamped to 0–100. Non-finite readings are unavailable. */
+    value: number;
+    /** Accessible name of the battery. */
+    label: string;
+    /** Device state, also announced with the value. @default "discharging" */
+    status?: "charging" | "discharging" | "offline";
+}
+export declare function BatteryMeter({ value, label, status, className, ...props }: BatteryMeterProps): import("react").JSX.Element;

package/dist/components/battery-meter.js

@@ -0,0 +1,56 @@
+"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, jsxs as r } from "react/jsx-runtime";
+//#region src/components/battery-meter.tsx
+function i({ value: i, label: a, status: o = "discharging", className: s, ...c }) {
+	let l = o !== "offline" && Number.isFinite(i), u = l ? Math.min(100, Math.max(0, i)) : 0, d = u <= 20 ? "bg-basalt-danger" : u <= 50 ? "bg-basalt-warning" : "bg-basalt-primary";
+	return /* @__PURE__ */ r("div", {
+		className: e(t, "inline-flex items-center gap-2 text-xs tabular-nums", s),
+		...c,
+		children: [
+			l ? /* @__PURE__ */ n("meter", {
+				className: "sr-only",
+				min: 0,
+				max: 100,
+				low: 20,
+				high: 80,
+				optimum: 100,
+				value: u,
+				"aria-label": `${a}, ${o}`
+			}) : /* @__PURE__ */ r("span", {
+				className: "sr-only",
+				children: [a, ": unavailable"]
+			}),
+			/* @__PURE__ */ r("span", {
+				"aria-hidden": "true",
+				className: "relative inline-flex h-4 w-9 gap-0.5 rounded-sm border border-basalt-muted-foreground/60 p-0.5",
+				children: [[
+					0,
+					1,
+					2,
+					3
+				].map((t) => /* @__PURE__ */ n("span", {
+					className: "relative flex-1 overflow-hidden rounded-[1px] bg-basalt-muted",
+					children: /* @__PURE__ */ n("span", {
+						className: e("absolute inset-y-0 left-0", d),
+						style: { width: `${Math.min(100, Math.max(0, u - t * 25) * 4)}%` }
+					})
+				}, t)), /* @__PURE__ */ n("span", { className: "absolute -right-1 top-1 h-1.5 w-0.5 rounded-r-sm bg-basalt-muted-foreground/60" })]
+			}),
+			/* @__PURE__ */ n("span", {
+				"aria-hidden": "true",
+				className: "min-w-9 text-basalt-foreground",
+				children: l ? `${Math.round(u)}%` : "Offline"
+			}),
+			o === "charging" && l ? /* @__PURE__ */ n("span", {
+				className: "text-basalt-muted-foreground",
+				children: "Charging"
+			}) : null
+		]
+	});
+}
+//#endregion
+export { i as BatteryMeter };
+
+//# sourceMappingURL=battery-meter.js.map

package/dist/components/battery-meter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"battery-meter.js","names":[],"sources":["../../src/components/battery-meter.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport interface BatteryMeterProps extends Omit<HTMLAttributes<HTMLDivElement>, \"children\"> {\n\t/** Battery charge in percent, clamped to 0–100. Non-finite readings are unavailable. */\n\tvalue: number;\n\t/** Accessible name of the battery. */\n\tlabel: string;\n\t/** Device state, also announced with the value. @default \"discharging\" */\n\tstatus?: \"charging\" | \"discharging\" | \"offline\";\n}\n\nexport function BatteryMeter({\n\tvalue,\n\tlabel,\n\tstatus = \"discharging\",\n\tclassName,\n\t...props\n}: BatteryMeterProps) {\n\tconst available = status !== \"offline\" && Number.isFinite(value);\n\tconst charge = available ? Math.min(100, Math.max(0, value)) : 0;\n\tconst color =\n\t\tcharge <= 20 ? \"bg-basalt-danger\" : charge <= 50 ? \"bg-basalt-warning\" : \"bg-basalt-primary\";\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex items-center gap-2 text-xs tabular-nums\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{available ? (\n\t\t\t\t<meter\n\t\t\t\t\tclassName=\"sr-only\"\n\t\t\t\t\tmin={0}\n\t\t\t\t\tmax={100}\n\t\t\t\t\tlow={20}\n\t\t\t\t\thigh={80}\n\t\t\t\t\toptimum={100}\n\t\t\t\t\tvalue={charge}\n\t\t\t\t\taria-label={`${label}, ${status}`}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<span className=\"sr-only\">{label}: unavailable</span>\n\t\t\t)}\n\t\t\t<span\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tclassName=\"relative inline-flex h-4 w-9 gap-0.5 rounded-sm border border-basalt-muted-foreground/60 p-0.5\"\n\t\t\t>\n\t\t\t\t{[0, 1, 2, 3].map((segment) => (\n\t\t\t\t\t<span\n\t\t\t\t\t\tkey={segment}\n\t\t\t\t\t\tclassName=\"relative flex-1 overflow-hidden rounded-[1px] bg-basalt-muted\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cn(\"absolute inset-y-0 left-0\", color)}\n\t\t\t\t\t\t\tstyle={{ width: `${Math.min(100, Math.max(0, charge - segment * 25) * 4)}%` }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t\t<span className=\"absolute -right-1 top-1 h-1.5 w-0.5 rounded-r-sm bg-basalt-muted-foreground/60\" />\n\t\t\t</span>\n\t\t\t<span aria-hidden=\"true\" className=\"min-w-9 text-basalt-foreground\">\n\t\t\t\t{available ? `${Math.round(charge)}%` : \"Offline\"}\n\t\t\t</span>\n\t\t\t{status === \"charging\" && available ? (\n\t\t\t\t<span className=\"text-basalt-muted-foreground\">Charging</span>\n\t\t\t) : null}\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;AAaA,SAAgB,EAAa,EAC5B,UACA,UACA,YAAS,eACT,cACA,GAAG,KACkB;CACrB,IAAM,IAAY,MAAW,aAAa,OAAO,SAAS,CAAK,GACzD,IAAS,IAAY,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,CAAK,CAAC,IAAI,GACzD,IACL,KAAU,KAAK,qBAAqB,KAAU,KAAK,sBAAsB;CAC1E,OACC,kBAAC,OAAD;EACC,WAAW,EACV,GACA,uDACA,CACD;EACA,GAAI;EANL,UAAA;GAQE,IACA,kBAAC,SAAD;IACC,WAAU;IACV,KAAK;IACL,KAAK;IACL,KAAK;IACL,MAAM;IACN,SAAS;IACT,OAAO;IACP,cAAY,GAAG,EAAM,IAAI;GACzB,CAAA,IAED,kBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA,CAA2B,GAAM,eAAmB;;GAErD,kBAAC,QAAD;IACC,eAAY;IACZ,WAAU;IAFX,UAAA,CAIE;KAAC;KAAG;KAAG;KAAG;IAAC,CAAC,CAAC,KAAK,MAClB,kBAAC,QAAD;KAEC,WAAU;KAEV,UAAA,kBAAC,QAAD;MACC,WAAW,EAAG,6BAA6B,CAAK;MAChD,OAAO,EAAE,OAAO,GAAG,KAAK,IAAI,KAAK,KAAK,IAAI,GAAG,IAAS,IAAU,EAAE,IAAI,CAAC,EAAE,GAAG;KAC5E,CAAA;IACI,GAPA,CAOA,CACN,GACD,kBAAC,QAAD,EAAM,WAAU,iFAAkF,CAAA,CAC7F;;GACN,kBAAC,QAAD;IAAM,eAAY;IAAO,WAAU;IACjC,UAAA,IAAY,GAAG,KAAK,MAAM,CAAM,EAAE,KAAK;GACnC,CAAA;GACL,MAAW,cAAc,IACzB,kBAAC,QAAD;IAAM,WAAU;IAA+B,UAAA;GAAc,CAAA,IAC1D;EACA;;AAEP"}