@openedx/paragon 22.6.0 → 23.0.0-alpha.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/README.md +61 -21
- package/bin/paragon-scripts.js +128 -9
- package/dist/ActionRow/_index.scss +2 -4
- package/dist/Alert/index.scss +41 -32
- package/dist/Annotation/_mixins.scss +104 -0
- package/dist/Annotation/index.scss +130 -103
- package/dist/Avatar/index.scss +18 -20
- package/dist/AvatarButton/index.scss +3 -5
- package/dist/Badge/index.scss +112 -2
- package/dist/Breadcrumb/index.scss +14 -16
- package/dist/Bubble/index.scss +25 -12
- package/dist/Button/_mixins.scss +14 -0
- package/dist/Button/button-group.scss +126 -0
- package/dist/Button/index.js +15 -40
- package/dist/Button/index.js.map +1 -1
- package/dist/Button/index.scss +855 -372
- package/dist/Card/card-bootstrap.scss +168 -0
- package/dist/Card/index.scss +78 -79
- package/dist/Carousel/index.scss +168 -2
- package/dist/Chip/ChipIcon.d.ts +2 -2
- package/dist/Chip/ChipIcon.js.map +1 -1
- package/dist/Chip/index.d.ts +2 -2
- package/dist/Chip/index.js +2 -2
- package/dist/Chip/index.js.map +1 -1
- package/dist/Chip/index.scss +48 -38
- package/dist/Chip/mixins.scss +8 -3
- package/dist/ChipCarousel/index.scss +4 -4
- package/dist/CloseButton/index.scss +31 -2
- package/dist/Code/index.scss +47 -2
- package/dist/Collapsible/index.scss +15 -15
- package/dist/ColorPicker/index.scss +9 -11
- package/dist/DataTable/CollapsibleButtonGroup.js +2 -2
- package/dist/DataTable/CollapsibleButtonGroup.js.map +1 -1
- package/dist/DataTable/index.scss +48 -50
- package/dist/Dropdown/dropdown-bootstrap.scss +181 -0
- package/dist/Dropdown/index.js +0 -2
- package/dist/Dropdown/index.js.map +1 -1
- package/dist/Dropdown/index.scss +11 -12
- package/dist/Dropzone/index.scss +12 -14
- package/dist/Form/_FormText.scss +8 -8
- package/dist/Form/_bootstrap-custom-forms.scss +551 -0
- package/dist/Form/_bootstrap-forms.scss +381 -0
- package/dist/Form/_index.scss +168 -146
- package/dist/Form/_input-group.scss +188 -0
- package/dist/Form/_mixins.scss +216 -3
- package/dist/Hyperlink/index.js +32 -20
- package/dist/Hyperlink/index.js.map +1 -1
- package/dist/Hyperlink/index.scss +1 -1
- package/dist/Icon/index.d.ts +2 -4
- package/dist/Icon/index.js +1 -1
- package/dist/Icon/index.js.map +1 -1
- package/dist/Icon/index.scss +10 -12
- package/dist/IconButton/_mixins.scss +4 -0
- package/dist/IconButton/index.js +5 -11
- package/dist/IconButton/index.js.map +1 -1
- package/dist/IconButton/index.scss +387 -74
- package/dist/IconButtonToggle/index.scss +1 -1
- package/dist/Image/index.scss +53 -2
- package/dist/Menu/index.scss +25 -27
- package/dist/Modal/_ModalDialog.scss +52 -54
- package/dist/Modal/index.scss +6 -73
- package/dist/Nav/_mixins.scss +4 -4
- package/dist/Nav/index.scss +70 -66
- package/dist/Navbar/index.scss +276 -2
- package/dist/OverflowScroll/data/useOverflowScrollElementAttributes.js +3 -3
- package/dist/Overlay/index.js +2 -3
- package/dist/Overlay/index.js.map +1 -1
- package/dist/PageBanner/index.scss +17 -21
- package/dist/Pagination/index.scss +32 -34
- package/dist/Pagination/pagination-bootstrap.scss +83 -0
- package/dist/Popover/index.scss +9 -10
- package/dist/Popover/popover-bootstrap.scss +198 -0
- package/dist/ProductTour/Checkpoint.scss +71 -43
- package/dist/ProgressBar/_mixins.scss +22 -0
- package/dist/ProgressBar/bootstrap-progress.scss +49 -0
- package/dist/ProgressBar/index.scss +28 -36
- package/dist/Scrollable/index.scss +2 -2
- package/dist/SearchField/SearchFieldInput.js +2 -2
- package/dist/SearchField/SearchFieldInput.js.map +1 -1
- package/dist/SearchField/index.scss +15 -17
- package/dist/SelectableBox/index.scss +11 -13
- package/dist/Sheet/index.scss +10 -10
- package/dist/Spinner/index.scss +57 -2
- package/dist/Stack/index.scss +1 -3
- package/dist/Stepper/index.scss +20 -20
- package/dist/Sticky/index.scss +4 -6
- package/dist/Tabs/index.js +0 -2
- package/dist/Tabs/index.js.map +1 -1
- package/dist/Tabs/index.scss +29 -25
- package/dist/Toast/ToastContainer.scss +9 -11
- package/dist/Toast/bootstrap-toast.scss +46 -0
- package/dist/Toast/index.scss +9 -10
- package/dist/Tooltip/index.scss +136 -10
- package/dist/ValidationMessage/index.scss +1 -1
- package/dist/core.css +16777 -0
- package/dist/core.css.map +1 -0
- package/dist/core.min.css +2 -0
- package/dist/index.d.ts +2 -2
- package/dist/index.js +4 -18
- package/dist/index.scss +0 -4
- package/dist/light.css +4098 -0
- package/dist/light.css.map +1 -0
- package/dist/light.min.css +2 -0
- package/dist/theme-urls.json +21 -0
- package/dist/utils/breakpoints.js +1 -1
- package/lib/build-scss.js +188 -0
- package/lib/build-tokens.js +133 -0
- package/lib/help.js +36 -23
- package/lib/replace-variables.js +38 -0
- package/lib/utils.js +30 -0
- package/package.json +30 -14
- package/src/ActionRow/_index.scss +2 -4
- package/src/Alert/index.scss +41 -32
- package/src/Annotation/_mixins.scss +104 -0
- package/src/Annotation/index.scss +130 -103
- package/src/Avatar/index.scss +18 -20
- package/src/AvatarButton/index.scss +3 -5
- package/src/Badge/index.scss +112 -2
- package/src/Breadcrumb/index.scss +14 -16
- package/src/Bubble/index.scss +25 -12
- package/src/Button/{Button.test.tsx → Button.test.jsx} +2 -14
- package/src/Button/README.md +0 -84
- package/src/Button/__snapshots__/{Button.test.tsx.snap → Button.test.jsx.snap} +2 -19
- package/src/Button/_mixins.scss +14 -0
- package/src/Button/button-group.scss +126 -0
- package/src/Button/index.jsx +113 -0
- package/src/Button/index.scss +855 -372
- package/src/Card/card-bootstrap.scss +168 -0
- package/src/Card/index.scss +78 -79
- package/src/Carousel/index.scss +168 -2
- package/src/Chip/ChipIcon.tsx +1 -1
- package/src/Chip/index.scss +48 -38
- package/src/Chip/index.tsx +5 -5
- package/src/Chip/mixins.scss +8 -3
- package/src/ChipCarousel/index.scss +4 -4
- package/src/CloseButton/index.scss +31 -2
- package/src/Code/index.scss +47 -2
- package/src/Collapsible/index.scss +15 -15
- package/src/ColorPicker/index.scss +9 -11
- package/src/DataTable/CollapsibleButtonGroup.jsx +2 -2
- package/src/DataTable/index.scss +48 -50
- package/src/Dropdown/README.md +0 -93
- package/src/Dropdown/dropdown-bootstrap.scss +181 -0
- package/src/Dropdown/index.jsx +0 -2
- package/src/Dropdown/index.scss +11 -12
- package/src/Dropzone/index.scss +12 -14
- package/src/Form/_FormText.scss +8 -8
- package/src/Form/_bootstrap-custom-forms.scss +551 -0
- package/src/Form/_bootstrap-forms.scss +381 -0
- package/src/Form/_index.scss +168 -146
- package/src/Form/_input-group.scss +188 -0
- package/src/Form/_mixins.scss +216 -3
- package/src/Hyperlink/{Hyperlink.test.tsx → Hyperlink.test.jsx} +10 -21
- package/src/Hyperlink/{index.tsx → index.jsx} +37 -41
- package/src/Hyperlink/index.scss +1 -1
- package/src/Icon/index.d.ts +2 -4
- package/src/Icon/index.jsx +1 -1
- package/src/Icon/index.scss +10 -12
- package/src/IconButton/README.md +1 -15
- package/src/IconButton/__snapshots__/IconButton.test.jsx.snap +5 -28
- package/src/IconButton/_mixins.scss +4 -0
- package/src/IconButton/index.jsx +6 -13
- package/src/IconButton/index.scss +387 -74
- package/src/IconButtonToggle/index.scss +1 -1
- package/src/Image/index.scss +53 -2
- package/src/Menu/index.scss +25 -27
- package/src/Modal/_ModalDialog.scss +52 -54
- package/src/Modal/index.scss +6 -73
- package/src/Nav/_mixins.scss +4 -4
- package/src/Nav/index.scss +70 -66
- package/src/Navbar/index.scss +276 -2
- package/src/OverflowScroll/data/useOverflowScrollElementAttributes.js +3 -3
- package/src/Overlay/index.jsx +2 -3
- package/src/PageBanner/index.scss +17 -21
- package/src/Pagination/index.scss +32 -34
- package/src/Pagination/pagination-bootstrap.scss +83 -0
- package/src/Popover/index.scss +9 -10
- package/src/Popover/popover-bootstrap.scss +198 -0
- package/src/ProductTour/Checkpoint.scss +71 -43
- package/src/ProgressBar/_mixins.scss +22 -0
- package/src/ProgressBar/bootstrap-progress.scss +49 -0
- package/src/ProgressBar/index.scss +28 -36
- package/src/Scrollable/index.scss +2 -2
- package/src/SearchField/SearchFieldInput.jsx +2 -2
- package/src/SearchField/__snapshots__/SearchField.test.jsx.snap +12 -8
- package/src/SearchField/index.scss +15 -17
- package/src/SelectableBox/index.scss +11 -13
- package/src/Sheet/index.scss +10 -10
- package/src/Spinner/index.scss +57 -2
- package/src/Stack/index.scss +1 -3
- package/src/Stepper/index.scss +20 -20
- package/src/Sticky/index.scss +4 -6
- package/src/Tabs/README.md +1 -23
- package/src/Tabs/index.jsx +0 -3
- package/src/Tabs/index.scss +29 -25
- package/src/Toast/ToastContainer.scss +9 -11
- package/src/Toast/bootstrap-toast.scss +46 -0
- package/src/Toast/index.scss +9 -10
- package/src/Tooltip/index.scss +136 -10
- package/src/TransitionReplace/README.md +4 -4
- package/src/ValidationMessage/index.scss +1 -1
- package/src/index.d.ts +2 -2
- package/src/index.js +4 -18
- package/src/index.scss +0 -4
- package/src/{setupTest.ts → setupTest.js} +0 -7
- package/src/utils/breakpoints.js +1 -1
- package/styles/css/core/custom-media-breakpoints.css +17 -0
- package/styles/css/core/index.css +2 -0
- package/styles/css/core/variables.css +603 -0
- package/styles/css/themes/light/index.css +2 -0
- package/styles/css/themes/light/utility-classes.css +2454 -0
- package/styles/css/themes/light/variables.css +1644 -0
- package/{scss → styles/scss}/core/_functions.scss +1 -1
- package/styles/scss/core/_grid.scss +21 -0
- package/{scss → styles/scss}/core/_utilities.scss +17 -11
- package/styles/scss/core/_variables.scss +868 -0
- package/styles/scss/core/bootstrap-override/_functions.scss +104 -0
- package/styles/scss/core/bootstrap-override/_mixins.scss +4 -0
- package/styles/scss/core/bootstrap-override/_utilities.scss +4 -0
- package/styles/scss/core/bootstrap-override/bootstrap.scss +2 -0
- package/styles/scss/core/bootstrap-override/mixins/_grid-framework.scss +80 -0
- package/styles/scss/core/bootstrap-override/mixins/_grid.scss +69 -0
- package/styles/scss/core/bootstrap-override/mixins/_list-group.scss +22 -0
- package/styles/scss/core/bootstrap-override/utilities/_background.scss +7 -0
- package/styles/scss/core/bootstrap-override/utilities/_borders.scss +67 -0
- package/styles/scss/core/bootstrap-override/utilities/_spacing.scss +70 -0
- package/styles/scss/core/bootstrap-override/utilities/_text.scss +68 -0
- package/styles/scss/core/core.scss +21 -0
- package/{scss → styles/scss}/core/utilities-only.scss +1 -0
- package/tokens/README.md +157 -0
- package/tokens/css-utilities.js +56 -0
- package/tokens/map-scss-to-css.js +24 -0
- package/tokens/replace-variables.js +32 -0
- package/tokens/sass-helpers.js +98 -0
- package/tokens/src/core/alias/size.json +15 -0
- package/tokens/src/core/components/ActionRow.json +10 -0
- package/tokens/src/core/components/Alert.json +30 -0
- package/tokens/src/core/components/Annotation.json +25 -0
- package/tokens/src/core/components/Avatar.json +17 -0
- package/tokens/src/core/components/AvatarButton.json +11 -0
- package/tokens/src/core/components/Badge.json +33 -0
- package/tokens/src/core/components/Breadcrumb.json +23 -0
- package/tokens/src/core/components/Bubble.json +10 -0
- package/tokens/src/core/components/Button/core.json +105 -0
- package/tokens/src/core/components/Card.json +96 -0
- package/tokens/src/core/components/Carousel.json +37 -0
- package/tokens/src/core/components/Chip.json +41 -0
- package/tokens/src/core/components/ChipCarousel.json +15 -0
- package/tokens/src/core/components/CloseButton.json +14 -0
- package/tokens/src/core/components/Code.json +34 -0
- package/tokens/src/core/components/Collapsible.json +29 -0
- package/tokens/src/core/components/ColorPicker.json +8 -0
- package/tokens/src/core/components/Container.json +13 -0
- package/tokens/src/core/components/DataTable.json +27 -0
- package/tokens/src/core/components/Dropdown.json +67 -0
- package/tokens/src/core/components/Dropzone.json +21 -0
- package/tokens/src/core/components/Form/other.json +14 -0
- package/tokens/src/core/components/Form/size.json +229 -0
- package/tokens/src/core/components/Form/spacing.json +155 -0
- package/tokens/src/core/components/Form/transition.json +16 -0
- package/tokens/src/core/components/Form/typography.json +122 -0
- package/tokens/src/core/components/Icon.json +11 -0
- package/tokens/src/core/components/IconButton.json +15 -0
- package/tokens/src/core/components/Image.json +28 -0
- package/tokens/src/core/components/Menu.json +48 -0
- package/tokens/src/core/components/Modal.json +47 -0
- package/tokens/src/core/components/Nav.json +52 -0
- package/tokens/src/core/components/Navbar.json +70 -0
- package/tokens/src/core/components/Pagination.json +66 -0
- package/tokens/src/core/components/Popover.json +48 -0
- package/tokens/src/core/components/ProductTour.json +32 -0
- package/tokens/src/core/components/ProgressBar.json +39 -0
- package/tokens/src/core/components/SearchField.json +23 -0
- package/tokens/src/core/components/SelectableBox.json +9 -0
- package/tokens/src/core/components/Sheet.json +10 -0
- package/tokens/src/core/components/Spinner.json +19 -0
- package/tokens/src/core/components/Stack.json +7 -0
- package/tokens/src/core/components/Stepper.json +42 -0
- package/tokens/src/core/components/Sticky.json +7 -0
- package/tokens/src/core/components/Tab.json +19 -0
- package/tokens/src/core/components/Tabs.json +19 -0
- package/tokens/src/core/components/Toast.json +30 -0
- package/tokens/src/core/components/Tooltip.json +33 -0
- package/tokens/src/core/components/general/caret.json +13 -0
- package/tokens/src/core/components/general/headings.json +16 -0
- package/tokens/src/core/components/general/hr.json +10 -0
- package/tokens/src/core/components/general/input.json +51 -0
- package/tokens/src/core/components/general/link.json +30 -0
- package/tokens/src/core/components/general/list.json +26 -0
- package/tokens/src/core/components/general/text.json +24 -0
- package/tokens/src/core/global/breakpoints.json +12 -0
- package/tokens/src/core/global/display.json +22 -0
- package/tokens/src/core/global/elevation.json +19 -0
- package/tokens/src/core/global/other.json +4 -0
- package/tokens/src/core/global/spacing.json +37 -0
- package/tokens/src/core/global/transition.json +14 -0
- package/tokens/src/core/global/typography.json +91 -0
- package/tokens/src/core/utilities/color.json +12 -0
- package/tokens/src/themes/light/alias/color.json +114 -0
- package/tokens/src/themes/light/components/Alert.json +38 -0
- package/tokens/src/themes/light/components/Annotation.json +29 -0
- package/tokens/src/themes/light/components/Avatar.json +7 -0
- package/tokens/src/themes/light/components/Badge.json +186 -0
- package/tokens/src/themes/light/components/Breadcrumb.json +13 -0
- package/tokens/src/themes/light/components/Bubble.json +18 -0
- package/tokens/src/themes/light/components/Button/brand.json +260 -0
- package/tokens/src/themes/light/components/Button/core.json +24 -0
- package/tokens/src/themes/light/components/Button/danger.json +247 -0
- package/tokens/src/themes/light/components/Button/dark.json +230 -0
- package/tokens/src/themes/light/components/Button/info.json +238 -0
- package/tokens/src/themes/light/components/Button/light.json +236 -0
- package/tokens/src/themes/light/components/Button/primary.json +250 -0
- package/tokens/src/themes/light/components/Button/secondary.json +278 -0
- package/tokens/src/themes/light/components/Button/success.json +253 -0
- package/tokens/src/themes/light/components/Button/tertiary.json +109 -0
- package/tokens/src/themes/light/components/Button/warning.json +276 -0
- package/tokens/src/themes/light/components/Card.json +36 -0
- package/tokens/src/themes/light/components/Carousel.json +45 -0
- package/tokens/src/themes/light/components/Chip.json +50 -0
- package/tokens/src/themes/light/components/CloseButton.json +10 -0
- package/tokens/src/themes/light/components/Code.json +23 -0
- package/tokens/src/themes/light/components/DataTable.json +26 -0
- package/tokens/src/themes/light/components/Dropdown.json +41 -0
- package/tokens/src/themes/light/components/Dropzone.json +23 -0
- package/tokens/src/themes/light/components/Form/color.json +270 -0
- package/tokens/src/themes/light/components/Form/elevation.json +76 -0
- package/tokens/src/themes/light/components/Form/other.json +131 -0
- package/tokens/src/themes/light/components/IconButton.json +451 -0
- package/tokens/src/themes/light/components/Image.json +18 -0
- package/tokens/src/themes/light/components/Menu.json +30 -0
- package/tokens/src/themes/light/components/Modal.json +37 -0
- package/tokens/src/themes/light/components/Nav.json +166 -0
- package/tokens/src/themes/light/components/Navbar.json +136 -0
- package/tokens/src/themes/light/components/OverflowScroll.json +9 -0
- package/tokens/src/themes/light/components/PageBanner.json +24 -0
- package/tokens/src/themes/light/components/Pagination.json +45 -0
- package/tokens/src/themes/light/components/Popover.json +55 -0
- package/tokens/src/themes/light/components/ProductTour.json +35 -0
- package/tokens/src/themes/light/components/ProgressBar.json +20 -0
- package/tokens/src/themes/light/components/Scrollable.json +14 -0
- package/tokens/src/themes/light/components/SearchField.json +25 -0
- package/tokens/src/themes/light/components/Sheet.json +22 -0
- package/tokens/src/themes/light/components/Stepper.json +34 -0
- package/tokens/src/themes/light/components/Sticky.json +18 -0
- package/tokens/src/themes/light/components/Tab.json +62 -0
- package/tokens/src/themes/light/components/Toast.json +33 -0
- package/tokens/src/themes/light/components/Tooltip.json +30 -0
- package/tokens/src/themes/light/components/general/body.json +8 -0
- package/tokens/src/themes/light/components/general/headings.json +7 -0
- package/tokens/src/themes/light/components/general/hr.json +15 -0
- package/tokens/src/themes/light/components/general/input.json +18 -0
- package/tokens/src/themes/light/components/general/link.json +109 -0
- package/tokens/src/themes/light/components/general/list.json +38 -0
- package/tokens/src/themes/light/components/general/text.json +12 -0
- package/tokens/src/themes/light/global/color.json +1661 -0
- package/tokens/src/themes/light/global/elevation.json +201 -0
- package/tokens/src/themes/light/global/other.json +4 -0
- package/tokens/style-dictionary.js +229 -0
- package/tokens/utils.js +210 -0
- package/dist/ActionRow/_variables.scss +0 -2
- package/dist/Alert/_variables.scss +0 -24
- package/dist/Annotation/_variables.scss +0 -18
- package/dist/Avatar/_variables.scss +0 -10
- package/dist/AvatarButton/_variables.scss +0 -3
- package/dist/Badge/_variables.scss +0 -16
- package/dist/Breadcrumb/_variables.scss +0 -27
- package/dist/Bubble/_variables.scss +0 -8
- package/dist/Button/_variables.scss +0 -52
- package/dist/Button/deprecated/index.js +0 -149
- package/dist/Button/deprecated/index.js.map +0 -1
- package/dist/Button/index.d.ts +0 -35
- package/dist/Card/_variables.scss +0 -55
- package/dist/Carousel/_variables.scss +0 -27
- package/dist/CheckBox/index.js +0 -102
- package/dist/CheckBox/index.js.map +0 -1
- package/dist/CheckBoxGroup/index.js +0 -15
- package/dist/CheckBoxGroup/index.js.map +0 -1
- package/dist/Chip/_variables.scss +0 -28
- package/dist/ChipCarousel/_variables.scss +0 -3
- package/dist/CloseButton/_variables.scss +0 -6
- package/dist/Code/_variables.scss +0 -17
- package/dist/Collapsible/_variables.scss +0 -12
- package/dist/ColorPicker/_variables.scss +0 -2
- package/dist/Container/_variables.scss +0 -5
- package/dist/DataTable/_variables.scss +0 -11
- package/dist/Dropdown/_variables.scss +0 -33
- package/dist/Dropdown/deprecated/DropdownButton.js +0 -44
- package/dist/Dropdown/deprecated/DropdownButton.js.map +0 -1
- package/dist/Dropdown/deprecated/DropdownItem.js +0 -33
- package/dist/Dropdown/deprecated/DropdownItem.js.map +0 -1
- package/dist/Dropdown/deprecated/DropdownMenu.js +0 -46
- package/dist/Dropdown/deprecated/DropdownMenu.js.map +0 -1
- package/dist/Dropdown/deprecated/index.js +0 -241
- package/dist/Dropdown/deprecated/index.js.map +0 -1
- package/dist/Dropzone/_variables.scss +0 -9
- package/dist/Fieldset/index.js +0 -117
- package/dist/Fieldset/index.js.map +0 -1
- package/dist/Fieldset/index.scss +0 -12
- package/dist/Form/_variables.scss +0 -267
- package/dist/Hyperlink/index.d.ts +0 -24
- package/dist/Icon/_variables.scss +0 -7
- package/dist/Image/_variables.scss +0 -13
- package/dist/Input/index.js +0 -166
- package/dist/Input/index.js.map +0 -1
- package/dist/InputSelect/index.js +0 -105
- package/dist/InputSelect/index.js.map +0 -1
- package/dist/InputText/index.js +0 -45
- package/dist/InputText/index.js.map +0 -1
- package/dist/ListBox/index.js +0 -148
- package/dist/ListBox/index.js.map +0 -1
- package/dist/ListBoxOption/index.js +0 -94
- package/dist/ListBoxOption/index.js.map +0 -1
- package/dist/Menu/_variables.scss +0 -24
- package/dist/Modal/_variables.scss +0 -50
- package/dist/Modal/index.js +0 -292
- package/dist/Modal/index.js.map +0 -1
- package/dist/Nav/_variables.scss +0 -58
- package/dist/Navbar/_variables.scss +0 -40
- package/dist/OverflowScroll/_variables.scss +0 -5
- package/dist/OverflowScroll/index.scss +0 -1
- package/dist/Pagination/_variables.scss +0 -19
- package/dist/Popover/_variables.scss +0 -36
- package/dist/ProductTour/_variables.scss +0 -15
- package/dist/ProgressBar/_variables.scss +0 -23
- package/dist/RadioButtonGroup/index.js +0 -188
- package/dist/RadioButtonGroup/index.js.map +0 -1
- package/dist/SearchField/_variables.scss +0 -14
- package/dist/SelectableBox/_variables.scss +0 -5
- package/dist/Spinner/_variables.scss +0 -9
- package/dist/Stack/_variables.scss +0 -1
- package/dist/StatusAlert/index.js +0 -168
- package/dist/StatusAlert/index.js.map +0 -1
- package/dist/Stepper/_variables.scss +0 -18
- package/dist/Sticky/_variables.scss +0 -3
- package/dist/Table/_variables.scss +0 -34
- package/dist/Table/index.js +0 -267
- package/dist/Table/index.js.map +0 -1
- package/dist/Table/index.scss +0 -12
- package/dist/Tabs/_variables.scss +0 -24
- package/dist/Tabs/deprecated/Tabs.scss +0 -3
- package/dist/Tabs/deprecated/index.js +0 -123
- package/dist/Tabs/deprecated/index.js.map +0 -1
- package/dist/TextArea/index.js +0 -44
- package/dist/TextArea/index.js.map +0 -1
- package/dist/Toast/_variables.scss +0 -19
- package/dist/Tooltip/_variables.scss +0 -21
- package/dist/ValidationFormGroup/index.js +0 -106
- package/dist/ValidationFormGroup/index.js.map +0 -1
- package/dist/paragon.css +0 -45
- package/dist/setupTest.d.ts +0 -2
- package/dist/setupTest.js.map +0 -1
- package/dist/utils/types/bootstrap.d.ts +0 -39
- package/dist/utils/types/bootstrap.js +0 -2
- package/dist/utils/types/bootstrap.js.map +0 -1
- package/scss/core/_grid.scss +0 -21
- package/scss/core/_variables.scss +0 -875
- package/scss/core/core.scss +0 -21
- package/src/ActionRow/_variables.scss +0 -2
- package/src/Alert/_variables.scss +0 -24
- package/src/Annotation/_variables.scss +0 -18
- package/src/Avatar/_variables.scss +0 -10
- package/src/AvatarButton/_variables.scss +0 -3
- package/src/Badge/_variables.scss +0 -16
- package/src/Breadcrumb/_variables.scss +0 -27
- package/src/Bubble/_variables.scss +0 -8
- package/src/Button/_variables.scss +0 -52
- package/src/Button/deprecated/Button.test.jsx +0 -34
- package/src/Button/deprecated/index.jsx +0 -145
- package/src/Button/index.tsx +0 -159
- package/src/Card/_variables.scss +0 -55
- package/src/Carousel/_variables.scss +0 -27
- package/src/CheckBox/CheckBox.test.jsx +0 -65
- package/src/CheckBox/README.md +0 -93
- package/src/CheckBox/index.jsx +0 -80
- package/src/CheckBoxGroup/CheckBoxGroup.test.jsx +0 -33
- package/src/CheckBoxGroup/README.md +0 -35
- package/src/CheckBoxGroup/index.jsx +0 -19
- package/src/Chip/_variables.scss +0 -28
- package/src/ChipCarousel/_variables.scss +0 -3
- package/src/CloseButton/_variables.scss +0 -6
- package/src/Code/_variables.scss +0 -17
- package/src/Collapsible/_variables.scss +0 -12
- package/src/ColorPicker/_variables.scss +0 -2
- package/src/Container/_variables.scss +0 -5
- package/src/DataTable/_variables.scss +0 -11
- package/src/Dropdown/_variables.scss +0 -33
- package/src/Dropdown/deprecated/Dropdown.test.jsx +0 -238
- package/src/Dropdown/deprecated/DropdownButton.jsx +0 -52
- package/src/Dropdown/deprecated/DropdownItem.jsx +0 -34
- package/src/Dropdown/deprecated/DropdownMenu.jsx +0 -50
- package/src/Dropdown/deprecated/__snapshots__/Dropdown.test.jsx.snap +0 -229
- package/src/Dropdown/deprecated/index.jsx +0 -222
- package/src/Dropzone/_variables.scss +0 -9
- package/src/Fieldset/Fieldset.test.jsx +0 -101
- package/src/Fieldset/README.md +0 -146
- package/src/Fieldset/index.jsx +0 -107
- package/src/Fieldset/index.scss +0 -12
- package/src/Form/_variables.scss +0 -267
- package/src/Icon/_variables.scss +0 -7
- package/src/Image/_variables.scss +0 -13
- package/src/Input/README.md +0 -74
- package/src/Input/__snapshots__/input.test.jsx.snap +0 -53
- package/src/Input/index.jsx +0 -151
- package/src/Input/input.test.jsx +0 -85
- package/src/InputSelect/README.md +0 -136
- package/src/InputSelect/index.jsx +0 -92
- package/src/InputText/InputText.test.jsx +0 -74
- package/src/InputText/README.md +0 -293
- package/src/InputText/index.jsx +0 -49
- package/src/ListBox/ListBox.test.jsx +0 -161
- package/src/ListBox/README.md +0 -185
- package/src/ListBox/index.jsx +0 -115
- package/src/ListBoxOption/ListBoxOption.test.jsx +0 -154
- package/src/ListBoxOption/index.jsx +0 -78
- package/src/Menu/_variables.scss +0 -24
- package/src/Modal/README.md +0 -148
- package/src/Modal/_variables.scss +0 -50
- package/src/Modal/index.jsx +0 -319
- package/src/Modal/tests/Modal.test.jsx +0 -261
- package/src/Nav/_variables.scss +0 -58
- package/src/Navbar/_variables.scss +0 -40
- package/src/OverflowScroll/_variables.scss +0 -5
- package/src/OverflowScroll/index.scss +0 -1
- package/src/Pagination/_variables.scss +0 -19
- package/src/Popover/_variables.scss +0 -36
- package/src/ProductTour/_variables.scss +0 -15
- package/src/ProgressBar/_variables.scss +0 -23
- package/src/RadioButtonGroup/README.md +0 -50
- package/src/RadioButtonGroup/RadioButtonGroup.test.jsx +0 -127
- package/src/RadioButtonGroup/index.jsx +0 -185
- package/src/SearchField/_variables.scss +0 -14
- package/src/SelectableBox/_variables.scss +0 -5
- package/src/Spinner/_variables.scss +0 -9
- package/src/Stack/_variables.scss +0 -1
- package/src/StatusAlert/README.md +0 -149
- package/src/StatusAlert/StatusAlert.test.jsx +0 -150
- package/src/StatusAlert/index.jsx +0 -144
- package/src/Stepper/_variables.scss +0 -18
- package/src/Sticky/_variables.scss +0 -3
- package/src/Table/README.md +0 -506
- package/src/Table/Table.test.jsx +0 -367
- package/src/Table/_variables.scss +0 -34
- package/src/Table/index.jsx +0 -264
- package/src/Table/index.scss +0 -12
- package/src/Tabs/_variables.scss +0 -24
- package/src/Tabs/deprecated/Tabs.scss +0 -3
- package/src/Tabs/deprecated/Tabs.test.jsx +0 -50
- package/src/Tabs/deprecated/index.jsx +0 -117
- package/src/TextArea/README.md +0 -63
- package/src/TextArea/index.jsx +0 -48
- package/src/Toast/_variables.scss +0 -19
- package/src/Tooltip/_variables.scss +0 -21
- package/src/ValidationFormGroup/README.md +0 -116
- package/src/ValidationFormGroup/ValidationFormGroup.test.jsx +0 -146
- package/src/ValidationFormGroup/__snapshots__/ValidationFormGroup.test.jsx.snap +0 -161
- package/src/ValidationFormGroup/index.jsx +0 -114
- package/src/utils/types/bootstrap.test.tsx +0 -86
- package/src/utils/types/bootstrap.ts +0 -43
- /package/src/Button/{ButtonGroup.test.tsx → ButtonGroup.test.jsx} +0 -0
- /package/src/Button/{ButtonToolbar.test.tsx → ButtonToolbar.test.jsx} +0 -0
- /package/src/Button/__snapshots__/{ButtonGroup.test.tsx.snap → ButtonGroup.test.jsx.snap} +0 -0
- /package/src/Button/__snapshots__/{ButtonToolbar.test.tsx.snap → ButtonToolbar.test.jsx.snap} +0 -0
- /package/{scss → styles/scss}/core/_exports.module.scss +0 -0
- /package/{scss → styles/scss}/core/_typography.scss +0 -0
package/dist/Modal/index.js
DELETED
|
@@ -1,292 +0,0 @@
|
|
|
1
|
-
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
|
2
|
-
var _excluded = ["label"];
|
|
3
|
-
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); }
|
|
4
|
-
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; }
|
|
5
|
-
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; }
|
|
6
|
-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
7
|
-
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
|
|
8
|
-
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
9
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
|
10
|
-
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
11
|
-
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
|
12
|
-
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
|
13
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
14
|
-
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
15
|
-
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
16
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
17
|
-
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
18
|
-
import React from 'react';
|
|
19
|
-
import ReactDOM from 'react-dom';
|
|
20
|
-
import classNames from 'classnames';
|
|
21
|
-
import PropTypes from 'prop-types';
|
|
22
|
-
import { FocusOn } from 'react-focus-on';
|
|
23
|
-
import { tabbable } from 'tabbable';
|
|
24
|
-
import { Close } from '../../icons';
|
|
25
|
-
import Button from '../Button';
|
|
26
|
-
import Icon from '../Icon';
|
|
27
|
-
import newId from '../utils/newId';
|
|
28
|
-
import Variant from '../utils/constants';
|
|
29
|
-
var Modal = /*#__PURE__*/function (_React$Component) {
|
|
30
|
-
_inherits(Modal, _React$Component);
|
|
31
|
-
var _super = _createSuper(Modal);
|
|
32
|
-
function Modal(props) {
|
|
33
|
-
var _this;
|
|
34
|
-
_classCallCheck(this, Modal);
|
|
35
|
-
_this = _super.call(this, props);
|
|
36
|
-
_this.close = _this.close.bind(_assertThisInitialized(_this));
|
|
37
|
-
_this.headerId = newId();
|
|
38
|
-
_this.modalBodyRef = /*#__PURE__*/React.createRef();
|
|
39
|
-
if (typeof document !== 'undefined') {
|
|
40
|
-
_this.el = document.createElement('div');
|
|
41
|
-
// Sets true for IE11, false otherwise: https://stackoverflow.com/a/22082397/6620612
|
|
42
|
-
_this.isIE11 = !!global.MSInputMethodContext && !!document.documentMode;
|
|
43
|
-
}
|
|
44
|
-
_this.state = {
|
|
45
|
-
open: props.open
|
|
46
|
-
};
|
|
47
|
-
return _this;
|
|
48
|
-
}
|
|
49
|
-
_createClass(Modal, [{
|
|
50
|
-
key: "componentDidMount",
|
|
51
|
-
value: function componentDidMount() {
|
|
52
|
-
var parentSelector = this.props.parentSelector;
|
|
53
|
-
this.parentElement = document.querySelector(parentSelector);
|
|
54
|
-
if (this.parentElement === null) {
|
|
55
|
-
throw new Error("Modal received invalid parentSelector: ".concat(parentSelector, ", no matching element found"));
|
|
56
|
-
}
|
|
57
|
-
this.parentElement.appendChild(this.el);
|
|
58
|
-
}
|
|
59
|
-
}, {
|
|
60
|
-
key: "componentDidUpdate",
|
|
61
|
-
value: function componentDidUpdate(prevProps, prevState) {
|
|
62
|
-
var open = this.props.open;
|
|
63
|
-
if (open !== prevProps.open || open !== prevState.open) {
|
|
64
|
-
// eslint-disable-next-line react/no-did-update-set-state
|
|
65
|
-
this.setState({
|
|
66
|
-
open: open
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
}, {
|
|
71
|
-
key: "componentWillUnmount",
|
|
72
|
-
value: function componentWillUnmount() {
|
|
73
|
-
if (this.parentElement) {
|
|
74
|
-
ReactDOM.unmountComponentAtNode(this.parentElement);
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
}, {
|
|
78
|
-
key: "getVariantIconClassName",
|
|
79
|
-
value: function getVariantIconClassName() {
|
|
80
|
-
var variant = this.props.variant;
|
|
81
|
-
var variantIconClassName;
|
|
82
|
-
switch (variant.status) {
|
|
83
|
-
case Variant.status.WARNING:
|
|
84
|
-
variantIconClassName = classNames('fa', 'fa-exclamation-triangle', 'fa-3x', "text-".concat(variant.status.toLowerCase()));
|
|
85
|
-
break;
|
|
86
|
-
default:
|
|
87
|
-
break;
|
|
88
|
-
}
|
|
89
|
-
return variantIconClassName;
|
|
90
|
-
}
|
|
91
|
-
}, {
|
|
92
|
-
key: "getVariantGridBody",
|
|
93
|
-
value: function getVariantGridBody(body) {
|
|
94
|
-
var variant = this.props.variant;
|
|
95
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
96
|
-
className: "container-fluid"
|
|
97
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
98
|
-
className: "row"
|
|
99
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
100
|
-
className: "col-md-10"
|
|
101
|
-
}, /*#__PURE__*/React.createElement("div", null, body)), /*#__PURE__*/React.createElement("div", {
|
|
102
|
-
className: "col-md-2",
|
|
103
|
-
"data-testid": "modal-icon"
|
|
104
|
-
}, /*#__PURE__*/React.createElement(Icon, {
|
|
105
|
-
id: newId("Modal-".concat(variant.status)),
|
|
106
|
-
className: this.getVariantIconClassName()
|
|
107
|
-
}))));
|
|
108
|
-
}
|
|
109
|
-
}, {
|
|
110
|
-
key: "getTabbableBodyElements",
|
|
111
|
-
value: function getTabbableBodyElements() {
|
|
112
|
-
var _this$modalBodyRef;
|
|
113
|
-
if ((_this$modalBodyRef = this.modalBodyRef) !== null && _this$modalBodyRef !== void 0 && _this$modalBodyRef.current) {
|
|
114
|
-
return tabbable(this.modalBodyRef.current);
|
|
115
|
-
}
|
|
116
|
-
return [];
|
|
117
|
-
}
|
|
118
|
-
}, {
|
|
119
|
-
key: "isValidVariantStatus",
|
|
120
|
-
value: function isValidVariantStatus() {
|
|
121
|
-
var variant = this.props.variant;
|
|
122
|
-
return Object.values(Variant.status).includes(variant.status);
|
|
123
|
-
}
|
|
124
|
-
}, {
|
|
125
|
-
key: "close",
|
|
126
|
-
value: function close(e) {
|
|
127
|
-
if (e) {
|
|
128
|
-
e.stopPropagation();
|
|
129
|
-
}
|
|
130
|
-
this.setState({
|
|
131
|
-
open: false
|
|
132
|
-
});
|
|
133
|
-
this.props.onClose();
|
|
134
|
-
}
|
|
135
|
-
}, {
|
|
136
|
-
key: "renderButtons",
|
|
137
|
-
value: function renderButtons() {
|
|
138
|
-
return this.props.buttons.map(function (button) {
|
|
139
|
-
// button is either a React component that we want clone or a set of props
|
|
140
|
-
if ( /*#__PURE__*/React.isValidElement(button)) {
|
|
141
|
-
return /*#__PURE__*/React.cloneElement(button, {
|
|
142
|
-
key: button.props.children
|
|
143
|
-
});
|
|
144
|
-
}
|
|
145
|
-
var label = button.label,
|
|
146
|
-
buttonProps = _objectWithoutProperties(button, _excluded);
|
|
147
|
-
return /*#__PURE__*/React.createElement(Button.Deprecated, _extends({}, buttonProps, {
|
|
148
|
-
key: label
|
|
149
|
-
}), label);
|
|
150
|
-
});
|
|
151
|
-
}
|
|
152
|
-
}, {
|
|
153
|
-
key: "renderBody",
|
|
154
|
-
value: function renderBody() {
|
|
155
|
-
var body = this.props.body;
|
|
156
|
-
if (typeof body === 'string') {
|
|
157
|
-
body = /*#__PURE__*/React.createElement("p", null, body);
|
|
158
|
-
}
|
|
159
|
-
if (this.isValidVariantStatus()) {
|
|
160
|
-
body = this.getVariantGridBody(body);
|
|
161
|
-
}
|
|
162
|
-
return body;
|
|
163
|
-
}
|
|
164
|
-
}, {
|
|
165
|
-
key: "renderModal",
|
|
166
|
-
value: function renderModal() {
|
|
167
|
-
var open = this.state.open;
|
|
168
|
-
var _this$props = this.props,
|
|
169
|
-
dialogClassName = _this$props.dialogClassName,
|
|
170
|
-
renderDefaultCloseButton = _this$props.renderDefaultCloseButton,
|
|
171
|
-
renderHeaderCloseButton = _this$props.renderHeaderCloseButton,
|
|
172
|
-
buttons = _this$props.buttons,
|
|
173
|
-
closeText = _this$props.closeText,
|
|
174
|
-
title = _this$props.title;
|
|
175
|
-
var hasTabbableElements = renderDefaultCloseButton || renderHeaderCloseButton || buttons.length > 0 || this.getTabbableBodyElements().length > 0;
|
|
176
|
-
var renderModalFooter = renderDefaultCloseButton || buttons.length > 0;
|
|
177
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
178
|
-
className: classNames({
|
|
179
|
-
'modal-backdrop': open,
|
|
180
|
-
show: open,
|
|
181
|
-
fade: !open
|
|
182
|
-
}),
|
|
183
|
-
role: "presentation",
|
|
184
|
-
"data-testid": "modal-backdrop"
|
|
185
|
-
}), /*#__PURE__*/React.createElement("div", {
|
|
186
|
-
className: classNames('modal', {
|
|
187
|
-
show: open,
|
|
188
|
-
fade: !open,
|
|
189
|
-
'd-block': open,
|
|
190
|
-
'is-ie11': this.isIE11
|
|
191
|
-
}),
|
|
192
|
-
role: "presentation",
|
|
193
|
-
"data-testid": "modal"
|
|
194
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
195
|
-
className: classNames({
|
|
196
|
-
'modal-dialog': open
|
|
197
|
-
}, dialogClassName),
|
|
198
|
-
role: "dialog",
|
|
199
|
-
"aria-modal": true,
|
|
200
|
-
"aria-labelledby": this.headerId
|
|
201
|
-
}, /*#__PURE__*/React.createElement(FocusOn, {
|
|
202
|
-
enabled: open,
|
|
203
|
-
onClickOutside: this.close,
|
|
204
|
-
onEscapeKey: this.close
|
|
205
|
-
}, /*#__PURE__*/React.createElement("div", _extends({
|
|
206
|
-
className: "modal-content",
|
|
207
|
-
"data-testid": "modal-content"
|
|
208
|
-
// if the modal doesn't contain any tabbable elements, make this element programmatically focusable.
|
|
209
|
-
}, !hasTabbableElements ? {
|
|
210
|
-
tabIndex: -1
|
|
211
|
-
} : {}), /*#__PURE__*/React.createElement("div", {
|
|
212
|
-
className: "modal-header"
|
|
213
|
-
}, /*#__PURE__*/React.createElement("h2", {
|
|
214
|
-
className: "modal-title",
|
|
215
|
-
id: this.headerId
|
|
216
|
-
}, title), renderHeaderCloseButton && /*#__PURE__*/React.createElement(Button.Deprecated, {
|
|
217
|
-
className: "p-1",
|
|
218
|
-
onClick: this.close,
|
|
219
|
-
"data-testid": "modal-header-btn"
|
|
220
|
-
}, /*#__PURE__*/React.createElement(Icon, {
|
|
221
|
-
src: Close,
|
|
222
|
-
screenReaderText: closeText
|
|
223
|
-
}))), /*#__PURE__*/React.createElement("div", {
|
|
224
|
-
className: "modal-body",
|
|
225
|
-
ref: this.modalBodyRef,
|
|
226
|
-
"data-testid": "modal-body"
|
|
227
|
-
}, this.renderBody()), renderModalFooter && /*#__PURE__*/React.createElement("div", {
|
|
228
|
-
className: "modal-footer"
|
|
229
|
-
}, renderDefaultCloseButton && /*#__PURE__*/React.createElement(Button, {
|
|
230
|
-
variant: "link",
|
|
231
|
-
onClick: this.close,
|
|
232
|
-
"data-testid": "modal-footer-btn"
|
|
233
|
-
}, closeText), this.renderButtons()))))));
|
|
234
|
-
}
|
|
235
|
-
}, {
|
|
236
|
-
key: "render",
|
|
237
|
-
value: function render() {
|
|
238
|
-
if (!this.el) {
|
|
239
|
-
return null;
|
|
240
|
-
}
|
|
241
|
-
return /*#__PURE__*/ReactDOM.createPortal(this.renderModal(), this.el);
|
|
242
|
-
}
|
|
243
|
-
}]);
|
|
244
|
-
return Modal;
|
|
245
|
-
}(React.Component);
|
|
246
|
-
Modal.propTypes = {
|
|
247
|
-
/** specifies whether the modal renders open or closed on the initial render. It defaults to false. */
|
|
248
|
-
open: PropTypes.bool,
|
|
249
|
-
/** is the selector for an element in the dom which the modal should be rendered under.
|
|
250
|
-
* It uses querySelector to find the first element that matches that selector,
|
|
251
|
-
* and then creates a React portal to a div underneath the parent element.
|
|
252
|
-
*/
|
|
253
|
-
parentSelector: PropTypes.string,
|
|
254
|
-
/** a string or an element that is rendered inside of the modal title, above the modal body. */
|
|
255
|
-
title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
|
|
256
|
-
/** a string or an element that is rendered inside of the modal body, between the title and the footer. */
|
|
257
|
-
body: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,
|
|
258
|
-
/** an array of either elements or shapes that take the form of the buttonPropTypes.
|
|
259
|
-
* See the [buttonPropTypes](https://github.com/openedx/paragon/blob/master/src/Button/index.jsx#L40)
|
|
260
|
-
* for a list of acceptable props to pass as part of a button. */
|
|
261
|
-
buttons: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.element, PropTypes.shape({}) // TODO: Only accept nodes in the future
|
|
262
|
-
])),
|
|
263
|
-
/** specifies the display text of the default Close button. It defaults to "Close". */
|
|
264
|
-
closeText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
|
|
265
|
-
/** a function that is called on close. It can be used to perform actions upon closing of the modal,
|
|
266
|
-
* such as restoring focus to the previous logical focusable element. */
|
|
267
|
-
onClose: PropTypes.func.isRequired,
|
|
268
|
-
variant: PropTypes.shape({
|
|
269
|
-
status: PropTypes.string
|
|
270
|
-
}),
|
|
271
|
-
/** specifies whether the default close button is rendered in the footer. It defaults to true. */
|
|
272
|
-
renderDefaultCloseButton: PropTypes.bool,
|
|
273
|
-
/** specifies whether a close button is rendered in the modal header. It defaults to true. */
|
|
274
|
-
renderHeaderCloseButton: PropTypes.bool,
|
|
275
|
-
/**
|
|
276
|
-
* Specifies optional classes to add to the element with the '.modal-dialog' class.
|
|
277
|
-
* See Bootstrap documentation for possible classes. Some options: modal-lg, modal-sm, modal-dialog-centered
|
|
278
|
-
*/
|
|
279
|
-
dialogClassName: PropTypes.string
|
|
280
|
-
};
|
|
281
|
-
Modal.defaultProps = {
|
|
282
|
-
open: false,
|
|
283
|
-
parentSelector: 'body',
|
|
284
|
-
buttons: [],
|
|
285
|
-
closeText: 'Close',
|
|
286
|
-
variant: {},
|
|
287
|
-
renderDefaultCloseButton: true,
|
|
288
|
-
renderHeaderCloseButton: true,
|
|
289
|
-
dialogClassName: undefined
|
|
290
|
-
};
|
|
291
|
-
export default Modal;
|
|
292
|
-
//# sourceMappingURL=index.js.map
|
package/dist/Modal/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","ReactDOM","classNames","PropTypes","FocusOn","tabbable","Close","Button","Icon","newId","Variant","Modal","_React$Component","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","close","bind","_assertThisInitialized","headerId","modalBodyRef","createRef","document","el","createElement","isIE11","global","MSInputMethodContext","documentMode","state","open","_createClass","key","value","componentDidMount","parentSelector","parentElement","querySelector","Error","concat","appendChild","componentDidUpdate","prevProps","prevState","setState","componentWillUnmount","unmountComponentAtNode","getVariantIconClassName","variant","variantIconClassName","status","WARNING","toLowerCase","getVariantGridBody","body","className","id","getTabbableBodyElements","_this$modalBodyRef","current","isValidVariantStatus","Object","values","includes","e","stopPropagation","onClose","renderButtons","buttons","map","button","isValidElement","cloneElement","children","label","buttonProps","_objectWithoutProperties","_excluded","Deprecated","_extends","renderBody","renderModal","_this$props","dialogClassName","renderDefaultCloseButton","renderHeaderCloseButton","closeText","title","hasTabbableElements","length","renderModalFooter","Fragment","show","fade","role","enabled","onClickOutside","onEscapeKey","tabIndex","onClick","src","screenReaderText","ref","render","createPortal","Component","propTypes","bool","string","oneOfType","element","isRequired","arrayOf","shape","func","defaultProps","undefined"],"sources":["../../src/Modal/index.jsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { FocusOn } from 'react-focus-on';\nimport { tabbable } from 'tabbable';\n\nimport { Close } from '../../icons';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport newId from '../utils/newId';\nimport Variant from '../utils/constants';\n\nclass Modal extends React.Component {\n constructor(props) {\n super(props);\n\n this.close = this.close.bind(this);\n\n this.headerId = newId();\n this.modalBodyRef = React.createRef();\n\n if (typeof document !== 'undefined') {\n this.el = document.createElement('div');\n // Sets true for IE11, false otherwise: https://stackoverflow.com/a/22082397/6620612\n this.isIE11 = !!global.MSInputMethodContext && !!document.documentMode;\n }\n\n this.state = {\n open: props.open,\n };\n }\n\n componentDidMount() {\n const { parentSelector } = this.props;\n this.parentElement = document.querySelector(parentSelector);\n if (this.parentElement === null) {\n throw new Error(`Modal received invalid parentSelector: ${parentSelector}, no matching element found`);\n }\n this.parentElement.appendChild(this.el);\n }\n\n componentDidUpdate(prevProps, prevState) {\n const { open } = this.props;\n if (open !== prevProps.open || open !== prevState.open) {\n // eslint-disable-next-line react/no-did-update-set-state\n this.setState({ open });\n }\n }\n\n componentWillUnmount() {\n if (this.parentElement) {\n ReactDOM.unmountComponentAtNode(this.parentElement);\n }\n }\n\n getVariantIconClassName() {\n const { variant } = this.props;\n let variantIconClassName;\n\n switch (variant.status) {\n case Variant.status.WARNING:\n variantIconClassName = classNames(\n 'fa',\n 'fa-exclamation-triangle',\n 'fa-3x',\n `text-${variant.status.toLowerCase()}`,\n );\n break;\n default:\n break;\n }\n\n return variantIconClassName;\n }\n\n getVariantGridBody(body) {\n const { variant } = this.props;\n\n return (\n <div className=\"container-fluid\">\n <div className=\"row\">\n <div className=\"col-md-10\">\n <div>\n {body}\n </div>\n </div>\n <div className=\"col-md-2\" data-testid=\"modal-icon\">\n <Icon\n id={newId(`Modal-${variant.status}`)}\n className={this.getVariantIconClassName()}\n />\n </div>\n </div>\n </div>\n );\n }\n\n getTabbableBodyElements() {\n if (this.modalBodyRef?.current) {\n return tabbable(this.modalBodyRef.current);\n }\n return [];\n }\n\n isValidVariantStatus() {\n const { variant } = this.props;\n return Object.values(Variant.status).includes(variant.status);\n }\n\n close(e) {\n if (e) {\n e.stopPropagation();\n }\n\n this.setState({ open: false });\n this.props.onClose();\n }\n\n renderButtons() {\n return this.props.buttons.map((button) => {\n // button is either a React component that we want clone or a set of props\n if (React.isValidElement(button)) {\n return React.cloneElement(button, {\n key: button.props.children,\n });\n }\n\n const { label, ...buttonProps } = button;\n\n return (\n <Button.Deprecated\n {...buttonProps}\n key={label}\n >\n {label}\n </Button.Deprecated>\n );\n });\n }\n\n renderBody() {\n let { body } = this.props;\n\n if (typeof body === 'string') {\n body = <p>{body}</p>;\n }\n\n if (this.isValidVariantStatus()) {\n body = this.getVariantGridBody(body);\n }\n\n return body;\n }\n\n renderModal() {\n const { open } = this.state;\n const {\n dialogClassName,\n renderDefaultCloseButton,\n renderHeaderCloseButton,\n buttons,\n closeText,\n title,\n } = this.props;\n\n const hasTabbableElements = (\n renderDefaultCloseButton\n || renderHeaderCloseButton\n || buttons.length > 0\n || this.getTabbableBodyElements().length > 0\n );\n const renderModalFooter = renderDefaultCloseButton || buttons.length > 0;\n\n return (\n <>\n <div\n className={classNames({\n 'modal-backdrop': open,\n show: open,\n fade: !open,\n })}\n role=\"presentation\"\n data-testid=\"modal-backdrop\"\n />\n <div\n className={classNames(\n 'modal',\n {\n show: open,\n fade: !open,\n 'd-block': open,\n 'is-ie11': this.isIE11,\n },\n )}\n role=\"presentation\"\n data-testid=\"modal\"\n >\n <div\n className={classNames(\n {\n 'modal-dialog': open,\n },\n dialogClassName,\n )}\n role=\"dialog\"\n aria-modal\n aria-labelledby={this.headerId}\n >\n <FocusOn\n enabled={open}\n onClickOutside={this.close}\n onEscapeKey={this.close}\n >\n <div\n className=\"modal-content\"\n data-testid=\"modal-content\"\n // if the modal doesn't contain any tabbable elements, make this element programmatically focusable.\n {...(!hasTabbableElements ? { tabIndex: -1 } : {})}\n >\n <div className=\"modal-header\">\n <h2 className=\"modal-title\" id={this.headerId}>{title}</h2>\n {renderHeaderCloseButton && (\n <Button.Deprecated\n className=\"p-1\"\n onClick={this.close}\n data-testid=\"modal-header-btn\"\n >\n <Icon src={Close} screenReaderText={closeText} />\n </Button.Deprecated>\n )}\n </div>\n <div className=\"modal-body\" ref={this.modalBodyRef} data-testid=\"modal-body\">\n {this.renderBody()}\n </div>\n {renderModalFooter && (\n <div className=\"modal-footer\">\n {renderDefaultCloseButton && (\n <Button\n variant=\"link\"\n onClick={this.close}\n data-testid=\"modal-footer-btn\"\n >\n {closeText}\n </Button>\n )}\n {this.renderButtons()}\n </div>\n )}\n </div>\n </FocusOn>\n </div>\n </div>\n </>\n );\n }\n\n render() {\n if (!this.el) {\n return null;\n }\n\n return ReactDOM.createPortal(\n this.renderModal(),\n this.el,\n );\n }\n}\n\nModal.propTypes = {\n /** specifies whether the modal renders open or closed on the initial render. It defaults to false. */\n open: PropTypes.bool,\n /** is the selector for an element in the dom which the modal should be rendered under.\n * It uses querySelector to find the first element that matches that selector,\n * and then creates a React portal to a div underneath the parent element.\n */\n parentSelector: PropTypes.string,\n /** a string or an element that is rendered inside of the modal title, above the modal body. */\n title: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n /** a string or an element that is rendered inside of the modal body, between the title and the footer. */\n body: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n /** an array of either elements or shapes that take the form of the buttonPropTypes.\n * See the [buttonPropTypes](https://github.com/openedx/paragon/blob/master/src/Button/index.jsx#L40)\n * for a list of acceptable props to pass as part of a button. */\n buttons: PropTypes.arrayOf(PropTypes.oneOfType([\n PropTypes.element,\n PropTypes.shape({}), // TODO: Only accept nodes in the future\n ])),\n /** specifies the display text of the default Close button. It defaults to \"Close\". */\n closeText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n /** a function that is called on close. It can be used to perform actions upon closing of the modal,\n * such as restoring focus to the previous logical focusable element. */\n onClose: PropTypes.func.isRequired,\n variant: PropTypes.shape({\n status: PropTypes.string,\n }),\n /** specifies whether the default close button is rendered in the footer. It defaults to true. */\n renderDefaultCloseButton: PropTypes.bool,\n /** specifies whether a close button is rendered in the modal header. It defaults to true. */\n renderHeaderCloseButton: PropTypes.bool,\n /**\n * Specifies optional classes to add to the element with the '.modal-dialog' class.\n * See Bootstrap documentation for possible classes. Some options: modal-lg, modal-sm, modal-dialog-centered\n */\n dialogClassName: PropTypes.string,\n};\n\nModal.defaultProps = {\n open: false,\n parentSelector: 'body',\n buttons: [],\n closeText: 'Close',\n variant: {},\n renderDefaultCloseButton: true,\n renderHeaderCloseButton: true,\n dialogClassName: undefined,\n};\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
|
package/dist/Nav/_variables.scss
DELETED
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
// Navs
|
|
2
|
-
|
|
3
|
-
$nav-link-padding-y: .5rem !default;
|
|
4
|
-
$nav-link-padding-x: 1rem !default;
|
|
5
|
-
$nav-link-color: $gray-700 !default;
|
|
6
|
-
$nav-link-disabled-color: $gray-300 !default;
|
|
7
|
-
$nav-link-font-weight: 500 !default;
|
|
8
|
-
|
|
9
|
-
$nav-tabs-border-color: $light-400 !default;
|
|
10
|
-
$nav-tabs-border-width: 2px !default;
|
|
11
|
-
$nav-tabs-border-radius: 0 !default;
|
|
12
|
-
$nav-tabs-hover-bg: transparent !default;
|
|
13
|
-
$nav-tabs-focus-border-color: $nav-tabs-hover-bg !default;
|
|
14
|
-
$nav-tabs-disabled-bg: $nav-tabs-hover-bg !default;
|
|
15
|
-
$nav-tabs-link-hover-border-color: transparent transparent $nav-tabs-border-color !default;
|
|
16
|
-
$nav-tabs-link-hover-bg: $light-400 !default;
|
|
17
|
-
$nav-tabs-link-active-color: $primary-500 !default;
|
|
18
|
-
$nav-tabs-link-active-border-color: $nav-tabs-link-active-color !default;
|
|
19
|
-
$nav-tabs-link-active-bg: transparent !default;
|
|
20
|
-
$nav-tabs-link-focus-border-color: $nav-tabs-link-active-color !default;
|
|
21
|
-
$nav-tabs-link-distance-to-border: 4px !default;
|
|
22
|
-
$nav-tabs-link-border-color: transparent !default;
|
|
23
|
-
$nav-tabs-link-disabled-border-color: $nav-tabs-link-border-color !default;
|
|
24
|
-
|
|
25
|
-
$nav-pills-border-radius: $border-radius !default;
|
|
26
|
-
$nav-pills-link-active-color: $component-active-color !default;
|
|
27
|
-
$nav-pills-link-active-bg: $component-active-bg !default;
|
|
28
|
-
$nav-pills-link-active-border-color: $white !default;
|
|
29
|
-
$nav-pills-link-border-color: $nav-tabs-border-color !default;
|
|
30
|
-
$nav-pills-link-border-width: 1px !default;
|
|
31
|
-
|
|
32
|
-
$nav-inverse-pills-link-color: $white !default;
|
|
33
|
-
$nav-inverse-pills-link-border-color: $dark-300 !default;
|
|
34
|
-
$nav-inverse-pills-link-hover-bg: $nav-inverse-pills-link-border-color !default;
|
|
35
|
-
$nav-inverse-pills-link-focus-color: $nav-inverse-pills-link-color !default;
|
|
36
|
-
$nav-inverse-pills-link-active-bg: $nav-inverse-pills-link-color !default;
|
|
37
|
-
$nav-inverse-pills-link-active-color: $primary-500 !default;
|
|
38
|
-
$nav-inverse-pills-link-active-border-color: $nav-inverse-pills-link-color !default;
|
|
39
|
-
$nav-inverse-pills-link-active-hover-bg: $nav-inverse-pills-link-border-color !default;
|
|
40
|
-
$nav-inverse-pills-link-active-hover-color: $nav-inverse-pills-link-color !default;
|
|
41
|
-
$nav-inverse-pills-link-active-hover-border-color: $nav-inverse-pills-link-border-color !default;
|
|
42
|
-
$nav-inverse-pills-link-active-focus-hover-bg: $nav-inverse-pills-link-color !default;
|
|
43
|
-
$nav-inverse-pills-link-active-focus-color: $nav-inverse-pills-link-active-color !default;
|
|
44
|
-
$nav-inverse-pills-link-active-focus-border-color: $primary !default;
|
|
45
|
-
$nav-inverse-pills-link-active-focus-hover-border-color: $nav-inverse-pills-link-active-focus-border-color !default;
|
|
46
|
-
$nav-inverse-pills-link-border-width: $nav-pills-link-border-width !default;
|
|
47
|
-
$nav-inverse-pills-tab-content-color: $nav-inverse-pills-link-color !default;
|
|
48
|
-
|
|
49
|
-
$nav-inverse-tabs-link-color: $white !default;
|
|
50
|
-
$nav-inverse-tabs-link-border-bottom-color: $dark-300 !default;
|
|
51
|
-
$nav-inverse-tabs-link-hover-bg: $nav-inverse-tabs-link-border-bottom-color !default;
|
|
52
|
-
$nav-inverse-tabs-link-active-hover-bg: transparent !default;
|
|
53
|
-
$nav-inverse-tabs-link-focus-bg: $nav-inverse-tabs-link-color !default;
|
|
54
|
-
$nav-inverse-tabs-link-active-border-color: $nav-inverse-tabs-link-color !default;
|
|
55
|
-
$nav-inverse-tabs-link-active-bg: $nav-inverse-tabs-link-hover-bg !default;
|
|
56
|
-
$nav-inverse-tabs-link-active-border-bottom-width: $nav-tabs-border-width !default;
|
|
57
|
-
$nav-inverse-tabs-tab-content-color: $nav-inverse-tabs-link-color !default;
|
|
58
|
-
$nav-inverse-tabs-dropdown-border-color: $nav-inverse-tabs-link-active-hover-bg !default;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
// Navbar
|
|
2
|
-
|
|
3
|
-
$navbar-padding-y: calc($spacer / 2) !default;
|
|
4
|
-
$navbar-padding-x: $spacer !default;
|
|
5
|
-
|
|
6
|
-
$navbar-nav-link-padding-x: .5rem !default;
|
|
7
|
-
|
|
8
|
-
$navbar-brand-font-size: $font-size-lg !default;
|
|
9
|
-
|
|
10
|
-
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
|
|
11
|
-
// The default for $nav-link-padding-y is .5rem. Copied here for modularization
|
|
12
|
-
$nav-link-height: $font-size-base * $line-height-base + .5rem * 2 !default;
|
|
13
|
-
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
|
|
14
|
-
$navbar-brand-padding-y: calc(($nav-link-height - $navbar-brand-height) / 2) !default;
|
|
15
|
-
|
|
16
|
-
$navbar-toggler-padding-y: .25rem !default;
|
|
17
|
-
$navbar-toggler-padding-x: .75rem !default;
|
|
18
|
-
$navbar-toggler-font-size: $font-size-lg !default;
|
|
19
|
-
$navbar-toggler-border-radius: $btn-border-radius !default;
|
|
20
|
-
|
|
21
|
-
$navbar-nav-scroll-max-height: 75vh !default;
|
|
22
|
-
|
|
23
|
-
$navbar-dark-color: rgba($white, .5) !default;
|
|
24
|
-
$navbar-dark-hover-color: rgba($white, .75) !default;
|
|
25
|
-
$navbar-dark-active-color: $white !default;
|
|
26
|
-
$navbar-dark-disabled-color: rgba($white, .25) !default;
|
|
27
|
-
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
|
|
28
|
-
$navbar-dark-toggler-border-color: rgba($white, .1) !default;
|
|
29
|
-
|
|
30
|
-
$navbar-light-color: rgba($black, .5) !default;
|
|
31
|
-
$navbar-light-hover-color: rgba($black, .7) !default;
|
|
32
|
-
$navbar-light-active-color: rgba($black, .9) !default;
|
|
33
|
-
$navbar-light-disabled-color: rgba($black, .3) !default;
|
|
34
|
-
$navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"), "#", "%23") !default;
|
|
35
|
-
$navbar-light-toggler-border-color: rgba($black, .1) !default;
|
|
36
|
-
|
|
37
|
-
$navbar-light-brand-color: $navbar-light-active-color !default;
|
|
38
|
-
$navbar-light-brand-hover-color: $navbar-light-active-color !default;
|
|
39
|
-
$navbar-dark-brand-color: $navbar-dark-active-color !default;
|
|
40
|
-
$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
@import "variables";
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
// Pagination
|
|
2
|
-
|
|
3
|
-
$pagination-padding-y: .625rem !default;
|
|
4
|
-
$pagination-margin-x: .5rem !default;
|
|
5
|
-
$pagination-line-height: 1.5rem !default;
|
|
6
|
-
$pagination-font-size-sm: .875rem !default;
|
|
7
|
-
|
|
8
|
-
$pagination-icon-width: 2.25rem !default;
|
|
9
|
-
$pagination-icon-height: 2.25rem !default;
|
|
10
|
-
$pagination-toggle-border: .3125rem !default;
|
|
11
|
-
$pagination-toggle-border-sm: .25rem !default;
|
|
12
|
-
$pagination-secondary-height: 2.75rem !default;
|
|
13
|
-
$pagination-secondary-height-sm: 2.25rem !default;
|
|
14
|
-
|
|
15
|
-
$pagination-dropdown-color-inverse: $white !default;
|
|
16
|
-
$pagination-border-width: $border-width !default;
|
|
17
|
-
|
|
18
|
-
$pagination-reduced-dropdown-max-height: 60vh !default;
|
|
19
|
-
$pagination-reduced-dropdown-min-width: 6rem !default;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
// Popovers
|
|
2
|
-
|
|
3
|
-
$popover-font-size: $font-size-sm !default;
|
|
4
|
-
$popover-bg: $white !default;
|
|
5
|
-
$popover-max-width: 480px !default;
|
|
6
|
-
$popover-border-width: $border-width !default;
|
|
7
|
-
$popover-border-color: rgba($black, .2) !default;
|
|
8
|
-
$popover-border-radius: $border-radius-sm !default;
|
|
9
|
-
$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;
|
|
10
|
-
$popover-box-shadow: drop-shadow(0 2px 4px rgba(0, 0, 0, .15))
|
|
11
|
-
drop-shadow(0 2px 8px rgba(0, 0, 0, .15)) !default;
|
|
12
|
-
$popover-icon-margin-right: .5rem;
|
|
13
|
-
$popover-icon-height: 1rem;
|
|
14
|
-
$popover-icon-width: 1rem;
|
|
15
|
-
|
|
16
|
-
$popover-header-bg: $white !default;
|
|
17
|
-
$popover-header-color: $headings-color !default;
|
|
18
|
-
$popover-header-padding-y: .5rem !default;
|
|
19
|
-
$popover-header-padding-x: 1rem !default;
|
|
20
|
-
|
|
21
|
-
$popover-body-color: $body-color !default;
|
|
22
|
-
$popover-body-padding-y: $popover-header-padding-y !default;
|
|
23
|
-
$popover-body-padding-x: $popover-header-padding-x !default;
|
|
24
|
-
|
|
25
|
-
$popover-arrow-width: 1rem !default;
|
|
26
|
-
$popover-arrow-height: .5rem !default;
|
|
27
|
-
$popover-arrow-color: $popover-bg !default;
|
|
28
|
-
|
|
29
|
-
$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
|
|
30
|
-
|
|
31
|
-
$popover-success-bg: $success-100 !default;
|
|
32
|
-
$popover-success-icon-color: $success-500 !default;
|
|
33
|
-
$popover-warning-bg: $warning-100 !default;
|
|
34
|
-
$popover-warning-icon-color: $warning-500 !default;
|
|
35
|
-
$popover-danger-bg: $danger-100 !default;
|
|
36
|
-
$popover-danger-icon-color: $danger-500 !default;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
// Checkpoints
|
|
2
|
-
|
|
3
|
-
$checkpoint-background-color: $light-300 !default;
|
|
4
|
-
|
|
5
|
-
$checkpoint-body-color: $gray-700;
|
|
6
|
-
|
|
7
|
-
$checkpoint-border-color: $brand !default;
|
|
8
|
-
$checkpoint-border-width: 8px !default;
|
|
9
|
-
|
|
10
|
-
$checkpoint-breadcrumb-color: $primary !default;
|
|
11
|
-
|
|
12
|
-
$checkpoint-arrow-width: 15px !default;
|
|
13
|
-
$checkpoint-max-width: 480px !default;
|
|
14
|
-
|
|
15
|
-
$checkpoint-z-index: 1060 !default;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
// Progress bars
|
|
2
|
-
|
|
3
|
-
$progress-height: 1rem !default;
|
|
4
|
-
$annotated-progress-height: .3125rem !default;
|
|
5
|
-
$progress-font-size: $font-size-base * .75 !default;
|
|
6
|
-
$progress-bg: transparent !default;
|
|
7
|
-
$progress-border-radius: 0 !default;
|
|
8
|
-
$progress-box-shadow: none !default;
|
|
9
|
-
$progress-bar-color: $white !default;
|
|
10
|
-
$progress-bar-bg: theme-color("accent-a") !default;
|
|
11
|
-
$annotated-progress-bar-bg: theme-color("dark") !default;
|
|
12
|
-
$progress-bar-animation-timing: 1s linear infinite !default;
|
|
13
|
-
$progress-bar-transition: width .6s ease !default;
|
|
14
|
-
$progress-bar-border-width: 1px !default;
|
|
15
|
-
$progress-bar-border-color: $gray-500 !default;
|
|
16
|
-
$progress-threshold-circle: .5625rem !default;
|
|
17
|
-
$progress-hint-annotation-gap: .5rem !default;
|
|
18
|
-
$progress-colors: (
|
|
19
|
-
"dark": $primary-500,
|
|
20
|
-
"success": $success-500,
|
|
21
|
-
"error": $danger-500,
|
|
22
|
-
"warning": $accent-b,
|
|
23
|
-
) !default;
|