@dgshahr/ui-kit 0.0.27 → 0.0.29

package/dist/Form/Input/index.cjs

@@ -1 +1 @@
-"use strict";const e=require("react/jsx-runtime"),u=require("../../clsx-C11secjj.cjs"),x=require("react"),C=require("../../TextFieldWrapper-BC0mP63G.cjs"),v=t=>e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:[e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"m15.456 9.595-5.852 5.852-1.061-1.06 5.853-5.853z",clipRule:"evenodd"}),e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"m9.6 8.532 5.856 5.858-1.06 1.06-5.857-5.857z",clipRule:"evenodd"}),e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12m10-8.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17",clipRule:"evenodd"})]}),y=t=>e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:[e.jsx("path",{fill:"currentColor",d:"M12.247 20.812c-4.033 0-7.654-2.828-9.686-7.558a.75.75 0 0 1 0-.592c2.034-4.732 5.655-7.557 9.687-7.557s7.657 2.825 9.69 7.557a.75.75 0 0 1 0 .592c-2.032 4.73-5.653 7.554-9.685 7.557zm-8.182-7.853c1.806 3.983 4.846 6.352 8.18 6.352 3.334.002 6.373-2.369 8.18-6.352-1.808-3.986-4.848-6.354-8.182-6.354s-6.37 2.368-8.176 6.354z"}),e.jsx("path",{fill:"currentColor",d:"M12.247 16.789a3.825 3.825 0 1 1 0-7.651 3.825 3.825 0 0 1 0 7.65m0-6.152a2.326 2.326 0 1 0 0 4.651 2.326 2.326 0 0 0 0-4.651"})]}),R=t=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M20.417 3.22a.75.75 0 0 1 0 1.06L4.643 20.055a.744.744 0 0 1-1.06 0 .75.75 0 0 1 0-1.06l1.972-1.971c-1.413-1.293-2.613-3.036-3.493-5.089a.75.75 0 0 1 0-.593C3.082 8.977 4.52 7.02 6.22 5.683c3.292-2.606 7.621-2.744 11.048-.375l2.088-2.088a.75.75 0 0 1 1.06 0m-.37 4.82c.724.962 1.36 2.073 1.891 3.299a.74.74 0 0 1 0 .595C19.842 16.79 16.128 19.69 12 19.69a8.8 8.8 0 0 1-2.769-.451.75.75 0 0 1 .474-1.424A7.3 7.3 0 0 0 12 18.19c3.428 0 6.561-2.442 8.43-6.553a14.5 14.5 0 0 0-1.58-2.694.75.75 0 0 1 1.197-.902M7.15 6.862c-1.437 1.13-2.67 2.776-3.58 4.778.794 1.752 1.836 3.23 3.047 4.322l2.138-2.138a3.87 3.87 0 0 1-.67-2.184A3.92 3.92 0 0 1 12 7.722a3.9 3.9 0 0 1 2.187.669l2.001-2.002c-2.853-1.844-6.325-1.676-9.038.472m8.088 4.6a.75.75 0 0 1 .606.872 3.92 3.92 0 0 1-3.141 3.147.75.75 0 0 1-.268-1.476 2.41 2.41 0 0 0 1.932-1.937.754.754 0 0 1 .87-.606M12 9.221a2.418 2.418 0 0 0-2.152 3.509l3.245-3.246A2.4 2.4 0 0 0 12 9.222",clipRule:"evenodd"})}),N=x.forwardRef(function(i,h){const{dir:l="rtl",placeholderDir:g=l,containerClassName:p,leftIcon:n,prefix:o,postfix:a,isClearOption:f,onClear:c,...s}=i,[d,m]=x.useState(s.type);return e.jsx(C.TextFieldWrapper,{...i,containerClassName:u.clsx("dgs-ui-kit-items-center",p),children:({handleChangeField:w,value:r,setValue:j})=>e.jsxs(e.Fragment,{children:[o&&e.jsx("span",{className:"dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500",children:o}),e.jsx("input",{...s,ref:h,className:u.clsx("dgs-ui-kit-bg-transparent focus:dgs-ui-kit-outline-none dgs-ui-kit-flex-1",l==="rtl"?"dgs-ui-kit-text-right":"!dgs-ui-kit-text-left",g==="rtl"?"placeholder:dgs-ui-kit-text-right":"placeholder:dgs-ui-kit-text-left",{ss02:s.type!="password"},i.className),...l==="ltr"?{style:{direction:"ltr"}}:{},value:r,onChange:w,type:d}),f&&r&&r.length>0&&e.jsx("button",{onClick:()=>{j(""),typeof c=="function"&&c()},children:e.jsx(v,{className:"dgs-ui-kit-text-gray-600",width:20,height:20})}),a&&e.jsx("span",{className:"dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500",children:a}),n&&e.jsx("div",{className:"dgs-ui-kit-text-gray-600",children:n}),s.type==="password"&&e.jsx("button",{onClick:()=>m(k=>k==="text"?"password":"text"),className:"dgs-ui-kit-text-gray-600",children:d==="password"?e.jsx(y,{width:20,height:20}):e.jsx(R,{width:20,height:20})})]})})});module.exports=N;
+"use strict";const e=require("react/jsx-runtime"),p=require("../../clsx-C11secjj.cjs"),f=require("react"),v=require("../../TextFieldWrapper-BC0mP63G.cjs"),y=t=>e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:[e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"m15.456 9.595-5.852 5.852-1.061-1.06 5.853-5.853z",clipRule:"evenodd"}),e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"m9.6 8.532 5.856 5.858-1.06 1.06-5.857-5.857z",clipRule:"evenodd"}),e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10S2 17.523 2 12m10-8.5a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17",clipRule:"evenodd"})]}),R=t=>e.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:[e.jsx("path",{fill:"currentColor",d:"M12.247 20.812c-4.033 0-7.654-2.828-9.686-7.558a.75.75 0 0 1 0-.592c2.034-4.732 5.655-7.557 9.687-7.557s7.657 2.825 9.69 7.557a.75.75 0 0 1 0 .592c-2.032 4.73-5.653 7.554-9.685 7.557zm-8.182-7.853c1.806 3.983 4.846 6.352 8.18 6.352 3.334.002 6.373-2.369 8.18-6.352-1.808-3.986-4.848-6.354-8.182-6.354s-6.37 2.368-8.176 6.354z"}),e.jsx("path",{fill:"currentColor",d:"M12.247 16.789a3.825 3.825 0 1 1 0-7.651 3.825 3.825 0 0 1 0 7.65m0-6.152a2.326 2.326 0 1 0 0 4.651 2.326 2.326 0 0 0 0-4.651"})]}),N=t=>e.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",width:"1em",height:"1em",fill:"none",viewBox:"0 0 24 24",...t,children:e.jsx("path",{fill:"currentColor",fillRule:"evenodd",d:"M20.417 3.22a.75.75 0 0 1 0 1.06L4.643 20.055a.744.744 0 0 1-1.06 0 .75.75 0 0 1 0-1.06l1.972-1.971c-1.413-1.293-2.613-3.036-3.493-5.089a.75.75 0 0 1 0-.593C3.082 8.977 4.52 7.02 6.22 5.683c3.292-2.606 7.621-2.744 11.048-.375l2.088-2.088a.75.75 0 0 1 1.06 0m-.37 4.82c.724.962 1.36 2.073 1.891 3.299a.74.74 0 0 1 0 .595C19.842 16.79 16.128 19.69 12 19.69a8.8 8.8 0 0 1-2.769-.451.75.75 0 0 1 .474-1.424A7.3 7.3 0 0 0 12 18.19c3.428 0 6.561-2.442 8.43-6.553a14.5 14.5 0 0 0-1.58-2.694.75.75 0 0 1 1.197-.902M7.15 6.862c-1.437 1.13-2.67 2.776-3.58 4.778.794 1.752 1.836 3.23 3.047 4.322l2.138-2.138a3.87 3.87 0 0 1-.67-2.184A3.92 3.92 0 0 1 12 7.722a3.9 3.9 0 0 1 2.187.669l2.001-2.002c-2.853-1.844-6.325-1.676-9.038.472m8.088 4.6a.75.75 0 0 1 .606.872 3.92 3.92 0 0 1-3.141 3.147.75.75 0 0 1-.268-1.476 2.41 2.41 0 0 0 1.932-1.937.754.754 0 0 1 .87-.606M12 9.221a2.418 2.418 0 0 0-2.152 3.509l3.245-3.246A2.4 2.4 0 0 0 12 9.222",clipRule:"evenodd"})}),I=f.forwardRef(function(r,m){const{dir:s="rtl",placeholderDir:w=s,containerClassName:j,leftIcon:o,prefix:c,postfix:d,isClearOption:a,onClear:u,...l}=r,[x,C]=f.useState(l.type);function h(n){return e.jsx("button",{onClick:()=>{n(""),typeof u=="function"&&u()},children:e.jsx(y,{className:"dgs-ui-kit-text-gray-600",width:20,height:20})})}return e.jsx(v.TextFieldWrapper,{...r,containerClassName:p.clsx("dgs-ui-kit-items-center",j),children:({handleChangeField:n,value:i,setValue:g})=>e.jsxs(e.Fragment,{children:[c&&e.jsx("span",{className:"dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500",children:c}),a&&i&&i.length>0&&s==="ltr"&&h(g),e.jsx("input",{...l,ref:m,className:p.clsx("dgs-ui-kit-bg-transparent focus:dgs-ui-kit-outline-none dgs-ui-kit-flex-1",s==="rtl"?"dgs-ui-kit-text-right":"!dgs-ui-kit-text-left",w==="rtl"?"placeholder:dgs-ui-kit-text-right":"placeholder:dgs-ui-kit-text-left",{ss02:l.type!="password"},r.className),...s==="ltr"?{style:{direction:"ltr"}}:{},value:i,onChange:n,type:x}),a&&i&&i.length>0&&s==="rtl"&&h(g),d&&e.jsx("span",{className:"dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500",children:d}),o&&e.jsx("div",{className:"dgs-ui-kit-text-gray-600",children:o}),l.type==="password"&&e.jsx("button",{onClick:()=>C(k=>k==="text"?"password":"text"),className:"dgs-ui-kit-text-gray-600",children:x==="password"?e.jsx(R,{width:20,height:20}):e.jsx(N,{width:20,height:20})})]})})});module.exports=I;

package/dist/Form/Input/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/Input/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,mBAAmB,EAAwB,MAAM,OAAO,CAAC;AAK1F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AAExF,UAAU,UACR,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,KAAK,CAAC,EACxD,kBAAkB;IACpB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,KAAK,yGAoFT,CAAC;AACH,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/Input/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAqB,KAAK,mBAAmB,EAAwB,MAAM,OAAO,CAAC;AAK1F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AAExF,UAAU,UACR,SAAQ,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,KAAK,CAAC,EACxD,kBAAkB;IACpB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,QAAA,MAAM,KAAK,yGAiGT,CAAC;AACH,eAAe,KAAK,CAAC"}

package/dist/Form/Input/index.js

@@ -1,8 +1,8 @@
-import { jsxs as n, jsx as e, Fragment as v } from "react/jsx-runtime";
-import { c as g } from "../../clsx-OuTLNxxd.js";
-import { forwardRef as y, useState as N } from "react";
-import { T as R } from "../../TextFieldWrapper-Dva9vxfn.js";
-const I = (t) => /* @__PURE__ */ n(
+import { jsxs as o, jsx as t, Fragment as y } from "react/jsx-runtime";
+import { c as f } from "../../clsx-OuTLNxxd.js";
+import { forwardRef as N, useState as R } from "react";
+import { T as I } from "../../TextFieldWrapper-Dva9vxfn.js";
+const M = (e) => /* @__PURE__ */ o(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -10,9 +10,9 @@ const I = (t) => /* @__PURE__ */ n(
     height: "1em",
     fill: "none",
     viewBox: "0 0 24 24",
-    ...t,
+    ...e,
     children: [
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ t(
         "path",
         {
           fill: "currentColor",
@@ -21,7 +21,7 @@ const I = (t) => /* @__PURE__ */ n(
           clipRule: "evenodd"
         }
       ),
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ t(
         "path",
         {
           fill: "currentColor",
@@ -30,7 +30,7 @@ const I = (t) => /* @__PURE__ */ n(
           clipRule: "evenodd"
         }
       ),
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ t(
         "path",
         {
           fill: "currentColor",
@@ -41,7 +41,7 @@ const I = (t) => /* @__PURE__ */ n(
       )
     ]
   }
-), M = (t) => /* @__PURE__ */ n(
+), z = (e) => /* @__PURE__ */ o(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -49,16 +49,16 @@ const I = (t) => /* @__PURE__ */ n(
     height: "1em",
     fill: "none",
     viewBox: "0 0 24 24",
-    ...t,
+    ...e,
     children: [
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ t(
         "path",
         {
           fill: "currentColor",
           d: "M12.247 20.812c-4.033 0-7.654-2.828-9.686-7.558a.75.75 0 0 1 0-.592c2.034-4.732 5.655-7.557 9.687-7.557s7.657 2.825 9.69 7.557a.75.75 0 0 1 0 .592c-2.032 4.73-5.653 7.554-9.685 7.557zm-8.182-7.853c1.806 3.983 4.846 6.352 8.18 6.352 3.334.002 6.373-2.369 8.18-6.352-1.808-3.986-4.848-6.354-8.182-6.354s-6.37 2.368-8.176 6.354z"
         }
       ),
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ t(
         "path",
         {
           fill: "currentColor",
@@ -67,7 +67,7 @@ const I = (t) => /* @__PURE__ */ n(
       )
     ]
   }
-), z = (t) => /* @__PURE__ */ e(
+), B = (e) => /* @__PURE__ */ t(
   "svg",
   {
     xmlns: "http://www.w3.org/2000/svg",
@@ -75,8 +75,8 @@ const I = (t) => /* @__PURE__ */ n(
     height: "1em",
     fill: "none",
     viewBox: "0 0 24 24",
-    ...t,
-    children: /* @__PURE__ */ e(
+    ...e,
+    children: /* @__PURE__ */ t(
       "path",
       {
         fill: "currentColor",
@@ -86,76 +86,80 @@ const I = (t) => /* @__PURE__ */ n(
       }
     )
   }
-), T = y(function(l, u) {
+), j = N(function(n, w) {
   const {
-    dir: r = "rtl",
-    placeholderDir: p = r,
-    containerClassName: m,
-    leftIcon: o,
-    prefix: a,
-    postfix: d,
-    isClearOption: f,
-    onClear: c,
-    ...i
-  } = l, [h, w] = N(i.type);
-  return /* @__PURE__ */ e(
-    R,
+    dir: i = "rtl",
+    placeholderDir: x = i,
+    containerClassName: C,
+    leftIcon: a,
+    prefix: d,
+    postfix: c,
+    isClearOption: h,
+    onClear: g,
+    ...r
+  } = n, [u, k] = R(r.type);
+  function p(s) {
+    return /* @__PURE__ */ t(
+      "button",
+      {
+        onClick: () => {
+          s(""), typeof g == "function" && g();
+        },
+        children: /* @__PURE__ */ t(
+          M,
+          {
+            className: "dgs-ui-kit-text-gray-600",
+            width: 20,
+            height: 20
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ t(
+    I,
     {
-      ...l,
-      containerClassName: g("dgs-ui-kit-items-center", m),
-      children: ({ handleChangeField: x, value: s, setValue: k }) => /* @__PURE__ */ n(v, { children: [
-        a && /* @__PURE__ */ e("span", { className: "dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500", children: a }),
-        /* @__PURE__ */ e(
+      ...n,
+      containerClassName: f("dgs-ui-kit-items-center", C),
+      children: ({ handleChangeField: s, value: l, setValue: m }) => /* @__PURE__ */ o(y, { children: [
+        d && /* @__PURE__ */ t("span", { className: "dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500", children: d }),
+        h && l && l.length > 0 && i === "ltr" && p(m),
+        /* @__PURE__ */ t(
           "input",
           {
-            ...i,
-            ref: u,
-            className: g(
+            ...r,
+            ref: w,
+            className: f(
               "dgs-ui-kit-bg-transparent focus:dgs-ui-kit-outline-none dgs-ui-kit-flex-1",
-              r === "rtl" ? "dgs-ui-kit-text-right" : "!dgs-ui-kit-text-left",
-              p === "rtl" ? "placeholder:dgs-ui-kit-text-right" : "placeholder:dgs-ui-kit-text-left",
+              i === "rtl" ? "dgs-ui-kit-text-right" : "!dgs-ui-kit-text-left",
+              x === "rtl" ? "placeholder:dgs-ui-kit-text-right" : "placeholder:dgs-ui-kit-text-left",
               {
-                ss02: i.type != "password"
+                ss02: r.type != "password"
               },
-              l.className
+              n.className
             ),
-            ...r === "ltr" ? { style: { direction: "ltr" } } : {},
-            value: s,
-            onChange: x,
-            type: h
-          }
-        ),
-        f && s && s.length > 0 && /* @__PURE__ */ e(
-          "button",
-          {
-            onClick: () => {
-              k(""), typeof c == "function" && c();
-            },
-            children: /* @__PURE__ */ e(
-              I,
-              {
-                className: "dgs-ui-kit-text-gray-600",
-                width: 20,
-                height: 20
-              }
-            )
+            ...i === "ltr" ? { style: { direction: "ltr" } } : {},
+            value: l,
+            onChange: s,
+            type: u
           }
         ),
-        d && /* @__PURE__ */ e("span", { className: "dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500", children: d }),
-        o && /* @__PURE__ */ e("div", { className: "dgs-ui-kit-text-gray-600", children: o }),
-        i.type === "password" && /* @__PURE__ */ e(
+        h && l && l.length > 0 && i === "rtl" && p(m),
+        c && /* @__PURE__ */ t("span", { className: "dgs-ui-kit-font-p1-regular dgs-ui-kit-text-gray-500", children: c }),
+        a && /* @__PURE__ */ t("div", { className: "dgs-ui-kit-text-gray-600", children: a }),
+        r.type === "password" && /* @__PURE__ */ t(
           "button",
           {
-            onClick: () => w((C) => C === "text" ? "password" : "text"),
+            onClick: () => k((v) => v === "text" ? "password" : "text"),
             className: "dgs-ui-kit-text-gray-600",
-            children: h === "password" ? /* @__PURE__ */ e(
-              M,
+            children: u === "password" ? /* @__PURE__ */ t(
+              z,
               {
                 width: 20,
                 height: 20
               }
-            ) : /* @__PURE__ */ e(
-              z,
+            ) : /* @__PURE__ */ t(
+              B,
               {
                 width: 20,
                 height: 20
@@ -168,5 +172,5 @@ const I = (t) => /* @__PURE__ */ n(
   );
 });
 export {
-  T as default
+  j as default
 };

package/dist/Form/OtpInput/index.cjs

@@ -1 +1 @@
-"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),h=require("../../clsx-C11secjj.cjs"),k=require("react"),q=require("../Input/index.cjs"),m=require("../../TextFieldWrapper-BC0mP63G.cjs");;/* empty css                      */const v=y=>{const{inputsNumber:o=4,onChange:p,onEnd:f,className:I,inputsContainerClassName:j,labelContent:g,hintMessage:d,errorMessage:c,isError:w,value:i}=y,[r,a]=k.useState([]);function u(s){const e=document.getElementById(`dgs-ui-kit-otp-input-${s}`);e?.focus(),e?.select()}function C(s,e){const t=[s.code,s.key];if(t.includes("Backspace")||t.includes("Delete")){const n=[...r];n[e]="",e!==0&&(n[e-1]="",u(e-1)),a(n)}else t.includes("ArrowLeft")?u(e+1):t.includes("ArrowRight")&&u(e-1)}function N(s,e){const t=s.currentTarget.value,n=[...r];n[e]=t,e+1!==o&&t&&u(e+1),a(n),typeof p=="function"&&p(n.join(""))}return k.useEffect(()=>{if(i){const s=i.split("");a(s);const e=o===i.length;u(i.length),e&&typeof f=="function"&&f(i)}},[i]),l.jsxs("div",{className:h.clsx("dgs-ui-kit-space-y-2",I),children:[g?l.jsx(m.FieldLabel,{labelContent:g}):null,l.jsx("div",{className:h.clsx("dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2",j),children:Array.from(Array(o).keys()).map((s,e)=>l.jsx(q,{containerClassName:"dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",className:"dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",placeholder:"-",type:"tel",autoFocus:e===0,onChange:t=>N(t,e),onKeyUp:t=>C(t,e),id:`dgs-ui-kit-otp-input-${e}`,maxLength:1,value:r[e],showMaxLength:!1,isError:!!c||w},s))}),c||d?l.jsx(m.FieldBottomInfo,{errorMessage:c,hintMessage:d}):null]})};module.exports=v;
+"use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),k=require("../../clsx-C11secjj.cjs"),y=require("react"),E=require("../Input/index.cjs"),m=require("../../TextFieldWrapper-BC0mP63G.cjs");;/* empty css                      */const F=j=>{const{inputsNumber:c=4,onChange:o,onEnd:r,className:C,inputsContainerClassName:I,labelContent:d,hintMessage:h,errorMessage:f,isError:v,value:n}=j,[a,p]=y.useState([]);function u(i){const e=document.getElementById(`dgs-ui-kit-otp-input-${i}`);e?.focus(),e?.select()}function w(i,e){const t=[i.code,i.key];if(t.includes("Backspace")||t.includes("Delete")){const s=[...a];s[e]="",e!==0&&(s[e-1]="",u(e-1)),p(s)}else t.includes("ArrowLeft")?u(e+1):t.includes("ArrowRight")&&u(e-1);t.includes(a[e])&&u(e)}function N(i,e){const t=i.currentTarget.value,s=[...a];t.length>1?t.split("").forEach((g,q)=>s[q]=g):s[e]=t,e+1!==c&&t?u(e+1):typeof r=="function"&&s.every(g=>!!g)&&((typeof o=="function"&&!n||typeof o!="function"&&n||typeof o!="function"&&!n||n!==s.join(""))&&r(s.join("")),u(c-1)),p(s),typeof o=="function"&&o(s.join(""))}return y.useEffect(()=>{if(n){const i=n.split("");p(i);const e=c===n.length;u(n.length),e&&typeof r=="function"&&r(n)}},[n]),l.jsxs("div",{className:k.clsx("dgs-ui-kit-space-y-2",C),children:[d?l.jsx(m.FieldLabel,{labelContent:d}):null,l.jsx("div",{className:k.clsx("dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2",I),children:Array.from(Array(c).keys()).map((i,e)=>l.jsx(E,{containerClassName:"dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",className:"dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",placeholder:"-",type:"tel",autoFocus:e===0,onChange:t=>N(t,e),onKeyUp:t=>w(t,e),id:`dgs-ui-kit-otp-input-${e}`,value:a[e],showMaxLength:!1,isError:!!f||v,autoComplete:"off"},i))}),f||h?l.jsx(m.FieldBottomInfo,{errorMessage:f,hintMessage:h}):null]})};module.exports=F;

package/dist/Form/OtpInput/index.d.ts

@@ -1,6 +1,6 @@
 import { FC } from 'react';
 import { TextFieldBaseProps } from '../Wrappers/TextFieldWrapper/TextFieldWrapper';
-interface OtpInputProps extends Pick<TextFieldBaseProps, 'labelContent' | 'errorMessage' | 'isError' | 'hintMessage'> {
+export interface OtpInputProps extends Pick<TextFieldBaseProps, 'labelContent' | 'errorMessage' | 'isError' | 'hintMessage'> {
     inputsNumber?: number;
     onChange?: (value: string) => void;
     onEnd?: (value: string) => void;

package/dist/Form/OtpInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/OtpInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAyC,KAAK,EAAE,EAAsB,MAAM,OAAO,CAAC;AAI3F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AACxF,OAAO,kBAAkB,CAAC;AAE1B,UAAU,aACR,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,cAAc,GAAG,SAAS,GAAG,aAAa,CAAC;IAC7F,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA4F/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/OtpInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAyC,KAAK,EAAE,EAAsB,MAAM,OAAO,CAAC;AAI3F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+CAA+C,CAAC;AACxF,OAAO,kBAAkB,CAAC;AAE1B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,GAAG,cAAc,GAAG,SAAS,GAAG,aAAa,CAAC;IAC7F,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA6G/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/dist/Form/OtpInput/index.js

@@ -1,83 +1,84 @@
 "use client";
-import { jsxs as N, jsx as l } from "react/jsx-runtime";
-import { c as d } from "../../clsx-OuTLNxxd.js";
-import { useState as v, useEffect as V } from "react";
-import E from "../Input/index.js";
+import { jsxs as E, jsx as r } from "react/jsx-runtime";
+import { c as h } from "../../clsx-OuTLNxxd.js";
+import { useState as V, useEffect as j } from "react";
+import B from "../Input/index.js";
 import { F, a as A } from "../../TextFieldWrapper-Dva9vxfn.js";
 import '../../assets/styles.css';/* empty css                    */
-const O = (h) => {
+const U = (k) => {
   const {
     inputsNumber: u = 4,
-    onChange: p,
-    onEnd: f,
-    className: k,
-    inputsContainerClassName: y,
-    labelContent: g,
-    hintMessage: m,
-    errorMessage: a,
+    onChange: l,
+    onEnd: a,
+    className: y,
+    inputsContainerClassName: C,
+    labelContent: m,
+    hintMessage: d,
+    errorMessage: f,
     isError: I,
-    value: n
-  } = h, [r, c] = v([]);
-  function o(s) {
-    const t = document.getElementById(`dgs-ui-kit-otp-input-${s}`);
-    t?.focus(), t?.select();
+    value: o
+  } = k, [c, p] = V([]);
+  function n(i) {
+    const e = document.getElementById(`dgs-ui-kit-otp-input-${i}`);
+    e?.focus(), e?.select();
   }
-  function w(s, t) {
-    const e = [s.code, s.key];
-    if (e.includes("Backspace") || e.includes("Delete")) {
-      const i = [...r];
-      i[t] = "", t !== 0 && (i[t - 1] = "", o(t - 1)), c(i);
-    } else e.includes("ArrowLeft") ? o(t + 1) : e.includes("ArrowRight") && o(t - 1);
+  function v(i, e) {
+    const t = [i.code, i.key];
+    if (t.includes("Backspace") || t.includes("Delete")) {
+      const s = [...c];
+      s[e] = "", e !== 0 && (s[e - 1] = "", n(e - 1)), p(s);
+    } else t.includes("ArrowLeft") ? n(e + 1) : t.includes("ArrowRight") && n(e - 1);
+    t.includes(c[e]) && n(e);
   }
-  function C(s, t) {
-    const e = s.currentTarget.value, i = [...r];
-    i[t] = e, t + 1 !== u && e && o(t + 1), c(i), typeof p == "function" && p(i.join(""));
+  function w(i, e) {
+    const t = i.currentTarget.value, s = [...c];
+    t.length > 1 ? t.split("").forEach((g, N) => s[N] = g) : s[e] = t, e + 1 !== u && t ? n(e + 1) : typeof a == "function" && s.every((g) => !!g) && ((typeof l == "function" && !o || typeof l != "function" && o || typeof l != "function" && !o || o !== s.join("")) && a(s.join("")), n(u - 1)), p(s), typeof l == "function" && l(s.join(""));
   }
-  return V(() => {
-    if (n) {
-      const s = n.split("");
-      c(s);
-      const t = u === n.length;
-      o(n.length), t && typeof f == "function" && f(n);
+  return j(() => {
+    if (o) {
+      const i = o.split("");
+      p(i);
+      const e = u === o.length;
+      n(o.length), e && typeof a == "function" && a(o);
     }
-  }, [n]), /* @__PURE__ */ N("div", { className: d("dgs-ui-kit-space-y-2", k), children: [
-    g ? /* @__PURE__ */ l(F, { labelContent: g }) : null,
-    /* @__PURE__ */ l(
+  }, [o]), /* @__PURE__ */ E("div", { className: h("dgs-ui-kit-space-y-2", y), children: [
+    m ? /* @__PURE__ */ r(F, { labelContent: m }) : null,
+    /* @__PURE__ */ r(
       "div",
       {
-        className: d(
+        className: h(
           "dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2",
-          y
+          C
         ),
-        children: Array.from(Array(u).keys()).map((s, t) => /* @__PURE__ */ l(
-          E,
+        children: Array.from(Array(u).keys()).map((i, e) => /* @__PURE__ */ r(
+          B,
           {
             containerClassName: "dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",
             className: "dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",
             placeholder: "-",
             type: "tel",
-            autoFocus: t === 0,
-            onChange: (e) => C(e, t),
-            onKeyUp: (e) => w(e, t),
-            id: `dgs-ui-kit-otp-input-${t}`,
-            maxLength: 1,
-            value: r[t],
+            autoFocus: e === 0,
+            onChange: (t) => w(t, e),
+            onKeyUp: (t) => v(t, e),
+            id: `dgs-ui-kit-otp-input-${e}`,
+            value: c[e],
             showMaxLength: !1,
-            isError: !!a || I
+            isError: !!f || I,
+            autoComplete: "off"
           },
-          s
+          i
         ))
       }
     ),
-    a || m ? /* @__PURE__ */ l(
+    f || d ? /* @__PURE__ */ r(
       A,
       {
-        errorMessage: a,
-        hintMessage: m
+        errorMessage: f,
+        hintMessage: d
       }
     ) : null
   ] });
 };
 export {
-  O as default
+  U as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dgshahr/ui-kit",
-  "version": "0.0.27",
+  "version": "0.0.29",
   "description": "dgshahr ui-kit",
   "author": "dgshahr",
   "license": "MIT",