@konstructio/ui 0.1.2-alpha.78 → 0.1.2-alpha.79

package/dist/components/MultiSelectDropdown/contexts/MultiSelectDropdown.provider.js

@@ -1,137 +1,106 @@
-import { jsx as V } from "react/jsx-runtime";
-import { useRef as k, useState as R, useEffect as g, useCallback as S } from "react";
-import { MultiSelectDropdownContext as C } from "./MultiSelectDropdown.context.js";
-import { useToggle as E } from "../../../hooks/useToggle.js";
-const q = ({
-  children: x,
-  defaultOptions: r = [],
-  multiselect: i = !0,
-  value: f,
-  onChange: m,
-  onBlur: u,
-  name: h,
-  isLoading: b,
-  noOptionsText: j
-}) => {
-  const d = k(null), [w, I] = E(!1), [y, p] = R(r), [c, v] = R([]), o = f !== void 0;
-  g(() => {
-    if (!o) {
-      const n = new Set(
-        c.map((e) => e.id)
-      );
-      p(
-        i ? r.filter((e) => !n.has(e.id)) : r.map((e) => ({
-          ...e,
-          isSelected: n.has(e.id)
-        }))
-      );
+import { useToggle as V } from "../../../hooks/useToggle.js";
+import { MultiSelectDropdownContext as k } from "./MultiSelectDropdown.context.js";
+import { useCallback as f, useEffect as O, useRef as C, useState as R } from "react";
+import { jsx as E } from "react/jsx-runtime";
+var q = ({ children: g, defaultOptions: r = [], multiselect: c = !0, value: S, onChange: m, onBlur: u, name: h, isLoading: x, noOptionsText: b }) => {
+  const o = C(null), [v, I] = V(!1), [j, l] = R(r), [i, w] = R([]), d = S !== void 0;
+  O(() => {
+    if (!d) {
+      const t = new Set(i.map((e) => e.id));
+      l(c ? r.filter((e) => !t.has(e.id)) : r.map((e) => ({
+        ...e,
+        isSelected: t.has(e.id)
+      })));
     }
-  }, [r, i, o, c]), g(() => {
-    if (o) {
-      const n = f || [];
-      v(n);
-      const e = new Set(n.map((s) => s.id));
-      p(
-        i ? r.filter((s) => !e.has(s.id)) : r.map((s) => ({
-          ...s,
-          isSelected: e.has(s.id)
-        }))
-      );
+  }, [
+    r,
+    c,
+    d,
+    i
+  ]), O(() => {
+    if (d) {
+      const t = S || [];
+      w(t);
+      const e = new Set(t.map((s) => s.id));
+      l(c ? r.filter((s) => !e.has(s.id)) : r.map((s) => ({
+        ...s,
+        isSelected: e.has(s.id)
+      })));
     }
-  }, [f, o, r, i]);
-  const l = S(
-    (n) => {
-      const e = n.map(({ id: t, value: O, label: P }) => ({
-        id: t,
-        value: O ?? P
-      })), s = JSON.stringify(e);
-      d.current && (d.current.value = s), m && m({
-        target: {
-          value: n,
-          name: h ?? ""
-        }
-      });
-    },
-    [m, h]
-  ), a = S(
-    (n) => {
-      const e = w;
-      I(n), e && n === !1 && u && d.current && u({
-        target: d.current,
-        type: "blur"
-      });
-    },
-    [w, I, u, d]
-  ), D = S(
-    (n) => {
-      if (o) {
-        const t = [
-          ...i ? c : [],
-          n
-        ];
-        l(t), a(!1);
-        return;
-      }
-      const e = [
-        ...i ? c : [],
-        n
-      ];
-      v(e);
-      const s = e.map((t) => t.id);
-      p(() => i ? r.filter(
-        (t) => !s.includes(t.id)
-      ) : r.map((t) => ({
-        ...t,
-        isSelected: s.includes(t.id)
-      }))), l(e), a(!1);
-    },
-    [
-      r,
-      l,
-      i,
-      c,
-      a,
-      o
-    ]
-  ), M = S(
-    (n) => {
-      if (o) {
-        const t = c.filter(
-          (O) => O.id !== n.id
-        );
-        l(t);
-        return;
-      }
-      const e = c.filter(
-        (t) => t.id !== n.id
-      );
-      v(e);
-      const s = e.map((t) => t.id);
-      p(
-        () => r.filter(
-          (t) => !s.includes(t.id)
-        )
-      ), l(e);
-    },
-    [r, l, c, o]
-  );
-  return /* @__PURE__ */ V(
-    C.Provider,
-    {
-      value: {
-        options: y,
-        selectedOptions: c,
-        isOpen: w,
-        inputRef: d,
-        onSelectOption: D,
-        onRemoveOption: M,
-        onOpen: a,
-        isLoading: b,
-        noOptionsText: j
-      },
-      children: x
+  }, [
+    S,
+    d,
+    r,
+    c
+  ]);
+  const a = f((t) => {
+    const e = t.map(({ id: n, value: M, label: P }) => ({
+      id: n,
+      value: M ?? P
+    })), s = JSON.stringify(e);
+    o.current && (o.current.value = s), m && m({ target: {
+      value: t,
+      name: h ?? ""
+    } });
+  }, [m, h]), p = f((t) => {
+    const e = v;
+    I(t), e && t === !1 && u && o.current && u({
+      target: o.current,
+      type: "blur"
+    });
+  }, [
+    v,
+    I,
+    u,
+    o
+  ]), y = f((t) => {
+    if (d) {
+      a([...c ? i : [], t]), p(!1);
+      return;
+    }
+    const e = [...c ? i : [], t];
+    w(e);
+    const s = e.map((n) => n.id);
+    l(() => c ? r.filter((n) => !s.includes(n.id)) : r.map((n) => ({
+      ...n,
+      isSelected: s.includes(n.id)
+    }))), a(e), p(!1);
+  }, [
+    r,
+    a,
+    c,
+    i,
+    p,
+    d
+  ]), D = f((t) => {
+    if (d) {
+      a(i.filter((n) => n.id !== t.id));
+      return;
     }
-  );
+    const e = i.filter((n) => n.id !== t.id);
+    w(e);
+    const s = e.map((n) => n.id);
+    l(() => r.filter((n) => !s.includes(n.id))), a(e);
+  }, [
+    r,
+    a,
+    i,
+    d
+  ]);
+  return /* @__PURE__ */ E(k.Provider, {
+    value: {
+      options: j,
+      selectedOptions: i,
+      isOpen: v,
+      inputRef: o,
+      onSelectOption: y,
+      onRemoveOption: D,
+      onOpen: p,
+      isLoading: x,
+      noOptionsText: b
+    },
+    children: g
+  });
 };
 export {
   q as MultiSelectDropdownProvider

package/dist/components/MultiSelectDropdown/contexts/index.js

@@ -1,6 +1,6 @@
 import { useMultiSelectDropdown as r } from "./MultiSelectDropdown.hook.js";
-import { MultiSelectDropdownProvider as l } from "./MultiSelectDropdown.provider.js";
+import { MultiSelectDropdownProvider as t } from "./MultiSelectDropdown.provider.js";
 export {
-  l as MultiSelectDropdownProvider,
+  t as MultiSelectDropdownProvider,
   r as useMultiSelectDropdown
 };

package/dist/components/MultiSelectDropdown/hooks/useMultiSelectDropdown.js

@@ -1,30 +1,21 @@
-import { useRef as l, useEffect as c, useCallback as u } from "react";
-import { useMultiSelectDropdown as i } from "../contexts/MultiSelectDropdown.hook.js";
-const f = () => {
-  const n = l(null), { onOpen: e } = i();
-  c(() => {
-    const t = new AbortController(), a = (o) => {
+import { useMultiSelectDropdown as s } from "../contexts/MultiSelectDropdown.hook.js";
+import { useCallback as a, useEffect as u, useRef as c } from "react";
+var f = () => {
+  const n = c(null), { onOpen: e } = s();
+  return u(() => {
+    const t = new AbortController(), r = (o) => {
       o.key === "Escape" && e(!1);
-    }, r = (o) => {
+    }, l = (o) => {
       n.current?.contains(o.target) || e(!1);
     };
-    return document.addEventListener("keydown", a, {
-      signal: t.signal
-    }), document.addEventListener("mousedown", r, {
-      signal: t.signal
-    }), () => {
+    return document.addEventListener("keydown", r, { signal: t.signal }), document.addEventListener("mousedown", l, { signal: t.signal }), () => {
       t.abort();
     };
-  }, [e, n]);
-  const s = u(
-    (t) => {
-      t.target?.closest("[data-value]") || e(!0);
-    },
-    [e]
-  );
-  return {
+  }, [e, n]), {
     wrapperRef: n,
-    handleOpen: s
+    handleOpen: a((t) => {
+      t.target?.closest("[data-value]") || e(!0);
+    }, [e])
   };
 };
 export {

package/dist/components/PhoneNumberInput/PhoneNumberInput.js

@@ -1,8 +1,14 @@
+import { t as p } from "../../phone-number.provider-B5TfHi8y.js";
+import { t } from "../../Wrapper-BWSOaT1y.js";
+import { forwardRef as f } from "react";
 import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as p } from "react";
-import { PhoneNumberProvider as t } from "./contexts/phone-number.provider.js";
-import { Wrapper as f } from "./components/Wrapper.js";
-const u = p(({ defaultCountryCode: o = "US", ...m }, e) => /* @__PURE__ */ r(t, { defaultCountryCode: o, children: /* @__PURE__ */ r(f, { ref: e, ...m }) }));
+var h = f(({ defaultCountryCode: o = "US", ...m }, e) => /* @__PURE__ */ r(p, {
+  defaultCountryCode: o,
+  children: /* @__PURE__ */ r(t, {
+    ref: e,
+    ...m
+  })
+}));
 export {
-  u as PhoneNumberInput
+  h as PhoneNumberInput
 };

package/dist/components/PhoneNumberInput/PhoneNumberInput.variants.js

@@ -1,39 +1,32 @@
-import { c as r } from "../../index-D29mdTf5.js";
-const t = r(
-  [
-    "text-sm",
-    "relative",
-    "border",
-    "border-gray-300",
-    "rounded",
-    "data-[state=open]:border-aurora-500",
-    "focus-within:border-aurora-500",
-    "transition-colors",
-    "duration-150",
-    "dark:border-metal-700",
-    "dark:bg-metal-800",
-    "dark:data-[state=open]:border-metal-700",
-    "dark:focus-within:border-metal-700"
-  ],
-  {
-    variants: {
-      variant: {
-        default: [],
-        error: [
-          "border-red-600",
-          "dark:border-red-500",
-          "data-[state=open]:border-red-500",
-          "focus-within:border-red-500",
-          "pr-8",
-          "focus-visible:ring-transparent"
-        ]
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-), e = r([
+import { t as r } from "../../dist-DtEbXv47.js";
+var e = r([
+  "text-sm",
+  "relative",
+  "border",
+  "border-gray-300",
+  "rounded",
+  "data-[state=open]:border-aurora-500",
+  "focus-within:border-aurora-500",
+  "transition-colors",
+  "duration-150",
+  "dark:border-metal-700",
+  "dark:bg-metal-800",
+  "dark:data-[state=open]:border-metal-700",
+  "dark:focus-within:border-metal-700"
+], {
+  variants: { variant: {
+    default: [],
+    error: [
+      "border-red-600",
+      "dark:border-red-500",
+      "data-[state=open]:border-red-500",
+      "focus-within:border-red-500",
+      "pr-8",
+      "focus-visible:ring-transparent"
+    ]
+  } },
+  defaultVariants: { variant: "default" }
+}), t = r([
   "cursor-pointer",
   "text-sm",
   "leading-5",
@@ -41,6 +34,6 @@ const t = r(
   "dark:text-slate-50"
 ]);
 export {
-  e as labelVariants,
-  t as phoneNumberInputVariants
+  t as labelVariants,
+  e as phoneNumberInputVariants
 };

package/dist/components/PhoneNumberInput/components/FlagContent/FlagContent.js

@@ -1,35 +1,18 @@
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { cn as s } from "../../../../utils/index.js";
-import { C as l } from "../../../../chevron-up-IlDPxR7j.js";
-import { usePhoneNumberContext as c } from "../../contexts/phone-number.hook.js";
-const u = () => {
-  const { selectedCountry: o, isOpenSelector: t, handleOpenSelector: a } = c(), { flag: n } = o;
-  return /* @__PURE__ */ r(
-    "button",
-    {
-      type: "button",
-      className: "flex items-center gap-2 cursor-pointer",
-      onClick: () => a(!t),
-      children: [
-        /* @__PURE__ */ e(n, {}),
-        /* @__PURE__ */ e(
-          l,
-          {
-            className: s(
-              "transition-all",
-              "duration-100",
-              "data-[state=open]:rotate-0",
-              "data-[state=closed]:rotate-180",
-              "w-5",
-              "h-5",
-              "text-slate-400"
-            ),
-            "data-state": t ? "open" : "closed"
-          }
-        )
-      ]
-    }
-  );
+import { t as n } from "../../../../utils-DHuiYnx1.js";
+import { t as s } from "../../../../chevron-up-DuS9MUNr.js";
+import { usePhoneNumberContext as l } from "../../contexts/phone-number.hook.js";
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+var u = () => {
+  const { selectedCountry: o, isOpenSelector: t, handleOpenSelector: a } = l(), { flag: r } = o;
+  return /* @__PURE__ */ c("button", {
+    type: "button",
+    className: "flex items-center gap-2 cursor-pointer",
+    onClick: () => a(!t),
+    children: [/* @__PURE__ */ e(r, {}), /* @__PURE__ */ e(s, {
+      className: n("transition-all", "duration-100", "data-[state=open]:rotate-0", "data-[state=closed]:rotate-180", "w-5", "h-5", "text-slate-400"),
+      "data-state": t ? "open" : "closed"
+    })]
+  });
 };
 export {
   u as FlagContent