brd-ui-kit 0.1.84 → 0.1.86

package/dist/components-card-info-card-info.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./lib-utils.cjs"),i=require("./components-ui-card-card.cjs"),u=require("./components-ui-typography-typography.cjs");require("./components-ui-typography-typography.styles.cjs");const o=require("./components-card-info-card-info.styles.cjs"),l=({className:n,title:t,children:c,accent:a,size:s,...d})=>r.jsxs(i.Card,{className:e.cn(o.cardInfoVariants(),n?.card),...d,children:[r.jsx("div",{className:e.cn(o.cardInfoLeftBorderVariants({accent:a}),n?.borderLeft)}),r.jsx("div",{className:e.cn(o.cardInfoHeaderVariants({accent:a,size:s}),n?.headerBackground),children:r.jsx(u.Typography,{variant:"body-lg-semibold",children:t})}),r.jsx("div",{className:e.cn(o.cardInfoContentVariants(),n?.content),children:c})]});exports.CardInfo=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./lib-utils.cjs"),u=require("./components-ui-card-card.cjs"),l=require("./components-ui-typography-typography.cjs");require("./components-ui-typography-typography.styles.cjs");const o=require("./components-card-info-card-info.styles.cjs"),f=({className:n,title:c,headerComponent:a,children:s,accent:t,size:d,...i})=>r.jsxs(u.Card,{className:e.cn(o.cardInfoVariants(),n?.card),...i,children:[r.jsx("div",{className:e.cn(o.cardInfoLeftBorderVariants({accent:t}),n?.borderLeft)}),r.jsx("div",{className:e.cn(o.cardInfoHeaderVariants({accent:t,size:d}),n?.headerBackground),children:a||r.jsx(l.Typography,{variant:"body-lg-semibold",children:c})}),r.jsx("div",{className:e.cn(o.cardInfoContentVariants(),n?.content),children:s})]});exports.CardInfo=f;
 //# sourceMappingURL=components-card-info-card-info.cjs.map

package/dist/components-card-info-card-info.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components-card-info-card-info.cjs","sources":["../src/components/card-info/card-info.tsx"],"sourcesContent":["import type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { Card } from \"../ui/card\";\nimport { Typography } from \"../ui/typography\";\nimport {\n  cardInfoContentVariants,\n  cardInfoHeaderVariants,\n  cardInfoLeftBorderVariants,\n  cardInfoVariants,\n} from \"./card-info.styles\";\n\nexport interface CardInfoProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"className\">,\n    VariantProps<typeof cardInfoHeaderVariants> {\n  title: React.ReactNode;\n  children: React.ReactNode;\n  className?: {\n    borderLeft?: string;\n    headerBackground?: string;\n    card?: string;\n    content?: string;\n  };\n}\n\nexport const CardInfo = ({\n  className,\n  title,\n  children,\n  accent,\n  size,\n  ...props\n}: CardInfoProps) => {\n  return (\n    <Card\n      className={cn(cardInfoVariants(), className?.card)}\n      {...props}\n    >\n      <div\n        className={cn(cardInfoLeftBorderVariants({ accent }), className?.borderLeft)}\n      />\n\n      <div\n        className={cn(\n          cardInfoHeaderVariants({ accent, size }),\n          className?.headerBackground,\n        )}\n      >\n        <Typography variant=\"body-lg-semibold\">{title}</Typography>\n      </div>\n\n      <div className={cn(cardInfoContentVariants(), className?.content)}>{children}</div>\n    </Card>\n  );\n};\n"],"names":["CardInfo","className","title","children","accent","size","props","jsxs","Card","cn","cardInfoVariants","jsx","cardInfoLeftBorderVariants","cardInfoHeaderVariants","Typography","cardInfoContentVariants"],"mappings":"+WAyBaA,EAAW,CAAC,CACvB,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,OAAAC,EACA,KAAAC,EACA,GAAGC,CACL,IAEIC,EAAAA,KAACC,EAAAA,KAAA,CACC,UAAWC,EAAAA,GAAGC,EAAAA,mBAAoBT,GAAW,IAAI,EAChD,GAAGK,EAEJ,SAAA,CAAAK,EAAAA,IAAC,MAAA,CACC,UAAWF,EAAAA,GAAGG,EAAAA,2BAA2B,CAAE,OAAAR,EAAQ,EAAGH,GAAW,UAAU,CAAA,CAAA,EAG7EU,EAAAA,IAAC,MAAA,CACC,UAAWF,EAAAA,GACTI,yBAAuB,CAAE,OAAAT,EAAQ,KAAAC,EAAM,EACvCJ,GAAW,gBAAA,EAGb,SAAAU,EAAAA,IAACG,aAAA,CAAW,QAAQ,mBAAoB,SAAAZ,CAAA,CAAM,CAAA,CAAA,EAGhDS,MAAC,OAAI,UAAWF,EAAAA,GAAGM,EAAAA,0BAA2Bd,GAAW,OAAO,EAAI,SAAAE,CAAA,CAAS,CAAA,CAAA,CAAA"}
+{"version":3,"file":"components-card-info-card-info.cjs","sources":["../src/components/card-info/card-info.tsx"],"sourcesContent":["import type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { Card } from \"../ui/card\";\nimport { Typography } from \"../ui/typography\";\nimport {\n  cardInfoContentVariants,\n  cardInfoHeaderVariants,\n  cardInfoLeftBorderVariants,\n  cardInfoVariants,\n} from \"./card-info.styles\";\n\nexport interface CardInfoProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"className\">,\n    VariantProps<typeof cardInfoHeaderVariants> {\n  title: string;\n  headerComponent?: React.ReactNode;\n  children: React.ReactNode;\n  className?: {\n    borderLeft?: string;\n    headerBackground?: string;\n    card?: string;\n    content?: string;\n  };\n}\n\nexport const CardInfo = ({\n  className,\n  title,\n  headerComponent,\n  children,\n  accent,\n  size,\n  ...props\n}: CardInfoProps) => {\n  return (\n    <Card\n      className={cn(cardInfoVariants(), className?.card)}\n      {...props}\n    >\n      <div\n        className={cn(cardInfoLeftBorderVariants({ accent }), className?.borderLeft)}\n      />\n\n      <div\n        className={cn(\n          cardInfoHeaderVariants({ accent, size }),\n          className?.headerBackground,\n        )}\n      >\n        {headerComponent ? (\n          headerComponent\n        ) : (\n          <Typography variant=\"body-lg-semibold\">{title}</Typography>\n        )}\n      </div>\n\n      <div className={cn(cardInfoContentVariants(), className?.content)}>{children}</div>\n    </Card>\n  );\n};\n"],"names":["CardInfo","className","title","headerComponent","children","accent","size","props","jsxs","Card","cn","cardInfoVariants","jsx","cardInfoLeftBorderVariants","cardInfoHeaderVariants","Typography","cardInfoContentVariants"],"mappings":"+WA0BaA,EAAW,CAAC,CACvB,UAAAC,EACA,MAAAC,EACA,gBAAAC,EACA,SAAAC,EACA,OAAAC,EACA,KAAAC,EACA,GAAGC,CACL,IAEIC,EAAAA,KAACC,EAAAA,KAAA,CACC,UAAWC,EAAAA,GAAGC,EAAAA,mBAAoBV,GAAW,IAAI,EAChD,GAAGM,EAEJ,SAAA,CAAAK,EAAAA,IAAC,MAAA,CACC,UAAWF,EAAAA,GAAGG,EAAAA,2BAA2B,CAAE,OAAAR,EAAQ,EAAGJ,GAAW,UAAU,CAAA,CAAA,EAG7EW,EAAAA,IAAC,MAAA,CACC,UAAWF,EAAAA,GACTI,yBAAuB,CAAE,OAAAT,EAAQ,KAAAC,EAAM,EACvCL,GAAW,gBAAA,EAGZ,YAGCW,MAACG,EAAAA,WAAA,CAAW,QAAQ,mBAAoB,SAAAb,CAAA,CAAM,CAAA,CAAA,EAIlDU,MAAC,OAAI,UAAWF,EAAAA,GAAGM,EAAAA,0BAA2Bf,GAAW,OAAO,EAAI,SAAAG,CAAA,CAAS,CAAA,CAAA,CAAA"}

package/dist/components-card-info-card-info.js

@@ -1,43 +1,44 @@
 import { jsxs as m, jsx as o } from "react/jsx-runtime";
 import { cn as a } from "./lib-utils.js";
-import { Card as f } from "./components-ui-card-card.js";
-import { Typography as c } from "./components-ui-typography-typography.js";
+import { Card as c } from "./components-ui-card-card.js";
+import { Typography as s } from "./components-ui-typography-typography.js";
 import "./components-ui-typography-typography.styles.js";
-import { cardInfoLeftBorderVariants as s, cardInfoHeaderVariants as p, cardInfoContentVariants as l, cardInfoVariants as h } from "./components-card-info-card-info.styles.js";
-const y = ({
+import { cardInfoLeftBorderVariants as p, cardInfoHeaderVariants as l, cardInfoContentVariants as I, cardInfoVariants as h } from "./components-card-info-card-info.styles.js";
+const j = ({
   className: r,
   title: n,
+  headerComponent: d,
   children: t,
-  accent: d,
-  size: i,
-  ...e
+  accent: i,
+  size: e,
+  ...f
 }) => /* @__PURE__ */ m(
-  f,
+  c,
   {
     className: a(h(), r?.card),
-    ...e,
+    ...f,
     children: [
       /* @__PURE__ */ o(
         "div",
         {
-          className: a(s({ accent: d }), r?.borderLeft)
+          className: a(p({ accent: i }), r?.borderLeft)
         }
       ),
       /* @__PURE__ */ o(
         "div",
         {
           className: a(
-            p({ accent: d, size: i }),
+            l({ accent: i, size: e }),
             r?.headerBackground
           ),
-          children: /* @__PURE__ */ o(c, { variant: "body-lg-semibold", children: n })
+          children: d || /* @__PURE__ */ o(s, { variant: "body-lg-semibold", children: n })
         }
       ),
-      /* @__PURE__ */ o("div", { className: a(l(), r?.content), children: t })
+      /* @__PURE__ */ o("div", { className: a(I(), r?.content), children: t })
     ]
   }
 );
 export {
-  y as CardInfo
+  j as CardInfo
 };
 //# sourceMappingURL=components-card-info-card-info.js.map

package/dist/components-card-info-card-info.js.map

@@ -1 +1 @@
-{"version":3,"file":"components-card-info-card-info.js","sources":["../src/components/card-info/card-info.tsx"],"sourcesContent":["import type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { Card } from \"../ui/card\";\nimport { Typography } from \"../ui/typography\";\nimport {\n  cardInfoContentVariants,\n  cardInfoHeaderVariants,\n  cardInfoLeftBorderVariants,\n  cardInfoVariants,\n} from \"./card-info.styles\";\n\nexport interface CardInfoProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"className\">,\n    VariantProps<typeof cardInfoHeaderVariants> {\n  title: React.ReactNode;\n  children: React.ReactNode;\n  className?: {\n    borderLeft?: string;\n    headerBackground?: string;\n    card?: string;\n    content?: string;\n  };\n}\n\nexport const CardInfo = ({\n  className,\n  title,\n  children,\n  accent,\n  size,\n  ...props\n}: CardInfoProps) => {\n  return (\n    <Card\n      className={cn(cardInfoVariants(), className?.card)}\n      {...props}\n    >\n      <div\n        className={cn(cardInfoLeftBorderVariants({ accent }), className?.borderLeft)}\n      />\n\n      <div\n        className={cn(\n          cardInfoHeaderVariants({ accent, size }),\n          className?.headerBackground,\n        )}\n      >\n        <Typography variant=\"body-lg-semibold\">{title}</Typography>\n      </div>\n\n      <div className={cn(cardInfoContentVariants(), className?.content)}>{children}</div>\n    </Card>\n  );\n};\n"],"names":["CardInfo","className","title","children","accent","size","props","jsxs","Card","cn","cardInfoVariants","jsx","cardInfoLeftBorderVariants","cardInfoHeaderVariants","Typography","cardInfoContentVariants"],"mappings":";;;;;;AAyBO,MAAMA,IAAW,CAAC;AAAA,EACvB,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAGC,KAAoBT,GAAW,IAAI;AAAA,IAChD,GAAGK;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF,EAAGG,EAA2B,EAAE,QAAAR,GAAQ,GAAGH,GAAW,UAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAG7E,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF;AAAA,YACTI,EAAuB,EAAE,QAAAT,GAAQ,MAAAC,GAAM;AAAA,YACvCJ,GAAW;AAAA,UAAA;AAAA,UAGb,UAAA,gBAAAU,EAACG,GAAA,EAAW,SAAQ,oBAAoB,UAAAZ,EAAA,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,MAGhD,gBAAAS,EAAC,SAAI,WAAWF,EAAGM,KAA2Bd,GAAW,OAAO,GAAI,UAAAE,EAAA,CAAS;AAAA,IAAA;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"components-card-info-card-info.js","sources":["../src/components/card-info/card-info.tsx"],"sourcesContent":["import type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils\";\nimport { Card } from \"../ui/card\";\nimport { Typography } from \"../ui/typography\";\nimport {\n  cardInfoContentVariants,\n  cardInfoHeaderVariants,\n  cardInfoLeftBorderVariants,\n  cardInfoVariants,\n} from \"./card-info.styles\";\n\nexport interface CardInfoProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, \"title\" | \"className\">,\n    VariantProps<typeof cardInfoHeaderVariants> {\n  title: string;\n  headerComponent?: React.ReactNode;\n  children: React.ReactNode;\n  className?: {\n    borderLeft?: string;\n    headerBackground?: string;\n    card?: string;\n    content?: string;\n  };\n}\n\nexport const CardInfo = ({\n  className,\n  title,\n  headerComponent,\n  children,\n  accent,\n  size,\n  ...props\n}: CardInfoProps) => {\n  return (\n    <Card\n      className={cn(cardInfoVariants(), className?.card)}\n      {...props}\n    >\n      <div\n        className={cn(cardInfoLeftBorderVariants({ accent }), className?.borderLeft)}\n      />\n\n      <div\n        className={cn(\n          cardInfoHeaderVariants({ accent, size }),\n          className?.headerBackground,\n        )}\n      >\n        {headerComponent ? (\n          headerComponent\n        ) : (\n          <Typography variant=\"body-lg-semibold\">{title}</Typography>\n        )}\n      </div>\n\n      <div className={cn(cardInfoContentVariants(), className?.content)}>{children}</div>\n    </Card>\n  );\n};\n"],"names":["CardInfo","className","title","headerComponent","children","accent","size","props","jsxs","Card","cn","cardInfoVariants","jsx","cardInfoLeftBorderVariants","cardInfoHeaderVariants","Typography","cardInfoContentVariants"],"mappings":";;;;;;AA0BO,MAAMA,IAAW,CAAC;AAAA,EACvB,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC;AAAA,EACA,GAAGC;AACL,MAEI,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAGC,KAAoBV,GAAW,IAAI;AAAA,IAChD,GAAGM;AAAA,IAEJ,UAAA;AAAA,MAAA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF,EAAGG,EAA2B,EAAE,QAAAR,GAAQ,GAAGJ,GAAW,UAAU;AAAA,QAAA;AAAA,MAAA;AAAA,MAG7E,gBAAAW;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWF;AAAA,YACTI,EAAuB,EAAE,QAAAT,GAAQ,MAAAC,GAAM;AAAA,YACvCL,GAAW;AAAA,UAAA;AAAA,UAGZ,eAGC,gBAAAW,EAACG,GAAA,EAAW,SAAQ,oBAAoB,UAAAb,EAAA,CAAM;AAAA,QAAA;AAAA,MAAA;AAAA,MAIlD,gBAAAU,EAAC,SAAI,WAAWF,EAAGM,KAA2Bf,GAAW,OAAO,GAAI,UAAAG,EAAA,CAAS;AAAA,IAAA;AAAA,EAAA;AAAA;"}

package/dist/components-forms-form-Input-phone.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),x=require("./utils-get-validation-state.cjs"),y=require("react"),a=require("./index.esm-ZdO9UZ3G.cjs"),R=require("./components-input-phone-input-phone.cjs"),j="+{7} (000) 000-00-00",A="+7 (000) 000-00-00",r=t=>t.replace(/\D/g,"").length>1,I=({name:t,rules:d,mask:p=j,placeholder:h=A,...o})=>{const[P,i]=y.useState(!1),{control:g,formState:{errors:S,touchedFields:f,isSubmitted:m}}=a.useFormContext();return l.jsx(a.Controller,{name:t,rules:d,control:g,render:({field:{onChange:u,onBlur:F,value:n="",ref:_}})=>{const s=typeof n=="string"?n:String(n??""),[E,q]=x.getValidationState(t,s,S,f,m),c=P||r(s);return l.jsx(R.InputPhone,{...o,name:t,mask:p,unmask:!1,lazy:!c,value:s,type:"tel",inputRef:_,onAccept:e=>{u(r(e)?e:"")},onFocus:e=>{i(!0),o.onFocus?.(e)},onBlur:e=>{r(e.currentTarget.value)||u(""),i(!1),F(),o.onBlur?.(e)},isValid:E,description:q,placeholder:c?void 0:h})}})};exports.FormInputPhone=I;
+//# sourceMappingURL=components-forms-form-Input-phone.cjs.map

package/dist/components-forms-form-Input-phone.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-Input-phone.cjs","sources":["../src/components/forms/form-Input-phone.tsx"],"sourcesContent":["import { getValidationState } from \"@/utils/get-validation-state\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext, type RegisterOptions } from \"react-hook-form\";\nimport type { InputProps } from \"../input-field\";\nimport { InputPhone } from \"../input-phone\";\n\nconst PHONE_MASK_PATTERN = \"+{7} (000) 000-00-00\";\nconst PHONE_PLACEHOLDER = \"+7 (000) 000-00-00\";\nconst hasEnteredPhoneDigits = (value: string) => value.replace(/\\D/g, \"\").length > 1;\n\ntype Props = Omit<InputProps, \"value\" | \"onChange\" | \"ref\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n  mask?: string;\n};\n\n// TODO: Доделать\nexport const FormInputPhone = ({\n  name,\n  rules,\n  mask = PHONE_MASK_PATTERN,\n  placeholder = PHONE_PLACEHOLDER,\n  ...rest\n}: Props) => {\n  const [isFocused, setIsFocused] = useState(false);\n  const {\n    control,\n    formState: { errors, touchedFields, isSubmitted },\n  } = useFormContext();\n\n  return (\n    <Controller\n      name={name}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, onBlur, value = \"\", ref } }) => {\n        const inputValue = typeof value === \"string\" ? value : String(value ?? \"\");\n        const [isValid, errorMsg] = getValidationState(\n          name,\n          inputValue,\n          errors,\n          touchedFields,\n          isSubmitted,\n        );\n        const shouldShowMask = isFocused || hasEnteredPhoneDigits(inputValue);\n\n        return (\n          <InputPhone\n            {...rest}\n            name={name}\n            mask={mask}\n            unmask={false}\n            lazy={!shouldShowMask}\n            value={inputValue}\n            type=\"tel\"\n            inputRef={ref}\n            onAccept={(val: string) => {\n              onChange(hasEnteredPhoneDigits(val) ? val : \"\");\n            }}\n            onFocus={(event: React.FocusEvent<HTMLInputElement>) => {\n              setIsFocused(true);\n              rest.onFocus?.(event);\n            }}\n            onBlur={(event: React.FocusEvent<HTMLInputElement>) => {\n              if (!hasEnteredPhoneDigits(event.currentTarget.value)) {\n                onChange(\"\");\n              }\n              setIsFocused(false);\n              onBlur();\n              rest.onBlur?.(event);\n            }}\n            isValid={isValid}\n            description={errorMsg}\n            placeholder={shouldShowMask ? undefined : placeholder}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["PHONE_MASK_PATTERN","PHONE_PLACEHOLDER","hasEnteredPhoneDigits","value","FormInputPhone","name","rules","mask","placeholder","rest","isFocused","setIsFocused","useState","control","errors","touchedFields","isSubmitted","useFormContext","jsx","Controller","onChange","onBlur","ref","inputValue","isValid","errorMsg","getValidationState","shouldShowMask","InputPhone","val","event"],"mappings":"kRAMMA,EAAqB,uBACrBC,EAAoB,qBACpBC,EAAyBC,GAAkBA,EAAM,QAAQ,MAAO,EAAE,EAAE,OAAS,EAUtEC,EAAiB,CAAC,CAC7B,KAAAC,EACA,MAAAC,EACA,KAAAC,EAAOP,EACP,YAAAQ,EAAcP,EACd,GAAGQ,CACL,IAAa,CACX,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAC1C,CACJ,QAAAC,EACA,UAAW,CAAE,OAAAC,EAAQ,cAAAC,EAAe,YAAAC,CAAA,CAAY,EAC9CC,iBAAA,EAEJ,OACEC,EAAAA,IAACC,EAAAA,WAAA,CACC,KAAAd,EACA,MAAAC,EACA,QAAAO,EACA,OAAQ,CAAC,CAAE,MAAO,CAAE,SAAAO,EAAU,OAAAC,EAAQ,MAAAlB,EAAQ,GAAI,IAAAmB,CAAA,KAAY,CAC5D,MAAMC,EAAa,OAAOpB,GAAU,SAAWA,EAAQ,OAAOA,GAAS,EAAE,EACnE,CAACqB,EAASC,CAAQ,EAAIC,EAAAA,mBAC1BrB,EACAkB,EACAT,EACAC,EACAC,CAAA,EAEIW,EAAiBjB,GAAaR,EAAsBqB,CAAU,EAEpE,OACEL,EAAAA,IAACU,EAAAA,WAAA,CACE,GAAGnB,EACJ,KAAAJ,EACA,KAAAE,EACA,OAAQ,GACR,KAAM,CAACoB,EACP,MAAOJ,EACP,KAAK,MACL,SAAUD,EACV,SAAWO,GAAgB,CACzBT,EAASlB,EAAsB2B,CAAG,EAAIA,EAAM,EAAE,CAChD,EACA,QAAUC,GAA8C,CACtDnB,EAAa,EAAI,EACjBF,EAAK,UAAUqB,CAAK,CACtB,EACA,OAASA,GAA8C,CAChD5B,EAAsB4B,EAAM,cAAc,KAAK,GAClDV,EAAS,EAAE,EAEbT,EAAa,EAAK,EAClBU,EAAA,EACAZ,EAAK,SAASqB,CAAK,CACrB,EACA,QAAAN,EACA,YAAaC,EACb,YAAaE,EAAiB,OAAYnB,CAAA,CAAA,CAGhD,CAAA,CAAA,CAGN"}

package/dist/components-forms-form-Input-phone.js

@@ -0,0 +1,63 @@
+import { jsx as l } from "react/jsx-runtime";
+import { getValidationState as x } from "./utils-get-validation-state.js";
+import { useState as y } from "react";
+import { a as C, C as D } from "./index.esm-CFsbc_Iq.js";
+import { InputPhone as H } from "./components-input-phone-input-phone.js";
+const I = "+{7} (000) 000-00-00", M = "+7 (000) 000-00-00", n = (t) => t.replace(/\D/g, "").length > 1, _ = ({
+  name: t,
+  rules: a,
+  mask: p = I,
+  placeholder: d = M,
+  ...r
+}) => {
+  const [f, i] = y(!1), {
+    control: m,
+    formState: { errors: h, touchedFields: g, isSubmitted: F }
+  } = C();
+  return /* @__PURE__ */ l(
+    D,
+    {
+      name: t,
+      rules: a,
+      control: m,
+      render: ({ field: { onChange: c, onBlur: P, value: e = "", ref: S } }) => {
+        const s = typeof e == "string" ? e : String(e ?? ""), [E, A] = x(
+          t,
+          s,
+          h,
+          g,
+          F
+        ), u = f || n(s);
+        return /* @__PURE__ */ l(
+          H,
+          {
+            ...r,
+            name: t,
+            mask: p,
+            unmask: !1,
+            lazy: !u,
+            value: s,
+            type: "tel",
+            inputRef: S,
+            onAccept: (o) => {
+              c(n(o) ? o : "");
+            },
+            onFocus: (o) => {
+              i(!0), r.onFocus?.(o);
+            },
+            onBlur: (o) => {
+              n(o.currentTarget.value) || c(""), i(!1), P(), r.onBlur?.(o);
+            },
+            isValid: E,
+            description: A,
+            placeholder: u ? void 0 : d
+          }
+        );
+      }
+    }
+  );
+};
+export {
+  _ as FormInputPhone
+};
+//# sourceMappingURL=components-forms-form-Input-phone.js.map

package/dist/components-forms-form-Input-phone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-Input-phone.js","sources":["../src/components/forms/form-Input-phone.tsx"],"sourcesContent":["import { getValidationState } from \"@/utils/get-validation-state\";\nimport { useState } from \"react\";\nimport { Controller, useFormContext, type RegisterOptions } from \"react-hook-form\";\nimport type { InputProps } from \"../input-field\";\nimport { InputPhone } from \"../input-phone\";\n\nconst PHONE_MASK_PATTERN = \"+{7} (000) 000-00-00\";\nconst PHONE_PLACEHOLDER = \"+7 (000) 000-00-00\";\nconst hasEnteredPhoneDigits = (value: string) => value.replace(/\\D/g, \"\").length > 1;\n\ntype Props = Omit<InputProps, \"value\" | \"onChange\" | \"ref\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n  mask?: string;\n};\n\n// TODO: Доделать\nexport const FormInputPhone = ({\n  name,\n  rules,\n  mask = PHONE_MASK_PATTERN,\n  placeholder = PHONE_PLACEHOLDER,\n  ...rest\n}: Props) => {\n  const [isFocused, setIsFocused] = useState(false);\n  const {\n    control,\n    formState: { errors, touchedFields, isSubmitted },\n  } = useFormContext();\n\n  return (\n    <Controller\n      name={name}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, onBlur, value = \"\", ref } }) => {\n        const inputValue = typeof value === \"string\" ? value : String(value ?? \"\");\n        const [isValid, errorMsg] = getValidationState(\n          name,\n          inputValue,\n          errors,\n          touchedFields,\n          isSubmitted,\n        );\n        const shouldShowMask = isFocused || hasEnteredPhoneDigits(inputValue);\n\n        return (\n          <InputPhone\n            {...rest}\n            name={name}\n            mask={mask}\n            unmask={false}\n            lazy={!shouldShowMask}\n            value={inputValue}\n            type=\"tel\"\n            inputRef={ref}\n            onAccept={(val: string) => {\n              onChange(hasEnteredPhoneDigits(val) ? val : \"\");\n            }}\n            onFocus={(event: React.FocusEvent<HTMLInputElement>) => {\n              setIsFocused(true);\n              rest.onFocus?.(event);\n            }}\n            onBlur={(event: React.FocusEvent<HTMLInputElement>) => {\n              if (!hasEnteredPhoneDigits(event.currentTarget.value)) {\n                onChange(\"\");\n              }\n              setIsFocused(false);\n              onBlur();\n              rest.onBlur?.(event);\n            }}\n            isValid={isValid}\n            description={errorMsg}\n            placeholder={shouldShowMask ? undefined : placeholder}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["PHONE_MASK_PATTERN","PHONE_PLACEHOLDER","hasEnteredPhoneDigits","value","FormInputPhone","name","rules","mask","placeholder","rest","isFocused","setIsFocused","useState","control","errors","touchedFields","isSubmitted","useFormContext","jsx","Controller","onChange","onBlur","ref","inputValue","isValid","errorMsg","getValidationState","shouldShowMask","InputPhone","val","event"],"mappings":";;;;;AAMA,MAAMA,IAAqB,wBACrBC,IAAoB,sBACpBC,IAAwB,CAACC,MAAkBA,EAAM,QAAQ,OAAO,EAAE,EAAE,SAAS,GAUtEC,IAAiB,CAAC;AAAA,EAC7B,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC,IAAOP;AAAA,EACP,aAAAQ,IAAcP;AAAA,EACd,GAAGQ;AACL,MAAa;AACX,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C;AAAA,IACJ,SAAAC;AAAA,IACA,WAAW,EAAE,QAAAC,GAAQ,eAAAC,GAAe,aAAAC,EAAA;AAAA,EAAY,IAC9CC,EAAA;AAEJ,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAd;AAAA,MACA,OAAAC;AAAA,MACA,SAAAO;AAAA,MACA,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAAO,GAAU,QAAAC,GAAQ,OAAAlB,IAAQ,IAAI,KAAAmB,EAAA,QAAY;AAC5D,cAAMC,IAAa,OAAOpB,KAAU,WAAWA,IAAQ,OAAOA,KAAS,EAAE,GACnE,CAACqB,GAASC,CAAQ,IAAIC;AAAA,UAC1BrB;AAAA,UACAkB;AAAA,UACAT;AAAA,UACAC;AAAA,UACAC;AAAA,QAAA,GAEIW,IAAiBjB,KAAaR,EAAsBqB,CAAU;AAEpE,eACE,gBAAAL;AAAA,UAACU;AAAA,UAAA;AAAA,YACE,GAAGnB;AAAA,YACJ,MAAAJ;AAAA,YACA,MAAAE;AAAA,YACA,QAAQ;AAAA,YACR,MAAM,CAACoB;AAAA,YACP,OAAOJ;AAAA,YACP,MAAK;AAAA,YACL,UAAUD;AAAA,YACV,UAAU,CAACO,MAAgB;AACzB,cAAAT,EAASlB,EAAsB2B,CAAG,IAAIA,IAAM,EAAE;AAAA,YAChD;AAAA,YACA,SAAS,CAACC,MAA8C;AACtD,cAAAnB,EAAa,EAAI,GACjBF,EAAK,UAAUqB,CAAK;AAAA,YACtB;AAAA,YACA,QAAQ,CAACA,MAA8C;AACrD,cAAK5B,EAAsB4B,EAAM,cAAc,KAAK,KAClDV,EAAS,EAAE,GAEbT,EAAa,EAAK,GAClBU,EAAA,GACAZ,EAAK,SAASqB,CAAK;AAAA,YACrB;AAAA,YACA,SAAAN;AAAA,YACA,aAAaC;AAAA,YACb,aAAaE,IAAiB,SAAYnB;AAAA,UAAA;AAAA,QAAA;AAAA,MAGhD;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components-forms-form-avatar-uploader.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./index.esm-ZdO9UZ3G.cjs"),l=require("./components-avatar-uploader-avatar-uploader.cjs"),u=({name:t,rules:o,...a})=>{const{control:n}=e.useFormContext();return r.jsx(e.Controller,{name:t,rules:o,control:n,render:({field:{onChange:s,value:c=""}})=>r.jsx(l.AvatarUpload,{...a,src:c,onChange:s})})};exports.FormAvatar=u;
+//# sourceMappingURL=components-forms-form-avatar-uploader.cjs.map

package/dist/components-forms-form-avatar-uploader.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-avatar-uploader.cjs","sources":["../src/components/forms/form-avatar-uploader.tsx"],"sourcesContent":["import { Controller, useFormContext, type RegisterOptions } from \"react-hook-form\";\nimport { AvatarUpload, type AvatarUploadProps } from \"../avatar-uploader\";\n\ntype Props = Omit<AvatarUploadProps, \"onChange\" | \"src\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n};\n\nexport const FormAvatar = ({ name, rules, ...rest }: Props) => {\n  const { control } = useFormContext();\n\n  return (\n    <Controller\n      name={name}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, value = \"\" } }) => {\n        return (\n          <AvatarUpload\n            {...rest}\n            src={value}\n            onChange={onChange}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["FormAvatar","name","rules","rest","control","useFormContext","jsx","Controller","onChange","value","AvatarUpload"],"mappings":"yNASaA,EAAa,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,GAAGC,KAAkB,CAC7D,KAAM,CAAE,QAAAC,CAAA,EAAYC,iBAAA,EAEpB,OACEC,EAAAA,IAACC,EAAAA,WAAA,CACC,KAAAN,EACA,MAAAC,EACA,QAAAE,EACA,OAAQ,CAAC,CAAE,MAAO,CAAE,SAAAI,EAAU,MAAAC,EAAQ,EAAA,KAElCH,EAAAA,IAACI,EAAAA,aAAA,CACE,GAAGP,EACJ,IAAKM,EACL,SAAAD,CAAA,CAAA,CAGN,CAAA,CAGN"}

package/dist/components-forms-form-avatar-uploader.js

@@ -0,0 +1,26 @@
+import { jsx as r } from "react/jsx-runtime";
+import { a as s, C as l } from "./index.esm-CFsbc_Iq.js";
+import { AvatarUpload as p } from "./components-avatar-uploader-avatar-uploader.js";
+const d = ({ name: o, rules: t, ...e }) => {
+  const { control: a } = s();
+  return /* @__PURE__ */ r(
+    l,
+    {
+      name: o,
+      rules: t,
+      control: a,
+      render: ({ field: { onChange: m, value: n = "" } }) => /* @__PURE__ */ r(
+        p,
+        {
+          ...e,
+          src: n,
+          onChange: m
+        }
+      )
+    }
+  );
+};
+export {
+  d as FormAvatar
+};
+//# sourceMappingURL=components-forms-form-avatar-uploader.js.map

package/dist/components-forms-form-avatar-uploader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-avatar-uploader.js","sources":["../src/components/forms/form-avatar-uploader.tsx"],"sourcesContent":["import { Controller, useFormContext, type RegisterOptions } from \"react-hook-form\";\nimport { AvatarUpload, type AvatarUploadProps } from \"../avatar-uploader\";\n\ntype Props = Omit<AvatarUploadProps, \"onChange\" | \"src\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n};\n\nexport const FormAvatar = ({ name, rules, ...rest }: Props) => {\n  const { control } = useFormContext();\n\n  return (\n    <Controller\n      name={name}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, value = \"\" } }) => {\n        return (\n          <AvatarUpload\n            {...rest}\n            src={value}\n            onChange={onChange}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["FormAvatar","name","rules","rest","control","useFormContext","jsx","Controller","onChange","value","AvatarUpload"],"mappings":";;;AASO,MAAMA,IAAa,CAAC,EAAE,MAAAC,GAAM,OAAAC,GAAO,GAAGC,QAAkB;AAC7D,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA;AAEpB,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAN;AAAA,MACA,OAAAC;AAAA,MACA,SAAAE;AAAA,MACA,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAAI,GAAU,OAAAC,IAAQ,GAAA,QAElC,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACE,GAAGP;AAAA,UACJ,KAAKM;AAAA,UACL,UAAAD;AAAA,QAAA;AAAA,MAAA;AAAA,IAGN;AAAA,EAAA;AAGN;"}

package/dist/components-forms-form-contact-input.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),E=require("./utils-get-validation-state.cjs"),M=require("react"),d=require("./index.esm-ZdO9UZ3G.cjs"),T=require("./components-input-contact-input-contact.cjs"),V="+7 (000) 000-00-00",j=({name:e,rules:g,...s})=>{const[S,u]=M.useState(!1),{control:m,formState:{errors:c,touchedFields:f,isSubmitted:F},setValue:i,clearErrors:y}=d.useFormContext(),a=t=>t.replace(/\D/g,"").length>1,P=t=>{i(`${e}.type`,t),i(`${e}.value`,""),y()};return p.jsx(d.Controller,{name:`${e}.value`,rules:g,control:m,render:({field:{onChange:t,onBlur:h,value:n="",ref:l}})=>{const C=c[e].value?.message,r=typeof n=="string"?n:String(n??""),[_,q]=E.getValidationState(e,r,c,f,F,C),x=S||a(r);return p.jsx(T.InputContact,{...s,inputProps:{ref:l,onChange:t},inputPhoneProps:{mask:V,unmask:!1,lazy:!x,type:"tel",inputRef:l,onAccept:t,onFocus:o=>{u(!0),s.onFocus?.(o)},onBlur:o=>{a(o.currentTarget.value)||t(""),u(!1),h(),s.onBlur?.(o)}},onTypeChange:P,isValid:_,description:q,name:e,value:r})}})};exports.FormContactInput=j;
+//# sourceMappingURL=components-forms-form-contact-input.cjs.map

package/dist/components-forms-form-contact-input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-contact-input.cjs","sources":["../src/components/forms/form-contact-input.tsx"],"sourcesContent":["import { getValidationState } from \"@/utils/get-validation-state\";\nimport { useState } from \"react\";\n\nimport {\n  Controller,\n  useFormContext,\n  type FieldError,\n  type RegisterOptions,\n} from \"react-hook-form\";\nimport { InputContact, type TypesChange } from \"../input-contact\";\nimport type { InputProps } from \"../input-field\";\n\ntype Props = Omit<InputProps, \"value\" | \"onChange\" | \"ref\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n};\n\nconst PHONE_MASK_PATTERN = \"+7 (000) 000-00-00\";\n\nexport const FormContactInput = ({ name, rules, ...rest }: Props) => {\n  const [isFocused, setIsFocused] = useState(false);\n  const {\n    control,\n    formState: { errors, touchedFields, isSubmitted },\n    setValue,\n    clearErrors,\n  } = useFormContext();\n\n  const hasEnteredPhoneDigits = (value: string) => value.replace(/\\D/g, \"\").length > 1;\n\n  const onTypeChange = (newType: TypesChange) => {\n    setValue(`${name}.type`, newType);\n    setValue(`${name}.value`, \"\");\n    clearErrors();\n  };\n\n  return (\n    <Controller\n      name={`${name}.value`}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, onBlur, value = \"\", ref } }) => {\n        const customErrMsg = (errors[name] as { value?: FieldError }).value?.message;\n\n        const inputValue = typeof value === \"string\" ? value : String(value ?? \"\");\n        const [isValid, errorMsg] = getValidationState(\n          name,\n          inputValue,\n          errors,\n          touchedFields,\n          isSubmitted,\n          customErrMsg,\n        );\n        const shouldShowMask = isFocused || hasEnteredPhoneDigits(inputValue);\n\n        return (\n          <InputContact\n            {...rest}\n            inputProps={{\n              ref,\n              onChange,\n            }}\n            inputPhoneProps={{\n              mask: PHONE_MASK_PATTERN,\n              unmask: false,\n              lazy: !shouldShowMask,\n              type: \"tel\",\n              inputRef: ref,\n              onAccept: onChange,\n              onFocus: (event: React.FocusEvent<HTMLInputElement>) => {\n                setIsFocused(true);\n                rest.onFocus?.(event);\n              },\n              onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n                if (!hasEnteredPhoneDigits(event.currentTarget.value)) {\n                  onChange(\"\");\n                }\n                setIsFocused(false);\n                onBlur();\n                rest.onBlur?.(event);\n              },\n            }}\n            onTypeChange={onTypeChange}\n            isValid={isValid}\n            description={errorMsg}\n            name={name}\n            value={inputValue}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["PHONE_MASK_PATTERN","FormContactInput","name","rules","rest","isFocused","setIsFocused","useState","control","errors","touchedFields","isSubmitted","setValue","clearErrors","useFormContext","hasEnteredPhoneDigits","value","onTypeChange","newType","jsx","Controller","onChange","onBlur","ref","customErrMsg","inputValue","isValid","errorMsg","getValidationState","shouldShowMask","InputContact","event"],"mappings":"sRAkBMA,EAAqB,qBAEdC,EAAmB,CAAC,CAAE,KAAAC,EAAM,MAAAC,EAAO,GAAGC,KAAkB,CACnE,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAC1C,CACJ,QAAAC,EACA,UAAW,CAAE,OAAAC,EAAQ,cAAAC,EAAe,YAAAC,CAAA,EACpC,SAAAC,EACA,YAAAC,CAAA,EACEC,iBAAA,EAEEC,EAAyBC,GAAkBA,EAAM,QAAQ,MAAO,EAAE,EAAE,OAAS,EAE7EC,EAAgBC,GAAyB,CAC7CN,EAAS,GAAGV,CAAI,QAASgB,CAAO,EAChCN,EAAS,GAAGV,CAAI,SAAU,EAAE,EAC5BW,EAAA,CACF,EAEA,OACEM,EAAAA,IAACC,EAAAA,WAAA,CACC,KAAM,GAAGlB,CAAI,SACb,MAAAC,EACA,QAAAK,EACA,OAAQ,CAAC,CAAE,MAAO,CAAE,SAAAa,EAAU,OAAAC,EAAQ,MAAAN,EAAQ,GAAI,IAAAO,CAAA,KAAY,CAC5D,MAAMC,EAAgBf,EAAOP,CAAI,EAA6B,OAAO,QAE/DuB,EAAa,OAAOT,GAAU,SAAWA,EAAQ,OAAOA,GAAS,EAAE,EACnE,CAACU,EAASC,CAAQ,EAAIC,EAAAA,mBAC1B1B,EACAuB,EACAhB,EACAC,EACAC,EACAa,CAAA,EAEIK,EAAiBxB,GAAaU,EAAsBU,CAAU,EAEpE,OACEN,EAAAA,IAACW,EAAAA,aAAA,CACE,GAAG1B,EACJ,WAAY,CACV,IAAAmB,EACA,SAAAF,CAAA,EAEF,gBAAiB,CACf,KAAMrB,EACN,OAAQ,GACR,KAAM,CAAC6B,EACP,KAAM,MACN,SAAUN,EACV,SAAUF,EACV,QAAUU,GAA8C,CACtDzB,EAAa,EAAI,EACjBF,EAAK,UAAU2B,CAAK,CACtB,EACA,OAASA,GAA8C,CAChDhB,EAAsBgB,EAAM,cAAc,KAAK,GAClDV,EAAS,EAAE,EAEbf,EAAa,EAAK,EAClBgB,EAAA,EACAlB,EAAK,SAAS2B,CAAK,CACrB,CAAA,EAEF,aAAAd,EACA,QAAAS,EACA,YAAaC,EACb,KAAAzB,EACA,MAAOuB,CAAA,CAAA,CAGb,CAAA,CAAA,CAGN"}

package/dist/components-forms-form-contact-input.js

@@ -0,0 +1,66 @@
+import { jsx as p } from "react/jsx-runtime";
+import { getValidationState as T } from "./utils-get-validation-state.js";
+import { useState as V } from "react";
+import { a as k, C as x } from "./index.esm-CFsbc_Iq.js";
+import { InputContact as A } from "./components-input-contact-input-contact.js";
+const I = "+7 (000) 000-00-00", R = ({ name: o, rules: m, ...s }) => {
+  const [d, u] = V(!1), {
+    control: f,
+    formState: { errors: c, touchedFields: g, isSubmitted: F },
+    setValue: i,
+    clearErrors: S
+  } = k(), a = (t) => t.replace(/\D/g, "").length > 1, h = (t) => {
+    i(`${o}.type`, t), i(`${o}.value`, ""), S();
+  };
+  return /* @__PURE__ */ p(
+    x,
+    {
+      name: `${o}.value`,
+      rules: m,
+      control: f,
+      render: ({ field: { onChange: t, onBlur: P, value: e = "", ref: l } }) => {
+        const y = c[o].value?.message, n = typeof e == "string" ? e : String(e ?? ""), [E, C] = T(
+          o,
+          n,
+          c,
+          g,
+          F,
+          y
+        ), M = d || a(n);
+        return /* @__PURE__ */ p(
+          A,
+          {
+            ...s,
+            inputProps: {
+              ref: l,
+              onChange: t
+            },
+            inputPhoneProps: {
+              mask: I,
+              unmask: !1,
+              lazy: !M,
+              type: "tel",
+              inputRef: l,
+              onAccept: t,
+              onFocus: (r) => {
+                u(!0), s.onFocus?.(r);
+              },
+              onBlur: (r) => {
+                a(r.currentTarget.value) || t(""), u(!1), P(), s.onBlur?.(r);
+              }
+            },
+            onTypeChange: h,
+            isValid: E,
+            description: C,
+            name: o,
+            value: n
+          }
+        );
+      }
+    }
+  );
+};
+export {
+  R as FormContactInput
+};
+//# sourceMappingURL=components-forms-form-contact-input.js.map

package/dist/components-forms-form-contact-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-contact-input.js","sources":["../src/components/forms/form-contact-input.tsx"],"sourcesContent":["import { getValidationState } from \"@/utils/get-validation-state\";\nimport { useState } from \"react\";\n\nimport {\n  Controller,\n  useFormContext,\n  type FieldError,\n  type RegisterOptions,\n} from \"react-hook-form\";\nimport { InputContact, type TypesChange } from \"../input-contact\";\nimport type { InputProps } from \"../input-field\";\n\ntype Props = Omit<InputProps, \"value\" | \"onChange\" | \"ref\"> & {\n  name: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n};\n\nconst PHONE_MASK_PATTERN = \"+7 (000) 000-00-00\";\n\nexport const FormContactInput = ({ name, rules, ...rest }: Props) => {\n  const [isFocused, setIsFocused] = useState(false);\n  const {\n    control,\n    formState: { errors, touchedFields, isSubmitted },\n    setValue,\n    clearErrors,\n  } = useFormContext();\n\n  const hasEnteredPhoneDigits = (value: string) => value.replace(/\\D/g, \"\").length > 1;\n\n  const onTypeChange = (newType: TypesChange) => {\n    setValue(`${name}.type`, newType);\n    setValue(`${name}.value`, \"\");\n    clearErrors();\n  };\n\n  return (\n    <Controller\n      name={`${name}.value`}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, onBlur, value = \"\", ref } }) => {\n        const customErrMsg = (errors[name] as { value?: FieldError }).value?.message;\n\n        const inputValue = typeof value === \"string\" ? value : String(value ?? \"\");\n        const [isValid, errorMsg] = getValidationState(\n          name,\n          inputValue,\n          errors,\n          touchedFields,\n          isSubmitted,\n          customErrMsg,\n        );\n        const shouldShowMask = isFocused || hasEnteredPhoneDigits(inputValue);\n\n        return (\n          <InputContact\n            {...rest}\n            inputProps={{\n              ref,\n              onChange,\n            }}\n            inputPhoneProps={{\n              mask: PHONE_MASK_PATTERN,\n              unmask: false,\n              lazy: !shouldShowMask,\n              type: \"tel\",\n              inputRef: ref,\n              onAccept: onChange,\n              onFocus: (event: React.FocusEvent<HTMLInputElement>) => {\n                setIsFocused(true);\n                rest.onFocus?.(event);\n              },\n              onBlur: (event: React.FocusEvent<HTMLInputElement>) => {\n                if (!hasEnteredPhoneDigits(event.currentTarget.value)) {\n                  onChange(\"\");\n                }\n                setIsFocused(false);\n                onBlur();\n                rest.onBlur?.(event);\n              },\n            }}\n            onTypeChange={onTypeChange}\n            isValid={isValid}\n            description={errorMsg}\n            name={name}\n            value={inputValue}\n          />\n        );\n      }}\n    />\n  );\n};\n"],"names":["PHONE_MASK_PATTERN","FormContactInput","name","rules","rest","isFocused","setIsFocused","useState","control","errors","touchedFields","isSubmitted","setValue","clearErrors","useFormContext","hasEnteredPhoneDigits","value","onTypeChange","newType","jsx","Controller","onChange","onBlur","ref","customErrMsg","inputValue","isValid","errorMsg","getValidationState","shouldShowMask","InputContact","event"],"mappings":";;;;;AAkBA,MAAMA,IAAqB,sBAEdC,IAAmB,CAAC,EAAE,MAAAC,GAAM,OAAAC,GAAO,GAAGC,QAAkB;AACnE,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C;AAAA,IACJ,SAAAC;AAAA,IACA,WAAW,EAAE,QAAAC,GAAQ,eAAAC,GAAe,aAAAC,EAAA;AAAA,IACpC,UAAAC;AAAA,IACA,aAAAC;AAAA,EAAA,IACEC,EAAA,GAEEC,IAAwB,CAACC,MAAkBA,EAAM,QAAQ,OAAO,EAAE,EAAE,SAAS,GAE7EC,IAAe,CAACC,MAAyB;AAC7C,IAAAN,EAAS,GAAGV,CAAI,SAASgB,CAAO,GAChCN,EAAS,GAAGV,CAAI,UAAU,EAAE,GAC5BW,EAAA;AAAA,EACF;AAEA,SACE,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAM,GAAGlB,CAAI;AAAA,MACb,OAAAC;AAAA,MACA,SAAAK;AAAA,MACA,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAAa,GAAU,QAAAC,GAAQ,OAAAN,IAAQ,IAAI,KAAAO,EAAA,QAAY;AAC5D,cAAMC,IAAgBf,EAAOP,CAAI,EAA6B,OAAO,SAE/DuB,IAAa,OAAOT,KAAU,WAAWA,IAAQ,OAAOA,KAAS,EAAE,GACnE,CAACU,GAASC,CAAQ,IAAIC;AAAA,UAC1B1B;AAAA,UACAuB;AAAA,UACAhB;AAAA,UACAC;AAAA,UACAC;AAAA,UACAa;AAAA,QAAA,GAEIK,IAAiBxB,KAAaU,EAAsBU,CAAU;AAEpE,eACE,gBAAAN;AAAA,UAACW;AAAA,UAAA;AAAA,YACE,GAAG1B;AAAA,YACJ,YAAY;AAAA,cACV,KAAAmB;AAAA,cACA,UAAAF;AAAA,YAAA;AAAA,YAEF,iBAAiB;AAAA,cACf,MAAMrB;AAAA,cACN,QAAQ;AAAA,cACR,MAAM,CAAC6B;AAAA,cACP,MAAM;AAAA,cACN,UAAUN;AAAA,cACV,UAAUF;AAAA,cACV,SAAS,CAACU,MAA8C;AACtD,gBAAAzB,EAAa,EAAI,GACjBF,EAAK,UAAU2B,CAAK;AAAA,cACtB;AAAA,cACA,QAAQ,CAACA,MAA8C;AACrD,gBAAKhB,EAAsBgB,EAAM,cAAc,KAAK,KAClDV,EAAS,EAAE,GAEbf,EAAa,EAAK,GAClBgB,EAAA,GACAlB,EAAK,SAAS2B,CAAK;AAAA,cACrB;AAAA,YAAA;AAAA,YAEF,cAAAd;AAAA,YACA,SAAAS;AAAA,YACA,aAAaC;AAAA,YACb,MAAAzB;AAAA,YACA,OAAOuB;AAAA,UAAA;AAAA,QAAA;AAAA,MAGb;AAAA,IAAA;AAAA,EAAA;AAGN;"}