@akira-io/ui 1.0.0 → 1.1.1

package/dist/blocks.js

@@ -1,12 +1,23 @@
-import { CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, Popover, PopoverTrigger, PopoverContent, Tabs, TabsList, TabsTrigger, TabsContent, Label, Textarea, Switch, Calendar, Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-42BJBH56.js';
-export { DEFAULT_TOUR_LABELS, TourProvider, resolveSteps, shouldStartTour, stepsForBreakpoint, useTour, useTourController } from './chunk-UXL33CZ4.js';
-import { Button, cn, Input, elevatedSurface, recessedSurface } from './chunk-POE7OYET.js';
-import { createContext, useState, useCallback, useEffect, useContext } from 'react';
+import { CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, ConfirmDialog, Popover, PopoverTrigger, PopoverContent, FloatingSheet, FloatingSheetBody, FloatingSheetFooter, Tabs, TabsList, TabsTrigger, TabsContent, Textarea, Switch, FieldError, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, InputOTP, InputOTPGroup, InputOTPSlot, Alert, AlertDescription, Calendar } from './chunk-CFDDAFPJ.js';
+import { CopyButton } from './chunk-2WIIRDHT.js';
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, Label } from './chunk-T2INZOCM.js';
+import { Card } from './chunk-RPCL7VFQ.js';
+export { DEFAULT_TOUR_LABELS, TourProvider, resolveSteps, shouldStartTour, stepsForBreakpoint, useTour, useTourController } from './chunk-YOVY3KT6.js';
+import { useUiLabels, useUiLocale } from './chunk-5AJFQ6C4.js';
+export { UiLocaleProvider, useUiLabels, useUiLocale } from './chunk-5AJFQ6C4.js';
+import { resolveLink } from './chunk-L2H5GIF7.js';
+import { Input } from './chunk-XZCC6MTE.js';
+import { Button, cn, elevatedSurface, nestedSurfaceReset, recessedSurface, compactRadius, controlRadius, Spinner } from './chunk-ODYCBCKS.js';
+import { createContext, useState, useCallback, useEffect, useContext, useId, useRef } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { CalendarDays, ChevronLeft, ArrowLeftToLine, X, ArrowRight, ArrowUpRight, ArrowDownRight } from 'lucide-react';
+import { TriangleAlert, CalendarDays, ArrowLeft, ChevronRight, AlertCircle, ShieldOff, EyeOff, Eye, RefreshCw, ChevronLeft, ArrowLeftToLine, X, ArrowRight, ArrowUpRight, ArrowDownRight } from 'lucide-react';
 import { subYears, subQuarters, subMonths, subWeeks, subDays, endOfYear, endOfQuarter, endOfMonth, endOfDay, startOfYear, startOfQuarter, startOfMonth, startOfDay, isSameYear, format, endOfWeek, startOfWeek } from 'date-fns';
 import { pt } from 'date-fns/locale';
 
+var commandPaletteDefaultLabels = {
+  placeholder: "Search...",
+  noResultsLabel: "No results found"
+};
 function CommandPalette({
   open,
   onOpenChange,
@@ -14,12 +25,16 @@ function CommandPalette({
   onSelect,
   query,
   onQueryChange,
-  placeholder = "Search...",
-  noResultsLabel = "No results found",
+  placeholder,
+  noResultsLabel,
   emptyState,
   className
 }) {
-  const resolvedEmptyState = emptyState ?? noResultsLabel;
+  const labels = useUiLabels("commandPalette", commandPaletteDefaultLabels, {
+    placeholder,
+    noResultsLabel
+  });
+  const resolvedEmptyState = emptyState ?? labels.noResultsLabel;
   return /* @__PURE__ */ jsxs(
     CommandDialog,
     {
@@ -30,7 +45,7 @@ function CommandPalette({
         /* @__PURE__ */ jsx(
           CommandInput,
           {
-            placeholder,
+            placeholder: labels.placeholder,
             value: query,
             onValueChange: onQueryChange
           }
@@ -70,6 +85,98 @@ function useCommandPalette(initialOpen = false) {
   }, [toggle]);
   return { open, setOpen, toggle };
 }
+var dangerZoneLabels = {
+  title: "Danger zone",
+  description: "These actions are permanent and cannot be undone.",
+  actionLabel: "Delete",
+  confirmTitle: "Confirm Action",
+  confirmDescription: "Are you sure you want to continue? This action cannot be undone.",
+  confirmText: "Confirm",
+  cancelText: "Cancel",
+  requiredValueLabel: "Type {{value}} to confirm"
+};
+function DangerZone({
+  title,
+  description,
+  actions,
+  processing = false,
+  labels,
+  footer,
+  className,
+  slotName = "danger-zone"
+}) {
+  const copy = { ...dangerZoneLabels, ...labels };
+  const [activeId, setActiveId] = useState(null);
+  const active = actions.find((action) => action.id === activeId) ?? null;
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn(
+        elevatedSurface,
+        nestedSurfaceReset,
+        "gap-6 p-6 flex flex-col bg-destructive/5 ring-destructive/30",
+        className
+      ),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsxs("div", { "data-slot": "danger-zone-header", className: "gap-3 flex", children: [
+          /* @__PURE__ */ jsx("span", { className: "size-11 rounded-2xl flex shrink-0 items-center justify-center bg-destructive/10 text-destructive", children: /* @__PURE__ */ jsx(TriangleAlert, { className: "size-5" }) }),
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold text-destructive", children: title ?? copy.title }),
+            /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: description ?? copy.description })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("ul", { "data-slot": "danger-zone-actions", className: "gap-4 flex flex-col", children: actions.map((action) => /* @__PURE__ */ jsxs(
+          "li",
+          {
+            "data-slot": "danger-zone-action",
+            "data-action-id": action.id,
+            className: "gap-4 sm:flex-row sm:items-center sm:justify-between flex flex-col",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-foreground", children: action.title }),
+                action.description && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: action.description })
+              ] }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: "destructive",
+                  disabled: processing || action.disabled,
+                  onClick: () => setActiveId(action.id),
+                  className: "sm:w-auto w-full",
+                  children: action.actionLabel ?? copy.actionLabel
+                }
+              )
+            ]
+          },
+          action.id
+        )) }),
+        footer,
+        /* @__PURE__ */ jsx(
+          ConfirmDialog,
+          {
+            open: active !== null,
+            onOpenChange: (open) => {
+              if (!open) {
+                setActiveId(null);
+              }
+            },
+            variant: "destructive",
+            processing,
+            title: active?.confirmTitle ?? copy.confirmTitle,
+            description: active?.confirmDescription ?? copy.confirmDescription,
+            confirmText: active?.confirmText ?? copy.confirmText,
+            cancelText: active?.cancelText ?? copy.cancelText,
+            requiredValue: active?.requiredValue,
+            requiredValueLabel: active?.requiredValueLabel ?? copy.requiredValueLabel,
+            onConfirm: () => active?.onConfirm()
+          }
+        )
+      ]
+    }
+  );
+}
 var DateFilterContext = createContext(null);
 var DateFilterProvider = DateFilterContext.Provider;
 function useDateFilter() {
@@ -407,22 +514,24 @@ var DEFAULT_LABELS = {
 function DateFilter({
   value,
   onChange,
-  presets = DEFAULT_PRESETS,
-  operators = DEFAULT_OPERATORS,
-  units = DEFAULT_UNITS,
+  presets,
+  operators,
+  units,
   labels,
   children
 }) {
+  const locale = useUiLocale();
+  const resolvedLabels = useUiLabels("dateFilter", DEFAULT_LABELS, labels);
   const [open, setOpen] = useState(false);
   const [panel, setPanel] = useState("root");
   const [draft, setDraft] = useState(value);
   const context = {
     value,
     draft,
-    labels: { ...DEFAULT_LABELS, ...labels },
-    presets,
-    operators,
-    units,
+    labels: resolvedLabels,
+    presets: presets ?? locale.dateFilterPresets ?? DEFAULT_PRESETS,
+    operators: operators ?? locale.dateFilterOperators ?? DEFAULT_OPERATORS,
+    units: units ?? locale.dateFilterUnits ?? DEFAULT_UNITS,
     panel,
     setDraft,
     openPanel: (next, seed) => {
@@ -572,9 +681,87 @@ function DateFilterRelative({ children }) {
   );
 }
 
-// src/blocks/date-filter/encode.ts
+// src/blocks/date-filter/decode.ts
 var RANGE_SEPARATOR = "~";
 var RELATIVE_PREFIX = "previous";
+var ISO_DATE = /^\d{4}-\d{2}-\d{2}$/;
+var UNITS = ["day", "week", "month", "quarter", "year"];
+var ALL = { mode: "all" };
+function decodeDateFilter(encoded) {
+  if (!encoded) {
+    return ALL;
+  }
+  if (encoded.startsWith(`${RELATIVE_PREFIX}:`)) {
+    return decodeRelative(encoded);
+  }
+  if (encoded.includes(RANGE_SEPARATOR)) {
+    return decodeFixedRange(encoded);
+  }
+  if (ISO_DATE.test(encoded)) {
+    return isDate(encoded) ? { mode: "fixed", operator: "on", start: encoded } : ALL;
+  }
+  return { mode: "preset", preset: encoded };
+}
+function decodeFixedRange(encoded) {
+  const parts = encoded.split(RANGE_SEPARATOR);
+  if (parts.length !== 2) {
+    return ALL;
+  }
+  const [start, end] = parts;
+  if (start && end) {
+    return isDate(start) && isDate(end) ? { mode: "fixed", operator: "between", start, end } : ALL;
+  }
+  if (start) {
+    return isDate(start) ? { mode: "fixed", operator: "after", start } : ALL;
+  }
+  if (end) {
+    return isDate(end) ? { mode: "fixed", operator: "before", start: end } : ALL;
+  }
+  return ALL;
+}
+function decodeRelative(encoded) {
+  const [, rawAmount, rawUnit, ...rest] = encoded.split(":");
+  const amount = Number(rawAmount);
+  const unit = toUnit(rawUnit);
+  if (!unit || !Number.isInteger(amount) || amount < 1) {
+    return ALL;
+  }
+  const value = { mode: "relative", amount, unit };
+  const tail = [...rest];
+  if (tail[0] === "current") {
+    value.include_current = true;
+    tail.shift();
+  }
+  if (tail.length === 0) {
+    return value;
+  }
+  if (tail.length !== 3 || tail[0] !== "offset") {
+    return ALL;
+  }
+  const offsetAmount = Number(tail[1]);
+  const offsetUnit = toUnit(tail[2]);
+  if (!offsetUnit || !Number.isInteger(offsetAmount) || offsetAmount < 1) {
+    return ALL;
+  }
+  value.offset_amount = offsetAmount;
+  value.offset_unit = offsetUnit;
+  return value;
+}
+function toUnit(value) {
+  return UNITS.find((unit) => unit === value) ?? null;
+}
+function isDate(value) {
+  if (!ISO_DATE.test(value)) {
+    return false;
+  }
+  const [year, month, day] = value.split("-").map(Number);
+  const date = new Date(Date.UTC(year, month - 1, day));
+  return date.getUTCFullYear() === year && date.getUTCMonth() === month - 1 && date.getUTCDate() === day;
+}
+
+// src/blocks/date-filter/encode.ts
+var RANGE_SEPARATOR2 = "~";
+var RELATIVE_PREFIX2 = "previous";
 function encodeDateFilter(filter) {
   if (filter.mode === "preset") {
     return filter.preset ?? null;
@@ -592,21 +779,21 @@ function encodeFixed(filter) {
     return null;
   }
   if (filter.operator === "before") {
-    return `${RANGE_SEPARATOR}${filter.start}`;
+    return `${RANGE_SEPARATOR2}${filter.start}`;
   }
   if (filter.operator === "after") {
-    return `${filter.start}${RANGE_SEPARATOR}`;
+    return `${filter.start}${RANGE_SEPARATOR2}`;
   }
   if (filter.operator === "on") {
     return filter.start;
   }
-  return filter.end ? `${filter.start}${RANGE_SEPARATOR}${filter.end}` : null;
+  return filter.end ? `${filter.start}${RANGE_SEPARATOR2}${filter.end}` : null;
 }
 function encodeRelative(filter) {
   if (!filter.unit || !filter.amount || filter.amount < 1) {
     return null;
   }
-  let value = `${RELATIVE_PREFIX}:${filter.amount}:${filter.unit}`;
+  let value = `${RELATIVE_PREFIX2}:${filter.amount}:${filter.unit}`;
   if (filter.include_current) {
     value += ":current";
   }
@@ -615,20 +802,263 @@ function encodeRelative(filter) {
   }
   return value;
 }
+var formOverlayDefaultLabels = {
+  cancelLabel: "Cancel",
+  saveLabel: "Save",
+  savingLabel: "Saving..."
+};
+function FormOverlayActions({
+  labels = formOverlayDefaultLabels,
+  processing = false,
+  intent = "default",
+  submit = false,
+  className,
+  onCancel,
+  onSave,
+  slotName = "form-overlay-actions"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("gap-2 flex items-center justify-end", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            disabled: processing,
+            onClick: onCancel,
+            children: labels.cancelLabel
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: submit ? "submit" : "button",
+            "aria-label": processing ? labels.savingLabel : void 0,
+            variant: intent,
+            loading: processing,
+            loadingLabel: labels.savingLabel,
+            onClick: onSave,
+            children: processing ? labels.savingLabel : labels.saveLabel
+          }
+        )
+      ]
+    }
+  );
+}
+function DetailEditSheet({
+  open,
+  onOpenChange,
+  title,
+  description,
+  processing = false,
+  intent,
+  labels,
+  className,
+  children,
+  onSave,
+  onCancel,
+  slotName = "detail-edit-sheet"
+}) {
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    if (processing) {
+      return;
+    }
+    onSave();
+  };
+  const handleCancel = () => {
+    if (processing) {
+      return;
+    }
+    onCancel?.();
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx(
+    FloatingSheet,
+    {
+      open,
+      onOpenChange,
+      title,
+      description,
+      persistent: true,
+      className,
+      children: /* @__PURE__ */ jsxs(
+        "form",
+        {
+          onSubmit: handleSubmit,
+          className: "min-h-0 flex flex-1 flex-col",
+          "data-slot": slotName,
+          children: [
+            /* @__PURE__ */ jsx(FloatingSheetBody, { children }),
+            /* @__PURE__ */ jsx(FloatingSheetFooter, { children: /* @__PURE__ */ jsx(
+              FormOverlayActions,
+              {
+                submit: true,
+                labels,
+                processing,
+                intent,
+                onCancel: handleCancel
+              }
+            ) })
+          ]
+        }
+      )
+    }
+  );
+}
+function FormDialog({
+  open,
+  onOpenChange,
+  title,
+  description,
+  processing = false,
+  intent,
+  labels,
+  className,
+  children,
+  onSave,
+  onCancel,
+  slotName = "form-dialog"
+}) {
+  const handleSubmit = (event) => {
+    event.preventDefault();
+    if (processing) {
+      return;
+    }
+    onSave();
+  };
+  const handleCancel = () => {
+    if (processing) {
+      return;
+    }
+    onCancel?.();
+    onOpenChange(false);
+  };
+  const blockWhileProcessing = (event) => {
+    if (processing) {
+      event.preventDefault();
+    }
+  };
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open,
+      onOpenChange: (next) => {
+        if (processing && !next) {
+          return;
+        }
+        onOpenChange(next);
+      },
+      children: /* @__PURE__ */ jsx(
+        DialogContent,
+        {
+          ...description ? {} : { "aria-describedby": void 0 },
+          className: cn("gap-0 p-0", className),
+          onEscapeKeyDown: blockWhileProcessing,
+          onInteractOutside: blockWhileProcessing,
+          slotName,
+          children: /* @__PURE__ */ jsxs(
+            "form",
+            {
+              "data-slot": "form-dialog-form",
+              onSubmit: handleSubmit,
+              className: "grid max-h-[calc(100dvh-8rem)] grid-rows-[auto_minmax(0,1fr)_auto]",
+              children: [
+                /* @__PURE__ */ jsxs(DialogHeader, { className: "text-left", children: [
+                  /* @__PURE__ */ jsx(DialogTitle, { children: title }),
+                  description ? /* @__PURE__ */ jsx(DialogDescription, { children: description }) : null
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    "data-slot": "form-dialog-body",
+                    className: "gap-4 px-6 pb-6 md:px-8 flex flex-col overflow-y-auto",
+                    children
+                  }
+                ),
+                /* @__PURE__ */ jsx(DialogFooter, { children: /* @__PURE__ */ jsx(
+                  FormOverlayActions,
+                  {
+                    submit: true,
+                    labels,
+                    processing,
+                    intent,
+                    onCancel: handleCancel,
+                    className: "w-full"
+                  }
+                ) })
+              ]
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function copyableText(value, copyValue) {
+  if (copyValue !== void 0) {
+    return copyValue.trim();
+  }
+  if (typeof value === "string" || typeof value === "number") {
+    return String(value).trim();
+  }
+  return "";
+}
 function InfoField({
   icon: Icon,
   label,
   value,
+  copyable = false,
+  copyValue,
+  copyLabel,
+  copiedLabel,
   iconClassName,
-  className
+  className,
+  slotName = "info-field"
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("gap-3 flex items-center", className), children: [
-    /* @__PURE__ */ jsx("div", { className: cn("p-2 rounded-xl bg-muted", iconClassName), children: /* @__PURE__ */ jsx(Icon, { className: "size-5 text-muted-foreground" }) }),
-    /* @__PURE__ */ jsxs("div", { children: [
-      /* @__PURE__ */ jsx("p", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: label }),
-      /* @__PURE__ */ jsx("p", { className: "font-semibold", children: value })
-    ] })
-  ] });
+  const text = copyableText(value, copyValue);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("gap-3 flex items-center", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: cn("p-2 rounded-xl bg-muted", iconClassName), children: /* @__PURE__ */ jsx(Icon, { className: "size-5 text-muted-foreground" }) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx(
+            "p",
+            {
+              "data-slot": "info-field-label",
+              className: "text-xs font-medium tracking-wider text-muted-foreground uppercase",
+              children: label
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "p",
+            {
+              "data-slot": "info-field-value",
+              className: "gap-1 font-semibold flex items-center",
+              children: [
+                value,
+                copyable && text !== "" && /* @__PURE__ */ jsx(
+                  CopyButton,
+                  {
+                    value: text,
+                    copyLabel,
+                    copiedLabel
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
 }
 function InfoFieldGroup({ children, className }) {
   return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), children });
@@ -730,12 +1160,12 @@ function SettingsCard({
   control,
   children,
   inset = false,
-  className
+  className,
+  slotName = "settings-card"
 }) {
   return /* @__PURE__ */ jsxs(
     "section",
     {
-      "data-slot": "settings-card",
       "data-inset": inset || void 0,
       className: cn(
         elevatedSurface,
@@ -743,6 +1173,7 @@ function SettingsCard({
         inset && recessedSurface,
         className
       ),
+      "data-slot": slotName,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "gap-4 sm:flex-row sm:items-center sm:justify-between flex flex-col", children: [
           /* @__PURE__ */ jsxs("div", { className: "gap-3 flex items-center", children: [
@@ -773,12 +1204,12 @@ function SettingsPanel({
   description,
   children,
   inset = true,
-  className
+  className,
+  slotName = "settings-panel"
 }) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      "data-slot": "settings-panel",
       "data-inset": inset || void 0,
       className: cn(
         elevatedSurface,
@@ -786,6 +1217,7 @@ function SettingsPanel({
         inset && recessedSurface,
         className
       ),
+      "data-slot": slotName,
       children: [
         (title || description) && /* @__PURE__ */ jsxs("div", { children: [
           title && /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-foreground", children: title }),
@@ -827,6 +1259,346 @@ function ToggleRow({
     )
   ] });
 }
+function SettingsField({
+  id,
+  label,
+  description,
+  error,
+  required,
+  className,
+  children,
+  slotName = "settings-field"
+}) {
+  const generated = useId();
+  const fieldId = id ?? generated;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-invalid": error ? true : void 0,
+      className: cn("space-y-2 py-1", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsxs(Label, { htmlFor: fieldId, children: [
+          label,
+          required && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "settings-field-required",
+              "aria-hidden": "true",
+              className: "text-destructive",
+              children: "*"
+            }
+          )
+        ] }),
+        children(fieldId),
+        description && /* @__PURE__ */ jsx(
+          "p",
+          {
+            "data-slot": "settings-field-description",
+            className: "text-xs font-medium text-muted-foreground",
+            children: description
+          }
+        ),
+        /* @__PURE__ */ jsx(FieldError, { message: error })
+      ]
+    }
+  );
+}
+function TextField({
+  type = "text",
+  value,
+  onChange,
+  disabled,
+  placeholder,
+  slotName = "text-field",
+  ...field
+}) {
+  return /* @__PURE__ */ jsx(SettingsField, { ...field, children: (fieldId) => /* @__PURE__ */ jsx(
+    Input,
+    {
+      id: fieldId,
+      type,
+      value,
+      disabled,
+      placeholder,
+      "aria-invalid": field.error ? true : void 0,
+      slotName,
+      onChange: (event) => onChange(event.target.value)
+    }
+  ) });
+}
+function NumberField({
+  value,
+  onChange,
+  disabled,
+  placeholder,
+  min,
+  max,
+  step,
+  slotName = "number-field",
+  ...field
+}) {
+  return /* @__PURE__ */ jsx(SettingsField, { ...field, children: (fieldId) => /* @__PURE__ */ jsx(
+    Input,
+    {
+      id: fieldId,
+      type: "number",
+      inputMode: "decimal",
+      value: value === "" ? "" : String(value),
+      min,
+      max,
+      step,
+      disabled,
+      placeholder,
+      "aria-invalid": field.error ? true : void 0,
+      slotName,
+      onChange: (event) => onChange(
+        event.target.value === "" ? "" : event.target.valueAsNumber
+      )
+    }
+  ) });
+}
+function DateField({
+  value,
+  onChange,
+  disabled,
+  min,
+  max,
+  slotName = "date-field",
+  ...field
+}) {
+  return /* @__PURE__ */ jsx(SettingsField, { ...field, children: (fieldId) => /* @__PURE__ */ jsx(
+    Input,
+    {
+      id: fieldId,
+      type: "date",
+      value,
+      min,
+      max,
+      disabled,
+      "aria-invalid": field.error ? true : void 0,
+      slotName,
+      onChange: (event) => onChange(event.target.value)
+    }
+  ) });
+}
+function SelectField({
+  value,
+  onChange,
+  options,
+  disabled,
+  placeholder,
+  slotName = "select-field",
+  ...field
+}) {
+  return /* @__PURE__ */ jsx(SettingsField, { ...field, children: (fieldId) => /* @__PURE__ */ jsxs(
+    Select,
+    {
+      value,
+      onValueChange: onChange,
+      disabled,
+      children: [
+        /* @__PURE__ */ jsx(
+          SelectTrigger,
+          {
+            id: fieldId,
+            slotName,
+            "aria-invalid": field.error ? true : void 0,
+            children: /* @__PURE__ */ jsx(SelectValue, { placeholder })
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectContent, { children: options.map((option) => /* @__PURE__ */ jsx(
+          SelectItem,
+          {
+            value: option.value,
+            disabled: option.disabled,
+            children: option.label
+          },
+          option.value
+        )) })
+      ]
+    }
+  ) });
+}
+var SettingsLinkContext = createContext(void 0);
+function SettingsPage({
+  title,
+  description,
+  control,
+  linkComponent,
+  children,
+  className,
+  slotName = "settings-page"
+}) {
+  return /* @__PURE__ */ jsx(SettingsLinkContext.Provider, { value: linkComponent, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "gap-8 max-w-4xl mx-auto flex w-full flex-col",
+        className
+      ),
+      "data-slot": slotName,
+      children: [
+        title && /* @__PURE__ */ jsx(
+          SectionHeader,
+          {
+            title,
+            description,
+            control
+          }
+        ),
+        children
+      ]
+    }
+  ) });
+}
+var settingsLabels = {
+  back: "Back"
+};
+function SettingsSection({
+  title,
+  description,
+  control,
+  backHref = "/settings",
+  backLabel,
+  wide = false,
+  linkComponent,
+  children,
+  className,
+  slotName = "settings-section"
+}) {
+  const labels = useUiLabels("settings", settingsLabels, {
+    back: backLabel
+  });
+  const contextLink = useContext(SettingsLinkContext);
+  const Link = resolveLink(linkComponent ?? contextLink);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn(
+        "gap-6 mx-auto flex w-full flex-col",
+        wide ? "max-w-4xl" : "max-w-2xl",
+        className
+      ),
+      "data-slot": slotName,
+      children: [
+        backHref && /* @__PURE__ */ jsxs(
+          Link,
+          {
+            "data-slot": "settings-section-back",
+            href: backHref,
+            className: "gap-2 text-sm font-medium inline-flex w-fit items-center text-muted-foreground transition-colors hover:text-foreground",
+            children: [
+              /* @__PURE__ */ jsx(ArrowLeft, { className: "size-4" }),
+              labels.back
+            ]
+          }
+        ),
+        title && /* @__PURE__ */ jsx(
+          SectionHeader,
+          {
+            title,
+            description,
+            control
+          }
+        ),
+        children
+      ]
+    }
+  );
+}
+function SettingsGroup({
+  label,
+  columns = 2,
+  children,
+  className,
+  slotName = "settings-group"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("gap-3 flex flex-col", className),
+      "data-slot": slotName,
+      children: [
+        label && /* @__PURE__ */ jsx("p", { className: "font-bold tracking-widest text-[11px] text-muted-foreground uppercase", children: label }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-slot": "settings-group-grid",
+            className: cn(
+              "gap-4 grid grid-cols-1",
+              columns === 2 && "md:grid-cols-2"
+            ),
+            children
+          }
+        )
+      ]
+    }
+  );
+}
+function SettingsEntry({
+  icon: Icon,
+  iconClassName,
+  title,
+  description,
+  href,
+  badge,
+  disabled = false,
+  linkComponent,
+  className,
+  slotName = "settings-entry"
+}) {
+  const contextLink = useContext(SettingsLinkContext);
+  const Link = resolveLink(linkComponent ?? contextLink);
+  const card = /* @__PURE__ */ jsxs(
+    Card,
+    {
+      interactive: !disabled,
+      padding: "none",
+      "data-disabled": disabled || void 0,
+      className: cn(
+        "gap-4 p-5 flex h-full flex-row items-center",
+        disabled && "opacity-60",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: cn(
+              "size-11 flex shrink-0 items-center justify-center rounded-full",
+              iconClassName ?? "bg-primary/10 text-primary"
+            ),
+            children: /* @__PURE__ */ jsx(Icon, { className: "size-5" })
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex flex-1 flex-col", children: [
+          /* @__PURE__ */ jsxs("span", { className: "gap-2 flex items-center", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-bold text-foreground", children: title }),
+            badge
+          ] }),
+          description && /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-muted-foreground", children: description })
+        ] }),
+        /* @__PURE__ */ jsx(ChevronRight, { className: "size-4 shrink-0 text-muted-foreground" })
+      ]
+    }
+  );
+  if (disabled) {
+    return /* @__PURE__ */ jsx("div", { "data-disabled": "true", "aria-disabled": "true", "data-slot": slotName, children: card });
+  }
+  return /* @__PURE__ */ jsx(
+    Link,
+    {
+      href,
+      className: cn(
+        compactRadius,
+        "outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50"
+      ),
+      "data-slot": slotName,
+      children: card
+    }
+  );
+}
 function resolveTrend(trend) {
   if (trend === null || trend === void 0 || Number.isNaN(trend)) {
     return null;
@@ -861,13 +1633,13 @@ function StatCard({
   trend,
   comparisonLabel,
   inset = false,
-  className
+  className,
+  slotName = "stat-card"
 }) {
   const resolvedTrend = resolveTrend(trend);
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      "data-slot": "stat-card",
       "data-inset": inset || void 0,
       className: cn(
         elevatedSurface,
@@ -875,6 +1647,7 @@ function StatCard({
         inset && recessedSurface,
         className
       ),
+      "data-slot": slotName,
       children: [
         /* @__PURE__ */ jsxs("div", { className: "mb-4 gap-4 flex items-start justify-between", children: [
           /* @__PURE__ */ jsx("div", { className: cn("rounded-2xl p-3 shrink-0", iconClassName), children: /* @__PURE__ */ jsx(Icon, { className: "size-6" }) }),
@@ -916,6 +1689,607 @@ function StatsGrid({ children, className }) {
   );
 }
 
-export { CommandPalette, DEFAULT_LABELS as DATE_FILTER_LABELS, DEFAULT_OPERATORS as DATE_FILTER_OPERATORS, DEFAULT_PRESETS as DATE_FILTER_PRESETS, DEFAULT_UNITS as DATE_FILTER_UNITS, DateFilter, DateFilterAll, DateFilterContent, DateFilterFixed, DateFilterItem, DateFilterPresets, DateFilterRelative, DateFilterSeparator, DateFilterTrigger, InfoField, InfoFieldGroup, LocalizedFields, SectionHeader, SettingsCard, SettingsPanel, StatCard, StatsGrid, ToggleRow, encodeDateFilter, formatRangePreview, resolveRelativeRange, summariseDateFilter, useCommandPalette, useDateFilter };
+// src/blocks/two-factor/types.ts
+var twoFactorLabels = {
+  setupTitle: "Two-factor authentication",
+  setupDescription: "Add a second step to your sign in with an authenticator app.",
+  pendingLabel: "Preparing your setup key",
+  scanTitle: "Scan the code",
+  scanDescription: "Open your authenticator app and scan the code below to add this account.",
+  qrFallbackLabel: "The QR code is not available yet.",
+  manualKeyLabel: "Setup key",
+  manualKeyDescription: "Enter this key by hand if your app cannot scan the code.",
+  manualKeyRevealLabel: "Show setup key",
+  manualKeyHideLabel: "Hide setup key",
+  continueLabel: "Continue",
+  confirmTitle: "Confirm the code",
+  confirmDescription: "Enter the six digit code your authenticator app is showing.",
+  codeLabel: "Authentication code",
+  recoveryCodeLabel: "Recovery code",
+  recoveryCodePlaceholder: "Enter a recovery code",
+  useRecoveryCodeLabel: "Use a recovery code",
+  useCodeLabel: "Use an authentication code",
+  verifyLabel: "Verify",
+  verifyingLabel: "Verifying",
+  errorFallbackLabel: "That did not work. Try again.",
+  cancelLabel: "Cancel",
+  challengeTitle: "Two-factor confirmation",
+  challengeDescription: "Confirm access to your account with the code from your authenticator app.",
+  recoveryTitle: "Recovery codes",
+  recoveryDescription: "Store these codes somewhere safe. Each one signs you in once if you lose your device.",
+  recoveryWarning: "They are shown once and cannot be read again afterwards.",
+  revealLabel: "Show codes",
+  hideLabel: "Hide codes",
+  copyLabel: "Copy",
+  copiedLabel: "Copied",
+  copyFailedLabel: "Copying is unavailable here. Select the codes manually.",
+  regenerateLabel: "Regenerate codes",
+  doneLabel: "Done",
+  disableLabel: "Disable two-factor authentication",
+  disableTitle: "Disable two-factor authentication",
+  disableDescription: "Your account will be protected by your password alone. Recovery codes stop working.",
+  disableConfirmLabel: "Disable",
+  disableCancelLabel: "Keep it on"
+};
+function resolveLabels(labels) {
+  return labels ? { ...twoFactorLabels, ...labels } : twoFactorLabels;
+}
+function messageList(errors) {
+  if (!errors) {
+    return [];
+  }
+  return (Array.isArray(errors) ? errors : [errors]).filter(
+    (message) => message.length > 0
+  );
+}
+function errorMessage(reason, fallback) {
+  return reason instanceof Error && reason.message ? reason.message : fallback;
+}
+function TwoFactorVerifyForm({
+  onSubmit,
+  errors,
+  allowRecoveryCode = false,
+  length = 6,
+  autoFocus = false,
+  submitLabel,
+  footer,
+  labels,
+  className,
+  slotName = "two-factor-verify-form"
+}) {
+  const text = resolveLabels(labels);
+  const fieldId = useId();
+  const [mode, setMode] = useState("code");
+  const [value, setValue] = useState("");
+  const [pending, setPending] = useState(false);
+  const [failure, setFailure] = useState(null);
+  const messages = [...messageList(errors), ...messageList(failure)];
+  const complete = mode === "code" ? value.length === length : value.length > 0;
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    if (pending || !complete) {
+      return;
+    }
+    setFailure(null);
+    setPending(true);
+    try {
+      await onSubmit(value, mode);
+    } catch (reason) {
+      setFailure(errorMessage(reason, text.errorFallbackLabel));
+    } finally {
+      setPending(false);
+    }
+  };
+  const switchMode = () => {
+    setMode(mode === "code" ? "recovery" : "code");
+    setValue("");
+    setFailure(null);
+  };
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      "data-mode": mode,
+      "data-pending": pending || void 0,
+      onSubmit: handleSubmit,
+      className: cn("gap-5 flex w-full flex-col", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "gap-2 flex flex-col", children: [
+          /* @__PURE__ */ jsx(Label, { htmlFor: fieldId, children: mode === "code" ? text.codeLabel : text.recoveryCodeLabel }),
+          mode === "code" ? /* @__PURE__ */ jsx(
+            InputOTP,
+            {
+              id: fieldId,
+              "data-slot": "two-factor-code-input",
+              maxLength: length,
+              value,
+              autoFocus,
+              disabled: pending,
+              onChange: setValue,
+              "aria-label": text.codeLabel,
+              children: /* @__PURE__ */ jsx(InputOTPGroup, { children: Array.from({ length }, (_, index) => /* @__PURE__ */ jsx(InputOTPSlot, { index }, index)) })
+            }
+          ) : /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: fieldId,
+              slotName: "two-factor-recovery-input",
+              value,
+              autoComplete: "one-time-code",
+              spellCheck: false,
+              disabled: pending,
+              placeholder: text.recoveryCodePlaceholder,
+              "aria-label": text.recoveryCodeLabel,
+              onChange: (event) => setValue(event.target.value)
+            }
+          )
+        ] }),
+        messages.length > 0 && /* @__PURE__ */ jsxs(Alert, { variant: "destructive", slotName: "two-factor-error", children: [
+          /* @__PURE__ */ jsx(AlertCircle, {}),
+          /* @__PURE__ */ jsx(AlertDescription, { children: messages.map((message) => /* @__PURE__ */ jsx("p", { children: message }, message)) })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "gap-3 flex flex-col", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "submit",
+              loading: pending,
+              loadingLabel: text.verifyingLabel,
+              disabled: !complete,
+              children: submitLabel ?? text.verifyLabel
+            }
+          ),
+          allowRecoveryCode && /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              disabled: pending,
+              onClick: switchMode,
+              children: mode === "code" ? text.useRecoveryCodeLabel : text.useCodeLabel
+            }
+          ),
+          footer
+        ] })
+      ]
+    }
+  );
+}
+function TwoFactorChallenge({
+  onSubmit,
+  errors,
+  allowRecoveryCode = true,
+  title,
+  description,
+  footer,
+  labels,
+  className,
+  slotName = "two-factor-challenge"
+}) {
+  const text = resolveLabels(labels);
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn("gap-6 flex w-full flex-col", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "gap-2 flex flex-col", children: [
+          /* @__PURE__ */ jsx("h2", { className: "text-2xl font-bold tracking-tight text-foreground", children: title ?? text.challengeTitle }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: description ?? text.challengeDescription })
+        ] }),
+        /* @__PURE__ */ jsx(
+          TwoFactorVerifyForm,
+          {
+            autoFocus: true,
+            allowRecoveryCode,
+            errors,
+            labels,
+            footer,
+            onSubmit
+          }
+        )
+      ]
+    }
+  );
+}
+function TwoFactorDisableButton({
+  onDisable,
+  disabled = false,
+  variant = "destructive",
+  size = "default",
+  labels,
+  className,
+  slotName = "two-factor-disable"
+}) {
+  const text = resolveLabels(labels);
+  const [open, setOpen] = useState(false);
+  const [processing, setProcessing] = useState(false);
+  const handleConfirm = async () => {
+    setProcessing(true);
+    try {
+      await onDisable();
+    } finally {
+      setProcessing(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      "data-open": open || void 0,
+      className: cn("inline-flex", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant,
+            size,
+            disabled: disabled || processing,
+            onClick: () => setOpen(true),
+            children: [
+              /* @__PURE__ */ jsx(ShieldOff, {}),
+              text.disableLabel
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ConfirmDialog,
+          {
+            open,
+            onOpenChange: setOpen,
+            title: text.disableTitle,
+            description: text.disableDescription,
+            confirmText: text.disableConfirmLabel,
+            cancelText: text.disableCancelLabel,
+            processing,
+            onConfirm: handleConfirm
+          }
+        )
+      ]
+    }
+  );
+}
+function TwoFactorRecoveryCodes({
+  codes,
+  defaultRevealed = false,
+  onRegenerate,
+  showHeading = true,
+  labels,
+  className,
+  slotName = "two-factor-recovery-codes"
+}) {
+  const text = resolveLabels(labels);
+  const [revealed, setRevealed] = useState(defaultRevealed);
+  const [copyFailed, setCopyFailed] = useState(false);
+  const [regenerating, setRegenerating] = useState(false);
+  const handleRegenerate = async () => {
+    if (!onRegenerate || regenerating) {
+      return;
+    }
+    setRegenerating(true);
+    try {
+      await onRegenerate();
+    } finally {
+      setRegenerating(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-revealed": revealed || void 0,
+      className: cn("gap-4 flex w-full flex-col", className),
+      "data-slot": slotName,
+      children: [
+        showHeading && /* @__PURE__ */ jsxs("div", { className: "gap-1 flex flex-col", children: [
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-foreground", children: text.recoveryTitle }),
+          /* @__PURE__ */ jsxs("p", { className: "text-xs font-medium text-muted-foreground", children: [
+            text.recoveryDescription,
+            " ",
+            text.recoveryWarning
+          ] })
+        ] }),
+        revealed && /* @__PURE__ */ jsx(
+          "ul",
+          {
+            "data-slot": "two-factor-recovery-list",
+            className: cn(
+              recessedSurface,
+              "gap-2 p-4 sm:grid-cols-2 grid"
+            ),
+            children: codes.map((code) => /* @__PURE__ */ jsx(
+              "li",
+              {
+                "data-slot": "two-factor-recovery-code",
+                className: cn(
+                  compactRadius,
+                  "px-2 py-1 text-sm font-medium font-mono break-all text-foreground"
+                ),
+                children: code
+              },
+              code
+            ))
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "gap-2 flex flex-wrap items-center", children: [
+          /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              "aria-pressed": revealed,
+              onClick: () => setRevealed(!revealed),
+              children: [
+                revealed ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {}),
+                revealed ? text.hideLabel : text.revealLabel
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            CopyButton,
+            {
+              value: codes.join("\n"),
+              copyLabel: text.copyLabel,
+              copiedLabel: text.copiedLabel,
+              onCopied: () => setCopyFailed(false),
+              onCopyFailed: () => setCopyFailed(true)
+            }
+          ),
+          onRegenerate && /* @__PURE__ */ jsxs(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              loading: regenerating,
+              loadingLabel: text.regenerateLabel,
+              onClick: handleRegenerate,
+              children: [
+                /* @__PURE__ */ jsx(RefreshCw, {}),
+                text.regenerateLabel
+              ]
+            }
+          )
+        ] }),
+        copyFailed && /* @__PURE__ */ jsx(
+          "p",
+          {
+            "data-slot": "two-factor-copy-failed",
+            className: "text-xs font-medium text-muted-foreground",
+            children: text.copyFailedLabel
+          }
+        )
+      ]
+    }
+  );
+}
+function TwoFactorScanStep({
+  qrCode,
+  qrCodeSvg,
+  manualSetupKey,
+  labels,
+  className,
+  slotName = "two-factor-scan-step"
+}) {
+  const text = resolveLabels(labels);
+  const [revealed, setRevealed] = useState(false);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("gap-5 flex w-full flex-col", className),
+      "data-slot": slotName,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-slot": "two-factor-qr",
+            className: cn(
+              recessedSurface,
+              "p-4 flex items-center justify-center [&_svg]:size-full [&_svg]:h-auto"
+            ),
+            children: qrCode ?? (qrCodeSvg ? /* @__PURE__ */ jsx(
+              "div",
+              {
+                "data-slot": "two-factor-qr-markup",
+                className: cn(controlRadius, "p-3 bg-card"),
+                dangerouslySetInnerHTML: { __html: qrCodeSvg }
+              }
+            ) : /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: text.qrFallbackLabel }))
+          }
+        ),
+        manualSetupKey && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-slot": "two-factor-setup-key",
+            className: "gap-2 flex flex-col",
+            children: [
+              /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-foreground", children: text.manualKeyLabel }),
+              /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground", children: text.manualKeyDescription }),
+              /* @__PURE__ */ jsxs("div", { className: "gap-2 flex flex-wrap items-center", children: [
+                /* @__PURE__ */ jsx(
+                  "code",
+                  {
+                    "data-slot": "two-factor-setup-key-value",
+                    className: cn(
+                      compactRadius,
+                      "px-3 py-2 text-sm font-medium font-mono bg-muted break-all text-foreground"
+                    ),
+                    children: revealed ? manualSetupKey : "\u2022".repeat(manualSetupKey.length)
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  Button,
+                  {
+                    type: "button",
+                    variant: "ghost",
+                    size: "sm",
+                    "aria-pressed": revealed,
+                    onClick: () => setRevealed(!revealed),
+                    children: [
+                      revealed ? /* @__PURE__ */ jsx(EyeOff, {}) : /* @__PURE__ */ jsx(Eye, {}),
+                      revealed ? text.manualKeyHideLabel : text.manualKeyRevealLabel
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  CopyButton,
+                  {
+                    value: manualSetupKey,
+                    copyLabel: text.copyLabel,
+                    copiedLabel: text.copiedLabel
+                  }
+                )
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function TwoFactorSetupDialog({
+  open,
+  onOpenChange,
+  enabled = false,
+  qrCode,
+  qrCodeSvg,
+  manualSetupKey,
+  recoveryCodes,
+  errors,
+  onConfirm,
+  onRequestSetupData,
+  onRegenerateRecoveryCodes,
+  onCompleted,
+  labels,
+  className,
+  slotName = "two-factor-setup-dialog"
+}) {
+  const text = resolveLabels(labels);
+  const [step, setStep] = useState(
+    enabled ? "recovery" : "scan"
+  );
+  const requestSetupData = useRef(onRequestSetupData);
+  const openedBefore = useRef(false);
+  useEffect(() => {
+    requestSetupData.current = onRequestSetupData;
+  }, [onRequestSetupData]);
+  useEffect(() => {
+    if (!open) {
+      openedBefore.current = false;
+      return;
+    }
+    if (openedBefore.current) {
+      return;
+    }
+    openedBefore.current = true;
+    setStep(enabled ? "recovery" : "scan");
+    if (!enabled) {
+      void requestSetupData.current?.();
+    }
+  }, [open, enabled]);
+  const ready = Boolean(qrCode || qrCodeSvg || manualSetupKey);
+  const codes = recoveryCodes ?? [];
+  const handleConfirm = async (code) => {
+    await onConfirm(code);
+    setStep("recovery");
+  };
+  const finish = () => {
+    onOpenChange(false);
+    onCompleted?.();
+  };
+  const heading = {
+    pending: text.setupTitle,
+    scan: text.scanTitle,
+    confirm: text.confirmTitle,
+    recovery: text.recoveryTitle
+  }[step];
+  const description = {
+    pending: text.setupDescription,
+    scan: text.scanDescription,
+    confirm: text.confirmDescription,
+    recovery: `${text.recoveryDescription} ${text.recoveryWarning}`
+  }[step];
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
+    DialogContent,
+    {
+      "data-step": step,
+      className: cn("max-w-md p-0", className),
+      slotName,
+      children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { className: "p-6 md:p-8", children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: heading }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: description })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "gap-5 p-6 md:p-8 pt-0 md:pt-0 flex flex-col", children: [
+          step === "scan" && (ready ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              TwoFactorScanStep,
+              {
+                qrCode,
+                qrCodeSvg,
+                manualSetupKey,
+                labels
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                onClick: () => setStep("confirm"),
+                children: text.continueLabel
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "data-slot": "two-factor-pending",
+              className: "gap-3 py-6 text-sm font-medium flex items-center justify-center text-muted-foreground",
+              children: [
+                /* @__PURE__ */ jsx(Spinner, { label: text.pendingLabel }),
+                text.pendingLabel
+              ]
+            }
+          )),
+          step === "confirm" && /* @__PURE__ */ jsx(
+            TwoFactorVerifyForm,
+            {
+              autoFocus: true,
+              errors,
+              labels,
+              onSubmit: handleConfirm,
+              footer: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: "ghost",
+                  size: "sm",
+                  onClick: () => setStep("scan"),
+                  children: text.cancelLabel
+                }
+              )
+            }
+          ),
+          step === "recovery" && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              TwoFactorRecoveryCodes,
+              {
+                codes,
+                defaultRevealed: true,
+                showHeading: false,
+                labels,
+                onRegenerate: onRegenerateRecoveryCodes
+              }
+            ),
+            /* @__PURE__ */ jsx(Button, { type: "button", onClick: finish, children: text.doneLabel })
+          ] })
+        ] })
+      ]
+    }
+  ) });
+}
+
+export { CommandPalette, DEFAULT_LABELS as DATE_FILTER_LABELS, DEFAULT_OPERATORS as DATE_FILTER_OPERATORS, DEFAULT_PRESETS as DATE_FILTER_PRESETS, DEFAULT_UNITS as DATE_FILTER_UNITS, DangerZone, DateField, DateFilter, DateFilterAll, DateFilterContent, DateFilterFixed, DateFilterItem, DateFilterPresets, DateFilterRelative, DateFilterSeparator, DateFilterTrigger, DetailEditSheet, FormDialog, FormOverlayActions, InfoField, InfoFieldGroup, LocalizedFields, NumberField, SectionHeader, SelectField, SettingsCard, SettingsEntry, SettingsField, SettingsGroup, SettingsPage, SettingsPanel, SettingsSection, StatCard, StatsGrid, TextField, ToggleRow, TwoFactorChallenge, TwoFactorDisableButton, TwoFactorRecoveryCodes, TwoFactorScanStep, TwoFactorSetupDialog, TwoFactorVerifyForm, dangerZoneLabels, decodeDateFilter, encodeDateFilter, formOverlayDefaultLabels, formatRangePreview, resolveRelativeRange, settingsLabels, summariseDateFilter, twoFactorLabels, useCommandPalette, useDateFilter };
 //# sourceMappingURL=blocks.js.map
 //# sourceMappingURL=blocks.js.map