intelicoreact 1.8.6 → 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/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.d.ts +0 -5
- package/dist/Atomic/FormElements/RangeInputs/RangeInputs.js.map +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/RangeInputs/{RangeInputs.js → RangeInputs.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,46 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import CheckboxInput from '../CheckboxInput/CheckboxInput';
|
|
4
|
-
import Input from '../Input/Input';
|
|
5
|
-
|
|
6
|
-
import './MultiSelect.scss';
|
|
7
|
-
|
|
8
|
-
function MultiSelect({ options, chosenOptions, onChange }) {
|
|
9
|
-
const [searchValue, setSearchValue] = useState('');
|
|
10
|
-
|
|
11
|
-
const checkHandler = (state, value) => {
|
|
12
|
-
if (state) {
|
|
13
|
-
onChange([...chosenOptions, value]);
|
|
14
|
-
}
|
|
15
|
-
else {
|
|
16
|
-
onChange(chosenOptions.filter(item => item !== value));
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
|
|
20
|
-
const filteredOptions = options.filter(({ label }) =>
|
|
21
|
-
label.toLowerCase().includes(searchValue.toLowerCase()),
|
|
22
|
-
);
|
|
23
|
-
|
|
24
|
-
return (
|
|
25
|
-
<div className="multiselect">
|
|
26
|
-
<Input
|
|
27
|
-
value={searchValue}
|
|
28
|
-
onChange={value => setSearchValue(value)}
|
|
29
|
-
placeholder="Search"
|
|
30
|
-
/>
|
|
31
|
-
<div className="multiselect__list">
|
|
32
|
-
{filteredOptions.map(({ label, value, id }) => (
|
|
33
|
-
<CheckboxInput
|
|
34
|
-
key={id}
|
|
35
|
-
value={chosenOptions.includes(value)}
|
|
36
|
-
label={label}
|
|
37
|
-
onChange={state => checkHandler(state, value)}
|
|
38
|
-
className="multiselect__item"
|
|
39
|
-
/>
|
|
40
|
-
))}
|
|
41
|
-
</div>
|
|
42
|
-
</div>
|
|
43
|
-
);
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export default MultiSelect;
|
|
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){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)}}import{jsx as e,jsxs as n}from"react/jsx-runtime";import{useState as o}from"react";import a from"../CheckboxInput/CheckboxInput";import i from"../Input/Input";import"./MultiSelect.scss";export default function(l){var u,c=l.options,s=l.chosenOptions,f=l.onChange,m=(u=o(""),function(t){if(Array.isArray(t))return t}(u)||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}}(u,2)||r(u,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.")}()),p=m[0],y=m[1],d=function(e,n){if(e)f(((function(r){if(Array.isArray(r))return t(r)})(s)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(s)||r(s)||function(){throw TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()).concat([n]));else f(s.filter(function(t){return t!==n}))},h=c.filter(function(t){return t.label.toLowerCase().includes(p.toLowerCase())});return n("div",{className:"multiselect",children:[e(i,{value:p,onChange:function(t){return y(t)},placeholder:"Search"}),e("div",{className:"multiselect__list",children:h.map(function(t){var r=t.label,n=t.value,o=t.id;return e(a,{value:s.includes(n),label:r,onChange:function(t){return d(t,n)},className:"multiselect__item"},o)})})]})}
|
|
@@ -1,337 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import { useEffect, useRef, useState } from 'react';
|
|
4
|
-
import { Minus, Plus } from 'react-feather';
|
|
5
|
-
|
|
6
|
-
import { KEYBOARD_SERVICE_KEYS } from '../../../Constants/index.constants';
|
|
7
|
-
import {
|
|
8
|
-
formatToAddBitDepthPoints as addCommas,
|
|
9
|
-
filterNumeric,
|
|
10
|
-
formatToRemoveComa as removeCommas,
|
|
11
|
-
} from '../../../Functions/fieldValueFormatters';
|
|
12
|
-
import Spinner from '../../Layout/Spinner/Spinner';
|
|
13
|
-
|
|
14
|
-
import './NumericInput.scss';
|
|
15
|
-
|
|
16
|
-
function NumericInput({
|
|
17
|
-
disabled,
|
|
18
|
-
withDelete,
|
|
19
|
-
numStep = 1,
|
|
20
|
-
min = 0,
|
|
21
|
-
max,
|
|
22
|
-
value,
|
|
23
|
-
placeholder,
|
|
24
|
-
className,
|
|
25
|
-
testId = 'numeric-input',
|
|
26
|
-
name,
|
|
27
|
-
fieldKey,
|
|
28
|
-
id,
|
|
29
|
-
|
|
30
|
-
onChange = () => {},
|
|
31
|
-
onBlur = () => {},
|
|
32
|
-
onFocus = () => {},
|
|
33
|
-
onKeyUp = () => {},
|
|
34
|
-
onKeyDown = () => {},
|
|
35
|
-
|
|
36
|
-
maskChar,
|
|
37
|
-
formatChars,
|
|
38
|
-
error,
|
|
39
|
-
icon,
|
|
40
|
-
isNotBlinkErrors,
|
|
41
|
-
blinkTime,
|
|
42
|
-
isPriceInput,
|
|
43
|
-
isFocusDefault = false,
|
|
44
|
-
isNotRenderButtons = false,
|
|
45
|
-
isUseAutoSelect = true,
|
|
46
|
-
isLoading = false,
|
|
47
|
-
isAllowNullValue = false,
|
|
48
|
-
onlyNumbers = {
|
|
49
|
-
type: 'int',
|
|
50
|
-
},
|
|
51
|
-
|
|
52
|
-
attributesOfNativeInput = {},
|
|
53
|
-
}) {
|
|
54
|
-
const DEFAULT_BLINK_TIME = 200;
|
|
55
|
-
|
|
56
|
-
// REFS
|
|
57
|
-
const inputRef = useRef(null);
|
|
58
|
-
const decRef = useRef(null);
|
|
59
|
-
const incRef = useRef(null);
|
|
60
|
-
const wrapRef = useRef(null);
|
|
61
|
-
|
|
62
|
-
// STATES
|
|
63
|
-
const initialMin = isAllowNullValue ? '' : min;
|
|
64
|
-
const [inputValue, setInputValue] = useState(value || initialMin);
|
|
65
|
-
const [inputValueFormated, setInputValueFormated] = useState(inputValue);
|
|
66
|
-
const [intMemoVal, setIntMemoVal] = useState(0);
|
|
67
|
-
|
|
68
|
-
const [isFocused, setIsFocused] = useState(false);
|
|
69
|
-
|
|
70
|
-
const [isAttemptToChange, setIsAttemptToChange] = useState(false);
|
|
71
|
-
const [isToHighlightError, setIsToHighlightError] = useState(false);
|
|
72
|
-
|
|
73
|
-
const [prevValue, setPreviousValue] = useState(value || initialMin);
|
|
74
|
-
|
|
75
|
-
const setCursorToEnd = () => {
|
|
76
|
-
const input = inputRef.current;
|
|
77
|
-
const cursor = input?.value?.length;
|
|
78
|
-
if (input) setTimeout(() => input.setSelectionRange(cursor, cursor), 10);
|
|
79
|
-
};
|
|
80
|
-
|
|
81
|
-
// HANDLES
|
|
82
|
-
const handle = {
|
|
83
|
-
change: (e) => {
|
|
84
|
-
const inputValue = e.target
|
|
85
|
-
? filterNumeric(e.target.value, onlyNumbers)
|
|
86
|
-
: filterNumeric(e, onlyNumbers);
|
|
87
|
-
setInputValue(inputValue.toString());
|
|
88
|
-
},
|
|
89
|
-
clear: () => {
|
|
90
|
-
handle.change(initialMin || '');
|
|
91
|
-
},
|
|
92
|
-
focus: (e) => {
|
|
93
|
-
setIsFocused(true);
|
|
94
|
-
if (onFocus) onFocus(e);
|
|
95
|
-
},
|
|
96
|
-
blur: (e) => {
|
|
97
|
-
setIsFocused(false);
|
|
98
|
-
|
|
99
|
-
if (Number.isNaN(inputValue) || inputValue < min)
|
|
100
|
-
setInputValue(initialMin);
|
|
101
|
-
if (max && Number(max) < inputValue) setInputValue(max);
|
|
102
|
-
|
|
103
|
-
if (onBlur) onBlur(e);
|
|
104
|
-
},
|
|
105
|
-
keyDown: (e) => {
|
|
106
|
-
setPreviousValue(e?.target?.value);
|
|
107
|
-
onKeyDown(e.keyCode, e);
|
|
108
|
-
},
|
|
109
|
-
|
|
110
|
-
keyUp: (e) => {
|
|
111
|
-
if (!isNotBlinkErrors) {
|
|
112
|
-
const changedValue = String(value ?? '');
|
|
113
|
-
const previousValue = String(prevValue);
|
|
114
|
-
|
|
115
|
-
const short
|
|
116
|
-
= previousValue.length <= changedValue.length
|
|
117
|
-
? previousValue
|
|
118
|
-
: changedValue;
|
|
119
|
-
const long
|
|
120
|
-
= previousValue.length > changedValue.length
|
|
121
|
-
? previousValue
|
|
122
|
-
: changedValue;
|
|
123
|
-
|
|
124
|
-
const infoAboutDifferencesSameness = short.split('').reduce(
|
|
125
|
-
(acc, symbol, idx) => {
|
|
126
|
-
if (acc.countOn && symbol === long[idx]) {
|
|
127
|
-
acc.same.push(symbol);
|
|
128
|
-
}
|
|
129
|
-
else {
|
|
130
|
-
acc.countOn = false;
|
|
131
|
-
acc.differences.push([idx, symbol]);
|
|
132
|
-
}
|
|
133
|
-
return acc;
|
|
134
|
-
},
|
|
135
|
-
{ same: [], countOn: true, differences: [] },
|
|
136
|
-
);
|
|
137
|
-
|
|
138
|
-
const samePart = infoAboutDifferencesSameness.same.join('');
|
|
139
|
-
const differencesLength
|
|
140
|
-
= infoAboutDifferencesSameness.differences.length;
|
|
141
|
-
const currentSet = changedValue?.replace(samePart, '');
|
|
142
|
-
|
|
143
|
-
if (
|
|
144
|
-
!KEYBOARD_SERVICE_KEYS.includes(e.key)
|
|
145
|
-
&& changedValue === previousValue
|
|
146
|
-
) {
|
|
147
|
-
setIsAttemptToChange(!(!differencesLength && e.key === currentSet));
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
if (onKeyUp) onKeyUp(e.keyCode, e.target.value);
|
|
152
|
-
},
|
|
153
|
-
decrement: (e) => {
|
|
154
|
-
let newValue = Number(intMemoVal) - Number(numStep);
|
|
155
|
-
if (newValue < min) newValue = min;
|
|
156
|
-
else if (newValue > max) newValue = max;
|
|
157
|
-
|
|
158
|
-
handle.change(newValue);
|
|
159
|
-
|
|
160
|
-
setTimeout(() => {
|
|
161
|
-
inputRef?.current?.focus();
|
|
162
|
-
setCursorToEnd();
|
|
163
|
-
}, 100);
|
|
164
|
-
},
|
|
165
|
-
increment: (e) => {
|
|
166
|
-
let newValue = Number(intMemoVal) + Number(numStep);
|
|
167
|
-
if (newValue < min) newValue = min;
|
|
168
|
-
else if (newValue > max) newValue = max;
|
|
169
|
-
|
|
170
|
-
handle.change(newValue);
|
|
171
|
-
|
|
172
|
-
setTimeout(() => {
|
|
173
|
-
inputRef?.current?.focus();
|
|
174
|
-
setCursorToEnd();
|
|
175
|
-
}, 100);
|
|
176
|
-
},
|
|
177
|
-
};
|
|
178
|
-
|
|
179
|
-
// Check Outside Click
|
|
180
|
-
useEffect(() => {
|
|
181
|
-
const handleClickOutside = (event) => {
|
|
182
|
-
if (!wrapRef.current.contains(event.target)) setIsFocused(false);
|
|
183
|
-
};
|
|
184
|
-
|
|
185
|
-
document.addEventListener('mousedown', handleClickOutside, true);
|
|
186
|
-
return () =>
|
|
187
|
-
document.removeEventListener('mousedown', handleClickOutside, true);
|
|
188
|
-
}, []);
|
|
189
|
-
|
|
190
|
-
useEffect(() => {
|
|
191
|
-
if (!isNotBlinkErrors && isAttemptToChange) {
|
|
192
|
-
setIsAttemptToChange(false);
|
|
193
|
-
setIsToHighlightError(true);
|
|
194
|
-
setTimeout(() => {
|
|
195
|
-
setIsToHighlightError(false);
|
|
196
|
-
}, blinkTime || DEFAULT_BLINK_TIME);
|
|
197
|
-
}
|
|
198
|
-
}, [isAttemptToChange]);
|
|
199
|
-
|
|
200
|
-
useEffect(() => {
|
|
201
|
-
if (value && value !== inputValue) setInputValue(value);
|
|
202
|
-
}, [value]);
|
|
203
|
-
|
|
204
|
-
// On Input Value Change
|
|
205
|
-
useEffect(() => {
|
|
206
|
-
if (inputValue !== value) setIsFocused(true);
|
|
207
|
-
|
|
208
|
-
setInputValueFormated(
|
|
209
|
-
isPriceInput && inputValue?.length > 0
|
|
210
|
-
? isFocused
|
|
211
|
-
? removeCommas(inputValue)
|
|
212
|
-
: addCommas(inputValue)
|
|
213
|
-
: inputValue,
|
|
214
|
-
);
|
|
215
|
-
setIntMemoVal(removeCommas(inputValue));
|
|
216
|
-
|
|
217
|
-
if (typeof onChange === 'function' && value !== undefined && +inputValue !== +value) onChange(inputValue?.toString());
|
|
218
|
-
}, [inputValue]);
|
|
219
|
-
|
|
220
|
-
// On Integer Value Change
|
|
221
|
-
useEffect(() => {
|
|
222
|
-
if (isNaN(intMemoVal)) setIntMemoVal(min || 0);
|
|
223
|
-
}, [intMemoVal]);
|
|
224
|
-
|
|
225
|
-
// On Focuse Change
|
|
226
|
-
useEffect(() => {
|
|
227
|
-
let formatedValue = inputValue;
|
|
228
|
-
if (isPriceInput) {
|
|
229
|
-
formatedValue = isFocused
|
|
230
|
-
? removeCommas(inputValue)
|
|
231
|
-
: addCommas(inputValue);
|
|
232
|
-
}
|
|
233
|
-
setInputValueFormated(formatedValue);
|
|
234
|
-
|
|
235
|
-
if (isFocused) {
|
|
236
|
-
if (typeof onFocus === 'function') onFocus({ target: inputRef?.current });
|
|
237
|
-
inputRef?.current?.focus();
|
|
238
|
-
}
|
|
239
|
-
else {
|
|
240
|
-
if (typeof onBlur === 'function') onBlur({ target: inputRef?.current });
|
|
241
|
-
inputRef?.current?.blur();
|
|
242
|
-
}
|
|
243
|
-
}, [isFocused]);
|
|
244
|
-
|
|
245
|
-
useEffect(() => {
|
|
246
|
-
if (inputRef?.current && typeof isFocusDefault === 'boolean')
|
|
247
|
-
setIsFocused(isFocusDefault);
|
|
248
|
-
}, [inputRef, isFocusDefault]);
|
|
249
|
-
|
|
250
|
-
function renderInput() {
|
|
251
|
-
const uniProps = {
|
|
252
|
-
name: name || fieldKey || id || testId || '',
|
|
253
|
-
className: `input ${className || ''}`,
|
|
254
|
-
placeholder,
|
|
255
|
-
value: inputValueFormated,
|
|
256
|
-
disabled,
|
|
257
|
-
onChange: handle.change,
|
|
258
|
-
onFocus: handle.focus,
|
|
259
|
-
onBlur: handle.blur,
|
|
260
|
-
onKeyDown: handle.keyDown,
|
|
261
|
-
onKeyUp: handle.keyUp,
|
|
262
|
-
min,
|
|
263
|
-
max,
|
|
264
|
-
...(maskChar ? { maskChar } : {}),
|
|
265
|
-
...(formatChars ? { formatChars } : {}),
|
|
266
|
-
};
|
|
267
|
-
|
|
268
|
-
return (
|
|
269
|
-
<>
|
|
270
|
-
<input
|
|
271
|
-
{...uniProps}
|
|
272
|
-
data-testid={`${testId}-input`}
|
|
273
|
-
value={value?.length > 0 ? addCommas(removeCommas(value)) : value}
|
|
274
|
-
ref={inputRef}
|
|
275
|
-
type="text"
|
|
276
|
-
onFocus={(...params) => {
|
|
277
|
-
if (isUseAutoSelect) inputRef.current.select();
|
|
278
|
-
if (uniProps.onFocus) uniProps.onFocus(...params);
|
|
279
|
-
}}
|
|
280
|
-
{...attributesOfNativeInput}
|
|
281
|
-
/>
|
|
282
|
-
|
|
283
|
-
{!isNotRenderButtons
|
|
284
|
-
? (
|
|
285
|
-
<div className="input__nums">
|
|
286
|
-
<button
|
|
287
|
-
data-testid={`${testId}-minus-btn`}
|
|
288
|
-
ref={decRef}
|
|
289
|
-
className={cn('input__num-btn', {
|
|
290
|
-
'events-none': Number(value) <= min,
|
|
291
|
-
})}
|
|
292
|
-
onMouseDown={e => handle.decrement(e)}
|
|
293
|
-
>
|
|
294
|
-
<Minus className={cn({ disabled: Number(value) <= min })} />
|
|
295
|
-
</button>
|
|
296
|
-
<button
|
|
297
|
-
data-testid={`-${testId}-plus-btn`}
|
|
298
|
-
ref={incRef}
|
|
299
|
-
className={cn('input__num-btn', {
|
|
300
|
-
'events-none': Number(value) >= max,
|
|
301
|
-
})}
|
|
302
|
-
onMouseDown={e => handle.increment(e)}
|
|
303
|
-
>
|
|
304
|
-
<Plus className={cn({ disabled: Number(value) >= max })} />
|
|
305
|
-
</button>
|
|
306
|
-
</div>
|
|
307
|
-
)
|
|
308
|
-
: null}
|
|
309
|
-
</>
|
|
310
|
-
);
|
|
311
|
-
}
|
|
312
|
-
|
|
313
|
-
return (
|
|
314
|
-
<div
|
|
315
|
-
data-testid={testId}
|
|
316
|
-
ref={wrapRef}
|
|
317
|
-
className={cn(
|
|
318
|
-
`input__wrap`,
|
|
319
|
-
{ [`input__wrap_focus`]: isFocused },
|
|
320
|
-
{ [`input__wrap_error`]: error || isToHighlightError },
|
|
321
|
-
{ [`input__wrap--disabled`]: disabled || isLoading },
|
|
322
|
-
)}
|
|
323
|
-
>
|
|
324
|
-
{renderInput()}
|
|
325
|
-
{icon}
|
|
326
|
-
{withDelete && (
|
|
327
|
-
<span
|
|
328
|
-
className={cn(`input__close`, { hidden: !inputValue })}
|
|
329
|
-
onClick={() => handle.clear()}
|
|
330
|
-
/>
|
|
331
|
-
)}
|
|
332
|
-
{isLoading && <Spinner size="small" />}
|
|
333
|
-
</div>
|
|
334
|
-
);
|
|
335
|
-
}
|
|
336
|
-
|
|
337
|
-
export default NumericInput;
|
|
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(n,e,t){return e in n?Object.defineProperty(n,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):n[e]=t,n}function t(n){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},o=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(r).filter(function(n){return Object.getOwnPropertyDescriptor(r,n).enumerable}))),o.forEach(function(t){e(n,t,r[t])})}return n}function r(n,e){return function(n){if(Array.isArray(n))return n}(n)||function(n,e){var t,r,o=null==n?null:"undefined"!=typeof Symbol&&n[Symbol.iterator]||n["@@iterator"];if(null!=o){var u=[],i=!0,a=!1;try{for(o=o.call(n);!(i=(t=o.next()).done)&&(u.push(t.value),!e||u.length!==e);i=!0);}catch(n){a=!0,r=n}finally{try{i||null==o.return||o.return()}finally{if(a)throw r}}return u}}(n,e)||o(n,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.")}()}function o(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)}}import{jsx as u,jsxs as i,Fragment as a}from"react/jsx-runtime";import l from"classnames";import{useEffect as c,useRef as s,useState as f}from"react";import{Minus as m,Plus as d}from"react-feather";import{KEYBOARD_SERVICE_KEYS as p}from"../../../Constants/index.constants";import{formatToAddBitDepthPoints as y,filterNumeric as b,formatToRemoveComa as v}from"../../../Functions/fieldValueFormatters";import h from"../../Layout/Spinner/Spinner";import"./NumericInput.scss";export default function(g){var N,O,w,j=g.disabled,S=g.withDelete,_=g.numStep,k=void 0===_?1:_,A=g.min,D=void 0===A?0:A,P=g.max,C=g.value,x=g.placeholder,F=g.className,I=g.testId,T=void 0===I?"numeric-input":I,E=g.name,U=g.fieldKey,B=g.id,K=g.onChange,L=void 0===K?function(){}:K,M=g.onBlur,R=void 0===M?function(){}:M,V=g.onFocus,z=void 0===V?function(){}:V,$=g.onKeyUp,q=void 0===$?function(){}:$,G=g.onKeyDown,H=void 0===G?function(){}:G,J=g.maskChar,Q=g.formatChars,W=g.error,X=g.icon,Y=g.isNotBlinkErrors,Z=g.blinkTime,nn=g.isPriceInput,ne=g.isFocusDefault,nt=void 0!==ne&&ne,nr=g.isNotRenderButtons,no=g.isUseAutoSelect,nu=void 0===no||no,ni=g.isLoading,na=void 0!==ni&&ni,nl=g.isAllowNullValue,nc=g.onlyNumbers,ns=void 0===nc?{type:"int"}:nc,nf=g.attributesOfNativeInput,nm=s(null),nd=s(null),np=s(null),ny=s(null),nb=void 0!==nl&&nl?"":D,nv=r(f(C||nb),2),nh=nv[0],ng=nv[1],nN=r(f(nh),2),nO=nN[0],nw=nN[1],nj=r(f(0),2),nS=nj[0],n_=nj[1],nk=r(f(!1),2),nA=nk[0],nD=nk[1],nP=r(f(!1),2),nC=nP[0],nx=nP[1],nF=r(f(!1),2),nI=nF[0],nT=nF[1],nE=r(f(C||nb),2),nU=nE[0],nB=nE[1],nK=function(){var n,e=nm.current,t=null==e||null==(n=e.value)?void 0:n.length;e&&setTimeout(function(){return e.setSelectionRange(t,t)},10)},nL={change:function(n){ng((n.target?b(n.target.value,ns):b(n,ns)).toString())},clear:function(){nL.change(nb||"")},focus:function(n){nD(!0),z&&z(n)},blur:function(n){nD(!1),(Number.isNaN(nh)||nh<D)&&ng(nb),P&&Number(P)<nh&&ng(P),R&&R(n)},keyDown:function(n){var e;nB(null==n||null==(e=n.target)?void 0:e.value),H(n.keyCode,n)},keyUp:function(n){if(!Y){var e=String(null!=C?C:""),t=String(nU),r=t.length<=e.length?t:e,o=t.length>e.length?t:e,u=r.split("").reduce(function(n,e,t){return n.countOn&&e===o[t]?n.same.push(e):(n.countOn=!1,n.differences.push([t,e])),n},{same:[],countOn:!0,differences:[]}),i=u.same.join(""),a=u.differences.length,l=null==e?void 0:e.replace(i,"");p.includes(n.key)||e!==t||nx(!(!a&&n.key===l))}q&&q(n.keyCode,n.target.value)},decrement:function(n){var e=Number(nS)-Number(k);e<D?e=D:e>P&&(e=P),nL.change(e),setTimeout(function(){var n;null==nm||null==(n=nm.current)||n.focus(),nK()},100)},increment:function(n){var e=Number(nS)+Number(k);e<D?e=D:e>P&&(e=P),nL.change(e),setTimeout(function(){var n;null==nm||null==(n=nm.current)||n.focus(),nK()},100)}};return c(function(){var n=function(n){ny.current.contains(n.target)||nD(!1)};return document.addEventListener("mousedown",n,!0),function(){return document.removeEventListener("mousedown",n,!0)}},[]),c(function(){!Y&&nC&&(nx(!1),nT(!0),setTimeout(function(){nT(!1)},Z||200))},[nC]),c(function(){C&&C!==nh&&ng(C)},[C]),c(function(){nh!==C&&nD(!0),nw(nn&&(null==nh?void 0:nh.length)>0?nA?v(nh):y(nh):nh),n_(v(nh)),"function"==typeof L&&void 0!==C&&+nh!=+C&&L(null==nh?void 0:nh.toString())},[nh]),c(function(){isNaN(nS)&&n_(D||0)},[nS]),c(function(){var n,e,t=nh;nn&&(t=nA?v(nh):y(nh)),nw(t),nA?("function"==typeof z&&z({target:null==nm?void 0:nm.current}),null==nm||null==(n=nm.current)||n.focus()):("function"==typeof R&&R({target:null==nm?void 0:nm.current}),null==nm||null==(e=nm.current)||e.blur())},[nA]),c(function(){(null==nm?void 0:nm.current)&&"boolean"==typeof nt&&nD(nt)},[nm,nt]),i("div",{"data-testid":T,ref:ny,className:l("input__wrap",e({},"input__wrap_focus",nA),e({},"input__wrap_error",W||nI),e({},"input__wrap--disabled",j||na)),children:[(N=t({name:E||U||B||T||"",className:"input ".concat(F||""),placeholder:x,value:nO,disabled:j,onChange:nL.change,onFocus:nL.focus,onBlur:nL.blur,onKeyDown:nL.keyDown,onKeyUp:nL.keyUp,min:D,max:P},J?{maskChar:J}:{},Q?{formatChars:Q}:{}),i(a,{children:[u("input",t((O=t({},N),w=w={"data-testid":"".concat(T,"-input"),value:(null==C?void 0:C.length)>0?y(v(C)):C,ref:nm,type:"text",onFocus:function(){for(var e=arguments.length,t=Array(e),r=0;r<e;r++)t[r]=arguments[r];nu&&nm.current.select(),N.onFocus&&N.onFocus.apply(N,function(e){if(Array.isArray(e))return n(e)}(t)||function(n){if("undefined"!=typeof Symbol&&null!=n[Symbol.iterator]||null!=n["@@iterator"])return Array.from(n)}(t)||o(t)||function(){throw TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}())}},Object.getOwnPropertyDescriptors?Object.defineProperties(O,Object.getOwnPropertyDescriptors(w)):(function(n,e){var t=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);t.push.apply(t,r)}return t})(Object(w)).forEach(function(n){Object.defineProperty(O,n,Object.getOwnPropertyDescriptor(w,n))}),O),void 0===nf?{}:nf)),void 0!==nr&&nr?null:i("div",{className:"input__nums",children:[u("button",{"data-testid":"".concat(T,"-minus-btn"),ref:nd,className:l("input__num-btn",{"events-none":Number(C)<=D}),onMouseDown:function(n){return nL.decrement(n)},children:u(m,{className:l({disabled:Number(C)<=D})})}),u("button",{"data-testid":"-".concat(T,"-plus-btn"),ref:np,className:l("input__num-btn",{"events-none":Number(C)>=P}),onMouseDown:function(n){return nL.increment(n)},children:u(d,{className:l({disabled:Number(C)>=P})})})]})]})),X,S&&u("span",{className:l("input__close",{hidden:!nh}),onClick:function(){return nL.clear()}}),na&&u(h,{size:"small"})]})}
|
|
@@ -1,66 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import { useLayoutEffect, useState } from 'react';
|
|
4
|
-
|
|
5
|
-
import RadioInput from '../RadioInput/RadioInput';
|
|
6
|
-
|
|
7
|
-
import './RadioGroup.scss';
|
|
8
|
-
|
|
9
|
-
function RadioGroup({
|
|
10
|
-
className,
|
|
11
|
-
disabled,
|
|
12
|
-
value,
|
|
13
|
-
onChange = () => {},
|
|
14
|
-
direction = 'row',
|
|
15
|
-
options = [],
|
|
16
|
-
}) {
|
|
17
|
-
const [values, setValues] = useState(options);
|
|
18
|
-
|
|
19
|
-
useLayoutEffect(
|
|
20
|
-
() =>
|
|
21
|
-
setValues(
|
|
22
|
-
options.map(item =>
|
|
23
|
-
item.value === value ? { ...item, checked: value } : item,
|
|
24
|
-
),
|
|
25
|
-
),
|
|
26
|
-
[options, value],
|
|
27
|
-
);
|
|
28
|
-
|
|
29
|
-
const handle = {
|
|
30
|
-
change: (value) => {
|
|
31
|
-
const newValues = values.map((item) => {
|
|
32
|
-
if (item.value === value) {
|
|
33
|
-
return {
|
|
34
|
-
...item,
|
|
35
|
-
checked: value,
|
|
36
|
-
};
|
|
37
|
-
}
|
|
38
|
-
return {
|
|
39
|
-
id: item.id,
|
|
40
|
-
label: item.label,
|
|
41
|
-
value: item.value,
|
|
42
|
-
};
|
|
43
|
-
});
|
|
44
|
-
setValues(newValues);
|
|
45
|
-
onChange(value);
|
|
46
|
-
},
|
|
47
|
-
};
|
|
48
|
-
return (
|
|
49
|
-
<div
|
|
50
|
-
className={cn('radio-group', className, `radio-group--${direction}`, {
|
|
51
|
-
'radio-group--disabled': disabled,
|
|
52
|
-
})}
|
|
53
|
-
>
|
|
54
|
-
{values.map(item => (
|
|
55
|
-
<RadioInput
|
|
56
|
-
key={item.id}
|
|
57
|
-
{...item}
|
|
58
|
-
onChange={handle.change}
|
|
59
|
-
checked={item.checked}
|
|
60
|
-
/>
|
|
61
|
-
))}
|
|
62
|
-
</div>
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
export default RadioGroup;
|
|
1
|
+
function r(r,e){(null==e||e>r.length)&&(e=r.length);for(var t=0,n=Array(e);t<e;t++)n[t]=r[t];return n}function e(r){for(var e=1;e<arguments.length;e++){var t=null!=arguments[e]?arguments[e]:{},n=Object.keys(t);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(t).filter(function(r){return Object.getOwnPropertyDescriptor(t,r).enumerable}))),n.forEach(function(e){var n;n=t[e],e in r?Object.defineProperty(r,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):r[e]=n})}return r}function t(r,e){return e=null!=e?e:{},Object.getOwnPropertyDescriptors?Object.defineProperties(r,Object.getOwnPropertyDescriptors(e)):(function(r,e){var t=Object.keys(r);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(r);t.push.apply(t,n)}return t})(Object(e)).forEach(function(t){Object.defineProperty(r,t,Object.getOwnPropertyDescriptor(e,t))}),r}import{jsx as n}from"react/jsx-runtime";import o from"classnames";import{useLayoutEffect as i,useState as a}from"react";import c from"../RadioInput/RadioInput";import"./RadioGroup.scss";export default function(u){var l,f=u.className,p=u.disabled,s=u.value,b=u.onChange,d=void 0===b?function(){}:b,y=u.direction,m=u.options,v=void 0===m?[]:m,O=(l=a(v),function(r){if(Array.isArray(r))return r}(l)||function(r,e){var t,n,o=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=o){var i=[],a=!0,c=!1;try{for(o=o.call(r);!(a=(t=o.next()).done)&&(i.push(t.value),i.length!==e);a=!0);}catch(r){c=!0,n=r}finally{try{a||null==o.return||o.return()}finally{if(c)throw n}}return i}}(l,2)||function(e,t){if(e){if("string"==typeof e)return r(e,2);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 r(e,t)}}(l,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.")}()),g=O[0],h=O[1];i(function(){return h(v.map(function(r){return r.value===s?t(e({},r),{checked:s}):r}))},[v,s]);var j=function(r){h(g.map(function(n){return n.value===r?t(e({},n),{checked:r}):{id:n.id,label:n.label,value:n.value}})),d(r)};return n("div",{className:o("radio-group",f,"radio-group--".concat(void 0===y?"row":y),{"radio-group--disabled":p}),children:g.map(function(r){return n(c,t(e({},r),{onChange:j,checked:r.checked}),r.id)})})}
|
|
@@ -1,78 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import FormElement from '../../../Molecular/FormElement/FormElement';
|
|
4
|
-
import Alert from '../../UI/Alert/Alert';
|
|
5
|
-
|
|
6
|
-
import Input from './../Input/Input';
|
|
7
|
-
import RadioInput from './../RadioInput/RadioInput';
|
|
8
|
-
|
|
9
|
-
import './RadioGroupWithInput.scss';
|
|
10
|
-
|
|
11
|
-
function RadioGroupWithInput({
|
|
12
|
-
alert,
|
|
13
|
-
className,
|
|
14
|
-
disabled,
|
|
15
|
-
onChange = () => {},
|
|
16
|
-
direction = 'row',
|
|
17
|
-
options = [],
|
|
18
|
-
}) {
|
|
19
|
-
const handle = {
|
|
20
|
-
changeRadio: (value, el) => {
|
|
21
|
-
const newOptions = options.map((item) => {
|
|
22
|
-
return {
|
|
23
|
-
...item,
|
|
24
|
-
checked: el.value === item.value ? item.value : false,
|
|
25
|
-
};
|
|
26
|
-
});
|
|
27
|
-
onChange(newOptions);
|
|
28
|
-
},
|
|
29
|
-
changeInput: (value, el) => {
|
|
30
|
-
el.input.value = value;
|
|
31
|
-
onChange(options);
|
|
32
|
-
},
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<div className="radio-group-input-box">
|
|
37
|
-
{alert && <Alert className="mb10" {...alert} />}
|
|
38
|
-
<div
|
|
39
|
-
className={cn(
|
|
40
|
-
'radio-group-input',
|
|
41
|
-
className,
|
|
42
|
-
`radio-group-input--${direction}`,
|
|
43
|
-
{
|
|
44
|
-
'radio-group-input--disabled': disabled,
|
|
45
|
-
},
|
|
46
|
-
)}
|
|
47
|
-
>
|
|
48
|
-
{options?.map((item) => {
|
|
49
|
-
return (
|
|
50
|
-
<div
|
|
51
|
-
key={item.id}
|
|
52
|
-
className={cn(
|
|
53
|
-
'radio-group-input-item',
|
|
54
|
-
`radio-group-input-item-${item.id}`,
|
|
55
|
-
)}
|
|
56
|
-
>
|
|
57
|
-
<RadioInput
|
|
58
|
-
{...item}
|
|
59
|
-
onChange={value => handle.changeRadio(value, item)}
|
|
60
|
-
checked={item.checked}
|
|
61
|
-
/>
|
|
62
|
-
{item.input && item.checked && (
|
|
63
|
-
<FormElement {...item.input}>
|
|
64
|
-
<Input
|
|
65
|
-
onChange={value => handle.changeInput(value, item)}
|
|
66
|
-
{...item.input}
|
|
67
|
-
/>
|
|
68
|
-
</FormElement>
|
|
69
|
-
)}
|
|
70
|
-
</div>
|
|
71
|
-
);
|
|
72
|
-
})}
|
|
73
|
-
</div>
|
|
74
|
-
</div>
|
|
75
|
-
);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
export default RadioGroupWithInput;
|
|
1
|
+
function e(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))),n.forEach(function(t){var n;n=r[t],t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n})}return e}function t(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):(function(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);r.push.apply(r,n)}return r})(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}),e}import{jsx as r,jsxs as n}from"react/jsx-runtime";import o from"classnames";import i from"../../../Molecular/FormElement/FormElement";import c from"../../UI/Alert/Alert";import u from"./../Input/Input";import a from"./../RadioInput/RadioInput";import"./RadioGroupWithInput.scss";export default function(p){var l=p.alert,s=p.className,d=p.disabled,m=p.onChange,f=void 0===m?function(){}:m,b=p.direction,g=p.options,O=void 0===g?[]:g,h={changeRadio:function(r,n){f(O.map(function(r){return t(e({},r),{checked:n.value===r.value&&r.value})}))},changeInput:function(e,t){t.input.value=e,f(O)}};return n("div",{className:"radio-group-input-box",children:[l&&r(c,e({className:"mb10"},l)),r("div",{className:o("radio-group-input",s,"radio-group-input--".concat(void 0===b?"row":b),{"radio-group-input--disabled":d}),children:null==O?void 0:O.map(function(c){return n("div",{className:o("radio-group-input-item","radio-group-input-item-".concat(c.id)),children:[r(a,t(e({},c),{onChange:function(e){return h.changeRadio(e,c)},checked:c.checked})),c.input&&c.checked&&r(i,t(e({},c.input),{children:r(u,e({onChange:function(e){return h.changeInput(e,c)}},c.input))}))]},c.id)})})]})}
|
|
@@ -1,54 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import "./RadioRowSwitcher.scss";
|
|
4
|
-
|
|
5
|
-
const classNames = require("classnames");
|
|
6
|
-
|
|
7
|
-
function RadioRowSwitcher({ onChange, radios, label = '', value = '' }) {
|
|
8
|
-
const handle = {
|
|
9
|
-
change: (newValue) => {
|
|
10
|
-
if (newValue === value) onChange('');
|
|
11
|
-
else onChange(newValue);
|
|
12
|
-
},
|
|
13
|
-
};
|
|
14
|
-
|
|
15
|
-
const itemClass = key =>
|
|
16
|
-
classNames('radio-row-switcher__item', {
|
|
17
|
-
[`radio-row-switcher__item--active`]: key === value,
|
|
18
|
-
});
|
|
19
|
-
const sliderClass = key =>
|
|
20
|
-
classNames(
|
|
21
|
-
'radio-row-switcher__slider',
|
|
22
|
-
`radio-row-switcher__slider--${key}`,
|
|
23
|
-
);
|
|
24
|
-
|
|
25
|
-
return (
|
|
26
|
-
<div className="radio-row-switcher">
|
|
27
|
-
{label && <div className="radio-row-switcher__label">{label}</div>}
|
|
28
|
-
|
|
29
|
-
<div className="radio-row-switcher__items-box">
|
|
30
|
-
{radios.map((item) => {
|
|
31
|
-
return (
|
|
32
|
-
<React.Fragment key={item.key}>
|
|
33
|
-
<div
|
|
34
|
-
onClick={() => handle.change(item.key)}
|
|
35
|
-
className={itemClass(item.key)}
|
|
36
|
-
>
|
|
37
|
-
{item.label}
|
|
38
|
-
</div>
|
|
39
|
-
</React.Fragment>
|
|
40
|
-
);
|
|
41
|
-
})}
|
|
42
|
-
|
|
43
|
-
{value && (
|
|
44
|
-
<div
|
|
45
|
-
onClick={() => handle.change('')}
|
|
46
|
-
className={sliderClass(value)}
|
|
47
|
-
/>
|
|
48
|
-
)}
|
|
49
|
-
</div>
|
|
50
|
-
</div>
|
|
51
|
-
);
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
export default RadioRowSwitcher;
|
|
1
|
+
import{jsx as r,jsxs as e}from"react/jsx-runtime";import i from"react";import"./RadioRowSwitcher.scss";var a=require("classnames");export default function(c){var o=c.onChange,n=c.radios,t=c.label,s=void 0===t?"":t,l=c.value,d=void 0===l?"":l,m={change:function(r){r===d?o(""):o(r)}},u=function(r){var e,i,c;return a("radio-row-switcher__item",(e={},i="radio-row-switcher__item--active",c=r===d,i in e?Object.defineProperty(e,i,{value:c,enumerable:!0,configurable:!0,writable:!0}):e[i]=c,e))};return e("div",{className:"radio-row-switcher",children:[s&&r("div",{className:"radio-row-switcher__label",children:s}),e("div",{className:"radio-row-switcher__items-box",children:[n.map(function(e){return r(i.Fragment,{children:r("div",{onClick:function(){return m.change(e.key)},className:u(e.key),children:e.label})},e.key)}),d&&r("div",{onClick:function(){return m.change("")},className:a("radio-row-switcher__slider","radio-row-switcher__slider--".concat(d))})]})]})}
|