intelicoreact 1.8.5 → 1.8.7
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/Dropdown/components/DropdownLoader.jsx +1 -18
- package/dist/Atomic/FormElements/FormattedRawSSN/FormattedRawSSN_old.jsx +1 -121
- package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.jsx +1 -507
- package/dist/Atomic/FormElements/MultiSelect/MultiSelect.jsx +1 -46
- package/dist/Atomic/FormElements/NumericInput/NumericInput.jsx +1 -337
- package/dist/Atomic/FormElements/RadioGroup/RadioGroup.jsx +1 -66
- package/dist/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.jsx +1 -78
- package/dist/Atomic/FormElements/RadioRowSwitcher/RadioRowSwitcher.jsx +1 -54
- package/dist/Atomic/FormElements/RangeCalendar/RangeCalendar.jsx +1 -183
- package/dist/Atomic/FormElements/RangeInputs/RangeInputs.jsx +1 -0
- package/dist/Atomic/FormElements/RangeList/RangeList.jsx +1 -181
- package/dist/Atomic/FormElements/RangeList/partial/RangeListRow.jsx +1 -41
- package/dist/Atomic/FormElements/RangeSlider/RangeSlider.jsx +1 -449
- package/dist/Atomic/FormElements/RangeSlider2/RangeSlider2.jsx +1 -865
- package/dist/Atomic/FormElements/SwitchableRow/SwitchableRow.jsx +1 -37
- package/dist/Atomic/FormElements/SwitcherCheckbox/SwitcherCheckbox.jsx +1 -48
- package/dist/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.jsx +1 -62
- package/dist/Atomic/FormElements/SwitcherTagsDropdown/SwitcherTagsDropdown.jsx +1 -175
- package/dist/Atomic/FormElements/SwitcherTextarea/SwitcherTextarea.jsx +1 -65
- package/dist/Atomic/FormElements/TagListToDropdown/TagListToDropdown.jsx +1 -118
- package/dist/Atomic/FormElements/Text/Text.jsx +1 -126
- package/dist/Atomic/FormElements/Textarea/Textarea.jsx +1 -61
- package/dist/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.jsx +1 -181
- package/dist/Atomic/FormElements/TieredCheckboxes/partial/AccordionWithCheckbox.jsx +1 -60
- package/dist/Atomic/FormElements/VariantsListRadio/VariantsListRadio.jsx +1 -83
- package/dist/Atomic/FormElements/VariantsListRadio/partials/VariantsListRadioItem.jsx +1 -80
- package/dist/Atomic/FormElements/WidgetPseudoTable/WidgetPseudoTable.jsx +1 -103
- package/dist/Atomic/FormElements/WidgetWithSwitchableRows/WidgetWithSwitchableRows.jsx +1 -115
- package/dist/Atomic/Layout/Header/Header.jsx +1 -86
- package/dist/Atomic/Layout/MainMenu/MainMenu.jsx +1 -164
- package/dist/Atomic/UI/AccordionTable/AccordionTable.jsx +1 -250
- package/dist/Atomic/UI/AccordionText/AccordionText.jsx +1 -68
- package/dist/Atomic/UI/Arrow/Arrow.jsx +1 -134
- package/dist/Atomic/UI/Box/Box.jsx +1 -53
- package/dist/Atomic/UI/Chart/Chart.jsx +1 -178
- package/dist/Atomic/UI/Chart/partial/ChartTypeSwitcherIcon/ChartTypeSwitcherIcon.jsx +1 -78
- package/dist/Atomic/UI/Chart/partial/optionsConstructor.jsx +1 -334
- package/dist/Atomic/UI/CircleProgressBar/CircleProgressBar.jsx +1 -111
- package/dist/Atomic/UI/DateTime/DateTime.jsx +1 -57
- package/dist/Atomic/UI/DebugContainer/DebugContainer.jsx +1 -44
- package/dist/Atomic/UI/DebugContainer/useDebugContainer.jsx +1 -15
- package/dist/Atomic/UI/ExampleChartIntegration/ExampleChartIntegration.jsx +1 -223
- package/dist/Atomic/UI/MonoAccordion/MonoAccordion._test.jsx +1 -75
- package/dist/Atomic/UI/MonoAccordion/MonoAccordion.jsx +1 -86
- package/dist/Atomic/UI/PieChart/PieChart.jsx +1 -41
- package/dist/Atomic/UI/Table/Partials/TdCell.jsx +1 -87
- package/dist/Atomic/UI/Table/Partials/TdHeader.jsx +1 -36
- package/dist/Atomic/UI/Table/Partials/TdRow.jsx +1 -103
- package/dist/Atomic/UI/Table/Partials/TdTitle.jsx +1 -55
- package/dist/Atomic/UI/Table/Table.jsx +1 -63
- package/dist/Atomic/UI/Table/TdTypes/TdActions.jsx +1 -80
- package/dist/Atomic/UI/Table/TdTypes/TdPriority.jsx +1 -26
- package/dist/Atomic/UI/Table/TdTypes/TdRange.jsx +1 -13
- package/dist/Atomic/UI/Table/TdTypes/TdWeight.jsx +1 -56
- package/dist/Atomic/UI/TagList/TagList.jsx +1 -256
- package/dist/Atomic/UI/WizardStepper/constructor.jsx +1 -86
- package/dist/Classes/RESTAPI/partials/CredentialsProcessing.jsx +1 -254
- package/dist/Functions/customEventListener.jsx +1 -96
- package/dist/Functions/operations.jsx +1 -138
- package/dist/Functions/useFormTools/functions/RenderFields.jsx +1 -108
- package/dist/Functions/useFormTools/index.jsx +1 -777
- package/dist/Functions/usePasswordChecker.jsx +1 -128
- package/dist/Functions/utils.jsx +1 -492
- package/dist/Molecular/CustomIcons/components/AffiliateNetworks.jsx +1 -22
- package/dist/Molecular/CustomIcons/components/AlertCircle.jsx +1 -24
- package/dist/Molecular/CustomIcons/components/AppStore.jsx +1 -30
- package/dist/Molecular/CustomIcons/components/Arrow.jsx +1 -33
- package/dist/Molecular/CustomIcons/components/ArrowDown.jsx +1 -18
- package/dist/Molecular/CustomIcons/components/ArrowLeft.jsx +1 -23
- package/dist/Molecular/CustomIcons/components/ArrowRight.jsx +1 -23
- package/dist/Molecular/CustomIcons/components/ArrowUp.jsx +1 -18
- package/dist/Molecular/CustomIcons/components/Bell.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/Button.jsx +1 -13
- package/dist/Molecular/CustomIcons/components/Campaigns.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/Check.jsx +1 -15
- package/dist/Molecular/CustomIcons/components/Check2.jsx +1 -13
- package/dist/Molecular/CustomIcons/components/ChevronDown.jsx +1 -13
- package/dist/Molecular/CustomIcons/components/ChevronDownDisabled.jsx +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronLeft.jsx +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronRight.jsx +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronUp.jsx +1 -12
- package/dist/Molecular/CustomIcons/components/ChevronUpDown.jsx +1 -28
- package/dist/Molecular/CustomIcons/components/Close.jsx +1 -15
- package/dist/Molecular/CustomIcons/components/ColumnsOrder.jsx +1 -18
- package/dist/Molecular/CustomIcons/components/Delete.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/Edit.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/Email.jsx +1 -32
- package/dist/Molecular/CustomIcons/components/FinturfLogo.jsx +1 -19
- package/dist/Molecular/CustomIcons/components/FinturfLogo2.jsx +1 -36
- package/dist/Molecular/CustomIcons/components/Flows.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/Gift.jsx +1 -26
- package/dist/Molecular/CustomIcons/components/GoogleAuth.jsx +1 -30
- package/dist/Molecular/CustomIcons/components/GooglePlay.jsx +1 -30
- package/dist/Molecular/CustomIcons/components/HelpCircle.jsx +1 -20
- package/dist/Molecular/CustomIcons/components/HelpCircle2.jsx +1 -21
- package/dist/Molecular/CustomIcons/components/HelpCircleFilled.jsx +1 -20
- package/dist/Molecular/CustomIcons/components/Home.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/Home2.jsx +1 -23
- package/dist/Molecular/CustomIcons/components/Key.jsx +1 -24
- package/dist/Molecular/CustomIcons/components/Landers.jsx +1 -21
- package/dist/Molecular/CustomIcons/components/Lock.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/Mail.jsx +1 -27
- package/dist/Molecular/CustomIcons/components/Mastercard.jsx +1 -74
- package/dist/Molecular/CustomIcons/components/Minus.jsx +1 -26
- package/dist/Molecular/CustomIcons/components/Offers.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/Pause.jsx +1 -29
- package/dist/Molecular/CustomIcons/components/PayPal.jsx +1 -42
- package/dist/Molecular/CustomIcons/components/PayPalLightLarge.jsx +1 -29
- package/dist/Molecular/CustomIcons/components/Phone.jsx +1 -31
- package/dist/Molecular/CustomIcons/components/Play.jsx +1 -26
- package/dist/Molecular/CustomIcons/components/Plus.jsx +1 -26
- package/dist/Molecular/CustomIcons/components/Profile.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/QRCode.jsx +1 -30
- package/dist/Molecular/CustomIcons/components/Rectangle.jsx +1 -13
- package/dist/Molecular/CustomIcons/components/Revert.jsx +1 -14
- package/dist/Molecular/CustomIcons/components/Star.jsx +1 -15
- package/dist/Molecular/CustomIcons/components/Star2.jsx +1 -17
- package/dist/Molecular/CustomIcons/components/TrafficSources.jsx +1 -15
- package/dist/Molecular/CustomIcons/components/Trash.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/TrashRed.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/Triggers.jsx +1 -16
- package/dist/Molecular/CustomIcons/components/User.jsx +1 -26
- package/dist/Molecular/CustomIcons/components/Visa.jsx +1 -32
- package/dist/Molecular/CustomIcons/components/X.jsx +1 -13
- package/dist/Molecular/FormElement/FormElement.jsx +1 -52
- package/dist/Molecular/FormWithDependOn/FormWithDependOn.jsx +1 -161
- package/dist/Molecular/InputAddress/InputAddress.jsx +1 -641
- package/dist/Molecular/InputPassword/InputPassword.jsx +1 -50
- package/package.json +1 -1
- package/dist/Atomic/FormElements/RangeInputs/RangeInputs.js +0 -1
- /package/dist/Atomic/FormElements/ActionAlert/{ActionAlert.js → ActionAlert.jsx} +0 -0
- /package/dist/Atomic/FormElements/AdvancedStatus/{AdvancedStatus.js → AdvancedStatus.jsx} +0 -0
- /package/dist/Atomic/FormElements/Calendar/{Calendar.js → Calendar.jsx} +0 -0
- /package/dist/Atomic/FormElements/Calendar/{Calendar.props.js → Calendar.props.jsx} +0 -0
- /package/dist/Atomic/FormElements/CheckboxInput/{CheckboxInput.js → CheckboxInput.jsx} +0 -0
- /package/dist/Atomic/FormElements/CheckboxesLine/{CheckboxesLine.js → CheckboxesLine.jsx} +0 -0
- /package/dist/Atomic/FormElements/Datepicker/{Datepicker.js → Datepicker.jsx} +0 -0
- /package/dist/Atomic/FormElements/Datepicker/{Datepicker.props.js → Datepicker.props.jsx} +0 -0
- /package/dist/Atomic/FormElements/Datepicker/components/{DatepickerCalendar.js → DatepickerCalendar.jsx} +0 -0
- /package/dist/Atomic/FormElements/Datepicker/components/{DatepickerCalendar.props.js → DatepickerCalendar.props.jsx} +0 -0
- /package/dist/Atomic/FormElements/Dropdown/{Dropdown.js → Dropdown.jsx} +0 -0
- /package/dist/Atomic/FormElements/DropdownLiveSearch/{DropdownLiveSearch.js → DropdownLiveSearch.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoader/{FileLoader.js → FileLoader.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoader/partial/{LoadZone.js → LoadZone.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoader/partial/{LoadedContent.js → LoadedContent.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoaderDescription/{FileLoaderDescription.js → FileLoaderDescription.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoaderLocal/{FileLoaderLocal.js → FileLoaderLocal.jsx} +0 -0
- /package/dist/Atomic/FormElements/FileLoaderLocalGroup/{FileLoaderLocalGroup.js → FileLoaderLocalGroup.jsx} +0 -0
- /package/dist/Atomic/FormElements/FormattedRawSSN/{FormattedRawSSN.js → FormattedRawSSN.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/{Input.js → Input.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/hooks/{useErrorBlink.js → useErrorBlink.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/hooks/{useInputFocus.js → useInputFocus.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/hooks/{useInputHover.js → useInputHover.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/hooks/{useInputValueProcessing.js → useInputValueProcessing.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/hooks/{useKeyboardHandling.js → useKeyboardHandling.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/lib/{autocomplete.js → autocomplete.jsx} +0 -0
- /package/dist/Atomic/FormElements/Input/{types.js → types.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputCalendar/{InputCalendar.js → InputCalendar.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputColor/{InputColor.js → InputColor.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputCurrency/{InputCurrency.js → InputCurrency.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/{InputDateRange.js → InputDateRange.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/components/{DateInput.js → DateInput.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/components/{Datepicker.js → Datepicker.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/components/{OpenedPart.js → OpenedPart.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/components/{SelectItem.js → SelectItem.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputDateRange/{dependencies.js → dependencies.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputLink/{InputLink.js → InputLink.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputMask/{InputMask.js → InputMask.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputMask3/{InputMask3.js → InputMask3.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputMask3/{config.js → config.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputMask3/{functions.js → functions.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputWithAction/{InputWithAction.js → InputWithAction.jsx} +0 -0
- /package/dist/Atomic/FormElements/InputsRow/{InputsRow.js → InputsRow.jsx} +0 -0
- /package/dist/Atomic/FormElements/Label/{Label.js → Label.jsx} +0 -0
- /package/dist/Atomic/FormElements/RadioInput/{RadioInput.js → RadioInput.jsx} +0 -0
- /package/dist/Atomic/FormElements/Switcher/{Switcher.js → Switcher.jsx} +0 -0
- /package/dist/Atomic/FormElements/SwitcherHide/{SwitcherHide.js → SwitcherHide.jsx} +0 -0
- /package/dist/Atomic/FormElements/SwitcherRadio/{SwitcherRadio.js → SwitcherRadio.jsx} +0 -0
- /package/dist/Atomic/FormElements/SwitcherRange/{SwitcherRange.js → SwitcherRange.jsx} +0 -0
- /package/dist/Atomic/FormElements/TagsDropdown/{TagsDropdown.js → TagsDropdown.jsx} +0 -0
- /package/dist/Atomic/FormElements/TextSwitcher/{TextSwitcher.js → TextSwitcher.jsx} +0 -0
- /package/dist/Atomic/FormElements/TimeRange/{TimeRange.js → TimeRange.jsx} +0 -0
- /package/dist/Atomic/FormElements/UserContacts/{UserContacts.js → UserContacts.jsx} +0 -0
- /package/dist/Atomic/Layout/Spinner/{Spinner.js → Spinner.jsx} +0 -0
- /package/dist/Atomic/UI/Accordion/{Accordion.js → Accordion.jsx} +0 -0
- /package/dist/Atomic/UI/Accordion/{AccordionItem.js → AccordionItem.jsx} +0 -0
- /package/dist/Atomic/UI/AdvancedTag/{AdvTag.js → AdvTag.jsx} +0 -0
- /package/dist/Atomic/UI/AdvancedTag/{AdvancedTags.js → AdvancedTags.jsx} +0 -0
- /package/dist/Atomic/UI/Alert/{Alert.js → Alert.jsx} +0 -0
- /package/dist/Atomic/UI/Button/{Button.js → Button.jsx} +0 -0
- /package/dist/Atomic/UI/ButtonsBar/{ButtonsBar.js → ButtonsBar.jsx} +0 -0
- /package/dist/Atomic/UI/DoubleString/{DoubleString.js → DoubleString.jsx} +0 -0
- /package/dist/Atomic/UI/DynamicIcon/{DynamicIcon.js → DynamicIcon.jsx} +0 -0
- /package/dist/Atomic/UI/Hint/{Hint.js → Hint.jsx} +0 -0
- /package/dist/Atomic/UI/Hint/partials/{_constants.js → _constants.jsx} +0 -0
- /package/dist/Atomic/UI/Hint/partials/{_utils.js → _utils.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/{Modal.js → Modal.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/{ModalHOC.js → ModalHOC.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/partials/{ModalFooter.js → ModalFooter.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/partials/{ModalTitle.js → ModalTitle.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/partials/{_constants.js → _constants.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/partials/{_utils.js → _utils.jsx} +0 -0
- /package/dist/Atomic/UI/Modal/partials/{useMobileModal.js → useMobileModal.jsx} +0 -0
- /package/dist/Atomic/UI/NavLine/{NavLine.js → NavLine.jsx} +0 -0
- /package/dist/Atomic/UI/PageTitle/{PageTitle.js → PageTitle.jsx} +0 -0
- /package/dist/Atomic/UI/Price/{Price.js → Price.jsx} +0 -0
- /package/dist/Atomic/UI/PriceRange/{PriceRange.js → PriceRange.jsx} +0 -0
- /package/dist/Atomic/UI/ProgressLine/{ProgressLine.js → ProgressLine.jsx} +0 -0
- /package/dist/Atomic/UI/Status/{Status.js → Status.jsx} +0 -0
- /package/dist/Atomic/UI/Tag/{Tag.js → Tag.jsx} +0 -0
- /package/dist/Atomic/UI/UserBox/{UserBox.js → UserBox.jsx} +0 -0
- /package/dist/Atomic/UI/WizardStepper/ui/StateIcon/{StateIcon.js → StateIcon.jsx} +0 -0
- /package/dist/Atomic/UI/WizardStepper/ui/StepRow/{StepRow.js → StepRow.jsx} +0 -0
- /package/dist/Atomic/UI/WizardStepper/ui/StepWrapper/{StepWrapper.js → StepWrapper.jsx} +0 -0
- /package/dist/Atomic/UI/WizardStepper/ui/{icons.js → icons.jsx} +0 -0
- /package/dist/Functions/guards/{assertions.js → assertions.jsx} +0 -0
- /package/dist/Functions/guards/{safeValue.js → safeValue.jsx} +0 -0
- /package/dist/Functions/guards/{typeGuards.js → typeGuards.jsx} +0 -0
- /package/dist/Functions/useIsMobile/{useIsMobile.js → useIsMobile.jsx} +0 -0
- /package/dist/Functions/useKeyPress/{useHandleKeyPress.js → useHandleKeyPress.jsx} +0 -0
- /package/dist/Functions/useKeyPress/{useKeyPress.js → useKeyPress.jsx} +0 -0
- /package/dist/Functions/utils/{disableDefaultBehavior.js → disableDefaultBehavior.jsx} +0 -0
- /package/dist/Functions/utils/{getLimitedMask.js → getLimitedMask.jsx} +0 -0
- /package/dist/types/declaration/TWithEventManagementAsObj/innerTypes/{Modal.js → Modal.jsx} +0 -0
|
@@ -1,18 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
function DropdownLoader({ variant = '' }) {
|
|
4
|
-
return (
|
|
5
|
-
<div className="dropdown-loader-box j5">
|
|
6
|
-
<div
|
|
7
|
-
className={`lds-ring${variant === 'little' ? ' lds-ring_little' : ''}`}
|
|
8
|
-
>
|
|
9
|
-
<div />
|
|
10
|
-
<div />
|
|
11
|
-
<div />
|
|
12
|
-
<div />
|
|
13
|
-
</div>
|
|
14
|
-
</div>
|
|
15
|
-
);
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
export default DropdownLoader;
|
|
1
|
+
import{jsx as i,jsxs as r}from"react/jsx-runtime";import"./DropdownLoader.scss";export default function(d){var s=d.variant;return i("div",{className:"dropdown-loader-box j5",children:r("div",{className:"lds-ring".concat("little"===(void 0===s?"":s)?" lds-ring_little":""),children:[i("div",{}),i("div",{}),i("div",{}),i("div",{})]})})}
|
|
@@ -1,121 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import { Eye, EyeOff } from 'react-feather';
|
|
4
|
-
|
|
5
|
-
import { setCarretToEnd } from '../../../Functions/utils';
|
|
6
|
-
import Input from '../Input/Input';
|
|
7
|
-
|
|
8
|
-
import './FormattedRawSSN.scss';
|
|
9
|
-
|
|
10
|
-
function FormattedRawSSN({
|
|
11
|
-
value = '',
|
|
12
|
-
postfix = '',
|
|
13
|
-
onChange: onChangeProp = () => {},
|
|
14
|
-
maskChar = '*',
|
|
15
|
-
testId = 'formatted-raw-ssn',
|
|
16
|
-
isHiddenDefault = true,
|
|
17
|
-
maxLen = 9,
|
|
18
|
-
...args
|
|
19
|
-
}) {
|
|
20
|
-
const [SSN, setSSN] = useState(value?.substring(0, maxLen) ?? '');
|
|
21
|
-
const [isHidden, setIsHidden] = useState(isHiddenDefault);
|
|
22
|
-
const wrapperRef = useRef(null);
|
|
23
|
-
|
|
24
|
-
useEffect(() => {
|
|
25
|
-
setSSN(value?.toString()?.substring(0, maxLen) ?? '');
|
|
26
|
-
}, [value]);
|
|
27
|
-
|
|
28
|
-
const onChange = (value) => {
|
|
29
|
-
if (!value && value !== '') return '';
|
|
30
|
-
|
|
31
|
-
if (value.replace(/-/g, '').length < SSN.length) {
|
|
32
|
-
const last = SSN.length - 1;
|
|
33
|
-
setSSN(SSN.slice(0, last));
|
|
34
|
-
return;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
const numValue = value.replace(/\D/g, '');
|
|
38
|
-
let newSSN = '';
|
|
39
|
-
|
|
40
|
-
if (isHidden) {
|
|
41
|
-
if (SSN.length > 5) {
|
|
42
|
-
newSSN = SSN.slice(0, 5) + numValue;
|
|
43
|
-
}
|
|
44
|
-
else {
|
|
45
|
-
newSSN = SSN + numValue;
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
else {
|
|
49
|
-
newSSN = numValue;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
if (newSSN.length > maxLen) {
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
setSSN(newSSN);
|
|
56
|
-
};
|
|
57
|
-
const switchView = () => {
|
|
58
|
-
const input = wrapperRef?.current?.querySelector('input');
|
|
59
|
-
input?.focus();
|
|
60
|
-
setCarretToEnd(input);
|
|
61
|
-
setIsHidden(!isHidden);
|
|
62
|
-
};
|
|
63
|
-
|
|
64
|
-
const getFormatedValue = (v) => {
|
|
65
|
-
if (!v) return '';
|
|
66
|
-
|
|
67
|
-
v = v.slice(0, 11).replace(/-/g, '');
|
|
68
|
-
if (v.length <= 3) {
|
|
69
|
-
return v;
|
|
70
|
-
}
|
|
71
|
-
if (v.length > 3 && v.length <= 5) {
|
|
72
|
-
return `${v.slice(0, 3)}-${v.slice(3)}`;
|
|
73
|
-
}
|
|
74
|
-
if (v.length > 5) {
|
|
75
|
-
return `${v.slice(0, 3)}-${v.slice(3, 5)}-${v.slice(5)}`;
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
const getMaskedValue = (v) => {
|
|
79
|
-
return isHidden
|
|
80
|
-
? v.slice(0, 7).replace(/\d/g, maskChar).concat(v.slice(7))
|
|
81
|
-
: v;
|
|
82
|
-
};
|
|
83
|
-
|
|
84
|
-
useEffect(() => {
|
|
85
|
-
if (SSN) {
|
|
86
|
-
onChangeProp?.(
|
|
87
|
-
SSN.concat(SSN.length === maxLen ? postfix : '').replace(/-/g, ''),
|
|
88
|
-
);
|
|
89
|
-
}
|
|
90
|
-
}, [SSN]);
|
|
91
|
-
|
|
92
|
-
return (
|
|
93
|
-
<div data-testid={testId} className="formatted-raw-ssn" ref={wrapperRef}>
|
|
94
|
-
<Input
|
|
95
|
-
{...args}
|
|
96
|
-
value={getMaskedValue(getFormatedValue(SSN))}
|
|
97
|
-
onChange={onChange}
|
|
98
|
-
/>
|
|
99
|
-
{postfix && (
|
|
100
|
-
<span
|
|
101
|
-
className="formatted-raw-ssn-postfix"
|
|
102
|
-
onClick={() => wrapperRef?.current?.querySelector('input')?.focus()}
|
|
103
|
-
>
|
|
104
|
-
{postfix}
|
|
105
|
-
</span>
|
|
106
|
-
)}
|
|
107
|
-
<span className="formatted-raw-ssn-eye-holder" onClick={switchView}>
|
|
108
|
-
{' '}
|
|
109
|
-
{isHidden
|
|
110
|
-
? (
|
|
111
|
-
<Eye strokeWidth={1} className="password-icon" />
|
|
112
|
-
)
|
|
113
|
-
: (
|
|
114
|
-
<EyeOff strokeWidth={1} className="password-icon" />
|
|
115
|
-
)}
|
|
116
|
-
</span>
|
|
117
|
-
</div>
|
|
118
|
-
);
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
export default FormattedRawSSN;
|
|
1
|
+
function t(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r<e;r++)n[r]=t[r];return n}function e(e,r){return function(t){if(Array.isArray(t))return t}(e)||function(t,e){var r,n,o=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=o){var l=[],i=!0,c=!1;try{for(o=o.call(t);!(i=(r=o.next()).done)&&(l.push(r.value),!e||l.length!==e);i=!0);}catch(t){c=!0,n=t}finally{try{i||null==o.return||o.return()}finally{if(c)throw n}}return l}}(e,r)||function(e,r){if(e){if("string"==typeof e)return t(e,r);var n=Object.prototype.toString.call(e).slice(8,-1);if("Object"===n&&e.constructor&&(n=e.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(e,r)}}(e,r)||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 r,jsxs as n}from"react/jsx-runtime";import{useEffect as o,useRef as l,useState as i}from"react";import{Eye as c,EyeOff as a}from"react-feather";import{setCarretToEnd as u}from"../../../Functions/utils";import s from"../Input/Input";import"./FormattedRawSSN.scss";export default function(t){var f,p,d,m,y,g=t.value,b=void 0===g?"":g,v=t.postfix,h=void 0===v?"":v,O=t.onChange,j=void 0===O?function(){}:O,w=t.maskChar,S=t.testId,P=t.isHiddenDefault,x=t.maxLen,k=void 0===x?9:x,C=function(t,e){if(null==t)return{};var r,n,o=function(t,e){if(null==t)return{};var r,n,o={},l=Object.keys(t);for(n=0;n<l.length;n++)r=l[n],e.indexOf(r)>=0||(o[r]=t[r]);return o}(t,e);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(t);for(n=0;n<l.length;n++)r=l[n],!(e.indexOf(r)>=0)&&Object.prototype.propertyIsEnumerable.call(t,r)&&(o[r]=t[r])}return o}(t,["value","postfix","onChange","maskChar","testId","isHiddenDefault","maxLen"]),I=e(i(null!=(y=null==b?void 0:b.substring(0,k))?y:""),2),D=I[0],A=I[1],N=e(i(void 0===P||P),2),E=N[0],q=N[1],F=l(null);return o(function(){var t,e;A(null!=(e=null==b||null==(t=b.toString())?void 0:t.substring(0,k))?e:"")},[b]),o(function(){D&&(null==j||j(D.concat(D.length===k?h:"").replace(/-/g,"")))},[D]),n("div",{"data-testid":void 0===S?"formatted-raw-ssn":S,className:"formatted-raw-ssn",ref:F,children:[r(s,(d=function(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter(function(t){return Object.getOwnPropertyDescriptor(r,t).enumerable}))),n.forEach(function(e){var n;n=r[e],e in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n})}return t}({},C),m=m={value:(p=(f=D)?(f=f.slice(0,11).replace(/-/g,"")).length<=3?f:f.length>3&&f.length<=5?"".concat(f.slice(0,3),"-").concat(f.slice(3)):f.length>5?"".concat(f.slice(0,3),"-").concat(f.slice(3,5),"-").concat(f.slice(5)):void 0:"",E?p.slice(0,7).replace(/\d/g,void 0===w?"*":w).concat(p.slice(7)):p),onChange:function(t){if(!t&&""!==t)return"";if(t.replace(/-/g,"").length<D.length){var e=D.length-1;A(D.slice(0,e));return}var r=t.replace(/\D/g,""),n="";(n=E?D.length>5?D.slice(0,5)+r:D+r:r).length>k||A(n)}},Object.getOwnPropertyDescriptors?Object.defineProperties(d,Object.getOwnPropertyDescriptors(m)):(function(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);r.push.apply(r,n)}return r})(Object(m)).forEach(function(t){Object.defineProperty(d,t,Object.getOwnPropertyDescriptor(m,t))}),d)),h&&r("span",{className:"formatted-raw-ssn-postfix",onClick:function(){var t,e;return null==F||null==(e=F.current)||null==(t=e.querySelector("input"))?void 0:t.focus()},children:h}),n("span",{className:"formatted-raw-ssn-eye-holder",onClick:function(){var t,e=null==F||null==(t=F.current)?void 0:t.querySelector("input");null==e||e.focus(),u(e),q(!E)},children:[" ",E?r(c,{strokeWidth:1,className:"password-icon"}):r(a,{strokeWidth:1,className:"password-icon"})]})]})}
|
|
@@ -1,507 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import { useEffect, useRef, useState } from 'react';
|
|
4
|
-
import { ChevronDown, ChevronUp } from 'react-feather';
|
|
5
|
-
|
|
6
|
-
import './MobileCalendar.scss';
|
|
7
|
-
|
|
8
|
-
require('../../../Functions/customEventListener');
|
|
9
|
-
|
|
10
|
-
function MobileCalendar({
|
|
11
|
-
min = moment().subtract('10', 'years'),
|
|
12
|
-
max = moment().add('10', 'years'),
|
|
13
|
-
value = moment(),
|
|
14
|
-
rows = 5,
|
|
15
|
-
label = '',
|
|
16
|
-
timeout = 75,
|
|
17
|
-
isMobile = true,
|
|
18
|
-
showSelectedDate = false,
|
|
19
|
-
listItemHeight = 32,
|
|
20
|
-
|
|
21
|
-
classes = {
|
|
22
|
-
wrapper: '',
|
|
23
|
-
label: '',
|
|
24
|
-
body: '',
|
|
25
|
-
|
|
26
|
-
yearsBlock: '',
|
|
27
|
-
yearsList: '',
|
|
28
|
-
yearsListItem: '',
|
|
29
|
-
|
|
30
|
-
monthsBlock: '',
|
|
31
|
-
monthsList: '',
|
|
32
|
-
monthsListItem: '',
|
|
33
|
-
|
|
34
|
-
daysBlock: '',
|
|
35
|
-
daysList: '',
|
|
36
|
-
daysListItem: '',
|
|
37
|
-
|
|
38
|
-
prevItem: '',
|
|
39
|
-
nextItem: '',
|
|
40
|
-
activeItem: '',
|
|
41
|
-
},
|
|
42
|
-
onChange = () => {},
|
|
43
|
-
onMinDateReached = () => {},
|
|
44
|
-
onMaxDateReached = () => {},
|
|
45
|
-
}) {
|
|
46
|
-
const Body = document.querySelector('body');
|
|
47
|
-
const listItem = document.querySelector(
|
|
48
|
-
'.mobile-calendar_wrapper_body_months-list--item',
|
|
49
|
-
);
|
|
50
|
-
|
|
51
|
-
const [date, setDate] = useState(value ? moment(value) : moment());
|
|
52
|
-
const [minDate, setMinDate] = useState(moment(min));
|
|
53
|
-
const [maxDate, setMaxDate] = useState(moment(max));
|
|
54
|
-
|
|
55
|
-
const [isMouseDown, setIsMouseDown] = useState(false);
|
|
56
|
-
const [mouseDownOn, setMouseDownOn] = useState(null);
|
|
57
|
-
const [changeInterval, setChangeInterval] = useState(null);
|
|
58
|
-
|
|
59
|
-
const [touchY, setTouchY] = useState(null);
|
|
60
|
-
const [touchType, setTouchType] = useState(null);
|
|
61
|
-
const [touchTimestamp, setTouchTimestamp] = useState(null);
|
|
62
|
-
|
|
63
|
-
const [scrollDirection, setScrollDirection] = useState(0);
|
|
64
|
-
|
|
65
|
-
const monthsListRef = useRef(null);
|
|
66
|
-
const daysListRef = useRef(null);
|
|
67
|
-
const yearsListRef = useRef(null);
|
|
68
|
-
|
|
69
|
-
const dateRef = useRef(null);
|
|
70
|
-
const intervalRef = useRef(null);
|
|
71
|
-
|
|
72
|
-
// --HANDLERS--//
|
|
73
|
-
const changeItem = (type, value) => {
|
|
74
|
-
setScrollDirection(value);
|
|
75
|
-
setDate((date) => {
|
|
76
|
-
const newDate = moment(date).add(value, type);
|
|
77
|
-
|
|
78
|
-
if (moment(newDate).isBefore(minDate)) return minDate;
|
|
79
|
-
if (moment(newDate).isAfter(maxDate)) return maxDate;
|
|
80
|
-
|
|
81
|
-
return newDate;
|
|
82
|
-
});
|
|
83
|
-
setTimeout(() => {
|
|
84
|
-
setScrollDirection(0);
|
|
85
|
-
}, 50);
|
|
86
|
-
};
|
|
87
|
-
|
|
88
|
-
const checkAvailability = (type, value) => {
|
|
89
|
-
if (!dateRef?.current) return false;
|
|
90
|
-
|
|
91
|
-
const newDate = moment(dateRef?.current).add(value, type);
|
|
92
|
-
|
|
93
|
-
if (moment(newDate).isBefore(minDate)) return false;
|
|
94
|
-
if (moment(newDate).isAfter(maxDate)) return false;
|
|
95
|
-
|
|
96
|
-
return true;
|
|
97
|
-
};
|
|
98
|
-
const onArrowMouseDown = (type, value) => {
|
|
99
|
-
setIsMouseDown(true);
|
|
100
|
-
setMouseDownOn({ type, value });
|
|
101
|
-
};
|
|
102
|
-
const onArrowMouseUp = () => {
|
|
103
|
-
setIsMouseDown(false);
|
|
104
|
-
setMouseDownOn(null);
|
|
105
|
-
};
|
|
106
|
-
const onWheel = (e, type) => {
|
|
107
|
-
e.preventDefault();
|
|
108
|
-
|
|
109
|
-
const { deltaY } = e;
|
|
110
|
-
const top = window.scrollX;
|
|
111
|
-
const left = window.scrollY;
|
|
112
|
-
|
|
113
|
-
window.scrollTo({ top, left });
|
|
114
|
-
|
|
115
|
-
changeItem(type, deltaY < 0 ? -1 : 1);
|
|
116
|
-
};
|
|
117
|
-
const onTouchStart = (e, type) => {
|
|
118
|
-
e.preventDefault();
|
|
119
|
-
|
|
120
|
-
if (intervalRef?.current) {
|
|
121
|
-
clearInterval(intervalRef?.current);
|
|
122
|
-
intervalRef.current = null;
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
const { timeStamp, changedTouches } = e;
|
|
126
|
-
const { pageY } = changedTouches[0];
|
|
127
|
-
|
|
128
|
-
setTouchY(pageY);
|
|
129
|
-
setTouchTimestamp(timeStamp);
|
|
130
|
-
setTouchType(type);
|
|
131
|
-
|
|
132
|
-
window.addEventListener(
|
|
133
|
-
'touchend',
|
|
134
|
-
e => onTouchEnd(e, pageY, timeStamp, type),
|
|
135
|
-
{ once: true },
|
|
136
|
-
);
|
|
137
|
-
};
|
|
138
|
-
const onTouchMove = (e) => {
|
|
139
|
-
if (!touchY || !touchType) return;
|
|
140
|
-
|
|
141
|
-
const { timeStamp, changedTouches } = e;
|
|
142
|
-
const { pageY } = changedTouches[0];
|
|
143
|
-
|
|
144
|
-
const deltaY = touchY - pageY;
|
|
145
|
-
|
|
146
|
-
if (Math.abs(deltaY) < listItemHeight) return;
|
|
147
|
-
|
|
148
|
-
const direction = deltaY < 0 ? -1 : 1;
|
|
149
|
-
|
|
150
|
-
setScrollDirection(direction);
|
|
151
|
-
|
|
152
|
-
changeItem(touchType, direction);
|
|
153
|
-
setTouchY(pageY);
|
|
154
|
-
setTouchTimestamp(timeStamp);
|
|
155
|
-
};
|
|
156
|
-
const onTouchEnd = (e, startY, startTime, touchType) => {
|
|
157
|
-
const { timeStamp, changedTouches } = e;
|
|
158
|
-
const { pageY } = changedTouches[0];
|
|
159
|
-
|
|
160
|
-
const path = Math.abs(startY - pageY); // in px
|
|
161
|
-
const time = timeStamp - startTime; // ms
|
|
162
|
-
const pxPerMs = path / time;
|
|
163
|
-
|
|
164
|
-
if (pxPerMs > 0.65)
|
|
165
|
-
innertionScroll({ startY, pageY, timeStamp, startTime, touchType });
|
|
166
|
-
else setTouchType(null);
|
|
167
|
-
|
|
168
|
-
setTouchY(null);
|
|
169
|
-
};
|
|
170
|
-
const innertionScroll = ({
|
|
171
|
-
startY,
|
|
172
|
-
pageY,
|
|
173
|
-
timeStamp,
|
|
174
|
-
startTime,
|
|
175
|
-
touchType,
|
|
176
|
-
}) => {
|
|
177
|
-
const path = Math.abs(startY - pageY); // in px
|
|
178
|
-
const time = timeStamp - startTime; // ms
|
|
179
|
-
const pxPerMs = Math.ceil(path / time); // speed
|
|
180
|
-
|
|
181
|
-
const S = (pxPerMs / 2) * time;
|
|
182
|
-
const blocks = Math.ceil((S / listItemHeight) * pxPerMs);
|
|
183
|
-
|
|
184
|
-
let i = 1;
|
|
185
|
-
|
|
186
|
-
intervalRef.current = setInterval(() => {
|
|
187
|
-
if (
|
|
188
|
-
checkAvailability(touchType, startY - pageY < 0 ? -1 : 1, date)
|
|
189
|
-
&& i <= blocks
|
|
190
|
-
) {
|
|
191
|
-
changeItem(touchType, startY - pageY < 0 ? -1 : 1);
|
|
192
|
-
}
|
|
193
|
-
else {
|
|
194
|
-
setTouchType(null);
|
|
195
|
-
clearInterval(intervalRef?.current);
|
|
196
|
-
intervalRef.current = null;
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
++i;
|
|
200
|
-
}, timeout);
|
|
201
|
-
|
|
202
|
-
// for(let i = 1; i <= blocks; ++i){
|
|
203
|
-
// // timeout = i*pxPerMs+Math.pow(i,2)*10;
|
|
204
|
-
// timeout += 80;
|
|
205
|
-
// if(checkAvailability(touchType, startY-pageY < 0 ? -1 : 1, date)){
|
|
206
|
-
// setTimeout(() => {
|
|
207
|
-
// console.log({timeout})
|
|
208
|
-
// changeItem(touchType, startY-pageY < 0 ? -1 : 1);
|
|
209
|
-
// }, timeout)
|
|
210
|
-
// }
|
|
211
|
-
|
|
212
|
-
// }
|
|
213
|
-
};
|
|
214
|
-
|
|
215
|
-
// --FUNCTIONS--//
|
|
216
|
-
const intervalWorker = () => {
|
|
217
|
-
if (!mouseDownOn) return;
|
|
218
|
-
|
|
219
|
-
const { type, value } = mouseDownOn;
|
|
220
|
-
changeItem(type, value);
|
|
221
|
-
};
|
|
222
|
-
const getList = (type, format) => {
|
|
223
|
-
const list = [];
|
|
224
|
-
|
|
225
|
-
const renderRows = rows;
|
|
226
|
-
|
|
227
|
-
for (let i = (renderRows - 1) / 2; i >= ((renderRows - 1) / 2) * -1; --i) {
|
|
228
|
-
list.push(moment(date).subtract(i, type).format(format));
|
|
229
|
-
}
|
|
230
|
-
|
|
231
|
-
return list;
|
|
232
|
-
};
|
|
233
|
-
const getMonthList = () => getList('months', 'MMMM');
|
|
234
|
-
const getDaysList = () => getList('days', 'D');
|
|
235
|
-
const getYearsList = () => getList('years', 'YYYY');
|
|
236
|
-
|
|
237
|
-
// --OBSERVERS--//
|
|
238
|
-
useEffect(() => {
|
|
239
|
-
if (moment(date.format('L')).isBefore(minDate.format('L')))
|
|
240
|
-
setDate(minDate);
|
|
241
|
-
if (moment(date.format('L')).isAfter(maxDate.format('L'))) setDate(maxDate);
|
|
242
|
-
}, []);
|
|
243
|
-
|
|
244
|
-
// Events Observer
|
|
245
|
-
useEffect(() => {
|
|
246
|
-
document.addEventListener('mouseup', onArrowMouseUp);
|
|
247
|
-
return () => {
|
|
248
|
-
document.removeEventListener('mouseup', onArrowMouseUp);
|
|
249
|
-
};
|
|
250
|
-
}, []);
|
|
251
|
-
|
|
252
|
-
useEffect(() => {
|
|
253
|
-
onChange(date);
|
|
254
|
-
dateRef.current = date;
|
|
255
|
-
|
|
256
|
-
if (moment(date.format('L')).isSame(minDate.format('L')))
|
|
257
|
-
onMinDateReached(minDate);
|
|
258
|
-
if (moment(date.format('L')).isSame(maxDate.format('L')))
|
|
259
|
-
onMaxDateReached(maxDate);
|
|
260
|
-
}, [date]);
|
|
261
|
-
|
|
262
|
-
// monthList Events
|
|
263
|
-
useEffect(() => {
|
|
264
|
-
if (monthsListRef?.current) {
|
|
265
|
-
monthsListRef?.current?.addEventListener(
|
|
266
|
-
'mousewheel',
|
|
267
|
-
e => onWheel(e, 'months'),
|
|
268
|
-
{ passive: false },
|
|
269
|
-
);
|
|
270
|
-
monthsListRef?.current?.addEventListener(
|
|
271
|
-
'touchstart',
|
|
272
|
-
e => onTouchStart(e, 'months'),
|
|
273
|
-
{ passive: false },
|
|
274
|
-
);
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
return () => {
|
|
278
|
-
monthsListRef?.current?.clearEventListeners('mousewheel');
|
|
279
|
-
monthsListRef?.current?.clearEventListeners('touchstart');
|
|
280
|
-
};
|
|
281
|
-
}, [monthsListRef]);
|
|
282
|
-
|
|
283
|
-
// daysList Events
|
|
284
|
-
useEffect(() => {
|
|
285
|
-
if (daysListRef?.current) {
|
|
286
|
-
daysListRef?.current?.addEventListener(
|
|
287
|
-
'mousewheel',
|
|
288
|
-
e => onWheel(e, 'days'),
|
|
289
|
-
{ passive: false },
|
|
290
|
-
);
|
|
291
|
-
daysListRef?.current?.addEventListener(
|
|
292
|
-
'touchstart',
|
|
293
|
-
e => onTouchStart(e, 'days'),
|
|
294
|
-
{ passive: false },
|
|
295
|
-
);
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
return () => {
|
|
299
|
-
daysListRef?.current?.clearEventListeners('mousewheel');
|
|
300
|
-
daysListRef?.current?.clearEventListeners('touchstart');
|
|
301
|
-
};
|
|
302
|
-
}, [daysListRef]);
|
|
303
|
-
|
|
304
|
-
// yearsList Events
|
|
305
|
-
useEffect(() => {
|
|
306
|
-
if (yearsListRef?.current) {
|
|
307
|
-
yearsListRef?.current?.addEventListener(
|
|
308
|
-
'mousewheel',
|
|
309
|
-
e => onWheel(e, 'years'),
|
|
310
|
-
{ passive: false },
|
|
311
|
-
);
|
|
312
|
-
yearsListRef?.current?.addEventListener(
|
|
313
|
-
'touchstart',
|
|
314
|
-
e => onTouchStart(e, 'years'),
|
|
315
|
-
{ passive: false },
|
|
316
|
-
);
|
|
317
|
-
}
|
|
318
|
-
|
|
319
|
-
return () => {
|
|
320
|
-
yearsListRef?.current?.clearEventListeners('mousewheel');
|
|
321
|
-
yearsListRef?.current?.clearEventListeners('touchstart');
|
|
322
|
-
};
|
|
323
|
-
}, [yearsListRef]);
|
|
324
|
-
|
|
325
|
-
// --RENDER--//
|
|
326
|
-
const renderMonthsList = () => {
|
|
327
|
-
const half = (rows - 1) / 2;
|
|
328
|
-
return getMonthList().map((month, i) => (
|
|
329
|
-
<div
|
|
330
|
-
className={`mobile-calendar_wrapper_body_months-list--item ${i === half ? 'active' : ''} ${
|
|
331
|
-
i === 0 || i === rows - 1 ? 'transparent' : ''
|
|
332
|
-
} ${classes?.monthsListItem} ${i === half ? classes?.activeItem : ''}`}
|
|
333
|
-
key={`month-${month}`}
|
|
334
|
-
onClick={
|
|
335
|
-
touchY
|
|
336
|
-
? null
|
|
337
|
-
: () => (i - half === 0 ? {} : changeItem('months', i - half))
|
|
338
|
-
}
|
|
339
|
-
attr-scroll-direction={touchType === 'months' ? scrollDirection : 0}
|
|
340
|
-
attr-is-scrolling={touchType === 'months' ? 1 : 0}
|
|
341
|
-
>
|
|
342
|
-
{month}
|
|
343
|
-
</div>
|
|
344
|
-
));
|
|
345
|
-
};
|
|
346
|
-
const renderDaysList = () => {
|
|
347
|
-
const half = (rows - 1) / 2;
|
|
348
|
-
return getDaysList().map((day, i) => (
|
|
349
|
-
<div
|
|
350
|
-
className={`mobile-calendar_wrapper_body_days-list--item ${i === half ? 'active' : ''} ${
|
|
351
|
-
i === 0 || i === rows - 1 ? 'transparent' : ''
|
|
352
|
-
} ${classes?.daysListItem} ${i === half ? classes?.activeItem : ''}`}
|
|
353
|
-
key={`day-${day}`}
|
|
354
|
-
onClick={() => (i - half === 0 ? {} : changeItem('days', i - half))}
|
|
355
|
-
attr-scroll-direction={touchType === 'days' ? scrollDirection : 0}
|
|
356
|
-
attr-is-scrolling={touchType === 'days' ? 1 : 0}
|
|
357
|
-
>
|
|
358
|
-
{day}
|
|
359
|
-
</div>
|
|
360
|
-
));
|
|
361
|
-
};
|
|
362
|
-
const renderYearsList = () => {
|
|
363
|
-
const half = (rows - 1) / 2;
|
|
364
|
-
return getYearsList().map((year, i) => (
|
|
365
|
-
<div
|
|
366
|
-
className={`mobile-calendar_wrapper_body_years-list--item ${i === half ? 'active' : ''} ${
|
|
367
|
-
i === 0 || i === rows - 1 ? 'transparent' : ''
|
|
368
|
-
} ${classes?.yearsListItem} ${i === half ? classes?.activeItem : ''}`}
|
|
369
|
-
key={`year-${year}`}
|
|
370
|
-
onClick={() => (i - half === 0 ? {} : changeItem('years', i - half))}
|
|
371
|
-
attr-scroll-direction={touchType === 'years' ? scrollDirection : 0}
|
|
372
|
-
attr-is-scrolling={touchType === 'years' ? 1 : 0}
|
|
373
|
-
>
|
|
374
|
-
{year}
|
|
375
|
-
</div>
|
|
376
|
-
));
|
|
377
|
-
};
|
|
378
|
-
|
|
379
|
-
const renderMonthsBlock = () => {
|
|
380
|
-
return (
|
|
381
|
-
<div
|
|
382
|
-
className={`mobile-calendar_wrapper_body_months ${classes?.monthsBlock}`}
|
|
383
|
-
>
|
|
384
|
-
<div
|
|
385
|
-
className={`mobile-calendar_wrapper_body_months--prev ${classes?.prevItem}`}
|
|
386
|
-
>
|
|
387
|
-
<ChevronUp
|
|
388
|
-
onClick={() => changeItem('months', -1)}
|
|
389
|
-
onMouseDown={() => onArrowMouseDown('months', -1)}
|
|
390
|
-
onMouseUp={onArrowMouseUp}
|
|
391
|
-
/>
|
|
392
|
-
</div>
|
|
393
|
-
<div
|
|
394
|
-
className={`mobile-calendar_wrapper_body_months-list ${classes?.monthsList}`}
|
|
395
|
-
ref={monthsListRef}
|
|
396
|
-
>
|
|
397
|
-
{renderMonthsList()}
|
|
398
|
-
{isMobile && (
|
|
399
|
-
<div className="mobile-calendar_wrapper_body_months-list_touch-zone"></div>
|
|
400
|
-
)}
|
|
401
|
-
</div>
|
|
402
|
-
<div
|
|
403
|
-
className={`mobile-calendar_wrapper_body_months--next ${classes?.nextItem}`}
|
|
404
|
-
>
|
|
405
|
-
<ChevronDown
|
|
406
|
-
onClick={() => changeItem('months', 1)}
|
|
407
|
-
onMouseDown={() => onArrowMouseDown('months', 1)}
|
|
408
|
-
onMouseUp={onArrowMouseUp}
|
|
409
|
-
/>
|
|
410
|
-
</div>
|
|
411
|
-
</div>
|
|
412
|
-
);
|
|
413
|
-
};
|
|
414
|
-
const renderDaysBlock = () => {
|
|
415
|
-
return (
|
|
416
|
-
<div
|
|
417
|
-
className={`mobile-calendar_wrapper_body_days ${classes?.daysBlock}`}
|
|
418
|
-
>
|
|
419
|
-
<div
|
|
420
|
-
className={`mobile-calendar_wrapper_body_days--prev ${classes?.prevItem}`}
|
|
421
|
-
>
|
|
422
|
-
<ChevronUp
|
|
423
|
-
onClick={() => changeItem('days', -1)}
|
|
424
|
-
onMouseDown={() => onArrowMouseDown('days', -1)}
|
|
425
|
-
onMouseUp={onArrowMouseUp}
|
|
426
|
-
/>
|
|
427
|
-
</div>
|
|
428
|
-
<div
|
|
429
|
-
className={`mobile-calendar_wrapper_body_days-list ${classes?.daysList}`}
|
|
430
|
-
ref={daysListRef}
|
|
431
|
-
>
|
|
432
|
-
{renderDaysList()}
|
|
433
|
-
{isMobile && (
|
|
434
|
-
<div className="mobile-calendar_wrapper_body_days-list_touch-zone"></div>
|
|
435
|
-
)}
|
|
436
|
-
</div>
|
|
437
|
-
<div
|
|
438
|
-
className={`mobile-calendar_wrapper_body_days--next ${classes?.nextItem}`}
|
|
439
|
-
>
|
|
440
|
-
<ChevronDown
|
|
441
|
-
onClick={() => changeItem('days', 1)}
|
|
442
|
-
onMouseDown={() => onArrowMouseDown('days', 1)}
|
|
443
|
-
onMouseUp={onArrowMouseUp}
|
|
444
|
-
/>
|
|
445
|
-
</div>
|
|
446
|
-
</div>
|
|
447
|
-
);
|
|
448
|
-
};
|
|
449
|
-
const renderYearsBlock = () => {
|
|
450
|
-
return (
|
|
451
|
-
<div
|
|
452
|
-
className={`mobile-calendar_wrapper_body_years ${classes?.yearsBlock}`}
|
|
453
|
-
>
|
|
454
|
-
<div
|
|
455
|
-
className={`mobile-calendar_wrapper_body_years--prev ${classes?.prevItem}`}
|
|
456
|
-
>
|
|
457
|
-
<ChevronUp
|
|
458
|
-
onClick={() => changeItem('years', -1)}
|
|
459
|
-
onMouseDown={() => onArrowMouseDown('years', -1)}
|
|
460
|
-
onMouseUp={onArrowMouseUp}
|
|
461
|
-
/>
|
|
462
|
-
</div>
|
|
463
|
-
<div
|
|
464
|
-
className={`mobile-calendar_wrapper_body_years-list ${classes?.yearsList}`}
|
|
465
|
-
ref={yearsListRef}
|
|
466
|
-
>
|
|
467
|
-
{renderYearsList()}
|
|
468
|
-
{isMobile && (
|
|
469
|
-
<div className="mobile-calendar_wrapper_body_years-list_touch-zone"></div>
|
|
470
|
-
)}
|
|
471
|
-
</div>
|
|
472
|
-
<div
|
|
473
|
-
className={`mobile-calendar_wrapper_body_years--next ${classes?.nextItem}`}
|
|
474
|
-
>
|
|
475
|
-
<ChevronDown
|
|
476
|
-
onClick={() => changeItem('years', 1)}
|
|
477
|
-
onMouseDown={() => onArrowMouseDown('years', 1)}
|
|
478
|
-
onMouseUp={onArrowMouseUp}
|
|
479
|
-
/>
|
|
480
|
-
</div>
|
|
481
|
-
</div>
|
|
482
|
-
);
|
|
483
|
-
};
|
|
484
|
-
|
|
485
|
-
return (
|
|
486
|
-
<div
|
|
487
|
-
className={`mobile-calendar_wrapper ${classes?.wrapper}`}
|
|
488
|
-
onTouchMove={onTouchMove}
|
|
489
|
-
>
|
|
490
|
-
<div className={`mobile-calendar_wrapper_label ${classes?.label}`}>
|
|
491
|
-
{label}
|
|
492
|
-
</div>
|
|
493
|
-
{showSelectedDate && (
|
|
494
|
-
<div className={`mobile-calendar_wrapper_label ${classes?.label}`}>
|
|
495
|
-
{moment(date).format('LL')}
|
|
496
|
-
</div>
|
|
497
|
-
)}
|
|
498
|
-
<div className={`mobile-calendar_wrapper_body ${classes?.body}`}>
|
|
499
|
-
{renderMonthsBlock()}
|
|
500
|
-
{renderDaysBlock()}
|
|
501
|
-
{renderYearsBlock()}
|
|
502
|
-
</div>
|
|
503
|
-
</div>
|
|
504
|
-
);
|
|
505
|
-
}
|
|
506
|
-
|
|
507
|
-
export default MobileCalendar;
|
|
1
|
+
function n(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=Array(e);t<e;t++)r[t]=n[t];return r}function e(e,t){return function(n){if(Array.isArray(n))return n}(e)||function(n,e){var t,r,a=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null!=a){var o=[],l=!0,i=!1;try{for(a=a.call(n);!(l=(t=a.next()).done)&&(o.push(t.value),!e||o.length!==e);l=!0);}catch(n){i=!0,r=n}finally{try{l||null==a.return||a.return()}finally{if(i)throw r}}return o}}(e,t)||function(e,t){if(e){if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);if("Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r)return Array.from(r);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return n(e,t)}}(e,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.")}()}import{jsx as t,jsxs as r}from"react/jsx-runtime";import a from"moment";import{useEffect as o,useRef as l,useState as i}from"react";import{ChevronDown as c,ChevronUp as u}from"react-feather";import"./MobileCalendar.scss";require("../../../Functions/customEventListener");export default function(n){var s,d,m,v=n.min,p=void 0===v?a().subtract("10","years"):v,f=n.max,y=void 0===f?a().add("10","years"):f,h=n.value,b=void 0===h?a():h,_=n.rows,w=void 0===_?5:_,L=n.label,M=n.timeout,I=void 0===M?75:M,N=n.isMobile,g=void 0===N||N,E=n.showSelectedDate,k=n.listItemHeight,S=void 0===k?32:k,x=n.classes,Y=void 0===x?{wrapper:"",label:"",body:"",yearsBlock:"",yearsList:"",yearsListItem:"",monthsBlock:"",monthsList:"",monthsListItem:"",daysBlock:"",daysList:"",daysListItem:"",prevItem:"",nextItem:"",activeItem:""}:x,C=n.onChange,D=void 0===C?function(){}:C,T=n.onMinDateReached,A=void 0===T?function(){}:T,B=n.onMaxDateReached,U=void 0===B?function(){}:B;document.querySelector("body"),document.querySelector(".mobile-calendar_wrapper_body_months-list--item");var j=e(i(b?a(b):a()),2),q=j[0],z=j[1],O=e(i(a(p)),2),R=O[0];O[1];var F=e(i(a(y)),2),H=F[0];F[1];var X=e(i(!1),2),$=(X[0],X[1]),G=e(i(null),2),J=(G[0],G[1]),K=e(i(null),2);K[0],K[1];var P=e(i(null),2),Q=P[0],V=P[1],W=e(i(null),2),Z=W[0],nn=W[1],ne=e(i(null),2),nt=(ne[0],ne[1]),nr=e(i(0),2),na=nr[0],no=nr[1],nl=l(null),ni=l(null),nc=l(null),nu=l(null),ns=l(null),nd=function(n,e){no(e),z(function(t){var r=a(t).add(e,n);return a(r).isBefore(R)?R:a(r).isAfter(H)?H:r}),setTimeout(function(){no(0)},50)},nm=function(n,e){if(!(null==nu?void 0:nu.current))return!1;var t=a(null==nu?void 0:nu.current).add(e,n);return!(a(t).isBefore(R)||a(t).isAfter(H))},nv=function(n,e){$(!0),J({type:n,value:e})},np=function(){$(!1),J(null)},nf=function(n,e){n.preventDefault();var t=n.deltaY,r=window.scrollX,a=window.scrollY;window.scrollTo({top:r,left:a}),nd(e,t<0?-1:1)},ny=function(n,e){n.preventDefault(),(null==ns?void 0:ns.current)&&(clearInterval(null==ns?void 0:ns.current),ns.current=null);var t=n.timeStamp,r=n.changedTouches[0].pageY;V(r),nt(t),nn(e),window.addEventListener("touchend",function(n){return nh(n,r,t,e)},{once:!0})},nh=function(n,e,t,r){var a=n.timeStamp,o=n.changedTouches[0].pageY;Math.abs(e-o)/(a-t)>.65?nb({startY:e,pageY:o,timeStamp:a,startTime:t,touchType:r}):nn(null),V(null)},nb=function(n){var e=n.startY,t=n.pageY,r=n.timeStamp,a=n.startTime,o=n.touchType,l=r-a,i=Math.ceil(Math.abs(e-t)/l),c=Math.ceil(i/2*l/S*i),u=1;ns.current=setInterval(function(){nm(o,e-t<0?-1:1,q)&&u<=c?nd(o,e-t<0?-1:1):(nn(null),clearInterval(null==ns?void 0:ns.current),ns.current=null),++u},I)},n_=function(n,e){for(var t=[],r=(w-1)/2;r>=-((w-1)/2*1);--r)t.push(a(q).subtract(r,n).format(e));return t};o(function(){a(q.format("L")).isBefore(R.format("L"))&&z(R),a(q.format("L")).isAfter(H.format("L"))&&z(H)},[]),o(function(){return document.addEventListener("mouseup",np),function(){document.removeEventListener("mouseup",np)}},[]),o(function(){D(q),nu.current=q,a(q.format("L")).isSame(R.format("L"))&&A(R),a(q.format("L")).isSame(H.format("L"))&&U(H)},[q]),o(function(){if(null==nl?void 0:nl.current){var n,e;null==nl||null==(n=nl.current)||n.addEventListener("mousewheel",function(n){return nf(n,"months")},{passive:!1}),null==nl||null==(e=nl.current)||e.addEventListener("touchstart",function(n){return ny(n,"months")},{passive:!1})}return function(){var n,e;null==nl||null==(n=nl.current)||n.clearEventListeners("mousewheel"),null==nl||null==(e=nl.current)||e.clearEventListeners("touchstart")}},[nl]),o(function(){if(null==ni?void 0:ni.current){var n,e;null==ni||null==(n=ni.current)||n.addEventListener("mousewheel",function(n){return nf(n,"days")},{passive:!1}),null==ni||null==(e=ni.current)||e.addEventListener("touchstart",function(n){return ny(n,"days")},{passive:!1})}return function(){var n,e;null==ni||null==(n=ni.current)||n.clearEventListeners("mousewheel"),null==ni||null==(e=ni.current)||e.clearEventListeners("touchstart")}},[ni]),o(function(){if(null==nc?void 0:nc.current){var n,e;null==nc||null==(n=nc.current)||n.addEventListener("mousewheel",function(n){return nf(n,"years")},{passive:!1}),null==nc||null==(e=nc.current)||e.addEventListener("touchstart",function(n){return ny(n,"years")},{passive:!1})}return function(){var n,e;null==nc||null==(n=nc.current)||n.clearEventListeners("mousewheel"),null==nc||null==(e=nc.current)||e.clearEventListeners("touchstart")}},[nc]);return r("div",{className:"mobile-calendar_wrapper ".concat(null==Y?void 0:Y.wrapper),onTouchMove:function(n){if(Q&&Z){var e=n.timeStamp,t=n.changedTouches[0].pageY,r=Q-t;if(!(Math.abs(r)<S)){var a=r<0?-1:1;no(a),nd(Z,a),V(t),nt(e)}}},children:[t("div",{className:"mobile-calendar_wrapper_label ".concat(null==Y?void 0:Y.label),children:void 0===L?"":L}),void 0!==E&&E&&t("div",{className:"mobile-calendar_wrapper_label ".concat(null==Y?void 0:Y.label),children:a(q).format("LL")}),r("div",{className:"mobile-calendar_wrapper_body ".concat(null==Y?void 0:Y.body),children:[r("div",{className:"mobile-calendar_wrapper_body_months ".concat(null==Y?void 0:Y.monthsBlock),children:[t("div",{className:"mobile-calendar_wrapper_body_months--prev ".concat(null==Y?void 0:Y.prevItem),children:t(u,{onClick:function(){return nd("months",-1)},onMouseDown:function(){return nv("months",-1)},onMouseUp:np})}),r("div",{className:"mobile-calendar_wrapper_body_months-list ".concat(null==Y?void 0:Y.monthsList),ref:nl,children:[(s=(w-1)/2,n_("months","MMMM").map(function(n,e){return t("div",{className:"mobile-calendar_wrapper_body_months-list--item ".concat(e===s?"active":""," ").concat(0===e||e===w-1?"transparent":""," ").concat(null==Y?void 0:Y.monthsListItem," ").concat(e===s?null==Y?void 0:Y.activeItem:""),onClick:Q?null:function(){return e-s==0?{}:nd("months",e-s)},"attr-scroll-direction":"months"===Z?na:0,"attr-is-scrolling":+("months"===Z),children:n},"month-".concat(n))})),g&&t("div",{className:"mobile-calendar_wrapper_body_months-list_touch-zone"})]}),t("div",{className:"mobile-calendar_wrapper_body_months--next ".concat(null==Y?void 0:Y.nextItem),children:t(c,{onClick:function(){return nd("months",1)},onMouseDown:function(){return nv("months",1)},onMouseUp:np})})]}),r("div",{className:"mobile-calendar_wrapper_body_days ".concat(null==Y?void 0:Y.daysBlock),children:[t("div",{className:"mobile-calendar_wrapper_body_days--prev ".concat(null==Y?void 0:Y.prevItem),children:t(u,{onClick:function(){return nd("days",-1)},onMouseDown:function(){return nv("days",-1)},onMouseUp:np})}),r("div",{className:"mobile-calendar_wrapper_body_days-list ".concat(null==Y?void 0:Y.daysList),ref:ni,children:[(d=(w-1)/2,n_("days","D").map(function(n,e){return t("div",{className:"mobile-calendar_wrapper_body_days-list--item ".concat(e===d?"active":""," ").concat(0===e||e===w-1?"transparent":""," ").concat(null==Y?void 0:Y.daysListItem," ").concat(e===d?null==Y?void 0:Y.activeItem:""),onClick:function(){return e-d==0?{}:nd("days",e-d)},"attr-scroll-direction":"days"===Z?na:0,"attr-is-scrolling":+("days"===Z),children:n},"day-".concat(n))})),g&&t("div",{className:"mobile-calendar_wrapper_body_days-list_touch-zone"})]}),t("div",{className:"mobile-calendar_wrapper_body_days--next ".concat(null==Y?void 0:Y.nextItem),children:t(c,{onClick:function(){return nd("days",1)},onMouseDown:function(){return nv("days",1)},onMouseUp:np})})]}),r("div",{className:"mobile-calendar_wrapper_body_years ".concat(null==Y?void 0:Y.yearsBlock),children:[t("div",{className:"mobile-calendar_wrapper_body_years--prev ".concat(null==Y?void 0:Y.prevItem),children:t(u,{onClick:function(){return nd("years",-1)},onMouseDown:function(){return nv("years",-1)},onMouseUp:np})}),r("div",{className:"mobile-calendar_wrapper_body_years-list ".concat(null==Y?void 0:Y.yearsList),ref:nc,children:[(m=(w-1)/2,n_("years","YYYY").map(function(n,e){return t("div",{className:"mobile-calendar_wrapper_body_years-list--item ".concat(e===m?"active":""," ").concat(0===e||e===w-1?"transparent":""," ").concat(null==Y?void 0:Y.yearsListItem," ").concat(e===m?null==Y?void 0:Y.activeItem:""),onClick:function(){return e-m==0?{}:nd("years",e-m)},"attr-scroll-direction":"years"===Z?na:0,"attr-is-scrolling":+("years"===Z),children:n},"year-".concat(n))})),g&&t("div",{className:"mobile-calendar_wrapper_body_years-list_touch-zone"})]}),t("div",{className:"mobile-calendar_wrapper_body_years--next ".concat(null==Y?void 0:Y.nextItem),children:t(c,{onClick:function(){return nd("years",1)},onMouseDown:function(){return nv("years",1)},onMouseUp:np})})]})]})]})}
|