intelicoreact 1.3.39 → 1.3.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Atomic/FormElements/ActionAlert/ActionAlert.js +9 -1
- package/dist/Atomic/FormElements/AdvancedStatus/AdvancedStatus.js +10 -1
- package/dist/Atomic/FormElements/Calendar/Calendar.js +24 -4
- package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.js +10 -1
- package/dist/Atomic/FormElements/CheckboxesLine/CheckboxesLine.js +14 -2
- package/dist/Atomic/FormElements/Datepicker/Datepicker.js +54 -5
- package/dist/Atomic/FormElements/Datepicker/components/Calendar.js +21 -3
- package/dist/Atomic/FormElements/Dropdown/Dropdown.js +144 -51
- package/dist/Atomic/FormElements/Dropdown/components/DropdownLoader.js +7 -1
- package/dist/Atomic/FormElements/DropdownLiveSearch/DropdownLiveSearch.js +47 -9
- package/dist/Atomic/FormElements/FileLoader/FileLoader.js +15 -3
- package/dist/Atomic/FormElements/FileLoader/partial/LoadZone.js +29 -15
- package/dist/Atomic/FormElements/FileLoader/partial/LoadedContent.js +15 -5
- package/dist/Atomic/FormElements/FileLoaderLocal/FileLoaderLocal.js +26 -6
- package/dist/Atomic/FormElements/FileLoaderLocalGroup/FileLoaderLocalGroup.js +35 -19
- package/dist/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN.js +38 -9
- package/dist/Atomic/FormElements/Input/Input.js +57 -24
- package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js +31 -4
- package/dist/Atomic/FormElements/InputColor/InputColor.js +14 -4
- package/dist/Atomic/FormElements/InputCurrency/InputCurrency.js +27 -6
- package/dist/Atomic/FormElements/InputDateRange/InputDateRange.js +42 -7
- package/dist/Atomic/FormElements/InputDateRange/components/DateInput.js +21 -3
- package/dist/Atomic/FormElements/InputDateRange/components/Datepicker.js +81 -58
- package/dist/Atomic/FormElements/InputDateRange/components/OpenedPart.js +41 -6
- package/dist/Atomic/FormElements/InputDateRange/components/SelectItem.js +8 -1
- package/dist/Atomic/FormElements/InputDateRange/dependencies.js +44 -14
- package/dist/Atomic/FormElements/InputLink/InputLink.js +23 -6
- package/dist/Atomic/FormElements/InputMask/InputCarretPosition.js +4 -0
- package/dist/Atomic/FormElements/InputMask/InputMask.js +208 -77
- package/dist/Atomic/FormElements/InputMask/functions.js +28 -2
- package/dist/Atomic/FormElements/InputMask2/InputMask2.js +119 -43
- package/dist/Atomic/FormElements/InputMask2/functions.js +28 -2
- package/dist/Atomic/FormElements/InputMask3/InputMask3.js +137 -44
- package/dist/Atomic/FormElements/InputMask3/functions.js +28 -2
- package/dist/Atomic/FormElements/InputWithAction/InputWithAction.js +17 -3
- package/dist/Atomic/FormElements/InputsRow/InputsRow.js +24 -5
- package/dist/Atomic/FormElements/Label/Label.js +9 -1
- package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.js +73 -35
- package/dist/Atomic/FormElements/MultiSelect/MultiSelect.js +15 -3
- package/dist/Atomic/FormElements/NumericInput/NumericInput.js +44 -23
- package/dist/Atomic/FormElements/RadioGroup/RadioGroup.js +17 -7
- package/dist/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.js +14 -3
- package/dist/Atomic/FormElements/RadioInput/RadioInput.js +10 -1
- package/dist/Atomic/FormElements/RadioRowSwitcher/RadioRowSwitcher.js +14 -3
- package/dist/Atomic/FormElements/RangeCalendar/RangeCalendar.js +23 -3
- package/dist/Atomic/FormElements/RangeInputs/RangeInputs.js +34 -17
- package/dist/Atomic/FormElements/RangeList/RangeList.js +25 -6
- package/dist/Atomic/FormElements/RangeList/partial/RangeListRow.js +11 -1
- package/dist/Atomic/FormElements/RangeSlider/RangeSlider.js +72 -14
- package/dist/Atomic/FormElements/RangeSlider2/RangeSlider2.js +124 -40
- package/dist/Atomic/FormElements/SwitchableRow/SwitchableRow.js +10 -1
- package/dist/Atomic/FormElements/Switcher/Switcher.js +10 -1
- package/dist/Atomic/FormElements/SwitcherCheckbox/SwitcherCheckbox.js +13 -1
- package/dist/Atomic/FormElements/SwitcherHide/SwitcherHide.js +10 -1
- package/dist/Atomic/FormElements/SwitcherRadio/SwitcherRadio.js +17 -2
- package/dist/Atomic/FormElements/SwitcherRange/SwitcherRange.js +17 -3
- package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.js +11 -1
- package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js +29 -6
- package/dist/Atomic/FormElements/SwitcherTagsDropdown/partial/States.js +3 -2
- package/dist/Atomic/FormElements/SwitcherTextarea/SwitcherTextarea.js +12 -1
- package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.js +146 -54
- package/dist/Atomic/FormElements/Text/Text.js +16 -10
- package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.js +9 -1
- package/dist/Atomic/FormElements/Textarea/Textarea.js +12 -1
- package/dist/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.js +35 -6
- package/dist/Atomic/FormElements/TieredCheckboxes/partial/AccordionWithCheckbox.js +13 -4
- package/dist/Atomic/FormElements/TimeRange/TimeRange.js +21 -7
- package/dist/Atomic/FormElements/UserContacts/UserContacts.js +35 -8
- package/dist/Atomic/FormElements/UserContacts/partial/defaultIcons.js +91 -0
- package/dist/Atomic/FormElements/VariantsListRadio/VariantsListRadio.js +18 -5
- package/dist/Atomic/FormElements/VariantsListRadio/partials/VariantsListRadioItem.js +10 -3
- package/dist/Atomic/FormElements/WidgetPseudoTable/WidgetPseudoTable.js +11 -3
- package/dist/Atomic/FormElements/WidgetPseudoTable/partial/constructor.js +2 -1
- package/dist/Atomic/FormElements/WidgetWithSwitchableRows/WidgetWithSwitchableRows.js +12 -5
- package/dist/Atomic/FormElements/WidgetWithSwitchableRows/partial/constructor.js +3 -3
- package/dist/Atomic/Layout/Header/Header.js +15 -3
- package/dist/Atomic/Layout/MainMenu/MainMenu.js +20 -3
- package/dist/Atomic/Layout/Spinner/Spinner.js +8 -1
- package/dist/Atomic/UI/Accordion/Accordion.js +19 -3
- package/dist/Atomic/UI/Accordion/AccordionItem.js +23 -9
- package/dist/Atomic/UI/AccordionTable/AccordionTable.js +32 -7
- package/dist/Atomic/UI/AccordionText/AccordionText.js +15 -3
- package/dist/Atomic/UI/AdvancedTag/AdvTag.js +21 -4
- package/dist/Atomic/UI/AdvancedTag/AdvancedTags.js +15 -3
- package/dist/Atomic/UI/Alert/Alert.js +16 -3
- package/dist/Atomic/UI/Arrow/Arrow.js +16 -3
- package/dist/Atomic/UI/Box/Box.js +9 -3
- package/dist/Atomic/UI/Button/Button.js +11 -2
- package/dist/Atomic/UI/ButtonsBar/ButtonsBar.js +10 -1
- package/dist/Atomic/UI/Chart/Chart.js +29 -4
- package/dist/Atomic/UI/Chart/partial/Chart.constants.js +19 -11
- package/dist/Atomic/UI/Chart/partial/ChartTypeSwitcherIcon/ChartTypeSwitcherIcon.js +12 -1
- package/dist/Atomic/UI/Chart/partial/datasetSetters.js +34 -11
- package/dist/Atomic/UI/Chart/partial/optionsConstructor.js +56 -82
- package/dist/Atomic/UI/Chart/partial/optionsSetters.js +19 -15
- package/dist/Atomic/UI/Chart/partial/utils.js +20 -6
- package/dist/Atomic/UI/CircleProgressBar/CircleProgressBar.js +13 -3
- package/dist/Atomic/UI/DateTime/DateTime.js +14 -3
- package/dist/Atomic/UI/DebugContainer/DebugContainer.js +16 -4
- package/dist/Atomic/UI/DebugContainer/useDebugContainer.js +11 -3
- package/dist/Atomic/UI/DoubleString/DoubleString.js +17 -5
- package/dist/Atomic/UI/DynamicIcon/DynamicIcon.js +10 -3
- package/dist/Atomic/UI/ExampleChartIntegration/ExampleChartIntegration.js +52 -17
- package/dist/Atomic/UI/ExampleChartIntegration/partial/utils.js +29 -1
- package/dist/Atomic/UI/Hint/Hint.js +30 -5
- package/dist/Atomic/UI/Modal/Modal.js +29 -6
- package/dist/Atomic/UI/Modal/ModalHOC.js +10 -1
- package/dist/Atomic/UI/Modal/partials/ModalFooter.js +7 -1
- package/dist/Atomic/UI/Modal/partials/ModalTitle.js +8 -1
- package/dist/Atomic/UI/Modal/partials/useMobileModal.js +49 -32
- package/dist/Atomic/UI/ModalBackup/Modal.js +90 -65
- package/dist/Atomic/UI/ModalBackup/ModalHOC.js +21 -12
- package/dist/Atomic/UI/ModalBackup/partials/ModalFooter.js +11 -6
- package/dist/Atomic/UI/ModalBackup/partials/ModalTitle.js +19 -15
- package/dist/Atomic/UI/MonoAccordion/MonoAccordion.js +21 -6
- package/dist/Atomic/UI/NavLine/NavLine.js +55 -26
- package/dist/Atomic/UI/NavLine/Tabs.js +3 -2
- package/dist/Atomic/UI/PageTitle/PageTitle.js +10 -2
- package/dist/Atomic/UI/PieChart/PieChart.js +10 -1
- package/dist/Atomic/UI/Price/Price.js +8 -3
- package/dist/Atomic/UI/PriceRange/PriceRange.js +7 -1
- package/dist/Atomic/UI/ProgressLine/ProgressLine.js +16 -1
- package/dist/Atomic/UI/Status/Status.js +8 -1
- package/dist/Atomic/UI/Table/Partials/TdCell.js +29 -5
- package/dist/Atomic/UI/Table/Partials/TdHeader.js +11 -1
- package/dist/Atomic/UI/Table/Partials/TdRow.js +17 -5
- package/dist/Atomic/UI/Table/Partials/TdTitle.js +14 -3
- package/dist/Atomic/UI/Table/Table.js +12 -1
- package/dist/Atomic/UI/Table/TdTypes/TdActions.js +18 -2
- package/dist/Atomic/UI/Table/TdTypes/TdPriority.js +9 -1
- package/dist/Atomic/UI/Table/TdTypes/TdRange.js +4 -1
- package/dist/Atomic/UI/Table/TdTypes/TdWeight.js +13 -1
- package/dist/Atomic/UI/Tag/Tag.js +14 -3
- package/dist/Atomic/UI/TagList/TagList.js +35 -19
- package/dist/Atomic/UI/UserBox/UserBox.js +13 -1
- package/dist/Classes/AbortableFetch.js +93 -36
- package/dist/Classes/AnimatedHandler.js +7 -3
- package/dist/Classes/RESTAPI/index.js +43 -39
- package/dist/Classes/RESTAPI/partials/AbortableFetch.js +93 -35
- package/dist/Classes/RESTAPI/partials/ApiBase.js +9 -1
- package/dist/Classes/RESTAPI/partials/ApiRequestCreators.js +19 -7
- package/dist/Classes/RESTAPI/partials/ApiUtils.js +35 -28
- package/dist/Classes/RESTAPI/partials/CredentialsProcessing.js +44 -21
- package/dist/Classes/RESTAPI/partials/Utils.js +19 -6
- package/dist/Classes/RESTAPI/partials/_outerDependencies.js +6 -2
- package/dist/Classes/RESTAPI/partials/_utils.js +36 -13
- package/dist/Constants/index.constants.js +15 -8
- package/dist/Functions/Portal.js +16 -5
- package/dist/Functions/customEventListener.js +17 -4
- package/dist/Functions/fieldValueFormatters.js +83 -43
- package/dist/Functions/hooks/useFormFieldsChangesManager.js +26 -23
- package/dist/Functions/locale/createTranslator.js +9 -4
- package/dist/Functions/operations.js +22 -12
- package/dist/Functions/presets/inputMaskPresets.js +11 -9
- package/dist/Functions/presets/inputPresets.js +11 -8
- package/dist/Functions/presets/mobileKeyboardTypesPresets.js +9 -7
- package/dist/Functions/schemas.js +13 -6
- package/dist/Functions/useBodyScrollLock.js +6 -1
- package/dist/Functions/useClickOutside.js +4 -0
- package/dist/Functions/useDebounce.js +7 -2
- package/dist/Functions/useFieldFocus.js +18 -6
- package/dist/Functions/useFormTools/form-drivers/ArrayWithObjects.js +9 -0
- package/dist/Functions/useFormTools/form-drivers/ObjectWithIterableObjects.js +23 -12
- package/dist/Functions/useFormTools/form-drivers/ObjectWithNamedKeyObjects.js +15 -6
- package/dist/Functions/useFormTools/functions/General.js +28 -18
- package/dist/Functions/useFormTools/functions/RenderFields.js +11 -2
- package/dist/Functions/useFormTools/functions/usePrevious.js +5 -1
- package/dist/Functions/useFormTools/index.js +144 -85
- package/dist/Functions/useInputHighlightError.js +12 -3
- package/dist/Functions/useIsMobile.js +12 -7
- package/dist/Functions/useKeyPress/useHandleKeyPress.js +7 -1
- package/dist/Functions/useKeyPress/useKeyPress.js +9 -1
- package/dist/Functions/useLocalStorage.js +9 -1
- package/dist/Functions/useLocationParams.js +5 -4
- package/dist/Functions/useMetaInfo.js +10 -3
- package/dist/Functions/useMouseUpOutside.js +3 -0
- package/dist/Functions/useOnlineStatus.js +9 -1
- package/dist/Functions/usePasswordChecker.js +20 -4
- package/dist/Functions/usePrevious.js +5 -1
- package/dist/Functions/useResize.js +10 -2
- package/dist/Functions/useScrollTo.js +7 -2
- package/dist/Functions/useToggle.js +5 -1
- package/dist/Functions/utils.js +127 -49
- package/dist/Molecular/CustomIcons/components/AffiliateNetworks.js +9 -2
- package/dist/Molecular/CustomIcons/components/AlertCircle.js +9 -2
- package/dist/Molecular/CustomIcons/components/AppStore.js +9 -2
- package/dist/Molecular/CustomIcons/components/Arrow.js +9 -2
- package/dist/Molecular/CustomIcons/components/ArrowDown.js +9 -2
- package/dist/Molecular/CustomIcons/components/ArrowLeft.js +9 -2
- package/dist/Molecular/CustomIcons/components/ArrowRight.js +9 -2
- package/dist/Molecular/CustomIcons/components/ArrowUp.js +9 -2
- package/dist/Molecular/CustomIcons/components/Bell.js +9 -2
- package/dist/Molecular/CustomIcons/components/Button.js +9 -2
- package/dist/Molecular/CustomIcons/components/Campaigns.js +9 -2
- package/dist/Molecular/CustomIcons/components/Check.js +9 -2
- package/dist/Molecular/CustomIcons/components/Check2.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronDown.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronDownDisabled.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronLeft.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronRight.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronUp.js +9 -2
- package/dist/Molecular/CustomIcons/components/ChevronUpDown.js +9 -2
- package/dist/Molecular/CustomIcons/components/Close.js +9 -2
- package/dist/Molecular/CustomIcons/components/ColumnsOrder.js +9 -2
- package/dist/Molecular/CustomIcons/components/Delete.js +9 -2
- package/dist/Molecular/CustomIcons/components/Edit.js +9 -2
- package/dist/Molecular/CustomIcons/components/Email.js +9 -2
- package/dist/Molecular/CustomIcons/components/FinturfLogo.js +9 -2
- package/dist/Molecular/CustomIcons/components/FinturfLogo2.js +9 -2
- package/dist/Molecular/CustomIcons/components/Flows.js +9 -2
- package/dist/Molecular/CustomIcons/components/Gift.js +9 -2
- package/dist/Molecular/CustomIcons/components/GoogleAuth.js +9 -2
- package/dist/Molecular/CustomIcons/components/GooglePlay.js +9 -2
- package/dist/Molecular/CustomIcons/components/HelpCircle.js +9 -2
- package/dist/Molecular/CustomIcons/components/HelpCircle2.js +9 -2
- package/dist/Molecular/CustomIcons/components/HelpCircleFilled.js +9 -2
- package/dist/Molecular/CustomIcons/components/Home.js +9 -2
- package/dist/Molecular/CustomIcons/components/Home2.js +9 -2
- package/dist/Molecular/CustomIcons/components/Key.js +9 -2
- package/dist/Molecular/CustomIcons/components/Landers.js +9 -2
- package/dist/Molecular/CustomIcons/components/Lock.js +9 -2
- package/dist/Molecular/CustomIcons/components/Mail.js +9 -2
- package/dist/Molecular/CustomIcons/components/Mastercard.js +9 -2
- package/dist/Molecular/CustomIcons/components/Minus.js +9 -2
- package/dist/Molecular/CustomIcons/components/Offers.js +9 -2
- package/dist/Molecular/CustomIcons/components/Pause.js +9 -2
- package/dist/Molecular/CustomIcons/components/PayPal.js +9 -2
- package/dist/Molecular/CustomIcons/components/PayPalLightLarge.js +9 -2
- package/dist/Molecular/CustomIcons/components/Phone.js +9 -2
- package/dist/Molecular/CustomIcons/components/Play.js +9 -2
- package/dist/Molecular/CustomIcons/components/Plus.js +9 -2
- package/dist/Molecular/CustomIcons/components/Profile.js +9 -2
- package/dist/Molecular/CustomIcons/components/QRCode.js +9 -2
- package/dist/Molecular/CustomIcons/components/Rectangle.js +9 -2
- package/dist/Molecular/CustomIcons/components/Revert.js +9 -2
- package/dist/Molecular/CustomIcons/components/Star.js +9 -2
- package/dist/Molecular/CustomIcons/components/Star2.js +9 -2
- package/dist/Molecular/CustomIcons/components/TrafficSources.js +9 -2
- package/dist/Molecular/CustomIcons/components/Trash.js +9 -2
- package/dist/Molecular/CustomIcons/components/TrashRed.js +9 -2
- package/dist/Molecular/CustomIcons/components/Triggers.js +9 -2
- package/dist/Molecular/CustomIcons/components/User.js +9 -2
- package/dist/Molecular/CustomIcons/components/Visa.js +9 -2
- package/dist/Molecular/CustomIcons/components/X.js +9 -2
- package/dist/Molecular/CustomIcons/index.js +122 -0
- package/dist/Molecular/FormElement/FormElement.js +12 -1
- package/dist/Molecular/FormWithDependOn/FormWithDependOn.js +31 -30
- package/dist/Molecular/FormWithDependOn/partials/_utils.js +12 -9
- package/dist/Molecular/InputAddress/InputAddress.js +114 -65
- package/dist/Molecular/InputPassword/InputPassword.js +19 -5
- package/dist/index.js +2 -0
- package/package.json +1 -1
|
@@ -1,29 +1,48 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
|
|
9
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
+
|
|
10
14
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
15
|
+
|
|
11
16
|
var _reactDom = require("react-dom");
|
|
17
|
+
|
|
12
18
|
var _reactFeather = require("react-feather");
|
|
19
|
+
|
|
13
20
|
var _fieldValueFormatters = require("../../../Functions/fieldValueFormatters");
|
|
21
|
+
|
|
14
22
|
var _useDebounce = require("../../../Functions/useDebounce");
|
|
23
|
+
|
|
15
24
|
var _useIsMobile = _interopRequireDefault(require("../../../Functions/useIsMobile"));
|
|
25
|
+
|
|
16
26
|
var _CheckboxInput = _interopRequireDefault(require("../../FormElements/CheckboxInput/CheckboxInput"));
|
|
27
|
+
|
|
17
28
|
var _Input = _interopRequireDefault(require("../../FormElements/Input/Input"));
|
|
29
|
+
|
|
18
30
|
var _Tag = _interopRequireDefault(require("../../UI/Tag/Tag"));
|
|
31
|
+
|
|
19
32
|
var _TagList = _interopRequireDefault(require("../../UI/TagList/TagList"));
|
|
33
|
+
|
|
20
34
|
require("./TagsDropdown.scss");
|
|
21
|
-
|
|
22
|
-
function
|
|
35
|
+
|
|
36
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
37
|
+
|
|
38
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
39
|
+
|
|
23
40
|
const RC = "tags-dropdown";
|
|
24
41
|
const MIN_ITEMS_FOR_SHOW_MOBILE_SEARCH = 10;
|
|
42
|
+
|
|
25
43
|
const TagsDropdown = _ref => {
|
|
26
|
-
var _Object$keys, _dropdownListWrapperR, _dropdownListRef$curr5, _dropdownListRef$curr6;
|
|
44
|
+
var _Object$keys, _dropdownListWrapperR, _dropdownListWrapperR2, _dropdownListRef$curr5, _dropdownListRef$curr6;
|
|
45
|
+
|
|
27
46
|
let {
|
|
28
47
|
options,
|
|
29
48
|
chosenOptions = [],
|
|
@@ -64,7 +83,7 @@ const TagsDropdown = _ref => {
|
|
|
64
83
|
const {
|
|
65
84
|
isMobile: isMobileProp
|
|
66
85
|
} = (0, _useIsMobile.default)();
|
|
67
|
-
const isMobile = isMobileProp && withMobileLogic;
|
|
86
|
+
const isMobile = isMobileProp && withMobileLogic && window.screen.width < 768;
|
|
68
87
|
const [dropdownId, setDropdownId] = (0, _react.useState)(id || fieldKey || Math.random().toString(16).slice(2));
|
|
69
88
|
const [isOpen, setIsOpen] = (0, _react.useState)(false);
|
|
70
89
|
const [searchValue, setSearchValue] = (0, _react.useState)("");
|
|
@@ -88,28 +107,34 @@ const TagsDropdown = _ref => {
|
|
|
88
107
|
const singleLevelOptions = options === null || options === void 0 ? void 0 : options.reduce((acc, item) => {
|
|
89
108
|
const checkUniqAndPush = (acc, item) => {
|
|
90
109
|
const isExist = acc === null || acc === void 0 ? void 0 : acc.findIndex(value => value === (item === null || item === void 0 ? void 0 : item.value));
|
|
110
|
+
|
|
91
111
|
if (isExist !== -1) {
|
|
92
112
|
acc[isExist] = item;
|
|
93
113
|
} else {
|
|
94
114
|
acc.push(item);
|
|
95
115
|
}
|
|
96
116
|
};
|
|
117
|
+
|
|
97
118
|
if (item.groupName) {
|
|
98
119
|
var _item$list;
|
|
99
|
-
|
|
120
|
+
|
|
121
|
+
(_item$list = item.list) === null || _item$list === void 0 ? void 0 : _item$list.map(item => checkUniqAndPush(acc, item));
|
|
100
122
|
} else {
|
|
101
123
|
checkUniqAndPush(acc, item);
|
|
102
124
|
}
|
|
125
|
+
|
|
103
126
|
return acc;
|
|
104
127
|
}, (_Object$keys = Object.keys(localOptionsStore)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.map(value => ({
|
|
105
128
|
value,
|
|
106
129
|
label: localOptionsStore === null || localOptionsStore === void 0 ? void 0 : localOptionsStore[value]
|
|
107
130
|
})));
|
|
131
|
+
|
|
108
132
|
const setSearchValueInterceptor = value => {
|
|
109
133
|
setSearchValue(value);
|
|
110
134
|
setIsValueDeleted(value === "");
|
|
111
135
|
searchValueRef.current = value;
|
|
112
136
|
};
|
|
137
|
+
|
|
113
138
|
const doScrollCallback = (0, _react.useCallback)(e => {
|
|
114
139
|
if (doLiveSearchRequest && typeof doLiveSearchRequest === "function") {
|
|
115
140
|
if (Math.round(e.target.clientHeight + e.target.scrollTop) == e.target.scrollHeight) {
|
|
@@ -117,48 +142,58 @@ const TagsDropdown = _ref => {
|
|
|
117
142
|
}
|
|
118
143
|
}
|
|
119
144
|
}, [options]);
|
|
145
|
+
|
|
120
146
|
const handleClickOutside = _ref2 => {
|
|
121
147
|
var _getListContainer;
|
|
148
|
+
|
|
122
149
|
let {
|
|
123
150
|
target
|
|
124
151
|
} = _ref2;
|
|
125
|
-
|
|
126
|
-
// eslint-disable-next-line no-use-before-define
|
|
127
|
-
!((_getListContainer = getListContainer()) !== null && _getListContainer !== void 0 && _getListContainer.contains(target))
|
|
152
|
+
|
|
153
|
+
if ( // eslint-disable-next-line no-use-before-define
|
|
154
|
+
!((_getListContainer = getListContainer()) !== null && _getListContainer !== void 0 && _getListContainer.contains(target))
|
|
155
|
+
/* && !isTargetInParent(target) */
|
|
156
|
+
) {
|
|
128
157
|
setIsOpen(false);
|
|
129
158
|
setSearchValueInterceptor("");
|
|
130
159
|
}
|
|
131
160
|
};
|
|
161
|
+
|
|
132
162
|
const deleteChosen = value => {
|
|
133
163
|
if (isMobile ? closeOnRemoveMobile : closeOnRemove) setIsOpen(false);
|
|
134
|
-
setLocalOptionsStore(options => ({
|
|
135
|
-
...options,
|
|
164
|
+
setLocalOptionsStore(options => ({ ...options,
|
|
136
165
|
[value]: undefined
|
|
137
166
|
}));
|
|
138
167
|
onChange(chosenOptions.filter(item => item !== value), "chosenOptions");
|
|
139
168
|
};
|
|
169
|
+
|
|
140
170
|
const onChangeHandler = item => {
|
|
141
171
|
if (item !== null && item !== void 0 && item.isFreezed) return false;
|
|
172
|
+
|
|
142
173
|
if ((item === null || item === void 0 ? void 0 : item.closeOnOptionSelect) !== undefined) {
|
|
143
174
|
if (item.closeOnOptionSelect) setIsOpen(false);
|
|
144
175
|
} else if (isMobile ? closeOnSelectMobile : closeOnSelect) setIsOpen(false);
|
|
176
|
+
|
|
145
177
|
setSearchValueInterceptor("");
|
|
178
|
+
|
|
146
179
|
if (chosenOptions.some(el => el === item.value)) {
|
|
147
180
|
deleteChosen(item.value);
|
|
148
181
|
return null;
|
|
149
182
|
}
|
|
150
|
-
|
|
151
|
-
|
|
183
|
+
|
|
184
|
+
setLocalOptionsStore(options => ({ ...options,
|
|
152
185
|
[item === null || item === void 0 ? void 0 : item.value]: item === null || item === void 0 ? void 0 : item.label
|
|
153
186
|
}));
|
|
154
187
|
onChange([...chosenOptions, item.value], "chosenOptions");
|
|
155
188
|
return null;
|
|
156
189
|
};
|
|
190
|
+
|
|
157
191
|
const onSearchHandler = name => {
|
|
158
192
|
let inputValue = name;
|
|
159
193
|
if (!isNotValidateASCII) inputValue = (0, _fieldValueFormatters.formatToOnlyASCIICodeText)(inputValue);
|
|
160
194
|
setSearchValueInterceptor(inputValue);
|
|
161
195
|
};
|
|
196
|
+
|
|
162
197
|
const onWrapperClick = e => {
|
|
163
198
|
if (e.target === (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) {
|
|
164
199
|
e.stopPropagation();
|
|
@@ -166,22 +201,27 @@ const TagsDropdown = _ref => {
|
|
|
166
201
|
setIsOpen(false);
|
|
167
202
|
}
|
|
168
203
|
};
|
|
204
|
+
|
|
169
205
|
const getMarkupForElement = item => {
|
|
170
206
|
var _title$toString, _item$customMobileIco;
|
|
207
|
+
|
|
171
208
|
const {
|
|
172
209
|
description
|
|
173
210
|
} = item;
|
|
174
211
|
const title = item.title || item.label;
|
|
212
|
+
|
|
175
213
|
const hightlightSearchValue = title => {
|
|
176
214
|
var _title$toLowerCase;
|
|
215
|
+
|
|
177
216
|
const index = (_title$toLowerCase = title.toLowerCase()) === null || _title$toLowerCase === void 0 ? void 0 : _title$toLowerCase.indexOf(searchValue.toLowerCase());
|
|
178
217
|
if (index === -1) return title;
|
|
179
218
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, title.substring(0, index), /*#__PURE__*/_react.default.createElement("span", {
|
|
180
219
|
className: "search-match"
|
|
181
220
|
}, title.substring(index, index + (searchValue === null || searchValue === void 0 ? void 0 : searchValue.length))), title.substring(index + (searchValue === null || searchValue === void 0 ? void 0 : searchValue.length)));
|
|
182
221
|
};
|
|
222
|
+
|
|
183
223
|
return /*#__PURE__*/_react.default.createElement("button", {
|
|
184
|
-
key: title === null || title === void 0
|
|
224
|
+
key: title === null || title === void 0 ? void 0 : (_title$toString = title.toString()) === null || _title$toString === void 0 ? void 0 : _title$toString.replace(/ /g, "_"),
|
|
185
225
|
onClick: e => {
|
|
186
226
|
e.preventDefault();
|
|
187
227
|
e.stopPropagation();
|
|
@@ -215,11 +255,14 @@ const TagsDropdown = _ref => {
|
|
|
215
255
|
}
|
|
216
256
|
}) : "");
|
|
217
257
|
};
|
|
258
|
+
|
|
218
259
|
const prepareOptions = options => {
|
|
219
260
|
return options === null || options === void 0 ? void 0 : options.map(option => option !== null && option !== void 0 && option.groupName ? option === null || option === void 0 ? void 0 : option.list : option).flat();
|
|
220
261
|
};
|
|
262
|
+
|
|
221
263
|
const selectAllItems = () => {
|
|
222
264
|
var _prepareOptions;
|
|
265
|
+
|
|
223
266
|
const preparedOptions = (_prepareOptions = prepareOptions(options)) === null || _prepareOptions === void 0 ? void 0 : _prepareOptions.filter(_ref3 => {
|
|
224
267
|
let {
|
|
225
268
|
isFreezed,
|
|
@@ -243,57 +286,71 @@ const TagsDropdown = _ref => {
|
|
|
243
286
|
})) || [])], "chosenOptions");
|
|
244
287
|
if (isMobile ? closeOnSelectAllMobile : closeOnSelectAll) setIsOpen(false);
|
|
245
288
|
};
|
|
289
|
+
|
|
246
290
|
const unselectAllItems = () => {
|
|
247
291
|
setLocalOptionsStore({});
|
|
248
292
|
onChange(chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.filter(item => {
|
|
249
|
-
var _prepareOptions2;
|
|
250
|
-
|
|
293
|
+
var _prepareOptions2, _prepareOptions2$find;
|
|
294
|
+
|
|
295
|
+
return (_prepareOptions2 = prepareOptions(options)) === null || _prepareOptions2 === void 0 ? void 0 : (_prepareOptions2$find = _prepareOptions2.find(_ref6 => {
|
|
251
296
|
let {
|
|
252
297
|
value
|
|
253
298
|
} = _ref6;
|
|
254
299
|
return value === item;
|
|
255
|
-
})) === null || _prepareOptions2 === void 0 ? void 0 : _prepareOptions2.isFreezed;
|
|
300
|
+
})) === null || _prepareOptions2$find === void 0 ? void 0 : _prepareOptions2$find.isFreezed;
|
|
256
301
|
}), "chosenOptions");
|
|
257
302
|
if (isMobile ? closeOnRemoveAllMobile : closeOnRemoveAll) setIsOpen(false);
|
|
258
303
|
};
|
|
304
|
+
|
|
259
305
|
const getParentNode = () => {
|
|
260
306
|
var _ref7, _document$querySelect;
|
|
307
|
+
|
|
261
308
|
return (_ref7 = (_document$querySelect = document.querySelector("div#root")) !== null && _document$querySelect !== void 0 ? _document$querySelect : document.querySelector("div#app")) !== null && _ref7 !== void 0 ? _ref7 : document.querySelector("div#storybook-root");
|
|
262
309
|
};
|
|
310
|
+
|
|
263
311
|
const initListContainer = () => {
|
|
264
312
|
const dropdownList = document.createElement("div");
|
|
265
313
|
dropdownList.setAttribute("id", dropdownId);
|
|
266
314
|
dropdownList.classList.add("tags-dropdown__container");
|
|
315
|
+
|
|
267
316
|
if (isMobile) {
|
|
268
317
|
dropdownList.addEventListener("click", e => {
|
|
269
318
|
if (e.target.id === dropdownId) setIsOpen(false);
|
|
270
319
|
});
|
|
271
320
|
}
|
|
321
|
+
|
|
272
322
|
if (isMobile) {
|
|
273
323
|
var _getParentNode;
|
|
324
|
+
|
|
274
325
|
try {
|
|
275
326
|
var _document$getElementB;
|
|
276
|
-
|
|
277
|
-
// eslint-disable-next-line no-empty
|
|
327
|
+
|
|
328
|
+
(_document$getElementB = document.getElementById("mlw-".concat(dropdownId))) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.remove(); // eslint-disable-next-line no-empty
|
|
278
329
|
} catch (e) {}
|
|
330
|
+
|
|
279
331
|
const dropdownMobileListWrapper = document.createElement("div");
|
|
280
332
|
dropdownMobileListWrapper.classList.add("tags-dropdown-mobile");
|
|
281
333
|
dropdownMobileListWrapper.setAttribute("id", "mlw-".concat(dropdownId));
|
|
282
|
-
dropdownMobileListWrapper === null || dropdownMobileListWrapper === void 0
|
|
283
|
-
(_getParentNode = getParentNode()) === null || _getParentNode === void 0
|
|
334
|
+
dropdownMobileListWrapper === null || dropdownMobileListWrapper === void 0 ? void 0 : dropdownMobileListWrapper.append(dropdownList);
|
|
335
|
+
(_getParentNode = getParentNode()) === null || _getParentNode === void 0 ? void 0 : _getParentNode.append(dropdownMobileListWrapper);
|
|
284
336
|
} else {
|
|
285
337
|
var _getParentNode2;
|
|
286
|
-
|
|
338
|
+
|
|
339
|
+
(_getParentNode2 = getParentNode()) === null || _getParentNode2 === void 0 ? void 0 : _getParentNode2.append(dropdownList);
|
|
287
340
|
}
|
|
288
341
|
};
|
|
342
|
+
|
|
289
343
|
const getListContainer = () => {
|
|
290
344
|
return document.getElementById(dropdownId);
|
|
291
345
|
};
|
|
346
|
+
|
|
292
347
|
const getListContainerWrapper = () => {
|
|
293
348
|
return document.getElementById("mlw-".concat(dropdownId));
|
|
294
349
|
};
|
|
350
|
+
|
|
295
351
|
const setListContainerStyles = () => {
|
|
296
|
-
var _dropdownRef$current$, _dropdownRef$current, _getComputedStyle$mar, _getComputedStyle, _getComputedStyle$max, _getComputedStyle2, _dl$getBoundingClient, _sw$getBoundingClient, _sw$getBoundingClient2, _lh$getBoundingClient, _lf$getBoundingClient;
|
|
352
|
+
var _dropdownRef$current$, _dropdownRef$current, _getComputedStyle$mar, _getComputedStyle, _getComputedStyle$mar2, _getComputedStyle$max, _getComputedStyle2, _getComputedStyle2$ma, _dl$getBoundingClient, _sw$getBoundingClient, _sw$getBoundingClient2, _lh$getBoundingClient, _lf$getBoundingClient;
|
|
353
|
+
|
|
297
354
|
const lc = getListContainer();
|
|
298
355
|
if (!lc || !isOpen) return false;
|
|
299
356
|
const windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
|
@@ -302,21 +359,21 @@ const TagsDropdown = _ref => {
|
|
|
302
359
|
height,
|
|
303
360
|
left,
|
|
304
361
|
top
|
|
305
|
-
} = (_dropdownRef$current$ = dropdownRef === null || dropdownRef === void 0
|
|
362
|
+
} = (_dropdownRef$current$ = dropdownRef === null || dropdownRef === void 0 ? void 0 : (_dropdownRef$current = dropdownRef.current) === null || _dropdownRef$current === void 0 ? void 0 : _dropdownRef$current.getBoundingClientRect()) !== null && _dropdownRef$current$ !== void 0 ? _dropdownRef$current$ : {};
|
|
306
363
|
const sw = dropdownListWrapperRef === null || dropdownListWrapperRef === void 0 ? void 0 : dropdownListWrapperRef.current;
|
|
307
364
|
const dl = lc.getElementsByClassName("tags-dropdown__list")[0];
|
|
308
365
|
const lh = sw === null || sw === void 0 ? void 0 : sw.getElementsByClassName("tags-dropdown__header")[0];
|
|
309
366
|
const lf = sw === null || sw === void 0 ? void 0 : sw.getElementsByClassName("tags-dropdown__footer")[0];
|
|
310
|
-
const margin = parseInt((_getComputedStyle$mar = (_getComputedStyle = getComputedStyle(sw)) === null || _getComputedStyle === void 0
|
|
311
|
-
const maxHeight = initListHeight !== null && initListHeight !== void 0 ? initListHeight : parseInt((_getComputedStyle$max = (_getComputedStyle2 = getComputedStyle(dl)) === null || _getComputedStyle2 === void 0
|
|
367
|
+
const margin = parseInt((_getComputedStyle$mar = (_getComputedStyle = getComputedStyle(sw)) === null || _getComputedStyle === void 0 ? void 0 : (_getComputedStyle$mar2 = _getComputedStyle.marginTop) === null || _getComputedStyle$mar2 === void 0 ? void 0 : _getComputedStyle$mar2.replace("px", "")) !== null && _getComputedStyle$mar !== void 0 ? _getComputedStyle$mar : 0, 10);
|
|
368
|
+
const maxHeight = initListHeight !== null && initListHeight !== void 0 ? initListHeight : parseInt((_getComputedStyle$max = (_getComputedStyle2 = getComputedStyle(dl)) === null || _getComputedStyle2 === void 0 ? void 0 : (_getComputedStyle2$ma = _getComputedStyle2.maxHeight) === null || _getComputedStyle2$ma === void 0 ? void 0 : _getComputedStyle2$ma.replace("px", "")) !== null && _getComputedStyle$max !== void 0 ? _getComputedStyle$max : 0, 10);
|
|
312
369
|
if (initListHeight === null) setInitListHeight(maxHeight);
|
|
313
370
|
const toTop = top - margin;
|
|
314
371
|
const toBottom = windowHeight - top - height - margin * 2;
|
|
315
|
-
const dlHeight = dl === null || dl === void 0
|
|
316
|
-
let swHeight = sw === null || sw === void 0
|
|
372
|
+
const dlHeight = dl === null || dl === void 0 ? void 0 : (_dl$getBoundingClient = dl.getBoundingClientRect()) === null || _dl$getBoundingClient === void 0 ? void 0 : _dl$getBoundingClient.height;
|
|
373
|
+
let swHeight = sw === null || sw === void 0 ? void 0 : (_sw$getBoundingClient = sw.getBoundingClientRect()) === null || _sw$getBoundingClient === void 0 ? void 0 : _sw$getBoundingClient.height;
|
|
317
374
|
const controlsHeight = swHeight - dlHeight;
|
|
318
375
|
if (swHeight > maxHeight) swHeight = maxHeight - 2 * margin;
|
|
319
|
-
const maxSwHeight = isMobile ? (sw === null || sw === void 0
|
|
376
|
+
const maxSwHeight = isMobile ? (sw === null || sw === void 0 ? void 0 : (_sw$getBoundingClient2 = sw.getBoundingClientRect()) === null || _sw$getBoundingClient2 === void 0 ? void 0 : _sw$getBoundingClient2.height) - (lh === null || lh === void 0 ? void 0 : (_lh$getBoundingClient = lh.getBoundingClientRect()) === null || _lh$getBoundingClient === void 0 ? void 0 : _lh$getBoundingClient.height) - (lf === null || lf === void 0 ? void 0 : (_lf$getBoundingClient = lf.getBoundingClientRect()) === null || _lf$getBoundingClient === void 0 ? void 0 : _lf$getBoundingClient.height) : toTop - margin >= maxHeight || toBottom - margin >= maxHeight ? maxHeight - 3 * margin : toTop > toBottom ? toTop - 3 * margin : toBottom - 4 * margin;
|
|
320
377
|
const listPos = toTop < toBottom || toBottom >= swHeight ? "bottom" : "top";
|
|
321
378
|
if (swHeight > (listPos === "top" ? toTop : toBottom)) swHeight = (listPos === "top" ? toTop : toBottom) - 3 * margin;
|
|
322
379
|
lc.style.minWidth = "".concat(width, "px");
|
|
@@ -324,51 +381,62 @@ const TagsDropdown = _ref => {
|
|
|
324
381
|
lc.style.top = "".concat(listPos === "bottom" ? top + height : top - swHeight - 2 * margin, "px");
|
|
325
382
|
dl.style.maxHeight = "".concat(isMobile ? maxSwHeight : maxSwHeight - controlsHeight, "px");
|
|
326
383
|
};
|
|
384
|
+
|
|
327
385
|
const renderListContainer = () => {
|
|
328
386
|
const lc = getListContainer();
|
|
329
|
-
if (!lc) return null;
|
|
387
|
+
if (!lc) return null; // eslint-disable-next-line no-use-before-define
|
|
330
388
|
|
|
331
|
-
// eslint-disable-next-line no-use-before-define
|
|
332
389
|
return /*#__PURE__*/(0, _reactDom.createPortal)(getListMarkUp(), lc);
|
|
333
390
|
};
|
|
391
|
+
|
|
334
392
|
const isTargetInParent = target => {
|
|
335
393
|
var _target$className, _target$className$ind, _target$className2, _target$className2$in;
|
|
394
|
+
|
|
336
395
|
if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) === "tag__button" || (target === null || target === void 0 ? void 0 : target.tagName) === "line") return false;
|
|
337
|
-
if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) !== "tag__button" || (target === null || target === void 0
|
|
396
|
+
if ((target === null || target === void 0 ? void 0 : target.tagName) === "svg" && (target === null || target === void 0 ? void 0 : target.parentNodclassName) !== "tag__button" || (target === null || target === void 0 ? void 0 : (_target$className = target.className) === null || _target$className === void 0 ? void 0 : (_target$className$ind = _target$className.indexOf) === null || _target$className$ind === void 0 ? void 0 : _target$className$ind.call(_target$className, "tag__label")) !== -1 || (target === null || target === void 0 ? void 0 : (_target$className2 = target.className) === null || _target$className2 === void 0 ? void 0 : (_target$className2$in = _target$className2.indexOf) === null || _target$className2$in === void 0 ? void 0 : _target$className2$in.call(_target$className2, "tag-list_wrapper")) !== -1 || (target === null || target === void 0 ? void 0 : target.className) === "".concat(RC, "__trigger") || (target === null || target === void 0 ? void 0 : target.className) === "tags-dropdown__arrow") return true;
|
|
338
397
|
return false;
|
|
339
398
|
};
|
|
399
|
+
|
|
340
400
|
const isItemMatchesSearch = item => {
|
|
341
401
|
const title = item.title || item.label;
|
|
342
402
|
return searchValue.length ? title.toLowerCase().includes((searchValue === null || searchValue === void 0 ? void 0 : searchValue.toLowerCase()) || "") : true;
|
|
343
403
|
};
|
|
404
|
+
|
|
344
405
|
const getFilteredOptions = options => options === null || options === void 0 ? void 0 : options.reduce((result, option) => {
|
|
345
406
|
if (option.groupName) {
|
|
346
407
|
var _option$list;
|
|
347
|
-
|
|
408
|
+
|
|
409
|
+
const filteredGroupItems = option === null || option === void 0 ? void 0 : (_option$list = option.list) === null || _option$list === void 0 ? void 0 : _option$list.filter(item => isItemMatchesSearch(item));
|
|
410
|
+
|
|
348
411
|
if (filteredGroupItems !== null && filteredGroupItems !== void 0 && filteredGroupItems.length) {
|
|
349
|
-
result.push({
|
|
350
|
-
...option,
|
|
412
|
+
result.push({ ...option,
|
|
351
413
|
list: filteredGroupItems
|
|
352
414
|
});
|
|
353
415
|
}
|
|
354
416
|
} else if (isItemMatchesSearch(option)) {
|
|
355
417
|
result.push(option);
|
|
356
418
|
}
|
|
419
|
+
|
|
357
420
|
return result;
|
|
358
421
|
}, []);
|
|
422
|
+
|
|
359
423
|
const getTotalOptions = (0, _react.useCallback)(() => {
|
|
360
424
|
return options === null || options === void 0 ? void 0 : options.reduce((result, item) => {
|
|
361
425
|
if (item !== null && item !== void 0 && item.list) {
|
|
362
426
|
var _item$list2;
|
|
363
|
-
|
|
427
|
+
|
|
428
|
+
result += (item === null || item === void 0 ? void 0 : (_item$list2 = item.list) === null || _item$list2 === void 0 ? void 0 : _item$list2.length) || 0;
|
|
364
429
|
} else {
|
|
365
430
|
++result;
|
|
366
431
|
}
|
|
432
|
+
|
|
367
433
|
return result;
|
|
368
434
|
}, 0);
|
|
369
435
|
}, [options]);
|
|
436
|
+
|
|
370
437
|
const getListMarkUp = () => {
|
|
371
438
|
var _filteredOptions$filt, _filteredOptions$filt2;
|
|
439
|
+
|
|
372
440
|
const filteredOptions = getFilteredOptions(options);
|
|
373
441
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
374
442
|
className: (0, _classnames.default)("".concat(RC, "__container-wrapper")),
|
|
@@ -418,9 +486,10 @@ const TagsDropdown = _ref => {
|
|
|
418
486
|
ref: dropdownListRef,
|
|
419
487
|
className: "".concat(RC, "__list ").concat(headerContent || isMobile ? "".concat(RC, "__list--with-header") : "", " ").concat(footerContent ? "".concat(RC, "__list--with-footer") : "")
|
|
420
488
|
}, filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.map(option => {
|
|
421
|
-
var _option$groupName, _option$list2;
|
|
489
|
+
var _option$groupName, _option$groupName$toS, _option$list2;
|
|
490
|
+
|
|
422
491
|
return option.groupName ? /*#__PURE__*/_react.default.createElement("div", {
|
|
423
|
-
key: (_option$groupName = option.groupName) === null || _option$groupName === void 0
|
|
492
|
+
key: (_option$groupName = option.groupName) === null || _option$groupName === void 0 ? void 0 : (_option$groupName$toS = _option$groupName.toString()) === null || _option$groupName$toS === void 0 ? void 0 : _option$groupName$toS.replace(/ /g, "_").concat(Date.now()),
|
|
424
493
|
className: (0, _classnames.default)("".concat(RC, "-group"), option.className)
|
|
425
494
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
426
495
|
className: "".concat(RC, "-group__name")
|
|
@@ -446,11 +515,14 @@ const TagsDropdown = _ref => {
|
|
|
446
515
|
onClick: () => setIsOpen(false)
|
|
447
516
|
}, "Apply", chosenOptions !== null && chosenOptions !== void 0 && chosenOptions.length ? "(".concat(chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.length, ")") : "")) : null));
|
|
448
517
|
};
|
|
518
|
+
|
|
449
519
|
const closeList = e => {
|
|
450
520
|
var _inputRef$current;
|
|
521
|
+
|
|
451
522
|
handleClickOutside(e);
|
|
452
|
-
inputRef === null || inputRef === void 0
|
|
523
|
+
inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
|
|
453
524
|
};
|
|
525
|
+
|
|
454
526
|
(0, _react.useLayoutEffect)(() => {
|
|
455
527
|
initListContainer();
|
|
456
528
|
}, []);
|
|
@@ -464,6 +536,7 @@ const TagsDropdown = _ref => {
|
|
|
464
536
|
window.removeEventListener("mousewheel", closeList);
|
|
465
537
|
window.removeEventListener("mouseup", handleClickOutside);
|
|
466
538
|
}
|
|
539
|
+
|
|
467
540
|
return () => {
|
|
468
541
|
window.removeEventListener("resize", setListContainerStyles);
|
|
469
542
|
window.removeEventListener("mousewheel", closeList);
|
|
@@ -472,73 +545,89 @@ const TagsDropdown = _ref => {
|
|
|
472
545
|
}, [getListContainer]);
|
|
473
546
|
(0, _react.useLayoutEffect)(() => {
|
|
474
547
|
setListContainerStyles();
|
|
475
|
-
}, [isOpen, chosenOptions, isMobile, dropdownListWrapperRef === null || dropdownListWrapperRef === void 0
|
|
548
|
+
}, [isOpen, chosenOptions, isMobile, dropdownListWrapperRef === null || dropdownListWrapperRef === void 0 ? void 0 : (_dropdownListWrapperR = dropdownListWrapperRef.current) === null || _dropdownListWrapperR === void 0 ? void 0 : (_dropdownListWrapperR2 = _dropdownListWrapperR.getBoundingClientRect()) === null || _dropdownListWrapperR2 === void 0 ? void 0 : _dropdownListWrapperR2.height]);
|
|
476
549
|
(0, _react.useEffect)(() => {
|
|
477
550
|
if (!isMobile) {
|
|
478
551
|
document.addEventListener("click", handleClickOutside, true);
|
|
479
552
|
} else {
|
|
480
553
|
document.removeEventListener("click", handleClickOutside, true);
|
|
481
554
|
}
|
|
555
|
+
|
|
482
556
|
return () => document.removeEventListener("click", handleClickOutside, true);
|
|
483
557
|
}, [isMobile]);
|
|
484
558
|
(0, _react.useEffect)(() => {
|
|
485
559
|
var _selectAllButtonRef$c, _unselectAllButtonRef;
|
|
560
|
+
|
|
486
561
|
const fn = isOpen ? "addEventListener" : "removeEventListener";
|
|
487
|
-
selectAllButtonRef === null || selectAllButtonRef === void 0
|
|
488
|
-
unselectAllButtonRef === null || unselectAllButtonRef === void 0
|
|
562
|
+
selectAllButtonRef === null || selectAllButtonRef === void 0 ? void 0 : (_selectAllButtonRef$c = selectAllButtonRef.current) === null || _selectAllButtonRef$c === void 0 ? void 0 : _selectAllButtonRef$c[fn]("click", selectAllItems, true);
|
|
563
|
+
unselectAllButtonRef === null || unselectAllButtonRef === void 0 ? void 0 : (_unselectAllButtonRef = unselectAllButtonRef.current) === null || _unselectAllButtonRef === void 0 ? void 0 : _unselectAllButtonRef[fn]("click", unselectAllItems, true);
|
|
564
|
+
|
|
489
565
|
if (isOpen) {
|
|
490
566
|
var _getListContainer2;
|
|
491
|
-
|
|
567
|
+
|
|
568
|
+
(_getListContainer2 = getListContainer()) === null || _getListContainer2 === void 0 ? void 0 : _getListContainer2.classList.add("tags-dropdown__container--opened");
|
|
492
569
|
} else {
|
|
493
570
|
var _getListContainer3;
|
|
494
|
-
|
|
571
|
+
|
|
572
|
+
(_getListContainer3 = getListContainer()) === null || _getListContainer3 === void 0 ? void 0 : _getListContainer3.classList.remove("tags-dropdown__container--opened");
|
|
495
573
|
}
|
|
496
574
|
}, [isOpen]);
|
|
497
575
|
(0, _react.useEffect)(() => {
|
|
498
576
|
if (isOpen && isMobile, dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
499
577
|
var _dropdownListRef$curr, _dropdownListRef$curr2;
|
|
500
|
-
|
|
578
|
+
|
|
579
|
+
setIsScrollableList((dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr = dropdownListRef.current) === null || _dropdownListRef$curr === void 0 ? void 0 : _dropdownListRef$curr.scrollHeight) > (dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr2 = dropdownListRef.current) === null || _dropdownListRef$curr2 === void 0 ? void 0 : _dropdownListRef$curr2.clientHeight));
|
|
580
|
+
|
|
501
581
|
if (isScrollableList === null) {
|
|
502
582
|
var _dropdownListRef$curr3, _dropdownListRef$curr4;
|
|
503
|
-
|
|
583
|
+
|
|
584
|
+
setIsFixedMaxHeight((dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr3 = dropdownListRef.current) === null || _dropdownListRef$curr3 === void 0 ? void 0 : _dropdownListRef$curr3.scrollHeight) > (dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr4 = dropdownListRef.current) === null || _dropdownListRef$curr4 === void 0 ? void 0 : _dropdownListRef$curr4.clientHeight));
|
|
504
585
|
}
|
|
505
586
|
}
|
|
587
|
+
|
|
506
588
|
if (isOpen && dropdownListRef && dropdownListRef.current) {
|
|
507
589
|
dropdownListRef.current.addEventListener("scroll", doScrollCallback);
|
|
508
590
|
}
|
|
591
|
+
|
|
509
592
|
return () => {
|
|
510
593
|
removeEventListener("scroll", doScrollCallback);
|
|
511
594
|
};
|
|
512
|
-
}, [isOpen, isMobile, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current, dropdownListRef === null || dropdownListRef === void 0
|
|
595
|
+
}, [isOpen, isMobile, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr5 = dropdownListRef.current) === null || _dropdownListRef$curr5 === void 0 ? void 0 : _dropdownListRef$curr5.scrollHeight, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr6 = dropdownListRef.current) === null || _dropdownListRef$curr6 === void 0 ? void 0 : _dropdownListRef$curr6.clientHeight]);
|
|
513
596
|
(0, _react.useEffect)(() => {
|
|
514
597
|
const setScrollTopValue = e => {
|
|
515
598
|
setScrollTop(parseInt(e.target.scrollTop, 10));
|
|
516
599
|
};
|
|
600
|
+
|
|
517
601
|
if (isOpen && isMobile && dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
518
602
|
var _dropdownListRef$curr7;
|
|
519
|
-
|
|
603
|
+
|
|
604
|
+
dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr7 = dropdownListRef.current) === null || _dropdownListRef$curr7 === void 0 ? void 0 : _dropdownListRef$curr7.addEventListener("scroll", setScrollTopValue);
|
|
520
605
|
}
|
|
606
|
+
|
|
521
607
|
return () => {
|
|
522
608
|
var _dropdownListRef$curr8;
|
|
523
|
-
|
|
609
|
+
|
|
610
|
+
dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr8 = dropdownListRef.current) === null || _dropdownListRef$curr8 === void 0 ? void 0 : _dropdownListRef$curr8.removeEventListener("scroll", setScrollTopValue);
|
|
524
611
|
};
|
|
525
612
|
}, [isOpen, isMobile, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current]);
|
|
526
613
|
(0, _react.useEffect)(() => {
|
|
527
614
|
if (dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
528
615
|
var _dropdownListRef$curr9, _dropdownListRef$curr10;
|
|
529
|
-
|
|
616
|
+
|
|
617
|
+
setScrollHeight(parseInt((dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr9 = dropdownListRef.current) === null || _dropdownListRef$curr9 === void 0 ? void 0 : _dropdownListRef$curr9.scrollHeight) - (dropdownListRef === null || dropdownListRef === void 0 ? void 0 : (_dropdownListRef$curr10 = dropdownListRef.current) === null || _dropdownListRef$curr10 === void 0 ? void 0 : _dropdownListRef$curr10.clientHeight), 10));
|
|
530
618
|
}
|
|
531
619
|
}, [scrollTop, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current]);
|
|
532
620
|
(0, _react.useEffect)(() => {
|
|
533
621
|
return () => {
|
|
534
622
|
var _getListContainer4, _getListContainerWrap;
|
|
535
|
-
|
|
536
|
-
(
|
|
623
|
+
|
|
624
|
+
(_getListContainer4 = getListContainer()) === null || _getListContainer4 === void 0 ? void 0 : _getListContainer4.remove();
|
|
625
|
+
(_getListContainerWrap = getListContainerWrapper()) === null || _getListContainerWrap === void 0 ? void 0 : _getListContainerWrap.remove();
|
|
537
626
|
};
|
|
538
627
|
}, []);
|
|
539
628
|
(0, _react.useEffect)(() => {
|
|
540
629
|
if (isSearchable && useLiveSearch && debouncedSearchTerm || isValueDeleted) {
|
|
541
|
-
doLiveSearchRequest === null || doLiveSearchRequest === void 0
|
|
630
|
+
doLiveSearchRequest === null || doLiveSearchRequest === void 0 ? void 0 : doLiveSearchRequest(debouncedSearchTerm);
|
|
542
631
|
}
|
|
543
632
|
}, [debouncedSearchTerm, isValueDeleted]);
|
|
544
633
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -592,7 +681,8 @@ const TagsDropdown = _ref => {
|
|
|
592
681
|
onKeyDown: e => onKeyPress(e, searchValue),
|
|
593
682
|
onFocus: e => {
|
|
594
683
|
var _e$target;
|
|
595
|
-
|
|
684
|
+
|
|
685
|
+
if (isMobile) e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.blur();
|
|
596
686
|
}
|
|
597
687
|
}, attributesOfNativeInput)) : "", isOpen && renderListContainer(), /*#__PURE__*/_react.default.createElement("span", {
|
|
598
688
|
className: (0, _classnames.default)("".concat(RC, "__arrow"), {
|
|
@@ -606,4 +696,6 @@ const TagsDropdown = _ref => {
|
|
|
606
696
|
className: "color--text"
|
|
607
697
|
}))));
|
|
608
698
|
};
|
|
609
|
-
|
|
699
|
+
|
|
700
|
+
var _default = TagsDropdown;
|
|
701
|
+
exports.default = _default;
|
|
@@ -1,16 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
|
|
9
12
|
var _react = _interopRequireDefault(require("react"));
|
|
13
|
+
|
|
10
14
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
15
|
+
|
|
11
16
|
require("./Text.scss");
|
|
12
|
-
const RC = "text";
|
|
13
17
|
|
|
18
|
+
const RC = "text";
|
|
14
19
|
/**
|
|
15
20
|
*
|
|
16
21
|
* @param value
|
|
@@ -23,7 +28,6 @@ const RC = "text";
|
|
|
23
28
|
* @return {JSX.Element|null}
|
|
24
29
|
* @constructor
|
|
25
30
|
*/
|
|
26
|
-
|
|
27
31
|
//? Прототип лежит на проекте кабинета src\JS\Components\Atomic\FormElements\Text\Text.js
|
|
28
32
|
//? Что поменял?
|
|
29
33
|
//? - в верстке убрал дополнительную вложенность
|
|
@@ -35,18 +39,13 @@ const RC = "text";
|
|
|
35
39
|
//? - переработал пропу link, может быть строкой или объектом
|
|
36
40
|
//? если это объект, то у него могут быть свойства
|
|
37
41
|
//? - path - значение для href
|
|
38
|
-
|
|
39
42
|
//? - target - значение для атрибута target, имеет смысл передавать, если не передаются onClick или redirect
|
|
40
|
-
|
|
41
43
|
//? - onClick - альтернативный обработчик нажатия, если он есть то он будет ипользован в приоритете,
|
|
42
44
|
//? ф-я будет вызвана с 1 аргументом - props, в объекте props будет свойство ev (event) и все содержание link,
|
|
43
45
|
//? по умолчанию до использования onClick будут вызваны e.preventDefault() и e.stopPropagation
|
|
44
|
-
|
|
45
46
|
//? - redirect - альтернативный исполнитель редиректа (например history.push),
|
|
46
47
|
//? если есть и нет onClick - будет вызван с одним аргументом (link.path)
|
|
47
|
-
|
|
48
48
|
//? - isNoPreventDefault - отключает вызов e.preventDefault перед вызовом onClick или redirect
|
|
49
|
-
|
|
50
49
|
//? - isNoStopPropagation - отключает вызов e.preventDefault перед вызовом onClick или redirect
|
|
51
50
|
|
|
52
51
|
const Text = _ref => {
|
|
@@ -72,17 +71,19 @@ const Text = _ref => {
|
|
|
72
71
|
isNoPreventDefault,
|
|
73
72
|
isNoStopPropagation
|
|
74
73
|
} = linkObj;
|
|
74
|
+
|
|
75
75
|
const preparedPath = (() => {
|
|
76
76
|
if (!isLink) return "";
|
|
77
77
|
return isLinkAsObj ? path : link;
|
|
78
78
|
})();
|
|
79
|
+
|
|
79
80
|
const atributes = {};
|
|
81
|
+
|
|
80
82
|
if (typeof onClickInner === "function" || typeof redirect === "function") {
|
|
81
83
|
atributes.onClick = function onClick(ev) {
|
|
82
84
|
if (!isNoPreventDefault) ev.preventDefault();
|
|
83
|
-
if (!isNoStopPropagation) ev.stopPropagation();
|
|
85
|
+
if (!isNoStopPropagation) ev.stopPropagation(); //? если переданы и onClick, и redirect, то onClick считается приоритетнее redirect
|
|
84
86
|
|
|
85
|
-
//? если переданы и onClick, и redirect, то onClick считается приоритетнее redirect
|
|
86
87
|
if (onClickInner) {
|
|
87
88
|
onClickInner({
|
|
88
89
|
ev,
|
|
@@ -90,12 +91,15 @@ const Text = _ref => {
|
|
|
90
91
|
});
|
|
91
92
|
return;
|
|
92
93
|
}
|
|
94
|
+
|
|
93
95
|
redirect(preparedPath);
|
|
94
96
|
};
|
|
95
97
|
}
|
|
98
|
+
|
|
96
99
|
const mainInner = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, icon && /*#__PURE__*/_react.default.createElement("div", {
|
|
97
100
|
className: "".concat(RC, "__icon-container")
|
|
98
101
|
}, icon), value);
|
|
102
|
+
|
|
99
103
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
100
104
|
"data-testid": "text--".concat(testId),
|
|
101
105
|
className: (0, _classnames.default)(RC, className, {
|
|
@@ -111,4 +115,6 @@ const Text = _ref => {
|
|
|
111
115
|
rel: "noreferrer"
|
|
112
116
|
}), mainInner) : mainInner);
|
|
113
117
|
};
|
|
114
|
-
|
|
118
|
+
|
|
119
|
+
var _default = Text;
|
|
120
|
+
exports.default = _default;
|