@arkyn/components 3.0.1-beta.155 → 3.0.1-beta.156

package/dist/modules/components/multiSelect/index.js

@@ -1,116 +1,155 @@
-import { useForm as e } from "../../hooks/useForm.js";
-import { IconRenderer as t } from "../../services/iconRenderer.js";
-import { FieldTemplate as n } from "../../services/fieldTemplate.js";
-import { MultiSelectChevron as r } from "./multiSelectChevron/index.js";
-import { MultiSelectContainer as i } from "./multiSelectContainer/index.js";
-import { MultiSelectContent as ee } from "./multiSelectContent/index.js";
-import { MultiSelectMark as te } from "./multiSelectMark/index.js";
-import { MultiSelectOption as a } from "./multiSelectOption/index.js";
-import { MultiSelectOptionsContainer as o } from "./multiSelectOptionsContainer/index.js";
-import { MultiSelectOverlay as s } from "./multiSelectOverlay/index.js";
-import { MultiSelectSpinner as c } from "./multiSelectSpinner/index.js";
-import { useId as l, useRef as u, useState as d } from "react";
-import { jsx as f, jsxs as p } from "react/jsx-runtime";
-//#region src/components/multiSelect/index.tsx
-function m(m) {
-	let { name: h, options: g, className: _ = "", placeholder: v = "Selecione...", closeOnSelect: y = !1, defaultValue: b = [], errorMessage: ne, isLoading: x = !1, readOnly: S = !1, isSearchable: re = !1, id: ie, label: ae, optionMaxHeight: oe, showAsterisk: se, leftIcon: C, onSearch: w, onChange: T, onBlur: E, notFoundText: D = "Sem opções disponíveis", onFocus: O, disabled: k = !1, prefix: A, size: j = "md", value: M, variant: N = "solid", unShowFieldTemplate: P = !1, orientation: F = "vertical" } = m, { fieldErrors: I } = e(), L = u(null), R = ie || l(), z = ne || I?.[h], B = !!z, V = k || x || S, H = {
-		md: 20,
-		lg: 20
-	}[j], [U, W] = d(""), [G, K] = d(!1), [q, J] = d(b), Y = M || q;
-	function X(e) {
-		return Y.includes(e);
-	}
-	function ce(e) {
-		return g.find((t) => t.value === e)?.label || "";
-	}
-	function le() {
-		V || !L?.current || G || (K(!0), L.current.focus(), O && O());
-	}
-	function Z() {
-		K(!1), E && L.current && L.current.blur();
-	}
-	function ue(e) {
-		W(e), w && w(e);
-	}
-	function Q(e) {
-		X(e) ? (J(q.filter((t) => t !== e)), T && T(q.filter((t) => t !== e))) : (J([...q, e]), T && T([...q, e])), y && Z();
-	}
-	let $ = g.filter((e) => !!(m.onSearch || !m.isSearchable || e.label.toLowerCase().includes(U.toLowerCase())));
-	return /* @__PURE__ */ f(n, {
-		name: h,
-		label: ae,
-		showAsterisk: se,
-		className: _,
-		errorMessage: z,
-		unShowFieldTemplate: P,
-		orientation: F,
-		children: /* @__PURE__ */ p(i, {
-			handleContainerFocus: le,
-			disabled: V,
-			isError: B,
-			isFocused: G,
-			isLoading: x,
-			readOnly: S,
-			size: j,
-			variant: N,
-			prefixExists: !!A,
-			id: R,
-			children: [
-				/* @__PURE__ */ f("input", {
-					ref: L,
-					name: h,
-					value: JSON.stringify(Y),
-					type: "hidden"
-				}),
-				/* @__PURE__ */ f(t, {
-					iconSize: H,
-					icon: A,
-					className: "prefix"
-				}),
-				C && /* @__PURE__ */ f(C, {
-					size: H,
-					strokeWidth: 2.5
-				}),
-				/* @__PURE__ */ p(ee, {
-					size: j,
-					children: [Y.map((e) => /* @__PURE__ */ f(te, {
-						label: ce(e),
-						value: e,
-						handleChangeValue: Q,
-						disabled: V
-					}, e)), Y.length <= 0 && /* @__PURE__ */ f("p", { children: v })]
-				}),
-				/* @__PURE__ */ p(o, {
-					isFocused: G,
-					isSearchable: re,
-					search: U,
-					onSearch: ue,
-					children: [$.map(({ label: e, value: t }) => /* @__PURE__ */ f(a, {
-						label: e,
-						value: t,
-						size: j,
-						handleChangeValue: Q,
-						optionHasSelected: X
-					}, t)), $.length <= 0 && /* @__PURE__ */ f("p", { children: D })]
-				}),
-				/* @__PURE__ */ f(r, {
-					disabled: V,
-					isFocused: G,
-					readOnly: S,
-					iconSize: H,
-					isLoading: x
-				}),
-				/* @__PURE__ */ f(c, {
-					iconSize: H,
-					isLoading: x
-				}),
-				/* @__PURE__ */ f(s, {
-					handleBlur: Z,
-					isFocused: G
-				})
-			]
-		})
-	});
+import { jsx as t, jsxs as S } from "react/jsx-runtime";
+import { useRef as ee, useId as te, useState as b } from "react";
+import { useForm as re } from "../../hooks/useForm.js";
+import { FieldTemplate as ne } from "../../services/fieldTemplate.js";
+import { IconRenderer as ie } from "../../services/iconRenderer.js";
+import { MultiSelectChevron as oe } from "./multiSelectChevron/index.js";
+import { MultiSelectContainer as le } from "./multiSelectContainer/index.js";
+import { MultiSelectContent as se } from "./multiSelectContent/index.js";
+import { MultiSelectMark as ce } from "./multiSelectMark/index.js";
+import { MultiSelectOption as ae } from "./multiSelectOption/index.js";
+import { MultiSelectOptionsContainer as fe } from "./multiSelectOptionsContainer/index.js";
+import { MultiSelectOverlay as ue } from "./multiSelectOverlay/index.js";
+import { MultiSelectSpinner as de } from "./multiSelectSpinner/index.js";
+function Ne(d) {
+  const {
+    name: m,
+    options: M,
+    className: v = "",
+    placeholder: T = "Selecione...",
+    closeOnSelect: j = !1,
+    defaultValue: B = [],
+    errorMessage: E,
+    isLoading: l = !1,
+    readOnly: p = !1,
+    isSearchable: H = !1,
+    id: V,
+    label: A,
+    optionMaxHeight: me,
+    showAsterisk: D,
+    leftIcon: g,
+    onSearch: O,
+    onChange: s,
+    onBlur: J,
+    notFoundText: R = "Sem opções disponíveis",
+    onFocus: C,
+    disabled: W = !1,
+    prefix: x,
+    size: c = "md",
+    value: q,
+    variant: G = "solid",
+    unShowFieldTemplate: K = !1,
+    orientation: P = "vertical"
+  } = d, { fieldErrors: h } = re(), n = ee(null), Q = V || te(), F = E || (h == null ? void 0 : h[m]), U = !!F, a = W || l || p, f = { md: 20, lg: 20 }[c], [I, X] = b(""), [i, w] = b(!1), [o, z] = b(B), u = q || o;
+  function L(e) {
+    return u.includes(e);
+  }
+  function Y(e) {
+    const r = M.find(($) => $.value === e);
+    return (r == null ? void 0 : r.label) || "";
+  }
+  function Z() {
+    a || !(n != null && n.current) || i || (w(!0), n.current.focus(), C && C());
+  }
+  function N() {
+    w(!1), J && n.current && n.current.blur();
+  }
+  function _(e) {
+    X(e), O && O(e);
+  }
+  function y(e) {
+    L(e) ? (z(o.filter((r) => r !== e)), s && s(o.filter((r) => r !== e))) : (z([...o, e]), s && s([...o, e])), j && N();
+  }
+  const k = M.filter((e) => !!(d.onSearch || !d.isSearchable || e.label.toLowerCase().includes(I.toLowerCase())));
+  return /* @__PURE__ */ t(
+    ne,
+    {
+      name: m,
+      label: A,
+      showAsterisk: D,
+      className: v,
+      errorMessage: F,
+      unShowFieldTemplate: K,
+      orientation: P,
+      children: /* @__PURE__ */ S(
+        le,
+        {
+          handleContainerFocus: Z,
+          disabled: a,
+          isError: U,
+          isFocused: i,
+          isLoading: l,
+          readOnly: p,
+          size: c,
+          variant: G,
+          prefixExists: !!x,
+          id: Q,
+          children: [
+            /* @__PURE__ */ t(
+              "input",
+              {
+                ref: n,
+                name: m,
+                value: JSON.stringify(u),
+                type: "hidden"
+              }
+            ),
+            /* @__PURE__ */ t(ie, { iconSize: f, icon: x, className: "prefix" }),
+            g && /* @__PURE__ */ t(g, { size: f, strokeWidth: 2.5 }),
+            /* @__PURE__ */ S(se, { size: c, children: [
+              u.map((e) => /* @__PURE__ */ t(
+                ce,
+                {
+                  label: Y(e),
+                  value: e,
+                  handleChangeValue: y,
+                  disabled: a
+                },
+                e
+              )),
+              u.length <= 0 && /* @__PURE__ */ t("p", { children: T })
+            ] }),
+            /* @__PURE__ */ S(
+              fe,
+              {
+                isFocused: i,
+                isSearchable: H,
+                search: I,
+                onSearch: _,
+                children: [
+                  k.map(({ label: e, value: r }) => /* @__PURE__ */ t(
+                    ae,
+                    {
+                      label: e,
+                      value: r,
+                      size: c,
+                      handleChangeValue: y,
+                      optionHasSelected: L
+                    },
+                    r
+                  )),
+                  k.length <= 0 && /* @__PURE__ */ t("p", { children: R })
+                ]
+              }
+            ),
+            /* @__PURE__ */ t(
+              oe,
+              {
+                disabled: a,
+                isFocused: i,
+                readOnly: p,
+                iconSize: f,
+                isLoading: l
+              }
+            ),
+            /* @__PURE__ */ t(de, { iconSize: f, isLoading: l }),
+            /* @__PURE__ */ t(ue, { handleBlur: N, isFocused: i })
+          ]
+        }
+      )
+    }
+  );
 }
-//#endregion
-export { m as MultiSelect };
+export {
+  Ne as MultiSelect
+};

package/dist/modules/components/multiSelect/multiSelectChevron/index.js

@@ -1,19 +1,22 @@
-/* empty css       */
-import { Fragment as e, jsx as t } from "react/jsx-runtime";
-import { ChevronDown as n } from "lucide-react";
-//#region src/components/multiSelect/multiSelectChevron/index.tsx
-function r(r) {
-	let { iconSize: i, isLoading: a, disabled: o, readOnly: s, isFocused: c } = r;
-	return a ? /* @__PURE__ */ t(e, {}) : /* @__PURE__ */ t(n, {
-		className: `arkynMultiSelectChevron ${o || s ? "notAnimate" : ""} ${c ? "focused" : ""}`,
-		strokeWidth: 2.5,
-		style: {
-			minWidth: i,
-			minHeight: i,
-			maxWidth: i,
-			maxHeight: i
-		}
-	});
+import { jsx as e, Fragment as c } from "react/jsx-runtime";
+import { ChevronDown as a } from "lucide-react";
+/* empty css           */
+function g(n) {
+  const { iconSize: t, isLoading: o, disabled: i, readOnly: r, isFocused: s } = n, m = `arkynMultiSelectChevron ${i || r ? "notAnimate" : ""} ${s ? "focused" : ""}`;
+  return o ? /* @__PURE__ */ e(c, {}) : /* @__PURE__ */ e(
+    a,
+    {
+      className: m,
+      strokeWidth: 2.5,
+      style: {
+        minWidth: t,
+        minHeight: t,
+        maxWidth: t,
+        maxHeight: t
+      }
+    }
+  );
 }
-//#endregion
-export { r as MultiSelectChevron };
+export {
+  g as MultiSelectChevron
+};

package/dist/modules/components/multiSelect/multiSelectContainer/index.js

@@ -1,14 +1,30 @@
-/* empty css       */
-import { jsx as e } from "react/jsx-runtime";
-//#region src/components/multiSelect/multiSelectContainer/index.tsx
-function t(t) {
-	let { children: n, handleContainerFocus: r, disabled: i, isError: a, isLoading: o, isFocused: s, className: c, readOnly: l, variant: u, size: d, id: f, prefixExists: p } = t;
-	return /* @__PURE__ */ e("section", {
-		id: f,
-		className: `arkynMultiSelectContainer ${p ? "hasPrefix" : ""} ${u} ${d} ${i || l || o ? "opacity" : ""} ${a ? "errored" : ""} ${s ? "focused" : ""} ${c}`,
-		onClick: r,
-		children: n
-	});
+import { jsx as p } from "react/jsx-runtime";
+/* empty css           */
+function P(e) {
+  const {
+    children: r,
+    handleContainerFocus: o,
+    disabled: i,
+    isError: s,
+    isLoading: t,
+    isFocused: n,
+    className: c,
+    readOnly: a,
+    variant: d,
+    size: l,
+    id: f,
+    prefixExists: u
+  } = e;
+  return /* @__PURE__ */ p(
+    "section",
+    {
+      id: f,
+      className: `arkynMultiSelectContainer ${u ? "hasPrefix" : ""} ${d} ${l} ${i || a || t ? "opacity" : ""} ${s ? "errored" : ""} ${n ? "focused" : ""} ${c}`,
+      onClick: o,
+      children: r
+    }
+  );
 }
-//#endregion
-export { t as MultiSelectContainer };
+export {
+  P as MultiSelectContainer
+};

package/dist/modules/components/multiSelect/multiSelectContent/index.js

@@ -1,12 +1,9 @@
-/* empty css       */
-import { jsx as e } from "react/jsx-runtime";
-//#region src/components/multiSelect/multiSelectContent/index.tsx
-function t(t) {
-	let { children: n, size: r } = t;
-	return /* @__PURE__ */ e("div", {
-		className: `arkynMultiSelectContent ${r}`,
-		children: n
-	});
+import { jsx as i } from "react/jsx-runtime";
+/* empty css           */
+function l(t) {
+  const { children: e, size: n } = t, o = `arkynMultiSelectContent ${n}`;
+  return /* @__PURE__ */ i("div", { className: o, children: e });
 }
-//#endregion
-export { t as MultiSelectContent };
+export {
+  l as MultiSelectContent
+};

package/dist/modules/components/multiSelect/multiSelectMark/index.js

@@ -1,20 +1,23 @@
-/* empty css       */
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { X as n } from "lucide-react";
-//#region src/components/multiSelect/multiSelectMark/index.tsx
-function r(r) {
-	let { label: i, value: a, disabled: o, handleChangeValue: s } = r;
-	return /* @__PURE__ */ t("div", {
-		className: "arkynMultiSelectMark",
-		children: [i, /* @__PURE__ */ e("button", {
-			disabled: o,
-			type: "button",
-			onClick: (e) => {
-				e.stopPropagation(), s(a);
-			},
-			children: /* @__PURE__ */ e(n, {})
-		})]
-	});
+import { jsxs as i, jsx as t } from "react/jsx-runtime";
+import { X as c } from "lucide-react";
+/* empty css           */
+function d(e) {
+  const { label: l, value: o, disabled: r, handleChangeValue: a } = e;
+  return /* @__PURE__ */ i("div", { className: "arkynMultiSelectMark", children: [
+    l,
+    /* @__PURE__ */ t(
+      "button",
+      {
+        disabled: r,
+        type: "button",
+        onClick: (n) => {
+          n.stopPropagation(), a(o);
+        },
+        children: /* @__PURE__ */ t(c, {})
+      }
+    )
+  ] });
 }
-//#endregion
-export { r as MultiSelectMark };
+export {
+  d as MultiSelectMark
+};

package/dist/modules/components/multiSelect/multiSelectOption/index.js

@@ -1,18 +1,14 @@
-/* empty css       */
-import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { Check as n } from "lucide-react";
-//#region src/components/multiSelect/multiSelectOption/index.tsx
-function r(r) {
-	let { label: i, optionHasSelected: a, handleChangeValue: o, value: s, size: c } = r;
-	return /* @__PURE__ */ t("div", {
-		onClick: () => o(s),
-		className: `arkynMultiSelectOption ${c} ${a(s) ? "active" : ""}`,
-		children: [
-			i,
-			" ",
-			/* @__PURE__ */ e(n, {})
-		]
-	});
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import { Check as p } from "lucide-react";
+/* empty css           */
+function d(t) {
+  const { label: i, optionHasSelected: o, handleChangeValue: n, value: e, size: c } = t, l = o(e) ? "active" : "", a = `arkynMultiSelectOption ${c} ${l}`;
+  return /* @__PURE__ */ s("div", { onClick: () => n(e), className: a, children: [
+    i,
+    " ",
+    /* @__PURE__ */ r(p, {})
+  ] });
 }
-//#endregion
-export { r as MultiSelectOption };
+export {
+  d as MultiSelectOption
+};

package/dist/modules/components/multiSelect/multiSelectOptionsContainer/index.js

@@ -1,36 +1,46 @@
-import { useScrollLock as e } from "../../../hooks/useScrollLock.js";
-import { Input as t } from "../../input/index.js";
-/* empty css       */
-import { useEffect as n, useRef as r, useState as i } from "react";
-import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Search as c } from "lucide-react";
-//#region src/components/multiSelect/multiSelectOptionsContainer/index.tsx
-function l(l) {
-	let { children: u, isFocused: d, isSearchable: f, search: p, onSearch: m } = l, h = r(null), [g, _] = i("bottom");
-	e(d), n(() => {
-		d && (() => {
-			if (!h.current) return;
-			let e = h.current.parentElement;
-			if (!e) return;
-			let t = e.getBoundingClientRect();
-			window.innerHeight - t.bottom < 300 && t.top > 300 ? _("top") : _("bottom");
-		})();
-	}, [d]);
-	function v(e) {
-		f && m(e.target.value);
-	}
-	return d ? /* @__PURE__ */ s("div", {
-		ref: h,
-		className: `arkynMultiSelectOptionsContainer ${g}`,
-		children: [f && /* @__PURE__ */ o(t, {
-			type: "search",
-			name: "search-select",
-			variant: "underline",
-			leftIcon: c,
-			value: p,
-			onChange: v
-		}), u]
-	}) : /* @__PURE__ */ o(a, {});
+import { jsx as a, Fragment as g, jsxs as S } from "react/jsx-runtime";
+import { Search as C } from "lucide-react";
+import { useRef as v, useState as w, useEffect as b } from "react";
+import { useScrollLock as k } from "../../../hooks/useScrollLock.js";
+import { Input as R } from "../../input/index.js";
+/* empty css           */
+function F(l) {
+  const { children: u, isFocused: e, isSearchable: n, search: m, onSearch: p } = l, t = v(null), [f, o] = w("bottom");
+  k(e), b(() => {
+    if (!e) return;
+    (() => {
+      if (!t.current) return;
+      const i = t.current.parentElement;
+      if (!i) return;
+      const c = i.getBoundingClientRect(), d = window.innerHeight, s = 300;
+      d - c.bottom < s && c.top > s ? o("top") : o("bottom");
+    })();
+  }, [e]);
+  function h(r) {
+    n && p(r.target.value);
+  }
+  return e ? /* @__PURE__ */ S(
+    "div",
+    {
+      ref: t,
+      className: `arkynMultiSelectOptionsContainer ${f}`,
+      children: [
+        n && /* @__PURE__ */ a(
+          R,
+          {
+            type: "search",
+            name: "search-select",
+            variant: "underline",
+            leftIcon: C,
+            value: m,
+            onChange: h
+          }
+        ),
+        u
+      ]
+    }
+  ) : /* @__PURE__ */ a(g, {});
 }
-//#endregion
-export { l as MultiSelectOptionsContainer };
+export {
+  F as MultiSelectOptionsContainer
+};

package/dist/modules/components/multiSelect/multiSelectOverlay/index.js

@@ -1,12 +1,9 @@
-/* empty css       */
-import { Fragment as e, jsx as t } from "react/jsx-runtime";
-//#region src/components/multiSelect/multiSelectOverlay/index.tsx
-function n(n) {
-	let { isFocused: r, handleBlur: i } = n;
-	return r ? /* @__PURE__ */ t("aside", {
-		className: "arkynMultiSelectOverlay",
-		onClick: i
-	}) : /* @__PURE__ */ t(e, {});
+import { jsx as e, Fragment as i } from "react/jsx-runtime";
+/* empty css           */
+function o(r) {
+  const { isFocused: t, handleBlur: l } = r;
+  return t ? /* @__PURE__ */ e("aside", { className: "arkynMultiSelectOverlay", onClick: l }) : /* @__PURE__ */ e(i, {});
 }
-//#endregion
-export { n as MultiSelectOverlay };
+export {
+  o as MultiSelectOverlay
+};

package/dist/modules/components/multiSelect/multiSelectSpinner/index.js

@@ -1,14 +1,17 @@
-/* empty css       */
-import { Fragment as e, jsx as t } from "react/jsx-runtime";
-import { Loader2 as n } from "lucide-react";
-//#region src/components/multiSelect/multiSelectSpinner/index.tsx
-function r(r) {
-	let { iconSize: i, isLoading: a } = r;
-	return a ? /* @__PURE__ */ t(n, {
-		className: "arkynMultiSelectSpinner",
-		size: i,
-		strokeWidth: 2.5
-	}) : /* @__PURE__ */ t(e, {});
+import { jsx as r, Fragment as n } from "react/jsx-runtime";
+import { Loader2 as o } from "lucide-react";
+/* empty css           */
+function c(e) {
+  const { iconSize: i, isLoading: t } = e;
+  return t ? /* @__PURE__ */ r(
+    o,
+    {
+      className: "arkynMultiSelectSpinner",
+      size: i,
+      strokeWidth: 2.5
+    }
+  ) : /* @__PURE__ */ r(n, {});
 }
-//#endregion
-export { r as MultiSelectSpinner };
+export {
+  c as MultiSelectSpinner
+};

package/dist/modules/components/pagination/chevronButton/index.js

@@ -1,18 +1,18 @@
-/* empty css       */
-import { jsx as e } from "react/jsx-runtime";
-import { ChevronLeft as t, ChevronRight as n } from "lucide-react";
-//#region src/components/pagination/chevronButton/index.tsx
-function r(r) {
-	let { orientation: i, handlePageChange: a, disabled: o } = r;
-	return /* @__PURE__ */ e("button", {
-		className: "arkynChevronPageButton",
-		disabled: o,
-		onClick: a,
-		children: {
-			left: /* @__PURE__ */ e(t, {}),
-			right: /* @__PURE__ */ e(n, {})
-		}[i]
-	});
+import { jsx as n } from "react/jsx-runtime";
+import { ChevronRight as i, ChevronLeft as a } from "lucide-react";
+/* empty css           */
+function s(o) {
+  const { orientation: t, handlePageChange: e, disabled: r } = o;
+  return /* @__PURE__ */ n(
+    "button",
+    {
+      className: "arkynChevronPageButton",
+      disabled: r,
+      onClick: e,
+      children: { left: /* @__PURE__ */ n(a, {}), right: /* @__PURE__ */ n(i, {}) }[t]
+    }
+  );
 }
-//#endregion
-export { r as ChevronButton };
+export {
+  s as ChevronButton
+};