@dnb/eufemia 9.17.0 → 9.19.0
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/CHANGELOG.md +63 -0
- package/cjs/components/Avatar.d.ts +14 -0
- package/cjs/components/Avatar.js +52 -0
- package/cjs/components/InfoCard.d.ts +14 -0
- package/cjs/components/InfoCard.js +52 -0
- package/cjs/components/Tag.d.ts +14 -0
- package/cjs/components/Tag.js +52 -0
- package/cjs/components/Timeline.d.ts +14 -0
- package/cjs/components/Timeline.js +52 -0
- package/cjs/components/accordion/Accordion.d.ts +7 -7
- package/cjs/components/autocomplete/Autocomplete.d.ts +13 -13
- package/cjs/components/avatar/Avatar.js +149 -0
- package/cjs/components/avatar/AvatarGroup.js +131 -0
- package/cjs/components/avatar/index.d.ts +8 -0
- package/cjs/components/avatar/index.js +52 -0
- package/cjs/components/avatar/style/_avatar.scss +145 -0
- package/cjs/components/avatar/style/dnb-avatar.css +218 -0
- package/cjs/components/avatar/style/dnb-avatar.min.css +1 -0
- package/cjs/components/avatar/style/dnb-avatar.scss +12 -0
- package/cjs/components/avatar/style/index.d.ts +6 -0
- package/cjs/components/avatar/style/index.js +3 -0
- package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
- package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
- package/cjs/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
- package/cjs/components/avatar/style/themes/ui.js +3 -0
- package/cjs/components/avatar/style.js +3 -0
- package/cjs/components/breadcrumb/BreadcrumbItem.js +3 -3
- package/cjs/components/button/Button.d.ts +8 -8
- package/cjs/components/button/Button.js +7 -5
- package/cjs/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
- package/cjs/components/checkbox/Checkbox.d.ts +3 -3
- package/cjs/components/date-picker/DatePicker.d.ts +14 -14
- package/cjs/components/date-picker/DatePicker.js +4 -2
- package/cjs/components/date-picker/DatePickerAddon.d.ts +1 -1
- package/cjs/components/date-picker/DatePickerCalendar.d.ts +1 -1
- package/cjs/components/date-picker/DatePickerFooter.d.ts +1 -0
- package/cjs/components/date-picker/DatePickerFooter.js +10 -6
- package/cjs/components/date-picker/DatePickerInput.d.ts +1 -1
- package/cjs/components/dropdown/Dropdown.d.ts +11 -10
- package/cjs/components/form-label/FormLabel.d.ts +1 -1
- package/cjs/components/form-row/FormRow.d.ts +4 -4
- package/cjs/components/form-set/FormSet.d.ts +5 -5
- package/cjs/components/global-error/GlobalError.d.ts +1 -1
- package/cjs/components/global-status/GlobalStatus.d.ts +5 -5
- package/cjs/components/heading/Heading.d.ts +2 -2
- package/cjs/components/heading/HeadingProvider.d.ts +2 -2
- package/cjs/components/help-button/HelpButton.d.ts +1 -1
- package/cjs/components/help-button/HelpButtonInstance.d.ts +3 -2
- package/cjs/components/icon/Icon.d.ts +2 -2
- package/cjs/components/icon-primary/IconPrimary.d.ts +2 -2
- package/cjs/components/index.d.ts +8 -0
- package/cjs/components/index.js +32 -0
- package/cjs/components/info-card/InfoCard.js +180 -0
- package/cjs/components/info-card/index.d.ts +8 -0
- package/cjs/components/info-card/index.js +52 -0
- package/cjs/components/info-card/style/_info-card.scss +52 -0
- package/cjs/components/info-card/style/dnb-info-card.css +135 -0
- package/cjs/components/info-card/style/dnb-info-card.min.css +1 -0
- package/cjs/components/info-card/style/dnb-info-card.scss +12 -0
- package/cjs/components/info-card/style/index.d.ts +6 -0
- package/cjs/components/info-card/style/index.js +3 -0
- package/cjs/components/info-card/style.js +3 -0
- package/cjs/components/input/Input.d.ts +11 -10
- package/cjs/components/input-masked/InputMasked.d.ts +11 -11
- package/cjs/components/input-masked/InputMasked.js +6 -3
- package/cjs/components/input-masked/InputMaskedHooks.js +45 -52
- package/cjs/components/input-masked/InputMaskedUtils.js +9 -20
- package/cjs/components/lib.js +36 -0
- package/cjs/components/modal/Modal.js +157 -299
- package/cjs/components/modal/ModalContent.js +169 -274
- package/cjs/components/modal/ModalRoot.js +194 -0
- package/cjs/components/modal/components/CloseButton.js +125 -0
- package/cjs/components/modal/components/ModalHeader.js +124 -0
- package/cjs/components/modal/{ModalHeader.js → components/ModalHeaderBar.js} +50 -162
- package/cjs/components/modal/{ModalInner.js → components/ModalInner.js} +11 -19
- package/cjs/components/modal/helpers.js +80 -0
- package/cjs/components/modal/types.js +1 -0
- package/cjs/components/number-format/NumberFormat.d.ts +10 -10
- package/cjs/components/pagination/Pagination.d.ts +30 -30
- package/cjs/components/pagination/Pagination.js +11 -1
- package/cjs/components/pagination/PaginationProvider.d.ts +2 -2
- package/cjs/components/radio/Radio.d.ts +5 -5
- package/cjs/components/radio/RadioGroup.d.ts +4 -4
- package/cjs/components/section/Section.d.ts +3 -2
- package/cjs/components/skeleton/Skeleton.d.ts +2 -2
- package/cjs/components/slider/Slider.d.ts +5 -5
- package/cjs/components/step-indicator/StepIndicator.d.ts +6 -6
- package/cjs/components/step-indicator/StepIndicatorContext.d.ts +1 -1
- package/cjs/components/step-indicator/StepIndicatorItem.d.ts +3 -3
- package/cjs/components/step-indicator/StepIndicatorItem.js +1 -0
- package/cjs/components/step-indicator/StepIndicatorSidebar.d.ts +4 -4
- package/cjs/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
- package/cjs/components/switch/Switch.d.ts +6 -6
- package/cjs/components/tabs/Tabs.d.ts +8 -8
- package/cjs/components/tabs/TabsContentWrapper.d.ts +2 -2
- package/cjs/components/tabs/TabsCustomContent.d.ts +1 -1
- package/cjs/components/tag/Tag.js +157 -0
- package/cjs/components/tag/TagContext.js +14 -0
- package/cjs/components/tag/TagGroup.js +123 -0
- package/cjs/components/tag/index.d.ts +8 -0
- package/cjs/components/tag/index.js +52 -0
- package/cjs/components/tag/style/_tag.scss +90 -0
- package/cjs/components/tag/style/dnb-tag.css +925 -0
- package/cjs/components/tag/style/dnb-tag.min.css +1 -0
- package/cjs/components/tag/style/dnb-tag.scss +15 -0
- package/cjs/components/tag/style/index.d.ts +6 -0
- package/cjs/components/tag/style/index.js +3 -0
- package/cjs/components/tag/style/themes/_tag-mixins.scss +18 -0
- package/cjs/components/tag/style.js +3 -0
- package/cjs/components/textarea/Textarea.d.ts +4 -4
- package/cjs/components/timeline/Timeline.js +129 -0
- package/cjs/components/timeline/TimelineItem.js +149 -0
- package/cjs/components/timeline/index.d.ts +8 -0
- package/cjs/components/timeline/index.js +52 -0
- package/cjs/components/timeline/style/_timeline.scss +42 -0
- package/cjs/components/timeline/style/dnb-timeline.css +307 -0
- package/cjs/components/timeline/style/dnb-timeline.min.css +1 -0
- package/cjs/components/timeline/style/dnb-timeline.scss +12 -0
- package/cjs/components/timeline/style/index.d.ts +6 -0
- package/cjs/components/timeline/style/index.js +3 -0
- package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
- package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
- package/cjs/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
- package/cjs/components/timeline/style/themes/ui.js +3 -0
- package/cjs/components/timeline/style.js +3 -0
- package/cjs/components/toggle-button/ToggleButton.d.ts +7 -7
- package/cjs/components/toggle-button/ToggleButtonGroup.d.ts +4 -4
- package/cjs/components/tooltip/Tooltip.d.ts +5 -5
- package/cjs/components/tooltip/TooltipContainer.d.ts +3 -3
- package/cjs/components/tooltip/TooltipPortal.d.ts +1 -1
- package/cjs/components/tooltip/TooltipWithEvents.d.ts +1 -1
- package/cjs/elements/Img.d.ts +2 -2
- package/cjs/extensions/payment-card/PaymentCard.d.ts +1 -1
- package/cjs/extensions/payment-card/style/_payment-card.scss +0 -1
- package/cjs/extensions/payment-card/style/dnb-payment-card.css +0 -1
- package/cjs/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
- package/cjs/fragments/drawer-list/DrawerListProvider.js +1 -0
- package/cjs/fragments/scroll-view/ScrollView.js +7 -16
- package/cjs/index.d.ts +8 -0
- package/cjs/index.js +32 -0
- package/cjs/shared/Context.js +11 -4
- package/cjs/shared/locales/en-GB.js +5 -0
- package/cjs/shared/locales/nb-NO.js +5 -0
- package/cjs/style/core/helper-classes/skip-link.scss +1 -1
- package/cjs/style/dnb-ui-components.css +716 -0
- package/cjs/style/dnb-ui-components.min.css +3 -3
- package/cjs/style/dnb-ui-components.scss +4 -0
- package/cjs/style/dnb-ui-elements.css +3 -0
- package/cjs/style/dnb-ui-elements.min.css +1 -1
- package/cjs/style/dnb-ui-extensions.css +0 -1
- package/cjs/style/dnb-ui-extensions.min.css +1 -1
- package/cjs/style/dnb-ui-tags.css +6 -0
- package/cjs/style/dnb-ui-tags.min.css +2 -2
- package/cjs/style/elements/code.scss +3 -0
- package/cjs/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
- package/cjs/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
- package/cjs/style/themes/theme-ui/dnb-theme-ui.css +226 -0
- package/cjs/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
- package/cjs/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
- package/components/Avatar.d.ts +14 -0
- package/components/Avatar.js +3 -0
- package/components/InfoCard.d.ts +14 -0
- package/components/InfoCard.js +3 -0
- package/components/Tag.d.ts +14 -0
- package/components/Tag.js +3 -0
- package/components/Timeline.d.ts +14 -0
- package/components/Timeline.js +3 -0
- package/components/accordion/Accordion.d.ts +7 -7
- package/components/autocomplete/Autocomplete.d.ts +13 -13
- package/components/avatar/Avatar.js +89 -0
- package/components/avatar/Avatar.tsx +163 -0
- package/components/avatar/AvatarGroup.js +94 -0
- package/components/avatar/AvatarGroup.tsx +167 -0
- package/components/avatar/index.d.ts +8 -0
- package/components/avatar/index.js +3 -0
- package/components/avatar/style/_avatar.scss +145 -0
- package/components/avatar/style/dnb-avatar.css +218 -0
- package/components/avatar/style/dnb-avatar.min.css +1 -0
- package/components/avatar/style/dnb-avatar.scss +12 -0
- package/components/avatar/style/index.d.ts +6 -0
- package/components/avatar/style/index.js +1 -0
- package/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
- package/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
- package/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
- package/components/avatar/style/themes/ui.js +1 -0
- package/components/avatar/style.js +1 -0
- package/components/breadcrumb/BreadcrumbItem.js +3 -3
- package/components/breadcrumb/BreadcrumbItem.tsx +2 -2
- package/components/button/Button.d.ts +7 -7
- package/components/button/Button.js +7 -5
- package/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
- package/components/checkbox/Checkbox.d.ts +3 -3
- package/components/date-picker/DatePicker.d.ts +14 -14
- package/components/date-picker/DatePicker.js +4 -2
- package/components/date-picker/DatePickerAddon.d.ts +1 -1
- package/components/date-picker/DatePickerCalendar.d.ts +1 -1
- package/components/date-picker/DatePickerFooter.d.ts +1 -0
- package/components/date-picker/DatePickerFooter.js +10 -6
- package/components/date-picker/DatePickerInput.d.ts +1 -1
- package/components/dropdown/Dropdown.d.ts +11 -10
- package/components/form-label/FormLabel.d.ts +1 -1
- package/components/form-row/FormRow.d.ts +4 -4
- package/components/form-set/FormSet.d.ts +5 -5
- package/components/global-error/GlobalError.d.ts +1 -1
- package/components/global-status/GlobalStatus.d.ts +5 -5
- package/components/heading/Heading.d.ts +2 -2
- package/components/heading/HeadingProvider.d.ts +2 -2
- package/components/help-button/HelpButton.d.ts +1 -1
- package/components/help-button/HelpButtonInstance.d.ts +3 -2
- package/components/icon/Icon.d.ts +2 -2
- package/components/index.d.ts +8 -0
- package/components/index.js +5 -1
- package/components/info-card/InfoCard.js +140 -0
- package/components/info-card/InfoCard.tsx +249 -0
- package/components/info-card/index.d.ts +8 -0
- package/components/info-card/index.js +3 -0
- package/components/info-card/style/_info-card.scss +52 -0
- package/components/info-card/style/dnb-info-card.css +135 -0
- package/components/info-card/style/dnb-info-card.min.css +1 -0
- package/components/info-card/style/dnb-info-card.scss +12 -0
- package/components/info-card/style/index.d.ts +6 -0
- package/components/info-card/style/index.js +1 -0
- package/components/info-card/style.js +1 -0
- package/components/input/Input.d.ts +11 -10
- package/components/input-masked/InputMasked.d.ts +11 -11
- package/components/input-masked/InputMasked.js +6 -4
- package/components/input-masked/InputMaskedHooks.js +43 -46
- package/components/input-masked/InputMaskedUtils.js +9 -20
- package/components/lib.js +9 -1
- package/components/modal/Modal.js +146 -278
- package/components/modal/Modal.tsx +524 -0
- package/components/modal/ModalContent.js +162 -256
- package/components/modal/ModalContent.tsx +515 -0
- package/components/modal/ModalContext.tsx +10 -0
- package/components/modal/ModalRoot.js +145 -0
- package/components/modal/ModalRoot.tsx +131 -0
- package/components/modal/components/CloseButton.js +72 -0
- package/components/modal/components/CloseButton.tsx +56 -0
- package/components/modal/components/ModalHeader.js +70 -0
- package/components/modal/components/ModalHeader.tsx +79 -0
- package/components/modal/components/ModalHeaderBar.js +122 -0
- package/components/modal/components/ModalHeaderBar.tsx +118 -0
- package/components/modal/{ModalInner.js → components/ModalInner.js} +11 -17
- package/components/modal/components/ModalInner.tsx +45 -0
- package/components/modal/helpers.js +64 -0
- package/components/modal/helpers.ts +63 -0
- package/components/modal/types.js +1 -0
- package/{cjs/components/modal/Modal.d.ts → components/modal/types.ts} +125 -179
- package/components/number-format/NumberFormat.d.ts +10 -10
- package/components/pagination/Pagination.d.ts +30 -30
- package/components/pagination/Pagination.js +7 -0
- package/components/pagination/PaginationProvider.d.ts +2 -2
- package/components/radio/Radio.d.ts +5 -5
- package/components/radio/RadioGroup.d.ts +4 -4
- package/components/section/Section.d.ts +3 -1
- package/components/skeleton/Skeleton.d.ts +2 -2
- package/components/slider/Slider.d.ts +5 -5
- package/components/step-indicator/StepIndicator.d.ts +6 -6
- package/components/step-indicator/StepIndicatorContext.d.ts +1 -1
- package/components/step-indicator/StepIndicatorItem.d.ts +3 -3
- package/components/step-indicator/StepIndicatorItem.js +1 -0
- package/components/step-indicator/StepIndicatorSidebar.d.ts +4 -4
- package/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
- package/components/switch/Switch.d.ts +6 -6
- package/components/tabs/Tabs.d.ts +8 -8
- package/components/tabs/TabsContentWrapper.d.ts +2 -2
- package/components/tabs/TabsCustomContent.d.ts +1 -1
- package/components/tag/Tag.js +122 -0
- package/components/tag/Tag.tsx +194 -0
- package/components/tag/TagContext.js +2 -0
- package/components/tag/TagContext.tsx +3 -0
- package/components/tag/TagGroup.js +60 -0
- package/components/tag/TagGroup.tsx +80 -0
- package/components/tag/index.d.ts +8 -0
- package/components/tag/index.js +3 -0
- package/components/tag/style/_tag.scss +90 -0
- package/components/tag/style/dnb-tag.css +925 -0
- package/components/tag/style/dnb-tag.min.css +1 -0
- package/components/tag/style/dnb-tag.scss +15 -0
- package/components/tag/style/index.d.ts +6 -0
- package/components/tag/style/index.js +1 -0
- package/components/tag/style/themes/_tag-mixins.scss +18 -0
- package/components/tag/style.js +1 -0
- package/components/textarea/Textarea.d.ts +4 -4
- package/components/timeline/Timeline.js +57 -0
- package/components/timeline/Timeline.tsx +91 -0
- package/components/timeline/TimelineItem.js +112 -0
- package/components/timeline/TimelineItem.tsx +193 -0
- package/components/timeline/index.d.ts +8 -0
- package/components/timeline/index.js +3 -0
- package/components/timeline/style/_timeline.scss +42 -0
- package/components/timeline/style/dnb-timeline.css +307 -0
- package/components/timeline/style/dnb-timeline.min.css +1 -0
- package/components/timeline/style/dnb-timeline.scss +12 -0
- package/components/timeline/style/index.d.ts +6 -0
- package/components/timeline/style/index.js +1 -0
- package/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
- package/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
- package/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
- package/components/timeline/style/themes/ui.js +1 -0
- package/components/timeline/style.js +1 -0
- package/components/toggle-button/ToggleButton.d.ts +7 -7
- package/components/toggle-button/ToggleButtonGroup.d.ts +4 -4
- package/components/tooltip/Tooltip.d.ts +5 -5
- package/components/tooltip/TooltipContainer.d.ts +3 -3
- package/components/tooltip/TooltipPortal.d.ts +1 -1
- package/components/tooltip/TooltipWithEvents.d.ts +1 -1
- package/elements/Img.d.ts +1 -1
- package/es/components/Avatar.d.ts +14 -0
- package/es/components/Avatar.js +3 -0
- package/es/components/InfoCard.d.ts +14 -0
- package/es/components/InfoCard.js +3 -0
- package/es/components/Tag.d.ts +14 -0
- package/es/components/Tag.js +3 -0
- package/es/components/Timeline.d.ts +14 -0
- package/es/components/Timeline.js +3 -0
- package/es/components/accordion/Accordion.d.ts +7 -7
- package/es/components/autocomplete/Autocomplete.d.ts +13 -13
- package/es/components/avatar/Avatar.js +83 -0
- package/es/components/avatar/Avatar.tsx +163 -0
- package/es/components/avatar/AvatarGroup.js +89 -0
- package/es/components/avatar/AvatarGroup.tsx +167 -0
- package/es/components/avatar/index.d.ts +8 -0
- package/es/components/avatar/index.js +3 -0
- package/es/components/avatar/style/_avatar.scss +145 -0
- package/es/components/avatar/style/dnb-avatar.css +218 -0
- package/es/components/avatar/style/dnb-avatar.min.css +1 -0
- package/es/components/avatar/style/dnb-avatar.scss +12 -0
- package/es/components/avatar/style/index.d.ts +6 -0
- package/es/components/avatar/style/index.js +1 -0
- package/es/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
- package/es/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
- package/es/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
- package/es/components/avatar/style/themes/ui.js +1 -0
- package/es/components/avatar/style.js +1 -0
- package/es/components/breadcrumb/BreadcrumbItem.js +3 -3
- package/es/components/breadcrumb/BreadcrumbItem.tsx +2 -2
- package/es/components/button/Button.d.ts +8 -8
- package/es/components/button/Button.js +7 -5
- package/es/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
- package/es/components/checkbox/Checkbox.d.ts +3 -3
- package/es/components/date-picker/DatePicker.d.ts +14 -14
- package/es/components/date-picker/DatePicker.js +4 -2
- package/es/components/date-picker/DatePickerAddon.d.ts +1 -1
- package/es/components/date-picker/DatePickerCalendar.d.ts +1 -1
- package/es/components/date-picker/DatePickerFooter.d.ts +1 -0
- package/es/components/date-picker/DatePickerFooter.js +9 -6
- package/es/components/date-picker/DatePickerInput.d.ts +1 -1
- package/es/components/dropdown/Dropdown.d.ts +11 -10
- package/es/components/form-label/FormLabel.d.ts +1 -1
- package/es/components/form-row/FormRow.d.ts +4 -4
- package/es/components/form-set/FormSet.d.ts +5 -5
- package/es/components/global-error/GlobalError.d.ts +1 -1
- package/es/components/global-status/GlobalStatus.d.ts +5 -5
- package/es/components/heading/Heading.d.ts +2 -2
- package/es/components/heading/HeadingProvider.d.ts +2 -2
- package/es/components/help-button/HelpButton.d.ts +1 -1
- package/es/components/help-button/HelpButtonInstance.d.ts +3 -2
- package/es/components/icon/Icon.d.ts +2 -2
- package/es/components/icon-primary/IconPrimary.d.ts +2 -2
- package/es/components/index.d.ts +8 -0
- package/es/components/index.js +5 -1
- package/es/components/info-card/InfoCard.js +135 -0
- package/es/components/info-card/InfoCard.tsx +249 -0
- package/es/components/info-card/index.d.ts +8 -0
- package/es/components/info-card/index.js +3 -0
- package/es/components/info-card/style/_info-card.scss +52 -0
- package/es/components/info-card/style/dnb-info-card.css +135 -0
- package/es/components/info-card/style/dnb-info-card.min.css +1 -0
- package/es/components/info-card/style/dnb-info-card.scss +12 -0
- package/es/components/info-card/style/index.d.ts +6 -0
- package/es/components/info-card/style/index.js +1 -0
- package/es/components/info-card/style.js +1 -0
- package/es/components/input/Input.d.ts +11 -10
- package/es/components/input-masked/InputMasked.d.ts +11 -11
- package/es/components/input-masked/InputMasked.js +6 -4
- package/es/components/input-masked/InputMaskedHooks.js +28 -31
- package/es/components/input-masked/InputMaskedUtils.js +7 -18
- package/es/components/lib.js +9 -1
- package/es/components/modal/Modal.js +127 -251
- package/es/components/modal/Modal.tsx +524 -0
- package/es/components/modal/ModalContent.js +120 -213
- package/es/components/modal/ModalContent.tsx +515 -0
- package/es/components/modal/ModalContext.tsx +10 -0
- package/es/components/modal/ModalRoot.js +108 -0
- package/es/components/modal/ModalRoot.tsx +131 -0
- package/es/components/modal/components/CloseButton.js +41 -0
- package/es/components/modal/components/CloseButton.tsx +56 -0
- package/es/components/modal/components/ModalHeader.js +40 -0
- package/es/components/modal/components/ModalHeader.tsx +79 -0
- package/es/components/modal/components/ModalHeaderBar.js +88 -0
- package/es/components/modal/components/ModalHeaderBar.tsx +118 -0
- package/es/components/modal/{ModalInner.js → components/ModalInner.js} +8 -18
- package/es/components/modal/components/ModalInner.tsx +45 -0
- package/es/components/modal/helpers.js +60 -0
- package/es/components/modal/helpers.ts +63 -0
- package/es/components/modal/types.js +1 -0
- package/es/components/modal/{Modal.d.ts → types.ts} +125 -179
- package/es/components/number-format/NumberFormat.d.ts +10 -10
- package/es/components/pagination/Pagination.d.ts +30 -30
- package/es/components/pagination/Pagination.js +3 -0
- package/es/components/pagination/PaginationProvider.d.ts +2 -2
- package/es/components/radio/Radio.d.ts +5 -5
- package/es/components/radio/RadioGroup.d.ts +4 -4
- package/es/components/section/Section.d.ts +3 -2
- package/es/components/skeleton/Skeleton.d.ts +2 -2
- package/es/components/slider/Slider.d.ts +5 -5
- package/es/components/step-indicator/StepIndicator.d.ts +6 -6
- package/es/components/step-indicator/StepIndicatorContext.d.ts +1 -1
- package/es/components/step-indicator/StepIndicatorItem.d.ts +3 -3
- package/es/components/step-indicator/StepIndicatorItem.js +1 -0
- package/es/components/step-indicator/StepIndicatorSidebar.d.ts +4 -4
- package/es/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
- package/es/components/switch/Switch.d.ts +6 -6
- package/es/components/tabs/Tabs.d.ts +8 -8
- package/es/components/tabs/TabsContentWrapper.d.ts +2 -2
- package/es/components/tabs/TabsCustomContent.d.ts +1 -1
- package/es/components/tag/Tag.js +115 -0
- package/es/components/tag/Tag.tsx +194 -0
- package/es/components/tag/TagContext.js +2 -0
- package/es/components/tag/TagContext.tsx +3 -0
- package/es/components/tag/TagGroup.js +53 -0
- package/es/components/tag/TagGroup.tsx +80 -0
- package/es/components/tag/index.d.ts +8 -0
- package/es/components/tag/index.js +3 -0
- package/es/components/tag/style/_tag.scss +90 -0
- package/es/components/tag/style/dnb-tag.css +925 -0
- package/es/components/tag/style/dnb-tag.min.css +1 -0
- package/es/components/tag/style/dnb-tag.scss +15 -0
- package/es/components/tag/style/index.d.ts +6 -0
- package/es/components/tag/style/index.js +1 -0
- package/es/components/tag/style/themes/_tag-mixins.scss +18 -0
- package/es/components/tag/style.js +1 -0
- package/es/components/textarea/Textarea.d.ts +4 -4
- package/es/components/timeline/Timeline.js +48 -0
- package/es/components/timeline/Timeline.tsx +91 -0
- package/es/components/timeline/TimelineItem.js +111 -0
- package/es/components/timeline/TimelineItem.tsx +193 -0
- package/es/components/timeline/index.d.ts +8 -0
- package/es/components/timeline/index.js +3 -0
- package/es/components/timeline/style/_timeline.scss +42 -0
- package/es/components/timeline/style/dnb-timeline.css +307 -0
- package/es/components/timeline/style/dnb-timeline.min.css +1 -0
- package/es/components/timeline/style/dnb-timeline.scss +12 -0
- package/es/components/timeline/style/index.d.ts +6 -0
- package/es/components/timeline/style/index.js +1 -0
- package/es/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
- package/es/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
- package/es/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
- package/es/components/timeline/style/themes/ui.js +1 -0
- package/es/components/timeline/style.js +1 -0
- package/es/components/toggle-button/ToggleButton.d.ts +7 -7
- package/es/components/toggle-button/ToggleButtonGroup.d.ts +4 -4
- package/es/components/tooltip/Tooltip.d.ts +5 -5
- package/es/components/tooltip/TooltipContainer.d.ts +3 -3
- package/es/components/tooltip/TooltipPortal.d.ts +1 -1
- package/es/components/tooltip/TooltipWithEvents.d.ts +1 -1
- package/es/elements/Img.d.ts +2 -2
- package/es/extensions/payment-card/PaymentCard.d.ts +1 -1
- package/es/extensions/payment-card/style/_payment-card.scss +0 -1
- package/es/extensions/payment-card/style/dnb-payment-card.css +0 -1
- package/es/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
- package/es/fragments/drawer-list/DrawerListProvider.js +1 -0
- package/es/fragments/scroll-view/ScrollView.js +7 -15
- package/es/fragments/scroll-view/ScrollView.tsx +92 -0
- package/es/index.d.ts +8 -0
- package/es/index.js +5 -1
- package/es/shared/Context.js +11 -4
- package/es/shared/locales/en-GB.js +5 -0
- package/es/shared/locales/nb-NO.js +5 -0
- package/es/style/core/helper-classes/skip-link.scss +1 -1
- package/es/style/dnb-ui-components.css +716 -0
- package/es/style/dnb-ui-components.min.css +3 -3
- package/es/style/dnb-ui-components.scss +4 -0
- package/es/style/dnb-ui-elements.css +3 -0
- package/es/style/dnb-ui-elements.min.css +1 -1
- package/es/style/dnb-ui-extensions.css +0 -1
- package/es/style/dnb-ui-extensions.min.css +1 -1
- package/es/style/dnb-ui-tags.css +6 -0
- package/es/style/dnb-ui-tags.min.css +2 -2
- package/es/style/elements/code.scss +3 -0
- package/es/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
- package/es/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
- package/es/style/themes/theme-ui/dnb-theme-ui.css +226 -0
- package/es/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
- package/es/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
- package/esm/components/Avatar.d.ts +14 -0
- package/esm/components/Avatar.js +3 -0
- package/esm/components/InfoCard.d.ts +14 -0
- package/esm/components/InfoCard.js +3 -0
- package/esm/components/Tag.d.ts +14 -0
- package/esm/components/Tag.js +3 -0
- package/esm/components/Timeline.d.ts +14 -0
- package/esm/components/Timeline.js +3 -0
- package/esm/components/accordion/Accordion.d.ts +7 -7
- package/esm/components/autocomplete/Autocomplete.d.ts +13 -13
- package/esm/components/avatar/Avatar.js +89 -0
- package/esm/components/avatar/Avatar.tsx +163 -0
- package/esm/components/avatar/AvatarGroup.js +94 -0
- package/esm/components/avatar/AvatarGroup.tsx +167 -0
- package/esm/components/avatar/index.d.ts +8 -0
- package/esm/components/avatar/index.js +3 -0
- package/esm/components/avatar/style/_avatar.scss +145 -0
- package/esm/components/avatar/style/dnb-avatar.css +218 -0
- package/esm/components/avatar/style/dnb-avatar.min.css +1 -0
- package/esm/components/avatar/style/dnb-avatar.scss +12 -0
- package/esm/components/avatar/style/index.d.ts +6 -0
- package/esm/components/avatar/style/index.js +1 -0
- package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.css +36 -0
- package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.min.css +1 -0
- package/esm/components/avatar/style/themes/dnb-avatar-theme-ui.scss +29 -0
- package/esm/components/avatar/style/themes/ui.js +1 -0
- package/esm/components/avatar/style.js +1 -0
- package/esm/components/breadcrumb/BreadcrumbItem.js +3 -3
- package/esm/components/breadcrumb/BreadcrumbItem.tsx +2 -2
- package/esm/components/button/Button.d.ts +7 -7
- package/esm/components/button/Button.js +7 -5
- package/esm/components/button/style/themes/dnb-button-theme-ui.scss +3 -0
- package/esm/components/checkbox/Checkbox.d.ts +3 -3
- package/esm/components/date-picker/DatePicker.d.ts +14 -14
- package/esm/components/date-picker/DatePicker.js +4 -2
- package/esm/components/date-picker/DatePickerAddon.d.ts +1 -1
- package/esm/components/date-picker/DatePickerCalendar.d.ts +1 -1
- package/esm/components/date-picker/DatePickerFooter.d.ts +1 -0
- package/esm/components/date-picker/DatePickerFooter.js +10 -6
- package/esm/components/date-picker/DatePickerInput.d.ts +1 -1
- package/esm/components/dropdown/Dropdown.d.ts +11 -10
- package/esm/components/form-label/FormLabel.d.ts +1 -1
- package/esm/components/form-row/FormRow.d.ts +4 -4
- package/esm/components/form-set/FormSet.d.ts +5 -5
- package/esm/components/global-error/GlobalError.d.ts +1 -1
- package/esm/components/global-status/GlobalStatus.d.ts +5 -5
- package/esm/components/heading/Heading.d.ts +2 -2
- package/esm/components/heading/HeadingProvider.d.ts +2 -2
- package/esm/components/help-button/HelpButton.d.ts +1 -1
- package/esm/components/help-button/HelpButtonInstance.d.ts +3 -2
- package/esm/components/icon/Icon.d.ts +2 -2
- package/esm/components/index.d.ts +8 -0
- package/esm/components/index.js +5 -1
- package/esm/components/info-card/InfoCard.js +140 -0
- package/esm/components/info-card/InfoCard.tsx +249 -0
- package/esm/components/info-card/index.d.ts +8 -0
- package/esm/components/info-card/index.js +3 -0
- package/esm/components/info-card/style/_info-card.scss +52 -0
- package/esm/components/info-card/style/dnb-info-card.css +135 -0
- package/esm/components/info-card/style/dnb-info-card.min.css +1 -0
- package/esm/components/info-card/style/dnb-info-card.scss +12 -0
- package/esm/components/info-card/style/index.d.ts +6 -0
- package/esm/components/info-card/style/index.js +1 -0
- package/esm/components/info-card/style.js +1 -0
- package/esm/components/input/Input.d.ts +11 -10
- package/esm/components/input-masked/InputMasked.d.ts +11 -11
- package/esm/components/input-masked/InputMasked.js +6 -4
- package/esm/components/input-masked/InputMaskedHooks.js +43 -46
- package/esm/components/input-masked/InputMaskedUtils.js +9 -20
- package/esm/components/lib.js +9 -1
- package/esm/components/modal/Modal.js +146 -278
- package/esm/components/modal/Modal.tsx +524 -0
- package/esm/components/modal/ModalContent.js +162 -256
- package/esm/components/modal/ModalContent.tsx +515 -0
- package/esm/components/modal/ModalContext.tsx +10 -0
- package/esm/components/modal/ModalRoot.js +145 -0
- package/esm/components/modal/ModalRoot.tsx +131 -0
- package/esm/components/modal/components/CloseButton.js +72 -0
- package/esm/components/modal/components/CloseButton.tsx +56 -0
- package/esm/components/modal/components/ModalHeader.js +70 -0
- package/esm/components/modal/components/ModalHeader.tsx +79 -0
- package/esm/components/modal/components/ModalHeaderBar.js +122 -0
- package/esm/components/modal/components/ModalHeaderBar.tsx +118 -0
- package/esm/components/modal/{ModalInner.js → components/ModalInner.js} +11 -17
- package/esm/components/modal/components/ModalInner.tsx +45 -0
- package/esm/components/modal/helpers.js +64 -0
- package/esm/components/modal/helpers.ts +63 -0
- package/esm/components/modal/types.js +1 -0
- package/esm/components/modal/{Modal.d.ts → types.ts} +125 -179
- package/esm/components/number-format/NumberFormat.d.ts +10 -10
- package/esm/components/pagination/Pagination.d.ts +30 -30
- package/esm/components/pagination/Pagination.js +7 -0
- package/esm/components/pagination/PaginationProvider.d.ts +2 -2
- package/esm/components/radio/Radio.d.ts +5 -5
- package/esm/components/radio/RadioGroup.d.ts +4 -4
- package/esm/components/section/Section.d.ts +3 -1
- package/esm/components/skeleton/Skeleton.d.ts +2 -2
- package/esm/components/slider/Slider.d.ts +5 -5
- package/esm/components/step-indicator/StepIndicator.d.ts +6 -6
- package/esm/components/step-indicator/StepIndicatorContext.d.ts +1 -1
- package/esm/components/step-indicator/StepIndicatorItem.d.ts +3 -3
- package/esm/components/step-indicator/StepIndicatorItem.js +1 -0
- package/esm/components/step-indicator/StepIndicatorSidebar.d.ts +4 -4
- package/esm/components/step-indicator/StepIndicatorTriggerButton.d.ts +1 -1
- package/esm/components/switch/Switch.d.ts +6 -6
- package/esm/components/tabs/Tabs.d.ts +8 -8
- package/esm/components/tabs/TabsContentWrapper.d.ts +2 -2
- package/esm/components/tabs/TabsCustomContent.d.ts +1 -1
- package/esm/components/tag/Tag.js +122 -0
- package/esm/components/tag/Tag.tsx +194 -0
- package/esm/components/tag/TagContext.js +2 -0
- package/esm/components/tag/TagContext.tsx +3 -0
- package/esm/components/tag/TagGroup.js +60 -0
- package/esm/components/tag/TagGroup.tsx +80 -0
- package/esm/components/tag/index.d.ts +8 -0
- package/esm/components/tag/index.js +3 -0
- package/esm/components/tag/style/_tag.scss +90 -0
- package/esm/components/tag/style/dnb-tag.css +925 -0
- package/esm/components/tag/style/dnb-tag.min.css +1 -0
- package/esm/components/tag/style/dnb-tag.scss +15 -0
- package/esm/components/tag/style/index.d.ts +6 -0
- package/esm/components/tag/style/index.js +1 -0
- package/esm/components/tag/style/themes/_tag-mixins.scss +18 -0
- package/esm/components/tag/style.js +1 -0
- package/esm/components/textarea/Textarea.d.ts +4 -4
- package/esm/components/timeline/Timeline.js +57 -0
- package/esm/components/timeline/Timeline.tsx +91 -0
- package/esm/components/timeline/TimelineItem.js +112 -0
- package/esm/components/timeline/TimelineItem.tsx +193 -0
- package/esm/components/timeline/index.d.ts +8 -0
- package/esm/components/timeline/index.js +3 -0
- package/esm/components/timeline/style/_timeline.scss +42 -0
- package/esm/components/timeline/style/dnb-timeline.css +307 -0
- package/esm/components/timeline/style/dnb-timeline.min.css +1 -0
- package/esm/components/timeline/style/dnb-timeline.scss +12 -0
- package/esm/components/timeline/style/index.d.ts +6 -0
- package/esm/components/timeline/style/index.js +1 -0
- package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.css +185 -0
- package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.min.css +1 -0
- package/esm/components/timeline/style/themes/dnb-timeline-theme-ui.scss +105 -0
- package/esm/components/timeline/style/themes/ui.js +1 -0
- package/esm/components/timeline/style.js +1 -0
- package/esm/components/toggle-button/ToggleButton.d.ts +7 -7
- package/esm/components/toggle-button/ToggleButtonGroup.d.ts +4 -4
- package/esm/components/tooltip/Tooltip.d.ts +5 -5
- package/esm/components/tooltip/TooltipContainer.d.ts +3 -3
- package/esm/components/tooltip/TooltipPortal.d.ts +1 -1
- package/esm/components/tooltip/TooltipWithEvents.d.ts +1 -1
- package/esm/dnb-ui-components.min.mjs +4 -4
- package/esm/dnb-ui-elements.min.mjs +1 -1
- package/esm/dnb-ui-extensions.min.mjs +3 -3
- package/esm/dnb-ui-lib.min.mjs +4 -4
- package/esm/dnb-ui-web-components.min.mjs +4 -4
- package/esm/elements/Img.d.ts +1 -1
- package/esm/extensions/payment-card/PaymentCard.d.ts +1 -1
- package/esm/extensions/payment-card/style/_payment-card.scss +0 -1
- package/esm/extensions/payment-card/style/dnb-payment-card.css +0 -1
- package/esm/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
- package/esm/fragments/drawer-list/DrawerListProvider.js +1 -0
- package/esm/fragments/scroll-view/ScrollView.js +10 -16
- package/esm/fragments/scroll-view/ScrollView.tsx +92 -0
- package/esm/index.d.ts +8 -0
- package/esm/index.js +5 -1
- package/esm/shared/Context.js +11 -4
- package/esm/shared/locales/en-GB.js +5 -0
- package/esm/shared/locales/nb-NO.js +5 -0
- package/esm/style/core/helper-classes/skip-link.scss +1 -1
- package/esm/style/dnb-ui-components.css +716 -0
- package/esm/style/dnb-ui-components.min.css +3 -3
- package/esm/style/dnb-ui-components.scss +4 -0
- package/esm/style/dnb-ui-elements.css +3 -0
- package/esm/style/dnb-ui-elements.min.css +1 -1
- package/esm/style/dnb-ui-extensions.css +0 -1
- package/esm/style/dnb-ui-extensions.min.css +1 -1
- package/esm/style/dnb-ui-tags.css +6 -0
- package/esm/style/dnb-ui-tags.min.css +2 -2
- package/esm/style/elements/code.scss +3 -0
- package/esm/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
- package/esm/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
- package/esm/style/themes/theme-ui/dnb-theme-ui.css +226 -0
- package/esm/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
- package/esm/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
- package/extensions/payment-card/PaymentCard.d.ts +1 -1
- package/extensions/payment-card/style/_payment-card.scss +0 -1
- package/extensions/payment-card/style/dnb-payment-card.css +0 -1
- package/extensions/payment-card/style/dnb-payment-card.min.css +1 -1
- package/fragments/drawer-list/DrawerListProvider.js +1 -0
- package/fragments/scroll-view/ScrollView.js +10 -16
- package/fragments/scroll-view/ScrollView.tsx +92 -0
- package/index.d.ts +8 -0
- package/index.js +5 -1
- package/package.json +2 -3
- package/shared/Context.js +11 -4
- package/shared/locales/en-GB.js +5 -0
- package/shared/locales/nb-NO.js +5 -0
- package/style/core/helper-classes/skip-link.scss +1 -1
- package/style/dnb-ui-components.css +716 -0
- package/style/dnb-ui-components.min.css +3 -3
- package/style/dnb-ui-components.scss +4 -0
- package/style/dnb-ui-elements.css +3 -0
- package/style/dnb-ui-elements.min.css +1 -1
- package/style/dnb-ui-extensions.css +0 -1
- package/style/dnb-ui-extensions.min.css +1 -1
- package/style/dnb-ui-tags.css +6 -0
- package/style/dnb-ui-tags.min.css +2 -2
- package/style/elements/code.scss +3 -0
- package/style/themes/theme-open-banking/dnb-theme-open-banking.css +226 -0
- package/style/themes/theme-open-banking/dnb-theme-open-banking.min.css +3 -3
- package/style/themes/theme-ui/dnb-theme-ui.css +226 -0
- package/style/themes/theme-ui/dnb-theme-ui.min.css +3 -3
- package/style/themes/theme-ui/dnb-theme-ui.scss +2 -0
- package/umd/dnb-ui-components.min.js +5 -5
- package/umd/dnb-ui-elements.min.js +3 -3
- package/umd/dnb-ui-extensions.min.js +3 -3
- package/umd/dnb-ui-lib.min.js +5 -5
- package/umd/dnb-ui-web-components.min.js +5 -5
- package/cjs/components/modal/ModalContent.d.ts +0 -168
- package/cjs/components/modal/ModalHeader.d.ts +0 -73
- package/cjs/components/modal/ModalInner.d.ts +0 -20
- package/cjs/fragments/scroll-view/ScrollView.d.ts +0 -1
- package/components/modal/Modal.d.ts +0 -325
- package/components/modal/ModalContent.d.ts +0 -168
- package/components/modal/ModalHeader.d.ts +0 -73
- package/components/modal/ModalHeader.js +0 -224
- package/components/modal/ModalInner.d.ts +0 -20
- package/es/components/modal/ModalContent.d.ts +0 -168
- package/es/components/modal/ModalHeader.d.ts +0 -73
- package/es/components/modal/ModalHeader.js +0 -166
- package/es/components/modal/ModalInner.d.ts +0 -20
- package/es/fragments/scroll-view/ScrollView.d.ts +0 -1
- package/esm/components/modal/ModalContent.d.ts +0 -168
- package/esm/components/modal/ModalHeader.d.ts +0 -73
- package/esm/components/modal/ModalHeader.js +0 -224
- package/esm/components/modal/ModalInner.d.ts +0 -20
- package/esm/fragments/scroll-view/ScrollView.d.ts +0 -1
- package/fragments/scroll-view/ScrollView.d.ts +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./dnb-info-card.min.css";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import "./style/dnb-info-card.min.css";
|
|
@@ -43,7 +43,8 @@ export type InputSubmitButtonVariant =
|
|
|
43
43
|
| 'primary'
|
|
44
44
|
| 'secondary'
|
|
45
45
|
| 'tertiary'
|
|
46
|
-
| 'signal'
|
|
46
|
+
| 'signal'
|
|
47
|
+
| 'unstyled';
|
|
47
48
|
export type InputSubmitButtonIcon =
|
|
48
49
|
| string
|
|
49
50
|
| React.ReactNode
|
|
@@ -89,7 +90,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
89
90
|
type?: string;
|
|
90
91
|
|
|
91
92
|
/**
|
|
92
|
-
* The sizes you can sue is `small` (1.5rem), `default` (2rem), `medium` (2.5rem) and `large` (3rem) are supported component sizes. Defaults to `default` / `null`. Also, if You define a number like `size="2"` then
|
|
93
|
+
* The sizes you can sue is `small` (1.5rem), `default` (2rem), `medium` (2.5rem) and `large` (3rem) are supported component sizes. Defaults to `default` / `null`. Also, if You define a number like `size="2"` then it will be forwarded as the input element attribute.
|
|
93
94
|
*/
|
|
94
95
|
size?: InputSize;
|
|
95
96
|
|
|
@@ -120,7 +121,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
120
121
|
status?: InputStatus;
|
|
121
122
|
|
|
122
123
|
/**
|
|
123
|
-
* Defines the state of the status. Currently there are two statuses `[error, info]`. Defaults to `error`.
|
|
124
|
+
* Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.
|
|
124
125
|
*/
|
|
125
126
|
status_state?: string;
|
|
126
127
|
|
|
@@ -141,7 +142,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
141
142
|
global_status_id?: string;
|
|
142
143
|
|
|
143
144
|
/**
|
|
144
|
-
* Defaults to `off`. Set to `on` or any of <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete">allowed `attributes`</a>. Keep in mind, 1. you may have to define a `name`, 2. have the input as a
|
|
145
|
+
* Defaults to `off`. Set to `on` or any of <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete">allowed `attributes`</a>. Keep in mind, 1. you may have to define a `name`, 2. have the input as a descendant of a `<form>` element, 3. and have a submit button inside the form.
|
|
145
146
|
*/
|
|
146
147
|
autocomplete?: string;
|
|
147
148
|
|
|
@@ -162,7 +163,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
162
163
|
clear?: InputClear;
|
|
163
164
|
|
|
164
165
|
/**
|
|
165
|
-
* Set to `true` in case the `placeholder` has to be kept during focus. By default the placeholder disappears on focus.
|
|
166
|
+
* Set to `true` in case the `placeholder` has to be kept during focus. By default, the placeholder disappears on focus.
|
|
166
167
|
*/
|
|
167
168
|
keep_placeholder?: InputKeepPlaceholder;
|
|
168
169
|
|
|
@@ -199,17 +200,17 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
199
200
|
input_class?: string;
|
|
200
201
|
|
|
201
202
|
/**
|
|
202
|
-
* Provide the Input element with any attributes by using an Object `input_attributes={{size:'2'}}` or a JSON Object `input_attributes='{"size":"2"}'`. "NB:" Keep in mind, that also every not listed component property will be
|
|
203
|
+
* Provide the Input element with any attributes by using an Object `input_attributes={{size:'2'}}` or a JSON Object `input_attributes='{"size":"2"}'`. "NB:" Keep in mind, that also every not listed component property will be sent along and set as an Input element attribute.
|
|
203
204
|
*/
|
|
204
205
|
input_attributes?: InputInputAttributes;
|
|
205
206
|
|
|
206
207
|
/**
|
|
207
|
-
* <em>(internal)</em> by providing a new component we can change the
|
|
208
|
+
* <em>(internal)</em> by providing a new component we can change the internally used element. Also supports a string only, like `input_element="input"`.
|
|
208
209
|
*/
|
|
209
210
|
input_element?: InputInputElement;
|
|
210
211
|
|
|
211
212
|
/**
|
|
212
|
-
* Icon to show before or after the input / placeholder. Can be either a string defining a primary icon
|
|
213
|
+
* Icon to show before or after the input / placeholder. Can be either a string defining a primary icon or a Component using an SVG icon of either 16px or 24px.
|
|
213
214
|
*/
|
|
214
215
|
icon?: InputIcon;
|
|
215
216
|
|
|
@@ -224,7 +225,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
224
225
|
icon_position?: InputIconPosition;
|
|
225
226
|
|
|
226
227
|
/**
|
|
227
|
-
* By providing a React.ref we can get the
|
|
228
|
+
* By providing a React.ref we can get the internally used input element (DOM). E.g. `inner_ref={myRef}` by using `React.createRef()` or `React.useRef()`.
|
|
228
229
|
*/
|
|
229
230
|
inner_ref?: InputInnerRef;
|
|
230
231
|
readOnly?: InputReadOnly;
|
|
@@ -267,7 +268,7 @@ export interface InputProps extends React.HTMLProps<HTMLElement> {
|
|
|
267
268
|
custom_method?: (...args: any[]) => any;
|
|
268
269
|
|
|
269
270
|
/**
|
|
270
|
-
* Will be called on value changes made by the user. Returns an object with the value as a string and the
|
|
271
|
+
* Will be called on value changes made by the user. Returns an object with the value as a string and the native event: `{ value, event }`.
|
|
271
272
|
*/
|
|
272
273
|
on_change?: (...args: any[]) => any;
|
|
273
274
|
|
|
@@ -96,7 +96,7 @@ export type InputMaskedChildren =
|
|
|
96
96
|
*/
|
|
97
97
|
export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
98
98
|
/**
|
|
99
|
-
* A mask can be
|
|
99
|
+
* A mask can be defined both as a <a href="https://github.com/text-mask/text-mask/blob/master/componentDocumentation.md#readme">RegExp style of characters</a> or a callback function. Example below.
|
|
100
100
|
*/
|
|
101
101
|
mask?: InputMaskedMask;
|
|
102
102
|
|
|
@@ -106,7 +106,7 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
106
106
|
number_mask?: InputMaskedNumberMask;
|
|
107
107
|
|
|
108
108
|
/**
|
|
109
|
-
* Set to `true` or set the <em>valuta</em> (currency_mask="kr") to enable
|
|
109
|
+
* Set to `true` or set the <em>valuta</em> (currency_mask="kr") to enable a custom currency mask – or give an `object` containing the number mask properties. More details below. Can be a JSON string as well, containing the number mask properties. Is disabled by default. Defaults to `kr`.
|
|
110
110
|
*/
|
|
111
111
|
currency_mask?: InputMaskedCurrencyMask;
|
|
112
112
|
|
|
@@ -162,12 +162,12 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
162
162
|
placeholder_char?: string;
|
|
163
163
|
|
|
164
164
|
/**
|
|
165
|
-
* By providing a React.ref we can get the
|
|
165
|
+
* By providing a React.ref we can get the internally used input element (DOM). E.g. `inner_ref={myRef}` by using `React.createRef()` or `React.useRef()`.
|
|
166
166
|
*/
|
|
167
167
|
inner_ref?: Object;
|
|
168
168
|
|
|
169
169
|
/**
|
|
170
|
-
* Will be called on value changes made by the user. Returns an object with the value as a string and the
|
|
170
|
+
* Will be called on value changes made by the user. Returns an object with the value as a string and the native event: `{ value, event }`.
|
|
171
171
|
*/
|
|
172
172
|
on_change?: (...args: any[]) => any;
|
|
173
173
|
|
|
@@ -194,7 +194,7 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
194
194
|
type?: string;
|
|
195
195
|
|
|
196
196
|
/**
|
|
197
|
-
* The sizes you can sue is `small` (1.5rem), `default` (2rem), `medium` (2.5rem) and `large` (3rem) are supported component sizes. Defaults to `default` / `null`. Also, if You define a number like `size="2"` then
|
|
197
|
+
* The sizes you can sue is `small` (1.5rem), `default` (2rem), `medium` (2.5rem) and `large` (3rem) are supported component sizes. Defaults to `default` / `null`. Also, if You define a number like `size="2"` then it will be forwarded as the input element attribute.
|
|
198
198
|
*/
|
|
199
199
|
size?: InputMaskedSize;
|
|
200
200
|
|
|
@@ -225,7 +225,7 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
225
225
|
status?: InputMaskedStatus;
|
|
226
226
|
|
|
227
227
|
/**
|
|
228
|
-
* Defines the state of the status. Currently there are two statuses `[error, info]`. Defaults to `error`.
|
|
228
|
+
* Defines the state of the status. Currently, there are two statuses `[error, info]`. Defaults to `error`.
|
|
229
229
|
*/
|
|
230
230
|
status_state?: string;
|
|
231
231
|
|
|
@@ -246,7 +246,7 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
246
246
|
global_status_id?: string;
|
|
247
247
|
|
|
248
248
|
/**
|
|
249
|
-
* Defaults to `off`. Set to `on` or any of <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete">allowed `attributes`</a>. Keep in mind, 1. you may have to define a `name`, 2. have the input as a
|
|
249
|
+
* Defaults to `off`. Set to `on` or any of <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-autocomplete">allowed `attributes`</a>. Keep in mind, 1. you may have to define a `name`, 2. have the input as a descendant of a `<form>` element, 3. and have a submit button inside the form.
|
|
250
250
|
*/
|
|
251
251
|
autocomplete?: string;
|
|
252
252
|
|
|
@@ -267,7 +267,7 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
267
267
|
clear?: InputMaskedClear;
|
|
268
268
|
|
|
269
269
|
/**
|
|
270
|
-
* Set to `true` in case the `placeholder` has to be kept during focus. By default the placeholder disappears on focus.
|
|
270
|
+
* Set to `true` in case the `placeholder` has to be kept during focus. By default, the placeholder disappears on focus.
|
|
271
271
|
*/
|
|
272
272
|
keep_placeholder?: InputMaskedKeepPlaceholder;
|
|
273
273
|
|
|
@@ -304,17 +304,17 @@ export interface InputMaskedProps extends React.HTMLProps<HTMLElement> {
|
|
|
304
304
|
input_class?: string;
|
|
305
305
|
|
|
306
306
|
/**
|
|
307
|
-
* Provide the Input element with any attributes by using an Object `input_attributes={{size:'2'}}` or a JSON Object `input_attributes='{"size":"2"}'`. "NB:" Keep in mind, that also every not listed component property will be
|
|
307
|
+
* Provide the Input element with any attributes by using an Object `input_attributes={{size:'2'}}` or a JSON Object `input_attributes='{"size":"2"}'`. "NB:" Keep in mind, that also every not listed component property will be sent along and set as an Input element attribute.
|
|
308
308
|
*/
|
|
309
309
|
input_attributes?: InputMaskedInputAttributes;
|
|
310
310
|
|
|
311
311
|
/**
|
|
312
|
-
* <em>(internal)</em> by providing a new component we can change the
|
|
312
|
+
* <em>(internal)</em> by providing a new component we can change the internally used element. Also supports a string only, like `input_element="input"`.
|
|
313
313
|
*/
|
|
314
314
|
input_element?: InputMaskedInputElement;
|
|
315
315
|
|
|
316
316
|
/**
|
|
317
|
-
* Icon to show before or after the input / placeholder. Can be either a string defining a primary icon
|
|
317
|
+
* Icon to show before or after the input / placeholder. Can be either a string defining a primary icon or a Component using an SVG icon of either 16px or 24px.
|
|
318
318
|
*/
|
|
319
319
|
icon?: InputMaskedIcon;
|
|
320
320
|
|
|
@@ -15,18 +15,20 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
15
15
|
|
|
16
16
|
import React from 'react';
|
|
17
17
|
import PropTypes from 'prop-types';
|
|
18
|
-
import { registerElement } from '../../shared/component-helper';
|
|
18
|
+
import { registerElement, extendPropsWithContext } from '../../shared/component-helper';
|
|
19
19
|
import InputMaskedContext from './InputMaskedContext';
|
|
20
20
|
import InputMaskedElement from './InputMaskedElement';
|
|
21
21
|
import Input, { inputPropTypes } from '../input/Input';
|
|
22
22
|
import Context from '../../shared/Context';
|
|
23
23
|
var InputMasked = React.forwardRef(function (props, ref) {
|
|
24
24
|
var context = React.useContext(Context);
|
|
25
|
+
var contextAndProps = React.useCallback(extendPropsWithContext(props, InputMasked.defaultProps, context === null || context === void 0 ? void 0 : context.InputMasked), [props, InputMasked.defaultProps, context === null || context === void 0 ? void 0 : context.InputMasked]);
|
|
25
26
|
return React.createElement(InputMaskedContext.Provider, {
|
|
26
|
-
value:
|
|
27
|
+
value: {
|
|
27
28
|
inner_ref: ref,
|
|
28
|
-
props:
|
|
29
|
-
|
|
29
|
+
props: contextAndProps,
|
|
30
|
+
context: context
|
|
31
|
+
}
|
|
30
32
|
}, _InputMaskedElement || (_InputMaskedElement = React.createElement(InputMaskedElement, null)));
|
|
31
33
|
});
|
|
32
34
|
export default InputMasked;
|
|
@@ -27,7 +27,6 @@ import React from 'react';
|
|
|
27
27
|
import classnames from 'classnames';
|
|
28
28
|
import { cleanNumber, getCurrencySymbol } from '../number-format/NumberUtils';
|
|
29
29
|
import { isTrue, dispatchCustomElementEvent } from '../../shared/component-helper';
|
|
30
|
-
import Context from '../../shared/Context';
|
|
31
30
|
import TextMask from './TextMask';
|
|
32
31
|
import createNumberMask from './addons/createNumberMask';
|
|
33
32
|
import keycode from 'keycode';
|
|
@@ -68,9 +67,9 @@ export var useInputElementRef = function useInputElementRef() {
|
|
|
68
67
|
};
|
|
69
68
|
export var useLocale = function useLocale() {
|
|
70
69
|
var _React$useContext3 = React.useContext(InputMaskedContext),
|
|
71
|
-
props = _React$useContext3.props
|
|
70
|
+
props = _React$useContext3.props,
|
|
71
|
+
context = _React$useContext3.context;
|
|
72
72
|
|
|
73
|
-
var context = React.useContext(Context);
|
|
74
73
|
var locale = props.locale;
|
|
75
74
|
|
|
76
75
|
if (!locale && context !== null && context !== void 0 && context.locale) {
|
|
@@ -81,17 +80,16 @@ export var useLocale = function useLocale() {
|
|
|
81
80
|
};
|
|
82
81
|
export var useLocalValue = function useLocalValue() {
|
|
83
82
|
var _React$useContext4 = React.useContext(InputMaskedContext),
|
|
84
|
-
props = _React$useContext4.props
|
|
83
|
+
props = _React$useContext4.props,
|
|
84
|
+
context = _React$useContext4.context;
|
|
85
85
|
|
|
86
|
-
var
|
|
87
|
-
var maskParams = useNumberMaskParams();
|
|
86
|
+
var maskParams = useNumberMaskParams() || {};
|
|
88
87
|
var locale = useLocale();
|
|
89
88
|
|
|
90
89
|
var _React$useState = React.useState(function () {
|
|
91
90
|
return correctNumberValue({
|
|
92
|
-
props: props,
|
|
93
|
-
context: context,
|
|
94
91
|
locale: locale,
|
|
92
|
+
props: props,
|
|
95
93
|
maskParams: maskParams
|
|
96
94
|
});
|
|
97
95
|
}),
|
|
@@ -102,9 +100,8 @@ export var useLocalValue = function useLocalValue() {
|
|
|
102
100
|
React.useEffect(function () {
|
|
103
101
|
var value = correctNumberValue({
|
|
104
102
|
localValue: localValue,
|
|
105
|
-
props: props,
|
|
106
|
-
context: context,
|
|
107
103
|
locale: locale,
|
|
104
|
+
props: props,
|
|
108
105
|
maskParams: maskParams
|
|
109
106
|
});
|
|
110
107
|
setLocalValue(value);
|
|
@@ -117,7 +114,10 @@ export var useLocalValue = function useLocalValue() {
|
|
|
117
114
|
export var useNumberMask = function useNumberMask() {
|
|
118
115
|
var maskParams = useNumberMaskParams();
|
|
119
116
|
|
|
120
|
-
|
|
117
|
+
var _React$useContext5 = React.useContext(InputMaskedContext),
|
|
118
|
+
props = _React$useContext5.props;
|
|
119
|
+
|
|
120
|
+
if (!maskParams || !isRequestingNumberMask(props)) {
|
|
121
121
|
return null;
|
|
122
122
|
}
|
|
123
123
|
|
|
@@ -125,9 +125,9 @@ export var useNumberMask = function useNumberMask() {
|
|
|
125
125
|
mask.maskParams = maskParams;
|
|
126
126
|
return mask;
|
|
127
127
|
};
|
|
128
|
-
export var
|
|
129
|
-
var _React$
|
|
130
|
-
props = _React$
|
|
128
|
+
export var useMask = function useMask() {
|
|
129
|
+
var _React$useContext6 = React.useContext(InputMaskedContext),
|
|
130
|
+
props = _React$useContext6.props;
|
|
131
131
|
|
|
132
132
|
var numberMask = useNumberMask();
|
|
133
133
|
|
|
@@ -138,15 +138,15 @@ export var useInternalMask = function useInternalMask() {
|
|
|
138
138
|
return props.mask;
|
|
139
139
|
};
|
|
140
140
|
export var useMaskParams = function useMaskParams() {
|
|
141
|
-
var _React$
|
|
142
|
-
props = _React$
|
|
141
|
+
var _React$useContext7 = React.useContext(InputMaskedContext),
|
|
142
|
+
props = _React$useContext7.props;
|
|
143
143
|
|
|
144
144
|
var keep_char_positions = props.keep_char_positions,
|
|
145
145
|
show_guide = props.show_guide,
|
|
146
146
|
show_mask = props.show_mask,
|
|
147
147
|
placeholder_char = props.placeholder_char,
|
|
148
148
|
placeholder = props.placeholder;
|
|
149
|
-
var mask =
|
|
149
|
+
var mask = useMask();
|
|
150
150
|
var maskParams = useNumberMaskParams() || {};
|
|
151
151
|
maskParams.showMask = !placeholder && isTrue(show_mask);
|
|
152
152
|
maskParams.placeholderChar = placeholder_char;
|
|
@@ -170,11 +170,11 @@ export var useMaskParams = function useMaskParams() {
|
|
|
170
170
|
export var useInputElement = function useInputElement() {
|
|
171
171
|
var ref = useInputElementRef();
|
|
172
172
|
|
|
173
|
-
var _React$
|
|
174
|
-
props = _React$
|
|
173
|
+
var _React$useContext8 = React.useContext(InputMaskedContext),
|
|
174
|
+
props = _React$useContext8.props;
|
|
175
175
|
|
|
176
176
|
var pipe = props.pipe;
|
|
177
|
-
var mask =
|
|
177
|
+
var mask = useMask();
|
|
178
178
|
|
|
179
179
|
var _useMaskParams = useMaskParams(),
|
|
180
180
|
showMask = _useMaskParams.showMask,
|
|
@@ -220,41 +220,42 @@ export var useEventMapping = function useEventMapping(_ref) {
|
|
|
220
220
|
event: event
|
|
221
221
|
}, 'on_before_input');
|
|
222
222
|
},
|
|
223
|
+
onFocus: function onFocus(params) {
|
|
224
|
+
return callEvent(params, 'on_focus');
|
|
225
|
+
},
|
|
226
|
+
onBlur: function onBlur(params) {
|
|
227
|
+
return callEvent(params, 'on_blur');
|
|
228
|
+
},
|
|
223
229
|
onMouseUp: function onMouseUp(event) {
|
|
224
230
|
return callEvent({
|
|
225
231
|
event: event
|
|
226
232
|
}, 'on_mouse_up');
|
|
227
233
|
},
|
|
228
|
-
|
|
229
|
-
return callEvent(params, 'on_focus');
|
|
230
|
-
},
|
|
231
|
-
on_key_down: function on_key_down(params) {
|
|
234
|
+
onKeyDown: function onKeyDown(params) {
|
|
232
235
|
return callEvent(params, 'on_key_down');
|
|
233
236
|
},
|
|
234
|
-
|
|
237
|
+
onSubmit: function onSubmit(params) {
|
|
235
238
|
return callEvent(params, 'on_submit');
|
|
236
239
|
},
|
|
237
|
-
|
|
238
|
-
return callEvent(params, 'on_blur');
|
|
239
|
-
},
|
|
240
|
-
on_change: function on_change(params) {
|
|
240
|
+
onChange: function onChange(params) {
|
|
241
241
|
return callEvent(params, 'on_change');
|
|
242
|
-
}
|
|
242
|
+
},
|
|
243
|
+
on_focus: undefined,
|
|
244
|
+
on_blur: undefined,
|
|
245
|
+
on_key_down: undefined,
|
|
246
|
+
on_submit: undefined,
|
|
247
|
+
on_change: undefined
|
|
243
248
|
};
|
|
244
249
|
};
|
|
245
250
|
|
|
246
251
|
var useCallEvent = function useCallEvent(_ref2) {
|
|
247
252
|
var setLocalValue = _ref2.setLocalValue;
|
|
248
253
|
|
|
249
|
-
var _React$
|
|
250
|
-
props = _React$
|
|
254
|
+
var _React$useContext9 = React.useContext(InputMaskedContext),
|
|
255
|
+
props = _React$useContext9.props;
|
|
251
256
|
|
|
252
257
|
var maskParams = useMaskParams();
|
|
253
|
-
|
|
254
|
-
if (!maskParams) {
|
|
255
|
-
return function () {};
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
+
var isNumberMask = useNumberMask();
|
|
258
259
|
var decimalSeparators = /[,.'·]/;
|
|
259
260
|
var isUnidentified = false;
|
|
260
261
|
|
|
@@ -275,16 +276,15 @@ var useCallEvent = function useCallEvent(_ref2) {
|
|
|
275
276
|
isUnidentified = false;
|
|
276
277
|
}
|
|
277
278
|
|
|
278
|
-
if (name === 'on_key_down' && !isUnidentified && !(maskParams !== null && maskParams !== void 0 && maskParams.allowLeadingZeroes) && (keyCode === '0' || value.replace(/[^\d]/g, '') === '' && decimalSeparators.test(keyCode))) {
|
|
279
|
+
if (name === 'on_key_down' && !isUnidentified && (isNumberMask && !(maskParams !== null && maskParams !== void 0 && maskParams.allowLeadingZeroes) || !isNumberMask && (maskParams === null || maskParams === void 0 ? void 0 : maskParams.allowLeadingZeroes) === false) && (keyCode === '0' || keyCode === 'numpad 0' || value.replace(/[^\d]/g, '') === '' && decimalSeparators.test(keyCode))) {
|
|
279
280
|
var testValue = (value.slice(0, selStart) + '0' + value.slice(selStart + 1, value.length)).replace(/[^\d]/g, '');
|
|
280
281
|
|
|
281
282
|
if (/^0/.test(testValue)) {
|
|
282
283
|
event.preventDefault();
|
|
283
|
-
return;
|
|
284
284
|
}
|
|
285
285
|
}
|
|
286
286
|
|
|
287
|
-
if (name === 'on_key_down' && !isUnidentified && maskParams !== null && maskParams !== void 0 && maskParams.decimalSymbol) {
|
|
287
|
+
if (name === 'on_key_down' && isNumberMask && !isUnidentified && maskParams !== null && maskParams !== void 0 && maskParams.decimalSymbol) {
|
|
288
288
|
var hasDecimalSymbol = value.includes(maskParams.decimalSymbol);
|
|
289
289
|
var allowedDecimals = maskParams.decimalLimit > 0 || maskParams.allowDecimal !== false;
|
|
290
290
|
|
|
@@ -358,14 +358,13 @@ var useCallEvent = function useCallEvent(_ref2) {
|
|
|
358
358
|
var useNumberMaskParams = function useNumberMaskParams() {
|
|
359
359
|
var _currency_mask;
|
|
360
360
|
|
|
361
|
-
var _React$
|
|
362
|
-
props = _React$
|
|
361
|
+
var _React$useContext10 = React.useContext(InputMaskedContext),
|
|
362
|
+
props = _React$useContext10.props;
|
|
363
363
|
|
|
364
|
-
var context = React.useContext(Context);
|
|
365
364
|
var locale = useLocale();
|
|
366
365
|
|
|
367
366
|
if (!isRequestingNumberMask(props)) {
|
|
368
|
-
return
|
|
367
|
+
return _objectSpread({}, fromJSON(props.mask_options));
|
|
369
368
|
}
|
|
370
369
|
|
|
371
370
|
var number_mask = props.number_mask,
|
|
@@ -406,7 +405,6 @@ var useNumberMaskParams = function useNumberMaskParams() {
|
|
|
406
405
|
|
|
407
406
|
if (number_mask) {
|
|
408
407
|
maskParams = handleNumberMask({
|
|
409
|
-
context: context,
|
|
410
408
|
mask_options: mask_options,
|
|
411
409
|
number_mask: number_mask
|
|
412
410
|
});
|
|
@@ -420,7 +418,6 @@ var useNumberMaskParams = function useNumberMaskParams() {
|
|
|
420
418
|
}
|
|
421
419
|
} else if (currency_mask) {
|
|
422
420
|
maskParams = handleCurrencyMask({
|
|
423
|
-
context: context,
|
|
424
421
|
mask_options: mask_options,
|
|
425
422
|
currency_mask: currency_mask
|
|
426
423
|
});
|
|
@@ -48,12 +48,9 @@ export var isRequestingNumberMask = function isRequestingNumberMask(props) {
|
|
|
48
48
|
});
|
|
49
49
|
};
|
|
50
50
|
export var correctNumberValue = function correctNumberValue(_ref5) {
|
|
51
|
-
var _context$InputMasked;
|
|
52
|
-
|
|
53
51
|
var _ref5$localValue = _ref5.localValue,
|
|
54
52
|
localValue = _ref5$localValue === void 0 ? null : _ref5$localValue,
|
|
55
53
|
props = _ref5.props,
|
|
56
|
-
context = _ref5.context,
|
|
57
54
|
locale = _ref5.locale,
|
|
58
55
|
maskParams = _ref5.maskParams;
|
|
59
56
|
var value = String(props.value);
|
|
@@ -72,13 +69,11 @@ export var correctNumberValue = function correctNumberValue(_ref5) {
|
|
|
72
69
|
}
|
|
73
70
|
}
|
|
74
71
|
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
if (props.number_format || numberFormatFromContext) {
|
|
78
|
-
var options = _objectSpread(_objectSpread({
|
|
72
|
+
if (props.number_format) {
|
|
73
|
+
var options = _objectSpread({
|
|
79
74
|
locale: locale,
|
|
80
75
|
decimals: 0
|
|
81
|
-
},
|
|
76
|
+
}, props.number_format);
|
|
82
77
|
|
|
83
78
|
if (shouldHaveDecimals) {
|
|
84
79
|
options.decimals = maskParams.decimalLimit;
|
|
@@ -181,34 +176,28 @@ export var handlePercentMask = function handlePercentMask(_ref6) {
|
|
|
181
176
|
return maskParams;
|
|
182
177
|
};
|
|
183
178
|
export var handleCurrencyMask = function handleCurrencyMask(_ref7) {
|
|
184
|
-
var
|
|
185
|
-
|
|
186
|
-
var context = _ref7.context,
|
|
187
|
-
mask_options = _ref7.mask_options,
|
|
179
|
+
var mask_options = _ref7.mask_options,
|
|
188
180
|
currency_mask = _ref7.currency_mask;
|
|
189
181
|
|
|
190
|
-
var maskParams = _objectSpread(_objectSpread(
|
|
182
|
+
var maskParams = _objectSpread(_objectSpread({
|
|
191
183
|
showMask: true,
|
|
192
184
|
placeholderChar: null,
|
|
193
185
|
allowDecimal: true,
|
|
194
186
|
decimalLimit: 2,
|
|
195
187
|
decimalSymbol: ','
|
|
196
|
-
},
|
|
188
|
+
}, mask_options), currency_mask);
|
|
197
189
|
|
|
198
190
|
var fix = typeof currency_mask === 'string' ? currency_mask : typeof maskParams.currency === 'string' ? maskParams.currency : 'kr';
|
|
199
191
|
maskParams.suffix = " ".concat(fix);
|
|
200
192
|
return maskParams;
|
|
201
193
|
};
|
|
202
194
|
export var handleNumberMask = function handleNumberMask(_ref8) {
|
|
203
|
-
var
|
|
204
|
-
|
|
205
|
-
var context = _ref8.context,
|
|
206
|
-
mask_options = _ref8.mask_options,
|
|
195
|
+
var mask_options = _ref8.mask_options,
|
|
207
196
|
number_mask = _ref8.number_mask;
|
|
208
197
|
|
|
209
|
-
var maskParams = _objectSpread(_objectSpread(
|
|
198
|
+
var maskParams = _objectSpread(_objectSpread({
|
|
210
199
|
decimalSymbol: ','
|
|
211
|
-
},
|
|
200
|
+
}, mask_options), number_mask);
|
|
212
201
|
|
|
213
202
|
if (typeof maskParams.allowDecimal === 'undefined') {
|
|
214
203
|
maskParams.allowDecimal = maskParams.decimalLimit > 0;
|
package/esm/components/lib.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { registerElement } from '../shared/component-helper';
|
|
2
2
|
import Accordion from './accordion/Accordion';
|
|
3
3
|
import Autocomplete from './autocomplete/Autocomplete';
|
|
4
|
+
import Avatar from './avatar/Avatar';
|
|
4
5
|
import Breadcrumb from './breadcrumb/Breadcrumb';
|
|
5
6
|
import Button from './button/Button';
|
|
6
7
|
import Checkbox from './checkbox/Checkbox';
|
|
@@ -16,6 +17,7 @@ import Heading from './heading/Heading';
|
|
|
16
17
|
import HelpButton from './help-button/HelpButton';
|
|
17
18
|
import Icon from './icon/Icon';
|
|
18
19
|
import IconPrimary from './icon-primary/IconPrimary';
|
|
20
|
+
import InfoCard from './info-card/InfoCard';
|
|
19
21
|
import Input from './input/Input';
|
|
20
22
|
import InputMasked from './input-masked/InputMasked';
|
|
21
23
|
import Logo from './logo/Logo';
|
|
@@ -31,14 +33,17 @@ import Space from './space/Space';
|
|
|
31
33
|
import StepIndicator from './step-indicator/StepIndicator';
|
|
32
34
|
import Switch from './switch/Switch';
|
|
33
35
|
import Tabs from './tabs/Tabs';
|
|
36
|
+
import Tag from './tag/Tag';
|
|
34
37
|
import Textarea from './textarea/Textarea';
|
|
38
|
+
import Timeline from './timeline/Timeline';
|
|
35
39
|
import ToggleButton from './toggle-button/ToggleButton';
|
|
36
40
|
import Tooltip from './tooltip/Tooltip';
|
|
37
|
-
export { Accordion, Autocomplete, Breadcrumb, Button, Checkbox, DatePicker, Dropdown, FormLabel, FormRow, FormSet, FormStatus, GlobalError, GlobalStatus, Heading, HelpButton, Icon, IconPrimary, Input, InputMasked, Logo, Modal, NumberFormat, Pagination, ProgressIndicator, Radio, Section, Skeleton, Slider, Space, StepIndicator, Switch, Tabs, Textarea, ToggleButton, Tooltip };
|
|
41
|
+
export { Accordion, Autocomplete, Avatar, Breadcrumb, Button, Checkbox, DatePicker, Dropdown, FormLabel, FormRow, FormSet, FormStatus, GlobalError, GlobalStatus, Heading, HelpButton, Icon, IconPrimary, InfoCard, Input, InputMasked, Logo, Modal, NumberFormat, Pagination, ProgressIndicator, Radio, Section, Skeleton, Slider, Space, StepIndicator, Switch, Tabs, Tag, Textarea, Timeline, ToggleButton, Tooltip };
|
|
38
42
|
export var getComponents = function getComponents() {
|
|
39
43
|
return {
|
|
40
44
|
Accordion: Accordion,
|
|
41
45
|
Autocomplete: Autocomplete,
|
|
46
|
+
Avatar: Avatar,
|
|
42
47
|
Breadcrumb: Breadcrumb,
|
|
43
48
|
Button: Button,
|
|
44
49
|
Checkbox: Checkbox,
|
|
@@ -54,6 +59,7 @@ export var getComponents = function getComponents() {
|
|
|
54
59
|
HelpButton: HelpButton,
|
|
55
60
|
Icon: Icon,
|
|
56
61
|
IconPrimary: IconPrimary,
|
|
62
|
+
InfoCard: InfoCard,
|
|
57
63
|
Input: Input,
|
|
58
64
|
InputMasked: InputMasked,
|
|
59
65
|
Logo: Logo,
|
|
@@ -69,7 +75,9 @@ export var getComponents = function getComponents() {
|
|
|
69
75
|
StepIndicator: StepIndicator,
|
|
70
76
|
Switch: Switch,
|
|
71
77
|
Tabs: Tabs,
|
|
78
|
+
Tag: Tag,
|
|
72
79
|
Textarea: Textarea,
|
|
80
|
+
Timeline: Timeline,
|
|
73
81
|
ToggleButton: ToggleButton,
|
|
74
82
|
Tooltip: Tooltip
|
|
75
83
|
};
|