@dilicorp/ui 0.2.2 → 0.2.4-0.1

package/dist/atoms/pluxee-icon/pluxee-icon.d.ts

@@ -1,9 +1,16 @@
 /// <reference types="react" />
+export declare const IconsList: {
+    key: string;
+    Element: {
+        (): JSX.Element;
+        displayName: string;
+    };
+}[];
 export declare type PluxeeIconColors = 'primary' | 'primary-contrast' | 'secondary' | 'success' | 'danger' | 'warning' | 'info' | 'white';
 declare type PluxeeIconProps = {
     icon: string;
     size?: 'lg' | 'md' | 'sm';
 };
-export declare const PluxeeIcon: ({ icon, size }: PluxeeIconProps) => JSX.Element | null;
+export declare const PluxeeIcon: ({ icon, size }: PluxeeIconProps) => JSX.Element;
 export {};
 //# sourceMappingURL=pluxee-icon.d.ts.map

package/dist/atoms/pluxee-icon/pluxee-icon.js

@@ -27,7 +27,18 @@ import { IconSearch } from './icon-search';
 import { IconPlus } from './icon-plus';
 import { Iconlogout } from './icon-logout';
 import { IconChevronDown } from './icon-chevron-down';
-const IconsList = [
+import { IconCardSlashed } from './icon-card-slashed';
+import { IconClock } from './icon-clock';
+import { IconUpdateLimit } from './icon-update-limit';
+import { IconUserGroup } from './icon-user-group';
+import { IconEyeClosedOutline } from './icon-eye-closed-outline';
+import { IconNegotiation } from './icon-negotiation';
+import { IconQrcode } from './icon-qrcode';
+import { IconIdentification } from './icon-identification';
+import { Icon } from '../icon';
+import { IconPlay } from './icon-play';
+import { IconCircle } from './icon-circle';
+export const IconsList = [
     { key: 'fa-double-chevron-left', Element: IconDoubleChevronLeft },
     { key: 'fa-double-chevron-right', Element: IconDoubleChevronRight },
     { key: 'fa-home', Element: IconHome },
@@ -59,6 +70,7 @@ const IconsList = [
     { key: 'fa-pen', Element: IconPen },
     { key: 'fa-pencil-alt', Element: IconPen },
     { key: 'fa-eye-open-outline', Element: IconEyeOpenOutline },
+    { key: 'fa-eye-closed-outline', Element: IconEyeClosedOutline },
     { key: 'fa-eye', Element: IconEyeOpenOutline },
     { key: 'fa-lock', Element: IconLock },
     { key: 'fa-unlock', Element: IconUnlock },
@@ -69,12 +81,21 @@ const IconsList = [
     { key: 'fa-search', Element: IconSearch },
     { key: 'fa-plus', Element: IconPlus },
     { key: 'fa-logout', Element: Iconlogout },
-    { key: 'fa-chevron-down', Element: IconChevronDown }
+    { key: 'fa-chevron-down', Element: IconChevronDown },
+    { key: 'fa-card-slashed', Element: IconCardSlashed },
+    { key: 'fa-clock-circle', Element: IconClock },
+    { key: 'fa-update-limit', Element: IconUpdateLimit },
+    { key: 'fa-user-group', Element: IconUserGroup },
+    { key: 'fa-negotiation', Element: IconNegotiation },
+    { key: 'fa-qrcode', Element: IconQrcode },
+    { key: 'fa-identification', Element: IconIdentification },
+    { key: 'fa-play', Element: IconPlay },
+    { key: 'fa-circle', Element: IconCircle }
 ];
 export const PluxeeIcon = ({ icon, size = 'md' }) => {
     const item = IconsList.find(item => item.key === icon);
     if (!item)
-        return null;
+        return React.createElement(Icon, { size: size, icon: icon });
     const { Element } = item;
     return (React.createElement(BaseIcon, { size: size },
         React.createElement(Element, null)));

package/dist/atoms/radio.js

@@ -1,17 +1,5 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import { Input } from './input';
 import React from 'react';
-export const Radio = (_a) => {
-    var { name, id = name } = _a, props = __rest(_a, ["name", "id"]);
-    return (React.createElement(Input, Object.assign({ type: "radio" }, props, { id: id, "data-testid": id, name: name })));
+export const Radio = ({ name, id = name, ...props }) => {
+    return (React.createElement(Input, { type: "radio", ...props, id: id, "data-testid": id, name: name }));
 };

package/dist/atoms/row.js

@@ -3,5 +3,5 @@ import classNames from 'classnames';
 export const Row = (props) => {
     const { children, className, justifyContent, alignItems, alignContent, alignSelf } = props;
     const classes = classNames('row', !!className && className, !!justifyContent && `justify-content-${justifyContent}`, !!alignItems && `align-items-${alignItems}`, !!alignContent && `align-content-${alignContent}`, !!alignSelf && `align-self-${alignSelf}`);
-    return (React.createElement("div", Object.assign({}, props, { className: classes }), children));
+    return (React.createElement("div", { ...props, className: classes }, children));
 };

package/dist/atoms/skeleton.js

@@ -2,5 +2,5 @@ import React from 'react';
 import SkeletonReact from 'react-loading-skeleton';
 import 'react-loading-skeleton/dist/skeleton.css';
 export const Skeleton = (props) => {
-    return React.createElement(SkeletonReact, Object.assign({}, props));
+    return React.createElement(SkeletonReact, { ...props });
 };

package/dist/atoms/switcher.d.ts

@@ -0,0 +1,7 @@
+import { ChangeEventHandler } from 'react';
+export interface SwitcherProps {
+    checked: boolean;
+    onChange?: ChangeEventHandler;
+}
+export declare const Switcher: (props: SwitcherProps) => JSX.Element;
+//# sourceMappingURL=switcher.d.ts.map

package/dist/atoms/switcher.js

@@ -0,0 +1,10 @@
+import React from 'react';
+export const Switcher = (props) => {
+    return (React.createElement("label", { className: "switch" },
+        React.createElement("input", { type: "checkbox", className: "checkbox", ...props }),
+        React.createElement("span", { className: "toggle-thumb" },
+            React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "36", height: "36", viewBox: "0 0 24 24" },
+                React.createElement("path", { d: "M10 15.586L6.707 12.293 5.293 13.707 10 18.414 19.707 8.707 18.293 7.293z" })),
+            React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "36", height: "36", viewBox: "0 0 24 24" },
+                React.createElement("path", { d: "M16.192 6.344L11.949 10.586 7.707 6.344 6.293 7.758 10.535 12 6.293 16.242 7.707 17.656 11.949 13.414 16.192 17.656 17.606 16.242 13.364 12 17.606 7.758z" })))));
+};

package/dist/atoms/typography.js

@@ -1,21 +1,9 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import React from 'react';
 import classNames from 'classnames';
-export const Typography = (_a) => {
-    var { variant = 'h1', lineBottom, full, children, tag: Tag = variant, innerRef, className, subTitle } = _a, props = __rest(_a, ["variant", "lineBottom", "full", "children", "tag", "innerRef", "className", "subTitle"]);
+export const Typography = ({ variant = 'h1', lineBottom, full, children, tag: Tag = variant, innerRef, className, subTitle, ...props }) => {
     const classes = classNames('typography', lineBottom && (full ? 'line-bottom-full' : 'line-bottom'), full && 'w-100');
     const classeTag = classNames(className, variant);
     return (React.createElement("div", { className: classes },
-        React.createElement(Tag, Object.assign({}, props, { ref: innerRef, className: classeTag }), children),
+        React.createElement(Tag, { ...props, ref: innerRef, className: classeTag }, children),
         subTitle && React.createElement("div", { className: "sub-title" }, subTitle)));
 };

package/dist/components/accordion/accordion-body.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 declare type AccordionBodyProps = {
     children: React.ReactNode;
     className?: string;

package/dist/components/accordion/accordion-body.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 export const AccordionBody = ({ className, children }) => {
     return (React.createElement("div", { className: `accordion-body ${className}` },
         React.createElement("div", null, children)));

package/dist/components/accordion/accordion-header.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 declare type AccordionHeaderProps = {
     children: React.ReactNode;
     className?: string;

package/dist/components/accordion/accordion-header.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 export const AccordionHeader = ({ className, children }) => {
     return (React.createElement("div", null,
         React.createElement("div", { className: `accordion-header ${className}` },

package/dist/components/accordion/accordion-item.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 export declare type AccordionItemProps = {
     children: React.ReactNode;
 };

package/dist/components/accordion/accordion-item.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 export const AccordionItem = ({ children }) => {
     return (React.createElement("div", { className: "accordion-item" }, children));
 };

package/dist/components/accordion/accordion.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import React from 'react';
 declare type AccordionProps = {
     children: React.ReactNode;
 };

package/dist/components/accordion/accordion.js

@@ -1,7 +1,7 @@
-import React, { useState } from "react";
-import { AccordionBody } from "./accordion-body";
-import { AccordionHeader } from "./accordion-header";
-import { AccordionItem } from "./accordion-item";
+import React, { useState } from 'react';
+import { AccordionBody } from './accordion-body';
+import { AccordionHeader } from './accordion-header';
+import { AccordionItem } from './accordion-item';
 export const Accordion = ({ children }) => {
     const [currentItem, setCurrentItem] = useState(-1);
     const childrenWithProps = React.Children.map(children, (child, index) => {

package/dist/components/alert-modal/alert-context-provider.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+declare type UseAlertModalProps = {
+    title: string;
+    message: JSX.Element;
+    type: 'success' | 'alert' | 'error';
+    onClose?: () => void;
+};
+declare type AlertContextProviderProps = {
+    children: React.ReactNode;
+};
+declare type AlertContextProps = {
+    handleShowAlert: (props: UseAlertModalProps) => void;
+};
+export declare const AlertContextProvider: React.FC<AlertContextProviderProps>;
+export declare const useAlertModal: () => AlertContextProps;
+export {};
+//# sourceMappingURL=alert-context-provider.d.ts.map

package/dist/components/alert-modal/alert-context-provider.js

@@ -0,0 +1,18 @@
+import React, { createContext, useCallback, useContext } from 'react';
+import { useAlert } from 'react-alert';
+import { AlertModalContent } from './alert-modal-content';
+const AlertContext = createContext({});
+export const AlertContextProvider = ({ children }) => {
+    const alert = useAlert();
+    const handleShowAlert = useCallback(({ title, message, type, onClose }) => {
+        alert.show(React.createElement(AlertModalContent, { title: title, message: message, type: type }), { onClose });
+    }, [alert.show]);
+    return (React.createElement(AlertContext.Provider, { value: { handleShowAlert } }, children));
+};
+export const useAlertModal = () => {
+    const context = useContext(AlertContext);
+    if (!context) {
+        throw new Error('useAlertModal must be used within an AlertModalProvider');
+    }
+    return context;
+};

package/dist/components/alert-modal/alert-modal-content.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type AlertModalContentProps = {
+    title: string;
+    message: JSX.Element;
+    type: 'success' | 'alert' | 'error';
+};
+export declare const AlertModalContent: React.FC<AlertModalContentProps>;
+//# sourceMappingURL=alert-modal-content.d.ts.map

package/dist/components/alert-modal/alert-modal-content.js

@@ -0,0 +1,57 @@
+import React, { useMemo } from 'react';
+import { useAlert } from 'react-alert';
+import { Icon } from '../../atoms/icon';
+export const AlertModalContent = ({ title, message, type }) => {
+    const alert = useAlert();
+    const color = useMemo(() => {
+        return {
+            success: '#221C46',
+            alert: '#FF7375',
+            error: '#B30000'
+        };
+    }, []);
+    const styles = {
+        header: {
+            width: '100%',
+            display: 'flex',
+            alignItens: 'center',
+            justifyContent: 'space-between',
+            paddingBottom: '0.5rem',
+            borderBottom: '1px solid #B5B2BC'
+        },
+        title: {
+            fontSize: '1.5rem',
+            fontWeight: '400'
+        },
+        closeButton: {
+            width: '1.5rem',
+            height: '1.5rem',
+            borderRadius: '999px',
+            border: 'none',
+            outline: 'none',
+            background: '#FF7375',
+            color: '#ffffff',
+            display: 'flex',
+            flexDirection: 'column',
+            alignItems: 'center',
+            justifyContent: 'center'
+        },
+        description: {
+            width: '100%',
+            fontSize: '1.75rem',
+            fontWeight: '400',
+            padding: '3rem',
+            display: 'flex',
+            justifyContent: 'center',
+            textAlign: 'center',
+            color: color[type]
+        }
+    };
+    return (React.createElement("div", null,
+        React.createElement("div", { style: styles.header },
+            React.createElement("span", null, title),
+            React.createElement("button", { style: styles.closeButton, onClick: () => alert.removeAll() },
+                React.createElement(Icon, { icon: "fa-times" }))),
+        React.createElement("div", null,
+            React.createElement("div", { style: styles.description }, message))));
+};

package/dist/components/alert-modal/alert-modal-provider.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+declare type AlertProviderProps = {
+    children: ReactNode;
+};
+export declare const AlertModalProvider: React.FC<AlertProviderProps>;
+export {};
+//# sourceMappingURL=alert-modal-provider.d.ts.map

package/dist/components/alert-modal/alert-modal-provider.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Provider, positions } from 'react-alert';
+import { AlertModalTemplate } from './alert-modal-template';
+import { AlertContextProvider } from './alert-context-provider';
+const options = {
+    position: positions.MIDDLE,
+    timeout: 10000
+};
+export const AlertModalProvider = ({ children }) => {
+    return (React.createElement(Provider, { ...options, template: AlertModalTemplate },
+        React.createElement(AlertContextProvider, null, children)));
+};

package/dist/components/alert-modal/alert-modal-template.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { AlertTemplateProps } from 'react-alert';
+export declare type AlertModalTemplatePropx = AlertTemplateProps;
+export declare const AlertModalTemplate: (props: AlertModalTemplatePropx) => JSX.Element;
+//# sourceMappingURL=alert-modal-template.d.ts.map

package/dist/components/alert-modal/alert-modal-template.js

@@ -0,0 +1,16 @@
+import React from 'react';
+const style = {
+    content: {
+        width: '560px',
+        position: 'relative',
+        boxShadow: '0 0 15px rgb(0 0 0 / 10%)',
+        borderRadius: '0px',
+        border: '1px solid #ddd',
+        padding: '1rem',
+        background: '#f2f2f2'
+    }
+};
+export const AlertModalTemplate = (props) => {
+    const { message } = props;
+    return (React.createElement("div", { style: style.content }, message));
+};

package/dist/components/alert-template/alert-provider.js

@@ -1,22 +1,10 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import React from 'react';
 import { positions, Provider } from 'react-alert';
 import { AlertTemplate } from './alert-template';
 const options = {
     position: positions.MIDDLE,
-    timeout: 5000
+    timeout: 10000
 };
-export const AlertProvider = (_a) => {
-    var { children } = _a, props = __rest(_a, ["children"]);
-    return (React.createElement(Provider, Object.assign({}, options, props, { template: AlertTemplate }), children));
+export const AlertProvider = ({ children, ...props }) => {
+    return (React.createElement(Provider, { ...options, ...props, template: AlertTemplate }, children));
 };

package/dist/components/alert-template/alert-template.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { AlertComponentPropsWithStyle } from 'react-alert';
+import { AlertTemplateProps as AlertComponentPropsWithStyle } from 'react-alert';
 export declare type AlertTemplateProps = AlertComponentPropsWithStyle;
 export declare const AlertTemplate: (props: AlertTemplateProps) => JSX.Element;
 //# sourceMappingURL=alert-template.d.ts.map

package/dist/components/form-builder/components/button.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { FormikProps } from 'formik';
-declare type Props = React.HTMLAttributes<HTMLButtonElement> & {
+declare type Props = React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> & {
     type?: 'submit' | 'reset' | 'button';
     actions: FormikProps<any>;
     color?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';

package/dist/components/form-builder/components/button.js

@@ -1,20 +1,10 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import React from 'react';
 import { Button } from '../../../atoms/button';
 export default function Input(props) {
-    const { type = 'button', actions, color = 'primary', label, labelLoading = label, className, id } = props, elements = __rest(props, ["type", "actions", "color", "label", "labelLoading", "className", "id"]);
+    var _a;
+    const { type = 'button', actions, color = 'primary', label, labelLoading = label, className, id, ...elements } = props;
     return (React.createElement("div", null,
-        React.createElement(Button, Object.assign({}, elements, { className: className, type: type, color: color }, (id && { 'data-testid': id })), actions.isSubmitting
+        React.createElement(Button, { ...elements, className: className, type: type, color: color, disabled: actions.isSubmitting ? true : (_a = elements.disabled) !== null && _a !== void 0 ? _a : false, ...(id && { 'data-testid': id }) }, actions.isSubmitting
             ? labelLoading
             : label)));
 }

package/dist/components/form-builder/components/checkbox.d.ts

@@ -9,6 +9,7 @@ declare type Props = React.InputHTMLAttributes<HTMLInputElement> & {
     actions: FormikProps<any>;
     value?: string;
     options: Option[];
+    fastField?: boolean;
 };
 export default function Checkbox(props: Props): JSX.Element[] | null;
 export {};

package/dist/components/form-builder/components/checkbox.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import { FastField } from 'formik';
+import { FastField, Field } from 'formik';
 export default function Checkbox(props) {
-    const { name, actions, value = [], options, id = name, tabIndex = 0, disabled } = props;
+    const { name, actions, value = [], options, id = name, tabIndex = 0, disabled, fastField = true } = props;
     if (!options.length)
         return null;
     const curValue = actions.values[name] || value || [];
@@ -21,7 +21,8 @@ export default function Checkbox(props) {
                 : [...values, value]);
         }
     };
+    const Tag = fastField ? FastField : Field;
     return options.map((option, index) => (React.createElement("div", { className: "form-check", key: `${name}-${index}` },
-        React.createElement(FastField, Object.assign({ value: option.value, name: name, id: `${id}-${index}`, "data-testid": `${id}-${index}`, checked: isChecked(option) }, { disabled }, { className: "form-check-input", type: "checkbox", tabIndex: tabIndex, onChange: handleChange })),
+        React.createElement(Tag, { value: option.value, name: name, id: `${id}-${index}`, "data-testid": `${id}-${index}`, checked: isChecked(option), ...{ disabled }, className: "form-check-input", type: "checkbox", tabIndex: tabIndex, onChange: handleChange }),
         React.createElement("label", { className: "form-check-label", htmlFor: `${id}-${index}` }, option.label))));
 }

package/dist/components/form-builder/components/datepicker.js

@@ -1,17 +1,6 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 import React from 'react';
 import { InputDatepicker } from '../../../atoms/input-datepicker';
 export default function DatePicker(props) {
-    const { name, actions, value, id = name } = props, rest = __rest(props, ["name", "actions", "value", "id"]);
-    return (React.createElement(InputDatepicker, Object.assign({ value: value || '', name: name, "data-testid": id }, rest, { onChange: actions.setFieldValue })));
+    const { name, actions, value, id = name, ...rest } = props;
+    return (React.createElement(InputDatepicker, { value: value || '', name: name, "data-testid": id, ...rest, onChange: actions.setFieldValue }));
 }

package/dist/components/form-builder/components/dropzone.js

@@ -8,10 +8,14 @@ export default function DropZone(props) {
             dropzoneOptions.onDrop(acceptedFiles, rejectedFiles, event);
         }
     }, []);
-    const { acceptedFiles, fileRejections, getRootProps, getInputProps, isDragActive } = useDropzone(Object.assign(Object.assign({}, dropzoneOptions), { onDrop, multiple: (dropzoneOptions === null || dropzoneOptions === void 0 ? void 0 : dropzoneOptions.multiple) || false }));
+    const { acceptedFiles, fileRejections, getRootProps, getInputProps, isDragActive } = useDropzone({
+        ...dropzoneOptions,
+        onDrop,
+        multiple: (dropzoneOptions === null || dropzoneOptions === void 0 ? void 0 : dropzoneOptions.multiple) || false
+    });
     return (React.createElement("div", { className: "dropzone-container" },
-        React.createElement("div", Object.assign({}, getRootProps({ className: 'dropzone' })),
-            React.createElement("input", Object.assign({}, getInputProps({ name, id }), { "data-testid": id })),
+        React.createElement("div", { ...getRootProps({ className: 'dropzone' }) },
+            React.createElement("input", { ...getInputProps({ name, id }), "data-testid": id }),
             isDragActive
                 ? React.createElement("p", null, textFileSelect)
                 : React.createElement("p", null, textFileSelected)),

package/dist/components/form-builder/components/input-currency.js

@@ -1,4 +1,4 @@
-import { FastField } from 'formik';
+import { FastField, Field } from 'formik';
 import React from 'react';
 import numberHelper from '../../../utils/number-helper';
 export const InputCurrency = ({ attrs, handleChange, currency, name }) => {
@@ -13,5 +13,7 @@ export const InputCurrency = ({ attrs, handleChange, currency, name }) => {
             }
         });
     };
-    return (React.createElement(FastField, { name: name }, ({ field }) => React.createElement("input", Object.assign({}, field, attrs, { onChange: handleChangeCurrency, min: "0", maxLength: maxLength }))));
+    const { fastField = true, ...restAttrs } = attrs;
+    const Tag = fastField ? FastField : Field;
+    return (React.createElement(Tag, { name: name }, ({ field }) => React.createElement("input", { ...field, ...restAttrs, onChange: handleChangeCurrency, min: "0", maxLength: maxLength })));
 };

package/dist/components/form-builder/components/input-mask.js

@@ -1,6 +1,8 @@
-import { FastField } from 'formik';
+import { FastField, Field } from 'formik';
 import React from 'react';
 import ReactInputMask from 'react-input-mask';
 export const InputMask = ({ attrs, mask, name }) => {
-    return (React.createElement(FastField, { name: name }, ({ field }) => React.createElement(ReactInputMask, Object.assign({}, field, attrs, { mask: mask }))));
+    const { fastField = true, ...restAttrs } = attrs;
+    const Tag = fastField ? FastField : Field;
+    return (React.createElement(Tag, { name: name }, ({ field }) => React.createElement(ReactInputMask, { ...field, ...restAttrs, mask: mask })));
 };

package/dist/components/form-builder/components/input-prefix-suffix.js

@@ -1,15 +1,17 @@
 import React from 'react';
-import { FastField } from 'formik';
+import { FastField, Field } from 'formik';
 export const InputPrefixSuffix = ({ attrs, suffix, prefix }) => {
     var _a;
+    const { fastField = true, ...restAttrs } = attrs;
+    const Tag = fastField ? FastField : Field;
     return (React.createElement("div", { className: "position-relative" },
         prefix && React.createElement("div", { className: "input-prefix" }, typeof prefix === 'string' ? React.createElement("span", null, prefix) : prefix),
-        React.createElement(FastField, Object.assign({}, attrs, { readOnly: true, onFocus: (event) => {
+        React.createElement(Tag, { ...restAttrs, readOnly: true, onFocus: (event) => {
                 event.currentTarget.readOnly = false;
-            } }, ((prefix && typeof prefix === 'string') && {
-            style: {
-                paddingLeft: (((_a = prefix === null || prefix === void 0 ? void 0 : prefix.length) !== null && _a !== void 0 ? _a : 0) * 8) + 10
-            }
-        }))),
+            }, ...((prefix && typeof prefix === 'string') && {
+                style: {
+                    paddingLeft: (((_a = prefix === null || prefix === void 0 ? void 0 : prefix.length) !== null && _a !== void 0 ? _a : 0) * 8) + 10
+                }
+            }) }),
         suffix && React.createElement("div", { className: "input-suffix" }, typeof suffix === 'string' ? React.createElement("span", null, suffix) : suffix)));
 };

package/dist/components/form-builder/components/input.d.ts

@@ -12,6 +12,7 @@ export interface FormBuildItemInput extends Omit<FormBuilderBasicsItem, 'prefix'
     };
     suffix?: string | React.ReactNode;
     prefix?: string | React.ReactNode;
+    fastField?: boolean;
 }
 declare type Props = Omit<FormBuildItemInput, 'component'> & {
     actions: FormikProps<any>;