hrm_ui_lib 2.0.3 → 2.1.1

package/components/Select/SharedComponents/ButtonSelectWrapper/ButtonSelectWrapper.js

@@ -1,132 +1,29 @@
-import React, { useRef, useMemo } from 'react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useRef } from 'react';
 import classNames from 'classnames';
-import { Button } from './Button/Button.js';
-import '../../../../consts/index.js';
-import { noop } from '../../../../utils/helpers.js';
-import '../../../../hooks/useScreenSize.js';
-import '@babel/runtime/helpers/slicedToArray';
-import { useGetHasBottomSpace } from '../../../../hooks/useGetHasBottomSpace.js';
-import 'react-hook-form';
-import { useChangePositionsOnScroll } from '../../../../hooks/useChangePositionsOnScroll.js';
-import { MobileWrapper } from '../../MultiSelect/MobileWrapper.js';
-import { DesktopWrapper } from '../../MultiSelect/DesktopWrapper.js';
-import '../../../Text/Text.js';
-import 'dayjs';
-import '../../../SVGIcons/IconChevronUp.js';
-import '@babel/runtime/helpers/defineProperty';
-import '../../../SVGIcons/IconChevronDown.js';
-import '../../../../type/file-upload.js';
-import '../../../../hooks/useGetElemPositions.js';
-import '../../../../hooks/useGetElemSizes.js';
-import '../../../../Alert-V_kH4Snn.js';
-import '@babel/runtime/helpers/extends';
-import '../../../Alert/consts.js';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '../../../../helperComponents/Loader/Loader.js';
-import '@babel/runtime/helpers/toConsumableArray';
-import 'react-dropzone';
-import '../../../SVGIcons/IconUpload.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 'framer-motion';
-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/useGetTooltipPosition.js';
-import '../../../../hooks/useHideOnScroll.js';
-import 'react-syntax-highlighter';
-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 ButtonSelectWrapper = function ButtonSelectWrapper(props) {
-  var offsets = props.offsets,
-    children = props.children,
-    size = props.size,
-    className = props.className,
-    dropdownWidth = props.dropdownWidth,
-    _props$align = props.align,
-    align = _props$align === void 0 ? 'left' : _props$align,
-    isOpen = props.isOpen,
-    setIsOpen = props.setIsOpen,
-    containerRef = props.containerRef,
-    setContainerRef = props.setContainerRef,
-    dropdownRef = props.dropdownRef,
-    setDropdownRef = props.setDropdownRef,
-    selectedValues = props.selectedValues,
-    placeHolder = props.placeHolder,
-    dataId = props.dataId,
-    disabled = props.disabled,
-    modalApplyButtonText = props.modalApplyButtonText,
-    _props$type = props.type,
-    type = _props$type === void 0 ? 'secondary' : _props$type,
-    applySelectedItems = props.applySelectedItems,
-    isMobile = props.isMobile;
-  var buttonRef = useRef(null);
-  var openDropdown = function openDropdown() {
-    return setIsOpen(true);
-  };
-  var _useGetHasBottomSpace = useGetHasBottomSpace({
-      element: dropdownRef,
-      input: buttonRef.current
-    }),
-    hasBottomSpace = _useGetHasBottomSpace.hasBottomSpace;
-  var selectedItemsLabels = useMemo(function () {
-    if (!selectedValues) return '';
-    if ((selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.length) === 0) return '';
-    if ((selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.length) === 1) return "".concat(selectedValues[0].label);
-    return " ".concat(selectedValues[0].label, " +").concat(selectedValues.length - 1);
-  }, [selectedValues]);
-  useChangePositionsOnScroll(buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current, dropdownRef, hasBottomSpace);
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames("select select--".concat(size), className),
-    ref: setContainerRef
-  }, /*#__PURE__*/React.createElement(Button, {
-    size: size,
-    type: type,
-    dataId: dataId,
-    isOpen: isOpen,
-    buttonText: placeHolder || '',
-    selectedItemsLabels: selectedItemsLabels,
-    onClick: disabled ? noop : openDropdown,
-    refHandler: buttonRef,
-    className: "select_button"
-  }), /*#__PURE__*/React.createElement(React.Fragment, null, isMobile ? /*#__PURE__*/React.createElement(MobileWrapper, {
-    applySelectedItems: applySelectedItems,
-    isOpen: isOpen,
-    closeDrodown: function closeDrodown() {
-      return setIsOpen(false);
-    },
-    modalApplyButtonText: modalApplyButtonText
-  }, children) : /*#__PURE__*/React.createElement(DesktopWrapper, {
-    offsets: offsets,
-    setDropdownRef: setDropdownRef,
-    isOpen: isOpen,
-    align: align,
-    dropdownWidth: dropdownWidth,
-    inputRef: buttonRef.current,
-    dropdownRef: dropdownRef,
-    containerRef: containerRef
-  }, children)));
+import { Button } from './Button/Button';
+import { useGetHasBottomSpace } from '../../../../hooks';
+import { noop } from '../../../../utils/helpers';
+import { useChangePositionsOnScroll } from '../../../../hooks/useChangePositionsOnScroll';
+import { MobileWrapper } from '../../MultiSelect/MobileWrapper';
+import { DesktopWrapper } from '../../MultiSelect/DesktopWrapper';
+export const ButtonSelectWrapper = (props) => {
+    const { offsets, children, size, className, dropdownWidth, align = 'left', isOpen, setIsOpen, containerRef, setContainerRef, dropdownRef, setDropdownRef, selectedValues, placeHolder, dataId, disabled, modalApplyButtonText, type = 'secondary', applySelectedItems, isMobile } = props;
+    const buttonRef = useRef(null);
+    const openDropdown = () => setIsOpen(true);
+    const { hasBottomSpace } = useGetHasBottomSpace({
+        element: dropdownRef,
+        input: buttonRef.current
+    });
+    const selectedItemsLabels = useMemo(() => {
+        if (!selectedValues)
+            return '';
+        if ((selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.length) === 0)
+            return '';
+        if ((selectedValues === null || selectedValues === void 0 ? void 0 : selectedValues.length) === 1)
+            return `${selectedValues[0].label}`;
+        return ` ${selectedValues[0].label} +${selectedValues.length - 1}`;
+    }, [selectedValues]);
+    useChangePositionsOnScroll(buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current, dropdownRef, hasBottomSpace);
+    return (_jsxs("div", { className: classNames(`select select--${size}`, className), ref: setContainerRef, children: [_jsx(Button, { size: size, type: type, dataId: dataId, isOpen: isOpen, buttonText: placeHolder || '', selectedItemsLabels: selectedItemsLabels, onClick: disabled ? noop : openDropdown, refHandler: buttonRef, className: "select_button" }), _jsx(_Fragment, { children: isMobile ? (_jsx(MobileWrapper, { applySelectedItems: applySelectedItems, isOpen: isOpen, closeDrodown: () => setIsOpen(false), modalApplyButtonText: modalApplyButtonText, children: children })) : (_jsx(DesktopWrapper, { offsets: offsets, setDropdownRef: setDropdownRef, isOpen: isOpen, align: align, dropdownWidth: dropdownWidth, inputRef: buttonRef.current, dropdownRef: dropdownRef, containerRef: containerRef, children: children })) })] }));
 };
-
-export { ButtonSelectWrapper };

package/components/Select/SharedComponents/ContentTop.js

@@ -1,179 +1,72 @@
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import React, { useRef, useMemo, useEffect } from 'react';
-import { Text } from '../../Text/Text.js';
-import { Input } from '../../Input/Input.js';
-import { Actions } from './Actions.js';
-import { IconDismissFilled } from '../../SVGIcons/IconDismissFilled.js';
-import { IconSearchFilled } from '../../SVGIcons/IconSearchFilled.js';
-import { IconSelectAllOff } from '../../SVGIcons/IconSelectAllOff.js';
-import { useIsMobile } from '../../../hooks/useGetIsMobile.js';
-import '@babel/runtime/helpers/defineProperty';
-import 'classnames';
-import { IconChevronLeft } from '../../SVGIcons/IconChevronLeft.js';
-import '../../../utils/helpers.js';
-import 'dayjs';
-import '@babel/runtime/helpers/extends';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import 'react-input-mask';
-import 'react-number-format';
-import '../../../helperComponents/Label/Label.js';
-import '../../../helperComponents/ErrorMessage/ErrorMessage.js';
-import '../../../helperComponents/IconDynamicComponent/IconDynamicComponent.js';
-import '../../../helperComponents/IconDynamicComponent/constants.js';
-import '@babel/runtime/helpers/slicedToArray';
-import '../../../consts/index.js';
-import '../../../type/file-upload.js';
-import '../../../hooks/useScreenSize.js';
-import 'react-hook-form';
-import '../../../Alert-V_kH4Snn.js';
-import '../../Alert/consts.js';
-import '../../../helperComponents/Loader/Loader.js';
-import 'react-dropzone';
-import '../../SVGIcons/IconUpload.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 'framer-motion';
-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 'react-syntax-highlighter';
-import '../../Link/Link.js';
-import '../../Popover/PopoverDesktop.js';
-import '../../SVGIcons/IconInfo.js';
-import '@babel/runtime/helpers/typeof';
-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';
-import '../../SVGIcons/IconCheckmarkCircleFilled.js';
-import '../../Menu/Menu.js';
-import 'react-dom';
-import '../../../helperComponents/OptionItem/OptionItem.js';
-import '../../Avatar/Avatar.js';
-import '../../FileUpload/FileUpload.js';
-import '../../FileUpload/UploadItems.js';
-import '../../../hooks/useFormProps.js';
-import '../../../context/types.js';
-import '../../SVGIcons/IconEditFilled.js';
-import '../../SVGIcons/IconEdit.js';
-import '../../SVGIcons/IconAttach.js';
-import '../../SVGIcons/IconCheckmark.js';
-import '../../Collapse/CollapseGroup/CollapseGroup.js';
-import '../../Collapse/CollapseItem/CollapseItem.js';
-import '../../SVGIcons/IconChevronRight.js';
-import '../../Divider/Divider.js';
-import '../../SVGIcons/IconChevronDown.js';
-import '../../SVGIcons/IconMore.js';
-
-var ContentTop = /*#__PURE__*/React.memo(function (props) {
-  var clearAll = props.clearAll,
-    selectAll = props.selectAll,
-    helperText = props.helperText,
-    searchValue = props.searchValue,
-    translations = props.translations,
-    isAnySelected = props.isAnySelected,
-    setSearchValue = props.setSearchValue,
-    _props$isSearchAvaila = props.isSearchAvailable,
-    isSearchAvailable = _props$isSearchAvaila === void 0 ? false : _props$isSearchAvaila,
-    _props$hasLimitation = props.hasLimitation,
-    hasLimitation = _props$hasLimitation === void 0 ? false : _props$hasLimitation,
-    _props$isSelectAllDis = props.isSelectAllDisabled,
-    isSelectAllDisabled = _props$isSelectAllDis === void 0 ? false : _props$isSelectAllDis,
-    _props$menuOptions = props.menuOptions,
-    menuOptions = _props$menuOptions === void 0 ? [] : _props$menuOptions,
-    dataIdPrefix = props.dataIdPrefix,
-    closeDropdown = props.closeDropdown;
-  var inputRef = useRef(null);
-  var _ref = translations || {},
-    searchInputPlaceHolder = _ref.searchInputPlaceHolder,
-    innerLabel = _ref.innerLabel,
-    clearAllLabel = _ref.clearAllLabel,
-    selectAllLabel = _ref.selectAllLabel;
-  var selectActions = useMemo(function () {
-    var options = menuOptions;
-    if (selectAll && selectAllLabel && !hasLimitation) {
-      options = [{
-        label: selectAllLabel,
-        value: 1,
-        handler: selectAll,
-        disabled: isSelectAllDisabled,
-        iconProps: {
-          Component: IconSelectAllOff
-        },
-        dataId: dataIdPrefix ? "".concat(dataIdPrefix, "-select-all") : ''
-      }];
-    }
-    if (clearAll && clearAllLabel) {
-      options = [].concat(_toConsumableArray(options), [{
-        label: clearAllLabel,
-        value: 2,
-        handler: clearAll,
-        disabled: !isAnySelected,
-        iconProps: {
-          Component: IconDismissFilled
-        },
-        dataId: dataIdPrefix ? "".concat(dataIdPrefix, "-clear-all") : ''
-      }]);
-    }
-    return options;
-  }, [menuOptions, selectAllLabel, selectAll, clearAll, clearAllLabel, isSelectAllDisabled, isAnySelected, dataIdPrefix]);
-  var onSearch = function onSearch(e) {
-    setSearchValue && setSearchValue(e.target.value);
-  };
-  var isMobile = useIsMobile();
-  var removeFilter = function removeFilter() {
-    return setSearchValue && setSearchValue('');
-  };
-  useEffect(function () {
-    if (inputRef && inputRef.current && !isMobile) {
-      inputRef.current.focus();
-    }
-  }, [inputRef, isMobile]);
-  var onBack = function onBack() {
-    closeDropdown && closeDropdown();
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "content-top"
-  }, helperText && !isMobile ? /*#__PURE__*/React.createElement(Text, {
-    size: "xsmall",
-    type: "secondary",
-    className: "content-top__label"
-  }, helperText) : null, /*#__PURE__*/React.createElement("div", {
-    className: "flexbox search-container"
-  }, isMobile && /*#__PURE__*/React.createElement(IconChevronLeft, {
-    onClick: onBack,
-    size: "large"
-  }), isSearchAvailable && /*#__PURE__*/React.createElement(Input, {
-    ref: inputRef,
-    className: "content-top__search",
-    size: "small",
-    placeholder: searchInputPlaceHolder,
-    handleChange: onSearch,
-    currentValue: searchValue,
-    rightIconProps: {
-      Component: searchValue ? IconDismissFilled : IconSearchFilled,
-      size: searchValue ? 'xsmall' : 'small',
-      onClick: removeFilter
-    }
-  })), /*#__PURE__*/React.createElement(Actions, {
-    selectActions: selectActions,
-    innerLabel: innerLabel
-  }));
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useEffect, useMemo, useRef } from 'react';
+import { Text } from '../../Text';
+import { Input } from '../../Input';
+import { Actions } from './Actions';
+import IconDismissFilled from '../../SVGIcons/IconDismissFilled';
+import IconSearchFilled from '../../SVGIcons/IconSearchFilled';
+import IconSelectAllOff from '../../SVGIcons/IconSelectAllOff';
+import { useIsMobile } from '../../../hooks/useGetIsMobile';
+import { IconChevronLeft } from '../../SVGIcons';
+export const ContentTop = React.memo((props) => {
+    const { clearAll, selectAll, helperText, searchValue, translations, isAnySelected, setSearchValue, isSearchAvailable = false, hasLimitation = false, isSelectAllDisabled = false, menuOptions = [], dataIdPrefix, closeDropdown } = props;
+    const inputRef = useRef(null);
+    const { searchInputPlaceHolder, innerLabel, clearAllLabel, selectAllLabel } = translations || {};
+    const selectActions = useMemo(() => {
+        let options = menuOptions;
+        if (selectAll && selectAllLabel && !hasLimitation) {
+            options = [
+                {
+                    label: selectAllLabel,
+                    value: 1,
+                    handler: selectAll,
+                    disabled: isSelectAllDisabled,
+                    iconProps: { Component: IconSelectAllOff },
+                    dataId: dataIdPrefix ? `${dataIdPrefix}-select-all` : ''
+                }
+            ];
+        }
+        if (clearAll && clearAllLabel) {
+            options = [
+                ...options,
+                {
+                    label: clearAllLabel,
+                    value: 2,
+                    handler: clearAll,
+                    disabled: !isAnySelected,
+                    iconProps: { Component: IconDismissFilled },
+                    dataId: dataIdPrefix ? `${dataIdPrefix}-clear-all` : ''
+                }
+            ];
+        }
+        return options;
+    }, [
+        menuOptions,
+        selectAllLabel,
+        selectAll,
+        clearAll,
+        clearAllLabel,
+        isSelectAllDisabled,
+        isAnySelected,
+        dataIdPrefix
+    ]);
+    const onSearch = (e) => {
+        setSearchValue && setSearchValue(e.target.value);
+    };
+    const isMobile = useIsMobile();
+    const removeFilter = () => setSearchValue && setSearchValue('');
+    useEffect(() => {
+        if (inputRef && inputRef.current && !isMobile) {
+            inputRef.current.focus();
+        }
+    }, [inputRef, isMobile]);
+    const onBack = () => {
+        closeDropdown && closeDropdown();
+    };
+    return (_jsxs("div", { className: "content-top", children: [helperText && !isMobile ? (_jsx(Text, { size: "xsmall", type: "secondary", className: "content-top__label", children: helperText })) : null, _jsxs("div", { className: "flexbox search-container", children: [isMobile && _jsx(IconChevronLeft, { onClick: onBack, size: "large" }), isSearchAvailable && (_jsx(Input, { ref: inputRef, className: "content-top__search", size: "small", placeholder: searchInputPlaceHolder, handleChange: onSearch, currentValue: searchValue, rightIconProps: {
+                            Component: searchValue ? IconDismissFilled : IconSearchFilled,
+                            size: searchValue ? 'xsmall' : 'small',
+                            onClick: removeFilter
+                        } }))] }), _jsx(Actions, { selectActions: selectActions, innerLabel: innerLabel })] }));
 });
 ContentTop.displayName = 'ContentTop';
-
-export { ContentTop };

package/components/Select/SharedComponents/Footer.js

@@ -1,99 +1,12 @@
-import _extends from '@babel/runtime/helpers/extends';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
-import { C as Checkbox, B as Button } from '../../../Alert-V_kH4Snn.js';
-import { SELECT_TRANSLATIONS } from '../localization.js';
-import '../../Alert/consts.js';
-import 'classnames';
-import '../../Text/Text.js';
-import '../../../utils/helpers.js';
-import 'dayjs';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import '../../../helperComponents/Loader/Loader.js';
-import '@babel/runtime/helpers/toConsumableArray';
-import '../../../consts/index.js';
-import '../../../type/file-upload.js';
-import '../../../hooks/useScreenSize.js';
-import 'react-hook-form';
-import 'react-dropzone';
-import '../../SVGIcons/IconUpload.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 'framer-motion';
-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 'react-syntax-highlighter';
-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';
-
-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 Footer = function Footer(props) {
-  var language = props.language,
-    buttonProps = props.buttonProps,
-    onApply = props.onApply,
-    onCancel = props.onCancel,
-    _props$hasChange = props.hasChange,
-    hasChange = _props$hasChange === void 0 ? true : _props$hasChange,
-    checkboxInfo = props.checkboxInfo;
-  var _React$useState = React.useState((checkboxInfo === null || checkboxInfo === void 0 ? void 0 : checkboxInfo.isChecked) || false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isSelected = _React$useState2[0],
-    setIsSelected = _React$useState2[1];
-  var confirmButtonProps = _objectSpread({
-    buttonText: SELECT_TRANSLATIONS[language].confirmButtonText
-  }, (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.confirm) || {});
-  var cancelButtonProps = _objectSpread({
-    buttonText: SELECT_TRANSLATIONS[language].cancelButtonText
-  }, (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.cancel) || {});
-  return /*#__PURE__*/React.createElement("div", {
-    className: "select__footer"
-  }, /*#__PURE__*/React.createElement("div", null, checkboxInfo ? /*#__PURE__*/React.createElement(Checkbox, {
-    label: checkboxInfo.label,
-    selectedValue: isSelected,
-    onClick: setIsSelected
-  }) : null), /*#__PURE__*/React.createElement("div", {
-    className: 'select__footer__right flexbox'
-  }, /*#__PURE__*/React.createElement(Button, _extends({}, cancelButtonProps, {
-    type: "tertiary",
-    size: "medium",
-    className: "mr-12",
-    onClick: onCancel
-  })), /*#__PURE__*/React.createElement(Button, _extends({
-    disabled: !hasChange && isSelected === !!(checkboxInfo !== null && checkboxInfo !== void 0 && checkboxInfo.isChecked)
-  }, confirmButtonProps, {
-    type: "primary",
-    size: "medium",
-    onClick: function onClick() {
-      return onApply(isSelected);
-    }
-  }))));
+import { Button } from '../../Button';
+import { Checkbox } from '../../Checkbox';
+import { SELECT_TRANSLATIONS } from '../localization';
+export const Footer = (props) => {
+    const { language, buttonProps, onApply, onCancel, hasChange = true, checkboxInfo } = props;
+    const [isSelected, setIsSelected] = React.useState((checkboxInfo === null || checkboxInfo === void 0 ? void 0 : checkboxInfo.isChecked) || false);
+    const confirmButtonProps = Object.assign({ buttonText: SELECT_TRANSLATIONS[language].confirmButtonText }, ((buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.confirm) || {}));
+    const cancelButtonProps = Object.assign({ buttonText: SELECT_TRANSLATIONS[language].cancelButtonText }, ((buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.cancel) || {}));
+    return (_jsxs("div", { className: "select__footer", children: [_jsx("div", { children: checkboxInfo ? (_jsx(Checkbox, { label: checkboxInfo.label, selectedValue: isSelected, onClick: setIsSelected })) : null }), _jsxs("div", { className: 'select__footer__right flexbox', children: [_jsx(Button, Object.assign({}, cancelButtonProps, { type: "tertiary", size: "medium", className: "mr-12", onClick: onCancel })), _jsx(Button, Object.assign({ disabled: !hasChange && isSelected === !!(checkboxInfo === null || checkboxInfo === void 0 ? void 0 : checkboxInfo.isChecked) }, confirmButtonProps, { type: "primary", size: "medium", onClick: () => onApply(isSelected) }))] })] }));
 };
-
-export { Footer };