@elizaos/ui 2.0.0-beta.2 → 2.0.3-beta.3

package/components/settings/permission-types.js

@@ -16,7 +16,7 @@ export const SYSTEM_PERMISSIONS = [
         description: "Capture screen content for screenshots and vision",
         descriptionKey: "permissionssection.permission.screenRecording.description",
         icon: "monitor",
-        platforms: ["darwin"],
+        platforms: ["darwin", "ios", "android", "web"],
         requiredForFeatures: ["computeruse", "vision"],
     },
     {
@@ -36,7 +36,7 @@ export const SYSTEM_PERMISSIONS = [
         description: "Video input for vision and video capture",
         descriptionKey: "permissionssection.permission.camera.description",
         icon: "camera",
-        platforms: ["darwin", "win32", "linux"],
+        platforms: ["darwin", "win32", "linux", "ios", "android", "web"],
         requiredForFeatures: ["camera", "vision"],
     },
     {
@@ -46,7 +46,7 @@ export const SYSTEM_PERMISSIONS = [
         description: "Execute terminal commands and scripts",
         descriptionKey: "permissionssection.permission.shell.description",
         icon: "terminal",
-        platforms: ["darwin", "win32", "linux"],
+        platforms: ["darwin", "win32", "linux", "ios", "android", "web"],
         requiredForFeatures: ["shell"],
     },
     {
@@ -56,7 +56,7 @@ export const SYSTEM_PERMISSIONS = [
         description: "Edit the system hosts file to block distracting websites. This may require admin/root approval each time.",
         descriptionKey: "permissionssection.permission.websiteBlocking.description",
         icon: "shield-ban",
-        platforms: ["darwin", "win32", "linux"],
+        platforms: ["darwin", "win32", "linux", "ios", "android", "web"],
         requiredForFeatures: ["website-blocker"],
     },
     {
@@ -73,21 +73,21 @@ export const SYSTEM_PERMISSIONS = [
         id: "reminders",
         name: "Apple Reminders",
         nameKey: "permissionssection.permission.reminders.name",
-        description: "Create and read reminders for LifeOps tasks and follow-ups",
+        description: "Create and update Apple Reminders for LifeOps tasks",
         descriptionKey: "permissionssection.permission.reminders.description",
         icon: "list-todo",
         platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "reminders"],
+        requiredForFeatures: ["reminders"],
     },
     {
         id: "calendar",
         name: "Apple Calendar",
         nameKey: "permissionssection.permission.calendar.name",
-        description: "Read and write calendar events for scheduling",
+        description: "Read and update Apple Calendar events for LifeOps scheduling",
         descriptionKey: "permissionssection.permission.calendar.description",
         icon: "calendar",
-        platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "calendar"],
+        platforms: ["darwin", "ios"],
+        requiredForFeatures: ["calendar"],
     },
     {
         id: "health",
@@ -96,8 +96,8 @@ export const SYSTEM_PERMISSIONS = [
         description: "Read HealthKit data, including sleep from paired devices",
         descriptionKey: "permissionssection.permission.health.description",
         icon: "heart-pulse",
-        platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "health", "sleep"],
+        platforms: ["darwin", "ios", "android"],
+        requiredForFeatures: ["health", "sleep"],
     },
     {
         id: "screentime",
@@ -106,18 +106,18 @@ export const SYSTEM_PERMISSIONS = [
         description: "Read app and device usage signals for LifeOps",
         descriptionKey: "permissionssection.permission.screentime.description",
         icon: "hourglass",
-        platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "screentime"],
+        platforms: ["darwin", "ios", "android"],
+        requiredForFeatures: ["screentime"],
     },
     {
         id: "contacts",
         name: "Contacts",
         nameKey: "permissionssection.permission.contacts.name",
-        description: "Read contacts for person-aware reminders and follow-ups",
+        description: "Read and edit Apple Contacts for message name resolution",
         descriptionKey: "permissionssection.permission.contacts.description",
         icon: "contact",
-        platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "contacts"],
+        platforms: ["darwin", "ios", "android"],
+        requiredForFeatures: ["imessage", "contacts"],
     },
     {
         id: "notes",
@@ -127,7 +127,7 @@ export const SYSTEM_PERMISSIONS = [
         descriptionKey: "permissionssection.permission.notes.description",
         icon: "notebook-tabs",
         platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "notes"],
+        requiredForFeatures: ["notes"],
     },
     {
         id: "notifications",
@@ -136,8 +136,8 @@ export const SYSTEM_PERMISSIONS = [
         description: "Show system notifications for reminders and background results",
         descriptionKey: "permissionssection.permission.notifications.description",
         icon: "bell",
-        platforms: ["darwin", "win32", "linux"],
-        requiredForFeatures: ["notifications", "lifeops"],
+        platforms: ["darwin", "win32", "linux", "ios", "android", "web"],
+        requiredForFeatures: ["notifications"],
     },
     {
         id: "full-disk",
@@ -157,7 +157,127 @@ export const SYSTEM_PERMISSIONS = [
         descriptionKey: "permissionssection.permission.automation.description",
         icon: "workflow",
         platforms: ["darwin"],
-        requiredForFeatures: ["lifeops", "automation"],
+        requiredForFeatures: ["messages", "notes", "automation"],
+    },
+    {
+        id: "speech-recognition",
+        name: "Speech Recognition",
+        nameKey: "permissionssection.permission.speechRecognition.name",
+        description: "Transcribe speech through the platform speech recognizer",
+        descriptionKey: "permissionssection.permission.speechRecognition.description",
+        icon: "audio-lines",
+        platforms: ["ios", "web"],
+        requiredForFeatures: ["talkmode", "voice", "swabble"],
+    },
+    {
+        id: "photos",
+        name: "Photos",
+        nameKey: "permissionssection.permission.photos.name",
+        description: "Read or save photos and videos when capturing media",
+        descriptionKey: "permissionssection.permission.photos.description",
+        icon: "image",
+        platforms: ["ios", "android", "web"],
+        requiredForFeatures: ["camera", "media"],
+    },
+    {
+        id: "phone",
+        name: "Phone",
+        nameKey: "permissionssection.permission.phone.name",
+        description: "Place calls and read recent call history on Android",
+        descriptionKey: "permissionssection.permission.phone.description",
+        icon: "phone",
+        platforms: ["android"],
+        requiredForFeatures: ["phone", "dialer"],
+    },
+    {
+        id: "messages",
+        name: "Messages",
+        nameKey: "permissionssection.permission.messages.name",
+        description: "Send SMS and read message threads on Android",
+        descriptionKey: "permissionssection.permission.messages.description",
+        icon: "message-square",
+        platforms: ["android"],
+        requiredForFeatures: ["messages", "sms"],
+    },
+    {
+        id: "wifi",
+        name: "Wi-Fi Scans",
+        nameKey: "permissionssection.permission.wifi.name",
+        description: "Scan nearby Wi-Fi networks; Android gates scan results behind Location",
+        descriptionKey: "permissionssection.permission.wifi.description",
+        icon: "wifi",
+        platforms: ["android"],
+        requiredForFeatures: ["wifi", "gateway"],
+    },
+    {
+        id: "bluetooth",
+        name: "Bluetooth",
+        nameKey: "permissionssection.permission.bluetooth.name",
+        description: "Discover and connect to nearby Bluetooth accessories",
+        descriptionKey: "permissionssection.permission.bluetooth.description",
+        icon: "bluetooth",
+        platforms: ["ios", "android"],
+        requiredForFeatures: ["facewear", "gateway"],
+    },
+    {
+        id: "app-blocking",
+        name: "App Blocking",
+        nameKey: "permissionssection.permission.appBlocking.name",
+        description: "Select and block distracting apps with Screen Time or Android usage controls",
+        descriptionKey: "permissionssection.permission.appBlocking.description",
+        icon: "shield-ban",
+        platforms: ["ios", "android"],
+        requiredForFeatures: ["app-blocker"],
+    },
+    {
+        id: "usage-access",
+        name: "Usage Access",
+        nameKey: "permissionssection.permission.usageAccess.name",
+        description: "Read Android app usage for Screen Time and app blocking",
+        descriptionKey: "permissionssection.permission.usageAccess.description",
+        icon: "hourglass",
+        platforms: ["android"],
+        requiredForFeatures: ["screentime", "app-blocker"],
+    },
+    {
+        id: "overlay",
+        name: "Draw Over Apps",
+        nameKey: "permissionssection.permission.overlay.name",
+        description: "Show Android blocking overlays above distracting apps",
+        descriptionKey: "permissionssection.permission.overlay.description",
+        icon: "app-window",
+        platforms: ["android"],
+        requiredForFeatures: ["app-blocker"],
+    },
+    {
+        id: "write-settings",
+        name: "Write Settings",
+        nameKey: "permissionssection.permission.writeSettings.name",
+        description: "Change Android system brightness and related device settings",
+        descriptionKey: "permissionssection.permission.writeSettings.description",
+        icon: "settings",
+        platforms: ["android"],
+        requiredForFeatures: ["device-settings"],
+    },
+    {
+        id: "local-network",
+        name: "Local Network",
+        nameKey: "permissionssection.permission.localNetwork.name",
+        description: "Discover nearby gateways and devices on the local network",
+        descriptionKey: "permissionssection.permission.localNetwork.description",
+        icon: "network",
+        platforms: ["ios", "android"],
+        requiredForFeatures: ["gateway", "device-discovery"],
+    },
+    {
+        id: "battery-optimization",
+        name: "Battery Optimization",
+        nameKey: "permissionssection.permission.batteryOptimization.name",
+        description: "Allow background monitoring to keep LifeOps and device signals current",
+        descriptionKey: "permissionssection.permission.batteryOptimization.description",
+        icon: "battery",
+        platforms: ["android"],
+        requiredForFeatures: ["mobile-signals"],
     },
 ];
 export const CAPABILITIES = [
@@ -222,7 +342,7 @@ export const PERMISSION_BADGE_LABELS = {
     },
 };
 /** Reusable settings-panel Tailwind class names. */
-export const SETTINGS_PANEL_CLASSNAME = "rounded-2xl border border-border/60 bg-bg/40 p-4 space-y-4";
+export const SETTINGS_PANEL_CLASSNAME = "rounded border border-border/60 bg-bg/40 p-4 space-y-4";
 export const SETTINGS_PANEL_HEADER_CLASSNAME = "flex flex-wrap items-start justify-between gap-3";
 export const SETTINGS_PANEL_ACTIONS_CLASSNAME = "flex items-center gap-2";
 export const SETTINGS_REFRESH_DELAYS_MS = [1500, 4000];
@@ -231,9 +351,17 @@ export function translateWithFallback(t, key, fallback) {
     return !value || value === key ? fallback : value;
 }
 export function getPermissionAction(t, id, status, canRequest, platform) {
-    if (status === "granted" || status === "not-applicable") {
+    if (status === "not-applicable") {
         return null;
     }
+    if (status === "granted" && id !== "shell") {
+        const label = translateWithFallback(t, "permissionssection.Manage", "Manage");
+        return {
+            ariaLabelPrefix: label,
+            label,
+            type: "settings",
+        };
+    }
     const usesWindowsPrivacySettings = platform === "win32" &&
         (id === "microphone" ||
             id === "camera" ||

package/components/settings/settings-agent-rows.d.ts

@@ -0,0 +1,120 @@
+import type { LucideIcon } from "lucide-react";
+import * as React from "react";
+import { type ButtonProps } from "../ui/button.js";
+import { type SettingsInputVariant } from "../ui/settings-controls.js";
+export interface SettingsSwitchRowProps {
+    /** Stable agent id, unique within the settings view (e.g. "toggle-dark"). */
+    agentId: string;
+    label: React.ReactNode;
+    /** What the user would say to target it (defaults to the label). */
+    agentLabel?: string;
+    description?: React.ReactNode;
+    icon?: LucideIcon;
+    iconClassName?: string;
+    checked: boolean;
+    onCheckedChange: (checked: boolean) => void;
+    disabled?: boolean;
+    /** Agent-surface grouping key. */
+    group?: string;
+    className?: string;
+}
+export declare function SettingsSwitchRow({ agentId, label, agentLabel, description, icon, iconClassName, checked, onCheckedChange, disabled, group, className, }: SettingsSwitchRowProps): import("react/jsx-runtime").JSX.Element;
+export interface SettingsSelectRowOption {
+    value: string;
+    label: React.ReactNode;
+}
+export interface SettingsSelectRowProps {
+    agentId: string;
+    label: React.ReactNode;
+    agentLabel?: string;
+    description?: React.ReactNode;
+    icon?: LucideIcon;
+    iconClassName?: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    options: SettingsSelectRowOption[];
+    placeholder?: string;
+    disabled?: boolean;
+    group?: string;
+    triggerClassName?: string;
+}
+export declare function SettingsSelectRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, options, placeholder, disabled, group, triggerClassName, }: SettingsSelectRowProps): import("react/jsx-runtime").JSX.Element;
+export interface SettingsSegmentedRowProps {
+    agentId: string;
+    label: React.ReactNode;
+    agentLabel?: string;
+    description?: React.ReactNode;
+    icon?: LucideIcon;
+    iconClassName?: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    options: SettingsSelectRowOption[];
+    disabled?: boolean;
+    group?: string;
+    className?: string;
+    /** Optional stable test id, applied to the segmented group container. */
+    testId?: string;
+}
+/**
+ * A segmented control for a small, fixed set of options (≈2–4). All choices are
+ * visible at once — no OS picker, no "options a whole page away" on mobile —
+ * and the whole control is agent-addressable (`role: "select"`) just like
+ * {@link SettingsSelectRow}. Prefer this over {@link SettingsSelectRow} when the
+ * option set is small and stable (e.g. local/cloud strategy, on/off/auto).
+ */
+export declare function SettingsSegmentedRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, options, disabled, group, className, testId, }: SettingsSegmentedRowProps): import("react/jsx-runtime").JSX.Element;
+export interface SettingsInputRowProps {
+    agentId: string;
+    label: React.ReactNode;
+    agentLabel?: string;
+    description?: React.ReactNode;
+    icon?: LucideIcon;
+    iconClassName?: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    placeholder?: string;
+    type?: "text" | "number" | "password" | "url" | "email";
+    inputMode?: React.InputHTMLAttributes<HTMLInputElement>["inputMode"];
+    autoComplete?: string;
+    variant?: SettingsInputVariant;
+    disabled?: boolean;
+    group?: string;
+    className?: string;
+    inputClassName?: string;
+}
+/** A labelled text/number field that the agent can read and fill from chat. */
+export declare function SettingsInputRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, placeholder, type, inputMode, autoComplete, variant, disabled, group, className, inputClassName, }: SettingsInputRowProps): import("react/jsx-runtime").JSX.Element;
+export interface SettingsTextareaRowProps {
+    agentId: string;
+    label: React.ReactNode;
+    agentLabel?: string;
+    description?: React.ReactNode;
+    icon?: LucideIcon;
+    iconClassName?: string;
+    value: string;
+    onValueChange: (value: string) => void;
+    placeholder?: string;
+    rows?: number;
+    disabled?: boolean;
+    group?: string;
+    className?: string;
+    textareaClassName?: string;
+}
+/** A labelled multi-line field the agent can read and fill from chat. */
+export declare function SettingsTextareaRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, placeholder, rows, disabled, group, className, textareaClassName, }: SettingsTextareaRowProps): import("react/jsx-runtime").JSX.Element;
+export interface SettingsActionButtonProps extends ButtonProps {
+    /** Stable agent id, unique within the settings view. */
+    agentId: string;
+    /** What the user would say to target it (defaults to text children). */
+    agentLabel?: string;
+    /** Status token rendered as `data-state` (e.g. "loading", "saved"). */
+    agentStatus?: string;
+    agentGroup?: string;
+    agentDescription?: string;
+}
+/**
+ * A styled action button that registers on the agent surface, so chat can
+ * trigger it ("save", "refresh", "connect"). Drop-in for any settings button.
+ */
+export declare const SettingsActionButton: React.ForwardRefExoticComponent<SettingsActionButtonProps & React.RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=settings-agent-rows.d.ts.map

package/components/settings/settings-agent-rows.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-agent-rows.d.ts","sourceRoot":"","sources":["../../../../../../src/components/settings/settings-agent-rows.tsx"],"names":[],"mappings":"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"}

package/components/settings/settings-agent-rows.js

@@ -0,0 +1,138 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { useAgentElement } from "../../agent-surface/index.js";
+import { cn } from "../../lib/utils.js";
+import { Button } from "../ui/button.js";
+import { Select, SelectContent, SelectItem, SelectValue } from "../ui/select.js";
+import { SettingsInput, SettingsSegmentedGroup, SettingsSelectTrigger, SettingsTextarea, } from "../ui/settings-controls.js";
+import { Switch } from "../ui/switch.js";
+import { SettingsRow } from "./settings-layout.js";
+/**
+ * Agent-addressable settings controls.
+ *
+ * These pair a {@link SettingsRow} with a control that registers itself on the
+ * active view's agent surface (`useAgentElement`). Because the Settings view is
+ * itself an agent surface (`ShellViewAgentSurface viewId="settings"`), any row
+ * built with these is editable straight from chat/voice — the agent can
+ * `list-elements` and `agent-click` / `agent-fill` them with no extra plumbing.
+ *
+ * Use these instead of a bare `SettingsRow + Switch/Select` whenever the setting
+ * should be configurable from chat (which is the default for settings).
+ */
+function labelToString(label, fallback) {
+    return typeof label === "string" ? label : fallback;
+}
+export function SettingsSwitchRow({ agentId, label, agentLabel, description, icon, iconClassName, checked, onCheckedChange, disabled = false, group = "settings", className, }) {
+    const resolvedLabel = agentLabel ?? labelToString(label, agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: "toggle",
+        label: resolvedLabel,
+        group,
+        description: typeof description === "string" ? description : undefined,
+        status: checked ? "on" : "off",
+        getValue: () => checked,
+        onActivate: disabled ? undefined : () => onCheckedChange(!checked),
+    });
+    return (_jsx(SettingsRow, { icon: icon, iconClassName: iconClassName, label: label, description: description, className: className, control: _jsx(Switch, { ref: ref, checked: checked, onCheckedChange: onCheckedChange, disabled: disabled, "aria-label": resolvedLabel, ...agentProps }) }));
+}
+export function SettingsSelectRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, options, placeholder, disabled = false, group = "settings", triggerClassName, }) {
+    const resolvedLabel = agentLabel ?? labelToString(label, agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: "select",
+        label: resolvedLabel,
+        group,
+        description: typeof description === "string" ? description : undefined,
+        status: value || undefined,
+        options: options.map((option) => option.value),
+        getValue: () => value,
+        onFill: disabled ? undefined : (next) => onValueChange(next),
+    });
+    return (_jsx(SettingsRow, { icon: icon, iconClassName: iconClassName, label: label, description: description, stacked: true, children: _jsxs(Select, { value: value, onValueChange: onValueChange, disabled: disabled, children: [_jsx(SettingsSelectTrigger, { ref: ref, variant: "touch", className: triggerClassName, "aria-label": resolvedLabel, ...agentProps, children: _jsx(SelectValue, { placeholder: placeholder }) }), _jsx(SelectContent, { children: options.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) })] }) }));
+}
+/**
+ * A segmented control for a small, fixed set of options (≈2–4). All choices are
+ * visible at once — no OS picker, no "options a whole page away" on mobile —
+ * and the whole control is agent-addressable (`role: "select"`) just like
+ * {@link SettingsSelectRow}. Prefer this over {@link SettingsSelectRow} when the
+ * option set is small and stable (e.g. local/cloud strategy, on/off/auto).
+ */
+export function SettingsSegmentedRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, options, disabled = false, group = "settings", className, testId, }) {
+    const resolvedLabel = agentLabel ?? labelToString(label, agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: "select",
+        label: resolvedLabel,
+        group,
+        description: typeof description === "string" ? description : undefined,
+        status: value || undefined,
+        options: options.map((option) => option.value),
+        getValue: () => value,
+        onFill: disabled ? undefined : (next) => onValueChange(next),
+    });
+    return (_jsx(SettingsRow, { icon: icon, iconClassName: iconClassName, label: label, description: description, stacked: true, children: _jsx(SettingsSegmentedGroup, { ref: ref, role: "radiogroup", "aria-label": resolvedLabel, "data-testid": testId, className: cn("w-full", className), ...agentProps, children: options.map((option) => {
+                const active = option.value === value;
+                return (_jsx("button", { type: "button", role: "radio", "aria-checked": active, "data-value": option.value, "data-active": active ? "true" : "false", disabled: disabled, onClick: () => onValueChange(option.value), className: cn("flex h-9 flex-1 items-center justify-center rounded-sm px-2 text-xs font-medium transition-colors    disabled:opacity-50", active
+                        ? "bg-card text-txt-strong"
+                        : "text-muted hover:bg-card/60 hover:text-txt"), children: option.label }, option.value));
+            }) }) }));
+}
+/** A labelled text/number field that the agent can read and fill from chat. */
+export function SettingsInputRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, placeholder, type = "text", inputMode, autoComplete, variant = "touch", disabled = false, group = "settings", className, inputClassName, }) {
+    const resolvedLabel = agentLabel ?? labelToString(label, agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: type === "number" ? "number-input" : "text-input",
+        label: resolvedLabel,
+        group,
+        description: typeof description === "string" ? description : undefined,
+        getValue: () => value,
+        onFill: disabled ? undefined : (next) => onValueChange(next),
+    });
+    return (_jsx(SettingsRow, { icon: icon, iconClassName: iconClassName, label: label, description: description, className: className, stacked: true, children: _jsx(SettingsInput, { ref: ref, variant: variant, type: type, value: value, onChange: (event) => onValueChange(event.target.value), placeholder: placeholder, inputMode: inputMode, autoComplete: autoComplete, disabled: disabled, "aria-label": resolvedLabel, className: inputClassName, ...agentProps }) }));
+}
+/** A labelled multi-line field the agent can read and fill from chat. */
+export function SettingsTextareaRow({ agentId, label, agentLabel, description, icon, iconClassName, value, onValueChange, placeholder, rows = 4, disabled = false, group = "settings", className, textareaClassName, }) {
+    const resolvedLabel = agentLabel ?? labelToString(label, agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: "textarea",
+        label: resolvedLabel,
+        group,
+        description: typeof description === "string" ? description : undefined,
+        getValue: () => value,
+        onFill: disabled ? undefined : (next) => onValueChange(next),
+    });
+    return (_jsx(SettingsRow, { icon: icon, iconClassName: iconClassName, label: label, description: description, className: className, stacked: true, children: _jsx(SettingsTextarea, { ref: ref, value: value, onChange: (event) => onValueChange(event.target.value), placeholder: placeholder, rows: rows, disabled: disabled, "aria-label": resolvedLabel, className: textareaClassName, ...agentProps }) }));
+}
+/**
+ * A styled action button that registers on the agent surface, so chat can
+ * trigger it ("save", "refresh", "connect"). Drop-in for any settings button.
+ */
+export const SettingsActionButton = React.forwardRef(function SettingsActionButton({ agentId, agentLabel, agentStatus, agentGroup = "settings", agentDescription, onClick, disabled, children, ...rest }, forwardedRef) {
+    const resolvedLabel = agentLabel ?? (typeof children === "string" ? children : agentId);
+    const { ref, agentProps } = useAgentElement({
+        id: agentId,
+        role: "button",
+        label: resolvedLabel,
+        group: agentGroup,
+        description: agentDescription,
+        status: agentStatus,
+        onActivate: disabled || !onClick
+            ? undefined
+            : () => onClick({}),
+    });
+    return (_jsx(Button, { ref: mergeRefs(ref, forwardedRef), onClick: onClick, disabled: disabled, "aria-label": resolvedLabel, ...agentProps, ...rest, children: children }));
+});
+function mergeRefs(...refs) {
+    return (value) => {
+        for (const ref of refs) {
+            if (typeof ref === "function")
+                ref(value);
+            else if (ref && typeof ref === "object") {
+                ref.current = value;
+            }
+        }
+    };
+}

package/components/settings/settings-control-primitives.d.ts

@@ -1,11 +1,10 @@
-import { FieldDescription, FieldLabel } from "@elizaos/ui";
 import type * as React from "react";
-export declare function SettingsField({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
-export declare function SettingsFieldLabel({ className, ...props }: React.ComponentPropsWithoutRef<typeof FieldLabel>): import("react/jsx-runtime").JSX.Element;
-export declare function SettingsFieldDescription({ className, ...props }: React.ComponentPropsWithoutRef<typeof FieldDescription>): import("react/jsx-runtime").JSX.Element;
-export declare function AdvancedSettingsDisclosure({ title, children, className, }: {
+export { SettingsField, SettingsFieldDescription, SettingsFieldLabel, } from "../ui/settings-controls.js";
+export declare function AdvancedSettingsDisclosure({ title, children, className, lazy, defaultOpen, }: {
     title?: string;
     children: React.ReactNode;
     className?: string;
+    lazy?: boolean;
+    defaultOpen?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=settings-control-primitives.d.ts.map

package/components/settings/settings-control-primitives.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings-control-primitives.d.ts","sourceRoot":"","sources":["../../../../../../src/components/settings/settings-control-primitives.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,gBAAgB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACtE,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,2CAEtC;AAED,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,UAAU,CAAC,2CAOnD;AAED,wBAAgB,wBAAwB,CAAC,EACvC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,2CAOzD;AAED,wBAAgB,0BAA0B,CAAC,EACzC,KAAkB,EAClB,QAAQ,EACR,SAAS,GACV,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAcA"}
+{"version":3,"file":"settings-control-primitives.d.ts","sourceRoot":"","sources":["../../../../../../src/components/settings/settings-control-primitives.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAOpC,OAAO,EACL,aAAa,EACb,wBAAwB,EACxB,kBAAkB,GACnB,MAAM,yBAAyB,CAAC;AAEjC,wBAAgB,0BAA0B,CAAC,EACzC,KAAkB,EAClB,QAAQ,EACR,SAAS,EACT,IAAY,EACZ,WAAmB,GACpB,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA"}

package/components/settings/settings-control-primitives.hooks.d.ts

@@ -0,0 +1,14 @@
+export interface UseSettingsSaveOptions {
+    onSave: () => Promise<void> | void;
+    successMs?: number;
+    errorFallback?: string;
+}
+export interface UseSettingsSaveResult {
+    saving: boolean;
+    saveError: string | null;
+    saveSuccess: boolean;
+    handleSave: () => Promise<void>;
+    resetStatus: () => void;
+}
+export declare function useSettingsSave(options: UseSettingsSaveOptions): UseSettingsSaveResult;
+//# sourceMappingURL=settings-control-primitives.hooks.d.ts.map

package/components/settings/settings-control-primitives.hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings-control-primitives.hooks.d.ts","sourceRoot":"","sources":["../../../../../../src/components/settings/settings-control-primitives.hooks.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,qBAAqB;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,WAAW,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAiDvB"}

package/components/settings/settings-control-primitives.hooks.js

@@ -0,0 +1,43 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+export function useSettingsSave(options) {
+    const { onSave, successMs = 2500, errorFallback = "Failed to save.", } = options;
+    const [saving, setSaving] = useState(false);
+    const [saveError, setSaveError] = useState(null);
+    const [saveSuccess, setSaveSuccess] = useState(false);
+    const successTimerRef = useRef(null);
+    const onSaveRef = useRef(onSave);
+    onSaveRef.current = onSave;
+    const clearSuccessTimer = useCallback(() => {
+        if (successTimerRef.current !== null) {
+            clearTimeout(successTimerRef.current);
+            successTimerRef.current = null;
+        }
+    }, []);
+    const resetStatus = useCallback(() => {
+        clearSuccessTimer();
+        setSaveError(null);
+        setSaveSuccess(false);
+    }, [clearSuccessTimer]);
+    const handleSave = useCallback(async () => {
+        clearSuccessTimer();
+        setSaving(true);
+        setSaveError(null);
+        setSaveSuccess(false);
+        try {
+            await onSaveRef.current();
+            setSaveSuccess(true);
+            successTimerRef.current = setTimeout(() => {
+                setSaveSuccess(false);
+                successTimerRef.current = null;
+            }, successMs);
+        }
+        catch (error) {
+            setSaveError(error instanceof Error ? error.message : errorFallback);
+        }
+        finally {
+            setSaving(false);
+        }
+    }, [clearSuccessTimer, errorFallback, successMs]);
+    useEffect(() => clearSuccessTimer, [clearSuccessTimer]);
+    return { saving, saveError, saveSuccess, handleSave, resetStatus };
+}