@dnb/eufemia 10.21.0 → 10.22.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 +27 -0
- package/cjs/components/aria-live/useAriaLive.d.ts +1 -1
- package/cjs/components/breadcrumb/Breadcrumb.d.ts +2 -2
- package/cjs/components/breadcrumb/Breadcrumb.js +3 -3
- package/cjs/components/breadcrumb/Breadcrumb.js.map +1 -1
- package/cjs/components/breadcrumb/style/dnb-breadcrumb.css +7 -2
- package/cjs/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
- package/cjs/components/breadcrumb/style/dnb-breadcrumb.scss +10 -2
- package/cjs/components/button/Button.js +2 -2
- package/cjs/components/button/Button.js.map +1 -1
- package/cjs/components/button/style/themes/dnb-button-theme-sbanken.css +23 -11
- package/cjs/components/button/style/themes/dnb-button-theme-sbanken.min.css +3 -3
- package/cjs/components/button/style/themes/dnb-button-theme-sbanken.scss +30 -14
- package/cjs/components/card/style/dnb-card.css +11 -2
- package/cjs/components/card/style/dnb-card.min.css +1 -1
- package/cjs/components/card/style/dnb-card.scss +12 -2
- package/cjs/components/form-label/style/dnb-form-label.css +4 -1
- package/cjs/components/form-label/style/dnb-form-label.min.css +1 -1
- package/cjs/components/form-label/style/dnb-form-label.scss +5 -2
- package/cjs/components/global-status/GlobalStatus.d.ts +1 -1
- package/cjs/components/global-status/GlobalStatusProvider.d.ts +1 -1
- package/cjs/components/height-animation/HeightAnimationInstance.d.ts +5 -6
- package/cjs/components/height-animation/HeightAnimationInstance.js +12 -12
- package/cjs/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/cjs/components/height-animation/useHeightAnimation.js +11 -10
- package/cjs/components/height-animation/useHeightAnimation.js.map +1 -1
- package/cjs/components/input/Input.d.ts +1 -1
- package/cjs/components/pagination/InfinityScroller.d.ts +1 -1
- package/cjs/components/progress-indicator/ProgressIndicator.js +5 -7
- package/cjs/components/progress-indicator/ProgressIndicator.js.map +1 -1
- package/cjs/components/progress-indicator/ProgressIndicatorCircular.js +1 -1
- package/cjs/components/progress-indicator/ProgressIndicatorCircular.js.map +1 -1
- package/cjs/components/progress-indicator/ProgressIndicatorLinear.js +4 -4
- package/cjs/components/progress-indicator/ProgressIndicatorLinear.js.map +1 -1
- package/cjs/components/progress-indicator/style/dnb-progress-indicator.css +5 -2
- package/cjs/components/progress-indicator/style/dnb-progress-indicator.min.css +1 -1
- package/cjs/components/progress-indicator/style/dnb-progress-indicator.scss +5 -2
- package/cjs/components/space/SpacingHelper.d.ts +5 -5
- package/cjs/components/table/Table.js +2 -2
- package/cjs/components/table/Table.js.map +1 -1
- package/cjs/components/table/TableAccordion.js +40 -57
- package/cjs/components/table/TableAccordion.js.map +1 -1
- package/cjs/components/table/TableAccordionTd.d.ts +9 -0
- package/cjs/components/table/{TableAccordionContent.js → TableAccordionTd.js} +16 -54
- package/cjs/components/table/TableAccordionTd.js.map +1 -0
- package/cjs/components/table/TableAccordionTr.d.ts +13 -0
- package/cjs/components/table/TableAccordionTr.js +61 -0
- package/cjs/components/table/TableAccordionTr.js.map +1 -0
- package/cjs/components/table/TableContext.d.ts +2 -2
- package/cjs/components/table/TableContext.js +4 -3
- package/cjs/components/table/TableContext.js.map +1 -1
- package/cjs/components/table/TableTd.d.ts +2 -2
- package/cjs/components/table/TableTd.js +2 -2
- package/cjs/components/table/TableTd.js.map +1 -1
- package/cjs/components/table/TableTr.d.ts +6 -1
- package/cjs/components/table/TableTr.js +10 -5
- package/cjs/components/table/TableTr.js.map +1 -1
- package/cjs/components/table/style/dnb-table.css +84 -64
- package/cjs/components/table/style/dnb-table.min.css +1 -1
- package/cjs/components/table/style/dnb-table.scss +1 -1
- package/cjs/components/table/style/table-accordion.scss +62 -44
- package/cjs/components/table/style/table-td.scss +1 -1
- package/cjs/components/table/style/themes/dnb-table-theme-sbanken.css +10 -0
- package/cjs/components/table/style/themes/dnb-table-theme-sbanken.min.css +3 -1
- package/cjs/components/table/style/themes/dnb-table-theme-sbanken.scss +14 -0
- package/cjs/components/table/useTableAnimationHandler.d.ts +20 -0
- package/cjs/components/table/useTableAnimationHandler.js +73 -0
- package/cjs/components/table/useTableAnimationHandler.js.map +1 -0
- package/cjs/elements/blockquote/style/themes/dnb-blockquote-theme-sbanken.scss +1 -0
- package/cjs/extensions/forms/DataContext/Context.d.ts +1 -3
- package/cjs/extensions/forms/DataContext/Context.js.map +1 -1
- package/cjs/extensions/forms/DataContext/Provider/Provider.d.ts +1 -2
- package/cjs/extensions/forms/DataContext/Provider/Provider.js +1 -5
- package/cjs/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/FieldBlockContext.d.ts +1 -2
- package/cjs/extensions/forms/FieldBlock/FieldBlockContext.js.map +1 -1
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.css +2 -2
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/cjs/extensions/forms/FieldBlock/style/dnb-field-block.scss +2 -0
- package/cjs/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.css +6 -0
- package/cjs/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.min.css +1 -1
- package/cjs/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.scss +10 -2
- package/cjs/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/cjs/extensions/forms/Form/data-context/useData.js +1 -17
- package/cjs/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/cjs/extensions/forms/Form/data-context/useError.d.ts +2 -1
- package/cjs/extensions/forms/Form/data-context/useError.js +4 -2
- package/cjs/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/cjs/extensions/forms/Value/Number/Number.d.ts +2 -2
- package/cjs/extensions/forms/Value/Number/Number.js +1 -1
- package/cjs/extensions/forms/Value/Number/Number.js.map +1 -1
- package/cjs/extensions/forms/hooks/useDataValue.d.ts +4 -12
- package/cjs/extensions/forms/hooks/useDataValue.js +3 -3
- package/cjs/extensions/forms/hooks/useDataValue.js.map +1 -1
- package/cjs/extensions/forms/hooks/useMounted.d.ts +2 -0
- package/cjs/extensions/forms/hooks/useMounted.js +19 -0
- package/cjs/extensions/forms/hooks/useMounted.js.map +1 -0
- package/cjs/extensions/forms/style/dnb-forms.css +8 -2
- package/cjs/extensions/forms/style/dnb-forms.min.css +1 -1
- package/cjs/extensions/forms/types.d.ts +2 -0
- package/cjs/extensions/forms/types.js.map +1 -1
- package/cjs/extensions/payment-card/utils/CardDesigns.d.ts +96 -96
- package/cjs/fragments/drawer-list/DrawerListHelpers.d.ts +52 -52
- 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/Theme.d.ts +7 -1
- package/cjs/shared/Theme.js +20 -7
- package/cjs/shared/Theme.js.map +1 -1
- package/cjs/shared/helpers/debounce.d.ts +37 -0
- package/cjs/shared/helpers/debounce.js +92 -0
- package/cjs/shared/helpers/debounce.js.map +1 -0
- package/cjs/shared/helpers/useSharedState.d.ts +1 -0
- package/cjs/shared/helpers/useSharedState.js +52 -20
- package/cjs/shared/helpers/useSharedState.js.map +1 -1
- package/cjs/shared/helpers/withCamelCaseProps.d.ts +7 -0
- package/cjs/shared/helpers/withCamelCaseProps.js.map +1 -1
- package/cjs/shared/helpers.d.ts +1 -25
- package/cjs/shared/helpers.js +15 -37
- package/cjs/shared/helpers.js.map +1 -1
- package/cjs/shared/useTheme.d.ts +1 -0
- package/cjs/style/dnb-ui-components.css +119 -73
- package/cjs/style/dnb-ui-components.min.css +3 -3
- package/cjs/style/dnb-ui-extensions.css +8 -2
- package/cjs/style/dnb-ui-extensions.min.css +1 -1
- package/cjs/style/dnb-ui-forms.css +8 -2
- package/cjs/style/dnb-ui-forms.min.css +1 -1
- package/cjs/style/themes/theme-eiendom/eiendom-theme-components.css +127 -75
- package/cjs/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -3
- package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -2
- package/cjs/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
- package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -2
- package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-basis.css +1 -0
- package/cjs/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-components.css +160 -86
- package/cjs/style/themes/theme-sbanken/sbanken-theme-components.min.css +8 -6
- package/cjs/style/themes/theme-sbanken/sbanken-theme-elements.css +1 -0
- package/cjs/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.css +8 -2
- package/cjs/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.css +8 -2
- package/cjs/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/cjs/style/themes/theme-ui/prism/dnb-prism-theme.d.ts +3 -3
- package/cjs/style/themes/theme-ui/ui-theme-components.css +127 -75
- package/cjs/style/themes/theme-ui/ui-theme-components.min.css +3 -3
- package/cjs/style/themes/theme-ui/ui-theme-extensions.css +8 -2
- package/cjs/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
- package/cjs/style/themes/theme-ui/ui-theme-forms.css +8 -2
- package/cjs/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
- package/components/aria-live/useAriaLive.d.ts +1 -1
- package/components/breadcrumb/Breadcrumb.d.ts +2 -2
- package/components/breadcrumb/Breadcrumb.js +3 -3
- package/components/breadcrumb/Breadcrumb.js.map +1 -1
- package/components/breadcrumb/style/dnb-breadcrumb.css +7 -2
- package/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
- package/components/breadcrumb/style/dnb-breadcrumb.scss +10 -2
- package/components/button/Button.js +2 -2
- package/components/button/Button.js.map +1 -1
- package/components/button/style/themes/dnb-button-theme-sbanken.css +23 -11
- package/components/button/style/themes/dnb-button-theme-sbanken.min.css +3 -3
- package/components/button/style/themes/dnb-button-theme-sbanken.scss +30 -14
- package/components/card/style/dnb-card.css +11 -2
- package/components/card/style/dnb-card.min.css +1 -1
- package/components/card/style/dnb-card.scss +12 -2
- package/components/form-label/style/dnb-form-label.css +4 -1
- package/components/form-label/style/dnb-form-label.min.css +1 -1
- package/components/form-label/style/dnb-form-label.scss +5 -2
- package/components/global-status/GlobalStatus.d.ts +1 -1
- package/components/global-status/GlobalStatusProvider.d.ts +1 -1
- package/components/height-animation/HeightAnimationInstance.d.ts +5 -6
- package/components/height-animation/HeightAnimationInstance.js +12 -12
- package/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/components/height-animation/useHeightAnimation.js +11 -10
- package/components/height-animation/useHeightAnimation.js.map +1 -1
- package/components/input/Input.d.ts +1 -1
- package/components/pagination/InfinityScroller.d.ts +1 -1
- package/components/progress-indicator/ProgressIndicator.js +5 -7
- package/components/progress-indicator/ProgressIndicator.js.map +1 -1
- package/components/progress-indicator/ProgressIndicatorCircular.js +1 -1
- package/components/progress-indicator/ProgressIndicatorCircular.js.map +1 -1
- package/components/progress-indicator/ProgressIndicatorLinear.js +4 -4
- package/components/progress-indicator/ProgressIndicatorLinear.js.map +1 -1
- package/components/progress-indicator/style/dnb-progress-indicator.css +5 -2
- package/components/progress-indicator/style/dnb-progress-indicator.min.css +1 -1
- package/components/progress-indicator/style/dnb-progress-indicator.scss +5 -2
- package/components/space/SpacingHelper.d.ts +5 -5
- package/components/table/Table.js +1 -1
- package/components/table/Table.js.map +1 -1
- package/components/table/TableAccordion.js +38 -53
- package/components/table/TableAccordion.js.map +1 -1
- package/components/table/TableAccordionTd.d.ts +9 -0
- package/{es/components/table/TableAccordionContent.js → components/table/TableAccordionTd.js} +14 -48
- package/components/table/TableAccordionTd.js.map +1 -0
- package/components/table/TableAccordionTr.d.ts +13 -0
- package/components/table/TableAccordionTr.js +51 -0
- package/components/table/TableAccordionTr.js.map +1 -0
- package/components/table/TableContext.d.ts +2 -2
- package/components/table/TableContext.js +2 -2
- package/components/table/TableContext.js.map +1 -1
- package/components/table/TableTd.d.ts +2 -2
- package/components/table/TableTd.js +2 -2
- package/components/table/TableTd.js.map +1 -1
- package/components/table/TableTr.d.ts +6 -1
- package/components/table/TableTr.js +9 -4
- package/components/table/TableTr.js.map +1 -1
- package/components/table/style/dnb-table.css +84 -64
- package/components/table/style/dnb-table.min.css +1 -1
- package/components/table/style/dnb-table.scss +1 -1
- package/components/table/style/table-accordion.scss +62 -44
- package/components/table/style/table-td.scss +1 -1
- package/components/table/style/themes/dnb-table-theme-sbanken.css +10 -0
- package/components/table/style/themes/dnb-table-theme-sbanken.min.css +3 -1
- package/components/table/style/themes/dnb-table-theme-sbanken.scss +14 -0
- package/components/table/useTableAnimationHandler.d.ts +20 -0
- package/components/table/useTableAnimationHandler.js +63 -0
- package/components/table/useTableAnimationHandler.js.map +1 -0
- package/elements/blockquote/style/themes/dnb-blockquote-theme-sbanken.scss +1 -0
- package/es/components/aria-live/useAriaLive.d.ts +1 -1
- package/es/components/breadcrumb/Breadcrumb.d.ts +2 -2
- package/es/components/breadcrumb/Breadcrumb.js +3 -3
- package/es/components/breadcrumb/Breadcrumb.js.map +1 -1
- package/es/components/breadcrumb/style/dnb-breadcrumb.css +7 -2
- package/es/components/breadcrumb/style/dnb-breadcrumb.min.css +1 -1
- package/es/components/breadcrumb/style/dnb-breadcrumb.scss +10 -2
- package/es/components/button/Button.js +2 -2
- package/es/components/button/Button.js.map +1 -1
- package/es/components/button/style/themes/dnb-button-theme-sbanken.css +23 -11
- package/es/components/button/style/themes/dnb-button-theme-sbanken.min.css +3 -3
- package/es/components/button/style/themes/dnb-button-theme-sbanken.scss +30 -14
- package/es/components/card/style/dnb-card.css +11 -2
- package/es/components/card/style/dnb-card.min.css +1 -1
- package/es/components/card/style/dnb-card.scss +12 -2
- package/es/components/form-label/style/dnb-form-label.css +4 -1
- package/es/components/form-label/style/dnb-form-label.min.css +1 -1
- package/es/components/form-label/style/dnb-form-label.scss +5 -2
- package/es/components/global-status/GlobalStatus.d.ts +1 -1
- package/es/components/global-status/GlobalStatusProvider.d.ts +1 -1
- package/es/components/height-animation/HeightAnimationInstance.d.ts +5 -6
- package/es/components/height-animation/HeightAnimationInstance.js +12 -12
- package/es/components/height-animation/HeightAnimationInstance.js.map +1 -1
- package/es/components/height-animation/useHeightAnimation.js +11 -10
- package/es/components/height-animation/useHeightAnimation.js.map +1 -1
- package/es/components/input/Input.d.ts +1 -1
- package/es/components/pagination/InfinityScroller.d.ts +1 -1
- package/es/components/progress-indicator/ProgressIndicator.js +5 -7
- package/es/components/progress-indicator/ProgressIndicator.js.map +1 -1
- package/es/components/progress-indicator/ProgressIndicatorCircular.js +1 -1
- package/es/components/progress-indicator/ProgressIndicatorCircular.js.map +1 -1
- package/es/components/progress-indicator/ProgressIndicatorLinear.js +4 -4
- package/es/components/progress-indicator/ProgressIndicatorLinear.js.map +1 -1
- package/es/components/progress-indicator/style/dnb-progress-indicator.css +5 -2
- package/es/components/progress-indicator/style/dnb-progress-indicator.min.css +1 -1
- package/es/components/progress-indicator/style/dnb-progress-indicator.scss +5 -2
- package/es/components/space/SpacingHelper.d.ts +5 -5
- package/es/components/table/Table.js +1 -1
- package/es/components/table/Table.js.map +1 -1
- package/es/components/table/TableAccordion.js +38 -53
- package/es/components/table/TableAccordion.js.map +1 -1
- package/es/components/table/TableAccordionTd.d.ts +9 -0
- package/{components/table/TableAccordionContent.js → es/components/table/TableAccordionTd.js} +14 -49
- package/es/components/table/TableAccordionTd.js.map +1 -0
- package/es/components/table/TableAccordionTr.d.ts +13 -0
- package/es/components/table/TableAccordionTr.js +51 -0
- package/es/components/table/TableAccordionTr.js.map +1 -0
- package/es/components/table/TableContext.d.ts +2 -2
- package/es/components/table/TableContext.js +2 -2
- package/es/components/table/TableContext.js.map +1 -1
- package/es/components/table/TableTd.d.ts +2 -2
- package/es/components/table/TableTd.js +2 -2
- package/es/components/table/TableTd.js.map +1 -1
- package/es/components/table/TableTr.d.ts +6 -1
- package/es/components/table/TableTr.js +9 -4
- package/es/components/table/TableTr.js.map +1 -1
- package/es/components/table/style/dnb-table.css +84 -64
- package/es/components/table/style/dnb-table.min.css +1 -1
- package/es/components/table/style/dnb-table.scss +1 -1
- package/es/components/table/style/table-accordion.scss +62 -44
- package/es/components/table/style/table-td.scss +1 -1
- package/es/components/table/style/themes/dnb-table-theme-sbanken.css +10 -0
- package/es/components/table/style/themes/dnb-table-theme-sbanken.min.css +3 -1
- package/es/components/table/style/themes/dnb-table-theme-sbanken.scss +14 -0
- package/es/components/table/useTableAnimationHandler.d.ts +20 -0
- package/es/components/table/useTableAnimationHandler.js +62 -0
- package/es/components/table/useTableAnimationHandler.js.map +1 -0
- package/es/elements/blockquote/style/themes/dnb-blockquote-theme-sbanken.scss +1 -0
- package/es/extensions/forms/DataContext/Context.d.ts +1 -3
- package/es/extensions/forms/DataContext/Context.js.map +1 -1
- package/es/extensions/forms/DataContext/Provider/Provider.d.ts +1 -2
- package/es/extensions/forms/DataContext/Provider/Provider.js +1 -5
- package/es/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/es/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/es/extensions/forms/FieldBlock/FieldBlockContext.d.ts +1 -2
- package/es/extensions/forms/FieldBlock/FieldBlockContext.js.map +1 -1
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.css +2 -2
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/es/extensions/forms/FieldBlock/style/dnb-field-block.scss +2 -0
- package/es/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.css +6 -0
- package/es/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.min.css +1 -1
- package/es/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.scss +10 -2
- package/es/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/es/extensions/forms/Form/data-context/useData.js +2 -18
- package/es/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/es/extensions/forms/Form/data-context/useError.d.ts +2 -1
- package/es/extensions/forms/Form/data-context/useError.js +4 -2
- package/es/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/es/extensions/forms/Value/Number/Number.d.ts +2 -2
- package/es/extensions/forms/Value/Number/Number.js +1 -1
- package/es/extensions/forms/Value/Number/Number.js.map +1 -1
- package/es/extensions/forms/hooks/useDataValue.d.ts +4 -12
- package/es/extensions/forms/hooks/useDataValue.js +5 -5
- package/es/extensions/forms/hooks/useDataValue.js.map +1 -1
- package/es/extensions/forms/hooks/useMounted.d.ts +2 -0
- package/es/extensions/forms/hooks/useMounted.js +14 -0
- package/es/extensions/forms/hooks/useMounted.js.map +1 -0
- package/es/extensions/forms/style/dnb-forms.css +8 -2
- package/es/extensions/forms/style/dnb-forms.min.css +1 -1
- package/es/extensions/forms/types.d.ts +2 -0
- package/es/extensions/forms/types.js.map +1 -1
- package/es/extensions/payment-card/utils/CardDesigns.d.ts +96 -96
- package/es/fragments/drawer-list/DrawerListHelpers.d.ts +52 -52
- 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/Theme.d.ts +7 -1
- package/es/shared/Theme.js +20 -7
- package/es/shared/Theme.js.map +1 -1
- package/es/shared/helpers/debounce.d.ts +37 -0
- package/es/shared/helpers/debounce.js +76 -0
- package/es/shared/helpers/debounce.js.map +1 -0
- package/es/shared/helpers/useSharedState.d.ts +1 -0
- package/es/shared/helpers/useSharedState.js +49 -20
- package/es/shared/helpers/useSharedState.js.map +1 -1
- package/es/shared/helpers/withCamelCaseProps.d.ts +7 -0
- package/es/shared/helpers/withCamelCaseProps.js.map +1 -1
- package/es/shared/helpers.d.ts +1 -25
- package/es/shared/helpers.js +1 -29
- package/es/shared/helpers.js.map +1 -1
- package/es/shared/useTheme.d.ts +1 -0
- package/es/style/dnb-ui-components.css +119 -73
- package/es/style/dnb-ui-components.min.css +3 -3
- package/es/style/dnb-ui-extensions.css +8 -2
- package/es/style/dnb-ui-extensions.min.css +1 -1
- package/es/style/dnb-ui-forms.css +8 -2
- package/es/style/dnb-ui-forms.min.css +1 -1
- package/es/style/themes/theme-eiendom/eiendom-theme-components.css +127 -75
- package/es/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -3
- package/es/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -2
- package/es/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
- package/es/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -2
- package/es/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-basis.css +1 -0
- package/es/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-components.css +160 -86
- package/es/style/themes/theme-sbanken/sbanken-theme-components.min.css +8 -6
- package/es/style/themes/theme-sbanken/sbanken-theme-elements.css +1 -0
- package/es/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-extensions.css +8 -2
- package/es/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/es/style/themes/theme-sbanken/sbanken-theme-forms.css +8 -2
- package/es/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/es/style/themes/theme-ui/prism/dnb-prism-theme.d.ts +3 -3
- package/es/style/themes/theme-ui/ui-theme-components.css +127 -75
- package/es/style/themes/theme-ui/ui-theme-components.min.css +3 -3
- package/es/style/themes/theme-ui/ui-theme-extensions.css +8 -2
- package/es/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
- package/es/style/themes/theme-ui/ui-theme-forms.css +8 -2
- package/es/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
- 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 +1 -3
- package/extensions/forms/DataContext/Context.js.map +1 -1
- package/extensions/forms/DataContext/Provider/Provider.d.ts +1 -2
- package/extensions/forms/DataContext/Provider/Provider.js +1 -5
- package/extensions/forms/DataContext/Provider/Provider.js.map +1 -1
- package/extensions/forms/FieldBlock/FieldBlock.js.map +1 -1
- package/extensions/forms/FieldBlock/FieldBlockContext.d.ts +1 -2
- package/extensions/forms/FieldBlock/FieldBlockContext.js.map +1 -1
- package/extensions/forms/FieldBlock/style/dnb-field-block.css +2 -2
- package/extensions/forms/FieldBlock/style/dnb-field-block.min.css +1 -1
- package/extensions/forms/FieldBlock/style/dnb-field-block.scss +2 -0
- package/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.css +6 -0
- package/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.min.css +1 -1
- package/extensions/forms/Form/ButtonRow/style/dnb-form-button-row.scss +10 -2
- package/extensions/forms/Form/data-context/useData.d.ts +1 -1
- package/extensions/forms/Form/data-context/useData.js +2 -18
- package/extensions/forms/Form/data-context/useData.js.map +1 -1
- package/extensions/forms/Form/data-context/useError.d.ts +2 -1
- package/extensions/forms/Form/data-context/useError.js +4 -2
- package/extensions/forms/Form/data-context/useError.js.map +1 -1
- package/extensions/forms/Value/Number/Number.d.ts +2 -2
- package/extensions/forms/Value/Number/Number.js +1 -1
- package/extensions/forms/Value/Number/Number.js.map +1 -1
- package/extensions/forms/hooks/useDataValue.d.ts +4 -12
- package/extensions/forms/hooks/useDataValue.js +5 -5
- package/extensions/forms/hooks/useDataValue.js.map +1 -1
- package/extensions/forms/hooks/useMounted.d.ts +2 -0
- package/extensions/forms/hooks/useMounted.js +14 -0
- package/extensions/forms/hooks/useMounted.js.map +1 -0
- package/extensions/forms/style/dnb-forms.css +8 -2
- package/extensions/forms/style/dnb-forms.min.css +1 -1
- package/extensions/forms/types.d.ts +2 -0
- package/extensions/forms/types.js.map +1 -1
- package/extensions/payment-card/utils/CardDesigns.d.ts +96 -96
- package/fragments/drawer-list/DrawerListHelpers.d.ts +52 -52
- 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/Theme.d.ts +7 -1
- package/shared/Theme.js +20 -7
- package/shared/Theme.js.map +1 -1
- package/shared/helpers/debounce.d.ts +37 -0
- package/shared/helpers/debounce.js +83 -0
- package/shared/helpers/debounce.js.map +1 -0
- package/shared/helpers/useSharedState.d.ts +1 -0
- package/shared/helpers/useSharedState.js +49 -20
- package/shared/helpers/useSharedState.js.map +1 -1
- package/shared/helpers/withCamelCaseProps.d.ts +7 -0
- package/shared/helpers/withCamelCaseProps.js.map +1 -1
- package/shared/helpers.d.ts +1 -25
- package/shared/helpers.js +3 -36
- package/shared/helpers.js.map +1 -1
- package/shared/useTheme.d.ts +1 -0
- package/style/dnb-ui-components.css +119 -73
- package/style/dnb-ui-components.min.css +3 -3
- package/style/dnb-ui-extensions.css +8 -2
- package/style/dnb-ui-extensions.min.css +1 -1
- package/style/dnb-ui-forms.css +8 -2
- package/style/dnb-ui-forms.min.css +1 -1
- package/style/themes/theme-eiendom/eiendom-theme-components.css +127 -75
- package/style/themes/theme-eiendom/eiendom-theme-components.min.css +3 -3
- package/style/themes/theme-eiendom/eiendom-theme-extensions.css +8 -2
- package/style/themes/theme-eiendom/eiendom-theme-extensions.min.css +1 -1
- package/style/themes/theme-eiendom/eiendom-theme-forms.css +8 -2
- package/style/themes/theme-eiendom/eiendom-theme-forms.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-basis.css +1 -0
- package/style/themes/theme-sbanken/sbanken-theme-basis.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-components.css +160 -86
- package/style/themes/theme-sbanken/sbanken-theme-components.min.css +8 -6
- package/style/themes/theme-sbanken/sbanken-theme-elements.css +1 -0
- package/style/themes/theme-sbanken/sbanken-theme-elements.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-extensions.css +8 -2
- package/style/themes/theme-sbanken/sbanken-theme-extensions.min.css +1 -1
- package/style/themes/theme-sbanken/sbanken-theme-forms.css +8 -2
- package/style/themes/theme-sbanken/sbanken-theme-forms.min.css +1 -1
- package/style/themes/theme-ui/prism/dnb-prism-theme.d.ts +3 -3
- package/style/themes/theme-ui/ui-theme-components.css +127 -75
- package/style/themes/theme-ui/ui-theme-components.min.css +3 -3
- package/style/themes/theme-ui/ui-theme-extensions.css +8 -2
- package/style/themes/theme-ui/ui-theme-extensions.min.css +1 -1
- package/style/themes/theme-ui/ui-theme-forms.css +8 -2
- package/style/themes/theme-ui/ui-theme-forms.min.css +1 -1
- 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
- package/cjs/components/table/TableAccordionContent.d.ts +0 -18
- package/cjs/components/table/TableAccordionContent.js.map +0 -1
- package/components/table/TableAccordionContent.d.ts +0 -18
- package/components/table/TableAccordionContent.js.map +0 -1
- package/es/components/table/TableAccordionContent.d.ts +0 -18
- package/es/components/table/TableAccordionContent.js.map +0 -1
|
@@ -46,6 +46,10 @@
|
|
|
46
46
|
);
|
|
47
47
|
--button-secondary-border--disabled: var(--sb-color-gray-light);
|
|
48
48
|
|
|
49
|
+
// tertiary
|
|
50
|
+
--button-tertiary-color: var(--sb-color-violet);
|
|
51
|
+
--button-tertiary-border: var(--sb-color-violet);
|
|
52
|
+
|
|
49
53
|
border: none;
|
|
50
54
|
|
|
51
55
|
&#{&}--has-text#{&}--size-large {
|
|
@@ -167,7 +171,7 @@
|
|
|
167
171
|
--button-tertiary-text-bottom--icon: 0.5rem;
|
|
168
172
|
--button-tertiary-text-top--icon: 0;
|
|
169
173
|
|
|
170
|
-
color: var(--
|
|
174
|
+
color: var(--button-tertiary-color);
|
|
171
175
|
background-color: transparent;
|
|
172
176
|
|
|
173
177
|
.dnb-button__text::after {
|
|
@@ -219,7 +223,7 @@
|
|
|
219
223
|
@include hover() {
|
|
220
224
|
// underline
|
|
221
225
|
&:not(:focus-visible) .dnb-button__text::after {
|
|
222
|
-
color: var(--
|
|
226
|
+
color: var(--button-tertiary-border);
|
|
223
227
|
transition: none;
|
|
224
228
|
}
|
|
225
229
|
|
|
@@ -229,24 +233,36 @@
|
|
|
229
233
|
@include focus-tertiary();
|
|
230
234
|
}
|
|
231
235
|
}
|
|
232
|
-
|
|
233
|
-
@include active() {
|
|
234
|
-
// underline
|
|
235
|
-
.dnb-button__text::after {
|
|
236
|
-
color: var(--sb-color-violet);
|
|
237
|
-
}
|
|
238
|
-
}
|
|
239
|
-
|
|
240
236
|
@include focus-visible() {
|
|
241
237
|
@include focus-tertiary();
|
|
242
|
-
// underline
|
|
243
|
-
.dnb-button__text::after {
|
|
244
|
-
visibility: hidden;
|
|
245
|
-
}
|
|
246
238
|
}
|
|
247
239
|
|
|
248
240
|
&[disabled] {
|
|
249
241
|
color: var(--sb-color-gray-dark);
|
|
250
242
|
}
|
|
251
243
|
}
|
|
244
|
+
&--on-dark-background {
|
|
245
|
+
// primary
|
|
246
|
+
--button-primary-color: var(--sb-color-text);
|
|
247
|
+
--button-primary-color--hover: var(--sb-color-purple-alternative);
|
|
248
|
+
--button-primary-color--active: var(--sb-color-purple-alternative);
|
|
249
|
+
--button-primary-background: var(--sb-color-green);
|
|
250
|
+
--button-primary-background--hover: var(--sb-color-violet-light-2);
|
|
251
|
+
--button-primary-background--active: var(--sb-color-violet-light-3);
|
|
252
|
+
|
|
253
|
+
// secondary
|
|
254
|
+
--button-secondary-color: var(--sb-color-white);
|
|
255
|
+
--button-secondary-color--hover: var(--sb-color-purple-alternative);
|
|
256
|
+
--button-secondary-color--active: var(--sb-color-purple-alternative);
|
|
257
|
+
--button-secondary-background: transparent;
|
|
258
|
+
--button-secondary-background--hover: var(--sb-color-violet-light-2);
|
|
259
|
+
--button-secondary-background--active: var(--sb-color-violet-light-3);
|
|
260
|
+
--button-secondary-border--default: var(--sb-color-green);
|
|
261
|
+
--button-secondary-border--hover: var(--sb-color-violet-light);
|
|
262
|
+
--button-secondary-border--active: var(--sb-color-violet-light);
|
|
263
|
+
|
|
264
|
+
// tertiary
|
|
265
|
+
--button-tertiary-color: var(--sb-color-white);
|
|
266
|
+
--button-tertiary-border: var(--sb-color-green);
|
|
267
|
+
}
|
|
252
268
|
}
|
|
@@ -13,8 +13,17 @@
|
|
|
13
13
|
}
|
|
14
14
|
@media screen and (max-width: 40em) {
|
|
15
15
|
.dnb-card.dnb-section::before {
|
|
16
|
-
left:
|
|
17
|
-
|
|
16
|
+
left: var(--left);
|
|
17
|
+
--outline: 99vw 0 0 0 var(--background-color),
|
|
18
|
+
198vw 0 0 0 var(--background-color),
|
|
19
|
+
297vw 0 0 0 var(--background-color),
|
|
20
|
+
396vw 0 0 0 var(--background-color),
|
|
21
|
+
0 var(--outline-width) 0 0 var(--outline-color),
|
|
22
|
+
99vw var(--outline-width) 0 0 var(--outline-color),
|
|
23
|
+
0 calc(var(--outline-width) * -1) 0 0 var(--outline-color),
|
|
24
|
+
99vw calc(var(--outline-width) * -1) 0 0 var(--outline-color),
|
|
25
|
+
198vw var(--outline-width) 0 0 var(--outline-color),
|
|
26
|
+
198vw calc(var(--outline-width) * -1) 0 0 var(--outline-color);
|
|
18
27
|
}
|
|
19
28
|
}
|
|
20
29
|
@media screen and (max-width: 40em) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card.dnb-section{background-color:var(--background-color)}@media screen and (max-width:40em){.dnb-card.dnb-section:before{left
|
|
1
|
+
.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card.dnb-section{background-color:var(--background-color)}@media screen and (max-width:40em){.dnb-card.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card:before{top:var(--outline-width);z-index:0}}
|
|
@@ -16,8 +16,18 @@
|
|
|
16
16
|
|
|
17
17
|
@include allBelow(small) {
|
|
18
18
|
&.dnb-section::before {
|
|
19
|
-
left:
|
|
20
|
-
|
|
19
|
+
left: var(--left);
|
|
20
|
+
|
|
21
|
+
--outline: 99vw 0 0 0 var(--background-color),
|
|
22
|
+
198vw 0 0 0 var(--background-color),
|
|
23
|
+
297vw 0 0 0 var(--background-color),
|
|
24
|
+
396vw 0 0 0 var(--background-color),
|
|
25
|
+
0 var(--outline-width) 0 0 var(--outline-color),
|
|
26
|
+
99vw var(--outline-width) 0 0 var(--outline-color),
|
|
27
|
+
0 calc(var(--outline-width) * -1) 0 0 var(--outline-color),
|
|
28
|
+
99vw calc(var(--outline-width) * -1) 0 0 var(--outline-color),
|
|
29
|
+
198vw var(--outline-width) 0 0 var(--outline-color),
|
|
30
|
+
198vw calc(var(--outline-width) * -1) 0 0 var(--outline-color);
|
|
21
31
|
}
|
|
22
32
|
}
|
|
23
33
|
|
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
*/
|
|
5
5
|
.dnb-form-label {
|
|
6
6
|
display: inline-block;
|
|
7
|
-
width: auto;
|
|
8
7
|
padding: 0;
|
|
9
8
|
text-align: left;
|
|
10
9
|
vertical-align: baseline;
|
|
@@ -13,6 +12,10 @@
|
|
|
13
12
|
font-size: var(--font-size-basis);
|
|
14
13
|
color: inherit;
|
|
15
14
|
}
|
|
15
|
+
.dnb-form-label[for] {
|
|
16
|
+
width: -moz-fit-content;
|
|
17
|
+
width: fit-content;
|
|
18
|
+
}
|
|
16
19
|
.dnb-form-label--vertical {
|
|
17
20
|
display: block;
|
|
18
21
|
margin-right: 0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.dnb-form-label{color:inherit;display:inline-block;font-size:var(--font-size-basis);padding:0;text-align:left;vertical-align:baseline;white-space:pre-wrap;
|
|
1
|
+
.dnb-form-label{color:inherit;display:inline-block;font-size:var(--font-size-basis);padding:0;text-align:left;vertical-align:baseline;white-space:pre-wrap;word-break:normal}.dnb-form-label[for]{width:-moz-fit-content;width:fit-content}.dnb-form-label--vertical{display:block;margin-bottom:.5rem;margin-right:0}.dnb-form-label[disabled]{cursor:not-allowed}legend.dnb-form-label{display:inline-block}
|
|
@@ -53,7 +53,7 @@ export interface GlobalStatusProps
|
|
|
53
53
|
*/
|
|
54
54
|
icon_size?: IconSize;
|
|
55
55
|
/**
|
|
56
|
-
* Defines the visual appearance of the status. There are
|
|
56
|
+
* Defines the visual appearance of the status. There are four main statuses `error`, `warning`, `info` and `success`. The default status is `error`.
|
|
57
57
|
*/
|
|
58
58
|
state?: GlobalStatusState;
|
|
59
59
|
/**
|
|
@@ -32,6 +32,11 @@ export default class HeightAnimation {
|
|
|
32
32
|
duration?: number;
|
|
33
33
|
isAnimating: boolean;
|
|
34
34
|
__currentHeight: number;
|
|
35
|
+
firstPaintStyle: {
|
|
36
|
+
visibility: string;
|
|
37
|
+
opacity: string;
|
|
38
|
+
height: string;
|
|
39
|
+
};
|
|
35
40
|
constructor(opts?: HeightAnimationOptions);
|
|
36
41
|
callAnimationStart(): void;
|
|
37
42
|
callAnimationEnd(): void;
|
|
@@ -45,12 +50,6 @@ export default class HeightAnimation {
|
|
|
45
50
|
setAsOpen(): void;
|
|
46
51
|
setAsClosed(): void;
|
|
47
52
|
getHeight(): number;
|
|
48
|
-
firstPaintStyle(): {
|
|
49
|
-
position: string;
|
|
50
|
-
visibility: string;
|
|
51
|
-
opacity: string;
|
|
52
|
-
height: string;
|
|
53
|
-
};
|
|
54
53
|
getUnknownHeight(): number;
|
|
55
54
|
onStart(fn: HeightAnimationOnStartCallback): void;
|
|
56
55
|
onEnd(fn: HeightAnimationOnEndCallback): void;
|
|
@@ -30,6 +30,11 @@ class HeightAnimation {
|
|
|
30
30
|
_defineProperty(this, "duration", 0);
|
|
31
31
|
_defineProperty(this, "isAnimating", void 0);
|
|
32
32
|
_defineProperty(this, "__currentHeight", void 0);
|
|
33
|
+
_defineProperty(this, "firstPaintStyle", {
|
|
34
|
+
visibility: 'hidden',
|
|
35
|
+
opacity: '0',
|
|
36
|
+
height: 'auto'
|
|
37
|
+
});
|
|
33
38
|
this.isInBrowser = typeof window !== 'undefined';
|
|
34
39
|
this.setState('init');
|
|
35
40
|
this.setOptions(opts);
|
|
@@ -135,14 +140,6 @@ class HeightAnimation {
|
|
|
135
140
|
var _this$elem4;
|
|
136
141
|
return parseFloat(String((_this$elem4 = this.elem) === null || _this$elem4 === void 0 ? void 0 : _this$elem4.clientHeight)) || null;
|
|
137
142
|
}
|
|
138
|
-
firstPaintStyle() {
|
|
139
|
-
return {
|
|
140
|
-
position: 'absolute',
|
|
141
|
-
visibility: 'hidden',
|
|
142
|
-
opacity: '0',
|
|
143
|
-
height: 'auto'
|
|
144
|
-
};
|
|
145
|
-
}
|
|
146
143
|
getUnknownHeight() {
|
|
147
144
|
var _this$elem$parentNode, _clonedElem$parentNod;
|
|
148
145
|
if (!this.elem) {
|
|
@@ -151,12 +148,14 @@ class HeightAnimation {
|
|
|
151
148
|
if (this.isAnimating && typeof this.__currentHeight !== 'undefined') {
|
|
152
149
|
return this.__currentHeight;
|
|
153
150
|
}
|
|
151
|
+
const width = this.elem.clientWidth;
|
|
154
152
|
const clonedElem = this.elem.cloneNode(true);
|
|
155
153
|
(_this$elem$parentNode = this.elem.parentNode) === null || _this$elem$parentNode === void 0 ? void 0 : _this$elem$parentNode.insertBefore(clonedElem, this.elem.nextSibling);
|
|
156
154
|
for (const key in this.firstPaintStyle) {
|
|
157
155
|
clonedElem.style[key] = this.firstPaintStyle[key];
|
|
158
156
|
}
|
|
159
|
-
clonedElem.style.
|
|
157
|
+
clonedElem.style.width = width ? `${String(width)}px` : 'auto';
|
|
158
|
+
clonedElem.style.position = 'absolute';
|
|
160
159
|
const height = parseFloat(String(clonedElem.clientHeight)) || parseFloat(clonedElem.getAttribute('data-height')) || null;
|
|
161
160
|
(_clonedElem$parentNod = clonedElem.parentNode) === null || _clonedElem$parentNod === void 0 ? void 0 : _clonedElem$parentNod.removeChild(clonedElem);
|
|
162
161
|
if (height) {
|
|
@@ -178,6 +177,7 @@ class HeightAnimation {
|
|
|
178
177
|
if (opts.animate === false) {
|
|
179
178
|
return;
|
|
180
179
|
}
|
|
180
|
+
this.stop();
|
|
181
181
|
this.isAnimating = true;
|
|
182
182
|
this.reqId1 = window.requestAnimationFrame(() => {
|
|
183
183
|
if (!this.elem) {
|
|
@@ -209,7 +209,7 @@ class HeightAnimation {
|
|
|
209
209
|
this.callAnimationStart();
|
|
210
210
|
const toHeight = this.getUnknownHeight();
|
|
211
211
|
this.addEndEvent(e => {
|
|
212
|
-
if (e.target === e.currentTarget) {
|
|
212
|
+
if (e.target === e.currentTarget || !e.currentTarget) {
|
|
213
213
|
this.setState('opened');
|
|
214
214
|
this.readjust();
|
|
215
215
|
}
|
|
@@ -225,7 +225,7 @@ class HeightAnimation {
|
|
|
225
225
|
this.callAnimationStart();
|
|
226
226
|
const fromHeight = this.getHeight();
|
|
227
227
|
this.addEndEvent(e => {
|
|
228
|
-
if (e.target === e.currentTarget) {
|
|
228
|
+
if (e.target === e.currentTarget || !e.currentTarget) {
|
|
229
229
|
if (this.elem) {
|
|
230
230
|
this.elem.style.visibility = 'hidden';
|
|
231
231
|
this.elem.style.overflowY = 'clip';
|
|
@@ -256,7 +256,7 @@ class HeightAnimation {
|
|
|
256
256
|
this.setState('adjusting');
|
|
257
257
|
this.callAnimationStart();
|
|
258
258
|
this.addEndEvent(e => {
|
|
259
|
-
if (this.state === 'adjusting' && e.target === e.currentTarget) {
|
|
259
|
+
if (this.state === 'adjusting' && (e.target === e.currentTarget || !e.currentTarget)) {
|
|
260
260
|
if (this.elem) {
|
|
261
261
|
this.elem.style.height = 'auto';
|
|
262
262
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeightAnimationInstance.js","names":["HeightAnimation","constructor","opts","arguments","length","undefined","_defineProperty","animate","isInBrowser","window","setState","setOptions","callAnimationStart","startTime","Date","now","firstTime","onStartStack","forEach","fn","state","callAnimationEnd","isAnimating","__currentHeight","removeEndEvents","onEndStack","addEndEvent","listener","_this$elem","_this$elem$addEventLi","handleTransitionEnd","e","canFinish","delay","duration","timeouts","push","setTimeout","events","elem","addEventListener","call","_this$elem2","_this$elem2$removeEve","removeEventListener","setElement","_this$elem3","_globalThis$animation","document","createElement","String","nodeName","toLowerCase","parentElement","globalThis","animationDuration","parseFloat","getComputedStyle","transitionDuration","Object","freeze","_objectSpread","getOptions","remove","stop","setAsOpen","setAsClosed","getHeight","_this$elem4","clientHeight","firstPaintStyle","position","visibility","opacity","height","getUnknownHeight","_this$elem$parentNode","_clonedElem$parentNod","clonedElem","cloneNode","parentNode","insertBefore","nextSibling","key","style","getAttribute","removeChild","onStart","onEnd","start","fromHeight","toHeight","requestAnimationFrame","reqId1","reqId2","id","clearTimeout","cancelAnimationFrame","open","shouldBypassAnimation","target","currentTarget","readjust","close","overflowY","adjustTo","endHeight","newHeight","_globalThis$animation2","Boolean","_globalThis$bypassTim","IS_TEST","bypassTime","exports","default"],"sources":["../../../../src/components/height-animation/HeightAnimationInstance.ts"],"sourcesContent":["export type HeightAnimationOnStartStates =\n | 'opening'\n | 'closing'\n | 'adjusting'\nexport type HeightAnimationOnEndStates = 'opened' | 'closed' | 'adjusted'\nexport type HeightAnimationStates =\n | HeightAnimationOnStartStates\n | HeightAnimationOnEndStates\n | 'init'\nexport type HeightAnimationOptions = {\n animate?: boolean\n}\nexport type HeightAnimationOnStartCallback = (\n state: HeightAnimationStates\n) => void\nexport type HeightAnimationOnEndCallback = (\n state: HeightAnimationStates\n) => void\nexport type HeightAnimationOnStartStack =\n Array<HeightAnimationOnStartCallback>\nexport type HeightAnimationOnEndStack = Array<HeightAnimationOnEndCallback>\nexport type HeightAnimationEventListener = (e: Event) => void\nexport type HeightAnimationEvents = Array<HeightAnimationEventListener>\nexport type HeightAnimationElement = HTMLElement\nexport type HeightAnimationContainer = HTMLElement\nexport type HeightAnimationFromHeight = number\nexport type HeightAnimationToHeight = number\n\nexport default class HeightAnimation {\n private state: Readonly<HeightAnimationStates>\n isInBrowser: boolean\n onStartStack: HeightAnimationOnStartStack = []\n onEndStack: HeightAnimationOnEndStack = []\n events: HeightAnimationEvents = []\n opts: HeightAnimationOptions = { animate: true }\n elem: HeightAnimationElement\n reqId1: number\n reqId2: number\n resizeTimeout: NodeJS.Timeout\n timeouts: NodeJS.Timeout[] = []\n firstTime?: number = 0\n startTime?: number = 0\n duration?: number = 0\n isAnimating: boolean\n __currentHeight: number\n\n constructor(opts: HeightAnimationOptions = {}) {\n this.isInBrowser = typeof window !== 'undefined'\n this.setState('init')\n this.setOptions(opts)\n }\n\n callAnimationStart() {\n this.startTime = Date.now()\n if (!this.firstTime) {\n this.firstTime = this.startTime\n }\n if (this.onStartStack) {\n this.onStartStack.forEach((fn) => {\n if (typeof fn === 'function') {\n fn(this.state)\n }\n })\n }\n }\n callAnimationEnd() {\n this.isAnimating = false\n\n if (this.state !== 'opened') {\n delete this.__currentHeight\n }\n\n this.removeEndEvents()\n\n if (this.onEndStack) {\n this.onEndStack.forEach((fn) => {\n if (typeof fn === 'function') {\n fn(this.state)\n }\n })\n }\n }\n addEndEvent(listener: HeightAnimationEventListener) {\n this.removeEndEvents() // also, remove events on every open (but not on close!)\n\n const handleTransitionEnd = (e) => {\n if (this.canFinish()) {\n listener(e)\n } else {\n const delay = this.duration - (Date.now() - this.startTime)\n\n if (delay === -1) {\n listener(e)\n } else {\n this.timeouts.push(setTimeout(() => listener(e), delay))\n }\n }\n }\n\n this.events.push(handleTransitionEnd)\n this.elem?.addEventListener?.('transitionend', handleTransitionEnd)\n }\n removeEndEvents() {\n this.events.forEach((listener) => {\n this.elem?.removeEventListener?.('transitionend', listener)\n })\n this.events = []\n }\n\n // Public methods\n setElement(elem: HeightAnimationElement) {\n this.elem =\n elem ||\n (typeof document !== 'undefined' && document.createElement('div'))\n\n // TODO: remove when responsive tables are supported\n if (String(this.elem?.nodeName).toLowerCase() === 'td') {\n this.elem = this.elem.parentElement\n }\n\n this.duration =\n globalThis.animationDuration ??\n (parseFloat(window.getComputedStyle(this.elem).transitionDuration) *\n 1000 ||\n 400) // The default duration\n }\n setState(state: HeightAnimationStates) {\n this.state = Object.freeze(state)\n }\n setOptions(opts: HeightAnimationOptions) {\n this.opts = Object.freeze({ ...this.opts, ...opts })\n }\n getOptions() {\n return this.opts\n }\n remove() {\n this.stop()\n this.removeEndEvents()\n this.setState('init')\n this.isAnimating = false\n this.onEndStack = []\n this.onStartStack = []\n this.__currentHeight = undefined\n this.elem = undefined\n }\n setAsOpen() {\n if (this.state === 'opened') {\n return\n }\n this.setState('opening')\n this.callAnimationStart()\n this.setState('opened')\n this.callAnimationEnd()\n }\n setAsClosed() {\n if (this.state === 'closed') {\n return\n }\n this.setState('closing')\n this.callAnimationStart()\n this.setState('closed')\n this.callAnimationEnd()\n }\n getHeight() {\n return parseFloat(String(this.elem?.clientHeight)) || null\n }\n firstPaintStyle() {\n return {\n position: 'absolute',\n visibility: 'hidden',\n opacity: '0', // prevents before/after elements to be visible\n height: 'auto',\n }\n }\n getUnknownHeight() {\n if (!this.elem) {\n return null\n }\n\n if (this.isAnimating && typeof this.__currentHeight !== 'undefined') {\n return this.__currentHeight\n }\n\n const clonedElem = this.elem.cloneNode(true) as HTMLElement\n this.elem.parentNode?.insertBefore(clonedElem, this.elem.nextSibling)\n\n for (const key in this.firstPaintStyle) {\n clonedElem.style[key] = this.firstPaintStyle[key]\n }\n clonedElem.style.height = 'auto'\n\n const height =\n parseFloat(String(clonedElem.clientHeight)) ||\n // data-height is used for mockup testing with \"mockHeight\"\n parseFloat(clonedElem.getAttribute('data-height')) ||\n null\n\n clonedElem.parentNode?.removeChild(clonedElem)\n\n if (height) {\n this.__currentHeight = height\n }\n\n return height\n }\n onStart(fn: HeightAnimationOnStartCallback) {\n this.onStartStack.push(fn)\n }\n onEnd(fn: HeightAnimationOnEndCallback) {\n this.onEndStack.push(fn)\n }\n start(\n fromHeight: HeightAnimationFromHeight,\n toHeight: HeightAnimationToHeight\n ) {\n if (\n !this.elem ||\n !(\n this.isInBrowser &&\n typeof window.requestAnimationFrame === 'function'\n )\n ) {\n return\n }\n\n const opts = this.getOptions()\n if (opts.animate === false) {\n return\n }\n\n this.isAnimating = true\n\n // make the animation\n this.reqId1 = window.requestAnimationFrame(() => {\n if (!this.elem) {\n return\n }\n\n this.elem.style.height = `${fromHeight}px`\n\n this.reqId2 = window.requestAnimationFrame(() => {\n if (!this.elem) {\n return\n }\n\n this.elem.style.height = `${toHeight}px`\n })\n })\n }\n stop() {\n this.timeouts.forEach((id) => clearTimeout(id))\n this.timeouts = []\n\n if (\n this.isInBrowser &&\n typeof window.requestAnimationFrame === 'function'\n ) {\n window.cancelAnimationFrame(this.reqId1)\n window.cancelAnimationFrame(this.reqId2)\n }\n }\n open() {\n if (\n this.state === 'opened' ||\n this.state === 'opening' ||\n this.shouldBypassAnimation()\n ) {\n this.setAsOpen()\n return\n }\n\n this.setState('opening')\n this.callAnimationStart()\n\n const toHeight = this.getUnknownHeight()\n\n this.addEndEvent((e) => {\n if (e.target === e.currentTarget) {\n this.setState('opened')\n this.readjust()\n }\n })\n\n this.start(0, toHeight)\n }\n close() {\n if (\n this.state === 'closed' ||\n this.state === 'closing' ||\n this.shouldBypassAnimation()\n ) {\n this.setAsClosed()\n return\n }\n\n this.setState('closing')\n this.callAnimationStart()\n\n const fromHeight = this.getHeight()\n\n this.addEndEvent((e) => {\n if (e.target === e.currentTarget) {\n if (this.elem) {\n this.elem.style.visibility = 'hidden'\n this.elem.style.overflowY = 'clip'\n }\n this.setState('closed')\n this.callAnimationEnd()\n }\n })\n\n this.start(fromHeight, 0)\n }\n adjustTo(\n fromHeight: HeightAnimationFromHeight = null,\n toHeight: HeightAnimationToHeight = null\n ) {\n const opts = this.getOptions()\n\n if (\n !this.elem ||\n opts.animate === false ||\n this.state === 'opening' ||\n this.state === 'closing'\n ) {\n return\n }\n\n if (fromHeight === 0 || fromHeight === null) {\n fromHeight = this.getHeight()\n }\n if (toHeight === null) {\n toHeight = this.getUnknownHeight()\n }\n\n if (fromHeight === toHeight) {\n this.setState('adjusted')\n return\n }\n\n this.setState('adjusting')\n this.callAnimationStart()\n\n this.addEndEvent((e) => {\n if (this.state === 'adjusting' && e.target === e.currentTarget) {\n if (this.elem) {\n this.elem.style.height = 'auto'\n }\n this.setState('adjusted')\n this.callAnimationEnd()\n }\n })\n\n this.start(fromHeight, toHeight)\n }\n readjust() {\n const endHeight = this.getHeight()\n\n if (this.elem) {\n this.elem.style.height = 'auto'\n }\n\n this.__currentHeight = undefined\n const newHeight = this.getUnknownHeight()\n\n // If the height has changed during the animation, we need to adjust it\n if (endHeight !== newHeight) {\n this.adjustTo(endHeight, newHeight)\n } else {\n this.callAnimationEnd()\n }\n }\n /**\n * Determines whether the animation can finish.\n * Check for certain states and if the time passed is too short.\n * With a so short first state change, we do not call animation end.\n */\n canFinish() {\n return Boolean(\n this.startTime &&\n Date.now() - this.startTime >\n (globalThis.animationDuration ?? this.duration)\n )\n }\n /**\n * Determines whether the animation should be bypassed.\n * Check for certain states and if the time passed is too short to be correct.\n * With a very short first state change, we skip animation.\n */\n shouldBypassAnimation() {\n const opts = this.getOptions()\n\n if (!this.elem || opts.animate === false) {\n return true\n }\n\n if (\n this.isInBrowser &&\n (globalThis.IS_TEST || globalThis.bypassTime === -1)\n ) {\n return false\n }\n\n return Boolean(\n this.firstTime &&\n Date.now() - this.firstTime < (globalThis.bypassTime ?? 100)\n )\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"HeightAnimationInstance.js","names":["HeightAnimation","constructor","opts","arguments","length","undefined","_defineProperty","animate","visibility","opacity","height","isInBrowser","window","setState","setOptions","callAnimationStart","startTime","Date","now","firstTime","onStartStack","forEach","fn","state","callAnimationEnd","isAnimating","__currentHeight","removeEndEvents","onEndStack","addEndEvent","listener","_this$elem","_this$elem$addEventLi","handleTransitionEnd","e","canFinish","delay","duration","timeouts","push","setTimeout","events","elem","addEventListener","call","_this$elem2","_this$elem2$removeEve","removeEventListener","setElement","_this$elem3","_globalThis$animation","document","createElement","String","nodeName","toLowerCase","parentElement","globalThis","animationDuration","parseFloat","getComputedStyle","transitionDuration","Object","freeze","_objectSpread","getOptions","remove","stop","setAsOpen","setAsClosed","getHeight","_this$elem4","clientHeight","getUnknownHeight","_this$elem$parentNode","_clonedElem$parentNod","width","clientWidth","clonedElem","cloneNode","parentNode","insertBefore","nextSibling","key","firstPaintStyle","style","position","getAttribute","removeChild","onStart","onEnd","start","fromHeight","toHeight","requestAnimationFrame","reqId1","reqId2","id","clearTimeout","cancelAnimationFrame","open","shouldBypassAnimation","target","currentTarget","readjust","close","overflowY","adjustTo","endHeight","newHeight","_globalThis$animation2","Boolean","_globalThis$bypassTim","IS_TEST","bypassTime","exports","default"],"sources":["../../../../src/components/height-animation/HeightAnimationInstance.ts"],"sourcesContent":["export type HeightAnimationOnStartStates =\n | 'opening'\n | 'closing'\n | 'adjusting'\nexport type HeightAnimationOnEndStates = 'opened' | 'closed' | 'adjusted'\nexport type HeightAnimationStates =\n | HeightAnimationOnStartStates\n | HeightAnimationOnEndStates\n | 'init'\nexport type HeightAnimationOptions = {\n animate?: boolean\n}\nexport type HeightAnimationOnStartCallback = (\n state: HeightAnimationStates\n) => void\nexport type HeightAnimationOnEndCallback = (\n state: HeightAnimationStates\n) => void\nexport type HeightAnimationOnStartStack =\n Array<HeightAnimationOnStartCallback>\nexport type HeightAnimationOnEndStack = Array<HeightAnimationOnEndCallback>\nexport type HeightAnimationEventListener = (e: Event) => void\nexport type HeightAnimationEvents = Array<HeightAnimationEventListener>\nexport type HeightAnimationElement = HTMLElement\nexport type HeightAnimationContainer = HTMLElement\nexport type HeightAnimationFromHeight = number\nexport type HeightAnimationToHeight = number\n\nexport default class HeightAnimation {\n private state: Readonly<HeightAnimationStates>\n isInBrowser: boolean\n onStartStack: HeightAnimationOnStartStack = []\n onEndStack: HeightAnimationOnEndStack = []\n events: HeightAnimationEvents = []\n opts: HeightAnimationOptions = { animate: true }\n elem: HeightAnimationElement\n reqId1: number\n reqId2: number\n resizeTimeout: NodeJS.Timeout\n timeouts: NodeJS.Timeout[] = []\n firstTime?: number = 0\n startTime?: number = 0\n duration?: number = 0\n isAnimating: boolean\n __currentHeight: number\n\n firstPaintStyle = {\n visibility: 'hidden',\n opacity: '0', // prevents before/after elements to be visible\n height: 'auto',\n }\n\n constructor(opts: HeightAnimationOptions = {}) {\n this.isInBrowser = typeof window !== 'undefined'\n this.setState('init')\n this.setOptions(opts)\n }\n\n callAnimationStart() {\n this.startTime = Date.now()\n if (!this.firstTime) {\n this.firstTime = this.startTime\n }\n if (this.onStartStack) {\n this.onStartStack.forEach((fn) => {\n if (typeof fn === 'function') {\n fn(this.state)\n }\n })\n }\n }\n callAnimationEnd() {\n this.isAnimating = false\n\n if (this.state !== 'opened') {\n delete this.__currentHeight\n }\n\n this.removeEndEvents()\n\n if (this.onEndStack) {\n this.onEndStack.forEach((fn) => {\n if (typeof fn === 'function') {\n fn(this.state)\n }\n })\n }\n }\n addEndEvent(listener: HeightAnimationEventListener) {\n this.removeEndEvents() // also, remove events on every open (but not on close!)\n\n const handleTransitionEnd = (e) => {\n if (this.canFinish()) {\n listener(e)\n } else {\n const delay = this.duration - (Date.now() - this.startTime)\n\n if (delay === -1) {\n listener(e)\n } else {\n this.timeouts.push(setTimeout(() => listener(e), delay))\n }\n }\n }\n\n this.events.push(handleTransitionEnd)\n this.elem?.addEventListener?.('transitionend', handleTransitionEnd)\n }\n removeEndEvents() {\n this.events.forEach((listener) => {\n this.elem?.removeEventListener?.('transitionend', listener)\n })\n this.events = []\n }\n\n // Public methods\n setElement(elem: HeightAnimationElement) {\n this.elem =\n elem ||\n (typeof document !== 'undefined' && document.createElement('div'))\n\n // TODO: remove when responsive tables are supported\n if (String(this.elem?.nodeName).toLowerCase() === 'td') {\n this.elem = this.elem.parentElement\n }\n\n this.duration =\n globalThis.animationDuration ??\n (parseFloat(window.getComputedStyle(this.elem).transitionDuration) *\n 1000 ||\n 400) // The default duration\n }\n setState(state: HeightAnimationStates) {\n this.state = Object.freeze(state)\n }\n setOptions(opts: HeightAnimationOptions) {\n this.opts = Object.freeze({ ...this.opts, ...opts })\n }\n getOptions() {\n return this.opts\n }\n remove() {\n this.stop()\n this.removeEndEvents()\n this.setState('init')\n this.isAnimating = false\n this.onEndStack = []\n this.onStartStack = []\n this.__currentHeight = undefined\n this.elem = undefined\n }\n setAsOpen() {\n if (this.state === 'opened') {\n return\n }\n this.setState('opening')\n this.callAnimationStart()\n this.setState('opened')\n this.callAnimationEnd()\n }\n setAsClosed() {\n if (this.state === 'closed') {\n return\n }\n this.setState('closing')\n this.callAnimationStart()\n this.setState('closed')\n this.callAnimationEnd()\n }\n getHeight() {\n return parseFloat(String(this.elem?.clientHeight)) || null\n }\n getUnknownHeight() {\n if (!this.elem) {\n return null\n }\n\n if (this.isAnimating && typeof this.__currentHeight !== 'undefined') {\n return this.__currentHeight\n }\n\n const width = this.elem.clientWidth\n const clonedElem = this.elem.cloneNode(true) as HTMLElement\n this.elem.parentNode?.insertBefore(clonedElem, this.elem.nextSibling)\n\n for (const key in this.firstPaintStyle) {\n clonedElem.style[key] = this.firstPaintStyle[key]\n }\n clonedElem.style.width = width ? `${String(width)}px` : 'auto' // set width because of the \"position: absolute\"\n clonedElem.style.position = 'absolute' // not a part of the \"firstPaintStyle\"\n\n const height =\n parseFloat(String(clonedElem.clientHeight)) ||\n // data-height is used for mockup testing with \"mockHeight\"\n parseFloat(clonedElem.getAttribute('data-height')) ||\n null\n\n clonedElem.parentNode?.removeChild(clonedElem)\n\n if (height) {\n this.__currentHeight = height\n }\n\n return height\n }\n onStart(fn: HeightAnimationOnStartCallback) {\n this.onStartStack.push(fn)\n }\n onEnd(fn: HeightAnimationOnEndCallback) {\n this.onEndStack.push(fn)\n }\n start(\n fromHeight: HeightAnimationFromHeight,\n toHeight: HeightAnimationToHeight\n ) {\n if (\n !this.elem ||\n !(\n this.isInBrowser &&\n typeof window.requestAnimationFrame === 'function'\n )\n ) {\n return\n }\n\n const opts = this.getOptions()\n if (opts.animate === false) {\n return\n }\n\n this.stop()\n this.isAnimating = true\n\n // make the animation\n this.reqId1 = window.requestAnimationFrame(() => {\n if (!this.elem) {\n return\n }\n\n this.elem.style.height = `${fromHeight}px`\n\n this.reqId2 = window.requestAnimationFrame(() => {\n if (!this.elem) {\n return\n }\n\n this.elem.style.height = `${toHeight}px`\n })\n })\n }\n stop() {\n this.timeouts.forEach((id) => clearTimeout(id))\n this.timeouts = []\n\n if (\n this.isInBrowser &&\n typeof window.requestAnimationFrame === 'function'\n ) {\n window.cancelAnimationFrame(this.reqId1)\n window.cancelAnimationFrame(this.reqId2)\n }\n }\n open() {\n if (\n this.state === 'opened' ||\n this.state === 'opening' ||\n this.shouldBypassAnimation()\n ) {\n this.setAsOpen()\n return\n }\n\n this.setState('opening')\n this.callAnimationStart()\n\n const toHeight = this.getUnknownHeight()\n\n this.addEndEvent((e) => {\n if (e.target === e.currentTarget || !e.currentTarget) {\n this.setState('opened')\n this.readjust()\n }\n })\n\n this.start(0, toHeight)\n }\n close() {\n if (\n this.state === 'closed' ||\n this.state === 'closing' ||\n this.shouldBypassAnimation()\n ) {\n this.setAsClosed()\n return\n }\n\n this.setState('closing')\n this.callAnimationStart()\n\n const fromHeight = this.getHeight()\n\n this.addEndEvent((e) => {\n if (e.target === e.currentTarget || !e.currentTarget) {\n if (this.elem) {\n this.elem.style.visibility = 'hidden'\n this.elem.style.overflowY = 'clip'\n }\n this.setState('closed')\n this.callAnimationEnd()\n }\n })\n\n this.start(fromHeight, 0)\n }\n adjustTo(\n fromHeight: HeightAnimationFromHeight = null,\n toHeight: HeightAnimationToHeight = null\n ) {\n const opts = this.getOptions()\n\n if (\n !this.elem ||\n opts.animate === false ||\n this.state === 'opening' ||\n this.state === 'closing'\n ) {\n return\n }\n\n if (fromHeight === 0 || fromHeight === null) {\n fromHeight = this.getHeight()\n }\n if (toHeight === null) {\n toHeight = this.getUnknownHeight()\n }\n\n if (fromHeight === toHeight) {\n this.setState('adjusted')\n return\n }\n\n this.setState('adjusting')\n this.callAnimationStart()\n\n this.addEndEvent((e) => {\n if (\n this.state === 'adjusting' &&\n (e.target === e.currentTarget || !e.currentTarget)\n ) {\n if (this.elem) {\n this.elem.style.height = 'auto'\n }\n this.setState('adjusted')\n this.callAnimationEnd()\n }\n })\n\n this.start(fromHeight, toHeight)\n }\n readjust() {\n const endHeight = this.getHeight()\n\n if (this.elem) {\n this.elem.style.height = 'auto'\n }\n\n this.__currentHeight = undefined\n const newHeight = this.getUnknownHeight()\n\n // If the height has changed during the animation, we need to adjust it\n if (endHeight !== newHeight) {\n this.adjustTo(endHeight, newHeight)\n } else {\n this.callAnimationEnd()\n }\n }\n /**\n * Determines whether the animation can finish.\n * Check for certain states and if the time passed is too short.\n * With a so short first state change, we do not call animation end.\n */\n canFinish() {\n return Boolean(\n this.startTime &&\n Date.now() - this.startTime >\n (globalThis.animationDuration ?? this.duration)\n )\n }\n /**\n * Determines whether the animation should be bypassed.\n * Check for certain states and if the time passed is too short to be correct.\n * With a very short first state change, we skip animation.\n */\n shouldBypassAnimation() {\n const opts = this.getOptions()\n\n if (!this.elem || opts.animate === false) {\n return true\n }\n\n if (\n this.isInBrowser &&\n (globalThis.IS_TEST || globalThis.bypassTime === -1)\n ) {\n return false\n }\n\n return Boolean(\n this.firstTime &&\n Date.now() - this.firstTime < (globalThis.bypassTime ?? 100)\n )\n }\n}\n"],"mappings":"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"}
|
|
@@ -63,7 +63,9 @@ function useHeightAnimation(targetRef) {
|
|
|
63
63
|
setIsAnimating(true);
|
|
64
64
|
break;
|
|
65
65
|
}
|
|
66
|
-
|
|
66
|
+
if (!isInitialRenderRef.current) {
|
|
67
|
+
onAnimationStart === null || onAnimationStart === void 0 ? void 0 : onAnimationStart(state);
|
|
68
|
+
}
|
|
67
69
|
});
|
|
68
70
|
instRef.current.onEnd(state => {
|
|
69
71
|
switch (state) {
|
|
@@ -101,7 +103,7 @@ function useHeightAnimation(targetRef) {
|
|
|
101
103
|
isInitialRenderRef,
|
|
102
104
|
targetRef
|
|
103
105
|
});
|
|
104
|
-
const firstPaintStyle = open && !isVisible && !isAnimating && ((_instRef$current2 = instRef.current) === null || _instRef$current2 === void 0 ? void 0 : _instRef$current2.firstPaintStyle
|
|
106
|
+
const firstPaintStyle = open && !isVisible && !isAnimating && ((_instRef$current2 = instRef.current) === null || _instRef$current2 === void 0 ? void 0 : _instRef$current2.firstPaintStyle) || {};
|
|
105
107
|
const isInDOM = open || isVisible;
|
|
106
108
|
return {
|
|
107
109
|
open,
|
|
@@ -120,6 +122,7 @@ function useOpenClose(_ref) {
|
|
|
120
122
|
isInitialRenderRef,
|
|
121
123
|
targetRef
|
|
122
124
|
} = _ref;
|
|
125
|
+
const isTest = typeof process !== 'undefined' && process.env.NODE_ENV === 'test' && typeof globalThis.IS_TEST === 'undefined';
|
|
123
126
|
useLayoutEffect(() => {
|
|
124
127
|
instRef.current.setElement(targetRef.current);
|
|
125
128
|
if (!targetRef.current || instRef.current.state === 'init' && isInitialRenderRef.current) {
|
|
@@ -128,21 +131,19 @@ function useOpenClose(_ref) {
|
|
|
128
131
|
} else {
|
|
129
132
|
instRef.current.setAsClosed();
|
|
130
133
|
}
|
|
131
|
-
}
|
|
132
|
-
}, [open, targetRef, instRef, isInitialRenderRef]);
|
|
133
|
-
const isTest = typeof process !== 'undefined' && process.env.NODE_ENV === 'test' && typeof globalThis.IS_TEST === 'undefined';
|
|
134
|
-
useLayoutEffect(() => {
|
|
135
|
-
if (open) {
|
|
136
|
-
instRef.current.open();
|
|
137
134
|
} else {
|
|
138
|
-
|
|
135
|
+
if (open) {
|
|
136
|
+
instRef.current.open();
|
|
137
|
+
} else {
|
|
138
|
+
instRef.current.close();
|
|
139
|
+
}
|
|
139
140
|
}
|
|
140
141
|
if (isTest) {
|
|
141
142
|
var _targetRef$current;
|
|
142
143
|
const event = new CustomEvent('transitionend');
|
|
143
144
|
(_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.dispatchEvent(event);
|
|
144
145
|
}
|
|
145
|
-
}, [open, instRef, isInitialRenderRef,
|
|
146
|
+
}, [open, targetRef, instRef, isInitialRenderRef, isTest]);
|
|
146
147
|
useLayoutEffect(() => {
|
|
147
148
|
const run = () => {
|
|
148
149
|
isInitialRenderRef.current = false;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHeightAnimation.js","names":["_react","_interopRequireWildcard","require","_HeightAnimationInstance","_interopRequireDefault","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","useLayoutEffect","window","React","useEffect","useHeightAnimation","targetRef","_instRef$current2","open","animate","children","onInit","onOpen","onAnimationStart","onAnimationEnd","arguments","length","undefined","instRef","useRef","isInitialRenderRef","globalThis","readjustTime","isOpen","setIsOpen","useState","isVisible","setIsVisible","isAnimating","setIsAnimating","isVisibleParallax","setParallax","current","HeightAnimationInstance","_instRef$current","remove","setOptions","global","IS_TEST","onStart","state","onEnd","useOpenClose","useAdjust","firstPaintStyle","isInDOM","_ref","setElement","setAsOpen","setAsClosed","isTest","process","env","NODE_ENV","close","_targetRef$current","event","CustomEvent","dispatchEvent","run","bypassTime","_window$requestAnimat","_window","requestAnimationFrame","_ref2","fromHeight","timer","Date","now","shouldAdjust","_instRef$current3","useMemo","_instRef$current4","getHeight","elem","style","height","toHeight","adjustTo"],"sources":["../../../../src/components/height-animation/useHeightAnimation.tsx"],"sourcesContent":["import React, { useMemo, useRef, useState } from 'react'\nimport HeightAnimationInstance from './HeightAnimationInstance'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type useHeightAnimationOptions = {\n /**\n * Set to `true`, when initially `false` was given, to animate from 0px to auto.\n * Default: true\n */\n open?: boolean\n\n /**\n * Set to `false` to omit the animation.\n * Default: true\n */\n animate?: boolean\n\n /**\n * In order to let the Hook know when children has changed\n */\n children?: React.ReactNode | HTMLElement\n\n /**\n * Is called once before mounting the component (useLayoutEffect)\n */\n onInit?: (instance: HeightAnimationInstance) => void\n\n /**\n * Is called when fully opened or closed\n */\n onOpen?: (isOpen: boolean) => void\n\n /**\n * Is called when animation has started.\n */\n onAnimationStart?: (state: HeightAnimationOnStartTypes) => void\n\n /**\n * Is called when animation is done and the full height is reached.\n */\n onAnimationEnd?: (state: HeightAnimationOnEndTypes) => void\n}\n\nexport type HeightAnimationOnStartTypes =\n | 'opening'\n | 'closing'\n | 'adjusting'\n\nexport type HeightAnimationOnEndTypes = 'opened' | 'closed' | 'adjusted'\n\nexport function useHeightAnimation(\n targetRef: React.RefObject<HTMLElement>,\n {\n open = true,\n animate = true,\n children = null,\n onInit = null,\n onOpen = null,\n onAnimationStart = null,\n onAnimationEnd = null,\n }: useHeightAnimationOptions = {}\n) {\n const instRef = useRef<HeightAnimationInstance>(null)\n const isInitialRenderRef = useRef(\n typeof globalThis !== 'undefined'\n ? globalThis.readjustTime !== -1\n : true\n )\n\n const [isOpen, setIsOpen] = useState(open)\n const [isVisible, setIsVisible] = useState(false)\n const [isAnimating, setIsAnimating] = useState(false)\n const [isVisibleParallax, setParallax] = useState(open)\n\n useLayoutEffect(() => {\n instRef.current = new HeightAnimationInstance()\n onInit?.(instRef.current)\n return () => {\n instRef.current?.remove()\n instRef.current = null\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n useLayoutEffect(() => {\n instRef.current.setOptions({ animate })\n\n if (typeof global !== 'undefined' && globalThis.IS_TEST) {\n instRef.current.setOptions({ animate: false })\n }\n }, [animate])\n\n useLayoutEffect(() => {\n instRef.current.onStart((state: HeightAnimationOnStartTypes) => {\n switch (state) {\n case 'opening':\n setIsVisible(true)\n setParallax(true)\n setIsAnimating(true)\n break\n\n case 'closing':\n setParallax(false)\n setIsAnimating(true)\n break\n\n case 'adjusting':\n setIsAnimating(true)\n break\n }\n\n onAnimationStart?.(state)\n })\n\n instRef.current.onEnd((state: HeightAnimationOnEndTypes) => {\n switch (state) {\n case 'opened':\n setIsVisible(true)\n setIsOpen(true)\n setIsAnimating(false)\n onOpen?.(true)\n break\n\n case 'closed':\n setIsVisible(false)\n setIsOpen(false)\n setParallax(false)\n setIsAnimating(false)\n onOpen?.(false)\n break\n\n case 'adjusted':\n setIsAnimating(false)\n break\n }\n\n if (!isInitialRenderRef.current) {\n onAnimationEnd?.(state)\n }\n })\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n useOpenClose({ open, instRef, isInitialRenderRef, targetRef })\n useAdjust({ children, instRef, isInitialRenderRef, targetRef })\n\n /**\n * Returns the first paint style, to be used for the initial render,\n * to avoid flickering.\n */\n const firstPaintStyle = ((open &&\n !isVisible &&\n !isAnimating &&\n instRef.current?.firstPaintStyle()) ||\n {}) as React.CSSProperties\n const isInDOM = open || isVisible\n\n return {\n open,\n isOpen,\n isInDOM,\n isVisible,\n isVisibleParallax,\n isAnimating,\n firstPaintStyle,\n }\n}\n\nfunction useOpenClose({ open, instRef, isInitialRenderRef, targetRef }) {\n useLayoutEffect(() => {\n instRef.current.setElement(targetRef.current)\n\n if (\n !targetRef.current ||\n (instRef.current.state === 'init' && isInitialRenderRef.current)\n ) {\n if (open) {\n instRef.current.setAsOpen()\n } else {\n instRef.current.setAsClosed()\n }\n }\n }, [open, targetRef, instRef, isInitialRenderRef])\n\n const isTest =\n typeof process !== 'undefined' &&\n process.env.NODE_ENV === 'test' &&\n typeof globalThis.IS_TEST === 'undefined'\n\n useLayoutEffect(() => {\n if (open) {\n instRef.current.open()\n } else {\n instRef.current.close()\n }\n\n // For testing purposes, we need to trigger the transitionend event\n if (isTest) {\n const event = new CustomEvent('transitionend')\n targetRef.current?.dispatchEvent(event)\n }\n }, [open, instRef, isInitialRenderRef, targetRef, isTest])\n\n useLayoutEffect(() => {\n const run = () => {\n isInitialRenderRef.current = false\n }\n if (globalThis.bypassTime === -1 || isTest) {\n run()\n } else {\n window.requestAnimationFrame?.(run)\n }\n }, [isInitialRenderRef, isTest])\n}\n\nfunction useAdjust({ children, instRef, isInitialRenderRef, targetRef }) {\n const fromHeight = useRef(0)\n\n const [timer] = useState(() => Date.now())\n\n /**\n * Wait for some criteria and a certain time, before we adjust the height,\n * so it will not run when a open/close animation is running.\n */\n const shouldAdjust = () => {\n switch (instRef.current?.state) {\n case 'opened':\n case 'adjusted':\n case 'adjusting':\n return (\n !isInitialRenderRef.current &&\n Date.now() - timer > (globalThis.readjustTime || 100)\n )\n }\n\n return false\n }\n\n useMemo(() => {\n if (shouldAdjust()) {\n fromHeight.current = instRef.current?.getHeight()\n }\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useLayoutEffect(() => {\n if (shouldAdjust()) {\n /**\n * In certain cases, the targetRef.current is outdated, so we need to set it again.\n * E.g. in Tabs.js, when we switch tabs, the targetRef.current is not updated.\n */\n instRef.current.setElement(targetRef.current)\n\n /**\n * Ensure we don't have height, while we get the \"toHeight\" again.\n * We may move this inside of the HeightAnimationInstance class later,\n * but the \"GlobalStatus\" is currently relying on \"getUnknownHeight\" inside of adjustTo.\n */\n instRef.current.elem.style.height = ''\n\n /**\n * Use getHeight instead of getUnknownHeight because of the additional,\n * disturbing DOM manipulation.\n */\n const toHeight = instRef.current.getHeight()\n\n instRef.current.adjustTo(fromHeight.current, toHeight)\n }\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useHeightAnimation.js","names":["_react","_interopRequireWildcard","require","_HeightAnimationInstance","_interopRequireDefault","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","useLayoutEffect","window","React","useEffect","useHeightAnimation","targetRef","_instRef$current2","open","animate","children","onInit","onOpen","onAnimationStart","onAnimationEnd","arguments","length","undefined","instRef","useRef","isInitialRenderRef","globalThis","readjustTime","isOpen","setIsOpen","useState","isVisible","setIsVisible","isAnimating","setIsAnimating","isVisibleParallax","setParallax","current","HeightAnimationInstance","_instRef$current","remove","setOptions","global","IS_TEST","onStart","state","onEnd","useOpenClose","useAdjust","firstPaintStyle","isInDOM","_ref","isTest","process","env","NODE_ENV","setElement","setAsOpen","setAsClosed","close","_targetRef$current","event","CustomEvent","dispatchEvent","run","bypassTime","_window$requestAnimat","_window","requestAnimationFrame","_ref2","fromHeight","timer","Date","now","shouldAdjust","_instRef$current3","useMemo","_instRef$current4","getHeight","elem","style","height","toHeight","adjustTo"],"sources":["../../../../src/components/height-animation/useHeightAnimation.tsx"],"sourcesContent":["import React, { useMemo, useRef, useState } from 'react'\nimport HeightAnimationInstance from './HeightAnimationInstance'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type useHeightAnimationOptions = {\n /**\n * Set to `true`, when initially `false` was given, to animate from 0px to auto.\n * Default: true\n */\n open?: boolean\n\n /**\n * Set to `false` to omit the animation.\n * Default: true\n */\n animate?: boolean\n\n /**\n * In order to let the Hook know when children has changed\n */\n children?: React.ReactNode | HTMLElement\n\n /**\n * Is called once before mounting the component (useLayoutEffect)\n */\n onInit?: (instance: HeightAnimationInstance) => void\n\n /**\n * Is called when fully opened or closed\n */\n onOpen?: (isOpen: boolean) => void\n\n /**\n * Is called when animation has started.\n */\n onAnimationStart?: (state: HeightAnimationOnStartTypes) => void\n\n /**\n * Is called when animation is done and the full height is reached.\n */\n onAnimationEnd?: (state: HeightAnimationOnEndTypes) => void\n}\n\nexport type HeightAnimationOnStartTypes =\n | 'opening'\n | 'closing'\n | 'adjusting'\n\nexport type HeightAnimationOnEndTypes = 'opened' | 'closed' | 'adjusted'\n\nexport function useHeightAnimation(\n targetRef: React.RefObject<HTMLElement>,\n {\n open = true,\n animate = true,\n children = null,\n onInit = null,\n onOpen = null,\n onAnimationStart = null,\n onAnimationEnd = null,\n }: useHeightAnimationOptions = {}\n) {\n const instRef = useRef<HeightAnimationInstance>(null)\n const isInitialRenderRef = useRef(\n typeof globalThis !== 'undefined'\n ? globalThis.readjustTime !== -1\n : true\n )\n\n const [isOpen, setIsOpen] = useState(open)\n const [isVisible, setIsVisible] = useState(false)\n const [isAnimating, setIsAnimating] = useState(false)\n const [isVisibleParallax, setParallax] = useState(open)\n\n useLayoutEffect(() => {\n instRef.current = new HeightAnimationInstance()\n onInit?.(instRef.current)\n return () => {\n instRef.current?.remove()\n instRef.current = null\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n useLayoutEffect(() => {\n instRef.current.setOptions({ animate })\n\n if (typeof global !== 'undefined' && globalThis.IS_TEST) {\n instRef.current.setOptions({ animate: false })\n }\n }, [animate])\n\n useLayoutEffect(() => {\n instRef.current.onStart((state: HeightAnimationOnStartTypes) => {\n switch (state) {\n case 'opening':\n setIsVisible(true)\n setParallax(true)\n setIsAnimating(true)\n break\n\n case 'closing':\n setParallax(false)\n setIsAnimating(true)\n break\n\n case 'adjusting':\n setIsAnimating(true)\n break\n }\n\n if (!isInitialRenderRef.current) {\n onAnimationStart?.(state)\n }\n })\n\n instRef.current.onEnd((state: HeightAnimationOnEndTypes) => {\n switch (state) {\n case 'opened':\n setIsVisible(true)\n setIsOpen(true)\n setIsAnimating(false)\n onOpen?.(true)\n break\n\n case 'closed':\n setIsVisible(false)\n setIsOpen(false)\n setParallax(false)\n setIsAnimating(false)\n onOpen?.(false)\n break\n\n case 'adjusted':\n setIsAnimating(false)\n break\n }\n\n if (!isInitialRenderRef.current) {\n onAnimationEnd?.(state)\n }\n })\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n useOpenClose({ open, instRef, isInitialRenderRef, targetRef })\n useAdjust({ children, instRef, isInitialRenderRef, targetRef })\n\n /**\n * Returns the first paint style, to be used for the initial render,\n * to avoid flickering.\n */\n const firstPaintStyle = ((open &&\n !isVisible &&\n !isAnimating &&\n instRef.current?.firstPaintStyle) ||\n {}) as React.CSSProperties\n const isInDOM = open || isVisible\n\n return {\n open,\n isOpen,\n isInDOM,\n isVisible,\n isVisibleParallax,\n isAnimating,\n firstPaintStyle,\n }\n}\n\nfunction useOpenClose({ open, instRef, isInitialRenderRef, targetRef }) {\n const isTest =\n typeof process !== 'undefined' &&\n process.env.NODE_ENV === 'test' &&\n typeof globalThis.IS_TEST === 'undefined'\n\n useLayoutEffect(() => {\n instRef.current.setElement(targetRef.current)\n\n if (\n !targetRef.current ||\n (instRef.current.state === 'init' && isInitialRenderRef.current)\n ) {\n if (open) {\n instRef.current.setAsOpen()\n } else {\n instRef.current.setAsClosed()\n }\n } else {\n if (open) {\n instRef.current.open()\n } else {\n instRef.current.close()\n }\n }\n\n // For testing purposes, we need to trigger the transitionend event\n if (isTest) {\n const event = new CustomEvent('transitionend')\n targetRef.current?.dispatchEvent(event)\n }\n }, [open, targetRef, instRef, isInitialRenderRef, isTest])\n\n useLayoutEffect(() => {\n const run = () => {\n isInitialRenderRef.current = false\n }\n if (globalThis.bypassTime === -1 || isTest) {\n run()\n } else {\n window.requestAnimationFrame?.(run)\n }\n }, [isInitialRenderRef, isTest])\n}\n\nfunction useAdjust({ children, instRef, isInitialRenderRef, targetRef }) {\n const fromHeight = useRef(0)\n\n const [timer] = useState(() => Date.now())\n\n /**\n * Wait for some criteria and a certain time, before we adjust the height,\n * so it will not run when a open/close animation is running.\n */\n const shouldAdjust = () => {\n switch (instRef.current?.state) {\n case 'opened':\n case 'adjusted':\n case 'adjusting':\n return (\n !isInitialRenderRef.current &&\n Date.now() - timer > (globalThis.readjustTime || 100)\n )\n }\n\n return false\n }\n\n useMemo(() => {\n if (shouldAdjust()) {\n fromHeight.current = instRef.current?.getHeight()\n }\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n useLayoutEffect(() => {\n if (shouldAdjust()) {\n /**\n * In certain cases, the targetRef.current is outdated, so we need to set it again.\n * E.g. in Tabs.js, when we switch tabs, the targetRef.current is not updated.\n */\n instRef.current.setElement(targetRef.current)\n\n /**\n * Ensure we don't have height, while we get the \"toHeight\" again.\n * We may move this inside of the HeightAnimationInstance class later,\n * but the \"GlobalStatus\" is currently relying on \"getUnknownHeight\" inside of adjustTo.\n */\n instRef.current.elem.style.height = ''\n\n /**\n * Use getHeight instead of getUnknownHeight because of the additional,\n * disturbing DOM manipulation.\n */\n const toHeight = instRef.current.getHeight()\n\n instRef.current.adjustTo(fromHeight.current, toHeight)\n }\n }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n}\n"],"mappings":"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"}
|
|
@@ -196,7 +196,7 @@ export default class Input extends React.Component<InputProps, any> {
|
|
|
196
196
|
render(): JSX.Element;
|
|
197
197
|
}
|
|
198
198
|
export interface SubmitButtonProps
|
|
199
|
-
extends React.HTMLProps<
|
|
199
|
+
extends React.HTMLProps<HTMLButtonElement> {
|
|
200
200
|
id?: string;
|
|
201
201
|
/**
|
|
202
202
|
* The content value of the input.
|
|
@@ -87,8 +87,8 @@ class ProgressIndicator extends _react.default.PureComponent {
|
|
|
87
87
|
const indicatorLabel = label || children || (0, _componentHelper.isTrue)(show_label) && indicator_label;
|
|
88
88
|
const progressTitle = title || formatProgress(progress);
|
|
89
89
|
(0, _componentHelper.validateDOMAttributes)(this.props, params);
|
|
90
|
-
return _react.default.createElement("
|
|
91
|
-
className: (0, _classnames.default)('dnb-progress-indicator', (0, _SpacingHelper.createSpacingClasses)(props), className, _className, visible && 'dnb-progress-indicator--visible', complete && 'dnb-progress-indicator--complete', label_direction && `dnb-progress-indicator--${label_direction}`, (0, _componentHelper.isTrue)(no_animation) && 'dnb-progress-indicator--no-animation', type === 'linear' && 'dnb-progress-indicator--full-width')
|
|
90
|
+
return _react.default.createElement("span", _extends({
|
|
91
|
+
className: (0, _classnames.default)('dnb-progress-indicator', (0, _SpacingHelper.createSpacingClasses)(props), className, _className, visible && 'dnb-progress-indicator--visible', complete && 'dnb-progress-indicator--complete', label_direction && `dnb-progress-indicator--${label_direction}`, size && `dnb-progress-indicator--${size}`, (0, _componentHelper.isTrue)(no_animation) && 'dnb-progress-indicator--no-animation', type === 'linear' && 'dnb-progress-indicator--full-width')
|
|
92
92
|
}, params), type === 'circular' && _react.default.createElement(_ProgressIndicatorCircular.default, {
|
|
93
93
|
size: size,
|
|
94
94
|
progress: progress,
|
|
@@ -105,11 +105,9 @@ class ProgressIndicator extends _react.default.PureComponent {
|
|
|
105
105
|
onComplete: on_complete,
|
|
106
106
|
callOnCompleteHandler: this.callOnCompleteHandler,
|
|
107
107
|
title: progressTitle
|
|
108
|
-
}), indicatorLabel && _react.default.createElement("
|
|
109
|
-
className: "dnb-progress-indicator__label"
|
|
110
|
-
},
|
|
111
|
-
className: "dnb-p"
|
|
112
|
-
}, indicatorLabel)));
|
|
108
|
+
}), indicatorLabel && _react.default.createElement("span", {
|
|
109
|
+
className: "dnb-progress-indicator__label dnb-p"
|
|
110
|
+
}, indicatorLabel));
|
|
113
111
|
}
|
|
114
112
|
}
|
|
115
113
|
exports.default = ProgressIndicator;
|