@akira-io/ui 1.0.0

package/dist/blocks.js

@@ -0,0 +1,921 @@
+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 { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { CalendarDays, 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';
+
+function CommandPalette({
+  open,
+  onOpenChange,
+  groups,
+  onSelect,
+  query,
+  onQueryChange,
+  placeholder = "Search...",
+  noResultsLabel = "No results found",
+  emptyState,
+  className
+}) {
+  const resolvedEmptyState = emptyState ?? noResultsLabel;
+  return /* @__PURE__ */ jsxs(
+    CommandDialog,
+    {
+      open,
+      onOpenChange,
+      className,
+      children: [
+        /* @__PURE__ */ jsx(
+          CommandInput,
+          {
+            placeholder,
+            value: query,
+            onValueChange: onQueryChange
+          }
+        ),
+        /* @__PURE__ */ jsxs(CommandList, { className: "max-h-[360px]", children: [
+          /* @__PURE__ */ jsx(CommandEmpty, { children: resolvedEmptyState }),
+          groups.map((group) => /* @__PURE__ */ jsx(CommandGroup, { heading: group.heading, children: group.items.map((item) => /* @__PURE__ */ jsxs(
+            CommandItem,
+            {
+              value: item.value ?? item.label,
+              onSelect: () => onSelect(item),
+              children: [
+                item.icon && /* @__PURE__ */ jsx(item.icon, { className: "mr-2 size-4" }),
+                /* @__PURE__ */ jsx("span", { className: "font-medium", children: item.label }),
+                item.hint && /* @__PURE__ */ jsx("span", { className: "text-xs ml-auto text-muted-foreground", children: item.hint })
+              ]
+            },
+            item.id
+          )) }, group.heading))
+        ] })
+      ]
+    }
+  );
+}
+function useCommandPalette(initialOpen = false) {
+  const [open, setOpen] = useState(initialOpen);
+  const toggle = useCallback(() => setOpen((previous) => !previous), []);
+  useEffect(() => {
+    const handler = (event) => {
+      if (event.key === "k" && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+        toggle();
+      }
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [toggle]);
+  return { open, setOpen, toggle };
+}
+var DateFilterContext = createContext(null);
+var DateFilterProvider = DateFilterContext.Provider;
+function useDateFilter() {
+  const context = useContext(DateFilterContext);
+  if (context === null) {
+    throw new Error("DateFilter parts must be used inside <DateFilter>.");
+  }
+  return context;
+}
+var CALENDAR_START = new Date(2020, 0, 1);
+var CALENDAR_END = new Date((/* @__PURE__ */ new Date()).getFullYear() + 1, 11, 31);
+var toDate = (value) => value ? /* @__PURE__ */ new Date(`${value}T00:00:00`) : void 0;
+var toIso = (value) => value ? format(value, "yyyy-MM-dd") : void 0;
+function DateFilterFixedPanel() {
+  const { draft, operators, labels, setDraft, backToRoot, commit } = useDateFilter();
+  const operator = draft.operator ?? "between";
+  const isRange = operator === "between";
+  const canApply = Boolean(draft.start) && (!isRange || Boolean(draft.end));
+  return /* @__PURE__ */ jsxs("div", { className: "w-auto", children: [
+    /* @__PURE__ */ jsxs("div", { className: "gap-1 px-2 py-2 flex items-center border-b", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          onClick: backToRoot,
+          "aria-label": labels.back,
+          children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
+        }
+      ),
+      operators.map((item) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => setDraft({
+            ...draft,
+            operator: item.value
+          }),
+          className: cn(
+            "px-3 py-1.5 text-sm font-medium rounded-xl cursor-pointer transition-colors",
+            operator === item.value ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground"
+          ),
+          children: item.label
+        },
+        item.value
+      ))
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "p-3", children: isRange ? /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        mode: "range",
+        numberOfMonths: 2,
+        locale: pt,
+        captionLayout: "dropdown",
+        startMonth: CALENDAR_START,
+        endMonth: CALENDAR_END,
+        defaultMonth: toDate(draft.start),
+        selected: {
+          from: toDate(draft.start),
+          to: toDate(draft.end)
+        },
+        onSelect: (range) => setDraft({
+          ...draft,
+          start: toIso(range?.from),
+          end: toIso(range?.to)
+        })
+      }
+    ) : /* @__PURE__ */ jsx(
+      Calendar,
+      {
+        mode: "single",
+        locale: pt,
+        captionLayout: "dropdown",
+        startMonth: CALENDAR_START,
+        endMonth: CALENDAR_END,
+        defaultMonth: toDate(draft.start),
+        selected: toDate(draft.start),
+        onSelect: (date) => setDraft({ ...draft, start: toIso(date) })
+      }
+    ) }),
+    /* @__PURE__ */ jsx("div", { className: "px-3 py-2 flex justify-end border-t", children: /* @__PURE__ */ jsx(Button, { disabled: !canApply, onClick: () => commit(draft), children: labels.apply }) })
+  ] });
+}
+var WEEK_OPTIONS = { weekStartsOn: 1 };
+var subtract = {
+  day: subDays,
+  week: subWeeks,
+  month: subMonths,
+  quarter: subQuarters,
+  year: subYears
+};
+var startOf = {
+  day: startOfDay,
+  week: (date) => startOfWeek(date, WEEK_OPTIONS),
+  month: startOfMonth,
+  quarter: startOfQuarter,
+  year: startOfYear
+};
+var endOf = {
+  day: endOfDay,
+  week: (date) => endOfWeek(date, WEEK_OPTIONS),
+  month: endOfMonth,
+  quarter: endOfQuarter,
+  year: endOfYear
+};
+function resolveRelativeRange(unit, amount, includeCurrent, now = /* @__PURE__ */ new Date(), offsetAmount = 0, offsetUnit) {
+  if (amount < 1 || offsetAmount < 0) {
+    return null;
+  }
+  let anchor = includeCurrent ? now : subtract[unit](now, 1);
+  if (offsetAmount > 0) {
+    anchor = subtract[offsetUnit ?? unit](anchor, offsetAmount);
+  }
+  return {
+    start: startOf[unit](subtract[unit](anchor, amount - 1)),
+    end: endOf[unit](anchor)
+  };
+}
+function formatRangePreview(range) {
+  const sameYear = isSameYear(range.start, range.end);
+  const startPattern = sameYear ? "d MMM" : "d MMM yyyy";
+  return `${format(range.start, startPattern, { locale: pt })} - ${format(range.end, "d MMM yyyy", { locale: pt })}`;
+}
+function DateFilterRelativePanel() {
+  const { draft, units, labels, setDraft, backToRoot, commit } = useDateFilter();
+  const hasOffset = (draft.offset_amount ?? 0) > 0;
+  return /* @__PURE__ */ jsxs("div", { className: "w-96", children: [
+    /* @__PURE__ */ jsxs("div", { className: "gap-2 px-2 py-2 flex items-center border-b", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "icon",
+          onClick: backToRoot,
+          "aria-label": labels.back,
+          children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: labels.relativeTitle })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "gap-3 p-3 flex flex-col", children: [
+      /* @__PURE__ */ jsxs("div", { className: "gap-2 flex items-center", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-sm", children: labels.latest }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "number",
+            min: 1,
+            max: 120,
+            value: draft.amount ?? 1,
+            onChange: (event) => setDraft({
+              ...draft,
+              amount: Number(event.target.value)
+            }),
+            className: "w-20"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            value: draft.unit ?? "month",
+            onValueChange: (unit) => setDraft({ ...draft, unit }),
+            children: [
+              /* @__PURE__ */ jsx(SelectTrigger, { className: "flex-1", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+              /* @__PURE__ */ jsx(SelectContent, { children: units.map((unit) => /* @__PURE__ */ jsx(SelectItem, { value: unit.value, children: unit.label }, unit.value)) })
+            ]
+          }
+        ),
+        !hasOffset && /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            "aria-label": labels.startingAgo,
+            title: labels.startingAgo,
+            onClick: () => setDraft({
+              ...draft,
+              offset_amount: 1,
+              offset_unit: draft.unit ?? "month"
+            }),
+            children: /* @__PURE__ */ jsx(ArrowLeftToLine, { className: "size-4" })
+          }
+        )
+      ] }),
+      hasOffset && /* @__PURE__ */ jsxs("div", { className: "gap-2 flex items-center", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-sm", children: labels.startingAgo }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            type: "number",
+            min: 1,
+            max: 120,
+            value: draft.offset_amount ?? 1,
+            onChange: (event) => setDraft({
+              ...draft,
+              offset_amount: Number(event.target.value)
+            }),
+            className: "w-20"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            value: draft.offset_unit ?? draft.unit ?? "month",
+            onValueChange: (unit) => setDraft({
+              ...draft,
+              offset_unit: unit
+            }),
+            children: [
+              /* @__PURE__ */ jsx(SelectTrigger, { className: "flex-1", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+              /* @__PURE__ */ jsx(SelectContent, { children: units.map((unit) => /* @__PURE__ */ jsx(
+                SelectItem,
+                {
+                  value: unit.value,
+                  children: unit.label
+                },
+                unit.value
+              )) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            "aria-label": labels.removeOffset,
+            onClick: () => setDraft({
+              ...draft,
+              offset_amount: void 0,
+              offset_unit: void 0
+            }),
+            children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "text-sm flex items-center justify-between", children: [
+        labels.includeCurrent,
+        /* @__PURE__ */ jsx(
+          Switch,
+          {
+            checked: draft.include_current ?? false,
+            onCheckedChange: (checked) => setDraft({ ...draft, include_current: checked })
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "gap-3 px-3 py-2 flex items-center justify-between border-t", children: [
+      /* @__PURE__ */ jsx(RangePreview, { draft }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          disabled: !draft.unit || !draft.amount || draft.amount < 1,
+          onClick: () => commit(draft),
+          children: labels.apply
+        }
+      )
+    ] })
+  ] });
+}
+function RangePreview({ draft }) {
+  const range = resolveRelativeRange(
+    draft.unit ?? "month",
+    draft.amount ?? 0,
+    draft.include_current ?? false,
+    /* @__PURE__ */ new Date(),
+    draft.offset_amount ?? 0,
+    draft.offset_unit
+  );
+  if (!range) {
+    return /* @__PURE__ */ jsx("span", {});
+  }
+  return /* @__PURE__ */ jsxs("span", { className: "gap-2 text-sm flex items-center text-muted-foreground", children: [
+    /* @__PURE__ */ jsx(CalendarDays, { className: "size-4" }),
+    formatRangePreview(range)
+  ] });
+}
+var readable = (value) => value ? format(/* @__PURE__ */ new Date(`${value}T00:00:00`), "d 'de' MMMM 'de' yyyy", {
+  locale: pt
+}) : "";
+function summariseDateFilter(value, presets, operators, units, labels) {
+  if (value.mode === "preset") {
+    return presets.find((preset) => preset.value === value.preset)?.label ?? labels.fallback;
+  }
+  if (value.mode === "fixed") {
+    const operator = operators.find((item) => item.value === value.operator)?.label ?? "";
+    return value.operator === "between" ? `${readable(value.start)} - ${readable(value.end)}` : `${operator} ${readable(value.start)}`;
+  }
+  if (value.mode === "relative") {
+    const unitLabel = (unit) => units.find((item) => item.value === unit)?.label ?? "";
+    const base = `${labels.latest} ${value.amount ?? 1} ${unitLabel(value.unit)}`;
+    return (value.offset_amount ?? 0) > 0 ? `${base}, ${labels.ago} ${value.offset_amount} ${unitLabel(value.offset_unit ?? value.unit)}` : base;
+  }
+  return labels.all;
+}
+
+// src/blocks/date-filter/types.ts
+var DEFAULT_PRESETS = [
+  { value: "today", label: "Today" },
+  { value: "yesterday", label: "Yesterday" },
+  { value: "previous_week", label: "Previous week" },
+  { value: "previous_7_days", label: "Last 7 days" },
+  { value: "previous_30_days", label: "Last 30 days" },
+  { value: "previous_month", label: "Previous month" },
+  { value: "previous_3_months", label: "Last 3 months" },
+  { value: "previous_12_months", label: "Last 12 months" }
+];
+var DEFAULT_OPERATORS = [
+  { value: "between", label: "Between" },
+  { value: "before", label: "Before" },
+  { value: "on", label: "On" },
+  { value: "after", label: "After" }
+];
+var DEFAULT_UNITS = [
+  { value: "day", label: "days" },
+  { value: "week", label: "weeks" },
+  { value: "month", label: "months" },
+  { value: "quarter", label: "quarters" },
+  { value: "year", label: "years" }
+];
+var DEFAULT_LABELS = {
+  all: "All time",
+  fixed: "Fixed range...",
+  relative: "Relative range...",
+  relativeTitle: "Relative range",
+  apply: "Apply filter",
+  back: "Back",
+  latest: "Last",
+  ago: "offset",
+  includeCurrent: "Include current period",
+  startingAgo: "Starting",
+  removeOffset: "Remove offset",
+  fallback: "Date"
+};
+function DateFilter({
+  value,
+  onChange,
+  presets = DEFAULT_PRESETS,
+  operators = DEFAULT_OPERATORS,
+  units = DEFAULT_UNITS,
+  labels,
+  children
+}) {
+  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,
+    panel,
+    setDraft,
+    openPanel: (next, seed) => {
+      setDraft(seed);
+      setPanel(next);
+    },
+    backToRoot: () => setPanel("root"),
+    commit: (next) => {
+      onChange(next);
+      setOpen(false);
+      setPanel("root");
+    }
+  };
+  return /* @__PURE__ */ jsx(DateFilterProvider, { value: context, children: /* @__PURE__ */ jsx(
+    Popover,
+    {
+      open,
+      onOpenChange: (next) => {
+        setOpen(next);
+        if (!next) {
+          setPanel("root");
+        }
+      },
+      children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DateFilterTrigger, {}),
+        /* @__PURE__ */ jsxs(DateFilterContent, { children: [
+          /* @__PURE__ */ jsx(DateFilterAll, {}),
+          /* @__PURE__ */ jsx(DateFilterSeparator, {}),
+          /* @__PURE__ */ jsx(DateFilterPresets, {}),
+          /* @__PURE__ */ jsx(DateFilterSeparator, {}),
+          /* @__PURE__ */ jsx(DateFilterFixed, {}),
+          /* @__PURE__ */ jsx(DateFilterRelative, {})
+        ] })
+      ] })
+    }
+  ) });
+}
+function DateFilterTrigger({
+  className,
+  children
+}) {
+  const { value, presets, operators, units, labels } = useDateFilter();
+  return /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant: "outline",
+      className: cn("gap-2 justify-start", className),
+      children: [
+        /* @__PURE__ */ jsx(CalendarDays, { className: "size-4" }),
+        children ?? summariseDateFilter(
+          value,
+          presets,
+          operators,
+          units,
+          labels
+        )
+      ]
+    }
+  ) });
+}
+function DateFilterContent({
+  children,
+  className
+}) {
+  const { panel } = useDateFilter();
+  return /* @__PURE__ */ jsxs(PopoverContent, { align: "start", className: cn("p-0 w-auto", className), children: [
+    panel === "root" && /* @__PURE__ */ jsx("div", { className: "w-64 py-2 flex flex-col", children }),
+    panel === "fixed" && /* @__PURE__ */ jsx(DateFilterFixedPanel, {}),
+    panel === "relative" && /* @__PURE__ */ jsx(DateFilterRelativePanel, {})
+  ] });
+}
+function DateFilterItem({
+  active,
+  onSelect,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: onSelect,
+      className: cn(
+        "px-4 py-2 text-sm font-medium cursor-pointer text-left transition-colors",
+        active ? "bg-accent text-accent-foreground" : "text-foreground hover:bg-accent/50"
+      ),
+      children
+    }
+  );
+}
+function DateFilterSeparator() {
+  return /* @__PURE__ */ jsx("div", { className: "my-2 border-t" });
+}
+function DateFilterAll({ children }) {
+  const { value, labels, commit } = useDateFilter();
+  return /* @__PURE__ */ jsx(
+    DateFilterItem,
+    {
+      active: value.mode === "all",
+      onSelect: () => commit({ mode: "all" }),
+      children: children ?? labels.all
+    }
+  );
+}
+function DateFilterPresets({ only }) {
+  const { value, presets, commit } = useDateFilter();
+  const visible = only ? presets.filter((preset) => only.includes(preset.value)) : presets;
+  return /* @__PURE__ */ jsx(Fragment, { children: visible.map((preset) => /* @__PURE__ */ jsx(
+    DateFilterItem,
+    {
+      active: value.mode === "preset" && value.preset === preset.value,
+      onSelect: () => commit({ mode: "preset", preset: preset.value }),
+      children: preset.label
+    },
+    preset.value
+  )) });
+}
+function DateFilterFixed({ children }) {
+  const { value, labels, openPanel } = useDateFilter();
+  return /* @__PURE__ */ jsx(
+    DateFilterItem,
+    {
+      active: value.mode === "fixed",
+      onSelect: () => openPanel("fixed", {
+        mode: "fixed",
+        operator: value.operator ?? "between",
+        start: value.start,
+        end: value.end
+      }),
+      children: children ?? labels.fixed
+    }
+  );
+}
+function DateFilterRelative({ children }) {
+  const { value, labels, openPanel } = useDateFilter();
+  return /* @__PURE__ */ jsx(
+    DateFilterItem,
+    {
+      active: value.mode === "relative",
+      onSelect: () => openPanel("relative", {
+        mode: "relative",
+        unit: value.unit ?? "month",
+        amount: value.amount ?? 3,
+        include_current: value.include_current ?? false
+      }),
+      children: children ?? labels.relative
+    }
+  );
+}
+
+// src/blocks/date-filter/encode.ts
+var RANGE_SEPARATOR = "~";
+var RELATIVE_PREFIX = "previous";
+function encodeDateFilter(filter) {
+  if (filter.mode === "preset") {
+    return filter.preset ?? null;
+  }
+  if (filter.mode === "fixed") {
+    return encodeFixed(filter);
+  }
+  if (filter.mode === "relative") {
+    return encodeRelative(filter);
+  }
+  return null;
+}
+function encodeFixed(filter) {
+  if (!filter.start) {
+    return null;
+  }
+  if (filter.operator === "before") {
+    return `${RANGE_SEPARATOR}${filter.start}`;
+  }
+  if (filter.operator === "after") {
+    return `${filter.start}${RANGE_SEPARATOR}`;
+  }
+  if (filter.operator === "on") {
+    return filter.start;
+  }
+  return filter.end ? `${filter.start}${RANGE_SEPARATOR}${filter.end}` : null;
+}
+function encodeRelative(filter) {
+  if (!filter.unit || !filter.amount || filter.amount < 1) {
+    return null;
+  }
+  let value = `${RELATIVE_PREFIX}:${filter.amount}:${filter.unit}`;
+  if (filter.include_current) {
+    value += ":current";
+  }
+  if (filter.offset_amount && filter.offset_amount > 0) {
+    value += `:offset:${filter.offset_amount}:${filter.offset_unit ?? filter.unit}`;
+  }
+  return value;
+}
+function InfoField({
+  icon: Icon,
+  label,
+  value,
+  iconClassName,
+  className
+}) {
+  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 })
+    ] })
+  ] });
+}
+function InfoFieldGroup({ children, className }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), children });
+}
+function LocalizedFields({
+  locales,
+  localeLabels,
+  fields,
+  values,
+  onChange,
+  errors,
+  defaultLocale,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    Tabs,
+    {
+      defaultValue: defaultLocale ?? locales[0],
+      className: cn("w-full", className),
+      children: [
+        /* @__PURE__ */ jsx(TabsList, { className: "mb-4 rounded-2xl p-1.5 flex h-auto w-full justify-start overflow-x-auto bg-muted", children: locales.map((locale) => /* @__PURE__ */ jsx(
+          TabsTrigger,
+          {
+            value: locale,
+            className: "px-4 font-medium h-8 rounded-xl",
+            children: localeLabels?.[locale] ?? locale.toUpperCase()
+          },
+          locale
+        )) }),
+        locales.map((locale) => /* @__PURE__ */ jsx(TabsContent, { value: locale, className: "mt-0", children: /* @__PURE__ */ jsx("div", { className: "gap-4 lg:grid-cols-2 grid", children: fields.map((field) => {
+          const fieldId = `${field.name}-${locale}`;
+          const error = errors?.[`${field.name}.${locale}`];
+          const value = values[field.name]?.[locale] ?? "";
+          return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ jsx(Label, { htmlFor: fieldId, children: field.label }),
+            field.type === "textarea" ? /* @__PURE__ */ jsx(
+              Textarea,
+              {
+                id: fieldId,
+                rows: field.rows ?? 4,
+                value,
+                onChange: (event) => onChange(
+                  field.name,
+                  locale,
+                  event.target.value
+                )
+              }
+            ) : /* @__PURE__ */ jsx(
+              Input,
+              {
+                id: fieldId,
+                value,
+                onChange: (event) => onChange(
+                  field.name,
+                  locale,
+                  event.target.value
+                )
+              }
+            ),
+            error && /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-destructive", children: error })
+          ] }, field.name);
+        }) }) }, locale))
+      ]
+    }
+  );
+}
+function SectionHeader({
+  icon,
+  title,
+  description,
+  control,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "gap-4 sm:flex-row sm:items-center sm:justify-between flex flex-col",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "gap-3 flex items-center", children: [
+          icon,
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold text-foreground", children: title }),
+            description && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: description })
+          ] })
+        ] }),
+        control
+      ]
+    }
+  );
+}
+function SettingsCard({
+  icon: Icon,
+  iconClassName,
+  title,
+  description,
+  control,
+  children,
+  inset = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      "data-slot": "settings-card",
+      "data-inset": inset || void 0,
+      className: cn(
+        elevatedSurface,
+        "space-y-5 p-6 bg-card/60 text-card-foreground",
+        inset && recessedSurface,
+        className
+      ),
+      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: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: cn(
+                  "size-11 rounded-2xl flex items-center justify-center",
+                  iconClassName ?? "bg-muted text-muted-foreground"
+                ),
+                children: /* @__PURE__ */ jsx(Icon, { className: "size-5" })
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold text-foreground", children: title }),
+              /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-muted-foreground", children: description })
+            ] })
+          ] }),
+          control
+        ] }),
+        children
+      ]
+    }
+  );
+}
+function SettingsPanel({
+  title,
+  description,
+  children,
+  inset = true,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "settings-panel",
+      "data-inset": inset || void 0,
+      className: cn(
+        elevatedSurface,
+        "space-y-4 p-5 bg-card/60 text-card-foreground",
+        inset && recessedSurface,
+        className
+      ),
+      children: [
+        (title || description) && /* @__PURE__ */ jsxs("div", { children: [
+          title && /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-foreground", children: title }),
+          description && /* @__PURE__ */ jsx("p", { className: "mt-1 text-xs font-medium text-muted-foreground", children: description })
+        ] }),
+        children
+      ]
+    }
+  );
+}
+function ToggleRow({
+  id,
+  label,
+  description,
+  checked,
+  onChange,
+  disabled
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "gap-4 py-1 flex items-center justify-between", children: [
+    /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
+      /* @__PURE__ */ jsx(
+        Label,
+        {
+          htmlFor: id,
+          className: "text-sm font-medium text-foreground",
+          children: label
+        }
+      ),
+      description && /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-muted-foreground", children: description })
+    ] }),
+    /* @__PURE__ */ jsx(
+      Switch,
+      {
+        id,
+        checked,
+        onCheckedChange: onChange,
+        disabled
+      }
+    )
+  ] });
+}
+function resolveTrend(trend) {
+  if (trend === null || trend === void 0 || Number.isNaN(trend)) {
+    return null;
+  }
+  const normalized = Math.abs(trend) < 0.05 ? 0 : trend;
+  if (normalized === 0) {
+    return { label: "0%", tone: "neutral", icon: ArrowRight };
+  }
+  if (normalized > 0) {
+    return {
+      label: `+${normalized.toFixed(1)}%`,
+      tone: "positive",
+      icon: ArrowUpRight
+    };
+  }
+  return {
+    label: `${normalized.toFixed(1)}%`,
+    tone: "negative",
+    icon: ArrowDownRight
+  };
+}
+var trendToneClass = {
+  positive: "text-success",
+  negative: "text-destructive",
+  neutral: "text-muted-foreground"
+};
+function StatCard({
+  title,
+  value,
+  icon: Icon,
+  iconClassName = "bg-muted text-muted-foreground",
+  trend,
+  comparisonLabel,
+  inset = false,
+  className
+}) {
+  const resolvedTrend = resolveTrend(trend);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "stat-card",
+      "data-inset": inset || void 0,
+      className: cn(
+        elevatedSurface,
+        "p-6 min-w-0 flex h-full flex-col justify-between bg-card/60 text-card-foreground",
+        inset && recessedSurface,
+        className
+      ),
+      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" }) }),
+          resolvedTrend && /* @__PURE__ */ jsxs("div", { className: "min-w-0 text-right", children: [
+            /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: cn(
+                  "text-sm font-semibold inline-flex items-center",
+                  trendToneClass[resolvedTrend.tone]
+                ),
+                children: [
+                  resolvedTrend.label,
+                  /* @__PURE__ */ jsx(resolvedTrend.icon, { className: "ml-1 size-4" })
+                ]
+              }
+            ),
+            comparisonLabel && /* @__PURE__ */ jsx("p", { className: "mt-1 font-medium tracking-wider text-[10px] whitespace-nowrap text-muted-foreground uppercase", children: comparisonLabel })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: "mb-1 text-xs font-medium tracking-wider break-words text-muted-foreground uppercase", children: title }),
+          /* @__PURE__ */ jsx("p", { className: "text-3xl font-bold truncate text-foreground tabular-nums", children: value })
+        ] })
+      ]
+    }
+  );
+}
+function StatsGrid({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "gap-6 [&>*]:min-w-0 grid [grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))]",
+        className
+      ),
+      children
+    }
+  );
+}
+
+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 };
+//# sourceMappingURL=blocks.js.map
+//# sourceMappingURL=blocks.js.map