@openedx/paragon 21.12.1 → 21.12.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ActionRow/index.js +7 -8
- package/dist/ActionRow/index.js.map +1 -1
- package/dist/Alert/index.js +33 -25
- package/dist/Alert/index.js.map +1 -1
- package/dist/Annotation/index.js +7 -9
- package/dist/Annotation/index.js.map +1 -1
- package/dist/Avatar/index.js +5 -7
- package/dist/Avatar/index.js.map +1 -1
- package/dist/AvatarButton/index.js +10 -12
- package/dist/AvatarButton/index.js.map +1 -1
- package/dist/Badge/index.js +6 -4
- package/dist/Badge/index.js.map +1 -1
- package/dist/Breadcrumb/BreadcrumbLink.js +11 -14
- package/dist/Breadcrumb/BreadcrumbLink.js.map +1 -1
- package/dist/Breadcrumb/index.js +29 -29
- package/dist/Breadcrumb/index.js.map +1 -1
- package/dist/Bubble/index.js +11 -13
- package/dist/Bubble/index.js.map +1 -1
- package/dist/Button/deprecated/index.js +87 -66
- package/dist/Button/deprecated/index.js.map +1 -1
- package/dist/Button/index.js +10 -11
- package/dist/Button/index.js.map +1 -1
- package/dist/Card/CardBody.js +4 -6
- package/dist/Card/CardBody.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarousel.js +11 -13
- package/dist/Card/CardCarousel/CardCarousel.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselControls.js +6 -7
- package/dist/Card/CardCarousel/CardCarouselControls.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselHeader.js +9 -12
- package/dist/Card/CardCarousel/CardCarouselHeader.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselItems.js +6 -9
- package/dist/Card/CardCarousel/CardCarouselItems.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselProvider.js +27 -28
- package/dist/Card/CardCarousel/CardCarouselProvider.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselSubtitle.js +4 -6
- package/dist/Card/CardCarousel/CardCarouselSubtitle.js.map +1 -1
- package/dist/Card/CardCarousel/CardCarouselTitle.js +4 -6
- package/dist/Card/CardCarousel/CardCarouselTitle.js.map +1 -1
- package/dist/Card/CardContext.js +8 -10
- package/dist/Card/CardContext.js.map +1 -1
- package/dist/Card/CardDeck.js +19 -17
- package/dist/Card/CardDeck.js.map +1 -1
- package/dist/Card/CardDivider.js +3 -5
- package/dist/Card/CardDivider.js.map +1 -1
- package/dist/Card/CardFooter.js +15 -18
- package/dist/Card/CardFooter.js.map +1 -1
- package/dist/Card/CardGrid.js +13 -11
- package/dist/Card/CardGrid.js.map +1 -1
- package/dist/Card/CardHeader.js +17 -22
- package/dist/Card/CardHeader.js.map +1 -1
- package/dist/Card/CardImageCap.js +48 -33
- package/dist/Card/CardImageCap.js.map +1 -1
- package/dist/Card/CardSection.js +11 -14
- package/dist/Card/CardSection.js.map +1 -1
- package/dist/Card/CardStatus.js +11 -14
- package/dist/Card/CardStatus.js.map +1 -1
- package/dist/Card/index.js +18 -20
- package/dist/Card/index.js.map +1 -1
- package/dist/Carousel/index.js +17 -11
- package/dist/Carousel/index.js.map +1 -1
- package/dist/CheckBox/index.js +66 -36
- package/dist/CheckBox/index.js.map +1 -1
- package/dist/Chip/index.js +14 -16
- package/dist/Chip/index.js.map +1 -1
- package/dist/ChipCarousel/index.js +29 -30
- package/dist/ChipCarousel/index.js.map +1 -1
- package/dist/Collapsible/CollapsibleAdvanced.js +82 -62
- package/dist/Collapsible/CollapsibleAdvanced.js.map +1 -1
- package/dist/Collapsible/CollapsibleBody.js +13 -15
- package/dist/Collapsible/CollapsibleBody.js.map +1 -1
- package/dist/Collapsible/CollapsibleTrigger.js +18 -20
- package/dist/Collapsible/CollapsibleTrigger.js.map +1 -1
- package/dist/Collapsible/CollapsibleVisible.js +6 -9
- package/dist/Collapsible/CollapsibleVisible.js.map +1 -1
- package/dist/Collapsible/index.js +17 -18
- package/dist/Collapsible/index.js.map +1 -1
- package/dist/ColorPicker/index.js +58 -33
- package/dist/ColorPicker/index.js.map +1 -1
- package/dist/Container/index.js +8 -9
- package/dist/Container/index.js.map +1 -1
- package/dist/DataTable/ActionDisplay.js +8 -9
- package/dist/DataTable/ActionDisplay.js.map +1 -1
- package/dist/DataTable/BulkActions.js +23 -20
- package/dist/DataTable/BulkActions.js.map +1 -1
- package/dist/DataTable/CardView.js +46 -43
- package/dist/DataTable/CardView.js.map +1 -1
- package/dist/DataTable/CollapsibleButtonGroup.js +57 -39
- package/dist/DataTable/CollapsibleButtonGroup.js.map +1 -1
- package/dist/DataTable/DataTableContext.js +1 -1
- package/dist/DataTable/DataTableContext.js.map +1 -1
- package/dist/DataTable/DataTableLayout.js +6 -9
- package/dist/DataTable/DataTableLayout.js.map +1 -1
- package/dist/DataTable/DataViewToggle.js +25 -20
- package/dist/DataTable/DataViewToggle.js.map +1 -1
- package/dist/DataTable/DropdownFilters.js +41 -28
- package/dist/DataTable/DropdownFilters.js.map +1 -1
- package/dist/DataTable/EmptyTable.js +6 -9
- package/dist/DataTable/EmptyTable.js.map +1 -1
- package/dist/DataTable/ExpandAll.js +2 -4
- package/dist/DataTable/ExpandAll.js.map +1 -1
- package/dist/DataTable/ExpandRow.js +2 -4
- package/dist/DataTable/ExpandRow.js.map +1 -1
- package/dist/DataTable/FilterStatus.js +18 -17
- package/dist/DataTable/FilterStatus.js.map +1 -1
- package/dist/DataTable/RowStatus.js +15 -18
- package/dist/DataTable/RowStatus.js.map +1 -1
- package/dist/DataTable/SidebarFilters.js +16 -13
- package/dist/DataTable/SidebarFilters.js.map +1 -1
- package/dist/DataTable/SmartStatus.js +14 -16
- package/dist/DataTable/SmartStatus.js.map +1 -1
- package/dist/DataTable/Table.js +17 -19
- package/dist/DataTable/Table.js.map +1 -1
- package/dist/DataTable/TableActions.js +11 -13
- package/dist/DataTable/TableActions.js.map +1 -1
- package/dist/DataTable/TableCell.js +6 -10
- package/dist/DataTable/TableCell.js.map +1 -1
- package/dist/DataTable/TableControlBar.js +7 -12
- package/dist/DataTable/TableControlBar.js.map +1 -1
- package/dist/DataTable/TableFilters.js +14 -12
- package/dist/DataTable/TableFilters.js.map +1 -1
- package/dist/DataTable/TableFooter.js +5 -8
- package/dist/DataTable/TableFooter.js.map +1 -1
- package/dist/DataTable/TableHeaderCell.js +11 -15
- package/dist/DataTable/TableHeaderCell.js.map +1 -1
- package/dist/DataTable/TableHeaderRow.js +6 -4
- package/dist/DataTable/TableHeaderRow.js.map +1 -1
- package/dist/DataTable/TablePagination.js +8 -7
- package/dist/DataTable/TablePagination.js.map +1 -1
- package/dist/DataTable/TablePaginationMinimal.js +9 -8
- package/dist/DataTable/TablePaginationMinimal.js.map +1 -1
- package/dist/DataTable/TableRow.js +15 -18
- package/dist/DataTable/TableRow.js.map +1 -1
- package/dist/DataTable/filters/CheckboxFilter.js +23 -22
- package/dist/DataTable/filters/CheckboxFilter.js.map +1 -1
- package/dist/DataTable/filters/DropdownFilter.js +14 -19
- package/dist/DataTable/filters/DropdownFilter.js.map +1 -1
- package/dist/DataTable/filters/MultiSelectDropdownFilter.js +19 -20
- package/dist/DataTable/filters/MultiSelectDropdownFilter.js.map +1 -1
- package/dist/DataTable/filters/TextFilter.js +10 -13
- package/dist/DataTable/filters/TextFilter.js.map +1 -1
- package/dist/DataTable/hooks.js +29 -25
- package/dist/DataTable/hooks.js.map +1 -1
- package/dist/DataTable/index.js +120 -104
- package/dist/DataTable/index.js.map +1 -1
- package/dist/DataTable/selection/BaseSelectionStatus.js +29 -31
- package/dist/DataTable/selection/BaseSelectionStatus.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelect.js +13 -9
- package/dist/DataTable/selection/ControlledSelect.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelectHeader.js +19 -15
- package/dist/DataTable/selection/ControlledSelectHeader.js.map +1 -1
- package/dist/DataTable/selection/ControlledSelectionStatus.js +34 -24
- package/dist/DataTable/selection/ControlledSelectionStatus.js.map +1 -1
- package/dist/DataTable/selection/SelectionStatus.js +23 -23
- package/dist/DataTable/selection/SelectionStatus.js.map +1 -1
- package/dist/DataTable/utils/getVisibleColumns.js +36 -44
- package/dist/DataTable/utils/getVisibleColumns.js.map +1 -1
- package/dist/Dropdown/deprecated/DropdownButton.js +9 -13
- package/dist/Dropdown/deprecated/DropdownButton.js.map +1 -1
- package/dist/Dropdown/deprecated/DropdownItem.js +7 -8
- package/dist/Dropdown/deprecated/DropdownItem.js.map +1 -1
- package/dist/Dropdown/deprecated/DropdownMenu.js +8 -12
- package/dist/Dropdown/deprecated/DropdownMenu.js.map +1 -1
- package/dist/Dropdown/deprecated/index.js +136 -103
- package/dist/Dropdown/deprecated/index.js.map +1 -1
- package/dist/Dropdown/index.js +32 -29
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/Dropzone/DefaultContent.js +13 -13
- package/dist/Dropzone/DefaultContent.js.map +1 -1
- package/dist/Dropzone/DragError.js +1 -3
- package/dist/Dropzone/DragError.js.map +1 -1
- package/dist/Dropzone/GenericError.js +7 -7
- package/dist/Dropzone/GenericError.js.map +1 -1
- package/dist/Dropzone/UploadProgress.js +6 -8
- package/dist/Dropzone/UploadProgress.js.map +1 -1
- package/dist/Dropzone/index.js +145 -86
- package/dist/Dropzone/index.js.map +1 -1
- package/dist/Fieldset/index.js +82 -57
- package/dist/Fieldset/index.js.map +1 -1
- package/dist/Form/FormAutosuggest.js +137 -95
- package/dist/Form/FormAutosuggest.js.map +1 -1
- package/dist/Form/FormAutosuggestOption.js +4 -6
- package/dist/Form/FormAutosuggestOption.js.map +1 -1
- package/dist/Form/FormCheckbox.js +35 -42
- package/dist/Form/FormCheckbox.js.map +1 -1
- package/dist/Form/FormCheckboxSet.js +13 -16
- package/dist/Form/FormCheckboxSet.js.map +1 -1
- package/dist/Form/FormCheckboxSetContext.js +39 -34
- package/dist/Form/FormCheckboxSetContext.js.map +1 -1
- package/dist/Form/FormControl.js +41 -35
- package/dist/Form/FormControl.js.map +1 -1
- package/dist/Form/FormControlDecorator.js +3 -5
- package/dist/Form/FormControlDecorator.js.map +1 -1
- package/dist/Form/FormControlDecoratorGroup.js +8 -10
- package/dist/Form/FormControlDecoratorGroup.js.map +1 -1
- package/dist/Form/FormControlFeedback.js +12 -15
- package/dist/Form/FormControlFeedback.js.map +1 -1
- package/dist/Form/FormControlFloatingLabel.js +3 -6
- package/dist/Form/FormControlFloatingLabel.js.map +1 -1
- package/dist/Form/FormControlSet.js +8 -9
- package/dist/Form/FormControlSet.js.map +1 -1
- package/dist/Form/FormGroup.js +11 -12
- package/dist/Form/FormGroup.js.map +1 -1
- package/dist/Form/FormGroupContext.js +64 -39
- package/dist/Form/FormGroupContext.js.map +1 -1
- package/dist/Form/FormLabel.js +15 -17
- package/dist/Form/FormLabel.js.map +1 -1
- package/dist/Form/FormRadio.js +19 -22
- package/dist/Form/FormRadio.js.map +1 -1
- package/dist/Form/FormRadioSet.js +13 -16
- package/dist/Form/FormRadioSet.js.map +1 -1
- package/dist/Form/FormRadioSetContext.js +39 -34
- package/dist/Form/FormRadioSetContext.js.map +1 -1
- package/dist/Form/FormSwitch.js +16 -20
- package/dist/Form/FormSwitch.js.map +1 -1
- package/dist/Form/FormText.js +20 -29
- package/dist/Form/FormText.js.map +1 -1
- package/dist/Form/useCheckboxSetValues.js +46 -23
- package/dist/Form/useCheckboxSetValues.js.map +1 -1
- package/dist/Hyperlink/index.js +25 -25
- package/dist/Hyperlink/index.js.map +1 -1
- package/dist/Hyperlink/index.scss +2 -2
- package/dist/Icon/index.js +21 -20
- package/dist/Icon/index.js.map +1 -1
- package/dist/IconButton/index.js +30 -32
- package/dist/IconButton/index.js.map +1 -1
- package/dist/IconButtonToggle/index.js +16 -16
- package/dist/IconButtonToggle/index.js.map +1 -1
- package/dist/Input/index.js +122 -92
- package/dist/Input/index.js.map +1 -1
- package/dist/InputSelect/index.js +78 -51
- package/dist/InputSelect/index.js.map +1 -1
- package/dist/InputText/index.js +11 -9
- package/dist/InputText/index.js.map +1 -1
- package/dist/Layout/index.js +33 -29
- package/dist/Layout/index.js.map +1 -1
- package/dist/ListBox/index.js +112 -80
- package/dist/ListBox/index.js.map +1 -1
- package/dist/ListBoxOption/index.js +68 -45
- package/dist/ListBoxOption/index.js.map +1 -1
- package/dist/MailtoLink/index.js +37 -34
- package/dist/MailtoLink/index.js.map +1 -1
- package/dist/Menu/MenuItem.js +13 -14
- package/dist/Menu/MenuItem.js.map +1 -1
- package/dist/Menu/SelectMenu.js +68 -44
- package/dist/Menu/SelectMenu.js.map +1 -1
- package/dist/Menu/index.js +10 -11
- package/dist/Menu/index.js.map +1 -1
- package/dist/Modal/AlertModal.js +5 -7
- package/dist/Modal/AlertModal.js.map +1 -1
- package/dist/Modal/FullscreenModal.js +6 -8
- package/dist/Modal/FullscreenModal.js.map +1 -1
- package/dist/Modal/MarketingModal.js +8 -10
- package/dist/Modal/MarketingModal.js.map +1 -1
- package/dist/Modal/ModalCloseButton.js +13 -15
- package/dist/Modal/ModalCloseButton.js.map +1 -1
- package/dist/Modal/ModalContext.js +13 -13
- package/dist/Modal/ModalContext.js.map +1 -1
- package/dist/Modal/ModalDialog.js +22 -23
- package/dist/Modal/ModalDialog.js.map +1 -1
- package/dist/Modal/ModalDialogBody.js +22 -11
- package/dist/Modal/ModalDialogBody.js.map +1 -1
- package/dist/Modal/ModalDialogFooter.js +6 -7
- package/dist/Modal/ModalDialogFooter.js.map +1 -1
- package/dist/Modal/ModalDialogHeader.js +6 -7
- package/dist/Modal/ModalDialogHeader.js.map +1 -1
- package/dist/Modal/ModalDialogHero.js +6 -7
- package/dist/Modal/ModalDialogHero.js.map +1 -1
- package/dist/Modal/ModalDialogHeroBackground.js +8 -9
- package/dist/Modal/ModalDialogHeroBackground.js.map +1 -1
- package/dist/Modal/ModalDialogHeroContent.js +6 -7
- package/dist/Modal/ModalDialogHeroContent.js.map +1 -1
- package/dist/Modal/ModalDialogTitle.js +6 -7
- package/dist/Modal/ModalDialogTitle.js.map +1 -1
- package/dist/Modal/ModalLayer.js +11 -17
- package/dist/Modal/ModalLayer.js.map +1 -1
- package/dist/Modal/ModalPopup.js +17 -17
- package/dist/Modal/ModalPopup.js.map +1 -1
- package/dist/Modal/PopperElement.js +25 -18
- package/dist/Modal/PopperElement.js.map +1 -1
- package/dist/Modal/Portal.js +40 -18
- package/dist/Modal/Portal.js.map +1 -1
- package/dist/Modal/StandardModal.js +6 -8
- package/dist/Modal/StandardModal.js.map +1 -1
- package/dist/Modal/index.js +215 -187
- package/dist/Modal/index.js.map +1 -1
- package/dist/Nav/index.js +3 -2
- package/dist/Nav/index.js.map +1 -1
- package/dist/Navbar/index.js +7 -6
- package/dist/Navbar/index.js.map +1 -1
- package/dist/OverflowScroll/OverflowScroll.js +45 -37
- package/dist/OverflowScroll/OverflowScroll.js.map +1 -1
- package/dist/OverflowScroll/OverflowScrollContext.js +1 -1
- package/dist/OverflowScroll/OverflowScrollContext.js.map +1 -1
- package/dist/OverflowScroll/OverflowScrollItems.js +2 -4
- package/dist/OverflowScroll/OverflowScrollItems.js.map +1 -1
- package/dist/Overlay/index.js +4 -4
- package/dist/Overlay/index.js.map +1 -1
- package/dist/PageBanner/index.js +11 -13
- package/dist/PageBanner/index.js.map +1 -1
- package/dist/Pagination/index.js +331 -296
- package/dist/Pagination/index.js.map +1 -1
- package/dist/Popover/index.js +11 -14
- package/dist/Popover/index.js.map +1 -1
- package/dist/ProductTour/Checkpoint.js +29 -22
- package/dist/ProductTour/Checkpoint.js.map +1 -1
- package/dist/ProductTour/CheckpointActionRow.js +18 -16
- package/dist/ProductTour/CheckpointActionRow.js.map +1 -1
- package/dist/ProductTour/CheckpointBody.js +2 -4
- package/dist/ProductTour/CheckpointBody.js.map +1 -1
- package/dist/ProductTour/CheckpointBreadcrumbs.js +16 -16
- package/dist/ProductTour/CheckpointBreadcrumbs.js.map +1 -1
- package/dist/ProductTour/CheckpointTitle.js +2 -4
- package/dist/ProductTour/CheckpointTitle.js.map +1 -1
- package/dist/ProductTour/index.js +66 -47
- package/dist/ProductTour/index.js.map +1 -1
- package/dist/ProgressBar/index.js +37 -35
- package/dist/ProgressBar/index.js.map +1 -1
- package/dist/RadioButtonGroup/index.js +133 -102
- package/dist/RadioButtonGroup/index.js.map +1 -1
- package/dist/Scrollable/index.js +30 -15
- package/dist/Scrollable/index.js.map +1 -1
- package/dist/SearchField/SearchFieldAdvanced.js +54 -44
- package/dist/SearchField/SearchFieldAdvanced.js.map +1 -1
- package/dist/SearchField/SearchFieldClearButton.js +7 -8
- package/dist/SearchField/SearchFieldClearButton.js.map +1 -1
- package/dist/SearchField/SearchFieldInput.js +8 -9
- package/dist/SearchField/SearchFieldInput.js.map +1 -1
- package/dist/SearchField/SearchFieldLabel.js +5 -8
- package/dist/SearchField/SearchFieldLabel.js.map +1 -1
- package/dist/SearchField/SearchFieldSubmitButton.js +12 -15
- package/dist/SearchField/SearchFieldSubmitButton.js.map +1 -1
- package/dist/SearchField/index.js +22 -22
- package/dist/SearchField/index.js.map +1 -1
- package/dist/SelectableBox/SelectableBoxSet.js +25 -26
- package/dist/SelectableBox/SelectableBoxSet.js.map +1 -1
- package/dist/SelectableBox/index.js +42 -38
- package/dist/SelectableBox/index.js.map +1 -1
- package/dist/Sheet/SheetContainer.js +38 -16
- package/dist/Sheet/SheetContainer.js.map +1 -1
- package/dist/Sheet/index.js +65 -43
- package/dist/Sheet/index.js.map +1 -1
- package/dist/Spinner/index.js +8 -9
- package/dist/Spinner/index.js.map +1 -1
- package/dist/Stack/index.js +9 -11
- package/dist/Stack/index.js.map +1 -1
- package/dist/StatefulButton/index.js +15 -17
- package/dist/StatefulButton/index.js.map +1 -1
- package/dist/StatusAlert/index.js +120 -82
- package/dist/StatusAlert/index.js.map +1 -1
- package/dist/Stepper/Stepper.js +2 -4
- package/dist/Stepper/Stepper.js.map +1 -1
- package/dist/Stepper/StepperActionRow.js +7 -10
- package/dist/Stepper/StepperActionRow.js.map +1 -1
- package/dist/Stepper/StepperContext.js +64 -32
- package/dist/Stepper/StepperContext.js.map +1 -1
- package/dist/Stepper/StepperHeader.js +23 -30
- package/dist/Stepper/StepperHeader.js.map +1 -1
- package/dist/Stepper/StepperHeaderStep.js +14 -17
- package/dist/Stepper/StepperHeaderStep.js.map +1 -1
- package/dist/Stepper/StepperStep.js +23 -24
- package/dist/Stepper/StepperStep.js.map +1 -1
- package/dist/Sticky/index.js +30 -22
- package/dist/Sticky/index.js.map +1 -1
- package/dist/Table/index.js +178 -109
- package/dist/Table/index.js.map +1 -1
- package/dist/Tabs/deprecated/index.js +99 -66
- package/dist/Tabs/deprecated/index.js.map +1 -1
- package/dist/Tabs/index.js +65 -49
- package/dist/Tabs/index.js.map +1 -1
- package/dist/TextArea/index.js +10 -8
- package/dist/TextArea/index.js.map +1 -1
- package/dist/Toast/ToastContainer.js +38 -16
- package/dist/Toast/ToastContainer.js.map +1 -1
- package/dist/Toast/index.js +33 -18
- package/dist/Toast/index.js.map +1 -1
- package/dist/Tooltip/index.js +8 -9
- package/dist/Tooltip/index.js.map +1 -1
- package/dist/TransitionReplace/DemoTransitionReplace.js +12 -3
- package/dist/TransitionReplace/DemoTransitionReplace.js.map +1 -1
- package/dist/TransitionReplace/index.js +136 -100
- package/dist/TransitionReplace/index.js.map +1 -1
- package/dist/Truncate/index.js +30 -24
- package/dist/Truncate/index.js.map +1 -1
- package/dist/ValidationFormGroup/index.js +38 -37
- package/dist/ValidationFormGroup/index.js.map +1 -1
- package/dist/ValidationMessage/index.js +76 -51
- package/dist/ValidationMessage/index.js.map +1 -1
- package/dist/asInput/index.js +251 -202
- package/dist/asInput/index.js.map +1 -1
- package/dist/hooks/useArrowKeyNavigation.js +46 -43
- package/dist/hooks/useArrowKeyNavigation.js.map +1 -1
- package/dist/hooks/useIndexOfLastVisibleChild.js +40 -26
- package/dist/hooks/useIndexOfLastVisibleChild.js.map +1 -1
- package/dist/hooks/useIsVisible.js +20 -13
- package/dist/hooks/useIsVisible.js.map +1 -1
- package/dist/hooks/useToggle.js +18 -11
- package/dist/hooks/useToggle.js.map +1 -1
- package/dist/hooks/useWindowSize.js +17 -6
- package/dist/hooks/useWindowSize.js.map +1 -1
- package/dist/paragon.css +1 -1
- package/dist/withDeprecatedProps.js +79 -58
- package/dist/withDeprecatedProps.js.map +1 -1
- package/package.json +1 -5
- package/src/Button/index.jsx +2 -2
- package/src/Dropzone/index.jsx +1 -1
- package/src/Hyperlink/index.scss +2 -2
- package/src/Icon/index.jsx +1 -1
- package/src/IconButton/__snapshots__/IconButton.test.jsx.snap +12 -10
- package/src/IconButton/index.jsx +1 -1
- package/src/Menu/MenuItem.jsx +2 -2
- package/src/Overlay/README.md +1 -1
- package/src/Overlay/index.jsx +1 -1
package/dist/Menu/MenuItem.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
var _excluded = ["as", "children", "defaultSelected", "iconAfter", "iconBefore"];
|
|
2
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return
|
|
6
|
-
function _toPrimitive(input, hint) { if (
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
8
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
8
9
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
9
10
|
import React from 'react';
|
|
@@ -11,17 +12,15 @@ import PropTypes from 'prop-types';
|
|
|
11
12
|
import classNames from 'classnames';
|
|
12
13
|
import Icon from '../Icon';
|
|
13
14
|
function MenuItem(_ref) {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
iconBefore
|
|
20
|
-
} = _ref,
|
|
15
|
+
var as = _ref.as,
|
|
16
|
+
children = _ref.children,
|
|
17
|
+
defaultSelected = _ref.defaultSelected,
|
|
18
|
+
iconAfter = _ref.iconAfter,
|
|
19
|
+
iconBefore = _ref.iconBefore,
|
|
21
20
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
22
|
-
|
|
21
|
+
var className = classNames(props.className, 'pgn__menu-item');
|
|
23
22
|
return /*#__PURE__*/React.createElement(as, _objectSpread(_objectSpread({}, props), {}, {
|
|
24
|
-
className
|
|
23
|
+
className: className
|
|
25
24
|
}), /*#__PURE__*/React.createElement(React.Fragment, null, iconBefore && /*#__PURE__*/React.createElement(Icon, {
|
|
26
25
|
className: "btn-icon-before",
|
|
27
26
|
src: iconBefore
|
|
@@ -44,9 +43,9 @@ MenuItem.propTypes = {
|
|
|
44
43
|
/** Specifies the base element */
|
|
45
44
|
as: PropTypes.elementType,
|
|
46
45
|
/** Specifies the jsx before the content of the ``MenuItem`` */
|
|
47
|
-
iconBefore: PropTypes.oneOfType([PropTypes.element, PropTypes.
|
|
46
|
+
iconBefore: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),
|
|
48
47
|
/** Specifies the jsx after the content of the ``MenuItem`` */
|
|
49
|
-
iconAfter: PropTypes.oneOfType([PropTypes.element, PropTypes.
|
|
48
|
+
iconAfter: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType])
|
|
50
49
|
};
|
|
51
50
|
MenuItem.defaultProps = {
|
|
52
51
|
defaultSelected: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.js","names":["React","PropTypes","classNames","Icon","MenuItem","_ref","as","children","defaultSelected","iconAfter","iconBefore","props","_objectWithoutProperties","_excluded","className","createElement","_objectSpread","Fragment","src","propTypes","bool","string","node","elementType","oneOfType","element","
|
|
1
|
+
{"version":3,"file":"MenuItem.js","names":["React","PropTypes","classNames","Icon","MenuItem","_ref","as","children","defaultSelected","iconAfter","iconBefore","props","_objectWithoutProperties","_excluded","className","createElement","_objectSpread","Fragment","src","propTypes","bool","string","node","elementType","oneOfType","element","defaultProps","undefined"],"sources":["../../src/Menu/MenuItem.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Icon from '../Icon';\n\nfunction MenuItem({\n as,\n children,\n defaultSelected,\n iconAfter,\n iconBefore,\n ...props\n}) {\n const className = classNames(props.className, 'pgn__menu-item');\n\n return React.createElement(\n as,\n {\n ...props,\n className,\n },\n (\n <>\n {iconBefore && <Icon className=\"btn-icon-before\" src={iconBefore} />}\n <span className=\"pgn__menu-item-text\">{children}</span>\n <span className=\"pgn__menu-item-content-spacer\" />\n {iconAfter && <Icon className=\"btn-icon-after\" src={iconAfter} />}\n </>\n ),\n );\n}\n\nMenuItem.propTypes = {\n /** Specifies that this ``MenuItem`` is selected inside the ``SelectMenu`` */\n defaultSelected: PropTypes.bool,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /** Specifies the content of the ``MenuItem`` */\n children: PropTypes.node,\n /** Specifies the base element */\n as: PropTypes.elementType,\n /** Specifies the jsx before the content of the ``MenuItem`` */\n iconBefore: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),\n /** Specifies the jsx after the content of the ``MenuItem`` */\n iconAfter: PropTypes.oneOfType([PropTypes.element, PropTypes.elementType]),\n};\n\nMenuItem.defaultProps = {\n defaultSelected: false,\n as: 'button',\n className: undefined,\n children: null,\n iconBefore: undefined,\n iconAfter: undefined,\n};\n\nexport default MenuItem;\n"],"mappings":";;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,IAAI,MAAM,SAAS;AAE1B,SAASC,QAAQA,CAAAC,IAAA,EAOd;EAAA,IANDC,EAAE,GAAAD,IAAA,CAAFC,EAAE;IACFC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IACRC,eAAe,GAAAH,IAAA,CAAfG,eAAe;IACfC,SAAS,GAAAJ,IAAA,CAATI,SAAS;IACTC,UAAU,GAAAL,IAAA,CAAVK,UAAU;IACPC,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAER,IAAMC,SAAS,GAAGZ,UAAU,CAACS,KAAK,CAACG,SAAS,EAAE,gBAAgB,CAAC;EAE/D,oBAAOd,KAAK,CAACe,aAAa,CACxBT,EAAE,EAAAU,aAAA,CAAAA,aAAA,KAEGL,KAAK;IACRG,SAAS,EAATA;EAAS,iBAGTd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAiB,QAAA,QACGP,UAAU,iBAAIV,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,iBAAiB;IAACI,GAAG,EAAER;EAAW,CAAE,CAAC,eACpEV,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAAqB,GAAEP,QAAe,CAAC,eACvDP,KAAA,CAAAe,aAAA;IAAMD,SAAS,EAAC;EAA+B,CAAE,CAAC,EACjDL,SAAS,iBAAIT,KAAA,CAAAe,aAAA,CAACZ,IAAI;IAACW,SAAS,EAAC,gBAAgB;IAACI,GAAG,EAAET;EAAU,CAAE,CAChE,CAEN,CAAC;AACH;AAEAL,QAAQ,CAACe,SAAS,GAAG;EACnB;EACAX,eAAe,EAAEP,SAAS,CAACmB,IAAI;EAC/B;EACAN,SAAS,EAAEb,SAAS,CAACoB,MAAM;EAC3B;EACAd,QAAQ,EAAEN,SAAS,CAACqB,IAAI;EACxB;EACAhB,EAAE,EAAEL,SAAS,CAACsB,WAAW;EACzB;EACAb,UAAU,EAAET,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACsB,WAAW,CAAC,CAAC;EAC3E;EACAd,SAAS,EAAER,SAAS,CAACuB,SAAS,CAAC,CAACvB,SAAS,CAACwB,OAAO,EAAExB,SAAS,CAACsB,WAAW,CAAC;AAC3E,CAAC;AAEDnB,QAAQ,CAACsB,YAAY,GAAG;EACtBlB,eAAe,EAAE,KAAK;EACtBF,EAAE,EAAE,QAAQ;EACZQ,SAAS,EAAEa,SAAS;EACpBpB,QAAQ,EAAE,IAAI;EACdG,UAAU,EAAEiB,SAAS;EACrBlB,SAAS,EAAEkB;AACb,CAAC;AAED,eAAevB,QAAQ"}
|
package/dist/Menu/SelectMenu.js
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
|
-
|
|
1
|
+
var _excluded = ["defaultMessage", "children", "className", "variant"];
|
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
4
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
5
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
6
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
7
|
+
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
8
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
3
9
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
10
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
11
|
import React, { useState, useEffect, useCallback } from 'react';
|
|
@@ -11,54 +17,68 @@ import ModalPopup from '../Modal/ModalPopup';
|
|
|
11
17
|
import useToggle from '../hooks/useToggle';
|
|
12
18
|
import Menu from '.';
|
|
13
19
|
import withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';
|
|
14
|
-
export
|
|
20
|
+
export var SELECT_MENU_DEFAULT_MESSAGE = 'Select...';
|
|
15
21
|
function SelectMenu(_ref) {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
variant
|
|
21
|
-
} = _ref,
|
|
22
|
+
var defaultMessage = _ref.defaultMessage,
|
|
23
|
+
children = _ref.children,
|
|
24
|
+
className = _ref.className,
|
|
25
|
+
variant = _ref.variant,
|
|
22
26
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
23
|
-
|
|
27
|
+
var _useState = useState(null),
|
|
28
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
29
|
+
triggerTarget = _useState2[0],
|
|
30
|
+
setTriggerTarget = _useState2[1];
|
|
24
31
|
// this ref is used to focus the menu open button after any menu option is clicked.
|
|
25
32
|
// triggerTarget.current.focus() inside the onCLick() function didn't guarantee element focus.
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
33
|
+
var focusMenuRef = React.useRef(false);
|
|
34
|
+
var itemsCollection = React.useMemo(function () {
|
|
35
|
+
return Array.from({
|
|
36
|
+
length: children.length
|
|
37
|
+
}).map(function () {
|
|
38
|
+
return /*#__PURE__*/React.createRef();
|
|
39
|
+
});
|
|
40
|
+
}, [children.length]);
|
|
41
|
+
var defaultIndex = useCallback(function () {
|
|
42
|
+
for (var i = 0; i < children.length; i++) {
|
|
32
43
|
if (children[i].props && children[i].props.defaultSelected) {
|
|
33
44
|
return i;
|
|
34
45
|
}
|
|
35
46
|
}
|
|
36
47
|
return undefined;
|
|
37
48
|
}, [children]);
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
49
|
+
var _useState3 = useState(defaultIndex()),
|
|
50
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
51
|
+
selected = _useState4[0],
|
|
52
|
+
setSelected = _useState4[1];
|
|
53
|
+
var _useToggle = useToggle(false),
|
|
54
|
+
_useToggle2 = _slicedToArray(_useToggle, 3),
|
|
55
|
+
isOpen = _useToggle2[0],
|
|
56
|
+
open = _useToggle2[1],
|
|
57
|
+
close = _useToggle2[2];
|
|
58
|
+
var createMenuItems = function createMenuItems() {
|
|
59
|
+
return React.Children.map(children, function (child, index) {
|
|
60
|
+
var newProps = {
|
|
61
|
+
onClick: function onClick(e) {
|
|
62
|
+
if (child.props.onClick) {
|
|
63
|
+
child.props.onClick(e);
|
|
64
|
+
}
|
|
65
|
+
setSelected(index);
|
|
66
|
+
close();
|
|
67
|
+
focusMenuRef.current = true;
|
|
68
|
+
},
|
|
69
|
+
id: "".concat(index.toString(), "_pgn__menu-item"),
|
|
70
|
+
role: 'link'
|
|
71
|
+
};
|
|
72
|
+
if (selected === index) {
|
|
73
|
+
newProps['aria-current'] = 'page';
|
|
74
|
+
}
|
|
75
|
+
return /*#__PURE__*/React.cloneElement(child, newProps);
|
|
76
|
+
});
|
|
77
|
+
};
|
|
78
|
+
var prevOpenRef = React.useRef();
|
|
79
|
+
useEffect(function () {
|
|
60
80
|
if (isOpen && selected) {
|
|
61
|
-
|
|
81
|
+
var numItems = children.length;
|
|
62
82
|
if (numItems > 6 && selected > 1 && numItems - selected > 2) {
|
|
63
83
|
// on "middle elements", set offset to center of block and scroll to center
|
|
64
84
|
itemsCollection[selected].current.children[0].scrollIntoView({
|
|
@@ -105,10 +125,12 @@ function SelectMenu(_ref) {
|
|
|
105
125
|
}]
|
|
106
126
|
}, /*#__PURE__*/React.createElement(Menu, {
|
|
107
127
|
"aria-label": "Select Menu"
|
|
108
|
-
}, createMenuItems().map((child, index)
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
128
|
+
}, createMenuItems().map(function (child, index) {
|
|
129
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
130
|
+
key: child.props.id,
|
|
131
|
+
ref: itemsCollection[index]
|
|
132
|
+
}, child);
|
|
133
|
+
})))));
|
|
112
134
|
}
|
|
113
135
|
SelectMenu.propTypes = {
|
|
114
136
|
/** String that is displayed for default value of the ``SelectMenu`` */
|
|
@@ -125,12 +147,14 @@ SelectMenu.defaultProps = {
|
|
|
125
147
|
className: undefined,
|
|
126
148
|
variant: 'outline-primary'
|
|
127
149
|
};
|
|
128
|
-
|
|
150
|
+
var SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {
|
|
129
151
|
isLink: {
|
|
130
152
|
deprType: DeprTypes.MOVED_AND_FORMAT,
|
|
131
153
|
message: 'Use "variant" prop instead, i.e. variant="link"',
|
|
132
154
|
newName: 'variant',
|
|
133
|
-
transform: ()
|
|
155
|
+
transform: function transform() {
|
|
156
|
+
return 'link';
|
|
157
|
+
}
|
|
134
158
|
}
|
|
135
159
|
});
|
|
136
160
|
export default SelectMenuWithDeprecatedProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectMenu.js","names":["React","useState","useEffect","useCallback","PropTypes","classNames","ExpandMore","Button","ModalPopup","useToggle","Menu","withDeprecatedProps","DeprTypes","SELECT_MENU_DEFAULT_MESSAGE","SelectMenu","_ref","defaultMessage","children","className","variant","props","_objectWithoutProperties","_excluded","triggerTarget","setTriggerTarget","focusMenuRef","useRef","itemsCollection","useMemo","Array","from","length","map","createRef","defaultIndex","i","defaultSelected","undefined","selected","setSelected","isOpen","open","close","createMenuItems","Children","child","index","newProps","onClick","e","current","id","toString","role","cloneElement","prevOpenRef","numItems","scrollIntoView","block","focus","preventScroll","createElement","_extends","ref","iconAfter","placement","positionRef","onClose","modifiers","name","options","padding","top","bottom","key","propTypes","string","node","isRequired","defaultProps","SelectMenuWithDeprecatedProp","isLink","deprType","MOVED_AND_FORMAT","message","newName","transform"],"sources":["../../src/Menu/SelectMenu.jsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { ExpandMore } from '../../icons';\nimport Button from '../Button';\nimport ModalPopup from '../Modal/ModalPopup';\nimport useToggle from '../hooks/useToggle';\nimport Menu from '.';\nimport withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';\n\nexport const SELECT_MENU_DEFAULT_MESSAGE = 'Select...';\n\nfunction SelectMenu({\n defaultMessage,\n children,\n className,\n variant,\n ...props\n}) {\n const [triggerTarget, setTriggerTarget] = useState(null);\n // this ref is used to focus the menu open button after any menu option is clicked.\n // triggerTarget.current.focus() inside the onCLick() function didn't guarantee element focus.\n const focusMenuRef = React.useRef(false);\n const itemsCollection = React.useMemo(\n () => Array.from({ length: children.length }).map(() => React.createRef()),\n [children.length],\n );\n\n const defaultIndex = useCallback(() => {\n for (let i = 0; i < children.length; i++) {\n if (children[i].props && children[i].props.defaultSelected) {\n return i;\n }\n }\n return undefined;\n }, [children]);\n\n const [selected, setSelected] = useState(defaultIndex());\n const [isOpen, open, close] = useToggle(false);\n\n const createMenuItems = () => React.Children.map(children, (child, index) => {\n const newProps = {\n onClick(e) {\n if (child.props.onClick) {\n child.props.onClick(e);\n }\n setSelected(index);\n close();\n focusMenuRef.current = true;\n },\n id: `${index.toString()}_pgn__menu-item`,\n role: 'link',\n };\n if (selected === index) {\n newProps['aria-current'] = 'page';\n }\n return React.cloneElement(child, newProps);\n });\n\n const prevOpenRef = React.useRef();\n\n useEffect(() => {\n if (isOpen && selected) {\n const numItems = children.length;\n if (numItems > 6 && selected > 1 && numItems - selected > 2) {\n // on \"middle elements\", set offset to center of block and scroll to center\n itemsCollection[selected].current.children[0].scrollIntoView({\n block: 'center',\n });\n }\n }\n // set focus on open\n if (isOpen && !prevOpenRef.current && selected) {\n itemsCollection[selected].current.children[0].focus({ preventScroll: (defaultIndex() === selected) });\n }\n if (focusMenuRef.current) {\n triggerTarget.focus();\n focusMenuRef.current = false;\n }\n prevOpenRef.current = isOpen;\n }, [isOpen, children.length, defaultIndex, itemsCollection, selected, triggerTarget]);\n\n return (\n <div className={classNames('pgn__menu-select', className)} {...props}>\n <Button\n aria-haspopup=\"true\"\n aria-expanded={isOpen}\n ref={setTriggerTarget}\n variant={variant}\n iconAfter={ExpandMore}\n onClick={open}\n >\n {selected !== undefined && children[selected] ? children[selected].props.children : defaultMessage}\n </Button>\n <div className=\"pgn__menu-select-popup\">\n <ModalPopup\n placement=\"bottom-start\"\n positionRef={triggerTarget}\n isOpen={isOpen}\n onClose={close}\n modifiers={\n [\n {\n name: 'flip',\n options: {\n padding: { top: 150, bottom: 150 },\n },\n },\n ]\n }\n >\n <Menu aria-label=\"Select Menu\">\n {createMenuItems().map((child, index) => (\n <div key={child.props.id} ref={itemsCollection[index]}>\n {child}\n </div>\n ))}\n </Menu>\n </ModalPopup>\n </div>\n </div>\n );\n}\n\nSelectMenu.propTypes = {\n /** String that is displayed for default value of the ``SelectMenu`` */\n defaultMessage: PropTypes.string,\n /** Specifies the content of the ``SelectMenu`` */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /** Specifies variant to use. */\n variant: PropTypes.string,\n};\n\nSelectMenu.defaultProps = {\n defaultMessage: SELECT_MENU_DEFAULT_MESSAGE,\n className: undefined,\n variant: 'outline-primary',\n};\n\nconst SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {\n isLink: {\n deprType: DeprTypes.MOVED_AND_FORMAT,\n message: 'Use \"variant\" prop instead, i.e. variant=\"link\"',\n newName: 'variant',\n transform: () => 'link',\n },\n});\n\nexport default SelectMenuWithDeprecatedProp;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectMenu.js","names":["React","useState","useEffect","useCallback","PropTypes","classNames","ExpandMore","Button","ModalPopup","useToggle","Menu","withDeprecatedProps","DeprTypes","SELECT_MENU_DEFAULT_MESSAGE","SelectMenu","_ref","defaultMessage","children","className","variant","props","_objectWithoutProperties","_excluded","_useState","_useState2","_slicedToArray","triggerTarget","setTriggerTarget","focusMenuRef","useRef","itemsCollection","useMemo","Array","from","length","map","createRef","defaultIndex","i","defaultSelected","undefined","_useState3","_useState4","selected","setSelected","_useToggle","_useToggle2","isOpen","open","close","createMenuItems","Children","child","index","newProps","onClick","e","current","id","concat","toString","role","cloneElement","prevOpenRef","numItems","scrollIntoView","block","focus","preventScroll","createElement","_extends","ref","iconAfter","placement","positionRef","onClose","modifiers","name","options","padding","top","bottom","key","propTypes","string","node","isRequired","defaultProps","SelectMenuWithDeprecatedProp","isLink","deprType","MOVED_AND_FORMAT","message","newName","transform"],"sources":["../../src/Menu/SelectMenu.jsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { ExpandMore } from '../../icons';\nimport Button from '../Button';\nimport ModalPopup from '../Modal/ModalPopup';\nimport useToggle from '../hooks/useToggle';\nimport Menu from '.';\nimport withDeprecatedProps, { DeprTypes } from '../withDeprecatedProps';\n\nexport const SELECT_MENU_DEFAULT_MESSAGE = 'Select...';\n\nfunction SelectMenu({\n defaultMessage,\n children,\n className,\n variant,\n ...props\n}) {\n const [triggerTarget, setTriggerTarget] = useState(null);\n // this ref is used to focus the menu open button after any menu option is clicked.\n // triggerTarget.current.focus() inside the onCLick() function didn't guarantee element focus.\n const focusMenuRef = React.useRef(false);\n const itemsCollection = React.useMemo(\n () => Array.from({ length: children.length }).map(() => React.createRef()),\n [children.length],\n );\n\n const defaultIndex = useCallback(() => {\n for (let i = 0; i < children.length; i++) {\n if (children[i].props && children[i].props.defaultSelected) {\n return i;\n }\n }\n return undefined;\n }, [children]);\n\n const [selected, setSelected] = useState(defaultIndex());\n const [isOpen, open, close] = useToggle(false);\n\n const createMenuItems = () => React.Children.map(children, (child, index) => {\n const newProps = {\n onClick(e) {\n if (child.props.onClick) {\n child.props.onClick(e);\n }\n setSelected(index);\n close();\n focusMenuRef.current = true;\n },\n id: `${index.toString()}_pgn__menu-item`,\n role: 'link',\n };\n if (selected === index) {\n newProps['aria-current'] = 'page';\n }\n return React.cloneElement(child, newProps);\n });\n\n const prevOpenRef = React.useRef();\n\n useEffect(() => {\n if (isOpen && selected) {\n const numItems = children.length;\n if (numItems > 6 && selected > 1 && numItems - selected > 2) {\n // on \"middle elements\", set offset to center of block and scroll to center\n itemsCollection[selected].current.children[0].scrollIntoView({\n block: 'center',\n });\n }\n }\n // set focus on open\n if (isOpen && !prevOpenRef.current && selected) {\n itemsCollection[selected].current.children[0].focus({ preventScroll: (defaultIndex() === selected) });\n }\n if (focusMenuRef.current) {\n triggerTarget.focus();\n focusMenuRef.current = false;\n }\n prevOpenRef.current = isOpen;\n }, [isOpen, children.length, defaultIndex, itemsCollection, selected, triggerTarget]);\n\n return (\n <div className={classNames('pgn__menu-select', className)} {...props}>\n <Button\n aria-haspopup=\"true\"\n aria-expanded={isOpen}\n ref={setTriggerTarget}\n variant={variant}\n iconAfter={ExpandMore}\n onClick={open}\n >\n {selected !== undefined && children[selected] ? children[selected].props.children : defaultMessage}\n </Button>\n <div className=\"pgn__menu-select-popup\">\n <ModalPopup\n placement=\"bottom-start\"\n positionRef={triggerTarget}\n isOpen={isOpen}\n onClose={close}\n modifiers={\n [\n {\n name: 'flip',\n options: {\n padding: { top: 150, bottom: 150 },\n },\n },\n ]\n }\n >\n <Menu aria-label=\"Select Menu\">\n {createMenuItems().map((child, index) => (\n <div key={child.props.id} ref={itemsCollection[index]}>\n {child}\n </div>\n ))}\n </Menu>\n </ModalPopup>\n </div>\n </div>\n );\n}\n\nSelectMenu.propTypes = {\n /** String that is displayed for default value of the ``SelectMenu`` */\n defaultMessage: PropTypes.string,\n /** Specifies the content of the ``SelectMenu`` */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /** Specifies variant to use. */\n variant: PropTypes.string,\n};\n\nSelectMenu.defaultProps = {\n defaultMessage: SELECT_MENU_DEFAULT_MESSAGE,\n className: undefined,\n variant: 'outline-primary',\n};\n\nconst SelectMenuWithDeprecatedProp = withDeprecatedProps(SelectMenu, 'SelectMenu', {\n isLink: {\n deprType: DeprTypes.MOVED_AND_FORMAT,\n message: 'Use \"variant\" prop instead, i.e. variant=\"link\"',\n newName: 'variant',\n transform: () => 'link',\n },\n});\n\nexport default SelectMenuWithDeprecatedProp;\n"],"mappings":"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"}
|
package/dist/Menu/index.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
var _excluded = ["as", "arrowKeyNavigationSelector", "children"];
|
|
2
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return
|
|
6
|
-
function _toPrimitive(input, hint) { if (
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
8
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
8
9
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
9
10
|
import React from 'react';
|
|
@@ -11,19 +12,17 @@ import PropTypes from 'prop-types';
|
|
|
11
12
|
import classNames from 'classnames';
|
|
12
13
|
import useArrowKeyNavigation from '../hooks/useArrowKeyNavigation';
|
|
13
14
|
function Menu(_ref) {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
children
|
|
18
|
-
} = _ref,
|
|
15
|
+
var as = _ref.as,
|
|
16
|
+
arrowKeyNavigationSelector = _ref.arrowKeyNavigationSelector,
|
|
17
|
+
children = _ref.children,
|
|
19
18
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
20
|
-
|
|
19
|
+
var parentRef = useArrowKeyNavigation({
|
|
21
20
|
selectors: arrowKeyNavigationSelector
|
|
22
21
|
});
|
|
23
|
-
|
|
22
|
+
var className = classNames(props.className, 'pgn__menu');
|
|
24
23
|
return /*#__PURE__*/React.createElement(as, _objectSpread(_objectSpread({}, props), {}, {
|
|
25
24
|
ref: parentRef,
|
|
26
|
-
className
|
|
25
|
+
className: className
|
|
27
26
|
}),
|
|
28
27
|
/*#__PURE__*/
|
|
29
28
|
// eslint-disable-next-line react/jsx-no-useless-fragment
|
package/dist/Menu/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classNames","useArrowKeyNavigation","Menu","_ref","as","arrowKeyNavigationSelector","children","props","_objectWithoutProperties","_excluded","parentRef","selectors","className","createElement","_objectSpread","ref","Fragment","propTypes","string","elementType","node","defaultProps","undefined"],"sources":["../../src/Menu/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport useArrowKeyNavigation from '../hooks/useArrowKeyNavigation';\n\nfunction Menu({\n as,\n arrowKeyNavigationSelector,\n children,\n ...props\n}) {\n const parentRef = useArrowKeyNavigation({ selectors: arrowKeyNavigationSelector });\n const className = classNames(props.className, 'pgn__menu');\n\n return React.createElement(\n as,\n {\n ...props,\n ref: parentRef,\n className,\n },\n (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n {children}\n </>\n ),\n );\n}\n\nMenu.propTypes = {\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Specifies the CSS selector string that indicates to which elements\n * the user can navigate using the arrow keys\n */\n arrowKeyNavigationSelector: PropTypes.string,\n /** Specifies the base element */\n as: PropTypes.elementType,\n /** Specifies the content of the menu */\n children: PropTypes.node,\n};\n\nMenu.defaultProps = {\n className: undefined,\n arrowKeyNavigationSelector: 'a:not(:disabled),button:not(:disabled),input:not(:disabled)',\n as: 'div',\n children: null,\n};\n\nexport default Menu;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classNames","useArrowKeyNavigation","Menu","_ref","as","arrowKeyNavigationSelector","children","props","_objectWithoutProperties","_excluded","parentRef","selectors","className","createElement","_objectSpread","ref","Fragment","propTypes","string","elementType","node","defaultProps","undefined"],"sources":["../../src/Menu/index.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport useArrowKeyNavigation from '../hooks/useArrowKeyNavigation';\n\nfunction Menu({\n as,\n arrowKeyNavigationSelector,\n children,\n ...props\n}) {\n const parentRef = useArrowKeyNavigation({ selectors: arrowKeyNavigationSelector });\n const className = classNames(props.className, 'pgn__menu');\n\n return React.createElement(\n as,\n {\n ...props,\n ref: parentRef,\n className,\n },\n (\n // eslint-disable-next-line react/jsx-no-useless-fragment\n <>\n {children}\n </>\n ),\n );\n}\n\nMenu.propTypes = {\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Specifies the CSS selector string that indicates to which elements\n * the user can navigate using the arrow keys\n */\n arrowKeyNavigationSelector: PropTypes.string,\n /** Specifies the base element */\n as: PropTypes.elementType,\n /** Specifies the content of the menu */\n children: PropTypes.node,\n};\n\nMenu.defaultProps = {\n className: undefined,\n arrowKeyNavigationSelector: 'a:not(:disabled),button:not(:disabled),input:not(:disabled)',\n as: 'div',\n children: null,\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AACnC,OAAOC,qBAAqB,MAAM,gCAAgC;AAElE,SAASC,IAAIA,CAAAC,IAAA,EAKV;EAAA,IAJDC,EAAE,GAAAD,IAAA,CAAFC,EAAE;IACFC,0BAA0B,GAAAF,IAAA,CAA1BE,0BAA0B;IAC1BC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACLC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,IAAMC,SAAS,GAAGT,qBAAqB,CAAC;IAAEU,SAAS,EAAEN;EAA2B,CAAC,CAAC;EAClF,IAAMO,SAAS,GAAGZ,UAAU,CAACO,KAAK,CAACK,SAAS,EAAE,WAAW,CAAC;EAE1D,oBAAOd,KAAK,CAACe,aAAa,CACxBT,EAAE,EAAAU,aAAA,CAAAA,aAAA,KAEGP,KAAK;IACRQ,GAAG,EAAEL,SAAS;IACdE,SAAS,EAATA;EAAS;EAAA;EAGT;EACAd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAkB,QAAA,QACGV,QACD,CAEN,CAAC;AACH;AAEAJ,IAAI,CAACe,SAAS,GAAG;EACf;EACAL,SAAS,EAAEb,SAAS,CAACmB,MAAM;EAC3B;AACF;AACA;AACA;EACEb,0BAA0B,EAAEN,SAAS,CAACmB,MAAM;EAC5C;EACAd,EAAE,EAAEL,SAAS,CAACoB,WAAW;EACzB;EACAb,QAAQ,EAAEP,SAAS,CAACqB;AACtB,CAAC;AAEDlB,IAAI,CAACmB,YAAY,GAAG;EAClBT,SAAS,EAAEU,SAAS;EACpBjB,0BAA0B,EAAE,6DAA6D;EACzFD,EAAE,EAAE,KAAK;EACTE,QAAQ,EAAE;AACZ,CAAC;AAED,eAAeJ,IAAI"}
|
package/dist/Modal/AlertModal.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
var _excluded = ["children", "footerNode", "icon"];
|
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
3
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
4
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
@@ -9,11 +9,9 @@ import { requiredWhenNot } from '../utils/propTypes';
|
|
|
9
9
|
import Icon from '../Icon';
|
|
10
10
|
import ModalDialog from './ModalDialog';
|
|
11
11
|
function AlertModal(_ref) {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
icon
|
|
16
|
-
} = _ref,
|
|
12
|
+
var children = _ref.children,
|
|
13
|
+
footerNode = _ref.footerNode,
|
|
14
|
+
icon = _ref.icon,
|
|
17
15
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
18
16
|
return /*#__PURE__*/React.createElement(ModalDialog, _extends({}, props, {
|
|
19
17
|
className: classNames('pgn__alert-modal', props.className)
|
|
@@ -58,7 +56,7 @@ AlertModal.defaultProps = {
|
|
|
58
56
|
isOpen: false,
|
|
59
57
|
isBlocking: false,
|
|
60
58
|
hasCloseButton: false,
|
|
61
|
-
onClose: ()
|
|
59
|
+
onClose: function onClose() {},
|
|
62
60
|
size: 'md',
|
|
63
61
|
variant: 'default',
|
|
64
62
|
closeLabel: 'Close',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertModal.js","names":["React","PropTypes","classNames","requiredWhenNot","Icon","ModalDialog","AlertModal","_ref","children","footerNode","icon","props","_objectWithoutProperties","_excluded","createElement","_extends","className","Header","Title","src","title","Body","Footer","propTypes","node","isRequired","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","variant","closeLabel","isFullscreenScroll","elementType","defaultProps","undefined"],"sources":["../../src/Modal/AlertModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport Icon from '../Icon';\nimport ModalDialog from './ModalDialog';\n\nfunction AlertModal({\n children,\n footerNode,\n icon,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n className={classNames('pgn__alert-modal', props.className)}\n >\n <ModalDialog.Header>\n <ModalDialog.Title>\n {icon && (\n <Icon\n data-testid=\"title-icon\"\n src={icon}\n className={classNames('pgn__alert-modal__title_icon')}\n />\n )}\n {props.title}\n </ModalDialog.Title>\n </ModalDialog.Header>\n <ModalDialog.Body>{children}</ModalDialog.Body>\n {footerNode && <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>}\n </ModalDialog>\n );\n}\n\nAlertModal.propTypes = {\n children: PropTypes.node.isRequired,\n /** The aria-label of the dialog */\n title: PropTypes.string.isRequired,\n /** Is the modal dialog open or closed */\n isOpen: PropTypes.bool,\n /** Prevent clicking on the backdrop to close the modal */\n isBlocking: PropTypes.bool,\n /** Specifies whether the dialog box should contain 'x' icon button in the top right */\n hasCloseButton: PropTypes.bool,\n /** A callback to close the modal dialog */\n onClose: requiredWhenNot(PropTypes.func, 'isBlocking'),\n /** Sizes determine the maximum width of the dialog box */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** The visual style of the dialog box */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success']),\n /** The label supplied to the close icon button if one is rendered */\n closeLabel: PropTypes.string,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies what should be displayed in the footer of the dialog box */\n footerNode: PropTypes.node,\n /** Icon that will be shown in the header of modal */\n icon: PropTypes.elementType,\n};\n\nAlertModal.defaultProps = {\n isOpen: false,\n isBlocking: false,\n hasCloseButton: false,\n onClose: () => {},\n size: 'md',\n variant: 'default',\n closeLabel: 'Close',\n className: undefined,\n isFullscreenScroll: false,\n footerNode: null,\n icon: undefined,\n};\n\nexport default AlertModal;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,WAAW,MAAM,eAAe;AAEvC,SAASC,UAAUA,CAAAC,IAAA,EAKhB;EAAA,
|
|
1
|
+
{"version":3,"file":"AlertModal.js","names":["React","PropTypes","classNames","requiredWhenNot","Icon","ModalDialog","AlertModal","_ref","children","footerNode","icon","props","_objectWithoutProperties","_excluded","createElement","_extends","className","Header","Title","src","title","Body","Footer","propTypes","node","isRequired","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","variant","closeLabel","isFullscreenScroll","elementType","defaultProps","undefined"],"sources":["../../src/Modal/AlertModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport Icon from '../Icon';\nimport ModalDialog from './ModalDialog';\n\nfunction AlertModal({\n children,\n footerNode,\n icon,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n className={classNames('pgn__alert-modal', props.className)}\n >\n <ModalDialog.Header>\n <ModalDialog.Title>\n {icon && (\n <Icon\n data-testid=\"title-icon\"\n src={icon}\n className={classNames('pgn__alert-modal__title_icon')}\n />\n )}\n {props.title}\n </ModalDialog.Title>\n </ModalDialog.Header>\n <ModalDialog.Body>{children}</ModalDialog.Body>\n {footerNode && <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>}\n </ModalDialog>\n );\n}\n\nAlertModal.propTypes = {\n children: PropTypes.node.isRequired,\n /** The aria-label of the dialog */\n title: PropTypes.string.isRequired,\n /** Is the modal dialog open or closed */\n isOpen: PropTypes.bool,\n /** Prevent clicking on the backdrop to close the modal */\n isBlocking: PropTypes.bool,\n /** Specifies whether the dialog box should contain 'x' icon button in the top right */\n hasCloseButton: PropTypes.bool,\n /** A callback to close the modal dialog */\n onClose: requiredWhenNot(PropTypes.func, 'isBlocking'),\n /** Sizes determine the maximum width of the dialog box */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** The visual style of the dialog box */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success']),\n /** The label supplied to the close icon button if one is rendered */\n closeLabel: PropTypes.string,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies what should be displayed in the footer of the dialog box */\n footerNode: PropTypes.node,\n /** Icon that will be shown in the header of modal */\n icon: PropTypes.elementType,\n};\n\nAlertModal.defaultProps = {\n isOpen: false,\n isBlocking: false,\n hasCloseButton: false,\n onClose: () => {},\n size: 'md',\n variant: 'default',\n closeLabel: 'Close',\n className: undefined,\n isFullscreenScroll: false,\n footerNode: null,\n icon: undefined,\n};\n\nexport default AlertModal;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,WAAW,MAAM,eAAe;AAEvC,SAASC,UAAUA,CAAAC,IAAA,EAKhB;EAAA,IAJDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,UAAU,GAAAF,IAAA,CAAVE,UAAU;IACVC,IAAI,GAAAH,IAAA,CAAJG,IAAI;IACDC,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,oBACEb,KAAA,CAAAc,aAAA,CAACT,WAAW,EAAAU,QAAA,KACNJ,KAAK;IACTK,SAAS,EAAEd,UAAU,CAAC,kBAAkB,EAAES,KAAK,CAACK,SAAS;EAAE,iBAE3DhB,KAAA,CAAAc,aAAA,CAACT,WAAW,CAACY,MAAM,qBACjBjB,KAAA,CAAAc,aAAA,CAACT,WAAW,CAACa,KAAK,QACfR,IAAI,iBACLV,KAAA,CAAAc,aAAA,CAACV,IAAI;IACH,eAAY,YAAY;IACxBe,GAAG,EAAET,IAAK;IACVM,SAAS,EAAEd,UAAU,CAAC,8BAA8B;EAAE,CACvD,CACA,EACAS,KAAK,CAACS,KACU,CACD,CAAC,eACrBpB,KAAA,CAAAc,aAAA,CAACT,WAAW,CAACgB,IAAI,QAAEb,QAA2B,CAAC,EAC9CC,UAAU,iBAAIT,KAAA,CAAAc,aAAA,CAACT,WAAW,CAACiB,MAAM,QAAEb,UAA+B,CACxD,CAAC;AAElB;AAEAH,UAAU,CAACiB,SAAS,GAAG;EACrBf,QAAQ,EAAEP,SAAS,CAACuB,IAAI,CAACC,UAAU;EACnC;EACAL,KAAK,EAAEnB,SAAS,CAACyB,MAAM,CAACD,UAAU;EAClC;EACAE,MAAM,EAAE1B,SAAS,CAAC2B,IAAI;EACtB;EACAC,UAAU,EAAE5B,SAAS,CAAC2B,IAAI;EAC1B;EACAE,cAAc,EAAE7B,SAAS,CAAC2B,IAAI;EAC9B;EACAG,OAAO,EAAE5B,eAAe,CAACF,SAAS,CAAC+B,IAAI,EAAE,YAAY,CAAC;EACtD;EACAC,IAAI,EAAEhC,SAAS,CAACiC,KAAK,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC;EAC7D;EACAC,OAAO,EAAElC,SAAS,CAACiC,KAAK,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;EACrE;EACAE,UAAU,EAAEnC,SAAS,CAACyB,MAAM;EAC5B;EACAV,SAAS,EAAEf,SAAS,CAACyB,MAAM;EAC3B;AACF;AACA;AACA;AACA;EACEW,kBAAkB,EAAEpC,SAAS,CAAC2B,IAAI;EAClC;EACAnB,UAAU,EAAER,SAAS,CAACuB,IAAI;EAC1B;EACAd,IAAI,EAAET,SAAS,CAACqC;AAClB,CAAC;AAEDhC,UAAU,CAACiC,YAAY,GAAG;EACxBZ,MAAM,EAAE,KAAK;EACbE,UAAU,EAAE,KAAK;EACjBC,cAAc,EAAE,KAAK;EACrBC,OAAO,EAAE,SAAAA,QAAA,EAAM,CAAC,CAAC;EACjBE,IAAI,EAAE,IAAI;EACVE,OAAO,EAAE,SAAS;EAClBC,UAAU,EAAE,OAAO;EACnBpB,SAAS,EAAEwB,SAAS;EACpBH,kBAAkB,EAAE,KAAK;EACzB5B,UAAU,EAAE,IAAI;EAChBC,IAAI,EAAE8B;AACR,CAAC;AAED,eAAelC,UAAU"}
|
|
@@ -1,17 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
var _excluded = ["children", "footerNode", "beforeBodyNode", "afterBodyNode"];
|
|
2
2
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
3
3
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
import ModalDialog from './ModalDialog';
|
|
7
|
-
export
|
|
7
|
+
export var FULLSCREEN_MODAL_CLOSE_LABEL = 'Close';
|
|
8
8
|
function FullscreenModal(_ref) {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
afterBodyNode
|
|
14
|
-
} = _ref,
|
|
9
|
+
var children = _ref.children,
|
|
10
|
+
footerNode = _ref.footerNode,
|
|
11
|
+
beforeBodyNode = _ref.beforeBodyNode,
|
|
12
|
+
afterBodyNode = _ref.afterBodyNode,
|
|
15
13
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
16
14
|
return /*#__PURE__*/React.createElement(ModalDialog, props, /*#__PURE__*/React.createElement(ModalDialog.Header, null, /*#__PURE__*/React.createElement(ModalDialog.Title, null, props.title)), beforeBodyNode, /*#__PURE__*/React.createElement(ModalDialog.Body, {
|
|
17
15
|
className: props.modalBodyClassName
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullscreenModal.js","names":["React","PropTypes","ModalDialog","FULLSCREEN_MODAL_CLOSE_LABEL","FullscreenModal","_ref","children","footerNode","beforeBodyNode","afterBodyNode","props","_objectWithoutProperties","_excluded","createElement","Header","Title","title","Body","className","modalBodyClassName","Footer","propTypes","node","isRequired","string","onClose","func","isOpen","bool","hasCloseButton","size","oneOf","variant","closeLabel","isFullscreenScroll","defaultProps","undefined"],"sources":["../../src/Modal/FullscreenModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ModalDialog from './ModalDialog';\n\nexport const FULLSCREEN_MODAL_CLOSE_LABEL = 'Close';\n\nfunction FullscreenModal({\n children,\n footerNode,\n beforeBodyNode,\n afterBodyNode,\n ...props\n}) {\n return (\n <ModalDialog {...props}>\n <ModalDialog.Header>\n <ModalDialog.Title>{props.title}</ModalDialog.Title>\n </ModalDialog.Header>\n {beforeBodyNode}\n <ModalDialog.Body className={props.modalBodyClassName}>{children}</ModalDialog.Body>\n {afterBodyNode}\n {footerNode && <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>}\n </ModalDialog>\n );\n}\n\nFullscreenModal.propTypes = {\n /** Specifies contents of the component. */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element. */\n className: PropTypes.string,\n /** Specifies the aria-label of the dialog. */\n title: PropTypes.string.isRequired,\n /** Specifies a callback to close the modal dialog. */\n onClose: PropTypes.func.isRequired,\n /** Specifies whether the modal is open. */\n isOpen: PropTypes.bool,\n /** Specifies whether the model hase close 'x' icon button in the top right of the dialog box. */\n hasCloseButton: PropTypes.bool,\n /** Specifies size of the dialog box. */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** Specifies visual style of the dialog box. */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n /** The label supplied to the close icon button if one is rendered */\n closeLabel: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies footer for the dialog box. */\n footerNode: PropTypes.node,\n /** Specifies content that should be rendered before modal's body. */\n beforeBodyNode: PropTypes.node,\n /** Specifies content that should be rendered after modal's body. */\n afterBodyNode: PropTypes.node,\n /** Specifies class name for modal's body component. */\n modalBodyClassName: PropTypes.string,\n};\n\nFullscreenModal.defaultProps = {\n isOpen: false,\n hasCloseButton: true,\n size: 'fullscreen',\n variant: 'dark',\n closeLabel: FULLSCREEN_MODAL_CLOSE_LABEL,\n className: undefined,\n isFullscreenScroll: false,\n footerNode: null,\n beforeBodyNode: null,\n afterBodyNode: null,\n modalBodyClassName: '',\n};\n\nexport default FullscreenModal;\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,WAAW,MAAM,eAAe;AAEvC,OAAO,
|
|
1
|
+
{"version":3,"file":"FullscreenModal.js","names":["React","PropTypes","ModalDialog","FULLSCREEN_MODAL_CLOSE_LABEL","FullscreenModal","_ref","children","footerNode","beforeBodyNode","afterBodyNode","props","_objectWithoutProperties","_excluded","createElement","Header","Title","title","Body","className","modalBodyClassName","Footer","propTypes","node","isRequired","string","onClose","func","isOpen","bool","hasCloseButton","size","oneOf","variant","closeLabel","isFullscreenScroll","defaultProps","undefined"],"sources":["../../src/Modal/FullscreenModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport ModalDialog from './ModalDialog';\n\nexport const FULLSCREEN_MODAL_CLOSE_LABEL = 'Close';\n\nfunction FullscreenModal({\n children,\n footerNode,\n beforeBodyNode,\n afterBodyNode,\n ...props\n}) {\n return (\n <ModalDialog {...props}>\n <ModalDialog.Header>\n <ModalDialog.Title>{props.title}</ModalDialog.Title>\n </ModalDialog.Header>\n {beforeBodyNode}\n <ModalDialog.Body className={props.modalBodyClassName}>{children}</ModalDialog.Body>\n {afterBodyNode}\n {footerNode && <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>}\n </ModalDialog>\n );\n}\n\nFullscreenModal.propTypes = {\n /** Specifies contents of the component. */\n children: PropTypes.node.isRequired,\n /** Specifies class name to append to the base element. */\n className: PropTypes.string,\n /** Specifies the aria-label of the dialog. */\n title: PropTypes.string.isRequired,\n /** Specifies a callback to close the modal dialog. */\n onClose: PropTypes.func.isRequired,\n /** Specifies whether the modal is open. */\n isOpen: PropTypes.bool,\n /** Specifies whether the model hase close 'x' icon button in the top right of the dialog box. */\n hasCloseButton: PropTypes.bool,\n /** Specifies size of the dialog box. */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** Specifies visual style of the dialog box. */\n variant: PropTypes.oneOf(['default', 'warning', 'danger', 'success', 'dark']),\n /** The label supplied to the close icon button if one is rendered */\n closeLabel: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies footer for the dialog box. */\n footerNode: PropTypes.node,\n /** Specifies content that should be rendered before modal's body. */\n beforeBodyNode: PropTypes.node,\n /** Specifies content that should be rendered after modal's body. */\n afterBodyNode: PropTypes.node,\n /** Specifies class name for modal's body component. */\n modalBodyClassName: PropTypes.string,\n};\n\nFullscreenModal.defaultProps = {\n isOpen: false,\n hasCloseButton: true,\n size: 'fullscreen',\n variant: 'dark',\n closeLabel: FULLSCREEN_MODAL_CLOSE_LABEL,\n className: undefined,\n isFullscreenScroll: false,\n footerNode: null,\n beforeBodyNode: null,\n afterBodyNode: null,\n modalBodyClassName: '',\n};\n\nexport default FullscreenModal;\n"],"mappings":";;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,WAAW,MAAM,eAAe;AAEvC,OAAO,IAAMC,4BAA4B,GAAG,OAAO;AAEnD,SAASC,eAAeA,CAAAC,IAAA,EAMrB;EAAA,IALDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,UAAU,GAAAF,IAAA,CAAVE,UAAU;IACVC,cAAc,GAAAH,IAAA,CAAdG,cAAc;IACdC,aAAa,GAAAJ,IAAA,CAAbI,aAAa;IACVC,KAAK,GAAAC,wBAAA,CAAAN,IAAA,EAAAO,SAAA;EAER,oBACEZ,KAAA,CAAAa,aAAA,CAACX,WAAW,EAAKQ,KAAK,eACpBV,KAAA,CAAAa,aAAA,CAACX,WAAW,CAACY,MAAM,qBACjBd,KAAA,CAAAa,aAAA,CAACX,WAAW,CAACa,KAAK,QAAEL,KAAK,CAACM,KAAyB,CACjC,CAAC,EACpBR,cAAc,eACfR,KAAA,CAAAa,aAAA,CAACX,WAAW,CAACe,IAAI;IAACC,SAAS,EAAER,KAAK,CAACS;EAAmB,GAAEb,QAA2B,CAAC,EACnFG,aAAa,EACbF,UAAU,iBAAIP,KAAA,CAAAa,aAAA,CAACX,WAAW,CAACkB,MAAM,QAAEb,UAA+B,CACxD,CAAC;AAElB;AAEAH,eAAe,CAACiB,SAAS,GAAG;EAC1B;EACAf,QAAQ,EAAEL,SAAS,CAACqB,IAAI,CAACC,UAAU;EACnC;EACAL,SAAS,EAAEjB,SAAS,CAACuB,MAAM;EAC3B;EACAR,KAAK,EAAEf,SAAS,CAACuB,MAAM,CAACD,UAAU;EAClC;EACAE,OAAO,EAAExB,SAAS,CAACyB,IAAI,CAACH,UAAU;EAClC;EACAI,MAAM,EAAE1B,SAAS,CAAC2B,IAAI;EACtB;EACAC,cAAc,EAAE5B,SAAS,CAAC2B,IAAI;EAC9B;EACAE,IAAI,EAAE7B,SAAS,CAAC8B,KAAK,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC;EAC7D;EACAC,OAAO,EAAE/B,SAAS,CAAC8B,KAAK,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;EAC7E;EACAE,UAAU,EAAEhC,SAAS,CAACuB,MAAM;EAC5B;AACF;AACA;AACA;AACA;EACEU,kBAAkB,EAAEjC,SAAS,CAAC2B,IAAI;EAClC;EACArB,UAAU,EAAEN,SAAS,CAACqB,IAAI;EAC1B;EACAd,cAAc,EAAEP,SAAS,CAACqB,IAAI;EAC9B;EACAb,aAAa,EAAER,SAAS,CAACqB,IAAI;EAC7B;EACAH,kBAAkB,EAAElB,SAAS,CAACuB;AAChC,CAAC;AAEDpB,eAAe,CAAC+B,YAAY,GAAG;EAC7BR,MAAM,EAAE,KAAK;EACbE,cAAc,EAAE,IAAI;EACpBC,IAAI,EAAE,YAAY;EAClBE,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE9B,4BAA4B;EACxCe,SAAS,EAAEkB,SAAS;EACpBF,kBAAkB,EAAE,KAAK;EACzB3B,UAAU,EAAE,IAAI;EAChBC,cAAc,EAAE,IAAI;EACpBC,aAAa,EAAE,IAAI;EACnBU,kBAAkB,EAAE;AACtB,CAAC;AAED,eAAef,eAAe"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
var _excluded = ["children", "footerNode", "heroNode", "heroIsDark", "beforeBodyNode", "afterBodyNode"];
|
|
2
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
3
3
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
4
4
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
@@ -7,14 +7,12 @@ import PropTypes from 'prop-types';
|
|
|
7
7
|
import { requiredWhenNot } from '../utils/propTypes';
|
|
8
8
|
import ModalDialog from './ModalDialog';
|
|
9
9
|
function MarketingModal(_ref) {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
afterBodyNode
|
|
17
|
-
} = _ref,
|
|
10
|
+
var children = _ref.children,
|
|
11
|
+
footerNode = _ref.footerNode,
|
|
12
|
+
heroNode = _ref.heroNode,
|
|
13
|
+
heroIsDark = _ref.heroIsDark,
|
|
14
|
+
beforeBodyNode = _ref.beforeBodyNode,
|
|
15
|
+
afterBodyNode = _ref.afterBodyNode,
|
|
18
16
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
19
17
|
return /*#__PURE__*/React.createElement(ModalDialog, _extends({}, props, {
|
|
20
18
|
variant: heroIsDark ? 'dark' : 'default'
|
|
@@ -60,7 +58,7 @@ MarketingModal.defaultProps = {
|
|
|
60
58
|
isOpen: false,
|
|
61
59
|
isBlocking: false,
|
|
62
60
|
hasCloseButton: true,
|
|
63
|
-
onClose: ()
|
|
61
|
+
onClose: function onClose() {},
|
|
64
62
|
size: 'md',
|
|
65
63
|
closeLabel: 'Close',
|
|
66
64
|
className: undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MarketingModal.js","names":["React","PropTypes","requiredWhenNot","ModalDialog","MarketingModal","_ref","children","footerNode","heroNode","heroIsDark","beforeBodyNode","afterBodyNode","props","_objectWithoutProperties","_excluded","createElement","_extends","variant","Body","Footer","propTypes","node","isRequired","title","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","closeLabel","className","isFullscreenScroll","defaultProps","undefined"],"sources":["../../src/Modal/MarketingModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport ModalDialog from './ModalDialog';\n\nfunction MarketingModal({\n children,\n footerNode,\n heroNode,\n heroIsDark,\n beforeBodyNode,\n afterBodyNode,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n variant={heroIsDark ? 'dark' : 'default'}\n >\n {heroNode}\n {beforeBodyNode}\n <ModalDialog.Body>{children}</ModalDialog.Body>\n {afterBodyNode}\n {footerNode && (\n <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>\n )}\n </ModalDialog>\n );\n}\n\nMarketingModal.propTypes = {\n /** Specifies the content of the modal */\n children: PropTypes.node.isRequired,\n /** Title of the modal */\n title: PropTypes.string.isRequired,\n /** Is the modal dialog open or closed */\n isOpen: PropTypes.bool,\n /** Prevent clicking on the backdrop to close the modal */\n isBlocking: PropTypes.bool,\n /** The close 'x' icon button in the top right corner */\n hasCloseButton: PropTypes.bool,\n /** Callback function for when the modal is dismissed */\n onClose: requiredWhenNot(PropTypes.func, 'isBlocking'),\n /** Size of the modal window */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** Specifies the ``aria-label`` attribute for the close button */\n closeLabel: PropTypes.string,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies what should be displayed in the footer of the nodal */\n footerNode: PropTypes.node,\n /** Enables dark theme for the modal */\n heroIsDark: PropTypes.bool,\n /** Specifies what should be displayed in the header of the modal */\n heroNode: PropTypes.node,\n /** Specifies what should be displayed before the body block */\n beforeBodyNode: PropTypes.node,\n /** Specifies what should be displayed after the body block */\n afterBodyNode: PropTypes.node,\n};\n\nMarketingModal.defaultProps = {\n isOpen: false,\n isBlocking: false,\n hasCloseButton: true,\n onClose: () => {},\n size: 'md',\n closeLabel: 'Close',\n className: undefined,\n isFullscreenScroll: true,\n footerNode: null,\n heroIsDark: true,\n heroNode: null,\n beforeBodyNode: null,\n afterBodyNode: null,\n};\n\nexport default MarketingModal;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,WAAW,MAAM,eAAe;AAEvC,SAASC,cAAcA,CAAAC,IAAA,EAQpB;EAAA,
|
|
1
|
+
{"version":3,"file":"MarketingModal.js","names":["React","PropTypes","requiredWhenNot","ModalDialog","MarketingModal","_ref","children","footerNode","heroNode","heroIsDark","beforeBodyNode","afterBodyNode","props","_objectWithoutProperties","_excluded","createElement","_extends","variant","Body","Footer","propTypes","node","isRequired","title","string","isOpen","bool","isBlocking","hasCloseButton","onClose","func","size","oneOf","closeLabel","className","isFullscreenScroll","defaultProps","undefined"],"sources":["../../src/Modal/MarketingModal.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { requiredWhenNot } from '../utils/propTypes';\nimport ModalDialog from './ModalDialog';\n\nfunction MarketingModal({\n children,\n footerNode,\n heroNode,\n heroIsDark,\n beforeBodyNode,\n afterBodyNode,\n ...props\n}) {\n return (\n <ModalDialog\n {...props}\n variant={heroIsDark ? 'dark' : 'default'}\n >\n {heroNode}\n {beforeBodyNode}\n <ModalDialog.Body>{children}</ModalDialog.Body>\n {afterBodyNode}\n {footerNode && (\n <ModalDialog.Footer>{footerNode}</ModalDialog.Footer>\n )}\n </ModalDialog>\n );\n}\n\nMarketingModal.propTypes = {\n /** Specifies the content of the modal */\n children: PropTypes.node.isRequired,\n /** Title of the modal */\n title: PropTypes.string.isRequired,\n /** Is the modal dialog open or closed */\n isOpen: PropTypes.bool,\n /** Prevent clicking on the backdrop to close the modal */\n isBlocking: PropTypes.bool,\n /** The close 'x' icon button in the top right corner */\n hasCloseButton: PropTypes.bool,\n /** Callback function for when the modal is dismissed */\n onClose: requiredWhenNot(PropTypes.func, 'isBlocking'),\n /** Size of the modal window */\n size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', 'fullscreen']),\n /** Specifies the ``aria-label`` attribute for the close button */\n closeLabel: PropTypes.string,\n /** Specifies class name to append to the base element */\n className: PropTypes.string,\n /**\n * Determines where a scrollbar should appear if a modal is too large for the\n * viewport. When false, the ModalDialog.Body receives a scrollbar, when true\n * the browser window itself receives the scrollbar.\n */\n isFullscreenScroll: PropTypes.bool,\n /** Specifies what should be displayed in the footer of the nodal */\n footerNode: PropTypes.node,\n /** Enables dark theme for the modal */\n heroIsDark: PropTypes.bool,\n /** Specifies what should be displayed in the header of the modal */\n heroNode: PropTypes.node,\n /** Specifies what should be displayed before the body block */\n beforeBodyNode: PropTypes.node,\n /** Specifies what should be displayed after the body block */\n afterBodyNode: PropTypes.node,\n};\n\nMarketingModal.defaultProps = {\n isOpen: false,\n isBlocking: false,\n hasCloseButton: true,\n onClose: () => {},\n size: 'md',\n closeLabel: 'Close',\n className: undefined,\n isFullscreenScroll: true,\n footerNode: null,\n heroIsDark: true,\n heroNode: null,\n beforeBodyNode: null,\n afterBodyNode: null,\n};\n\nexport default MarketingModal;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,SAAS,MAAM,YAAY;AAElC,SAASC,eAAe,QAAQ,oBAAoB;AACpD,OAAOC,WAAW,MAAM,eAAe;AAEvC,SAASC,cAAcA,CAAAC,IAAA,EAQpB;EAAA,IAPDC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRC,UAAU,GAAAF,IAAA,CAAVE,UAAU;IACVC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,UAAU,GAAAJ,IAAA,CAAVI,UAAU;IACVC,cAAc,GAAAL,IAAA,CAAdK,cAAc;IACdC,aAAa,GAAAN,IAAA,CAAbM,aAAa;IACVC,KAAK,GAAAC,wBAAA,CAAAR,IAAA,EAAAS,SAAA;EAER,oBACEd,KAAA,CAAAe,aAAA,CAACZ,WAAW,EAAAa,QAAA,KACNJ,KAAK;IACTK,OAAO,EAAER,UAAU,GAAG,MAAM,GAAG;EAAU,IAExCD,QAAQ,EACRE,cAAc,eACfV,KAAA,CAAAe,aAAA,CAACZ,WAAW,CAACe,IAAI,QAAEZ,QAA2B,CAAC,EAC9CK,aAAa,EACbJ,UAAU,iBACXP,KAAA,CAAAe,aAAA,CAACZ,WAAW,CAACgB,MAAM,QAAEZ,UAA+B,CAEzC,CAAC;AAElB;AAEAH,cAAc,CAACgB,SAAS,GAAG;EACzB;EACAd,QAAQ,EAAEL,SAAS,CAACoB,IAAI,CAACC,UAAU;EACnC;EACAC,KAAK,EAAEtB,SAAS,CAACuB,MAAM,CAACF,UAAU;EAClC;EACAG,MAAM,EAAExB,SAAS,CAACyB,IAAI;EACtB;EACAC,UAAU,EAAE1B,SAAS,CAACyB,IAAI;EAC1B;EACAE,cAAc,EAAE3B,SAAS,CAACyB,IAAI;EAC9B;EACAG,OAAO,EAAE3B,eAAe,CAACD,SAAS,CAAC6B,IAAI,EAAE,YAAY,CAAC;EACtD;EACAC,IAAI,EAAE9B,SAAS,CAAC+B,KAAK,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC;EAC7D;EACAC,UAAU,EAAEhC,SAAS,CAACuB,MAAM;EAC5B;EACAU,SAAS,EAAEjC,SAAS,CAACuB,MAAM;EAC3B;AACF;AACA;AACA;AACA;EACEW,kBAAkB,EAAElC,SAAS,CAACyB,IAAI;EAClC;EACAnB,UAAU,EAAEN,SAAS,CAACoB,IAAI;EAC1B;EACAZ,UAAU,EAAER,SAAS,CAACyB,IAAI;EAC1B;EACAlB,QAAQ,EAAEP,SAAS,CAACoB,IAAI;EACxB;EACAX,cAAc,EAAET,SAAS,CAACoB,IAAI;EAC9B;EACAV,aAAa,EAAEV,SAAS,CAACoB;AAC3B,CAAC;AAEDjB,cAAc,CAACgC,YAAY,GAAG;EAC5BX,MAAM,EAAE,KAAK;EACbE,UAAU,EAAE,KAAK;EACjBC,cAAc,EAAE,IAAI;EACpBC,OAAO,EAAE,SAAAA,QAAA,EAAM,CAAC,CAAC;EACjBE,IAAI,EAAE,IAAI;EACVE,UAAU,EAAE,OAAO;EACnBC,SAAS,EAAEG,SAAS;EACpBF,kBAAkB,EAAE,IAAI;EACxB5B,UAAU,EAAE,IAAI;EAChBE,UAAU,EAAE,IAAI;EAChBD,QAAQ,EAAE,IAAI;EACdE,cAAc,EAAE,IAAI;EACpBC,aAAa,EAAE;AACjB,CAAC;AAED,eAAeP,cAAc"}
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
2
|
+
var _excluded = ["as", "children"];
|
|
2
3
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
4
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
5
|
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return
|
|
6
|
-
function _toPrimitive(input, hint) { if (
|
|
6
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
7
|
+
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
8
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
8
9
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
9
10
|
import React, { useContext } from 'react';
|
|
@@ -11,25 +12,22 @@ import PropTypes from 'prop-types';
|
|
|
11
12
|
import classNames from 'classnames';
|
|
12
13
|
import ModalContext from './ModalContext';
|
|
13
14
|
import Button from '../Button';
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
children
|
|
18
|
-
} = _ref,
|
|
15
|
+
var ModalCloseButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
16
|
+
var as = _ref.as,
|
|
17
|
+
children = _ref.children,
|
|
19
18
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
20
|
-
|
|
21
|
-
onClose
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
const componentProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
19
|
+
var _useContext = useContext(ModalContext),
|
|
20
|
+
onClose = _useContext.onClose;
|
|
21
|
+
var type = as;
|
|
22
|
+
var componentProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
25
23
|
className: classNames('pgn__modal-close-button', props.className),
|
|
26
|
-
onClick: ()
|
|
24
|
+
onClick: function onClick() {
|
|
27
25
|
onClose();
|
|
28
26
|
if (props.onClick) {
|
|
29
27
|
props.onClick();
|
|
30
28
|
}
|
|
31
29
|
},
|
|
32
|
-
ref
|
|
30
|
+
ref: ref
|
|
33
31
|
});
|
|
34
32
|
|
|
35
33
|
// Use the non-jsx syntax to create this element so we can more
|