@dnb/eufemia 10.30.2 → 10.32.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 +55 -0
- package/cjs/components/anchor/Anchor.d.ts +8 -1
- package/cjs/components/anchor/Anchor.js.map +1 -1
- package/cjs/components/card/Card.js +3 -2
- package/cjs/components/card/Card.js.map +1 -1
- package/cjs/components/card/style/dnb-card.css +1 -2
- package/cjs/components/card/style/dnb-card.min.css +1 -1
- package/cjs/components/card/style/themes/dnb-card-theme-sbanken.css +5 -0
- package/cjs/components/card/style/themes/dnb-card-theme-sbanken.min.css +1 -0
- package/cjs/components/card/style/themes/dnb-card-theme-sbanken.scss +7 -0
- package/cjs/components/checkbox/CheckIcon.d.ts +1 -1
- package/cjs/components/checkbox/CheckIcon.js +4 -9
- package/cjs/components/checkbox/CheckIcon.js.map +1 -1
- package/cjs/components/checkbox/Checkbox.d.ts +4 -0
- package/cjs/components/checkbox/Checkbox.js +9 -3
- package/cjs/components/checkbox/Checkbox.js.map +1 -1
- package/cjs/components/checkbox/CheckboxDocs.js +10 -5
- package/cjs/components/checkbox/CheckboxDocs.js.map +1 -1
- package/cjs/components/checkbox/style/dnb-checkbox.css +95 -15
- package/cjs/components/checkbox/style/dnb-checkbox.min.css +1 -1
- package/cjs/components/checkbox/style/dnb-checkbox.scss +156 -21
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.css +22 -2
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.min.css +4 -2
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.scss +28 -2
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-ui.css +20 -2
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-ui.min.css +5 -1
- package/cjs/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +25 -2
- package/cjs/components/flex/Container.d.ts +4 -1
- package/cjs/components/flex/Container.js +10 -7
- package/cjs/components/flex/Container.js.map +1 -1
- package/cjs/components/flex/Stack.js +3 -3
- package/cjs/components/flex/Stack.js.map +1 -1
- package/cjs/components/flex/utils.js +7 -7
- package/cjs/components/flex/utils.js.map +1 -1
- package/cjs/components/height-animation/HeightAnimationInstance.js +6 -1
- package/cjs/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/cjs/components/modal/Modal.d.ts +2 -0
- package/cjs/components/modal/Modal.js +10 -3
- package/cjs/components/modal/Modal.js.map +1 -1
- package/cjs/components/skeleton/style/dnb-skeleton.css +4 -8
- package/cjs/components/skeleton/style/dnb-skeleton.min.css +1 -1
- package/cjs/components/space/SpacingUtils.d.ts +1 -1
- package/cjs/components/space/SpacingUtils.js +1 -1
- package/cjs/components/space/SpacingUtils.js.map +1 -1
- package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +70 -0
- package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -0
- package/cjs/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +97 -0
- package/cjs/components/switch/style/themes/dnb-switch-theme-ui.css +1 -2
- package/cjs/components/switch/style/themes/dnb-switch-theme-ui.min.css +1 -1
- package/cjs/components/table/style/dnb-table.css +5 -10
- package/cjs/components/table/style/dnb-table.min.css +1 -1
- package/cjs/components/visually-hidden/style/dnb-visually-hidden.css +1 -2
- package/cjs/components/visually-hidden/style/dnb-visually-hidden.min.css +1 -1
- package/cjs/extensions/forms/DataContext/Context.d.ts +20 -9
- package/cjs/extensions/forms/DataContext/Context.js +2 -3
- package/cjs/extensions/forms/DataContext/Context.js.map +1 -1
- package/cjs/extensions/forms/DataContext/Provider/Provider.d.ts +3 -3
- package/cjs/extensions/forms/DataContext/Provider/Provider.js +69 -32
- package/cjs/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/cjs/extensions/forms/DataContext/Provider/ProviderDocs.js +3 -3
- package/cjs/extensions/forms/DataContext/Provider/ProviderDocs.js.map +1 -1
- package/cjs/extensions/forms/Field/Boolean/Boolean.d.ts +12 -2
- package/cjs/extensions/forms/Field/Boolean/Boolean.js +2 -1
- package/cjs/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
- package/cjs/extensions/forms/Field/Boolean/BooleanDocs.d.ts +2 -0
- package/cjs/extensions/forms/Field/Boolean/BooleanDocs.js +25 -0
- package/cjs/extensions/forms/Field/Boolean/BooleanDocs.js.map +1 -0
- package/cjs/extensions/forms/Field/FieldDocs.js +1 -1
- package/cjs/extensions/forms/Field/FieldDocs.js.map +1 -1
- package/cjs/extensions/forms/Field/Indeterminate/Indeterminate.d.ts +16 -0
- package/cjs/extensions/forms/Field/Indeterminate/Indeterminate.js +53 -0
- package/cjs/extensions/forms/Field/Indeterminate/Indeterminate.js.map +1 -0
- package/cjs/extensions/forms/Field/Indeterminate/IndeterminateDocs.d.ts +2 -0
- package/cjs/extensions/forms/Field/Indeterminate/IndeterminateDocs.js +38 -0
- package/cjs/extensions/forms/Field/Indeterminate/IndeterminateDocs.js.map +1 -0
- package/cjs/extensions/forms/Field/Indeterminate/index.d.ts +2 -0
- package/cjs/extensions/forms/Field/Indeterminate/index.js +27 -0
- package/cjs/extensions/forms/Field/Indeterminate/index.js.map +1 -0
- package/cjs/extensions/forms/Field/Indeterminate/useDependencePaths.d.ts +6 -0
- package/cjs/extensions/forms/Field/Indeterminate/useDependencePaths.js +81 -0
- package/cjs/extensions/forms/Field/Indeterminate/useDependencePaths.js.map +1 -0
- package/cjs/extensions/forms/Field/Name/NameDocs.js +1 -7
- package/cjs/extensions/forms/Field/Name/NameDocs.js.map +1 -1
- package/cjs/extensions/forms/Field/Number/Number.js +3 -1
- package/cjs/extensions/forms/Field/Number/Number.js.map +1 -1
- package/cjs/extensions/forms/Field/PhoneNumber/PhoneNumber.js +1 -1
- package/cjs/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
- package/cjs/extensions/forms/Field/String/String.js.map +1 -1
- package/cjs/extensions/forms/Field/Toggle/Toggle.d.ts +2 -1
- package/cjs/extensions/forms/Field/Toggle/Toggle.js +2 -2
- package/cjs/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
- package/cjs/extensions/forms/Field/Toggle/ToggleDocs.d.ts +2 -0
- package/cjs/extensions/forms/Field/Toggle/ToggleDocs.js +35 -0
- package/cjs/extensions/forms/Field/Toggle/ToggleDocs.js.map +1 -0
- package/cjs/extensions/forms/Field/index.d.ts +1 -0
- package/cjs/extensions/forms/Field/index.js +7 -0
- package/cjs/extensions/forms/Field/index.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/FieldBlock.js +5 -0
- package/cjs/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/FieldBlockDocs.d.ts +1 -0
- package/cjs/extensions/forms/FieldBlock/FieldBlockDocs.js +24 -16
- package/cjs/extensions/forms/FieldBlock/FieldBlockDocs.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.css +1 -3
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.scss +1 -2
- package/cjs/extensions/forms/Form/Element/Element.js +1 -1
- package/cjs/extensions/forms/Form/Element/Element.js.map +1 -1
- package/cjs/extensions/forms/Form/Handler/Handler.js +2 -2
- package/cjs/extensions/forms/Form/Handler/Handler.js.map +1 -1
- package/cjs/extensions/forms/Form/Handler/HandlerDocs.js +5 -0
- package/cjs/extensions/forms/Form/Handler/HandlerDocs.js.map +1 -1
- package/cjs/extensions/forms/Form/SubmitButton/SubmitButton.js +3 -3
- package/cjs/extensions/forms/Form/SubmitButton/SubmitButton.js.map +1 -1
- package/cjs/extensions/forms/Form/Tools/GenerateSchema.d.ts +8 -0
- package/cjs/extensions/forms/Form/Tools/GenerateSchema.js +100 -0
- package/cjs/extensions/forms/Form/Tools/GenerateSchema.js.map +1 -0
- package/cjs/extensions/forms/Form/Tools/index.d.ts +1 -0
- package/cjs/extensions/forms/Form/Tools/index.js +14 -0
- package/cjs/extensions/forms/Form/Tools/index.js.map +1 -0
- package/cjs/extensions/forms/Form/Visibility/Visibility.d.ts +19 -5
- package/cjs/extensions/forms/Form/Visibility/Visibility.js +41 -10
- package/cjs/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
- package/cjs/extensions/forms/Form/Visibility/VisibilityDocs.js +11 -6
- package/cjs/extensions/forms/Form/Visibility/VisibilityDocs.js.map +1 -1
- package/cjs/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/cjs/extensions/forms/Form/data-context/useData.js +2 -2
- package/cjs/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/cjs/extensions/forms/Form/data-context/useError.d.ts +1 -0
- package/cjs/extensions/forms/Form/data-context/useError.js +5 -3
- package/cjs/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/cjs/extensions/forms/Form/index.d.ts +1 -0
- package/cjs/extensions/forms/Form/index.js +5 -0
- package/cjs/extensions/forms/Form/index.js.map +1 -1
- package/cjs/extensions/forms/Iterate/AnimatedContainer/ElementBlock.d.ts +8 -1
- package/cjs/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js +4 -3
- package/cjs/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js.map +1 -1
- package/cjs/extensions/forms/Iterate/EditContainer/EditContainer.d.ts +2 -1
- package/cjs/extensions/forms/Iterate/EditContainer/EditContainer.js.map +1 -1
- package/cjs/extensions/forms/Iterate/EditContainer/EditContainerDocs.js +5 -0
- package/cjs/extensions/forms/Iterate/EditContainer/EditContainerDocs.js.map +1 -1
- package/cjs/extensions/forms/Iterate/EditContainer/EditToolbarTools.js +1 -1
- package/cjs/extensions/forms/Iterate/EditContainer/EditToolbarTools.js.map +1 -1
- package/cjs/extensions/forms/Iterate/Toolbar/Toolbar.js +1 -1
- package/cjs/extensions/forms/Iterate/Toolbar/Toolbar.js.map +1 -1
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewContainer.d.ts +2 -1
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewContainer.js.map +1 -1
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js +5 -0
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js.map +1 -1
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js +1 -1
- package/cjs/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js.map +1 -1
- package/cjs/extensions/forms/Iterate/style/dnb-form-iterate.css +3 -1
- package/cjs/extensions/forms/Iterate/style/dnb-form-iterate.min.css +1 -1
- package/cjs/extensions/forms/Iterate/style/dnb-form-iterate.scss +4 -1
- package/cjs/extensions/forms/ValueBlock/ValueBlock.js +4 -2
- package/cjs/extensions/forms/ValueBlock/ValueBlock.js.map +1 -1
- package/cjs/extensions/forms/Wizard/Container/WizardContainer.d.ts +31 -2
- package/cjs/extensions/forms/Wizard/Container/WizardContainer.js +105 -31
- package/cjs/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
- package/cjs/extensions/forms/Wizard/Context/WizardContext.d.ts +4 -0
- package/cjs/extensions/forms/Wizard/Context/WizardContext.js.map +1 -1
- package/cjs/extensions/forms/Wizard/Step/Step.d.ts +10 -1
- package/cjs/extensions/forms/Wizard/Step/Step.js +15 -6
- package/cjs/extensions/forms/Wizard/Step/Step.js.map +1 -1
- package/cjs/extensions/forms/Wizard/Step/StepDocs.js +5 -0
- package/cjs/extensions/forms/Wizard/Step/StepDocs.js.map +1 -1
- package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.css +0 -1
- package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
- package/cjs/extensions/forms/Wizard/style/dnb-wizard-layout.scss +0 -1
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.css +1 -0
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.min.css +0 -0
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.scss +1 -0
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.css +3 -0
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.min.css +1 -0
- package/cjs/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.scss +7 -0
- package/cjs/extensions/forms/hooks/useFieldProps.js +71 -32
- package/cjs/extensions/forms/hooks/useFieldProps.js.map +1 -1
- package/cjs/extensions/forms/style/dnb-forms.css +4 -5
- package/cjs/extensions/forms/style/dnb-forms.min.css +1 -1
- package/cjs/extensions/forms/types.d.ts +9 -0
- package/cjs/extensions/forms/types.js.map +1 -1
- package/cjs/fragments/drawer-list/DrawerListHelpers.js +5 -2
- package/cjs/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
- package/cjs/shared/Eufemia.d.ts +1 -1
- package/cjs/shared/Eufemia.js +2 -2
- package/cjs/shared/Eufemia.js.map +1 -1
- package/cjs/shared/MediaQuery.js +19 -1
- package/cjs/shared/MediaQuery.js.map +1 -1
- package/cjs/shared/MediaQueryUtils.d.ts +12 -34
- package/cjs/shared/MediaQueryUtils.js +22 -12
- package/cjs/shared/MediaQueryUtils.js.map +1 -1
- package/cjs/shared/component-helper.d.ts +1 -1
- package/cjs/shared/component-helper.js +5 -1
- package/cjs/shared/component-helper.js.map +1 -1
- package/cjs/shared/useMedia.d.ts +7 -2
- package/cjs/shared/useMedia.js +16 -11
- package/cjs/shared/useMedia.js.map +1 -1
- package/cjs/shared/useMediaQuery.js +30 -9
- package/cjs/shared/useMediaQuery.js.map +1 -1
- package/cjs/style/core/scopes.scss +1 -1
- package/cjs/style/dnb-ui-basis.css +2 -3
- package/cjs/style/dnb-ui-basis.min.css +1 -1
- package/cjs/style/dnb-ui-body.css +1 -1
- package/cjs/style/dnb-ui-body.min.css +1 -1
- package/cjs/style/dnb-ui-components.css +110 -42
- package/cjs/style/dnb-ui-components.min.css +3 -3
- package/cjs/style/dnb-ui-core.css +2 -3
- package/cjs/style/dnb-ui-core.min.css +1 -1
- package/cjs/style/dnb-ui-extensions.css +4 -5
- package/cjs/style/dnb-ui-extensions.min.css +1 -1
- package/cjs/style/dnb-ui-forms.css +4 -5
- package/cjs/style/dnb-ui-forms.min.css +1 -1
- package/cjs/style/themes/theme-eiendom/eiendom-theme-components.css +139 -51
- package/cjs/style/themes/theme-eiendom/eiendom-theme-components.min.css +10 -6
- package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -5
- package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
- package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
- package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -5
- package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
- package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
- package/cjs/style/themes/theme-sbanken/sbanken-theme-components.css +214 -127
- package/cjs/style/themes/theme-sbanken/sbanken-theme-components.min.css +9 -7
- package/cjs/style/themes/theme-sbanken/sbanken-theme-components.scss +2 -2
- package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.css +5 -5
- package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
- package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.css +5 -5
- package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
- package/cjs/style/themes/theme-ui/ui-theme-components.css +139 -51
- package/cjs/style/themes/theme-ui/ui-theme-components.min.css +10 -6
- package/cjs/style/themes/theme-ui/ui-theme-extensions.css +8 -5
- package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
- package/cjs/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
- package/cjs/style/themes/theme-ui/ui-theme-forms.css +8 -5
- package/cjs/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
- package/cjs/style/themes/theme-ui/ui-theme-forms.scss +1 -0
- package/components/anchor/Anchor.d.ts +8 -1
- package/components/anchor/Anchor.js.map +1 -1
- package/components/card/Card.js +3 -2
- package/components/card/Card.js.map +1 -1
- package/components/card/style/dnb-card.css +1 -2
- package/components/card/style/dnb-card.min.css +1 -1
- package/components/card/style/themes/dnb-card-theme-sbanken.css +5 -0
- package/components/card/style/themes/dnb-card-theme-sbanken.min.css +1 -0
- package/components/card/style/themes/dnb-card-theme-sbanken.scss +7 -0
- package/components/checkbox/CheckIcon.d.ts +1 -1
- package/components/checkbox/CheckIcon.js +4 -8
- package/components/checkbox/CheckIcon.js.map +1 -1
- package/components/checkbox/Checkbox.d.ts +4 -0
- package/components/checkbox/Checkbox.js +9 -3
- package/components/checkbox/Checkbox.js.map +1 -1
- package/components/checkbox/CheckboxDocs.js +10 -5
- package/components/checkbox/CheckboxDocs.js.map +1 -1
- package/components/checkbox/style/dnb-checkbox.css +95 -15
- package/components/checkbox/style/dnb-checkbox.min.css +1 -1
- package/components/checkbox/style/dnb-checkbox.scss +156 -21
- package/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.css +22 -2
- package/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.min.css +4 -2
- package/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.scss +28 -2
- package/components/checkbox/style/themes/dnb-checkbox-theme-ui.css +20 -2
- package/components/checkbox/style/themes/dnb-checkbox-theme-ui.min.css +5 -1
- package/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +25 -2
- package/components/flex/Container.d.ts +4 -1
- package/components/flex/Container.js +10 -7
- package/components/flex/Container.js.map +1 -1
- package/components/flex/Stack.js +3 -3
- package/components/flex/Stack.js.map +1 -1
- package/components/flex/utils.js +8 -8
- package/components/flex/utils.js.map +1 -1
- package/components/height-animation/HeightAnimationInstance.js +6 -1
- package/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/components/modal/Modal.d.ts +2 -0
- package/components/modal/Modal.js +10 -3
- package/components/modal/Modal.js.map +1 -1
- package/components/skeleton/style/dnb-skeleton.css +4 -8
- package/components/skeleton/style/dnb-skeleton.min.css +1 -1
- package/components/space/SpacingUtils.d.ts +1 -1
- package/components/space/SpacingUtils.js +1 -1
- package/components/space/SpacingUtils.js.map +1 -1
- package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +70 -0
- package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -0
- package/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +97 -0
- package/components/switch/style/themes/dnb-switch-theme-ui.css +1 -2
- package/components/switch/style/themes/dnb-switch-theme-ui.min.css +1 -1
- package/components/table/style/dnb-table.css +5 -10
- package/components/table/style/dnb-table.min.css +1 -1
- package/components/visually-hidden/style/dnb-visually-hidden.css +1 -2
- package/components/visually-hidden/style/dnb-visually-hidden.min.css +1 -1
- package/es/components/anchor/Anchor.d.ts +8 -1
- package/es/components/anchor/Anchor.js.map +1 -1
- package/es/components/card/Card.js +3 -2
- package/es/components/card/Card.js.map +1 -1
- package/es/components/card/style/dnb-card.css +1 -2
- package/es/components/card/style/dnb-card.min.css +1 -1
- package/es/components/card/style/themes/dnb-card-theme-sbanken.css +5 -0
- package/es/components/card/style/themes/dnb-card-theme-sbanken.min.css +1 -0
- package/es/components/card/style/themes/dnb-card-theme-sbanken.scss +7 -0
- package/es/components/checkbox/CheckIcon.d.ts +1 -1
- package/es/components/checkbox/CheckIcon.js +5 -10
- package/es/components/checkbox/CheckIcon.js.map +1 -1
- package/es/components/checkbox/Checkbox.d.ts +4 -0
- package/es/components/checkbox/Checkbox.js +9 -3
- package/es/components/checkbox/Checkbox.js.map +1 -1
- package/es/components/checkbox/CheckboxDocs.js +10 -5
- package/es/components/checkbox/CheckboxDocs.js.map +1 -1
- package/es/components/checkbox/style/dnb-checkbox.css +95 -15
- package/es/components/checkbox/style/dnb-checkbox.min.css +1 -1
- package/es/components/checkbox/style/dnb-checkbox.scss +156 -21
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.css +22 -2
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.min.css +4 -2
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-sbanken.scss +28 -2
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-ui.css +20 -2
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-ui.min.css +5 -1
- package/es/components/checkbox/style/themes/dnb-checkbox-theme-ui.scss +25 -2
- package/es/components/flex/Container.d.ts +4 -1
- package/es/components/flex/Container.js +10 -7
- package/es/components/flex/Container.js.map +1 -1
- package/es/components/flex/Stack.js +3 -3
- package/es/components/flex/Stack.js.map +1 -1
- package/es/components/flex/utils.js +8 -8
- package/es/components/flex/utils.js.map +1 -1
- package/es/components/height-animation/HeightAnimationInstance.js +6 -1
- package/es/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/es/components/modal/Modal.d.ts +2 -0
- package/es/components/modal/Modal.js +10 -3
- package/es/components/modal/Modal.js.map +1 -1
- package/es/components/skeleton/style/dnb-skeleton.css +4 -8
- package/es/components/skeleton/style/dnb-skeleton.min.css +1 -1
- package/es/components/space/SpacingUtils.d.ts +1 -1
- package/es/components/space/SpacingUtils.js +1 -1
- package/es/components/space/SpacingUtils.js.map +1 -1
- package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.css +70 -0
- package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.min.css +1 -0
- package/es/components/step-indicator/style/themes/dnb-step-indicator-theme-sbanken.scss +97 -0
- package/es/components/switch/style/themes/dnb-switch-theme-ui.css +1 -2
- package/es/components/switch/style/themes/dnb-switch-theme-ui.min.css +1 -1
- package/es/components/table/style/dnb-table.css +5 -10
- package/es/components/table/style/dnb-table.min.css +1 -1
- package/es/components/visually-hidden/style/dnb-visually-hidden.css +1 -2
- package/es/components/visually-hidden/style/dnb-visually-hidden.min.css +1 -1
- package/es/extensions/forms/DataContext/Context.d.ts +20 -9
- package/es/extensions/forms/DataContext/Context.js +2 -3
- package/es/extensions/forms/DataContext/Context.js.map +1 -1
- package/es/extensions/forms/DataContext/Provider/Provider.d.ts +3 -3
- package/es/extensions/forms/DataContext/Provider/Provider.js +66 -30
- package/es/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/es/extensions/forms/DataContext/Provider/ProviderDocs.js +3 -3
- package/es/extensions/forms/DataContext/Provider/ProviderDocs.js.map +1 -1
- package/es/extensions/forms/Field/Boolean/Boolean.d.ts +12 -2
- package/es/extensions/forms/Field/Boolean/Boolean.js +2 -1
- package/es/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
- package/es/extensions/forms/Field/Boolean/BooleanDocs.d.ts +2 -0
- package/es/extensions/forms/Field/Boolean/BooleanDocs.js +18 -0
- package/es/extensions/forms/Field/Boolean/BooleanDocs.js.map +1 -0
- package/es/extensions/forms/Field/FieldDocs.js +2 -2
- package/es/extensions/forms/Field/FieldDocs.js.map +1 -1
- package/es/extensions/forms/Field/Indeterminate/Indeterminate.d.ts +16 -0
- package/es/extensions/forms/Field/Indeterminate/Indeterminate.js +43 -0
- package/es/extensions/forms/Field/Indeterminate/Indeterminate.js.map +1 -0
- package/es/extensions/forms/Field/Indeterminate/IndeterminateDocs.d.ts +2 -0
- package/es/extensions/forms/Field/Indeterminate/IndeterminateDocs.js +29 -0
- package/es/extensions/forms/Field/Indeterminate/IndeterminateDocs.js.map +1 -0
- package/es/extensions/forms/Field/Indeterminate/index.d.ts +2 -0
- package/es/extensions/forms/Field/Indeterminate/index.js +3 -0
- package/es/extensions/forms/Field/Indeterminate/index.js.map +1 -0
- package/es/extensions/forms/Field/Indeterminate/useDependencePaths.d.ts +6 -0
- package/es/extensions/forms/Field/Indeterminate/useDependencePaths.js +74 -0
- package/es/extensions/forms/Field/Indeterminate/useDependencePaths.js.map +1 -0
- package/es/extensions/forms/Field/Name/NameDocs.js +1 -8
- package/es/extensions/forms/Field/Name/NameDocs.js.map +1 -1
- package/es/extensions/forms/Field/Number/Number.js +3 -1
- package/es/extensions/forms/Field/Number/Number.js.map +1 -1
- package/es/extensions/forms/Field/PhoneNumber/PhoneNumber.js +1 -1
- package/es/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
- package/es/extensions/forms/Field/String/String.js.map +1 -1
- package/es/extensions/forms/Field/Toggle/Toggle.d.ts +2 -1
- package/es/extensions/forms/Field/Toggle/Toggle.js +2 -2
- package/es/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
- package/es/extensions/forms/Field/Toggle/ToggleDocs.d.ts +2 -0
- package/es/extensions/forms/Field/Toggle/ToggleDocs.js +28 -0
- package/es/extensions/forms/Field/Toggle/ToggleDocs.js.map +1 -0
- package/es/extensions/forms/Field/index.d.ts +1 -0
- package/es/extensions/forms/Field/index.js +1 -0
- package/es/extensions/forms/Field/index.js.map +1 -1
- package/es/extensions/forms/FieldBlock/FieldBlock.js +5 -0
- package/es/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/es/extensions/forms/FieldBlock/FieldBlockDocs.d.ts +1 -0
- package/es/extensions/forms/FieldBlock/FieldBlockDocs.js +20 -15
- package/es/extensions/forms/FieldBlock/FieldBlockDocs.js.map +1 -1
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.css +1 -3
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.scss +1 -2
- package/es/extensions/forms/Form/Element/Element.js +1 -1
- package/es/extensions/forms/Form/Element/Element.js.map +1 -1
- package/es/extensions/forms/Form/Handler/Handler.js +2 -2
- package/es/extensions/forms/Form/Handler/Handler.js.map +1 -1
- package/es/extensions/forms/Form/Handler/HandlerDocs.js +5 -0
- package/es/extensions/forms/Form/Handler/HandlerDocs.js.map +1 -1
- package/es/extensions/forms/Form/SubmitButton/SubmitButton.js +3 -3
- package/es/extensions/forms/Form/SubmitButton/SubmitButton.js.map +1 -1
- package/es/extensions/forms/Form/Tools/GenerateSchema.d.ts +8 -0
- package/es/extensions/forms/Form/Tools/GenerateSchema.js +89 -0
- package/es/extensions/forms/Form/Tools/GenerateSchema.js.map +1 -0
- package/es/extensions/forms/Form/Tools/index.d.ts +1 -0
- package/es/extensions/forms/Form/Tools/index.js +1 -0
- package/es/extensions/forms/Form/Tools/index.js.map +1 -0
- package/es/extensions/forms/Form/Visibility/Visibility.d.ts +19 -5
- package/es/extensions/forms/Form/Visibility/Visibility.js +41 -10
- package/es/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
- package/es/extensions/forms/Form/Visibility/VisibilityDocs.js +11 -6
- package/es/extensions/forms/Form/Visibility/VisibilityDocs.js.map +1 -1
- package/es/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/es/extensions/forms/Form/data-context/useData.js +1 -2
- package/es/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/es/extensions/forms/Form/data-context/useError.d.ts +1 -0
- package/es/extensions/forms/Form/data-context/useError.js +5 -3
- package/es/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/es/extensions/forms/Form/index.d.ts +1 -0
- package/es/extensions/forms/Form/index.js +1 -0
- package/es/extensions/forms/Form/index.js.map +1 -1
- package/es/extensions/forms/Iterate/AnimatedContainer/ElementBlock.d.ts +8 -1
- package/es/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js +4 -3
- package/es/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js.map +1 -1
- package/es/extensions/forms/Iterate/EditContainer/EditContainer.d.ts +2 -1
- package/es/extensions/forms/Iterate/EditContainer/EditContainer.js.map +1 -1
- package/es/extensions/forms/Iterate/EditContainer/EditContainerDocs.js +5 -0
- package/es/extensions/forms/Iterate/EditContainer/EditContainerDocs.js.map +1 -1
- package/es/extensions/forms/Iterate/EditContainer/EditToolbarTools.js +1 -1
- package/es/extensions/forms/Iterate/EditContainer/EditToolbarTools.js.map +1 -1
- package/es/extensions/forms/Iterate/Toolbar/Toolbar.js +1 -1
- package/es/extensions/forms/Iterate/Toolbar/Toolbar.js.map +1 -1
- package/es/extensions/forms/Iterate/ViewContainer/ViewContainer.d.ts +2 -1
- package/es/extensions/forms/Iterate/ViewContainer/ViewContainer.js.map +1 -1
- package/es/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js +5 -0
- package/es/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js.map +1 -1
- package/es/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js +1 -1
- package/es/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js.map +1 -1
- package/es/extensions/forms/Iterate/style/dnb-form-iterate.css +3 -1
- package/es/extensions/forms/Iterate/style/dnb-form-iterate.min.css +1 -1
- package/es/extensions/forms/Iterate/style/dnb-form-iterate.scss +4 -1
- package/es/extensions/forms/ValueBlock/ValueBlock.js +4 -2
- package/es/extensions/forms/ValueBlock/ValueBlock.js.map +1 -1
- package/es/extensions/forms/Wizard/Container/WizardContainer.d.ts +31 -2
- package/es/extensions/forms/Wizard/Container/WizardContainer.js +101 -31
- package/es/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
- package/es/extensions/forms/Wizard/Context/WizardContext.d.ts +4 -0
- package/es/extensions/forms/Wizard/Context/WizardContext.js.map +1 -1
- package/es/extensions/forms/Wizard/Step/Step.d.ts +10 -1
- package/es/extensions/forms/Wizard/Step/Step.js +15 -6
- package/es/extensions/forms/Wizard/Step/Step.js.map +1 -1
- package/es/extensions/forms/Wizard/Step/StepDocs.js +5 -0
- package/es/extensions/forms/Wizard/Step/StepDocs.js.map +1 -1
- package/es/extensions/forms/Wizard/style/dnb-wizard-layout.css +0 -1
- package/es/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
- package/es/extensions/forms/Wizard/style/dnb-wizard-layout.scss +0 -1
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.css +1 -0
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.min.css +0 -0
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.scss +1 -0
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.css +3 -0
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.min.css +1 -0
- package/es/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.scss +7 -0
- package/es/extensions/forms/hooks/useFieldProps.js +68 -29
- package/es/extensions/forms/hooks/useFieldProps.js.map +1 -1
- package/es/extensions/forms/style/dnb-forms.css +4 -5
- package/es/extensions/forms/style/dnb-forms.min.css +1 -1
- package/es/extensions/forms/types.d.ts +9 -0
- package/es/extensions/forms/types.js.map +1 -1
- package/es/fragments/drawer-list/DrawerListHelpers.js +5 -2
- package/es/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
- package/es/shared/Eufemia.d.ts +1 -1
- package/es/shared/Eufemia.js +2 -2
- package/es/shared/Eufemia.js.map +1 -1
- package/es/shared/MediaQuery.js +19 -1
- package/es/shared/MediaQuery.js.map +1 -1
- package/es/shared/MediaQueryUtils.d.ts +12 -34
- package/es/shared/MediaQueryUtils.js +22 -17
- package/es/shared/MediaQueryUtils.js.map +1 -1
- package/es/shared/component-helper.d.ts +1 -1
- package/es/shared/component-helper.js +5 -2
- package/es/shared/component-helper.js.map +1 -1
- package/es/shared/useMedia.d.ts +7 -2
- package/es/shared/useMedia.js +14 -11
- package/es/shared/useMedia.js.map +1 -1
- package/es/shared/useMediaQuery.js +28 -9
- package/es/shared/useMediaQuery.js.map +1 -1
- package/es/style/core/scopes.scss +1 -1
- package/es/style/dnb-ui-basis.css +2 -3
- package/es/style/dnb-ui-basis.min.css +1 -1
- package/es/style/dnb-ui-body.css +1 -1
- package/es/style/dnb-ui-body.min.css +1 -1
- package/es/style/dnb-ui-components.css +110 -42
- package/es/style/dnb-ui-components.min.css +3 -3
- package/es/style/dnb-ui-core.css +2 -3
- package/es/style/dnb-ui-core.min.css +1 -1
- package/es/style/dnb-ui-extensions.css +4 -5
- package/es/style/dnb-ui-extensions.min.css +1 -1
- package/es/style/dnb-ui-forms.css +4 -5
- package/es/style/dnb-ui-forms.min.css +1 -1
- package/es/style/themes/theme-eiendom/eiendom-theme-components.css +139 -51
- package/es/style/themes/theme-eiendom/eiendom-theme-components.min.css +10 -6
- package/es/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -5
- package/es/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
- package/es/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
- package/es/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -5
- package/es/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
- package/es/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
- package/es/style/themes/theme-sbanken/sbanken-theme-components.css +214 -127
- package/es/style/themes/theme-sbanken/sbanken-theme-components.min.css +9 -7
- package/es/style/themes/theme-sbanken/sbanken-theme-components.scss +2 -2
- package/es/style/themes/theme-sbanken/sbanken-theme-extensions.css +5 -5
- package/es/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
- package/es/style/themes/theme-sbanken/sbanken-theme-forms.css +5 -5
- package/es/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
- package/es/style/themes/theme-ui/ui-theme-components.css +139 -51
- package/es/style/themes/theme-ui/ui-theme-components.min.css +10 -6
- package/es/style/themes/theme-ui/ui-theme-extensions.css +8 -5
- package/es/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
- package/es/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
- package/es/style/themes/theme-ui/ui-theme-forms.css +8 -5
- package/es/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
- package/es/style/themes/theme-ui/ui-theme-forms.scss +1 -0
- package/esm/dnb-ui-basis.min.mjs +1 -1
- package/esm/dnb-ui-components.min.mjs +1 -1
- 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 +1 -1
- package/extensions/forms/DataContext/Context.d.ts +20 -9
- package/extensions/forms/DataContext/Context.js +2 -3
- package/extensions/forms/DataContext/Context.js.map +1 -1
- package/extensions/forms/DataContext/Provider/Provider.d.ts +3 -3
- package/extensions/forms/DataContext/Provider/Provider.js +69 -32
- package/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/extensions/forms/DataContext/Provider/ProviderDocs.js +3 -3
- package/extensions/forms/DataContext/Provider/ProviderDocs.js.map +1 -1
- package/extensions/forms/Field/Boolean/Boolean.d.ts +12 -2
- package/extensions/forms/Field/Boolean/Boolean.js +2 -1
- package/extensions/forms/Field/Boolean/Boolean.js.map +1 -1
- package/extensions/forms/Field/Boolean/BooleanDocs.d.ts +2 -0
- package/extensions/forms/Field/Boolean/BooleanDocs.js +18 -0
- package/extensions/forms/Field/Boolean/BooleanDocs.js.map +1 -0
- package/extensions/forms/Field/FieldDocs.js +2 -2
- package/extensions/forms/Field/FieldDocs.js.map +1 -1
- package/extensions/forms/Field/Indeterminate/Indeterminate.d.ts +16 -0
- package/extensions/forms/Field/Indeterminate/Indeterminate.js +43 -0
- package/extensions/forms/Field/Indeterminate/Indeterminate.js.map +1 -0
- package/extensions/forms/Field/Indeterminate/IndeterminateDocs.d.ts +2 -0
- package/extensions/forms/Field/Indeterminate/IndeterminateDocs.js +29 -0
- package/extensions/forms/Field/Indeterminate/IndeterminateDocs.js.map +1 -0
- package/extensions/forms/Field/Indeterminate/index.d.ts +2 -0
- package/extensions/forms/Field/Indeterminate/index.js +3 -0
- package/extensions/forms/Field/Indeterminate/index.js.map +1 -0
- package/extensions/forms/Field/Indeterminate/useDependencePaths.d.ts +6 -0
- package/extensions/forms/Field/Indeterminate/useDependencePaths.js +75 -0
- package/extensions/forms/Field/Indeterminate/useDependencePaths.js.map +1 -0
- package/extensions/forms/Field/Name/NameDocs.js +1 -8
- package/extensions/forms/Field/Name/NameDocs.js.map +1 -1
- package/extensions/forms/Field/Number/Number.js +3 -1
- package/extensions/forms/Field/Number/Number.js.map +1 -1
- package/extensions/forms/Field/PhoneNumber/PhoneNumber.js +1 -1
- package/extensions/forms/Field/PhoneNumber/PhoneNumber.js.map +1 -1
- package/extensions/forms/Field/String/String.js.map +1 -1
- package/extensions/forms/Field/Toggle/Toggle.d.ts +2 -1
- package/extensions/forms/Field/Toggle/Toggle.js +2 -2
- package/extensions/forms/Field/Toggle/Toggle.js.map +1 -1
- package/extensions/forms/Field/Toggle/ToggleDocs.d.ts +2 -0
- package/extensions/forms/Field/Toggle/ToggleDocs.js +28 -0
- package/extensions/forms/Field/Toggle/ToggleDocs.js.map +1 -0
- package/extensions/forms/Field/index.d.ts +1 -0
- package/extensions/forms/Field/index.js +1 -0
- package/extensions/forms/Field/index.js.map +1 -1
- package/extensions/forms/FieldBlock/FieldBlock.js +5 -0
- package/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/extensions/forms/FieldBlock/FieldBlockDocs.d.ts +1 -0
- package/extensions/forms/FieldBlock/FieldBlockDocs.js +20 -15
- package/extensions/forms/FieldBlock/FieldBlockDocs.js.map +1 -1
- package/extensions/forms/FieldBlock/style/dnb-field-block.css +1 -3
- package/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/extensions/forms/FieldBlock/style/dnb-field-block.scss +1 -2
- package/extensions/forms/Form/Element/Element.js +1 -1
- package/extensions/forms/Form/Element/Element.js.map +1 -1
- package/extensions/forms/Form/Handler/Handler.js +2 -2
- package/extensions/forms/Form/Handler/Handler.js.map +1 -1
- package/extensions/forms/Form/Handler/HandlerDocs.js +5 -0
- package/extensions/forms/Form/Handler/HandlerDocs.js.map +1 -1
- package/extensions/forms/Form/SubmitButton/SubmitButton.js +3 -3
- package/extensions/forms/Form/SubmitButton/SubmitButton.js.map +1 -1
- package/extensions/forms/Form/Tools/GenerateSchema.d.ts +8 -0
- package/extensions/forms/Form/Tools/GenerateSchema.js +90 -0
- package/extensions/forms/Form/Tools/GenerateSchema.js.map +1 -0
- package/extensions/forms/Form/Tools/index.d.ts +1 -0
- package/extensions/forms/Form/Tools/index.js +1 -0
- package/extensions/forms/Form/Tools/index.js.map +1 -0
- package/extensions/forms/Form/Visibility/Visibility.d.ts +19 -5
- package/extensions/forms/Form/Visibility/Visibility.js +41 -10
- package/extensions/forms/Form/Visibility/Visibility.js.map +1 -1
- package/extensions/forms/Form/Visibility/VisibilityDocs.js +11 -6
- package/extensions/forms/Form/Visibility/VisibilityDocs.js.map +1 -1
- package/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/extensions/forms/Form/data-context/useData.js +2 -2
- package/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/extensions/forms/Form/data-context/useError.d.ts +1 -0
- package/extensions/forms/Form/data-context/useError.js +5 -3
- package/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/extensions/forms/Form/index.d.ts +1 -0
- package/extensions/forms/Form/index.js +2 -0
- package/extensions/forms/Form/index.js.map +1 -1
- package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.d.ts +8 -1
- package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js +4 -3
- package/extensions/forms/Iterate/AnimatedContainer/ElementBlock.js.map +1 -1
- package/extensions/forms/Iterate/EditContainer/EditContainer.d.ts +2 -1
- package/extensions/forms/Iterate/EditContainer/EditContainer.js.map +1 -1
- package/extensions/forms/Iterate/EditContainer/EditContainerDocs.js +5 -0
- package/extensions/forms/Iterate/EditContainer/EditContainerDocs.js.map +1 -1
- package/extensions/forms/Iterate/EditContainer/EditToolbarTools.js +1 -1
- package/extensions/forms/Iterate/EditContainer/EditToolbarTools.js.map +1 -1
- package/extensions/forms/Iterate/Toolbar/Toolbar.js +1 -1
- package/extensions/forms/Iterate/Toolbar/Toolbar.js.map +1 -1
- package/extensions/forms/Iterate/ViewContainer/ViewContainer.d.ts +2 -1
- package/extensions/forms/Iterate/ViewContainer/ViewContainer.js.map +1 -1
- package/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js +5 -0
- package/extensions/forms/Iterate/ViewContainer/ViewContainerDocs.js.map +1 -1
- package/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js +1 -1
- package/extensions/forms/Iterate/ViewContainer/ViewToolbarTools.js.map +1 -1
- package/extensions/forms/Iterate/style/dnb-form-iterate.css +3 -1
- package/extensions/forms/Iterate/style/dnb-form-iterate.min.css +1 -1
- package/extensions/forms/Iterate/style/dnb-form-iterate.scss +4 -1
- package/extensions/forms/ValueBlock/ValueBlock.js +4 -2
- package/extensions/forms/ValueBlock/ValueBlock.js.map +1 -1
- package/extensions/forms/Wizard/Container/WizardContainer.d.ts +31 -2
- package/extensions/forms/Wizard/Container/WizardContainer.js +105 -31
- package/extensions/forms/Wizard/Container/WizardContainer.js.map +1 -1
- package/extensions/forms/Wizard/Context/WizardContext.d.ts +4 -0
- package/extensions/forms/Wizard/Context/WizardContext.js.map +1 -1
- package/extensions/forms/Wizard/Step/Step.d.ts +10 -1
- package/extensions/forms/Wizard/Step/Step.js +15 -6
- package/extensions/forms/Wizard/Step/Step.js.map +1 -1
- package/extensions/forms/Wizard/Step/StepDocs.js +5 -0
- package/extensions/forms/Wizard/Step/StepDocs.js.map +1 -1
- package/extensions/forms/Wizard/style/dnb-wizard-layout.css +0 -1
- package/extensions/forms/Wizard/style/dnb-wizard-layout.min.css +1 -1
- package/extensions/forms/Wizard/style/dnb-wizard-layout.scss +0 -1
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.css +1 -0
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.min.css +0 -0
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-sbanken.scss +1 -0
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.css +3 -0
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.min.css +1 -0
- package/extensions/forms/Wizard/style/themes/dnb-wizard-layout-theme-ui.scss +7 -0
- package/extensions/forms/hooks/useFieldProps.js +71 -32
- package/extensions/forms/hooks/useFieldProps.js.map +1 -1
- package/extensions/forms/style/dnb-forms.css +4 -5
- package/extensions/forms/style/dnb-forms.min.css +1 -1
- package/extensions/forms/types.d.ts +9 -0
- package/extensions/forms/types.js.map +1 -1
- package/fragments/drawer-list/DrawerListHelpers.js +5 -2
- package/fragments/drawer-list/DrawerListHelpers.js.map +1 -1
- package/package.json +1 -1
- package/shared/Eufemia.d.ts +1 -1
- package/shared/Eufemia.js +2 -2
- package/shared/Eufemia.js.map +1 -1
- package/shared/MediaQuery.js +19 -1
- package/shared/MediaQuery.js.map +1 -1
- package/shared/MediaQueryUtils.d.ts +12 -34
- package/shared/MediaQueryUtils.js +22 -12
- package/shared/MediaQueryUtils.js.map +1 -1
- package/shared/component-helper.d.ts +1 -1
- package/shared/component-helper.js +5 -1
- package/shared/component-helper.js.map +1 -1
- package/shared/useMedia.d.ts +7 -2
- package/shared/useMedia.js +14 -11
- package/shared/useMedia.js.map +1 -1
- package/shared/useMediaQuery.js +28 -9
- package/shared/useMediaQuery.js.map +1 -1
- package/style/core/scopes.scss +1 -1
- package/style/dnb-ui-basis.css +2 -3
- package/style/dnb-ui-basis.min.css +1 -1
- package/style/dnb-ui-body.css +1 -1
- package/style/dnb-ui-body.min.css +1 -1
- package/style/dnb-ui-components.css +110 -42
- package/style/dnb-ui-components.min.css +3 -3
- package/style/dnb-ui-core.css +2 -3
- package/style/dnb-ui-core.min.css +1 -1
- package/style/dnb-ui-extensions.css +4 -5
- package/style/dnb-ui-extensions.min.css +1 -1
- package/style/dnb-ui-forms.css +4 -5
- package/style/dnb-ui-forms.min.css +1 -1
- package/style/themes/theme-eiendom/eiendom-theme-components.css +139 -51
- package/style/themes/theme-eiendom/eiendom-theme-components.min.css +10 -6
- package/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -5
- package/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +2 -2
- package/style/themes/theme-eiendom/eiendom-theme-extensions.scss +1 -0
- package/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -5
- package/style/themes/theme-eiendom/eiendom-theme-forms.min.css +2 -2
- package/style/themes/theme-eiendom/eiendom-theme-forms.scss +1 -0
- package/style/themes/theme-sbanken/sbanken-theme-components.css +214 -127
- package/style/themes/theme-sbanken/sbanken-theme-components.min.css +9 -7
- package/style/themes/theme-sbanken/sbanken-theme-components.scss +2 -2
- package/style/themes/theme-sbanken/sbanken-theme-extensions.css +5 -5
- package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-extensions.scss +1 -0
- package/style/themes/theme-sbanken/sbanken-theme-forms.css +5 -5
- package/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-forms.scss +1 -0
- package/style/themes/theme-ui/ui-theme-components.css +139 -51
- package/style/themes/theme-ui/ui-theme-components.min.css +10 -6
- package/style/themes/theme-ui/ui-theme-extensions.css +8 -5
- package/style/themes/theme-ui/ui-theme-extensions.min.css +2 -2
- package/style/themes/theme-ui/ui-theme-extensions.scss +1 -0
- package/style/themes/theme-ui/ui-theme-forms.css +8 -5
- package/style/themes/theme-ui/ui-theme-forms.min.css +2 -2
- package/style/themes/theme-ui/ui-theme-forms.scss +1 -0
- package/umd/dnb-ui-basis.min.js +1 -1
- package/umd/dnb-ui-components.min.js +1 -1
- package/umd/dnb-ui-elements.min.js +1 -1
- package/umd/dnb-ui-extensions.min.js +3 -3
- package/umd/dnb-ui-lib.min.js +1 -1
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { Props } from './Indeterminate';
|
|
2
|
+
export default function useDependencePaths(dependencePaths: Props['dependencePaths'], propagateIndeterminateState: Props['propagateIndeterminateState']): {
|
|
3
|
+
setAllStates: (checked: boolean) => void;
|
|
4
|
+
indeterminate: boolean;
|
|
5
|
+
internalValue: boolean;
|
|
6
|
+
};
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useContext, useMemo, useRef } from 'react';
|
|
4
|
+
import pointer from 'json-pointer';
|
|
5
|
+
import DataContext from '../../DataContext/Context';
|
|
6
|
+
export default function useDependencePaths(dependencePaths, propagateIndeterminateState) {
|
|
7
|
+
const {
|
|
8
|
+
data,
|
|
9
|
+
fieldPropsRef,
|
|
10
|
+
handlePathChange
|
|
11
|
+
} = useContext(DataContext) || {};
|
|
12
|
+
const {
|
|
13
|
+
allOn,
|
|
14
|
+
allOff,
|
|
15
|
+
indeterminate
|
|
16
|
+
} = useMemo(() => {
|
|
17
|
+
if (!dependencePaths || !data) {
|
|
18
|
+
return {};
|
|
19
|
+
}
|
|
20
|
+
const check = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
key,
|
|
23
|
+
whenUndefined = false
|
|
24
|
+
} = _ref;
|
|
25
|
+
return dependencePaths === null || dependencePaths === void 0 ? void 0 : dependencePaths.every(path => {
|
|
26
|
+
if (pointer.has(data, path)) {
|
|
27
|
+
var _fieldPropsRef$curren, _fieldPropsRef$curren2;
|
|
28
|
+
const value = pointer.get(data, path);
|
|
29
|
+
if ((whenUndefined ? typeof value === 'undefined' : false) || value === (fieldPropsRef === null || fieldPropsRef === void 0 ? void 0 : (_fieldPropsRef$curren = fieldPropsRef.current) === null || _fieldPropsRef$curren === void 0 ? void 0 : (_fieldPropsRef$curren2 = _fieldPropsRef$curren[path]) === null || _fieldPropsRef$curren2 === void 0 ? void 0 : _fieldPropsRef$curren2[key])) {
|
|
30
|
+
return true;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
const allOn = check({
|
|
36
|
+
key: 'valueOn'
|
|
37
|
+
});
|
|
38
|
+
const allOff = check({
|
|
39
|
+
key: 'valueOff',
|
|
40
|
+
whenUndefined: true
|
|
41
|
+
});
|
|
42
|
+
const indeterminate = !allOn && !allOff;
|
|
43
|
+
return {
|
|
44
|
+
allOn,
|
|
45
|
+
allOff,
|
|
46
|
+
indeterminate
|
|
47
|
+
};
|
|
48
|
+
}, [data, dependencePaths, fieldPropsRef]);
|
|
49
|
+
const keepStateRef = useRef();
|
|
50
|
+
useMemo(() => {
|
|
51
|
+
if (allOn && !keepStateRef.current) {
|
|
52
|
+
keepStateRef.current = true;
|
|
53
|
+
} else if (allOff && keepStateRef.current) {
|
|
54
|
+
keepStateRef.current = false;
|
|
55
|
+
} else {
|
|
56
|
+
if (propagateIndeterminateState !== 'auto' && indeterminate) {
|
|
57
|
+
keepStateRef.current = propagateIndeterminateState === 'unchecked';
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}, [allOn, allOff, propagateIndeterminateState, indeterminate]);
|
|
61
|
+
const setAllStates = useCallback(checked => {
|
|
62
|
+
dependencePaths === null || dependencePaths === void 0 ? void 0 : dependencePaths.forEach(path => {
|
|
63
|
+
var _fieldPropsRef$curren3, _fieldPropsRef$curren4;
|
|
64
|
+
const fieldProp = checked ? 'valueOn' : 'valueOff';
|
|
65
|
+
const value = fieldPropsRef === null || fieldPropsRef === void 0 ? void 0 : (_fieldPropsRef$curren3 = fieldPropsRef.current) === null || _fieldPropsRef$curren3 === void 0 ? void 0 : (_fieldPropsRef$curren4 = _fieldPropsRef$curren3[path]) === null || _fieldPropsRef$curren4 === void 0 ? void 0 : _fieldPropsRef$curren4[fieldProp];
|
|
66
|
+
handlePathChange === null || handlePathChange === void 0 ? void 0 : handlePathChange(path, value);
|
|
67
|
+
});
|
|
68
|
+
}, [dependencePaths, fieldPropsRef, handlePathChange]);
|
|
69
|
+
return {
|
|
70
|
+
setAllStates,
|
|
71
|
+
indeterminate,
|
|
72
|
+
internalValue: keepStateRef.current
|
|
73
|
+
};
|
|
74
|
+
}
|
|
75
|
+
//# sourceMappingURL=useDependencePaths.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDependencePaths.js","names":["useCallback","useContext","useMemo","useRef","pointer","DataContext","useDependencePaths","dependencePaths","propagateIndeterminateState","data","fieldPropsRef","handlePathChange","allOn","allOff","indeterminate","check","_ref","key","whenUndefined","every","path","has","_fieldPropsRef$curren","_fieldPropsRef$curren2","value","get","current","keepStateRef","setAllStates","checked","forEach","_fieldPropsRef$curren3","_fieldPropsRef$curren4","fieldProp","internalValue"],"sources":["../../../../../../src/extensions/forms/Field/Indeterminate/useDependencePaths.tsx"],"sourcesContent":["import { useCallback, useContext, useMemo, useRef } from 'react'\nimport pointer from 'json-pointer'\nimport DataContext from '../../DataContext/Context'\nimport { Props } from './Indeterminate'\n\nexport default function useDependencePaths(\n dependencePaths: Props['dependencePaths'],\n propagateIndeterminateState: Props['propagateIndeterminateState']\n) {\n const { data, fieldPropsRef, handlePathChange } =\n useContext(DataContext) || {}\n\n const { allOn, allOff, indeterminate } = useMemo(() => {\n if (!dependencePaths || !data) {\n return {}\n }\n\n const check = ({ key, whenUndefined = false }) => {\n return dependencePaths?.every((path) => {\n if (pointer.has(data, path)) {\n const value = pointer.get(data, path)\n if (\n // When value is undefined, we should also consider it as off\n (whenUndefined ? typeof value === 'undefined' : false) ||\n value === fieldPropsRef?.current?.[path]?.[key]\n ) {\n return true\n }\n }\n })\n }\n\n const allOn = check({ key: 'valueOn' })\n const allOff = check({ key: 'valueOff', whenUndefined: true })\n const indeterminate = !allOn && !allOff\n\n return {\n allOn,\n allOff,\n indeterminate,\n }\n }, [data, dependencePaths, fieldPropsRef])\n\n const keepStateRef = useRef<boolean>()\n useMemo(() => {\n if (allOn && !keepStateRef.current) {\n keepStateRef.current = true\n } else if (allOff && keepStateRef.current) {\n keepStateRef.current = false\n } else {\n if (propagateIndeterminateState !== 'auto' && indeterminate) {\n keepStateRef.current = propagateIndeterminateState === 'unchecked'\n }\n }\n }, [allOn, allOff, propagateIndeterminateState, indeterminate])\n\n const setAllStates = useCallback(\n (checked: boolean) => {\n dependencePaths?.forEach((path) => {\n const fieldProp = checked ? 'valueOn' : 'valueOff'\n const value = fieldPropsRef?.current?.[path]?.[fieldProp]\n handlePathChange?.(path, value)\n })\n },\n [dependencePaths, fieldPropsRef, handlePathChange]\n )\n\n return {\n setAllStates,\n indeterminate,\n internalValue: keepStateRef.current,\n }\n}\n"],"mappings":"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"}
|
|
@@ -1,8 +1 @@
|
|
|
1
|
-
export const NameProperties = {
|
|
2
|
-
capitalize: {
|
|
3
|
-
doc: 'Will capitalize the first letter of every word, transforming the rest to lowercase. Is enabled by default for first name and last name.',
|
|
4
|
-
type: 'boolean',
|
|
5
|
-
status: 'optional'
|
|
6
|
-
}
|
|
7
|
-
};
|
|
8
|
-
//# sourceMappingURL=NameDocs.js.map
|
|
1
|
+
export const NameProperties = {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NameDocs.js","names":["NameProperties"
|
|
1
|
+
{"version":3,"file":"NameDocs.js","names":["NameProperties"],"sources":["../../../../../../src/extensions/forms/Field/Name/NameDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const NameProperties: PropertiesTableProps = {}\n"],"mappings":"AAEA,OAAO,MAAMA,cAAoC,GAAG,CAAC,CAAC"}
|
|
@@ -99,7 +99,9 @@ function NumberComponent(props) {
|
|
|
99
99
|
number_mask: _objectSpread({}, mask_options)
|
|
100
100
|
};
|
|
101
101
|
}, [currency, currencyDisplay, decimalLimit, mask, percent, prefix, suffix]);
|
|
102
|
-
const preparedProps = _objectSpread(_objectSpread({
|
|
102
|
+
const preparedProps = _objectSpread(_objectSpread({
|
|
103
|
+
valueType: 'number'
|
|
104
|
+
}, props), {}, {
|
|
103
105
|
errorMessages,
|
|
104
106
|
schema,
|
|
105
107
|
toInput,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","InputMasked","HelpButton","Button","SharedContext","FieldBlockContext","classnames","FieldBlock","useFieldProps","pickSpacingProps","clamp","useErrorMessage","useTranslation","NumberComponent","props","_props$width","_sharedContext$transl","_sharedContext$transl2","fieldBlockContext","sharedContext","translations","currency","currencyDisplay","percent","mask","step","decimalLimit","prefix","suffix","showStepControls","errorMessages","path","required","Field","errorRequired","minimum","NumberField","errorMinimum","maximum","errorMaximum","exclusiveMinimum","errorExclusiveMinimum","exclusiveMaximum","errorExclusiveMaximum","multipleOf","errorMultipleOf","schema","_props$schema","type","toInput","external","undefined","fromInput","_ref","value","numberValue","emptyValue","transformValue","currentValue","Number","MAX_SAFE_INTEGER","MIN_SAFE_INTEGER","maskProps","mask_options","as_currency","currency_mask","as_percent","as_number","number_mask","_objectSpread","preparedProps","width","composition","id","name","className","inputClassName","autoComplete","layout","placeholder","label","labelDescription","disabled","htmlAttributes","info","warning","error","hasError","help","size","align","handleFocus","handleBlur","handleChange","onKeyDownHandler","_ref2","key","event","persist","preventDefault","fieldBlockProps","contentClassName","forId","contentWidth","increaseProps","variant","icon","tabIndex","onClick","title","translation","Slider","addTitle","replace","String","decreaseProps","subtractTitle","ariaParams","role","inputProps","onKeyDown","onFocus","onBlur","onChange","status","stretch","Boolean","createElement","content","_extends","asFieldset","left","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport { InputMasked, HelpButton, Button } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport type { InputAlign, InputSize } from '../../../../components/Input'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n FieldProps,\n FieldHelpProps,\n AllJSONSchemaVersions,\n CustomErrorMessages,\n FieldBlockWidth,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { ButtonProps, ButtonSize } from '../../../../components/Button'\nimport { clamp } from '../../../../components/slider/SliderHelpers'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\ninterface ErrorMessages extends CustomErrorMessages {\n required?: string\n schema?: string\n minimum?: string\n maximum?: string\n exclusiveMinimum?: string\n exclusiveMaximum?: string\n multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n FieldProps<number, undefined, ErrorMessages> & {\n inputClassName?: string\n currency?: InputMaskedProps['as_currency']\n currencyDisplay?: 'code' | 'symbol' | 'narrowSymbol' | 'name'\n percent?: InputMaskedProps['as_percent']\n mask?: InputMaskedProps['mask']\n step?: number\n // Formatting\n decimalLimit?: number\n prefix?: string\n suffix?: string\n // Validation\n minimum?: number // aka greater than or equal to\n maximum?: number // aka less than or equal to\n exclusiveMinimum?: number // aka greater than\n exclusiveMaximum?: number // aka less than\n multipleOf?: number\n // Styling\n size?: InputSize\n width?: FieldBlockWidth\n align?: InputAlign\n showStepControls?: boolean\n }\n\nfunction NumberComponent(props: Props) {\n const fieldBlockContext = useContext(FieldBlockContext)\n const sharedContext = useContext(SharedContext)\n const translations = useTranslation()\n\n const {\n currency,\n currencyDisplay,\n percent,\n mask,\n step = 1,\n decimalLimit = 12,\n prefix,\n suffix,\n showStepControls,\n } = props\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.Field.errorRequired,\n minimum: translations.NumberField.errorMinimum,\n maximum: translations.NumberField.errorMaximum,\n exclusiveMinimum: translations.NumberField.errorExclusiveMinimum,\n exclusiveMaximum: translations.NumberField.errorExclusiveMaximum,\n multipleOf: translations.NumberField.errorMultipleOf,\n })\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'number',\n minimum: props.minimum,\n maximum: props.maximum,\n exclusiveMinimum: props.exclusiveMinimum,\n exclusiveMaximum: props.exclusiveMaximum,\n multipleOf: props.multipleOf,\n },\n [\n props.schema,\n props.minimum,\n props.maximum,\n props.exclusiveMinimum,\n props.exclusiveMaximum,\n props.multipleOf,\n ]\n )\n\n const toInput = useCallback((external: number | undefined) => {\n if (external === undefined) {\n return ''\n }\n return external\n }, [])\n const fromInput = useCallback(\n ({ value, numberValue }: { value: string; numberValue: number }) => {\n if (value === '') {\n return props.emptyValue\n }\n return numberValue\n },\n [props.emptyValue]\n )\n const transformValue = useCallback(\n (value: number, currentValue: number) => {\n if (\n value > Number.MAX_SAFE_INTEGER ||\n value < Number.MIN_SAFE_INTEGER\n ) {\n return currentValue\n }\n\n return value\n },\n []\n )\n\n const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n const mask_options = { prefix, suffix, decimalLimit }\n\n if (currency) {\n return {\n as_currency: currency,\n mask_options,\n currency_mask: {\n currencyDisplay,\n },\n }\n }\n\n if (percent) {\n return {\n as_percent: percent,\n mask_options,\n }\n }\n\n // Custom mask based on props\n return {\n as_number: true,\n mask,\n number_mask: {\n ...mask_options,\n },\n }\n }, [\n currency,\n currencyDisplay,\n decimalLimit,\n mask,\n percent,\n prefix,\n suffix,\n ])\n\n const preparedProps: Props = {\n ...props,\n errorMessages,\n schema,\n toInput,\n fromInput,\n transformValue,\n width:\n props.width ??\n (fieldBlockContext?.composition ? 'stretch' : 'medium'),\n }\n\n const {\n id,\n name,\n className,\n inputClassName,\n autoComplete,\n layout,\n placeholder,\n label,\n labelDescription,\n value,\n minimum = Number.MIN_SAFE_INTEGER,\n maximum = Number.MAX_SAFE_INTEGER,\n disabled,\n htmlAttributes,\n info,\n warning,\n error,\n hasError,\n help,\n size,\n width,\n align,\n handleFocus,\n handleBlur,\n handleChange,\n } = useFieldProps(preparedProps)\n\n const onKeyDownHandler = useCallback(\n ({ key, event }) => {\n if (!showStepControls) {\n return\n }\n\n let numberValue = null\n\n switch (key) {\n case 'ArrowUp':\n numberValue = clamp((value as number) + step, minimum, maximum)\n break\n case 'ArrowDown':\n numberValue = clamp((value as number) - step, minimum, maximum)\n break\n }\n\n if (numberValue !== null) {\n event.persist()\n event.preventDefault()\n handleChange({ numberValue })\n }\n },\n [handleChange, maximum, minimum, showStepControls, step, value]\n )\n\n const fieldBlockProps = {\n className: classnames(\n 'dnb-forms-field-number',\n 'dnb-input__border--tokens', // Used by \"dnb-input__border\"\n className\n ),\n contentClassName: classnames(\n 'dnb-forms-field-number__contents',\n showStepControls && 'dnb-forms-field-number__contents--has-controls',\n hasError && 'dnb-input__status--error', // Also used by \"dnb-input__border\"\n disabled && 'dnb-input--disabled' // Also used by \"dnb-input__border\"\n ),\n forId: id,\n layout,\n label,\n labelDescription,\n info,\n warning,\n error,\n disabled,\n width:\n width === 'stretch' || fieldBlockContext?.composition\n ? width\n : undefined,\n contentWidth: width !== false ? width : undefined,\n ...pickSpacingProps(props),\n }\n\n const increaseProps: ButtonProps = showStepControls && {\n 'aria-hidden': true,\n className: 'dnb-button--control-after',\n variant: 'secondary',\n icon: 'add',\n size: (size || 'small') as ButtonSize,\n tabIndex: -1,\n disabled: disabled || value >= maximum,\n onClick: () => {\n handleChange({\n numberValue: clamp((value as number) + step, minimum, maximum),\n })\n },\n title: sharedContext?.translation.Slider.addTitle?.replace(\n '%s',\n String(value + step)\n ),\n }\n\n const decreaseProps: ButtonProps = showStepControls && {\n ...increaseProps,\n className: 'dnb-button--control-before',\n icon: 'subtract',\n size: (size || 'small') as ButtonSize,\n disabled: disabled || value <= minimum,\n onClick: () => {\n handleChange({\n numberValue: clamp((value as number) - step, minimum, maximum),\n })\n },\n title: sharedContext?.translation.Slider.subtractTitle?.replace(\n '%s',\n String(value - step)\n ),\n }\n\n const ariaParams = showStepControls && {\n role: 'spinbutton',\n 'aria-valuemin': String(minimum),\n 'aria-valuemax': String(maximum),\n 'aria-valuenow': String(value), // without it, VO will read an invalid value\n 'aria-valuetext': String(value), // without it, VO will read %\n }\n\n const inputProps = {\n id,\n name,\n autoComplete,\n className: classnames(\n 'dnb-forms-field-number__input',\n `dnb-input--${size}`,\n inputClassName\n ),\n step: showStepControls ? step : undefined,\n placeholder,\n value,\n align: showStepControls ? 'center' : align,\n ...maskProps,\n onKeyDown: onKeyDownHandler,\n onFocus: handleFocus,\n onBlur: handleBlur,\n onChange: handleChange,\n disabled,\n ...htmlAttributes,\n status: hasError ? 'error' : undefined,\n stretch: Boolean(\n width !== undefined || fieldBlockContext?.composition\n ),\n suffix:\n help && !showStepControls ? (\n <HelpButton title={help.title}>{help.content}</HelpButton>\n ) : undefined,\n ...ariaParams,\n }\n\n if (showStepControls) {\n return (\n <FieldBlock {...fieldBlockProps} asFieldset={false}>\n <span className=\"dnb-input__border dnb-input__border--root\">\n {<Button {...decreaseProps} />}\n <InputMasked {...inputProps} />\n {<Button {...increaseProps} />}\n </span>\n {help && (\n <HelpButton left=\"x-small\" title={help.title}>\n {help.content}\n </HelpButton>\n )}\n </FieldBlock>\n )\n }\n\n return (\n <FieldBlock {...fieldBlockProps} asFieldset={false}>\n <InputMasked {...inputProps} />\n </FieldBlock>\n )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Number.js","names":["React","useContext","useMemo","useCallback","InputMasked","HelpButton","Button","SharedContext","FieldBlockContext","classnames","FieldBlock","useFieldProps","pickSpacingProps","clamp","useErrorMessage","useTranslation","NumberComponent","props","_props$width","_sharedContext$transl","_sharedContext$transl2","fieldBlockContext","sharedContext","translations","currency","currencyDisplay","percent","mask","step","decimalLimit","prefix","suffix","showStepControls","errorMessages","path","required","Field","errorRequired","minimum","NumberField","errorMinimum","maximum","errorMaximum","exclusiveMinimum","errorExclusiveMinimum","exclusiveMaximum","errorExclusiveMaximum","multipleOf","errorMultipleOf","schema","_props$schema","type","toInput","external","undefined","fromInput","_ref","value","numberValue","emptyValue","transformValue","currentValue","Number","MAX_SAFE_INTEGER","MIN_SAFE_INTEGER","maskProps","mask_options","as_currency","currency_mask","as_percent","as_number","number_mask","_objectSpread","preparedProps","valueType","width","composition","id","name","className","inputClassName","autoComplete","layout","placeholder","label","labelDescription","disabled","htmlAttributes","info","warning","error","hasError","help","size","align","handleFocus","handleBlur","handleChange","onKeyDownHandler","_ref2","key","event","persist","preventDefault","fieldBlockProps","contentClassName","forId","contentWidth","increaseProps","variant","icon","tabIndex","onClick","title","translation","Slider","addTitle","replace","String","decreaseProps","subtractTitle","ariaParams","role","inputProps","onKeyDown","onFocus","onBlur","onChange","status","stretch","Boolean","createElement","content","_extends","asFieldset","left","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Number/Number.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport { InputMasked, HelpButton, Button } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport type { InputAlign, InputSize } from '../../../../components/Input'\nimport SharedContext from '../../../../shared/Context'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport classnames from 'classnames'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n FieldProps,\n FieldHelpProps,\n AllJSONSchemaVersions,\n CustomErrorMessages,\n FieldBlockWidth,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { ButtonProps, ButtonSize } from '../../../../components/Button'\nimport { clamp } from '../../../../components/slider/SliderHelpers'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\ninterface ErrorMessages extends CustomErrorMessages {\n required?: string\n schema?: string\n minimum?: string\n maximum?: string\n exclusiveMinimum?: string\n exclusiveMaximum?: string\n multipleOf?: string\n}\n\nexport type Props = FieldHelpProps &\n FieldProps<number, undefined, ErrorMessages> & {\n inputClassName?: string\n currency?: InputMaskedProps['as_currency']\n currencyDisplay?: 'code' | 'symbol' | 'narrowSymbol' | 'name'\n percent?: InputMaskedProps['as_percent']\n mask?: InputMaskedProps['mask']\n step?: number\n // Formatting\n decimalLimit?: number\n prefix?: string\n suffix?: string\n // Validation\n minimum?: number // aka greater than or equal to\n maximum?: number // aka less than or equal to\n exclusiveMinimum?: number // aka greater than\n exclusiveMaximum?: number // aka less than\n multipleOf?: number\n // Styling\n size?: InputSize\n width?: FieldBlockWidth\n align?: InputAlign\n showStepControls?: boolean\n }\n\nfunction NumberComponent(props: Props) {\n const fieldBlockContext = useContext(FieldBlockContext)\n const sharedContext = useContext(SharedContext)\n const translations = useTranslation()\n\n const {\n currency,\n currencyDisplay,\n percent,\n mask,\n step = 1,\n decimalLimit = 12,\n prefix,\n suffix,\n showStepControls,\n } = props\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.Field.errorRequired,\n minimum: translations.NumberField.errorMinimum,\n maximum: translations.NumberField.errorMaximum,\n exclusiveMinimum: translations.NumberField.errorExclusiveMinimum,\n exclusiveMaximum: translations.NumberField.errorExclusiveMaximum,\n multipleOf: translations.NumberField.errorMultipleOf,\n })\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'number',\n minimum: props.minimum,\n maximum: props.maximum,\n exclusiveMinimum: props.exclusiveMinimum,\n exclusiveMaximum: props.exclusiveMaximum,\n multipleOf: props.multipleOf,\n },\n [\n props.schema,\n props.minimum,\n props.maximum,\n props.exclusiveMinimum,\n props.exclusiveMaximum,\n props.multipleOf,\n ]\n )\n\n const toInput = useCallback((external: number | undefined) => {\n if (external === undefined) {\n return ''\n }\n return external\n }, [])\n const fromInput = useCallback(\n ({ value, numberValue }: { value: string; numberValue: number }) => {\n if (value === '') {\n return props.emptyValue\n }\n return numberValue\n },\n [props.emptyValue]\n )\n const transformValue = useCallback(\n (value: number, currentValue: number) => {\n if (\n value > Number.MAX_SAFE_INTEGER ||\n value < Number.MIN_SAFE_INTEGER\n ) {\n return currentValue\n }\n\n return value\n },\n []\n )\n\n const maskProps: Partial<InputMaskedProps> = useMemo(() => {\n const mask_options = { prefix, suffix, decimalLimit }\n\n if (currency) {\n return {\n as_currency: currency,\n mask_options,\n currency_mask: {\n currencyDisplay,\n },\n }\n }\n\n if (percent) {\n return {\n as_percent: percent,\n mask_options,\n }\n }\n\n // Custom mask based on props\n return {\n as_number: true,\n mask,\n number_mask: {\n ...mask_options,\n },\n }\n }, [\n currency,\n currencyDisplay,\n decimalLimit,\n mask,\n percent,\n prefix,\n suffix,\n ])\n\n const preparedProps: Props = {\n valueType: 'number',\n ...props,\n errorMessages,\n schema,\n toInput,\n fromInput,\n transformValue,\n width:\n props.width ??\n (fieldBlockContext?.composition ? 'stretch' : 'medium'),\n }\n\n const {\n id,\n name,\n className,\n inputClassName,\n autoComplete,\n layout,\n placeholder,\n label,\n labelDescription,\n value,\n minimum = Number.MIN_SAFE_INTEGER,\n maximum = Number.MAX_SAFE_INTEGER,\n disabled,\n htmlAttributes,\n info,\n warning,\n error,\n hasError,\n help,\n size,\n width,\n align,\n handleFocus,\n handleBlur,\n handleChange,\n } = useFieldProps(preparedProps)\n\n const onKeyDownHandler = useCallback(\n ({ key, event }) => {\n if (!showStepControls) {\n return\n }\n\n let numberValue = null\n\n switch (key) {\n case 'ArrowUp':\n numberValue = clamp((value as number) + step, minimum, maximum)\n break\n case 'ArrowDown':\n numberValue = clamp((value as number) - step, minimum, maximum)\n break\n }\n\n if (numberValue !== null) {\n event.persist()\n event.preventDefault()\n handleChange({ numberValue })\n }\n },\n [handleChange, maximum, minimum, showStepControls, step, value]\n )\n\n const fieldBlockProps = {\n className: classnames(\n 'dnb-forms-field-number',\n 'dnb-input__border--tokens', // Used by \"dnb-input__border\"\n className\n ),\n contentClassName: classnames(\n 'dnb-forms-field-number__contents',\n showStepControls && 'dnb-forms-field-number__contents--has-controls',\n hasError && 'dnb-input__status--error', // Also used by \"dnb-input__border\"\n disabled && 'dnb-input--disabled' // Also used by \"dnb-input__border\"\n ),\n forId: id,\n layout,\n label,\n labelDescription,\n info,\n warning,\n error,\n disabled,\n width:\n width === 'stretch' || fieldBlockContext?.composition\n ? width\n : undefined,\n contentWidth: width !== false ? width : undefined,\n ...pickSpacingProps(props),\n }\n\n const increaseProps: ButtonProps = showStepControls && {\n 'aria-hidden': true,\n className: 'dnb-button--control-after',\n variant: 'secondary',\n icon: 'add',\n size: (size || 'small') as ButtonSize,\n tabIndex: -1,\n disabled: disabled || value >= maximum,\n onClick: () => {\n handleChange({\n numberValue: clamp((value as number) + step, minimum, maximum),\n })\n },\n title: sharedContext?.translation.Slider.addTitle?.replace(\n '%s',\n String(value + step)\n ),\n }\n\n const decreaseProps: ButtonProps = showStepControls && {\n ...increaseProps,\n className: 'dnb-button--control-before',\n icon: 'subtract',\n size: (size || 'small') as ButtonSize,\n disabled: disabled || value <= minimum,\n onClick: () => {\n handleChange({\n numberValue: clamp((value as number) - step, minimum, maximum),\n })\n },\n title: sharedContext?.translation.Slider.subtractTitle?.replace(\n '%s',\n String(value - step)\n ),\n }\n\n const ariaParams = showStepControls && {\n role: 'spinbutton',\n 'aria-valuemin': String(minimum),\n 'aria-valuemax': String(maximum),\n 'aria-valuenow': String(value), // without it, VO will read an invalid value\n 'aria-valuetext': String(value), // without it, VO will read %\n }\n\n const inputProps = {\n id,\n name,\n autoComplete,\n className: classnames(\n 'dnb-forms-field-number__input',\n `dnb-input--${size}`,\n inputClassName\n ),\n step: showStepControls ? step : undefined,\n placeholder,\n value,\n align: showStepControls ? 'center' : align,\n ...maskProps,\n onKeyDown: onKeyDownHandler,\n onFocus: handleFocus,\n onBlur: handleBlur,\n onChange: handleChange,\n disabled,\n ...htmlAttributes,\n status: hasError ? 'error' : undefined,\n stretch: Boolean(\n width !== undefined || fieldBlockContext?.composition\n ),\n suffix:\n help && !showStepControls ? (\n <HelpButton title={help.title}>{help.content}</HelpButton>\n ) : undefined,\n ...ariaParams,\n }\n\n if (showStepControls) {\n return (\n <FieldBlock {...fieldBlockProps} asFieldset={false}>\n <span className=\"dnb-input__border dnb-input__border--root\">\n {<Button {...decreaseProps} />}\n <InputMasked {...inputProps} />\n {<Button {...increaseProps} />}\n </span>\n {help && (\n <HelpButton left=\"x-small\" title={help.title}>\n {help.content}\n </HelpButton>\n )}\n </FieldBlock>\n )\n }\n\n return (\n <FieldBlock {...fieldBlockProps} asFieldset={false}>\n <InputMasked {...inputProps} />\n </FieldBlock>\n )\n}\n\nNumberComponent._supportsSpacingProps = true\nexport default NumberComponent\n"],"mappings":"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"}
|
|
@@ -117,7 +117,7 @@ function PhoneNumber(props) {
|
|
|
117
117
|
const updateCurrentDataSet = useCallback(() => {
|
|
118
118
|
dataRef.current = getCountryData({
|
|
119
119
|
lang,
|
|
120
|
-
filter: !wasFilled.current ? country => `${formattCountryCode(country.cdc)}` === countryCodeRef.current : filterCountries,
|
|
120
|
+
filter: ccFilter === 'Prioritized' && !wasFilled.current ? country => `${formattCountryCode(country.cdc)}` === countryCodeRef.current : filterCountries,
|
|
121
121
|
sort: ccFilter,
|
|
122
122
|
makeObject
|
|
123
123
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","getCountryData","makeCountryFilterSet","useErrorMessage","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_countryCodeRef$curre","sharedContext","translations","lang","locale","split","countryCodeRef","useRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","path","required","errorRequired","pattern","validateRequired","value","_ref","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","schema","_props$schema","type","defaultProps","preparedProps","_objectSpread","fromExternal","toEvent","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","countryCodeLabel","label","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateUnchanged","omitCountryCodeField","handleFocus","handleBlur","handleChange","onCountryCodeChange","onNumberChange","filterCountries","external","updateCurrentDataSet","filter","country","formattCountryCode","cdc","sort","makeObject","callOnChange","_ref2","joinValue","handleCountryCodeChange","_ref3","_data$selectedKey","data","selectedKey","trim","handleNumberChange","onFocusHandler","_ref4","updateData","onTypeHandler","_ref5","_event$nativeEvent","revalidateInputValue","event","nativeEvent","cdcVal","test","find","_ref6","window","requestAnimationFrame","isDefault","includes","createElement","_extends","Horizontal","align","mode","label_direction","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","autoComplete","no_animation","noAnimation","stretch","layout","mask","Array","fill","onFocus","onBlur","onChange","inputMode","_country$i18n$lang","selected_value","iso","content","i18n","en","match","slice","array","Boolean","join","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries, {\n type CountryLang,\n type CountryType,\n} from '../../constants/countries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n FieldHelpProps,\n FieldProps,\n AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\nimport {\n CountryFilterSet,\n getCountryData,\n makeCountryFilterSet,\n} from '../SelectCountry'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type Props = FieldHelpProps &\n FieldProps<string, undefined | string> & {\n countryCodeFieldClassName?: string\n numberFieldClassName?: string\n countryCodePlaceholder?: string\n countryCodeLabel?: string\n numberMask?: InputMaskedProps['mask']\n pattern?: StringFieldProps['pattern']\n width?: 'large' | 'stretch'\n omitCountryCodeField?: boolean\n onCountryCodeChange?: (value: string | undefined) => void\n onNumberChange?: (value: string | undefined) => void\n countries?: CountryFilterSet\n\n /**\n * For internal use only.\n *\n * @param country\n * @returns boolean\n */\n filterCountries?: (country: CountryType) => boolean\n\n /**\n * For internal testing purposes\n */\n noAnimation?: boolean\n }\n\n// Important for the default value to be defined here, and not after the useFieldProps call, to avoid the UI jumping\n// back to +47 once the user empty the field so handleChange send out undefined.\nconst defaultCountryCode = '+47'\nconst defaultPlaceholder = '00 00 00 00'\nconst defaultMask = [\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n]\n\nfunction PhoneNumber(props: Props) {\n const sharedContext = useContext(SharedContext)\n const translations = useTranslation()\n const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n const countryCodeRef = React.useRef(props?.emptyValue)\n const numberRef = React.useRef(props?.emptyValue)\n const dataRef = React.useRef(null)\n const langRef = React.useRef(lang)\n const wasFilled = React.useRef(false)\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.PhoneNumber.errorRequired,\n pattern: translations.PhoneNumber.errorRequired,\n })\n\n const validateRequired = useCallback(\n (value: string, { required, isChanged, error }) => {\n if (required) {\n const [countryCode, phoneNumber] = splitValue(value)\n\n if (countryCode !== prevCountryCodeRef.current) {\n if (countryCode) {\n prevCountryCodeRef.current = countryCode\n }\n return undefined\n }\n\n if (isChanged && !phoneNumber) {\n return error\n }\n }\n\n return undefined\n },\n []\n )\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'string',\n pattern: props.pattern,\n },\n [props.schema, props.pattern]\n )\n const defaultProps: Partial<Props> = {\n schema,\n errorMessages,\n }\n const preparedProps: Props = {\n ...props,\n ...defaultProps,\n validateRequired,\n fromExternal,\n toEvent,\n }\n\n const {\n value,\n className,\n countryCodeFieldClassName,\n numberFieldClassName,\n countryCodePlaceholder,\n placeholder,\n countryCodeLabel,\n label = translations.PhoneNumber.label,\n numberMask,\n countries: ccFilter = 'Prioritized',\n emptyValue,\n info,\n warning,\n error,\n hasError,\n disabled,\n width = 'large',\n help,\n required,\n validateInitially,\n continuousValidation,\n validateUnchanged,\n omitCountryCodeField,\n handleFocus,\n handleBlur,\n handleChange,\n onCountryCodeChange,\n onNumberChange,\n filterCountries = ccFilter !== 'Prioritized'\n ? makeCountryFilterSet(ccFilter)\n : undefined,\n } = useFieldProps(preparedProps)\n\n function fromExternal(external: string) {\n const [, phoneNumber] = splitValue(external)\n if (!phoneNumber && !props.omitCountryCodeField) {\n return countryCodeRef.current\n }\n return external\n }\n\n function toEvent(value: string) {\n const [, phoneNumber] = splitValue(value)\n if (!phoneNumber) {\n return emptyValue\n }\n return value\n }\n\n const updateCurrentDataSet = useCallback(() => {\n dataRef.current = getCountryData({\n lang,\n filter: !wasFilled.current\n ? (country) =>\n `${formattCountryCode(country.cdc)}` === countryCodeRef.current\n : filterCountries,\n sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n makeObject,\n })\n }, [lang, filterCountries, ccFilter])\n\n const callOnChange = useCallback(\n ({\n countryCode = omitCountryCodeField\n ? emptyValue\n : countryCodeRef.current || emptyValue,\n phoneNumber = numberRef.current || emptyValue,\n }) => {\n handleChange(\n joinValue([countryCode, phoneNumber]),\n omitCountryCodeField\n ? { phoneNumber }\n : { countryCode, phoneNumber }\n )\n },\n [omitCountryCodeField, emptyValue, handleChange]\n )\n\n /**\n * We do not process the whole country list at the first render.\n * Only when the Autocomplete opens (focus).\n * To achieve this, we use memo instead of effect to update refs in sync.\n *\n * We set or update the data list depending on if the countrycode changes or lang changes.\n * We then update countryCode and phoneNumber when value changes.\n */\n useMemo(() => {\n const [countryCode, phoneNumber] = splitValue(props.value || value)\n numberRef.current = phoneNumber\n\n if (lang !== langRef.current || !wasFilled.current) {\n if (!countryCodeRef.current || countryCode) {\n countryCodeRef.current = countryCode || defaultCountryCode\n }\n langRef.current = lang\n\n updateCurrentDataSet()\n }\n }, [value, props.value, lang, updateCurrentDataSet])\n\n const prevCountryCodeRef = React.useRef(countryCodeRef.current)\n\n const handleCountryCodeChange = useCallback(\n ({ data }: { data: { selectedKey: string } }) => {\n const countryCode = (countryCodeRef.current =\n data?.selectedKey?.trim() || emptyValue)\n\n callOnChange({ countryCode })\n onCountryCodeChange?.(countryCode)\n },\n [emptyValue, callOnChange, onCountryCodeChange]\n )\n\n const handleNumberChange = useCallback(\n (value: string) => {\n const phoneNumber = (numberRef.current = value || emptyValue)\n\n callOnChange({ phoneNumber })\n onNumberChange?.(phoneNumber)\n },\n [emptyValue, callOnChange, onNumberChange]\n )\n\n const onFocusHandler = useCallback(\n ({ updateData }) => {\n if (!wasFilled.current) {\n wasFilled.current = true\n updateCurrentDataSet()\n updateData(dataRef.current)\n }\n handleFocus()\n },\n [handleFocus, updateCurrentDataSet]\n )\n\n const onTypeHandler = useCallback(\n ({ value, updateData, revalidateInputValue, event }) => {\n // Handle browser autofill/autocomplete\n if (typeof event?.nativeEvent?.data === 'undefined') {\n const cdcVal = /\\+\\d{1,3}\\s{1}\\d+/.test(value)\n ? splitValue(value)[0]\n : value\n const country = countries.find(({ cdc }) => cdc === cdcVal)\n if (country?.cdc) {\n const countryCode = (countryCodeRef.current = formattCountryCode(\n country.cdc\n ))\n\n updateCurrentDataSet()\n updateData(dataRef.current)\n callOnChange({ countryCode })\n\n // To ensure correct input value,\n // regardless if there is changed data before or not.\n window.requestAnimationFrame(() => {\n revalidateInputValue()\n })\n }\n }\n },\n [callOnChange, updateCurrentDataSet]\n )\n\n const isDefault = countryCodeRef.current?.includes(defaultCountryCode)\n\n return (\n <FieldBlock\n className={classnames('dnb-forms-field-phone-number', className)}\n width={omitCountryCodeField ? undefined : width}\n info={info}\n warning={warning}\n error={error}\n disabled={disabled}\n {...pickSpacingProps(props)}\n >\n <Flex.Horizontal align=\"flex-end\">\n {!omitCountryCodeField && (\n <Autocomplete\n className={classnames(\n 'dnb-forms-field-phone-number__country-code',\n countryCodeFieldClassName\n )}\n mode=\"async\"\n placeholder={countryCodePlaceholder}\n label_direction=\"vertical\"\n label={\n countryCodeLabel ?? translations.PhoneNumber.countryCodeLabel\n }\n data={dataRef.current}\n value={countryCodeRef.current}\n status={hasError ? 'error' : undefined}\n disabled={disabled}\n on_focus={onFocusHandler}\n on_blur={handleBlur}\n on_change={handleCountryCodeChange}\n on_type={onTypeHandler}\n independent_width\n search_numbers\n keep_selection\n autoComplete=\"tel-country-code\"\n no_animation={props.noAnimation}\n stretch={width === 'stretch'}\n />\n )}\n\n <StringField\n className={classnames(\n 'dnb-forms-field-phone-number__number',\n numberFieldClassName\n )}\n type=\"tel\"\n autoComplete=\"tel-national\"\n emptyValue={emptyValue}\n layout=\"vertical\"\n label={label}\n placeholder={\n placeholder ?? (isDefault ? defaultPlaceholder : undefined)\n }\n mask={\n numberMask ?? (isDefault ? defaultMask : Array(12).fill(/\\d/))\n }\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChange={handleNumberChange}\n value={numberRef.current}\n info={info}\n warning={warning}\n error={error}\n disabled={disabled}\n width={omitCountryCodeField ? 'medium' : 'stretch'}\n help={help}\n required={required}\n errorMessages={errorMessages}\n validateInitially={validateInitially}\n continuousValidation={continuousValidation}\n validateUnchanged={validateUnchanged}\n inputMode=\"tel\"\n />\n </Flex.Horizontal>\n </FieldBlock>\n )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n return {\n selectedKey: formattCountryCode(country.cdc),\n selected_value: `${country.iso} (${formattCountryCode(country.cdc)})`,\n content: `${formattCountryCode(country.cdc)} ${\n country.i18n[lang] ?? country.i18n.en\n }`,\n }\n}\n\nfunction formattCountryCode(value: string) {\n return `+${value}`\n}\n\nfunction splitValue(value: string) {\n return (\n typeof value === 'string'\n ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n : [undefined, '', '']\n ).slice(1)\n}\n\nfunction joinValue(array: Array<string>) {\n return array.filter(Boolean).join(' ')\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"PhoneNumber.js","names":["React","useMemo","useContext","useCallback","Autocomplete","Flex","classnames","countries","StringField","FieldBlock","useFieldProps","pickSpacingProps","SharedContext","getCountryData","makeCountryFilterSet","useErrorMessage","useTranslation","defaultCountryCode","defaultPlaceholder","defaultMask","PhoneNumber","props","_sharedContext$locale","_countryCodeRef$curre","sharedContext","translations","lang","locale","split","countryCodeRef","useRef","emptyValue","numberRef","dataRef","langRef","wasFilled","errorMessages","path","required","errorRequired","pattern","validateRequired","value","_ref","isChanged","error","countryCode","phoneNumber","splitValue","prevCountryCodeRef","current","undefined","schema","_props$schema","type","defaultProps","preparedProps","_objectSpread","fromExternal","toEvent","className","countryCodeFieldClassName","numberFieldClassName","countryCodePlaceholder","placeholder","countryCodeLabel","label","numberMask","ccFilter","info","warning","hasError","disabled","width","help","validateInitially","continuousValidation","validateUnchanged","omitCountryCodeField","handleFocus","handleBlur","handleChange","onCountryCodeChange","onNumberChange","filterCountries","external","updateCurrentDataSet","filter","country","formattCountryCode","cdc","sort","makeObject","callOnChange","_ref2","joinValue","handleCountryCodeChange","_ref3","_data$selectedKey","data","selectedKey","trim","handleNumberChange","onFocusHandler","_ref4","updateData","onTypeHandler","_ref5","_event$nativeEvent","revalidateInputValue","event","nativeEvent","cdcVal","test","find","_ref6","window","requestAnimationFrame","isDefault","includes","createElement","_extends","Horizontal","align","mode","label_direction","status","on_focus","on_blur","on_change","on_type","independent_width","search_numbers","keep_selection","autoComplete","no_animation","noAnimation","stretch","layout","mask","Array","fill","onFocus","onBlur","onChange","inputMode","_country$i18n$lang","selected_value","iso","content","i18n","en","match","slice","array","Boolean","join","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/PhoneNumber/PhoneNumber.tsx"],"sourcesContent":["import React, { useMemo, useContext, useCallback } from 'react'\nimport { Autocomplete, Flex } from '../../../../components'\nimport { InputMaskedProps } from '../../../../components/InputMasked'\nimport classnames from 'classnames'\nimport countries, {\n type CountryLang,\n type CountryType,\n} from '../../constants/countries'\nimport StringField, { Props as StringFieldProps } from '../String'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport {\n FieldHelpProps,\n FieldProps,\n AllJSONSchemaVersions,\n} from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport SharedContext from '../../../../shared/Context'\nimport {\n CountryFilterSet,\n getCountryData,\n makeCountryFilterSet,\n} from '../SelectCountry'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\nimport { DrawerListDataObject } from '../../../../fragments/DrawerList'\n\nexport type Props = FieldHelpProps &\n FieldProps<string, undefined | string> & {\n countryCodeFieldClassName?: string\n numberFieldClassName?: string\n countryCodePlaceholder?: string\n countryCodeLabel?: string\n numberMask?: InputMaskedProps['mask']\n pattern?: StringFieldProps['pattern']\n width?: 'large' | 'stretch'\n omitCountryCodeField?: boolean\n onCountryCodeChange?: (value: string | undefined) => void\n onNumberChange?: (value: string | undefined) => void\n countries?: CountryFilterSet\n\n /**\n * For internal use only.\n *\n * @param country\n * @returns boolean\n */\n filterCountries?: (country: CountryType) => boolean\n\n /**\n * For internal testing purposes\n */\n noAnimation?: boolean\n }\n\n// Important for the default value to be defined here, and not after the useFieldProps call, to avoid the UI jumping\n// back to +47 once the user empty the field so handleChange send out undefined.\nconst defaultCountryCode = '+47'\nconst defaultPlaceholder = '00 00 00 00'\nconst defaultMask = [\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n ' ',\n /\\d/,\n /\\d/,\n]\n\nfunction PhoneNumber(props: Props) {\n const sharedContext = useContext(SharedContext)\n const translations = useTranslation()\n const lang = sharedContext.locale?.split('-')[0] as CountryLang\n\n const countryCodeRef = React.useRef<Props['value']>(props?.emptyValue)\n const numberRef = React.useRef<Props['value']>(props?.emptyValue)\n const dataRef = React.useRef<Array<DrawerListDataObject>>(null)\n const langRef = React.useRef<string>(lang)\n const wasFilled = React.useRef<boolean>(false)\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.PhoneNumber.errorRequired,\n pattern: translations.PhoneNumber.errorRequired,\n })\n\n const validateRequired = useCallback(\n (value: string, { required, isChanged, error }) => {\n if (required) {\n const [countryCode, phoneNumber] = splitValue(value)\n\n if (countryCode !== prevCountryCodeRef.current) {\n if (countryCode) {\n prevCountryCodeRef.current = countryCode\n }\n return undefined\n }\n\n if (isChanged && !phoneNumber) {\n return error\n }\n }\n\n return undefined\n },\n []\n )\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'string',\n pattern: props.pattern,\n },\n [props.schema, props.pattern]\n )\n const defaultProps: Partial<Props> = {\n schema,\n errorMessages,\n }\n const preparedProps: Props = {\n ...props,\n ...defaultProps,\n validateRequired,\n fromExternal,\n toEvent,\n }\n\n const {\n value,\n className,\n countryCodeFieldClassName,\n numberFieldClassName,\n countryCodePlaceholder,\n placeholder,\n countryCodeLabel,\n label = translations.PhoneNumber.label,\n numberMask,\n countries: ccFilter = 'Prioritized',\n emptyValue,\n info,\n warning,\n error,\n hasError,\n disabled,\n width = 'large',\n help,\n required,\n validateInitially,\n continuousValidation,\n validateUnchanged,\n omitCountryCodeField,\n handleFocus,\n handleBlur,\n handleChange,\n onCountryCodeChange,\n onNumberChange,\n filterCountries = ccFilter !== 'Prioritized'\n ? makeCountryFilterSet(ccFilter)\n : undefined,\n } = useFieldProps(preparedProps)\n\n function fromExternal(external: string) {\n const [, phoneNumber] = splitValue(external)\n if (!phoneNumber && !props.omitCountryCodeField) {\n return countryCodeRef.current\n }\n return external\n }\n\n function toEvent(value: string) {\n const [, phoneNumber] = splitValue(value)\n if (!phoneNumber) {\n return emptyValue\n }\n return value\n }\n\n const updateCurrentDataSet = useCallback(() => {\n dataRef.current = getCountryData({\n lang,\n filter:\n // Make sure the whole cc list is displayed when cc filter is set to specific region\n ccFilter === 'Prioritized' && !wasFilled.current\n ? (country) =>\n `${formattCountryCode(country.cdc)}` ===\n countryCodeRef.current\n : filterCountries,\n sort: ccFilter as Extract<CountryFilterSet, 'Prioritized'>,\n makeObject,\n })\n }, [lang, filterCountries, ccFilter])\n\n const callOnChange = useCallback(\n ({\n countryCode = omitCountryCodeField\n ? emptyValue\n : countryCodeRef.current || emptyValue,\n phoneNumber = numberRef.current || emptyValue,\n }) => {\n handleChange(\n joinValue([countryCode, phoneNumber]),\n omitCountryCodeField\n ? { phoneNumber }\n : { countryCode, phoneNumber }\n )\n },\n [omitCountryCodeField, emptyValue, handleChange]\n )\n\n /**\n * We do not process the whole country list at the first render.\n * Only when the Autocomplete opens (focus).\n * To achieve this, we use memo instead of effect to update refs in sync.\n *\n * We set or update the data list depending on if the countrycode changes or lang changes.\n * We then update countryCode and phoneNumber when value changes.\n */\n useMemo(() => {\n const [countryCode, phoneNumber] = splitValue(props.value || value)\n numberRef.current = phoneNumber\n\n if (lang !== langRef.current || !wasFilled.current) {\n if (!countryCodeRef.current || countryCode) {\n countryCodeRef.current = countryCode || defaultCountryCode\n }\n langRef.current = lang\n\n updateCurrentDataSet()\n }\n }, [value, props.value, lang, updateCurrentDataSet])\n\n const prevCountryCodeRef = React.useRef(countryCodeRef.current)\n\n const handleCountryCodeChange = useCallback(\n ({ data }: { data: { selectedKey: string } }) => {\n const countryCode = (countryCodeRef.current =\n data?.selectedKey?.trim() || emptyValue)\n\n callOnChange({ countryCode })\n onCountryCodeChange?.(countryCode)\n },\n [emptyValue, callOnChange, onCountryCodeChange]\n )\n\n const handleNumberChange = useCallback(\n (value: string) => {\n const phoneNumber = (numberRef.current = value || emptyValue)\n\n callOnChange({ phoneNumber })\n onNumberChange?.(phoneNumber)\n },\n [emptyValue, callOnChange, onNumberChange]\n )\n\n const onFocusHandler = useCallback(\n ({ updateData }) => {\n if (!wasFilled.current) {\n wasFilled.current = true\n updateCurrentDataSet()\n updateData(dataRef.current)\n }\n handleFocus()\n },\n [handleFocus, updateCurrentDataSet]\n )\n\n const onTypeHandler = useCallback(\n ({ value, updateData, revalidateInputValue, event }) => {\n // Handle browser autofill/autocomplete\n if (typeof event?.nativeEvent?.data === 'undefined') {\n const cdcVal = /\\+\\d{1,3}\\s{1}\\d+/.test(value)\n ? splitValue(value)[0]\n : value\n const country = countries.find(({ cdc }) => cdc === cdcVal)\n if (country?.cdc) {\n const countryCode = (countryCodeRef.current = formattCountryCode(\n country.cdc\n ))\n\n updateCurrentDataSet()\n updateData(dataRef.current)\n callOnChange({ countryCode })\n\n // To ensure correct input value,\n // regardless if there is changed data before or not.\n window.requestAnimationFrame(() => {\n revalidateInputValue()\n })\n }\n }\n },\n [callOnChange, updateCurrentDataSet]\n )\n\n const isDefault = countryCodeRef.current?.includes(defaultCountryCode)\n\n return (\n <FieldBlock\n className={classnames('dnb-forms-field-phone-number', className)}\n width={omitCountryCodeField ? undefined : width}\n info={info}\n warning={warning}\n error={error}\n disabled={disabled}\n {...pickSpacingProps(props)}\n >\n <Flex.Horizontal align=\"flex-end\">\n {!omitCountryCodeField && (\n <Autocomplete\n className={classnames(\n 'dnb-forms-field-phone-number__country-code',\n countryCodeFieldClassName\n )}\n mode=\"async\"\n placeholder={countryCodePlaceholder}\n label_direction=\"vertical\"\n label={\n countryCodeLabel ?? translations.PhoneNumber.countryCodeLabel\n }\n data={dataRef.current}\n value={countryCodeRef.current}\n status={hasError ? 'error' : undefined}\n disabled={disabled}\n on_focus={onFocusHandler}\n on_blur={handleBlur}\n on_change={handleCountryCodeChange}\n on_type={onTypeHandler}\n independent_width\n search_numbers\n keep_selection\n autoComplete=\"tel-country-code\"\n no_animation={props.noAnimation}\n stretch={width === 'stretch'}\n />\n )}\n\n <StringField\n className={classnames(\n 'dnb-forms-field-phone-number__number',\n numberFieldClassName\n )}\n type=\"tel\"\n autoComplete=\"tel-national\"\n emptyValue={emptyValue}\n layout=\"vertical\"\n label={label}\n placeholder={\n placeholder ?? (isDefault ? defaultPlaceholder : undefined)\n }\n mask={\n numberMask ?? (isDefault ? defaultMask : Array(12).fill(/\\d/))\n }\n onFocus={handleFocus}\n onBlur={handleBlur}\n onChange={handleNumberChange}\n value={numberRef.current}\n info={info}\n warning={warning}\n error={error}\n disabled={disabled}\n width={omitCountryCodeField ? 'medium' : 'stretch'}\n help={help}\n required={required}\n errorMessages={errorMessages}\n validateInitially={validateInitially}\n continuousValidation={continuousValidation}\n validateUnchanged={validateUnchanged}\n inputMode=\"tel\"\n />\n </Flex.Horizontal>\n </FieldBlock>\n )\n}\n\nfunction makeObject(country: CountryType, lang: string) {\n return {\n selectedKey: formattCountryCode(country.cdc),\n selected_value: `${country.iso} (${formattCountryCode(country.cdc)})`,\n content: `${formattCountryCode(country.cdc)} ${\n country.i18n[lang] ?? country.i18n.en\n }`,\n }\n}\n\nfunction formattCountryCode(value: string) {\n return `+${value}`\n}\n\nfunction splitValue(value: string) {\n return (\n typeof value === 'string'\n ? value.match(/^(\\+[^ ]+)? ?(.*)$/)\n : [undefined, '', '']\n ).slice(1)\n}\n\nfunction joinValue(array: Array<string>) {\n return array.filter(Boolean).join(' ')\n}\n\nPhoneNumber._supportsSpacingProps = true\nexport default PhoneNumber\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"String.js","names":["React","useContext","useMemo","useCallback","classnames","HelpButton","Input","Textarea","InputMasked","FieldBlockContext","FieldBlock","useFieldProps","pickSpacingProps","toCapitalized","useErrorMessage","useTranslation","StringComponent","props","_props$width","_value$toString","fieldBlockContext","translations","errorMessages","path","required","Field","errorRequired","minLength","StringField","errorMinLength","maxLength","errorMaxLength","pattern","errorPattern","schema","_props$schema","type","fromInput","event","_event","_event$cleanedValue","_event2","_event3","value","emptyValue","cleanedValue","toEvent","trim","spaces","RegExp","test","replace","handleChange","transform","transformValue","capitalize","String","preparedProps","_objectSpread","width","composition","id","name","className","innerRef","inputClassName","layout","placeholder","label","labelDescription","info","warning","error","hasError","disabled","help","multiline","mask","leftIcon","rightIcon","htmlAttributes","submitElement","clear","align","size","selectall","keepPlaceholder","rows","autoresizeMaxRows","autoresize","characterCounter","autoComplete","inputMode","autoCorrect","spellCheck","autoFocus","autoCapitalize","handleFocus","handleBlur","transformInstantly","cn","sharedProps","suffix","createElement","title","content","undefined","on_focus","on_blur","on_change","stretch","Boolean","inner_ref","status","toString","textareaProps","autoresize_max_rows","inputProps","icon","icon_position","submit_element","keep_placeholder","fieldBlockProps","forId","contentWidth","_extends","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/String/String.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport { HelpButton, Input, Textarea } from '../../../../components'\nimport { InputProps } from '../../../../components/input/Input'\nimport InputMasked, {\n InputMaskedProps,\n} from '../../../../components/InputMasked'\nimport { TextareaProps } from '../../../../components/Textarea'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { toCapitalized } from '../../../../shared/component-helper'\nimport type { TextCounterProps } from '../../../../fragments/TextCounter'\nimport type {\n FieldProps,\n FieldHelpProps,\n CustomErrorMessages,\n AllJSONSchemaVersions,\n FieldBlockWidth,\n} from '../../types'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\ninterface ErrorMessages extends CustomErrorMessages {\n required?: string\n schema?: string\n minLength?: string\n maxLength?: string\n pattern?: string\n}\nexport type Props = FieldHelpProps &\n FieldProps<string, undefined | string, ErrorMessages> & {\n // - Shared props\n multiline?: boolean\n inputClassName?: string\n innerRef?: React.RefObject<HTMLInputElement | HTMLTextAreaElement>\n width?: FieldBlockWidth\n size?: InputProps['size'] | TextareaProps['size']\n keepPlaceholder?: InputProps['keep_placeholder']\n\n // - Validation\n minLength?: number\n maxLength?: number\n pattern?: string\n\n // - Input props\n type?: InputProps['type']\n align?: InputProps['align']\n selectall?: InputProps['selectall']\n clear?: boolean\n mask?: InputMaskedProps['mask']\n leftIcon?: string\n rightIcon?: string\n submitElement?: InputProps['submit_element']\n capitalize?: boolean\n trim?: boolean\n\n // - Textarea props\n rows?: TextareaProps['rows']\n autoresizeMaxRows?: TextareaProps['autoresize_max_rows']\n autoresize?: TextareaProps['autoresize']\n characterCounter?: Omit<TextCounterProps, 'text'> | number\n\n // - Html props\n autoComplete?: HTMLInputElement['autocomplete']\n inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode']\n autoCorrect?: React.HTMLAttributes<HTMLInputElement>['autoCorrect']\n spellCheck?: React.HTMLAttributes<HTMLInputElement>['spellCheck']\n autoFocus?: React.HTMLAttributes<HTMLInputElement>['autoFocus']\n autoCapitalize?: React.HTMLAttributes<HTMLInputElement>['autoCapitalize']\n }\n\nfunction StringComponent(props: Props) {\n const fieldBlockContext = useContext(FieldBlockContext)\n const translations = useTranslation()\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.Field.errorRequired,\n minLength: translations.StringField.errorMinLength,\n maxLength: translations.StringField.errorMaxLength,\n pattern: translations.Field.errorPattern,\n })\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'string',\n minLength: props.minLength,\n maxLength: props.maxLength,\n pattern: props.pattern,\n },\n [props.schema, props.minLength, props.maxLength, props.pattern]\n )\n const fromInput = useCallback(\n (event: { value: string; cleanedValue?: string }) => {\n if (typeof event === 'string') {\n event = { value: event }\n }\n if (event?.value === '') {\n return props.emptyValue\n }\n // Cleaned value for masked\n return event?.cleanedValue ?? event?.value\n },\n [props.emptyValue]\n )\n const toEvent = useCallback(\n (value: string, type: string) => {\n if (props.trim && type === 'onBlur') {\n const spaces = '[\\\\s ]'\n if (new RegExp(`^${spaces}|${spaces}$`).test(value)) {\n value = value.replace(\n new RegExp(`^${spaces}+|${spaces}+$`, 'g'),\n ''\n )\n handleChange(value)\n }\n }\n return value\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.trim]\n )\n const transform = props.transformValue\n const transformValue = useCallback(\n (value: string) => {\n if (props.capitalize) {\n value = toCapitalized(String(value || ''))\n }\n return transform?.(value) || value\n },\n [props.capitalize, transform]\n )\n\n const preparedProps: Props = {\n ...props,\n errorMessages,\n schema,\n fromInput,\n toEvent,\n transformValue,\n width:\n props.width ??\n (fieldBlockContext?.composition ? 'stretch' : 'large'),\n }\n\n const {\n id,\n name,\n className,\n\n innerRef,\n inputClassName,\n layout,\n placeholder,\n label,\n labelDescription,\n value,\n info,\n warning,\n error,\n hasError,\n disabled,\n help,\n multiline,\n mask,\n leftIcon,\n rightIcon,\n width,\n htmlAttributes,\n submitElement,\n\n // - Input props\n type,\n clear,\n align,\n size,\n selectall,\n keepPlaceholder,\n\n // - Textarea props\n rows,\n // formId,\n autoresizeMaxRows = 6,\n autoresize = true,\n characterCounter,\n\n // - Html props\n\n autoComplete,\n inputMode,\n autoCorrect,\n spellCheck,\n autoFocus,\n autoCapitalize,\n\n // - Events\n handleFocus,\n handleBlur,\n handleChange,\n } = useFieldProps(preparedProps)\n\n const transformInstantly = useCallback(\n (value: string) => (props.capitalize ? toCapitalized(value) : value),\n [props.capitalize]\n )\n\n const cn = classnames('dnb-forms-field-string__input', inputClassName)\n\n const sharedProps: InputProps & TextareaProps = {\n id,\n name,\n autoComplete,\n autoCorrect,\n spellCheck,\n autoFocus,\n autoCapitalize,\n inputMode,\n className: cn,\n placeholder,\n suffix: help ? (\n <HelpButton title={help.title}>{help.content}</HelpButton>\n ) : undefined,\n on_focus: handleFocus,\n on_blur: handleBlur,\n on_change: handleChange,\n disabled,\n ...htmlAttributes,\n stretch: Boolean(\n width !== undefined || fieldBlockContext?.composition\n ),\n inner_ref: innerRef,\n status: hasError ? 'error' : undefined,\n value: transformInstantly(value?.toString() ?? ''),\n }\n\n const textareaProps: TextareaProps = {\n keepPlaceholder,\n rows,\n autoresize_max_rows: autoresizeMaxRows,\n autoresize,\n characterCounter,\n }\n\n const inputProps: InputProps = {\n type: type,\n clear: clear,\n size: size,\n align: align,\n selectall: selectall,\n icon: leftIcon ?? rightIcon,\n icon_position: rightIcon && !leftIcon ? 'right' : undefined,\n submit_element: submitElement,\n keep_placeholder: keepPlaceholder,\n }\n\n const fieldBlockProps = {\n className: classnames('dnb-forms-field-string', className),\n forId: id,\n layout,\n label,\n labelDescription,\n info,\n warning,\n error,\n disabled,\n width:\n width === 'stretch' || fieldBlockContext?.composition\n ? width\n : undefined,\n contentWidth: width !== false ? width : undefined,\n ...pickSpacingProps(props),\n }\n\n return (\n <FieldBlock {...fieldBlockProps}>\n {multiline ? (\n <Textarea {...sharedProps} {...textareaProps} />\n ) : mask ? (\n <InputMasked {...sharedProps} {...inputProps} mask={mask} />\n ) : (\n <Input {...sharedProps} {...inputProps} />\n )}\n </FieldBlock>\n )\n}\n\nStringComponent._supportsSpacingProps = true\nexport default StringComponent\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,EAAEC,WAAW,QAAQ,OAAO;AAC/D,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,UAAU,EAAEC,KAAK,EAAEC,QAAQ,QAAQ,wBAAwB;AAEpE,OAAOC,WAAW,MAEX,oCAAoC;AAE3C,OAAOC,iBAAiB,MAAM,oCAAoC;AAClE,OAAOC,UAAU,MAAM,kBAAkB;AACzC,SAASC,aAAa,QAAQ,aAAa;AAC3C,SAASC,gBAAgB,QAAQ,mCAAmC;AACpE,SAASC,aAAa,QAAQ,qCAAqC;AASnE,OAAOC,eAAe,MAAM,6BAA6B;AACzD,OAAOC,cAAc,MAAM,4BAA4B;AAmDvD,SAASC,eAAeA,CAACC,KAAY,EAAE;EAAA,IAAAC,YAAA,EAAAC,eAAA;EACrC,MAAMC,iBAAiB,GAAGnB,UAAU,CAACQ,iBAAiB,CAAC;EACvD,MAAMY,YAAY,GAAGN,cAAc,CAAC,CAAC;EAErC,MAAMO,aAAa,GAAGR,eAAe,CAACG,KAAK,CAACM,IAAI,EAAEN,KAAK,CAACK,aAAa,EAAE;IACrEE,QAAQ,EAAEH,YAAY,CAACI,KAAK,CAACC,aAAa;IAC1CC,SAAS,EAAEN,YAAY,CAACO,WAAW,CAACC,cAAc;IAClDC,SAAS,EAAET,YAAY,CAACO,WAAW,CAACG,cAAc;IAClDC,OAAO,EAAEX,YAAY,CAACI,KAAK,CAACQ;EAC9B,CAAC,CAAC;EAEF,MAAMC,MAAM,GAAGhC,OAAO,CACpB;IAAA,IAAAiC,aAAA;IAAA,QAAAA,aAAA,GACElB,KAAK,CAACiB,MAAM,cAAAC,aAAA,cAAAA,aAAA,GAAI;MACdC,IAAI,EAAE,QAAQ;MACdT,SAAS,EAAEV,KAAK,CAACU,SAAS;MAC1BG,SAAS,EAAEb,KAAK,CAACa,SAAS;MAC1BE,OAAO,EAAEf,KAAK,CAACe;IACjB,CAAC;EAAA,GACH,CAACf,KAAK,CAACiB,MAAM,EAAEjB,KAAK,CAACU,SAAS,EAAEV,KAAK,CAACa,SAAS,EAAEb,KAAK,CAACe,OAAO,CAChE,CAAC;EACD,MAAMK,SAAS,GAAGlC,WAAW,CAC1BmC,KAA+C,IAAK;IAAA,IAAAC,MAAA,EAAAC,mBAAA,EAAAC,OAAA,EAAAC,OAAA;IACnD,IAAI,OAAOJ,KAAK,KAAK,QAAQ,EAAE;MAC7BA,KAAK,GAAG;QAAEK,KAAK,EAAEL;MAAM,CAAC;IAC1B;IACA,IAAI,EAAAC,MAAA,GAAAD,KAAK,cAAAC,MAAA,uBAALA,MAAA,CAAOI,KAAK,MAAK,EAAE,EAAE;MACvB,OAAO1B,KAAK,CAAC2B,UAAU;IACzB;IAEA,QAAAJ,mBAAA,IAAAC,OAAA,GAAOH,KAAK,cAAAG,OAAA,uBAALA,OAAA,CAAOI,YAAY,cAAAL,mBAAA,cAAAA,mBAAA,IAAAE,OAAA,GAAIJ,KAAK,cAAAI,OAAA,uBAALA,OAAA,CAAOC,KAAK;EAC5C,CAAC,EACD,CAAC1B,KAAK,CAAC2B,UAAU,CACnB,CAAC;EACD,MAAME,OAAO,GAAG3C,WAAW,CACzB,CAACwC,KAAa,EAAEP,IAAY,KAAK;IAC/B,IAAInB,KAAK,CAAC8B,IAAI,IAAIX,IAAI,KAAK,QAAQ,EAAE;MACnC,MAAMY,MAAM,GAAG,QAAQ;MACvB,IAAI,IAAIC,MAAM,CAAE,IAAGD,MAAO,IAAGA,MAAO,GAAE,CAAC,CAACE,IAAI,CAACP,KAAK,CAAC,EAAE;QACnDA,KAAK,GAAGA,KAAK,CAACQ,OAAO,CACnB,IAAIF,MAAM,CAAE,IAAGD,MAAO,KAAIA,MAAO,IAAG,EAAE,GAAG,CAAC,EAC1C,EACF,CAAC;QACDI,YAAY,CAACT,KAAK,CAAC;MACrB;IACF;IACA,OAAOA,KAAK;EACd,CAAC,EAED,CAAC1B,KAAK,CAAC8B,IAAI,CACb,CAAC;EACD,MAAMM,SAAS,GAAGpC,KAAK,CAACqC,cAAc;EACtC,MAAMA,cAAc,GAAGnD,WAAW,CAC/BwC,KAAa,IAAK;IACjB,IAAI1B,KAAK,CAACsC,UAAU,EAAE;MACpBZ,KAAK,GAAG9B,aAAa,CAAC2C,MAAM,CAACb,KAAK,IAAI,EAAE,CAAC,CAAC;IAC5C;IACA,OAAO,CAAAU,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAGV,KAAK,CAAC,KAAIA,KAAK;EACpC,CAAC,EACD,CAAC1B,KAAK,CAACsC,UAAU,EAAEF,SAAS,CAC9B,CAAC;EAED,MAAMI,aAAoB,GAAAC,aAAA,CAAAA,aAAA,KACrBzC,KAAK;IACRK,aAAa;IACbY,MAAM;IACNG,SAAS;IACTS,OAAO;IACPQ,cAAc;IACdK,KAAK,GAAAzC,YAAA,GACHD,KAAK,CAAC0C,KAAK,cAAAzC,YAAA,cAAAA,YAAA,GACVE,iBAAiB,aAAjBA,iBAAiB,eAAjBA,iBAAiB,CAAEwC,WAAW,GAAG,SAAS,GAAG;EAAQ,EACzD;EAED,MAAM;IACJC,EAAE;IACFC,IAAI;IACJC,SAAS;IAETC,QAAQ;IACRC,cAAc;IACdC,MAAM;IACNC,WAAW;IACXC,KAAK;IACLC,gBAAgB;IAChB1B,KAAK;IACL2B,IAAI;IACJC,OAAO;IACPC,KAAK;IACLC,QAAQ;IACRC,QAAQ;IACRC,IAAI;IACJC,SAAS;IACTC,IAAI;IACJC,QAAQ;IACRC,SAAS;IACTpB,KAAK;IACLqB,cAAc;IACdC,aAAa;IAGb7C,IAAI;IACJ8C,KAAK;IACLC,KAAK;IACLC,IAAI;IACJC,SAAS;IACTC,eAAe;IAGfC,IAAI;IAEJC,iBAAiB,GAAG,CAAC;IACrBC,UAAU,GAAG,IAAI;IACjBC,gBAAgB;IAIhBC,YAAY;IACZC,SAAS;IACTC,WAAW;IACXC,UAAU;IACVC,SAAS;IACTC,cAAc;IAGdC,WAAW;IACXC,UAAU;IACV9C;EACF,CAAC,GAAGzC,aAAa,CAAC8C,aAAa,CAAC;EAEhC,MAAM0C,kBAAkB,GAAGhG,WAAW,CACnCwC,KAAa,IAAM1B,KAAK,CAACsC,UAAU,GAAG1C,aAAa,CAAC8B,KAAK,CAAC,GAAGA,KAAM,EACpE,CAAC1B,KAAK,CAACsC,UAAU,CACnB,CAAC;EAED,MAAM6C,EAAE,GAAGhG,UAAU,CAAC,+BAA+B,EAAE6D,cAAc,CAAC;EAEtE,MAAMoC,WAAuC,GAAA3C,aAAA,CAAAA,aAAA;IAC3CG,EAAE;IACFC,IAAI;IACJ6B,YAAY;IACZE,WAAW;IACXC,UAAU;IACVC,SAAS;IACTC,cAAc;IACdJ,SAAS;IACT7B,SAAS,EAAEqC,EAAE;IACbjC,WAAW;IACXmC,MAAM,EAAE3B,IAAI,GACV3E,KAAA,CAAAuG,aAAA,CAAClG,UAAU;MAACmG,KAAK,EAAE7B,IAAI,CAAC6B;IAAM,GAAE7B,IAAI,CAAC8B,OAAoB,CAAC,GACxDC,SAAS;IACbC,QAAQ,EAAEV,WAAW;IACrBW,OAAO,EAAEV,UAAU;IACnBW,SAAS,EAAEzD,YAAY;IACvBsB;EAAQ,GACLM,cAAc;IACjB8B,OAAO,EAAEC,OAAO,CACdpD,KAAK,KAAK+C,SAAS,KAAItF,iBAAiB,aAAjBA,iBAAiB,uBAAjBA,iBAAiB,CAAEwC,WAAW,CACvD,CAAC;IACDoD,SAAS,EAAEhD,QAAQ;IACnBiD,MAAM,EAAExC,QAAQ,GAAG,OAAO,GAAGiC,SAAS;IACtC/D,KAAK,EAAEwD,kBAAkB,EAAAhF,eAAA,GAACwB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEuE,QAAQ,CAAC,CAAC,cAAA/F,eAAA,cAAAA,eAAA,GAAI,EAAE;EAAC,EACnD;EAED,MAAMgG,aAA4B,GAAG;IACnC7B,eAAe;IACfC,IAAI;IACJ6B,mBAAmB,EAAE5B,iBAAiB;IACtCC,UAAU;IACVC;EACF,CAAC;EAED,MAAM2B,UAAsB,GAAG;IAC7BjF,IAAI,EAAEA,IAAI;IACV8C,KAAK,EAAEA,KAAK;IACZE,IAAI,EAAEA,IAAI;IACVD,KAAK,EAAEA,KAAK;IACZE,SAAS,EAAEA,SAAS;IACpBiC,IAAI,EAAExC,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIC,SAAS;IAC3BwC,aAAa,EAAExC,SAAS,IAAI,CAACD,QAAQ,GAAG,OAAO,GAAG4B,SAAS;IAC3Dc,cAAc,EAAEvC,aAAa;IAC7BwC,gBAAgB,EAAEnC;EACpB,CAAC;EAED,MAAMoC,eAAe,GAAAhE,aAAA;IACnBK,SAAS,EAAE3D,UAAU,CAAC,wBAAwB,EAAE2D,SAAS,CAAC;IAC1D4D,KAAK,EAAE9D,EAAE;IACTK,MAAM;IACNE,KAAK;IACLC,gBAAgB;IAChBC,IAAI;IACJC,OAAO;IACPC,KAAK;IACLE,QAAQ;IACRf,KAAK,EACHA,KAAK,KAAK,SAAS,IAAIvC,iBAAiB,aAAjBA,iBAAiB,eAAjBA,iBAAiB,CAAEwC,WAAW,GACjDD,KAAK,GACL+C,SAAS;IACfkB,YAAY,EAAEjE,KAAK,KAAK,KAAK,GAAGA,KAAK,GAAG+C;EAAS,GAC9C9F,gBAAgB,CAACK,KAAK,CAAC,CAC3B;EAED,OACEjB,KAAA,CAAAuG,aAAA,CAAC7F,UAAU,EAAKgH,eAAe,EAC5B9C,SAAS,GACR5E,KAAA,CAAAuG,aAAA,CAAChG,QAAQ,EAAAsH,QAAA,KAAKxB,WAAW,EAAMc,aAAa,CAAG,CAAC,GAC9CtC,IAAI,GACN7E,KAAA,CAAAuG,aAAA,CAAC/F,WAAW,EAAAqH,QAAA,KAAKxB,WAAW,EAAMgB,UAAU;IAAExC,IAAI,EAAEA;EAAK,EAAE,CAAC,GAE5D7E,KAAA,CAAAuG,aAAA,CAACjG,KAAK,EAAAuH,QAAA,KAAKxB,WAAW,EAAMgB,UAAU,CAAG,CAEjC,CAAC;AAEjB;AAEArG,eAAe,CAAC8G,qBAAqB,GAAG,IAAI;AAC5C,eAAe9G,eAAe"}
|
|
1
|
+
{"version":3,"file":"String.js","names":["React","useContext","useMemo","useCallback","classnames","HelpButton","Input","Textarea","InputMasked","FieldBlockContext","FieldBlock","useFieldProps","pickSpacingProps","toCapitalized","useErrorMessage","useTranslation","StringComponent","props","_props$width","_value$toString","fieldBlockContext","translations","errorMessages","path","required","Field","errorRequired","minLength","StringField","errorMinLength","maxLength","errorMaxLength","pattern","errorPattern","schema","_props$schema","type","fromInput","event","_event","_event$cleanedValue","_event2","_event3","value","emptyValue","cleanedValue","toEvent","trim","spaces","RegExp","test","replace","handleChange","transform","transformValue","capitalize","String","preparedProps","_objectSpread","width","composition","id","name","className","innerRef","inputClassName","layout","placeholder","label","labelDescription","info","warning","error","hasError","disabled","help","multiline","mask","leftIcon","rightIcon","htmlAttributes","submitElement","clear","align","size","selectall","keepPlaceholder","rows","autoresizeMaxRows","autoresize","characterCounter","autoComplete","inputMode","autoCorrect","spellCheck","autoFocus","autoCapitalize","handleFocus","handleBlur","transformInstantly","cn","sharedProps","suffix","createElement","title","content","undefined","on_focus","on_blur","on_change","stretch","Boolean","inner_ref","status","toString","textareaProps","autoresize_max_rows","inputProps","icon","icon_position","submit_element","keep_placeholder","fieldBlockProps","forId","contentWidth","_extends","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/String/String.tsx"],"sourcesContent":["import React, { useContext, useMemo, useCallback } from 'react'\nimport classnames from 'classnames'\nimport { HelpButton, Input, Textarea } from '../../../../components'\nimport { InputProps } from '../../../../components/input/Input'\nimport InputMasked, {\n InputMaskedProps,\n} from '../../../../components/InputMasked'\nimport { TextareaProps } from '../../../../components/Textarea'\nimport FieldBlockContext from '../../FieldBlock/FieldBlockContext'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport { toCapitalized } from '../../../../shared/component-helper'\nimport type { TextCounterProps } from '../../../../fragments/TextCounter'\nimport type {\n FieldProps,\n FieldHelpProps,\n CustomErrorMessages,\n AllJSONSchemaVersions,\n FieldBlockWidth,\n} from '../../types'\nimport useErrorMessage from '../../hooks/useErrorMessage'\nimport useTranslation from '../../hooks/useTranslation'\n\ninterface ErrorMessages extends CustomErrorMessages {\n required?: string\n schema?: string\n minLength?: string\n maxLength?: string\n pattern?: string\n}\nexport type Props = FieldHelpProps &\n FieldProps<string, undefined | string, ErrorMessages> & {\n // - Shared props\n multiline?: boolean\n inputClassName?: string\n innerRef?: React.RefObject<HTMLInputElement | HTMLTextAreaElement>\n width?: FieldBlockWidth\n size?: InputProps['size'] | TextareaProps['size']\n keepPlaceholder?: InputProps['keep_placeholder']\n\n // - Validation\n minLength?: number\n maxLength?: number\n pattern?: string\n\n // - Input props\n type?: InputProps['type']\n align?: InputProps['align']\n selectall?: InputProps['selectall']\n clear?: boolean\n mask?: InputMaskedProps['mask']\n leftIcon?: string\n rightIcon?: string\n submitElement?: InputProps['submit_element']\n capitalize?: boolean\n trim?: boolean\n\n // - Textarea props\n rows?: TextareaProps['rows']\n autoresizeMaxRows?: TextareaProps['autoresize_max_rows']\n autoresize?: TextareaProps['autoresize']\n characterCounter?: Omit<TextCounterProps, 'text'> | number\n\n // - Html props\n autoComplete?: HTMLInputElement['autocomplete']\n inputMode?: React.HTMLAttributes<HTMLInputElement>['inputMode']\n autoCorrect?: React.HTMLAttributes<HTMLInputElement>['autoCorrect']\n spellCheck?: React.HTMLAttributes<HTMLInputElement>['spellCheck']\n autoFocus?: React.HTMLAttributes<HTMLInputElement>['autoFocus']\n autoCapitalize?: React.HTMLAttributes<HTMLInputElement>['autoCapitalize']\n }\n\nfunction StringComponent(props: Props) {\n const fieldBlockContext = useContext(FieldBlockContext)\n const translations = useTranslation()\n\n const errorMessages = useErrorMessage(props.path, props.errorMessages, {\n required: translations.Field.errorRequired,\n minLength: translations.StringField.errorMinLength,\n maxLength: translations.StringField.errorMaxLength,\n pattern: translations.Field.errorPattern,\n })\n\n const schema = useMemo<AllJSONSchemaVersions>(\n () =>\n props.schema ?? {\n type: 'string',\n minLength: props.minLength,\n maxLength: props.maxLength,\n pattern: props.pattern,\n },\n [props.schema, props.minLength, props.maxLength, props.pattern]\n )\n const fromInput = useCallback(\n (event: { value: string; cleanedValue?: string }) => {\n if (typeof event === 'string') {\n event = { value: event }\n }\n if (event?.value === '') {\n return props.emptyValue\n }\n // Cleaned value for masked\n return event?.cleanedValue ?? event?.value\n },\n [props.emptyValue]\n )\n const toEvent = useCallback(\n (value: string, type: string) => {\n if (props.trim && type === 'onBlur') {\n const spaces = '[\\\\s ]'\n if (new RegExp(`^${spaces}|${spaces}$`).test(value)) {\n value = value.replace(\n new RegExp(`^${spaces}+|${spaces}+$`, 'g'),\n ''\n )\n handleChange(value)\n }\n }\n return value\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.trim]\n )\n const transform = props.transformValue\n const transformValue = useCallback(\n (value: string) => {\n if (props.capitalize) {\n value = toCapitalized(String(value || ''))\n }\n return transform?.(value) || value\n },\n [props.capitalize, transform]\n )\n\n const preparedProps: Props = {\n ...props,\n errorMessages,\n schema,\n fromInput,\n toEvent,\n transformValue,\n width:\n props.width ??\n (fieldBlockContext?.composition ? 'stretch' : 'large'),\n }\n\n const {\n id,\n name,\n className,\n innerRef,\n inputClassName,\n layout,\n placeholder,\n label,\n labelDescription,\n value,\n info,\n warning,\n error,\n hasError,\n disabled,\n help,\n multiline,\n mask,\n leftIcon,\n rightIcon,\n width,\n htmlAttributes,\n submitElement,\n\n // - Input props\n type,\n clear,\n align,\n size,\n selectall,\n keepPlaceholder,\n\n // - Textarea props\n rows,\n autoresizeMaxRows = 6,\n autoresize = true,\n characterCounter,\n\n // - Html props\n autoComplete,\n inputMode,\n autoCorrect,\n spellCheck,\n autoFocus,\n autoCapitalize,\n\n // - Events\n handleFocus,\n handleBlur,\n handleChange,\n } = useFieldProps(preparedProps)\n\n const transformInstantly = useCallback(\n (value: string) => (props.capitalize ? toCapitalized(value) : value),\n [props.capitalize]\n )\n\n const cn = classnames('dnb-forms-field-string__input', inputClassName)\n\n const sharedProps: InputProps & TextareaProps = {\n id,\n name,\n autoComplete,\n autoCorrect,\n spellCheck,\n autoFocus,\n autoCapitalize,\n inputMode,\n className: cn,\n placeholder,\n suffix: help ? (\n <HelpButton title={help.title}>{help.content}</HelpButton>\n ) : undefined,\n on_focus: handleFocus,\n on_blur: handleBlur,\n on_change: handleChange,\n disabled,\n ...htmlAttributes,\n stretch: Boolean(\n width !== undefined || fieldBlockContext?.composition\n ),\n inner_ref: innerRef,\n status: hasError ? 'error' : undefined,\n value: transformInstantly(value?.toString() ?? ''),\n }\n\n const textareaProps: TextareaProps = {\n keepPlaceholder,\n rows,\n autoresize_max_rows: autoresizeMaxRows,\n autoresize,\n characterCounter,\n }\n\n const inputProps: InputProps = {\n type: type,\n clear: clear,\n size: size,\n align: align,\n selectall: selectall,\n icon: leftIcon ?? rightIcon,\n icon_position: rightIcon && !leftIcon ? 'right' : undefined,\n submit_element: submitElement,\n keep_placeholder: keepPlaceholder,\n }\n\n const fieldBlockProps = {\n className: classnames('dnb-forms-field-string', className),\n forId: id,\n layout,\n label,\n labelDescription,\n info,\n warning,\n error,\n disabled,\n width:\n width === 'stretch' || fieldBlockContext?.composition\n ? width\n : undefined,\n contentWidth: width !== false ? width : undefined,\n ...pickSpacingProps(props),\n }\n\n return (\n <FieldBlock {...fieldBlockProps}>\n {multiline ? (\n <Textarea {...sharedProps} {...textareaProps} />\n ) : mask ? (\n <InputMasked {...sharedProps} {...inputProps} mask={mask} />\n ) : (\n <Input {...sharedProps} {...inputProps} />\n )}\n </FieldBlock>\n )\n}\n\nStringComponent._supportsSpacingProps = true\nexport default StringComponent\n"],"mappings":"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"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { FieldProps } from '../../types';
|
|
2
|
-
export type
|
|
2
|
+
export type ToggleProps = {
|
|
3
3
|
valueOn: unknown;
|
|
4
4
|
valueOff: unknown;
|
|
5
5
|
variant?: 'checkbox' | 'checkbox-button' | 'button' | 'buttons';
|
|
6
6
|
textOn?: string;
|
|
7
7
|
textOff?: string;
|
|
8
8
|
};
|
|
9
|
+
export type Props = FieldProps<unknown> & ToggleProps;
|
|
9
10
|
declare function Toggle(props: Props): import("react/jsx-runtime").JSX.Element;
|
|
10
11
|
declare namespace Toggle {
|
|
11
12
|
var _supportsSpacingProps: boolean;
|
|
@@ -3,8 +3,8 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
|
3
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
4
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
5
5
|
import React, { useCallback } from 'react';
|
|
6
|
-
import { Checkbox, ToggleButton } from '../../../../components';
|
|
7
6
|
import classnames from 'classnames';
|
|
7
|
+
import { Checkbox, ToggleButton } from '../../../../components';
|
|
8
8
|
import ButtonRow from '../../Form/ButtonRow';
|
|
9
9
|
import FieldBlock from '../../FieldBlock';
|
|
10
10
|
import { useFieldProps } from '../../hooks';
|
|
@@ -76,7 +76,7 @@ function Toggle(props) {
|
|
|
76
76
|
checked: isOn,
|
|
77
77
|
disabled: disabled,
|
|
78
78
|
status: hasError ? 'error' : undefined,
|
|
79
|
-
|
|
79
|
+
onChange: handleCheckboxChange
|
|
80
80
|
}, htmlAttributes)));
|
|
81
81
|
case 'button':
|
|
82
82
|
return React.createElement(FieldBlock, fieldBlockProps, React.createElement(ToggleButton, _extends({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toggle.js","names":["React","useCallback","
|
|
1
|
+
{"version":3,"file":"Toggle.js","names":["React","useCallback","classnames","Checkbox","ToggleButton","ButtonRow","FieldBlock","useFieldProps","pickSpacingProps","ToggleButtonGroupContext","useTranslation","Toggle","props","translations","BooleanField","preparedProps","_objectSpread","errorMessages","id","className","valueOn","valueOff","layout","variant","disabled","label","labelDescription","textOn","textOff","value","info","warning","error","hasError","htmlAttributes","handleChange","handleCheckboxChange","_ref","checked","handleToggleChange","_ref2","cn","fieldBlockPropsWithoutLabel","forId","fieldBlockProps","isOn","isOff","createElement","_extends","status","undefined","onChange","text","yes","no","on_change","asFieldset","bottom","Provider","_supportsSpacingProps"],"sources":["../../../../../../src/extensions/forms/Field/Toggle/Toggle.tsx"],"sourcesContent":["import React, { useCallback } from 'react'\nimport classnames from 'classnames'\n\nimport { Checkbox, ToggleButton } from '../../../../components'\nimport ButtonRow from '../../Form/ButtonRow'\nimport FieldBlock from '../../FieldBlock'\nimport { useFieldProps } from '../../hooks'\nimport { FieldProps } from '../../types'\nimport { pickSpacingProps } from '../../../../components/flex/utils'\nimport ToggleButtonGroupContext from '../../../../components/toggle-button/ToggleButtonGroupContext'\nimport useTranslation from '../../hooks/useTranslation'\n\nexport type ToggleProps = {\n valueOn: unknown\n valueOff: unknown\n variant?: 'checkbox' | 'checkbox-button' | 'button' | 'buttons'\n textOn?: string\n textOff?: string\n}\n\nexport type Props = FieldProps<unknown> & ToggleProps\n\nfunction Toggle(props: Props) {\n const translations = useTranslation().BooleanField\n\n const preparedProps: Props = {\n ...props,\n errorMessages: props.errorMessages,\n }\n\n const {\n id,\n className,\n valueOn,\n valueOff,\n layout,\n variant,\n disabled,\n label,\n labelDescription,\n textOn,\n textOff,\n value,\n info,\n warning,\n error,\n hasError,\n htmlAttributes,\n handleChange,\n } = useFieldProps(preparedProps)\n\n const handleCheckboxChange = useCallback(\n ({ checked }) => {\n handleChange?.(checked ? valueOn : valueOff)\n },\n [handleChange, valueOn, valueOff]\n )\n const handleToggleChange = useCallback(\n ({ value }) => {\n handleChange?.(value === 'on' ? valueOn : valueOff)\n },\n [handleChange, valueOn, valueOff]\n )\n\n const cn = classnames('dnb-forms-field-toggle', className)\n\n const fieldBlockPropsWithoutLabel = {\n forId: id,\n className: cn,\n ...pickSpacingProps(props),\n info,\n warning,\n error,\n disabled,\n }\n\n const fieldBlockProps = {\n ...fieldBlockPropsWithoutLabel,\n layout,\n label,\n labelDescription,\n disabled,\n }\n\n const isOn = value === valueOn\n const isOff = value === valueOff\n\n switch (variant) {\n default:\n case 'checkbox':\n return (\n <FieldBlock {...fieldBlockPropsWithoutLabel}>\n <Checkbox\n id={id}\n className={cn}\n label={label}\n checked={isOn}\n disabled={disabled}\n status={hasError ? 'error' : undefined}\n onChange={handleCheckboxChange}\n {...htmlAttributes}\n />\n </FieldBlock>\n )\n case 'button':\n return (\n <FieldBlock {...fieldBlockProps}>\n <ToggleButton\n id={id}\n text={\n isOn\n ? textOn ?? translations.yes\n : textOff ?? translations.no\n }\n checked={isOn}\n disabled={disabled}\n status={hasError ? 'error' : undefined}\n value={value ? 'true' : 'false'}\n on_change={handleCheckboxChange}\n {...htmlAttributes}\n />\n </FieldBlock>\n )\n case 'buttons':\n return (\n <FieldBlock {...fieldBlockProps} asFieldset>\n <ButtonRow bottom=\"x-small\">\n <ToggleButtonGroupContext.Provider\n value={{\n value: isOn ? 'on' : isOff ? 'off' : null, // use \"null\" to reset the value\n onChange: handleToggleChange,\n status: hasError ? 'error' : undefined,\n disabled,\n }}\n >\n <ToggleButton\n text={textOn ?? translations.yes}\n value=\"on\"\n {...htmlAttributes}\n />\n <ToggleButton\n text={textOff ?? translations.no}\n value=\"off\"\n {...htmlAttributes}\n />\n </ToggleButtonGroupContext.Provider>\n </ButtonRow>\n </FieldBlock>\n )\n case 'checkbox-button':\n return (\n <FieldBlock {...fieldBlockProps}>\n <ToggleButton\n id={id}\n variant=\"checkbox\"\n text={\n isOn\n ? textOn ?? translations.yes\n : textOff ?? translations.no\n }\n checked={isOn}\n disabled={disabled}\n status={hasError ? 'error' : undefined}\n value={value ? 'true' : 'false'}\n on_change={handleCheckboxChange}\n {...htmlAttributes}\n />\n </FieldBlock>\n )\n }\n}\n\nToggle._supportsSpacingProps = true\nexport default Toggle\n"],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
export const ToggleProperties = {
|
|
2
|
+
valueOn: {
|
|
3
|
+
doc: 'Source data value when the toggle is in the "on-state" (varies based on UI variant).',
|
|
4
|
+
type: ['string', 'number', 'boolean'],
|
|
5
|
+
status: 'required'
|
|
6
|
+
},
|
|
7
|
+
valueOff: {
|
|
8
|
+
doc: 'Source data value when the toggle is in the "off-state".',
|
|
9
|
+
type: ['string', 'number', 'boolean'],
|
|
10
|
+
status: 'required'
|
|
11
|
+
},
|
|
12
|
+
textOn: {
|
|
13
|
+
doc: 'Text to show in the UI when in the "on-state".',
|
|
14
|
+
type: 'string',
|
|
15
|
+
status: 'optional'
|
|
16
|
+
},
|
|
17
|
+
textOff: {
|
|
18
|
+
doc: 'Text to show in the UI when in the "off-state".',
|
|
19
|
+
type: 'string',
|
|
20
|
+
status: 'optional'
|
|
21
|
+
},
|
|
22
|
+
variant: {
|
|
23
|
+
doc: 'Choice of input feature. Can be: `checkbox`, `button`, `checkbox-button` or `buttons`.',
|
|
24
|
+
type: 'string',
|
|
25
|
+
status: 'optional'
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
//# sourceMappingURL=ToggleDocs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToggleDocs.js","names":["ToggleProperties","valueOn","doc","type","status","valueOff","textOn","textOff","variant"],"sources":["../../../../../../src/extensions/forms/Field/Toggle/ToggleDocs.tsx"],"sourcesContent":["import { PropertiesTableProps } from '../../../../shared/types'\n\nexport const ToggleProperties: PropertiesTableProps = {\n valueOn: {\n doc: 'Source data value when the toggle is in the \"on-state\" (varies based on UI variant).',\n type: ['string', 'number', 'boolean'],\n status: 'required',\n },\n valueOff: {\n doc: 'Source data value when the toggle is in the \"off-state\".',\n type: ['string', 'number', 'boolean'],\n status: 'required',\n },\n textOn: {\n doc: 'Text to show in the UI when in the \"on-state\".',\n type: 'string',\n status: 'optional',\n },\n textOff: {\n doc: 'Text to show in the UI when in the \"off-state\".',\n type: 'string',\n status: 'optional',\n },\n variant: {\n doc: 'Choice of input feature. Can be: `checkbox`, `button`, `checkbox-button` or `buttons`.',\n type: 'string',\n status: 'optional',\n },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,gBAAsC,GAAG;EACpDC,OAAO,EAAE;IACPC,GAAG,EAAE,sFAAsF;IAC3FC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC;IACrCC,MAAM,EAAE;EACV,CAAC;EACDC,QAAQ,EAAE;IACRH,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC;IACrCC,MAAM,EAAE;EACV,CAAC;EACDE,MAAM,EAAE;IACNJ,GAAG,EAAE,gDAAgD;IACrDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,OAAO,EAAE;IACPL,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,OAAO,EAAE;IACPN,GAAG,EAAE,wFAAwF;IAC7FC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV;AACF,CAAC"}
|
|
@@ -2,6 +2,7 @@ export { default as Composition } from './Composition';
|
|
|
2
2
|
export { default as String } from './String';
|
|
3
3
|
export { default as Number } from './Number';
|
|
4
4
|
export { default as Toggle } from './Toggle';
|
|
5
|
+
export { default as Indeterminate } from './Indeterminate';
|
|
5
6
|
export { default as Boolean } from './Boolean';
|
|
6
7
|
export { default as Currency } from './Currency';
|
|
7
8
|
export { default as Date } from './Date';
|
|
@@ -2,6 +2,7 @@ export { default as Composition } from './Composition';
|
|
|
2
2
|
export { default as String } from './String';
|
|
3
3
|
export { default as Number } from './Number';
|
|
4
4
|
export { default as Toggle } from './Toggle';
|
|
5
|
+
export { default as Indeterminate } from './Indeterminate';
|
|
5
6
|
export { default as Boolean } from './Boolean';
|
|
6
7
|
export { default as Currency } from './Currency';
|
|
7
8
|
export { default as Date } from './Date';
|