zabi-components 2.1.1 → 2.2.0

package/dist/Checkbox-Dzsjjsfr.js

@@ -0,0 +1,307 @@
+import { y as U, l as C, p as t, z as d, A as P, i as S, f as M, a as A, s as W, c as k, d as T, g as q, x as z, k as n, m as c, h as I, o as u, b as $, e as F, j as G, t as H, v as J, u as L, B as O, n as K } from "./props-B4BdFk2B.js";
+function ne(a, e) {
+  U(() => {
+    var s = a.getRootNode(), i = (
+      /** @type {ShadowRoot} */
+      s.host ? (
+        /** @type {ShadowRoot} */
+        s
+      ) : (
+        /** @type {Document} */
+        s.head ?? /** @type {Document} */
+        s.ownerDocument.head
+      )
+    );
+    if (!i.querySelector("#" + e.hash)) {
+      const r = document.createElement("style");
+      r.id = e.hash, r.textContent = e.code, i.appendChild(r);
+    }
+  });
+}
+var X = M("<button><!></button>");
+function le(a, e) {
+  const s = C(e, ["children", "$$slots", "$$events", "$$legacy"]), i = C(s, ["variant", "size", "disabled", "type", "className"]);
+  q(e, !1);
+  const r = c(), l = c(), x = c();
+  let f = t(e, "variant", 8, "primary"), b = t(e, "size", 8, "md"), w = t(e, "disabled", 8, !1), p = t(e, "type", 8, "button"), m = t(e, "className", 8, "");
+  d(() => {
+  }, () => {
+    u(r, {
+      sm: "px-3 py-1.5 text-sm",
+      md: "px-4 py-2 text-sm",
+      lg: "px-5 py-3 text-base"
+    });
+  }), d(() => {
+  }, () => {
+    u(l, {
+      primary: "bg-blue-600 text-white hover:bg-blue-700 focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
+      secondary: "bg-gray-600 text-white hover:bg-gray-700 focus:ring-2 focus:ring-gray-500 focus:ring-offset-2",
+      danger: "bg-red-600 text-white hover:bg-red-700 focus:ring-2 focus:ring-red-500 focus:ring-offset-2",
+      success: "bg-green-600 text-white hover:bg-green-700 focus:ring-2 focus:ring-green-500 focus:ring-offset-2",
+      ghost: "bg-transparent text-gray-700 hover:bg-gray-100 focus:ring-2 focus:ring-gray-500 focus:ring-offset-2",
+      brand: "bg-purple-600 text-white hover:bg-purple-700 focus:ring-2 focus:ring-purple-500 focus:ring-offset-2"
+    });
+  }), d(
+    () => (n(r), z(b()), n(l), z(f()), z(m())),
+    () => {
+      u(x, [
+        "inline-flex items-center justify-center font-medium rounded-md transition-colors duration-200",
+        "disabled:opacity-50 disabled:cursor-not-allowed",
+        "focus:outline-none",
+        n(r)[b()],
+        n(l)[f()],
+        m()
+      ].filter(Boolean).join(" "));
+    }
+  ), P(), S();
+  var y = X();
+  A(y, () => ({
+    type: p(),
+    class: n(x),
+    disabled: w(),
+    ...i
+  }));
+  var _ = I(y);
+  W(_, e, "default", {}), k(a, y), T();
+}
+function Q(a) {
+  const e = {
+    default: "input-variant-default",
+    success: "input-variant-success",
+    warning: "input-variant-warning",
+    error: "input-variant-error",
+    info: "input-variant-info"
+  };
+  return e[a] || e.default;
+}
+function ie(a) {
+  const e = {
+    default: "card-variant-default",
+    success: "card-variant-success",
+    warning: "card-variant-warning",
+    error: "card-variant-error",
+    info: "card-variant-info"
+  };
+  return e[a] || e.default;
+}
+function R(a, e) {
+  const s = {
+    default: `variant-${e}-default`,
+    success: `variant-${e}-success`,
+    warning: `variant-${e}-warning`,
+    error: `variant-${e}-error`,
+    info: `variant-${e}-info`
+  };
+  return s[a] || s.default;
+}
+function oe(a) {
+  return {
+    border: R(a, "border"),
+    text: R(a, "text"),
+    bg: R(a, "bg")
+  };
+}
+function de(a, e) {
+  return a.reduce((s, i) => (s[i] = `${e}-${i}`, s), {});
+}
+var Y = M("<label> </label>"), Z = M("<div><!> <input/></div>");
+function ce(a, e) {
+  const s = C(e, ["children", "$$slots", "$$events", "$$legacy"]), i = C(s, [
+    "value",
+    "type",
+    "label",
+    "placeholder",
+    "disabled",
+    "size",
+    "variant"
+  ]);
+  q(e, !1);
+  const r = c(), l = c(), x = c(), f = c();
+  let b = t(e, "value", 12, ""), w = t(e, "type", 8, "text"), p = t(e, "label", 8, ""), m = t(e, "placeholder", 8, ""), y = t(e, "disabled", 8, !1), _ = t(e, "size", 8, "md"), g = t(e, "variant", 8, "default");
+  const v = `input-${Math.random().toString(36).substr(2, 9)}`;
+  function j(h) {
+    const o = h.target;
+    b(o.value);
+  }
+  d(() => {
+  }, () => {
+    u(r, {
+      sm: "px-3 py-1.5 text-sm",
+      md: "px-4 py-2 text-sm",
+      lg: "px-5 py-3 text-base"
+    });
+  }), d(() => z(g()), () => {
+    u(l, Q(g()));
+  }), d(
+    () => (n(r), z(_()), n(l)),
+    () => {
+      u(x, [
+        "w-full rounded-md transition-colors duration-200",
+        "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-surface",
+        "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-surface-disabled",
+        n(r)[_()],
+        n(l)
+      ].join(" "));
+    }
+  ), d(() => {
+  }, () => {
+    u(f, "block text-sm font-medium text-primary mb-1");
+  }), P(), S();
+  var V = Z(), B = I(V);
+  {
+    var D = (h) => {
+      var o = Y(), E = I(o);
+      H(() => {
+        J(o, "for", v), L(o, 1, O(n(f))), K(E, p());
+      }), k(h, o);
+    };
+    $(B, (h) => {
+      p() && h(D);
+    });
+  }
+  var N = G(B, 2);
+  A(
+    N,
+    () => ({
+      id: v,
+      type: w(),
+      value: b(),
+      placeholder: m(),
+      disabled: y(),
+      class: n(x),
+      ...i
+    }),
+    void 0,
+    void 0,
+    void 0,
+    !0
+  ), F("input", N, j), k(a, V), T();
+}
+var ee = M("<label> </label>"), te = M("<div><!> <textarea></textarea></div>");
+function ue(a, e) {
+  const s = C(e, ["children", "$$slots", "$$events", "$$legacy"]), i = C(s, [
+    "value",
+    "label",
+    "placeholder",
+    "disabled",
+    "rows",
+    "size",
+    "variant"
+  ]);
+  q(e, !1);
+  const r = c(), l = c(), x = c(), f = c();
+  let b = t(e, "value", 12, ""), w = t(e, "label", 8, ""), p = t(e, "placeholder", 8, ""), m = t(e, "disabled", 8, !1), y = t(e, "rows", 8, 4), _ = t(e, "size", 8, "md"), g = t(e, "variant", 8, "default");
+  const v = `textarea-${Math.random().toString(36).substr(2, 9)}`;
+  function j(h) {
+    const o = h.target;
+    b(o.value);
+  }
+  d(() => {
+  }, () => {
+    u(r, {
+      sm: "px-3 py-1.5 text-sm",
+      md: "px-4 py-2 text-sm",
+      lg: "px-5 py-3 text-base"
+    });
+  }), d(() => z(g()), () => {
+    u(l, Q(g()));
+  }), d(
+    () => (n(r), z(_()), n(l)),
+    () => {
+      u(x, [
+        "w-full rounded-md transition-colors duration-200",
+        "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-surface",
+        "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-surface-disabled",
+        "resize-y",
+        n(r)[_()],
+        n(l)
+      ].join(" "));
+    }
+  ), d(() => {
+  }, () => {
+    u(f, "block text-sm font-medium text-primary mb-1");
+  }), P(), S();
+  var V = te(), B = I(V);
+  {
+    var D = (h) => {
+      var o = ee(), E = I(o);
+      H(() => {
+        J(o, "for", v), L(o, 1, O(n(f))), K(E, w());
+      }), k(h, o);
+    };
+    $(B, (h) => {
+      w() && h(D);
+    });
+  }
+  var N = G(B, 2);
+  A(N, () => ({
+    id: v,
+    value: b(),
+    placeholder: p(),
+    disabled: m(),
+    rows: y(),
+    class: n(x),
+    ...i
+  })), F("input", N, j), k(a, V), T();
+}
+var ae = M('<label class="text-sm font-medium cursor-pointer"> </label>'), se = M('<div class="flex items-center gap-2"><input/> <!></div>');
+function fe(a, e) {
+  const s = C(e, ["children", "$$slots", "$$events", "$$legacy"]), i = C(s, ["checked", "disabled", "label"]);
+  q(e, !1);
+  const r = c();
+  let l = t(e, "checked", 12, !1), x = t(e, "disabled", 8, !1), f = t(e, "label", 8, "");
+  const b = `checkbox-${Math.random().toString(36).substr(2, 9)}`;
+  function w(g) {
+    const v = g.target;
+    l(v.checked);
+  }
+  d(() => {
+  }, () => {
+    u(r, [
+      "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded",
+      "focus:ring-blue-500 focus:ring-2",
+      "disabled:opacity-50 disabled:cursor-not-allowed"
+    ].join(" "));
+  }), P(), S();
+  var p = se(), m = I(p);
+  A(
+    m,
+    () => ({
+      type: "checkbox",
+      id: b,
+      checked: l(),
+      disabled: x(),
+      class: n(r),
+      ...i
+    }),
+    void 0,
+    void 0,
+    void 0,
+    !0
+  );
+  var y = G(m, 2);
+  {
+    var _ = (g) => {
+      var v = ae(), j = I(v);
+      H(() => {
+        J(v, "for", b), K(j, f());
+      }), k(g, v);
+    };
+    $(y, (g) => {
+      f() && g(_);
+    });
+  }
+  F("change", m, w), k(a, p), T();
+}
+export {
+  le as B,
+  fe as C,
+  ce as I,
+  ue as T,
+  ie as a,
+  R as b,
+  oe as c,
+  de as d,
+  ne as e,
+  Q as g
+};

package/dist/{OptimizedImage-8a380fXi.js → OptimizedImage-D-eQavox.js}

@@ -1,5 +1,5 @@
 import { l as k, p as s, z as A, A as W, i as V, f as b, b as j, a as S, q as de, e as ee, c as i, d as q, g as D, x as B, k as t, j as X, m as I, h as v, o as R, t as T, v as Z, n as Y, w as G, u as ne, B as ve, r as fe, s as H, C as L, D as O, E as me } from "./props-B4BdFk2B.js";
-import { a as ge, e as he } from "./Checkbox-Dwvh3lCd.js";
+import { a as ge, e as he } from "./Checkbox-Dzsjjsfr.js";
 import "svelte";
 var pe = b('<label class="block text-sm font-medium text-gray-700 mb-1"> </label>'), _e = b("<option disabled> </option>"), xe = b("<option> </option>"), ye = b("<div><!> <select><!><!></select></div>");
 function Ue(z, e) {

package/dist/atoms/index.js

@@ -1,5 +1,5 @@
-import { B as s, C as o, a as r, H as t, O as T, P as g, S as l, b as m, T as p, c as d, d as i } from "../OptimizedImage-8a380fXi.js";
-import { B as C, C as c, I as n, T as B } from "../Checkbox-Dwvh3lCd.js";
+import { B as s, C as o, a as r, H as t, O as T, P as g, S as l, b as m, T as p, c as d, d as i } from "../OptimizedImage-D-eQavox.js";
+import { B as C, C as c, I as n, T as B } from "../Checkbox-Dzsjjsfr.js";
 import { T as k } from "../ThemeToggle-Cm25ThjX.js";
 export {
   s as Badge,

package/dist/index/index.js

@@ -1,5 +1,5 @@
-import { B as g, C as m, I as d, T as c, d as p, c as C, a as x, g as T, b as f } from "../Checkbox-Dwvh3lCd.js";
-import { B as b, C as I, a as B, H as S, O as V, P as D, S as F, b as h, T as k, c as v, d as M } from "../OptimizedImage-8a380fXi.js";
+import { B as g, C as m, I as d, T as c, d as p, c as C, a as x, g as T, b as f } from "../Checkbox-Dzsjjsfr.js";
+import { B as b, C as I, a as B, H as S, O as V, P as D, S as F, b as h, T as k, c as v, d as M } from "../OptimizedImage-D-eQavox.js";
 import { T as O } from "../ThemeToggle-Cm25ThjX.js";
 import { Alert as R, ContactForm as $, Dropdown as j, Form as w, ImageUpload as A, Layout as E, Modal as H, SlideUp as U, Tabs as q } from "../molecules/index.js";
 import { N as z, a as L } from "../Navigation-BxP-osMQ.js";

package/dist/molecules/index.js

@@ -1,5 +1,5 @@
 import { t as T, F as ie, G as le, H as de, I as ce, J as Y, y as ve, K as ue, w as E, L as fe, S as me, l as F, p as w, i as oe, f as z, a as ee, s as N, e as S, c as m, d as V, g as W, h as a, z as H, A as se, b as O, x as P, k as f, m as A, o as U, D, j as y, C as G, M as be, n as R, v as J, q as ge, r as pe, u as te, N as X, O as K } from "../props-B4BdFk2B.js";
-import { e as ne, B as Z, I as ae, T as xe, C as he } from "../Checkbox-Dwvh3lCd.js";
+import { e as ne, B as Z, I as ae, T as xe, C as he } from "../Checkbox-Dzsjjsfr.js";
 function we(n, e, s = !1, t = !1, v = !1) {
   var r = n, g = "";
   T(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zabi-components",
-  "version": "2.1.1",
+  "version": "2.2.0",
   "description": "A modern SvelteKit component library with TypeScript and Tailwind CSS",
   "type": "module",
   "main": "dist/index/index.js",
@@ -95,5 +95,6 @@
       "optional": true
     }
   },
-  "svelte": "./dist/index/index.js"
+  "svelte": "./dist/index/index.js",
+  "ssr": true
 }

package/dist/Checkbox-Dwvh3lCd.js

@@ -1,302 +0,0 @@
-import { y as U, l as _, p as a, z as d, A as B, i as $, f as I, a as A, s as W, c as z, d as T, g as q, x as M, k as r, m as c, h as k, o as u, b as R, e as F, j as G, t as H, v as J, u as L, B as O, n as K } from "./props-B4BdFk2B.js";
-function re(t, e) {
-  U(() => {
-    var s = t.getRootNode(), i = (
-      /** @type {ShadowRoot} */
-      s.host ? (
-        /** @type {ShadowRoot} */
-        s
-      ) : (
-        /** @type {Document} */
-        s.head ?? /** @type {Document} */
-        s.ownerDocument.head
-      )
-    );
-    if (!i.querySelector("#" + e.hash)) {
-      const l = document.createElement("style");
-      l.id = e.hash, l.textContent = e.code, i.appendChild(l);
-    }
-  });
-}
-var X = I("<button><!></button>");
-function ne(t, e) {
-  const s = _(e, ["children", "$$slots", "$$events", "$$legacy"]), i = _(s, ["variant", "size", "disabled", "type"]);
-  q(e, !1);
-  const l = c(), n = c(), h = c();
-  let b = a(e, "variant", 8, "primary"), f = a(e, "size", 8, "md"), y = a(e, "disabled", 8, !1), p = a(e, "type", 8, "button");
-  d(() => {
-  }, () => {
-    u(l, {
-      sm: "px-3 py-1.5 text-sm",
-      md: "px-4 py-2 text-sm",
-      lg: "px-5 py-3 text-base"
-    });
-  }), d(() => {
-  }, () => {
-    u(n, {
-      primary: "bg-blue-600 text-white hover:bg-blue-700",
-      secondary: "bg-gray-600 text-white hover:bg-gray-700",
-      danger: "bg-red-600 text-white hover:bg-red-700"
-    });
-  }), d(
-    () => (r(l), M(f()), r(n), M(b())),
-    () => {
-      u(h, [
-        "inline-flex items-center justify-center font-medium rounded-md",
-        "disabled:opacity-50 disabled:cursor-not-allowed",
-        r(l)[f()],
-        r(n)[b()]
-      ].join(" "));
-    }
-  ), B(), $();
-  var v = X();
-  A(v, () => ({
-    type: p(),
-    class: r(h),
-    disabled: y(),
-    ...i
-  }));
-  var C = k(v);
-  W(C, e, "default", {}), z(t, v), T();
-}
-function Q(t) {
-  const e = {
-    default: "input-variant-default",
-    success: "input-variant-success",
-    warning: "input-variant-warning",
-    error: "input-variant-error",
-    info: "input-variant-info"
-  };
-  return e[t] || e.default;
-}
-function ie(t) {
-  const e = {
-    default: "card-variant-default",
-    success: "card-variant-success",
-    warning: "card-variant-warning",
-    error: "card-variant-error",
-    info: "card-variant-info"
-  };
-  return e[t] || e.default;
-}
-function N(t, e) {
-  const s = {
-    default: `variant-${e}-default`,
-    success: `variant-${e}-success`,
-    warning: `variant-${e}-warning`,
-    error: `variant-${e}-error`,
-    info: `variant-${e}-info`
-  };
-  return s[t] || s.default;
-}
-function oe(t) {
-  return {
-    border: N(t, "border"),
-    text: N(t, "text"),
-    bg: N(t, "bg")
-  };
-}
-function de(t, e) {
-  return t.reduce((s, i) => (s[i] = `${e}-${i}`, s), {});
-}
-var Y = I("<label> </label>"), Z = I("<div><!> <input/></div>");
-function ce(t, e) {
-  const s = _(e, ["children", "$$slots", "$$events", "$$legacy"]), i = _(s, [
-    "value",
-    "type",
-    "label",
-    "placeholder",
-    "disabled",
-    "size",
-    "variant"
-  ]);
-  q(e, !1);
-  const l = c(), n = c(), h = c(), b = c();
-  let f = a(e, "value", 12, ""), y = a(e, "type", 8, "text"), p = a(e, "label", 8, ""), v = a(e, "placeholder", 8, ""), C = a(e, "disabled", 8, !1), w = a(e, "size", 8, "md"), g = a(e, "variant", 8, "default");
-  const x = `input-${Math.random().toString(36).substr(2, 9)}`;
-  function j(m) {
-    const o = m.target;
-    f(o.value);
-  }
-  d(() => {
-  }, () => {
-    u(l, {
-      sm: "px-3 py-1.5 text-sm",
-      md: "px-4 py-2 text-sm",
-      lg: "px-5 py-3 text-base"
-    });
-  }), d(() => M(g()), () => {
-    u(n, Q(g()));
-  }), d(
-    () => (r(l), M(w()), r(n)),
-    () => {
-      u(h, [
-        "w-full rounded-md transition-colors duration-200",
-        "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-surface",
-        "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-surface-disabled",
-        r(l)[w()],
-        r(n)
-      ].join(" "));
-    }
-  ), d(() => {
-  }, () => {
-    u(b, "block text-sm font-medium text-primary mb-1");
-  }), B(), $();
-  var V = Z(), P = k(V);
-  {
-    var D = (m) => {
-      var o = Y(), E = k(o);
-      H(() => {
-        J(o, "for", x), L(o, 1, O(r(b))), K(E, p());
-      }), z(m, o);
-    };
-    R(P, (m) => {
-      p() && m(D);
-    });
-  }
-  var S = G(P, 2);
-  A(
-    S,
-    () => ({
-      id: x,
-      type: y(),
-      value: f(),
-      placeholder: v(),
-      disabled: C(),
-      class: r(h),
-      ...i
-    }),
-    void 0,
-    void 0,
-    void 0,
-    !0
-  ), F("input", S, j), z(t, V), T();
-}
-var ee = I("<label> </label>"), te = I("<div><!> <textarea></textarea></div>");
-function ue(t, e) {
-  const s = _(e, ["children", "$$slots", "$$events", "$$legacy"]), i = _(s, [
-    "value",
-    "label",
-    "placeholder",
-    "disabled",
-    "rows",
-    "size",
-    "variant"
-  ]);
-  q(e, !1);
-  const l = c(), n = c(), h = c(), b = c();
-  let f = a(e, "value", 12, ""), y = a(e, "label", 8, ""), p = a(e, "placeholder", 8, ""), v = a(e, "disabled", 8, !1), C = a(e, "rows", 8, 4), w = a(e, "size", 8, "md"), g = a(e, "variant", 8, "default");
-  const x = `textarea-${Math.random().toString(36).substr(2, 9)}`;
-  function j(m) {
-    const o = m.target;
-    f(o.value);
-  }
-  d(() => {
-  }, () => {
-    u(l, {
-      sm: "px-3 py-1.5 text-sm",
-      md: "px-4 py-2 text-sm",
-      lg: "px-5 py-3 text-base"
-    });
-  }), d(() => M(g()), () => {
-    u(n, Q(g()));
-  }), d(
-    () => (r(l), M(w()), r(n)),
-    () => {
-      u(h, [
-        "w-full rounded-md transition-colors duration-200",
-        "focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-surface",
-        "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-surface-disabled",
-        "resize-y",
-        r(l)[w()],
-        r(n)
-      ].join(" "));
-    }
-  ), d(() => {
-  }, () => {
-    u(b, "block text-sm font-medium text-primary mb-1");
-  }), B(), $();
-  var V = te(), P = k(V);
-  {
-    var D = (m) => {
-      var o = ee(), E = k(o);
-      H(() => {
-        J(o, "for", x), L(o, 1, O(r(b))), K(E, y());
-      }), z(m, o);
-    };
-    R(P, (m) => {
-      y() && m(D);
-    });
-  }
-  var S = G(P, 2);
-  A(S, () => ({
-    id: x,
-    value: f(),
-    placeholder: p(),
-    disabled: v(),
-    rows: C(),
-    class: r(h),
-    ...i
-  })), F("input", S, j), z(t, V), T();
-}
-var ae = I('<label class="text-sm font-medium cursor-pointer"> </label>'), se = I('<div class="flex items-center gap-2"><input/> <!></div>');
-function be(t, e) {
-  const s = _(e, ["children", "$$slots", "$$events", "$$legacy"]), i = _(s, ["checked", "disabled", "label"]);
-  q(e, !1);
-  const l = c();
-  let n = a(e, "checked", 12, !1), h = a(e, "disabled", 8, !1), b = a(e, "label", 8, "");
-  const f = `checkbox-${Math.random().toString(36).substr(2, 9)}`;
-  function y(g) {
-    const x = g.target;
-    n(x.checked);
-  }
-  d(() => {
-  }, () => {
-    u(l, [
-      "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded",
-      "focus:ring-blue-500 focus:ring-2",
-      "disabled:opacity-50 disabled:cursor-not-allowed"
-    ].join(" "));
-  }), B(), $();
-  var p = se(), v = k(p);
-  A(
-    v,
-    () => ({
-      type: "checkbox",
-      id: f,
-      checked: n(),
-      disabled: h(),
-      class: r(l),
-      ...i
-    }),
-    void 0,
-    void 0,
-    void 0,
-    !0
-  );
-  var C = G(v, 2);
-  {
-    var w = (g) => {
-      var x = ae(), j = k(x);
-      H(() => {
-        J(x, "for", f), K(j, b());
-      }), z(g, x);
-    };
-    R(C, (g) => {
-      b() && g(w);
-    });
-  }
-  F("change", v, y), z(t, p), T();
-}
-export {
-  ne as B,
-  be as C,
-  ce as I,
-  ue as T,
-  ie as a,
-  N as b,
-  oe as c,
-  de as d,
-  re as e,
-  Q as g
-};