intelicoreact 1.6.20 → 1.6.21
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 +1 -102
- package/dist/Atomic/FormElements/AdvancedStatus/AdvancedStatus.js +1 -89
- package/dist/Atomic/FormElements/Calendar/Calendar.js +1 -232
- package/dist/Atomic/FormElements/Calendar/Calendar.props.js +1 -3
- package/dist/Atomic/FormElements/CheckboxInput/CheckboxInput.js +1 -101
- package/dist/Atomic/FormElements/CheckboxesLine/CheckboxesLine.js +1 -70
- package/dist/Atomic/FormElements/Datepicker/Datepicker.js +1 -350
- package/dist/Atomic/FormElements/Datepicker/Datepicker.props.js +1 -3
- package/dist/Atomic/FormElements/Datepicker/components/DatepickerCalendar.js +1 -177
- package/dist/Atomic/FormElements/Datepicker/components/DatepickerCalendar.props.js +1 -3
- package/dist/Atomic/FormElements/Dropdown/Dropdown.js +1 -561
- package/dist/Atomic/FormElements/Dropdown/components/DropdownLoader.js +1 -20
- package/dist/Atomic/FormElements/DropdownLiveSearch/DropdownLiveSearch.js +1 -405
- package/dist/Atomic/FormElements/FileLoader/FileLoader.js +1 -94
- package/dist/Atomic/FormElements/FileLoader/partial/LoadZone.js +1 -105
- package/dist/Atomic/FormElements/FileLoader/partial/LoadedContent.js +1 -67
- package/dist/Atomic/FormElements/FileLoaderDescription/FileLoaderDescription.js +1 -247
- package/dist/Atomic/FormElements/FileLoaderLocal/FileLoaderLocal.js +1 -160
- package/dist/Atomic/FormElements/FileLoaderLocalGroup/FileLoaderLocalGroup.js +1 -193
- package/dist/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN.js +1 -135
- package/dist/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN_old.js +1 -116
- package/dist/Atomic/FormElements/Input/Input.js +1 -467
- package/dist/Atomic/FormElements/InputCalendar/InputCalendar.js +1 -161
- package/dist/Atomic/FormElements/InputColor/InputColor.js +1 -64
- package/dist/Atomic/FormElements/InputCurrency/InputCurrency.js +1 -166
- package/dist/Atomic/FormElements/InputDateRange/InputDateRange.js +1 -354
- package/dist/Atomic/FormElements/InputDateRange/components/DateInput.js +1 -71
- package/dist/Atomic/FormElements/InputDateRange/components/Datepicker.js +1 -693
- package/dist/Atomic/FormElements/InputDateRange/components/OpenedPart.js +1 -254
- package/dist/Atomic/FormElements/InputDateRange/components/SelectItem.js +1 -32
- package/dist/Atomic/FormElements/InputDateRange/dependencies.js +1 -200
- package/dist/Atomic/FormElements/InputLink/InputLink.js +1 -99
- package/dist/Atomic/FormElements/InputMask/InputCarretPosition.js +1 -37
- package/dist/Atomic/FormElements/InputMask/InputMask.js +1 -1214
- package/dist/Atomic/FormElements/InputMask/config.js +1 -15
- package/dist/Atomic/FormElements/InputMask/functions.js +1 -58
- package/dist/Atomic/FormElements/InputMask2/InputMask2.js +1 -674
- package/dist/Atomic/FormElements/InputMask2/config.js +1 -15
- package/dist/Atomic/FormElements/InputMask2/functions.js +1 -58
- package/dist/Atomic/FormElements/InputMask3/InputMask3.js +1 -766
- package/dist/Atomic/FormElements/InputMask3/config.js +1 -15
- package/dist/Atomic/FormElements/InputMask3/functions.js +1 -58
- package/dist/Atomic/FormElements/InputWithAction/InputWithAction.js +1 -114
- package/dist/Atomic/FormElements/InputsRow/InputsRow.js +1 -140
- package/dist/Atomic/FormElements/Label/Label.js +1 -82
- package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.js +1 -506
- package/dist/Atomic/FormElements/MultiSelect/MultiSelect.js +1 -45
- package/dist/Atomic/FormElements/NumericInput/NumericInput.js +1 -331
- package/dist/Atomic/FormElements/RadioGroup/RadioGroup.js +1 -66
- package/dist/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.js +1 -80
- package/dist/Atomic/FormElements/RadioInput/RadioInput.js +1 -64
- package/dist/Atomic/FormElements/RadioRowSwitcher/RadioRowSwitcher.js +1 -54
- package/dist/Atomic/FormElements/RangeCalendar/RangeCalendar.js +1 -183
- package/dist/Atomic/FormElements/RangeInputs/RangeInputs.js +1 -209
- package/dist/Atomic/FormElements/RangeList/RangeList.js +1 -175
- package/dist/Atomic/FormElements/RangeList/partial/RangeListRow.js +1 -43
- package/dist/Atomic/FormElements/RangeSlider/RangeSlider.js +1 -443
- package/dist/Atomic/FormElements/RangeSlider2/RangeSlider2.js +1 -858
- package/dist/Atomic/FormElements/SwitchableRow/SwitchableRow.js +1 -39
- package/dist/Atomic/FormElements/Switcher/Switcher.js +1 -59
- package/dist/Atomic/FormElements/SwitcherCheckbox/SwitcherCheckbox.js +1 -50
- package/dist/Atomic/FormElements/SwitcherHide/SwitcherHide.js +1 -47
- package/dist/Atomic/FormElements/SwitcherRadio/SwitcherRadio.js +1 -96
- package/dist/Atomic/FormElements/SwitcherRange/SwitcherRange.js +1 -40
- package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.js +1 -64
- package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.js +1 -170
- package/dist/Atomic/FormElements/SwitcherTagsDropdown/partial/States.js +1 -202
- package/dist/Atomic/FormElements/SwitcherTextarea/SwitcherTextarea.js +1 -67
- package/dist/Atomic/FormElements/TagListToDropdown/TagListToDropdown.js +1 -115
- package/dist/Atomic/FormElements/TagsDropdown/TagsDropdown.js +1 -826
- package/dist/Atomic/FormElements/Text/Text.js +1 -125
- package/dist/Atomic/FormElements/TextSwitcher/TextSwitcher.js +1 -45
- package/dist/Atomic/FormElements/Textarea/Textarea.js +1 -80
- package/dist/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.js +1 -176
- package/dist/Atomic/FormElements/TieredCheckboxes/partial/AccordionWithCheckbox.js +1 -62
- package/dist/Atomic/FormElements/TimeRange/TimeRange.js +1 -127
- package/dist/Atomic/FormElements/UserContacts/UserContacts.js +1 -220
- package/dist/Atomic/FormElements/VariantsListRadio/VariantsListRadio.js +1 -83
- package/dist/Atomic/FormElements/VariantsListRadio/partials/VariantsListRadioItem.js +1 -82
- package/dist/Atomic/FormElements/WidgetPseudoTable/WidgetPseudoTable.js +1 -101
- package/dist/Atomic/FormElements/WidgetPseudoTable/partial/constructor.js +1 -29
- package/dist/Atomic/FormElements/WidgetWithSwitchableRows/WidgetWithSwitchableRows.js +1 -113
- package/dist/Atomic/FormElements/WidgetWithSwitchableRows/partial/constructor.js +1 -30
- package/dist/Atomic/Layout/Header/Header.js +1 -85
- package/dist/Atomic/Layout/Spinner/Spinner.js +1 -39
- package/dist/Atomic/UI/Accordion/Accordion.js +1 -118
- package/dist/Atomic/UI/Accordion/AccordionItem.js +1 -181
- package/dist/Atomic/UI/AccordionTable/AccordionTable.js +1 -238
- package/dist/Atomic/UI/AccordionText/AccordionText.js +1 -69
- package/dist/Atomic/UI/AdvancedTag/AdvTag.js +1 -207
- package/dist/Atomic/UI/AdvancedTag/AdvancedTags.js +1 -56
- package/dist/Atomic/UI/Alert/Alert.js +1 -72
- package/dist/Atomic/UI/Arrow/Arrow.js +1 -132
- package/dist/Atomic/UI/Box/Box.js +1 -52
- package/dist/Atomic/UI/Button/Button.js +1 -89
- package/dist/Atomic/UI/ButtonsBar/ButtonsBar.js +1 -72
- package/dist/Atomic/UI/Chart/Chart.js +1 -172
- package/dist/Atomic/UI/Chart/partial/Chart.constants.js +1 -95
- package/dist/Atomic/UI/Chart/partial/ChartTypeSwitcherIcon/ChartTypeSwitcherIcon.js +1 -80
- package/dist/Atomic/UI/Chart/partial/datasetSetters.js +1 -188
- package/dist/Atomic/UI/Chart/partial/optionsConstructor.js +1 -335
- package/dist/Atomic/UI/Chart/partial/optionsSetters.js +1 -43
- package/dist/Atomic/UI/Chart/partial/utils.js +1 -60
- package/dist/Atomic/UI/CircleProgressBar/CircleProgressBar.js +1 -109
- package/dist/Atomic/UI/DateTime/DateTime.js +1 -57
- package/dist/Atomic/UI/DebugContainer/DebugContainer.js +1 -44
- package/dist/Atomic/UI/DebugContainer/useDebugContainer.js +1 -15
- package/dist/Atomic/UI/DoubleString/DoubleString.js +1 -102
- package/dist/Atomic/UI/DynamicIcon/DynamicIcon.js +1 -226
- package/dist/Atomic/UI/ExampleChartIntegration/ExampleChartIntegration.js +1 -221
- package/dist/Atomic/UI/ExampleChartIntegration/partial/utils.js +1 -106
- package/dist/Atomic/UI/Hint/Hint.js +1 -193
- package/dist/Atomic/UI/Hint/partials/_utils.js +1 -51
- package/dist/Atomic/UI/Modal/Modal.js +1 -188
- package/dist/Atomic/UI/Modal/ModalHOC.js +1 -72
- package/dist/Atomic/UI/Modal/partials/ModalFooter.js +1 -46
- package/dist/Atomic/UI/Modal/partials/ModalTitle.js +1 -83
- package/dist/Atomic/UI/Modal/partials/useMobileModal.js +1 -200
- package/dist/Atomic/UI/MonoAccordion/MonoAccordion._test.js +1 -75
- package/dist/Atomic/UI/MonoAccordion/MonoAccordion.js +1 -80
- package/dist/Atomic/UI/NavLine/NavLine.js +1 -293
- package/dist/Atomic/UI/PageTitle/PageTitle.js +1 -75
- package/dist/Atomic/UI/PieChart/PieChart.js +1 -42
- package/dist/Atomic/UI/Price/Price.js +1 -22
- package/dist/Atomic/UI/PriceRange/PriceRange.js +1 -36
- package/dist/Atomic/UI/ProgressLine/ProgressLine.js +1 -71
- package/dist/Atomic/UI/Status/Status.js +1 -59
- package/dist/Atomic/UI/Table/Partials/TdCell.js +1 -87
- package/dist/Atomic/UI/Table/Partials/TdHeader.js +1 -38
- package/dist/Atomic/UI/Table/Partials/TdRow.js +1 -99
- package/dist/Atomic/UI/Table/Partials/TdTitle.js +1 -52
- package/dist/Atomic/UI/Table/Table.js +1 -63
- package/dist/Atomic/UI/Table/TdTypes/TdActions.js +1 -80
- package/dist/Atomic/UI/Table/TdTypes/TdPriority.js +1 -28
- package/dist/Atomic/UI/Table/TdTypes/TdRange.js +1 -13
- package/dist/Atomic/UI/Table/TdTypes/TdWeight.js +1 -53
- package/dist/Atomic/UI/Tag/Tag.js +1 -160
- package/dist/Atomic/UI/TagList/TagList.js +1 -251
- package/dist/Atomic/UI/UserBox/UserBox.js +1 -73
- package/dist/Atomic/UI/WizardStepper/constructor.js +1 -84
- package/dist/Atomic/UI/WizardStepper/index.js +1 -3
- package/dist/Atomic/UI/WizardStepper/ui/StateIcon/StateIcon.js +1 -37
- package/dist/Atomic/UI/WizardStepper/ui/StateIcon/index.js +1 -3
- package/dist/Atomic/UI/WizardStepper/ui/StepRow/StepRow.js +1 -61
- package/dist/Atomic/UI/WizardStepper/ui/StepRow/index.js +1 -3
- package/dist/Atomic/UI/WizardStepper/ui/StepWrapper/StepWrapper.js +1 -39
- package/dist/Atomic/UI/WizardStepper/ui/StepWrapper/index.js +1 -3
- package/dist/Atomic/UI/WizardStepper/ui/icons.js +1 -49
- package/dist/Atomic/UI/WizardStepper/ui/index.js +1 -3
- package/dist/Classes/AbortableFetch.js +1 -454
- package/dist/Classes/AnimatedHandler.js +1 -47
- package/dist/Classes/RESTAPI/index.js +1 -228
- package/dist/Classes/RESTAPI/partials/AbortableFetch.js +1 -457
- package/dist/Classes/RESTAPI/partials/ApiBase.js +1 -48
- package/dist/Classes/RESTAPI/partials/ApiRequestCreators.js +1 -112
- package/dist/Classes/RESTAPI/partials/ApiUtils.js +1 -189
- package/dist/Classes/RESTAPI/partials/CredentialsProcessing.js +1 -252
- package/dist/Classes/RESTAPI/partials/Utils.js +1 -92
- package/dist/Classes/RESTAPI/partials/_outerDependencies.js +1 -3
- package/dist/Classes/RESTAPI/partials/_utils.js +1 -197
- package/dist/Constants/index.constants.js +1 -78
- package/dist/Functions/Portal.js +1 -22
- package/dist/Functions/customEventListener.js +1 -96
- package/dist/Functions/dateTime.js +1 -149
- package/dist/Functions/fieldValueFormatters.js +1 -405
- package/dist/Functions/guards/assertions.js +1 -66
- package/dist/Functions/guards/safeValue.js +1 -30
- package/dist/Functions/guards/typeGuards.js +1 -116
- package/dist/Functions/hooks/useFormFieldsChangesManager.js +1 -95
- package/dist/Functions/locale/createTranslator.js +1 -32
- package/dist/Functions/operations.js +1 -130
- package/dist/Functions/presets/inputMaskPresets.js +1 -170
- package/dist/Functions/presets/inputPresets.js +1 -60
- package/dist/Functions/presets/mobileKeyboardTypesPresets.js +1 -45
- package/dist/Functions/schemas.js +1 -31
- package/dist/Functions/useBodyScrollLock.js +1 -17
- package/dist/Functions/useClickOutside.js +1 -15
- package/dist/Functions/useDebounce.js +1 -17
- package/dist/Functions/useFieldFocus.js +1 -84
- package/dist/Functions/useFormTools/form-drivers/ArrayWithObjects.js +1 -39
- package/dist/Functions/useFormTools/form-drivers/ObjectWithIterableObjects.js +1 -159
- package/dist/Functions/useFormTools/form-drivers/ObjectWithNamedKeyObjects.js +1 -78
- package/dist/Functions/useFormTools/functions/General.js +1 -134
- package/dist/Functions/useFormTools/functions/RenderFields.js +1 -111
- package/dist/Functions/useFormTools/functions/usePrevious.js +1 -12
- package/dist/Functions/useFormTools/index.js +1 -778
- package/dist/Functions/useInputHighlightError.js +1 -67
- package/dist/Functions/useIsMobile/useIsMobile.js +1 -53
- package/dist/Functions/useKeyPress/useHandleKeyPress.js +1 -21
- package/dist/Functions/useKeyPress/useKeyPress.js +1 -75
- package/dist/Functions/useLocalStorage.js +1 -34
- package/dist/Functions/useLocationParams.js +1 -27
- package/dist/Functions/useMediaQuery.js +1 -17
- package/dist/Functions/useMetaInfo.js +1 -43
- package/dist/Functions/useMouseUpOutside.js +1 -16
- package/dist/Functions/useOnlineStatus.js +1 -29
- package/dist/Functions/usePasswordChecker.js +1 -110
- package/dist/Functions/usePrevious.js +1 -12
- package/dist/Functions/useResize.js +1 -31
- package/dist/Functions/useScrollTo.js +1 -17
- package/dist/Functions/useToggle.js +1 -17
- package/dist/Functions/utils.js +1 -522
- package/dist/Langs.js +1 -168
- package/dist/Molecular/CustomIcons/components/AffiliateNetworks.js +1 -21
- package/dist/Molecular/CustomIcons/components/AlertCircle.js +1 -23
- package/dist/Molecular/CustomIcons/components/AppStore.js +1 -29
- package/dist/Molecular/CustomIcons/components/Arrow.js +1 -32
- package/dist/Molecular/CustomIcons/components/ArrowDown.js +1 -17
- package/dist/Molecular/CustomIcons/components/ArrowLeft.js +1 -22
- package/dist/Molecular/CustomIcons/components/ArrowRight.js +1 -22
- package/dist/Molecular/CustomIcons/components/ArrowUp.js +1 -17
- package/dist/Molecular/CustomIcons/components/Bell.js +1 -15
- package/dist/Molecular/CustomIcons/components/Button.js +1 -12
- package/dist/Molecular/CustomIcons/components/Campaigns.js +1 -16
- package/dist/Molecular/CustomIcons/components/Check.js +1 -14
- package/dist/Molecular/CustomIcons/components/Check2.js +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronDown.js +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronDownDisabled.js +1 -11
- package/dist/Molecular/CustomIcons/components/ChevronLeft.js +1 -11
- package/dist/Molecular/CustomIcons/components/ChevronRight.js +1 -11
- package/dist/Molecular/CustomIcons/components/ChevronUp.js +1 -11
- package/dist/Molecular/CustomIcons/components/ChevronUpDown.js +1 -27
- package/dist/Molecular/CustomIcons/components/Close.js +1 -14
- package/dist/Molecular/CustomIcons/components/ColumnsOrder.js +1 -17
- package/dist/Molecular/CustomIcons/components/Delete.js +1 -16
- package/dist/Molecular/CustomIcons/components/Edit.js +1 -15
- package/dist/Molecular/CustomIcons/components/Email.js +1 -31
- package/dist/Molecular/CustomIcons/components/FinturfLogo.js +1 -18
- package/dist/Molecular/CustomIcons/components/FinturfLogo2.js +1 -35
- package/dist/Molecular/CustomIcons/components/Flows.js +1 -15
- package/dist/Molecular/CustomIcons/components/Gift.js +1 -25
- package/dist/Molecular/CustomIcons/components/GoogleAuth.js +1 -29
- package/dist/Molecular/CustomIcons/components/GooglePlay.js +1 -29
- package/dist/Molecular/CustomIcons/components/HelpCircle.js +1 -19
- package/dist/Molecular/CustomIcons/components/HelpCircle2.js +1 -20
- package/dist/Molecular/CustomIcons/components/HelpCircleFilled.js +1 -19
- package/dist/Molecular/CustomIcons/components/Home.js +1 -16
- package/dist/Molecular/CustomIcons/components/Home2.js +1 -22
- package/dist/Molecular/CustomIcons/components/Key.js +1 -23
- package/dist/Molecular/CustomIcons/components/Landers.js +1 -20
- package/dist/Molecular/CustomIcons/components/Lock.js +1 -15
- package/dist/Molecular/CustomIcons/components/Mail.js +1 -26
- package/dist/Molecular/CustomIcons/components/Mastercard.js +1 -73
- package/dist/Molecular/CustomIcons/components/Minus.js +1 -25
- package/dist/Molecular/CustomIcons/components/Offers.js +1 -16
- package/dist/Molecular/CustomIcons/components/Pause.js +1 -28
- package/dist/Molecular/CustomIcons/components/PayPal.js +1 -41
- package/dist/Molecular/CustomIcons/components/PayPalLightLarge.js +1 -28
- package/dist/Molecular/CustomIcons/components/Phone.js +1 -30
- package/dist/Molecular/CustomIcons/components/Play.js +1 -25
- package/dist/Molecular/CustomIcons/components/Plus.js +1 -25
- package/dist/Molecular/CustomIcons/components/Profile.js +1 -16
- package/dist/Molecular/CustomIcons/components/QRCode.js +1 -29
- package/dist/Molecular/CustomIcons/components/Rectangle.js +1 -12
- package/dist/Molecular/CustomIcons/components/Revert.js +1 -13
- package/dist/Molecular/CustomIcons/components/Star.js +1 -14
- package/dist/Molecular/CustomIcons/components/Star2.js +1 -16
- package/dist/Molecular/CustomIcons/components/TrafficSources.js +1 -14
- package/dist/Molecular/CustomIcons/components/Trash.js +1 -15
- package/dist/Molecular/CustomIcons/components/TrashRed.js +1 -15
- package/dist/Molecular/CustomIcons/components/Triggers.js +1 -15
- package/dist/Molecular/CustomIcons/components/User.js +1 -25
- package/dist/Molecular/CustomIcons/components/Visa.js +1 -31
- package/dist/Molecular/CustomIcons/components/X.js +1 -12
- package/dist/Molecular/CustomIcons/index.js +1 -61
- package/dist/Molecular/FormElement/FormElement.js +1 -54
- package/dist/Molecular/FormWithDependOn/FormWithDependOn.js +1 -184
- package/dist/Molecular/FormWithDependOn/partials/_utils.js +1 -53
- package/dist/Molecular/InputAddress/InputAddress.js +1 -620
- package/dist/Molecular/InputPassword/InputPassword.js +1 -48
- package/dist/index.js +1 -1
- package/package.json +1 -1
|
@@ -1,238 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import cn from "classnames";
|
|
4
|
-
import { ArrowDown, ArrowUp, ChevronDown, Tag } from "react-feather";
|
|
5
|
-
|
|
6
|
-
import MonoAccordion from "../MonoAccordion/MonoAccordion";
|
|
7
|
-
|
|
8
|
-
import "./AccordionTable.scss";
|
|
9
|
-
|
|
10
|
-
const AccordionTable = ({
|
|
11
|
-
className,
|
|
12
|
-
header,
|
|
13
|
-
items,
|
|
14
|
-
onChange,
|
|
15
|
-
testId,
|
|
16
|
-
onSort = () => {},
|
|
17
|
-
sortParams,
|
|
18
|
-
}) => {
|
|
19
|
-
const [accordions, setAccordions] = useState(items);
|
|
20
|
-
|
|
21
|
-
const sortedColClassName = (item) =>
|
|
22
|
-
cn(
|
|
23
|
-
"accordion-table__header-item",
|
|
24
|
-
item.className,
|
|
25
|
-
{
|
|
26
|
-
"accordion-table--sorted-col":
|
|
27
|
-
sortParams && sortParams.key === item.key,
|
|
28
|
-
},
|
|
29
|
-
{ "accordion-table__header-item-sortable": !item.noSort },
|
|
30
|
-
);
|
|
31
|
-
|
|
32
|
-
const handle = {
|
|
33
|
-
accordionChange: (key, e) => {
|
|
34
|
-
const newArr = accordions?.map((item) => {
|
|
35
|
-
if (item.key === key) {
|
|
36
|
-
return {
|
|
37
|
-
...item,
|
|
38
|
-
isOpen: !item.isOpen,
|
|
39
|
-
};
|
|
40
|
-
}
|
|
41
|
-
return item;
|
|
42
|
-
});
|
|
43
|
-
const isArrowSvg = e?.target?.tagName === "svg";
|
|
44
|
-
const isAccordionElement =
|
|
45
|
-
e.target.className?.includes?.("accordion-table");
|
|
46
|
-
if (isAccordionElement || isArrowSvg) {
|
|
47
|
-
onChange(newArr);
|
|
48
|
-
setAccordions(newArr);
|
|
49
|
-
}
|
|
50
|
-
},
|
|
51
|
-
|
|
52
|
-
setSort: (key) => {
|
|
53
|
-
let newSorting;
|
|
54
|
-
if (key !== sortParams.key) newSorting = { key: key, direction: "DESC" };
|
|
55
|
-
else {
|
|
56
|
-
newSorting = {
|
|
57
|
-
key,
|
|
58
|
-
direction: sortParams.direction === "ASC" ? "DESC" : "ASC",
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
onSort(newSorting);
|
|
62
|
-
},
|
|
63
|
-
};
|
|
64
|
-
|
|
65
|
-
const getHeaderItem = (key) => {
|
|
66
|
-
return header?.find((item) => item.key === key);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
const renderTd = (tr) => {
|
|
70
|
-
return Object.entries(tr)?.map(([key, value]) => {
|
|
71
|
-
return key === "promoDetails" || key === "disclosure" ? null : (
|
|
72
|
-
<div
|
|
73
|
-
key={key}
|
|
74
|
-
style={{ flexBasis: `${getHeaderItem(key)?.width}%` }}
|
|
75
|
-
className={cn(
|
|
76
|
-
"accordion-table__td",
|
|
77
|
-
`accordion-table__td--${key}`,
|
|
78
|
-
getHeaderItem(key)?.className,
|
|
79
|
-
)}
|
|
80
|
-
>
|
|
81
|
-
<p
|
|
82
|
-
className="accordion-table__statistics-td-value"
|
|
83
|
-
title={typeof value !== "object" ? value : value.value}
|
|
84
|
-
>
|
|
85
|
-
{typeof value !== "object" ? value : value.value}
|
|
86
|
-
</p>
|
|
87
|
-
</div>
|
|
88
|
-
);
|
|
89
|
-
});
|
|
90
|
-
};
|
|
91
|
-
|
|
92
|
-
const renderTr = (rows) => {
|
|
93
|
-
return rows?.map((row, index) => {
|
|
94
|
-
return (
|
|
95
|
-
<div
|
|
96
|
-
key={index}
|
|
97
|
-
className={cn(
|
|
98
|
-
"accordion-table__tr",
|
|
99
|
-
{
|
|
100
|
-
"accordion-table__tr-with-promo":
|
|
101
|
-
row.promoDetails || row.cols?.promoDetails,
|
|
102
|
-
},
|
|
103
|
-
row.className,
|
|
104
|
-
)}
|
|
105
|
-
>
|
|
106
|
-
<div className="df w100">{renderTd(row.cols || row)}</div>
|
|
107
|
-
{row.promoDetails || row.cols?.promoDetails ? (
|
|
108
|
-
<div className="accordion-table__tr-promo-wrapper">
|
|
109
|
-
<div className="accordion-table__tr-promo">
|
|
110
|
-
<Tag className="tr-promo-icon" width={16} height={16} />
|
|
111
|
-
<span className="tr-promo-label">PROMOTION</span>
|
|
112
|
-
{row.promoDetails || row.cols?.promoDetails}
|
|
113
|
-
</div>
|
|
114
|
-
</div>
|
|
115
|
-
) : null}
|
|
116
|
-
|
|
117
|
-
{row.disclosure || row.cols?.disclosure ? (
|
|
118
|
-
<div className="accordion-table__tr-promo-wrapper">
|
|
119
|
-
<div className="accordion-table__tr-promo accordion-table__tr-promo-disclosure">
|
|
120
|
-
{row.disclosure || row.cols?.disclosure}
|
|
121
|
-
</div>
|
|
122
|
-
</div>
|
|
123
|
-
) : null}
|
|
124
|
-
</div>
|
|
125
|
-
);
|
|
126
|
-
});
|
|
127
|
-
};
|
|
128
|
-
|
|
129
|
-
const defineAccordionTitle = (row) => {
|
|
130
|
-
return (
|
|
131
|
-
<div
|
|
132
|
-
onClick={(e) => handle.accordionChange(row.key, e)}
|
|
133
|
-
className="accordion-table__accordion-label-box"
|
|
134
|
-
>
|
|
135
|
-
<div className="accordion-table__accordion-label-wrapper j4">
|
|
136
|
-
<ChevronDown
|
|
137
|
-
width={8}
|
|
138
|
-
height={4}
|
|
139
|
-
className={cn("accordion-label-box__icon", {
|
|
140
|
-
"accordion-label-box__icon--open": row.isOpen,
|
|
141
|
-
})}
|
|
142
|
-
/>
|
|
143
|
-
<span className="accordion-label-box__label">{row.label}</span>
|
|
144
|
-
{row.statistics && (
|
|
145
|
-
<div className={cn("accordion-table__tr", row.className)}>
|
|
146
|
-
{Object.entries(row.statistics).map(([key, value]) => {
|
|
147
|
-
return (
|
|
148
|
-
<div
|
|
149
|
-
key={key}
|
|
150
|
-
style={{ width: `${getHeaderItem(key)?.width}%` }}
|
|
151
|
-
className={cn(
|
|
152
|
-
"accordion-table__statistics-td",
|
|
153
|
-
getHeaderItem(key)?.className,
|
|
154
|
-
)}
|
|
155
|
-
>
|
|
156
|
-
<div className="accordion-table__statistics-td-value-wrapper">
|
|
157
|
-
{key === "status" ? (
|
|
158
|
-
<div className="accordion-table__statistics-td-value">
|
|
159
|
-
{value}
|
|
160
|
-
</div>
|
|
161
|
-
) : (
|
|
162
|
-
<p
|
|
163
|
-
className="accordion-table__statistics-td-value"
|
|
164
|
-
title={value}
|
|
165
|
-
>
|
|
166
|
-
{value}
|
|
167
|
-
</p>
|
|
168
|
-
)}
|
|
169
|
-
</div>
|
|
170
|
-
</div>
|
|
171
|
-
);
|
|
172
|
-
})}
|
|
173
|
-
</div>
|
|
174
|
-
)}
|
|
175
|
-
</div>
|
|
176
|
-
|
|
177
|
-
{row.titleContent}
|
|
178
|
-
</div>
|
|
179
|
-
);
|
|
180
|
-
};
|
|
181
|
-
|
|
182
|
-
useEffect(() => {
|
|
183
|
-
setAccordions(items);
|
|
184
|
-
}, [items]);
|
|
185
|
-
|
|
186
|
-
return (
|
|
187
|
-
<div className={cn("accordion-table", className)}>
|
|
188
|
-
<div className="accordion-table__header">
|
|
189
|
-
{header?.map((item) => {
|
|
190
|
-
return (
|
|
191
|
-
<div
|
|
192
|
-
style={{ flexBasis: `${item.width}%` }}
|
|
193
|
-
key={item.key}
|
|
194
|
-
className={sortedColClassName(item)}
|
|
195
|
-
onClick={() => !item.noSort && handle.setSort(item.key)}
|
|
196
|
-
>
|
|
197
|
-
{sortParams &&
|
|
198
|
-
item.key === sortParams.key &&
|
|
199
|
-
sortParams.key !== "actions" &&
|
|
200
|
-
(sortParams.direction === "DESC" ? (
|
|
201
|
-
<ArrowDown size={16} />
|
|
202
|
-
) : (
|
|
203
|
-
<ArrowUp size={16} />
|
|
204
|
-
))}
|
|
205
|
-
|
|
206
|
-
{item.label}
|
|
207
|
-
</div>
|
|
208
|
-
);
|
|
209
|
-
})}
|
|
210
|
-
</div>
|
|
211
|
-
|
|
212
|
-
<div className="accordion-table__body">
|
|
213
|
-
{accordions?.map((accordion) => {
|
|
214
|
-
return (
|
|
215
|
-
<MonoAccordion
|
|
216
|
-
testId={testId}
|
|
217
|
-
key={accordion.key}
|
|
218
|
-
onClick={(e) => handle.accordionChange(accordion.key, e)}
|
|
219
|
-
isOpen={accordion.isOpen}
|
|
220
|
-
className={cn(
|
|
221
|
-
"accordion-table__body-accordion",
|
|
222
|
-
{
|
|
223
|
-
"accordion-table__body-accordion--closed": !accordion.isOpen,
|
|
224
|
-
},
|
|
225
|
-
accordion.className,
|
|
226
|
-
)}
|
|
227
|
-
titleJSX={defineAccordionTitle(accordion)}
|
|
228
|
-
>
|
|
229
|
-
{accordion.children ?? renderTr(accordion.rows)}
|
|
230
|
-
</MonoAccordion>
|
|
231
|
-
);
|
|
232
|
-
})}
|
|
233
|
-
</div>
|
|
234
|
-
</div>
|
|
235
|
-
);
|
|
236
|
-
};
|
|
237
|
-
|
|
238
|
-
export default AccordionTable;
|
|
1
|
+
function e(e,r){(null==r||r>e.length)&&(r=e.length);for(var t=0,o=Array(r);t<r;t++)o[t]=e[t];return o}function r(r,t){return function(e){if(Array.isArray(e))return e}(r)||function(e,r){var t,o,n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a=[],c=!0,i=!1;try{for(n=n.call(e);!(c=(t=n.next()).done)&&(a.push(t.value),!r||a.length!==r);c=!0);}catch(e){i=!0,o=e}finally{try{c||null==n.return||n.return()}finally{if(i)throw o}}return a}}(r,t)||function(r,t){if(r){if("string"==typeof r)return e(r,t);var o=Object.prototype.toString.call(r).slice(8,-1);if("Object"===o&&r.constructor&&(o=r.constructor.name),"Map"===o||"Set"===o)return Array.from(o);if("Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o))return e(r,t)}}(r,t)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function t(e){return e&&"undefined"!=typeof Symbol&&e.constructor===Symbol?"symbol":typeof e}import{jsx as o,jsxs as n}from"react/jsx-runtime";import{useEffect as a,useState as c}from"react";import i from"classnames";import{ArrowDown as l,ArrowUp as s,ChevronDown as d,Tag as u}from"react-feather";import m from"../MonoAccordion/MonoAccordion";import"./AccordionTable.scss";export default function(e){var b=e.className,p=e.header,f=e.items,v=e.onChange,y=e.testId,h=e.onSort,_=void 0===h?function(){}:h,O=e.sortParams,N=r(c(f),2),g=N[0],j=N[1],w={accordionChange:function(e,r){var t,o,n,a=null==g?void 0:g.map(function(r){if(r.key===e){var t,o;return t=function(e){for(var r=1;r<arguments.length;r++){var t=null!=arguments[r]?arguments[r]:{},o=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(t).filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),o.forEach(function(r){var o;o=t[r],r in e?Object.defineProperty(e,r,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[r]=o})}return e}({},r),o=o={isOpen:!r.isOpen},Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(o)):(function(e,r){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t.push.apply(t,o)}return t})(Object(o)).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(o,e))}),t}return r}),c=(null==r||null==(t=r.target)?void 0:t.tagName)==="svg";((null==(n=r.target.className)||null==(o=n.includes)?void 0:o.call(n,"accordion-table"))||c)&&(v(a),j(a))},setSort:function(e){var r;_(e!==O.key?{key:e,direction:"DESC"}:{key:e,direction:"ASC"===O.direction?"DESC":"ASC"})}},S=function(e){return null==p?void 0:p.find(function(r){return r.key===e})},k=function(e){var n;return null==(n=Object.entries(e))?void 0:n.map(function(e){var n,a,c=r(e,2),l=c[0],s=c[1];return"promoDetails"===l||"disclosure"===l?null:o("div",{style:{flexBasis:"".concat(null==(n=S(l))?void 0:n.width,"%")},className:i("accordion-table__td","accordion-table__td--".concat(l),null==(a=S(l))?void 0:a.className),children:o("p",{className:"accordion-table__statistics-td-value",title:(void 0===s?"undefined":t(s))!=="object"?s:s.value,children:(void 0===s?"undefined":t(s))!=="object"?s:s.value})},l)})};return a(function(){j(f)},[f]),n("div",{className:i("accordion-table",b),children:[o("div",{className:"accordion-table__header",children:null==p?void 0:p.map(function(e){return n("div",{style:{flexBasis:"".concat(e.width,"%")},className:i("accordion-table__header-item",e.className,{"accordion-table--sorted-col":O&&O.key===e.key},{"accordion-table__header-item-sortable":!e.noSort}),onClick:function(){return!e.noSort&&w.setSort(e.key)},children:[O&&e.key===O.key&&"actions"!==O.key&&("DESC"===O.direction?o(l,{size:16}):o(s,{size:16})),e.label]},e.key)})}),o("div",{className:"accordion-table__body",children:null==g?void 0:g.map(function(e){var t,a,c;return o(m,{testId:y,onClick:function(r){return w.accordionChange(e.key,r)},isOpen:e.isOpen,className:i("accordion-table__body-accordion",{"accordion-table__body-accordion--closed":!e.isOpen},e.className),titleJSX:n("div",{onClick:function(e){return w.accordionChange(a.key,e)},className:"accordion-table__accordion-label-box",children:[n("div",{className:"accordion-table__accordion-label-wrapper j4",children:[o(d,{width:8,height:4,className:i("accordion-label-box__icon",{"accordion-label-box__icon--open":(a=e).isOpen})}),o("span",{className:"accordion-label-box__label",children:a.label}),a.statistics&&o("div",{className:i("accordion-table__tr",a.className),children:Object.entries(a.statistics).map(function(e){var t,n,a=r(e,2),c=a[0],l=a[1];return o("div",{style:{width:"".concat(null==(t=S(c))?void 0:t.width,"%")},className:i("accordion-table__statistics-td",null==(n=S(c))?void 0:n.className),children:o("div",{className:"accordion-table__statistics-td-value-wrapper",children:"status"===c?o("div",{className:"accordion-table__statistics-td-value",children:l}):o("p",{className:"accordion-table__statistics-td-value",title:l,children:l})})},c)})})]}),a.titleContent]}),children:null!=(t=e.children)?t:null==(c=e.rows)?void 0:c.map(function(e,r){var t,a,c,l,s;return n("div",{className:i("accordion-table__tr",{"accordion-table__tr-with-promo":e.promoDetails||(null==(t=e.cols)?void 0:t.promoDetails)},e.className),children:[o("div",{className:"df w100",children:k(e.cols||e)}),e.promoDetails||(null==(a=e.cols)?void 0:a.promoDetails)?o("div",{className:"accordion-table__tr-promo-wrapper",children:n("div",{className:"accordion-table__tr-promo",children:[o(u,{className:"tr-promo-icon",width:16,height:16}),o("span",{className:"tr-promo-label",children:"PROMOTION"}),e.promoDetails||(null==(c=e.cols)?void 0:c.promoDetails)]})}):null,e.disclosure||(null==(l=e.cols)?void 0:l.disclosure)?o("div",{className:"accordion-table__tr-promo-wrapper",children:o("div",{className:"accordion-table__tr-promo accordion-table__tr-promo-disclosure",children:e.disclosure||(null==(s=e.cols)?void 0:s.disclosure)})}):null]},r)})},e.key)})})]})}
|
|
@@ -1,69 +1 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import React from "react";
|
|
3
|
-
import cn from "classnames";
|
|
4
|
-
import { ChevronDown, ChevronUp } from "react-feather";
|
|
5
|
-
import "./AccordionText.scss";
|
|
6
|
-
|
|
7
|
-
const defaultText = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.`;
|
|
8
|
-
|
|
9
|
-
const AccordionText = ({
|
|
10
|
-
isDefaultOpen = false,
|
|
11
|
-
isOuterOpen = false,
|
|
12
|
-
className,
|
|
13
|
-
text = defaultText,
|
|
14
|
-
shortText = null
|
|
15
|
-
}) => {
|
|
16
|
-
const bodyRef = useRef(null);
|
|
17
|
-
const [isOpen, setIsOpen] = useState(isDefaultOpen);
|
|
18
|
-
const [isNeedTrimText, setIsNeedTrimText] = useState(false);
|
|
19
|
-
|
|
20
|
-
useEffect(() => {
|
|
21
|
-
setIsOpen(isOuterOpen);
|
|
22
|
-
}, [isOuterOpen]);
|
|
23
|
-
|
|
24
|
-
useEffect(() => {
|
|
25
|
-
const checkEllipsis = () => {
|
|
26
|
-
if (bodyRef.current) {
|
|
27
|
-
setIsNeedTrimText(bodyRef.current.scrollWidth > bodyRef.current.clientWidth);
|
|
28
|
-
}
|
|
29
|
-
};
|
|
30
|
-
|
|
31
|
-
const resizeObserver = new ResizeObserver(() => {
|
|
32
|
-
checkEllipsis();
|
|
33
|
-
});
|
|
34
|
-
|
|
35
|
-
if (bodyRef.current) {
|
|
36
|
-
resizeObserver.observe(bodyRef.current);
|
|
37
|
-
checkEllipsis();
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
return () => {
|
|
41
|
-
if (bodyRef.current) {
|
|
42
|
-
resizeObserver.unobserve(bodyRef.current);
|
|
43
|
-
}
|
|
44
|
-
};
|
|
45
|
-
}, [text]);
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<div
|
|
49
|
-
className={cn("accordion-text", className, {
|
|
50
|
-
"accordion-text--open": isOpen,
|
|
51
|
-
})}
|
|
52
|
-
onClick={() => setIsOpen((prevIsOpen) => !prevIsOpen)}
|
|
53
|
-
>
|
|
54
|
-
<div
|
|
55
|
-
className={cn("accordion-text__body", {
|
|
56
|
-
"accordion-text__body--trim-text": isNeedTrimText && !isOpen,
|
|
57
|
-
})}
|
|
58
|
-
ref={bodyRef}
|
|
59
|
-
>
|
|
60
|
-
{shortText ? (isOpen ? text : shortText) : text}
|
|
61
|
-
</div>
|
|
62
|
-
<div className="accordion-text__toggle">
|
|
63
|
-
{isOpen ? <ChevronUp /> : <ChevronDown />}
|
|
64
|
-
</div>
|
|
65
|
-
</div>
|
|
66
|
-
);
|
|
67
|
-
};
|
|
68
|
-
|
|
69
|
-
export default AccordionText;
|
|
1
|
+
function t(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}function r(r,e){return function(t){if(Array.isArray(t))return t}(r)||function(t,r){var e,n,o=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=o){var i=[],a=!0,c=!1;try{for(o=o.call(t);!(a=(e=o.next()).done)&&(i.push(e.value),!r||i.length!==r);a=!0);}catch(t){c=!0,n=t}finally{try{a||null==o.return||o.return()}finally{if(c)throw n}}return i}}(r,e)||function(r,e){if(r){if("string"==typeof r)return t(r,e);var n=Object.prototype.toString.call(r).slice(8,-1);if("Object"===n&&r.constructor&&(n=r.constructor.name),"Map"===n||"Set"===n)return Array.from(n);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return t(r,e)}}(r,e)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useEffect as o,useRef as i,useState as a}from"react";import"react";import c from"classnames";import{ChevronDown as u,ChevronUp as l}from"react-feather";import"./AccordionText.scss";export default function(t){var s=t.isDefaultOpen,d=t.isOuterOpen,m=void 0!==d&&d,f=t.className,p=t.text,v=void 0===p?"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.":p,y=t.shortText,b=void 0===y?null:y,h=i(null),x=r(a(void 0!==s&&s),2),g=x[0],A=x[1],j=r(a(!1),2),O=j[0],S=j[1];return o(function(){A(m)},[m]),o(function(){var t=function(){h.current&&S(h.current.scrollWidth>h.current.clientWidth)},r=new ResizeObserver(function(){t()});return h.current&&(r.observe(h.current),t()),function(){h.current&&r.unobserve(h.current)}},[v]),n("div",{className:c("accordion-text",f,{"accordion-text--open":g}),onClick:function(){return A(function(t){return!t})},children:[e("div",{className:c("accordion-text__body",{"accordion-text__body--trim-text":O&&!g}),ref:h,children:b?g?v:b:v}),e("div",{className:"accordion-text__toggle",children:g?e(l,{}):e(u,{})})]})}
|
|
@@ -1,207 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import cn from "classnames";
|
|
4
|
-
import { AlertTriangle } from "react-feather";
|
|
5
|
-
|
|
6
|
-
import "./AdvancedTags.scss";
|
|
7
|
-
|
|
8
|
-
const AdvTag = ({ item, className, testId = "adv-tag", toTop = true }) => {
|
|
9
|
-
if (!item) return null;
|
|
10
|
-
|
|
11
|
-
const {
|
|
12
|
-
labelLeft,
|
|
13
|
-
labelRight,
|
|
14
|
-
active = 0,
|
|
15
|
-
pause = 0,
|
|
16
|
-
merchants,
|
|
17
|
-
warnLeft,
|
|
18
|
-
warnLeftMsg,
|
|
19
|
-
warnRightMsg,
|
|
20
|
-
isEntityAndCounter = false,
|
|
21
|
-
entityAndCounter = {
|
|
22
|
-
nullCounterMessage: "",
|
|
23
|
-
title: "",
|
|
24
|
-
counter: null,
|
|
25
|
-
},
|
|
26
|
-
} = item;
|
|
27
|
-
|
|
28
|
-
const [isOpen, setIsOpen] = useState(false);
|
|
29
|
-
const [clickedWarning, setClickedWarning] = useState("");
|
|
30
|
-
const hintRef = useRef(null);
|
|
31
|
-
|
|
32
|
-
const activeNumberClass = cn(
|
|
33
|
-
"strong",
|
|
34
|
-
{ "color--pause": active === 0 },
|
|
35
|
-
{ "color--green-haze": active > 0 },
|
|
36
|
-
);
|
|
37
|
-
const pauseNumberClass = cn(
|
|
38
|
-
"strong",
|
|
39
|
-
{ "color--pause": pause === 0 },
|
|
40
|
-
{ "color--light-red": pause > 0 },
|
|
41
|
-
);
|
|
42
|
-
|
|
43
|
-
const isEmptyEntitys =
|
|
44
|
-
(isEntityAndCounter &&
|
|
45
|
-
(!entityAndCounter.counter || entityAndCounter.counter === 0)) ||
|
|
46
|
-
(!isEntityAndCounter && (warnLeft || !merchants));
|
|
47
|
-
const advancedTagClass = cn(
|
|
48
|
-
"advanced-tags",
|
|
49
|
-
{ "advanced-tags--error": isEmptyEntitys },
|
|
50
|
-
className,
|
|
51
|
-
);
|
|
52
|
-
|
|
53
|
-
const onWarningClick = (warn) => {
|
|
54
|
-
setIsOpen(true);
|
|
55
|
-
setClickedWarning(warn);
|
|
56
|
-
};
|
|
57
|
-
|
|
58
|
-
const handleClickOutside = (event) => {
|
|
59
|
-
if (hintRef.current && !hintRef.current.contains(event.target)) {
|
|
60
|
-
setIsOpen(false);
|
|
61
|
-
}
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
useEffect(() => {
|
|
65
|
-
document.addEventListener("click", handleClickOutside, true);
|
|
66
|
-
return () =>
|
|
67
|
-
document.removeEventListener("click", handleClickOutside, true);
|
|
68
|
-
});
|
|
69
|
-
|
|
70
|
-
const renderClassicTag = () => {
|
|
71
|
-
return (
|
|
72
|
-
<div data-testid={testId} className={advancedTagClass} ref={hintRef}>
|
|
73
|
-
{warnLeft && (
|
|
74
|
-
<div
|
|
75
|
-
data-testid={`${testId}-left`}
|
|
76
|
-
className="advanced-tags--warning-icon-wrapper"
|
|
77
|
-
onMouseEnter={() => onWarningClick("warnLeft")}
|
|
78
|
-
onMouseLeave={() => setIsOpen(false)}
|
|
79
|
-
>
|
|
80
|
-
<AlertTriangle
|
|
81
|
-
width={16}
|
|
82
|
-
height={16}
|
|
83
|
-
className="advanced-tags--warning-icon mr5"
|
|
84
|
-
/>
|
|
85
|
-
</div>
|
|
86
|
-
)}
|
|
87
|
-
|
|
88
|
-
{labelLeft && <span className="mr5">{labelLeft}</span>}
|
|
89
|
-
{labelRight && <span>{labelRight}</span>}
|
|
90
|
-
|
|
91
|
-
{item.type !== "simple" ? <span className="ml5 mr5">|</span> : null}
|
|
92
|
-
{item.type !== "simple" ? (
|
|
93
|
-
<div className="df">
|
|
94
|
-
<span className={activeNumberClass}>{active}</span>
|
|
95
|
-
<span className="strong color--pause">/</span>
|
|
96
|
-
<span className={pauseNumberClass}>{pause}</span>
|
|
97
|
-
</div>
|
|
98
|
-
) : null}
|
|
99
|
-
|
|
100
|
-
{item.type !== "simple" ? <span className="ml5 mr5">|</span> : null}
|
|
101
|
-
|
|
102
|
-
{merchants ? (
|
|
103
|
-
<span>{merchants}</span>
|
|
104
|
-
) : (
|
|
105
|
-
item.type !== "simple" && (
|
|
106
|
-
<div
|
|
107
|
-
data-testid={`${testId}-right`}
|
|
108
|
-
className="advanced-tags--warning-icon-wrapper"
|
|
109
|
-
onMouseEnter={() => onWarningClick("warnRight")}
|
|
110
|
-
onMouseLeave={() => setIsOpen(false)}
|
|
111
|
-
>
|
|
112
|
-
<AlertTriangle
|
|
113
|
-
width={16}
|
|
114
|
-
height={16}
|
|
115
|
-
className="advanced-tags--warning-icon"
|
|
116
|
-
/>
|
|
117
|
-
</div>
|
|
118
|
-
)
|
|
119
|
-
)}
|
|
120
|
-
|
|
121
|
-
{isOpen && warnLeftMsg && clickedWarning === "warnLeft" ? (
|
|
122
|
-
<span
|
|
123
|
-
className={cn(
|
|
124
|
-
"advanced-tags__warn-text advanced-tags__warn-text--warnLeft",
|
|
125
|
-
{
|
|
126
|
-
"advanced-tags__warn-text--warnLeft--to-top": toTop,
|
|
127
|
-
},
|
|
128
|
-
)}
|
|
129
|
-
>
|
|
130
|
-
{warnLeftMsg}
|
|
131
|
-
</span>
|
|
132
|
-
) : null}
|
|
133
|
-
|
|
134
|
-
{isOpen && warnRightMsg && clickedWarning === "warnRight" ? (
|
|
135
|
-
<span
|
|
136
|
-
className={cn(
|
|
137
|
-
"advanced-tags__warn-text",
|
|
138
|
-
"advanced-tags__warn-text--warnRight",
|
|
139
|
-
{
|
|
140
|
-
"advanced-tags__warn-text--warnRight--to-top": toTop,
|
|
141
|
-
},
|
|
142
|
-
)}
|
|
143
|
-
>
|
|
144
|
-
{warnRightMsg}
|
|
145
|
-
</span>
|
|
146
|
-
) : null}
|
|
147
|
-
</div>
|
|
148
|
-
);
|
|
149
|
-
};
|
|
150
|
-
|
|
151
|
-
const renderWithEntityAndCounterTag = () => {
|
|
152
|
-
const isNullcounter = entityAndCounter?.counter?.toString() === "0";
|
|
153
|
-
|
|
154
|
-
return (
|
|
155
|
-
<div data-testid={testId} className={advancedTagClass} ref={hintRef}>
|
|
156
|
-
{isNullcounter && (
|
|
157
|
-
<div
|
|
158
|
-
data-testid={`${testId}-left`}
|
|
159
|
-
className="advanced-tags--warning-icon-wrapper"
|
|
160
|
-
onMouseEnter={() => onWarningClick("warnLeft")}
|
|
161
|
-
onMouseLeave={() => setIsOpen(false)}
|
|
162
|
-
>
|
|
163
|
-
<AlertTriangle
|
|
164
|
-
width={16}
|
|
165
|
-
height={16}
|
|
166
|
-
className="advanced-tags--warning-icon mr5"
|
|
167
|
-
/>
|
|
168
|
-
</div>
|
|
169
|
-
)}
|
|
170
|
-
|
|
171
|
-
{isOpen &&
|
|
172
|
-
entityAndCounter?.nullCounterMessage &&
|
|
173
|
-
clickedWarning === "warnLeft" ? (
|
|
174
|
-
<span
|
|
175
|
-
className={cn(
|
|
176
|
-
"advanced-tags__warn-text advanced-tags__warn-text--warnLeft",
|
|
177
|
-
{
|
|
178
|
-
"advanced-tags__warn-text--warnLeft--to-top": toTop,
|
|
179
|
-
},
|
|
180
|
-
)}
|
|
181
|
-
>
|
|
182
|
-
{entityAndCounter?.nullCounterMessage}
|
|
183
|
-
</span>
|
|
184
|
-
) : null}
|
|
185
|
-
|
|
186
|
-
{entityAndCounter?.title && (
|
|
187
|
-
<span className="mr5">{entityAndCounter?.title}</span>
|
|
188
|
-
)}
|
|
189
|
-
|
|
190
|
-
<div
|
|
191
|
-
className={`advanced-tags__counter ${
|
|
192
|
-
isNullcounter
|
|
193
|
-
? "advanced-tags__counter--null"
|
|
194
|
-
: "advanced-tags__counter--bold"
|
|
195
|
-
}`}
|
|
196
|
-
>
|
|
197
|
-
{entityAndCounter?.counter}
|
|
198
|
-
</div>
|
|
199
|
-
</div>
|
|
200
|
-
);
|
|
201
|
-
};
|
|
202
|
-
return !isEntityAndCounter
|
|
203
|
-
? renderClassicTag()
|
|
204
|
-
: renderWithEntityAndCounterTag();
|
|
205
|
-
};
|
|
206
|
-
|
|
207
|
-
export default AdvTag;
|
|
1
|
+
function n(n,t){(null==t||t>n.length)&&(t=n.length);for(var e=0,a=Array(t);e<t;e++)a[e]=n[e];return a}function t(t,e){return function(n){if(Array.isArray(n))return n}(t)||function(n,t){var e,a,r=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null!=r){var l=[],c=!0,s=!1;try{for(r=r.call(n);!(c=(e=r.next()).done)&&(l.push(e.value),!t||l.length!==t);c=!0);}catch(n){s=!0,a=n}finally{try{c||null==r.return||r.return()}finally{if(s)throw a}}return l}}(t,e)||function(t,e){if(t){if("string"==typeof t)return n(t,e);var a=Object.prototype.toString.call(t).slice(8,-1);if("Object"===a&&t.constructor&&(a=t.constructor.name),"Map"===a||"Set"===a)return Array.from(a);if("Arguments"===a||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(a))return n(t,e)}}(t,e)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}import{jsx as e,jsxs as a}from"react/jsx-runtime";import{useEffect as r,useRef as l,useState as c}from"react";import s from"classnames";import{AlertTriangle as i}from"react-feather";import"./AdvancedTags.scss";export default function(n){var o,d,u=n.item,m=n.className,v=n.testId,g=void 0===v?"adv-tag":v,f=n.toTop,p=void 0===f||f;if(!u)return null;var h=u.labelLeft,w=u.labelRight,_=u.active,y=void 0===_?0:_,N=u.pause,L=void 0===N?0:N,x=u.merchants,b=u.warnLeft,M=u.warnLeftMsg,A=u.warnRightMsg,E=u.isEntityAndCounter,j=void 0!==E&&E,C=u.entityAndCounter,R=void 0===C?{nullCounterMessage:"",title:"",counter:null}:C,S=t(c(!1),2),I=S[0],T=S[1],k=t(c(""),2),O=k[0],z=k[1],U=l(null),$=s("strong",{"color--pause":0===y},{"color--green-haze":y>0}),q=s("strong",{"color--pause":0===L},{"color--light-red":L>0}),B=s("advanced-tags",{"advanced-tags--error":j&&(!R.counter||0===R.counter)||!j&&(b||!x)},m),D=function(n){T(!0),z(n)},F=function(n){U.current&&!U.current.contains(n.target)&&T(!1)};return r(function(){return document.addEventListener("click",F,!0),function(){return document.removeEventListener("click",F,!0)}}),j?a("div",{"data-testid":g,className:B,ref:U,children:[(d=(null==R||null==(o=R.counter)?void 0:o.toString())==="0")&&e("div",{"data-testid":"".concat(g,"-left"),className:"advanced-tags--warning-icon-wrapper",onMouseEnter:function(){return D("warnLeft")},onMouseLeave:function(){return T(!1)},children:e(i,{width:16,height:16,className:"advanced-tags--warning-icon mr5"})}),I&&(null==R?void 0:R.nullCounterMessage)&&"warnLeft"===O?e("span",{className:s("advanced-tags__warn-text advanced-tags__warn-text--warnLeft",{"advanced-tags__warn-text--warnLeft--to-top":p}),children:null==R?void 0:R.nullCounterMessage}):null,(null==R?void 0:R.title)&&e("span",{className:"mr5",children:null==R?void 0:R.title}),e("div",{className:"advanced-tags__counter ".concat(d?"advanced-tags__counter--null":"advanced-tags__counter--bold"),children:null==R?void 0:R.counter})]}):a("div",{"data-testid":g,className:B,ref:U,children:[b&&e("div",{"data-testid":"".concat(g,"-left"),className:"advanced-tags--warning-icon-wrapper",onMouseEnter:function(){return D("warnLeft")},onMouseLeave:function(){return T(!1)},children:e(i,{width:16,height:16,className:"advanced-tags--warning-icon mr5"})}),h&&e("span",{className:"mr5",children:h}),w&&e("span",{children:w}),"simple"!==u.type?e("span",{className:"ml5 mr5",children:"|"}):null,"simple"!==u.type?a("div",{className:"df",children:[e("span",{className:$,children:y}),e("span",{className:"strong color--pause",children:"/"}),e("span",{className:q,children:L})]}):null,"simple"!==u.type?e("span",{className:"ml5 mr5",children:"|"}):null,x?e("span",{children:x}):"simple"!==u.type&&e("div",{"data-testid":"".concat(g,"-right"),className:"advanced-tags--warning-icon-wrapper",onMouseEnter:function(){return D("warnRight")},onMouseLeave:function(){return T(!1)},children:e(i,{width:16,height:16,className:"advanced-tags--warning-icon"})}),I&&M&&"warnLeft"===O?e("span",{className:s("advanced-tags__warn-text advanced-tags__warn-text--warnLeft",{"advanced-tags__warn-text--warnLeft--to-top":p}),children:M}):null,I&&A&&"warnRight"===O?e("span",{className:s("advanced-tags__warn-text","advanced-tags__warn-text--warnRight",{"advanced-tags__warn-text--warnRight--to-top":p}),children:A}):null]})}
|
|
@@ -1,56 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import cn from "classnames";
|
|
4
|
-
|
|
5
|
-
import Tag from "../Tag/Tag";
|
|
6
|
-
|
|
7
|
-
import AdvTag from "./AdvTag";
|
|
8
|
-
|
|
9
|
-
const AdvancedTags = ({ items, noItemsTagLabel, className, testId = "advanced-tag-test", toTop = true }) => {
|
|
10
|
-
if ((!items || !items.length) && !noItemsTagLabel) return null;
|
|
11
|
-
|
|
12
|
-
if ((!items || !items.length) && noItemsTagLabel)
|
|
13
|
-
return (
|
|
14
|
-
<Tag
|
|
15
|
-
label={noItemsTagLabel?.toString()}
|
|
16
|
-
className={cn(className, "tag-warn")}
|
|
17
|
-
/>
|
|
18
|
-
);
|
|
19
|
-
|
|
20
|
-
const [showedItems, setShowedItems] = useState([items[0], items[1]]);
|
|
21
|
-
const [showMore, setShowMore] = useState(true);
|
|
22
|
-
|
|
23
|
-
const onShowMoreClick = () => {
|
|
24
|
-
setShowedItems(showMore ? items : [items[0], items[1]]);
|
|
25
|
-
setShowMore(!showMore);
|
|
26
|
-
return () => {
|
|
27
|
-
setShowedItems([items[0], items[1]]);
|
|
28
|
-
setShowMore(true);
|
|
29
|
-
};
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
return (
|
|
33
|
-
<div data-testid={testId} className={cn(className, "j4 wrap")}>
|
|
34
|
-
{showedItems?.map((item, index) => (
|
|
35
|
-
<AdvTag
|
|
36
|
-
toTop={toTop}
|
|
37
|
-
key={index}
|
|
38
|
-
item={item}
|
|
39
|
-
testId={`${testId}-item-${index}`}
|
|
40
|
-
/>
|
|
41
|
-
))}
|
|
42
|
-
|
|
43
|
-
{items.length >= 3 && (
|
|
44
|
-
<span
|
|
45
|
-
data-testid={`${testId}-showMore`}
|
|
46
|
-
onClick={() => onShowMoreClick()}
|
|
47
|
-
className="advanced-tags advanced-tags--showMore"
|
|
48
|
-
>
|
|
49
|
-
{showMore ? `+${items.length - showedItems.length}` : "..."}
|
|
50
|
-
</span>
|
|
51
|
-
)}
|
|
52
|
-
</div>
|
|
53
|
-
);
|
|
54
|
-
};
|
|
55
|
-
|
|
56
|
-
export default AdvancedTags;
|
|
1
|
+
function t(t,r){(null==r||r>t.length)&&(r=t.length);for(var n=0,e=Array(r);n<r;n++)e[n]=t[n];return e}function r(r,n){return function(t){if(Array.isArray(t))return t}(r)||function(t,r){var n,e,a=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=a){var o=[],i=!0,l=!1;try{for(a=a.call(t);!(i=(n=a.next()).done)&&(o.push(n.value),!r||o.length!==r);i=!0);}catch(t){l=!0,e=t}finally{try{i||null==a.return||a.return()}finally{if(l)throw e}}return o}}(r,n)||function(r,n){if(r){if("string"==typeof r)return t(r,n);var e=Object.prototype.toString.call(r).slice(8,-1);if("Object"===e&&r.constructor&&(e=r.constructor.name),"Map"===e||"Set"===e)return Array.from(e);if("Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return t(r,n)}}(r,n)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}import{jsx as n,jsxs as e}from"react/jsx-runtime";import{useState as a}from"react";import o from"classnames";import i from"../Tag/Tag";import l from"./AdvTag";export default function(t){var c=t.items,u=t.noItemsTagLabel,s=t.className,f=t.testId,m=void 0===f?"advanced-tag-test":f,d=t.toTop,g=void 0===d||d;if((!c||!c.length)&&!u)return null;if((!c||!c.length)&&u)return n(i,{label:null==u?void 0:u.toString(),className:o(s,"tag-warn")});var p=r(a([c[0],c[1]]),2),h=p[0],v=p[1],y=r(a(!0),2),b=y[0],j=y[1];return e("div",{"data-testid":m,className:o(s,"j4 wrap"),children:[null==h?void 0:h.map(function(t,r){return n(l,{toTop:g,item:t,testId:"".concat(m,"-item-").concat(r)},r)}),c.length>=3&&n("span",{"data-testid":"".concat(m,"-showMore"),onClick:function(){return v(b?c:[c[0],c[1]]),j(!b),function(){v([c[0],c[1]]),j(!0)}},className:"advanced-tags advanced-tags--showMore",children:b?"+".concat(c.length-h.length):"..."})]})}
|
|
@@ -1,72 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import cn from "classnames";
|
|
4
|
-
import { X } from "react-feather";
|
|
5
|
-
|
|
6
|
-
import Spinner from "../../Layout/Spinner/Spinner";
|
|
7
|
-
import Button from "../Button/Button";
|
|
8
|
-
import DynamicIcon from "../DynamicIcon/DynamicIcon";
|
|
9
|
-
|
|
10
|
-
import "./Alert.scss";
|
|
11
|
-
|
|
12
|
-
const Alert = ({
|
|
13
|
-
message,
|
|
14
|
-
icon,
|
|
15
|
-
iconDynamicKey,
|
|
16
|
-
iconDynamicProps,
|
|
17
|
-
className,
|
|
18
|
-
children,
|
|
19
|
-
noDismiss,
|
|
20
|
-
testId = "alert",
|
|
21
|
-
isHidden = false,
|
|
22
|
-
variant = "warning",
|
|
23
|
-
isLoading,
|
|
24
|
-
buttonParams,
|
|
25
|
-
}) => {
|
|
26
|
-
const [onClose, setOnClose] = useState(false);
|
|
27
|
-
|
|
28
|
-
const DynamicIconComponent =
|
|
29
|
-
iconDynamicKey && !icon ? (
|
|
30
|
-
<DynamicIcon iconKey={iconDynamicKey} {...iconDynamicProps} />
|
|
31
|
-
) : null;
|
|
32
|
-
|
|
33
|
-
function renderActionsBlock() {
|
|
34
|
-
if (buttonParams)
|
|
35
|
-
return (
|
|
36
|
-
<div className="j6 alert__btns-box">
|
|
37
|
-
<Button {...buttonParams} />
|
|
38
|
-
{!noDismiss && (
|
|
39
|
-
<div className="alert__close-btn">
|
|
40
|
-
<X data-testid={`${testId}-close`} onClick={() => setOnClose(!onClose)} />
|
|
41
|
-
</div>
|
|
42
|
-
)}
|
|
43
|
-
</div>
|
|
44
|
-
);
|
|
45
|
-
if (!noDismiss)
|
|
46
|
-
return (
|
|
47
|
-
<div className="alert__close-btn">
|
|
48
|
-
<X data-testid={`${testId}-close`} onClick={() => setOnClose(!onClose)} />
|
|
49
|
-
</div>
|
|
50
|
-
);
|
|
51
|
-
return null;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
return (
|
|
55
|
-
<div
|
|
56
|
-
data-testid={testId}
|
|
57
|
-
className={cn(className, { hidden: onClose }, `alert alert--${variant}`, {
|
|
58
|
-
hidden: isHidden,
|
|
59
|
-
"alert--loading": isLoading,
|
|
60
|
-
})}
|
|
61
|
-
>
|
|
62
|
-
<div className="alert__icon-text-box j4">
|
|
63
|
-
{DynamicIconComponent ?? icon}
|
|
64
|
-
<div>{children || message}</div>
|
|
65
|
-
</div>
|
|
66
|
-
{renderActionsBlock()}
|
|
67
|
-
{isLoading && <Spinner size="small" />}
|
|
68
|
-
</div>
|
|
69
|
-
);
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
export default Alert;
|
|
1
|
+
function t(t,r){(null==r||r>t.length)&&(r=t.length);for(var e=0,n=Array(r);e<r;e++)n[e]=t[e];return n}function r(t){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{},n=Object.keys(e);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(e).filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.forEach(function(r){var n;n=e[r],r in t?Object.defineProperty(t,r,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[r]=n})}return t}import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useState as o}from"react";import a from"classnames";import{X as i}from"react-feather";import l from"../../Layout/Spinner/Spinner";import c from"../Button/Button";import s from"../DynamicIcon/DynamicIcon";import"./Alert.scss";export default function(u){var m,f=u.message,d=u.icon,y=u.iconDynamicKey,p=u.iconDynamicProps,b=u.className,v=u.children,h=u.noDismiss,g=u.testId,j=void 0===g?"alert":g,O=u.isHidden,S=u.variant,x=u.isLoading,_=u.buttonParams,w=(m=o(!1),function(t){if(Array.isArray(t))return t}(m)||function(t,r){var e,n,o=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=o){var a=[],i=!0,l=!1;try{for(o=o.call(t);!(i=(e=o.next()).done)&&(a.push(e.value),a.length!==r);i=!0);}catch(t){l=!0,n=t}finally{try{i||null==o.return||o.return()}finally{if(l)throw n}}return a}}(m,2)||function(r,e){if(r){if("string"==typeof r)return t(r,2);var n=Object.prototype.toString.call(r).slice(8,-1);if("Object"===n&&r.constructor&&(n=r.constructor.name),"Map"===n||"Set"===n)return Array.from(n);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return t(r,e)}}(m,2)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),A=w[0],D=w[1],I=y&&!d?e(s,r({iconKey:y},p)):null;return n("div",{"data-testid":j,className:a(b,{hidden:A},"alert alert--".concat(void 0===S?"warning":S),{hidden:void 0!==O&&O,"alert--loading":x}),children:[n("div",{className:"alert__icon-text-box j4",children:[null!=I?I:d,e("div",{children:v||f})]}),_?n("div",{className:"j6 alert__btns-box",children:[e(c,r({},_)),!h&&e("div",{className:"alert__close-btn",children:e(i,{"data-testid":"".concat(j,"-close"),onClick:function(){return D(!A)}})})]}):h?null:e("div",{className:"alert__close-btn",children:e(i,{"data-testid":"".concat(j,"-close"),onClick:function(){return D(!A)}})}),x&&e(l,{size:"small"})]})}
|