@unicitylabs/sphere-ui 0.1.0

package/dist/index.js

@@ -0,0 +1,1095 @@
+// src/components/Input.tsx
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var inputBase = "w-full px-4 py-2.5 bg-neutral-100 dark:bg-white/6 text-neutral-900 dark:text-white placeholder-neutral-400 dark:placeholder-white/25 rounded-xl border border-neutral-200 dark:border-white/8 focus:outline-none focus:border-orange-500 dark:focus:border-brand-orange transition-colors disabled:opacity-50";
+var inputError = "border-red-400 dark:border-red-500/50 focus:border-red-500";
+var Input = forwardRef(
+  ({ className = "", error, ...props }, ref) => /* @__PURE__ */ jsx(
+    "input",
+    {
+      ref,
+      className: `${inputBase} ${error ? inputError : ""} ${className}`,
+      ...props
+    }
+  )
+);
+Input.displayName = "Input";
+var Textarea = forwardRef(
+  ({ className = "", error, ...props }, ref) => /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ref,
+      className: `${inputBase} min-h-20 resize-y ${error ? inputError : ""} ${className}`,
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+var Select = forwardRef(
+  ({ className = "", error, children, ...props }, ref) => /* @__PURE__ */ jsx(
+    "select",
+    {
+      ref,
+      className: `${inputBase} cursor-pointer appearance-none bg-[length:16px] bg-[right_8px_center] bg-no-repeat ${error ? inputError : ""} ${className}`,
+      style: {
+        backgroundImage: `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(255,255,255,0.28)' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")`,
+        paddingRight: "2rem"
+      },
+      ...props,
+      children
+    }
+  )
+);
+Select.displayName = "Select";
+var buttonVariants = {
+  primary: "bg-orange-500 dark:bg-brand-orange hover:bg-orange-600 dark:hover:bg-brand-orange-dark text-white shadow-md shadow-orange-500/15 hover:shadow-lg hover:shadow-orange-500/20 active:translate-y-0 hover:-translate-y-px",
+  secondary: "bg-neutral-100 dark:bg-white/6 text-neutral-700 dark:text-white/70 border border-neutral-200 dark:border-white/8 hover:bg-neutral-200 dark:hover:bg-white/10 hover:text-neutral-900 dark:hover:text-white",
+  danger: "bg-red-500/10 text-red-500 dark:text-red-400 border border-red-500/20 hover:bg-red-500/20",
+  ghost: "text-neutral-500 dark:text-white/45 hover:text-neutral-900 dark:hover:text-white hover:bg-neutral-100 dark:hover:bg-white/6"
+};
+var Button = forwardRef(
+  ({ variant = "primary", icon, children, className = "", disabled, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "button",
+    {
+      ref,
+      disabled,
+      className: `inline-flex items-center justify-center gap-2 px-4 py-2.5 rounded-xl text-sm font-semibold transition-all cursor-pointer disabled:opacity-40 disabled:pointer-events-none ${buttonVariants[variant]} ${className}`,
+      ...props,
+      children: [
+        icon,
+        children
+      ]
+    }
+  )
+);
+Button.displayName = "Button";
+
+// src/components/Field.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function Field({ label, required, error, hint, className, children }) {
+  return /* @__PURE__ */ jsxs2("div", { className, children: [
+    /* @__PURE__ */ jsxs2("label", { className: "text-xs block mb-1", style: { color: "var(--text-muted)" }, children: [
+      label,
+      required && /* @__PURE__ */ jsx2("span", { className: "text-red-400 ml-0.5", children: "*" })
+    ] }),
+    children,
+    hint && /* @__PURE__ */ jsx2("p", { className: "text-[10px] mt-1", style: { color: "var(--text-muted)" }, children: hint }),
+    error && /* @__PURE__ */ jsx2("p", { className: "text-xs text-red-400 mt-1", children: error })
+  ] });
+}
+function Section({ title, children }) {
+  return /* @__PURE__ */ jsxs2("div", { children: [
+    /* @__PURE__ */ jsx2("h2", { className: "text-sm font-semibold mb-3 pb-2 border-b", style: { color: "var(--text-secondary)", borderColor: "var(--border)" }, children: title }),
+    children
+  ] });
+}
+
+// src/components/FormModal.tsx
+import { useEffect } from "react";
+import { createPortal } from "react-dom";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function FormModal({ title, isOpen, onClose, children, maxWidth = "max-w-lg" }) {
+  useEffect(() => {
+    if (!isOpen) return;
+    const handler = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [isOpen, onClose]);
+  if (!isOpen) return null;
+  return createPortal(
+    /* @__PURE__ */ jsx3("div", { className: "fixed inset-0 flex items-start justify-center z-50 p-4 overflow-y-auto", style: { background: "rgba(0,0,0,0.7)" }, children: /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: `w-full ${maxWidth} mt-12 mb-12 animate-fade-in`,
+        style: {
+          background: "#111111",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--radius-lg)",
+          boxShadow: "var(--shadow-lg)",
+          padding: "1.5rem"
+        },
+        children: [
+          /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between mb-5", children: [
+            /* @__PURE__ */ jsx3("h2", { style: { fontFamily: "var(--font-display)", fontSize: "1.05rem", letterSpacing: "0.04em", color: "var(--text-primary)" }, children: title }),
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                onClick: onClose,
+                className: "text-xl leading-none px-2 transition-colors",
+                style: { color: "var(--text-muted)" },
+                onMouseEnter: (e) => e.currentTarget.style.color = "var(--text-primary)",
+                onMouseLeave: (e) => e.currentTarget.style.color = "var(--text-muted)",
+                children: "\xD7"
+              }
+            )
+          ] }),
+          children
+        ]
+      }
+    ) }),
+    document.body
+  );
+}
+
+// src/components/ConfirmDialog.tsx
+import { useEffect as useEffect2 } from "react";
+import { createPortal as createPortal2 } from "react-dom";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function ConfirmDialog({
+  isOpen,
+  title,
+  message,
+  confirmLabel = "Confirm",
+  variant = "default",
+  onConfirm,
+  onCancel
+}) {
+  useEffect2(() => {
+    if (!isOpen) return;
+    const handler = (e) => {
+      if (e.key === "Escape") onCancel();
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [isOpen, onCancel]);
+  if (!isOpen) return null;
+  return createPortal2(
+    /* @__PURE__ */ jsx4("div", { className: "fixed inset-0 flex items-center justify-center z-50 p-4", style: { background: "rgba(0,0,0,0.7)" }, children: /* @__PURE__ */ jsxs4("div", { className: "admin-card p-6 w-full max-w-sm animate-fade-in", children: [
+      /* @__PURE__ */ jsx4("h3", { className: "font-semibold text-white mb-2", children: title }),
+      /* @__PURE__ */ jsx4("p", { className: "text-sm mb-5", style: { color: "var(--text-muted)" }, children: message }),
+      /* @__PURE__ */ jsxs4("div", { className: "flex gap-3", children: [
+        /* @__PURE__ */ jsx4("button", { onClick: onCancel, className: "btn-secondary flex-1", children: "Cancel" }),
+        /* @__PURE__ */ jsx4(
+          "button",
+          {
+            onClick: onConfirm,
+            className: `flex-1 ${variant === "danger" ? "btn-danger" : "btn-primary"}`,
+            children: confirmLabel
+          }
+        )
+      ] })
+    ] }) }),
+    document.body
+  );
+}
+
+// src/components/StatusBadge.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var STATUS_COLORS = {
+  ACTIVE: "badge-green",
+  DRAFT: "badge-gray",
+  PAUSED: "badge-yellow",
+  EXPIRED: "badge-red",
+  ENDED: "badge-red",
+  AWARDED: "badge-green",
+  REJECTED: "badge-red"
+};
+function StatusBadge({ status, className = "" }) {
+  return /* @__PURE__ */ jsx5("span", { className: `badge ${STATUS_COLORS[status] ?? "badge-gray"} ${className}`, children: status });
+}
+
+// src/components/SearchInput.tsx
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+function SearchInput({ value, onChange, placeholder = "Search..." }) {
+  return /* @__PURE__ */ jsxs5("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs5(
+      "svg",
+      {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "none",
+        stroke: "currentColor",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        className: "absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4",
+        style: { color: "var(--text-muted)" },
+        children: [
+          /* @__PURE__ */ jsx6("circle", { cx: "11", cy: "11", r: "8" }),
+          /* @__PURE__ */ jsx6("path", { d: "m21 21-4.35-4.35" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx6(
+      "input",
+      {
+        type: "text",
+        className: "admin-input !pl-9 !pr-8",
+        value,
+        onChange: (e) => onChange(e.target.value),
+        placeholder
+      }
+    ),
+    value && /* @__PURE__ */ jsx6(
+      "button",
+      {
+        onClick: () => onChange(""),
+        className: "absolute right-2 top-1/2 -translate-y-1/2 text-sm px-1",
+        style: { color: "var(--text-muted)" },
+        onMouseEnter: (e) => e.currentTarget.style.color = "var(--text-primary)",
+        onMouseLeave: (e) => e.currentTarget.style.color = "var(--text-muted)",
+        children: "\xD7"
+      }
+    )
+  ] });
+}
+
+// src/components/EmptyState.tsx
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function EmptyState({ title, description, action }) {
+  return /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center justify-center py-16 text-center", children: [
+    /* @__PURE__ */ jsx7(
+      "div",
+      {
+        className: "w-12 h-12 rounded-xl flex items-center justify-center mb-4",
+        style: { background: "var(--bg-elevated)", border: "1px solid var(--border)" },
+        children: /* @__PURE__ */ jsx7("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", style: { color: "var(--text-muted)" }, children: /* @__PURE__ */ jsx7("path", { d: "M20 13V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v7m16 0v5a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-5m16 0h-2.586a1 1 0 0 0-.707.293l-2.414 2.414a1 1 0 0 1-.707.293h-3.172a1 1 0 0 1-.707-.293l-2.414-2.414A1 1 0 0 0 6.586 13H4" }) })
+      }
+    ),
+    /* @__PURE__ */ jsx7("div", { className: "text-sm font-medium mb-1", style: { color: "var(--text-secondary)" }, children: title }),
+    description && /* @__PURE__ */ jsx7("div", { className: "text-xs mb-4", style: { color: "var(--text-muted)" }, children: description }),
+    action
+  ] });
+}
+
+// src/components/CustomSelect.tsx
+import { useState, useRef, useEffect as useEffect3 } from "react";
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+function CustomSelect({
+  options,
+  value,
+  onChange,
+  placeholder,
+  className = "",
+  size = "md"
+}) {
+  const [open, setOpen] = useState(false);
+  const ref = useRef(null);
+  const selected = options.find((o) => o.value === value);
+  const label = selected?.label ?? placeholder ?? "Select...";
+  useEffect3(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (ref.current && !ref.current.contains(e.target)) setOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open]);
+  useEffect3(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("keydown", handler);
+    return () => document.removeEventListener("keydown", handler);
+  }, [open]);
+  const textSize = size === "sm" ? "text-xs" : "text-sm";
+  return /* @__PURE__ */ jsxs7("div", { ref, className: `relative ${className}`, children: [
+    /* @__PURE__ */ jsxs7(
+      "button",
+      {
+        type: "button",
+        onClick: () => setOpen((o) => !o),
+        className: `admin-input w-full flex items-center justify-between gap-2 ${textSize} text-left`,
+        style: { color: selected ? "var(--text-primary)" : "var(--text-muted)" },
+        children: [
+          /* @__PURE__ */ jsx8("span", { className: "truncate", children: label }),
+          /* @__PURE__ */ jsx8(
+            "svg",
+            {
+              width: "12",
+              height: "12",
+              viewBox: "0 0 12 12",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              className: "flex-shrink-0 transition-transform",
+              style: {
+                color: "var(--text-muted)",
+                transform: open ? "rotate(180deg)" : "rotate(0deg)"
+              },
+              children: /* @__PURE__ */ jsx8("path", { d: "M3 4.5L6 7.5L9 4.5" })
+            }
+          )
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsx8(
+      "div",
+      {
+        className: "absolute left-0 right-0 top-full mt-1 z-30 py-1 max-h-48 overflow-y-auto",
+        style: {
+          background: "var(--bg-elevated)",
+          border: "1px solid var(--border)",
+          borderRadius: "var(--radius-md)",
+          boxShadow: "0 8px 24px rgba(0,0,0,0.4)"
+        },
+        children: options.map((opt) => /* @__PURE__ */ jsx8(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              onChange(opt.value);
+              setOpen(false);
+            },
+            className: `block w-full text-left px-3 py-1.5 ${textSize} transition-colors`,
+            style: {
+              color: opt.value === value ? "var(--accent-text)" : "var(--text-secondary)",
+              background: opt.value === value ? "var(--accent-glow)" : "transparent"
+            },
+            onMouseEnter: (e) => {
+              if (opt.value !== value) e.currentTarget.style.background = "var(--bg-hover)";
+            },
+            onMouseLeave: (e) => {
+              e.currentTarget.style.background = opt.value === value ? "var(--accent-glow)" : "transparent";
+            },
+            children: opt.label
+          },
+          opt.value
+        ))
+      }
+    )
+  ] });
+}
+
+// src/components/PageShell.tsx
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+function PageShell({ title, subtitle, action, maxWidth, children }) {
+  return /* @__PURE__ */ jsxs8("div", { className: `p-6 lg:p-8 ${maxWidth ?? ""}`, children: [
+    /* @__PURE__ */ jsxs8("div", { className: "page-header", children: [
+      /* @__PURE__ */ jsxs8("div", { children: [
+        /* @__PURE__ */ jsx9("h1", { className: "page-title", children: title }),
+        subtitle && /* @__PURE__ */ jsx9("p", { className: "page-subtitle", children: subtitle })
+      ] }),
+      action
+    ] }),
+    /* @__PURE__ */ jsx9("div", { className: "animate-fade-in", children })
+  ] });
+}
+
+// src/components/DataTable.tsx
+import { useState as useState2, useMemo } from "react";
+import {
+  useReactTable,
+  getCoreRowModel,
+  getSortedRowModel,
+  getFilteredRowModel,
+  flexRender
+} from "@tanstack/react-table";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+function DataTable({
+  columns,
+  data,
+  isLoading,
+  emptyMessage = "No data found",
+  searchPlaceholder,
+  enableSearch = true,
+  onRowClick
+}) {
+  const [sorting, setSorting] = useState2([]);
+  const [globalFilter, setGlobalFilter] = useState2("");
+  const stableColumns = useMemo(() => columns, [columns]);
+  const table = useReactTable({
+    data,
+    columns: stableColumns,
+    state: { sorting, globalFilter },
+    onSortingChange: setSorting,
+    onGlobalFilterChange: setGlobalFilter,
+    getCoreRowModel: getCoreRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    getFilteredRowModel: getFilteredRowModel()
+  });
+  if (isLoading) {
+    return /* @__PURE__ */ jsx10("div", { className: "py-12 text-center", style: { color: "var(--text-muted)" }, children: "Loading\u2026" });
+  }
+  return /* @__PURE__ */ jsxs9("div", { children: [
+    enableSearch && /* @__PURE__ */ jsx10("div", { className: "mb-4 max-w-xs", children: /* @__PURE__ */ jsx10(
+      SearchInput,
+      {
+        value: globalFilter,
+        onChange: setGlobalFilter,
+        placeholder: searchPlaceholder ?? "Search..."
+      }
+    ) }),
+    table.getRowModel().rows.length === 0 ? /* @__PURE__ */ jsx10(EmptyState, { title: emptyMessage }) : /* @__PURE__ */ jsx10("div", { className: "admin-card overflow-hidden", children: /* @__PURE__ */ jsxs9("table", { className: "admin-table", children: [
+      /* @__PURE__ */ jsx10("thead", { children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsx10("tr", { children: hg.headers.map((header) => /* @__PURE__ */ jsx10(
+        "th",
+        {
+          className: header.column.getCanSort() ? "cursor-pointer select-none" : "",
+          onClick: header.column.getToggleSortingHandler(),
+          children: /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-1", children: [
+            flexRender(header.column.columnDef.header, header.getContext()),
+            header.column.getIsSorted() === "asc" && /* @__PURE__ */ jsx10("span", { style: { color: "var(--accent-text)" }, children: "\u25B2" }),
+            header.column.getIsSorted() === "desc" && /* @__PURE__ */ jsx10("span", { style: { color: "var(--accent-text)" }, children: "\u25BC" })
+          ] })
+        },
+        header.id
+      )) }, hg.id)) }),
+      /* @__PURE__ */ jsx10("tbody", { children: table.getRowModel().rows.map((row) => /* @__PURE__ */ jsx10(
+        "tr",
+        {
+          onClick: () => onRowClick?.(row.original),
+          className: onRowClick ? "cursor-pointer" : "",
+          style: onRowClick ? { transition: "background 0.15s" } : void 0,
+          onMouseEnter: (e) => {
+            if (onRowClick) e.currentTarget.style.background = "rgba(255,255,255,0.03)";
+          },
+          onMouseLeave: (e) => {
+            if (onRowClick) e.currentTarget.style.background = "";
+          },
+          children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx10("td", { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))
+        },
+        row.id
+      )) })
+    ] }) })
+  ] });
+}
+
+// src/components/AlertBanner.tsx
+import { jsx as jsx11, jsxs as jsxs10 } from "react/jsx-runtime";
+var STYLES = {
+  warning: {
+    bg: "rgba(251,191,36,0.06)",
+    border: "rgba(251,191,36,0.18)",
+    icon: "\u26A0\uFE0F",
+    titleColor: "#fbbf24"
+  },
+  info: {
+    bg: "rgba(96,165,250,0.06)",
+    border: "rgba(96,165,250,0.18)",
+    icon: "\u2139\uFE0F",
+    titleColor: "#60a5fa"
+  }
+};
+function AlertBanner({ type, title, children }) {
+  const s = STYLES[type];
+  return /* @__PURE__ */ jsx11(
+    "div",
+    {
+      className: "rounded-lg p-3 text-sm",
+      style: { background: s.bg, border: `1px solid ${s.border}` },
+      children: /* @__PURE__ */ jsxs10("div", { className: "flex items-start gap-2", children: [
+        /* @__PURE__ */ jsx11("span", { className: "flex-shrink-0 text-sm leading-5", children: s.icon }),
+        /* @__PURE__ */ jsxs10("div", { children: [
+          /* @__PURE__ */ jsx11("div", { className: "font-medium text-xs mb-0.5", style: { color: s.titleColor }, children: title }),
+          /* @__PURE__ */ jsx11("div", { style: { color: "var(--text-muted)", fontSize: "0.75rem", lineHeight: "1.4" }, children })
+        ] })
+      ] })
+    }
+  );
+}
+
+// src/components/AddressDisplay.tsx
+import { useState as useState3, useCallback } from "react";
+import { Fragment, jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+function truncateAddress(address) {
+  const prefix = "DIRECT://";
+  if (address.startsWith(prefix)) {
+    const hex = address.slice(prefix.length);
+    if (hex.length > 18) {
+      return `${prefix}${hex.slice(0, 12)}...${hex.slice(-6)}`;
+    }
+  }
+  if (address.length > 24) {
+    return `${address.slice(0, 18)}...${address.slice(-6)}`;
+  }
+  return address;
+}
+function AddressDisplay({ address, nametag, truncate = true }) {
+  const [copied, setCopied] = useState3(false);
+  const handleCopy = useCallback(() => {
+    navigator.clipboard.writeText(address).then(() => {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 1500);
+    });
+  }, [address]);
+  const displayAddress = truncate ? truncateAddress(address) : address;
+  return /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1.5 min-w-0", children: [
+    /* @__PURE__ */ jsx12("div", { className: "min-w-0 flex-1", children: nametag ? /* @__PURE__ */ jsxs11(Fragment, { children: [
+      /* @__PURE__ */ jsxs11("div", { className: "text-sm font-medium", style: { color: "var(--text-primary)" }, children: [
+        "@",
+        nametag
+      ] }),
+      /* @__PURE__ */ jsx12(
+        "div",
+        {
+          className: "text-[11px] font-mono truncate",
+          style: { color: "var(--text-muted)" },
+          title: address,
+          children: displayAddress
+        }
+      )
+    ] }) : /* @__PURE__ */ jsx12(
+      "div",
+      {
+        className: "text-xs font-mono truncate",
+        style: { color: "var(--text-secondary)" },
+        title: address,
+        children: displayAddress
+      }
+    ) }),
+    /* @__PURE__ */ jsx12(
+      "button",
+      {
+        onClick: handleCopy,
+        className: "shrink-0 p-1 rounded transition-colors cursor-pointer",
+        style: { color: copied ? "var(--accent-text)" : "var(--text-muted)" },
+        onMouseEnter: (e) => {
+          if (!copied) e.currentTarget.style.color = "var(--text-secondary)";
+        },
+        onMouseLeave: (e) => {
+          if (!copied) e.currentTarget.style.color = "var(--text-muted)";
+        },
+        title: copied ? "Copied!" : "Copy address",
+        children: copied ? /* @__PURE__ */ jsx12("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx12("path", { d: "M20 6L9 17l-5-5" }) }) : /* @__PURE__ */ jsxs11("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+          /* @__PURE__ */ jsx12("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
+          /* @__PURE__ */ jsx12("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+        ] })
+      }
+    )
+  ] });
+}
+
+// src/components/JsonPanel.tsx
+import { useState as useState4, useEffect as useEffect4, useRef as useRef2, useCallback as useCallback2 } from "react";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+function JsonPanel({
+  value,
+  onChange,
+  excludeKeys = [],
+  title = "JSON"
+}) {
+  const [text, setText] = useState4("");
+  const [parseError, setParseError] = useState4(null);
+  const [isEditing, setIsEditing] = useState4(false);
+  const textareaRef = useRef2(null);
+  useEffect4(() => {
+    if (isEditing) return;
+    const filtered = { ...value };
+    for (const key of excludeKeys) {
+      delete filtered[key];
+    }
+    const clean = JSON.parse(JSON.stringify(filtered));
+    setText(JSON.stringify(clean, null, 2));
+    setParseError(null);
+  }, [value, isEditing, excludeKeys]);
+  const handleChange = useCallback2((newText) => {
+    setText(newText);
+    try {
+      const parsed = JSON.parse(newText);
+      setParseError(null);
+      onChange(parsed);
+    } catch (e) {
+      setParseError(e instanceof Error ? e.message : "Invalid JSON");
+    }
+  }, [onChange]);
+  const handleFocus = useCallback2(() => setIsEditing(true), []);
+  const handleBlur = useCallback2(() => setIsEditing(false), []);
+  const [copied, setCopied] = useState4(false);
+  const handleCopy = useCallback2(async () => {
+    await navigator.clipboard.writeText(text);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  }, [text]);
+  const lineCount = text.split("\n").length;
+  return /* @__PURE__ */ jsxs12("div", { className: "flex flex-col h-full", style: { minWidth: 320 }, children: [
+    /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between px-3 py-2", style: { borderBottom: "1px solid var(--border)" }, children: [
+      /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs12("span", { className: "text-xs font-mono font-semibold", style: { color: "var(--text-muted)" }, children: [
+          "{ }",
+          " ",
+          title
+        ] }),
+        parseError && /* @__PURE__ */ jsx13("span", { className: "text-[10px] px-1.5 py-0.5 rounded", style: { background: "rgba(239,68,68,0.1)", color: "#f87171" }, children: "Error" })
+      ] }),
+      /* @__PURE__ */ jsx13(
+        "button",
+        {
+          onClick: handleCopy,
+          className: "text-[10px] px-2 py-1 rounded transition-colors",
+          style: {
+            color: copied ? "#34d399" : "var(--text-muted)",
+            background: "var(--bg-surface)",
+            border: `1px solid ${copied ? "rgba(52,211,153,0.3)" : "var(--border)"}`
+          },
+          onMouseEnter: (e) => {
+            if (!copied) e.currentTarget.style.color = "var(--text-primary)";
+          },
+          onMouseLeave: (e) => {
+            if (!copied) e.currentTarget.style.color = "var(--text-muted)";
+          },
+          title: "Copy JSON",
+          children: copied ? "Copied!" : "Copy"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx13("div", { className: "flex-1 relative overflow-hidden", children: /* @__PURE__ */ jsxs12("div", { className: "absolute inset-0 flex overflow-auto", children: [
+      /* @__PURE__ */ jsx13(
+        "div",
+        {
+          className: "shrink-0 text-right pr-2 pt-3 select-none",
+          style: {
+            fontFamily: "var(--font-mono, monospace)",
+            fontSize: "0.7rem",
+            lineHeight: "1.35rem",
+            color: "var(--text-muted)",
+            opacity: 0.4,
+            width: 36,
+            background: "var(--bg-surface)",
+            borderRight: "1px solid var(--border)"
+          },
+          children: Array.from({ length: lineCount }, (_, i) => /* @__PURE__ */ jsx13("div", { children: i + 1 }, i))
+        }
+      ),
+      /* @__PURE__ */ jsx13(
+        "textarea",
+        {
+          ref: textareaRef,
+          value: text,
+          onChange: (e) => handleChange(e.target.value),
+          onFocus: handleFocus,
+          onBlur: handleBlur,
+          spellCheck: false,
+          className: "flex-1 resize-none outline-none p-3",
+          style: {
+            fontFamily: "var(--font-mono, monospace)",
+            fontSize: "0.7rem",
+            lineHeight: "1.35rem",
+            color: parseError ? "#f87171" : "var(--text-secondary)",
+            background: "transparent",
+            border: "none",
+            tabSize: 2
+          }
+        }
+      )
+    ] }) }),
+    parseError && /* @__PURE__ */ jsx13("div", { className: "px-3 py-1.5 text-[10px]", style: { background: "rgba(239,68,68,0.06)", color: "#f87171", borderTop: "1px solid rgba(239,68,68,0.15)" }, children: parseError })
+  ] });
+}
+function JsonToggleButton({ active, onClick }) {
+  return /* @__PURE__ */ jsx13(
+    "button",
+    {
+      onClick,
+      className: "text-xs px-2.5 py-1 rounded transition-all",
+      style: {
+        fontFamily: "var(--font-mono, monospace)",
+        fontWeight: active ? 600 : 400,
+        color: active ? "#FF6F00" : "var(--text-muted)",
+        background: active ? "rgba(255,111,0,0.08)" : "var(--bg-surface)",
+        border: `1px solid ${active ? "rgba(255,111,0,0.2)" : "var(--border)"}`
+      },
+      onMouseEnter: (e) => {
+        if (!active) {
+          e.currentTarget.style.color = "var(--text-primary)";
+          e.currentTarget.style.borderColor = "var(--text-muted)";
+        }
+      },
+      onMouseLeave: (e) => {
+        if (!active) {
+          e.currentTarget.style.color = "var(--text-muted)";
+          e.currentTarget.style.borderColor = "var(--border)";
+        }
+      },
+      title: active ? "Hide JSON panel" : "Show JSON panel",
+      children: "{ }"
+    }
+  );
+}
+
+// src/components/ChainInput.tsx
+import { useState as useState5, useId } from "react";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+var TAG_PALETTES = [
+  { bg: "rgba(16, 185, 129, 0.12)", color: "#34d399", border: "rgba(16, 185, 129, 0.2)" },
+  { bg: "rgba(59, 130, 246, 0.12)", color: "#60a5fa", border: "rgba(59, 130, 246, 0.2)" },
+  { bg: "rgba(168, 85, 247, 0.12)", color: "#c084fc", border: "rgba(168, 85, 247, 0.2)" },
+  { bg: "rgba(6, 182, 212, 0.12)", color: "#22d3ee", border: "rgba(6, 182, 212, 0.2)" },
+  { bg: "rgba(245, 158, 11, 0.12)", color: "#fbbf24", border: "rgba(245, 158, 11, 0.2)" },
+  { bg: "rgba(244, 63, 94, 0.12)", color: "#fb7185", border: "rgba(244, 63, 94, 0.2)" },
+  { bg: "rgba(255, 111, 0, 0.12)", color: "#FF6F00", border: "rgba(255, 111, 0, 0.2)" },
+  { bg: "rgba(132, 204, 22, 0.12)", color: "#a3e635", border: "rgba(132, 204, 22, 0.2)" },
+  { bg: "rgba(236, 72, 153, 0.12)", color: "#f472b6", border: "rgba(236, 72, 153, 0.2)" },
+  { bg: "rgba(99, 102, 241, 0.12)", color: "#818cf8", border: "rgba(99, 102, 241, 0.2)" }
+];
+function tagColor(tag) {
+  let hash = 0;
+  for (let i = 0; i < tag.length; i++) hash = (hash << 5) - hash + tag.charCodeAt(i) | 0;
+  return TAG_PALETTES[Math.abs(hash) % TAG_PALETTES.length];
+}
+function ChainInput({ chains, suggestions, onChange, size = "md" }) {
+  const [input, setInput] = useState5("");
+  const [open, setOpen] = useState5(false);
+  const inputId = useId();
+  const entries = Object.entries(chains);
+  const available = suggestions.filter((s) => !(s in chains) && (!input || s.toLowerCase().includes(input.toLowerCase())));
+  const trimmed = input.trim().toLowerCase().replace(/\s+/g, "_");
+  const isNew = trimmed && !(trimmed in chains) && !available.includes(trimmed);
+  const addChain = (name) => {
+    const normalized = name.trim().toLowerCase().replace(/\s+/g, "_");
+    if (normalized && !(normalized in chains)) {
+      onChange({ ...chains, [normalized]: 0 });
+    }
+    setInput("");
+    setOpen(false);
+  };
+  const removeChain = (name) => {
+    const next = { ...chains };
+    delete next[name];
+    onChange(next);
+  };
+  const setOrder = (name, order) => {
+    onChange({ ...chains, [name]: Math.max(0, order) });
+  };
+  const handleKeyDown = (e) => {
+    if ((e.key === "Enter" || e.key === ",") && input.trim()) {
+      e.preventDefault();
+      addChain(input);
+    }
+    if (e.key === "Backspace" && !input && entries.length > 0) {
+      removeChain(entries[entries.length - 1][0]);
+    }
+  };
+  const isSm = size === "sm";
+  const textSize = isSm ? "text-[0.6rem]" : "text-[0.65rem]";
+  const minH = isSm ? "min-h-[32px]" : "min-h-[38px]";
+  return /* @__PURE__ */ jsxs13("div", { className: "relative", children: [
+    /* @__PURE__ */ jsxs13(
+      "div",
+      {
+        className: `admin-input flex flex-wrap gap-1.5 !p-1.5 ${minH} cursor-text`,
+        onClick: () => document.getElementById(inputId)?.focus(),
+        children: [
+          entries.map(([name, order]) => {
+            const c = tagColor(name);
+            return /* @__PURE__ */ jsxs13(
+              "span",
+              {
+                className: `inline-flex items-center gap-1 ${textSize} font-semibold px-2 py-0.5 rounded`,
+                style: { background: c.bg, color: c.color, border: `1px solid ${c.border}` },
+                children: [
+                  name,
+                  /* @__PURE__ */ jsx14(
+                    "input",
+                    {
+                      type: "number",
+                      min: 0,
+                      value: order,
+                      onChange: (e) => setOrder(name, Number(e.target.value)),
+                      className: `w-7 bg-transparent border-none outline-none text-center ${textSize} font-bold`,
+                      style: { color: c.color },
+                      onClick: (e) => e.stopPropagation()
+                    }
+                  ),
+                  /* @__PURE__ */ jsx14(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        removeChain(name);
+                      },
+                      className: "leading-none opacity-60 hover:opacity-100",
+                      children: "\xD7"
+                    }
+                  )
+                ]
+              },
+              name
+            );
+          }),
+          /* @__PURE__ */ jsx14(
+            "input",
+            {
+              id: inputId,
+              className: `flex-1 min-w-[60px] bg-transparent border-none outline-none ${isSm ? "text-[11px]" : "text-xs"}`,
+              style: { color: "var(--text-primary)" },
+              placeholder: entries.length === 0 ? "Add to chain..." : "",
+              value: input,
+              onFocus: () => setOpen(true),
+              onBlur: () => setTimeout(() => setOpen(false), 150),
+              onChange: (e) => {
+                setInput(e.target.value);
+                setOpen(true);
+              },
+              onKeyDown: handleKeyDown
+            }
+          )
+        ]
+      }
+    ),
+    open && (available.length > 0 || isNew) && /* @__PURE__ */ jsxs13(
+      "div",
+      {
+        className: "absolute left-0 right-0 top-full mt-1 z-20 py-1 max-h-40 overflow-y-auto",
+        style: { background: "var(--bg-elevated)", border: "1px solid var(--border)", borderRadius: "var(--radius-md)" },
+        children: [
+          isNew && /* @__PURE__ */ jsxs13(
+            "button",
+            {
+              onMouseDown: () => addChain(trimmed),
+              className: "block w-full text-left px-3 py-1.5 text-sm transition-colors",
+              style: { color: "var(--accent-text)" },
+              onMouseEnter: (e) => {
+                e.currentTarget.style.background = "var(--bg-hover)";
+              },
+              onMouseLeave: (e) => {
+                e.currentTarget.style.background = "transparent";
+              },
+              children: [
+                '+ Create "',
+                trimmed,
+                '"'
+              ]
+            }
+          ),
+          available.map((s) => {
+            const c = tagColor(s);
+            return /* @__PURE__ */ jsxs13(
+              "button",
+              {
+                onMouseDown: () => addChain(s),
+                className: "flex items-center gap-2 w-full text-left px-3 py-1.5 text-sm transition-colors",
+                style: { color: "var(--text-secondary)" },
+                onMouseEnter: (e) => {
+                  e.currentTarget.style.background = "var(--bg-hover)";
+                },
+                onMouseLeave: (e) => {
+                  e.currentTarget.style.background = "transparent";
+                },
+                children: [
+                  /* @__PURE__ */ jsx14("span", { className: "w-2 h-2 rounded-full flex-shrink-0", style: { background: c.color } }),
+                  s
+                ]
+              },
+              s
+            );
+          })
+        ]
+      }
+    )
+  ] });
+}
+
+// src/components/MemoConditionsEditor.tsx
+import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
+var MEMO_OPERATORS = [
+  { value: "eq", label: "Equals (=)", values: 1 },
+  { value: "neq", label: "Not equals (\u2260)", values: 1 },
+  { value: "gt", label: "Greater than (>)", values: 1 },
+  { value: "gte", label: "Greater or equal (\u2265)", values: 1 },
+  { value: "lt", label: "Less than (<)", values: 1 },
+  { value: "lte", label: "Less or equal (\u2264)", values: 1 },
+  { value: "between", label: "Between", values: 2 },
+  { value: "contains", label: "Contains", values: 1 },
+  { value: "exists", label: "Exists (any value)", values: 0 },
+  { value: "regex", label: "Matches pattern", values: 1 }
+];
+function conditionPreview(c) {
+  const k = c.key || "\u2026";
+  const v = c.value || "\u2026";
+  switch (c.operator) {
+    case "eq":
+      return `"${k}" must equal ${v}`;
+    case "neq":
+      return `"${k}" must not equal ${v}`;
+    case "gt":
+      return `"${k}" must be > ${v}`;
+    case "gte":
+      return `"${k}" must be \u2265 ${v}`;
+    case "lt":
+      return `"${k}" must be < ${v}`;
+    case "lte":
+      return `"${k}" must be \u2264 ${v}`;
+    case "between":
+      return `"${k}" must be between ${v} and ${c.value2 || "\u2026"}`;
+    case "contains":
+      return `"${k}" must contain "${v}"`;
+    case "exists":
+      return `memo must have field "${k}"`;
+    case "regex":
+      return `"${k}" must match /${v}/`;
+    default:
+      return "";
+  }
+}
+function MemoConditionsEditor({ conditions, onChange }) {
+  const add = () => onChange([...conditions, { key: "", operator: "eq", value: "" }]);
+  const remove = (i) => onChange(conditions.filter((_, idx) => idx !== i));
+  const update = (i, patch) => onChange(conditions.map((c, idx) => idx === i ? { ...c, ...patch } : c));
+  const opMeta = (op) => MEMO_OPERATORS.find((o) => o.value === op) ?? MEMO_OPERATORS[0];
+  return /* @__PURE__ */ jsxs14("div", { children: [
+    /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2 mb-2", children: [
+      /* @__PURE__ */ jsx15("span", { className: "text-xs font-medium", style: { color: "var(--text-muted)" }, children: "Memo Conditions" }),
+      /* @__PURE__ */ jsx15("button", { type: "button", onClick: add, className: "text-[10px] px-2 py-0.5 rounded cursor-pointer", style: { background: "var(--bg-elevated)", color: "var(--accent-text)" }, children: "+ Add" })
+    ] }),
+    conditions.length > 0 ? /* @__PURE__ */ jsx15("div", { className: "flex flex-col gap-2", children: conditions.map((cond, i) => {
+      const meta = opMeta(cond.operator);
+      return /* @__PURE__ */ jsxs14("div", { className: "rounded-lg p-2.5", style: { background: "rgba(255,255,255,0.02)", border: "1px solid var(--border)" }, children: [
+        /* @__PURE__ */ jsxs14("div", { className: "flex gap-2 items-center", children: [
+          /* @__PURE__ */ jsx15(
+            "input",
+            {
+              className: "admin-input flex-1 text-xs",
+              placeholder: "field name",
+              value: cond.key,
+              onChange: (e) => update(i, { key: e.target.value })
+            }
+          ),
+          /* @__PURE__ */ jsx15(
+            CustomSelect,
+            {
+              size: "sm",
+              className: "!w-[160px]",
+              value: cond.operator,
+              onChange: (v) => update(i, { operator: v }),
+              options: MEMO_OPERATORS.map((o) => ({ value: o.value, label: o.label }))
+            }
+          ),
+          meta.values >= 1 && /* @__PURE__ */ jsx15(
+            "input",
+            {
+              className: "admin-input flex-1 text-xs",
+              placeholder: "value",
+              value: cond.value ?? "",
+              onChange: (e) => update(i, { value: e.target.value })
+            }
+          ),
+          meta.values === 2 && /* @__PURE__ */ jsxs14(Fragment2, { children: [
+            /* @__PURE__ */ jsx15("span", { className: "text-[10px]", style: { color: "var(--text-muted)" }, children: "and" }),
+            /* @__PURE__ */ jsx15(
+              "input",
+              {
+                className: "admin-input flex-1 text-xs",
+                placeholder: "value 2",
+                value: cond.value2 ?? "",
+                onChange: (e) => update(i, { value2: e.target.value })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx15("button", { type: "button", onClick: () => remove(i), className: "text-red-400 text-sm px-1 cursor-pointer", children: "\xD7" })
+        ] }),
+        /* @__PURE__ */ jsx15("p", { className: "text-[10px] mt-1.5 ml-0.5", style: { color: "var(--text-muted)", fontStyle: "italic" }, children: conditionPreview(cond) })
+      ] }, i);
+    }) }) : /* @__PURE__ */ jsx15("p", { className: "text-[10px]", style: { color: "var(--text-muted)" }, children: 'No conditions \u2014 matches any memo transaction. Click "+ Add" to filter.' })
+  ] });
+}
+
+// src/components/Icons.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+function I({ d, size = 16, className, style }) {
+  return /* @__PURE__ */ jsx16(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className,
+      style,
+      children: /* @__PURE__ */ jsx16("path", { d })
+    }
+  );
+}
+var P = {
+  // Navigation
+  back: "M19 12H5 M12 19l-7-7 7-7",
+  undo: "M3 7v6h6 M21 17a9 9 0 0 0-9-9 9 9 0 0 0-6.69 3L3 13",
+  // Tabs (matching sidebar style)
+  quests: "M12 2L2 7l10 5 10-5-10-5z M2 17l10 5 10-5 M2 12l10 5 10-5",
+  tracks: "M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z M4 22v-7",
+  settings: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6z",
+  chain: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71 M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71",
+  plus: "M12 5v14 M5 12h14",
+  // Actions
+  edit: "M17 3a2.83 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z",
+  trash: "M3 6h18 M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6 M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2",
+  x: "M18 6L6 18 M6 6l12 12",
+  check: "M20 6L9 17l-5-5",
+  search: "M11 19a8 8 0 1 0 0-16 8 8 0 0 0 0 16z M21 21l-4.35-4.35",
+  // Arrows
+  chevronUp: "M18 15l-6-6-6 6",
+  chevronDown: "M6 9l6 6 6-6",
+  chevronsDown: "M7 13l5 5 5-5 M7 6l5 5 5-5",
+  chevronsRight: "M13 17l5-5-5-5 M6 17l5-5-5-5",
+  arrowRight: "M5 12h14 M12 5l7 7-7 7",
+  // Shapes
+  play: "M5 3l14 9-14 9V3z",
+  star: "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14l-5-4.87 6.91-1.01L12 2z",
+  diamond: "M2.7 10.3a2.41 2.41 0 0 0 0 3.41l7.59 7.59a2.41 2.41 0 0 0 3.41 0l7.59-7.59a2.41 2.41 0 0 0 0-3.41L13.7 2.71a2.41 2.41 0 0 0-3.41 0L2.7 10.3z",
+  circle: "M12 12m-4 0a4 4 0 1 0 8 0 4 4 0 1 0-8 0"
+};
+var IconBack = (p) => /* @__PURE__ */ jsx16(I, { d: P.back, ...p });
+var IconUndo = (p) => /* @__PURE__ */ jsx16(I, { d: P.undo, ...p });
+var IconQuests = (p) => /* @__PURE__ */ jsx16(I, { d: P.quests, ...p });
+var IconTracks = (p) => /* @__PURE__ */ jsx16(I, { d: P.tracks, ...p });
+var IconSettings = (p) => /* @__PURE__ */ jsx16(I, { d: P.settings, ...p });
+var IconChain = (p) => /* @__PURE__ */ jsx16(I, { d: P.chain, ...p });
+var IconPlus = (p) => /* @__PURE__ */ jsx16(I, { d: P.plus, ...p });
+var IconEdit = (p) => /* @__PURE__ */ jsx16(I, { d: P.edit, ...p });
+var IconTrash = (p) => /* @__PURE__ */ jsx16(I, { d: P.trash, ...p });
+var IconX = (p) => /* @__PURE__ */ jsx16(I, { d: P.x, ...p });
+var IconCheck = (p) => /* @__PURE__ */ jsx16(I, { d: P.check, ...p });
+var IconSearch = (p) => /* @__PURE__ */ jsx16(I, { d: P.search, ...p });
+var IconChevronUp = (p) => /* @__PURE__ */ jsx16(I, { d: P.chevronUp, ...p });
+var IconChevronDown = (p) => /* @__PURE__ */ jsx16(I, { d: P.chevronDown, ...p });
+var IconChevronsDown = (p) => /* @__PURE__ */ jsx16(I, { d: P.chevronsDown, ...p });
+var IconChevronsRight = (p) => /* @__PURE__ */ jsx16(I, { d: P.chevronsRight, ...p });
+var IconArrowRight = (p) => /* @__PURE__ */ jsx16(I, { d: P.arrowRight, ...p });
+var IconPlay = (p) => /* @__PURE__ */ jsx16(I, { d: P.play, ...p });
+var IconStar = (p) => /* @__PURE__ */ jsx16(I, { d: P.star, ...p });
+var IconDiamond = (p) => /* @__PURE__ */ jsx16(I, { d: P.diamond, ...p });
+var IconCircle = (p) => /* @__PURE__ */ jsx16(I, { d: P.circle, ...p });
+export {
+  AddressDisplay,
+  AlertBanner,
+  Button,
+  ChainInput,
+  ConfirmDialog,
+  CustomSelect,
+  DataTable,
+  EmptyState,
+  Field,
+  FormModal,
+  IconArrowRight,
+  IconBack,
+  IconChain,
+  IconCheck,
+  IconChevronDown,
+  IconChevronUp,
+  IconChevronsDown,
+  IconChevronsRight,
+  IconCircle,
+  IconDiamond,
+  IconEdit,
+  IconPlay,
+  IconPlus,
+  IconQuests,
+  IconSearch,
+  IconSettings,
+  IconStar,
+  IconTracks,
+  IconTrash,
+  IconUndo,
+  IconX,
+  Input,
+  JsonPanel,
+  JsonToggleButton,
+  MemoConditionsEditor,
+  PageShell,
+  SearchInput,
+  Section,
+  Select,
+  StatusBadge,
+  Textarea,
+  tagColor
+};