hrm_ui_lib 2.0.3 → 2.1.1

package/components/Select/FilterSelect/FilterSelect.js

@@ -1,202 +1,72 @@
-import _extends from '@babel/runtime/helpers/extends';
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import React, { useState, useId, useCallback } from 'react';
+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 { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useId, useState } from 'react';
 import { createPortal } from 'react-dom';
-import { useHideOnScroll } from '../../../hooks/useHideOnScroll.js';
-import 'dayjs';
-import { useOnOutsideClick } from '../../../hooks/useOnOutsideClick.js';
-import '../../../hooks/useScreenSize.js';
-import 'react-hook-form';
-import { FilterDropdownContent } from './FilterDropdown.js';
-import { FilterGroupDropdownContent } from './FilterGroupDropdown.js';
-import { Footer } from '../SharedComponents/Footer.js';
-import '@babel/runtime/helpers/defineProperty';
-import 'classnames';
-import '../../../consts/index.js';
-import '../../../Alert-V_kH4Snn.js';
-import 'react-syntax-highlighter';
-import 'framer-motion';
-import '../../Collapse/CollapseGroup/CollapseGroup.js';
-import '../SharedComponents/ContentTop.js';
-import { Loading } from '../SharedComponents/Loading.js';
-import { Input } from '../../Input/Input.js';
-import { IconSearchFilled } from '../../SVGIcons/IconSearchFilled.js';
-import { IconDismissFilled } from '../../SVGIcons/IconDismissFilled.js';
-import '../../../type/file-upload.js';
-import '../../../helperComponents/OptionItem/OptionItem.js';
-import '../../Avatar/Avatar.js';
-import '../../FileUpload/FileUpload.js';
-import '../../FileUpload/types.js';
-import '../../../helperComponents/Label/Label.js';
-import '../../Text/Text.js';
-import '../../../utils/helpers.js';
-import '../../FileUpload/UploadItems.js';
-import '../../../hooks/useFormProps.js';
-import '../../../context/types.js';
-import '../../../helperComponents/ErrorMessage/ErrorMessage.js';
-import '../../../helperComponents/IconDynamicComponent/IconDynamicComponent.js';
-import '../../../helperComponents/IconDynamicComponent/constants.js';
-import '../../SVGIcons/IconDelete.js';
-import '../../Alert/consts.js';
-import '../../../helperComponents/Loader/Loader.js';
-import 'react-dropzone';
-import '../../SVGIcons/IconUpload.js';
-import '../../../helpers/format-date.js';
-import '../../../helpers/locale.js';
-import '../../../type/locale.js';
-import '../../../helpers/storage.js';
-import 'react-toastify';
-import '../../../hooks/useGetIsMobile.js';
-import '../../../helperComponents/AnimatePresenceWrapper/AnimatePresenceWrapper.js';
-import '../../../hooks/useHideBodyScroll.js';
-import '../../SVGIcons/IconDismiss.js';
-import '../../Tooltip/types.js';
-import '../../Tooltip/Tooltip.js';
-import '../../../hooks/useGetTooltipStyles.js';
-import '../../../hooks/useGetElemSizes.js';
-import '../../../hooks/useGetElemPositions.js';
-import '../../../hooks/useGetTooltipPosition.js';
-import '../../Link/Link.js';
-import '../../Popover/PopoverDesktop.js';
-import '../../SVGIcons/IconInfo.js';
-import '@babel/runtime/helpers/typeof';
-import '../../FileUpload/DropzoneFileUpload/FilePreview.js';
-import '../../Progress/Progress.js';
-import '../../SVGIcons/IconArrowDownloadFilled.js';
-import '../../../helpers/download-file.js';
-import '../../Button/consts.js';
-import '../../SVGIcons/IconEditFilled.js';
-import '../../SVGIcons/IconEdit.js';
-import '../../SVGIcons/IconAttach.js';
-import '../../SVGIcons/IconCheckmark.js';
-import '../localization.js';
-import '../../Collapse/CollapseItem/CollapseItem.js';
-import '../../SVGIcons/IconChevronRight.js';
-import '../../Divider/Divider.js';
-import '../../SVGIcons/IconChevronDown.js';
-import '../SharedComponents/Actions.js';
-import '../../Menu/Menu.js';
-import '../../SVGIcons/IconMore.js';
-import '../../SVGIcons/IconSelectAllOff.js';
-import '../../SVGIcons/IconChevronLeft.js';
-import 'react-input-mask';
-import 'react-number-format';
-import '../../SVGIcons/IconCheckmarkCircleFilled.js';
-
-var _excluded = ["isLoading", "isGrouped", "options", "isOpen", "setFieldValue", "name", "footerButtonProps", "selectedItems", "setSelectedItems", "closeHandler", "parentRef", "language"];
-var FilterSelect = function FilterSelect(props) {
-  var isLoading = props.isLoading,
-    isGrouped = props.isGrouped,
-    options = props.options,
-    isOpen = props.isOpen,
-    setFieldValue = props.setFieldValue,
-    name = props.name,
-    footerButtonProps = props.footerButtonProps,
-    selectedItems = props.selectedItems,
-    setSelectedItems = props.setSelectedItems,
-    closeHandler = props.closeHandler,
-    parentRef = props.parentRef,
-    _props$language = props.language,
-    language = _props$language === void 0 ? 'en' : _props$language,
-    rest = _objectWithoutProperties(props, _excluded);
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    containerRef = _useState2[0],
-    setContainerRef = _useState2[1];
-  var _useState3 = useState(selectedItems),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedValues = _useState4[0],
-    setSelectedValues = _useState4[1];
-  var _useState5 = useState(''),
-    _useState6 = _slicedToArray(_useState5, 2),
-    filterValue = _useState6[0],
-    setFilterValue = _useState6[1];
-  useOnOutsideClick(containerRef, closeHandler, isOpen, useId());
-  useHideOnScroll(closeHandler);
-  var onItemSelect = useCallback(function (item) {
-    setSelectedValues(function (selected) {
-      return [].concat(_toConsumableArray(selected), [item]);
-    });
-  }, []);
-  var submitSelectedValue = function submitSelectedValue(selections) {
-    if (setSelectedItems) {
-      setSelectedItems(selections);
-    }
-    if (name && setFieldValue) {
-      setFieldValue(name, selections);
-    }
-    closeHandler();
-  };
-  var checkIsSelected = function checkIsSelected(itemValue) {
-    return selectedValues.find(function (item) {
-      return item.value === itemValue;
-    }) !== undefined;
-  };
-  var applySelectedItems = useCallback(function () {
-    submitSelectedValue(selectedValues);
-    closeHandler();
-  }, [selectedValues]);
-  var cancelSelectedItems = function cancelSelectedItems() {
-    submitSelectedValue(selectedItems);
-    setSelectedValues(selectedItems);
-    closeHandler();
-  };
-  var onItemDeselect = function onItemDeselect(_ref) {
-    var value = _ref.value;
-    setSelectedValues(function (selected) {
-      return selected.filter(function (optionValue) {
-        return optionValue.value !== value;
-      });
-    });
-  };
-  var onFilter = function onFilter(e) {
-    e.preventDefault();
-    e.stopPropagation();
-    setFilterValue(e.target.value);
-  };
-  var removeFilterValue = function removeFilterValue() {
-    setFilterValue('');
-  };
-  if (!isOpen) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/createPortal(/*#__PURE__*/React.createElement("div", {
-    className: "select filter"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "select__options",
-    ref: setContainerRef
-  }, /*#__PURE__*/React.createElement(Input, {
-    onChange: onFilter,
-    className: "filter__input",
-    size: "small",
-    currentValue: filterValue,
-    rightIconProps: {
-      size: filterValue === '' ? 'small' : 'xsmall',
-      Component: filterValue === '' ? IconSearchFilled : IconDismissFilled,
-      onClick: removeFilterValue
+import { useOnOutsideClick, useHideOnScroll } from '../../../hooks';
+import { FilterDropdownContent } from './FilterDropdown';
+import { FilterGroupDropdownContent } from './FilterGroupDropdown';
+import { Footer, Loading } from '../SharedComponents';
+import { Input } from '../../Input';
+import IconSearchFilled from '../../SVGIcons/IconSearchFilled';
+import IconDismissFilled from '../../SVGIcons/IconDismissFilled';
+export const FilterSelect = (props) => {
+    const { isLoading, isGrouped, options, isOpen, setFieldValue, name, footerButtonProps, selectedItems, setSelectedItems, closeHandler, parentRef, language = 'en' } = props, rest = __rest(props, ["isLoading", "isGrouped", "options", "isOpen", "setFieldValue", "name", "footerButtonProps", "selectedItems", "setSelectedItems", "closeHandler", "parentRef", "language"]);
+    const [containerRef, setContainerRef] = useState(null);
+    const [selectedValues, setSelectedValues] = useState(selectedItems);
+    const [filterValue, setFilterValue] = useState('');
+    useOnOutsideClick(containerRef, closeHandler, isOpen, useId());
+    useHideOnScroll(closeHandler);
+    const onItemSelect = useCallback((item) => {
+        setSelectedValues((selected) => [...selected, item]);
+    }, []);
+    const submitSelectedValue = (selections) => {
+        if (setSelectedItems) {
+            setSelectedItems(selections);
+        }
+        if (name && setFieldValue) {
+            setFieldValue(name, selections);
+        }
+        closeHandler();
+    };
+    const checkIsSelected = (itemValue) => {
+        return selectedValues.find((item) => item.value === itemValue) !== undefined;
+    };
+    const applySelectedItems = useCallback(() => {
+        submitSelectedValue(selectedValues);
+        closeHandler();
+    }, [selectedValues]);
+    const cancelSelectedItems = () => {
+        submitSelectedValue(selectedItems);
+        setSelectedValues(selectedItems);
+        closeHandler();
+    };
+    const onItemDeselect = ({ value }) => {
+        setSelectedValues((selected) => selected.filter((optionValue) => optionValue.value !== value));
+    };
+    const onFilter = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setFilterValue(e.target.value);
+    };
+    const removeFilterValue = () => {
+        setFilterValue('');
+    };
+    if (!isOpen) {
+        return null;
     }
-  }), /*#__PURE__*/React.createElement("div", {
-    className: 'select__options__scroll scrollbar scrollbar--vertical '
-  }, isLoading ? /*#__PURE__*/React.createElement(Loading, null) : isGrouped ? /*#__PURE__*/React.createElement(FilterGroupDropdownContent, _extends({
-    checkIsSelected: checkIsSelected,
-    onItemDeselect: onItemDeselect,
-    filterValue: filterValue,
-    onItemSelect: onItemSelect,
-    options: options
-  }, rest)) : /*#__PURE__*/React.createElement(FilterDropdownContent, _extends({
-    checkIsSelected: checkIsSelected,
-    onItemDeselect: onItemDeselect,
-    filterValue: filterValue,
-    onItemSelect: onItemSelect,
-    options: options
-  }, rest))), isLoading ? null : /*#__PURE__*/React.createElement(Footer, {
-    buttonProps: footerButtonProps,
-    onCancel: cancelSelectedItems,
-    onApply: applySelectedItems,
-    language: language
-  }))), parentRef));
+    return (_jsx(_Fragment, { children: createPortal(_jsx("div", { className: "select filter", children: _jsxs("div", { className: "select__options", ref: setContainerRef, children: [_jsx(Input, { onChange: onFilter, className: "filter__input", size: "small", currentValue: filterValue, rightIconProps: {
+                            size: filterValue === '' ? 'small' : 'xsmall',
+                            Component: filterValue === '' ? IconSearchFilled : IconDismissFilled,
+                            onClick: removeFilterValue
+                        } }), _jsx("div", { className: 'select__options__scroll scrollbar scrollbar--vertical ', children: isLoading ? (_jsx(Loading, {})) : isGrouped ? (_jsx(FilterGroupDropdownContent, Object.assign({ checkIsSelected: checkIsSelected, onItemDeselect: onItemDeselect, filterValue: filterValue, onItemSelect: onItemSelect, options: options }, rest))) : (_jsx(FilterDropdownContent, Object.assign({ checkIsSelected: checkIsSelected, onItemDeselect: onItemDeselect, filterValue: filterValue, onItemSelect: onItemSelect, options: options }, rest))) }), isLoading ? null : (_jsx(Footer, { buttonProps: footerButtonProps, onCancel: cancelSelectedItems, onApply: applySelectedItems, language: language }))] }) }), parentRef) }));
 };
-
-export { FilterSelect };

package/components/Select/MultiSelect/DesktopWrapper.js

@@ -1,56 +1,19 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import React from 'react';
-import { DROPDOWN_AND_INPUT_GAP } from '../../../consts/index.js';
-import { useGetElemSizes } from '../../../hooks/useGetElemSizes.js';
-import { useGetElemPositions } from '../../../hooks/useGetElemPositions.js';
-import 'dayjs';
-import '../../../hooks/useScreenSize.js';
-import '@babel/runtime/helpers/slicedToArray';
-import { useGetHasTopSpace, useGetHasBottomSpace } from '../../../hooks/useGetHasBottomSpace.js';
-import 'react-hook-form';
-import '../../../type/file-upload.js';
-
-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), true).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; }
-var DesktopWrapper = function DesktopWrapper(props) {
-  var offsets = props.offsets,
-    setDropdownRef = props.setDropdownRef,
-    align = props.align,
-    isOpen = props.isOpen,
-    children = props.children,
-    inputRef = props.inputRef,
-    dropdownRef = props.dropdownRef,
-    containerRef = props.containerRef,
-    dropdownWidth = props.dropdownWidth;
-  var _useGetElemPositions = useGetElemPositions(inputRef),
-    bottom = _useGetElemPositions.bottom,
-    left = _useGetElemPositions.left,
-    top = _useGetElemPositions.top,
-    right = _useGetElemPositions.right;
-  var _useGetElemSizes = useGetElemSizes(containerRef),
-    containerWidth = _useGetElemSizes.width;
-  var hasTopSpace = useGetHasTopSpace({
-    element: dropdownRef,
-    input: inputRef
-  });
-  var _useGetHasBottomSpace = useGetHasBottomSpace({
-      element: dropdownRef,
-      input: inputRef
-    }),
-    hasBottomSpace = _useGetHasBottomSpace.hasBottomSpace;
-  return isOpen ? /*#__PURE__*/React.createElement("div", {
-    className: "select__options",
-    ref: setDropdownRef,
-    style: _objectSpread({
-      left: align === 'left' ? (offsets === null || offsets === void 0 ? void 0 : offsets.left) || left : right - (dropdownWidth || containerWidth),
-      right: align === 'right' ? (offsets === null || offsets === void 0 ? void 0 : offsets.right) || left : right - (dropdownWidth || containerWidth),
-      width: dropdownWidth || containerWidth
-    }, hasBottomSpace || !hasTopSpace ? {
-      top: (offsets === null || offsets === void 0 ? void 0 : offsets.top) || bottom
-    } : {
-      bottom: window.innerHeight - top + DROPDOWN_AND_INPUT_GAP
-    })
-  }, children) : null;
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DROPDOWN_AND_INPUT_GAP } from '../../../consts';
+import { useGetElemPositions, useGetElemSizes, useGetHasBottomSpace, useGetHasTopSpace } from '../../../hooks';
+export const DesktopWrapper = (props) => {
+    const { offsets, setDropdownRef, align, isOpen, children, inputRef, dropdownRef, containerRef, dropdownWidth } = props;
+    const { bottom, left, top, right } = useGetElemPositions(inputRef);
+    const { width: containerWidth } = useGetElemSizes(containerRef);
+    const hasTopSpace = useGetHasTopSpace({
+        element: dropdownRef,
+        input: inputRef
+    });
+    const { hasBottomSpace } = useGetHasBottomSpace({
+        element: dropdownRef,
+        input: inputRef
+    });
+    return isOpen ? (_jsx("div", { className: "select__options", ref: setDropdownRef, style: Object.assign({ left: align === 'left' ? (offsets === null || offsets === void 0 ? void 0 : offsets.left) || left : right - (dropdownWidth || containerWidth), right: align === 'right' ? (offsets === null || offsets === void 0 ? void 0 : offsets.right) || left : right - (dropdownWidth || containerWidth), width: dropdownWidth || containerWidth }, (hasBottomSpace || !hasTopSpace
+            ? { top: (offsets === null || offsets === void 0 ? void 0 : offsets.top) || bottom }
+            : { bottom: window.innerHeight - top + DROPDOWN_AND_INPUT_GAP })), children: children })) : null;
 };
-
-export { DesktopWrapper };

package/components/Select/MultiSelect/MobileWrapper.js

@@ -1,78 +1,13 @@
-import React from 'react';
-import { a as Modal } from '../../../Alert-V_kH4Snn.js';
-import '@babel/runtime/helpers/extends';
-import '@babel/runtime/helpers/slicedToArray';
-import 'classnames';
-import 'framer-motion';
-import '../../../consts/index.js';
-import 'dayjs';
-import '../../../hooks/useScreenSize.js';
-import 'react-hook-form';
-import '@babel/runtime/helpers/defineProperty';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '@babel/runtime/helpers/toConsumableArray';
-import 'react-syntax-highlighter';
-import '../../Alert/consts.js';
-import '../../Text/Text.js';
-import '../../../utils/helpers.js';
-import '../../../helperComponents/Loader/Loader.js';
-import 'react-dropzone';
-import '../../SVGIcons/IconUpload.js';
-import '../../../type/file-upload.js';
-import '../../FileUpload/types.js';
-import '../../../helpers/format-date.js';
-import '../../../helpers/locale.js';
-import '../../../type/locale.js';
-import '../../../helpers/storage.js';
-import 'react-toastify';
-import '../../../hooks/useGetIsMobile.js';
-import '../../../helperComponents/AnimatePresenceWrapper/AnimatePresenceWrapper.js';
-import '../../../hooks/useOnOutsideClick.js';
-import '../../../hooks/useHideBodyScroll.js';
-import '../../SVGIcons/IconDismiss.js';
-import '../../Tooltip/types.js';
-import '../../Tooltip/Tooltip.js';
-import '../../../hooks/useGetTooltipStyles.js';
-import '../../../hooks/useGetElemSizes.js';
-import '../../../hooks/useGetElemPositions.js';
-import '../../../hooks/useGetTooltipPosition.js';
-import '../../../hooks/useHideOnScroll.js';
-import '../../Link/Link.js';
-import '../../Popover/PopoverDesktop.js';
-import '../../SVGIcons/IconInfo.js';
-import '../../../helperComponents/IconDynamicComponent/IconDynamicComponent.js';
-import '../../../helperComponents/IconDynamicComponent/constants.js';
-import '@babel/runtime/helpers/typeof';
-import '../../SVGIcons/IconDismissFilled.js';
-import '../../SVGIcons/IconDelete.js';
-import '../../FileUpload/DropzoneFileUpload/FilePreview.js';
-import '../../Progress/Progress.js';
-import '../../SVGIcons/IconArrowDownloadFilled.js';
-import '../../../helpers/download-file.js';
-import '../../Button/consts.js';
-
-var MobileWrapper = function MobileWrapper(props) {
-  var applySelectedItems = props.applySelectedItems,
-    isOpen = props.isOpen,
-    closeDrodown = props.closeDrodown,
-    children = props.children,
-    _props$modalApplyButt = props.modalApplyButtonText,
-    modalApplyButtonText = _props$modalApplyButt === void 0 ? 'Apply' : _props$modalApplyButt;
-  var submitSelection = function submitSelection() {
-    applySelectedItems(false);
-  };
-  return /*#__PURE__*/React.createElement(Modal, {
-    isOpen: isOpen,
-    onClose: closeDrodown,
-    onSubmit: submitSelection,
-    isMobileFullScreen: true,
-    className: 'select__modal',
-    buttonProps: {
-      confirm: {
-        buttonText: modalApplyButtonText
-      }
-    }
-  }, children);
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Modal } from '../../Modal';
+export const MobileWrapper = (props) => {
+    const { applySelectedItems, isOpen, closeDrodown, children, modalApplyButtonText = 'Apply' } = props;
+    const submitSelection = () => {
+        applySelectedItems(false);
+    };
+    return (_jsx(Modal, { isOpen: isOpen, onClose: closeDrodown, onSubmit: submitSelection, isMobileFullScreen: true, className: 'select__modal', buttonProps: {
+            confirm: {
+                buttonText: modalApplyButtonText
+            }
+        }, children: children }));
 };
-
-export { MobileWrapper };