intelicoreact 1.3.33 → 1.3.35
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 +143 -50
- 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 +147 -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 +10 -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 +9 -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 +23 -9
- package/dist/index.js +2 -0
- package/package.json +1 -1
|
@@ -1,28 +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
|
+
|
|
22
|
+
var _useDebounce = require("../../../Functions/useDebounce");
|
|
23
|
+
|
|
14
24
|
var _useIsMobile = _interopRequireDefault(require("../../../Functions/useIsMobile"));
|
|
25
|
+
|
|
15
26
|
var _CheckboxInput = _interopRequireDefault(require("../../FormElements/CheckboxInput/CheckboxInput"));
|
|
27
|
+
|
|
16
28
|
var _Input = _interopRequireDefault(require("../../FormElements/Input/Input"));
|
|
29
|
+
|
|
17
30
|
var _Tag = _interopRequireDefault(require("../../UI/Tag/Tag"));
|
|
31
|
+
|
|
18
32
|
var _TagList = _interopRequireDefault(require("../../UI/TagList/TagList"));
|
|
33
|
+
|
|
19
34
|
require("./TagsDropdown.scss");
|
|
20
|
-
|
|
21
|
-
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
|
+
|
|
22
40
|
const RC = "tags-dropdown";
|
|
23
41
|
const MIN_ITEMS_FOR_SHOW_MOBILE_SEARCH = 10;
|
|
42
|
+
|
|
24
43
|
const TagsDropdown = _ref => {
|
|
25
|
-
var _Object$keys, _dropdownListWrapperR, _dropdownListRef$curr5, _dropdownListRef$curr6;
|
|
44
|
+
var _Object$keys, _dropdownListWrapperR, _dropdownListWrapperR2, _dropdownListRef$curr5, _dropdownListRef$curr6;
|
|
45
|
+
|
|
26
46
|
let {
|
|
27
47
|
options,
|
|
28
48
|
chosenOptions = [],
|
|
@@ -77,7 +97,7 @@ const TagsDropdown = _ref => {
|
|
|
77
97
|
const [isFixedMaxHeight, setIsFixedMaxHeight] = (0, _react.useState)(false);
|
|
78
98
|
const [scrollTop, setScrollTop] = (0, _react.useState)(0);
|
|
79
99
|
const [scrollHeight, setScrollHeight] = (0, _react.useState)(1);
|
|
80
|
-
const debouncedSearchTerm = useDebounce({
|
|
100
|
+
const debouncedSearchTerm = (0, _useDebounce.useDebounce)({
|
|
81
101
|
searchValue,
|
|
82
102
|
delay: 600
|
|
83
103
|
});
|
|
@@ -87,28 +107,34 @@ const TagsDropdown = _ref => {
|
|
|
87
107
|
const singleLevelOptions = options === null || options === void 0 ? void 0 : options.reduce((acc, item) => {
|
|
88
108
|
const checkUniqAndPush = (acc, item) => {
|
|
89
109
|
const isExist = acc === null || acc === void 0 ? void 0 : acc.findIndex(value => value === (item === null || item === void 0 ? void 0 : item.value));
|
|
110
|
+
|
|
90
111
|
if (isExist !== -1) {
|
|
91
112
|
acc[isExist] = item;
|
|
92
113
|
} else {
|
|
93
114
|
acc.push(item);
|
|
94
115
|
}
|
|
95
116
|
};
|
|
117
|
+
|
|
96
118
|
if (item.groupName) {
|
|
97
119
|
var _item$list;
|
|
98
|
-
|
|
120
|
+
|
|
121
|
+
(_item$list = item.list) === null || _item$list === void 0 ? void 0 : _item$list.map(item => checkUniqAndPush(acc, item));
|
|
99
122
|
} else {
|
|
100
123
|
checkUniqAndPush(acc, item);
|
|
101
124
|
}
|
|
125
|
+
|
|
102
126
|
return acc;
|
|
103
127
|
}, (_Object$keys = Object.keys(localOptionsStore)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.map(value => ({
|
|
104
128
|
value,
|
|
105
129
|
label: localOptionsStore === null || localOptionsStore === void 0 ? void 0 : localOptionsStore[value]
|
|
106
130
|
})));
|
|
131
|
+
|
|
107
132
|
const setSearchValueInterceptor = value => {
|
|
108
133
|
setSearchValue(value);
|
|
109
134
|
setIsValueDeleted(value === "");
|
|
110
135
|
searchValueRef.current = value;
|
|
111
136
|
};
|
|
137
|
+
|
|
112
138
|
const doScrollCallback = (0, _react.useCallback)(e => {
|
|
113
139
|
if (doLiveSearchRequest && typeof doLiveSearchRequest === "function") {
|
|
114
140
|
if (Math.round(e.target.clientHeight + e.target.scrollTop) == e.target.scrollHeight) {
|
|
@@ -116,48 +142,58 @@ const TagsDropdown = _ref => {
|
|
|
116
142
|
}
|
|
117
143
|
}
|
|
118
144
|
}, [options]);
|
|
145
|
+
|
|
119
146
|
const handleClickOutside = _ref2 => {
|
|
120
147
|
var _getListContainer;
|
|
148
|
+
|
|
121
149
|
let {
|
|
122
150
|
target
|
|
123
151
|
} = _ref2;
|
|
124
|
-
|
|
125
|
-
// eslint-disable-next-line no-use-before-define
|
|
126
|
-
!((_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
|
+
) {
|
|
127
157
|
setIsOpen(false);
|
|
128
158
|
setSearchValueInterceptor("");
|
|
129
159
|
}
|
|
130
160
|
};
|
|
161
|
+
|
|
131
162
|
const deleteChosen = value => {
|
|
132
163
|
if (isMobile ? closeOnRemoveMobile : closeOnRemove) setIsOpen(false);
|
|
133
|
-
setLocalOptionsStore(options => ({
|
|
134
|
-
...options,
|
|
164
|
+
setLocalOptionsStore(options => ({ ...options,
|
|
135
165
|
[value]: undefined
|
|
136
166
|
}));
|
|
137
167
|
onChange(chosenOptions.filter(item => item !== value), "chosenOptions");
|
|
138
168
|
};
|
|
169
|
+
|
|
139
170
|
const onChangeHandler = item => {
|
|
140
171
|
if (item !== null && item !== void 0 && item.isFreezed) return false;
|
|
172
|
+
|
|
141
173
|
if ((item === null || item === void 0 ? void 0 : item.closeOnOptionSelect) !== undefined) {
|
|
142
174
|
if (item.closeOnOptionSelect) setIsOpen(false);
|
|
143
175
|
} else if (isMobile ? closeOnSelectMobile : closeOnSelect) setIsOpen(false);
|
|
176
|
+
|
|
144
177
|
setSearchValueInterceptor("");
|
|
178
|
+
|
|
145
179
|
if (chosenOptions.some(el => el === item.value)) {
|
|
146
180
|
deleteChosen(item.value);
|
|
147
181
|
return null;
|
|
148
182
|
}
|
|
149
|
-
|
|
150
|
-
|
|
183
|
+
|
|
184
|
+
setLocalOptionsStore(options => ({ ...options,
|
|
151
185
|
[item === null || item === void 0 ? void 0 : item.value]: item === null || item === void 0 ? void 0 : item.label
|
|
152
186
|
}));
|
|
153
187
|
onChange([...chosenOptions, item.value], "chosenOptions");
|
|
154
188
|
return null;
|
|
155
189
|
};
|
|
190
|
+
|
|
156
191
|
const onSearchHandler = name => {
|
|
157
192
|
let inputValue = name;
|
|
158
193
|
if (!isNotValidateASCII) inputValue = (0, _fieldValueFormatters.formatToOnlyASCIICodeText)(inputValue);
|
|
159
194
|
setSearchValueInterceptor(inputValue);
|
|
160
195
|
};
|
|
196
|
+
|
|
161
197
|
const onWrapperClick = e => {
|
|
162
198
|
if (e.target === (wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current)) {
|
|
163
199
|
e.stopPropagation();
|
|
@@ -165,22 +201,27 @@ const TagsDropdown = _ref => {
|
|
|
165
201
|
setIsOpen(false);
|
|
166
202
|
}
|
|
167
203
|
};
|
|
204
|
+
|
|
168
205
|
const getMarkupForElement = item => {
|
|
169
206
|
var _title$toString, _item$customMobileIco;
|
|
207
|
+
|
|
170
208
|
const {
|
|
171
209
|
description
|
|
172
210
|
} = item;
|
|
173
211
|
const title = item.title || item.label;
|
|
212
|
+
|
|
174
213
|
const hightlightSearchValue = title => {
|
|
175
214
|
var _title$toLowerCase;
|
|
215
|
+
|
|
176
216
|
const index = (_title$toLowerCase = title.toLowerCase()) === null || _title$toLowerCase === void 0 ? void 0 : _title$toLowerCase.indexOf(searchValue.toLowerCase());
|
|
177
217
|
if (index === -1) return title;
|
|
178
218
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, title.substring(0, index), /*#__PURE__*/_react.default.createElement("span", {
|
|
179
219
|
className: "search-match"
|
|
180
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)));
|
|
181
221
|
};
|
|
222
|
+
|
|
182
223
|
return /*#__PURE__*/_react.default.createElement("button", {
|
|
183
|
-
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, "_"),
|
|
184
225
|
onClick: e => {
|
|
185
226
|
e.preventDefault();
|
|
186
227
|
e.stopPropagation();
|
|
@@ -214,11 +255,14 @@ const TagsDropdown = _ref => {
|
|
|
214
255
|
}
|
|
215
256
|
}) : "");
|
|
216
257
|
};
|
|
258
|
+
|
|
217
259
|
const prepareOptions = options => {
|
|
218
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();
|
|
219
261
|
};
|
|
262
|
+
|
|
220
263
|
const selectAllItems = () => {
|
|
221
264
|
var _prepareOptions;
|
|
265
|
+
|
|
222
266
|
const preparedOptions = (_prepareOptions = prepareOptions(options)) === null || _prepareOptions === void 0 ? void 0 : _prepareOptions.filter(_ref3 => {
|
|
223
267
|
let {
|
|
224
268
|
isFreezed,
|
|
@@ -242,57 +286,71 @@ const TagsDropdown = _ref => {
|
|
|
242
286
|
})) || [])], "chosenOptions");
|
|
243
287
|
if (isMobile ? closeOnSelectAllMobile : closeOnSelectAll) setIsOpen(false);
|
|
244
288
|
};
|
|
289
|
+
|
|
245
290
|
const unselectAllItems = () => {
|
|
246
291
|
setLocalOptionsStore({});
|
|
247
292
|
onChange(chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.filter(item => {
|
|
248
|
-
var _prepareOptions2;
|
|
249
|
-
|
|
293
|
+
var _prepareOptions2, _prepareOptions2$find;
|
|
294
|
+
|
|
295
|
+
return (_prepareOptions2 = prepareOptions(options)) === null || _prepareOptions2 === void 0 ? void 0 : (_prepareOptions2$find = _prepareOptions2.find(_ref6 => {
|
|
250
296
|
let {
|
|
251
297
|
value
|
|
252
298
|
} = _ref6;
|
|
253
299
|
return value === item;
|
|
254
|
-
})) === null || _prepareOptions2 === void 0 ? void 0 : _prepareOptions2.isFreezed;
|
|
300
|
+
})) === null || _prepareOptions2$find === void 0 ? void 0 : _prepareOptions2$find.isFreezed;
|
|
255
301
|
}), "chosenOptions");
|
|
256
302
|
if (isMobile ? closeOnRemoveAllMobile : closeOnRemoveAll) setIsOpen(false);
|
|
257
303
|
};
|
|
304
|
+
|
|
258
305
|
const getParentNode = () => {
|
|
259
306
|
var _ref7, _document$querySelect;
|
|
307
|
+
|
|
260
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");
|
|
261
309
|
};
|
|
310
|
+
|
|
262
311
|
const initListContainer = () => {
|
|
263
312
|
const dropdownList = document.createElement("div");
|
|
264
313
|
dropdownList.setAttribute("id", dropdownId);
|
|
265
314
|
dropdownList.classList.add("tags-dropdown__container");
|
|
315
|
+
|
|
266
316
|
if (isMobile) {
|
|
267
317
|
dropdownList.addEventListener("click", e => {
|
|
268
318
|
if (e.target.id === dropdownId) setIsOpen(false);
|
|
269
319
|
});
|
|
270
320
|
}
|
|
321
|
+
|
|
271
322
|
if (isMobile) {
|
|
272
323
|
var _getParentNode;
|
|
324
|
+
|
|
273
325
|
try {
|
|
274
326
|
var _document$getElementB;
|
|
275
|
-
|
|
276
|
-
// 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
|
|
277
329
|
} catch (e) {}
|
|
330
|
+
|
|
278
331
|
const dropdownMobileListWrapper = document.createElement("div");
|
|
279
332
|
dropdownMobileListWrapper.classList.add("tags-dropdown-mobile");
|
|
280
333
|
dropdownMobileListWrapper.setAttribute("id", "mlw-".concat(dropdownId));
|
|
281
|
-
dropdownMobileListWrapper === null || dropdownMobileListWrapper === void 0
|
|
282
|
-
(_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);
|
|
283
336
|
} else {
|
|
284
337
|
var _getParentNode2;
|
|
285
|
-
|
|
338
|
+
|
|
339
|
+
(_getParentNode2 = getParentNode()) === null || _getParentNode2 === void 0 ? void 0 : _getParentNode2.append(dropdownList);
|
|
286
340
|
}
|
|
287
341
|
};
|
|
342
|
+
|
|
288
343
|
const getListContainer = () => {
|
|
289
344
|
return document.getElementById(dropdownId);
|
|
290
345
|
};
|
|
346
|
+
|
|
291
347
|
const getListContainerWrapper = () => {
|
|
292
348
|
return document.getElementById("mlw-".concat(dropdownId));
|
|
293
349
|
};
|
|
350
|
+
|
|
294
351
|
const setListContainerStyles = () => {
|
|
295
|
-
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
|
+
|
|
296
354
|
const lc = getListContainer();
|
|
297
355
|
if (!lc || !isOpen) return false;
|
|
298
356
|
const windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
|
@@ -301,21 +359,21 @@ const TagsDropdown = _ref => {
|
|
|
301
359
|
height,
|
|
302
360
|
left,
|
|
303
361
|
top
|
|
304
|
-
} = (_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$ : {};
|
|
305
363
|
const sw = dropdownListWrapperRef === null || dropdownListWrapperRef === void 0 ? void 0 : dropdownListWrapperRef.current;
|
|
306
364
|
const dl = lc.getElementsByClassName("tags-dropdown__list")[0];
|
|
307
365
|
const lh = sw === null || sw === void 0 ? void 0 : sw.getElementsByClassName("tags-dropdown__header")[0];
|
|
308
366
|
const lf = sw === null || sw === void 0 ? void 0 : sw.getElementsByClassName("tags-dropdown__footer")[0];
|
|
309
|
-
const margin = parseInt((_getComputedStyle$mar = (_getComputedStyle = getComputedStyle(sw)) === null || _getComputedStyle === void 0
|
|
310
|
-
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);
|
|
311
369
|
if (initListHeight === null) setInitListHeight(maxHeight);
|
|
312
370
|
const toTop = top - margin;
|
|
313
371
|
const toBottom = windowHeight - top - height - margin * 2;
|
|
314
|
-
const dlHeight = dl === null || dl === void 0
|
|
315
|
-
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;
|
|
316
374
|
const controlsHeight = swHeight - dlHeight;
|
|
317
375
|
if (swHeight > maxHeight) swHeight = maxHeight - 2 * margin;
|
|
318
|
-
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;
|
|
319
377
|
const listPos = toTop < toBottom || toBottom >= swHeight ? "bottom" : "top";
|
|
320
378
|
if (swHeight > (listPos === "top" ? toTop : toBottom)) swHeight = (listPos === "top" ? toTop : toBottom) - 3 * margin;
|
|
321
379
|
lc.style.minWidth = "".concat(width, "px");
|
|
@@ -323,51 +381,62 @@ const TagsDropdown = _ref => {
|
|
|
323
381
|
lc.style.top = "".concat(listPos === "bottom" ? top + height : top - swHeight - 2 * margin, "px");
|
|
324
382
|
dl.style.maxHeight = "".concat(isMobile ? maxSwHeight : maxSwHeight - controlsHeight, "px");
|
|
325
383
|
};
|
|
384
|
+
|
|
326
385
|
const renderListContainer = () => {
|
|
327
386
|
const lc = getListContainer();
|
|
328
|
-
if (!lc) return null;
|
|
387
|
+
if (!lc) return null; // eslint-disable-next-line no-use-before-define
|
|
329
388
|
|
|
330
|
-
// eslint-disable-next-line no-use-before-define
|
|
331
389
|
return /*#__PURE__*/(0, _reactDom.createPortal)(getListMarkUp(), lc);
|
|
332
390
|
};
|
|
391
|
+
|
|
333
392
|
const isTargetInParent = target => {
|
|
334
393
|
var _target$className, _target$className$ind, _target$className2, _target$className2$in;
|
|
394
|
+
|
|
335
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;
|
|
336
|
-
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;
|
|
337
397
|
return false;
|
|
338
398
|
};
|
|
399
|
+
|
|
339
400
|
const isItemMatchesSearch = item => {
|
|
340
401
|
const title = item.title || item.label;
|
|
341
402
|
return searchValue.length ? title.toLowerCase().includes((searchValue === null || searchValue === void 0 ? void 0 : searchValue.toLowerCase()) || "") : true;
|
|
342
403
|
};
|
|
404
|
+
|
|
343
405
|
const getFilteredOptions = options => options === null || options === void 0 ? void 0 : options.reduce((result, option) => {
|
|
344
406
|
if (option.groupName) {
|
|
345
407
|
var _option$list;
|
|
346
|
-
|
|
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
|
+
|
|
347
411
|
if (filteredGroupItems !== null && filteredGroupItems !== void 0 && filteredGroupItems.length) {
|
|
348
|
-
result.push({
|
|
349
|
-
...option,
|
|
412
|
+
result.push({ ...option,
|
|
350
413
|
list: filteredGroupItems
|
|
351
414
|
});
|
|
352
415
|
}
|
|
353
416
|
} else if (isItemMatchesSearch(option)) {
|
|
354
417
|
result.push(option);
|
|
355
418
|
}
|
|
419
|
+
|
|
356
420
|
return result;
|
|
357
421
|
}, []);
|
|
422
|
+
|
|
358
423
|
const getTotalOptions = (0, _react.useCallback)(() => {
|
|
359
424
|
return options === null || options === void 0 ? void 0 : options.reduce((result, item) => {
|
|
360
425
|
if (item !== null && item !== void 0 && item.list) {
|
|
361
426
|
var _item$list2;
|
|
362
|
-
|
|
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;
|
|
363
429
|
} else {
|
|
364
430
|
++result;
|
|
365
431
|
}
|
|
432
|
+
|
|
366
433
|
return result;
|
|
367
434
|
}, 0);
|
|
368
435
|
}, [options]);
|
|
436
|
+
|
|
369
437
|
const getListMarkUp = () => {
|
|
370
438
|
var _filteredOptions$filt, _filteredOptions$filt2;
|
|
439
|
+
|
|
371
440
|
const filteredOptions = getFilteredOptions(options);
|
|
372
441
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
373
442
|
className: (0, _classnames.default)("".concat(RC, "__container-wrapper")),
|
|
@@ -417,9 +486,10 @@ const TagsDropdown = _ref => {
|
|
|
417
486
|
ref: dropdownListRef,
|
|
418
487
|
className: "".concat(RC, "__list ").concat(headerContent || isMobile ? "".concat(RC, "__list--with-header") : "", " ").concat(footerContent ? "".concat(RC, "__list--with-footer") : "")
|
|
419
488
|
}, filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.map(option => {
|
|
420
|
-
var _option$groupName, _option$list2;
|
|
489
|
+
var _option$groupName, _option$groupName$toS, _option$list2;
|
|
490
|
+
|
|
421
491
|
return option.groupName ? /*#__PURE__*/_react.default.createElement("div", {
|
|
422
|
-
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()),
|
|
423
493
|
className: (0, _classnames.default)("".concat(RC, "-group"), option.className)
|
|
424
494
|
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
425
495
|
className: "".concat(RC, "-group__name")
|
|
@@ -445,11 +515,14 @@ const TagsDropdown = _ref => {
|
|
|
445
515
|
onClick: () => setIsOpen(false)
|
|
446
516
|
}, "Apply", chosenOptions !== null && chosenOptions !== void 0 && chosenOptions.length ? "(".concat(chosenOptions === null || chosenOptions === void 0 ? void 0 : chosenOptions.length, ")") : "")) : null));
|
|
447
517
|
};
|
|
518
|
+
|
|
448
519
|
const closeList = e => {
|
|
449
520
|
var _inputRef$current;
|
|
521
|
+
|
|
450
522
|
handleClickOutside(e);
|
|
451
|
-
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();
|
|
452
524
|
};
|
|
525
|
+
|
|
453
526
|
(0, _react.useLayoutEffect)(() => {
|
|
454
527
|
initListContainer();
|
|
455
528
|
}, []);
|
|
@@ -463,6 +536,7 @@ const TagsDropdown = _ref => {
|
|
|
463
536
|
window.removeEventListener("mousewheel", closeList);
|
|
464
537
|
window.removeEventListener("mouseup", handleClickOutside);
|
|
465
538
|
}
|
|
539
|
+
|
|
466
540
|
return () => {
|
|
467
541
|
window.removeEventListener("resize", setListContainerStyles);
|
|
468
542
|
window.removeEventListener("mousewheel", closeList);
|
|
@@ -471,73 +545,89 @@ const TagsDropdown = _ref => {
|
|
|
471
545
|
}, [getListContainer]);
|
|
472
546
|
(0, _react.useLayoutEffect)(() => {
|
|
473
547
|
setListContainerStyles();
|
|
474
|
-
}, [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]);
|
|
475
549
|
(0, _react.useEffect)(() => {
|
|
476
550
|
if (!isMobile) {
|
|
477
551
|
document.addEventListener("click", handleClickOutside, true);
|
|
478
552
|
} else {
|
|
479
553
|
document.removeEventListener("click", handleClickOutside, true);
|
|
480
554
|
}
|
|
555
|
+
|
|
481
556
|
return () => document.removeEventListener("click", handleClickOutside, true);
|
|
482
557
|
}, [isMobile]);
|
|
483
558
|
(0, _react.useEffect)(() => {
|
|
484
559
|
var _selectAllButtonRef$c, _unselectAllButtonRef;
|
|
560
|
+
|
|
485
561
|
const fn = isOpen ? "addEventListener" : "removeEventListener";
|
|
486
|
-
selectAllButtonRef === null || selectAllButtonRef === void 0
|
|
487
|
-
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
|
+
|
|
488
565
|
if (isOpen) {
|
|
489
566
|
var _getListContainer2;
|
|
490
|
-
|
|
567
|
+
|
|
568
|
+
(_getListContainer2 = getListContainer()) === null || _getListContainer2 === void 0 ? void 0 : _getListContainer2.classList.add("tags-dropdown__container--opened");
|
|
491
569
|
} else {
|
|
492
570
|
var _getListContainer3;
|
|
493
|
-
|
|
571
|
+
|
|
572
|
+
(_getListContainer3 = getListContainer()) === null || _getListContainer3 === void 0 ? void 0 : _getListContainer3.classList.remove("tags-dropdown__container--opened");
|
|
494
573
|
}
|
|
495
574
|
}, [isOpen]);
|
|
496
575
|
(0, _react.useEffect)(() => {
|
|
497
576
|
if (isOpen && isMobile, dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
498
577
|
var _dropdownListRef$curr, _dropdownListRef$curr2;
|
|
499
|
-
|
|
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
|
+
|
|
500
581
|
if (isScrollableList === null) {
|
|
501
582
|
var _dropdownListRef$curr3, _dropdownListRef$curr4;
|
|
502
|
-
|
|
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));
|
|
503
585
|
}
|
|
504
586
|
}
|
|
587
|
+
|
|
505
588
|
if (isOpen && dropdownListRef && dropdownListRef.current) {
|
|
506
589
|
dropdownListRef.current.addEventListener("scroll", doScrollCallback);
|
|
507
590
|
}
|
|
591
|
+
|
|
508
592
|
return () => {
|
|
509
593
|
removeEventListener("scroll", doScrollCallback);
|
|
510
594
|
};
|
|
511
|
-
}, [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]);
|
|
512
596
|
(0, _react.useEffect)(() => {
|
|
513
597
|
const setScrollTopValue = e => {
|
|
514
598
|
setScrollTop(parseInt(e.target.scrollTop, 10));
|
|
515
599
|
};
|
|
600
|
+
|
|
516
601
|
if (isOpen && isMobile && dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
517
602
|
var _dropdownListRef$curr7;
|
|
518
|
-
|
|
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);
|
|
519
605
|
}
|
|
606
|
+
|
|
520
607
|
return () => {
|
|
521
608
|
var _dropdownListRef$curr8;
|
|
522
|
-
|
|
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);
|
|
523
611
|
};
|
|
524
612
|
}, [isOpen, isMobile, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current]);
|
|
525
613
|
(0, _react.useEffect)(() => {
|
|
526
614
|
if (dropdownListRef !== null && dropdownListRef !== void 0 && dropdownListRef.current) {
|
|
527
615
|
var _dropdownListRef$curr9, _dropdownListRef$curr10;
|
|
528
|
-
|
|
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));
|
|
529
618
|
}
|
|
530
619
|
}, [scrollTop, dropdownListRef === null || dropdownListRef === void 0 ? void 0 : dropdownListRef.current]);
|
|
531
620
|
(0, _react.useEffect)(() => {
|
|
532
621
|
return () => {
|
|
533
622
|
var _getListContainer4, _getListContainerWrap;
|
|
534
|
-
|
|
535
|
-
(
|
|
623
|
+
|
|
624
|
+
(_getListContainer4 = getListContainer()) === null || _getListContainer4 === void 0 ? void 0 : _getListContainer4.remove();
|
|
625
|
+
(_getListContainerWrap = getListContainerWrapper()) === null || _getListContainerWrap === void 0 ? void 0 : _getListContainerWrap.remove();
|
|
536
626
|
};
|
|
537
627
|
}, []);
|
|
538
628
|
(0, _react.useEffect)(() => {
|
|
539
629
|
if (isSearchable && useLiveSearch && debouncedSearchTerm || isValueDeleted) {
|
|
540
|
-
doLiveSearchRequest === null || doLiveSearchRequest === void 0
|
|
630
|
+
doLiveSearchRequest === null || doLiveSearchRequest === void 0 ? void 0 : doLiveSearchRequest(debouncedSearchTerm);
|
|
541
631
|
}
|
|
542
632
|
}, [debouncedSearchTerm, isValueDeleted]);
|
|
543
633
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -591,7 +681,8 @@ const TagsDropdown = _ref => {
|
|
|
591
681
|
onKeyDown: e => onKeyPress(e, searchValue),
|
|
592
682
|
onFocus: e => {
|
|
593
683
|
var _e$target;
|
|
594
|
-
|
|
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();
|
|
595
686
|
}
|
|
596
687
|
}, attributesOfNativeInput)) : "", isOpen && renderListContainer(), /*#__PURE__*/_react.default.createElement("span", {
|
|
597
688
|
className: (0, _classnames.default)("".concat(RC, "__arrow"), {
|
|
@@ -605,4 +696,6 @@ const TagsDropdown = _ref => {
|
|
|
605
696
|
className: "color--text"
|
|
606
697
|
}))));
|
|
607
698
|
};
|
|
608
|
-
|
|
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;
|