linear-react-components-ui 1.1.20-beta.33 → 1.1.20-beta.35

package/lib/inputs/multiSelect/Dropdown.js

@@ -0,0 +1,137 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _avatar = _interopRequireDefault(require("../../avatar"));
+var _icons = _interopRequireDefault(require("../../icons"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const returnDropdownDynamicStyles = (selectFieldRef, dropdownMaxHeight) => {
+  var _selectFieldRef$curre, _selectFieldRef$curre2, _selectFieldRef$curre3;
+  const selectFieldRects = selectFieldRef === null || selectFieldRef === void 0 ? void 0 : (_selectFieldRef$curre = selectFieldRef.current) === null || _selectFieldRef$curre === void 0 ? void 0 : _selectFieldRef$curre.getBoundingClientRect();
+  const bottom = selectFieldRects !== null && selectFieldRects !== void 0 && selectFieldRects.bottom ? selectFieldRects === null || selectFieldRects === void 0 ? void 0 : selectFieldRects.bottom : 0;
+  const offsetTop = selectFieldRef !== null && selectFieldRef !== void 0 && (_selectFieldRef$curre2 = selectFieldRef.current) !== null && _selectFieldRef$curre2 !== void 0 && _selectFieldRef$curre2.offsetTop ? selectFieldRef === null || selectFieldRef === void 0 ? void 0 : (_selectFieldRef$curre3 = selectFieldRef.current) === null || _selectFieldRef$curre3 === void 0 ? void 0 : _selectFieldRef$curre3.offsetTop : 0;
+  const dropdownBottomDistance = window.innerHeight - bottom;
+  let maxDropdownBottomDistance = 200;
+  let height = dropdownMaxHeight;
+  let dropdownPosition;
+  if (!height || height <= 0) {
+    if (dropdownBottomDistance < maxDropdownBottomDistance) {
+      height = selectFieldRects !== null && selectFieldRects !== void 0 && selectFieldRects.top ? selectFieldRects.top : 0;
+      dropdownPosition = window.innerHeight - offsetTop + 10;
+    } else {
+      height = dropdownBottomDistance;
+    }
+  } else {
+    maxDropdownBottomDistance = height;
+    if (dropdownBottomDistance < maxDropdownBottomDistance) {
+      dropdownPosition = window.innerHeight - offsetTop + 10;
+    }
+  }
+  return {
+    maxHeight: "".concat(height - 30, "px"),
+    bottom: "".concat(dropdownPosition, "px")
+  };
+};
+const Dropdown = props => {
+  const {
+    imageAlign = 'left',
+    descriptionKey,
+    idKey,
+    dropdownMaxHeight,
+    selectFieldRef,
+    isAllChecked,
+    dropdownWidth,
+    inputValue,
+    gridWrapperStyle,
+    onFocus,
+    onFilter,
+    onBlur,
+    dataCombo,
+    opened,
+    onUncheckAll,
+    onCheckAll,
+    selecteds,
+    onSelect
+  } = props;
+  const [dropdownDynamicStyles] = (0, _react.useState)(returnDropdownDynamicStyles(selectFieldRef, dropdownMaxHeight || 0));
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "dropdown",
+    style: _objectSpread({
+      width: dropdownWidth,
+      marginLeft: gridWrapperStyle ? gridWrapperStyle.paddingLeft : '0'
+    }, dropdownDynamicStyles)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "filtercontainer"
+  }, /*#__PURE__*/_react.default.createElement("input", {
+    className: "filterinput",
+    type: "text",
+    value: inputValue,
+    onFocus: () => {
+      onFocus();
+    },
+    onBlur: e => {
+      onBlur(e);
+    },
+    onChange: e => {
+      onFilter(e.target.value);
+    },
+    autoFocus: opened
+  }), /*#__PURE__*/_react.default.createElement(_icons.default, {
+    customClass: "filtericon",
+    name: "search",
+    viewBox: "0 0 32 32"
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "listcontainer"
+  }, dataCombo && dataCombo.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
+    className: "item selectall"
+  }, /*#__PURE__*/_react.default.createElement("button", {
+    className: "menubutton",
+    tabIndex: -1,
+    onClick: () => isAllChecked ? onUncheckAll(true) : onCheckAll(true)
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: isAllChecked && dataCombo.length > 0 ? 'checkboxChecked2' : 'checkboxUnchecked2',
+    customClass: "checkboxicon"
+  }), /*#__PURE__*/_react.default.createElement("span", {
+    className: "label"
+  }, inputValue !== '' ? 'Selecionar todos pesquisados' : 'Selecionar Todos'))), dataCombo === null || dataCombo === void 0 ? void 0 : dataCombo.map(item => {
+    const isChecked = selecteds ? selecteds.find(selected => selected[idKey] === item[idKey]) : undefined;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: "dropdowmItem ".concat(item[idKey], "}"),
+      className: "item ".concat(isChecked && '-selected')
+    }, /*#__PURE__*/_react.default.createElement("button", {
+      className: "menubutton",
+      tabIndex: -1,
+      onClick: () => {
+        onSelect(item);
+      }
+    }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+      name: isChecked ? 'checkboxChecked2' : 'checkboxUnchecked2',
+      customClass: "checkboxicon"
+    }), item.iconName && /*#__PURE__*/_react.default.createElement(_icons.default, {
+      name: item.iconName,
+      customClass: "menuicon",
+      style: {
+        order: imageAlign === 'left' ? 0 : 1
+      }
+    }), item.imgSrcKey && /*#__PURE__*/_react.default.createElement(_avatar.default, {
+      src: item.imgSrcKey,
+      customClass: "menuicon",
+      style: {
+        order: imageAlign === 'left' ? 0 : 1
+      }
+    }), /*#__PURE__*/_react.default.createElement("span", {
+      className: "label"
+    }, typeof descriptionKey === 'string' ? item[descriptionKey] : descriptionKey(item))));
+  })));
+};
+var _default = exports.default = Dropdown;

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

@@ -0,0 +1,13 @@
+import { GetFilteredParams } from './types.js';
+import 'react';
+import '../../@types/DataCombo.js';
+import '../base/types.js';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+
+declare const getFilteredDataCombo: ({ dataSource, descriptionKey, inputText, }: GetFilteredParams) => any[];
+
+export { getFilteredDataCombo as default };

package/lib/inputs/multiSelect/helper.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+const getFilteredDataCombo = _ref => {
+  let {
+    dataSource,
+    descriptionKey,
+    inputText
+  } = _ref;
+  return dataSource.filter(item => {
+    var _descriptionKey;
+    if (typeof descriptionKey === 'string') {
+      return item[descriptionKey].toLowerCase().indexOf(inputText.toLowerCase()) > -1;
+    }
+    return ((_descriptionKey = descriptionKey(item)) === null || _descriptionKey === void 0 ? void 0 : _descriptionKey.toLowerCase().indexOf(inputText.toLowerCase())) > -1;
+  });
+};
+var _default = exports.default = getFilteredDataCombo;

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

@@ -0,0 +1,13 @@
+import { IMultiSelectProps } from './types.js';
+import 'react';
+import '../../@types/DataCombo.js';
+import '../base/types.js';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+
+declare const MultiSelectField: (props: IMultiSelectProps) => JSX.Element;
+
+export { MultiSelectField as default };

package/lib/inputs/multiSelect/index.js

@@ -0,0 +1,220 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _lodash = _interopRequireDefault(require("lodash"));
+var _react = _interopRequireWildcard(require("react"));
+var uuid = _interopRequireWildcard(require("uuid"));
+var _InputTextBase = _interopRequireDefault(require("../base/InputTextBase"));
+var _ActionButtons = _interopRequireDefault(require("./ActionButtons"));
+var _Dropdown = _interopRequireDefault(require("./Dropdown"));
+var _helper = _interopRequireDefault(require("./helper"));
+require("../../assets/styles/multiSelect.scss");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const MultiSelectField = props => {
+  const {
+    onSelect,
+    idKey,
+    disabled = false,
+    dataSource,
+    descriptionKey,
+    value,
+    onBlur,
+    gridLayout,
+    dropdownAlignButton = 'left'
+  } = props;
+  const componentId = "multiSelect-component".concat(uuid.v1());
+  const [dataCombo, setDataCombo] = (0, _react.useState)(dataSource);
+  const [selecteds, setSelecteds] = (0, _react.useState)();
+  const [inputValue, setInputValue] = (0, _react.useState)('');
+  const [label, setLabel] = (0, _react.useState)('Nenhum selecionado');
+  const [dropdownWidth, setDropdownWidth] = (0, _react.useState)(0);
+  const [isAllChecked, setIsAllChecked] = (0, _react.useState)(false);
+  const [opened, setOpened] = (0, _react.useState)(false);
+  const [onDenied, setOnDenied] = (0, _react.useState)();
+  const [insideComponent, setInsideComponent] = (0, _react.useState)(false);
+  const [elementStyles, setElementStyles] = (0, _react.useState)();
+  const componentRef = (0, _react.useRef)(null);
+  const selectWrapper = (0, _react.useRef)();
+  const handleOnSelect = itemSelected => {
+    if (itemSelected === null) return;
+    let newSelecteds = selecteds;
+    if (newSelecteds) {
+      const hasSelected = newSelecteds.find(selected => selected[idKey] === itemSelected[idKey]);
+      if (hasSelected) {
+        newSelecteds = newSelecteds.filter(item => item[idKey] !== itemSelected[idKey]);
+      } else {
+        newSelecteds = [...newSelecteds, itemSelected];
+      }
+      if (onSelect) onSelect(newSelecteds.map(item => item[idKey]));
+    }
+    setSelecteds(newSelecteds);
+  };
+  const onFocus = () => {
+    let newDropdownWidth = dropdownWidth;
+    newDropdownWidth = selectWrapper.current ? selectWrapper.current.clientWidth : dropdownWidth;
+    setOpened(true);
+    setDropdownWidth(newDropdownWidth);
+  };
+  const onMouseMove = event => {
+    const target = event.target;
+    if ((target === null || target === void 0 ? void 0 : target.className) === '') return;
+    const newInsideComponent = ['item', 'menubutton', 'filterinput', 'filtercontainer', 'label'].includes(target === null || target === void 0 ? void 0 : target.className);
+    setInsideComponent(newInsideComponent);
+  };
+  const onBlurComponent = e => {
+    if (onBlur) onBlur(e);
+    if (!insideComponent) {
+      setInputValue('');
+      setDataCombo(dataSource);
+    }
+  };
+  const handleOnFilter = currentValue => {
+    let newDataCombo = dataSource;
+    if (currentValue !== '' && dataSource) {
+      newDataCombo = (0, _helper.default)({
+        dataSource,
+        descriptionKey,
+        inputText: currentValue
+      });
+    }
+    setDataCombo(newDataCombo);
+    setInputValue(currentValue);
+  };
+  const onOpenClose = () => {
+    setOpened(!opened);
+    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);
+  };
+  const onCheckAll = function () {
+    let fromFilter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    const currentData = fromFilter ? dataCombo : dataSource;
+    if (onSelect && currentData) onSelect(currentData.map(i => i[idKey]));
+    setSelecteds(currentData);
+  };
+  const onUncheckAll = () => {
+    if (onSelect) onSelect();
+    setSelecteds([]);
+  };
+  const onScreenResize = () => {
+    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);
+  };
+  const onClickOutSide = event => {
+    var _componentRef$current;
+    const {
+      target
+    } = event;
+    if (target !== componentRef.current && !((_componentRef$current = componentRef.current) !== null && _componentRef$current !== void 0 && _componentRef$current.contains(target))) {
+      setOpened(false);
+      setDataCombo(dataSource);
+      setInputValue('');
+    }
+  };
+  const setOnDeniedValue = onDeniedValue => {
+    setOnDenied(onDeniedValue);
+  };
+  const shouldDisabled = () => !!(disabled || onDenied && (onDenied.disabled || onDenied.hideContent));
+  const getLabel = () => {
+    const checkIsAll = _lodash.default.isEqual(selecteds, dataSource);
+    let newLabel = label;
+    if (checkIsAll) {
+      newLabel = 'Todos';
+    } else if (selecteds && selecteds.length > 1) {
+      newLabel = 'Múltiplos';
+    } else if (selecteds && selecteds.length === 1) {
+      newLabel = typeof descriptionKey === 'string' ? selecteds[0][descriptionKey] : descriptionKey(selecteds[0]);
+    } else {
+      newLabel = 'Nenhum selecionado';
+    }
+    setLabel(newLabel);
+  };
+  (0, _react.useEffect)(() => {
+    if (gridLayout) {
+      var _selectWrapper$curren;
+      const currentGridEl = (_selectWrapper$curren = selectWrapper.current) === null || _selectWrapper$curren === void 0 ? void 0 : _selectWrapper$curren.parentElement;
+      if (currentGridEl) setElementStyles(window.getComputedStyle(currentGridEl));
+    }
+    window.addEventListener('resize', onScreenResize);
+    document.addEventListener('click', onClickOutSide);
+    document.addEventListener('mousemove', onMouseMove);
+    return () => {
+      window.removeEventListener('resize', onScreenResize);
+      document.removeEventListener('click', onClickOutSide);
+      document.removeEventListener('mousemove', onMouseMove);
+    };
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (dataSource && dataSource.length > 0) {
+      const newSelecteds = dataSource.filter(item => value === null || value === void 0 ? void 0 : value.includes(item[idKey]));
+      setSelecteds(newSelecteds);
+    }
+  }, [value === null || value === void 0 ? void 0 : value.length, dataSource === null || dataSource === void 0 ? void 0 : dataSource.length]);
+  (0, _react.useEffect)(() => {
+    if (dataSource && dataCombo && !_lodash.default.isEqual(dataSource, dataCombo)) {
+      const newDataCombo = (0, _helper.default)(_objectSpread(_objectSpread({}, props), {}, {
+        dataSource: dataSource || undefined,
+        inputText: inputValue
+      }));
+      setDataCombo(newDataCombo);
+    }
+  }, [dataSource]);
+  (0, _react.useEffect)(() => {
+    const checkAll = _lodash.default.isEqual(dataCombo, selecteds);
+    setIsAllChecked(checkAll);
+    getLabel();
+  }, [selecteds, dataCombo]);
+  return /*#__PURE__*/_react.default.createElement("span", {
+    id: componentId,
+    ref: componentRef,
+    className: "multiSelect-component"
+  }, /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
+    value: label,
+    onFocus: () => {
+      onFocus();
+    },
+    onBlur: e => {
+      onBlurComponent(e);
+    },
+    customClassForWrapper: "selectwrapper -undigitable",
+    customClassForInputContent: "multiselect",
+    inputBaseRef: r => {
+      selectWrapper.current = r;
+    },
+    handlerSetOnDenied: setOnDeniedValue,
+    rightElements: /*#__PURE__*/_react.default.createElement(_ActionButtons.default, {
+      dropdownAlignButton: dropdownAlignButton,
+      disabled: shouldDisabled(),
+      dropdownOpened: opened,
+      handleOpenClose: () => {
+        onOpenClose();
+      },
+      handleCheckAll: onCheckAll,
+      handleUncheckAll: onUncheckAll
+    })
+  })), opened && /*#__PURE__*/_react.default.createElement(_Dropdown.default, _extends({}, props, {
+    opened: opened,
+    dataCombo: dataCombo,
+    selecteds: selecteds,
+    inputValue: inputValue,
+    isAllChecked: isAllChecked,
+    onCheckAll: onCheckAll,
+    onUncheckAll: onUncheckAll,
+    dropdownWidth: dropdownWidth,
+    selectFieldRef: componentRef,
+    onSelect: handleOnSelect,
+    onFilter: handleOnFilter,
+    onFocus: onFocus,
+    onBlur: onBlurComponent,
+    gridWrapperStyle: elementStyles
+  })));
+};
+var _default = exports.default = MultiSelectField;

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

@@ -0,0 +1,65 @@
+import { ChangeEvent, RefObject } from 'react';
+import { DataCombo } from '../../@types/DataCombo.js';
+import { CustomInputEvent } from '../base/types.js';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../@types/PermissionAttr.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+
+type DescriptionKey = string | ((dataSelected: DataCombo) => string);
+interface GetFilteredParams {
+    dataSource: DataCombo[];
+    descriptionKey: DescriptionKey;
+    inputText: string;
+}
+interface IActionButtonsProps {
+    handleOpenClose: () => void;
+    handleCheckAll: () => void;
+    handleUncheckAll: () => void;
+    disabled: boolean;
+    dropdownOpened?: boolean;
+    dropdownAlignButton?: 'left' | 'right';
+}
+interface IDropdownMultiSelectProps {
+    dataCombo?: DataCombo[];
+    idKey: string;
+    descriptionKey: DescriptionKey;
+    inputValue: string;
+    isAllChecked: boolean;
+    dropdownWidth: number;
+    onBlur: (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    onFocus: () => void;
+    onSelect: (data: DataCombo) => void;
+    onFilter: (value: string) => void;
+    onUncheckAll: (checkAll: boolean) => void;
+    onCheckAll: (checkAll: boolean) => void;
+    opened: boolean;
+    selecteds?: DataCombo[] | null;
+    imgSrcKey?: string;
+    imageAlign?: 'left' | 'right';
+    gridWrapperStyle?: {
+        paddingLeft: string;
+        paddingRight: string;
+    };
+    selectFieldRef?: RefObject<HTMLDivElement>;
+    dropdownMaxHeight?: number;
+}
+interface IMultiSelectProps {
+    dataSource?: DataCombo[];
+    idKey: string;
+    descriptionKey: DescriptionKey;
+    value?: any[];
+    gridLayout?: string;
+    onSelect?: (data?: string[]) => void;
+    onBlur?: (e: CustomInputEvent) => void;
+    disabled?: boolean;
+    dropdownAlignButton?: 'left' | 'right';
+    label?: string;
+    hint?: string | string[];
+    hintPosition?: 'below' | 'onLabelRight';
+    themePopover?: 'light' | 'dark';
+    popoverAlign?: 'right' | 'left';
+}
+
+export { DescriptionKey, GetFilteredParams, IActionButtonsProps, IDropdownMultiSelectProps, IMultiSelectProps };

package/lib/inputs/multiSelect/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/inputs/number/BaseNumber.d.ts

@@ -0,0 +1,17 @@
+import { IBaseNumberProps } from './types.js';
+import '../../@types/PermissionAttr.js';
+import '../base/types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+import '../types.js';
+import '../../@types/DataCombo.js';
+import '../../drawer/types.js';
+import '../../@types/Icon.js';
+import '../../icons/helper.js';
+
+declare const BaseNumber: (props: IBaseNumberProps) => JSX.Element;
+
+export { BaseNumber as default };

package/lib/inputs/number/BaseNumber.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _BaseMask = _interopRequireDefault(require("../mask/BaseMask"));
+var _format_number = require("./format_number");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const returnEventFormattedValue = (props, event) => {
+  if (props.returnFormattedValueOnBlur || props.returnFormattedValueOnKeyDown) {
+    // Retornando um objeto com a mesma estrutura do Proxy original
+    // para recuperacao do valor formatado no padrão americano.
+    // O retorno poderá ser modificado conforme necessidade, desde que seja
+    // mantido o path até a propriedade value e name.
+    const {
+      value,
+      name
+    } = event.target;
+    return _objectSpread(_objectSpread({}, event), {}, {
+      target: {
+        value: (0, _format_number.numberToEnUS)(value),
+        name
+      }
+    });
+  }
+  return event;
+};
+const getEventProps = props => {
+  const {
+    returnFormattedValueOnBlur,
+    returnFormattedValueOnKeyDown
+  } = props;
+  if (props.isNumeric) return {};
+  return {
+    onBlur: e => {
+      if (props.onBlur) {
+        const formattedEvent = returnFormattedValueOnBlur ? returnEventFormattedValue(props, e) : e;
+        props.onBlur(formattedEvent);
+      }
+    },
+    onKeyDown: e => {
+      if (props.onKeyDown) {
+        const formattedEvent = returnFormattedValueOnKeyDown ? returnEventFormattedValue(props, e) : e;
+        props.onKeyDown(formattedEvent);
+      }
+    }
+  };
+};
+const BaseNumber = props => {
+  const eventProps = _objectSpread(_objectSpread({}, props), {}, {
+    returnFormattedValueOnBlur: true,
+    returnFormattedValueOnKeyDown: true
+  });
+  return /*#__PURE__*/_react.default.createElement(_BaseMask.default, _extends({
+    value: (0, _format_number.numberToPtBR)(props.value),
+    thousandsSeparator: ".",
+    radix: ",",
+    mask: Number,
+    isNumeric: true
+  }, props, getEventProps(eventProps)));
+};
+var _default = exports.default = BaseNumber;

package/lib/inputs/number/Currency.d.ts

@@ -0,0 +1,17 @@
+import { ICurrencyProps } from './types.js';
+import '../../@types/PermissionAttr.js';
+import '../base/types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+import '../types.js';
+import '../../@types/DataCombo.js';
+import '../../drawer/types.js';
+import '../../@types/Icon.js';
+import '../../icons/helper.js';
+
+declare const CurrencyField: (props: ICurrencyProps) => JSX.Element;
+
+export { CurrencyField as default };

package/lib/inputs/number/Currency.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _BaseNumber = _interopRequireDefault(require("./BaseNumber"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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); }
+const CurrencyField = props => {
+  const {
+    currencySymbol = 'R$'
+  } = props;
+  const leftElements = props.displayCurrencySymbol ? /*#__PURE__*/_react.default.createElement("span", {
+    className: "currency-symbol"
+  }, currencySymbol) : [];
+  return /*#__PURE__*/_react.default.createElement(_BaseNumber.default, _extends({}, props, {
+    leftElements: leftElements
+  }));
+};
+var _default = exports.default = CurrencyField;

package/lib/inputs/number/Decimal.d.ts

@@ -0,0 +1,17 @@
+import { IBaseNumberProps } from './types.js';
+import '../../@types/PermissionAttr.js';
+import '../base/types.js';
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/Period.js';
+import '../../internals/types.js';
+import '../../@types/Position.js';
+import '../types.js';
+import '../../@types/DataCombo.js';
+import '../../drawer/types.js';
+import '../../@types/Icon.js';
+import '../../icons/helper.js';
+
+declare const DecimalField: (props: IBaseNumberProps) => JSX.Element;
+
+export { DecimalField as default };

package/lib/inputs/number/Decimal.js

@@ -0,0 +1,11 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _BaseNumber = _interopRequireDefault(require("./BaseNumber"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const DecimalField = props => /*#__PURE__*/_react.default.createElement(_BaseNumber.default, props);
+var _default = exports.default = DecimalField;

package/lib/inputs/number/format_number.d.ts

@@ -0,0 +1,5 @@
+declare const numberToPtBR: (value?: string | number) => string | undefined;
+declare const numberToEnUS: (value: string) => string | number;
+declare const formatOnlyNumbers: (value: string) => string;
+
+export { formatOnlyNumbers, numberToEnUS, numberToPtBR };