linear-react-components-ui 1.1.24-rc.2 → 1.1.25-beta.10

package/lib/checkbox/types.d.ts

@@ -40,6 +40,7 @@ interface ICheckBoxProps {
     targetSpanRef?: (ref: HTMLSpanElement | null) => void;
     errorMessages?: string[] | undefined;
     customClassForLabel?: string;
+    tabIndex?: number;
     themePopover?: 'light' | 'dark';
     popoverAlign?: 'right' | 'left';
 }

package/lib/dialog/base/index.js

@@ -4,15 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.DialogContext = void 0;
-var _react = _interopRequireWildcard(require("react"));
+require("../../assets/styles/dialog.scss");
+var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var uuid = _interopRequireWildcard(require("uuid"));
 var _style = _interopRequireDefault(require("./style"));
-require("../../assets/styles/dialog.scss");
 var _form = require("../form");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const DialogContext = exports.DialogContext = /*#__PURE__*/(0, _react.createContext)({});
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const DialogContext = exports.DialogContext = /*#__PURE__*/_react.default.createContext({});
 const {
   body
 } = document;
@@ -33,23 +33,23 @@ const BaseDialog = props => {
   } = props;
   const {
     headerRef
-  } = (0, _react.useContext)(_form.FormDialogContext);
-  const [isDragging, setIsDragging] = (0, _react.useState)(false);
-  const [open = true, setOpen] = (0, _react.useState)(openProp);
-  const wrapperEl = (0, _react.useRef)(null);
-  const modalContainerRef = (0, _react.useRef)(null);
-  const focusableElementsRef = (0, _react.useRef)([]);
+  } = _react.default.useContext(_form.FormDialogContext);
+  const [open = true, setOpen] = _react.default.useState(openProp);
+  const [isDragging, setIsDragging] = _react.default.useState(false);
+  const wrapperEl = _react.default.useRef(null);
+  const modalContainerRef = _react.default.useRef(null);
+  const focusableElementsRef = _react.default.useRef([]);
   if (openProp !== undefined && openProp !== open) {
     setOpen(openProp);
   }
-  const handleClose = () => {
+  const handleClose = _react.default.useCallback(() => {
     if (openProp !== undefined && onOpenChange) {
       onOpenChange(false);
     } else {
       if (handlerClose) handlerClose();
       if (onOpenChange) onOpenChange(false);
     }
-  };
+  }, [openProp, onOpenChange, handlerClose]);
   const handleClickOutside = event => {
     if (!closeOnOutsideClick) return;
     const target = event.target;
@@ -58,17 +58,15 @@ const BaseDialog = props => {
       handleClose();
     }
   };
-  const onKeyDownPress = event => {
+  const onKeyDownPress = _react.default.useCallback(event => {
     if ((event === null || event === void 0 ? void 0 : event.key) === 'Escape') {
       event.stopPropagation();
       handleClose();
     }
-  };
-  (0, _react.useEffect)(() => {
+  }, [handleClose]);
+  _react.default.useEffect(() => {
     if (open && modalContainerRef.current) {
-      var _focusableElementsRef;
       focusableElementsRef.current = Array.from(modalContainerRef.current.querySelectorAll("button, a, input, select, textarea, [tabindex]:not([tabindex='-1'])"));
-      (_focusableElementsRef = focusableElementsRef.current[0]) === null || _focusableElementsRef === void 0 ? void 0 : _focusableElementsRef.focus();
     }
   }, [open]);
   const onDialogPositionChange = _ref => {
@@ -151,7 +149,7 @@ const BaseDialog = props => {
     style: (0, _style.default)(props),
     ref: wrapperEl
   }, children)));
-  (0, _react.useLayoutEffect)(() => {
+  _react.default.useLayoutEffect(() => {
     const {
       activeElement
     } = document;
@@ -160,7 +158,7 @@ const BaseDialog = props => {
       lastElementActiveBeforeOpen === null || lastElementActiveBeforeOpen === void 0 ? void 0 : lastElementActiveBeforeOpen.focus();
     };
   }, []);
-  (0, _react.useEffect)(() => {
+  _react.default.useEffect(() => {
     if (open) {
       if (closeOnEsc) {
         document.addEventListener('keydown', onKeyDownPress);
@@ -169,8 +167,8 @@ const BaseDialog = props => {
     return () => {
       document.removeEventListener('keydown', onKeyDownPress);
     };
-  }, [open, closeOnEsc]);
-  (0, _react.useEffect)(() => {
+  }, [open, closeOnEsc, onKeyDownPress]);
+  _react.default.useEffect(() => {
     if (open) {
       document.addEventListener('mousedown', onMouseDown);
       document.addEventListener('mouseup', onMouseUp);
@@ -182,7 +180,7 @@ const BaseDialog = props => {
       document.removeEventListener('mousemove', onMouseMove);
     };
   }, [isDragging, open]);
-  (0, _react.useEffect)(() => {
+  _react.default.useEffect(() => {
     const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
     const originalOverflow = document.body.style.overflow;
     const originalPaddingRight = document.body.style.paddingRight;

package/lib/dialog/form/index.js

@@ -34,6 +34,7 @@ const ModalForm = props => {
     wrapperClassName = '',
     contentClassName = '',
     headerClassName = '',
+    closeOnEsc = true,
     securityBeforeUnload = false,
     securityTitle = 'Dados Alterados',
     securityText = 'Você possui dados alterados, confirma o fechamento?'
@@ -45,7 +46,7 @@ const ModalForm = props => {
     opacity: 0.4,
     pointerEvent: 'none'
   } : {};
-  const handlerClose = () => {
+  const handlerClose = (0, _react.useCallback)(() => {
     if (securityBeforeUnload) {
       setShowSecurityDialog(true);
       return;
@@ -53,7 +54,7 @@ const ModalForm = props => {
     if (props.handlerClose) {
       props.handlerClose();
     }
-  };
+  }, [securityBeforeUnload, props.handlerClose]);
   const onConfirmSecurity = () => {
     var _props$handlerClose;
     (_props$handlerClose = props.handlerClose) === null || _props$handlerClose === void 0 ? void 0 : _props$handlerClose.call(props);
@@ -93,8 +94,9 @@ const ModalForm = props => {
     height: height,
     className: className,
     wrapperClassName: "dialog-form-wrapper ".concat(wrapperClassName),
-    securityBeforeUnload: securityBeforeUnload,
-    handlerClose: handlerClose
+    handlerClose: handlerClose,
+    closeOnEsc: closeOnEsc,
+    securityBeforeUnload: securityBeforeUnload
   }), props.title && /*#__PURE__*/_react.default.createElement("div", {
     className: "header-form ".concat(headerClassName)
   }, /*#__PURE__*/_react.default.createElement(_Header.default, {

package/lib/drawer/Drawer.js

@@ -82,6 +82,7 @@ const BaseDrawer = _ref => {
     const drawerOverlay = document.createElement('div');
     drawerOverlay.className = 'drawer-overlay';
     drawerOverlay.id = id;
+    drawerOverlay.inert = false;
     drawerOverlay.dataset.testid = 'drawer-overlay';
     body.appendChild(drawerOverlay);
   };
@@ -100,10 +101,8 @@ const BaseDrawer = _ref => {
     } else {
       body = document.getElementById(targetId);
     }
+    if (overlay && body) setDrawerOverlay(body, overlayId);
     if (body) setDrawerComponent(body, randomId);
-    if (overlay && body) {
-      setDrawerOverlay(body, overlayId);
-    }
     return () => {
       const drawerOverlay = document.getElementById(overlayId);
       if (closeOnEsc) document.body.removeEventListener('keydown', closeDrawerOnEsc);

package/lib/drawer/index.js

@@ -16,10 +16,10 @@ Object.defineProperty(exports, "DrawerHeader", {
   }
 });
 exports.default = void 0;
+require("../assets/styles/drawers.scss");
 var _Drawer = _interopRequireDefault(require("./Drawer"));
 var _Header = _interopRequireDefault(require("./Header"));
 var _Content = _interopRequireDefault(require("./Content"));
-require("../assets/styles/drawers.scss");
 var _withFormSecurity = _interopRequireDefault(require("../form/withFormSecurity"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 var _default = exports.default = (0, _withFormSecurity.default)(_Drawer.default);

package/lib/icons/helper.d.ts

@@ -651,6 +651,18 @@ declare const _default: {
         viewbox: string;
         paths: string[];
     };
+    perdaConsumoInterno: {
+        viewbox: string;
+        paths: string[];
+    };
+    inventario: {
+        viewbox: string;
+        paths: string[];
+    };
+    trocaFornecedor: {
+        viewbox: string;
+        paths: string[];
+    };
 };
 
 export { _default as default };

package/lib/icons/helper.js

@@ -656,5 +656,17 @@ var _default = exports.default = {
   minus: {
     viewbox: '0 0 16 16',
     paths: ['M0 5h16v6h-16z']
+  },
+  perdaConsumoInterno: {
+    viewbox: '0 0 16 16',
+    paths: ['M6 7.25c0 0.412-0.338 0.75-0.75 0.75h-1.5c-0.413 0-0.75-0.338-0.75-0.75v-1.5c0-0.412 0.337-0.75 0.75-0.75h1.5c0.412 0 0.75 0.338 0.75 0.75v1.5z', 'M11 7.25c0 0.412-0.338 0.75-0.75 0.75h-1.5c-0.412 0-0.75-0.338-0.75-0.75v-1.5c0-0.412 0.338-0.75 0.75-0.75h1.5c0.412 0 0.75 0.338 0.75 0.75v1.5z', 'M6 12.25c0 0.412-0.338 0.75-0.75 0.75h-1.5c-0.413 0-0.75-0.338-0.75-0.75v-1.5c0-0.412 0.337-0.75 0.75-0.75h1.5c0.412 0 0.75 0.338 0.75 0.75v1.5z', 'M14.251 2.5l1.749-1.749v-0.751h-0.751l-1.749 1.749-1.749-1.749h-0.751v0.751l1.749 1.749-1.749 1.749v0.751h0.751l1.749-1.749 1.749 1.749h0.751v-0.751z', 'M0 12h1v2h-1v-2z', 'M0 9h1v2h-1v-2z', 'M13 7h1v2h-1v-2z', 'M13 13h1v2h-1v-2z', 'M13 10h1v2h-1v-2z', 'M0 6h1v2h-1v-2z', 'M0 3h1v2h-1v-2z', 'M8 2h2v1h-2v-1z', 'M5 2h2v1h-2v-1z', 'M2 2h2v1h-2v-1z', 'M7 15h2v1h-2v-1z', 'M10 15h2v1h-2v-1z', 'M4 15h2v1h-2v-1z', 'M1 15h2v1h-2v-1z']
+  },
+  inventario: {
+    viewbox: '0 0 16 16',
+    paths: ['M11 4v-4h-11v11h4v5h12v-12h-5zM10 6.125h-4v-0.125h4v0.125zM10 10h-4v-0.125h4v0.125zM10 9.625h-4v-0.25h4v0.25zM10 9.125h-4v-0.25h4v0.25zM10 8.625h-4v-0.25h4v0.25zM10 8.125h-4v-0.25h4v0.25zM10 7.625h-4v-0.25h4v0.25zM10 7.125h-4v-0.25h4v0.25zM10 6.625h-4v-0.25h4v0.25zM4 10h-3v-9h9v3h-6v6zM15 15h-10v-3h7v-7h3v10z']
+  },
+  trocaFornecedor: {
+    viewbox: '0 0 16 16',
+    paths: ['M11 8v6h1v-6h2.5l-3-3-3 3z', 'M1 3h1.5v1h-1.5v-1z', 'M3 3h1.5v1h-1.5v-1z', 'M5 3h1v1.5h-1v-1.5z', 'M1 6.5h1v1.5h-1v-1.5z', 'M2.5 7h1.5v1h-1.5v-1z', 'M4.5 7h1.5v1h-1.5v-1z', 'M1 4.5h1v1.5h-1v-1.5z', 'M5 5h1v1.5h-1v-1.5z', 'M5 11v3h-3v-3h3zM6 10h-5v5h5v-5z']
   }
 };

package/lib/{index-3b70931d.d.ts → index-02a27c19.d.ts}

@@ -1,28 +1,10 @@
 import React__default from 'react';
-import { TextAlign } from './@types/Align.js';
-import { ColorTheme } from './@types/ColorStyles.js';
-import { HintPosition, Position } from './@types/Position.js';
 import { PermissionAttr, OnDenied } from './@types/PermissionAttr.js';
 import { LeftSlot, RightSlot } from './inputs2/slot/index.js';
-import { ITooltipCommonProps } from './tooltip/types.js';
+import { TextFieldInputBaseProps } from './inputs2/textfield/base.js';
 
-interface TextFieldInputProps extends React__default.ComponentPropsWithoutRef<'input'>, ITooltipCommonProps {
-    hint?: string;
-    label?: string;
-    errors?: string[];
+interface TextFieldInputProps extends TextFieldInputBaseProps {
     gridLayout?: string;
-    customClass?: string;
-    customClassLabel?: string;
-    customClassWrapper?: string;
-    customClassInputContainer?: string;
-    rounded?: boolean;
-    readOnly?: boolean;
-    skeletonize?: boolean;
-    labelUppercase?: boolean;
-    textAlign?: TextAlign;
-    hintPosition?: HintPosition;
-    themePopover?: ColorTheme;
-    popoverAlign?: Extract<Position, 'left' | 'right'>;
     permissionAttr?: PermissionAttr;
     onDeniedActions?: OnDenied;
 }

package/lib/index-053f615b.d.ts

@@ -0,0 +1,26 @@
+import React__default from 'react';
+import { LeftSlot, RightSlot } from './inputs2/slot/index.js';
+import { Options } from './inputs2/selectfield/options.js';
+import { Item } from './inputs2/selectfield/item.js';
+import { SelectFieldInputProps } from './inputs2/selectfield/types.js';
+
+declare const Input: React__default.ForwardRefExoticComponent<SelectFieldInputProps & React__default.RefAttributes<HTMLInputElement>>;
+
+declare const index_Input: typeof Input;
+declare const index_Item: typeof Item;
+declare const index_LeftSlot: typeof LeftSlot;
+declare const index_Options: typeof Options;
+declare const index_RightSlot: typeof RightSlot;
+declare const index_SelectFieldInputProps: typeof SelectFieldInputProps;
+declare namespace index {
+  export {
+    index_Input as Input,
+    index_Item as Item,
+    index_LeftSlot as LeftSlot,
+    index_Options as Options,
+    index_RightSlot as RightSlot,
+    index_SelectFieldInputProps as SelectFieldInputProps,
+  };
+}
+
+export { Input as I, index as i };

package/lib/{index-7dfa8924.d.ts → index-25b80f32.d.ts}

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { T as TextFieldInputProps } from './index-3b70931d.js';
+import { T as TextFieldInputProps } from './index-02a27c19.js';
 
 interface FileFieldInputProps extends Omit<TextFieldInputProps, 'type'> {
     multiple?: boolean;

package/lib/{index-9e576346.d.ts → index-6f5c772d.d.ts}

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import { LeftSlot, RightSlot } from './inputs2/slot/index.js';
-import { T as TextFieldInputProps } from './index-3b70931d.js';
+import { T as TextFieldInputProps } from './index-02a27c19.js';
 
 interface ColorFieldInputProps extends TextFieldInputProps {
     isTypeText?: boolean;

package/lib/{index-208e7f62.d.ts → index-6fcf446c.d.ts}

@@ -1,28 +1,10 @@
 import React__default from 'react';
-import { TextAlign } from './@types/Align.js';
-import { ColorTheme } from './@types/ColorStyles.js';
-import { HintPosition, Position } from './@types/Position.js';
 import { PermissionAttr, OnDenied } from './@types/PermissionAttr.js';
 import { LeftSlot, RightSlot } from './inputs2/slot/index.js';
-import { ITooltipCommonProps } from './tooltip/types.js';
+import { TextAreaFieldInputBaseProps } from './inputs2/textareafield/base.js';
 
-interface TextAreaFieldInputProps extends React__default.ComponentPropsWithoutRef<'textarea'>, ITooltipCommonProps {
-    hint?: string;
-    label?: string;
-    errors?: string[];
+interface TextAreaFieldInputProps extends TextAreaFieldInputBaseProps {
     gridLayout?: string;
-    customClass?: string;
-    customClassLabel?: string;
-    customClassWrapper?: string;
-    customClassInputContainer?: string;
-    rounded?: boolean;
-    readOnly?: boolean;
-    skeletonize?: boolean;
-    labelUppercase?: boolean;
-    textAlign?: TextAlign;
-    hintPosition?: HintPosition;
-    themePopover?: ColorTheme;
-    popoverAlign?: Extract<Position, 'left' | 'right'>;
     permissionAttr?: PermissionAttr;
     onDeniedActions?: OnDenied;
 }

package/lib/index-7159df18.d.ts

@@ -0,0 +1,21 @@
+import React__default from 'react';
+import { PermissionAttr, OnDenied } from './@types/PermissionAttr.js';
+import { CheckboxFieldInputBaseProps } from './inputs2/checkboxfield/base.js';
+
+interface CheckboxFieldInputProps extends CheckboxFieldInputBaseProps {
+    gridLayout?: string;
+    permissionAttr?: PermissionAttr;
+    onDeniedActions?: OnDenied;
+}
+declare const Input: React__default.ForwardRefExoticComponent<CheckboxFieldInputProps & React__default.RefAttributes<HTMLInputElement>>;
+
+type index_CheckboxFieldInputProps = CheckboxFieldInputProps;
+declare const index_Input: typeof Input;
+declare namespace index {
+  export {
+    index_CheckboxFieldInputProps as CheckboxFieldInputProps,
+    index_Input as Input,
+  };
+}
+
+export { CheckboxFieldInputProps as C, Input as I, index as i };

package/lib/{index-e71434f9.d.ts → index-afb7b5a9.d.ts}

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import { RadioFieldInputProps } from './inputs2/radiofield/types.js';
 
-declare const Input: React__default.ForwardRefExoticComponent<Pick<RadioFieldInputProps, "form" | "label" | "slot" | "style" | "title" | "pattern" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "align" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "customClass" | "permissionAttr" | "size" | "skeletonize" | "disabled" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "tooltip" | "tooltipWidth" | "tooltipPosition" | "checked" | "required" | "labelUppercase" | "hint" | "hintPosition" | "themePopover" | "popoverAlign" | "width" | "height" | "readOnly" | "list" | "step" | "maxLength" | "textAlign" | "onDeniedActions" | "gridLayout" | "accept" | "autoComplete" | "src" | "alt" | "max" | "min" | "errors" | "capture" | "crossOrigin" | "enterKeyHint" | "minLength" | "customClassLabel" | "customClassWrapper" | "customClassInputContainer" | "getFieldValue"> & React__default.RefAttributes<HTMLInputElement>>;
+declare const Input: React__default.ForwardRefExoticComponent<Pick<RadioFieldInputProps, "form" | "label" | "slot" | "style" | "title" | "pattern" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "align" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "customClass" | "permissionAttr" | "size" | "skeletonize" | "disabled" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "value" | "tooltip" | "tooltipWidth" | "tooltipPosition" | "checked" | "required" | "labelUppercase" | "hint" | "hintPosition" | "themePopover" | "popoverAlign" | "width" | "height" | "readOnly" | "list" | "step" | "maxLength" | "textAlign" | "onDeniedActions" | "gridLayout" | "accept" | "autoComplete" | "max" | "min" | "src" | "alt" | "fieldId" | "errors" | "capture" | "crossOrigin" | "enterKeyHint" | "minLength" | "customClassLabel" | "customClassWrapper" | "customClassInputContainer" | "getFieldValue"> & React__default.RefAttributes<HTMLInputElement>>;
 
 declare const index_Input: typeof Input;
 declare const index_RadioFieldInputProps: typeof RadioFieldInputProps;

package/lib/inputs/date/index.js

@@ -4,16 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+require("../../assets/styles/datepicker.scss");
 var _react = _interopRequireWildcard(require("react"));
 var _moment = _interopRequireDefault(require("moment"));
 var _gridlayout = _interopRequireDefault(require("../../gridlayout"));
 var _buttons = _interopRequireDefault(require("../../buttons"));
 var _calendar = _interopRequireDefault(require("../../calendar"));
+var _BaseMask = _interopRequireDefault(require("../mask/BaseMask"));
 var _Dialog = _interopRequireDefault(require("./Dialog"));
 var _Dropdown = _interopRequireDefault(require("./Dropdown"));
 var _helpers = require("./helpers");
-require("../../assets/styles/datepicker.scss");
-var _BaseMask = _interopRequireDefault(require("../mask/BaseMask"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
@@ -287,10 +287,7 @@ const DatePicker = props => {
     onChange: (e, date) => {
       if (date) onInputChange(e, date);
     },
-    inputRef: el => {
-      inputDateRef.current = el;
-      if (inputRefProp) inputRefProp.current = el;
-    },
+    inputRef: inputRefProp,
     rightElements: getButtonOpen(),
     required: required,
     handlerSetOnDenied: () => setOnDenied(onDenied)

package/lib/inputs/multiSelect/Dropdown.js

@@ -60,13 +60,14 @@ const Dropdown = props => {
     onUncheckAll,
     onCheckAll,
     selecteds,
-    onSelect
+    onSelect,
+    dropdownMaxWidth
   } = props;
   const [dropdownDynamicStyles] = (0, _react.useState)(returnDropdownDynamicStyles(selectFieldRef, dropdownMaxHeight || 0));
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "dropdown",
     style: _objectSpread({
-      width: dropdownWidth,
+      width: dropdownMaxWidth || dropdownWidth,
       marginLeft: gridWrapperStyle ? gridWrapperStyle.paddingLeft : '0'
     }, dropdownDynamicStyles)
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -88,7 +89,7 @@ const Dropdown = props => {
   }), /*#__PURE__*/_react.default.createElement(_icons.default, {
     customClass: "filtericon",
     name: "search",
-    viewBox: "0 0 32 32"
+    size: 14
   })), /*#__PURE__*/_react.default.createElement("div", {
     className: "listcontainer"
   }, dataCombo && dataCombo.length > 0 && /*#__PURE__*/_react.default.createElement("div", {

package/lib/inputs/multiSelect/index.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _lodash = _interopRequireDefault(require("lodash"));
-var _react = _interopRequireWildcard(require("react"));
 var uuid = _interopRequireWildcard(require("uuid"));
+var _react = _interopRequireWildcard(require("react"));
 var _InputTextBase = _interopRequireDefault(require("../base/InputTextBase"));
 var _ActionButtons = _interopRequireDefault(require("./ActionButtons"));
 var _Dropdown = _interopRequireDefault(require("./Dropdown"));
@@ -30,7 +30,8 @@ const MultiSelectField = props => {
     value,
     onBlur,
     gridLayout,
-    dropdownAlignButton = 'left'
+    dropdownAlignButton = 'left',
+    dropdownMaxWidth = undefined
   } = props;
   const componentId = "multiSelect-component".concat(uuid.v1());
   const [dataCombo, setDataCombo] = (0, _react.useState)(dataSource);
@@ -43,6 +44,7 @@ const MultiSelectField = props => {
   const [onDenied, setOnDenied] = (0, _react.useState)();
   const [insideComponent, setInsideComponent] = (0, _react.useState)(false);
   const [elementStyles, setElementStyles] = (0, _react.useState)();
+  const inputRef = (0, _react.useRef)(null);
   const componentRef = (0, _react.useRef)(null);
   const selectWrapper = (0, _react.useRef)();
   const handleOnSelect = itemSelected => {
@@ -91,8 +93,9 @@ const MultiSelectField = props => {
     setInputValue(currentValue);
   };
   const onOpenClose = () => {
-    setOpened(!opened);
+    setOpened(prevState => !prevState);
     if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);
+    setDataCombo(dataSource);
   };
   const onCheckAll = function () {
     let fromFilter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
@@ -118,6 +121,17 @@ const MultiSelectField = props => {
       setInputValue('');
     }
   };
+  const onBlurOutSide = event => {
+    var _componentRef$current2;
+    const {
+      relatedTarget
+    } = event;
+    if (relatedTarget !== componentRef.current && !((_componentRef$current2 = componentRef.current) !== null && _componentRef$current2 !== void 0 && _componentRef$current2.contains(relatedTarget))) {
+      setOpened(false);
+      setDataCombo(dataSource);
+      setInputValue('');
+    }
+  };
   const setOnDeniedValue = onDeniedValue => {
     setOnDenied(onDeniedValue);
   };
@@ -144,10 +158,12 @@ const MultiSelectField = props => {
     }
     window.addEventListener('resize', onScreenResize);
     document.addEventListener('click', onClickOutSide);
+    document.addEventListener('focusout', onBlurOutSide);
     document.addEventListener('mousemove', onMouseMove);
     return () => {
       window.removeEventListener('resize', onScreenResize);
       document.removeEventListener('click', onClickOutSide);
+      document.removeEventListener('focusout', onBlurOutSide);
       document.removeEventListener('mousemove', onMouseMove);
     };
   }, []);
@@ -175,8 +191,9 @@ const MultiSelectField = props => {
     id: componentId,
     ref: componentRef,
     className: "multiSelect-component"
-  }, /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
+  }, /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, _lodash.default.omit(props, ['dropdownMaxWidth']), {
     value: label,
+    inputRef: inputRef,
     onFocus: () => {
       onFocus();
     },
@@ -213,7 +230,8 @@ const MultiSelectField = props => {
     onFilter: handleOnFilter,
     onFocus: onFocus,
     onBlur: onBlurComponent,
-    gridWrapperStyle: elementStyles
+    gridWrapperStyle: elementStyles,
+    dropdownMaxWidth: dropdownMaxWidth
   })));
 };
 var _default = exports.default = MultiSelectField;

package/lib/inputs/multiSelect/types.d.ts

@@ -44,6 +44,7 @@ interface IDropdownMultiSelectProps {
     };
     selectFieldRef?: RefObject<HTMLDivElement>;
     dropdownMaxHeight?: number;
+    dropdownMaxWidth?: number;
 }
 interface IMultiSelectProps {
     dataSource?: DataCombo[];
@@ -60,6 +61,7 @@ interface IMultiSelectProps {
     hintPosition?: 'below' | 'onLabelRight';
     themePopover?: 'light' | 'dark';
     popoverAlign?: 'right' | 'left';
+    dropdownMaxWidth?: number;
 }
 
 export { DescriptionKey, GetFilteredParams, IActionButtonsProps, IDropdownMultiSelectProps, IMultiSelectProps };

package/lib/inputs/period/PeriodList.js

@@ -38,24 +38,15 @@ const PeriodList = _ref => {
     className: "dropdown-period"
   }, periodOptions.map(item => {
     const itemSelected = selected === item.id;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      role: "button",
+    return /*#__PURE__*/_react.default.createElement("button", {
+      key: String('item-').concat(item.id),
       tabIndex: -1,
-      onKeyDown: () => {},
-      key: "item-".concat(item.id),
       className: (0, _helper.getDropdownItemCssClass)(itemSelected),
       onClick: () => {
         const dates = item.id !== 'custom' ? (0, _helper.CalcDatesByPeriod)(item.id) : null;
         handleOnSelect(item.id, dates);
       }
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      role: "button",
-      className: "menubutton",
-      tabIndex: -1,
-      onKeyPress: () => {}
-    }, /*#__PURE__*/_react.default.createElement("span", {
-      className: "label"
-    }, item.label)));
+    }, item.label);
   }));
 };
 var _default = exports.default = PeriodList;