ranui/dist/factory-ZNhcQ4tf.js

A framework-agnostic Web Components UI library built on native custom elements, with TypeScript types, light/dark theming, SSR and PWA support.

import { c as d, n as P } from "./mocks-CMGoftIc.js";
var S = 0, A = 1, m = 2, f = null, l = null, p = 0, y = /* @__PURE__ */ new Set(), g = !1;
function B(e, t) {
  const r = t?.equals ?? Object.is, n = {
    value: e,
    observers: /* @__PURE__ */ new Set()
  };
  return [() => (R(n), n.value), (i) => {
    const a = typeof i == "function" ? i(n.value) : i;
    if (!r(n.value, a)) {
      n.value = a;
      for (const u of n.observers) N(u, m);
      p === 0 && j();
    }
  }];
}
function L(e, t) {
  const r = k(e, !1, t?.equals);
  return D(r), () => (r.disposed || (I(r), R(r)), r.value);
}
function C(e) {
  const t = k(e, !0);
  return D(t), M(t), () => O(t);
}
function Z(e) {
  p++;
  try {
    e();
  } finally {
    p--, p === 0 && j();
  }
}
function ee(e) {
  const t = f;
  f = null;
  try {
    return e();
  } finally {
    f = t;
  }
}
function E(e) {
  const t = {
    owned: [],
    cleanups: [],
    owner: l
  }, r = l, n = f;
  l = t, f = null;
  try {
    return e(() => $(t));
  } finally {
    l = r, f = n;
  }
}
function x(e) {
  l && l.cleanups.push(e);
}
function te() {
  return l;
}
function re(e, t) {
  const r = l, n = f;
  l = e, f = null;
  try {
    return t();
  } finally {
    l = r, f = n;
  }
}
function k(e, t, r) {
  return {
    fn: e,
    sources: /* @__PURE__ */ new Set(),
    isEffect: t,
    running: !1,
    disposed: !1,
    state: m,
    observers: /* @__PURE__ */ new Set(),
    value: void 0,
    equals: r ?? Object.is,
    owned: [],
    cleanups: [],
    owner: l
  };
}
function D(e) {
  l && l.owned.push(e);
}
function R(e) {
  f && (f.sources.add(e), e.observers.add(f));
}
function N(e, t) {
  if (e.disposed || e.state >= t) return;
  const r = e.state === S;
  if (e.state = t, e.isEffect) y.add(e);
  else if (r) for (const n of e.observers) N(n, A);
}
function j() {
  if (!(p > 0 || g)) {
    g = !0;
    try {
      for (; y.size > 0; ) {
        const e = [...y];
        y.clear();
        for (const t of e) t.disposed || I(t);
      }
    } finally {
      g = !1;
    }
  }
}
function I(e) {
  if (!(e.disposed || e.state === S)) {
    if (e.state === A)
      for (const t of e.sources) "fn" in t && I(t);
    e.state === m && M(e), e.state = S;
  }
}
function M(e) {
  if (e.running) throw new Error("ranui reactivity: cyclic dependency detected (a computation triggered itself).");
  _(e);
  const t = f, r = l;
  f = e, l = e, e.running = !0, e.state = S;
  try {
    const n = e.fn();
    if (e.isEffect)
      typeof n == "function" && e.cleanups.push(n);
    else {
      const s = e.value;
      if (e.value = n, e.observers.size > 0 && !e.equals(s, n)) for (const o of e.observers) N(o, m);
    }
  } finally {
    e.running = !1, f = t, l = r;
  }
}
function _(e) {
  for (const t of e.owned) O(t);
  e.owned.length = 0;
  for (const t of e.cleanups) t();
  e.cleanups.length = 0;
  for (const t of e.sources) t.observers.delete(e);
  e.sources.clear();
}
function O(e) {
  e.disposed || (e.disposed = !0, _(e), e.observers.clear());
}
function $(e) {
  for (const t of e.owned) O(t);
  e.owned.length = 0;
  for (const t of e.cleanups) t();
  e.cleanups.length = 0;
}
var ne = () => ({ current: null }), z = (e) => e.reduce((t, r) => Array.isArray(r) ? t.concat(z(r)) : t.concat(r), []), v = (e) => e == null ? null : e instanceof q ? e.build() : typeof e == "string" ? d ? e : document.createTextNode(e) : e, K = (e, t) => {
  if (d) {
    w(e, [t()]);
    return;
  }
  const r = document.createComment(""), n = document.createComment("");
  e.appendChild(r), e.appendChild(n);
  let s = null;
  const o = () => {
    s?.(), s = null;
    let i = r.nextSibling;
    for (; i && i !== n; ) {
      const a = i.nextSibling;
      i.parentNode?.removeChild(i), i = a;
    }
  };
  C(() => {
    const i = t();
    o();
    const a = document.createDocumentFragment();
    s = E((u) => (w(a, [i]), u)), n.parentNode?.insertBefore(a, n);
  }), x(() => s?.());
}, F = "__ranFor";
function se(e) {
  return {
    ...e,
    [F]: !0
  };
}
var V = (e) => typeof e == "object" && e !== null && e[F] === !0;
function oe(e) {
  const t = L(() => !!e.when()), r = () => e.when();
  return () => t() ? e.children(r) : e.fallback?.() ?? null;
}
function ie(e) {
  return e;
}
function ae(e) {
  const t = e.children, r = L(() => t.findIndex((n) => !!n.when()));
  return () => {
    const n = r();
    if (n < 0) return e.fallback?.() ?? null;
    const s = t[n];
    return s.children(() => s.when());
  };
}
var W = (e, t, r) => {
  const [n, s] = B(t);
  let o = null;
  const i = E((a) => {
    const u = v(r(e, n));
    return o = typeof u == "string" ? document.createTextNode(u) : u, a;
  });
  return {
    node: o,
    index: s,
    dispose: i
  };
}, H = (e, t) => {
  const r = e.parentNode;
  if (!r) return;
  let n = e;
  for (const s of t)
    n.nextSibling !== s && r.insertBefore(s, n.nextSibling), n = s;
}, U = (e, t) => {
  if (d) {
    (t.each() ?? []).forEach((s, o) => {
      const i = v(t.render(s, () => o));
      i != null && e.appendChild(i);
    });
    return;
  }
  const r = document.createComment("");
  e.appendChild(r);
  let n = /* @__PURE__ */ new Map();
  x(() => {
    for (const s of n.values()) s.dispose();
    n.clear();
  }), C(() => {
    const s = t.each() ?? [], o = /* @__PURE__ */ new Map(), i = [];
    s.forEach((a, u) => {
      const b = t.key(a, u);
      if (o.has(b)) return;
      let h = n.get(b);
      h ? (n.delete(b), h.index(u)) : h = W(a, u, t.render), o.set(b, h), h.node && i.push(h.node);
    });
    for (const a of n.values())
      a.node?.parentNode?.removeChild(a.node), a.dispose();
    H(r, i), n = o;
  });
}, T = "__ranIndex";
function le(e) {
  return {
    ...e,
    [T]: !0
  };
}
var X = (e) => typeof e == "object" && e !== null && e[T] === !0, Y = (e, t, r) => {
  const [n, s] = B(e);
  let o = null;
  const i = E((a) => {
    const u = v(r(n, t));
    return o = typeof u == "string" ? document.createTextNode(u) : u, a;
  });
  return {
    node: o,
    setItem: s,
    dispose: i
  };
}, G = (e, t) => {
  if (d) {
    (t.each() ?? []).forEach((s, o) => {
      const i = v(t.render(() => s, o));
      i != null && e.appendChild(i);
    });
    return;
  }
  const r = document.createComment("");
  e.appendChild(r);
  let n = [];
  x(() => {
    for (const s of n) s.dispose();
    n = [];
  }), C(() => {
    const s = t.each() ?? [];
    for (let o = 0; o < s.length; o++) o < n.length ? n[o].setItem(s[o]) : n.push(Y(s[o], o, t.render));
    for (let o = n.length - 1; o >= s.length; o--) {
      const { node: i } = n[o];
      i?.parentNode?.removeChild(i), n[o].dispose(), n.pop();
    }
    H(r, n.map((o) => o.node).filter((o) => o != null));
  });
}, w = (e, t) => {
  z(t).forEach((r) => {
    if (V(r)) {
      U(e, r);
      return;
    }
    if (X(r)) {
      G(e, r);
      return;
    }
    if (typeof r == "function") {
      K(e, r);
      return;
    }
    const n = v(r);
    n != null && e.appendChild(n);
  });
}, q = class {
  el;
  constructor(e) {
    this.el = d ? new P(e) : document.createElement(e);
  }
  id(e) {
    return this.el.setAttribute("id", e), this;
  }
  bind(e, t) {
    typeof e == "function" ? C(() => t(e())) : t(e);
  }
  class(e) {
    return this.bind(e, (t) => {
      d ? this.el.attributes.set("class", t) : this.el.className = t;
    }), this;
  }
  addClass(...e) {
    return e.forEach((t) => this.el.classList.add(t)), this;
  }
  removeClass(...e) {
    return e.forEach((t) => this.el.classList.remove(t)), this;
  }
  attr(e, t) {
    return this.bind(t, (r) => this.el.setAttribute(e, r)), this;
  }
  attrs(e) {
    return Object.entries(e).forEach(([t, r]) => {
      r != null && this.el.setAttribute(t, String(r));
    }), this;
  }
  boolAttr(e, t, r = "") {
    return this.bind(t, (n) => {
      n ? this.el.setAttribute(e, r) : this.el.removeAttribute(e);
    }), this;
  }
  part(e) {
    return this.attr("part", e);
  }
  data(e, t) {
    return this.attr(`data-${e}`, t);
  }
  style(e, t) {
    return typeof e == "string" ? this.bind(t ?? "", (r) => this.el.style.setProperty(e, r)) : Object.entries(e).forEach(([r, n]) => this.el.style.setProperty(r, n)), this;
  }
  cssVar(e, t) {
    const r = e.startsWith("--") ? e : `--${e}`;
    return this.style(r, t);
  }
  aria(e, t) {
    return this.attr(`aria-${e}`, t);
  }
  role(e) {
    return this.attr("role", e);
  }
  tabIndex(e) {
    return this.attr("tabindex", String(e));
  }
  label(e) {
    return this.aria("label", e);
  }
  labelledBy(e) {
    return this.aria("labelledby", e);
  }
  describedBy(e) {
    return this.aria("describedby", e);
  }
  ariaHidden(e = !0) {
    return this.aria("hidden", String(e));
  }
  on(e, t, r) {
    return this.el.addEventListener(e, t, r), this;
  }
  listen(e, t, r, n) {
    return e.on(this.el, t, r, n), this;
  }
  delegate(e, t, r, n, s) {
    return e.delegate(this.el, t, r, n, s), this;
  }
  children(...e) {
    return w(this.el, e), this;
  }
  replaceChildren(...e) {
    if (d) {
      const t = this.el;
      t.childrenList = [];
    } else this.el.replaceChildren();
    return this.children(...e);
  }
  text(e) {
    return this.bind(e, (t) => {
      this.el.textContent = t;
    }), this;
  }
  ref(e) {
    return e.current = this.el, this;
  }
  shadow(e = { mode: "closed" }) {
    const t = this.el.attachShadow(e);
    return new J(this.el, t, e);
  }
  build() {
    return this.el;
  }
  serialize() {
    if (d) return this.el.serialize();
    const e = document.createElement("div");
    return e.appendChild(this.el.cloneNode(!0)), e.innerHTML;
  }
}, J = class {
  root;
  hostEl;
  options;
  constructor(e, t, r) {
    this.hostEl = e, this.root = t, this.options = r;
  }
  children(...e) {
    return w(this.root, e), this;
  }
  adoptSheet(...e) {
    return this.root.adoptedStyleSheets = [...this.root.adoptedStyleSheets, ...e], this;
  }
  css(e) {
    if (d)
      return this.root.adoptedStyleSheets.push(e), this;
    if (typeof CSSStyleSheet < "u") try {
      const r = new CSSStyleSheet();
      return r.replaceSync(e), this.root.adoptedStyleSheets = [...this.root.adoptedStyleSheets, r], this;
    } catch {
    }
    const t = document.createElement("style");
    return t.textContent = e, this.root.appendChild(t), this;
  }
  done() {
    return {
      host: this.hostEl,
      shadow: this.root
    };
  }
  serialize() {
    return d ? this.root.serialize() : this.root.innerHTML;
  }
}, c = (e) => new q(e), ce = () => c("div"), ue = () => c("span"), fe = () => c("slot"), de = () => c("button"), he = () => c("input"), pe = () => c("style"), ve = () => c("label"), be = () => c("ul"), ye = () => c("li"), Se = () => c("section"), we = () => c("article"), me = () => c("nav"), Ce = () => c("header"), ge = () => c("footer"), Ee = () => c("main"), xe = (e = "open", t = !1) => {
  const r = c("template");
  return r.attr("shadowrootmode", e), t && r.attr("shadowrootdelegatesfocus", ""), r;
};
export {
  te as A,
  oe as C,
  L as D,
  Z as E,
  re as M,
  B as N,
  C as O,
  ee as P,
  J as S,
  ne as T,
  c as _,
  ge as a,
  le as b,
  ve as c,
  me as d,
  Se as f,
  be as g,
  pe as h,
  ce as i,
  x as j,
  E as k,
  ye as l,
  ue as m,
  de as n,
  Ce as o,
  fe as p,
  xe as r,
  he as s,
  we as t,
  Ee as u,
  q as v,
  ae as w,
  ie as x,
  se as y
};