@brycks/core-front 0.1.0

package/dist/index.js

@@ -0,0 +1,3215 @@
+import { a as xt, c as wt, e as St, i as Ct, n as zt, p as $t, s as Bt, w as Wt } from "./colors-B_8a3coi.js";
+import { spacing as C, durations as j, easings as R, fontSizes as ee, fontWeights as oe, lineHeights as de, fontFamilies as P, containers as We, textStyles as Q } from "./tokens.js";
+import { animations as It, borderStyles as Tt, borderWidths as Nt, breakpoints as Lt, focusRings as Rt, glows as Mt, letterSpacings as Ft, mediaQueries as jt, radii as Ot, semanticSpacing as Dt, shadows as Xt, transitions as Et, zIndex as Pt } from "./tokens.js";
+import { T as Gt, c as _t, d as Yt, l as At, u as Kt, a as qt } from "./cssVariables-CU3jCd8f.js";
+import { forwardRef as $, useState as V, useId as He, useRef as ne, useCallback as se, useEffect as ae } from "react";
+import { jsx as n, jsxs as p, Fragment as ce } from "react/jsx-runtime";
+import { createPortal as he } from "react-dom";
+const U = {
+  /** 24px - Micro elements (tags, small badges) */
+  xs: C[6],
+  /** 32px - Small inputs, compact buttons */
+  sm: C[8],
+  /** 40px - Default size for most interactive elements */
+  md: C[10],
+  /** 48px - Large inputs, prominent buttons */
+  lg: C[12],
+  /** 56px - Extra large, hero CTAs */
+  xl: C[14]
+}, ie = {
+  /** 12px */
+  xs: C[3],
+  /** 16px */
+  sm: C[4],
+  /** 20px */
+  md: C[5],
+  /** 24px */
+  lg: C[6],
+  /** 32px */
+  xl: C[8]
+}, Z = {
+  /** 8px */
+  xs: C[2],
+  /** 12px */
+  sm: C[3],
+  /** 16px */
+  md: C[4],
+  /** 20px */
+  lg: C[5],
+  /** 24px */
+  xl: C[6]
+}, Jr = {
+  /** 4px */
+  xs: C[1],
+  /** 6px */
+  sm: C[1.5],
+  /** 8px */
+  md: C[2],
+  /** 10px */
+  lg: C[2.5],
+  /** 12px */
+  xl: C[3]
+}, G = {
+  /** 4px - Tight spacing between icons and text */
+  xs: C[1],
+  /** 6px */
+  sm: C[1.5],
+  /** 8px - Default internal spacing */
+  md: C[2],
+  /** 10px */
+  lg: C[2.5],
+  /** 12px - Spacious internal spacing */
+  xl: C[3]
+}, et = {
+  /** 400px - Small dialogs, confirmations */
+  sm: 400,
+  /** 500px - Medium dialogs */
+  md: 500,
+  /** 640px - Large dialogs */
+  lg: 640,
+  /** 800px - Extra large dialogs */
+  xl: 800,
+  /** Full width minus margins */
+  full: "calc(100vw - 48px)"
+}, rt = {
+  /** Default tooltip max width */
+  tooltipMaxWidth: 300,
+  /** Default popover max width */
+  popoverMaxWidth: 400,
+  /** Arrow size for tooltips */
+  arrowSize: C[2],
+  /** Gap between trigger and popover */
+  offset: C[2]
+}, Ie = {
+  sm: {
+    box: 16,
+    icon: 10
+  },
+  md: {
+    box: 18,
+    icon: 12
+  },
+  lg: {
+    box: 22,
+    icon: 14
+  }
+}, Te = {
+  sm: {
+    width: 36,
+    height: 20,
+    thumb: 16
+  },
+  md: {
+    width: 44,
+    height: 24,
+    thumb: 20
+  },
+  lg: {
+    width: 52,
+    height: 28,
+    thumb: 24
+  }
+}, J = {
+  /** Default focus ring - primary color */
+  default: "0 0 0 3px var(--brycks-focus-ring-color, rgba(85, 120, 244, 0.35))",
+  /** Error state focus ring */
+  error: "0 0 0 3px var(--brycks-focus-ring-error, rgba(239, 68, 68, 0.35))",
+  /** Success state focus ring */
+  success: "0 0 0 3px var(--brycks-focus-ring-success, rgba(16, 185, 129, 0.35))",
+  /** Subtle focus ring - for nested elements */
+  subtle: "0 0 0 2px var(--brycks-focus-ring-color, rgba(85, 120, 244, 0.25))",
+  /** None - explicitly no focus ring */
+  none: "none"
+}, tt = {
+  default: "0 0 0 2px var(--brycks-background-app), 0 0 0 4px var(--brycks-primary-default)",
+  error: "0 0 0 2px var(--brycks-background-app), 0 0 0 4px var(--brycks-error-default)"
+}, ot = {
+  /** Outline-based focus (native) */
+  outline: {
+    outline: "2px solid var(--brycks-border-focus)",
+    outlineOffset: "2px"
+  },
+  /** Box-shadow based focus (custom) */
+  ring: {
+    outline: "none",
+    boxShadow: J.default
+  },
+  /** Error state focus */
+  ringError: {
+    outline: "none",
+    boxShadow: J.error
+  },
+  /** Remove focus styles (use sparingly) */
+  none: {
+    outline: "none",
+    boxShadow: "none"
+  }
+}, te = {
+  /** No transition */
+  none: "none",
+  /** Ultra-fast - for micro-interactions (50ms) */
+  instant: `all ${j.faster}ms ${R.easeOut}`,
+  /** Fast - for hover states, toggles (100ms) */
+  fast: `all ${j.fast}ms ${R.easeOut}`,
+  /** Quick - standard interactive feedback (150ms) */
+  quick: `all ${j.quick}ms ${R.easeOut}`,
+  /** Default - most state changes (200ms) */
+  default: `all ${j.normal}ms ${R.easeOut}`,
+  /** Smooth - focus states, form elements (300ms) */
+  smooth: `all ${j.relaxed}ms ${R.smooth}`,
+  /** Slow - reveals, modals (400ms) */
+  slow: `all ${j.slow}ms ${R.easeOut}`,
+  /** Spring - bouncy, tactile feel (300ms) */
+  spring: `all ${j.relaxed}ms ${R.softSpring}`,
+  /** Colors only - optimized for color transitions */
+  colors: `color ${j.fast}ms ${R.easeOut}, background-color ${j.fast}ms ${R.easeOut}, border-color ${j.fast}ms ${R.easeOut}`,
+  /** Transform only - for scale, translate */
+  transform: `transform ${j.normal}ms ${R.easeOut}`,
+  /** Opacity only - for fade effects */
+  opacity: `opacity ${j.normal}ms ${R.easeOut}`,
+  /** Shadow only - for elevation changes */
+  shadow: `box-shadow ${j.normal}ms ${R.easeOut}`
+}, nt = {
+  all: "all",
+  colors: "color, background-color, border-color, fill, stroke",
+  opacity: "opacity",
+  shadow: "box-shadow",
+  transform: "transform",
+  dimensions: "width, height, padding, margin"
+}, st = {
+  instant: j.faster,
+  fast: j.fast,
+  quick: j.quick,
+  default: j.normal,
+  smooth: j.relaxed,
+  slow: j.slow,
+  slower: j.slower
+}, at = {
+  linear: R.linear,
+  ease: R.ease,
+  easeIn: R.easeIn,
+  easeOut: R.easeOut,
+  easeInOut: R.easeInOut,
+  spring: R.spring,
+  softSpring: R.softSpring,
+  smooth: R.smooth,
+  snappy: R.snappy
+}, it = {
+  fadeIn: `
+    @keyframes brycks-fade-in {
+      from { opacity: 0; }
+      to { opacity: 1; }
+    }
+  `,
+  fadeOut: `
+    @keyframes brycks-fade-out {
+      from { opacity: 1; }
+      to { opacity: 0; }
+    }
+  `,
+  scaleIn: `
+    @keyframes brycks-scale-in {
+      from { opacity: 0; transform: scale(0.95); }
+      to { opacity: 1; transform: scale(1); }
+    }
+  `,
+  scaleOut: `
+    @keyframes brycks-scale-out {
+      from { opacity: 1; transform: scale(1); }
+      to { opacity: 0; transform: scale(0.95); }
+    }
+  `,
+  slideUp: `
+    @keyframes brycks-slide-up {
+      from { opacity: 0; transform: translateY(8px); }
+      to { opacity: 1; transform: translateY(0); }
+    }
+  `,
+  slideDown: `
+    @keyframes brycks-slide-down {
+      from { opacity: 0; transform: translateY(-8px); }
+      to { opacity: 1; transform: translateY(0); }
+    }
+  `,
+  spin: `
+    @keyframes brycks-spin {
+      from { transform: rotate(0deg); }
+      to { transform: rotate(360deg); }
+    }
+  `,
+  pulse: `
+    @keyframes brycks-pulse {
+      0%, 100% { opacity: 1; }
+      50% { opacity: 0.5; }
+    }
+  `,
+  shimmer: `
+    @keyframes brycks-shimmer {
+      0% { transform: translateX(-100%); }
+      100% { transform: translateX(100%); }
+    }
+  `,
+  bounce: `
+    @keyframes brycks-bounce {
+      0%, 80%, 100% { transform: scale(0); opacity: 0.5; }
+      40% { transform: scale(1); opacity: 1; }
+    }
+  `
+}, N = {
+  /** 11px - Extra small labels, badges */
+  xs: ee.xs,
+  /** 12px - Small text, captions, helper text */
+  sm: ee.sm,
+  /** 14px - Default component text */
+  md: ee.base,
+  /** 15px - Large component text */
+  lg: 15,
+  /** 16px - Extra large component text */
+  xl: ee.md
+}, E = {
+  /** 400 - Regular body text */
+  regular: oe.regular,
+  /** 500 - Labels, emphasized text */
+  medium: oe.medium,
+  /** 600 - Headings, titles */
+  semibold: oe.semibold,
+  /** 700 - Strong emphasis */
+  bold: oe.bold
+}, F = {
+  /** 1 - Single line, badges */
+  none: de.none,
+  /** 1.25 - Tight, headings */
+  tight: de.snug,
+  /** 1.4 - Slightly relaxed, labels */
+  snug: 1.4,
+  /** 1.5 - Default body text */
+  normal: de.normal,
+  /** 1.6 - Relaxed, helper text */
+  relaxed: 1.6
+}, ct = {
+  /** Form field labels */
+  label: {
+    fontFamily: P.sans,
+    fontSize: N.sm,
+    fontWeight: E.medium,
+    lineHeight: F.normal
+  },
+  /** Helper/hint text below inputs */
+  helperText: {
+    fontFamily: P.sans,
+    fontSize: N.xs,
+    fontWeight: E.regular,
+    lineHeight: F.relaxed
+  },
+  /** Error messages */
+  errorText: {
+    fontFamily: P.sans,
+    fontSize: N.xs,
+    fontWeight: E.regular,
+    lineHeight: F.relaxed
+  },
+  /** Button text - small */
+  buttonSm: {
+    fontFamily: P.sans,
+    fontSize: N.sm,
+    fontWeight: E.medium,
+    lineHeight: F.none
+  },
+  /** Button text - medium (default) */
+  buttonMd: {
+    fontFamily: P.sans,
+    fontSize: N.md,
+    fontWeight: E.medium,
+    lineHeight: F.none
+  },
+  /** Button text - large */
+  buttonLg: {
+    fontFamily: P.sans,
+    fontSize: N.lg,
+    fontWeight: E.medium,
+    lineHeight: F.none
+  },
+  /** Badge text */
+  badge: {
+    fontFamily: P.sans,
+    fontSize: N.xs,
+    fontWeight: E.medium,
+    lineHeight: F.none
+  },
+  /** Tooltip text */
+  tooltip: {
+    fontFamily: P.sans,
+    fontSize: N.xs,
+    fontWeight: E.medium,
+    lineHeight: F.snug
+  },
+  /** Alert title */
+  alertTitle: {
+    fontFamily: P.sans,
+    fontSize: N.md,
+    fontWeight: E.semibold,
+    lineHeight: F.tight
+  },
+  /** Alert description */
+  alertDescription: {
+    fontFamily: P.sans,
+    fontSize: N.md,
+    fontWeight: E.regular,
+    lineHeight: F.normal
+  },
+  /** Modal title */
+  modalTitle: {
+    fontFamily: P.sans,
+    fontSize: ee.lg,
+    fontWeight: E.semibold,
+    lineHeight: F.tight
+  },
+  /** Modal description */
+  modalDescription: {
+    fontFamily: P.sans,
+    fontSize: N.md,
+    fontWeight: E.regular,
+    lineHeight: F.normal
+  },
+  /** Empty state title */
+  emptyStateTitle: {
+    fontFamily: P.sans,
+    fontSize: ee.lg,
+    fontWeight: E.semibold,
+    lineHeight: F.tight
+  },
+  /** Empty state description */
+  emptyStateDescription: {
+    fontFamily: P.sans,
+    fontSize: N.md,
+    fontWeight: E.regular,
+    lineHeight: F.normal
+  },
+  /** Divider label */
+  dividerLabel: {
+    fontFamily: P.sans,
+    fontSize: N.xs,
+    fontWeight: E.medium,
+    lineHeight: F.normal
+  }
+}, q = {
+  /** 0 - Fully transparent */
+  transparent: 0,
+  /** 0.05 - Barely visible */
+  5: 0.05,
+  /** 0.1 - Subtle hint */
+  10: 0.1,
+  /** 0.15 - Light overlay */
+  15: 0.15,
+  /** 0.2 - Soft background */
+  20: 0.2,
+  /** 0.25 - Quarter visible */
+  25: 0.25,
+  /** 0.3 - Light emphasis */
+  30: 0.3,
+  /** 0.4 - Medium-light */
+  40: 0.4,
+  /** 0.5 - Half visible (disabled) */
+  50: 0.5,
+  /** 0.6 - Medium */
+  60: 0.6,
+  /** 0.7 - Medium-strong */
+  70: 0.7,
+  /** 0.75 - Three-quarter visible */
+  75: 0.75,
+  /** 0.8 - Strong */
+  80: 0.8,
+  /** 0.9 - Almost opaque */
+  90: 0.9,
+  /** 0.95 - Nearly opaque */
+  95: 0.95,
+  /** 1 - Fully opaque */
+  opaque: 1
+}, ue = {
+  /** Disabled elements */
+  disabled: q[50],
+  /** Placeholder text */
+  placeholder: q[50],
+  /** Hover overlay */
+  hoverOverlay: q[5],
+  /** Active/pressed overlay */
+  activeOverlay: q[10],
+  /** Modal backdrop */
+  backdrop: q[40],
+  /** Loading state */
+  loading: q[70],
+  /** Secondary text */
+  muted: q[60],
+  /** Subtle decorative elements */
+  subtle: q[30]
+}, re = {
+  /** Pressed state - subtle shrink */
+  pressed: 0.98,
+  /** Strong pressed - more noticeable */
+  pressedStrong: 0.95,
+  /** Checkbox pressed */
+  controlPressed: 0.92,
+  /** Hidden/initial state for animations */
+  hidden: 0.95,
+  /** Normal state */
+  normal: 1,
+  /** Slight grow on hover */
+  hover: 1.02,
+  /** Emphasized grow */
+  emphasized: 1.05
+};
+function I(...e) {
+  return e.filter(Boolean).join(" ");
+}
+function lt(e) {
+  return C[e];
+}
+function H(e) {
+  if (e === void 0) return;
+  const t = C[e];
+  return t === 0 ? "0" : `${t}px`;
+}
+function ye(e) {
+  const t = {};
+  return e.m !== void 0 && (t.margin = H(e.m)), e.mx !== void 0 && (t.marginLeft = H(e.mx), t.marginRight = H(e.mx)), e.my !== void 0 && (t.marginTop = H(e.my), t.marginBottom = H(e.my)), e.mt !== void 0 && (t.marginTop = H(e.mt)), e.mr !== void 0 && (t.marginRight = H(e.mr)), e.mb !== void 0 && (t.marginBottom = H(e.mb)), e.ml !== void 0 && (t.marginLeft = H(e.ml)), e.p !== void 0 && (t.padding = H(e.p)), e.px !== void 0 && (t.paddingLeft = H(e.px), t.paddingRight = H(e.px)), e.py !== void 0 && (t.paddingTop = H(e.py), t.paddingBottom = H(e.py)), e.pt !== void 0 && (t.paddingTop = H(e.pt)), e.pr !== void 0 && (t.paddingRight = H(e.pr)), e.pb !== void 0 && (t.paddingBottom = H(e.pb)), e.pl !== void 0 && (t.paddingLeft = H(e.pl)), t;
+}
+let Ne = 0;
+function dt(e = "brycks") {
+  return `${e}-${++Ne}`;
+}
+function ut(e, t) {
+  const r = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);
+  if (!r) return e;
+  const o = parseInt(r[1], 16), s = parseInt(r[2], 16), a = parseInt(r[3], 16);
+  return `rgba(${o}, ${s}, ${a}, ${t})`;
+}
+const Le = {
+  none: "0",
+  xs: "var(--brycks-radius-xs)",
+  sm: "var(--brycks-radius-sm)",
+  md: "var(--brycks-radius-md)",
+  lg: "var(--brycks-radius-lg)",
+  xl: "var(--brycks-radius-xl)",
+  "2xl": "var(--brycks-radius-2xl)",
+  "3xl": "var(--brycks-radius-3xl)",
+  full: "var(--brycks-radius-full)"
+}, Re = {
+  none: "none",
+  xs: "var(--brycks-shadow-xs)",
+  sm: "var(--brycks-shadow-sm)",
+  md: "var(--brycks-shadow-md)",
+  lg: "var(--brycks-shadow-lg)",
+  xl: "var(--brycks-shadow-xl)",
+  "2xl": "var(--brycks-shadow-2xl)"
+};
+function Me(e) {
+  const r = {
+    ...ye(e)
+  };
+  return e.display && (r.display = e.display), e.position && (r.position = e.position), e.width && (r.width = e.width), e.height && (r.height = e.height), e.minWidth && (r.minWidth = e.minWidth), e.maxWidth && (r.maxWidth = e.maxWidth), e.minHeight && (r.minHeight = e.minHeight), e.maxHeight && (r.maxHeight = e.maxHeight), e.overflow && (r.overflow = e.overflow), e.bg && (r.backgroundColor = e.bg), e.radius && (r.borderRadius = Le[e.radius]), e.shadow && (r.boxShadow = Re[e.shadow]), r;
+}
+const Fe = [
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "display",
+  "position",
+  "width",
+  "height",
+  "minWidth",
+  "maxWidth",
+  "minHeight",
+  "maxHeight",
+  "overflow",
+  "bg",
+  "radius",
+  "shadow",
+  "testId"
+];
+function je(e) {
+  const t = { ...e };
+  for (const r of Fe)
+    delete t[r];
+  return t;
+}
+const Oe = ({ as: e, className: t, style: r, children: o, testId: s, ...a }, b) => {
+  const l = e || "div", c = Me(a), i = je(a);
+  return /* @__PURE__ */ n(
+    l,
+    {
+      ref: b,
+      className: I("brycks-box", t),
+      style: { ...c, ...r },
+      "data-testid": s,
+      ...i,
+      children: o
+    }
+  );
+}, De = $(Oe);
+De.displayName = "Box";
+const Xe = [
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "direction",
+  "gap",
+  "gapX",
+  "gapY",
+  "align",
+  "justify",
+  "wrap",
+  "inline",
+  "testId"
+];
+function Ee(e) {
+  const t = { ...e };
+  for (const r of Xe)
+    delete t[r];
+  return t;
+}
+function Pe(e) {
+  const r = {
+    ...ye(e),
+    display: e.inline ? "inline-flex" : "flex",
+    flexDirection: e.direction ?? "column"
+  };
+  return e.gap !== void 0 ? r.gap = H(e.gap) : (e.gapX !== void 0 && (r.columnGap = H(e.gapX)), e.gapY !== void 0 && (r.rowGap = H(e.gapY))), e.align && (r.alignItems = e.align), e.justify && (r.justifyContent = e.justify), e.wrap && (r.flexWrap = e.wrap), r;
+}
+const Ve = ({ as: e, className: t, style: r, children: o, testId: s, ...a }, b) => {
+  const l = e || "div", c = Pe(a), i = Ee(a);
+  return /* @__PURE__ */ n(
+    l,
+    {
+      ref: b,
+      className: I("brycks-stack", t),
+      style: { ...c, ...r },
+      "data-testid": s,
+      ...i,
+      children: o
+    }
+  );
+}, ge = $(Ve);
+ge.displayName = "Stack";
+const Ge = (e, t) => /* @__PURE__ */ n(ge, { ref: t, direction: "row", align: "center", ...e }), _e = $(Ge);
+_e.displayName = "HStack";
+const Ye = (e, t) => /* @__PURE__ */ n(ge, { ref: t, direction: "column", ...e }), Ae = $(Ye);
+Ae.displayName = "VStack";
+const Ke = [
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "columns",
+  "rows",
+  "gap",
+  "gapX",
+  "gapY",
+  "align",
+  "justify",
+  "templateColumns",
+  "templateRows",
+  "flow",
+  "inline",
+  "testId"
+];
+function qe(e) {
+  const t = { ...e };
+  for (const r of Ke)
+    delete t[r];
+  return t;
+}
+function Qe(e) {
+  const r = {
+    ...ye(e),
+    display: e.inline ? "inline-grid" : "grid"
+  };
+  return e.columns !== void 0 && (r.gridTemplateColumns = typeof e.columns == "number" ? `repeat(${e.columns}, 1fr)` : e.columns), e.rows !== void 0 && (r.gridTemplateRows = typeof e.rows == "number" ? `repeat(${e.rows}, 1fr)` : e.rows), e.templateColumns && (r.gridTemplateColumns = e.templateColumns), e.templateRows && (r.gridTemplateRows = e.templateRows), e.gap !== void 0 ? r.gap = H(e.gap) : (e.gapX !== void 0 && (r.columnGap = H(e.gapX)), e.gapY !== void 0 && (r.rowGap = H(e.gapY))), e.align && (r.alignItems = e.align), e.justify && (r.justifyItems = e.justify), e.flow && (r.gridAutoFlow = e.flow), r;
+}
+const Ue = ({ as: e, className: t, style: r, children: o, testId: s, ...a }, b) => {
+  const l = e || "div", c = Qe(a), i = qe(a);
+  return /* @__PURE__ */ n(
+    l,
+    {
+      ref: b,
+      className: I("brycks-grid", t),
+      style: { ...c, ...r },
+      "data-testid": s,
+      ...i,
+      children: o
+    }
+  );
+}, Ze = $(Ue);
+Ze.displayName = "Grid";
+const Je = ({
+  as: e,
+  className: t,
+  style: r,
+  children: o,
+  testId: s,
+  colSpan: a,
+  rowSpan: b,
+  colStart: l,
+  colEnd: c,
+  rowStart: i,
+  rowEnd: f,
+  ...h
+}, g) => {
+  const u = e || "div", y = {};
+  return a !== void 0 && (y.gridColumn = a === "full" ? "1 / -1" : `span ${a}`), b !== void 0 && (y.gridRow = `span ${b}`), l !== void 0 && (y.gridColumnStart = l), c !== void 0 && (y.gridColumnEnd = c), i !== void 0 && (y.gridRowStart = i), f !== void 0 && (y.gridRowEnd = f), /* @__PURE__ */ n(
+    u,
+    {
+      ref: g,
+      className: I("brycks-grid-item", t),
+      style: { ...y, ...r },
+      "data-testid": s,
+      ...h,
+      children: o
+    }
+  );
+}, er = $(Je);
+er.displayName = "GridItem";
+const rr = [
+  "m",
+  "mx",
+  "my",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "p",
+  "px",
+  "py",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "size",
+  "centered",
+  "padded",
+  "testId"
+];
+function tr(e) {
+  const t = { ...e };
+  for (const r of rr)
+    delete t[r];
+  return t;
+}
+function or(e) {
+  const t = ye(e), r = e.size ?? "xl", o = We[r], s = {
+    ...t,
+    width: "100%",
+    maxWidth: typeof o == "number" ? `${o}px` : o
+  };
+  return e.centered !== !1 && (s.marginLeft = "auto", s.marginRight = "auto"), e.padded !== !1 && (s.paddingLeft = "var(--brycks-space-4)", s.paddingRight = "var(--brycks-space-4)"), s;
+}
+const nr = ({ as: e, className: t, style: r, children: o, testId: s, ...a }, b) => {
+  const l = e || "div", c = or(a), i = tr(a);
+  return /* @__PURE__ */ n(
+    l,
+    {
+      ref: b,
+      className: I("brycks-container", t),
+      style: { ...c, ...r },
+      "data-testid": s,
+      ...i,
+      children: o
+    }
+  );
+}, sr = $(nr);
+sr.displayName = "Container";
+const ke = {
+  body: { element: "p", styles: Q.bodyDefault },
+  bodyLarge: { element: "p", styles: Q.bodyLarge },
+  bodySmall: { element: "p", styles: Q.bodySmall },
+  label: { element: "span", styles: Q.label },
+  caption: { element: "span", styles: Q.caption },
+  overline: { element: "span", styles: Q.overline },
+  code: { element: "code", styles: Q.code }
+};
+function ar(e) {
+  const t = e.variant ?? "body", r = ke[t].styles, o = {
+    fontFamily: r.fontFamily,
+    fontSize: e.size ? ee[e.size] : r.fontSize,
+    fontWeight: e.weight ? oe[e.weight] : r.fontWeight,
+    lineHeight: e.leading ? de[e.leading] : r.lineHeight,
+    letterSpacing: r.letterSpacing
+  };
+  return "textTransform" in r && (o.textTransform = r.textTransform), e.align && (o.textAlign = e.align), e.color && (o.color = e.color), e.truncate && (o.overflow = "hidden", o.textOverflow = "ellipsis", o.whiteSpace = "nowrap"), e.lineClamp && (o.display = "-webkit-box", o.WebkitLineClamp = e.lineClamp, o.WebkitBoxOrient = "vertical", o.overflow = "hidden"), o;
+}
+const ir = ({ as: e, variant: t = "body", className: r, style: o, children: s, testId: a, ...b }, l) => {
+  const c = e || ke[t].element, i = ar({ variant: t, ...b }), {
+    size: f,
+    weight: h,
+    leading: g,
+    align: u,
+    color: y,
+    truncate: m,
+    lineClamp: d,
+    ...k
+  } = b;
+  return /* @__PURE__ */ n(
+    c,
+    {
+      ref: l,
+      className: I("brycks-text", `brycks-text--${t}`, r),
+      style: { ...i, ...o },
+      "data-testid": a,
+      ...k,
+      children: s
+    }
+  );
+}, pe = $(ir);
+pe.displayName = "Text";
+const cr = (e, t) => /* @__PURE__ */ n(
+  pe,
+  {
+    ...e,
+    ref: t,
+    variant: "code",
+    style: {
+      backgroundColor: "var(--brycks-background-muted)",
+      padding: `${C[0.5]}px ${C[1.5]}px`,
+      borderRadius: "var(--brycks-radius-sm)",
+      ...e.style
+    }
+  }
+), lr = $(cr);
+lr.displayName = "Code";
+const dr = {
+  1: "h1",
+  2: "h2",
+  3: "h3",
+  4: "h4",
+  5: "h5",
+  6: "h6",
+  display: "displayMedium",
+  displayLarge: "displayLarge",
+  displaySmall: "displaySmall"
+};
+function ur(e) {
+  const t = e.level ?? 2, r = e.size ?? t, o = dr[r], s = Q[o], a = {
+    fontFamily: s.fontFamily,
+    fontSize: s.fontSize,
+    fontWeight: e.weight ? oe[e.weight] : s.fontWeight,
+    lineHeight: s.lineHeight,
+    letterSpacing: s.letterSpacing,
+    margin: 0
+  };
+  return e.align && (a.textAlign = e.align), e.color && (a.color = e.color), e.truncate && (a.overflow = "hidden", a.textOverflow = "ellipsis", a.whiteSpace = "nowrap"), a;
+}
+const yr = ({ as: e, level: t = 2, className: r, style: o, children: s, testId: a, ...b }, l) => {
+  const c = e || `h${t}`, i = ur({ level: t, ...b }), {
+    size: f,
+    weight: h,
+    align: g,
+    color: u,
+    truncate: y,
+    ...m
+  } = b;
+  return /* @__PURE__ */ n(
+    c,
+    {
+      ref: l,
+      className: I("brycks-heading", `brycks-heading--${t}`, r),
+      style: { ...i, ...o },
+      "data-testid": a,
+      ...m,
+      children: s
+    }
+  );
+}, ve = $(yr);
+ve.displayName = "Heading";
+const br = ({ size: e = "display", ...t }, r) => /* @__PURE__ */ n(ve, { ref: r, level: 1, size: e, ...t }), fr = $(br);
+fr.displayName = "Display";
+const xe = {
+  xs: {
+    height: U.xs,
+    paddingX: Z.xs,
+    fontSize: N.xs,
+    iconSize: ie.xs,
+    gap: G.xs,
+    radius: "var(--brycks-radius-md)"
+  },
+  sm: {
+    height: U.sm,
+    paddingX: Z.sm,
+    fontSize: N.sm,
+    iconSize: ie.sm,
+    gap: G.sm,
+    radius: "var(--brycks-radius-md)"
+  },
+  md: {
+    height: U.md,
+    paddingX: Z.md,
+    fontSize: N.md,
+    iconSize: ie.md,
+    gap: G.md,
+    radius: "var(--brycks-radius-default)"
+  },
+  lg: {
+    height: U.lg,
+    paddingX: Z.lg,
+    fontSize: N.lg,
+    iconSize: ie.lg,
+    gap: G.md,
+    radius: "var(--brycks-radius-lg)"
+  },
+  xl: {
+    height: U.xl,
+    paddingX: Z.xl,
+    fontSize: N.xl,
+    iconSize: ie.xl,
+    gap: G.lg,
+    radius: "var(--brycks-radius-xl)"
+  }
+}, gr = {
+  primary: {
+    solid: {
+      bg: "var(--brycks-primary-default)",
+      hoverBg: "var(--brycks-primary-hover)",
+      activeBg: "var(--brycks-primary-active)",
+      text: "var(--brycks-primary-foreground)"
+    },
+    outline: {
+      border: "var(--brycks-primary-default)",
+      hoverBg: "var(--brycks-primary-muted)",
+      text: "var(--brycks-primary-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-primary-muted)",
+      text: "var(--brycks-primary-default)"
+    },
+    soft: {
+      bg: "var(--brycks-primary-muted)",
+      hoverBg: "var(--brycks-primary-soft-hover)",
+      text: "var(--brycks-primary-default)"
+    },
+    link: {
+      text: "var(--brycks-primary-default)",
+      hoverText: "var(--brycks-primary-hover)"
+    }
+  },
+  accent: {
+    solid: {
+      bg: "var(--brycks-accent-default)",
+      hoverBg: "var(--brycks-accent-hover)",
+      activeBg: "var(--brycks-accent-active)",
+      text: "var(--brycks-accent-foreground)"
+    },
+    outline: {
+      border: "var(--brycks-accent-default)",
+      hoverBg: "var(--brycks-accent-muted)",
+      text: "var(--brycks-accent-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-accent-muted)",
+      text: "var(--brycks-accent-default)"
+    },
+    soft: {
+      bg: "var(--brycks-accent-muted)",
+      hoverBg: "var(--brycks-accent-soft-hover)",
+      text: "var(--brycks-accent-default)"
+    },
+    link: {
+      text: "var(--brycks-accent-default)",
+      hoverText: "var(--brycks-accent-hover)"
+    }
+  },
+  neutral: {
+    solid: {
+      bg: "var(--brycks-foreground-default)",
+      hoverBg: "var(--brycks-foreground-muted)",
+      activeBg: "var(--brycks-foreground-subtle)",
+      text: "var(--brycks-background-app)"
+    },
+    outline: {
+      border: "var(--brycks-border-strong)",
+      hoverBg: "var(--brycks-background-muted)",
+      text: "var(--brycks-foreground-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-background-muted)",
+      text: "var(--brycks-foreground-default)"
+    },
+    soft: {
+      bg: "var(--brycks-background-muted)",
+      hoverBg: "var(--brycks-background-subtle)",
+      text: "var(--brycks-foreground-default)"
+    },
+    link: {
+      text: "var(--brycks-foreground-default)",
+      hoverText: "var(--brycks-foreground-muted)"
+    }
+  },
+  success: {
+    solid: {
+      bg: "var(--brycks-success-default)",
+      hoverBg: "var(--brycks-success-hover)",
+      activeBg: "var(--brycks-success-hover)",
+      text: "var(--brycks-success-foreground)"
+    },
+    outline: {
+      border: "var(--brycks-success-default)",
+      hoverBg: "var(--brycks-success-muted)",
+      text: "var(--brycks-success-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-success-muted)",
+      text: "var(--brycks-success-default)"
+    },
+    soft: {
+      bg: "var(--brycks-success-muted)",
+      hoverBg: "var(--brycks-success-soft-hover)",
+      text: "var(--brycks-success-default)"
+    },
+    link: {
+      text: "var(--brycks-success-default)",
+      hoverText: "var(--brycks-success-hover)"
+    }
+  },
+  warning: {
+    solid: {
+      bg: "var(--brycks-warning-default)",
+      hoverBg: "var(--brycks-warning-hover)",
+      activeBg: "var(--brycks-warning-hover)",
+      text: "var(--brycks-warning-foreground)"
+    },
+    outline: {
+      border: "var(--brycks-warning-default)",
+      hoverBg: "var(--brycks-warning-muted)",
+      text: "var(--brycks-warning-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-warning-muted)",
+      text: "var(--brycks-warning-default)"
+    },
+    soft: {
+      bg: "var(--brycks-warning-muted)",
+      hoverBg: "var(--brycks-warning-soft-hover)",
+      text: "var(--brycks-warning-default)"
+    },
+    link: {
+      text: "var(--brycks-warning-default)",
+      hoverText: "var(--brycks-warning-hover)"
+    }
+  },
+  error: {
+    solid: {
+      bg: "var(--brycks-error-default)",
+      hoverBg: "var(--brycks-error-hover)",
+      activeBg: "var(--brycks-error-hover)",
+      text: "var(--brycks-error-foreground)"
+    },
+    outline: {
+      border: "var(--brycks-error-default)",
+      hoverBg: "var(--brycks-error-muted)",
+      text: "var(--brycks-error-default)"
+    },
+    ghost: {
+      hoverBg: "var(--brycks-error-muted)",
+      text: "var(--brycks-error-default)"
+    },
+    soft: {
+      bg: "var(--brycks-error-muted)",
+      hoverBg: "var(--brycks-error-soft-hover)",
+      text: "var(--brycks-error-default)"
+    },
+    link: {
+      text: "var(--brycks-error-default)",
+      hoverText: "var(--brycks-error-hover)"
+    }
+  }
+};
+function mr(e) {
+  const { variant: t, intent: r, size: o, fullWidth: s, isIconOnly: a } = e, b = xe[o], l = gr[r][t], c = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: b.gap,
+    height: b.height,
+    minWidth: a ? b.height : void 0,
+    width: s ? "100%" : void 0,
+    padding: a ? 0 : `0 ${b.paddingX}px`,
+    fontSize: b.fontSize,
+    fontWeight: E.medium,
+    fontFamily: "var(--brycks-font-sans)",
+    lineHeight: F.none,
+    borderRadius: b.radius,
+    border: "none",
+    outline: "none",
+    cursor: "pointer",
+    userSelect: "none",
+    textDecoration: "none",
+    transition: te.quick,
+    WebkitTapHighlightColor: "transparent"
+  };
+  switch (t) {
+    case "solid": {
+      const u = l;
+      Object.assign(c, {
+        backgroundColor: u.bg,
+        color: u.text,
+        boxShadow: "var(--brycks-shadow-xs)"
+      });
+      break;
+    }
+    case "outline": {
+      const u = l;
+      Object.assign(c, {
+        backgroundColor: "transparent",
+        color: u.text,
+        border: `1px solid ${u.border}`
+      });
+      break;
+    }
+    case "ghost": {
+      Object.assign(c, {
+        backgroundColor: "transparent",
+        color: l.text
+      });
+      break;
+    }
+    case "soft": {
+      const u = l;
+      Object.assign(c, {
+        backgroundColor: u.bg,
+        color: u.text
+      });
+      break;
+    }
+    case "link": {
+      Object.assign(c, {
+        backgroundColor: "transparent",
+        color: l.text,
+        height: "auto",
+        padding: 0,
+        borderRadius: 0
+      });
+      break;
+    }
+  }
+  const i = {};
+  switch (t) {
+    case "solid": {
+      const u = l;
+      i.backgroundColor = u.hoverBg, i.boxShadow = "var(--brycks-shadow-sm)";
+      break;
+    }
+    case "outline": {
+      const u = l;
+      i.backgroundColor = u.hoverBg;
+      break;
+    }
+    case "ghost": {
+      const u = l;
+      i.backgroundColor = u.hoverBg;
+      break;
+    }
+    case "soft": {
+      const u = l;
+      i.backgroundColor = u.hoverBg;
+      break;
+    }
+    case "link": {
+      const u = l;
+      i.color = u.hoverText, i.textDecoration = "underline";
+      break;
+    }
+  }
+  const f = {
+    transform: t !== "link" ? `scale(${re.pressed})` : void 0
+  };
+  if (t === "solid") {
+    const u = l;
+    f.backgroundColor = u.activeBg, f.boxShadow = "var(--brycks-shadow-xs)";
+  }
+  const h = {
+    opacity: ue.disabled,
+    cursor: "not-allowed",
+    pointerEvents: "none"
+  };
+  return { base: c, hover: i, active: f, disabled: h, loading: {
+    cursor: "wait",
+    pointerEvents: "none"
+  } };
+}
+function hr({ size: e }) {
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: e,
+      height: e,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      style: {
+        animation: "brycks-spin 1s linear infinite"
+      },
+      children: [
+        /* @__PURE__ */ n("style", { children: `
+          @keyframes brycks-spin {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+          }
+        ` }),
+        /* @__PURE__ */ n(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeDasharray: "31.4 31.4",
+            opacity: "0.25"
+          }
+        ),
+        /* @__PURE__ */ n(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeDasharray: "31.4 31.4",
+            strokeDashoffset: "62.8",
+            style: { transform: "rotate(-90deg)", transformOrigin: "center" }
+          }
+        )
+      ]
+    }
+  );
+}
+const kr = ({
+  as: e,
+  variant: t = "solid",
+  intent: r = "primary",
+  size: o = "md",
+  fullWidth: s,
+  isLoading: a,
+  isDisabled: b,
+  leftIcon: l,
+  rightIcon: c,
+  isIconOnly: i,
+  className: f,
+  style: h,
+  children: g,
+  testId: u,
+  onMouseEnter: y,
+  onMouseLeave: m,
+  onMouseDown: d,
+  onMouseUp: k,
+  ...W
+}, T) => {
+  const B = e || "button", [M, x] = V(!1), [w, S] = V(!1), L = b || a, z = mr({
+    variant: t,
+    intent: r,
+    size: o,
+    fullWidth: s,
+    isIconOnly: i
+  }), v = {
+    ...z.base,
+    ...M && !L ? z.hover : {},
+    ...w && !L ? z.active : {},
+    ...L ? z.disabled : {},
+    ...a ? z.loading : {},
+    ...h
+  }, O = xe[o], X = (_) => {
+    x(!0), y == null || y(_);
+  }, Y = (_) => {
+    x(!1), S(!1), m == null || m(_);
+  }, A = (_) => {
+    S(!0), d == null || d(_);
+  }, K = (_) => {
+    S(!1), k == null || k(_);
+  }, be = I(
+    "brycks-button",
+    `brycks-button--${t}`,
+    `brycks-button--${r}`,
+    `brycks-button--${o}`,
+    s && "brycks-button--full-width",
+    i && "brycks-button--icon-only",
+    a && "brycks-button--loading",
+    L && "brycks-button--disabled",
+    f
+  ), fe = B === "button" || e === void 0 ? {
+    type: W.type ?? "button",
+    disabled: L
+  } : {
+    "aria-disabled": L || void 0,
+    role: "button",
+    tabIndex: L ? -1 : 0
+  };
+  return /* @__PURE__ */ p(
+    B,
+    {
+      ref: T,
+      className: be,
+      style: v,
+      "data-testid": u,
+      onMouseEnter: X,
+      onMouseLeave: Y,
+      onMouseDown: A,
+      onMouseUp: K,
+      ...fe,
+      ...W,
+      children: [
+        a && /* @__PURE__ */ n(
+          "span",
+          {
+            style: {
+              display: "inline-flex",
+              position: i ? "absolute" : "relative"
+            },
+            children: /* @__PURE__ */ n(hr, { size: O.iconSize })
+          }
+        ),
+        !a && l && /* @__PURE__ */ n(
+          "span",
+          {
+            style: {
+              display: "inline-flex",
+              width: O.iconSize,
+              height: O.iconSize
+            },
+            children: l
+          }
+        ),
+        !i && /* @__PURE__ */ n(
+          "span",
+          {
+            style: {
+              opacity: a && !i ? 0.5 : 1
+            },
+            children: g
+          }
+        ),
+        !a && c && /* @__PURE__ */ n(
+          "span",
+          {
+            style: {
+              display: "inline-flex",
+              width: O.iconSize,
+              height: O.iconSize
+            },
+            children: c
+          }
+        ),
+        i && !a && g
+      ]
+    }
+  );
+}, we = $(kr);
+we.displayName = "Button";
+const pr = (e, t) => /* @__PURE__ */ n(we, { ref: t, isIconOnly: !0, ...e }), vr = $(pr);
+vr.displayName = "IconButton";
+const xr = {
+  sm: {
+    height: U.sm,
+    fontSize: N.sm,
+    paddingX: Z.sm,
+    radius: "var(--brycks-radius-md)"
+  },
+  md: {
+    height: U.md,
+    fontSize: N.md,
+    paddingX: Z.md,
+    radius: "var(--brycks-radius-default)"
+  },
+  lg: {
+    height: U.lg,
+    fontSize: N.lg,
+    paddingX: Z.lg,
+    radius: "var(--brycks-radius-lg)"
+  }
+}, Se = $(function({
+  size: t = "md",
+  variant: r = "outline",
+  isInvalid: o,
+  leftElement: s,
+  rightElement: a,
+  className: b,
+  style: l,
+  testId: c,
+  disabled: i,
+  onFocus: f,
+  onBlur: h,
+  ...g
+}, u) {
+  const [y, m] = V(!1), d = xr[t], k = () => {
+    const x = {
+      display: "flex",
+      alignItems: "center",
+      width: "100%",
+      position: "relative",
+      height: d.height,
+      borderRadius: d.radius,
+      transition: te.default
+    };
+    switch (r) {
+      case "outline":
+        Object.assign(x, {
+          backgroundColor: "var(--brycks-background-app)",
+          border: `1px solid ${o ? "var(--brycks-error-default)" : y ? "var(--brycks-border-focus)" : "var(--brycks-border-default)"}`,
+          boxShadow: y ? o ? J.error : J.default : J.none
+        });
+        break;
+      case "filled":
+        Object.assign(x, {
+          backgroundColor: "var(--brycks-background-muted)",
+          border: "1px solid transparent",
+          borderColor: o ? "var(--brycks-error-default)" : y ? "var(--brycks-border-focus)" : "transparent"
+        });
+        break;
+      case "flushed":
+        Object.assign(x, {
+          backgroundColor: "transparent",
+          borderRadius: 0,
+          borderBottom: `2px solid ${o ? "var(--brycks-error-default)" : y ? "var(--brycks-border-focus)" : "var(--brycks-border-default)"}`
+        });
+        break;
+    }
+    return i && Object.assign(x, {
+      opacity: ue.disabled,
+      cursor: "not-allowed"
+    }), x;
+  }, W = {
+    width: "100%",
+    height: d.height,
+    fontFamily: "var(--brycks-font-sans)",
+    fontSize: d.fontSize,
+    color: "var(--brycks-foreground-default)",
+    backgroundColor: "transparent",
+    border: "none",
+    outline: "none",
+    borderRadius: d.radius,
+    paddingLeft: s ? G.md : d.paddingX,
+    paddingRight: a ? G.md : d.paddingX,
+    cursor: i ? "not-allowed" : "text",
+    transition: te.default
+  }, T = (x) => {
+    m(!0), f == null || f(x);
+  }, B = (x) => {
+    m(!1), h == null || h(x);
+  }, M = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    color: "var(--brycks-foreground-muted)",
+    flexShrink: 0
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      className: I(
+        "brycks-input-wrapper",
+        `brycks-input-wrapper--${r}`,
+        `brycks-input-wrapper--${t}`,
+        o && "brycks-input-wrapper--invalid",
+        i && "brycks-input-wrapper--disabled",
+        b
+      ),
+      style: { ...k(), ...l },
+      children: [
+        s && /* @__PURE__ */ n(
+          "span",
+          {
+            className: "brycks-input-left-element",
+            style: { ...M, paddingLeft: d.paddingX },
+            children: s
+          }
+        ),
+        /* @__PURE__ */ n(
+          "input",
+          {
+            ref: u,
+            className: "brycks-input",
+            style: W,
+            disabled: i,
+            "aria-invalid": o,
+            "data-testid": c,
+            onFocus: T,
+            onBlur: B,
+            ...g
+          }
+        ),
+        a && /* @__PURE__ */ n(
+          "span",
+          {
+            className: "brycks-input-right-element",
+            style: { ...M, paddingRight: d.paddingX },
+            children: a
+          }
+        )
+      ]
+    }
+  );
+});
+Se.displayName = "Input";
+const wr = $(function({
+  label: t,
+  helperText: r,
+  errorMessage: o,
+  isRequired: s,
+  hideLabel: a,
+  isInvalid: b,
+  id: l,
+  className: c,
+  testId: i,
+  ...f
+}, h) {
+  const g = He(), u = l ?? g, y = `${u}-helper`, m = `${u}-error`, d = !!o || b, k = [d && m, r && y].filter(Boolean).join(" "), W = {
+    display: "block",
+    marginBottom: 6,
+    fontSize: 13,
+    fontWeight: 500,
+    color: "var(--brycks-foreground-default)",
+    ...a && {
+      position: "absolute",
+      width: 1,
+      height: 1,
+      padding: 0,
+      margin: -1,
+      overflow: "hidden",
+      clip: "rect(0, 0, 0, 0)",
+      whiteSpace: "nowrap",
+      border: 0
+    }
+  }, T = {
+    display: "block",
+    marginTop: 6,
+    fontSize: 12,
+    lineHeight: 1.5,
+    color: "var(--brycks-foreground-muted)"
+  }, B = {
+    ...T,
+    color: "var(--brycks-error-default)"
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      className: I(
+        "brycks-text-field",
+        d && "brycks-text-field--error",
+        c
+      ),
+      "data-testid": i,
+      children: [
+        t && /* @__PURE__ */ p("label", { htmlFor: u, style: W, children: [
+          t,
+          s && /* @__PURE__ */ n(
+            "span",
+            {
+              "aria-hidden": "true",
+              style: {
+                color: "var(--brycks-error-default)",
+                marginLeft: 2
+              },
+              children: "*"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n(
+          Se,
+          {
+            ref: h,
+            id: u,
+            isInvalid: d,
+            "aria-describedby": k || void 0,
+            "aria-required": s,
+            ...f
+          }
+        ),
+        d && o && /* @__PURE__ */ n("span", { id: m, role: "alert", style: B, children: o }),
+        !d && r && /* @__PURE__ */ n("span", { id: y, style: T, children: r })
+      ]
+    }
+  );
+});
+wr.displayName = "TextField";
+const Sr = {
+  sm: { height: 32, fontSize: 13, padding: 10 },
+  md: { height: 40, fontSize: 14, padding: 12 },
+  lg: { height: 48, fontSize: 15, padding: 14 }
+};
+function Cr() {
+  return /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M2.5 4.5L6 8L9.5 4.5",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+const zr = $(function({
+  size: t = "md",
+  variant: r = "outline",
+  isInvalid: o,
+  placeholder: s,
+  className: a,
+  style: b,
+  testId: l,
+  disabled: c,
+  children: i,
+  onFocus: f,
+  onBlur: h,
+  value: g,
+  ...u
+}, y) {
+  const [m, d] = V(!1), k = Sr[t], W = g !== void 0 && g !== "", T = {
+    position: "relative",
+    display: "inline-flex",
+    width: "100%"
+  }, B = () => {
+    const S = {
+      width: "100%",
+      height: k.height,
+      paddingLeft: k.padding,
+      paddingRight: k.padding + 24,
+      fontSize: k.fontSize,
+      fontFamily: "var(--brycks-font-sans)",
+      color: W || !s ? "var(--brycks-foreground-default)" : "var(--brycks-foreground-muted)",
+      backgroundColor: r === "filled" ? "var(--brycks-background-muted)" : "var(--brycks-background-app)",
+      border: `1px solid ${o ? "var(--brycks-error-default)" : m ? "var(--brycks-border-focus)" : r === "filled" ? "transparent" : "var(--brycks-border-default)"}`,
+      borderRadius: "var(--brycks-radius-default)",
+      outline: "none",
+      cursor: c ? "not-allowed" : "pointer",
+      appearance: "none",
+      WebkitAppearance: "none",
+      transition: "all 200ms ease-out",
+      boxShadow: m ? o ? "0 0 0 3px rgba(239, 68, 68, 0.15)" : "0 0 0 3px rgba(85, 120, 244, 0.15)" : "none"
+    };
+    return c && (S.opacity = 0.5), S;
+  }, M = {
+    position: "absolute",
+    right: k.padding,
+    top: "50%",
+    transform: "translateY(-50%)",
+    pointerEvents: "none",
+    color: "var(--brycks-foreground-muted)",
+    transition: "transform 200ms ease-out"
+  }, x = (S) => {
+    d(!0), f == null || f(S);
+  }, w = (S) => {
+    d(!1), h == null || h(S);
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      className: I(
+        "brycks-select-wrapper",
+        `brycks-select-wrapper--${r}`,
+        `brycks-select-wrapper--${t}`,
+        o && "brycks-select-wrapper--invalid",
+        c && "brycks-select-wrapper--disabled",
+        a
+      ),
+      style: { ...T, ...b },
+      children: [
+        /* @__PURE__ */ p(
+          "select",
+          {
+            ref: y,
+            className: "brycks-select",
+            style: B(),
+            disabled: c,
+            "aria-invalid": o,
+            "data-testid": l,
+            value: g,
+            onFocus: x,
+            onBlur: w,
+            ...u,
+            children: [
+              s && /* @__PURE__ */ n("option", { value: "", disabled: !0, children: s }),
+              i
+            ]
+          }
+        ),
+        /* @__PURE__ */ n("span", { style: M, children: /* @__PURE__ */ n(Cr, {}) })
+      ]
+    }
+  );
+});
+zr.displayName = "Select";
+function $r({ size: e }) {
+  return /* @__PURE__ */ n("svg", { width: e, height: e, viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M2.5 6L5 8.5L9.5 4",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+function Br({ size: e }) {
+  return /* @__PURE__ */ n("svg", { width: e, height: e, viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M2.5 6H9.5",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+const Wr = $(function({
+  size: t = "md",
+  label: r,
+  description: o,
+  isInvalid: s,
+  isIndeterminate: a,
+  className: b,
+  style: l,
+  testId: c,
+  disabled: i,
+  checked: f,
+  onChange: h,
+  ...g
+}, u) {
+  const [y, m] = V(!1), [d, k] = V(!1), [W, T] = V(!1), B = Ie[t], M = N[t], x = f || a, w = {
+    display: "inline-flex",
+    alignItems: "flex-start",
+    gap: G.lg,
+    cursor: i ? "not-allowed" : "pointer",
+    opacity: i ? ue.disabled : 1
+  }, S = {
+    position: "relative",
+    width: B.box,
+    height: B.box,
+    borderRadius: "var(--brycks-radius-sm)",
+    border: `1.5px solid ${s ? "var(--brycks-error-default)" : x ? "var(--brycks-primary-default)" : y ? "var(--brycks-border-focus)" : "var(--brycks-border-default)"}`,
+    backgroundColor: x ? "var(--brycks-primary-default)" : d ? "var(--brycks-background-subtle)" : "var(--brycks-background-app)",
+    transition: te.quick,
+    transform: W ? `scale(${re.controlPressed})` : `scale(${re.normal})`,
+    boxShadow: y ? J.default : J.none,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0
+  }, L = {
+    color: "var(--brycks-primary-foreground)",
+    opacity: x ? 1 : 0,
+    transform: x ? `scale(${re.normal})` : `scale(${re.hidden})`,
+    transition: te.quick
+  }, z = {
+    position: "absolute",
+    width: "100%",
+    height: "100%",
+    opacity: 0,
+    cursor: i ? "not-allowed" : "pointer",
+    margin: 0
+  }, v = {
+    display: "flex",
+    flexDirection: "column",
+    gap: G.xs,
+    paddingTop: (B.box - M) / 2
+  }, O = {
+    fontSize: M,
+    lineHeight: F.snug,
+    color: "var(--brycks-foreground-default)",
+    userSelect: "none"
+  }, X = {
+    fontSize: M - 1,
+    lineHeight: F.snug,
+    color: "var(--brycks-foreground-muted)",
+    userSelect: "none"
+  };
+  return /* @__PURE__ */ p(
+    "label",
+    {
+      className: I(
+        "brycks-checkbox",
+        `brycks-checkbox--${t}`,
+        x && "brycks-checkbox--checked",
+        s && "brycks-checkbox--invalid",
+        i && "brycks-checkbox--disabled",
+        b
+      ),
+      style: { ...w, ...l },
+      "data-testid": c,
+      onMouseEnter: () => k(!0),
+      onMouseLeave: () => {
+        k(!1), T(!1);
+      },
+      onMouseDown: () => T(!0),
+      onMouseUp: () => T(!1),
+      children: [
+        /* @__PURE__ */ p("span", { style: S, children: [
+          /* @__PURE__ */ n(
+            "input",
+            {
+              ref: u,
+              type: "checkbox",
+              style: z,
+              checked: f,
+              disabled: i,
+              "aria-invalid": s,
+              onChange: h,
+              onFocus: () => m(!0),
+              onBlur: () => m(!1),
+              ...g
+            }
+          ),
+          /* @__PURE__ */ n("span", { style: L, children: a ? /* @__PURE__ */ n(Br, { size: B.icon }) : /* @__PURE__ */ n($r, { size: B.icon }) })
+        ] }),
+        (r || o) && /* @__PURE__ */ p("span", { style: v, children: [
+          r && /* @__PURE__ */ n("span", { style: O, children: r }),
+          o && /* @__PURE__ */ n("span", { style: X, children: o })
+        ] })
+      ]
+    }
+  );
+});
+Wr.displayName = "Checkbox";
+const Hr = $(function({
+  size: t = "md",
+  label: r,
+  description: o,
+  className: s,
+  style: a,
+  testId: b,
+  disabled: l,
+  checked: c,
+  onChange: i,
+  ...f
+}, h) {
+  const [g, u] = V(!1), [y, m] = V(!1), d = Te[t], k = N[t], W = (d.height - d.thumb) / 2, T = d.width - d.thumb - W * 2, B = {
+    display: "inline-flex",
+    alignItems: "flex-start",
+    gap: G.xl,
+    cursor: l ? "not-allowed" : "pointer",
+    opacity: l ? ue.disabled : 1
+  }, M = {
+    position: "relative",
+    width: d.width,
+    height: d.height,
+    borderRadius: d.height / 2,
+    backgroundColor: c ? "var(--brycks-primary-default)" : "var(--brycks-background-muted)",
+    border: `1px solid ${c ? "var(--brycks-primary-default)" : "var(--brycks-border-default)"}`,
+    transition: te.spring,
+    boxShadow: g ? J.default : "inset 0 1px 2px rgba(0,0,0,0.05)",
+    flexShrink: 0
+  }, x = {
+    position: "absolute",
+    top: W,
+    left: c ? W + T : W,
+    width: y ? d.thumb + 4 : d.thumb,
+    height: d.thumb,
+    borderRadius: d.thumb / 2,
+    backgroundColor: "var(--brycks-background-elevated)",
+    boxShadow: "var(--brycks-shadow-sm)",
+    transition: te.spring,
+    transform: y ? `scale(${re.pressedStrong})` : `scale(${re.normal})`
+  }, w = {
+    position: "absolute",
+    width: "100%",
+    height: "100%",
+    opacity: 0,
+    cursor: l ? "not-allowed" : "pointer",
+    margin: 0
+  }, S = {
+    display: "flex",
+    flexDirection: "column",
+    gap: G.xs,
+    paddingTop: (d.height - k * F.snug) / 2
+  }, L = {
+    fontSize: k,
+    lineHeight: F.snug,
+    color: "var(--brycks-foreground-default)",
+    userSelect: "none"
+  }, z = {
+    fontSize: k - 1,
+    lineHeight: F.snug,
+    color: "var(--brycks-foreground-muted)",
+    userSelect: "none"
+  };
+  return /* @__PURE__ */ p(
+    "label",
+    {
+      className: I(
+        "brycks-switch",
+        `brycks-switch--${t}`,
+        c && "brycks-switch--checked",
+        l && "brycks-switch--disabled",
+        s
+      ),
+      style: { ...B, ...a },
+      "data-testid": b,
+      onMouseDown: () => m(!0),
+      onMouseUp: () => m(!1),
+      onMouseLeave: () => m(!1),
+      children: [
+        /* @__PURE__ */ p("span", { style: M, children: [
+          /* @__PURE__ */ n(
+            "input",
+            {
+              ref: h,
+              type: "checkbox",
+              role: "switch",
+              style: w,
+              checked: c,
+              disabled: l,
+              "aria-checked": c,
+              onChange: i,
+              onFocus: () => u(!0),
+              onBlur: () => u(!1),
+              ...f
+            }
+          ),
+          /* @__PURE__ */ n("span", { style: x })
+        ] }),
+        (r || o) && /* @__PURE__ */ p("span", { style: S, children: [
+          r && /* @__PURE__ */ n("span", { style: L, children: r }),
+          o && /* @__PURE__ */ n("span", { style: z, children: o })
+        ] })
+      ]
+    }
+  );
+});
+Hr.displayName = "Switch";
+const Ir = {
+  sm: { fontSize: 13, padding: 10, lineHeight: 1.5 },
+  md: { fontSize: 14, padding: 12, lineHeight: 1.5 },
+  lg: { fontSize: 15, padding: 14, lineHeight: 1.5 }
+}, Tr = $(function({
+  size: t = "md",
+  variant: r = "outline",
+  isInvalid: o,
+  autoResize: s,
+  minRows: a = 3,
+  maxRows: b = 10,
+  showCount: l,
+  maxLength: c,
+  className: i,
+  style: f,
+  testId: h,
+  disabled: g,
+  value: u,
+  defaultValue: y,
+  onChange: m,
+  onFocus: d,
+  onBlur: k,
+  ...W
+}, T) {
+  const [B, M] = V(!1), [x, w] = V(0), S = ne(null), L = T || S, z = Ir[t], v = z.fontSize * z.lineHeight, O = v * a + z.padding * 2, X = v * b + z.padding * 2, Y = se(() => {
+    const D = L.current;
+    if (!D || !s) return;
+    D.style.height = "auto";
+    const $e = D.scrollHeight, Be = Math.min(Math.max($e, O), X);
+    D.style.height = `${Be}px`;
+  }, [s, O, X, L]);
+  ae(() => {
+    Y();
+  }, [u, Y]), ae(() => {
+    const D = String(u ?? y ?? "");
+    w(D.length);
+  }, [u, y]);
+  const A = () => {
+    const D = {
+      width: "100%",
+      minHeight: O,
+      maxHeight: s ? X : void 0,
+      padding: z.padding,
+      fontSize: z.fontSize,
+      lineHeight: z.lineHeight,
+      fontFamily: "var(--brycks-font-sans)",
+      color: "var(--brycks-foreground-default)",
+      backgroundColor: r === "filled" ? "var(--brycks-background-muted)" : "var(--brycks-background-app)",
+      border: `1px solid ${o ? "var(--brycks-error-default)" : B ? "var(--brycks-border-focus)" : r === "filled" ? "transparent" : "var(--brycks-border-default)"}`,
+      borderRadius: "var(--brycks-radius-default)",
+      outline: "none",
+      resize: s ? "none" : "vertical",
+      transition: "all 200ms ease-out",
+      boxShadow: B ? o ? "0 0 0 3px rgba(239, 68, 68, 0.15)" : "0 0 0 3px rgba(85, 120, 244, 0.15)" : "none"
+    };
+    return g && (D.opacity = 0.5, D.cursor = "not-allowed", D.resize = "none"), D;
+  }, K = {
+    position: "relative",
+    width: "100%"
+  }, be = {
+    position: "absolute",
+    bottom: 8,
+    right: 12,
+    fontSize: 11,
+    color: x >= (c ?? 1 / 0) ? "var(--brycks-error-default)" : "var(--brycks-foreground-muted)",
+    pointerEvents: "none",
+    transition: "color 150ms ease-out"
+  }, me = (D) => {
+    w(D.target.value.length), m == null || m(D);
+  }, fe = (D) => {
+    M(!0), d == null || d(D);
+  }, _ = (D) => {
+    M(!1), k == null || k(D);
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      className: I(
+        "brycks-textarea-wrapper",
+        `brycks-textarea-wrapper--${r}`,
+        `brycks-textarea-wrapper--${t}`,
+        o && "brycks-textarea-wrapper--invalid",
+        g && "brycks-textarea-wrapper--disabled",
+        i
+      ),
+      style: { ...K, ...f },
+      children: [
+        /* @__PURE__ */ n(
+          "textarea",
+          {
+            ref: L,
+            className: "brycks-textarea",
+            style: A(),
+            disabled: g,
+            "aria-invalid": o,
+            "data-testid": h,
+            value: u,
+            defaultValue: y,
+            maxLength: c,
+            onChange: me,
+            onFocus: fe,
+            onBlur: _,
+            ...W
+          }
+        ),
+        l && /* @__PURE__ */ p("span", { style: be, children: [
+          x,
+          c ? `/${c}` : ""
+        ] })
+      ]
+    }
+  );
+});
+Tr.displayName = "Textarea";
+const Nr = {
+  sm: "400px",
+  md: "500px",
+  lg: "640px",
+  xl: "800px",
+  full: "calc(100vw - 48px)"
+};
+function Lr() {
+  return /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n(
+    "path",
+    {
+      d: "M4 4L12 12M12 4L4 12",
+      stroke: "currentColor",
+      strokeWidth: "1.5",
+      strokeLinecap: "round"
+    }
+  ) });
+}
+const Rr = $(function({
+  isOpen: t,
+  onClose: r,
+  size: o = "md",
+  title: s,
+  description: a,
+  closeOnOverlayClick: b = !0,
+  closeOnEscape: l = !0,
+  showCloseButton: c = !0,
+  className: i,
+  style: f,
+  testId: h,
+  children: g,
+  ...u
+}, y) {
+  const m = ne(null), d = ne(null);
+  ae(() => {
+    if (!t) return;
+    d.current = document.activeElement;
+    const v = m.current;
+    v && v.focus();
+    const O = (X) => {
+      if (X.key === "Escape" && l) {
+        r();
+        return;
+      }
+      if (X.key === "Tab" && v) {
+        const Y = v.querySelectorAll(
+          'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+        ), A = Y[0], K = Y[Y.length - 1];
+        X.shiftKey && document.activeElement === A ? (X.preventDefault(), K == null || K.focus()) : !X.shiftKey && document.activeElement === K && (X.preventDefault(), A == null || A.focus());
+      }
+    };
+    return document.addEventListener("keydown", O), document.body.style.overflow = "hidden", () => {
+      var X;
+      document.removeEventListener("keydown", O), document.body.style.overflow = "", (X = d.current) == null || X.focus();
+    };
+  }, [t, l, r]);
+  const k = se(
+    (v) => {
+      v.target === v.currentTarget && b && r();
+    },
+    [b, r]
+  );
+  if (!t) return null;
+  const W = {
+    position: "fixed",
+    inset: 0,
+    zIndex: "var(--brycks-z-modal)",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    padding: 24,
+    backgroundColor: "var(--brycks-background-overlay)",
+    backdropFilter: "blur(4px)",
+    animation: "brycks-fade-in 200ms ease-out"
+  }, T = {
+    position: "relative",
+    width: "100%",
+    maxWidth: Nr[o],
+    maxHeight: o === "full" ? "calc(100vh - 48px)" : "85vh",
+    backgroundColor: "var(--brycks-background-elevated)",
+    borderRadius: "var(--brycks-radius-xl)",
+    boxShadow: "var(--brycks-shadow-2xl)",
+    display: "flex",
+    flexDirection: "column",
+    overflow: "hidden",
+    animation: "brycks-scale-in 200ms cubic-bezier(0.34, 1.56, 0.64, 1)",
+    outline: "none",
+    ...f
+  }, B = {
+    display: "flex",
+    alignItems: "flex-start",
+    justifyContent: "space-between",
+    padding: "20px 24px",
+    borderBottom: "1px solid var(--brycks-border-muted)"
+  }, M = {
+    display: "flex",
+    flexDirection: "column",
+    gap: 4
+  }, x = {
+    fontSize: 18,
+    fontWeight: 600,
+    color: "var(--brycks-foreground-default)",
+    margin: 0,
+    lineHeight: 1.3
+  }, w = {
+    fontSize: 14,
+    color: "var(--brycks-foreground-muted)",
+    margin: 0
+  }, S = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: 32,
+    height: 32,
+    borderRadius: "var(--brycks-radius-md)",
+    color: "var(--brycks-foreground-muted)",
+    transition: "all 150ms ease-out",
+    marginLeft: 12,
+    flexShrink: 0
+  }, L = {
+    flex: 1,
+    overflow: "auto",
+    padding: 24
+  }, z = /* @__PURE__ */ p(ce, { children: [
+    /* @__PURE__ */ n("style", { children: `
+          @keyframes brycks-fade-in {
+            from { opacity: 0; }
+            to { opacity: 1; }
+          }
+          @keyframes brycks-scale-in {
+            from { opacity: 0; transform: scale(0.95); }
+            to { opacity: 1; transform: scale(1); }
+          }
+        ` }),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        className: "brycks-modal-overlay",
+        style: W,
+        onClick: k,
+        "aria-hidden": "true",
+        children: /* @__PURE__ */ p(
+          "div",
+          {
+            ref: (v) => {
+              m.current = v, typeof y == "function" ? y(v) : y && (y.current = v);
+            },
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-labelledby": s ? "brycks-modal-title" : void 0,
+            "aria-describedby": a ? "brycks-modal-description" : void 0,
+            className: I("brycks-modal", `brycks-modal--${o}`, i),
+            style: T,
+            tabIndex: -1,
+            "data-testid": h,
+            ...u,
+            children: [
+              (s || c) && /* @__PURE__ */ p("div", { className: "brycks-modal-header", style: B, children: [
+                /* @__PURE__ */ p("div", { style: M, children: [
+                  s && /* @__PURE__ */ n("h2", { id: "brycks-modal-title", style: x, children: s }),
+                  a && /* @__PURE__ */ n("p", { id: "brycks-modal-description", style: w, children: a })
+                ] }),
+                c && /* @__PURE__ */ n(
+                  "button",
+                  {
+                    type: "button",
+                    className: "brycks-modal-close",
+                    style: S,
+                    onClick: r,
+                    "aria-label": "Close modal",
+                    onMouseEnter: (v) => {
+                      v.currentTarget.style.backgroundColor = "var(--brycks-background-muted)", v.currentTarget.style.color = "var(--brycks-foreground-default)";
+                    },
+                    onMouseLeave: (v) => {
+                      v.currentTarget.style.backgroundColor = "transparent", v.currentTarget.style.color = "var(--brycks-foreground-muted)";
+                    },
+                    children: /* @__PURE__ */ n(Lr, {})
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ n("div", { className: "brycks-modal-content", style: L, children: g })
+            ]
+          }
+        )
+      }
+    )
+  ] });
+  return he(z, document.body);
+});
+Rr.displayName = "Modal";
+const Mr = {
+  info: {
+    icon: /* @__PURE__ */ p("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+      /* @__PURE__ */ n("circle", { cx: "9", cy: "9", r: "7.5", stroke: "currentColor", strokeWidth: "1.5" }),
+      /* @__PURE__ */ n("path", { d: "M9 8V12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+      /* @__PURE__ */ n("circle", { cx: "9", cy: "5.5", r: "0.75", fill: "currentColor" })
+    ] }),
+    colors: {
+      subtle: {
+        backgroundColor: "var(--brycks-info-muted)",
+        color: "var(--brycks-info-default)",
+        borderColor: "transparent"
+      },
+      solid: {
+        backgroundColor: "var(--brycks-info-default)",
+        color: "var(--brycks-info-foreground)",
+        borderColor: "transparent"
+      },
+      outline: {
+        backgroundColor: "transparent",
+        color: "var(--brycks-info-default)",
+        borderColor: "var(--brycks-info-default)"
+      }
+    }
+  },
+  success: {
+    icon: /* @__PURE__ */ p("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+      /* @__PURE__ */ n("circle", { cx: "9", cy: "9", r: "7.5", stroke: "currentColor", strokeWidth: "1.5" }),
+      /* @__PURE__ */ n("path", { d: "M6 9L8 11L12 7", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
+    ] }),
+    colors: {
+      subtle: {
+        backgroundColor: "var(--brycks-success-muted)",
+        color: "var(--brycks-success-default)",
+        borderColor: "transparent"
+      },
+      solid: {
+        backgroundColor: "var(--brycks-success-default)",
+        color: "var(--brycks-success-foreground)",
+        borderColor: "transparent"
+      },
+      outline: {
+        backgroundColor: "transparent",
+        color: "var(--brycks-success-default)",
+        borderColor: "var(--brycks-success-default)"
+      }
+    }
+  },
+  warning: {
+    icon: /* @__PURE__ */ p("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+      /* @__PURE__ */ n("path", { d: "M9 2L16.5 15H1.5L9 2Z", stroke: "currentColor", strokeWidth: "1.5", strokeLinejoin: "round" }),
+      /* @__PURE__ */ n("path", { d: "M9 7V10", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }),
+      /* @__PURE__ */ n("circle", { cx: "9", cy: "12.5", r: "0.75", fill: "currentColor" })
+    ] }),
+    colors: {
+      subtle: {
+        backgroundColor: "var(--brycks-warning-muted)",
+        color: "var(--brycks-warning-default)",
+        borderColor: "transparent"
+      },
+      solid: {
+        backgroundColor: "var(--brycks-warning-default)",
+        color: "var(--brycks-warning-foreground)",
+        borderColor: "transparent"
+      },
+      outline: {
+        backgroundColor: "transparent",
+        color: "var(--brycks-warning-default)",
+        borderColor: "var(--brycks-warning-default)"
+      }
+    }
+  },
+  error: {
+    icon: /* @__PURE__ */ p("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", children: [
+      /* @__PURE__ */ n("circle", { cx: "9", cy: "9", r: "7.5", stroke: "currentColor", strokeWidth: "1.5" }),
+      /* @__PURE__ */ n("path", { d: "M6.5 6.5L11.5 11.5M11.5 6.5L6.5 11.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
+    ] }),
+    colors: {
+      subtle: {
+        backgroundColor: "var(--brycks-error-muted)",
+        color: "var(--brycks-error-default)",
+        borderColor: "transparent"
+      },
+      solid: {
+        backgroundColor: "var(--brycks-error-default)",
+        color: "var(--brycks-error-foreground)",
+        borderColor: "transparent"
+      },
+      outline: {
+        backgroundColor: "transparent",
+        color: "var(--brycks-error-default)",
+        borderColor: "var(--brycks-error-default)"
+      }
+    }
+  }
+}, Fr = $(function({
+  intent: t = "info",
+  variant: r = "subtle",
+  title: o,
+  icon: s,
+  showIcon: a = !0,
+  action: b,
+  isDismissible: l,
+  onDismiss: c,
+  className: i,
+  style: f,
+  testId: h,
+  children: g,
+  ...u
+}, y) {
+  const m = Mr[t], d = m.colors[r], k = {
+    display: "flex",
+    alignItems: "flex-start",
+    gap: 12,
+    padding: "12px 16px",
+    borderRadius: "var(--brycks-radius-default)",
+    border: `1px solid ${d.borderColor}`,
+    backgroundColor: d.backgroundColor,
+    color: r === "solid" ? d.color : "var(--brycks-foreground-default)",
+    ...f
+  }, W = {
+    flexShrink: 0,
+    color: d.color,
+    marginTop: 1
+  }, T = {
+    flex: 1,
+    minWidth: 0
+  }, B = {
+    fontSize: 14,
+    fontWeight: 600,
+    marginBottom: g ? 4 : 0,
+    color: d.color
+  }, M = {
+    fontSize: 14,
+    lineHeight: 1.5,
+    color: r === "solid" ? d.color : "var(--brycks-foreground-muted)"
+  }, x = {
+    display: "flex",
+    alignItems: "center",
+    gap: 8,
+    flexShrink: 0
+  }, w = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    width: 24,
+    height: 24,
+    borderRadius: "var(--brycks-radius-sm)",
+    color: r === "solid" ? d.color : "var(--brycks-foreground-muted)",
+    transition: "all 150ms ease-out",
+    opacity: 0.7
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      ref: y,
+      role: "alert",
+      className: I(
+        "brycks-alert",
+        `brycks-alert--${t}`,
+        `brycks-alert--${r}`,
+        i
+      ),
+      style: k,
+      "data-testid": h,
+      ...u,
+      children: [
+        a && /* @__PURE__ */ n("span", { className: "brycks-alert-icon", style: W, children: s ?? m.icon }),
+        /* @__PURE__ */ p("div", { className: "brycks-alert-content", style: T, children: [
+          o && /* @__PURE__ */ n("div", { className: "brycks-alert-title", style: B, children: o }),
+          g && /* @__PURE__ */ n("div", { className: "brycks-alert-description", style: M, children: g })
+        ] }),
+        (b || l) && /* @__PURE__ */ p("div", { className: "brycks-alert-actions", style: x, children: [
+          b,
+          l && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: "brycks-alert-dismiss",
+              style: w,
+              onClick: c,
+              "aria-label": "Dismiss alert",
+              onMouseEnter: (S) => {
+                S.currentTarget.style.opacity = "1";
+              },
+              onMouseLeave: (S) => {
+                S.currentTarget.style.opacity = "0.7";
+              },
+              children: /* @__PURE__ */ n("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ n("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+});
+Fr.displayName = "Alert";
+const jr = $(function({
+  content: t,
+  placement: r = "top",
+  delay: o = 200,
+  isDisabled: s,
+  className: a,
+  testId: b,
+  children: l,
+  ...c
+}, i) {
+  const [f, h] = V(!1), [g, u] = V({ top: 0, left: 0 }), y = ne(null), m = ne(null), d = ne(), k = se(() => {
+    if (!y.current || !m.current) return;
+    const w = y.current.getBoundingClientRect(), S = m.current.getBoundingClientRect(), L = 8;
+    let z = 0, v = 0;
+    switch (r) {
+      case "top":
+        z = w.top - S.height - L, v = w.left + (w.width - S.width) / 2;
+        break;
+      case "bottom":
+        z = w.bottom + L, v = w.left + (w.width - S.width) / 2;
+        break;
+      case "left":
+        z = w.top + (w.height - S.height) / 2, v = w.left - S.width - L;
+        break;
+      case "right":
+        z = w.top + (w.height - S.height) / 2, v = w.right + L;
+        break;
+    }
+    const O = 8;
+    v = Math.max(O, Math.min(v, window.innerWidth - S.width - O)), z = Math.max(O, Math.min(z, window.innerHeight - S.height - O)), u({ top: z, left: v });
+  }, [r]);
+  ae(() => (f && (k(), window.addEventListener("scroll", k, !0), window.addEventListener("resize", k)), () => {
+    window.removeEventListener("scroll", k, !0), window.removeEventListener("resize", k);
+  }), [f, k]);
+  const W = () => {
+    s || (d.current = setTimeout(() => {
+      h(!0);
+    }, o));
+  }, T = () => {
+    d.current && clearTimeout(d.current), h(!1);
+  };
+  ae(() => () => {
+    d.current && clearTimeout(d.current);
+  }, []);
+  const B = {
+    display: "inline-flex"
+  }, M = {
+    position: "fixed",
+    top: g.top,
+    left: g.left,
+    zIndex: "var(--brycks-z-tooltip)",
+    maxWidth: 300,
+    padding: "6px 10px",
+    fontSize: 12,
+    fontWeight: 500,
+    lineHeight: 1.4,
+    color: "var(--brycks-foreground-inverse)",
+    backgroundColor: "var(--brycks-background-inverse)",
+    borderRadius: "var(--brycks-radius-md)",
+    boxShadow: "var(--brycks-shadow-lg)",
+    pointerEvents: "none",
+    animation: "brycks-tooltip-in 150ms ease-out"
+  }, x = {
+    position: "absolute",
+    width: 8,
+    height: 8,
+    backgroundColor: "var(--brycks-background-inverse)",
+    transform: "rotate(45deg)",
+    ...r === "top" && { bottom: -4, left: "50%", marginLeft: -4 },
+    ...r === "bottom" && { top: -4, left: "50%", marginLeft: -4 },
+    ...r === "left" && { right: -4, top: "50%", marginTop: -4 },
+    ...r === "right" && { left: -4, top: "50%", marginTop: -4 }
+  };
+  return /* @__PURE__ */ p(ce, { children: [
+    /* @__PURE__ */ n(
+      "div",
+      {
+        ref: y,
+        style: B,
+        onMouseEnter: W,
+        onMouseLeave: T,
+        onFocus: W,
+        onBlur: T,
+        children: l
+      }
+    ),
+    f && he(
+      /* @__PURE__ */ p(ce, { children: [
+        /* @__PURE__ */ n("style", { children: `
+                @keyframes brycks-tooltip-in {
+                  from { opacity: 0; transform: scale(0.95); }
+                  to { opacity: 1; transform: scale(1); }
+                }
+              ` }),
+        /* @__PURE__ */ p(
+          "div",
+          {
+            ref: (w) => {
+              m.current = w, typeof i == "function" ? i(w) : i && (i.current = w);
+            },
+            role: "tooltip",
+            className: I("brycks-tooltip", `brycks-tooltip--${r}`, a),
+            style: M,
+            "data-testid": b,
+            ...c,
+            children: [
+              t,
+              /* @__PURE__ */ n("span", { style: x })
+            ]
+          }
+        )
+      ] }),
+      document.body
+    )
+  ] });
+});
+jr.displayName = "Tooltip";
+const Or = {
+  sm: { fontSize: 10, padding: "2px 6px", height: 18 },
+  md: { fontSize: 11, padding: "3px 8px", height: 22 },
+  lg: { fontSize: 12, padding: "4px 10px", height: 26 }
+}, Dr = {
+  neutral: {
+    solid: { backgroundColor: "var(--brycks-foreground-default)", color: "var(--brycks-background-app)" },
+    subtle: { backgroundColor: "var(--brycks-background-muted)", color: "var(--brycks-foreground-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-foreground-default)", borderColor: "var(--brycks-border-default)" }
+  },
+  primary: {
+    solid: { backgroundColor: "var(--brycks-primary-default)", color: "var(--brycks-primary-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-primary-muted)", color: "var(--brycks-primary-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-primary-default)", borderColor: "var(--brycks-primary-default)" }
+  },
+  accent: {
+    solid: { backgroundColor: "var(--brycks-accent-default)", color: "var(--brycks-accent-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-accent-muted)", color: "var(--brycks-accent-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-accent-default)", borderColor: "var(--brycks-accent-default)" }
+  },
+  success: {
+    solid: { backgroundColor: "var(--brycks-success-default)", color: "var(--brycks-success-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-success-muted)", color: "var(--brycks-success-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-success-default)", borderColor: "var(--brycks-success-default)" }
+  },
+  warning: {
+    solid: { backgroundColor: "var(--brycks-warning-default)", color: "var(--brycks-warning-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-warning-muted)", color: "var(--brycks-warning-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-warning-default)", borderColor: "var(--brycks-warning-default)" }
+  },
+  error: {
+    solid: { backgroundColor: "var(--brycks-error-default)", color: "var(--brycks-error-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-error-muted)", color: "var(--brycks-error-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-error-default)", borderColor: "var(--brycks-error-default)" }
+  },
+  info: {
+    solid: { backgroundColor: "var(--brycks-info-default)", color: "var(--brycks-info-foreground)" },
+    subtle: { backgroundColor: "var(--brycks-info-muted)", color: "var(--brycks-info-default)" },
+    outline: { backgroundColor: "transparent", color: "var(--brycks-info-default)", borderColor: "var(--brycks-info-default)" }
+  }
+}, Xr = $(function({
+  variant: t = "subtle",
+  intent: r = "neutral",
+  size: o = "md",
+  className: s,
+  style: a,
+  testId: b,
+  children: l,
+  ...c
+}, i) {
+  const f = Or[o], h = Dr[r][t], g = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    fontWeight: 500,
+    fontFamily: "var(--brycks-font-sans)",
+    lineHeight: 1,
+    borderRadius: "var(--brycks-radius-full)",
+    whiteSpace: "nowrap",
+    border: t === "outline" ? "1px solid" : "none",
+    ...f,
+    ...h,
+    ...a
+  };
+  return /* @__PURE__ */ n(
+    "span",
+    {
+      ref: i,
+      className: I(
+        "brycks-badge",
+        `brycks-badge--${t}`,
+        `brycks-badge--${r}`,
+        `brycks-badge--${o}`,
+        s
+      ),
+      style: g,
+      "data-testid": b,
+      ...c,
+      children: l
+    }
+  );
+});
+Xr.displayName = "Badge";
+const Er = {
+  xs: 14,
+  sm: 18,
+  md: 24,
+  lg: 32,
+  xl: 48
+};
+function Pr({ size: e, color: t }) {
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: e,
+      height: e,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      style: { animation: "brycks-spin 1s linear infinite" },
+      children: [
+        /* @__PURE__ */ n(
+          "circle",
+          {
+            cx: "12",
+            cy: "12",
+            r: "10",
+            stroke: t,
+            strokeWidth: "2.5",
+            strokeLinecap: "round",
+            opacity: "0.2"
+          }
+        ),
+        /* @__PURE__ */ n(
+          "path",
+          {
+            d: "M12 2C6.47715 2 2 6.47715 2 12",
+            stroke: t,
+            strokeWidth: "2.5",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+function Vr({ size: e, color: t }) {
+  const r = e / 4, o = e / 6;
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      style: {
+        display: "flex",
+        alignItems: "center",
+        gap: o,
+        height: e
+      },
+      children: [0, 1, 2].map((s) => /* @__PURE__ */ n(
+        "span",
+        {
+          style: {
+            width: r,
+            height: r,
+            borderRadius: "50%",
+            backgroundColor: t,
+            animation: "brycks-bounce 1.4s ease-in-out infinite",
+            animationDelay: `${s * 0.16}s`
+          }
+        },
+        s
+      ))
+    }
+  );
+}
+function Gr({ size: e, color: t }) {
+  return /* @__PURE__ */ n(
+    "span",
+    {
+      style: {
+        display: "block",
+        width: e,
+        height: e,
+        borderRadius: "50%",
+        backgroundColor: t,
+        animation: "brycks-pulse 1.5s ease-in-out infinite"
+      }
+    }
+  );
+}
+const Ce = $(function({
+  size: t = "md",
+  variant: r = "spinner",
+  color: o = "var(--brycks-primary-default)",
+  label: s = "Loading",
+  className: a,
+  style: b,
+  testId: l,
+  ...c
+}, i) {
+  const f = Er[t], h = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    ...b
+  }, g = () => {
+    switch (r) {
+      case "dots":
+        return /* @__PURE__ */ n(Vr, { size: f, color: o });
+      case "pulse":
+        return /* @__PURE__ */ n(Gr, { size: f, color: o });
+      default:
+        return /* @__PURE__ */ n(Pr, { size: f, color: o });
+    }
+  };
+  return /* @__PURE__ */ p(ce, { children: [
+    /* @__PURE__ */ n("style", { children: `
+          @keyframes brycks-spin {
+            from { transform: rotate(0deg); }
+            to { transform: rotate(360deg); }
+          }
+          @keyframes brycks-bounce {
+            0%, 80%, 100% { transform: scale(0); opacity: 0.5; }
+            40% { transform: scale(1); opacity: 1; }
+          }
+          @keyframes brycks-pulse {
+            0%, 100% { transform: scale(0.8); opacity: 0.5; }
+            50% { transform: scale(1); opacity: 1; }
+          }
+        ` }),
+    /* @__PURE__ */ p(
+      "div",
+      {
+        ref: i,
+        role: "status",
+        "aria-label": s,
+        className: I(
+          "brycks-loader",
+          `brycks-loader--${r}`,
+          `brycks-loader--${t}`,
+          a
+        ),
+        style: h,
+        "data-testid": l,
+        ...c,
+        children: [
+          g(),
+          /* @__PURE__ */ n(
+            "span",
+            {
+              style: {
+                position: "absolute",
+                width: 1,
+                height: 1,
+                padding: 0,
+                margin: -1,
+                overflow: "hidden",
+                clip: "rect(0, 0, 0, 0)",
+                whiteSpace: "nowrap",
+                border: 0
+              },
+              children: s
+            }
+          )
+        ]
+      }
+    )
+  ] });
+});
+Ce.displayName = "Loader";
+const yt = Ce, ze = $(function({
+  variant: t = "rectangular",
+  width: r,
+  height: o,
+  radius: s,
+  animate: a = !0,
+  className: b,
+  style: l,
+  testId: c,
+  ...i
+}, f) {
+  const g = {
+    ...(() => {
+      const y = {
+        backgroundColor: "var(--brycks-background-muted)",
+        position: "relative",
+        overflow: "hidden"
+      };
+      switch (t) {
+        case "text":
+          y.width = r ?? "100%", y.height = o ?? "1em", y.borderRadius = "var(--brycks-radius-sm)";
+          break;
+        case "circular":
+          y.width = r ?? 40, y.height = o ?? r ?? 40, y.borderRadius = "50%";
+          break;
+        case "rectangular":
+          y.width = r ?? "100%", y.height = o ?? 40, y.borderRadius = s ?? "var(--brycks-radius-default)";
+          break;
+      }
+      return y;
+    })(),
+    ...l
+  }, u = {
+    position: "absolute",
+    top: 0,
+    left: 0,
+    right: 0,
+    bottom: 0,
+    background: "linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%)",
+    animation: a ? "brycks-shimmer 1.5s infinite" : "none"
+  };
+  return /* @__PURE__ */ p(ce, { children: [
+    a && /* @__PURE__ */ n("style", { children: `
+            @keyframes brycks-shimmer {
+              0% { transform: translateX(-100%); }
+              100% { transform: translateX(100%); }
+            }
+          ` }),
+    /* @__PURE__ */ n(
+      "div",
+      {
+        ref: f,
+        className: I(
+          "brycks-skeleton",
+          `brycks-skeleton--${t}`,
+          a && "brycks-skeleton--animated",
+          b
+        ),
+        style: g,
+        "data-testid": c,
+        "aria-hidden": "true",
+        ...i,
+        children: a && /* @__PURE__ */ n("div", { style: u })
+      }
+    )
+  ] });
+});
+ze.displayName = "Skeleton";
+function _r({
+  lines: e = 3,
+  gap: t = 8,
+  lastLineWidth: r = "80%",
+  className: o
+}) {
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: I("brycks-skeleton-text", o),
+      style: { display: "flex", flexDirection: "column", gap: t },
+      children: Array.from({ length: e }).map((s, a) => /* @__PURE__ */ n(
+        ze,
+        {
+          variant: "text",
+          width: a === e - 1 ? r : "100%"
+        },
+        a
+      ))
+    }
+  );
+}
+_r.displayName = "SkeletonText";
+const Yr = $(function({
+  orientation: t = "horizontal",
+  variant: r = "solid",
+  label: o,
+  labelPosition: s = "center",
+  className: a,
+  style: b,
+  testId: l,
+  ...c
+}, i) {
+  const f = t === "horizontal", h = {
+    display: "flex",
+    alignItems: "center",
+    width: f ? "100%" : void 0,
+    height: f ? void 0 : "100%",
+    flexDirection: f ? "row" : "column",
+    ...b
+  }, g = {
+    flex: 1,
+    backgroundColor: r === "solid" ? "var(--brycks-border-muted)" : "transparent",
+    borderStyle: r,
+    borderColor: "var(--brycks-border-muted)",
+    ...f ? {
+      height: 1,
+      borderWidth: r === "solid" ? 0 : "1px 0 0 0"
+    } : {
+      width: 1,
+      borderWidth: r === "solid" ? 0 : "0 0 0 1px"
+    }
+  }, u = {
+    padding: f ? "0 12px" : "12px 0",
+    fontSize: 12,
+    fontWeight: 500,
+    color: "var(--brycks-foreground-muted)",
+    whiteSpace: "nowrap"
+  };
+  if (!o)
+    return /* @__PURE__ */ n(
+      "div",
+      {
+        ref: i,
+        role: "separator",
+        "aria-orientation": t,
+        className: I(
+          "brycks-divider",
+          `brycks-divider--${t}`,
+          `brycks-divider--${r}`,
+          a
+        ),
+        style: { ...g, ...b },
+        "data-testid": l,
+        ...c
+      }
+    );
+  const y = s === "center" || s === "end", m = s === "center" || s === "start";
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      ref: i,
+      role: "separator",
+      "aria-orientation": t,
+      className: I(
+        "brycks-divider",
+        `brycks-divider--${t}`,
+        `brycks-divider--${r}`,
+        "brycks-divider--with-label",
+        a
+      ),
+      style: h,
+      "data-testid": l,
+      ...c,
+      children: [
+        y && /* @__PURE__ */ n("span", { style: g }),
+        /* @__PURE__ */ n("span", { style: u, children: o }),
+        m && /* @__PURE__ */ n("span", { style: g })
+      ]
+    }
+  );
+});
+Yr.displayName = "Divider";
+const Ar = $(function({
+  icon: t,
+  title: r,
+  description: o,
+  action: s,
+  secondaryAction: a,
+  className: b,
+  style: l,
+  testId: c,
+  children: i,
+  ...f
+}, h) {
+  const g = {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    textAlign: "center",
+    padding: "48px 24px",
+    ...l
+  }, u = {
+    marginBottom: 16,
+    color: "var(--brycks-foreground-subtle)"
+  }, y = {
+    fontSize: 18,
+    fontWeight: 600,
+    color: "var(--brycks-foreground-default)",
+    marginBottom: o ? 8 : 0,
+    maxWidth: 400
+  }, m = {
+    fontSize: 14,
+    color: "var(--brycks-foreground-muted)",
+    lineHeight: 1.5,
+    maxWidth: 400
+  }, d = {
+    display: "flex",
+    alignItems: "center",
+    gap: 12,
+    marginTop: 24
+  };
+  return /* @__PURE__ */ p(
+    "div",
+    {
+      ref: h,
+      className: I("brycks-empty-state", b),
+      style: g,
+      "data-testid": c,
+      ...f,
+      children: [
+        t && /* @__PURE__ */ n("div", { style: u, children: t }),
+        r && /* @__PURE__ */ n("h3", { style: y, children: r }),
+        o && /* @__PURE__ */ n("p", { style: m, children: o }),
+        i,
+        (s || a) && /* @__PURE__ */ p("div", { style: d, children: [
+          s,
+          a
+        ] })
+      ]
+    }
+  );
+});
+Ar.displayName = "EmptyState";
+function Kr({ size: e = 64 }) {
+  return /* @__PURE__ */ p(
+    "svg",
+    {
+      width: e,
+      height: e,
+      viewBox: "0 0 64 64",
+      fill: "none",
+      style: { opacity: 0.5 },
+      children: [
+        /* @__PURE__ */ n(
+          "rect",
+          {
+            x: "8",
+            y: "12",
+            width: "48",
+            height: "40",
+            rx: "4",
+            stroke: "currentColor",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ n(
+          "path",
+          {
+            d: "M8 24h48",
+            stroke: "currentColor",
+            strokeWidth: "2"
+          }
+        ),
+        /* @__PURE__ */ n("circle", { cx: "16", cy: "18", r: "2", fill: "currentColor" }),
+        /* @__PURE__ */ n("circle", { cx: "24", cy: "18", r: "2", fill: "currentColor" }),
+        /* @__PURE__ */ n("circle", { cx: "32", cy: "18", r: "2", fill: "currentColor" }),
+        /* @__PURE__ */ n(
+          "rect",
+          {
+            x: "16",
+            y: "32",
+            width: "32",
+            height: "4",
+            rx: "2",
+            fill: "currentColor",
+            opacity: "0.3"
+          }
+        ),
+        /* @__PURE__ */ n(
+          "rect",
+          {
+            x: "16",
+            y: "40",
+            width: "20",
+            height: "4",
+            rx: "2",
+            fill: "currentColor",
+            opacity: "0.3"
+          }
+        )
+      ]
+    }
+  );
+}
+Kr.displayName = "EmptyStateIcon";
+function le(e) {
+  const [t, r] = V(() => typeof window > "u" ? !1 : window.matchMedia(e).matches);
+  return ae(() => {
+    if (typeof window > "u") return;
+    const o = window.matchMedia(e), s = (a) => r(a.matches);
+    return r(o.matches), o.addEventListener("change", s), () => o.removeEventListener("change", s);
+  }, [e]), t;
+}
+function bt() {
+  return le("(max-width: 639px)");
+}
+function ft() {
+  return le("(min-width: 640px) and (max-width: 1023px)");
+}
+function gt() {
+  return le("(min-width: 1024px)");
+}
+function mt() {
+  return le("(prefers-reduced-motion: reduce)");
+}
+function ht() {
+  return le("(prefers-color-scheme: dark)");
+}
+function kt(e = {}) {
+  const { defaultIsOpen: t = !1, onOpen: r, onClose: o } = e, [s, a] = V(t), b = se(() => {
+    a(!0), r == null || r();
+  }, [r]), l = se(() => {
+    a(!1), o == null || o();
+  }, [o]), c = se(() => {
+    const i = !s;
+    a(i), i ? r == null || r() : o == null || o();
+  }, [s, r, o]);
+  return {
+    isOpen: s,
+    onOpen: b,
+    onClose: l,
+    onToggle: c,
+    setIsOpen: a
+  };
+}
+export {
+  Fr as Alert,
+  Xr as Badge,
+  De as Box,
+  we as Button,
+  Wr as Checkbox,
+  lr as Code,
+  sr as Container,
+  fr as Display,
+  Yr as Divider,
+  Ar as EmptyState,
+  Kr as EmptyStateIcon,
+  Ze as Grid,
+  er as GridItem,
+  _e as HStack,
+  ve as Heading,
+  vr as IconButton,
+  Se as Input,
+  Ce as Loader,
+  Rr as Modal,
+  zr as Select,
+  ze as Skeleton,
+  _r as SkeletonText,
+  yt as Spinner,
+  ge as Stack,
+  Hr as Switch,
+  pe as Text,
+  wr as TextField,
+  Tr as Textarea,
+  Gt as ThemeProvider,
+  jr as Tooltip,
+  Ae as VStack,
+  xt as accent,
+  It as animations,
+  Tt as borderStyles,
+  Nt as borderWidths,
+  Lt as breakpoints,
+  ye as buildSpacingStyles,
+  wt as colors,
+  N as componentFontSize,
+  E as componentFontWeight,
+  G as componentGap,
+  U as componentHeights,
+  F as componentLineHeight,
+  Z as componentPaddingX,
+  Jr as componentPaddingY,
+  ct as componentTypography,
+  We as containers,
+  Ie as controlSizes,
+  _t as cssVar,
+  I as cx,
+  Yt as darkTheme,
+  st as duration,
+  j as durations,
+  at as easing,
+  R as easings,
+  St as error,
+  J as focusRing,
+  tt as focusRingOffset,
+  Rt as focusRings,
+  ot as focusStyles,
+  P as fontFamilies,
+  ee as fontSizes,
+  oe as fontWeights,
+  dt as generateId,
+  lt as getSpacingValue,
+  Mt as glows,
+  ut as hexToRgba,
+  ie as iconSizes,
+  Ct as info,
+  it as keyframes,
+  Ft as letterSpacings,
+  At as lightTheme,
+  de as lineHeights,
+  jt as mediaQueries,
+  et as modalWidths,
+  zt as neutrals,
+  q as opacity,
+  rt as popoverSizing,
+  $t as primary,
+  Ot as radii,
+  re as scale,
+  Dt as semanticSpacing,
+  Xt as shadows,
+  C as spacing,
+  H as spacingToCss,
+  ue as stateOpacity,
+  Bt as success,
+  Te as switchSizes,
+  Q as textStyles,
+  te as transition,
+  nt as transitionProperties,
+  Et as transitions,
+  kt as useDisclosure,
+  gt as useIsDesktop,
+  bt as useIsMobile,
+  ft as useIsTablet,
+  le as useMediaQuery,
+  ht as usePrefersDarkMode,
+  mt as usePrefersReducedMotion,
+  Kt as useTheme,
+  qt as useThemeColors,
+  Wt as warning,
+  Pt as zIndex
+};
+//# sourceMappingURL=index.js.map