@bquery/bquery 1.6.0 → 1.7.0

package/dist/component-BEQgt5hl.js

@@ -1,600 +0,0 @@
-import { f as A, l as q, n as z, t as _, u as M } from "./sanitize-Bs2dkMby.js";
-import { t as O } from "./effect-AFRW_Plg.js";
-import { n as B } from "./config-DRmZZno3.js";
-import { t as E } from "./untrack-B0rVscTc.js";
-var H = (r, t) => {
-  const { type: a } = t;
-  if (a === String) return r;
-  if (a === Number) return Number(r);
-  if (a === Boolean) {
-    const e = r.trim().toLowerCase();
-    return e === "" || e === "true" || e === "1" ? !0 : e === "false" || e === "0" ? !1 : !!r;
-  }
-  if (a === Object || a === Array) try {
-    return JSON.parse(r);
-  } catch {
-    return r;
-  }
-  if (typeof a == "function") {
-    const e = a, n = a;
-    if (t.construct === !0) return Reflect.construct(n, [r]);
-    if (t.construct === !1) return e(r);
-    const l = a.prototype !== void 0 && a.prototype !== null, x = (l ? Object.getOwnPropertyNames(a.prototype) : []).length > 1, s = l && a.prototype.constructor !== a, i = /^class\s/.test(Function.prototype.toString.call(a));
-    if (x || s || i) try {
-      return Reflect.construct(n, [r]);
-    } catch {
-      return e(r);
-    }
-    try {
-      const o = e(r);
-      if (o === void 0 && l) try {
-        return Reflect.construct(n, [r]);
-      } catch {
-        return o;
-      }
-      return o;
-    } catch (o) {
-      if (o instanceof TypeError && /cannot be invoked without 'new'|is not a function/i.test(o.message)) return Reflect.construct(n, [r]);
-      throw o;
-    }
-  }
-  return r;
-}, L = ["slot"], I = [
-  "part",
-  "disabled",
-  "checked",
-  "placeholder",
-  "value",
-  "rows",
-  "cols",
-  "readonly",
-  "required",
-  "maxlength",
-  "minlength",
-  "max",
-  "min",
-  "step",
-  "pattern",
-  "autocomplete",
-  "autofocus",
-  "for",
-  "multiple",
-  "selected",
-  "wrap"
-], S = (r, t) => {
-  const a = [...L, ...t.sanitize?.allowTags ?? []], e = [...I, ...t.sanitize?.allowAttributes ?? []], n = Object.values(t.signals ?? {});
-  class l extends HTMLElement {
-    constructor() {
-      super(), this.state = { ...t.state ?? {} }, this.props = {}, this.missingRequiredProps = /* @__PURE__ */ new Set(), this.hasMounted = !1, this.attachShadow({ mode: "open" }), this.syncProps();
-    }
-    static get observedAttributes() {
-      return Object.keys(t.props ?? {});
-    }
-    connectedCallback() {
-      try {
-        if (!this.hasMounted && this.missingRequiredProps.size > 0) return;
-        if (this.hasMounted) {
-          try {
-            t.connected?.call(this);
-          } catch (s) {
-            this.handleError(s);
-          }
-          this.setupSignalSubscriptions(!0);
-          return;
-        }
-        this.mount();
-      } catch (s) {
-        this.handleError(s);
-      }
-    }
-    mount() {
-      this.hasMounted || (t.beforeMount?.call(this), t.connected?.call(this), this.render(), this.setupSignalSubscriptions(), this.hasMounted = !0);
-    }
-    disconnectedCallback() {
-      try {
-        this.signalEffectCleanup?.(), this.signalEffectCleanup = void 0, t.disconnected?.call(this);
-      } catch (s) {
-        this.handleError(s);
-      }
-    }
-    attributeChangedCallback(s, i, o) {
-      try {
-        const u = this.cloneProps();
-        this.syncProps(), this.hasMounted ? this.render(!0, u, {
-          name: s,
-          oldValue: i,
-          newValue: o
-        }) : this.isConnected && this.missingRequiredProps.size === 0 && this.mount();
-      } catch (u) {
-        this.handleError(u);
-      }
-    }
-    handleError(s) {
-      t.onError ? t.onError.call(this, s) : console.error(`bQuery component error in <${r}>:`, s);
-    }
-    setState(s, i) {
-      this.state[s] = i, this.render(!0, this.cloneProps(), void 0, !1);
-    }
-    getState(s) {
-      return this.state[s];
-    }
-    setupSignalSubscriptions(s = !1) {
-      if (this.signalEffectCleanup || n.length === 0) return;
-      let i = !0;
-      this.signalEffectCleanup = O(() => {
-        try {
-          for (const u of n) u.value;
-          if (i) {
-            if (i = !1, s && this.hasMounted && this.isConnected) {
-              const u = this.cloneProps();
-              E(() => {
-                this.render(!0, u, void 0, !1);
-              });
-            }
-            return;
-          }
-          if (!this.hasMounted || !this.isConnected) return;
-          const o = this.cloneProps();
-          E(() => {
-            this.render(!0, o, void 0, !1);
-          });
-        } catch (o) {
-          this.handleError(o);
-        }
-      });
-    }
-    syncProps() {
-      const s = t.props ?? {};
-      for (const [i, o] of Object.entries(s)) {
-        const u = this.getAttribute(i);
-        let d;
-        if (u == null ? o.required && o.default === void 0 ? (this.missingRequiredProps.add(i), d = void 0) : d = o.default ?? void 0 : (this.missingRequiredProps.has(i) && this.missingRequiredProps.delete(i), d = H(u, o)), o.validator && d !== void 0 && !o.validator(d))
-          throw new Error(`bQuery component: validation failed for prop "${i}" with value ${JSON.stringify(d)}`);
-        this.props[i] = d;
-      }
-    }
-    cloneProps() {
-      return { ...this.props };
-    }
-    render(s = !1, i, o, u = !0) {
-      try {
-        if (s && u && t.beforeUpdate) {
-          if (!i) throw new Error("bQuery component: previous props are required for update renders");
-          if (t.beforeUpdate.call(this, this.props, i) === !1) return;
-        }
-        const d = (h, T) => {
-          this.dispatchEvent(new CustomEvent(h, {
-            detail: T,
-            bubbles: !0,
-            composed: !0
-          }));
-        };
-        if (!this.shadowRoot) return;
-        const R = z(t.render({
-          props: this.props,
-          state: this.state,
-          signals: t.signals ?? {},
-          emit: d
-        }), {
-          allowTags: a,
-          allowAttributes: e
-        });
-        let m = null;
-        if (t.styles && (m = this.shadowRoot.querySelector("style[data-bquery-component-style]")), this.shadowRoot.innerHTML = R, t.styles) {
-          const h = m ?? document.createElement("style");
-          m || h.setAttribute("data-bquery-component-style", ""), h.textContent = t.styles, this.shadowRoot.prepend(h);
-        }
-        s && t.updated?.call(this, o);
-      } catch (d) {
-        this.handleError(d);
-      }
-    }
-  }
-  return l;
-};
-function K(r, t) {
-  return S(r, t);
-}
-function f(r, t) {
-  const a = S(r, t);
-  customElements.get(r) || customElements.define(r, a);
-}
-var k = /* @__PURE__ */ Symbol("bquery.booleanAttribute"), N = /^[^\0-\x20"'/>=]+$/, C = (r) => {
-  if (typeof r != "object" || r === null) return !1;
-  const t = r;
-  return t[k] === !0 && typeof t.enabled == "boolean" && typeof t.name == "string";
-}, w = (r) => C(r) ? r.enabled ? r.name : "" : String(r ?? ""), j = {
-  "&": "&amp;",
-  "<": "&lt;",
-  ">": "&gt;",
-  '"': "&quot;",
-  "'": "&#x27;",
-  "`": "&#x60;"
-}, P = (r) => C(r) ? r.enabled ? r.name : "" : w(r).replace(/[&<>"'`]/g, (t) => j[t]), Y = (r, t) => {
-  if (!N.test(r)) throw new TypeError(`Invalid boolean attribute name: ${r}`);
-  const a = {
-    [k]: !0,
-    enabled: !!t,
-    name: r
-  };
-  return Object.freeze(a);
-}, p = (r, ...t) => r.reduce((a, e, n) => `${a}${e}${w(t[n])}`, ""), X = (r, ...t) => {
-  const a = (e) => q(e) ? A(e) : P(e);
-  return M(r.reduce((e, n, l) => `${e}${n}${l < t.length ? a(t[l]) : ""}`, ""));
-}, b = `
-  :host {
-    color: inherit;
-    font: inherit;
-  }
-`, $ = `
-  ${b}
-  .field {
-    display: inline-flex;
-    flex-direction: column;
-    gap: 0.375rem;
-    width: 100%;
-  }
-  .label {
-    color: #334155;
-    font-size: 0.875rem;
-    font-weight: 600;
-  }
-  .control {
-    border: 1px solid #cbd5e1;
-    border-radius: 0.75rem;
-    box-sizing: border-box;
-    font: inherit;
-    min-height: 2.75rem;
-    outline: none;
-    padding: 0.75rem 0.875rem;
-    width: 100%;
-    background: #fff;
-    color: #0f172a;
-    transition: border-color 160ms ease, box-shadow 160ms ease;
-  }
-  .control:focus {
-    border-color: #2563eb;
-    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
-  }
-  .control:disabled {
-    background: #f8fafc;
-    color: #94a3b8;
-    cursor: not-allowed;
-  }
-`, c = (r) => _(r), v = /* @__PURE__ */ new WeakMap(), y = (r, t) => v.get(r)?.[t], g = (r, t, a) => {
-  const e = v.get(r) ?? {};
-  e[t] = a, v.set(r, e);
-}, U = (r, t, a) => {
-  if (a.label !== t.label || a.type !== t.type || a.placeholder !== t.placeholder || a.name !== t.name || a.disabled !== t.disabled) return !1;
-  const e = r.shadowRoot?.querySelector("input.control");
-  return e ? (e.value !== t.value && (e.value = t.value), !0) : !1;
-}, Q = (r, t, a) => {
-  if (a.label !== t.label || a.placeholder !== t.placeholder || a.name !== t.name || a.rows !== t.rows || a.disabled !== t.disabled) return !1;
-  const e = r.shadowRoot?.querySelector("textarea.control");
-  return e ? (e.value !== t.value && (e.value = t.value), !0) : !1;
-}, D = (r) => [
-  "<textarea",
-  ' part="control"',
-  ' class="control"',
-  ` placeholder="${c(r.placeholder)}"`,
-  ` name="${c(r.name)}"`,
-  ` rows="${r.rows}"`,
-  r.disabled ? " disabled" : "",
-  `>${c(r.value)}</textarea>`
-].join(""), Z = (r = {}) => {
-  const t = r.prefix ?? B().components?.prefix ?? "bq", a = {
-    button: `${t}-button`,
-    card: `${t}-card`,
-    input: `${t}-input`,
-    textarea: `${t}-textarea`,
-    checkbox: `${t}-checkbox`
-  };
-  return f(a.button, {
-    props: {
-      label: {
-        type: String,
-        default: ""
-      },
-      variant: {
-        type: String,
-        default: "primary"
-      },
-      size: {
-        type: String,
-        default: "md"
-      },
-      type: {
-        type: String,
-        default: "button"
-      },
-      disabled: {
-        type: Boolean,
-        default: !1
-      }
-    },
-    styles: `
-      ${b}
-      button {
-        appearance: none;
-        border: 0;
-        border-radius: 999px;
-        cursor: pointer;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        font: inherit;
-        font-weight: 600;
-        gap: 0.5rem;
-        min-height: 2.5rem;
-        padding: 0.65rem 1rem;
-        transition: transform 160ms ease, opacity 160ms ease, background 160ms ease;
-        background: #2563eb;
-        color: #fff;
-      }
-      button[data-variant='secondary'] {
-        background: #e2e8f0;
-        color: #0f172a;
-      }
-      button[data-size='sm'] {
-        min-height: 2.125rem;
-        padding: 0.5rem 0.875rem;
-      }
-      button[data-size='lg'] {
-        min-height: 3rem;
-        padding: 0.875rem 1.25rem;
-      }
-      button:hover:not(:disabled) {
-        transform: translateY(-1px);
-      }
-      button:disabled {
-        cursor: not-allowed;
-        opacity: 0.6;
-      }
-    `,
-    render: ({ props: e }) => p`
-      <button
-        part="button"
-        type="${c(e.type)}"
-        data-variant="${c(e.variant)}"
-        data-size="${c(e.size)}"
-        ${e.disabled ? "disabled" : ""}
-      >
-        <slot>${c(e.label)}</slot>
-      </button>
-    `
-  }), f(a.card, {
-    props: {
-      title: {
-        type: String,
-        default: ""
-      },
-      footer: {
-        type: String,
-        default: ""
-      },
-      elevated: {
-        type: Boolean,
-        default: !0
-      }
-    },
-    styles: `
-      ${b}
-      article {
-        background: #fff;
-        border: 1px solid #e2e8f0;
-        border-radius: 1rem;
-        box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08);
-        color: #0f172a;
-        display: block;
-        padding: 1rem;
-      }
-      article[data-elevated='false'] {
-        box-shadow: none;
-      }
-      header, footer {
-        color: #475569;
-        font-size: 0.95rem;
-        font-weight: 600;
-      }
-      header {
-        margin-bottom: 0.75rem;
-      }
-      footer {
-        margin-top: 0.75rem;
-      }
-    `,
-    render: ({ props: e }) => p`
-      <article part="card" data-elevated="${String(e.elevated)}">
-        ${e.title ? `<header part="header">${c(e.title)}</header>` : ""}
-        <section part="body"><slot></slot></section>
-        ${e.footer ? `<footer part="footer">${c(e.footer)}</footer>` : ""}
-      </article>
-    `
-  }), f(a.input, {
-    props: {
-      label: {
-        type: String,
-        default: ""
-      },
-      type: {
-        type: String,
-        default: "text"
-      },
-      value: {
-        type: String,
-        default: ""
-      },
-      placeholder: {
-        type: String,
-        default: ""
-      },
-      name: {
-        type: String,
-        default: ""
-      },
-      disabled: {
-        type: Boolean,
-        default: !1
-      }
-    },
-    styles: $,
-    beforeUpdate(e, n) {
-      return !U(this, e, n);
-    },
-    connected() {
-      const e = (n) => {
-        const l = n.target;
-        l?.matches("input") && (n.stopPropagation(), this.setAttribute("value", l.value), this.dispatchEvent(new CustomEvent("input", {
-          detail: { value: l.value },
-          bubbles: !0,
-          composed: !0
-        })));
-      };
-      g(this, "__bqueryInputHandler", e), this.shadowRoot?.addEventListener("input", e);
-    },
-    disconnected() {
-      const e = y(this, "__bqueryInputHandler");
-      e && this.shadowRoot?.removeEventListener("input", e);
-    },
-    render: ({ props: e }) => p`
-      <label part="field" class="field">
-        ${e.label ? `<span part="label" class="label">${c(e.label)}</span>` : ""}
-        <input
-          part="control"
-          class="control"
-          type="${c(e.type)}"
-          value="${c(e.value)}"
-          placeholder="${c(e.placeholder)}"
-          name="${c(e.name)}"
-          ${e.disabled ? "disabled" : ""}
-        />
-      </label>
-    `
-  }), f(a.textarea, {
-    props: {
-      label: {
-        type: String,
-        default: ""
-      },
-      value: {
-        type: String,
-        default: ""
-      },
-      placeholder: {
-        type: String,
-        default: ""
-      },
-      name: {
-        type: String,
-        default: ""
-      },
-      rows: {
-        type: Number,
-        default: 4
-      },
-      disabled: {
-        type: Boolean,
-        default: !1
-      }
-    },
-    styles: `${$}
-      textarea.control {
-        min-height: 6rem;
-        resize: vertical;
-      }
-    `,
-    beforeUpdate(e, n) {
-      return !Q(this, e, n);
-    },
-    connected() {
-      const e = (n) => {
-        const l = n.target;
-        l?.matches("textarea") && (n.stopPropagation(), this.setAttribute("value", l.value), this.dispatchEvent(new CustomEvent("input", {
-          detail: { value: l.value },
-          bubbles: !0,
-          composed: !0
-        })));
-      };
-      g(this, "__bqueryTextareaHandler", e), this.shadowRoot?.addEventListener("input", e);
-    },
-    disconnected() {
-      const e = y(this, "__bqueryTextareaHandler");
-      e && this.shadowRoot?.removeEventListener("input", e);
-    },
-    render: ({ props: e }) => p`
-      <label part="field" class="field">
-        ${e.label ? `<span part="label" class="label">${c(e.label)}</span>` : ""}
-        ${D(e)}
-      </label>
-    `
-  }), f(a.checkbox, {
-    props: {
-      label: {
-        type: String,
-        default: ""
-      },
-      checked: {
-        type: Boolean,
-        default: !1
-      },
-      disabled: {
-        type: Boolean,
-        default: !1
-      }
-    },
-    styles: `
-      ${b}
-      label {
-        align-items: center;
-        color: #0f172a;
-        cursor: pointer;
-        display: inline-flex;
-        gap: 0.625rem;
-      }
-      input {
-        accent-color: #2563eb;
-        block-size: 1rem;
-        inline-size: 1rem;
-      }
-      input:disabled {
-        cursor: not-allowed;
-      }
-    `,
-    connected() {
-      const e = (n) => {
-        const l = n.target;
-        l?.matches('input[type="checkbox"]') && (n.stopPropagation(), l.checked ? this.setAttribute("checked", "true") : this.removeAttribute("checked"), this.dispatchEvent(new CustomEvent("change", {
-          detail: { checked: l.checked },
-          bubbles: !0,
-          composed: !0
-        })));
-      };
-      g(this, "__bqueryCheckboxHandler", e), this.shadowRoot?.addEventListener("change", e);
-    },
-    disconnected() {
-      const e = y(this, "__bqueryCheckboxHandler");
-      e && this.shadowRoot?.removeEventListener("change", e);
-    },
-    render: ({ props: e }) => p`
-      <label part="label">
-        <input
-          part="control"
-          type="checkbox"
-          ${e.checked ? "checked" : ""}
-          ${e.disabled ? "disabled" : ""}
-        />
-        <span part="text"><slot>${c(e.label)}</slot></span>
-      </label>
-    `
-  }), a;
-};
-export {
-  f as a,
-  X as i,
-  Y as n,
-  K as o,
-  p as r,
-  Z as t
-};
-
-//# sourceMappingURL=component-BEQgt5hl.js.map