import {
  b as q,
  c as qe,
  f as Ue,
  h as ee
} from "../_browser-chunks/chunk-SNUFZ2DM.js";
import {
  A as He,
  C as Oe,
  H as De,
  r as D
} from "../_browser-chunks/chunk-U2ZNDODR.js";
import "../_browser-chunks/chunk-S5B7ZO4V.js";
import "../_browser-chunks/chunk-NM3IIACQ.js";
import {
  a as ae
} from "../_browser-chunks/chunk-VS7TC75V.js";
import "../_browser-chunks/chunk-VRBWRKGV.js";
import {
  a as Q
} from "../_browser-chunks/chunk-KCQXA5WV.js";
import "../_browser-chunks/chunk-LISO2PN4.js";
import "../_browser-chunks/chunk-IU22WWJQ.js";
import "../_browser-chunks/chunk-VEVXVIEO.js";
import {
  a as Fe
} from "../_browser-chunks/chunk-JCASV5LV.js";
import {
  a as _e,
  b as je,
  c as Ne,
  d as Ge,
  e as le,
  f as B
} from "../_browser-chunks/chunk-PLP4DCMY.js";
import "../_browser-chunks/chunk-ECQ75MKQ.js";
import {
  c as V
} from "../_browser-chunks/chunk-5IQN7XXU.js";
import "../_browser-chunks/chunk-IXWND6JI.js";
import {
  b as ze
} from "../_browser-chunks/chunk-7HYTP7KP.js";
import {
  a as i,
  c as Dt,
  d as Be,
  e as _t
} from "../_browser-chunks/chunk-IO47FP3U.js";

// ../node_modules/@ngard/tiny-isequal/index.js
var We = Dt((de) => {
  Object.defineProperty(de, "__esModule", { value: !0 }), de.isEqual = /* @__PURE__ */ function() {
    var e = Object.prototype.toString, t = Object.getPrototypeOf, n = Object.getOwnPropertySymbols ? function(r) {
      return Object.keys(r).concat(Object.getOwnPropertySymbols(r));
    } : Object.keys;
    return function(r, o) {
      return (/* @__PURE__ */ i(function s(a, l, d) {
        var m, y, f, x = e.call(a), A = e.call(l);
        if (a === l) return !0;
        if (a == null || l == null) return !1;
        if (d.indexOf(a) > -1 && d.indexOf(l) > -1) return !0;
        if (d.push(a, l), x != A || (m = n(a), y = n(l), m.length != y.length || m.some(function(C) {
          return !s(a[C], l[C], d);
        }))) return !1;
        switch (x.slice(8, -1)) {
          case "Symbol":
            return a.valueOf() == l.valueOf();
          case "Date":
          case "Number":
            return +a == +l || +a != +a && +l != +l;
          case "RegExp":
          case "Function":
          case "String":
          case "Boolean":
            return "" + a == "" + l;
          case "Set":
          case "Map":
            m = a.entries(), y = l.entries();
            do
              if (!s((f = m.next()).value, y.next().value, d)) return !1;
            while (!f.done);
            return !0;
          case "ArrayBuffer":
            a = new Uint8Array(a), l = new Uint8Array(l);
          case "DataView":
            a = new Uint8Array(a.buffer), l = new Uint8Array(l.buffer);
          case "Float32Array":
          case "Float64Array":
          case "Int8Array":
          case "Int16Array":
          case "Int32Array":
          case "Uint8Array":
          case "Uint16Array":
          case "Uint32Array":
          case "Uint8ClampedArray":
          case "Arguments":
          case "Array":
            if (a.length != l.length) return !1;
            for (f = 0; f < a.length; f++) if ((f in a || f in l) && (f in a != f in l || !s(a[f], l[f], d))) return !1;
            return !0;
          case "Object":
            return s(t(a), t(l), d);
          default:
            return !1;
        }
      }, "n"))(r, o, []);
    };
  }();
});

// src/csf/toStartCaseStr.ts
function Ye(e) {
  return e.replace(/_/g, " ").replace(/-/g, " ").replace(/\./g, " ").replace(/([^\n])([A-Z])([a-z])/g, (t, n, r, o) => `${n} ${r}${o}`).replace(/([a-z])([A-Z])/g, (t, n, r) => `${n} ${r}`).replace(/([a-z])([0-9])/gi, (t, n, r) => `${n} ${r}`).replace(/([0-9])([a-z])/gi, (t, n, r) => `${n} ${r}`).replace(/(\s|^)(\w)/g, (t, n, r) => `${n}${r.toUpperCase()}`).replace(/ +/g, " ").trim();
}
i(Ye, "toStartCaseStr");

// src/csf/includeConditionalArg.ts
var pe = _t(We(), 1);
var Ve = /* @__PURE__ */ i((e) => e.map((t) => typeof t < "u").filter(Boolean).length, "count"), jt = /* @__PURE__ */ i((e, t) => {
  let { exists: n, eq: r, neq: o, truthy: s } = e;
  if (Ve([n, r, o, s]) > 1)
    throw new Error(`Invalid conditional test ${JSON.stringify({ exists: n, eq: r, neq: o })}`);
  if (typeof r < "u")
    return (0, pe.isEqual)(t, r);
  if (typeof o < "u")
    return !(0, pe.isEqual)(t, o);
  if (typeof n < "u") {
    let l = typeof t < "u";
    return n ? l : !l;
  }
  return (typeof s > "u" ? !0 : s) ? !!t : !t;
}, "testValue"), Nt = /* @__PURE__ */ i((e, t, n) => {
  if (!e.if)
    return !0;
  let { arg: r, global: o } = e.if;
  if (Ve([r, o]) !== 1)
    throw new Error(`Invalid conditional value ${JSON.stringify({ arg: r, global: o })}`);
  let s = r ? t[r] : n[o];
  return jt(e.if, s);
}, "includeConditionalArg");

// src/csf/csf-factories.ts
import { combineTags as Vn } from "storybook/internal/csf";

// src/actions/preview.ts
import { definePreviewAddon as Yt } from "storybook/internal/csf";

// src/actions/addArgs.ts
var ce = {};
Be(ce, {
  argsEnhancers: () => Gt
});

// src/actions/addArgsHelpers.ts
var Xe = /* @__PURE__ */ i((e, t) => typeof t[e] > "u" && !(e in t), "isInInitialArgs"), Ze = /* @__PURE__ */ i((e) => {
  let {
    initialArgs: t,
    argTypes: n,
    id: r,
    parameters: { actions: o }
  } = e;
  if (!o || o.disable || !o.argTypesRegex || !n)
    return {};
  let s = new RegExp(o.argTypesRegex);
  return Object.entries(n).filter(
    ([l]) => !!s.test(l)
  ).reduce((l, [d, m]) => (Xe(d, t) && (l[d] = V(d, { implicit: !0, id: r })), l), {});
}, "inferActionsFromArgTypesRegex"), Ke = /* @__PURE__ */ i((e) => {
  let {
    initialArgs: t,
    argTypes: n,
    parameters: { actions: r }
  } = e;
  return r?.disable || !n ? {} : Object.entries(n).filter(([s, a]) => !!a.action).reduce((s, [a, l]) => (Xe(a, t) && (s[a] = V(typeof l.action == "string" ? l.action : a)), s), {});
}, "addActionsFromArgTypes");

// src/actions/addArgs.ts
var Gt = [
  Ke,
  Ze
];

// src/actions/loaders.ts
var ue = {};
Be(ue, {
  loaders: () => Ut
});
import { onMockCall as zt } from "storybook/test";
var Je = !1, qt = /* @__PURE__ */ i((e) => {
  let { parameters: t } = e;
  t?.actions?.disable || Je || (zt((n, r) => {
    let o = n.getMockName();
    o !== "spy" && (!/^next\/.*::/.test(o) || [
      "next/router::useRouter()",
      "next/navigation::useRouter()",
      "next/navigation::redirect",
      "next/cache::",
      "next/headers::cookies().set",
      "next/headers::cookies().delete",
      "next/headers::headers().set",
      "next/headers::headers().delete"
    ].some((s) => o.startsWith(s))) && V(o)(r);
  }), Je = !0);
}, "logActionsWhenMockCalled"), Ut = [qt];

// src/actions/preview.ts
var me = /* @__PURE__ */ i(() => Yt({
  ...ce,
  ...ue
}), "default");

// src/backgrounds/preview.ts
import { definePreviewAddon as Zt } from "storybook/internal/csf";

// src/backgrounds/decorator.ts
import { useEffect as nt } from "storybook/preview-api";

// src/backgrounds/utils.ts
var { document: L } = globalThis, Qe = /* @__PURE__ */ i(() => globalThis?.matchMedia ? !!globalThis.matchMedia("(prefers-reduced-motion: reduce)")?.matches : !1, "isReduceMotionEnabled"), ge = /* @__PURE__ */ i((e) => {
  (Array.isArray(e) ? e : [e]).forEach(Wt);
}, "clearStyles"), Wt = /* @__PURE__ */ i((e) => {
  if (!L)
    return;
  let t = L.getElementById(e);
  t && t.parentElement && t.parentElement.removeChild(t);
}, "clearStyle"), et = /* @__PURE__ */ i((e, t) => {
  if (!L)
    return;
  let n = L.getElementById(e);
  if (n)
    n.innerHTML !== t && (n.innerHTML = t);
  else {
    let r = L.createElement("style");
    r.setAttribute("id", e), r.innerHTML = t, L.head.appendChild(r);
  }
}, "addGridStyle"), tt = /* @__PURE__ */ i((e, t, n) => {
  if (!L)
    return;
  let r = L.getElementById(e);
  if (r)
    r.innerHTML !== t && (r.innerHTML = t);
  else {
    let o = L.createElement("style");
    o.setAttribute("id", e), o.innerHTML = t;
    let s = `addon-backgrounds-grid${n ? `-docs-${n}` : ""}`, a = L.getElementById(s);
    a ? a.parentElement?.insertBefore(o, a) : L.head.appendChild(o);
  }
}, "addBackgroundStyle");

// src/backgrounds/decorator.ts
var Vt = {
  cellSize: 100,
  cellAmount: 10,
  opacity: 0.8
}, rt = "addon-backgrounds", ot = "addon-backgrounds-grid", Xt = Qe() ? "" : "transition: background-color 0.3s;", it = /* @__PURE__ */ i((e, t) => {
  let { globals: n = {}, parameters: r = {}, viewMode: o, id: s } = t, {
    options: a = qe,
    disable: l,
    grid: d = Vt
  } = r[q] || {}, m = n[q] || {}, y = typeof m == "string" ? m : m?.value, f = y ? a[y] : void 0, x = typeof f == "string" ? f : f?.value || "transparent", A = typeof m == "string" ? !1 : m.grid || !1, C = !!f && !l, P = o === "docs" ? `#anchor--${s} .docs-story` : ".sb-show-main", N = o === "docs" ? `#anchor--${s} .docs-story` : ".sb-show-main", W = r.layout === void 0 || r.layout === "padded", j = o === "docs" ? 20 : W ? 16 : 0, { cellAmount: I, cellSize: E, opacity: H, offsetX: O = j, offsetY: p = j } = d, c = o === "docs" ? `${rt}-docs-${s}` : `${rt}-color`, u = o === "docs" ? s : null;
  nt(() => {
    let g = `
    ${P} {
      background: ${x} !important;
      ${Xt}
      }`;
    if (!C) {
      ge(c);
      return;
    }
    tt(c, g, u);
  }, [P, c, u, C, x]);
  let T = o === "docs" ? `${ot}-docs-${s}` : `${ot}`;
  return nt(() => {
    if (!A) {
      ge(T);
      return;
    }
    let g = [
      `${E * I}px ${E * I}px`,
      `${E * I}px ${E * I}px`,
      `${E}px ${E}px`,
      `${E}px ${E}px`
    ].join(", "), h = `
        ${N} {
          background-size: ${g} !important;
          background-position: ${O}px ${p}px, ${O}px ${p}px, ${O}px ${p}px, ${O}px ${p}px !important;
          background-blend-mode: difference !important;
          background-image: linear-gradient(rgba(130, 130, 130, ${H}) 1px, transparent 1px),
           linear-gradient(90deg, rgba(130, 130, 130, ${H}) 1px, transparent 1px),
           linear-gradient(rgba(130, 130, 130, ${H / 2}) 1px, transparent 1px),
           linear-gradient(90deg, rgba(130, 130, 130, ${H / 2}) 1px, transparent 1px) !important;
        }
      `;
    et(T, h);
  }, [I, E, N, T, A, O, p, H]), e();
}, "withBackgroundAndGrid");

// src/backgrounds/preview.ts
var Kt = globalThis.FEATURES?.backgrounds ? [it] : [], Jt = {
  [q]: {
    grid: {
      cellSize: 20,
      opacity: 0.5,
      cellAmount: 5
    },
    disable: !1
  }
}, Qt = {
  [q]: { value: void 0, grid: !1 }
}, fe = /* @__PURE__ */ i(() => Zt({
  decorators: Kt,
  parameters: Jt,
  initialGlobals: Qt
}), "default");

// src/component-testing/preview.ts
import { definePreviewAddon as en } from "storybook/internal/csf";
import { instrument as tn } from "storybook/internal/instrumenter";
var { step: nn } = tn(
  {
    // It seems like the label is unused, but the instrumenter has access to it
    // The context will be bounded later in StoryRender, so that the user can write just:
    // await step("label", (context) => {
    //   // labeled step
    // });
    step: /* @__PURE__ */ i(async (e, t, n) => t(n), "step")
  },
  { intercept: !0 }
), ye = /* @__PURE__ */ i(() => en({
  parameters: {
    throwPlayFunctionExceptions: !1
  },
  runStep: nn
}), "default");

// src/highlight/preview.ts
import { definePreviewAddon as ln } from "storybook/internal/csf";
import { addons as mt } from "storybook/preview-api";

// src/highlight/useHighlights.ts
import { STORY_RENDER_PHASE_CHANGED as sn } from "storybook/internal/core-events";

// src/highlight/icons.ts
var Te = {
  chevronLeft: [
    "M9.10355 10.1464C9.29882 10.3417 9.29882 10.6583 9.10355 10.8536C8.90829 11.0488 8.59171 11.0488 8.39645 10.8536L4.89645 7.35355C4.70118 7.15829 4.70118 6.84171 4.89645 6.64645L8.39645 3.14645C8.59171 2.95118 8.90829 2.95118 9.10355 3.14645C9.29882 3.34171 9.29882 3.65829 9.10355 3.85355L5.95711 7L9.10355 10.1464Z"
  ],
  chevronRight: [
    "M4.89645 10.1464C4.70118 10.3417 4.70118 10.6583 4.89645 10.8536C5.09171 11.0488 5.40829 11.0488 5.60355 10.8536L9.10355 7.35355C9.29882 7.15829 9.29882 6.84171 9.10355 6.64645L5.60355 3.14645C5.40829 2.95118 5.09171 2.95118 4.89645 3.14645C4.70118 3.34171 4.70118 3.65829 4.89645 3.85355L8.04289 7L4.89645 10.1464Z"
  ],
  info: [
    "M7 5.5a.5.5 0 01.5.5v4a.5.5 0 01-1 0V6a.5.5 0 01.5-.5zM7 4.5A.75.75 0 107 3a.75.75 0 000 1.5z",
    "M7 14A7 7 0 107 0a7 7 0 000 14zm0-1A6 6 0 107 1a6 6 0 000 12z"
  ],
  shareAlt: [
    "M2 1.004a1 1 0 00-1 1v10a1 1 0 001 1h10a1 1 0 001-1v-4.5a.5.5 0 00-1 0v4.5H2v-10h4.5a.5.5 0 000-1H2z",
    "M7.354 7.357L12 2.711v1.793a.5.5 0 001 0v-3a.5.5 0 00-.5-.5h-3a.5.5 0 100 1h1.793L6.646 6.65a.5.5 0 10.708.707z"
  ]
};

// src/highlight/utils.ts
var rn = "svg,path,rect,circle,line,polyline,polygon,ellipse,text".split(","), S = /* @__PURE__ */ i((e, t = {}, n) => {
  let r = rn.includes(e) ? document.createElementNS("http://www.w3.org/2000/svg", e) : document.createElement(e);
  return Object.entries(t).forEach(([o, s]) => {
    /[A-Z]/.test(o) ? (o === "onClick" && (r.addEventListener("click", s), r.addEventListener("keydown", (a) => {
      (a.key === "Enter" || a.key === " ") && (a.preventDefault(), s());
    })), o === "onMouseEnter" && r.addEventListener("mouseenter", s), o === "onMouseLeave" && r.addEventListener("mouseleave", s)) : r.setAttribute(o, s);
  }), n?.forEach((o) => {
    if (!(o == null || o === !1))
      try {
        r.appendChild(o);
      } catch {
        r.appendChild(document.createTextNode(String(o)));
      }
  }), r;
}, "createElement"), Z = /* @__PURE__ */ i((e) => Te[e] && S(
  "svg",
  { width: "14", height: "14", viewBox: "0 0 14 14", xmlns: "http://www.w3.org/2000/svg" },
  Te[e].map(
    (t) => S("path", {
      fill: "currentColor",
      "fill-rule": "evenodd",
      "clip-rule": "evenodd",
      d: t
    })
  )
), "createIcon"), st = /* @__PURE__ */ i((e) => {
  if ("elements" in e) {
    let { elements: r, color: o, style: s } = e;
    return {
      id: void 0,
      priority: 0,
      selectors: r,
      styles: {
        outline: `2px ${s} ${o}`,
        outlineOffset: "2px",
        boxShadow: "0 0 0 6px rgba(255,255,255,0.6)"
      },
      menu: void 0
    };
  }
  let { menu: t, ...n } = e;
  return {
    id: void 0,
    priority: 0,
    styles: {
      outline: "2px dashed #029cfd"
    },
    ...n,
    menu: Array.isArray(t) ? t.every(Array.isArray) ? t : [t] : void 0
  };
}, "normalizeOptions"), on = /* @__PURE__ */ i((e) => e instanceof Function, "isFunction"), X = /* @__PURE__ */ new Map(), G = /* @__PURE__ */ new Map(), te = /* @__PURE__ */ new Map(), F = /* @__PURE__ */ i((e) => {
  let t = Symbol();
  return G.set(t, []), X.set(t, e), { get: /* @__PURE__ */ i(() => X.get(t), "get"), set: /* @__PURE__ */ i((a) => {
    let l = X.get(t), d = on(a) ? a(l) : a;
    d !== l && (X.set(t, d), G.get(t)?.forEach((m) => {
      te.get(m)?.(), te.set(m, m(d));
    }));
  }, "set"), subscribe: /* @__PURE__ */ i((a) => (G.get(t)?.push(a), () => {
    let l = G.get(t);
    l && G.set(
      t,
      l.filter((d) => d !== a)
    );
  }), "subscribe"), teardown: /* @__PURE__ */ i(() => {
    G.get(t)?.forEach((a) => {
      te.get(a)?.(), te.delete(a);
    }), G.delete(t), X.delete(t);
  }, "teardown") };
}, "useStore"), xe = /* @__PURE__ */ i((e) => {
  let t = document.getElementById("storybook-root"), n = /* @__PURE__ */ new Map();
  for (let r of e) {
    let { priority: o = 0 } = r;
    for (let s of r.selectors) {
      let a = [
        ...document.querySelectorAll(
          // Elements matching the selector, excluding storybook elements and their descendants.
          // Necessary to find portaled elements (e.g. children of `body`).
          `:is(${s}):not([id^="storybook-"], [id^="storybook-"] *, [class^="sb-"], [class^="sb-"] *)`
        ),
        // Elements matching the selector inside the storybook root, as these were excluded above.
        ...t?.querySelectorAll(s) || []
      ];
      for (let l of a) {
        let d = n.get(l);
        (!d || d.priority <= o) && n.set(l, {
          ...r,
          priority: o,
          selectors: Array.from(new Set((d?.selectors || []).concat(s)))
        });
      }
    }
  }
  return n;
}, "mapElements"), at = /* @__PURE__ */ i((e) => Array.from(e.entries()).map(([t, { selectors: n, styles: r, hoverStyles: o, focusStyles: s, menu: a }]) => {
  let { top: l, left: d, width: m, height: y } = t.getBoundingClientRect(), { position: f } = getComputedStyle(t);
  return {
    element: t,
    selectors: n,
    styles: r,
    hoverStyles: o,
    focusStyles: s,
    menu: a,
    top: f === "fixed" ? l : l + window.scrollY,
    left: f === "fixed" ? d : d + window.scrollX,
    width: m,
    height: y
  };
}).sort((t, n) => n.width * n.height - t.width * t.height), "mapBoxes"), he = /* @__PURE__ */ i((e, t) => {
  let n = e.getBoundingClientRect(), { x: r, y: o } = t;
  return n?.top && n?.left && r >= n.left && r <= n.left + n.width && o >= n.top && o <= n.top + n.height;
}, "isOverMenu"), be = /* @__PURE__ */ i((e, t, n) => {
  if (!t || !n)
    return !1;
  let { left: r, top: o, width: s, height: a } = e;
  a < B && (o = o - Math.round((B - a) / 2), a = B), s < B && (r = r - Math.round((B - s) / 2), s = B), t.style.position === "fixed" && (r += window.scrollX, o += window.scrollY);
  let { x: l, y: d } = n;
  return l >= r && l <= r + s && d >= o && d <= o + a;
}, "isTargeted"), lt = /* @__PURE__ */ i((e, t, n = {}) => {
  let { x: r, y: o } = t, { margin: s = 5, topOffset: a = 0, centered: l = !1 } = n, { scrollX: d, scrollY: m, innerHeight: y, innerWidth: f } = window, x = Math.min(
    e.style.position === "fixed" ? o - m : o,
    y - e.clientHeight - s - a + m
  ), A = l ? e.clientWidth / 2 : 0, C = e.style.position === "fixed" ? Math.max(Math.min(r - d, f - A - s), A + s) : Math.max(
    Math.min(r, f - A - s + d),
    A + s + d
  );
  Object.assign(e.style, {
    ...C !== r && { left: `${C}px` },
    ...x !== o && { top: `${x}px` }
  });
}, "keepInViewport"), Ae = /* @__PURE__ */ i((e) => {
  window.HTMLElement.prototype.hasOwnProperty("showPopover") && e.showPopover();
}, "showPopover"), dt = /* @__PURE__ */ i((e) => {
  window.HTMLElement.prototype.hasOwnProperty("showPopover") && e.hidePopover();
}, "hidePopover"), pt = /* @__PURE__ */ i((e) => ({
  top: e.top,
  left: e.left,
  width: e.width,
  height: e.height,
  selectors: e.selectors,
  element: {
    attributes: Object.fromEntries(
      Array.from(e.element.attributes).map((t) => [t.name, t.value])
    ),
    localName: e.element.localName,
    tagName: e.element.tagName,
    outerHTML: e.element.outerHTML
  }
}), "getEventDetails");

// src/highlight/useHighlights.ts
var b = "storybook-highlights-menu", ct = "storybook-highlights-root", an = "storybook-root", ut = /* @__PURE__ */ i((e) => {
  if (globalThis.__STORYBOOK_HIGHLIGHT_INITIALIZED)
    return;
  globalThis.__STORYBOOK_HIGHLIGHT_INITIALIZED = !0;
  let { document: t } = globalThis, n = F([]), r = F(/* @__PURE__ */ new Map()), o = F([]), s = F(), a = F(), l = F([]), d = F([]), m = F(), y = F(), f = t.getElementById(ct);
  n.subscribe(() => {
    f || (f = S("div", { id: ct }), t.body.appendChild(f));
  }), n.subscribe((p) => {
    let c = t.getElementById(an);
    if (!c)
      return;
    r.set(xe(p));
    let u = new MutationObserver(() => r.set(xe(p)));
    return u.observe(c, { subtree: !0, childList: !0 }), () => {
      u.disconnect();
    };
  }), r.subscribe((p) => {
    let c = /* @__PURE__ */ i(() => requestAnimationFrame(() => o.set(at(p))), "updateBoxes"), u = new ResizeObserver(c);
    u.observe(t.body), Array.from(p.keys()).forEach((g) => u.observe(g));
    let T = Array.from(t.body.querySelectorAll("*")).filter((g) => {
      let { overflow: h, overflowX: v, overflowY: R } = window.getComputedStyle(g);
      return ["auto", "scroll"].some((M) => [h, v, R].includes(M));
    });
    return T.forEach((g) => g.addEventListener("scroll", c)), () => {
      u.disconnect(), T.forEach((g) => g.removeEventListener("scroll", c));
    };
  }), r.subscribe((p) => {
    let c = Array.from(p.keys()).filter(({ style: T }) => T.position === "sticky"), u = /* @__PURE__ */ i(() => requestAnimationFrame(() => {
      o.set(
        (T) => T.map((g) => {
          if (c.includes(g.element)) {
            let { top: h, left: v } = g.element.getBoundingClientRect();
            return { ...g, top: h + window.scrollY, left: v + window.scrollX };
          }
          return g;
        })
      );
    }), "updateBoxes");
    return t.addEventListener("scroll", u), () => t.removeEventListener("scroll", u);
  }), r.subscribe((p) => {
    l.set((c) => c.filter(({ element: u }) => p.has(u)));
  }), l.subscribe((p) => {
    p.length ? (y.set((c) => p.some((u) => u.element === c?.element) ? c : void 0), m.set((c) => p.some((u) => u.element === c?.element) ? c : void 0)) : (y.set(void 0), m.set(void 0), s.set(void 0));
  });
  let x = new Map(/* @__PURE__ */ new Map());
  n.subscribe((p) => {
    p.forEach(({ keyframes: c }) => {
      if (c) {
        let u = x.get(c);
        u || (u = t.createElement("style"), u.setAttribute("data-highlight", "keyframes"), x.set(c, u), t.head.appendChild(u)), u.innerHTML = c;
      }
    }), x.forEach((c, u) => {
      p.some((T) => T.keyframes === u) || (c.remove(), x.delete(u));
    });
  });
  let A = new Map(/* @__PURE__ */ new Map());
  o.subscribe((p) => {
    p.forEach((c) => {
      let u = A.get(c.element);
      if (f && !u) {
        let T = {
          popover: "manual",
          "data-highlight-dimensions": `w${c.width.toFixed(0)}h${c.height.toFixed(0)}`,
          "data-highlight-coordinates": `x${c.left.toFixed(0)}y${c.top.toFixed(0)}`
        };
        u = f.appendChild(
          S("div", T, [S("div")])
        ), A.set(c.element, u);
      }
    }), A.forEach((c, u) => {
      p.some(({ element: T }) => T === u) || (c.remove(), A.delete(u));
    });
  }), o.subscribe((p) => {
    let c = p.filter((T) => T.menu);
    if (!c.length)
      return;
    let u = /* @__PURE__ */ i((T) => {
      requestAnimationFrame(() => {
        let g = t.getElementById(b), h = { x: T.pageX, y: T.pageY };
        if (g && !he(g, h)) {
          let v = c.filter((R) => {
            let M = A.get(R.element);
            return be(R, M, h);
          });
          s.set(v.length ? h : void 0), l.set(v);
        }
      });
    }, "onClick");
    return t.addEventListener("click", u), () => t.removeEventListener("click", u);
  });
  let C = /* @__PURE__ */ i(() => {
    let p = t.getElementById(b), c = a.get();
    !c || p && he(p, c) || d.set((u) => {
      let T = o.get().filter((R) => {
        let M = A.get(R.element);
        return be(R, M, c);
      }), g = u.filter((R) => T.includes(R)), h = T.filter((R) => !u.includes(R)), v = u.length - g.length;
      return h.length || v ? [...g, ...h] : u;
    });
  }, "updateHovered");
  a.subscribe(C), o.subscribe(C);
  let P = /* @__PURE__ */ i(() => {
    let p = y.get(), c = p ? [p] : l.get(), u = c.length === 1 ? c[0] : m.get(), T = s.get() !== void 0;
    o.get().forEach((g) => {
      let h = A.get(g.element);
      if (h) {
        let v = u === g, R = T ? u ? v : c.includes(g) : d.get()?.includes(g);
        Object.assign(h.style, {
          animation: "none",
          background: "transparent",
          border: "none",
          boxSizing: "border-box",
          outline: "none",
          outlineOffset: "0px",
          ...g.styles,
          ...R ? g.hoverStyles : {},
          ...v ? g.focusStyles : {},
          position: getComputedStyle(g.element).position === "fixed" ? "fixed" : "absolute",
          zIndex: le - 10,
          top: `${g.top}px`,
          left: `${g.left}px`,
          width: `${g.width}px`,
          height: `${g.height}px`,
          margin: 0,
          padding: 0,
          cursor: g.menu && R ? "pointer" : "default",
          pointerEvents: g.menu ? "auto" : "none",
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          overflow: "visible"
        }), Object.assign(h.children[0].style, {
          width: "100%",
          height: "100%",
          minHeight: `${B}px`,
          minWidth: `${B}px`,
          boxSizing: "content-box",
          padding: h.style.outlineWidth || "0px"
        }), Ae(h);
      }
    });
  }, "updateBoxStyles");
  o.subscribe(P), l.subscribe(P), d.subscribe(P), m.subscribe(P), y.subscribe(P);
  let N = /* @__PURE__ */ i(() => {
    if (!f)
      return;
    let p = t.getElementById(b);
    if (p)
      p.innerHTML = "";
    else {
      let g = { id: b, popover: "manual" };
      p = f.appendChild(S("div", g)), f.appendChild(
        S("style", {}, [
          `
            #${b} {
              position: absolute;
              z-index: ${le};
              width: 300px;
              padding: 0px;
              margin: 15px 0 0 0;
              transform: translateX(-50%);
              font-family: "Nunito Sans", -apple-system, ".SFNSText-Regular", "San Francisco", BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
              font-size: 12px;
              background: white;
              border: none;
              border-radius: 6px;
              box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 15px 0 rgba(0, 0, 0, 0.1);
              color: #2E3438;
            }
            #${b} ul {
              list-style: none;
              margin: 0;
              padding: 0;
            }
            #${b} > ul {
              max-height: 300px;
              overflow-y: auto;
              padding: 4px 0;
            }
            #${b} li {
              padding: 0 4px;
              margin: 0;
            }
            #${b} li > :not(ul) {
              display: flex;
              padding: 8px;
              margin: 0;
              align-items: center;
              gap: 8px;
              border-radius: 4px;
            }
            #${b} button {
              width: 100%;
              border: 0;
              background: transparent;
              color: inherit;
              text-align: left;
              font-family: inherit;
              font-size: inherit;
            }
            #${b} button:focus-visible {
              outline-color: #029CFD;
            }
            #${b} button:hover {
              background: rgba(2, 156, 253, 0.07);
              color: #029CFD;
              cursor: pointer;
            }
            #${b} li code {
              white-space: nowrap;
              overflow: hidden;
              text-overflow: ellipsis;
              line-height: 16px;
              font-size: 11px;
            }
            #${b} li svg {
              flex-shrink: 0;
              margin: 1px;
              color: #73828C;
            }
            #${b} li > button:hover svg, #${b} li > button:focus-visible svg {
              color: #029CFD;
            }
            #${b} .element-list li svg {
              display: none;
            }
            #${b} li.selectable svg, #${b} li.selected svg {
              display: block;
            }
            #${b} .menu-list {
              border-top: 1px solid rgba(38, 85, 115, 0.15);
            }
            #${b} .menu-list > li:not(:last-child) {
              padding-bottom: 4px;
              margin-bottom: 4px;
              border-bottom: 1px solid rgba(38, 85, 115, 0.15);
            }
            #${b} .menu-items, #${b} .menu-items li {
              padding: 0;
            }
            #${b} .menu-item {
              display: flex;
            }
            #${b} .menu-item-content {
              display: flex;
              flex-direction: column;
              flex-grow: 1;
            }
          `
        ])
      );
    }
    let c = y.get(), u = c ? [c] : l.get();
    if (u.length && (p.style.position = getComputedStyle(u[0].element).position === "fixed" ? "fixed" : "absolute", p.appendChild(
      S(
        "ul",
        { class: "element-list" },
        u.map((g) => {
          let h = u.length > 1 && !!g.menu?.some(
            (M) => M.some(
              (z) => !z.selectors || z.selectors.some((J) => g.selectors.includes(J))
            )
          ), v = h ? {
            class: "selectable",
            onClick: /* @__PURE__ */ i(() => y.set(g), "onClick"),
            onMouseEnter: /* @__PURE__ */ i(() => m.set(g), "onMouseEnter"),
            onMouseLeave: /* @__PURE__ */ i(() => m.set(void 0), "onMouseLeave")
          } : c ? { class: "selected", onClick: /* @__PURE__ */ i(() => y.set(void 0), "onClick") } : {}, R = h || c;
          return S("li", v, [
            S(R ? "button" : "div", R ? { type: "button" } : {}, [
              c ? Z("chevronLeft") : null,
              S("code", {}, [g.element.outerHTML]),
              h ? Z("chevronRight") : null
            ])
          ]);
        })
      )
    )), y.get() || l.get().length === 1) {
      let g = y.get() || l.get()[0], h = g.menu?.filter(
        (v) => v.some(
          (R) => !R.selectors || R.selectors.some((M) => g.selectors.includes(M))
        )
      );
      h?.length && p.appendChild(
        S(
          "ul",
          { class: "menu-list" },
          h.map(
            (v) => S("li", {}, [
              S(
                "ul",
                { class: "menu-items" },
                v.map(
                  ({ id: R, title: M, description: z, iconLeft: J, iconRight: Pe, clickEvent: Ie }) => {
                    let se = Ie && (() => e.emit(Ie, R, pt(g)));
                    return S("li", {}, [
                      S(
                        se ? "button" : "div",
                        se ? { class: "menu-item", type: "button", onClick: se } : { class: "menu-item" },
                        [
                          J ? Z(J) : null,
                          S("div", { class: "menu-item-content" }, [
                            S(z ? "strong" : "span", {}, [M]),
                            z && S("span", {}, [z])
                          ]),
                          Pe ? Z(Pe) : null
                        ]
                      )
                    ]);
                  }
                )
              )
            ])
          )
        )
      );
    }
    let T = s.get();
    T ? (Object.assign(p.style, {
      display: "block",
      left: `${p.style.position === "fixed" ? T.x - window.scrollX : T.x}px`,
      top: `${p.style.position === "fixed" ? T.y - window.scrollY : T.y}px`
    }), Ae(p), requestAnimationFrame(() => lt(p, T, { topOffset: 15, centered: !0 }))) : (dt(p), Object.assign(p.style, { display: "none" }));
  }, "renderMenu");
  l.subscribe(N), y.subscribe(N);
  let W = /* @__PURE__ */ i((p) => {
    let c = st(p);
    n.set((u) => {
      let T = c.id ? u.filter((g) => g.id !== c.id) : u;
      return c.selectors?.length ? [...T, c] : T;
    });
  }, "addHighlight"), j = /* @__PURE__ */ i((p) => {
    p && n.set((c) => c.filter((u) => u.id !== p));
  }, "removeHighlight"), I = /* @__PURE__ */ i(() => {
    n.set([]), r.set(/* @__PURE__ */ new Map()), o.set([]), s.set(void 0), a.set(void 0), l.set([]), d.set([]), m.set(void 0), y.set(void 0);
  }, "resetState"), E, H = /* @__PURE__ */ i((p, c) => {
    let u = "scrollIntoView-highlight";
    clearTimeout(E), j(u);
    let T = t.querySelector(p);
    if (!T) {
      console.warn(`Cannot scroll into view: ${p} not found`);
      return;
    }
    T.scrollIntoView({ behavior: "smooth", block: "center", ...c });
    let g = `kf-${Math.random().toString(36).substring(2, 15)}`;
    n.set((h) => [
      ...h,
      {
        id: u,
        priority: 1e3,
        selectors: [p],
        styles: {
          outline: "2px solid #1EA7FD",
          outlineOffset: "-1px",
          animation: `${g} 3s linear forwards`
        },
        keyframes: `@keyframes ${g} {
          0% { outline: 2px solid #1EA7FD; }
          20% { outline: 2px solid #1EA7FD00; }
          40% { outline: 2px solid #1EA7FD; }
          60% { outline: 2px solid #1EA7FD00; }
          80% { outline: 2px solid #1EA7FD; }
          100% { outline: 2px solid #1EA7FD00; }
        }`
      }
    ]), E = setTimeout(() => j(u), 3500);
  }, "scrollIntoView"), O = /* @__PURE__ */ i((p) => {
    requestAnimationFrame(() => a.set({ x: p.pageX, y: p.pageY }));
  }, "onMouseMove");
  t.body.addEventListener("mousemove", O), e.on(_e, W), e.on(je, j), e.on(Ne, I), e.on(Ge, H), e.on(sn, ({ newPhase: p }) => {
    p === "loading" && I();
  });
}, "useHighlights");

// src/highlight/preview.ts
globalThis?.FEATURES?.highlight && mt?.ready && mt.ready().then(ut);
var Re = /* @__PURE__ */ i(() => ln({}), "default");

// src/measure/preview.ts
import { definePreviewAddon as En } from "storybook/internal/csf";

// src/measure/withMeasure.ts
import { useEffect as Ct } from "storybook/preview-api";

// src/measure/box-model/canvas.ts
import { global as ne } from "@storybook/global";
function gt() {
  let e = ne.document.documentElement, t = Math.max(e.scrollHeight, e.offsetHeight);
  return { width: Math.max(e.scrollWidth, e.offsetWidth), height: t };
}
i(gt, "getDocumentWidthAndHeight");
function dn() {
  let e = ne.document.createElement("canvas");
  e.id = "storybook-addon-measure";
  let t = e.getContext("2d");
  Q(t != null);
  let { width: n, height: r } = gt();
  return Se(e, t, { width: n, height: r }), e.style.position = "absolute", e.style.left = "0", e.style.top = "0", e.style.zIndex = "2147483647", e.style.pointerEvents = "none", ne.document.body.appendChild(e), { canvas: e, context: t, width: n, height: r };
}
i(dn, "createCanvas");
function Se(e, t, { width: n, height: r }) {
  e.style.width = `${n}px`, e.style.height = `${r}px`;
  let o = ne.window.devicePixelRatio;
  e.width = Math.floor(n * o), e.height = Math.floor(r * o), t.scale(o, o);
}
i(Se, "setCanvasWidthAndHeight");
var w = {};
function ft() {
  w.canvas || (w = dn());
}
i(ft, "init");
function yt() {
  w.context && w.context.clearRect(0, 0, w.width ?? 0, w.height ?? 0);
}
i(yt, "clear");
function Tt(e) {
  yt(), e(w.context);
}
i(Tt, "draw");
function xt() {
  Q(w.canvas, "Canvas should exist in the state."), Q(w.context, "Context should exist in the state."), Se(w.canvas, w.context, { width: 0, height: 0 });
  let { width: e, height: t } = gt();
  Se(w.canvas, w.context, { width: e, height: t }), w.width = e, w.height = t;
}
i(xt, "rescale");
function ht() {
  w.canvas && (yt(), w.canvas.parentNode?.removeChild(w.canvas), w = {});
}
i(ht, "destroy");

// src/measure/box-model/visualizer.ts
import { global as k } from "@storybook/global";

// src/measure/box-model/labels.ts
var U = {
  margin: "#f6b26b",
  border: "#ffe599",
  padding: "#93c47d",
  content: "#6fa8dc",
  text: "#232020"
}, _ = 6;
function bt(e, { x: t, y: n, w: r, h: o, r: s }) {
  t = t - r / 2, n = n - o / 2, r < 2 * s && (s = r / 2), o < 2 * s && (s = o / 2), e.beginPath(), e.moveTo(t + s, n), e.arcTo(t + r, n, t + r, n + o, s), e.arcTo(t + r, n + o, t, n + o, s), e.arcTo(t, n + o, t, n, s), e.arcTo(t, n, t + r, n, s), e.closePath();
}
i(bt, "roundedRect");
function pn(e, { padding: t, border: n, width: r, height: o, top: s, left: a }) {
  let l = r - n.left - n.right - t.left - t.right, d = o - t.top - t.bottom - n.top - n.bottom, m = a + n.left + t.left, y = s + n.top + t.top;
  return e === "top" ? m += l / 2 : e === "right" ? (m += l, y += d / 2) : e === "bottom" ? (m += l / 2, y += d) : e === "left" ? y += d / 2 : e === "center" && (m += l / 2, y += d / 2), { x: m, y };
}
i(pn, "positionCoordinate");
function cn(e, t, { margin: n, border: r, padding: o }, s, a) {
  let l = /* @__PURE__ */ i((x) => 0, "shift"), d = 0, m = 0, y = a ? 1 : 0.5, f = a ? s * 2 : 0;
  return e === "padding" ? l = /* @__PURE__ */ i((x) => o[x] * y + f, "shift") : e === "border" ? l = /* @__PURE__ */ i((x) => o[x] + r[x] * y + f, "shift") : e === "margin" && (l = /* @__PURE__ */ i((x) => o[x] + r[x] + n[x] * y + f, "shift")), t === "top" ? m = -l("top") : t === "right" ? d = l("right") : t === "bottom" ? m = l("bottom") : t === "left" && (d = -l("left")), { offsetX: d, offsetY: m };
}
i(cn, "offset");
function un(e, t) {
  return Math.abs(e.x - t.x) < Math.abs(e.w + t.w) / 2 && Math.abs(e.y - t.y) < Math.abs(e.h + t.h) / 2;
}
i(un, "collide");
function mn(e, t, n) {
  return e === "top" ? t.y = n.y - n.h - _ : e === "right" ? t.x = n.x + n.w / 2 + _ + t.w / 2 : e === "bottom" ? t.y = n.y + n.h + _ : e === "left" && (t.x = n.x - n.w / 2 - _ - t.w / 2), { x: t.x, y: t.y };
}
i(mn, "overlapAdjustment");
function At(e, t, { x: n, y: r, w: o, h: s }, a) {
  return bt(e, { x: n, y: r, w: o, h: s, r: 3 }), e.fillStyle = `${U[t]}dd`, e.fill(), e.strokeStyle = U[t], e.stroke(), e.fillStyle = U.text, e.fillText(a, n, r), bt(e, { x: n, y: r, w: o, h: s, r: 3 }), e.fillStyle = `${U[t]}dd`, e.fill(), e.strokeStyle = U[t], e.stroke(), e.fillStyle = U.text, e.fillText(a, n, r), { x: n, y: r, w: o, h: s };
}
i(At, "textWithRect");
function Rt(e, t) {
  e.font = "600 12px monospace", e.textBaseline = "middle", e.textAlign = "center";
  let n = e.measureText(t), r = n.actualBoundingBoxAscent + n.actualBoundingBoxDescent, o = n.width + _ * 2, s = r + _ * 2;
  return { w: o, h: s };
}
i(Rt, "configureText");
function gn(e, t, { type: n, position: r = "center", text: o }, s, a = !1) {
  let { x: l, y: d } = pn(r, t), { offsetX: m, offsetY: y } = cn(n, r, t, _ + 1, a);
  l += m, d += y;
  let { w: f, h: x } = Rt(e, o);
  if (s && un({ x: l, y: d, w: f, h: x }, s)) {
    let A = mn(r, { x: l, y: d, w: f, h: x }, s);
    l = A.x, d = A.y;
  }
  return At(e, n, { x: l, y: d, w: f, h: x }, o);
}
i(gn, "drawLabel");
function fn(e, { w: t, h: n }) {
  let r = t * 0.5 + _, o = n * 0.5 + _;
  return {
    offsetX: (e.x === "left" ? -1 : 1) * r,
    offsetY: (e.y === "top" ? -1 : 1) * o
  };
}
i(fn, "floatingOffset");
function yn(e, t, { type: n, text: r }) {
  let { floatingAlignment: o, extremities: s } = t, a = s[o.x], l = s[o.y], { w: d, h: m } = Rt(e, r), { offsetX: y, offsetY: f } = fn(o, {
    w: d,
    h: m
  });
  return a += y, l += f, At(e, n, { x: a, y: l, w: d, h: m }, r);
}
i(yn, "drawFloatingLabel");
function K(e, t, n, r) {
  let o = [];
  n.forEach((s, a) => {
    let l = r && s.position === "center" ? yn(e, t, s) : gn(e, t, s, o[a - 1], r);
    o[a] = l;
  });
}
i(K, "drawStack");
function St(e, t, n, r) {
  let o = n.reduce((s, a) => (Object.prototype.hasOwnProperty.call(s, a.position) || (s[a.position] = []), s[a.position]?.push(a), s), {});
  o.top && K(e, t, o.top, r), o.right && K(e, t, o.right, r), o.bottom && K(e, t, o.bottom, r), o.left && K(e, t, o.left, r), o.center && K(e, t, o.center, r);
}
i(St, "labelStacks");

// src/measure/box-model/visualizer.ts
var re = {
  margin: "#f6b26ba8",
  border: "#ffe599a8",
  padding: "#93c47d8c",
  content: "#6fa8dca8"
}, wt = 30;
function $(e) {
  return parseInt(e.replace("px", ""), 10);
}
i($, "pxToNumber");
function Y(e) {
  return Number.isInteger(e) ? e : e.toFixed(2);
}
i(Y, "round");
function we(e) {
  return e.filter((t) => t.text !== 0 && t.text !== "0");
}
i(we, "filterZeroValues");
function Tn(e) {
  let t = {
    top: k.window.scrollY,
    bottom: k.window.scrollY + k.window.innerHeight,
    left: k.window.scrollX,
    right: k.window.scrollX + k.window.innerWidth
  }, n = {
    top: Math.abs(t.top - e.top),
    bottom: Math.abs(t.bottom - e.bottom),
    left: Math.abs(t.left - e.left),
    right: Math.abs(t.right - e.right)
  };
  return {
    x: n.left > n.right ? "left" : "right",
    y: n.top > n.bottom ? "top" : "bottom"
  };
}
i(Tn, "floatingAlignment");
function xn(e) {
  let t = k.getComputedStyle(e), { top: n, left: r, right: o, bottom: s, width: a, height: l } = e.getBoundingClientRect(), {
    marginTop: d,
    marginBottom: m,
    marginLeft: y,
    marginRight: f,
    paddingTop: x,
    paddingBottom: A,
    paddingLeft: C,
    paddingRight: P,
    borderBottomWidth: N,
    borderTopWidth: W,
    borderLeftWidth: j,
    borderRightWidth: I
  } = t;
  n = n + k.window.scrollY, r = r + k.window.scrollX, s = s + k.window.scrollY, o = o + k.window.scrollX;
  let E = {
    top: $(d),
    bottom: $(m),
    left: $(y),
    right: $(f)
  }, H = {
    top: $(x),
    bottom: $(A),
    left: $(C),
    right: $(P)
  }, O = {
    top: $(W),
    bottom: $(N),
    left: $(j),
    right: $(I)
  }, p = {
    top: n - E.top,
    bottom: s + E.bottom,
    left: r - E.left,
    right: o + E.right
  };
  return {
    margin: E,
    padding: H,
    border: O,
    top: n,
    left: r,
    bottom: s,
    right: o,
    width: a,
    height: l,
    extremities: p,
    floatingAlignment: Tn(p)
  };
}
i(xn, "measureElement");
function hn(e, { margin: t, width: n, height: r, top: o, left: s, bottom: a, right: l }) {
  let d = r + t.bottom + t.top;
  e.fillStyle = re.margin, e.fillRect(s, o - t.top, n, t.top), e.fillRect(l, o - t.top, t.right, d), e.fillRect(s, a, n, t.bottom), e.fillRect(s - t.left, o - t.top, t.left, d);
  let m = [
    {
      type: "margin",
      text: Y(t.top),
      position: "top"
    },
    {
      type: "margin",
      text: Y(t.right),
      position: "right"
    },
    {
      type: "margin",
      text: Y(t.bottom),
      position: "bottom"
    },
    {
      type: "margin",
      text: Y(t.left),
      position: "left"
    }
  ];
  return we(m);
}
i(hn, "drawMargin");
function bn(e, { padding: t, border: n, width: r, height: o, top: s, left: a, bottom: l, right: d }) {
  let m = r - n.left - n.right, y = o - t.top - t.bottom - n.top - n.bottom;
  e.fillStyle = re.padding, e.fillRect(a + n.left, s + n.top, m, t.top), e.fillRect(
    d - t.right - n.right,
    s + t.top + n.top,
    t.right,
    y
  ), e.fillRect(
    a + n.left,
    l - t.bottom - n.bottom,
    m,
    t.bottom
  ), e.fillRect(a + n.left, s + t.top + n.top, t.left, y);
  let f = [
    {
      type: "padding",
      text: t.top,
      position: "top"
    },
    {
      type: "padding",
      text: t.right,
      position: "right"
    },
    {
      type: "padding",
      text: t.bottom,
      position: "bottom"
    },
    {
      type: "padding",
      text: t.left,
      position: "left"
    }
  ];
  return we(f);
}
i(bn, "drawPadding");
function An(e, { border: t, width: n, height: r, top: o, left: s, bottom: a, right: l }) {
  let d = r - t.top - t.bottom;
  e.fillStyle = re.border, e.fillRect(s, o, n, t.top), e.fillRect(s, a - t.bottom, n, t.bottom), e.fillRect(s, o + t.top, t.left, d), e.fillRect(l - t.right, o + t.top, t.right, d);
  let m = [
    {
      type: "border",
      text: t.top,
      position: "top"
    },
    {
      type: "border",
      text: t.right,
      position: "right"
    },
    {
      type: "border",
      text: t.bottom,
      position: "bottom"
    },
    {
      type: "border",
      text: t.left,
      position: "left"
    }
  ];
  return we(m);
}
i(An, "drawBorder");
function Rn(e, { padding: t, border: n, width: r, height: o, top: s, left: a }) {
  let l = r - n.left - n.right - t.left - t.right, d = o - t.top - t.bottom - n.top - n.bottom;
  return e.fillStyle = re.content, e.fillRect(
    a + n.left + t.left,
    s + n.top + t.top,
    l,
    d
  ), [
    {
      type: "content",
      position: "center",
      text: `${Y(l)} x ${Y(d)}`
    }
  ];
}
i(Rn, "drawContent");
function Sn(e) {
  return (t) => {
    if (e && t) {
      let n = xn(e), r = hn(t, n), o = bn(t, n), s = An(t, n), a = Rn(t, n), l = n.width <= wt * 3 || n.height <= wt;
      St(
        t,
        n,
        [...a, ...o, ...s, ...r],
        l
      );
    }
  };
}
i(Sn, "drawBoxModel");
function Et(e) {
  Tt(Sn(e));
}
i(Et, "drawSelectedElement");

// src/measure/util.ts
import { global as wn } from "@storybook/global";
var vt = /* @__PURE__ */ i((e, t) => {
  let n = wn.document.elementFromPoint(e, t), r = /* @__PURE__ */ i((s) => {
    if (s && s.shadowRoot) {
      let a = s.shadowRoot.elementFromPoint(e, t);
      return s.isEqualNode(a) ? s : a.shadowRoot ? r(a) : a;
    }
    return s;
  }, "crawlShadows");
  return r(n) || n;
}, "deepElementFromPoint");

// src/measure/withMeasure.ts
var $t, oe = { x: 0, y: 0 };
function Mt(e, t) {
  $t = vt(e, t), Et($t);
}
i(Mt, "findAndDrawElement");
var Lt = /* @__PURE__ */ i((e, t) => {
  let { measureEnabled: n } = t.globals || {};
  return Ct(() => {
    if (typeof globalThis.document > "u")
      return;
    let r = /* @__PURE__ */ i((o) => {
      window.requestAnimationFrame(() => {
        o.stopPropagation(), oe.x = o.clientX, oe.y = o.clientY;
      });
    }, "onPointerMove");
    return globalThis.document.addEventListener("pointermove", r), () => {
      globalThis.document.removeEventListener("pointermove", r);
    };
  }, []), Ct(() => {
    let r = /* @__PURE__ */ i((s) => {
      window.requestAnimationFrame(() => {
        s.stopPropagation(), Mt(s.clientX, s.clientY);
      });
    }, "onPointerOver"), o = /* @__PURE__ */ i(() => {
      window.requestAnimationFrame(() => {
        xt();
      });
    }, "onResize");
    return t.viewMode === "story" && n && (globalThis.document.addEventListener("pointerover", r), ft(), globalThis.window.addEventListener("resize", o), Mt(oe.x, oe.y)), () => {
      globalThis.window.removeEventListener("resize", o), ht();
    };
  }, [n, t.viewMode]), e();
}, "withMeasure");

// src/measure/preview.ts
var vn = globalThis.FEATURES?.measure ? [Lt] : [], Cn = {
  [Ue]: !1
}, Ee = /* @__PURE__ */ i(() => En({
  decorators: vn,
  initialGlobals: Cn
}), "default");

// src/outline/preview.ts
import { definePreviewAddon as kn } from "storybook/internal/csf";

// src/outline/withOutline.ts
import { useEffect as Mn, useMemo as Ln } from "storybook/preview-api";

// src/outline/helpers.ts
import { global as ie } from "@storybook/global";
var ve = /* @__PURE__ */ i((e) => {
  (Array.isArray(e) ? e : [e]).forEach($n);
}, "clearStyles"), $n = /* @__PURE__ */ i((e) => {
  let t = typeof e == "string" ? e : e.join(""), n = ie.document.getElementById(t);
  n && n.parentElement && n.parentElement.removeChild(n);
}, "clearStyle"), kt = /* @__PURE__ */ i((e, t) => {
  let n = ie.document.getElementById(e);
  if (n)
    n.innerHTML !== t && (n.innerHTML = t);
  else {
    let r = ie.document.createElement("style");
    r.setAttribute("id", e), r.innerHTML = t, ie.document.head.appendChild(r);
  }
}, "addOutlineStyles");

// src/outline/outlineCSS.ts
function Ce(e) {
  return Fe`
    ${e} body {
      outline: 1px solid #2980b9 !important;
    }

    ${e} article {
      outline: 1px solid #3498db !important;
    }

    ${e} nav {
      outline: 1px solid #0088c3 !important;
    }

    ${e} aside {
      outline: 1px solid #33a0ce !important;
    }

    ${e} section {
      outline: 1px solid #66b8da !important;
    }

    ${e} header {
      outline: 1px solid #99cfe7 !important;
    }

    ${e} footer {
      outline: 1px solid #cce7f3 !important;
    }

    ${e} h1 {
      outline: 1px solid #162544 !important;
    }

    ${e} h2 {
      outline: 1px solid #314e6e !important;
    }

    ${e} h3 {
      outline: 1px solid #3e5e85 !important;
    }

    ${e} h4 {
      outline: 1px solid #449baf !important;
    }

    ${e} h5 {
      outline: 1px solid #c7d1cb !important;
    }

    ${e} h6 {
      outline: 1px solid #4371d0 !important;
    }

    ${e} main {
      outline: 1px solid #2f4f90 !important;
    }

    ${e} address {
      outline: 1px solid #1a2c51 !important;
    }

    ${e} div {
      outline: 1px solid #036cdb !important;
    }

    ${e} p {
      outline: 1px solid #ac050b !important;
    }

    ${e} hr {
      outline: 1px solid #ff063f !important;
    }

    ${e} pre {
      outline: 1px solid #850440 !important;
    }

    ${e} blockquote {
      outline: 1px solid #f1b8e7 !important;
    }

    ${e} ol {
      outline: 1px solid #ff050c !important;
    }

    ${e} ul {
      outline: 1px solid #d90416 !important;
    }

    ${e} li {
      outline: 1px solid #d90416 !important;
    }

    ${e} dl {
      outline: 1px solid #fd3427 !important;
    }

    ${e} dt {
      outline: 1px solid #ff0043 !important;
    }

    ${e} dd {
      outline: 1px solid #e80174 !important;
    }

    ${e} figure {
      outline: 1px solid #ff00bb !important;
    }

    ${e} figcaption {
      outline: 1px solid #bf0032 !important;
    }

    ${e} table {
      outline: 1px solid #00cc99 !important;
    }

    ${e} caption {
      outline: 1px solid #37ffc4 !important;
    }

    ${e} thead {
      outline: 1px solid #98daca !important;
    }

    ${e} tbody {
      outline: 1px solid #64a7a0 !important;
    }

    ${e} tfoot {
      outline: 1px solid #22746b !important;
    }

    ${e} tr {
      outline: 1px solid #86c0b2 !important;
    }

    ${e} th {
      outline: 1px solid #a1e7d6 !important;
    }

    ${e} td {
      outline: 1px solid #3f5a54 !important;
    }

    ${e} col {
      outline: 1px solid #6c9a8f !important;
    }

    ${e} colgroup {
      outline: 1px solid #6c9a9d !important;
    }

    ${e} button {
      outline: 1px solid #da8301 !important;
    }

    ${e} datalist {
      outline: 1px solid #c06000 !important;
    }

    ${e} fieldset {
      outline: 1px solid #d95100 !important;
    }

    ${e} form {
      outline: 1px solid #d23600 !important;
    }

    ${e} input {
      outline: 1px solid #fca600 !important;
    }

    ${e} keygen {
      outline: 1px solid #b31e00 !important;
    }

    ${e} label {
      outline: 1px solid #ee8900 !important;
    }

    ${e} legend {
      outline: 1px solid #de6d00 !important;
    }

    ${e} meter {
      outline: 1px solid #e8630c !important;
    }

    ${e} optgroup {
      outline: 1px solid #b33600 !important;
    }

    ${e} option {
      outline: 1px solid #ff8a00 !important;
    }

    ${e} output {
      outline: 1px solid #ff9619 !important;
    }

    ${e} progress {
      outline: 1px solid #e57c00 !important;
    }

    ${e} select {
      outline: 1px solid #e26e0f !important;
    }

    ${e} textarea {
      outline: 1px solid #cc5400 !important;
    }

    ${e} details {
      outline: 1px solid #33848f !important;
    }

    ${e} summary {
      outline: 1px solid #60a1a6 !important;
    }

    ${e} command {
      outline: 1px solid #438da1 !important;
    }

    ${e} menu {
      outline: 1px solid #449da6 !important;
    }

    ${e} del {
      outline: 1px solid #bf0000 !important;
    }

    ${e} ins {
      outline: 1px solid #400000 !important;
    }

    ${e} img {
      outline: 1px solid #22746b !important;
    }

    ${e} iframe {
      outline: 1px solid #64a7a0 !important;
    }

    ${e} embed {
      outline: 1px solid #98daca !important;
    }

    ${e} object {
      outline: 1px solid #00cc99 !important;
    }

    ${e} param {
      outline: 1px solid #37ffc4 !important;
    }

    ${e} video {
      outline: 1px solid #6ee866 !important;
    }

    ${e} audio {
      outline: 1px solid #027353 !important;
    }

    ${e} source {
      outline: 1px solid #012426 !important;
    }

    ${e} canvas {
      outline: 1px solid #a2f570 !important;
    }

    ${e} track {
      outline: 1px solid #59a600 !important;
    }

    ${e} map {
      outline: 1px solid #7be500 !important;
    }

    ${e} area {
      outline: 1px solid #305900 !important;
    }

    ${e} a {
      outline: 1px solid #ff62ab !important;
    }

    ${e} em {
      outline: 1px solid #800b41 !important;
    }

    ${e} strong {
      outline: 1px solid #ff1583 !important;
    }

    ${e} i {
      outline: 1px solid #803156 !important;
    }

    ${e} b {
      outline: 1px solid #cc1169 !important;
    }

    ${e} u {
      outline: 1px solid #ff0430 !important;
    }

    ${e} s {
      outline: 1px solid #f805e3 !important;
    }

    ${e} small {
      outline: 1px solid #d107b2 !important;
    }

    ${e} abbr {
      outline: 1px solid #4a0263 !important;
    }

    ${e} q {
      outline: 1px solid #240018 !important;
    }

    ${e} cite {
      outline: 1px solid #64003c !important;
    }

    ${e} dfn {
      outline: 1px solid #b4005a !important;
    }

    ${e} sub {
      outline: 1px solid #dba0c8 !important;
    }

    ${e} sup {
      outline: 1px solid #cc0256 !important;
    }

    ${e} time {
      outline: 1px solid #d6606d !important;
    }

    ${e} code {
      outline: 1px solid #e04251 !important;
    }

    ${e} kbd {
      outline: 1px solid #5e001f !important;
    }

    ${e} samp {
      outline: 1px solid #9c0033 !important;
    }

    ${e} var {
      outline: 1px solid #d90047 !important;
    }

    ${e} mark {
      outline: 1px solid #ff0053 !important;
    }

    ${e} bdi {
      outline: 1px solid #bf3668 !important;
    }

    ${e} bdo {
      outline: 1px solid #6f1400 !important;
    }

    ${e} ruby {
      outline: 1px solid #ff7b93 !important;
    }

    ${e} rt {
      outline: 1px solid #ff2f54 !important;
    }

    ${e} rp {
      outline: 1px solid #803e49 !important;
    }

    ${e} span {
      outline: 1px solid #cc2643 !important;
    }

    ${e} br {
      outline: 1px solid #db687d !important;
    }

    ${e} wbr {
      outline: 1px solid #db175b !important;
    }`;
}
i(Ce, "outlineCSS");

// src/outline/withOutline.ts
var Pt = /* @__PURE__ */ i((e, t) => {
  let n = t.globals || {}, r = [!0, "true"].includes(n[ee]), o = t.viewMode === "docs", s = Ln(() => Ce(o ? '[data-story-block="true"]' : ".sb-show-main"), [t]);
  return Mn(() => {
    let a = o ? `addon-outline-docs-${t.id}` : "addon-outline";
    return r ? kt(a, s) : ve(a), () => {
      ve(a);
    };
  }, [r, s, t]), e();
}, "withOutline");

// src/outline/preview.ts
var Pn = globalThis.FEATURES?.outline ? [Pt] : [], In = {
  [ee]: !1
}, $e = /* @__PURE__ */ i(() => kn({ decorators: Pn, initialGlobals: In }), "default");

// src/test/preview.ts
import { definePreviewAddon as Bn } from "storybook/internal/csf";
import { instrument as Fn } from "storybook/internal/instrumenter";
import {
  clearAllMocks as Hn,
  fn as On,
  isMockFunction as Dn,
  resetAllMocks as _n,
  restoreAllMocks as jn,
  uninstrumentedUserEvent as Nn,
  within as Gn
} from "storybook/test";
var zn = /* @__PURE__ */ i(({ parameters: e }) => {
  e?.test?.mockReset === !0 ? _n() : e?.test?.clearMocks === !0 ? Hn() : e?.test?.restoreMocks !== !1 && jn();
}, "resetAllMocksLoader"), Me = /* @__PURE__ */ i((e, t = 0, n) => {
  if (t > 5 || e == null)
    return e;
  if (Dn(e))
    return n && e.mockName(n), e;
  if (typeof e == "function" && "isAction" in e && e.isAction && !("implicit" in e && e.implicit)) {
    let r = On(e);
    return n && r.mockName(n), r;
  }
  if (Array.isArray(e)) {
    t++;
    for (let r = 0; r < e.length; r++)
      Object.getOwnPropertyDescriptor(e, r)?.writable && (e[r] = Me(e[r], t));
    return e;
  }
  if (typeof e == "object" && e.constructor === Object) {
    t++;
    for (let [r, o] of Object.entries(e))
      Object.getOwnPropertyDescriptor(e, r)?.writable && (e[r] = Me(o, t, r));
    return e;
  }
  return e;
}, "traverseArgs"), qn = /* @__PURE__ */ i(({ initialArgs: e }) => {
  Me(e);
}, "nameSpiesAndWrapActionsInSpies"), It = !1, Un = /* @__PURE__ */ i(async (e) => {
  globalThis.HTMLElement && e.canvasElement instanceof globalThis.HTMLElement && (e.canvas = Gn(e.canvasElement));
  let t = globalThis.window?.navigator?.clipboard;
  if (t) {
    e.userEvent = Fn(
      { userEvent: Nn.setup() },
      { intercept: !0 }
    ).userEvent, Object.defineProperty(globalThis.window.navigator, "clipboard", {
      get: /* @__PURE__ */ i(() => t, "get"),
      configurable: !0
    });
    let n = HTMLElement.prototype.focus;
    It || Object.defineProperties(HTMLElement.prototype, {
      focus: {
        configurable: !0,
        set: /* @__PURE__ */ i((r) => {
          n = r, It = !0;
        }, "set"),
        get: /* @__PURE__ */ i(() => n, "get")
      }
    });
  }
}, "enhanceContext"), Le = /* @__PURE__ */ i(() => Bn({
  loaders: [zn, qn, Un]
}), "default");

// src/viewport/preview.ts
import { definePreviewAddon as Yn } from "storybook/internal/csf";
var Wn = {
  [ze]: { value: void 0, isRotated: !1 }
}, ke = /* @__PURE__ */ i(() => Yn({
  initialGlobals: Wn
}), "default");

// src/csf/core-annotations.ts
function Bt() {
  return [
    // @ts-expect-error CJS fallback
    (Ee.default ?? Ee)(),
    // @ts-expect-error CJS fallback
    (fe.default ?? fe)(),
    // @ts-expect-error CJS fallback
    (Re.default ?? Re)(),
    // @ts-expect-error CJS fallback
    ($e.default ?? $e)(),
    // @ts-expect-error CJS fallback
    (ke.default ?? ke)(),
    // @ts-expect-error CJS fallback
    (me.default ?? me)(),
    // @ts-expect-error CJS fallback
    (ye.default ?? ye)(),
    // @ts-expect-error CJS fallback
    (Le.default ?? Le)()
  ];
}
i(Bt, "getCoreAnnotations");

// src/csf/csf-factories.ts
function ri(e) {
  let t, n = {
    _tag: "Preview",
    input: e,
    get composed() {
      if (t)
        return t;
      let { addons: r, ...o } = e;
      return t = He(
        Oe([...Bt(), ...r ?? [], o])
      ), t;
    },
    meta(r) {
      return Xn(r, this);
    }
  };
  return globalThis.globalProjectAnnotations = n.composed, n;
}
i(ri, "definePreview");
function oi(e) {
  return e;
}
i(oi, "definePreviewAddon");
function ii(e) {
  return e != null && typeof e == "object" && "_tag" in e && e?._tag === "Preview";
}
i(ii, "isPreview");
function si(e) {
  return e != null && typeof e == "object" && "_tag" in e && e?._tag === "Meta";
}
i(si, "isMeta");
function Xn(e, t) {
  return {
    _tag: "Meta",
    input: e,
    preview: t,
    get composed() {
      throw new Error("Not implemented");
    },
    // @ts-expect-error hard
    story(n = {}) {
      return Ft(typeof n == "function" ? { render: n } : n, this);
    }
  };
}
i(Xn, "defineMeta");
function ai(e) {
  return e != null && typeof e == "object" && "_tag" in e && e?._tag === "Story";
}
i(ai, "isStory");
function Ft(e, t) {
  let n, r = /* @__PURE__ */ i(() => (n || (n = De(
    e,
    t.input,
    void 0,
    t.preview.composed
  )), n), "compose");
  return {
    _tag: "Story",
    input: e,
    meta: t,
    __compose: r,
    get composed() {
      let o = r(), { args: s, argTypes: a, parameters: l, id: d, tags: m, globals: y, storyName: f } = o;
      return { args: s, argTypes: a, parameters: l, id: d, tags: m, name: f, globals: y };
    },
    get play() {
      return e.play ?? t.input?.play ?? (async () => {
      });
    },
    get run() {
      return r().run ?? (async () => {
      });
    },
    extend(o) {
      return Ft(
        {
          ...this.input,
          ...o,
          args: { ...this.input.args, ...o.args },
          argTypes: ae(this.input.argTypes, o.argTypes),
          afterEach: [
            ...D(this.input?.afterEach ?? []),
            ...D(o.afterEach ?? [])
          ],
          beforeEach: [
            ...D(this.input?.beforeEach ?? []),
            ...D(o.beforeEach ?? [])
          ],
          decorators: [
            ...D(this.input?.decorators ?? []),
            ...D(o.decorators ?? [])
          ],
          globals: { ...this.input.globals, ...o.globals },
          loaders: [
            ...D(this.input?.loaders ?? []),
            ...D(o.loaders ?? [])
          ],
          parameters: ae(this.input.parameters, o.parameters),
          tags: Vn(...this.input.tags ?? [], ...o.tags ?? [])
        },
        this.meta
      );
    }
  };
}
i(Ft, "defineStory");

// src/csf/index.ts
var Zn = /* @__PURE__ */ i((e) => e.toLowerCase().replace(/[ ’–—―′¿'`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, "-").replace(/-+/g, "-").replace(/^-+/, "").replace(/-+$/, ""), "sanitize"), Ht = /* @__PURE__ */ i((e, t) => {
  let n = Zn(e);
  if (n === "")
    throw new Error(`Invalid ${t} '${e}', must include alphanumeric characters`);
  return n;
}, "sanitizeSafe"), ci = /* @__PURE__ */ i((e, t) => `${Ht(e, "kind")}${t ? `--${Ht(t, "name")}` : ""}`, "toId"), ui = /* @__PURE__ */ i((e) => Ye(e), "storyNameFromExport");
function Ot(e, t) {
  return Array.isArray(t) ? t.includes(e) : e.match(t);
}
i(Ot, "matches");
function mi(e, { includeStories: t, excludeStories: n }) {
  return (
    // https://babeljs.io/docs/en/babel-plugin-transform-modules-commonjs
    e !== "__esModule" && (!t || Ot(e, t)) && (!n || !Ot(e, n))
  );
}
i(mi, "isExportStory");
var gi = /* @__PURE__ */ i((e, { rootSeparator: t, groupSeparator: n }) => {
  let [r, o] = e.split(t, 2), s = (o || e).split(n).filter((a) => !!a);
  return {
    root: o ? r : null,
    groups: s
  };
}, "parseKind"), fi = /* @__PURE__ */ i((...e) => {
  let t = e.reduce((n, r) => (r.startsWith("!") ? n.delete(r.slice(1)) : n.add(r), n), /* @__PURE__ */ new Set());
  return Array.from(t);
}, "combineTags");
export {
  fi as combineTags,
  ri as definePreview,
  oi as definePreviewAddon,
  Bt as getCoreAnnotations,
  Nt as includeConditionalArg,
  mi as isExportStory,
  si as isMeta,
  ii as isPreview,
  ai as isStory,
  gi as parseKind,
  Zn as sanitize,
  ui as storyNameFromExport,
  ci as toId
};
