@digigov/form 2.0.0-7d9a8d86 → 2.0.0-85c27c19

package/cjs/inputs/Label/__stories__/Default.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/inputs/Label/__stories__/Default.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Label } from '@digigov/form';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport const Default = () => (\n  <FormBuilder\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Label\n      label={{\n        primary: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03C7\u03B5\u03AF\u03C1\u03B7\u03C3\u03B7\u03C2',\n        secondary: '\u03A3\u03C5\u03BC\u03C0\u03BB\u03B7\u03C1\u03CE\u03C3\u03C4\u03B5 \u03C4\u03B1 \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1',\n      }}\n    />\n    <Field\n      key=\"business-title\"\n      name=\"business-title\"\n      type=\"string\"\n      label={{ primary: '\u038C\u03BD\u03BF\u03BC\u03B1 \u03B5\u03C0\u03B9\u03C7\u03B5\u03AF\u03C1\u03B7\u03C3\u03B7\u03C2' }}\n      required\n    />\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default Default;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAA0C;AAC1C,oBAAuB;AAEhB,MAAM,UAAU,MACrB,mDAAC,qBAAD;AAAA,EACE,UAAU,CAAC,SAAS;AAClB,YAAQ,IAAI;AAAA;AAAA,GAGd,mDAAC,mBAAD;AAAA,EACE,OAAO;AAAA,IACL,SAAS;AAAA,IACT,WAAW;AAAA;AAAA,IAGf,mDAAC,mBAAD;AAAA,EACE,KAAI;AAAA,EACJ,MAAK;AAAA,EACL,MAAK;AAAA,EACL,OAAO,CAAE,SAAS;AAAA,EAClB,UAAQ;AAAA,IAEV,mDAAC,sBAAD;AAAA,EAAQ,MAAK;AAAA,GAAS;AAG1B,IAAO,kBAAQ;",
-  "names": []
+  "sourcesContent": ["import React from 'react';\nimport FormBuilder from '@digigov/form';\nimport Field from '@digigov/form/Field';\nimport Label from '@digigov/form/inputs/Label';\nimport { Button } from '@digigov/ui/form/Button';\n\nexport const Default = () => (\n  <FormBuilder\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Label\n      label={{\n        primary: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03C7\u03B5\u03AF\u03C1\u03B7\u03C3\u03B7\u03C2',\n        secondary: '\u03A3\u03C5\u03BC\u03C0\u03BB\u03B7\u03C1\u03CE\u03C3\u03C4\u03B5 \u03C4\u03B1 \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1',\n      }}\n    />\n    <Field\n      key=\"business-title\"\n      name=\"business-title\"\n      type=\"string\"\n      label={{ primary: '\u038C\u03BD\u03BF\u03BC\u03B1 \u03B5\u03C0\u03B9\u03C7\u03B5\u03AF\u03C1\u03B7\u03C3\u03B7\u03C2' }}\n      required\n    />\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default Default;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAAwB;AACxB,mBAAkB;AAClB,mBAAkB;AAClB,oBAAuB;AAEhB,MAAM,UAAU,MACrB,6BAAAA,QAAA;AAAA,EAAC,YAAAC;AAAA,EAAA;AAAA,IACC,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,6BAAAD,QAAA;AAAA,IAAC,aAAAE;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,MACb;AAAA;AAAA,EACF;AAAA,EACA,6BAAAF,QAAA;AAAA,IAAC,aAAAG;AAAA,IAAA;AAAA,MACC,KAAI;AAAA,MACJ,MAAK;AAAA,MACL,MAAK;AAAA,MACL,OAAO,EAAE,SAAS,oGAAoB;AAAA,MACtC,UAAQ;AAAA;AAAA,EACV;AAAA,EACA,6BAAAH,QAAA,cAAC,wBAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,kBAAQ;",
+  "names": ["React", "FormBuilder", "Label", "Field"]
 }

package/cjs/inputs/Label/index.js

@@ -1,46 +1,46 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
 var __export = (target, all) => {
   for (var name in all)
-    __defProp(target, name, {get: all[name], enumerable: true});
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
+  return to;
 };
-__markAsModule(exports);
-__export(exports, {
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Label_exports = {};
+__export(Label_exports, {
   Label: () => Label,
   default: () => Label_default
 });
-var import_react = __toModule(require("react"));
-var import_Hint = __toModule(require("@digigov/react-core/Hint"));
-var import_LabelTitle = __toModule(require("@digigov/react-core/LabelTitle"));
-var import_i18n = __toModule(require("@digigov/ui/i18n"));
-const Label = ({className, label, value}) => {
-  const {t} = (0, import_i18n.useTranslation)();
+module.exports = __toCommonJS(Label_exports);
+var import_react = __toESM(require("react"));
+var import_Hint = __toESM(require("@digigov/react-core/Hint"));
+var import_LabelTitle = __toESM(require("@digigov/react-core/LabelTitle"));
+var import_i18n = require("@digigov/ui/i18n");
+const Label = ({ className, label, value }) => {
+  const { t } = (0, import_i18n.useTranslation)();
   if ((!label || label && !label.primary && !label.secondary) && !value) {
     return null;
   }
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_LabelTitle.default, {
-    className,
-    size: "sm"
-  }, label && label.primary && t(label.primary) || value), label && label.secondary && /* @__PURE__ */ import_react.default.createElement(import_Hint.default, null, t(label.secondary)));
-};
-Label.defaultProps = {
-  label: {}
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_LabelTitle.default, { className, size: "sm" }, label && label.primary && t(label.primary) || value), label && label.secondary && /* @__PURE__ */ import_react.default.createElement(import_Hint.default, null, t(label.secondary)));
 };
 var Label_default = Label;
 // Annotate the CommonJS export names for ESM import in node:

package/cjs/inputs/Label/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/inputs/Label/index.tsx"],
-  "sourcesContent": ["import React from 'react';\nimport { FieldLabelProps } from '@digigov/form/types';\nimport Hint from '@digigov/react-core/Hint';\nimport LabelTitle from '@digigov/react-core/LabelTitle';\nimport { useTranslation } from '@digigov/ui/i18n';\n\nexport interface FieldOptionProps {\n  label?: FieldLabelProps;\n  value: string;\n  show?: string[];\n  disabled?: boolean;\n  selected?: () => React.FC;\n  divider?: string;\n}\n\nexport interface LabelProps {\n  primary?: string;\n  secondary?: string;\n}\n\nexport interface LabelProps {\n  className?: string;\n  value?: string;\n  label?: FieldLabelProps;\n}\n\nexport const Label: React.FC<LabelProps> = ({ className, label, value }) => {\n  const { t } = useTranslation();\n  if ((!label || (label && !label.primary && !label.secondary)) && !value) {\n    return null;\n  }\n  return (\n    <>\n      <LabelTitle className={className} size=\"sm\">\n        {(label && label.primary && t(label.primary)) || value}\n      </LabelTitle>\n      {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n    </>\n  );\n};\n\nLabel.defaultProps = {\n  label: {},\n};\n\nexport default Label;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,kBAAiB;AACjB,wBAAuB;AACvB,kBAA+B;AAsBxB,MAAM,QAA8B,CAAC,CAAE,WAAW,OAAO,WAAY;AAC1E,QAAM,CAAE,KAAM;AACd,MAAK,EAAC,SAAU,SAAS,CAAC,MAAM,WAAW,CAAC,MAAM,cAAe,CAAC,OAAO;AACvE,WAAO;AAAA;AAET,SACE,wFACE,mDAAC,2BAAD;AAAA,IAAY;AAAA,IAAsB,MAAK;AAAA,KACnC,SAAS,MAAM,WAAW,EAAE,MAAM,YAAa,QAElD,SAAS,MAAM,aAAa,mDAAC,qBAAD,MAAO,EAAE,MAAM;AAAA;AAKlD,MAAM,eAAe;AAAA,EACnB,OAAO;AAAA;AAGT,IAAO,gBAAQ;",
-  "names": []
+  "sourcesContent": ["import React from 'react';\nimport { FieldLabelProps } from '@digigov/form/types';\nimport Hint from '@digigov/react-core/Hint';\nimport LabelTitle from '@digigov/react-core/LabelTitle';\nimport { useTranslation } from '@digigov/ui/i18n';\n\nexport interface FieldOptionProps {\n  label?: FieldLabelProps;\n  value: string;\n  show?: string[];\n  disabled?: boolean;\n  selected?: () => React.ReactNode;\n  divider?: string;\n}\n\nexport interface LabelProps {\n  primary?: string;\n  secondary?: string;\n}\n\nexport interface LabelProps {\n  className?: string;\n  value?: string;\n  label?: FieldLabelProps;\n}\n\nexport const Label: React.FC<LabelProps> = ({ className, label, value }) => {\n  const { t } = useTranslation();\n  if ((!label || (label && !label.primary && !label.secondary)) && !value) {\n    return null;\n  }\n  return (\n    <>\n      <LabelTitle className={className} size=\"sm\">\n        {(label && label.primary && t(label.primary)) || value}\n      </LabelTitle>\n      {label && label.secondary && <Hint>{t(label.secondary)}</Hint>}\n    </>\n  );\n};\n\n\nexport default Label;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,kBAAiB;AACjB,wBAAuB;AACvB,kBAA+B;AAsBxB,MAAM,QAA8B,CAAC,EAAE,WAAW,OAAO,MAAM,MAAM;AAC1E,QAAM,EAAE,EAAE,QAAI,4BAAe;AAC7B,OAAK,CAAC,SAAU,SAAS,CAAC,MAAM,WAAW,CAAC,MAAM,cAAe,CAAC,OAAO;AACvE,WAAO;AAAA,EACT;AACA,SACE,6BAAAA,QAAA,2BAAAA,QAAA,gBACE,6BAAAA,QAAA,cAAC,kBAAAC,SAAA,EAAW,WAAsB,MAAK,QACnC,SAAS,MAAM,WAAW,EAAE,MAAM,OAAO,KAAM,KACnD,GACC,SAAS,MAAM,aAAa,6BAAAD,QAAA,cAAC,YAAAE,SAAA,MAAM,EAAE,MAAM,SAAS,CAAE,CACzD;AAEJ;AAGA,IAAO,gBAAQ;",
+  "names": ["React", "LabelTitle", "Hint"]
 }

package/cjs/inputs/OtpInput/OtpInput.stories/index.js

@@ -1,36 +1,45 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
 var __export = (target, all) => {
   for (var name in all)
-    __defProp(target, name, {get: all[name], enumerable: true});
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
-};
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
+  return to;
 };
-__markAsModule(exports);
-__export(exports, {
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var OtpInput_stories_exports = {};
+__export(OtpInput_stories_exports, {
+  Default: () => import_Default.Default,
   default: () => OtpInput_stories_default
 });
-var import_OtpInput = __toModule(require("@digigov/form/inputs/OtpInput"));
-__reExport(exports, __toModule(require("@digigov/form/inputs/OtpInput/__stories__/Default")));
+module.exports = __toCommonJS(OtpInput_stories_exports);
+var import_OtpInput = __toESM(require("@digigov/form/inputs/OtpInput"));
+var import_Default = require("@digigov/form/inputs/OtpInput/__stories__/Default");
 var OtpInput_stories_default = {
   title: "Digigov Form/inputs/OtpInput",
   component: import_OtpInput.default,
   displayName: "OtpInput"
 };
 // Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {});
+0 && (module.exports = {
+  Default
+});
 //# sourceMappingURL=OtpInput.stories.js.map

package/cjs/inputs/OtpInput/OtpInput.stories.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/inputs/OtpInput/OtpInput.stories.js"],
-  "sourcesContent": ["import OtpInput from '@digigov/form/inputs/OtpInput';\nexport default {\n  title: 'Digigov Form/inputs/OtpInput',\n  component: OtpInput,\n  displayName: 'OtpInput',\n};\nexport * from '@digigov/form/inputs/OtpInput/__stories__/Default';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAqB;AAMrB,oBAAc;AALd,IAAO,2BAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA;",
-  "names": []
+  "sourcesContent": ["import OtpInput from '@digigov/form/inputs/OtpInput';\nexport default {\n  title: 'Digigov Form/inputs/OtpInput',\n  component: OtpInput,\n  displayName: 'OtpInput',\n};\nexport { Default } from '@digigov/form/inputs/OtpInput/__stories__/Default';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAqB;AAMrB,qBAAwB;AALxB,IAAO,2BAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW,gBAAAA;AAAA,EACX,aAAa;AACf;",
+  "names": ["OtpInput"]
 }

package/cjs/inputs/OtpInput/__stories__/Default/index.js

@@ -1,33 +1,39 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
 var __export = (target, all) => {
   for (var name in all)
-    __defProp(target, name, {get: all[name], enumerable: true});
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
+  return to;
 };
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
-};
-__markAsModule(exports);
-__export(exports, {
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Default_exports = {};
+__export(Default_exports, {
   Default: () => Default,
   default: () => Default_default
 });
-var import_react = __toModule(require("react"));
-var import_form = __toModule(require("@digigov/form"));
-var import_Button = __toModule(require("@digigov/ui/form/Button"));
+module.exports = __toCommonJS(Default_exports);
+var import_react = __toESM(require("react"));
+var import_form = __toESM(require("@digigov/form"));
+var import_Button = require("@digigov/ui/form/Button");
 const FIELDS = [
   {
     key: "otp",
@@ -39,17 +45,17 @@ const FIELDS = [
     }
   }
 ];
-const Default = () => /* @__PURE__ */ import_react.default.createElement(import_form.default, {
-  fields: FIELDS,
-  onSubmit: (data) => {
-    console.log(data);
-  }
-}, /* @__PURE__ */ import_react.default.createElement(import_form.Fieldset, null, FIELDS.map((field) => /* @__PURE__ */ import_react.default.createElement(import_form.Field, {
-  key: field.key,
-  name: field.key
-}))), /* @__PURE__ */ import_react.default.createElement(import_Button.Button, {
-  type: "submit"
-}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1"));
+const Default = () => /* @__PURE__ */ import_react.default.createElement(
+  import_form.default,
+  {
+    fields: FIELDS,
+    onSubmit: (data) => {
+      console.log(data);
+    }
+  },
+  /* @__PURE__ */ import_react.default.createElement(import_form.Fieldset, null, FIELDS.map((field) => /* @__PURE__ */ import_react.default.createElement(import_form.Field, { key: field.key, name: field.key }))),
+  /* @__PURE__ */ import_react.default.createElement(import_Button.Button, { type: "submit" }, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1")
+);
 var Default_default = Default;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/cjs/inputs/OtpInput/__stories__/Default.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../src/inputs/OtpInput/__stories__/Default.tsx"],
   "sourcesContent": ["import React from 'react';\nimport FormBuilder, { Field, Fieldset } from '@digigov/form';\nimport { FieldSpec } from '@digigov/form/types';\nimport { Button } from '@digigov/ui/form/Button';\nconst FIELDS: FieldSpec[] = [\n  {\n    key: 'otp',\n    type: 'otp',\n    maxLength: 6,\n    required: true,\n    label: {\n      primary: '\u039A\u03C9\u03B4\u03B9\u03BA\u03CC\u03C2 \u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7\u03C2',\n    },\n  },\n];\n\nexport const Default = () => (\n  <FormBuilder\n    fields={FIELDS}\n    onSubmit={(data) => {\n      console.log(data);\n    }}\n  >\n    <Fieldset>\n      {FIELDS.map((field) => (\n        <Field key={field.key} name={field.key} />\n      ))}\n    </Fieldset>\n    <Button type=\"submit\">\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1</Button>\n  </FormBuilder>\n);\nexport default Default;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAA6C;AAE7C,oBAAuB;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA;AAAA;AAAA;AAKR,MAAM,UAAU,MACrB,mDAAC,qBAAD;AAAA,EACE,QAAQ;AAAA,EACR,UAAU,CAAC,SAAS;AAClB,YAAQ,IAAI;AAAA;AAAA,GAGd,mDAAC,sBAAD,MACG,OAAO,IAAI,CAAC,UACX,mDAAC,mBAAD;AAAA,EAAO,KAAK,MAAM;AAAA,EAAK,MAAM,MAAM;AAAA,MAGvC,mDAAC,sBAAD;AAAA,EAAQ,MAAK;AAAA,GAAS;AAG1B,IAAO,kBAAQ;",
-  "names": []
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAA6C;AAE7C,oBAAuB;AACvB,MAAM,SAAsB;AAAA,EAC1B;AAAA,IACE,KAAK;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,IACV,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAEO,MAAM,UAAU,MACrB,6BAAAA,QAAA;AAAA,EAAC,YAAAC;AAAA,EAAA;AAAA,IACC,QAAQ;AAAA,IACR,UAAU,CAAC,SAAS;AAClB,cAAQ,IAAI,IAAI;AAAA,IAClB;AAAA;AAAA,EAEA,6BAAAD,QAAA,cAAC,4BACE,OAAO,IAAI,CAAC,UACX,6BAAAA,QAAA,cAAC,qBAAM,KAAK,MAAM,KAAK,MAAM,MAAM,KAAK,CACzC,CACH;AAAA,EACA,6BAAAA,QAAA,cAAC,wBAAO,MAAK,YAAS,kDAAQ;AAChC;AAEF,IAAO,kBAAQ;",
+  "names": ["React", "FormBuilder"]
 }

package/cjs/inputs/OtpInput/index.js

@@ -1,43 +1,53 @@
 var __create = Object.create;
 var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __markAsModule = (target) => __defProp(target, "__esModule", {value: true});
 var __export = (target, all) => {
   for (var name in all)
-    __defProp(target, name, {get: all[name], enumerable: true});
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-var __reExport = (target, module2, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && key !== "default")
-        __defProp(target, key, {get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable});
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
   }
-  return target;
+  return to;
 };
-var __toModule = (module2) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? {get: () => module2.default, enumerable: true} : {value: module2, enumerable: true})), module2);
-};
-__markAsModule(exports);
-__export(exports, {
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var OtpInput_exports = {};
+__export(OtpInput_exports, {
   OtpInput: () => OtpInput,
   REMOVE_SPACES: () => REMOVE_SPACES,
   RE_DIGIT: () => RE_DIGIT,
-  default: () => OtpInput_default
+  default: () => OtpInput_default,
+  useOtp: () => useOtp
 });
-var import_react = __toModule(require("react"));
-var import_SingleCharacterInputs = __toModule(require("@digigov/ui/form/SingleCharacterInputs"));
+module.exports = __toCommonJS(OtpInput_exports);
+var import_react = __toESM(require("react"));
+var import_SingleCharacterInputs = __toESM(require("@digigov/ui/form/SingleCharacterInputs"));
 const RE_DIGIT = new RegExp(/^\d+$/);
 const REMOVE_SPACES = new RegExp(/\s+/g);
 function useOtp(onChange, maxLength) {
   const [otpValues, setOtpValues] = (0, import_react.useState)(Array(maxLength).fill(""));
-  const handleChange = (0, import_react.useCallback)((otp) => {
-    setOtpValues(otp);
-    const otpValue = otp.join("");
-    onChange(otpValue);
-  }, [onChange]);
+  const handleChange = (0, import_react.useCallback)(
+    (otp) => {
+      setOtpValues(otp);
+      const otpValue = otp.join("");
+      onChange(otpValue);
+    },
+    [onChange]
+  );
   const setOtp = (item, idx) => {
     const updatedOTPValues = [...otpValues];
     if (item.length === 1 || item.length === 0) {
@@ -63,52 +73,64 @@ function useOtp(onChange, maxLength) {
       previousElement.focus();
     }
   }, []);
-  const handleKeyDown = (0, import_react.useCallback)((e, idx) => {
-    const {key} = e;
-    const target = e.target;
-    let targetValue = target.value;
-    setSelectionRange(target);
-    if (key === "ArrowRight" || key === "ArrowDown") {
-      e.preventDefault();
-      return focusToNextInput(target);
-    }
-    if (key === "ArrowLeft" || key === "ArrowUp") {
-      e.preventDefault();
-      return focusToPrevInput(target);
-    }
-    if (e.key === "Backspace" || e.key === "Delete") {
-      if (targetValue !== "") {
-        targetValue = "";
-      } else {
-        focusToPrevInput(target);
+  const handleKeyDown = (0, import_react.useCallback)(
+    (e, idx) => {
+      const { key } = e;
+      const target = e.target;
+      let targetValue = target.value;
+      setSelectionRange(target);
+      if (key === "ArrowRight" || key === "ArrowDown") {
+        e.preventDefault();
+        return focusToNextInput(target);
       }
-      setOtp(targetValue, idx);
-      return e.preventDefault();
-    }
-  }, [setOtp, focusToPrevInput, focusToNextInput]);
-  const handleFocus = (0, import_react.useCallback)((e) => {
-    const {target} = e;
-    setSelectionRange(target);
-  }, [setSelectionRange]);
-  const handleOtpChange = (0, import_react.useCallback)((e, idx) => {
-    const target = e.target;
-    const targetValue = target.value;
-    const isTargetValueDigit = RE_DIGIT.test(targetValue);
-    if (isTargetValueDigit || targetValue === "") {
-      setOtp(targetValue, idx);
-      if (target.value.length > 1) {
-        target.blur();
+      if (key === "ArrowLeft" || key === "ArrowUp") {
+        e.preventDefault();
+        return focusToPrevInput(target);
       }
-      focusToNextInput(target);
-    }
-  }, [setOtp, handleKeyDown, handleFocus]);
-  const handlePaste = (0, import_react.useCallback)((e) => {
-    e.preventDefault();
-    const pastedData = e.clipboardData.getData("text/plain").replace(REMOVE_SPACES, "");
-    if (pastedData) {
-      setOtp(pastedData, 0);
-    }
-  }, []);
+      if (e.key === "Backspace" || e.key === "Delete") {
+        if (targetValue !== "") {
+          targetValue = "";
+        } else {
+          focusToPrevInput(target);
+        }
+        setOtp(targetValue, idx);
+        return e.preventDefault();
+      }
+    },
+    [setOtp, focusToPrevInput, focusToNextInput]
+  );
+  const handleFocus = (0, import_react.useCallback)(
+    (e) => {
+      const { target } = e;
+      setSelectionRange(target);
+    },
+    [setSelectionRange]
+  );
+  const handleOtpChange = (0, import_react.useCallback)(
+    (e, idx) => {
+      const target = e.target;
+      const targetValue = target.value;
+      const isTargetValueDigit = RE_DIGIT.test(targetValue);
+      if (isTargetValueDigit || targetValue === "") {
+        setOtp(targetValue, idx);
+        if (target.value.length > 1) {
+          target.blur();
+        }
+        focusToNextInput(target);
+      }
+    },
+    [setOtp, handleKeyDown, handleFocus]
+  );
+  const handlePaste = (0, import_react.useCallback)(
+    (e) => {
+      e.preventDefault();
+      const pastedData = e.clipboardData.getData("text/plain").replace(REMOVE_SPACES, "");
+      if (pastedData) {
+        setOtp(pastedData, 0);
+      }
+    },
+    []
+  );
   return {
     otpValues,
     handleOtpChange,
@@ -117,40 +139,42 @@ function useOtp(onChange, maxLength) {
     handlePaste
   };
 }
-const SingleCharacterInputPart = ({...props}) => {
-  return /* @__PURE__ */ import_react.default.createElement(import_SingleCharacterInputs.SingleCharacterInput, {
-    ...props
-  });
+const SingleCharacterInputPart = ({ ...props }) => {
+  return /* @__PURE__ */ import_react.default.createElement(import_SingleCharacterInputs.SingleCharacterInput, { ...props });
 };
-const OtpInput = ({name, maxLength = 6, ...props}) => {
+const OtpInput = ({ name, maxLength = 6, ...props }) => {
   const otp = useOtp(props.onChange, maxLength);
-  return /* @__PURE__ */ import_react.default.createElement(import_SingleCharacterInputs.default, null, otp.otpValues.map((digit, idx) => /* @__PURE__ */ import_react.default.createElement(SingleCharacterInputPart, {
-    name: `${name}-${idx}`,
-    type: "text",
-    key: idx,
-    autoComplete: "one-time-code",
-    pattern: "\\d{1}",
-    maxLength,
-    value: digit,
-    disabled: props.disabled,
-    "aria-required": props["aria-required"],
-    onChange: (e) => otp.handleOtpChange(e, idx),
-    onInput: (e) => {
-      if (e.target.value === digit) {
-        otp.handleOtpChange(e, idx);
-      }
-    },
-    onKeyDown: (e) => otp.handleKeyDown(e, idx),
-    onFocus: otp.handleFocus,
-    onPaste: otp.handlePaste,
-    error: !digit ? props.error : false
-  })));
+  return /* @__PURE__ */ import_react.default.createElement(import_SingleCharacterInputs.default, null, otp.otpValues.map((digit, idx) => /* @__PURE__ */ import_react.default.createElement(
+    SingleCharacterInputPart,
+    {
+      name: `${name}-${idx}`,
+      type: "text",
+      key: idx,
+      autoComplete: "one-time-code",
+      pattern: "\\d{1}",
+      maxLength,
+      value: digit,
+      disabled: props.disabled,
+      "aria-required": props["aria-required"],
+      onChange: (e) => otp.handleOtpChange(e, idx),
+      onInput: (e) => {
+        if (e.target.value === digit) {
+          otp.handleOtpChange(e, idx);
+        }
+      },
+      onKeyDown: (e) => otp.handleKeyDown(e, idx),
+      onFocus: otp.handleFocus,
+      onPaste: otp.handlePaste,
+      error: !digit ? props.error : false
+    }
+  )));
 };
 var OtpInput_default = OtpInput;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   OtpInput,
   REMOVE_SPACES,
-  RE_DIGIT
+  RE_DIGIT,
+  useOtp
 });
 //# sourceMappingURL=index.js.map

package/cjs/inputs/OtpInput/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/inputs/OtpInput/index.tsx"],
-  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport SingleCharacterInputs, {\n  SingleCharacterInput,\n} from '@digigov/ui/form/SingleCharacterInputs';\n\nexport const RE_DIGIT = new RegExp(/^\\d+$/);\nexport const REMOVE_SPACES = new RegExp(/\\s+/g);\n\nfunction useOtp(onChange, maxLength) {\n  const [otpValues, setOtpValues] = useState(Array<string>(maxLength).fill(''));\n  const handleChange = useCallback(\n    (otp: string[]) => {\n      setOtpValues(otp);\n      const otpValue = otp.join('');\n      onChange(otpValue);\n    },\n    [onChange]\n  );\n\n  const setOtp = (item: string, idx) => {\n    const updatedOTPValues = [...otpValues];\n    if (item.length === 1 || item.length === 0) {\n      updatedOTPValues[idx] = item[0] || '';\n      handleChange(updatedOTPValues);\n    } else if (item.length === maxLength) {\n      const valueArray = item.split('').slice(0, maxLength);\n      handleChange(valueArray);\n    }\n  };\n\n  const setSelectionRange = useCallback((target) => {\n    return target.setSelectionRange(0, target.value.length);\n  }, []);\n\n  const focusToNextInput = useCallback((target: HTMLElement) => {\n    const nextElement = target.nextElementSibling as HTMLInputElement | null;\n    if (nextElement) {\n      nextElement.focus();\n    }\n  }, []);\n\n  const focusToPrevInput = useCallback((target: HTMLElement) => {\n    const previousElement = target.previousElementSibling as HTMLInputElement | null;\n    if (previousElement) {\n      previousElement.focus();\n    }\n  }, []);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>, idx: number) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      let targetValue = target.value;\n      setSelectionRange(target);\n      if (key === 'ArrowRight' || key === 'ArrowDown') {\n        e.preventDefault();\n        return focusToNextInput(target);\n      }\n      if (key === 'ArrowLeft' || key === 'ArrowUp') {\n        e.preventDefault();\n        return focusToPrevInput(target);\n      }\n      if (e.key === 'Backspace' || e.key === 'Delete') {\n        if (targetValue !== '') {\n          targetValue = '';\n        } else {\n          focusToPrevInput(target);\n        }\n        setOtp(targetValue, idx);\n        return e.preventDefault();\n      }\n    },\n    [setOtp, focusToPrevInput, focusToNextInput]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const { target } = e;\n      setSelectionRange(target);\n    },\n    [setSelectionRange]\n  );\n  const handleOtpChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, idx: number) => {\n      const target = e.target;\n      const targetValue = target.value;\n      const isTargetValueDigit = RE_DIGIT.test(targetValue);\n      // We want to pass the empty string when the value is deleted\n      // emptry string replaces the deleted value\n      if (isTargetValueDigit || targetValue === '') {\n        setOtp(targetValue, idx);\n        if (target.value.length > 1) {\n          target.blur();\n        }\n        focusToNextInput(target);\n      }\n    },\n    [setOtp, handleKeyDown, handleFocus]\n  );\n\n  const handlePaste = useCallback(\n    (e: React.ClipboardEvent<HTMLInputElement>) => {\n      e.preventDefault();\n      const pastedData = e.clipboardData\n        .getData('text/plain')\n        .replace(REMOVE_SPACES, '');\n      if (pastedData) {\n        setOtp(pastedData, 0);\n      }\n    },\n    []\n  );\n  return {\n    otpValues,\n    handleOtpChange,\n    handleKeyDown,\n    handleFocus,\n    handlePaste,\n  };\n}\n\nconst SingleCharacterInputPart = ({ ...props }) => {\n  return <SingleCharacterInput {...props} />;\n};\n\nexport const OtpInput = ({ name, maxLength = 6, ...props }) => {\n  const otp = useOtp(props.onChange, maxLength);\n  return (\n    <SingleCharacterInputs>\n      {otp.otpValues.map((digit, idx) => (\n        <SingleCharacterInputPart\n          name={`${name}-${idx}`}\n          type=\"text\"\n          key={idx}\n          autoComplete=\"one-time-code\"\n          pattern=\"\\d{1}\"\n          maxLength={maxLength}\n          value={digit}\n          disabled={props.disabled}\n          aria-required={props['aria-required']}\n          onChange={(e) => otp.handleOtpChange(e, idx)}\n          onInput={(e) => {\n            if (e.target.value === digit) {\n              otp.handleOtpChange(e, idx);\n            }\n          }}\n          onKeyDown={(e) => otp.handleKeyDown(e, idx)}\n          onFocus={otp.handleFocus}\n          onPaste={otp.handlePaste}\n          error={!digit ? props.error : false}\n        />\n      ))}\n    </SingleCharacterInputs>\n  );\n};\n\nexport default OtpInput;\n"],
-  "mappings": "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",
-  "names": []
+  "sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport SingleCharacterInputs, {\n  SingleCharacterInput,\n} from '@digigov/ui/form/SingleCharacterInputs';\n\nexport const RE_DIGIT = new RegExp(/^\\d+$/);\nexport const REMOVE_SPACES = new RegExp(/\\s+/g);\n\nexport function useOtp(onChange, maxLength) {\n  const [otpValues, setOtpValues] = useState(Array<string>(maxLength).fill(''));\n  const handleChange = useCallback(\n    (otp: string[]) => {\n      setOtpValues(otp);\n      const otpValue = otp.join('');\n      onChange(otpValue);\n    },\n    [onChange]\n  );\n\n  const setOtp = (item: string, idx) => {\n    const updatedOTPValues = [...otpValues];\n    if (item.length === 1 || item.length === 0) {\n      updatedOTPValues[idx] = item[0] || '';\n      handleChange(updatedOTPValues);\n    } else if (item.length === maxLength) {\n      const valueArray = item.split('').slice(0, maxLength);\n      handleChange(valueArray);\n    }\n  };\n\n  const setSelectionRange = useCallback((target) => {\n    return target.setSelectionRange(0, target.value.length);\n  }, []);\n\n  const focusToNextInput = useCallback((target: HTMLElement) => {\n    const nextElement = target.nextElementSibling as HTMLInputElement | null;\n    if (nextElement) {\n      nextElement.focus();\n    }\n  }, []);\n\n  const focusToPrevInput = useCallback((target: HTMLElement) => {\n    const previousElement = target.previousElementSibling as HTMLInputElement | null;\n    if (previousElement) {\n      previousElement.focus();\n    }\n  }, []);\n\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent<HTMLInputElement>, idx: number) => {\n      const { key } = e;\n      const target = e.target as HTMLInputElement;\n      let targetValue = target.value;\n      setSelectionRange(target);\n      if (key === 'ArrowRight' || key === 'ArrowDown') {\n        e.preventDefault();\n        return focusToNextInput(target);\n      }\n      if (key === 'ArrowLeft' || key === 'ArrowUp') {\n        e.preventDefault();\n        return focusToPrevInput(target);\n      }\n      if (e.key === 'Backspace' || e.key === 'Delete') {\n        if (targetValue !== '') {\n          targetValue = '';\n        } else {\n          focusToPrevInput(target);\n        }\n        setOtp(targetValue, idx);\n        return e.preventDefault();\n      }\n    },\n    [setOtp, focusToPrevInput, focusToNextInput]\n  );\n\n  const handleFocus = useCallback(\n    (e: React.FocusEvent<HTMLInputElement>) => {\n      const { target } = e;\n      setSelectionRange(target);\n    },\n    [setSelectionRange]\n  );\n  const handleOtpChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>, idx: number) => {\n      const target = e.target;\n      const targetValue = target.value;\n      const isTargetValueDigit = RE_DIGIT.test(targetValue);\n      // We want to pass the empty string when the value is deleted\n      // emptry string replaces the deleted value\n      if (isTargetValueDigit || targetValue === '') {\n        setOtp(targetValue, idx);\n        if (target.value.length > 1) {\n          target.blur();\n        }\n        focusToNextInput(target);\n      }\n    },\n    [setOtp, handleKeyDown, handleFocus]\n  );\n\n  const handlePaste = useCallback(\n    (e: React.ClipboardEvent<HTMLInputElement>) => {\n      e.preventDefault();\n      const pastedData = e.clipboardData\n        .getData('text/plain')\n        .replace(REMOVE_SPACES, '');\n      if (pastedData) {\n        setOtp(pastedData, 0);\n      }\n    },\n    []\n  );\n  return {\n    otpValues,\n    handleOtpChange,\n    handleKeyDown,\n    handleFocus,\n    handlePaste,\n  };\n}\n\nconst SingleCharacterInputPart = ({ ...props }) => {\n  return <SingleCharacterInput {...props} />;\n};\n\nexport const OtpInput = ({ name, maxLength = 6, ...props }) => {\n  const otp = useOtp(props.onChange, maxLength);\n  return (\n    <SingleCharacterInputs>\n      {otp.otpValues.map((digit, idx) => (\n        <SingleCharacterInputPart\n          name={`${name}-${idx}`}\n          type=\"text\"\n          key={idx}\n          autoComplete=\"one-time-code\"\n          pattern=\"\\d{1}\"\n          maxLength={maxLength}\n          value={digit}\n          disabled={props.disabled}\n          aria-required={props['aria-required']}\n          onChange={(e) => otp.handleOtpChange(e, idx)}\n          onInput={(e) => {\n            if (e.target.value === digit) {\n              otp.handleOtpChange(e, idx);\n            }\n          }}\n          onKeyDown={(e) => otp.handleKeyDown(e, idx)}\n          onFocus={otp.handleFocus}\n          onPaste={otp.handlePaste}\n          error={!digit ? props.error : false}\n        />\n      ))}\n    </SingleCharacterInputs>\n  );\n};\n\nexport default OtpInput;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAA6C;AAC7C,mCAEO;AAEA,MAAM,WAAW,IAAI,OAAO,OAAO;AACnC,MAAM,gBAAgB,IAAI,OAAO,MAAM;AAEvC,SAAS,OAAO,UAAU,WAAW;AAC1C,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,MAAc,SAAS,EAAE,KAAK,EAAE,CAAC;AAC5E,QAAM,mBAAe;AAAA,IACnB,CAAC,QAAkB;AACjB,mBAAa,GAAG;AAChB,YAAM,WAAW,IAAI,KAAK,EAAE;AAC5B,eAAS,QAAQ;AAAA,IACnB;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,SAAS,CAAC,MAAc,QAAQ;AACpC,UAAM,mBAAmB,CAAC,GAAG,SAAS;AACtC,QAAI,KAAK,WAAW,KAAK,KAAK,WAAW,GAAG;AAC1C,uBAAiB,GAAG,IAAI,KAAK,CAAC,KAAK;AACnC,mBAAa,gBAAgB;AAAA,IAC/B,WAAW,KAAK,WAAW,WAAW;AACpC,YAAM,aAAa,KAAK,MAAM,EAAE,EAAE,MAAM,GAAG,SAAS;AACpD,mBAAa,UAAU;AAAA,IACzB;AAAA,EACF;AAEA,QAAM,wBAAoB,0BAAY,CAAC,WAAW;AAChD,WAAO,OAAO,kBAAkB,GAAG,OAAO,MAAM,MAAM;AAAA,EACxD,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,CAAC,WAAwB;AAC5D,UAAM,cAAc,OAAO;AAC3B,QAAI,aAAa;AACf,kBAAY,MAAM;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,CAAC,WAAwB;AAC5D,UAAM,kBAAkB,OAAO;AAC/B,QAAI,iBAAiB;AACnB,sBAAgB,MAAM;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAgB;AAAA,IACpB,CAAC,GAA0C,QAAgB;AACzD,YAAM,EAAE,IAAI,IAAI;AAChB,YAAM,SAAS,EAAE;AACjB,UAAI,cAAc,OAAO;AACzB,wBAAkB,MAAM;AACxB,UAAI,QAAQ,gBAAgB,QAAQ,aAAa;AAC/C,UAAE,eAAe;AACjB,eAAO,iBAAiB,MAAM;AAAA,MAChC;AACA,UAAI,QAAQ,eAAe,QAAQ,WAAW;AAC5C,UAAE,eAAe;AACjB,eAAO,iBAAiB,MAAM;AAAA,MAChC;AACA,UAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,UAAU;AAC/C,YAAI,gBAAgB,IAAI;AACtB,wBAAc;AAAA,QAChB,OAAO;AACL,2BAAiB,MAAM;AAAA,QACzB;AACA,eAAO,aAAa,GAAG;AACvB,eAAO,EAAE,eAAe;AAAA,MAC1B;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,kBAAkB,gBAAgB;AAAA,EAC7C;AAEA,QAAM,kBAAc;AAAA,IAClB,CAAC,MAA0C;AACzC,YAAM,EAAE,OAAO,IAAI;AACnB,wBAAkB,MAAM;AAAA,IAC1B;AAAA,IACA,CAAC,iBAAiB;AAAA,EACpB;AACA,QAAM,sBAAkB;AAAA,IACtB,CAAC,GAAwC,QAAgB;AACvD,YAAM,SAAS,EAAE;AACjB,YAAM,cAAc,OAAO;AAC3B,YAAM,qBAAqB,SAAS,KAAK,WAAW;AAGpD,UAAI,sBAAsB,gBAAgB,IAAI;AAC5C,eAAO,aAAa,GAAG;AACvB,YAAI,OAAO,MAAM,SAAS,GAAG;AAC3B,iBAAO,KAAK;AAAA,QACd;AACA,yBAAiB,MAAM;AAAA,MACzB;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,eAAe,WAAW;AAAA,EACrC;AAEA,QAAM,kBAAc;AAAA,IAClB,CAAC,MAA8C;AAC7C,QAAE,eAAe;AACjB,YAAM,aAAa,EAAE,cAClB,QAAQ,YAAY,EACpB,QAAQ,eAAe,EAAE;AAC5B,UAAI,YAAY;AACd,eAAO,YAAY,CAAC;AAAA,MACtB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEA,MAAM,2BAA2B,CAAC,EAAE,GAAG,MAAM,MAAM;AACjD,SAAO,6BAAAA,QAAA,cAAC,qDAAsB,GAAG,OAAO;AAC1C;AAEO,MAAM,WAAW,CAAC,EAAE,MAAM,YAAY,GAAG,GAAG,MAAM,MAAM;AAC7D,QAAM,MAAM,OAAO,MAAM,UAAU,SAAS;AAC5C,SACE,6BAAAA,QAAA,cAAC,6BAAAC,SAAA,MACE,IAAI,UAAU,IAAI,CAAC,OAAO,QACzB,6BAAAD,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,IAAI,IAAI,GAAG;AAAA,MACpB,MAAK;AAAA,MACL,KAAK;AAAA,MACL,cAAa;AAAA,MACb,SAAQ;AAAA,MACR;AAAA,MACA,OAAO;AAAA,MACP,UAAU,MAAM;AAAA,MAChB,iBAAe,MAAM,eAAe;AAAA,MACpC,UAAU,CAAC,MAAM,IAAI,gBAAgB,GAAG,GAAG;AAAA,MAC3C,SAAS,CAAC,MAAM;AACd,YAAI,EAAE,OAAO,UAAU,OAAO;AAC5B,cAAI,gBAAgB,GAAG,GAAG;AAAA,QAC5B;AAAA,MACF;AAAA,MACA,WAAW,CAAC,MAAM,IAAI,cAAc,GAAG,GAAG;AAAA,MAC1C,SAAS,IAAI;AAAA,MACb,SAAS,IAAI;AAAA,MACb,OAAO,CAAC,QAAQ,MAAM,QAAQ;AAAA;AAAA,EAChC,CACD,CACH;AAEJ;AAEA,IAAO,mBAAQ;",
+  "names": ["React", "SingleCharacterInputs"]
 }