@aggc/ui 0.7.1 → 0.9.0

package/dist/chunks/UiSkeleton.vue_vue_type_script_setup_true_lang-DUse1KRc.js

@@ -1,1201 +0,0 @@
-import { defineComponent as m, openBlock as l, createElementBlock as o, normalizeClass as t, unref as a, renderSlot as y, createElementVNode as d, createBlock as ee, resolveDynamicComponent as ae, toDisplayString as c, createVNode as R, withCtx as te, createTextVNode as O, Fragment as $, renderList as V, createCommentVNode as b, withKeys as U, withModifiers as K, ref as B, useId as se, computed as L, watch as N, onMounted as le, onBeforeUnmount as oe, nextTick as T, normalizeStyle as ie } from "vue";
-import { j as re, o as f, q as H, n as Y, r, g as ne, f as de, a as X, l as ce, p as ue, b as be, h as fe, i as ge, d as me } from "./pageHeader-YZ3BV9dQ.js";
-import { CheckCircle2 as pe, TriangleAlert as ve, LoaderCircle as he, Check as q, ChevronDown as ye } from "lucide-vue-next";
-const Ce = re, Oa = /* @__PURE__ */ m({
-  __name: "PageSurface",
-  setup(e) {
-    return (s, i) => (l(), o("div", {
-      class: t(a(Ce))
-    }, [
-      y(s.$slots, "default")
-    ], 2));
-  }
-}), xe = f({
-  base: {
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    borderRadius: "full",
-    borderWidth: "1px",
-    px: "2.5",
-    py: "1",
-    fontSize: "xs",
-    fontWeight: "700",
-    textTransform: "uppercase",
-    letterSpacing: "0.06em",
-    lineHeight: "1",
-    whiteSpace: "nowrap"
-  },
-  variants: {
-    tone: {
-      success: {
-        bg: "badge.successBg",
-        color: "badge.successText",
-        borderColor: "badge.successBorder"
-      },
-      warning: {
-        bg: "badge.warningBg",
-        color: "badge.warningText",
-        borderColor: "badge.warningBorder"
-      },
-      info: {
-        bg: "badge.infoBg",
-        color: "badge.infoText",
-        borderColor: "badge.infoBorder"
-      },
-      neutral: {
-        bg: "badge.neutralBg",
-        color: "badge.neutralText",
-        borderColor: "badge.neutralBorder"
-      },
-      danger: {
-        bg: "badge.dangerBg",
-        color: "badge.dangerText",
-        borderColor: "badge.dangerBorder"
-      }
-    }
-  },
-  defaultVariants: {
-    tone: "neutral"
-  }
-}), ke = /* @__PURE__ */ m({
-  __name: "StatusBadge",
-  props: {
-    tone: { default: "neutral" }
-  },
-  setup(e) {
-    const s = e;
-    return (i, g) => (l(), o("span", {
-      class: t(a(xe)({ tone: s.tone }))
-    }, [
-      y(i.$slots, "default")
-    ], 2));
-  }
-}), we = f({
-  base: {
-    borderWidth: "1px",
-    padding: "5",
-    _dark: {
-      borderColor: "border.default"
-    }
-  },
-  variants: {
-    ok: {
-      true: {
-        borderColor: "result.okBorder",
-        bg: "result.okBg"
-      },
-      false: {
-        borderColor: "result.failBorder",
-        bg: "result.failBg"
-      }
-    }
-  }
-}), Se = (e) => H(Y, we({ ok: e })), ze = r({
-  display: "flex",
-  justifyContent: "space-between",
-  gap: "4",
-  alignItems: { base: "flex-start", md: "center" },
-  flexDirection: { base: "column", md: "row" },
-  mb: "3"
-}), Be = r({
-  display: "flex",
-  alignItems: "center",
-  gap: "3"
-}), $e = f({
-  base: {
-    width: "9",
-    height: "9",
-    borderRadius: "full",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    flexShrink: "0"
-  },
-  variants: {
-    ok: {
-      true: {
-        bg: "bg.accentSoft",
-        color: "text.accent"
-      },
-      false: {
-        bg: "badge.warningBg",
-        color: "badge.warningText"
-      }
-    }
-  }
-}), Ve = r({
-  fontSize: "lg",
-  fontWeight: "700",
-  color: "text.primary",
-  lineHeight: "1.3"
-}), G = f({
-  base: {},
-  variants: {
-    spaced: {
-      true: { mb: "3" },
-      false: { mb: "0" }
-    }
-  }
-}), D = f({
-  base: {
-    fontSize: "sm",
-    fontWeight: "700",
-    mb: "2"
-  },
-  variants: {
-    tone: {
-      detail: { color: "result.detailText" },
-      warning: { color: "result.warningLabel" },
-      error: { color: "result.errorLabel" }
-    }
-  }
-}), P = f({
-  base: {
-    display: "grid",
-    gap: "1.5",
-    pl: "4"
-  },
-  variants: {
-    tone: {
-      detail: { color: "result.bodyText" },
-      warning: { color: "result.warningBody" },
-      error: { color: "result.errorBody" }
-    }
-  }
-}), Le = ["aria-live", "role"], Re = { key: 2 }, Ea = /* @__PURE__ */ m({
-  __name: "ResultPanel",
-  props: {
-    ok: { type: Boolean },
-    summary: {},
-    warnings: {},
-    errors: {},
-    messages: {},
-    live: {},
-    passLabel: {},
-    failLabel: {},
-    detailsLabel: {},
-    warningsLabel: {},
-    errorsLabel: {}
-  },
-  setup(e) {
-    const s = e;
-    return (i, g) => (l(), o("div", {
-      class: t(a(Se)(e.ok)),
-      "aria-live": s.live ?? "polite",
-      role: (s.live ?? "polite") === "off" ? void 0 : "status"
-    }, [
-      d("div", {
-        class: t(a(ze))
-      }, [
-        d("div", {
-          class: t(a(Be))
-        }, [
-          d("div", {
-            class: t(a($e)({ ok: e.ok }))
-          }, [
-            (l(), ee(ae(e.ok ? a(pe) : a(ve)), { size: 18 }))
-          ], 2),
-          d("h3", {
-            class: t(a(Ve))
-          }, c(s.summary), 3)
-        ], 2),
-        R(ke, {
-          tone: e.ok ? "success" : "warning"
-        }, {
-          default: te(() => [
-            O(c(e.ok ? s.passLabel ?? "Pass" : s.failLabel ?? "Fail"), 1)
-          ]),
-          _: 1
-        }, 8, ["tone"])
-      ], 2),
-      e.messages?.length ? (l(), o("div", {
-        key: 0,
-        class: t(a(G)({ spaced: !0 }))
-      }, [
-        d("p", {
-          class: t(a(D)({ tone: "detail" }))
-        }, c(s.detailsLabel ?? "Details"), 3),
-        d("ul", {
-          class: t(a(P)({ tone: "detail" }))
-        }, [
-          (l(!0), o($, null, V(e.messages, (u) => (l(), o("li", { key: u }, c(u), 1))), 128))
-        ], 2)
-      ], 2)) : b("", !0),
-      e.warnings?.length ? (l(), o("div", {
-        key: 1,
-        class: t(a(G)({ spaced: !!e.errors?.length }))
-      }, [
-        d("p", {
-          class: t(a(D)({ tone: "warning" }))
-        }, c(s.warningsLabel ?? "Warnings"), 3),
-        d("ul", {
-          class: t(a(P)({ tone: "warning" }))
-        }, [
-          (l(!0), o($, null, V(e.warnings, (u) => (l(), o("li", { key: u }, c(u), 1))), 128))
-        ], 2)
-      ], 2)) : b("", !0),
-      e.errors?.length ? (l(), o("div", Re, [
-        d("p", {
-          class: t(a(D)({ tone: "error" }))
-        }, c(s.errorsLabel ?? "Errors"), 3),
-        d("ul", {
-          class: t(a(P)({ tone: "error" }))
-        }, [
-          (l(!0), o($, null, V(e.errors, (u) => (l(), o("li", { key: u }, c(u), 1))), 128))
-        ], 2)
-      ])) : b("", !0)
-    ], 10, Le));
-  }
-}), Ie = r({
-  padding: "6"
-}), We = r({
-  height: "100%",
-  minHeight: "0",
-  display: "grid",
-  gridTemplateRows: "auto minmax(0, 1fr)"
-}), He = Y, Te = ne, De = r({
-  position: "relative",
-  zIndex: "1",
-  mb: "4"
-}), Pe = r({
-  position: "relative",
-  zIndex: "1",
-  mb: "0"
-}), Oe = de, Ee = X, je = ce, Ae = r({
-  color: "text.secondary",
-  lineHeight: "1.65",
-  fontSize: "sm",
-  maxWidth: "2xl"
-}), Fe = ue, Me = r({
-  position: "relative",
-  zIndex: "1",
-  minHeight: "0",
-  overflowY: "auto",
-  paddingRight: "1",
-  overscrollBehavior: "contain"
-}), Ue = r({
-  position: "relative",
-  zIndex: "1"
-}), ja = /* @__PURE__ */ m({
-  __name: "SectionCard",
-  props: {
-    title: {},
-    eyebrow: { default: void 0 },
-    description: { default: "" },
-    scrollBody: { type: Boolean, default: !1 },
-    collapseBodyGap: { type: Boolean, default: !1 }
-  },
-  setup(e) {
-    const s = e;
-    return (i, g) => (l(), o("section", {
-      class: t(a(H)(a(He), a(Ie), s.scrollBody && a(We)))
-    }, [
-      d("div", {
-        class: t(a(H)(a(Te), s.collapseBodyGap ? a(Pe) : a(De)))
-      }, [
-        d("div", {
-          class: t(a(Oe))
-        }, [
-          s.eyebrow ? (l(), o("p", {
-            key: 0,
-            class: t(a(Ee))
-          }, c(s.eyebrow), 3)) : b("", !0),
-          d("h2", {
-            class: t(a(je))
-          }, c(s.title), 3),
-          s.description ? (l(), o("p", {
-            key: 1,
-            class: t(a(Ae))
-          }, c(s.description), 3)) : b("", !0)
-        ], 2),
-        i.$slots.actions ? (l(), o("div", {
-          key: 0,
-          class: t(a(Fe))
-        }, [
-          y(i.$slots, "actions")
-        ], 2)) : b("", !0)
-      ], 2),
-      d("div", {
-        class: t(s.scrollBody ? a(Me) : a(Ue))
-      }, [
-        y(i.$slots, "default")
-      ], 2)
-    ], 2));
-  }
-}), Ke = be, Ne = r({
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: "2",
-  minWidth: "0"
-}), Ge = r({
-  visibility: "hidden"
-}), Ye = r({
-  position: "absolute",
-  inset: "0",
-  display: "inline-flex",
-  alignItems: "center",
-  justifyContent: "center",
-  gap: "2",
-  px: "4",
-  py: "3",
-  pointerEvents: "none"
-}), Xe = ["type", "disabled", "aria-busy", "aria-label"], Aa = /* @__PURE__ */ m({
-  __name: "UiButton",
-  props: {
-    variant: { default: "solid" },
-    size: { default: "md" },
-    tone: { default: "default" },
-    loading: { type: Boolean, default: !1 },
-    loadingLabel: { default: "Working..." },
-    disabled: { type: Boolean, default: !1 },
-    type: { default: "button" },
-    ariaLabel: { default: void 0 }
-  },
-  setup(e) {
-    return (s, i) => (l(), o("button", {
-      type: e.type,
-      disabled: e.disabled || e.loading,
-      "aria-busy": e.loading || void 0,
-      "aria-label": e.ariaLabel,
-      class: t(a(Ke)({ variant: e.variant, size: e.size, tone: e.tone, disabled: e.disabled, loading: e.loading }))
-    }, [
-      d("span", {
-        class: t([a(Ne), e.loading ? a(Ge) : void 0])
-      }, [
-        y(s.$slots, "default")
-      ], 2),
-      e.loading ? (l(), o("span", {
-        key: 0,
-        class: t(a(Ye))
-      }, [
-        R(a(he), {
-          size: 14,
-          class: "aggc-spin",
-          "aria-hidden": "true"
-        }),
-        d("span", null, c(e.loadingLabel), 1)
-      ], 2)) : b("", !0)
-    ], 10, Xe));
-  }
-}), qe = f({
-  base: {
-    width: "100%",
-    display: "flex",
-    alignItems: "flex-start",
-    gap: "3",
-    textAlign: "left",
-    borderRadius: "xl",
-    borderWidth: "1px",
-    px: "4",
-    py: "3.5",
-    color: "text.primary",
-    transition: "border-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), background-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 160ms cubic-bezier(0.25, 0.1, 0.25, 1)"
-  },
-  variants: {
-    checked: {
-      true: {
-        borderColor: "border.accent",
-        bg: "bg.selected"
-      },
-      false: {
-        borderColor: "border.default",
-        bg: "bg.input"
-      }
-    },
-    disabled: {
-      true: {
-        cursor: "not-allowed",
-        opacity: 0.45
-      },
-      false: {
-        cursor: "pointer"
-      }
-    }
-  },
-  compoundVariants: [
-    {
-      checked: !0,
-      disabled: !1,
-      css: {
-        _hover: {
-          borderColor: "border.accent"
-        }
-      }
-    },
-    {
-      checked: !1,
-      disabled: !1,
-      css: {
-        _hover: {
-          borderColor: "border.strong"
-        }
-      }
-    }
-  ],
-  defaultVariants: {
-    checked: !1,
-    disabled: !1
-  }
-}), Je = f({
-  base: {
-    mt: "0.5",
-    flexShrink: "0",
-    width: "22px",
-    height: "22px",
-    borderRadius: "md",
-    borderWidth: "1.5px",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    transition: "border-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), background-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), transform 160ms cubic-bezier(0.25, 0.1, 0.25, 1)"
-  },
-  variants: {
-    checked: {
-      true: {
-        borderColor: "border.accent",
-        bg: "bg.accentStrong",
-        color: "text.inverse",
-        transform: "scale(1)"
-      },
-      false: {
-        borderColor: "border.default",
-        bg: "bg.buttonOutline",
-        color: "transparent",
-        transform: "scale(1)"
-      }
-    }
-  },
-  defaultVariants: {
-    checked: !1
-  }
-}), Qe = r({
-  display: "grid",
-  gap: "1",
-  minWidth: "0"
-}), Ze = r({
-  fontSize: "sm",
-  fontWeight: "700",
-  lineHeight: "1.45"
-}), _e = r({
-  color: "text.secondary",
-  fontSize: "sm",
-  lineHeight: "1.55"
-}), ea = ["id", "name", "aria-checked", "aria-describedby", "aria-invalid", "disabled", "onKeydown"], Fa = /* @__PURE__ */ m({
-  __name: "UiCheckbox",
-  props: {
-    modelValue: { type: Boolean },
-    id: { default: void 0 },
-    name: { default: void 0 },
-    label: { default: void 0 },
-    description: { default: void 0 },
-    disabled: { type: Boolean, default: !1 },
-    invalid: { type: Boolean, default: !1 },
-    ariaDescribedby: { default: void 0 }
-  },
-  emits: ["update:modelValue"],
-  setup(e, { emit: s }) {
-    const i = e, g = s;
-    function u() {
-      i.disabled || g("update:modelValue", !i.modelValue);
-    }
-    return (p, I) => (l(), o("button", {
-      type: "button",
-      id: e.id,
-      name: e.name,
-      role: "checkbox",
-      "aria-checked": e.modelValue,
-      "aria-describedby": e.ariaDescribedby,
-      "aria-invalid": e.invalid || void 0,
-      disabled: e.disabled,
-      class: t(a(qe)({ checked: e.modelValue, disabled: e.disabled })),
-      onClick: u,
-      onKeydown: [
-        U(K(u, ["prevent"]), ["enter"]),
-        U(K(u, ["prevent"]), ["space"])
-      ]
-    }, [
-      d("span", {
-        class: t(a(Je)({ checked: e.modelValue })),
-        "aria-hidden": "true"
-      }, [
-        R(a(q), { size: 14 })
-      ], 2),
-      d("span", {
-        class: t(a(Qe))
-      }, [
-        e.label || p.$slots.default ? (l(), o("span", {
-          key: 0,
-          class: t(a(Ze))
-        }, [
-          y(p.$slots, "default", {}, () => [
-            O(c(e.label), 1)
-          ])
-        ], 2)) : b("", !0),
-        e.description || p.$slots.description ? (l(), o("span", {
-          key: 1,
-          class: t(a(_e))
-        }, [
-          y(p.$slots, "description", {}, () => [
-            O(c(e.description), 1)
-          ])
-        ], 2)) : b("", !0)
-      ], 2)
-    ], 42, ea));
-  }
-}), aa = r({
-  display: "grid",
-  gap: "2",
-  minWidth: "0"
-}), ta = r({
-  display: "flex",
-  alignItems: "flex-start",
-  justifyContent: "space-between",
-  gap: "3"
-}), sa = r({
-  display: "grid",
-  gap: "0.5",
-  minWidth: "0"
-}), la = X, oa = r({
-  fontSize: "sm",
-  fontWeight: "600",
-  color: "text.primary"
-}), ia = fe, ra = r({
-  flexShrink: "0"
-}), na = ["for"], da = ["id"], Ma = /* @__PURE__ */ m({
-  __name: "UiField",
-  props: {
-    id: {},
-    forId: {},
-    label: {},
-    hint: {},
-    eyebrow: {}
-  },
-  setup(e) {
-    return (s, i) => (l(), o("div", {
-      class: t(a(aa))
-    }, [
-      e.eyebrow || e.label || e.hint || s.$slots.meta ? (l(), o("div", {
-        key: 0,
-        class: t(a(ta))
-      }, [
-        d("div", {
-          class: t(a(sa))
-        }, [
-          e.eyebrow ? (l(), o("p", {
-            key: 0,
-            class: t(a(la))
-          }, c(e.eyebrow), 3)) : b("", !0),
-          e.label ? (l(), o("label", {
-            key: 1,
-            for: e.forId,
-            class: t(a(oa))
-          }, c(e.label), 11, na)) : b("", !0),
-          e.hint ? (l(), o("p", {
-            key: 2,
-            id: e.id,
-            class: t(a(ia))
-          }, c(e.hint), 11, da)) : b("", !0)
-        ], 2),
-        s.$slots.meta ? (l(), o("div", {
-          key: 0,
-          class: t(a(ra))
-        }, [
-          y(s.$slots, "meta")
-        ], 2)) : b("", !0)
-      ], 2)) : b("", !0),
-      y(s.$slots, "default")
-    ], 2));
-  }
-}), ca = H(
-  ge,
-  r({
-    paddingX: "4",
-    paddingY: "3",
-    display: "flex",
-    alignItems: "center",
-    gap: "3",
-    color: "text.secondary",
-    fontSize: "sm",
-    lineHeight: "1.5"
-  })
-), ua = r({
-  width: "2.5",
-  height: "2.5",
-  borderRadius: "full",
-  flexShrink: "0",
-  bg: "text.accent",
-  boxShadow: "0 0 0 0 var(--colors-bg-accentSoft, rgba(49, 94, 255, 0.3))",
-  animation: "loadingPulse 1.4s cubic-bezier(0.25, 0.1, 0.25, 1) infinite"
-}), ba = r({
-  display: "grid",
-  gap: "0.5"
-}), fa = r({
-  fontWeight: "700",
-  color: "text.primary"
-}), ga = ["aria-live", "role"], Ua = /* @__PURE__ */ m({
-  __name: "UiLoadingState",
-  props: {
-    title: {},
-    description: {},
-    live: { default: "polite" }
-  },
-  setup(e) {
-    return (s, i) => (l(), o("div", {
-      class: t(a(ca)),
-      "data-testid": "loading-state",
-      "aria-live": e.live,
-      role: e.live === "off" ? void 0 : "status"
-    }, [
-      d("span", {
-        class: t(a(ua)),
-        "aria-hidden": "true",
-        "data-ui-loading-pulse": ""
-      }, null, 2),
-      d("div", {
-        class: t(a(ba))
-      }, [
-        d("p", {
-          class: t(a(fa))
-        }, c(e.title), 3),
-        d("p", null, c(e.description), 1)
-      ], 2)
-    ], 10, ga));
-  }
-}), ma = r({
-  display: "inline-flex",
-  width: "fit-content",
-  borderRadius: "full",
-  borderWidth: "1px",
-  borderColor: "border.default",
-  bg: "bg.input",
-  padding: "1",
-  gap: "1",
-  _dark: {
-    borderColor: "border.strong"
-  }
-}), pa = f({
-  base: {
-    borderRadius: "full",
-    px: "3.5",
-    py: "2",
-    fontSize: "sm",
-    fontWeight: "600",
-    cursor: "pointer",
-    borderWidth: "1px",
-    transition: "background-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), border-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 160ms cubic-bezier(0.25, 0.1, 0.25, 1)",
-    _focusVisible: {
-      outline: "2px solid",
-      outlineColor: "text.accent",
-      outlineOffset: "2px"
-    }
-  },
-  variants: {
-    active: {
-      true: {
-        borderColor: "border.accent",
-        bg: "bg.accentStrong",
-        color: "text.inverse",
-        _hover: {
-          bg: "bg.accentStrong"
-        },
-        _dark: {
-          bg: "rgba(138, 180, 255, 0.2)",
-          color: "text.accent",
-          borderColor: "border.accent"
-        }
-      },
-      false: {
-        borderColor: "transparent",
-        bg: "transparent",
-        color: "text.secondary",
-        boxShadow: "none",
-        _hover: {
-          bg: "bg.hover"
-        }
-      }
-    }
-  }
-}), va = ["onClick"], Ka = /* @__PURE__ */ m({
-  __name: "UiSegmentedControl",
-  props: {
-    modelValue: {},
-    options: {}
-  },
-  emits: ["update:modelValue"],
-  setup(e) {
-    return (s, i) => (l(), o("div", {
-      class: t(a(ma))
-    }, [
-      (l(!0), o($, null, V(e.options, (g) => (l(), o("button", {
-        key: g.value,
-        type: "button",
-        class: t(a(pa)({ active: g.value === e.modelValue })),
-        onClick: (u) => s.$emit("update:modelValue", g.value)
-      }, c(g.label), 11, va))), 128))
-    ], 2));
-  }
-}), ha = f({
-  base: {
-    position: "relative"
-  },
-  variants: {
-    open: {
-      true: { zIndex: "30" },
-      false: { zIndex: "1" }
-    }
-  },
-  defaultVariants: {
-    open: !1
-  }
-}), ya = f({
-  base: {
-    width: "100%",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between",
-    gap: "3",
-    borderWidth: "1px",
-    fontSize: "sm",
-    overflow: "hidden",
-    transition: "border-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), background-color 160ms cubic-bezier(0.25, 0.1, 0.25, 1), box-shadow 160ms cubic-bezier(0.25, 0.1, 0.25, 1)"
-  },
-  variants: {
-    size: {
-      sm: {
-        minHeight: "40px",
-        borderRadius: "lg",
-        px: "3",
-        py: "2.5"
-      },
-      md: {
-        minHeight: "48px",
-        borderRadius: "xl",
-        px: "4",
-        py: "3"
-      }
-    },
-    open: {
-      true: {
-        borderColor: "border.accent",
-        bg: "bg.cardStrong",
-        _dark: {
-          borderColor: "border.accent",
-          bg: "bg.input"
-        }
-      },
-      false: {
-        borderColor: "border.default",
-        bg: "bg.input"
-      }
-    },
-    selected: {
-      true: { color: "text.primary" },
-      false: { color: "text.muted" }
-    },
-    disabled: {
-      true: {
-        cursor: "not-allowed",
-        opacity: 0.45
-      },
-      false: {
-        cursor: "pointer",
-        _focusVisible: {
-          outline: "2px solid",
-          outlineColor: "text.accent",
-          outlineOffset: "2px"
-        }
-      }
-    }
-  },
-  compoundVariants: [
-    {
-      disabled: !1,
-      css: {
-        _hover: {
-          borderColor: "border.strong",
-          bg: "bg.cardStrong",
-          _dark: {
-            bg: "bg.input"
-          }
-        }
-      }
-    }
-  ],
-  defaultVariants: {
-    size: "md",
-    open: !1,
-    selected: !1,
-    disabled: !1
-  }
-}), Ca = me({
-  placement: "anchored",
-  density: "cozy"
-}), xa = r({
-  width: "100%",
-  zIndex: "30",
-  maxHeight: "320px",
-  overflowY: "auto",
-  display: "grid"
-}), ka = r({
-  display: "block",
-  textAlign: "left",
-  minWidth: "0",
-  flex: "1",
-  overflow: "hidden"
-}), wa = r({
-  display: "block",
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap"
-}), Sa = f({
-  base: {
-    color: "text.muted",
-    transition: "transform 160ms cubic-bezier(0.25, 0.1, 0.25, 1)"
-  },
-  variants: {
-    open: {
-      true: { transform: "rotate(180deg)" },
-      false: { transform: "rotate(0deg)" }
-    }
-  },
-  defaultVariants: {
-    open: !1
-  }
-}), za = f({
-  base: {
-    width: "100%",
-    display: "flex",
-    alignItems: "flex-start",
-    justifyContent: "space-between",
-    gap: "3",
-    textAlign: "left",
-    borderRadius: "lg",
-    px: "3",
-    borderWidth: "1px",
-    cursor: "pointer",
-    transition: "border-color 140ms cubic-bezier(0.25, 0.1, 0.25, 1), background-color 140ms cubic-bezier(0.25, 0.1, 0.25, 1), color 140ms cubic-bezier(0.25, 0.1, 0.25, 1)",
-    _hover: {
-      bg: "bg.selected",
-      borderColor: "border.accent"
-    },
-    _focusVisible: {
-      outline: "2px solid",
-      outlineColor: "text.accent",
-      outlineOffset: "-2px"
-    }
-  },
-  variants: {
-    size: {
-      sm: { py: "2.5" },
-      md: { py: "2.5" }
-    },
-    active: {
-      true: {
-        color: "text.primary",
-        bg: "bg.selected",
-        borderColor: "border.accent"
-      },
-      false: {
-        color: "text.secondary",
-        bg: "transparent",
-        borderColor: "transparent"
-      }
-    }
-  },
-  defaultVariants: {
-    size: "md",
-    active: !1
-  }
-}), Ba = r({
-  display: "grid",
-  gap: "0.5",
-  minWidth: "0"
-}), $a = r({
-  fontSize: "sm",
-  fontWeight: "600",
-  minWidth: "0",
-  overflow: "hidden",
-  textOverflow: "ellipsis",
-  whiteSpace: "nowrap"
-}), Va = r({
-  color: "text.secondary",
-  fontSize: "xs",
-  lineHeight: "1.45",
-  overflowWrap: "anywhere"
-}), La = f({
-  base: {
-    color: "text.accent",
-    transition: "opacity 140ms cubic-bezier(0.25, 0.1, 0.25, 1)"
-  },
-  variants: {
-    selected: {
-      true: { opacity: 1 },
-      false: { opacity: 0 }
-    }
-  },
-  defaultVariants: {
-    selected: !1
-  }
-}), Ra = ["id", "name", "disabled", "aria-expanded", "aria-controls", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid"], Ia = ["id", "aria-activedescendant"], Wa = ["id", "aria-selected", "onMouseenter", "onClick", "onKeydown"], Na = /* @__PURE__ */ m({
-  __name: "UiSelect",
-  props: {
-    modelValue: {},
-    options: {},
-    id: { default: void 0 },
-    name: { default: void 0 },
-    placeholder: { default: "Select an option" },
-    disabled: { type: Boolean, default: !1 },
-    invalid: { type: Boolean, default: !1 },
-    size: { default: "md" },
-    ariaLabel: { default: void 0 },
-    ariaLabelledby: { default: void 0 },
-    ariaDescribedby: { default: void 0 }
-  },
-  emits: ["update:modelValue"],
-  setup(e, { emit: s }) {
-    const i = e, g = s, u = B(null), p = B(null), I = B([]), v = B(!1), x = B(-1), J = se(), W = L(() => i.id ?? `ui-select-${J}`), E = L(() => `${W.value}-listbox`), j = L(
-      () => i.options.find((n) => n.value === i.modelValue) ?? null
-    );
-    function w(n) {
-      if (!i.options.length) {
-        x.value = -1;
-        return;
-      }
-      const h = (n + i.options.length) % i.options.length;
-      x.value = h, T(() => {
-        I.value[h]?.focus();
-      });
-    }
-    function k() {
-      v.value = !1, x.value = -1;
-    }
-    async function A() {
-      if (i.disabled || !i.options.length)
-        return;
-      v.value = !0;
-      const n = i.options.findIndex((h) => h.value === i.modelValue);
-      await T(), w(n >= 0 ? n : 0);
-    }
-    function Q() {
-      if (v.value) {
-        k();
-        return;
-      }
-      A();
-    }
-    function F(n) {
-      g("update:modelValue", n), k(), T(() => {
-        p.value?.focus();
-      });
-    }
-    function Z(n) {
-      i.disabled || (n.key === "ArrowDown" || n.key === "Enter" || n.key === " ") && (n.preventDefault(), A());
-    }
-    function _(n, h) {
-      switch (n.key) {
-        case "ArrowDown":
-          n.preventDefault(), w(h + 1);
-          break;
-        case "ArrowUp":
-          n.preventDefault(), w(h - 1);
-          break;
-        case "Home":
-          n.preventDefault(), w(0);
-          break;
-        case "End":
-          n.preventDefault(), w(i.options.length - 1);
-          break;
-        case "Escape":
-          n.preventDefault(), k(), p.value?.focus();
-          break;
-        case "Enter":
-        case " ":
-          n.preventDefault(), F(i.options[h].value);
-          break;
-      }
-    }
-    function M(n) {
-      v.value && (u.value?.contains(n.target) || k());
-    }
-    return N(
-      () => i.options,
-      () => {
-        I.value = [], i.options.some((n) => n.value === i.modelValue) || k();
-      }
-    ), N(
-      () => i.disabled,
-      (n) => {
-        n && k();
-      }
-    ), le(() => {
-      document.addEventListener("pointerdown", M);
-    }), oe(() => {
-      document.removeEventListener("pointerdown", M);
-    }), (n, h) => (l(), o("div", {
-      ref_key: "rootRef",
-      ref: u,
-      class: t(a(ha)({ open: v.value }))
-    }, [
-      d("button", {
-        ref_key: "triggerRef",
-        ref: p,
-        type: "button",
-        id: W.value,
-        name: e.name,
-        disabled: e.disabled,
-        class: t(a(ya)({ size: e.size, open: v.value, selected: !!j.value, disabled: e.disabled })),
-        "aria-haspopup": "listbox",
-        "aria-expanded": v.value,
-        "aria-controls": E.value,
-        "aria-label": e.ariaLabel,
-        "aria-labelledby": e.ariaLabelledby,
-        "aria-describedby": e.ariaDescribedby,
-        "aria-invalid": e.invalid || void 0,
-        onClick: Q,
-        onKeydown: Z
-      }, [
-        d("span", {
-          class: t(a(ka))
-        }, [
-          d("span", {
-            class: t(a(wa))
-          }, c(j.value?.label ?? e.placeholder), 3)
-        ], 2),
-        R(a(ye), {
-          size: 16,
-          class: t(a(Sa)({ open: v.value }))
-        }, null, 8, ["class"])
-      ], 42, Ra),
-      v.value ? (l(), o("div", {
-        key: 0,
-        id: E.value,
-        class: t([a(Ca), a(xa)]),
-        role: "listbox",
-        "aria-activedescendant": x.value >= 0 ? `${W.value}-${x.value}` : void 0
-      }, [
-        (l(!0), o($, null, V(e.options, (C, S) => (l(), o("button", {
-          id: `${W.value}-${S}`,
-          key: C.value,
-          ref_for: !0,
-          ref: (z) => I.value[S] = z,
-          type: "button",
-          role: "option",
-          "aria-selected": C.value === e.modelValue,
-          class: t(a(za)({ size: e.size, active: x.value === S || C.value === e.modelValue })),
-          onMouseenter: (z) => x.value = S,
-          onClick: (z) => F(C.value),
-          onKeydown: (z) => _(z, S)
-        }, [
-          d("span", {
-            class: t(a(Ba))
-          }, [
-            d("span", {
-              class: t(a($a))
-            }, c(C.label), 3),
-            C.description && e.size === "md" ? (l(), o("span", {
-              key: 0,
-              class: t(a(Va))
-            }, c(C.description), 3)) : b("", !0)
-          ], 2),
-          R(a(q), {
-            size: 15,
-            class: t(a(La)({ selected: C.value === e.modelValue }))
-          }, null, 8, ["class"])
-        ], 42, Wa))), 128))
-      ], 10, Ia)) : b("", !0)
-    ], 2));
-  }
-}), Ha = f({
-  base: {
-    position: "relative",
-    overflow: "hidden",
-    bg: "bg.cardAlt",
-    borderRadius: "md",
-    _before: {
-      content: '""',
-      position: "absolute",
-      inset: "0",
-      background: "linear-gradient(90deg, transparent 0%, var(--colors-bg-overlay, rgba(255,255,255,0.36)) 50%, transparent 100%)",
-      transform: "translateX(-100%)",
-      animation: "aggc-shimmer 1.6s cubic-bezier(0.25, 0.1, 0.25, 1) infinite"
-    },
-    _dark: {
-      bg: "rgba(255, 255, 255, 0.04)",
-      _before: {
-        background: "linear-gradient(90deg, transparent 0%, rgba(186, 204, 236, 0.1) 50%, transparent 100%)"
-      }
-    }
-  },
-  variants: {
-    variant: {
-      text: {
-        width: "100%",
-        height: "0.875rem"
-      },
-      title: {
-        width: "100%",
-        height: "1.75rem",
-        borderRadius: "md"
-      },
-      rect: {
-        width: "100%",
-        height: "5rem"
-      },
-      pill: {
-        width: "5rem",
-        height: "1.75rem",
-        borderRadius: "999px"
-      },
-      circle: {
-        width: "2.75rem",
-        height: "2.75rem",
-        borderRadius: "999px"
-      },
-      stat: {
-        width: "100%",
-        height: "4.75rem"
-      },
-      action: {
-        width: "100%",
-        height: "2.75rem"
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "rect"
-  }
-}), Ga = /* @__PURE__ */ m({
-  __name: "UiSkeleton",
-  props: {
-    variant: { default: "rect" },
-    width: { default: void 0 },
-    height: { default: void 0 }
-  },
-  setup(e) {
-    const s = e, i = L(() => Ha({ variant: s.variant })), g = L(() => ({
-      width: s.width ?? (s.variant === "circle" ? "2.75rem" : s.variant === "pill" ? "5rem" : "100%"),
-      height: s.height ?? (s.variant === "text" ? "0.875rem" : s.variant === "title" || s.variant === "pill" ? "1.75rem" : s.variant === "circle" || s.variant === "action" ? "2.75rem" : s.variant === "stat" ? "4.75rem" : "5rem")
-    }));
-    return (u, p) => (l(), o("div", {
-      "aria-hidden": "true",
-      "data-ui-skeleton": "",
-      class: t(i.value),
-      style: ie(g.value)
-    }, null, 6));
-  }
-});
-export {
-  Oa as _,
-  Ea as a,
-  ja as b,
-  ke as c,
-  Aa as d,
-  Fa as e,
-  Ma as f,
-  Ua as g,
-  Ka as h,
-  Na as i,
-  Ga as j
-};