@trilogy-ds/react 0.0.1-beta-1 → 0.0.1-beta-3

package/lib/components/options/Options.native.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * Options Component
+ * @param children {React.ReactNode} Children for Options
+ */
+const Options = ({ children }) => {
+    const styles = StyleSheet.create({
+        options: {
+            flexDirection: 'row',
+            width: '100%',
+        },
+    });
+    return React.createElement(View, { style: styles.options }, children);
+};
+Options.displayName = ComponentName.Options;
+export default Options;
+//# sourceMappingURL=Options.native.js.map

package/lib/components/options/Options.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Options.native.js","sourceRoot":"","sources":["../../../components/options/Options.native.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAE/C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAEtD;;;GAGG;AACH,MAAM,OAAO,GAAG,CAAC,EAAE,QAAQ,EAAgB,EAAe,EAAE;IAC1D,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;QAC/B,OAAO,EAAE;YACP,aAAa,EAAE,KAAK;YACpB,KAAK,EAAE,MAAM;SACd;KACF,CAAC,CAAA;IAEF,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,IAAG,QAAQ,CAAQ,CAAA;AACvD,CAAC,CAAA;AAED,OAAO,CAAC,WAAW,GAAG,aAAa,CAAC,OAAO,CAAA;AAE3C,eAAe,OAAO,CAAA"}

package/lib/components/options/OptionsEnum.d.ts

@@ -0,0 +1,5 @@
+export declare enum OptionsItemVariant {
+    ICON = "icon",
+    MULTILINE = "multiline"
+}
+export type OptionsItemVariantValues = `${OptionsItemVariant}`;

package/lib/components/options/OptionsEnum.js

@@ -0,0 +1,6 @@
+export var OptionsItemVariant;
+(function (OptionsItemVariant) {
+    OptionsItemVariant["ICON"] = "icon";
+    OptionsItemVariant["MULTILINE"] = "multiline";
+})(OptionsItemVariant || (OptionsItemVariant = {}));
+//# sourceMappingURL=OptionsEnum.js.map

package/lib/components/options/OptionsEnum.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsEnum.js","sourceRoot":"","sources":["../../../components/options/OptionsEnum.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,kBAGX;AAHD,WAAY,kBAAkB;IAC5B,mCAAa,CAAA;IACb,6CAAuB,CAAA;AACzB,CAAC,EAHW,kBAAkB,KAAlB,kBAAkB,QAG7B"}

package/lib/components/options/OptionsProps.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { Invertable } from '../../objects/facets/Invertable';
+import { Accessibility } from '../../objects';
+/**
+ * Options Interface
+ */
+export interface OptionsProps extends Invertable, Accessibility {
+    children?: React.ReactNode;
+    className?: string;
+}

package/lib/components/options/OptionsProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=OptionsProps.js.map

package/lib/components/options/OptionsProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsProps.js","sourceRoot":"","sources":["../../../components/options/OptionsProps.ts"],"names":[],"mappings":""}

package/lib/components/options/index.d.ts

@@ -0,0 +1,4 @@
+import Options from './Options';
+import OptionsItem from './item';
+export * from './OptionsEnum';
+export { Options, OptionsItem };

package/lib/components/options/index.js

@@ -0,0 +1,5 @@
+import Options from './Options';
+import OptionsItem from './item';
+export * from './OptionsEnum';
+export { Options, OptionsItem };
+//# sourceMappingURL=index.js.map

package/lib/components/options/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/options/index.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,WAAW,CAAA;AAE/B,OAAO,WAAW,MAAM,QAAQ,CAAA;AAEhC,cAAc,eAAe,CAAA;AAE7B,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/lib/components/options/item/OptionsItem.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { OptionsItemProps } from './OptionsItemProps';
+/**
+ * Options Item Component
+ * @param id {string} Id for Options Item - Default id generated by default
+ * @param className {string} Additionnal CSS Classes
+ * @param variant {OptionsItemVariant} Variant for OptionsItem (ICON|MULTILINE)
+ * @param iconName {IconName} Custom icon
+ * @param description {String} Optional description for "multiline" label
+ * @param disabled {boolean} Disabled Options Item
+ * @param name {string} Options Item name
+ * @param value {string} Value for options item
+ * @param checked {boolean} Checked options item
+ * @param label {string} Label for options item
+ * @param readonly {boolean} readonly options item
+ * @param onChange {onChange} onChange Event
+ * @param onClick {onClick} onClick Event
+ * @param children {React.ReactNode}
+ */
+declare const OptionsItem: ({ id, className, disabled, variant, iconName, description, name, value, checked, label, readonly, onChange, onClick, testId, ...others }: OptionsItemProps) => JSX.Element;
+export default OptionsItem;

package/lib/components/options/item/OptionsItem.js

@@ -0,0 +1,71 @@
+import React, { useEffect, useState } from 'react';
+import { Icon } from '../../icon';
+import { has, is } from '../../../services/classify';
+import shortid from 'shortid';
+import { OptionsItemVariant } from '../OptionsEnum';
+import { Text, TextMarkup } from '../../text';
+import { hashClass } from '../../../helpers';
+import clsx from 'clsx';
+import { useTrilogyContext } from '../../../context';
+/**
+ * Options Item Component
+ * @param id {string} Id for Options Item - Default id generated by default
+ * @param className {string} Additionnal CSS Classes
+ * @param variant {OptionsItemVariant} Variant for OptionsItem (ICON|MULTILINE)
+ * @param iconName {IconName} Custom icon
+ * @param description {String} Optional description for "multiline" label
+ * @param disabled {boolean} Disabled Options Item
+ * @param name {string} Options Item name
+ * @param value {string} Value for options item
+ * @param checked {boolean} Checked options item
+ * @param label {string} Label for options item
+ * @param readonly {boolean} readonly options item
+ * @param onChange {onChange} onChange Event
+ * @param onClick {onClick} onClick Event
+ * @param children {React.ReactNode}
+ */
+const OptionsItem = ({ id = shortid.generate(), className, disabled, variant, iconName, description, name, value, checked, label, readonly, onChange, onClick, testId, ...others }) => {
+    const { styled } = useTrilogyContext();
+    const classes = hashClass(styled, clsx('field', variant && variant === OptionsItemVariant.ICON ? has(`${variant}`) : is(`${variant}`), className));
+    const [_checked, setChecked] = useState(Boolean(checked) || false);
+    const multilineClass = hashClass(styled, clsx(variant && variant == OptionsItemVariant.MULTILINE ? 'is-descriptive' : ''));
+    useEffect(() => {
+        if (!readonly) {
+            setChecked(checked || false);
+        }
+    }, [readonly, checked]);
+    return (React.createElement("div", { className: classes, ...others },
+        React.createElement("div", { className: hashClass(styled, clsx('control')) },
+            React.createElement("input", { type: 'radio', id: id, "data-testid": testId, name: name, value: value, disabled: disabled, checked: readonly ? checked : _checked, onChange: (e) => {
+                    return e;
+                }, onClick: (e) => {
+                    e.stopPropagation();
+                    const target = e.target;
+                    if (!readonly && target.checked !== undefined) {
+                        setChecked(target.checked);
+                    }
+                    target.value = value || '';
+                    if (onChange) {
+                        onChange({
+                            optionId: target.id,
+                            optionValue: target.value,
+                            optionName: target.name,
+                            optionChecked: target.checked,
+                        });
+                    }
+                    if (onClick) {
+                        onClick({
+                            optionId: target.id,
+                            optionValue: target.value,
+                            optionName: target.name,
+                            optionChecked: target.checked,
+                        });
+                    }
+                } }),
+            React.createElement("label", { htmlFor: id, className: multilineClass },
+                label,
+                variant && iconName && React.createElement(Icon, { name: iconName, ...others }),
+                variant && variant == OptionsItemVariant.MULTILINE && description && (React.createElement(Text, { markup: TextMarkup.SPAN }, description))))));
+};
+export default OptionsItem;
+//# sourceMappingURL=OptionsItem.js.map

package/lib/components/options/item/OptionsItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsItem.js","sourceRoot":"","sources":["../../../../components/options/item/OptionsItem.tsx"],"names":[],"mappings":"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"}

package/lib/components/options/item/OptionsItem.native.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { OptionsItemProps } from './OptionsItemProps';
+import { ComponentName } from '../../enumsComponentsName';
+/**
+ * Options Item Component
+ * @param id {string} Id for Options Item - Default id generated by default
+ * @param disabled {boolean} Disabled Options Item
+ * @param name {string} Options Item name
+ * @param value {string} Value for options item
+ * @param checked {boolean} Checked options item
+ * @param label {string} Label for options item
+ * @param readonly {boolean} readonly options item
+ * @param onChange {onChange} onChange Event
+ * @param children {React.ReactNode}
+ * @param onClick {onClick} onClick Event
+ * @param description {String} Optional description for "multiline" label
+ */
+declare const OptionsItem: {
+    ({ id, disabled, name, value, checked, iconName, label, readonly, onClick, onChange, variant, description, ...others }: OptionsItemProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default OptionsItem;

package/lib/components/options/item/OptionsItem.native.js

@@ -0,0 +1,150 @@
+import React, { useEffect, useState } from 'react';
+import { StyleSheet, TouchableOpacity, View } from 'react-native';
+import shortid from 'shortid';
+import { Text } from '../../text';
+import { getColorStyle, TrilogyColor } from '../../../objects/facets/Color';
+import { OptionsItemVariant } from '../OptionsEnum';
+import { Icon, IconName, IconSize } from '../../icon';
+import { Spacer, SpacerSize } from '../../spacer';
+import { ComponentName } from '../../enumsComponentsName';
+/**
+ * Options Item Component
+ * @param id {string} Id for Options Item - Default id generated by default
+ * @param disabled {boolean} Disabled Options Item
+ * @param name {string} Options Item name
+ * @param value {string} Value for options item
+ * @param checked {boolean} Checked options item
+ * @param label {string} Label for options item
+ * @param readonly {boolean} readonly options item
+ * @param onChange {onChange} onChange Event
+ * @param children {React.ReactNode}
+ * @param onClick {onClick} onClick Event
+ * @param description {String} Optional description for "multiline" label
+ */
+const OptionsItem = ({ id = shortid.generate(), disabled, name, value, checked, iconName, label, readonly, onClick, onChange, variant, description, ...others }) => {
+    const [_checked, setChecked] = useState(checked || '');
+    const selectedColor = TrilogyColor.INFO;
+    const defaultColor = TrilogyColor.TERTIARY;
+    const disabledColor = TrilogyColor.GREY;
+    const isChecked = (checked) => {
+        if (typeof checked === 'string') {
+            return checked === value;
+        }
+        else {
+            return checked.includes(value);
+        }
+    };
+    const color = disabled ? disabledColor : isChecked(_checked) ? selectedColor : defaultColor;
+    const styles = StyleSheet.create({
+        selectItem: {
+            borderColor: getColorStyle(color),
+            borderWidth: 1,
+            paddingLeft: 8,
+            paddingRight: 8,
+            padding: 6,
+            height: (variant === OptionsItemVariant.MULTILINE && iconName && 'auto') || (description && 55) || 35,
+            width: variant === OptionsItemVariant.MULTILINE && iconName ? 127 : 'auto',
+            borderRadius: 4,
+            marginRight: 10,
+            justifyContent: variant === OptionsItemVariant.MULTILINE && iconName ? 'flex-start' : 'center',
+        },
+        text: {
+            color: getColorStyle(color),
+            fontSize: 14,
+            textAlign: 'center',
+            textAlignVertical: 'center',
+        },
+        horizontal: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            paddingTop: description ? 4 : 0,
+        },
+        checkBox: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            alignContent: 'center',
+            alignSelf: 'center',
+            borderColor: getColorStyle(color),
+            borderWidth: 1,
+            width: 14,
+            height: 14,
+            borderRadius: 4,
+        },
+        radio: {
+            flexDirection: 'row',
+            alignItems: 'center',
+            borderColor: getColorStyle(color),
+            borderWidth: 1,
+            width: 14,
+            height: 14,
+            borderRadius: 10,
+        },
+        center: {
+            alignItems: 'center',
+        },
+        icon: {
+            top: -2,
+            right: 2,
+        },
+        description: {
+            fontSize: 11,
+            color: getColorStyle(color),
+            alignSelf: 'center',
+            marginBottom: 4,
+        },
+    });
+    useEffect(() => {
+        setChecked(checked || '');
+    }, [checked]);
+    const handleClick = (value) => {
+        if (!readonly) {
+            if (onClick) {
+                onClick({
+                    optionId: id,
+                    optionValue: value,
+                    optionName: name || '',
+                    optionChecked: !_checked,
+                });
+            }
+            if (onChange) {
+                onChange({
+                    optionId: id,
+                    optionValue: value,
+                    optionName: name || '',
+                    optionChecked: !_checked,
+                });
+            }
+        }
+    };
+    let optionContent;
+    if (variant === OptionsItemVariant.ICON && iconName) {
+        optionContent = (React.createElement(View, { style: styles.horizontal },
+            React.createElement(View, { style: typeof checked === 'string' ? styles.radio : styles.checkBox }, isChecked(_checked) && (React.createElement(Icon, { style: styles.icon, size: IconSize.SMALLER, color: color, name: IconName.CHECK }))),
+            React.createElement(Spacer, { size: SpacerSize.SMALL, horizontal: true }),
+            React.createElement(Text, { style: styles.text }, label),
+            React.createElement(Spacer, { size: SpacerSize.SMALL, horizontal: true }),
+            React.createElement(Icon, { style: styles.icon, size: IconSize.SMALL, name: iconName, color: color })));
+    }
+    else if (variant === OptionsItemVariant.MULTILINE && iconName) {
+        optionContent = (React.createElement(View, null,
+            React.createElement(View, { style: [typeof checked === 'string' ? styles.radio : styles.checkBox, { position: 'absolute', left: 0 }] }, isChecked(_checked) && (React.createElement(Icon, { style: styles.icon, size: IconSize.SMALLER, color: color, name: IconName.CHECK }))),
+            React.createElement(View, { style: styles.center },
+                React.createElement(Spacer, { size: SpacerSize.SMALL }),
+                React.createElement(View, null,
+                    React.createElement(Icon, { style: styles.icon, size: IconSize.MEDIUM, name: iconName, color: color })),
+                React.createElement(Spacer, { size: SpacerSize.SMALL }),
+                React.createElement(Text, { style: styles.text }, label))));
+    }
+    else {
+        optionContent = (React.createElement(View, { style: styles.horizontal },
+            React.createElement(View, { style: typeof checked === 'string' ? styles.radio : styles.checkBox }, isChecked(_checked) && (React.createElement(Icon, { style: styles.icon, size: IconSize.SMALLER, color: color, name: IconName.CHECK }))),
+            React.createElement(Spacer, { size: SpacerSize.SMALL, horizontal: true }),
+            React.createElement(Text, { style: styles.text }, label)));
+    }
+    return (React.createElement(TouchableOpacity, { accessibilityLabel: label, onPress: () => handleClick(value || ''), disabled: disabled, style: styles.selectItem, ...others },
+        optionContent,
+        description && React.createElement(Text, { style: styles.description }, description)));
+};
+OptionsItem.displayName = ComponentName.OptionsItem;
+export default OptionsItem;
+//# sourceMappingURL=OptionsItem.native.js.map

package/lib/components/options/item/OptionsItem.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsItem.native.js","sourceRoot":"","sources":["../../../../components/options/item/OptionsItem.native.tsx"],"names":[],"mappings":"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"}

package/lib/components/options/item/OptionsItemProps.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+import { OptionsItemVariant, OptionsItemVariantValues } from '../OptionsEnum';
+import { IconName, IconNameValues } from '../../icon/IconNameEnum';
+import { Accessibility } from '../../../objects';
+export interface OptionsItemChangeEvent {
+    optionId: string;
+    optionValue: string;
+    optionName: string;
+    optionChecked: boolean;
+}
+type OptionsItemChangeEventHandler = (event: OptionsItemChangeEvent) => void;
+export interface OptionsItemClickEvent {
+    optionId: string;
+    optionValue: string;
+    optionName: string;
+    optionChecked: boolean;
+}
+type OptionsItemClickEventHandler = (event: OptionsItemClickEvent) => void;
+/**
+ * Options Item Interface
+ */
+export interface OptionsItemProps extends Accessibility {
+    children?: React.ReactNode;
+    disabled?: boolean;
+    readonly?: boolean;
+    onClick?: OptionsItemClickEventHandler;
+    onChange?: OptionsItemChangeEventHandler;
+    className?: string;
+    description?: string;
+    id?: string;
+    name?: string;
+    value: string;
+    variant?: OptionsItemVariant | OptionsItemVariantValues;
+    iconName?: IconName | IconNameValues;
+    checked?: any;
+    label?: string;
+}
+export {};

package/lib/components/options/item/OptionsItemProps.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=OptionsItemProps.js.map

package/lib/components/options/item/OptionsItemProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsItemProps.js","sourceRoot":"","sources":["../../../../components/options/item/OptionsItemProps.ts"],"names":[],"mappings":""}

package/lib/components/options/item/index.d.ts

@@ -0,0 +1,3 @@
+import OptionsItem from './OptionsItem';
+export * from './OptionsItemProps';
+export default OptionsItem;

package/lib/components/options/item/index.js

@@ -0,0 +1,4 @@
+import OptionsItem from './OptionsItem';
+export * from './OptionsItemProps';
+export default OptionsItem;
+//# sourceMappingURL=index.js.map

package/lib/components/options/item/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../components/options/item/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAA;AAEvC,cAAc,oBAAoB,CAAA;AAElC,eAAe,WAAW,CAAA"}

package/lib/components/otp/Otp.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { OtpProps } from './OtpProps';
+/**
+ * OTP Code Component
+ * @param className {string} Additionnal css classes
+ * @param code {string} Code Text Input
+ * @param codeSize {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 activated {boolean} Activated OTP
+ * @param onChange {Function} onChange Input return current code
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param autoFocus {boolean} Should auto focus otp
+ */
+declare const Otp: ({ className, code, codeSize, disabled, error, onCompleted, onChange, onFocus, activated, label, errorMessage, autoFocus, ...others }: OtpProps) => JSX.Element;
+export default Otp;

package/lib/components/otp/Otp.js

@@ -0,0 +1,130 @@
+import { Text, TextMarkup } from '../text';
+import React, { useState, useMemo, useEffect } from 'react';
+import { TypographyColor } from '../../objects/Typography';
+import clsx from 'clsx';
+import { hashClass } from '../../helpers/hashClassesHelpers';
+import { is } from '../../services/classify';
+import { useTrilogyContext } from '../../context/index';
+/**
+ * OTP Code Component
+ * @param className {string} Additionnal css classes
+ * @param code {string} Code Text Input
+ * @param codeSize {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 activated {boolean} Activated OTP
+ * @param onChange {Function} onChange Input return current code
+ * @param onFocus {Function} onFocus return if focused opt
+ * @param autoFocus {boolean} Should auto focus otp
+ */
+const Otp = ({ className, code, codeSize = 6, disabled, error, onCompleted, onChange, onFocus, activated, label, errorMessage, autoFocus, ...others }) => {
+    const [codeInput, setCodeInput] = useState(code || '');
+    const [, setFocused] = useState(false);
+    const { styled } = useTrilogyContext();
+    const testDigit = /^-?\d*\.?\d*$/;
+    const classes = hashClass(styled, clsx('otp-list', error && is('error'), activated && is('tertiary'), disabled && is('disabled'), className));
+    useEffect(() => {
+        if (!disabled && codeInput.length >= codeSize) {
+            onCompleted === null || onCompleted === void 0 ? void 0 : onCompleted(codeInput);
+        }
+    }, [codeSize, codeInput]);
+    const valueItems = useMemo(() => {
+        const valueArray = codeInput.split('');
+        const items = [];
+        for (let i = 0; i < codeSize; i++) {
+            const char = valueArray[i];
+            if (testDigit.test(char)) {
+                items.push(char);
+            }
+            else {
+                items.push('');
+            }
+        }
+        return items;
+    }, [codeInput, codeSize]);
+    const focusToNextInput = (target) => {
+        const nextElementSibling = target.nextElementSibling;
+        if (nextElementSibling) {
+            nextElementSibling.focus();
+        }
+    };
+    const focusToPrevInput = (target) => {
+        const previousElementSibling = target.previousElementSibling;
+        if (previousElementSibling) {
+            previousElementSibling.focus();
+        }
+    };
+    const inputOnChange = (e, idx) => {
+        const { target } = e;
+        let targetValue = target.value.trim();
+        const isTargetValueDigit = testDigit.test(targetValue);
+        if (!isTargetValueDigit && targetValue !== '') {
+            return;
+        }
+        const nextInputEl = target.nextElementSibling;
+        if (!isTargetValueDigit && nextInputEl && nextInputEl.value !== '') {
+            return;
+        }
+        targetValue = isTargetValueDigit ? targetValue : '';
+        const targetValueLength = targetValue.length;
+        if (targetValueLength === 1) {
+            const newValue = codeInput.substring(0, idx) + targetValue + codeInput.substring(idx + 1);
+            if (onChange) {
+                onChange(newValue);
+            }
+            setCodeInput(newValue);
+            if (!isTargetValueDigit) {
+                return;
+            }
+            focusToNextInput(target);
+        }
+        else if (targetValueLength === codeSize) {
+            if (onChange) {
+                onChange(codeInput);
+            }
+            setCodeInput(targetValue);
+            target.blur();
+        }
+    };
+    const inputOnKeyDown = (e) => {
+        const { key } = e;
+        const target = e.target;
+        if (key === 'ArrowRight' || key === 'ArrowDown') {
+            e.preventDefault();
+            return focusToNextInput(target);
+        }
+        if (key === 'ArrowLeft' || key === 'ArrowUp') {
+            e.preventDefault();
+            return focusToPrevInput(target);
+        }
+        const targetValue = target.value;
+        target.setSelectionRange(0, targetValue.length);
+        if (e.key !== 'Backspace' || targetValue !== '') {
+            target.value = '';
+            return;
+        }
+        focusToPrevInput(target);
+    };
+    const inputOnFocus = (e) => {
+        const { target } = e;
+        const prevInputEl = target.previousElementSibling;
+        if (prevInputEl && prevInputEl.value === '') {
+            return prevInputEl.focus();
+        }
+        target.setSelectionRange(0, target.value.length);
+    };
+    return (React.createElement(React.Fragment, null,
+        label && (React.createElement(Text, { markup: TextMarkup.P, typo: (disabled && TypographyColor.TEXT_GREY) ||
+                (error && TypographyColor.TEXT_ERROR) ||
+                TypographyColor.TEXT_TERTIARY }, label)),
+        React.createElement("div", { "data-testid": 'otp-input', className: classes, onClick: () => {
+                if (!disabled) {
+                    setFocused(true);
+                    onFocus === null || onFocus === void 0 ? void 0 : onFocus(true);
+                }
+            } }, valueItems.map((digit, idx) => (React.createElement("input", { key: idx, type: 'text', inputMode: 'numeric', autoComplete: 'one-time-code', autoFocus: idx === 1 && autoFocus, pattern: '\\d{1}', maxLength: codeSize, className: 'otp', value: digit, onKeyDown: inputOnKeyDown, onFocus: inputOnFocus, onChange: (e) => inputOnChange(e, idx), disabled: disabled, ...others })))),
+        errorMessage && (React.createElement(Text, { className: hashClass(styled, clsx('otp-error-message')), markup: TextMarkup.P, typo: (error && TypographyColor.TEXT_ERROR) || TypographyColor.TEXT_TERTIARY }, errorMessage))));
+};
+export default Otp;
+//# sourceMappingURL=Otp.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Otp.js","sourceRoot":"","sources":["../../../components/otp/Otp.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { OtpProps } from './OtpProps';
+import { ComponentName } from '../enumsComponentsName';
+/**
+ * OTP Code Component
+ * @param code {string} Code Text Input
+ * @param codeSize {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
+ */
+declare const Otp: {
+    ({ code, codeSize, disabled, error, onCompleted, onFocus, activated, onChange, label, ...others }: OtpProps): JSX.Element;
+    displayName: ComponentName;
+};
+export default Otp;