@dgshahr/ui-kit 0.0.39 → 0.0.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
- import { CSSProperties, FC, PropsWithChildren, ReactNode } from 'react';
2
- interface DrawerProps {
1
+ import { CSSProperties, FC, ReactNode } from 'react';
2
+ export interface DrawerProps {
3
3
  open: boolean;
4
4
  onClose: () => void;
5
5
  persist?: boolean;
@@ -20,7 +20,8 @@ interface DrawerProps {
20
20
  element?: ReactNode;
21
21
  containerClassName?: string;
22
22
  };
23
+ children?: ReactNode | undefined;
23
24
  }
24
- declare const Drawer: FC<PropsWithChildren<DrawerProps>>;
25
+ declare const Drawer: FC<DrawerProps>;
25
26
  export default Drawer;
26
27
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAGL,KAAK,aAAa,EAClB,KAAK,EAAE,EACP,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,kBAAkB,CAAC;AAM1B,UAAU,WAAW;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,aAAa,CAAC,EAAE,SAAS,CAAC;QAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;IACF,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,SAAS,CAAC;QACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;CACH;AAoBD,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAmI9C,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/Drawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,aAAa,EAAE,KAAK,EAAE,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACzF,OAAO,kBAAkB,CAAC;AAM1B,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,aAAa,CAAC,EAAE,OAAO,CAAC;QACxB,aAAa,CAAC,EAAE,SAAS,CAAC;QAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;IACF,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,SAAS,CAAC;QACpB,kBAAkB,CAAC,EAAE,MAAM,CAAC;KAC7B,CAAC;IACF,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAClC;AAoBD,QAAA,MAAM,MAAM,EAAE,EAAE,CAAC,WAAW,CAmI3B,CAAC;AAEF,eAAe,MAAM,CAAC"}
@@ -1 +1 @@
1
- "use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),k=require("../../clsx-C11secjj.cjs"),m=require("react"),E=require("../Input/index.cjs"),y=require("../../TextFieldWrapper-BbzQMKCb.cjs");;/* empty css */const F=j=>{const{inputsNumber:c=4,onChange:u,onEnd:r,className:C,inputsContainerClassName:I,labelContent:d,hintMessage:h,errorMessage:f,isError:v,value:n}=j,[a,p]=m.useState([]);function o(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]="",o(e-1)),p(s)}else t.includes("ArrowLeft")?o(e-1):t.includes("ArrowRight")&&o(e+1);t.includes(a[e])&&o(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?o(e+1):typeof r=="function"&&s.every(g=>!!g)&&((typeof u=="function"&&!n||typeof u!="function"&&n||typeof u!="function"&&!n||n!==s.join(""))&&r(s.join("")),o(c-1)),p(s),typeof u=="function"&&u(s.join(""))}return m.useEffect(()=>{if(n){const i=n.split("");p(i);const e=c===n.length;o(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(y.FieldLabel,{labelContent:d}):null,l.jsx("div",{className:k.clsx("dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2 [direction:ltr]",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",maxLength:1},i))}),f||h?l.jsx(y.FieldBottomInfo,{errorMessage:f,hintMessage:h}):null]})};module.exports=F;
1
+ "use client";"use strict";require('../../assets/styles.css');const l=require("react/jsx-runtime"),d=require("../../clsx-C11secjj.cjs"),q=require("react"),E=require("../Input/index.cjs"),h=require("../../TextFieldWrapper-BbzQMKCb.cjs");;/* empty css */const I=k=>{const{inputsNumber:u=4,onChange:a,onEnd:r,className:m,inputsContainerClassName:y,labelContent:p,hintMessage:f,errorMessage:c,isError:j,value:n}=k;function o(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 i=n.split("");i[e]="",e!==0&&(i[e-1]="",o(e-1)),a(i.join(""))}else t.includes("ArrowLeft")?o(e-1):t.includes("ArrowRight")&&o(e+1)}function w(s,e){const t=s.currentTarget.value,i=n.split("");t.length>1?t.split("").forEach((N,g)=>{g<u&&(i[g]=N)}):i[e]=t,a(i.join("")),e+1!==u&&t&&o(e+1)}return q.useEffect(()=>{n.length===u&&typeof r=="function"&&r(n)},[n,u,r]),l.jsxs("div",{className:d.clsx("dgs-ui-kit-space-y-2",m),children:[p?l.jsx(h.FieldLabel,{labelContent:p}):null,l.jsx("div",{className:d.clsx("dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2 [direction:ltr]",y),children:Array.from(Array(u).keys()).map((s,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=>w(t,e),onKeyUp:t=>C(t,e),id:`dgs-ui-kit-otp-input-${e}`,value:n[e]||"",showMaxLength:!1,isError:!!c||j,autoComplete:"off",maxLength:1},s))}),c||f?l.jsx(h.FieldBottomInfo,{errorMessage:c,hintMessage:f}):null]})};module.exports=I;
@@ -2,11 +2,11 @@ import { FC } from 'react';
2
2
  import { TextFieldBaseProps } from '../Wrappers/TextFieldWrapper/TextFieldWrapper';
3
3
  export interface OtpInputProps extends Pick<TextFieldBaseProps, 'labelContent' | 'errorMessage' | 'isError' | 'hintMessage'> {
4
4
  inputsNumber?: number;
5
- onChange?: (value: string) => void;
5
+ onChange: (value: string) => void;
6
6
  onEnd?: (value: string) => void;
7
7
  className?: string;
8
8
  inputsContainerClassName?: string;
9
- value?: string;
9
+ value: string;
10
10
  }
11
11
  declare const OtpInput: FC<OtpInputProps>;
12
12
  export default OtpInput;
@@ -1 +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,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,CA8G/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Form/OtpInput/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,KAAK,EAAE,EAAsB,MAAM,OAAO,CAAC;AAIjF,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,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,KAAK,EAAE,MAAM,CAAC;CACf;AAED,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CAoG/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
@@ -1,57 +1,53 @@
1
1
  "use client";
2
- import { jsxs as E, jsx as r } from "react/jsx-runtime";
3
- import { c as h } from "../../clsx-OuTLNxxd.js";
4
- import { useState as V, useEffect as j } from "react";
5
- import B from "../Input/index.js";
6
- import { F, a as A } from "../../TextFieldWrapper-D9d-4wo1.js";
2
+ import { jsxs as E, jsx as u } from "react/jsx-runtime";
3
+ import { c as m } from "../../clsx-OuTLNxxd.js";
4
+ import { useEffect as I } from "react";
5
+ import v from "../Input/index.js";
6
+ import { F as j, a as A } from "../../TextFieldWrapper-D9d-4wo1.js";
7
7
  import '../../assets/styles.css';/* empty css */
8
- const U = (k) => {
8
+ const K = (d) => {
9
9
  const {
10
- inputsNumber: u = 4,
11
- onChange: l,
10
+ inputsNumber: n = 4,
11
+ onChange: c,
12
12
  onEnd: a,
13
- className: y,
14
- inputsContainerClassName: C,
15
- labelContent: m,
16
- hintMessage: d,
17
- errorMessage: f,
18
- isError: I,
13
+ className: h,
14
+ inputsContainerClassName: k,
15
+ labelContent: p,
16
+ hintMessage: f,
17
+ errorMessage: r,
18
+ isError: y,
19
19
  value: o
20
- } = k, [c, p] = V([]);
21
- function n(i) {
22
- const t = document.getElementById(`dgs-ui-kit-otp-input-${i}`);
20
+ } = d;
21
+ function l(s) {
22
+ const t = document.getElementById(`dgs-ui-kit-otp-input-${s}`);
23
23
  t?.focus(), t?.select();
24
24
  }
25
- function v(i, t) {
26
- const e = [i.code, i.key];
25
+ function C(s, t) {
26
+ const e = [s.code, s.key];
27
27
  if (e.includes("Backspace") || e.includes("Delete")) {
28
- const s = [...c];
29
- s[t] = "", t !== 0 && (s[t - 1] = "", n(t - 1)), p(s);
30
- } else e.includes("ArrowLeft") ? n(t - 1) : e.includes("ArrowRight") && n(t + 1);
31
- e.includes(c[t]) && n(t);
28
+ const i = o.split("");
29
+ i[t] = "", t !== 0 && (i[t - 1] = "", l(t - 1)), c(i.join(""));
30
+ } else e.includes("ArrowLeft") ? l(t - 1) : e.includes("ArrowRight") && l(t + 1);
32
31
  }
33
- function w(i, t) {
34
- const e = i.currentTarget.value, s = [...c];
35
- e.length > 1 ? e.split("").forEach((g, N) => s[N] = g) : s[t] = e, t + 1 !== u && e ? n(t + 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(""));
32
+ function w(s, t) {
33
+ const e = s.currentTarget.value, i = o.split("");
34
+ e.length > 1 ? e.split("").forEach((N, g) => {
35
+ g < n && (i[g] = N);
36
+ }) : i[t] = e, c(i.join("")), t + 1 !== n && e && l(t + 1);
36
37
  }
37
- return j(() => {
38
- if (o) {
39
- const i = o.split("");
40
- p(i);
41
- const t = u === o.length;
42
- n(o.length), t && typeof a == "function" && a(o);
43
- }
44
- }, [o]), /* @__PURE__ */ E("div", { className: h("dgs-ui-kit-space-y-2", y), children: [
45
- m ? /* @__PURE__ */ r(F, { labelContent: m }) : null,
46
- /* @__PURE__ */ r(
38
+ return I(() => {
39
+ o.length === n && typeof a == "function" && a(o);
40
+ }, [o, n, a]), /* @__PURE__ */ E("div", { className: m("dgs-ui-kit-space-y-2", h), children: [
41
+ p ? /* @__PURE__ */ u(j, { labelContent: p }) : null,
42
+ /* @__PURE__ */ u(
47
43
  "div",
48
44
  {
49
- className: h(
45
+ className: m(
50
46
  "dgs-ui-kit-flex dgs-ui-kit-items-center dgs-ui-kit-gap-2 [direction:ltr]",
51
- C
47
+ k
52
48
  ),
53
- children: Array.from(Array(u).keys()).map((i, t) => /* @__PURE__ */ r(
54
- B,
49
+ children: Array.from(Array(n).keys()).map((s, t) => /* @__PURE__ */ u(
50
+ v,
55
51
  {
56
52
  containerClassName: "dgs-ui-kit-w-12 dgs-ui-kit-h-12 dgs-ui-kit-p-0",
57
53
  className: "dgs-ui-kit-w-full dgs-ui-kit-h-full !dgs-ui-kit-text-center placeholder:!dgs-ui-kit-text-center",
@@ -59,27 +55,27 @@ const U = (k) => {
59
55
  type: "tel",
60
56
  autoFocus: t === 0,
61
57
  onChange: (e) => w(e, t),
62
- onKeyUp: (e) => v(e, t),
58
+ onKeyUp: (e) => C(e, t),
63
59
  id: `dgs-ui-kit-otp-input-${t}`,
64
- value: c[t],
60
+ value: o[t] || "",
65
61
  showMaxLength: !1,
66
- isError: !!f || I,
62
+ isError: !!r || y,
67
63
  autoComplete: "off",
68
64
  maxLength: 1
69
65
  },
70
- i
66
+ s
71
67
  ))
72
68
  }
73
69
  ),
74
- f || d ? /* @__PURE__ */ r(
70
+ r || f ? /* @__PURE__ */ u(
75
71
  A,
76
72
  {
77
- errorMessage: f,
78
- hintMessage: d
73
+ errorMessage: r,
74
+ hintMessage: f
79
75
  }
80
76
  ) : null
81
77
  ] });
82
78
  };
83
79
  export {
84
- U as default
80
+ K as default
85
81
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dgshahr/ui-kit",
3
- "version": "0.0.39",
3
+ "version": "0.0.40",
4
4
  "description": "dgshahr ui-kit",
5
5
  "author": "dgshahr",
6
6
  "license": "MIT",