@pega/cosmos-react-core 4.0.0-dev.13.0 → 4.0.0-dev.14.1
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/README.md +2 -2
- package/lib/components/AppShell/AppHeader.styles.d.ts.map +1 -1
- package/lib/components/AppShell/AppHeader.styles.js +0 -2
- package/lib/components/AppShell/AppHeader.styles.js.map +1 -1
- package/lib/components/AppShell/AppShell.js.map +1 -1
- package/lib/components/AppShell/AppShell.styles.d.ts.map +1 -1
- package/lib/components/AppShell/AppShell.styles.js +10 -16
- package/lib/components/AppShell/AppShell.styles.js.map +1 -1
- package/lib/components/AppShell/AppShell.types.d.ts +12 -11
- package/lib/components/AppShell/AppShell.types.d.ts.map +1 -1
- package/lib/components/AppShell/AppShell.types.js.map +1 -1
- package/lib/components/AppShell/AppShellContext.d.ts +1 -1
- package/lib/components/AppShell/AppShellContext.d.ts.map +1 -1
- package/lib/components/AppShell/AppShellContext.js.map +1 -1
- package/lib/components/AppShell/AppShellList.d.ts +1 -1
- package/lib/components/AppShell/AppShellList.d.ts.map +1 -1
- package/lib/components/AppShell/AppShellList.js.map +1 -1
- package/lib/components/AppShell/AppShellList.styles.d.ts.map +1 -1
- package/lib/components/AppShell/AppShellList.styles.js +1 -2
- package/lib/components/AppShell/AppShellList.styles.js.map +1 -1
- package/lib/components/AppShell/NavigationList.d.ts.map +1 -1
- package/lib/components/AppShell/NavigationList.js.map +1 -1
- package/lib/components/AppShell/NavigationListItemWrapper.d.ts.map +1 -1
- package/lib/components/AppShell/NavigationListItemWrapper.js +31 -11
- package/lib/components/AppShell/NavigationListItemWrapper.js.map +1 -1
- package/lib/components/AppShell/Operator.d.ts.map +1 -1
- package/lib/components/AppShell/Operator.js +1 -3
- package/lib/components/AppShell/Operator.js.map +1 -1
- package/lib/components/Avatar/Avatar.d.ts +2 -2
- package/lib/components/Avatar/Avatar.js.map +1 -1
- package/lib/components/Backdrop/Backdrop.d.ts +9 -21
- package/lib/components/Backdrop/Backdrop.d.ts.map +1 -1
- package/lib/components/Backdrop/Backdrop.js +0 -2
- package/lib/components/Backdrop/Backdrop.js.map +1 -1
- package/lib/components/Badges/Count.d.ts +1 -1
- package/lib/components/Badges/Count.js.map +1 -1
- package/lib/components/Banner/Banner.d.ts +1 -1
- package/lib/components/Banner/Banner.d.ts.map +1 -1
- package/lib/components/Banner/Banner.js +3 -3
- package/lib/components/Banner/Banner.js.map +1 -1
- package/lib/components/Boolean/BooleanDisplay.d.ts +2 -2
- package/lib/components/Boolean/BooleanDisplay.js +2 -2
- package/lib/components/Boolean/BooleanDisplay.js.map +1 -1
- package/lib/components/Button/BareButton.d.ts +1 -1
- package/lib/components/Button/BareButton.js.map +1 -1
- package/lib/components/Button/Button.d.ts +7 -9
- package/lib/components/Button/Button.d.ts.map +1 -1
- package/lib/components/Button/Button.js +168 -142
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/ColorPicker/ColorPicker.d.ts +1 -1
- package/lib/components/ColorPicker/ColorPicker.js +1 -1
- package/lib/components/ColorPicker/ColorPicker.js.map +1 -1
- package/lib/components/ColorPicker/ColorPicker.test-ids.d.ts +1 -1
- package/lib/components/ColorPicker/ColorPicker.test-ids.d.ts.map +1 -1
- package/lib/components/ColorPicker/ColorPicker.test-ids.js +5 -1
- package/lib/components/ColorPicker/ColorPicker.test-ids.js.map +1 -1
- package/lib/components/ComboBox/ComboBox.d.ts.map +1 -1
- package/lib/components/ComboBox/ComboBox.js +2 -10
- package/lib/components/ComboBox/ComboBox.js.map +1 -1
- package/lib/components/ComboBox/ComboxBox.test-ids.d.ts +1 -1
- package/lib/components/ComboBox/ComboxBox.test-ids.d.ts.map +1 -1
- package/lib/components/ComboBox/ComboxBox.test-ids.js +2 -1
- package/lib/components/ComboBox/ComboxBox.test-ids.js.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.d.ts.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.js +8 -10
- package/lib/components/CompositeInput/CompositeInput.js.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.test-ids.d.ts +1 -1
- package/lib/components/CompositeInput/CompositeInput.test-ids.d.ts.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.test-ids.js +5 -1
- package/lib/components/CompositeInput/CompositeInput.test-ids.js.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.types.d.ts +2 -6
- package/lib/components/CompositeInput/CompositeInput.types.d.ts.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.types.js.map +1 -1
- package/lib/components/Configuration/Configuration.d.ts +9 -27
- package/lib/components/Configuration/Configuration.d.ts.map +1 -1
- package/lib/components/Configuration/Configuration.js +5 -1
- package/lib/components/Configuration/Configuration.js.map +1 -1
- package/lib/components/CreditCard/utils.d.ts +1 -1
- package/lib/components/CreditCard/utils.d.ts.map +1 -1
- package/lib/components/CreditCard/utils.js +1 -1
- package/lib/components/CreditCard/utils.js.map +1 -1
- package/lib/components/Currency/Currency.test-ids.d.ts +1 -1
- package/lib/components/Currency/Currency.test-ids.d.ts.map +1 -1
- package/lib/components/Currency/Currency.test-ids.js +5 -1
- package/lib/components/Currency/Currency.test-ids.js.map +1 -1
- package/lib/components/Currency/CurrencyInput.js +1 -1
- package/lib/components/Currency/CurrencyInput.js.map +1 -1
- package/lib/components/Currency/CurrencyInput.types.d.ts +3 -7
- package/lib/components/Currency/CurrencyInput.types.d.ts.map +1 -1
- package/lib/components/Currency/CurrencyInput.types.js.map +1 -1
- package/lib/components/DateTime/DateTimeDisplay.d.ts +4 -10
- package/lib/components/DateTime/DateTimeDisplay.d.ts.map +1 -1
- package/lib/components/DateTime/DateTimeDisplay.js.map +1 -1
- package/lib/components/DateTime/Input/DateInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateInput.js +25 -32
- package/lib/components/DateTime/Input/DateInput.js.map +1 -1
- package/lib/components/DateTime/Input/DateTime.styles.d.ts +1 -0
- package/lib/components/DateTime/Input/DateTime.styles.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTime.styles.js +3 -0
- package/lib/components/DateTime/Input/DateTime.styles.js.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.d.ts +1 -3
- package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/DateTimeInput.js +20 -27
- package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.d.ts +1 -3
- package/lib/components/DateTime/Input/TimeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeInput.js +1 -9
- package/lib/components/DateTime/Input/TimeInput.js.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.d.ts +1 -3
- package/lib/components/DateTime/Input/TimeRangeInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/TimeRangeInput.js.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.d.ts.map +1 -1
- package/lib/components/DateTime/Input/WeekInput.js +11 -17
- package/lib/components/DateTime/Input/WeekInput.js.map +1 -1
- package/lib/components/DateTime/Input/usePickerButton.js +3 -3
- package/lib/components/DateTime/Input/usePickerButton.js.map +1 -1
- package/lib/components/DateTime/Picker/Calendar.d.ts +4 -6
- package/lib/components/DateTime/Picker/Calendar.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/Calendar.js +1 -1
- package/lib/components/DateTime/Picker/Calendar.js.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.types.d.ts +2 -4
- package/lib/components/DateTime/Picker/DatePicker.types.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/DatePicker.types.js.map +1 -1
- package/lib/components/DateTime/Picker/TimePicker.d.ts +1 -3
- package/lib/components/DateTime/Picker/TimePicker.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/TimePicker.js.map +1 -1
- package/lib/components/DateTime/Picker/Weeks.d.ts +1 -3
- package/lib/components/DateTime/Picker/Weeks.d.ts.map +1 -1
- package/lib/components/DateTime/Picker/Weeks.js +1 -1
- package/lib/components/DateTime/Picker/Weeks.js.map +1 -1
- package/lib/components/DateTime/Picker/utils.js +1 -1
- package/lib/components/DateTime/Picker/utils.js.map +1 -1
- package/lib/components/DateTime/utils.d.ts.map +1 -1
- package/lib/components/DateTime/utils.js +8 -6
- package/lib/components/DateTime/utils.js.map +1 -1
- package/lib/components/Dialog/Dialog.d.ts.map +1 -1
- package/lib/components/Dialog/Dialog.js +2 -2
- package/lib/components/Dialog/Dialog.js.map +1 -1
- package/lib/components/Dialog/Dialog.styles.d.ts +3 -0
- package/lib/components/Dialog/Dialog.styles.d.ts.map +1 -1
- package/lib/components/Dialog/Dialog.styles.js +29 -2
- package/lib/components/Dialog/Dialog.styles.js.map +1 -1
- package/lib/components/Dialog/Dialog.types.d.ts +34 -34
- package/lib/components/Dialog/Dialog.types.d.ts.map +1 -1
- package/lib/components/Dialog/Dialog.types.js +0 -1
- package/lib/components/Dialog/Dialog.types.js.map +1 -1
- package/lib/components/Dialog/FormDialog.d.ts +4 -1
- package/lib/components/Dialog/FormDialog.d.ts.map +1 -1
- package/lib/components/Dialog/FormDialog.js +4 -5
- package/lib/components/Dialog/FormDialog.js.map +1 -1
- package/lib/components/Dialog/InfoDialog.d.ts +0 -1
- package/lib/components/Dialog/InfoDialog.d.ts.map +1 -1
- package/lib/components/Dialog/InfoDialog.js +15 -13
- package/lib/components/Dialog/InfoDialog.js.map +1 -1
- package/lib/components/Dialog/InfoDialog.styles.d.ts +6 -0
- package/lib/components/Dialog/InfoDialog.styles.d.ts.map +1 -0
- package/lib/components/Dialog/InfoDialog.styles.js +18 -0
- package/lib/components/Dialog/InfoDialog.styles.js.map +1 -0
- package/lib/components/Drawer/Drawer.d.ts +9 -9
- package/lib/components/Drawer/Drawer.d.ts.map +1 -1
- package/lib/components/Drawer/Drawer.js.map +1 -1
- package/lib/components/Email/EmailDisplay.d.ts +1 -1
- package/lib/components/Email/EmailDisplay.js.map +1 -1
- package/lib/components/EmojiPicker/EmojiPicker.styles.d.ts.map +1 -1
- package/lib/components/EmojiPicker/EmojiPicker.styles.js +2 -7
- package/lib/components/EmojiPicker/EmojiPicker.styles.js.map +1 -1
- package/lib/components/ExpandCollapse/ExpandCollapse.d.ts +6 -6
- package/lib/components/ExpandCollapse/ExpandCollapse.d.ts.map +1 -1
- package/lib/components/ExpandCollapse/ExpandCollapse.js.map +1 -1
- package/lib/components/FieldGroup/FieldGroup.d.ts +1 -3
- package/lib/components/FieldGroup/FieldGroup.d.ts.map +1 -1
- package/lib/components/FieldGroup/FieldGroup.js.map +1 -1
- package/lib/components/FieldValueList/FieldValueList.d.ts +5 -3
- package/lib/components/FieldValueList/FieldValueList.d.ts.map +1 -1
- package/lib/components/FieldValueList/FieldValueList.js.map +1 -1
- package/lib/components/FieldValueList/FieldValueList.test-ids.d.ts +2 -2
- package/lib/components/FieldValueList/FieldValueList.test-ids.d.ts.map +1 -1
- package/lib/components/FieldValueList/index.d.ts +1 -1
- package/lib/components/FieldValueList/index.d.ts.map +1 -1
- package/lib/components/FieldValueList/index.js.map +1 -1
- package/lib/components/File/File.test-ids.d.ts +1 -1
- package/lib/components/File/File.test-ids.d.ts.map +1 -1
- package/lib/components/File/File.test-ids.js +6 -1
- package/lib/components/File/File.test-ids.js.map +1 -1
- package/lib/components/File/FileDisplay.d.ts +2 -2
- package/lib/components/File/FileDisplay.d.ts.map +1 -1
- package/lib/components/File/FileDisplay.js.map +1 -1
- package/lib/components/File/FileInput.d.ts +1 -3
- package/lib/components/File/FileInput.d.ts.map +1 -1
- package/lib/components/File/FileInput.js +1 -1
- package/lib/components/File/FileInput.js.map +1 -1
- package/lib/components/Flex/Flex.d.ts +7 -1
- package/lib/components/Flex/Flex.d.ts.map +1 -1
- package/lib/components/Flex/Flex.js +37 -10
- package/lib/components/Flex/Flex.js.map +1 -1
- package/lib/components/FormControl/FormControl.d.ts +3 -2
- package/lib/components/FormControl/FormControl.d.ts.map +1 -1
- package/lib/components/FormControl/FormControl.js.map +1 -1
- package/lib/components/FormField/FormField.d.ts +4 -3
- package/lib/components/FormField/FormField.d.ts.map +1 -1
- package/lib/components/FormField/FormField.js +10 -14
- package/lib/components/FormField/FormField.js.map +1 -1
- package/lib/components/FormField/FormField.test-ids.d.ts +2 -1
- package/lib/components/FormField/FormField.test-ids.d.ts.map +1 -1
- package/lib/components/FormField/FormField.test-ids.js +3 -2
- package/lib/components/FormField/FormField.test-ids.js.map +1 -1
- package/lib/components/Grid/Grid.d.ts.map +1 -1
- package/lib/components/Grid/Grid.js +0 -3
- package/lib/components/Grid/Grid.js.map +1 -1
- package/lib/components/Grid/Grid.types.d.ts +6 -6
- package/lib/components/Grid/Grid.types.js.map +1 -1
- package/lib/components/Icon/iconNames.d.ts +2 -2
- package/lib/components/Icon/iconNames.d.ts.map +1 -1
- package/lib/components/Icon/iconNames.js +2 -0
- package/lib/components/Icon/iconNames.js.map +1 -1
- package/lib/components/Icon/icons/phone-merge-solid.icon.d.ts +4 -0
- package/lib/components/Icon/icons/phone-merge-solid.icon.d.ts.map +1 -0
- package/lib/components/Icon/icons/phone-merge-solid.icon.js +6 -0
- package/lib/components/Icon/icons/phone-merge-solid.icon.js.map +1 -0
- package/lib/components/Icon/icons/phone-merge.icon.d.ts +4 -0
- package/lib/components/Icon/icons/phone-merge.icon.d.ts.map +1 -0
- package/lib/components/Icon/icons/phone-merge.icon.js +6 -0
- package/lib/components/Icon/icons/phone-merge.icon.js.map +1 -0
- package/lib/components/IconPicker/IconPicker.js +2 -2
- package/lib/components/IconPicker/IconPicker.js.map +1 -1
- package/lib/components/Input/Input.d.ts +1 -1
- package/lib/components/Input/Input.js +1 -1
- package/lib/components/Input/Input.js.map +1 -1
- package/lib/components/Input/Input.test-ids.d.ts +1 -1
- package/lib/components/Input/Input.test-ids.d.ts.map +1 -1
- package/lib/components/Input/Input.test-ids.js +2 -1
- package/lib/components/Input/Input.test-ids.js.map +1 -1
- package/lib/components/Label/Label.d.ts +1 -1
- package/lib/components/Label/Label.js.map +1 -1
- package/lib/components/Lightbox/Lightbox.types.d.ts +1 -1
- package/lib/components/Lightbox/Lightbox.types.d.ts.map +1 -1
- package/lib/components/Lightbox/Lightbox.types.js.map +1 -1
- package/lib/components/Link/Link.d.ts +1 -1
- package/lib/components/Link/Link.js.map +1 -1
- package/lib/components/List/List.d.ts.map +1 -1
- package/lib/components/List/List.js.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.d.ts +1 -1
- package/lib/components/ListToolbar/ListToolbar.d.ts.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.js +49 -17
- package/lib/components/ListToolbar/ListToolbar.js.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.styles.d.ts +3 -1
- package/lib/components/ListToolbar/ListToolbar.styles.d.ts.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.styles.js +2 -3
- package/lib/components/ListToolbar/ListToolbar.styles.js.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.test-ids.d.ts +2 -0
- package/lib/components/ListToolbar/ListToolbar.test-ids.d.ts.map +1 -0
- package/lib/components/ListToolbar/ListToolbar.test-ids.js +7 -0
- package/lib/components/ListToolbar/ListToolbar.test-ids.js.map +1 -0
- package/lib/components/ListToolbar/ListToolbar.types.d.ts +32 -9
- package/lib/components/ListToolbar/ListToolbar.types.d.ts.map +1 -1
- package/lib/components/ListToolbar/ListToolbar.types.js.map +1 -1
- package/lib/components/ListToolbar/helpers.d.ts +10 -0
- package/lib/components/ListToolbar/helpers.d.ts.map +1 -0
- package/lib/components/ListToolbar/helpers.js +46 -0
- package/lib/components/ListToolbar/helpers.js.map +1 -0
- package/lib/components/ListToolbar/index.d.ts +1 -0
- package/lib/components/ListToolbar/index.d.ts.map +1 -1
- package/lib/components/ListToolbar/index.js +1 -0
- package/lib/components/ListToolbar/index.js.map +1 -1
- package/lib/components/LiveLog/LiveLog.d.ts.map +1 -1
- package/lib/components/LiveLog/LiveLog.js +17 -16
- package/lib/components/LiveLog/LiveLog.js.map +1 -1
- package/lib/components/Location/Location.test-ids.d.ts +1 -1
- package/lib/components/Location/Location.test-ids.d.ts.map +1 -1
- package/lib/components/Location/Location.test-ids.js +5 -1
- package/lib/components/Location/Location.test-ids.js.map +1 -1
- package/lib/components/Location/LocationDisplay.d.ts +1 -1
- package/lib/components/Location/LocationDisplay.js.map +1 -1
- package/lib/components/Location/LocationInput.js +1 -1
- package/lib/components/Location/LocationInput.js.map +1 -1
- package/lib/components/Location/utils.d.ts +1 -1
- package/lib/components/Location/utils.d.ts.map +1 -1
- package/lib/components/Location/utils.js +1 -1
- package/lib/components/Location/utils.js.map +1 -1
- package/lib/components/Menu/Menu.styles.d.ts.map +1 -1
- package/lib/components/Menu/Menu.styles.js +1 -4
- package/lib/components/Menu/Menu.styles.js.map +1 -1
- package/lib/components/Menu/Menu.test-ids.d.ts +2 -2
- package/lib/components/Menu/Menu.test-ids.d.ts.map +1 -1
- package/lib/components/Menu/Menu.types.d.ts +6 -12
- package/lib/components/Menu/Menu.types.d.ts.map +1 -1
- package/lib/components/Menu/Menu.types.js.map +1 -1
- package/lib/components/Menu/NavItemsList.d.ts.map +1 -1
- package/lib/components/Menu/NavItemsList.js +2 -0
- package/lib/components/Menu/NavItemsList.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.d.ts +3 -3
- package/lib/components/MenuButton/MenuButton.d.ts.map +1 -1
- package/lib/components/MenuButton/MenuButton.js +6 -4
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.test-ids.d.ts +2 -0
- package/lib/components/MenuButton/MenuButton.test-ids.d.ts.map +1 -0
- package/lib/components/MenuButton/MenuButton.test-ids.js +3 -0
- package/lib/components/MenuButton/MenuButton.test-ids.js.map +1 -0
- package/lib/components/MetaList/MetaList.test-ids.d.ts +1 -1
- package/lib/components/MetaList/MetaList.test-ids.d.ts.map +1 -1
- package/lib/components/Modal/Modal.d.ts.map +1 -1
- package/lib/components/Modal/Modal.js +3 -5
- package/lib/components/Modal/Modal.js.map +1 -1
- package/lib/components/Modal/Modal.styles.js +1 -1
- package/lib/components/Modal/Modal.styles.js.map +1 -1
- package/lib/components/Modal/Modal.types.d.ts +25 -71
- package/lib/components/Modal/Modal.types.d.ts.map +1 -1
- package/lib/components/Modal/Modal.types.js.map +1 -1
- package/lib/components/Modal/ModalManager.d.ts.map +1 -1
- package/lib/components/Modal/ModalManager.js +5 -2
- package/lib/components/Modal/ModalManager.js.map +1 -1
- package/lib/components/MultiStepForm/HorizontalFormProgress.d.ts.map +1 -1
- package/lib/components/MultiStepForm/HorizontalFormProgress.js +4 -0
- package/lib/components/MultiStepForm/HorizontalFormProgress.js.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.d.ts.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.js +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.js.map +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.types.d.ts +1 -1
- package/lib/components/MultiStepForm/MultiStepForm.types.js.map +1 -1
- package/lib/components/Number/Number.test-ids.d.ts +2 -2
- package/lib/components/Number/Number.test-ids.d.ts.map +1 -1
- package/lib/components/Number/Number.test-ids.js +8 -2
- package/lib/components/Number/Number.test-ids.js.map +1 -1
- package/lib/components/Number/NumberInput.js +1 -1
- package/lib/components/Number/NumberInput.js.map +1 -1
- package/lib/components/Number/NumberRangeInput.js +1 -1
- package/lib/components/Number/NumberRangeInput.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplates.js +2 -2
- package/lib/components/PageTemplates/PageTemplates.js.map +1 -1
- package/lib/components/Phone/Phone.test-ids.d.ts +1 -1
- package/lib/components/Phone/Phone.test-ids.d.ts.map +1 -1
- package/lib/components/Phone/Phone.test-ids.js +3 -1
- package/lib/components/Phone/Phone.test-ids.js.map +1 -1
- package/lib/components/Phone/PhoneDisplay.d.ts +1 -1
- package/lib/components/Phone/PhoneDisplay.js.map +1 -1
- package/lib/components/Phone/PhoneInput.js +2 -2
- package/lib/components/Phone/PhoneInput.js.map +1 -1
- package/lib/components/Popover/Popover.d.ts +4 -3
- package/lib/components/Popover/Popover.d.ts.map +1 -1
- package/lib/components/Popover/Popover.js +36 -24
- package/lib/components/Popover/Popover.js.map +1 -1
- package/lib/components/Popover/PopoverManager.d.ts.map +1 -1
- package/lib/components/Popover/PopoverManager.js +11 -10
- package/lib/components/Popover/PopoverManager.js.map +1 -1
- package/lib/components/Popover/modifiers.d.ts +1 -0
- package/lib/components/Popover/modifiers.d.ts.map +1 -1
- package/lib/components/Popover/modifiers.js +116 -1
- package/lib/components/Popover/modifiers.js.map +1 -1
- package/lib/components/Progress/Progress.styles.d.ts.map +1 -1
- package/lib/components/Progress/Progress.styles.js +25 -20
- package/lib/components/Progress/Progress.styles.js.map +1 -1
- package/lib/components/Progress/Progress.types.d.ts +2 -2
- package/lib/components/Progress/Progress.types.js.map +1 -1
- package/lib/components/RadioCheck/RadioCheck.js +2 -2
- package/lib/components/RadioCheck/RadioCheck.js.map +1 -1
- package/lib/components/SearchInput/SearchInput.d.ts +1 -1
- package/lib/components/SearchInput/SearchInput.d.ts.map +1 -1
- package/lib/components/SearchInput/SearchInput.js +1 -9
- package/lib/components/SearchInput/SearchInput.js.map +1 -1
- package/lib/components/Select/Select.js +2 -2
- package/lib/components/Select/Select.js.map +1 -1
- package/lib/components/Select/Select.test-ids.d.ts +1 -1
- package/lib/components/Select/Select.test-ids.d.ts.map +1 -1
- package/lib/components/Select/Select.test-ids.js +2 -1
- package/lib/components/Select/Select.test-ids.js.map +1 -1
- package/lib/components/Skeleton/LineSkeleton.d.ts +2 -2
- package/lib/components/Skeleton/LineSkeleton.js.map +1 -1
- package/lib/components/Skeleton/RectangleSkeleton.d.ts +3 -3
- package/lib/components/Skeleton/RectangleSkeleton.js.map +1 -1
- package/lib/components/Slider/Slider.js +1 -1
- package/lib/components/Slider/Slider.js.map +1 -1
- package/lib/components/Slider/Slider.styles.d.ts.map +1 -1
- package/lib/components/Slider/Slider.styles.js +114 -128
- package/lib/components/Slider/Slider.styles.js.map +1 -1
- package/lib/components/Slider/Slider.test-ids.d.ts +1 -1
- package/lib/components/Slider/Slider.test-ids.d.ts.map +1 -1
- package/lib/components/Slider/Slider.test-ids.js +2 -1
- package/lib/components/Slider/Slider.test-ids.js.map +1 -1
- package/lib/components/Slider/Slider.types.d.ts +3 -9
- package/lib/components/Slider/Slider.types.d.ts.map +1 -1
- package/lib/components/Slider/Slider.types.js.map +1 -1
- package/lib/components/Slider/utils.d.ts.map +1 -1
- package/lib/components/Slider/utils.js +0 -1
- package/lib/components/Slider/utils.js.map +1 -1
- package/lib/components/SummaryItem/SummaryItem.d.ts +2 -1
- package/lib/components/SummaryItem/SummaryItem.d.ts.map +1 -1
- package/lib/components/SummaryItem/SummaryItem.js.map +1 -1
- package/lib/components/SummaryItem/SummaryItem.test-ids.d.ts +1 -1
- package/lib/components/SummaryItem/SummaryItem.test-ids.d.ts.map +1 -1
- package/lib/components/SummaryList/SummaryList.d.ts +2 -2
- package/lib/components/SummaryList/SummaryList.d.ts.map +1 -1
- package/lib/components/SummaryList/SummaryList.js.map +1 -1
- package/lib/components/Table/Table.d.ts +1 -1
- package/lib/components/Table/Table.js.map +1 -1
- package/lib/components/Tabs/Tab.d.ts.map +1 -1
- package/lib/components/Tabs/Tab.js +21 -18
- package/lib/components/Tabs/Tab.js.map +1 -1
- package/lib/components/Tabs/TabPanel.d.ts +1 -1
- package/lib/components/Tabs/TabPanel.d.ts.map +1 -1
- package/lib/components/Tabs/TabPanel.js.map +1 -1
- package/lib/components/Tabs/Tabs.types.d.ts +1 -1
- package/lib/components/Tabs/Tabs.types.js.map +1 -1
- package/lib/components/Text/Text.d.ts +2 -4
- package/lib/components/Text/Text.d.ts.map +1 -1
- package/lib/components/Text/Text.js.map +1 -1
- package/lib/components/TextArea/TextArea.js +1 -1
- package/lib/components/TextArea/TextArea.js.map +1 -1
- package/lib/components/TextArea/TextArea.test-ids.d.ts +1 -1
- package/lib/components/TextArea/TextArea.test-ids.d.ts.map +1 -1
- package/lib/components/TextArea/TextArea.test-ids.js +2 -1
- package/lib/components/TextArea/TextArea.test-ids.js.map +1 -1
- package/lib/components/Toaster/Toaster.types.d.ts +1 -1
- package/lib/components/Toaster/Toaster.types.d.ts.map +1 -1
- package/lib/components/Toaster/Toaster.types.js.map +1 -1
- package/lib/components/Tooltip/Tooltip.d.ts +3 -3
- package/lib/components/Tooltip/Tooltip.js.map +1 -1
- package/lib/components/URL/URLDisplay.d.ts +1 -1
- package/lib/components/URL/URLDisplay.js +2 -2
- package/lib/components/URL/URLDisplay.js.map +1 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/index.d.ts.map +1 -1
- package/lib/hooks/index.js +1 -0
- package/lib/hooks/index.js.map +1 -1
- package/lib/hooks/useArrows.js +1 -1
- package/lib/hooks/useArrows.js.map +1 -1
- package/lib/hooks/useBreakpoint.d.ts.map +1 -1
- package/lib/hooks/useBreakpoint.js +4 -1
- package/lib/hooks/useBreakpoint.js.map +1 -1
- package/lib/hooks/useChToPxConversionFactor.d.ts +3 -0
- package/lib/hooks/useChToPxConversionFactor.d.ts.map +1 -0
- package/lib/hooks/useChToPxConversionFactor.js +13 -0
- package/lib/hooks/useChToPxConversionFactor.js.map +1 -0
- package/lib/hooks/useElement.d.ts +1 -1
- package/lib/hooks/useElement.d.ts.map +1 -1
- package/lib/hooks/useI18n.d.ts +13 -0
- package/lib/hooks/useI18n.d.ts.map +1 -1
- package/lib/hooks/useScrollToggle.d.ts.map +1 -1
- package/lib/hooks/useScrollToggle.js +0 -1
- package/lib/hooks/useScrollToggle.js.map +1 -1
- package/lib/hooks/useTestIds.d.ts +1 -1
- package/lib/hooks/useTestIds.d.ts.map +1 -1
- package/lib/hooks/useTestIds.js +3 -0
- package/lib/hooks/useTestIds.js.map +1 -1
- package/lib/i18n/default.d.ts +13 -0
- package/lib/i18n/default.d.ts.map +1 -1
- package/lib/i18n/default.js +14 -0
- package/lib/i18n/default.js.map +1 -1
- package/lib/i18n/i18n.d.ts +13 -0
- package/lib/i18n/i18n.d.ts.map +1 -1
- package/lib/i18n/translate.d.ts +2 -6
- package/lib/i18n/translate.d.ts.map +1 -1
- package/lib/i18n/translate.js.map +1 -1
- package/lib/styles/gradients.d.ts.map +1 -1
- package/lib/styles/gradients.js.map +1 -1
- package/lib/theme/ThemeMachine.js.map +1 -1
- package/lib/types/types.d.ts +7 -2
- package/lib/types/types.d.ts.map +1 -1
- package/lib/types/types.js.map +1 -1
- package/lib/utils/createTestIds.d.ts +1 -6
- package/lib/utils/createTestIds.d.ts.map +1 -1
- package/lib/utils/createTestIds.js +2 -4
- package/lib/utils/createTestIds.js.map +1 -1
- package/lib/utils/debounce.d.ts +2 -2
- package/lib/utils/debounce.d.ts.map +1 -1
- package/lib/utils/debounce.js +9 -10
- package/lib/utils/debounce.js.map +1 -1
- package/lib/utils/getEdge.d.ts +7 -0
- package/lib/utils/getEdge.d.ts.map +1 -0
- package/lib/utils/getEdge.js +9 -0
- package/lib/utils/getEdge.js.map +1 -0
- package/lib/utils/index.d.ts +2 -1
- package/lib/utils/index.d.ts.map +1 -1
- package/lib/utils/index.js +2 -0
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/kebabToCamel.d.ts +1 -3
- package/lib/utils/kebabToCamel.d.ts.map +1 -1
- package/lib/utils/kebabToCamel.js +1 -3
- package/lib/utils/kebabToCamel.js.map +1 -1
- package/lib/utils/throttle.d.ts +4 -0
- package/lib/utils/throttle.d.ts.map +1 -0
- package/lib/utils/throttle.js +15 -0
- package/lib/utils/throttle.js.map +1 -0
- package/package.json +2 -2
|
@@ -43,52 +43,29 @@ export interface ModalOptions {
|
|
|
43
43
|
* @default true
|
|
44
44
|
*/
|
|
45
45
|
unmountWhenMinimized?: boolean;
|
|
46
|
-
/**
|
|
47
|
-
* Used to identify the modal. Will be passed back as an argument in life cycle functions.
|
|
48
|
-
*/
|
|
46
|
+
/** Used to identify the modal. Will be passed back as an argument in life cycle functions. */
|
|
49
47
|
id?: string;
|
|
50
|
-
/**
|
|
51
|
-
* Life cycle function that will be run when the modal is minimized.
|
|
52
|
-
*/
|
|
48
|
+
/** Life cycle function that will be run when the modal is minimized. */
|
|
53
49
|
onMinimize?: (id: string) => void;
|
|
54
|
-
/**
|
|
55
|
-
* Life cycle function that will be run when the modal is maximized.
|
|
56
|
-
*/
|
|
50
|
+
/** Life cycle function that will be run when the modal is maximized. */
|
|
57
51
|
onMaximize?: (id: string) => void;
|
|
58
|
-
/**
|
|
59
|
-
* Life cycle function that will be run when the modal is maximized.
|
|
60
|
-
*/
|
|
52
|
+
/** Life cycle function that will be run when the modal is maximized. */
|
|
61
53
|
onDock?: (id: string) => void;
|
|
62
|
-
/**
|
|
63
|
-
* Life cycle function that will be run when the modal is activated (un minimized).
|
|
64
|
-
*/
|
|
54
|
+
/** Life cycle function that will be run when the modal is activated (un minimized). */
|
|
65
55
|
onActivate?: (id: string) => void;
|
|
66
|
-
/**
|
|
67
|
-
* Life cycle function that will be run when the modal is dismissed.
|
|
68
|
-
*/
|
|
56
|
+
/** Life cycle function that will be run when the modal is dismissed. */
|
|
69
57
|
onDismiss?: (id: string) => void;
|
|
70
58
|
}
|
|
71
59
|
export interface ModalProps extends BaseProps, AsProp {
|
|
72
|
-
/**
|
|
73
|
-
* Place a modal into a loading state by way of a bool or an object which allows for a custom message and determinate progress.
|
|
74
|
-
*/
|
|
60
|
+
/** Place a modal into a loading state by way of a bool or an object which allows for a custom message and determinate progress. */
|
|
75
61
|
progress?: boolean | Pick<ProgressProps, 'message' | 'minValue' | 'maxValue' | 'value'>;
|
|
76
|
-
/**
|
|
77
|
-
* Heading for the Modal.
|
|
78
|
-
*/
|
|
62
|
+
/** Heading for the Modal. */
|
|
79
63
|
heading: ReactNode;
|
|
80
|
-
/**
|
|
81
|
-
* Count for list data presented in the Modal.
|
|
82
|
-
*/
|
|
64
|
+
/** Count for list data presented in the Modal. */
|
|
83
65
|
count?: number;
|
|
84
|
-
/**
|
|
85
|
-
/**
|
|
86
|
-
* Content for the Modal.
|
|
87
|
-
*/
|
|
66
|
+
/** Content for the Modal. */
|
|
88
67
|
children: ReactNode;
|
|
89
|
-
/**
|
|
90
|
-
* Actions for the Modal.
|
|
91
|
-
*/
|
|
68
|
+
/** Actions for the Modal. */
|
|
92
69
|
actions?: ReactNode;
|
|
93
70
|
/**
|
|
94
71
|
* Render the modal in full width and height.
|
|
@@ -105,25 +82,15 @@ export interface ModalProps extends BaseProps, AsProp {
|
|
|
105
82
|
* @default false
|
|
106
83
|
*/
|
|
107
84
|
autoWidth?: boolean;
|
|
108
|
-
/**
|
|
109
|
-
* Takes a React Ref of the element to be focused initially on mounting Modal.
|
|
110
|
-
*/
|
|
85
|
+
/** Takes a React Ref of the element to be focused initially on mounting Modal. */
|
|
111
86
|
defaultFocus?: RefObject<HTMLElement>;
|
|
112
|
-
/**
|
|
113
|
-
* Accepts a callback function that gets invoked before opening a Modal.
|
|
114
|
-
*/
|
|
87
|
+
/** Accepts a callback function that gets invoked before opening a Modal. */
|
|
115
88
|
onBeforeOpen?: () => void;
|
|
116
|
-
/**
|
|
117
|
-
* Accepts a callback function that gets invoked after opening a Modal.
|
|
118
|
-
*/
|
|
89
|
+
/** Accepts a callback function that gets invoked after opening a Modal. */
|
|
119
90
|
onAfterOpen?: () => void;
|
|
120
|
-
/**
|
|
121
|
-
* Accepts a callback function that gets invoked before closing a Modal.
|
|
122
|
-
*/
|
|
91
|
+
/** Accepts a callback function that gets invoked before closing a Modal. */
|
|
123
92
|
onBeforeClose?: () => void;
|
|
124
|
-
/**
|
|
125
|
-
* Accepts a callback function that gets invoked after closing a Modal.
|
|
126
|
-
*/
|
|
93
|
+
/** Accepts a callback function that gets invoked after closing a Modal. */
|
|
127
94
|
onAfterClose?: () => void;
|
|
128
95
|
/**
|
|
129
96
|
* Accepts a callback function that returns a boolean before dismissing a modal.
|
|
@@ -153,38 +120,25 @@ export interface ModalProps extends BaseProps, AsProp {
|
|
|
153
120
|
}
|
|
154
121
|
export type ModalState = 'open' | 'closed' | 'minimized' | 'maximized' | 'docked';
|
|
155
122
|
export interface ModalMethods<P extends object = object> {
|
|
156
|
-
/**
|
|
157
|
-
* Closes the referenced Modal when called.
|
|
158
|
-
*/
|
|
123
|
+
/** Closes the referenced Modal when called. */
|
|
159
124
|
dismiss: () => void;
|
|
160
|
-
/**
|
|
161
|
-
* Updates the referenced Modal with a set of props.
|
|
162
|
-
*/
|
|
125
|
+
/** Updates the referenced Modal with a set of props. */
|
|
163
126
|
update: (props: Partial<P>) => void;
|
|
164
|
-
/**
|
|
165
|
-
* Minimizes the referenced Modal.
|
|
166
|
-
*/
|
|
127
|
+
/** Minimizes the referenced Modal. */
|
|
167
128
|
minimize: () => void;
|
|
168
|
-
/**
|
|
169
|
-
* Maximizes the referenced Modal.
|
|
170
|
-
*/
|
|
129
|
+
/** Maximizes the referenced Modal. */
|
|
171
130
|
maximize: () => void;
|
|
172
|
-
/**
|
|
173
|
-
* docks the referenced Modal.
|
|
174
|
-
*/
|
|
131
|
+
/** Docks the referenced Modal. */
|
|
175
132
|
dock: () => void;
|
|
176
|
-
/**
|
|
177
|
-
* Will reopen the referenced Modal if minimized, and minimize any open Modals that are minimizable.
|
|
178
|
-
*/
|
|
133
|
+
/** Will reopen the referenced Modal if minimized, and minimize any open Modals that are minimizable. */
|
|
179
134
|
activate: () => void;
|
|
180
|
-
/**
|
|
181
|
-
* Removes the referenced Modal from the DOM.
|
|
182
|
-
*/
|
|
135
|
+
/** Removes the referenced Modal from the DOM. */
|
|
183
136
|
unmount: () => void;
|
|
184
137
|
}
|
|
185
138
|
export interface ModalManagerContextValue {
|
|
186
139
|
/**
|
|
187
|
-
* The function that will create the Modal. This function accepts the component to render a Modal,
|
|
140
|
+
* The function that will create the Modal. This function accepts the component to render a Modal,
|
|
141
|
+
* props for that component, and options for that Modal.
|
|
188
142
|
*/
|
|
189
143
|
create: <P extends object>(component: ComponentType<P>, props?: DeferInfer<P>, options?: ModalOptions) => ModalMethods<P>;
|
|
190
144
|
ModalContext: Context<ModalContextValue>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.types.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAE1E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEjE,MAAM,WAAW,iBAAiB;IAChC,2DAA2D;IAC3D,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,YAAY;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B
|
|
1
|
+
{"version":3,"file":"Modal.types.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.types.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode, RefObject, Context } from 'react';\n\nimport type { ProgressProps } from '@pega/cosmos-react-core';\n\nimport type { BaseProps, AsProp, DeferInfer } from '../../types';\n\nexport interface ModalManagerProps {\n /** Content that will be provided modal manager context. */\n children: ReactNode;\n}\n\nexport interface ModalOptions {\n /**\n * If true, the Modal will render as an alert that is not dismissible.\n * @default false\n */\n alert?: boolean;\n /**\n * Toggle Esc keypress action or clicking backdrop to dismiss Modal. Also displays dismiss button on Modal header.\n * Not valid for Modals of type alert.\n * @default alert ? false : true\n */\n dismissible?: boolean;\n /**\n * Toggle minimize button in header thereby helping in rendering minimizable/non-minimizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n minimizable?: boolean;\n /**\n * Toggle maximize button in header thereby helping in rendering maximizable/non-maximizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n maximizable?: boolean;\n /** Positions the modal in the right corner without backdrop\n * @default false\n */\n dockable?: boolean;\n /**\n * If true, the Modal will initially render in a minimized state.\n * @default false\n */\n defaultMinimized?: boolean;\n /**\n * If true, the Modal content will be removed from the DOM when in a minimized state.\n * @default true\n */\n unmountWhenMinimized?: boolean;\n
|
|
1
|
+
{"version":3,"file":"Modal.types.js","sourceRoot":"","sources":["../../../src/components/Modal/Modal.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentType, ReactNode, RefObject, Context } from 'react';\n\nimport type { ProgressProps } from '@pega/cosmos-react-core';\n\nimport type { BaseProps, AsProp, DeferInfer } from '../../types';\n\nexport interface ModalManagerProps {\n /** Content that will be provided modal manager context. */\n children: ReactNode;\n}\n\nexport interface ModalOptions {\n /**\n * If true, the Modal will render as an alert that is not dismissible.\n * @default false\n */\n alert?: boolean;\n /**\n * Toggle Esc keypress action or clicking backdrop to dismiss Modal. Also displays dismiss button on Modal header.\n * Not valid for Modals of type alert.\n * @default alert ? false : true\n */\n dismissible?: boolean;\n /**\n * Toggle minimize button in header thereby helping in rendering minimizable/non-minimizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n minimizable?: boolean;\n /**\n * Toggle maximize button in header thereby helping in rendering maximizable/non-maximizable Modals.\n * Not valid for Modals of type alert.\n * @default false\n */\n maximizable?: boolean;\n /** Positions the modal in the right corner without backdrop\n * @default false\n */\n dockable?: boolean;\n /**\n * If true, the Modal will initially render in a minimized state.\n * @default false\n */\n defaultMinimized?: boolean;\n /**\n * If true, the Modal content will be removed from the DOM when in a minimized state.\n * @default true\n */\n unmountWhenMinimized?: boolean;\n /** Used to identify the modal. Will be passed back as an argument in life cycle functions. */\n id?: string;\n /** Life cycle function that will be run when the modal is minimized. */\n onMinimize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onMaximize?: (id: string) => void;\n /** Life cycle function that will be run when the modal is maximized. */\n onDock?: (id: string) => void;\n /** Life cycle function that will be run when the modal is activated (un minimized). */\n onActivate?: (id: string) => void;\n /** Life cycle function that will be run when the modal is dismissed. */\n onDismiss?: (id: string) => void;\n}\n\nexport interface ModalProps extends BaseProps, AsProp {\n /** Place a modal into a loading state by way of a bool or an object which allows for a custom message and determinate progress. */\n progress?: boolean | Pick<ProgressProps, 'message' | 'minValue' | 'maxValue' | 'value'>;\n /** Heading for the Modal. */\n heading: ReactNode;\n /** Count for list data presented in the Modal. */\n count?: number;\n /** Content for the Modal. */\n children: ReactNode;\n /** Actions for the Modal. */\n actions?: ReactNode;\n /**\n * Render the modal in full width and height.\n * @default false\n */\n stretch?: boolean;\n /**\n * Toggle to position the Modal vertically centered or not.\n * @default false\n */\n center?: boolean;\n /**\n * Automatically compute the width of the Modal based on the content.\n * @default false\n */\n autoWidth?: boolean;\n /** Takes a React Ref of the element to be focused initially on mounting Modal. */\n defaultFocus?: RefObject<HTMLElement>;\n /** Accepts a callback function that gets invoked before opening a Modal. */\n onBeforeOpen?: () => void;\n /** Accepts a callback function that gets invoked after opening a Modal. */\n onAfterOpen?: () => void;\n /** Accepts a callback function that gets invoked before closing a Modal. */\n onBeforeClose?: () => void;\n /** Accepts a callback function that gets invoked after closing a Modal. */\n onAfterClose?: () => void;\n /**\n * Accepts a callback function that returns a boolean before dismissing a modal.\n * If the boolean is false, the modal will not be dismissed.\n */\n onRequestDismiss?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before minimizing a modal.\n * If the boolean is false, the modal will not be minimized.\n */\n onRequestMinimize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before maximizing a modal.\n * If the boolean is false, the modal will not be maximized.\n */\n onRequestMaximize?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before docking a modal.\n * If the boolean is false, the modal will not be dockable.\n */\n onRequestDock?: () => boolean | void;\n /**\n * Accepts a callback function that returns a boolean before activating a modal.\n * If the boolean is false, the modal will not be activated.\n */\n onRequestActivate?: () => boolean | void;\n}\n\nexport type ModalState = 'open' | 'closed' | 'minimized' | 'maximized' | 'docked';\n\nexport interface ModalMethods<P extends object = object> {\n /** Closes the referenced Modal when called. */\n dismiss: () => void;\n /** Updates the referenced Modal with a set of props. */\n update: (props: Partial<P>) => void;\n /** Minimizes the referenced Modal. */\n minimize: () => void;\n /** Maximizes the referenced Modal. */\n maximize: () => void;\n /** Docks the referenced Modal. */\n dock: () => void;\n /** Will reopen the referenced Modal if minimized, and minimize any open Modals that are minimizable. */\n activate: () => void;\n /** Removes the referenced Modal from the DOM. */\n unmount: () => void;\n}\n\nexport interface ModalManagerContextValue {\n /**\n * The function that will create the Modal. This function accepts the component to render a Modal,\n * props for that component, and options for that Modal.\n */\n create: <P extends object>(\n component: ComponentType<P>,\n props?: DeferInfer<P>,\n options?: ModalOptions\n ) => ModalMethods<P>;\n ModalContext: Context<ModalContextValue>;\n initialized: boolean;\n}\n\nexport interface ModalContextValue extends ModalMethods, ModalOptions {\n state: ModalState;\n top: boolean;\n /** @internal */\n initialized: boolean;\n}\n\nexport interface ModalObject<P extends object = object> {\n id: string;\n state: ModalState;\n methods: ModalMethods<P>;\n props?: P;\n Component: ComponentType<P>;\n options: ModalOptions;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalManager.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAGjB,OAAO,EAER,MAAM,OAAO,CAAC;AAMf,OAAO,YAAY,CAAC;AAGpB,OAAO,EAIL,iBAAiB,EAEjB,wBAAwB,EACzB,MAAM,eAAe,CAAC;AAGvB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,CAAC;KACzD;CACF;
|
|
1
|
+
{"version":3,"file":"ModalManager.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"AAAA,OAAO,EAKL,iBAAiB,EAGjB,OAAO,EAER,MAAM,OAAO,CAAC;AAMf,OAAO,YAAY,CAAC;AAGpB,OAAO,EAIL,iBAAiB,EAEjB,wBAAwB,EACzB,MAAM,eAAe,CAAC;AAGvB,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC,wBAAwB,CAAC,CAAC;KACzD;CACF;AA6KD,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,CAqHtD,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -72,7 +72,11 @@ const reducer = (modals, payload) => {
|
|
|
72
72
|
return modals;
|
|
73
73
|
}
|
|
74
74
|
};
|
|
75
|
-
const WrappedModal = memo(({ Component, id, options: { alert, dismissible, dockable, minimizable, maximizable }, state, methods, props, top }) => (_jsx(ModalContext.Provider
|
|
75
|
+
const WrappedModal = memo(({ Component, id, options: { alert, dismissible, dockable, minimizable, maximizable }, state, methods, props, top }) => (_jsx(ModalContext.Provider
|
|
76
|
+
// eslint-disable-next-line react/jsx-no-constructed-context-values
|
|
77
|
+
, {
|
|
78
|
+
// eslint-disable-next-line react/jsx-no-constructed-context-values
|
|
79
|
+
value: {
|
|
76
80
|
id,
|
|
77
81
|
alert,
|
|
78
82
|
dismissible,
|
|
@@ -108,7 +112,6 @@ const ModalManager = ({ children }) => {
|
|
|
108
112
|
dismiss: () => {
|
|
109
113
|
dispatch({ action: 'dismiss', modal: { id } });
|
|
110
114
|
options?.onDismiss?.(id);
|
|
111
|
-
// cSpell:words deref
|
|
112
115
|
const initiator = initiatorRef?.deref();
|
|
113
116
|
if (initiator?.isConnected &&
|
|
114
117
|
(initiator instanceof HTMLElement || initiator instanceof SVGElement)) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useReducer,\n useMemo,\n useEffect,\n useContext,\n FunctionComponent,\n ComponentType,\n Dispatch,\n Context,\n memo\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport {\n ModalMethods,\n ModalOptions,\n ModalObject,\n ModalManagerProps,\n ModalState,\n ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n modalManagerContext?: Context<ModalManagerContextValue>;\n }\n}\n\ntype ModalAction =\n | 'create'\n | 'update'\n | 'minimize'\n | 'maximize'\n | 'dock'\n | 'activate'\n | 'dismiss'\n | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n | { action: 'create'; modal: ModalObject<P> }\n | {\n action: 'update';\n modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n }\n | {\n action: Exclude<ModalAction, 'create' | 'update'>;\n modal: Pick<ModalObject, 'id'>;\n };\n\nconst reducer = <P extends object>(\n modals: ModalObject[],\n payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n switch (payload.action) {\n case 'create':\n return [\n ...modals.map(modal => {\n if (\n (!payload.modal.options.alert &&\n payload.modal.state === 'open' &&\n !modal.options.alert &&\n modal.state === 'open' &&\n modal.options.minimizable) ||\n payload.modal.options.dockable\n ) {\n modal.state = 'minimized';\n }\n\n return modal;\n }),\n payload.modal\n ];\n\n case 'unmount':\n return modals.filter(modal => modal.id !== payload.modal.id);\n\n case 'dismiss':\n return modals.map(modal => {\n modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n return modal;\n });\n\n case 'update':\n return modals.map(modal => {\n modal.props =\n modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n return modal;\n });\n\n case 'activate':\n return modals.map(modal => {\n if (modal.id === payload.modal.id && !modal.options.dockable) {\n modal.state = 'open';\n } else if (modal.id === payload.modal.id && modal.options.dockable) {\n modal.state = 'docked';\n } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n modal.state = 'minimized';\n }\n\n return modal;\n });\n\n case 'minimize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n return modal;\n });\n\n case 'maximize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n return modal;\n });\n\n case 'dock':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n return modal;\n });\n\n default:\n return modals;\n }\n};\n\nconst WrappedModal = memo(\n ({\n Component,\n id,\n options: { alert, dismissible, dockable, minimizable, maximizable },\n state,\n methods,\n props,\n top\n }: ModalObject & { top: boolean }) => (\n <ModalContext.Provider\n value={{\n id,\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n top,\n initialized: true,\n ...methods\n }}\n >\n <Component {...props} />\n </ModalContext.Provider>\n )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n const { open, minimized, alerts } = modals.reduce<{\n open: ModalObject[];\n minimized: ModalObject[];\n alerts: ModalObject[];\n }>(\n (obj, modal) => {\n if (modal.options.alert) obj.alerts.push(modal);\n else if (modal.state === 'minimized' || modal.state === 'docked') {\n obj.minimized.push(modal);\n } else obj.open.push(modal);\n\n return obj;\n },\n { open: [], minimized: [], alerts: [] }\n );\n\n return (\n <>\n {open.map((modal, i) => (\n <WrappedModal\n {...modal}\n top={alerts.length === 0 && i === open.length - 1}\n key={modal.id}\n />\n ))}\n {minimized.length > 0 && (\n <DockedModals>\n {minimized.map(modal => (\n <WrappedModal {...modal} top={false} key={modal.id} />\n ))}\n </DockedModals>\n )}\n {alerts.map((modal, i) => (\n <WrappedModal {...modal} top={i === open.length - 1} key={modal.id} />\n ))}\n </>\n );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n const [modals, dispatch] = useReducer(reducer, []);\n const { disableScroll, enableScroll } = useScrollToggle();\n\n const providerValue = useMemo(\n () => ({\n create: <P extends object>(\n Component: ComponentType<P>,\n props?: P,\n options?: ModalOptions\n ) => {\n const id = options?.id || createUID();\n const initiatorRef = document.activeElement ? new WeakRef(document.activeElement) : null;\n\n const methods: ModalMethods<P> = {\n dismiss: () => {\n dispatch({ action: 'dismiss', modal: { id } });\n options?.onDismiss?.(id);\n // cSpell:words deref\n const initiator = initiatorRef?.deref();\n if (\n initiator?.isConnected &&\n (initiator instanceof HTMLElement || initiator instanceof SVGElement)\n ) {\n initiator.focus();\n }\n },\n update: updateProps => {\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'update',\n modal: { id, props: updateProps }\n });\n },\n minimize: () => {\n dispatch({ action: 'minimize', modal: { id } });\n options?.onMinimize?.(id);\n },\n maximize: () => {\n dispatch({ action: 'maximize', modal: { id } });\n options?.onMaximize?.(id);\n },\n dock: () => {\n dispatch({ action: 'dock', modal: { id } });\n options?.onDock?.(id);\n },\n activate: () => {\n dispatch({ action: 'activate', modal: { id } });\n options?.onActivate?.(id);\n },\n unmount: () => {\n dispatch({ action: 'unmount', modal: { id } });\n }\n };\n\n let defaultState: ModalState;\n if (options?.defaultMinimized) {\n defaultState = 'minimized';\n } else if (options?.dockable) {\n defaultState = 'docked';\n } else {\n defaultState = 'open';\n }\n\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'create',\n modal: {\n id,\n methods,\n Component,\n props,\n state: defaultState,\n options: {\n alert: false,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n ...options,\n dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n }\n }\n });\n\n return methods;\n },\n ModalContext,\n initialized: true\n }),\n []\n );\n\n useEffect(() => {\n if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n disableScroll();\n } else {\n enableScroll();\n }\n }, [modals]);\n\n const { portalTarget } = useConfiguration();\n\n const context = windowIsAvailable\n ? window.cosmos.modalManagerContext ?? ModalManagerContext\n : ModalManagerContext;\n const priorCtx = useContext(context);\n\n // Don't create additional Modal portals.\n if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n return (\n <context.Provider value={providerValue}>\n {children}\n {modals.length > 0 &&\n portalTarget &&\n createPortal(<RenderModals modals={modals} />, portalTarget)}\n </context.Provider>\n );\n};\n\nexport default ModalManager;\n"]}
|
|
1
|
+
{"version":3,"file":"ModalManager.js","sourceRoot":"","sources":["../../../src/components/Modal/ModalManager.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n useReducer,\n useMemo,\n useEffect,\n useContext,\n FunctionComponent,\n ComponentType,\n Dispatch,\n Context,\n memo\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { createUID, windowIsAvailable } from '../../utils';\nimport { useConfiguration, useScrollToggle } from '../../hooks';\nimport { OmitStrict } from '../../types';\nimport '../../init';\n\nimport DockedModals from './DockedModals';\nimport {\n ModalMethods,\n ModalOptions,\n ModalObject,\n ModalManagerProps,\n ModalState,\n ModalManagerContextValue\n} from './Modal.types';\nimport { ModalContext, ModalManagerContext } from './Contexts';\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n modalManagerContext?: Context<ModalManagerContextValue>;\n }\n}\n\ntype ModalAction =\n | 'create'\n | 'update'\n | 'minimize'\n | 'maximize'\n | 'dock'\n | 'activate'\n | 'dismiss'\n | 'unmount';\n\ntype ModalReducerPayload<P extends object> =\n | { action: 'create'; modal: ModalObject<P> }\n | {\n action: 'update';\n modal: Partial<OmitStrict<ModalObject<P>, 'props'>> &\n Pick<ModalObject, 'id'> & { props: Partial<ModalObject<P>['props']> };\n }\n | {\n action: Exclude<ModalAction, 'create' | 'update'>;\n modal: Pick<ModalObject, 'id'>;\n };\n\nconst reducer = <P extends object>(\n modals: ModalObject[],\n payload: ModalReducerPayload<P>\n): ModalObject<any>[] => {\n switch (payload.action) {\n case 'create':\n return [\n ...modals.map(modal => {\n if (\n (!payload.modal.options.alert &&\n payload.modal.state === 'open' &&\n !modal.options.alert &&\n modal.state === 'open' &&\n modal.options.minimizable) ||\n payload.modal.options.dockable\n ) {\n modal.state = 'minimized';\n }\n\n return modal;\n }),\n payload.modal\n ];\n\n case 'unmount':\n return modals.filter(modal => modal.id !== payload.modal.id);\n\n case 'dismiss':\n return modals.map(modal => {\n modal.state = modal.id === payload.modal.id ? 'closed' : modal.state;\n return modal;\n });\n\n case 'update':\n return modals.map(modal => {\n modal.props =\n modal.id === payload.modal.id ? { ...modal.props, ...payload.modal.props } : modal.props;\n return modal;\n });\n\n case 'activate':\n return modals.map(modal => {\n if (modal.id === payload.modal.id && !modal.options.dockable) {\n modal.state = 'open';\n } else if (modal.id === payload.modal.id && modal.options.dockable) {\n modal.state = 'docked';\n } else if (!modal.options.alert && modal.state === 'open' && modal.options.minimizable) {\n modal.state = 'minimized';\n }\n\n return modal;\n });\n\n case 'minimize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.minimizable ? 'minimized' : modal.state;\n return modal;\n });\n\n case 'maximize':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.maximizable ? 'maximized' : modal.state;\n return modal;\n });\n\n case 'dock':\n return modals.map(modal => {\n modal.state =\n modal.id === payload.modal.id && modal.options.dockable ? 'docked' : 'minimized';\n return modal;\n });\n\n default:\n return modals;\n }\n};\n\nconst WrappedModal = memo(\n ({\n Component,\n id,\n options: { alert, dismissible, dockable, minimizable, maximizable },\n state,\n methods,\n props,\n top\n }: ModalObject & { top: boolean }) => (\n <ModalContext.Provider\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n value={{\n id,\n alert,\n dismissible,\n minimizable,\n maximizable,\n dockable,\n state,\n top,\n initialized: true,\n ...methods\n }}\n >\n <Component {...props} />\n </ModalContext.Provider>\n )\n);\n\nconst RenderModals = ({ modals }: { modals: ModalObject[] }) => {\n const { open, minimized, alerts } = modals.reduce<{\n open: ModalObject[];\n minimized: ModalObject[];\n alerts: ModalObject[];\n }>(\n (obj, modal) => {\n if (modal.options.alert) obj.alerts.push(modal);\n else if (modal.state === 'minimized' || modal.state === 'docked') {\n obj.minimized.push(modal);\n } else obj.open.push(modal);\n\n return obj;\n },\n { open: [], minimized: [], alerts: [] }\n );\n\n return (\n <>\n {open.map((modal, i) => (\n <WrappedModal\n {...modal}\n top={alerts.length === 0 && i === open.length - 1}\n key={modal.id}\n />\n ))}\n {minimized.length > 0 && (\n <DockedModals>\n {minimized.map(modal => (\n <WrappedModal {...modal} top={false} key={modal.id} />\n ))}\n </DockedModals>\n )}\n {alerts.map((modal, i) => (\n <WrappedModal {...modal} top={i === open.length - 1} key={modal.id} />\n ))}\n </>\n );\n};\n\nconst ModalManager: FunctionComponent<ModalManagerProps> = ({ children }) => {\n const [modals, dispatch] = useReducer(reducer, []);\n const { disableScroll, enableScroll } = useScrollToggle();\n\n const providerValue = useMemo(\n () => ({\n create: <P extends object>(\n Component: ComponentType<P>,\n props?: P,\n options?: ModalOptions\n ) => {\n const id = options?.id || createUID();\n const initiatorRef = document.activeElement ? new WeakRef(document.activeElement) : null;\n\n const methods: ModalMethods<P> = {\n dismiss: () => {\n dispatch({ action: 'dismiss', modal: { id } });\n options?.onDismiss?.(id);\n const initiator = initiatorRef?.deref();\n if (\n initiator?.isConnected &&\n (initiator instanceof HTMLElement || initiator instanceof SVGElement)\n ) {\n initiator.focus();\n }\n },\n update: updateProps => {\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'update',\n modal: { id, props: updateProps }\n });\n },\n minimize: () => {\n dispatch({ action: 'minimize', modal: { id } });\n options?.onMinimize?.(id);\n },\n maximize: () => {\n dispatch({ action: 'maximize', modal: { id } });\n options?.onMaximize?.(id);\n },\n dock: () => {\n dispatch({ action: 'dock', modal: { id } });\n options?.onDock?.(id);\n },\n activate: () => {\n dispatch({ action: 'activate', modal: { id } });\n options?.onActivate?.(id);\n },\n unmount: () => {\n dispatch({ action: 'unmount', modal: { id } });\n }\n };\n\n let defaultState: ModalState;\n if (options?.defaultMinimized) {\n defaultState = 'minimized';\n } else if (options?.dockable) {\n defaultState = 'docked';\n } else {\n defaultState = 'open';\n }\n\n (dispatch as Dispatch<ModalReducerPayload<P>>)({\n action: 'create',\n modal: {\n id,\n methods,\n Component,\n props,\n state: defaultState,\n options: {\n alert: false,\n minimizable: false,\n maximizable: false,\n dockable: false,\n defaultMinimized: false,\n unmountWhenMinimized: true,\n ...options,\n dismissible: !!(options?.alert ? false : options?.dismissible ?? true)\n }\n }\n });\n\n return methods;\n },\n ModalContext,\n initialized: true\n }),\n []\n );\n\n useEffect(() => {\n if (modals.some(modal => modal.state === 'open' && !modal.options.dockable)) {\n disableScroll();\n } else {\n enableScroll();\n }\n }, [modals]);\n\n const { portalTarget } = useConfiguration();\n\n const context = windowIsAvailable\n ? window.cosmos.modalManagerContext ?? ModalManagerContext\n : ModalManagerContext;\n const priorCtx = useContext(context);\n\n // Don't create additional Modal portals.\n if (priorCtx.initialized) return <context.Provider value={priorCtx}>{children}</context.Provider>;\n\n return (\n <context.Provider value={providerValue}>\n {children}\n {modals.length > 0 &&\n portalTarget &&\n createPortal(<RenderModals modals={modals} />, portalTarget)}\n </context.Provider>\n );\n};\n\nexport default ModalManager;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalFormProgress.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/HorizontalFormProgress.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAsC,MAAM,OAAO,CAAC;AAM9E,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAO3C,OAAO,KAAK,kBAAkB,MAAM,uBAAuB,CAAC;AAE5D,UAAU,iBAAiB;IACzB,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACnC,aAAa,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;CACpD;AAED,eAAO,MAAM,kBAAkB,iKAgB7B,CAAC;AAIH,QAAA,MAAM,sBAAsB,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"HorizontalFormProgress.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/HorizontalFormProgress.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAsC,MAAM,OAAO,CAAC;AAM9E,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAO3C,OAAO,KAAK,kBAAkB,MAAM,uBAAuB,CAAC;AAE5D,UAAU,iBAAiB;IACzB,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAC;IACnC,aAAa,EAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC;CACpD;AAED,eAAO,MAAM,kBAAkB,iKAgB7B,CAAC;AAIH,QAAA,MAAM,sBAAsB,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CAqG/E,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
|
|
@@ -44,6 +44,10 @@ const HorizontalFormProgress = ({ steps, currentStepId, ...restProps }) => {
|
|
|
44
44
|
tryCatch(() => stripUnit(remToPx(theme.base.spacing)), () => 8)
|
|
45
45
|
]
|
|
46
46
|
}
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
name: 'placeAndContain',
|
|
50
|
+
enabled: false
|
|
47
51
|
}
|
|
48
52
|
], children: _jsx(Text, { variant: 'h4', children: curStep.name }) }), _jsx(Flex, { container: { justify: 'between', alignItems: 'center' }, item: { grow: 1 }, children: steps.map((step, index) => {
|
|
49
53
|
return (_jsx(StepMarker, { ref: (el) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HorizontalFormProgress.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/HorizontalFormProgress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { remToPx, stripUnit } from 'polished';\nimport { FunctionComponent, CSSProperties, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useElement, useTheme } from '../../hooks';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport { tryCatch } from '../../utils';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport { CurrentStepPopover, StepMarker, StyledBar, StyledFill } from './FormProgress.styles';\nimport type MultiStepFormProps from './MultiStepForm.types';\n\ninterface FormProgressProps {\n steps: MultiStepFormProps['steps'];\n currentStepId: MultiStepFormProps['currentStepId'];\n}\n\nexport const StyledFormProgress = styled(Flex)(({ theme }) => {\n const {\n base: { spacing, 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n text: {\n h4: { 'font-size': h4fontSize }\n }\n }\n } = theme;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: relative;\n margin-block-start: calc(-1.5 * ${spacing});\n padding-block-start: calc(${spacing} + ${fontSizes[h4fontSize as FontSize]} * 1.35);\n `;\n});\n\nStyledFormProgress.defaultProps = defaultThemeProp;\n\nconst HorizontalFormProgress: FunctionComponent<FormProgressProps & ForwardProps> = ({\n steps,\n currentStepId,\n ...restProps\n}) => {\n const curIdx = steps.findIndex(step => step.id === currentStepId);\n const curStep = steps[curIdx];\n const fillScale = curIdx / (steps.length - 1);\n\n const [currentStepEl, setCurrentStepEl] = useElement();\n const [stepEls, setStepEls] = useState<Record<string, HTMLElement>>({});\n const theme = useTheme();\n\n let popoverPlacement: 'top' | 'top-start' | 'top-end' = 'top';\n if (curIdx === 0) popoverPlacement = 'top-start';\n else if (curIdx === steps.length - 1) popoverPlacement = 'top-end';\n\n useEffect(() => {\n setCurrentStepEl(stepEls[curStep.id]);\n }, [Object.keys(stepEls), curStep]);\n\n return (\n <StyledFormProgress\n {...restProps}\n container={{ alignItems: 'center' }}\n role='progressbar'\n aria-valuenow={curIdx}\n aria-valuemin={0}\n aria-valuetext={curStep.name}\n aria-valuemax={steps.length}\n >\n <CurrentStepPopover\n show\n target={currentStepEl}\n placement={popoverPlacement}\n strategy='absolute'\n hideOnTargetHidden\n modifiers={[\n {\n name: 'offset',\n options: {\n offset: [\n 0,\n tryCatch(\n () => stripUnit(remToPx(theme.base.spacing)),\n () => 8\n )\n ]\n }\n }\n ]}\n >\n <Text variant='h4'>{curStep.name}</Text>\n </CurrentStepPopover>\n <Flex container={{ justify: 'between', alignItems: 'center' }} item={{ grow: 1 }}>\n {steps.map((step, index) => {\n return (\n <StepMarker\n key={step.id}\n ref={(el: HTMLElement | null) => {\n setStepEls(curr => {\n const newEls = { ...curr };\n if (!el && newEls[step.id]) {\n delete newEls[step.id];\n return newEls;\n }\n if (el) return { ...newEls, [step.id]: el };\n return newEls;\n });\n }}\n aria-label={step.name}\n aria-describedby={step.id}\n current={index === curIdx}\n depth={step.depth}\n prior={index < curIdx}\n onClick={step.onMarkerClick}\n >\n {index !== curIdx && (\n <Tooltip\n target={stepEls[step.id]}\n showDelay='none'\n hideDelay='short'\n portal={false}\n >\n {step.name}\n </Tooltip>\n )}\n </StepMarker>\n );\n })}\n </Flex>\n\n <StyledBar>\n <StyledFill style={{ '--fillScale': fillScale } as CSSProperties} />\n </StyledBar>\n </StyledFormProgress>\n );\n};\n\nexport default HorizontalFormProgress;\n"]}
|
|
1
|
+
{"version":3,"file":"HorizontalFormProgress.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/HorizontalFormProgress.tsx"],"names":[],"mappings":"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","sourcesContent":["import { remToPx, stripUnit } from 'polished';\nimport { FunctionComponent, CSSProperties, useEffect, useState } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useElement, useTheme } from '../../hooks';\nimport { calculateFontSize, FontSize } from '../../styles';\nimport { defaultThemeProp } from '../../theme';\nimport { ForwardProps } from '../../types';\nimport { tryCatch } from '../../utils';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport Tooltip from '../Tooltip';\n\nimport { CurrentStepPopover, StepMarker, StyledBar, StyledFill } from './FormProgress.styles';\nimport type MultiStepFormProps from './MultiStepForm.types';\n\ninterface FormProgressProps {\n steps: MultiStepFormProps['steps'];\n currentStepId: MultiStepFormProps['currentStepId'];\n}\n\nexport const StyledFormProgress = styled(Flex)(({ theme }) => {\n const {\n base: { spacing, 'font-size': fontSize, 'font-scale': fontScale },\n components: {\n text: {\n h4: { 'font-size': h4fontSize }\n }\n }\n } = theme;\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n position: relative;\n margin-block-start: calc(-1.5 * ${spacing});\n padding-block-start: calc(${spacing} + ${fontSizes[h4fontSize as FontSize]} * 1.35);\n `;\n});\n\nStyledFormProgress.defaultProps = defaultThemeProp;\n\nconst HorizontalFormProgress: FunctionComponent<FormProgressProps & ForwardProps> = ({\n steps,\n currentStepId,\n ...restProps\n}) => {\n const curIdx = steps.findIndex(step => step.id === currentStepId);\n const curStep = steps[curIdx];\n const fillScale = curIdx / (steps.length - 1);\n\n const [currentStepEl, setCurrentStepEl] = useElement();\n const [stepEls, setStepEls] = useState<Record<string, HTMLElement>>({});\n const theme = useTheme();\n\n let popoverPlacement: 'top' | 'top-start' | 'top-end' = 'top';\n if (curIdx === 0) popoverPlacement = 'top-start';\n else if (curIdx === steps.length - 1) popoverPlacement = 'top-end';\n\n useEffect(() => {\n setCurrentStepEl(stepEls[curStep.id]);\n }, [Object.keys(stepEls), curStep]);\n\n return (\n <StyledFormProgress\n {...restProps}\n container={{ alignItems: 'center' }}\n role='progressbar'\n aria-valuenow={curIdx}\n aria-valuemin={0}\n aria-valuetext={curStep.name}\n aria-valuemax={steps.length}\n >\n <CurrentStepPopover\n show\n target={currentStepEl}\n placement={popoverPlacement}\n strategy='absolute'\n hideOnTargetHidden\n modifiers={[\n {\n name: 'offset',\n options: {\n offset: [\n 0,\n tryCatch(\n () => stripUnit(remToPx(theme.base.spacing)),\n () => 8\n )\n ]\n }\n },\n {\n name: 'placeAndContain',\n enabled: false\n }\n ]}\n >\n <Text variant='h4'>{curStep.name}</Text>\n </CurrentStepPopover>\n <Flex container={{ justify: 'between', alignItems: 'center' }} item={{ grow: 1 }}>\n {steps.map((step, index) => {\n return (\n <StepMarker\n key={step.id}\n ref={(el: HTMLElement | null) => {\n setStepEls(curr => {\n const newEls = { ...curr };\n if (!el && newEls[step.id]) {\n delete newEls[step.id];\n return newEls;\n }\n if (el) return { ...newEls, [step.id]: el };\n return newEls;\n });\n }}\n aria-label={step.name}\n aria-describedby={step.id}\n current={index === curIdx}\n depth={step.depth}\n prior={index < curIdx}\n onClick={step.onMarkerClick}\n >\n {index !== curIdx && (\n <Tooltip\n target={stepEls[step.id]}\n showDelay='none'\n hideDelay='short'\n portal={false}\n >\n {step.name}\n </Tooltip>\n )}\n </StepMarker>\n );\n })}\n </Flex>\n\n <StyledBar>\n <StyledFill style={{ '--fillScale': fillScale } as CSSProperties} />\n </StyledBar>\n </StyledFormProgress>\n );\n};\n\nexport default HorizontalFormProgress;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAsC,MAAM,OAAO,CAAC;AAI1F,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAU3C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAIvD,eAAO,MAAM,UAAU,0GAWrB,CAAC;AAEH,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAE9C,eAAO,MAAM,yBAAyB,iKAqBpC,CAAC;AAIH,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"MultiStepForm.d.ts","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAsC,MAAM,OAAO,CAAC;AAI1F,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAU3C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;AAIvD,eAAO,MAAM,UAAU,0GAWrB,CAAC;AAEH,eAAO,MAAM,iBAAiB,yGAAe,CAAC;AAE9C,eAAO,MAAM,yBAAyB,iKAqBpC,CAAC;AAIH,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,GAAG,YAAY,CA4H9E,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -82,7 +82,7 @@ export const MultiStepForm = forwardRef(({ currentStepId, steps, heading, stepIn
|
|
|
82
82
|
areaDef += ' "actions"';
|
|
83
83
|
}
|
|
84
84
|
return (_jsxs(Grid, { ref: ref, as: StyledForm, ...restProps, container: {
|
|
85
|
-
cols: stepIndicator === 'vertical' ? `
|
|
85
|
+
cols: stepIndicator === 'vertical' ? `2fr minmax(${contentWidth.xs}, 1fr)` : 'minmax(0, 1fr)',
|
|
86
86
|
areas: areaDef,
|
|
87
87
|
gap: 3
|
|
88
88
|
}, "aria-labelledby": heading ? headingId : undefined, "aria-describedby": currentStep.description ? descriptionId : undefined, children: [(heading || steps.length > 1) && (_jsxs(_Fragment, { children: [heading && (_jsx(Grid, { item: { area: 'heading' }, children: _jsx(Text, { id: headingId, variant: 'h3', children: heading }) })), steps.length > 1 && (_jsxs(_Fragment, { children: [stepIndicator === 'horizontal' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: HorizontalFormProgress, steps: steps, currentStepId: currentStepId })), stepIndicator === 'vertical' && (_jsx(Grid, { item: { area: 'stepIndicator' }, as: VerticalFormProgress, steps: steps, currentStepId: currentStepId })), _jsx(VisuallyHiddenText, { "aria-live": 'polite', children: previousId !== undefined && previousId !== currentStepId
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useUID, useI18n, usePrevious, useBreakpoint, useTheme } from '../../hooks';\nimport { ForwardProps } from '../../types';\nimport { getFocusables } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid from '../Grid';\nimport { defaultThemeProp } from '../../theme';\n\nimport MultiStepFormProps from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n return css`\n height: 100%;\n width: 100%;\n flex-grow: 1;\n overflow-y: auto;\n padding: ${spacing};\n `;\n});\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { urgent }\n }\n } = theme;\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${infoFontSize};\n font-style: italic;\n\n &::before {\n display: 'inline';\n content: '\\\\00a0*';\n vertical-align: top;\n color: ${urgent};\n }\n `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nexport const MultiStepForm: FunctionComponent<MultiStepFormProps & ForwardProps> = forwardRef(\n (\n {\n currentStepId,\n steps,\n heading,\n stepIndicator: stepIndicatorProp = steps.length < 2 ? 'none' : 'horizontal',\n ...restProps\n }: PropsWithoutRef<MultiStepFormProps>,\n ref: MultiStepFormProps['ref']\n ) => {\n const multiStepContentRef = useRef(null);\n const previousId = usePrevious(currentStepId);\n const currentStep = steps.find(step => step.id === currentStepId)!;\n const headingId = useUID();\n const descriptionId = useUID();\n const t = useI18n();\n const {\n base: { 'content-width': contentWidth }\n } = useTheme();\n\n useEffect(() => {\n if (previousId === undefined) return;\n\n if (previousId !== currentStepId) {\n const focusableElements = getFocusables(multiStepContentRef);\n\n if (focusableElements.length) focusableElements[0].focus();\n }\n }, [currentStepId, previousId]);\n\n const isSmallOrAbove = useBreakpoint('sm');\n\n const stepIndicator =\n stepIndicatorProp === 'vertical' && !isSmallOrAbove ? 'horizontal' : stepIndicatorProp;\n\n let areaDef = '';\n switch (stepIndicator) {\n case 'horizontal':\n if (heading) areaDef += '\"heading\" ';\n areaDef += '\"stepIndicator\" \"content\"';\n if (currentStep.actions) areaDef += ' \"actions\"';\n break;\n case 'vertical':\n if (heading) areaDef += '\"heading stepIndicator\" ';\n areaDef += '\"content stepIndicator\"';\n if (currentStep.actions) areaDef += ' \"actions actions\"';\n break;\n default:\n if (heading) areaDef += '\"heading\" ';\n areaDef += '\"content\"';\n if (currentStep.actions) areaDef += ' \"actions\"';\n }\n\n return (\n <Grid\n ref={ref}\n as={StyledForm}\n {...restProps}\n container={{\n cols: stepIndicator === 'vertical' ? `1fr ${contentWidth.sm}` : '1fr',\n areas: areaDef,\n gap: 3\n }}\n aria-labelledby={heading ? headingId : undefined}\n aria-describedby={currentStep.description ? descriptionId : undefined}\n >\n {(heading || steps.length > 1) && (\n <>\n {heading && (\n <Grid item={{ area: 'heading' }}>\n <Text id={headingId} variant='h3'>\n {heading}\n </Text>\n </Grid>\n )}\n {steps.length > 1 && (\n <>\n {stepIndicator === 'horizontal' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={HorizontalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n {stepIndicator === 'vertical' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={VerticalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n <VisuallyHiddenText aria-live='polite'>\n {previousId !== undefined && previousId !== currentStepId\n ? t('step_changed_to_name', [currentStep.name])\n : ''}\n </VisuallyHiddenText>\n </>\n )}\n </>\n )}\n\n <Grid item={{ area: 'content' }} container={{ gap: 3 }}>\n {currentStep.banners}\n\n {currentStep.description && (\n <HTML id={descriptionId} as='p' content={currentStep.description} />\n )}\n\n <StyledFormContent ref={multiStepContentRef}>{currentStep.content}</StyledFormContent>\n </Grid>\n {currentStep.actions && (\n <Grid item={{ area: 'actions' }}>\n <Flex container={{ justify: 'between', alignItems: 'center' }}>\n {currentStep.actions}\n </Flex>\n </Grid>\n )}\n </Grid>\n );\n }\n);\n\nexport default MultiStepForm;\n"]}
|
|
1
|
+
{"version":3,"file":"MultiStepForm.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, useRef, useEffect } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useUID, useI18n, usePrevious, useBreakpoint, useTheme } from '../../hooks';\nimport { ForwardProps } from '../../types';\nimport { getFocusables } from '../../utils';\nimport { calculateFontSize } from '../../styles';\nimport Flex from '../Flex';\nimport Text from '../Text';\nimport HTML from '../HTML';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Grid from '../Grid';\nimport { defaultThemeProp } from '../../theme';\n\nimport MultiStepFormProps from './MultiStepForm.types';\nimport VerticalFormProgress from './VerticalFormProgress';\nimport HorizontalFormProgress from './HorizontalFormProgress';\n\nexport const StyledForm = styled.form(({ theme }) => {\n const {\n base: { spacing }\n } = theme;\n return css`\n height: 100%;\n width: 100%;\n flex-grow: 1;\n overflow-y: auto;\n padding: ${spacing};\n `;\n});\n\nexport const StyledFormContent = styled.div``;\n\nexport const StyledRequiredFieldLegend = styled(Text)(({ theme }) => {\n const {\n base: {\n 'font-size': fontSize,\n 'font-scale': fontScale,\n palette: { urgent }\n }\n } = theme;\n const { xxs: infoFontSize } = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${infoFontSize};\n font-style: italic;\n\n &::before {\n display: 'inline';\n content: '\\\\00a0*';\n vertical-align: top;\n color: ${urgent};\n }\n `;\n});\n\nStyledRequiredFieldLegend.defaultProps = defaultThemeProp;\n\nexport const MultiStepForm: FunctionComponent<MultiStepFormProps & ForwardProps> = forwardRef(\n (\n {\n currentStepId,\n steps,\n heading,\n stepIndicator: stepIndicatorProp = steps.length < 2 ? 'none' : 'horizontal',\n ...restProps\n }: PropsWithoutRef<MultiStepFormProps>,\n ref: MultiStepFormProps['ref']\n ) => {\n const multiStepContentRef = useRef(null);\n const previousId = usePrevious(currentStepId);\n const currentStep = steps.find(step => step.id === currentStepId)!;\n const headingId = useUID();\n const descriptionId = useUID();\n const t = useI18n();\n const {\n base: { 'content-width': contentWidth }\n } = useTheme();\n\n useEffect(() => {\n if (previousId === undefined) return;\n\n if (previousId !== currentStepId) {\n const focusableElements = getFocusables(multiStepContentRef);\n\n if (focusableElements.length) focusableElements[0].focus();\n }\n }, [currentStepId, previousId]);\n\n const isSmallOrAbove = useBreakpoint('sm');\n\n const stepIndicator =\n stepIndicatorProp === 'vertical' && !isSmallOrAbove ? 'horizontal' : stepIndicatorProp;\n\n let areaDef = '';\n switch (stepIndicator) {\n case 'horizontal':\n if (heading) areaDef += '\"heading\" ';\n areaDef += '\"stepIndicator\" \"content\"';\n if (currentStep.actions) areaDef += ' \"actions\"';\n break;\n case 'vertical':\n if (heading) areaDef += '\"heading stepIndicator\" ';\n areaDef += '\"content stepIndicator\"';\n if (currentStep.actions) areaDef += ' \"actions actions\"';\n break;\n default:\n if (heading) areaDef += '\"heading\" ';\n areaDef += '\"content\"';\n if (currentStep.actions) areaDef += ' \"actions\"';\n }\n\n return (\n <Grid\n ref={ref}\n as={StyledForm}\n {...restProps}\n container={{\n cols:\n stepIndicator === 'vertical' ? `2fr minmax(${contentWidth.xs}, 1fr)` : 'minmax(0, 1fr)',\n areas: areaDef,\n gap: 3\n }}\n aria-labelledby={heading ? headingId : undefined}\n aria-describedby={currentStep.description ? descriptionId : undefined}\n >\n {(heading || steps.length > 1) && (\n <>\n {heading && (\n <Grid item={{ area: 'heading' }}>\n <Text id={headingId} variant='h3'>\n {heading}\n </Text>\n </Grid>\n )}\n {steps.length > 1 && (\n <>\n {stepIndicator === 'horizontal' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={HorizontalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n {stepIndicator === 'vertical' && (\n <Grid\n item={{ area: 'stepIndicator' }}\n as={VerticalFormProgress}\n steps={steps}\n currentStepId={currentStepId}\n />\n )}\n <VisuallyHiddenText aria-live='polite'>\n {previousId !== undefined && previousId !== currentStepId\n ? t('step_changed_to_name', [currentStep.name])\n : ''}\n </VisuallyHiddenText>\n </>\n )}\n </>\n )}\n\n <Grid item={{ area: 'content' }} container={{ gap: 3 }}>\n {currentStep.banners}\n\n {currentStep.description && (\n <HTML id={descriptionId} as='p' content={currentStep.description} />\n )}\n\n <StyledFormContent ref={multiStepContentRef}>{currentStep.content}</StyledFormContent>\n </Grid>\n {currentStep.actions && (\n <Grid item={{ area: 'actions' }}>\n <Flex container={{ justify: 'between', alignItems: 'center' }}>\n {currentStep.actions}\n </Flex>\n </Grid>\n )}\n </Grid>\n );\n }\n);\n\nexport default MultiStepForm;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStepForm.types.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode, Ref, MouseEventHandler } from 'react';\n\nimport { BaseProps } from '../../types';\n\nexport interface BaseFormProps extends BaseProps {\n /** Primary content area. */\n content: ReactNode;\n /** Region for Form Actions. */\n actions?: ReactNode;\n /** Region for Banners above the Form. */\n banners?: ReactNode;\n /** A description of the form to be displayed above the controls. */\n description?: string;\n /** The heading of the form. */\n heading?: string;\n /** Ref forwarded to the form element. */\n ref?: Ref<HTMLFormElement>;\n}\n\nexport interface Step {\n /** The id that is referenced by the Multi Step currentStepId prop. */\n id: string;\n /** The displayed name of the step. */\n name: string;\n /** A set of Action Buttons to render for the step. */\n actions?: BaseFormProps['actions'];\n /** Banners to render for the step */\n banners?: BaseFormProps['banners'];\n /** Content to render for the step. */\n content?: BaseFormProps['content'];\n /**\n * Determines the size of the step indicator. Depth 0 is larger than depth 1.\n * @default 0\n */\n depth?: 0 | 1;\n /** A description of the form to be displayed above the controls. */\n description?: BaseFormProps['description'];\n /** Callback function that is called when a step marker is clicked. */\n onMarkerClick?: MouseEventHandler;\n}\n\nexport default interface MultiStepFormProps {\n /** Sets the current step. */\n currentStepId: string;\n /** Flat array of objects describing each step. */\n steps: Step[];\n /**\n * MultiStepForm step indicator.\n * @default
|
|
1
|
+
{"version":3,"file":"MultiStepForm.types.js","sourceRoot":"","sources":["../../../src/components/MultiStepForm/MultiStepForm.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode, Ref, MouseEventHandler } from 'react';\n\nimport { BaseProps } from '../../types';\n\nexport interface BaseFormProps extends BaseProps {\n /** Primary content area. */\n content: ReactNode;\n /** Region for Form Actions. */\n actions?: ReactNode;\n /** Region for Banners above the Form. */\n banners?: ReactNode;\n /** A description of the form to be displayed above the controls. */\n description?: string;\n /** The heading of the form. */\n heading?: string;\n /** Ref forwarded to the form element. */\n ref?: Ref<HTMLFormElement>;\n}\n\nexport interface Step {\n /** The id that is referenced by the Multi Step currentStepId prop. */\n id: string;\n /** The displayed name of the step. */\n name: string;\n /** A set of Action Buttons to render for the step. */\n actions?: BaseFormProps['actions'];\n /** Banners to render for the step */\n banners?: BaseFormProps['banners'];\n /** Content to render for the step. */\n content?: BaseFormProps['content'];\n /**\n * Determines the size of the step indicator. Depth 0 is larger than depth 1.\n * @default 0\n */\n depth?: 0 | 1;\n /** A description of the form to be displayed above the controls. */\n description?: BaseFormProps['description'];\n /** Callback function that is called when a step marker is clicked. */\n onMarkerClick?: MouseEventHandler;\n}\n\nexport default interface MultiStepFormProps {\n /** Sets the current step. */\n currentStepId: string;\n /** Flat array of objects describing each step. */\n steps: Step[];\n /**\n * MultiStepForm step indicator.\n * @default 'horizontal'\n */\n stepIndicator?: 'horizontal' | 'vertical' | 'none';\n /** The heading of the form. */\n heading?: BaseFormProps['heading'];\n /** Ref forwarded to the form element. */\n ref?: BaseFormProps['ref'];\n}\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export declare const getNumberInputTestIds: (testIdProp?: string | undefined) => import("
|
|
2
|
-
export declare const getNumberRangeTestIds: (testIdProp?: string | undefined) => import("
|
|
1
|
+
export declare const getNumberInputTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["control", "plus", "minus", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
2
|
+
export declare const getNumberRangeTestIds: (testIdProp?: string | undefined) => import("../..").TestIdsRecord<readonly ["min", "max", "label", "info", "additional-info", "suggestion-accept", "suggestion-reject"]>;
|
|
3
3
|
//# sourceMappingURL=Number.test-ids.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Number.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Number/Number.test-ids.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Number.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/Number/Number.test-ids.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,qBAAqB,yLAKvB,CAAC;AAEZ,eAAO,MAAM,qBAAqB,2KAIvB,CAAC"}
|
|
@@ -1,8 +1,14 @@
|
|
|
1
1
|
import { createTestIds } from '../../utils';
|
|
2
|
+
import { elements } from '../FormField/FormField.test-ids';
|
|
2
3
|
export const getNumberInputTestIds = createTestIds('number-input', [
|
|
3
4
|
'control',
|
|
4
5
|
'plus',
|
|
5
|
-
'minus'
|
|
6
|
+
'minus',
|
|
7
|
+
...elements
|
|
8
|
+
]);
|
|
9
|
+
export const getNumberRangeTestIds = createTestIds('number-range', [
|
|
10
|
+
'min',
|
|
11
|
+
'max',
|
|
12
|
+
...elements
|
|
6
13
|
]);
|
|
7
|
-
export const getNumberRangeTestIds = createTestIds('number-range', ['min', 'max']);
|
|
8
14
|
//# sourceMappingURL=Number.test-ids.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Number.test-ids.js","sourceRoot":"","sources":["../../../src/components/Number/Number.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"Number.test-ids.js","sourceRoot":"","sources":["../../../src/components/Number/Number.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,iCAAiC,CAAC;AAE3D,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAAC,cAAc,EAAE;IACjE,SAAS;IACT,MAAM;IACN,OAAO;IACP,GAAG,QAAQ;CACH,CAAC,CAAC;AAEZ,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAAC,cAAc,EAAE;IACjE,KAAK;IACL,KAAK;IACL,GAAG,QAAQ;CACH,CAAC,CAAC","sourcesContent":["import { createTestIds } from '../../utils';\nimport { elements } from '../FormField/FormField.test-ids';\n\nexport const getNumberInputTestIds = createTestIds('number-input', [\n 'control',\n 'plus',\n 'minus',\n ...elements\n] as const);\n\nexport const getNumberRangeTestIds = createTestIds('number-range', [\n 'min',\n 'max',\n ...elements\n] as const);\n"]}
|
|
@@ -100,6 +100,7 @@ const NumberInput = forwardRef((props, ref) => {
|
|
|
100
100
|
}, children: _jsx(StyledInput, { "data-testid": testIds.control, ...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps }, inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onFocus: onInputFocusEvent, onBlur: onInputFocusEvent, "aria-label": `${ariaLabel || label}. ${unit ? t('measured_in', [unit]) : ''}`, maxLength: 16, autoFocus: autoFocus, "aria-describedby": `${id}-info` }) }), _jsx(Button, { "data-testid": testIds.plus, variant: 'simple', icon: true, onClick: onPlusClick, readOnly: readOnly, disabled: disabled, tabIndex: -1, "aria-hidden": 'true', children: _jsx(Icon, { name: 'plus' }) })] }));
|
|
101
101
|
const Comp = variant === 'stepper' && !readOnly ? stepper : numberInput;
|
|
102
102
|
return label ? (_jsx(FormField, { ...{
|
|
103
|
+
testId: testIds,
|
|
103
104
|
label,
|
|
104
105
|
labelHidden,
|
|
105
106
|
id,
|
|
@@ -109,7 +110,6 @@ const NumberInput = forwardRef((props, ref) => {
|
|
|
109
110
|
readOnly,
|
|
110
111
|
disabled,
|
|
111
112
|
additionalInfo,
|
|
112
|
-
testId,
|
|
113
113
|
onResolveSuggestion
|
|
114
114
|
}, children: Comp })) : (Comp);
|
|
115
115
|
});
|