@trilogy-ds/react 4.8.2 → 4.9.0-beta-build-1

package/lib/components/otp/Otp.js

@@ -1,13 +1,15 @@
-import { __assign, __read, __rest } from "tslib";
-import { Text, TextMarkup } from '../../components/text';
-import { useTrilogyContext } from '../../context/index';
-import { hashClass } from '../../helpers/hashClassesHelpers';
-import { TypographyColor } from '../../objects/Typography';
-import { is } from '../../services/classify';
-import translation from '@trilogy-ds/locales/lib/otp';
-import clsx from 'clsx';
-import React, { useEffect, useRef, useState } from 'react';
-import { ComponentName } from '../enumsComponentsName';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var text_1 = require("../../components/text");
+var index_1 = require("../../context/index");
+var hashClassesHelpers_1 = require("../../helpers/hashClassesHelpers");
+var Typography_1 = require("../../objects/Typography");
+var classify_1 = require("../../services/classify");
+var otp_1 = tslib_1.__importDefault(require("@trilogy-ds/locales/lib/otp"));
+var clsx_1 = tslib_1.__importDefault(require("clsx"));
+var react_1 = tslib_1.__importStar(require("react"));
+var enumsComponentsName_1 = require("../enumsComponentsName");
 var stringToCode = function (str, codeSize) {
     if (!str)
         return new Array(codeSize).fill(null);
@@ -84,18 +86,18 @@ var formatTranslation = function (translation, x, y) {
  * - -------------------------- WEB PROPERTIES -------------------------------
  * @param className {string} Additional css classes
  */
-var Otp = React.forwardRef(function (_a, ref) {
-    var className = _a.className, id = _a.id, value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onChange = _a.onChange, onFocus = _a.onFocus, label = _a.label, help = _a.help, autoFocus = _a.autoFocus, others = __rest(_a, ["className", "id", "value", "length", "disabled", "error", "onCompleted", "onChange", "onFocus", "label", "help", "autoFocus"]);
-    var _c = __read(useState(stringToCode(value, length) || new Array(length).fill(null)), 2), codeInput = _c[0], setCodeInput = _c[1];
-    var hasChanged = useRef(false);
-    var styled = useTrilogyContext().styled;
-    var classes = hashClass(styled, clsx('otp-list', error && is('error'), className));
-    useEffect(function () {
+var Otp = react_1.default.forwardRef(function (_a, ref) {
+    var className = _a.className, id = _a.id, value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onChange = _a.onChange, onFocus = _a.onFocus, label = _a.label, help = _a.help, autoFocus = _a.autoFocus, others = tslib_1.__rest(_a, ["className", "id", "value", "length", "disabled", "error", "onCompleted", "onChange", "onFocus", "label", "help", "autoFocus"]);
+    var _c = tslib_1.__read((0, react_1.useState)(stringToCode(value, length) || new Array(length).fill(null)), 2), codeInput = _c[0], setCodeInput = _c[1];
+    var hasChanged = (0, react_1.useRef)(false);
+    var styled = (0, index_1.useTrilogyContext)().styled;
+    var classes = (0, hashClassesHelpers_1.hashClass)(styled, (0, clsx_1.default)('otp-list', error && (0, classify_1.is)('error'), className));
+    (0, react_1.useEffect)(function () {
         if (!disabled) {
             isCompleted(codeInput) && (onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeToString(codeInput)));
         }
     }, [length, codeInput, onCompleted, disabled]);
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         hasChanged.current = codeInput.find(function (code) { return code !== null; }) !== undefined;
         if (hasChanged.current) {
             onChange === null || onChange === void 0 ? void 0 : onChange(codeToString(codeInput));
@@ -117,17 +119,17 @@ var Otp = React.forwardRef(function (_a, ref) {
         var target = e.target;
         target.setSelectionRange(0, target.value.length);
     };
-    return (React.createElement(React.Fragment, null,
-        label && (React.createElement(Text, { markup: TextMarkup.P, typo: (disabled && TypographyColor.TEXT_NEUTRAL) ||
-                (error && TypographyColor.TEXT_ERROR) ||
-                TypographyColor.TEXT_MAIN }, label)),
-        React.createElement("div", { ref: ref, id: id, className: classes, onClick: function () {
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        label && (react_1.default.createElement(text_1.Text, { markup: text_1.TextMarkup.P, typo: (disabled && Typography_1.TypographyColor.TEXT_NEUTRAL) ||
+                (error && Typography_1.TypographyColor.TEXT_ERROR) ||
+                Typography_1.TypographyColor.TEXT_MAIN }, label)),
+        react_1.default.createElement("div", { ref: ref, id: id, className: classes, onClick: function () {
                 if (!disabled) {
                     onFocus === null || onFocus === void 0 ? void 0 : onFocus(true);
                 }
-            } }, codeInput.map(function (digit, idx) { return (React.createElement("input", __assign({ "aria-disabled": disabled, key: idx, type: 'tel', inputMode: 'numeric', autoComplete: 'one-time-code', autoFocus: idx === 0 && autoFocus, pattern: '\\d{1}', maxLength: length, className: hashClass(styled, clsx('otp')), value: "".concat(digit !== null && digit !== void 0 ? digit : ''), onKeyUp: inputOnKeyUp, onFocus: inputOnFocus, onChange: function (e) { return inputOnChange(e, idx); }, disabled: disabled, title: formatTranslation(translation.inputTitle, String(idx + 1), String(length)) }, others))); })),
-        help && (React.createElement(Text, { className: hashClass(styled, clsx('help')), markup: TextMarkup.P, typo: (error && TypographyColor.TEXT_ERROR) || TypographyColor.TEXT_MAIN }, help))));
+            } }, codeInput.map(function (digit, idx) { return (react_1.default.createElement("input", tslib_1.__assign({ "aria-disabled": disabled, key: idx, type: 'tel', inputMode: 'numeric', autoComplete: 'one-time-code', autoFocus: idx === 0 && autoFocus, pattern: '\\d{1}', maxLength: length, className: (0, hashClassesHelpers_1.hashClass)(styled, (0, clsx_1.default)('otp')), value: "".concat(digit !== null && digit !== void 0 ? digit : ''), onKeyUp: inputOnKeyUp, onFocus: inputOnFocus, onChange: function (e) { return inputOnChange(e, idx); }, disabled: disabled, title: formatTranslation(otp_1.default.inputTitle, String(idx + 1), String(length)) }, others))); })),
+        help && (react_1.default.createElement(text_1.Text, { className: (0, hashClassesHelpers_1.hashClass)(styled, (0, clsx_1.default)('help')), markup: text_1.TextMarkup.P, typo: (error && Typography_1.TypographyColor.TEXT_ERROR) || Typography_1.TypographyColor.TEXT_MAIN }, help))));
 });
-Otp.displayName = ComponentName.Otp;
-export default Otp;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9vdHAvT3RwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUNuRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHNCQUFzQixDQUFBO0FBQ3RELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLFdBQVcsTUFBTSw2QkFBNkIsQ0FBQTtBQUNyRCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUMxRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFLdEQsSUFBTSxZQUFZLEdBQUcsVUFBQyxHQUF1QixFQUFFLFFBQWdCO0lBQzdELElBQUksQ0FBQyxHQUFHO1FBQUUsT0FBTyxJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUE7SUFDL0MsT0FBTyxHQUFHLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxVQUFDLElBQUksSUFBSyxPQUFBLENBQUMsSUFBSSxLQUFLLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUMsRUFBbkMsQ0FBbUMsQ0FBQyxDQUFBO0FBQ3pFLENBQUMsQ0FBQTtBQUVELElBQU0sWUFBWSxHQUFHLFVBQUMsSUFBb0I7SUFDeEMsT0FBTyxJQUFJLENBQUMsR0FBRyxD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
+Otp.displayName = enumsComponentsName_1.ComponentName.Otp;
+exports.default = Otp;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9vdHAvT3RwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7QUFBQSwwQ0FBb0Q7QUFDcEQseUNBQW1EO0FBQ25ELG1FQUF3RDtBQUN4RCxtREFBc0Q7QUFDdEQsZ0RBQXdDO0FBQ3hDLDRFQUFxRDtBQUNyRCxzREFBdUI7QUFDdkIscURBQTBEO0FBQzFELDhEQUFzRDtBQUt0RCxJQUFNLFlBQVksR0FBRyxVQUFDLEdBQXVCLEVBQUUsUUFBZ0I7SUFDN0QsSUFBSSxDQUFDLEdBQUc7UUFBRSxPQUFPLElBQUksS0FBSyxDQUFDLFFBQVEsQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQTtJQUMvQyxPQUFPLEdBQUcsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUFDLENBQUMsR0FBRyxDQUFDLFVBQUMsSUFBSSxJQUFLLE9BQUEsQ0FBQyxJQUFJLEtBQUssRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQyxFQUFuQyxDQUFtQyxDQUFDLENBQUE7QUFDekUsQ0FBQyxDQUFBO0FBRUQsSUFBTSxZQUFZLEdBQUcsVUFBQyxJQUFvQjtJQUN4QyxPQUFPLElBQUksQ0FBQyxHQUFHLENBQUMsVUFBQyxJQUFJLElBQUssT0FBQSxDQUFDLElBQUksS0FBSyxJQUFJLENBQUMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEVBQTVCLENBQTRCLENBQUMsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLENBQUE7QUFDbEUsQ0FBQyxDQUFBO0FBRUQsSUFBTSxXQUFXLEdBQUcsVUFBQyxNQUFzQjtJQUN6QyxPQUFPLE1BQU0sQ0FBQyxLQUFLLENBQUMsVUFBQyxJQUFJLElBQUssT0FBQSxJQUFJLEtBQUssSUFBSSxFQUFiLENBQWEsQ0FBQyxDQUFBO0FBQzlDLENBQUMsQ0FBQTtB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

package/lib/components/otp/Otp.mjs

@@ -0,0 +1,133 @@
+import { __assign, __read, __rest } from "tslib";
+import { Text, TextMarkup } from '../../components/text';
+import { useTrilogyContext } from '../../context/index';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import { TypographyColor } from '../../objects/Typography';
+import { is } from '../../services/classify';
+import translation from '@trilogy-ds/locales/lib/otp';
+import clsx from 'clsx';
+import React, { useEffect, useRef, useState } from 'react';
+import { ComponentName } from '../enumsComponentsName';
+var stringToCode = function (str, codeSize) {
+    if (!str)
+        return new Array(codeSize).fill(null);
+    return str.split('').map(function (char) { return (char === '' ? null : Number(char)); });
+};
+var codeToString = function (code) {
+    return code.map(function (char) { return (char === null ? '_' : char); }).join('');
+};
+var isCompleted = function (myCode) {
+    return myCode.every(function (code) { return code !== null; });
+};
+var focusToNextInput = function (target, value) {
+    var nextElementSibling = target.nextElementSibling;
+    if (nextElementSibling) {
+        if (value)
+            nextElementSibling.value = value;
+        if (target.value.length)
+            nextElementSibling.focus();
+    }
+    else {
+        target.focus();
+    }
+};
+var focusToPrevInput = function (target) {
+    var previousElementSibling = target.previousElementSibling;
+    if (previousElementSibling) {
+        previousElementSibling.focus();
+    }
+    else {
+        target.focus();
+    }
+};
+var updateCodeInput = function (value, index, code) {
+    var numberValue = Number(value);
+    if (isNaN(numberValue) || value.length < 1) {
+        return code;
+    }
+    var newCodeInput = code.map(function (code, idx) {
+        return idx === index ? Number(value.slice(0, 1)) : code;
+    });
+    return updateCodeInput(value.slice(1), index + 1, newCodeInput);
+};
+var inputOnKeyUp = function (e) {
+    var key = e.key;
+    var target = e.target;
+    if (key === 'ArrowRight' || key === 'ArrowDown') {
+        return focusToNextInput(target);
+    }
+    if (key === 'ArrowLeft' || key === 'ArrowUp') {
+        return focusToPrevInput(target);
+    }
+    if (key === 'Backspace') {
+        return target.value === '' && focusToPrevInput(target);
+    }
+    if (key >= '0' && key <= '9') {
+        focusToNextInput(target);
+    }
+};
+var formatTranslation = function (translation, x, y) {
+    return translation.replace(/:x/g, x).replace(/:y/g, y);
+};
+/**
+ * OTP Code Component
+ * @param value {string} Code Text Input
+ * @param length {number} Code Size Number
+ * @param disabled {boolean} Disabled OTP Code Input
+ * @param error {boolean} OTP Code Input has error | Display error icon
+ * @param onCompleted {Function} Return code input string
+ * @param onChange {Function} onChange Input return current code
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param autoFocus {boolean} Should auto focus otp
+ * @param label {string} Label for OTP
+ * @param help {string} error message to display
+ * - -------------------------- WEB PROPERTIES -------------------------------
+ * @param className {string} Additional css classes
+ */
+var Otp = React.forwardRef(function (_a, ref) {
+    var className = _a.className, id = _a.id, value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onChange = _a.onChange, onFocus = _a.onFocus, label = _a.label, help = _a.help, autoFocus = _a.autoFocus, others = __rest(_a, ["className", "id", "value", "length", "disabled", "error", "onCompleted", "onChange", "onFocus", "label", "help", "autoFocus"]);
+    var _c = __read(useState(stringToCode(value, length) || new Array(length).fill(null)), 2), codeInput = _c[0], setCodeInput = _c[1];
+    var hasChanged = useRef(false);
+    var styled = useTrilogyContext().styled;
+    var classes = hashClass(styled, clsx('otp-list', error && is('error'), className));
+    useEffect(function () {
+        if (!disabled) {
+            isCompleted(codeInput) && (onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeToString(codeInput)));
+        }
+    }, [length, codeInput, onCompleted, disabled]);
+    useEffect(function () {
+        hasChanged.current = codeInput.find(function (code) { return code !== null; }) !== undefined;
+        if (hasChanged.current) {
+            onChange === null || onChange === void 0 ? void 0 : onChange(codeToString(codeInput));
+        }
+    }, [codeInput]);
+    var inputOnChange = function (e, idx) {
+        var target = e.target;
+        var targetValue = target.value.trim();
+        if (targetValue.length > 0) {
+            setCodeInput(updateCodeInput(targetValue, idx, codeInput));
+        }
+        else {
+            setCodeInput(codeInput.map(function (code, index) {
+                return index === idx ? null : code;
+            }));
+        }
+    };
+    var inputOnFocus = function (e) {
+        var target = e.target;
+        target.setSelectionRange(0, target.value.length);
+    };
+    return (React.createElement(React.Fragment, null,
+        label && (React.createElement(Text, { markup: TextMarkup.P, typo: (disabled && TypographyColor.TEXT_NEUTRAL) ||
+                (error && TypographyColor.TEXT_ERROR) ||
+                TypographyColor.TEXT_MAIN }, label)),
+        React.createElement("div", { ref: ref, id: id, className: classes, onClick: function () {
+                if (!disabled) {
+                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(true);
+                }
+            } }, codeInput.map(function (digit, idx) { return (React.createElement("input", __assign({ "aria-disabled": disabled, key: idx, type: 'tel', inputMode: 'numeric', autoComplete: 'one-time-code', autoFocus: idx === 0 && autoFocus, pattern: '\\d{1}', maxLength: length, className: hashClass(styled, clsx('otp')), value: "".concat(digit !== null && digit !== void 0 ? digit : ''), onKeyUp: inputOnKeyUp, onFocus: inputOnFocus, onChange: function (e) { return inputOnChange(e, idx); }, disabled: disabled, title: formatTranslation(translation.inputTitle, String(idx + 1), String(length)) }, others))); })),
+        help && (React.createElement(Text, { className: hashClass(styled, clsx('help')), markup: TextMarkup.P, typo: (error && TypographyColor.TEXT_ERROR) || TypographyColor.TEXT_MAIN }, help))));
+});
+Otp.displayName = ComponentName.Otp;
+export default Otp;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vY29tcG9uZW50cy9vdHAvT3RwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQTtBQUNuRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sOEJBQThCLENBQUE7QUFDeEQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHNCQUFzQixDQUFBO0FBQ3RELE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQTtBQUN4QyxPQUFPLFdBQVcsTUFBTSw2QkFBNkIsQ0FBQTtBQUNyRCxPQUFPLElBQUksTUFBTSxNQUFNLENBQUE7QUFDdkIsT0FBTyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLFFBQVEsRUFBRSxNQUFNLE9BQU8sQ0FBQTtBQUMxRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFLdEQsSUFBTSxZQUFZLEdBQUcsVUFBQyxHQUF1QixFQUFFLFFBQWdCO0lBQzdELElBQUksQ0FBQyxHQUFHO1FBQUUsT0FBTyxJQUFJLEtBQUssQ0FBQyxRQUFRLENBQUMsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUE7SUFDL0MsT0FBTyxHQUFHLENBQUMsS0FBSyxDQUFDLEVBQUUsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxVQUFDLElBQUksSUFBSyxPQUFBLENBQUMsSUFBSSxLQUFLLEVBQUUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUMsRUFBbkMsQ0FBbUMsQ0FBQyxDQUFBO0FBQ3pFLENBQUMsQ0FBQTtBQUVELElBQU0sWUFBWSxHQUFHLFVBQUMsSUFBb0I7SUFDeEMsT0FBTyxJQUFJLENBQUMsR0FBRyxD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

package/lib/components/otp/Otp.native.d.mts

@@ -0,0 +1,17 @@
+import React from "react";
+import { SafeAreaView } from "react-native";
+import { OtpProps } from "./OtpProps";
+/**
+ * OTP Code Component
+ * @param value {string} Code Text Input
+ * @param length {number} Code Size Number
+ * @param disabled {boolean} Disabled OTP Code Input
+ * @param error {boolean} OTP Code Input has error | Display error icon
+ * @param onCompleted {Function} Return code input string
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param activated {boolean} Activated OTP
+ * @param onChange {Function} onChange Input return current code
+ * @param label {string} Label for OTP
+ */
+declare const Otp: React.ForwardRefExoticComponent<OtpProps & React.RefAttributes<SafeAreaView>>;
+export default Otp;

package/lib/components/otp/Otp.native.js

@@ -1,12 +1,14 @@
-import { __assign, __read, __rest, __spreadArray } from "tslib";
-import React, { useEffect, useRef, useState } from "react";
-import { Pressable, SafeAreaView, StyleSheet, TextInput, View, } from "react-native";
-import { getColorStyle, TrilogyColor } from "../../objects/facets/Color";
-import { Icon, IconColor, IconName, IconSize } from "../../components/icon";
-import { Title, TitleLevels } from "../../components/title";
-import { Text, TextLevels } from "../../components/text";
-import { TypographyAlign } from "../../objects";
-import { ComponentName } from "../../components/enumsComponentsName";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var react_native_1 = require("react-native");
+var Color_1 = require("../../objects/facets/Color");
+var icon_1 = require("../../components/icon");
+var title_1 = require("../../components/title");
+var text_1 = require("../../components/text");
+var objects_1 = require("../../objects");
+var enumsComponentsName_1 = require("../../components/enumsComponentsName");
 /**
  * OTP Code Component
  * @param value {string} Code Text Input
@@ -19,29 +21,29 @@ import { ComponentName } from "../../components/enumsComponentsName";
  * @param onChange {Function} onChange Input return current code
  * @param label {string} Label for OTP
  */
-var Otp = React.forwardRef(function (_a, ref) {
-    var value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onFocus = _a.onFocus, activated = _a.activated, onChange = _a.onChange, label = _a.label, others = __rest(_a, ["value", "length", "disabled", "error", "onCompleted", "onFocus", "activated", "onChange", "label"]);
-    var _c = __read(useState(value || ""), 2), codeInput = _c[0], setCodeInput = _c[1];
+var Otp = react_1.default.forwardRef(function (_a, ref) {
+    var value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onFocus = _a.onFocus, activated = _a.activated, onChange = _a.onChange, label = _a.label, others = tslib_1.__rest(_a, ["value", "length", "disabled", "error", "onCompleted", "onFocus", "activated", "onChange", "label"]);
+    var _c = tslib_1.__read((0, react_1.useState)(value || ""), 2), codeInput = _c[0], setCodeInput = _c[1];
     // eslint-disable-next-line prefer-spread
-    var _d = __read(useState(__spreadArray([], __read(Array(length).keys()), false)), 1), codeDigitsArray = _d[0];
-    var _e = __read(useState(false), 2), focused = _e[0], setFocused = _e[1];
-    var color = getColorStyle(disabled ? TrilogyColor.DISABLED : error ? TrilogyColor.ERROR : TrilogyColor.MAIN);
-    useEffect(function () {
+    var _d = tslib_1.__read((0, react_1.useState)(tslib_1.__spreadArray([], tslib_1.__read(Array(length).keys()), false)), 1), codeDigitsArray = _d[0];
+    var _e = tslib_1.__read((0, react_1.useState)(false), 2), focused = _e[0], setFocused = _e[1];
+    var color = (0, Color_1.getColorStyle)(disabled ? Color_1.TrilogyColor.DISABLED : error ? Color_1.TrilogyColor.ERROR : Color_1.TrilogyColor.MAIN);
+    (0, react_1.useEffect)(function () {
         if (/^-?\d*\.?\d*$/.test(codeInput) && !disabled) {
             setCodeInput(value || "");
         }
     }, [value]);
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         if (!disabled && codeInput && codeInput.length >= length) {
             onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeInput);
         }
     }, [value, length, codeInput]);
-    var refInput = useRef(null);
+    var refInput = (0, react_1.useRef)(null);
     var handleOnPress = function () {
         var _a;
         (_a = refInput === null || refInput === void 0 ? void 0 : refInput.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
-    var style = StyleSheet.create({
+    var style = react_native_1.StyleSheet.create({
         container: {
             flex: 1,
             alignItems: "flex-start",
@@ -54,7 +56,7 @@ var Otp = React.forwardRef(function (_a, ref) {
             alignItems: "center",
         },
         inputContainer: {
-            borderColor: getColorStyle(disabled ? TrilogyColor.DISABLED : activated ? TrilogyColor.MAIN : error ? TrilogyColor.ERROR : TrilogyColor.NEUTRAL),
+            borderColor: (0, Color_1.getColorStyle)(disabled ? Color_1.TrilogyColor.DISABLED : activated ? Color_1.TrilogyColor.MAIN : error ? Color_1.TrilogyColor.ERROR : Color_1.TrilogyColor.NEUTRAL),
             borderWidth: 1,
             borderRadius: 4,
             marginHorizontal: 5,
@@ -88,7 +90,7 @@ var Otp = React.forwardRef(function (_a, ref) {
         currentInput: {
             width: 15,
             height: 1,
-            backgroundColor: getColorStyle(focused ? TrilogyColor.MAIN : 'transparent'),
+            backgroundColor: (0, Color_1.getColorStyle)(focused ? Color_1.TrilogyColor.MAIN : 'transparent'),
         },
         text: {
             paddingLeft: 5,
@@ -100,19 +102,19 @@ var Otp = React.forwardRef(function (_a, ref) {
         var emptyInputChar = " ";
         var digit = codeInput[idx] || emptyInputChar;
         if (idx <= codeInput.length) {
-            return (React.createElement(View, { key: idx, style: style.inputSelectedContainer },
-                React.createElement(Text, { typo: TypographyAlign.TEXT_CENTERED, level: TextLevels.TWO }, digit),
-                Boolean(idx === codeInput.length) && (React.createElement(View, { style: style.currentInput }))));
+            return (react_1.default.createElement(react_native_1.View, { key: idx, style: style.inputSelectedContainer },
+                react_1.default.createElement(text_1.Text, { typo: objects_1.TypographyAlign.TEXT_CENTERED, level: text_1.TextLevels.TWO }, digit),
+                Boolean(idx === codeInput.length) && (react_1.default.createElement(react_native_1.View, { style: style.currentInput }))));
         }
-        return (React.createElement(View, { key: idx, style: style.inputContainer },
-            React.createElement(Title, { level: TitleLevels.FOUR }, digit)));
+        return (react_1.default.createElement(react_native_1.View, { key: idx, style: style.inputContainer },
+            react_1.default.createElement(title_1.Title, { level: title_1.TitleLevels.FOUR }, digit)));
     };
-    return (React.createElement(SafeAreaView, __assign({ ref: ref, style: style.container }, others),
-        React.createElement(View, { style: { flexDirection: "row", alignItems: "center" } },
-            Boolean(label) && (React.createElement(Text, { style: style.text, level: TextLevels.FOUR }, label)),
-            error && (React.createElement(Icon, { name: IconName.EXCLAMATION_CIRCLE, color: IconColor.ERROR, size: IconSize.SMALL }))),
-        React.createElement(Pressable, { style: style.inputsContainer, onPress: handleOnPress }, codeDigitsArray.map(function (_item, index) { return (React.createElement(View, { key: index }, toDigitInput(index, index))); })),
-        React.createElement(TextInput, { ref: refInput, value: codeInput, onChangeText: function (code) {
+    return (react_1.default.createElement(react_native_1.SafeAreaView, tslib_1.__assign({ ref: ref, style: style.container }, others),
+        react_1.default.createElement(react_native_1.View, { style: { flexDirection: "row", alignItems: "center" } },
+            Boolean(label) && (react_1.default.createElement(text_1.Text, { style: style.text, level: text_1.TextLevels.FOUR }, label)),
+            error && (react_1.default.createElement(icon_1.Icon, { name: icon_1.IconName.EXCLAMATION_CIRCLE, color: icon_1.IconColor.ERROR, size: icon_1.IconSize.SMALL }))),
+        react_1.default.createElement(react_native_1.Pressable, { style: style.inputsContainer, onPress: handleOnPress }, codeDigitsArray.map(function (_item, index) { return (react_1.default.createElement(react_native_1.View, { key: index }, toDigitInput(index, index))); })),
+        react_1.default.createElement(react_native_1.TextInput, { ref: refInput, value: codeInput, onChangeText: function (code) {
                 if (/^-?\d*\.?\d*$/.test(code) && !disabled) {
                     if (onChange) {
                         onChange(code);
@@ -129,6 +131,6 @@ var Otp = React.forwardRef(function (_a, ref) {
                 onFocus === null || onFocus === void 0 ? void 0 : onFocus(false);
             }, editable: !disabled, style: style.hiddenCodeInput, testID: 'input-id' })));
 });
-Otp.displayName = ComponentName.Otp;
-export default Otp;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvb3RwL090cC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzFELE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsSUFBSSxHQUFHLE1BQU0sY0FBYyxDQUFBO0FBRXBGLE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFDcEUsT0FBTyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3ZFLE9BQU8sRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLE1BQU0sb0JBQW9CLENBQUE7QUFDdkQsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzNDLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7Ozs7Ozs7R0FXRztBQUNILElBQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXlCLFVBQUMsRUFXckQsRUFBRSxHQUFHO0lBVkosSUFBQSxLQUFLLFdBQUEsRUFDTCxjQUFVLEVBQVYsTUFBTSxtQkFBRyxDQUFDLEtBQUEsRUFDVixRQUFRLGNBQUEsRUFDUixLQUFLLFdBQUEsRUFDTCxXQUFXLGlCQUFBLEVBQ1gsT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0YsTUFBTSxjQVYyQyxvR0FXckQsQ0FEVTtJQUVILElBQUEsS0FBQSxPQUE0QixRQUFRLENBQVMs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
+Otp.displayName = enumsComponentsName_1.ComponentName.Otp;
+exports.default = Otp;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvb3RwL090cC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7OztBQUFBLHFEQUEwRDtBQUMxRCw2Q0FBb0Y7QUFFcEYsZ0RBQW9FO0FBQ3BFLDBDQUF1RTtBQUN2RSw0Q0FBdUQ7QUFDdkQsMENBQW9EO0FBQ3BELHFDQUEyQztBQUMzQyx3RUFBZ0U7QUFFaEU7Ozs7Ozs7Ozs7O0dBV0c7QUFDSCxJQUFNLEdBQUcsR0FBRyxlQUFLLENBQUMsVUFBVSxDQUF5QixVQUFDLEVBV3JELEVBQUUsR0FBRztJQVZKLElBQUEsS0FBSyxXQUFBLEVBQ0wsY0FBVSxFQUFWLE1BQU0sbUJBQUcsQ0FBQyxLQUFBLEVBQ1YsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0wsV0FBVyxpQkFBQSxFQUNYLE9BQU8sYUFBQSxFQUNQLFNBQVMsZUFBQSxFQUNULFFBQVEsY0FBQSxFQUNSLEtBQUssV0FBQSxFQUNGLE1BQU0sc0JBVjJDLG9HQVdyRCxDQURVO0lBRUgsSUFBQSxLQUFBLGVBQTRCLElBQUEsZ0JBQVEsRUFBUyxLQUFLLElBQUksRUFBRSxDQUFDLElBQUEsRUFBeEQsU0FBUyxRQUFBLEVBQUUsWUFBWSxRQUFpQyxDQUFBO0lBQy9ELHlDQUF5QztJQUNuQyxJQUFBLEtBQUEsZUFBb0IsSUFBQSxnQkFBUSwyQ0FBSyxLQUFLLENBQUMsTUFBTSxDQUFDLENBQUMsSUFBSSxFQUFFLFVBQUUsSUFBQSxFQUF0RCxlQUFlLFFBQXVDLENBQUE7SUFFdkQsSUFBQSxLQUFBLGVBQXdCLElBQUEsZ0JBQVEsRUFBQyxLQUFLLENBQUMsSUFBQSxFQUF0QyxPQUFPLFFBQUEsRUFBRSxVQUFVLFFBQW1CLENBQUE7SUFDN0MsSUFBTSxLQUFLLEdBQUcsSUFBQSxxQkFBYSxFQUFFLFFBQVEsQ0FBQyxDQUFDLENBQUMsb0JBQVksQ0FBQyxRQUFRLENBQUEsQ0FBQyxD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

package/lib/components/otp/Otp.native.mjs

@@ -0,0 +1,134 @@
+import { __assign, __read, __rest, __spreadArray } from "tslib";
+import React, { useEffect, useRef, useState } from "react";
+import { Pressable, SafeAreaView, StyleSheet, TextInput, View, } from "react-native";
+import { getColorStyle, TrilogyColor } from "../../objects/facets/Color";
+import { Icon, IconColor, IconName, IconSize } from "../../components/icon";
+import { Title, TitleLevels } from "../../components/title";
+import { Text, TextLevels } from "../../components/text";
+import { TypographyAlign } from "../../objects";
+import { ComponentName } from "../../components/enumsComponentsName";
+/**
+ * OTP Code Component
+ * @param value {string} Code Text Input
+ * @param length {number} Code Size Number
+ * @param disabled {boolean} Disabled OTP Code Input
+ * @param error {boolean} OTP Code Input has error | Display error icon
+ * @param onCompleted {Function} Return code input string
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param activated {boolean} Activated OTP
+ * @param onChange {Function} onChange Input return current code
+ * @param label {string} Label for OTP
+ */
+var Otp = React.forwardRef(function (_a, ref) {
+    var value = _a.value, _b = _a.length, length = _b === void 0 ? 6 : _b, disabled = _a.disabled, error = _a.error, onCompleted = _a.onCompleted, onFocus = _a.onFocus, activated = _a.activated, onChange = _a.onChange, label = _a.label, others = __rest(_a, ["value", "length", "disabled", "error", "onCompleted", "onFocus", "activated", "onChange", "label"]);
+    var _c = __read(useState(value || ""), 2), codeInput = _c[0], setCodeInput = _c[1];
+    // eslint-disable-next-line prefer-spread
+    var _d = __read(useState(__spreadArray([], __read(Array(length).keys()), false)), 1), codeDigitsArray = _d[0];
+    var _e = __read(useState(false), 2), focused = _e[0], setFocused = _e[1];
+    var color = getColorStyle(disabled ? TrilogyColor.DISABLED : error ? TrilogyColor.ERROR : TrilogyColor.MAIN);
+    useEffect(function () {
+        if (/^-?\d*\.?\d*$/.test(codeInput) && !disabled) {
+            setCodeInput(value || "");
+        }
+    }, [value]);
+    useEffect(function () {
+        if (!disabled && codeInput && codeInput.length >= length) {
+            onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeInput);
+        }
+    }, [value, length, codeInput]);
+    var refInput = useRef(null);
+    var handleOnPress = function () {
+        var _a;
+        (_a = refInput === null || refInput === void 0 ? void 0 : refInput.current) === null || _a === void 0 ? void 0 : _a.focus();
+    };
+    var style = StyleSheet.create({
+        container: {
+            flex: 1,
+            alignItems: "flex-start",
+            justifyContent: "center",
+            alignSelf: "center",
+        },
+        inputsContainer: {
+            flexDirection: "row",
+            justifyContent: "center",
+            alignItems: "center",
+        },
+        inputContainer: {
+            borderColor: getColorStyle(disabled ? TrilogyColor.DISABLED : activated ? TrilogyColor.MAIN : error ? TrilogyColor.ERROR : TrilogyColor.NEUTRAL),
+            borderWidth: 1,
+            borderRadius: 4,
+            marginHorizontal: 5,
+            justifyContent: "center",
+            alignContent: "center",
+            alignItems: "center",
+            width: 28,
+            height: 35,
+        },
+        inputSelectedContainer: {
+            borderColor: color,
+            borderWidth: 1,
+            borderRadius: 4,
+            marginHorizontal: 5,
+            justifyContent: "center",
+            alignContent: "center",
+            alignItems: "center",
+            width: 28,
+            height: 35,
+        },
+        hiddenCodeInput: {
+            position: "absolute",
+            height: 1,
+            width: 1,
+            opacity: 0,
+        },
+        icon: {
+            marginHorizontal: 8,
+            marginBottom: 8,
+        },
+        currentInput: {
+            width: 15,
+            height: 1,
+            backgroundColor: getColorStyle(focused ? TrilogyColor.MAIN : 'transparent'),
+        },
+        text: {
+            paddingLeft: 5,
+            marginBottom: 8,
+            color: color,
+        },
+    });
+    var toDigitInput = function (_value, idx) {
+        var emptyInputChar = " ";
+        var digit = codeInput[idx] || emptyInputChar;
+        if (idx <= codeInput.length) {
+            return (React.createElement(View, { key: idx, style: style.inputSelectedContainer },
+                React.createElement(Text, { typo: TypographyAlign.TEXT_CENTERED, level: TextLevels.TWO }, digit),
+                Boolean(idx === codeInput.length) && (React.createElement(View, { style: style.currentInput }))));
+        }
+        return (React.createElement(View, { key: idx, style: style.inputContainer },
+            React.createElement(Title, { level: TitleLevels.FOUR }, digit)));
+    };
+    return (React.createElement(SafeAreaView, __assign({ ref: ref, style: style.container }, others),
+        React.createElement(View, { style: { flexDirection: "row", alignItems: "center" } },
+            Boolean(label) && (React.createElement(Text, { style: style.text, level: TextLevels.FOUR }, label)),
+            error && (React.createElement(Icon, { name: IconName.EXCLAMATION_CIRCLE, color: IconColor.ERROR, size: IconSize.SMALL }))),
+        React.createElement(Pressable, { style: style.inputsContainer, onPress: handleOnPress }, codeDigitsArray.map(function (_item, index) { return (React.createElement(View, { key: index }, toDigitInput(index, index))); })),
+        React.createElement(TextInput, { ref: refInput, value: codeInput, onChangeText: function (code) {
+                if (/^-?\d*\.?\d*$/.test(code) && !disabled) {
+                    if (onChange) {
+                        onChange(code);
+                    }
+                    setCodeInput(code);
+                }
+            }, keyboardType: "numeric", returnKeyType: "send", textContentType: 'oneTimeCode', maxLength: length, onFocus: function () {
+                if (!disabled) {
+                    setFocused(true);
+                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(true);
+                }
+            }, onBlur: function () {
+                setFocused(false);
+                onFocus === null || onFocus === void 0 ? void 0 : onFocus(false);
+            }, editable: !disabled, style: style.hiddenCodeInput, testID: 'input-id' })));
+});
+Otp.displayName = ComponentName.Otp;
+export default Otp;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwLm5hdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL2NvbXBvbmVudHMvb3RwL090cC5uYXRpdmUudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsUUFBUSxFQUFFLE1BQU0sT0FBTyxDQUFBO0FBQzFELE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxTQUFTLEVBQUUsSUFBSSxHQUFHLE1BQU0sY0FBYyxDQUFBO0FBRXBGLE9BQU8sRUFBRSxhQUFhLEVBQUUsWUFBWSxFQUFFLE1BQU0sd0JBQXdCLENBQUE7QUFDcEUsT0FBTyxFQUFFLElBQUksRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLFFBQVEsRUFBRSxNQUFNLG1CQUFtQixDQUFBO0FBQ3ZFLE9BQU8sRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLE1BQU0sb0JBQW9CLENBQUE7QUFDdkQsT0FBTyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsTUFBTSxtQkFBbUIsQ0FBQTtBQUNwRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sV0FBVyxDQUFBO0FBQzNDLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQTtBQUVoRTs7Ozs7Ozs7Ozs7R0FXRztBQUNILElBQU0sR0FBRyxHQUFHLEtBQUssQ0FBQyxVQUFVLENBQXlCLFVBQUMsRUFXckQsRUFBRSxHQUFHO0lBVkosSUFBQSxLQUFLLFdBQUEsRUFDTCxjQUFVLEVBQVYsTUFBTSxtQkFBRyxDQUFDLEtBQUEsRUFDVixRQUFRLGNBQUEsRUFDUixLQUFLLFdBQUEsRUFDTCxXQUFXLGlCQUFBLEVBQ1gsT0FBTyxhQUFBLEVBQ1AsU0FBUyxlQUFBLEVBQ1QsUUFBUSxjQUFBLEVBQ1IsS0FBSyxXQUFBLEVBQ0YsTUFBTSxjQVYyQyxvR0FXckQsQ0FEVTtJQUVILElBQUEsS0FBQSxPQUE0QixRQUFRLENBQVMs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

package/lib/components/otp/OtpProps.d.mts

@@ -0,0 +1,20 @@
+import { SafeAreaView } from 'react-native';
+import { CommonProps } from '../../objects/facets/CommonProps';
+/**
+ * Otp Interface
+ */
+export interface OtpProps extends CommonProps {
+    value?: string;
+    length?: number;
+    disabled?: boolean;
+    error?: boolean;
+    help?: string;
+    onCompleted?: (code?: string) => void;
+    onFocus?: (focused: boolean) => void;
+    onChange?: (code?: string) => void;
+    activated?: boolean;
+    label?: string;
+    autoFocus?: boolean;
+}
+export type OtpRef = HTMLDivElement;
+export type OtpNativeRef = SafeAreaView;

package/lib/components/otp/OtpProps.js

@@ -1,2 +1,3 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwUHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL290cC9PdHBQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/lib/components/otp/OtpProps.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiT3RwUHJvcHMuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL290cC9PdHBQcm9wcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiIn0=

package/lib/components/otp/index.d.mts

@@ -0,0 +1,2 @@
+import Otp from './Otp';
+export { Otp };