naria-ui 0.1.37 → 0.1.38

package/dist/naria-ui.es.js

@@ -1,6 +1,6 @@
-import * as $ from "react";
-import oe, { useState as y, useEffect as S } from "react";
-var L = { exports: {} }, C = {};
+import * as z from "react";
+import ie, { useState as N, useEffect as b, useRef as ee } from "react";
+var G = { exports: {} }, H = {};
 /**
  * @license React
  * react-jsx-runtime.production.js
@@ -10,29 +10,29 @@ var L = { exports: {} }, C = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var Q;
-function ae() {
-  if (Q) return C;
-  Q = 1;
+var re;
+function le() {
+  if (re) return H;
+  re = 1;
   var t = Symbol.for("react.transitional.element"), s = Symbol.for("react.fragment");
-  function i(v, c, l) {
-    var w = null;
-    if (l !== void 0 && (w = "" + l), c.key !== void 0 && (w = "" + c.key), "key" in c) {
-      l = {};
-      for (var f in c)
-        f !== "key" && (l[f] = c[f]);
-    } else l = c;
-    return c = l.ref, {
+  function c(g, o, u) {
+    var h = null;
+    if (u !== void 0 && (h = "" + u), o.key !== void 0 && (h = "" + o.key), "key" in o) {
+      u = {};
+      for (var d in o)
+        d !== "key" && (u[d] = o[d]);
+    } else u = o;
+    return o = u.ref, {
       $$typeof: t,
-      type: v,
-      key: w,
-      ref: c !== void 0 ? c : null,
-      props: l
+      type: g,
+      key: h,
+      ref: o !== void 0 ? o : null,
+      props: u
     };
   }
-  return C.Fragment = s, C.jsx = i, C.jsxs = i, C;
+  return H.Fragment = s, H.jsx = c, H.jsxs = c, H;
 }
-var N = {};
+var J = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -42,47 +42,47 @@ var N = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var K;
-function se() {
-  return K || (K = 1, process.env.NODE_ENV !== "production" && function() {
+var te;
+function ue() {
+  return te || (te = 1, process.env.NODE_ENV !== "production" && function() {
     function t(e) {
       if (e == null) return null;
       if (typeof e == "function")
-        return e.$$typeof === re ? null : e.displayName || e.name || null;
+        return e.$$typeof === v ? null : e.displayName || e.name || null;
       if (typeof e == "string") return e;
       switch (e) {
-        case R:
+        case A:
           return "Fragment";
-        case k:
+        case O:
           return "Profiler";
-        case h:
+        case C:
           return "StrictMode";
-        case I:
+        case F:
           return "Suspense";
-        case W:
+        case S:
           return "SuspenseList";
-        case q:
+        case k:
           return "Activity";
       }
       if (typeof e == "object")
         switch (typeof e.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), e.$$typeof) {
-          case Y:
+          case L:
             return "Portal";
-          case P:
+          case Y:
             return (e.displayName || "Context") + ".Provider";
-          case T:
+          case X:
             return (e._context.displayName || "Context") + ".Consumer";
-          case _:
-            var r = e.render;
-            return e = e.displayName, e || (e = r.displayName || r.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case F:
-            return r = e.displayName || null, r !== null ? r : t(e.type) || "Memo";
-          case a:
-            r = e._payload, e = e._init;
+          case l:
+            var n = e.render;
+            return e = e.displayName, e || (e = n.displayName || n.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case T:
+            return n = e.displayName || null, n !== null ? n : t(e.type) || "Memo";
+          case M:
+            n = e._payload, e = e._init;
             try {
-              return t(e(r));
+              return t(e(n));
             } catch {
             }
         }
@@ -91,76 +91,76 @@ function se() {
     function s(e) {
       return "" + e;
     }
-    function i(e) {
+    function c(e) {
       try {
         s(e);
-        var r = !1;
+        var n = !1;
       } catch {
-        r = !0;
+        n = !0;
       }
-      if (r) {
-        r = console;
-        var o = r.error, u = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return o.call(
-          r,
+      if (n) {
+        n = console;
+        var r = n.error, i = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return r.call(
+          n,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          u
+          i
         ), s(e);
       }
     }
-    function v(e) {
-      if (e === R) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === a)
+    function g(e) {
+      if (e === A) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === M)
         return "<...>";
       try {
-        var r = t(e);
-        return r ? "<" + r + ">" : "<...>";
+        var n = t(e);
+        return n ? "<" + n + ">" : "<...>";
       } catch {
         return "<...>";
       }
     }
-    function c() {
-      var e = z.A;
+    function o() {
+      var e = P.A;
       return e === null ? null : e.getOwner();
     }
-    function l() {
+    function u() {
       return Error("react-stack-top-frame");
     }
-    function w(e) {
-      if (V.call(e, "key")) {
-        var r = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (r && r.isReactWarning) return !1;
+    function h(e) {
+      if (x.call(e, "key")) {
+        var n = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (n && n.isReactWarning) return !1;
       }
       return e.key !== void 0;
     }
-    function f(e, r) {
-      function o() {
-        B || (B = !0, console.error(
+    function d(e, n) {
+      function r() {
+        D || (D = !0, console.error(
           "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          r
+          n
         ));
       }
-      o.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: o,
+      r.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: r,
         configurable: !0
       });
     }
-    function A() {
+    function E() {
       var e = t(this.type);
-      return G[e] || (G[e] = !0, console.error(
+      return $[e] || ($[e] = !0, console.error(
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), e = this.props.ref, e !== void 0 ? e : null;
     }
-    function E(e, r, o, u, x, p, M, U) {
-      return o = p.ref, e = {
-        $$typeof: O,
+    function m(e, n, r, i, p, R, Z, Q) {
+      return r = R.ref, e = {
+        $$typeof: y,
         type: e,
-        key: r,
-        props: p,
-        _owner: x
-      }, (o !== void 0 ? o : null) !== null ? Object.defineProperty(e, "ref", {
+        key: n,
+        props: R,
+        _owner: p
+      }, (r !== void 0 ? r : null) !== null ? Object.defineProperty(e, "ref", {
         enumerable: !1,
-        get: A
+        get: E
       }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
         configurable: !1,
         enumerable: !1,
@@ -175,167 +175,168 @@ function se() {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: M
+        value: Z
       }), Object.defineProperty(e, "_debugTask", {
         configurable: !1,
         enumerable: !1,
         writable: !0,
-        value: U
+        value: Q
       }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
     }
-    function g(e, r, o, u, x, p, M, U) {
-      var d = r.children;
-      if (d !== void 0)
-        if (u)
-          if (te(d)) {
-            for (u = 0; u < d.length; u++)
-              b(d[u]);
-            Object.freeze && Object.freeze(d);
+    function W(e, n, r, i, p, R, Z, Q) {
+      var f = n.children;
+      if (f !== void 0)
+        if (i)
+          if (q(f)) {
+            for (i = 0; i < f.length; i++)
+              w(f[i]);
+            Object.freeze && Object.freeze(f);
           } else
             console.error(
               "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
             );
-        else b(d);
-      if (V.call(r, "key")) {
-        d = t(e);
-        var j = Object.keys(r).filter(function(ne) {
-          return ne !== "key";
+        else w(f);
+      if (x.call(n, "key")) {
+        f = t(e);
+        var I = Object.keys(n).filter(function(ce) {
+          return ce !== "key";
         });
-        u = 0 < j.length ? "{key: someKey, " + j.join(": ..., ") + ": ...}" : "{key: someKey}", H[d + u] || (j = 0 < j.length ? "{" + j.join(": ..., ") + ": ...}" : "{}", console.error(
+        i = 0 < I.length ? "{key: someKey, " + I.join(": ..., ") + ": ...}" : "{key: someKey}", V[f + i] || (I = 0 < I.length ? "{" + I.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          u,
-          d,
-          j,
-          d
-        ), H[d + u] = !0);
+          i,
+          f,
+          I,
+          f
+        ), V[f + i] = !0);
       }
-      if (d = null, o !== void 0 && (i(o), d = "" + o), w(r) && (i(r.key), d = "" + r.key), "key" in r) {
-        o = {};
-        for (var J in r)
-          J !== "key" && (o[J] = r[J]);
-      } else o = r;
-      return d && f(
-        o,
+      if (f = null, r !== void 0 && (c(r), f = "" + r), h(n) && (c(n.key), f = "" + n.key), "key" in n) {
+        r = {};
+        for (var K in n)
+          K !== "key" && (r[K] = n[K]);
+      } else r = n;
+      return f && d(
+        r,
         typeof e == "function" ? e.displayName || e.name || "Unknown" : e
-      ), E(
+      ), m(
         e,
-        d,
+        f,
+        R,
         p,
-        x,
-        c(),
-        o,
-        M,
-        U
+        o(),
+        r,
+        Z,
+        Q
       );
     }
-    function b(e) {
-      typeof e == "object" && e !== null && e.$$typeof === O && e._store && (e._store.validated = 1);
+    function w(e) {
+      typeof e == "object" && e !== null && e.$$typeof === y && e._store && (e._store.validated = 1);
     }
-    var m = oe, O = Symbol.for("react.transitional.element"), Y = Symbol.for("react.portal"), R = Symbol.for("react.fragment"), h = Symbol.for("react.strict_mode"), k = Symbol.for("react.profiler"), T = Symbol.for("react.consumer"), P = Symbol.for("react.context"), _ = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), W = Symbol.for("react.suspense_list"), F = Symbol.for("react.memo"), a = Symbol.for("react.lazy"), q = Symbol.for("react.activity"), re = Symbol.for("react.client.reference"), z = m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, V = Object.prototype.hasOwnProperty, te = Array.isArray, D = console.createTask ? console.createTask : function() {
+    var j = ie, y = Symbol.for("react.transitional.element"), L = Symbol.for("react.portal"), A = Symbol.for("react.fragment"), C = Symbol.for("react.strict_mode"), O = Symbol.for("react.profiler"), X = Symbol.for("react.consumer"), Y = Symbol.for("react.context"), l = Symbol.for("react.forward_ref"), F = Symbol.for("react.suspense"), S = Symbol.for("react.suspense_list"), T = Symbol.for("react.memo"), M = Symbol.for("react.lazy"), k = Symbol.for("react.activity"), v = Symbol.for("react.client.reference"), P = j.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, x = Object.prototype.hasOwnProperty, q = Array.isArray, _ = console.createTask ? console.createTask : function() {
       return null;
     };
-    m = {
+    j = {
       "react-stack-bottom-frame": function(e) {
         return e();
       }
     };
-    var B, G = {}, X = m["react-stack-bottom-frame"].bind(
-      m,
-      l
-    )(), Z = D(v(l)), H = {};
-    N.Fragment = R, N.jsx = function(e, r, o, u, x) {
-      var p = 1e4 > z.recentlyCreatedOwnerStacks++;
-      return g(
+    var D, $ = {}, U = j["react-stack-bottom-frame"].bind(
+      j,
+      u
+    )(), B = _(g(u)), V = {};
+    J.Fragment = A, J.jsx = function(e, n, r, i, p) {
+      var R = 1e4 > P.recentlyCreatedOwnerStacks++;
+      return W(
         e,
+        n,
         r,
-        o,
         !1,
-        u,
-        x,
-        p ? Error("react-stack-top-frame") : X,
-        p ? D(v(e)) : Z
+        i,
+        p,
+        R ? Error("react-stack-top-frame") : U,
+        R ? _(g(e)) : B
       );
-    }, N.jsxs = function(e, r, o, u, x) {
-      var p = 1e4 > z.recentlyCreatedOwnerStacks++;
-      return g(
+    }, J.jsxs = function(e, n, r, i, p) {
+      var R = 1e4 > P.recentlyCreatedOwnerStacks++;
+      return W(
         e,
+        n,
         r,
-        o,
         !0,
-        u,
-        x,
-        p ? Error("react-stack-top-frame") : X,
-        p ? D(v(e)) : Z
+        i,
+        p,
+        R ? Error("react-stack-top-frame") : U,
+        R ? _(g(e)) : B
       );
     };
-  }()), N;
+  }()), J;
 }
-var ee;
-function ce() {
-  return ee || (ee = 1, process.env.NODE_ENV === "production" ? L.exports = ae() : L.exports = se()), L.exports;
+var ne;
+function de() {
+  return ne || (ne = 1, process.env.NODE_ENV === "production" ? G.exports = le() : G.exports = ue()), G.exports;
 }
-var n = ce();
-const ve = ({ type: t = "button", value: s }) => /* @__PURE__ */ n.jsx("button", { type: t, children: s }), we = ({
+var a = de();
+const xe = ({ type: t = "button", value: s }) => /* @__PURE__ */ a.jsx("button", { type: t, children: s }), be = ({
   type: t = "text",
   placeholder: s,
-  wrapperClass: i = "",
-  labelClass: v = "",
-  inputClass: c = "",
-  errorClass: l = "",
-  label: w,
-  hasError: f,
-  register: A,
-  name: E,
-  isDisabled: g = !1,
-  autocomplete: b = !1,
-  ...m
-}) => /* @__PURE__ */ n.jsxs("div", { className: i, children: [
-  /* @__PURE__ */ n.jsxs(
+  wrapperClass: c = "",
+  labelClass: g = "",
+  inputClass: o = "",
+  errorClass: u = "",
+  label: h,
+  hasError: d,
+  register: E,
+  name: m,
+  isDisabled: W = !1,
+  autocomplete: w = !1,
+  ...j
+}) => /* @__PURE__ */ a.jsxs("div", { className: c, children: [
+  /* @__PURE__ */ a.jsxs(
     "label",
     {
-      htmlFor: E,
-      className: `${v} ${f && "error"}`,
+      htmlFor: m,
+      className: `${g} ${d && "error"}`,
       children: [
-        w,
-        /* @__PURE__ */ n.jsx(
+        h,
+        /* @__PURE__ */ a.jsx(
           "input",
           {
-            disabled: g,
-            autoComplete: b ? "on" : "off",
-            id: E,
-            ...A,
-            ...m,
+            disabled: W,
+            autoComplete: w ? "on" : "off",
+            id: m,
+            ...E,
+            ...j,
             type: t,
-            name: E,
-            className: `${c} ${f && "error"} ${l}`,
+            name: m,
+            className: `${o} ${d && "error"} ${u}`,
             placeholder: s
           }
         )
       ]
     }
   ),
-  f && /* @__PURE__ */ n.jsx("p", { className: l, children: f })
-] }), le = (t) => /* @__PURE__ */ $.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512", fill: "currentColor", ...t }, /* @__PURE__ */ $.createElement("path", { d: "M241 337c-9.4 9.4-24.6 9.4-33.9 0L47 177c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l143 143L367 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9L241 337z" })), ie = (t) => /* @__PURE__ */ $.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 -960 960 960", fill: "currentColor", ...t }, /* @__PURE__ */ $.createElement("path", { d: "M480-424 284-228q-11 11-28 11t-28-11q-11-11-11-28t11-28l196-196-196-196q-11-11-11-28t11-28q11-11 28-11t28 11l196 196 196-196q11-11 28-11t28 11q11 11 11 28t-11 28L536-480l196 196q11 11 11 28t-11 28q-11 11-28 11t-28-11L480-424Z" })), ue = () => {
-  const [t, s] = y(typeof window < "u" ? window.innerWidth : 0), i = () => s(typeof window < "u" ? window.innerWidth : 0);
-  return S(() => (window.addEventListener("resize", i), () => window.removeEventListener("resize", i)), [t]), t;
-}, de = ({
-  size: t = "w-10 h-10",
-  bgColor: s = "text-gray-300",
-  color: i = "text-primary-100"
-}) => /* @__PURE__ */ n.jsxs(
+  d && /* @__PURE__ */ a.jsx("p", { className: u, children: d })
+] }), ae = (t) => /* @__PURE__ */ z.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 384 512", fill: "currentColor", ...t }, /* @__PURE__ */ z.createElement("path", { fill: "currentColor", d: "M209.5 369c-9.4 9.4-24.6 9.4-33.9 0L15.5 209c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l143 143 143-143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-160 160z" })), fe = (t) => /* @__PURE__ */ z.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 384 512", fill: "currentColor", ...t }, /* @__PURE__ */ z.createElement("path", { fill: "currentColor", d: "M7.5 105c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l151 151 151-151c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-151 151 151 151c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0l-151-151-151 151c-9.4 9.4-24.6 9.4-33.9 0s-9.4-24.6 0-33.9l151-151-151-151z" })), oe = (t) => /* @__PURE__ */ z.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", fill: "currentColor", ...t }, /* @__PURE__ */ z.createElement("path", { fill: "currentColor", d: "M368 208a160 160 0 1 0 -320 0 160 160 0 1 0 320 0zM337.1 371.1C301.7 399.2 256.8 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208c0 48.8-16.8 93.7-44.9 129.1L505 471c9.4 9.4 9.4 24.6 0 33.9s-24.6 9.4-33.9 0L337.1 371.1z" })), ge = () => {
+  const [t, s] = N(typeof window < "u" ? window.innerWidth : 0), c = () => s(typeof window < "u" ? window.innerWidth : 0);
+  return b(() => (window.addEventListener("resize", c), () => window.removeEventListener("resize", c)), [t]), t;
+}, se = ({
+  classNames: t = {
+    wrapper: "",
+    color: ""
+  }
+}) => /* @__PURE__ */ a.jsxs(
   "svg",
   {
-    className: `${t} ${s} animate-spin`,
+    className: `nariaLoading ${t.wrapper}`,
     viewBox: "0 0 64 64",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     children: [
-      /* @__PURE__ */ n.jsx(
+      /* @__PURE__ */ a.jsx(
         "path",
         {
           d: "M32 3C35.8083 3 39.5794 3.75011 43.0978 5.20749C46.6163 6.66488 49.8132 8.80101 52.5061 11.4939C55.199 14.1868 57.3351 17.3837 58.7925 20.9022C60.2499 24.4206 61 28.1917 61 32C61 35.8083 60.2499 39.5794 58.7925 43.0978C57.3351 46.6163 55.199 49.8132 52.5061 52.5061C49.8132 55.199 46.6163 57.3351 43.0978 58.7925C39.5794 60.2499 35.8083 61 32 61C28.1917 61 24.4206 60.2499 20.9022 58.7925C17.3837 57.3351 14.1868 55.199 11.4939 52.5061C8.801 49.8132 6.66487 46.6163 5.20749 43.0978C3.7501 39.5794 3 35.8083 3 32C3 28.1917 3.75011 24.4206 5.2075 20.9022C6.66489 17.3837 8.80101 14.1868 11.4939 11.4939C14.1868 8.80099 17.3838 6.66487 20.9022 5.20749C24.4206 3.7501 28.1917 3 32 3L32 3Z",
@@ -345,7 +346,7 @@ const ve = ({ type: t = "button", value: s }) => /* @__PURE__ */ n.jsx("button",
           strokeLinejoin: "round"
         }
       ),
-      /* @__PURE__ */ n.jsx(
+      /* @__PURE__ */ a.jsx(
         "path",
         {
           d: "M32 3C36.5778 3 41.0906 4.08374 45.1692 6.16256C49.2477 8.24138 52.7762 11.2562 55.466 14.9605C58.1558 18.6647 59.9304 22.9531 60.6448 27.4748C61.3591 31.9965 60.9928 36.6232 59.5759 40.9762",
@@ -353,76 +354,177 @@ const ve = ({ type: t = "button", value: s }) => /* @__PURE__ */ n.jsx("button",
           strokeWidth: "6",
           strokeLinecap: "round",
           strokeLinejoin: "round",
-          className: i
+          className: t.color
         }
       )
     ]
   }
-), fe = () => {
+), me = () => {
   const t = `${window.location.pathname}${window.location.search}`;
   window.history.replaceState(null, "", t);
-}, me = (t) => {
+}, he = (t) => {
   window.location.hash = t;
-}, be = ({
-  list: t,
+}, pe = (t) => {
+  const [s, c] = N(!1);
+  return b(() => {
+    const g = (o) => {
+      window.location.hash !== t ? c(!0) : c(!1);
+    };
+    return window.addEventListener("hashchange", g), () => {
+      window.removeEventListener("hashchange", g);
+    };
+  }, []), s;
+}, we = (t, s, c) => {
+  b(() => {
+    function g(o) {
+      s.current && !s.current.contains(o.target) && t?.current && !t?.current.contains(o.target) && c();
+    }
+    return document.addEventListener("mousedown", g), () => {
+      document.removeEventListener("mousedown", g);
+    };
+  }, [t, c]);
+}, Ee = ({
+  options: t,
   label: s,
-  hasError: i,
-  title: v,
-  value: c,
-  api: l,
-  maxHeight: w = "max-h-64",
-  theme: f = "secondary",
-  size: A = "md",
-  onSelectChange: E,
-  selected: g
+  hasError: c,
+  title: g,
+  value: o,
+  api: u,
+  selected: h,
+  placeholder: d,
+  disabled: E = !1,
+  pagination: m,
+  optionFilterLabel: W,
+  hasSearch: w = !1,
+  onSelectChange: j
 }) => {
-  const b = ue(), [m, O] = y(!1), [Y, R] = y(!0), [h, k] = y(null), [T, P] = y(null);
-  S(() => {
-    l && (R(!0), l().then((a) => {
-      R(!1), P(a?.data?.message ? [] : a.data);
-    }));
-  }, [l]), S(() => {
-    b < 1024 && (m ? (me("select"), document.body.style.overflow = "hidden") : (window.location.hash && !document.referrer.includes("#") && fe(), document.body.style.overflow = "auto"));
-  }, [m]), S(() => {
-    s?.length ? k(T?.find((a) => a[s] === g)) : k(g);
-  }, [g, T]), S(() => {
-    t?.length && P(t);
+  let y = !0;
+  const L = ge(), A = pe("#select"), [C, O] = N(!1), [X, Y] = N(!0), [l, F] = N(null), [S, T] = N(null), [M, k] = N(""), [v, P] = N({
+    page: 1,
+    pageLabel: "page",
+    size: 20,
+    sizeLabel: "size",
+    isLoading: !1
+  }), x = ee(void 0), q = ee(void 0), _ = ee(void 0), D = async () => {
+    if (x?.current)
+      try {
+        const r = await fetch(x?.current);
+        if (!r.ok)
+          throw new Error(`Response status: ${r.status}`);
+        return await r.json();
+      } catch (r) {
+        console.error(r.message);
+      }
+  };
+  b(() => () => {
+    y = !1;
+  }, []), b(() => {
+    if (u?.length) {
+      if (x.current = u, x.current.includes(m?.pageLabel || "page")) {
+        const r = new URL(u);
+        r.searchParams.set(m?.pageLabel || "page", (m?.page || v.page).toString()), r.searchParams.set(m?.sizeLabel || "size", (m?.size || v.size).toString()), x.current = r.href;
+      }
+      Y(!0), D().then((r) => {
+        y && (Y(!1), T(r));
+      });
+    }
+  }, [u, m]), b(() => {
+    if (v.isLoading) {
+      if (x.current.includes(m?.pageLabel || "page")) {
+        const r = new URL(x.current);
+        r.searchParams.set(m?.pageLabel || "page", v.page.toString()), x.current = r.href;
+      }
+      D().then((r) => {
+        y && (Y(!1), P({
+          ...v,
+          isLoading: !1
+        }), T([
+          ...S,
+          ...r
+        ]));
+      });
+    }
+  }, [v]), b(() => {
+    L < 768 && (C ? (he("select"), document.body.style.overflow = "hidden", _.current?.focus()) : (window.location.hash && !document.referrer.includes("#") && me(), document.body.style.overflow = "auto"));
+  }, [C]), b(() => {
+    h && t?.length && (t?.find((r) => r[s] === h) ? F(t?.find((r) => r[s] === h)) : F(h));
+  }, [h]), b(() => {
+    l && w && (o?.length && S?.find((r) => r[s] === l[s]) ? k(S?.find((r) => r[s] === l[s])[o] || "") : k(l));
+  }, [l]), b(() => {
+    A && O(!1);
+  }, [A]), b(() => {
+    t?.length && T(t);
   }, [t]);
-  const _ = () => {
-    O((a) => !a);
-  }, I = (a) => {
-    a?.target?.className.toString()?.includes("backdrop-select") && _();
-  }, W = (a) => {
-    k(a), _(), E(a);
-  }, F = (a) => {
-    if (!h)
+  const $ = () => {
+    w && T(t), O((r) => !r);
+  }, U = () => {
+    w && (T(t), k(typeof l == "string" ? l : l ? l[o] : "")), O(!1);
+  }, B = (r) => {
+    w && (o?.length ? k(r[o]) : k(r)), F(r), $(), j && j(r);
+  }, V = (r) => {
+    if (!l)
       return "";
-    if (s?.length && a[s] === h[s] || a === h)
+    if (s?.length && r[s] === l[s] || r === l)
       return "bg-grey-100";
+  }, e = (r) => {
+    S?.length && !v.isLoading && r.target.offsetHeight + r.target.scrollTop >= r.target.scrollHeight - 100 && P({
+      page: v.page + 1,
+      isLoading: !0
+    });
+  }, n = (r) => {
+    const i = r?.target?.value?.length ? t.filter((p) => typeof p == "object" ? p[o].includes(r?.target?.value) : p.includes(r?.target?.value)) : t;
+    T(i), k(r?.target?.value), C || O(!0);
   };
-  return /* @__PURE__ */ n.jsxs("div", { className: "naria-select", children: [
-    /* @__PURE__ */ n.jsxs(
+  return we(q, _, U), /* @__PURE__ */ a.jsxs("div", { className: `nariaSelect ${E ? "nariaSelect-disabled" : ""}`, children: [
+    /* @__PURE__ */ a.jsxs(
       "label",
       {
         className: `cursor-pointer
-                ${i && "!text-danger-100"}`,
+                ${c && "!text-danger-100"}`,
         children: [
-          /* @__PURE__ */ n.jsx("span", { className: "", children: v }),
-          /* @__PURE__ */ n.jsxs(
+          /* @__PURE__ */ a.jsx("span", { className: "", children: g }),
+          w ? /* @__PURE__ */ a.jsxs("div", { className: "nariaSearchInput", children: [
+            /* @__PURE__ */ a.jsx(
+              "input",
+              {
+                ref: _,
+                placeholder: d?.length ? d : "Select",
+                className: `${l ? "text-dark-100" : "text-grey-300"} 
+                                ${c && "!border-danger-100 focus:border-danger-100 outline-danger-100"}`,
+                value: M,
+                disabled: E,
+                type: "text",
+                onClick: $,
+                onChange: n
+              }
+            ),
+            C ? /* @__PURE__ */ a.jsx(
+              oe,
+              {
+                className: "nariaSearchIcon"
+              }
+            ) : /* @__PURE__ */ a.jsx(
+              ae,
+              {
+                className: `nariaArrowIcon ${C ? "nariaArrowIcon-rotate-180" : ""}`
+              }
+            )
+          ] }) : /* @__PURE__ */ a.jsxs(
             "button",
             {
               type: "button",
-              className: `relative z-20 flex items-center mt-1 text-base justify-between gap-2 w-full
-                         ${h ? "text-dark-100" : "text-grey-300"}
-                         ${i && "!border-danger-100 focus:border-danger-100 outline-danger-100"}`,
-              onClick: _,
+              ref: _,
+              disabled: E,
+              className: `nariaHandler ${l ? "text-dark-100" : "text-grey-300"} 
+                                ${c && "!border-danger-100 focus:border-danger-100 outline-danger-100"}`,
+              onClick: $,
               children: [
-                h ? c?.length ? h[c] : h : "انتخاب",
+                l ? o?.length ? l[o] : l : d?.length ? d : "Select",
                 " ",
-                /* @__PURE__ */ n.jsx(
-                  le,
+                /* @__PURE__ */ a.jsx(
+                  ae,
                   {
-                    className: `w-4 h-4 transition ease duration-200 ${m ? "rotate-180" : "rotate-0"}`
+                    className: `nariaArrowIcon ${C ? "nariaArrowIcon-rotate-180" : ""}`
                   }
                 )
               ]
@@ -431,49 +533,67 @@ const ve = ({ type: t = "button", value: s }) => /* @__PURE__ */ n.jsx("button",
         ]
       }
     ),
-    m ? /* @__PURE__ */ n.jsxs(
+    C ? /* @__PURE__ */ a.jsxs(
       "div",
       {
-        className: `wrapper ${b < 1024 ? "mobile" : ""}`,
+        className: `nariaListWrapper ${L < 768 ? "nariaListWrapper-mobile" : ""}`,
+        ref: q,
         children: [
-          /* @__PURE__ */ n.jsx(
+          w && L < 768 ? /* @__PURE__ */ a.jsxs("div", { className: "nariaSearchInput", children: [
+            /* @__PURE__ */ a.jsx(
+              "input",
+              {
+                ref: _,
+                placeholder: d?.length ? d : "Select",
+                className: `${l ? "text-dark-100" : "text-grey-300"} 
+                                ${c && "!border-danger-100 focus:border-danger-100 outline-danger-100"}`,
+                value: M,
+                disabled: E,
+                type: "text",
+                onChange: n
+              }
+            ),
+            /* @__PURE__ */ a.jsx(
+              oe,
+              {
+                className: "nariaSearchIcon"
+              }
+            )
+          ] }) : void 0,
+          /* @__PURE__ */ a.jsx(
             "div",
             {
-              className: `list ${b < 1024 ? "mobile" : `desktop ${w}`}`,
-              children: l && Y ? /* @__PURE__ */ n.jsx("div", { className: "py-10 flex justify-center", children: /* @__PURE__ */ n.jsx(de, { size: "w-7 h-7" }) }) : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
-                b < 1024 ? /* @__PURE__ */ n.jsx("div", { className: "sticky top-0 text-left", children: /* @__PURE__ */ n.jsx("button", { className: "p-3", onClick: _, children: /* @__PURE__ */ n.jsx(ie, { className: "w-6" }) }) }) : void 0,
-                T?.map((a, q) => /* @__PURE__ */ n.jsx(
+              className: `nariaList ${L < 768 ? "nariaList-mobile" : "nariaList-desktop"}`,
+              onScroll: e,
+              children: u && X ? /* @__PURE__ */ a.jsx("div", { className: "nariaLoadingWrapper", children: /* @__PURE__ */ a.jsx(se, {}) }) : /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+                L < 768 ? /* @__PURE__ */ a.jsx("div", { className: "sticky top-0 text-left", children: /* @__PURE__ */ a.jsx("button", { className: "p-3", onClick: U, disabled: E, children: /* @__PURE__ */ a.jsx(fe, { className: "w-6" }) }) }) : void 0,
+                S?.length ? /* @__PURE__ */ a.jsx(a.Fragment, { children: S?.map((r, i) => /* @__PURE__ */ a.jsx(
                   "button",
                   {
                     type: "button",
-                    onClick: () => W(a),
-                    className: `text-right py-2.5 px-4 text-base hover:bg-grey-100 rounded-lg ${F(a)}`,
-                    children: c?.length ? a[c] : a
+                    onClick: () => B(r),
+                    disabled: E,
+                    className: `text-right py-2.5 px-4 text-base hover:bg-grey-100 rounded-lg ${V(r)}`,
+                    children: o?.length ? r[o] : r
                   },
-                  q.toString()
-                ))
+                  i.toString()
+                )) }) : /* @__PURE__ */ a.jsx("div", { children: "No Data" }),
+                v.isLoading ? /* @__PURE__ */ a.jsx("div", { className: "nariaLoadingMoreWrapper", children: /* @__PURE__ */ a.jsx(se, {}) }) : void 0
               ] })
             }
-          ),
-          /* @__PURE__ */ n.jsx(
-            "div",
-            {
-              className: "backdrop-select",
-              onClick: I
-            }
           )
         ]
       }
     ) : void 0,
-    i && /* @__PURE__ */ n.jsx("p", { className: "text-xs mt-1 text-danger-100", children: i })
+    c && /* @__PURE__ */ a.jsx("p", { className: "text-xs mt-1 text-danger-100", children: c })
   ] });
 };
-function he(t) {
+function Re(t) {
   return t.charAt(0).toUpperCase() + t.slice(1);
 }
 export {
-  ve as Button,
-  we as Input,
-  be as Select,
-  he as capitalize
+  xe as Button,
+  be as Input,
+  Ee as Select,
+  Re as capitalize
 };