@primer/components 0.0.0-202110303104 → 0.0.0-2021103082237
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +90 -4
- package/dist/browser.esm.js +738 -779
- package/dist/browser.esm.js.map +1 -1
- package/dist/browser.umd.js +736 -777
- package/dist/browser.umd.js.map +1 -1
- package/lib/ActionList/Item.js +27 -52
- package/lib/ActionList/index.js +23 -12
- package/lib/ActionList2/Group.d.ts +28 -2
- package/lib/ActionList2/Group.js +55 -6
- package/lib/ActionList2/List.d.ts +1 -1
- package/lib/ActionList2/List.js +1 -2
- package/lib/ActionList2/index.js +41 -23
- package/lib/AnchoredOverlay/index.js +12 -4
- package/lib/Autocomplete/Autocomplete.d.ts +11 -3
- package/lib/Autocomplete/AutocompleteInput.d.ts +11 -3
- package/lib/Autocomplete/index.js +14 -7
- package/lib/Breadcrumbs.d.ts +8 -7
- package/lib/Breadcrumbs.js +7 -12
- package/lib/Button/Button.d.ts +2 -3
- package/lib/Button/Button.js +2 -6
- package/lib/Button/ButtonBase.d.ts +5 -8
- package/lib/Button/ButtonBase.js +1 -5
- package/lib/Button/ButtonClose.d.ts +3 -46
- package/lib/Button/ButtonClose.js +1 -1
- package/lib/Button/ButtonDanger.d.ts +2 -3
- package/lib/Button/ButtonDanger.js +2 -6
- package/lib/Button/ButtonInvisible.d.ts +2 -3
- package/lib/Button/ButtonInvisible.js +2 -6
- package/lib/Button/ButtonOutline.d.ts +2 -3
- package/lib/Button/ButtonOutline.js +2 -6
- package/lib/Button/ButtonPrimary.d.ts +2 -3
- package/lib/Button/ButtonPrimary.js +2 -6
- package/lib/Button/ButtonTableList.d.ts +1 -2
- package/lib/Button/ButtonTableList.js +1 -1
- package/lib/Button/index.js +70 -21
- package/lib/Checkbox.d.ts +29 -0
- package/lib/Checkbox.js +64 -0
- package/lib/CircleBadge.d.ts +4 -5
- package/lib/CircleBadge.js +1 -1
- package/lib/CircleOcticon.d.ts +1 -1
- package/lib/CounterLabel.d.ts +1 -2
- package/lib/CounterLabel.js +1 -1
- package/lib/Dialog/Dialog.d.ts +5 -9
- package/lib/Dialog/Dialog.js +17 -11
- package/lib/Dialog.d.ts +4 -5
- package/lib/Dialog.js +1 -1
- package/lib/Dropdown.d.ts +10 -99
- package/lib/Dropdown.js +3 -3
- package/lib/DropdownMenu/DropdownButton.d.ts +3 -47
- package/lib/DropdownMenu/DropdownButton.js +3 -1
- package/lib/DropdownMenu/index.js +20 -6
- package/lib/DropdownStyles.js +26 -18
- package/lib/FilterList.d.ts +264 -303
- package/lib/FilterList.js +2 -6
- package/lib/FilteredActionList/index.js +12 -4
- package/lib/FilteredSearch.d.ts +1 -2
- package/lib/FilteredSearch.js +1 -1
- package/lib/Flash.d.ts +1 -2
- package/lib/Flash.js +1 -1
- package/lib/FormGroup.d.ts +4 -5
- package/lib/FormGroup.js +2 -2
- package/lib/Header.d.ts +6 -7
- package/lib/Header.js +4 -4
- package/lib/Label.d.ts +1 -2
- package/lib/Label.js +2 -3
- package/lib/LabelGroup.d.ts +1 -2
- package/lib/LabelGroup.js +1 -1
- package/lib/Link.d.ts +1 -2
- package/lib/Link.js +1 -1
- package/lib/NewButton/button.js +34 -42
- package/lib/NewButton/index.js +12 -5
- package/lib/NewButton/types.js +1 -2
- package/lib/Overlay.d.ts +14 -11
- package/lib/Overlay.js +3 -4
- package/lib/Pagehead.d.ts +1 -2
- package/lib/Pagehead.js +1 -1
- package/lib/Pagination/Pagination.js +1 -1
- package/lib/Pagination/index.js +12 -6
- package/lib/Popover.d.ts +4 -5
- package/lib/Popover.js +4 -5
- package/lib/Portal/index.js +16 -5
- package/lib/Position.d.ts +4 -4
- package/lib/SelectMenu/SelectMenu.d.ts +29 -189
- package/lib/SelectMenu/SelectMenu.js +1 -3
- package/lib/SelectMenu/SelectMenuDivider.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuDivider.js +1 -1
- package/lib/SelectMenu/SelectMenuFilter.js +1 -1
- package/lib/SelectMenu/SelectMenuFooter.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuFooter.js +1 -1
- package/lib/SelectMenu/SelectMenuHeader.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuHeader.js +1 -1
- package/lib/SelectMenu/SelectMenuItem.d.ts +2 -3
- package/lib/SelectMenu/SelectMenuItem.js +1 -1
- package/lib/SelectMenu/SelectMenuList.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuList.js +1 -1
- package/lib/SelectMenu/SelectMenuLoadingAnimation.d.ts +2 -2
- package/lib/SelectMenu/SelectMenuLoadingAnimation.js +3 -1
- package/lib/SelectMenu/SelectMenuModal.d.ts +2 -3
- package/lib/SelectMenu/SelectMenuModal.js +1 -1
- package/lib/SelectMenu/SelectMenuTab.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuTab.js +1 -1
- package/lib/SelectMenu/SelectMenuTabPanel.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuTabPanel.js +1 -1
- package/lib/SelectMenu/SelectMenuTabs.d.ts +1 -2
- package/lib/SelectMenu/SelectMenuTabs.js +1 -1
- package/lib/SelectMenu/hooks/useKeyboardNav.js +96 -80
- package/lib/SelectMenu/index.js +14 -7
- package/lib/SelectPanel/index.js +12 -4
- package/lib/SideNav.d.ts +11 -8
- package/lib/SideNav.js +8 -15
- package/lib/StateLabel.d.ts +1 -2
- package/lib/StateLabel.js +6 -5
- package/lib/StyledOcticon.d.ts +1 -2
- package/lib/StyledOcticon.js +1 -3
- package/lib/SubNav.d.ts +5 -11
- package/lib/SubNav.js +7 -12
- package/lib/TabNav.d.ts +3 -4
- package/lib/TabNav.js +2 -2
- package/lib/TextInput.d.ts +8 -1
- package/lib/TextInput.js +17 -5
- package/lib/TextInputWithTokens.d.ts +11 -3
- package/lib/Timeline.d.ts +19 -393
- package/lib/Timeline.js +16 -13
- package/lib/Token/Token.d.ts +1 -1
- package/lib/Token/index.js +30 -11
- package/lib/Tooltip.d.ts +1 -2
- package/lib/Tooltip.js +1 -1
- package/lib/Truncate.d.ts +1 -2
- package/lib/Truncate.js +1 -3
- package/lib/UnderlineNav.d.ts +2 -3
- package/lib/UnderlineNav.js +2 -2
- package/lib/_TextInputWrapper.d.ts +3 -0
- package/lib/_TextInputWrapper.js +18 -7
- package/lib/behaviors/anchoredPosition.js +234 -205
- package/lib/behaviors/focusTrap.js +157 -121
- package/lib/behaviors/focusZone.js +509 -434
- package/lib/behaviors/scrollIntoViewingArea.js +35 -18
- package/lib/constants.js +43 -39
- package/lib/drafts.js +30 -20
- package/lib/hooks/index.js +60 -16
- package/lib/hooks/useAnchoredPosition.js +40 -32
- package/lib/hooks/useCombinedRefs.js +36 -32
- package/lib/hooks/useDialog.js +96 -72
- package/lib/hooks/useFocusTrap.js +60 -43
- package/lib/hooks/useFocusZone.js +50 -54
- package/lib/hooks/useOnEscapePress.js +36 -25
- package/lib/hooks/useOpenAndCloseFocus.js +34 -22
- package/lib/hooks/useProvidedRefOrCreate.js +14 -10
- package/lib/hooks/useProvidedStateOrCreate.js +16 -13
- package/lib/hooks/useRenderForcingRef.js +17 -13
- package/lib/hooks/useResizeObserver.js +18 -15
- package/lib/hooks/useSafeTimeout.js +30 -22
- package/lib/hooks/useScrollFlash.js +23 -16
- package/lib/index.d.ts +2 -2
- package/lib/index.js +652 -165
- package/lib/polyfills/eventListenerSignal.js +45 -37
- package/lib/sx.js +22 -10
- package/lib/theme-preval.js +3169 -64
- package/lib/theme.js +12 -3
- package/lib/utils/iterateFocusableElements.js +85 -63
- package/lib/utils/testing.d.ts +28 -61
- package/lib/utils/testing.js +29 -0
- package/lib/utils/theme.js +47 -33
- package/lib/utils/types/AriaRole.js +1 -2
- package/lib/utils/types/ComponentProps.js +1 -2
- package/lib/utils/types/Flatten.js +1 -2
- package/lib/utils/types/KeyPaths.js +1 -2
- package/lib/utils/types/MandateProps.js +1 -16
- package/lib/utils/types/Merge.js +1 -2
- package/lib/utils/types/index.js +69 -16
- package/lib/utils/uniqueId.js +8 -5
- package/lib/utils/use-force-update.js +14 -8
- package/lib/utils/useIsomorphicLayoutEffect.js +11 -8
- package/lib/utils/userAgent.js +12 -8
- package/lib-esm/ActionList/Item.js +28 -53
- package/lib-esm/ActionList2/Group.d.ts +28 -2
- package/lib-esm/ActionList2/Group.js +52 -5
- package/lib-esm/ActionList2/List.d.ts +1 -1
- package/lib-esm/ActionList2/List.js +1 -2
- package/lib-esm/Autocomplete/Autocomplete.d.ts +11 -3
- package/lib-esm/Autocomplete/AutocompleteInput.d.ts +11 -3
- package/lib-esm/Breadcrumbs.d.ts +8 -7
- package/lib-esm/Breadcrumbs.js +8 -13
- package/lib-esm/Button/Button.d.ts +2 -3
- package/lib-esm/Button/Button.js +2 -2
- package/lib-esm/Button/ButtonBase.d.ts +5 -8
- package/lib-esm/Button/ButtonBase.js +1 -3
- package/lib-esm/Button/ButtonClose.d.ts +3 -46
- package/lib-esm/Button/ButtonClose.js +2 -2
- package/lib-esm/Button/ButtonDanger.d.ts +2 -3
- package/lib-esm/Button/ButtonDanger.js +2 -2
- package/lib-esm/Button/ButtonInvisible.d.ts +2 -3
- package/lib-esm/Button/ButtonInvisible.js +2 -2
- package/lib-esm/Button/ButtonOutline.d.ts +2 -3
- package/lib-esm/Button/ButtonOutline.js +2 -2
- package/lib-esm/Button/ButtonPrimary.d.ts +2 -3
- package/lib-esm/Button/ButtonPrimary.js +2 -2
- package/lib-esm/Button/ButtonTableList.d.ts +1 -2
- package/lib-esm/Button/ButtonTableList.js +2 -2
- package/lib-esm/Checkbox.d.ts +29 -0
- package/lib-esm/Checkbox.js +44 -0
- package/lib-esm/CircleBadge.d.ts +4 -5
- package/lib-esm/CircleBadge.js +2 -2
- package/lib-esm/CircleOcticon.d.ts +1 -1
- package/lib-esm/CounterLabel.d.ts +1 -2
- package/lib-esm/CounterLabel.js +2 -2
- package/lib-esm/Dialog/Dialog.d.ts +5 -9
- package/lib-esm/Dialog/Dialog.js +12 -12
- package/lib-esm/Dialog.d.ts +4 -5
- package/lib-esm/Dialog.js +2 -2
- package/lib-esm/Dropdown.d.ts +10 -99
- package/lib-esm/Dropdown.js +4 -4
- package/lib-esm/DropdownMenu/DropdownButton.d.ts +3 -47
- package/lib-esm/DropdownMenu/DropdownButton.js +3 -1
- package/lib-esm/FilterList.d.ts +264 -303
- package/lib-esm/FilterList.js +3 -7
- package/lib-esm/FilteredSearch.d.ts +1 -2
- package/lib-esm/FilteredSearch.js +2 -2
- package/lib-esm/Flash.d.ts +1 -2
- package/lib-esm/Flash.js +2 -2
- package/lib-esm/FormGroup.d.ts +4 -5
- package/lib-esm/FormGroup.js +3 -3
- package/lib-esm/Header.d.ts +6 -7
- package/lib-esm/Header.js +5 -5
- package/lib-esm/Label.d.ts +1 -2
- package/lib-esm/Label.js +3 -4
- package/lib-esm/LabelGroup.d.ts +1 -2
- package/lib-esm/LabelGroup.js +2 -2
- package/lib-esm/Link.d.ts +1 -2
- package/lib-esm/Link.js +2 -2
- package/lib-esm/NewButton/button.js +31 -42
- package/lib-esm/Overlay.d.ts +14 -11
- package/lib-esm/Overlay.js +2 -3
- package/lib-esm/Pagehead.d.ts +1 -2
- package/lib-esm/Pagehead.js +2 -2
- package/lib-esm/Pagination/Pagination.js +2 -2
- package/lib-esm/Popover.d.ts +4 -5
- package/lib-esm/Popover.js +4 -5
- package/lib-esm/Position.d.ts +4 -4
- package/lib-esm/SelectMenu/SelectMenu.d.ts +29 -189
- package/lib-esm/SelectMenu/SelectMenu.js +1 -2
- package/lib-esm/SelectMenu/SelectMenuDivider.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuDivider.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuFilter.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuFooter.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuFooter.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuHeader.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuHeader.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuItem.d.ts +2 -3
- package/lib-esm/SelectMenu/SelectMenuItem.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuList.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuList.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuLoadingAnimation.d.ts +2 -2
- package/lib-esm/SelectMenu/SelectMenuLoadingAnimation.js +3 -2
- package/lib-esm/SelectMenu/SelectMenuModal.d.ts +2 -3
- package/lib-esm/SelectMenu/SelectMenuModal.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuTab.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuTab.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuTabPanel.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuTabPanel.js +2 -2
- package/lib-esm/SelectMenu/SelectMenuTabs.d.ts +1 -2
- package/lib-esm/SelectMenu/SelectMenuTabs.js +2 -2
- package/lib-esm/SideNav.d.ts +11 -8
- package/lib-esm/SideNav.js +8 -16
- package/lib-esm/StateLabel.d.ts +1 -2
- package/lib-esm/StateLabel.js +7 -6
- package/lib-esm/StyledOcticon.d.ts +1 -2
- package/lib-esm/StyledOcticon.js +1 -2
- package/lib-esm/SubNav.d.ts +5 -11
- package/lib-esm/SubNav.js +8 -13
- package/lib-esm/TabNav.d.ts +3 -4
- package/lib-esm/TabNav.js +3 -3
- package/lib-esm/TextInput.d.ts +8 -1
- package/lib-esm/TextInput.js +17 -5
- package/lib-esm/TextInputWithTokens.d.ts +11 -3
- package/lib-esm/Timeline.d.ts +19 -393
- package/lib-esm/Timeline.js +12 -13
- package/lib-esm/Token/Token.d.ts +1 -1
- package/lib-esm/Tooltip.d.ts +1 -2
- package/lib-esm/Tooltip.js +2 -2
- package/lib-esm/Truncate.d.ts +1 -2
- package/lib-esm/Truncate.js +1 -2
- package/lib-esm/UnderlineNav.d.ts +2 -3
- package/lib-esm/UnderlineNav.js +3 -3
- package/lib-esm/_TextInputWrapper.d.ts +3 -0
- package/lib-esm/_TextInputWrapper.js +18 -7
- package/lib-esm/index.d.ts +2 -2
- package/lib-esm/index.js +1 -1
- package/lib-esm/theme-preval.js +512 -366
- package/lib-esm/utils/testing.d.ts +28 -61
- package/lib-esm/utils/testing.js +24 -0
- package/package.json +5 -6
- package/lib/ActionList/Divider.jsx +0 -29
- package/lib/ActionList/Group.jsx +0 -23
- package/lib/ActionList/Header.jsx +0 -66
- package/lib/ActionList/Item.jsx +0 -311
- package/lib/ActionList/List.jsx +0 -138
- package/lib/ActionList2/Description.jsx +0 -29
- package/lib/ActionList2/Divider.jsx +0 -22
- package/lib/ActionList2/Group.jsx +0 -25
- package/lib/ActionList2/Header.jsx +0 -36
- package/lib/ActionList2/Item.jsx +0 -174
- package/lib/ActionList2/LinkItem.jsx +0 -28
- package/lib/ActionList2/List.jsx +0 -41
- package/lib/ActionList2/Selection.jsx +0 -50
- package/lib/ActionList2/Visuals.jsx +0 -48
- package/lib/ActionMenu.jsx +0 -73
- package/lib/AnchoredOverlay/AnchoredOverlay.jsx +0 -100
- package/lib/Autocomplete/Autocomplete.jsx +0 -100
- package/lib/Autocomplete/AutocompleteContext.jsx +0 -5
- package/lib/Autocomplete/AutocompleteInput.jsx +0 -113
- package/lib/Autocomplete/AutocompleteMenu.jsx +0 -190
- package/lib/Autocomplete/AutocompleteOverlay.jsx +0 -55
- package/lib/Avatar.jsx +0 -34
- package/lib/AvatarPair.jsx +0 -29
- package/lib/AvatarStack.jsx +0 -151
- package/lib/BaseStyles.jsx +0 -65
- package/lib/BorderBox.jsx +0 -18
- package/lib/Box.jsx +0 -10
- package/lib/BranchName.jsx +0 -20
- package/lib/Breadcrumbs.jsx +0 -74
- package/lib/Button/Button.jsx +0 -60
- package/lib/Button/ButtonBase.jsx +0 -36
- package/lib/Button/ButtonClose.jsx +0 -55
- package/lib/Button/ButtonDanger.jsx +0 -63
- package/lib/Button/ButtonGroup.jsx +0 -55
- package/lib/Button/ButtonInvisible.jsx +0 -52
- package/lib/Button/ButtonOutline.jsx +0 -63
- package/lib/Button/ButtonPrimary.jsx +0 -62
- package/lib/Button/ButtonStyles.jsx +0 -37
- package/lib/Button/ButtonTableList.jsx +0 -49
- package/lib/Caret.jsx +0 -93
- package/lib/CircleBadge.jsx +0 -43
- package/lib/CircleOcticon.jsx +0 -21
- package/lib/CounterLabel.jsx +0 -44
- package/lib/Details.jsx +0 -21
- package/lib/Dialog/ConfirmationDialog.jsx +0 -146
- package/lib/Dialog/Dialog.jsx +0 -273
- package/lib/Dialog.jsx +0 -131
- package/lib/Dropdown.jsx +0 -134
- package/lib/DropdownMenu/DropdownButton.jsx +0 -14
- package/lib/DropdownMenu/DropdownMenu.jsx +0 -70
- package/lib/EmojiPicker/EmojiPicker.d.ts +0 -15
- package/lib/EmojiPicker/EmojiPicker.js +0 -205
- package/lib/EmojiPicker/EmojiPicker.jsx +0 -125
- package/lib/EmojiPicker/EmojiPickerAnchor.d.ts +0 -0
- package/lib/EmojiPicker/EmojiPickerAnchor.js +0 -1
- package/lib/EmojiPicker/EmojiPickerAnchor.jsx +0 -1
- package/lib/EmojiPicker/EmojiPickerPanel.d.ts +0 -3
- package/lib/EmojiPicker/EmojiPickerPanel.js +0 -18
- package/lib/EmojiPicker/EmojiPickerPanel.jsx +0 -10
- package/lib/EmojiPicker/data.d.ts +0 -9
- package/lib/EmojiPicker/data.js +0 -7254
- package/lib/EmojiPicker/index.d.ts +0 -2
- package/lib/EmojiPicker/index.js +0 -8
- package/lib/FilterList.jsx +0 -63
- package/lib/FilteredActionList/FilteredActionList.jsx +0 -100
- package/lib/FilteredSearch.jsx +0 -29
- package/lib/Flash.jsx +0 -70
- package/lib/Flex.jsx +0 -15
- package/lib/FormGroup.jsx +0 -25
- package/lib/Grid.jsx +0 -15
- package/lib/Header.jsx +0 -90
- package/lib/Heading.jsx +0 -21
- package/lib/Label.jsx +0 -84
- package/lib/LabelGroup.jsx +0 -19
- package/lib/Link.jsx +0 -38
- package/lib/NewButton/button-counter.jsx +0 -14
- package/lib/NewButton/button.jsx +0 -278
- package/lib/Overlay.jsx +0 -156
- package/lib/Pagehead.jsx +0 -18
- package/lib/Pagination/Pagination.jsx +0 -163
- package/lib/Pagination/model.jsx +0 -174
- package/lib/PointerBox.jsx +0 -25
- package/lib/Popover.jsx +0 -210
- package/lib/Portal/Portal.jsx +0 -79
- package/lib/Position.jsx +0 -46
- package/lib/ProgressBar.jsx +0 -39
- package/lib/SelectMenu/SelectMenu.jsx +0 -114
- package/lib/SelectMenu/SelectMenuContext.jsx +0 -5
- package/lib/SelectMenu/SelectMenuDivider.jsx +0 -43
- package/lib/SelectMenu/SelectMenuFilter.jsx +0 -59
- package/lib/SelectMenu/SelectMenuFooter.jsx +0 -46
- package/lib/SelectMenu/SelectMenuHeader.jsx +0 -44
- package/lib/SelectMenu/SelectMenuItem.jsx +0 -143
- package/lib/SelectMenu/SelectMenuList.jsx +0 -60
- package/lib/SelectMenu/SelectMenuLoadingAnimation.jsx +0 -21
- package/lib/SelectMenu/SelectMenuModal.jsx +0 -119
- package/lib/SelectMenu/SelectMenuTab.jsx +0 -93
- package/lib/SelectMenu/SelectMenuTabPanel.jsx +0 -43
- package/lib/SelectMenu/SelectMenuTabs.jsx +0 -58
- package/lib/SelectPanel/SelectPanel.jsx +0 -105
- package/lib/SideNav.jsx +0 -177
- package/lib/Spinner.jsx +0 -35
- package/lib/StateLabel.jsx +0 -94
- package/lib/StyledOcticon.jsx +0 -20
- package/lib/SubNav.jsx +0 -104
- package/lib/TabNav.jsx +0 -60
- package/lib/Text.jsx +0 -14
- package/lib/TextInput.jsx +0 -23
- package/lib/TextInputWithTokens.jsx +0 -218
- package/lib/ThemeProvider.jsx +0 -130
- package/lib/Timeline.jsx +0 -124
- package/lib/Token/AvatarToken.jsx +0 -54
- package/lib/Token/IssueLabelToken.jsx +0 -125
- package/lib/Token/Token.jsx +0 -103
- package/lib/Token/TokenBase.jsx +0 -88
- package/lib/Token/_RemoveTokenButton.jsx +0 -108
- package/lib/Token/_TokenTextContainer.jsx +0 -49
- package/lib/Tooltip.jsx +0 -246
- package/lib/Truncate.jsx +0 -27
- package/lib/UnderlineNav.jsx +0 -90
- package/lib/_TextInputWrapper.jsx +0 -120
- package/lib/_UnstyledTextInput.jsx +0 -22
- package/lib/hooks/useDetails.jsx +0 -39
- package/lib/hooks/useOnOutsideClick.jsx +0 -61
- package/lib/hooks/useOverlay.jsx +0 -15
- package/lib/utils/create-slots.jsx +0 -65
- package/lib/utils/deprecate.jsx +0 -59
- package/lib/utils/isNumeric.jsx +0 -7
- package/lib/utils/ssr.jsx +0 -6
- package/lib/utils/test-deprecations.jsx +0 -20
- package/lib/utils/test-helpers.jsx +0 -8
- package/lib/utils/test-matchers.jsx +0 -100
- package/lib/utils/testing.jsx +0 -206
- package/lib-esm/EmojiPicker/EmojiPicker.d.ts +0 -15
- package/lib-esm/EmojiPicker/EmojiPicker.js +0 -184
- package/lib-esm/EmojiPicker/EmojiPickerAnchor.d.ts +0 -0
- package/lib-esm/EmojiPicker/EmojiPickerAnchor.js +0 -0
- package/lib-esm/EmojiPicker/EmojiPickerPanel.d.ts +0 -3
- package/lib-esm/EmojiPicker/EmojiPickerPanel.js +0 -8
- package/lib-esm/EmojiPicker/data.d.ts +0 -9
- package/lib-esm/EmojiPicker/data.js +0 -5434
- package/lib-esm/EmojiPicker/index.d.ts +0 -2
- package/lib-esm/EmojiPicker/index.js +0 -1
package/lib/EmojiPicker/index.js
DELETED
@@ -1,8 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
exports.default = void 0;
|
7
|
-
var EmojiPicker_1 = require("./EmojiPicker");
|
8
|
-
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(EmojiPicker_1).default; } });
|
package/lib/FilterList.jsx
DELETED
@@ -1,63 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const react_1 = __importDefault(require("react"));
|
7
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
8
|
-
const constants_1 = require("./constants");
|
9
|
-
const sx_1 = __importDefault(require("./sx"));
|
10
|
-
const FilterListBase = styled_components_1.default.ul `
|
11
|
-
list-style-type: none;
|
12
|
-
${constants_1.COMMON};
|
13
|
-
${sx_1.default};
|
14
|
-
`;
|
15
|
-
const FilterList = ({ children, ...rest }) => {
|
16
|
-
const items = react_1.default.Children.map(children, child => {
|
17
|
-
return <li>{child}</li>;
|
18
|
-
});
|
19
|
-
return <FilterListBase {...rest}>{items}</FilterListBase>;
|
20
|
-
};
|
21
|
-
const FilterListItemBase = styled_components_1.default.a `
|
22
|
-
position: relative;
|
23
|
-
display: block;
|
24
|
-
padding: ${props => (props.small ? `${constants_1.get('space.1')(props)} 10px` : `${constants_1.get('space.2')(props)} 11px`)};
|
25
|
-
margin: ${props => (props.small ? '0 0 2px' : '0 0 5px 0')};
|
26
|
-
overflow: hidden;
|
27
|
-
font-size: ${constants_1.get('fontSizes.1')};
|
28
|
-
color: ${props => (props.selected ? constants_1.get('colors.fg.onEmphasis') : constants_1.get('colors.fg.muted'))};
|
29
|
-
background-color: ${props => (props.selected ? constants_1.get('colors.accent.emphasis') : '')}!important;
|
30
|
-
text-decoration: none;
|
31
|
-
text-overflow: ellipsis;
|
32
|
-
white-space: nowrap;
|
33
|
-
cursor: pointer;
|
34
|
-
border-radius: ${constants_1.get('radii.1')};
|
35
|
-
&:hover {
|
36
|
-
text-decoration: none;
|
37
|
-
background-color: ${constants_1.get('colors.canvas.subtle')};
|
38
|
-
}
|
39
|
-
&:active {
|
40
|
-
color: ${constants_1.get('colors.fg.onEmphasis')};
|
41
|
-
background-color: ${constants_1.get('colors.accent.emphasis')};
|
42
|
-
}
|
43
|
-
.count {
|
44
|
-
float: right;
|
45
|
-
font-weight: ${constants_1.get('fontWeights.bold')};
|
46
|
-
}
|
47
|
-
${constants_1.COMMON};
|
48
|
-
${sx_1.default};
|
49
|
-
`;
|
50
|
-
function FilterListItem({ children, count, ...rest }) {
|
51
|
-
return (<FilterListItemBase {...rest}>
|
52
|
-
{count && (<span title="results" className="count">
|
53
|
-
{count}
|
54
|
-
</span>)}
|
55
|
-
{children}
|
56
|
-
</FilterListItemBase>);
|
57
|
-
}
|
58
|
-
FilterList.defaultProps = {
|
59
|
-
m: 0,
|
60
|
-
p: 0
|
61
|
-
};
|
62
|
-
FilterListItem.displayName = 'FilterList.Item';
|
63
|
-
exports.default = Object.assign(FilterList, { Item: FilterListItem });
|
@@ -1,100 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
3
|
-
if (k2 === undefined) k2 = k;
|
4
|
-
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
5
|
-
}) : (function(o, m, k, k2) {
|
6
|
-
if (k2 === undefined) k2 = k;
|
7
|
-
o[k2] = m[k];
|
8
|
-
}));
|
9
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
10
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
11
|
-
}) : function(o, v) {
|
12
|
-
o["default"] = v;
|
13
|
-
});
|
14
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
15
|
-
if (mod && mod.__esModule) return mod;
|
16
|
-
var result = {};
|
17
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
18
|
-
__setModuleDefault(result, mod);
|
19
|
-
return result;
|
20
|
-
};
|
21
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
22
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
23
|
-
};
|
24
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
25
|
-
exports.FilteredActionList = void 0;
|
26
|
-
const react_1 = __importStar(require("react"));
|
27
|
-
const ssr_1 = require("@react-aria/ssr");
|
28
|
-
const TextInput_1 = __importDefault(require("../TextInput"));
|
29
|
-
const Box_1 = __importDefault(require("../Box"));
|
30
|
-
const ActionList_1 = require("../ActionList");
|
31
|
-
const Spinner_1 = __importDefault(require("../Spinner"));
|
32
|
-
const useFocusZone_1 = require("../hooks/useFocusZone");
|
33
|
-
const useProvidedStateOrCreate_1 = require("../hooks/useProvidedStateOrCreate");
|
34
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
35
|
-
const constants_1 = require("../constants");
|
36
|
-
const useProvidedRefOrCreate_1 = require("../hooks/useProvidedRefOrCreate");
|
37
|
-
const useScrollFlash_1 = __importDefault(require("../hooks/useScrollFlash"));
|
38
|
-
const scrollIntoViewingArea_1 = require("../behaviors/scrollIntoViewingArea");
|
39
|
-
const StyledHeader = styled_components_1.default.div `
|
40
|
-
box-shadow: 0 1px 0 ${constants_1.get('colors.border.default')};
|
41
|
-
z-index: 1;
|
42
|
-
`;
|
43
|
-
function FilteredActionList({ loading = false, placeholderText, filterValue: externalFilterValue, onFilterChange, items, textInputProps, inputRef: providedInputRef, sx, ...listProps }) {
|
44
|
-
const [filterValue, setInternalFilterValue] = useProvidedStateOrCreate_1.useProvidedStateOrCreate(externalFilterValue, undefined, '');
|
45
|
-
const onInputChange = react_1.useCallback((e) => {
|
46
|
-
const value = e.target.value;
|
47
|
-
onFilterChange(value, e);
|
48
|
-
setInternalFilterValue(value);
|
49
|
-
}, [onFilterChange, setInternalFilterValue]);
|
50
|
-
const scrollContainerRef = react_1.useRef(null);
|
51
|
-
const listContainerRef = react_1.useRef(null);
|
52
|
-
const inputRef = useProvidedRefOrCreate_1.useProvidedRefOrCreate(providedInputRef);
|
53
|
-
const activeDescendantRef = react_1.useRef();
|
54
|
-
const listId = ssr_1.useSSRSafeId();
|
55
|
-
const onInputKeyPress = react_1.useCallback(event => {
|
56
|
-
if (event.key === 'Enter' && activeDescendantRef.current) {
|
57
|
-
event.preventDefault();
|
58
|
-
event.nativeEvent.stopImmediatePropagation();
|
59
|
-
// Forward Enter key press to active descendant so that item gets activated
|
60
|
-
const activeDescendantEvent = new KeyboardEvent(event.type, event.nativeEvent);
|
61
|
-
activeDescendantRef.current.dispatchEvent(activeDescendantEvent);
|
62
|
-
}
|
63
|
-
}, [activeDescendantRef]);
|
64
|
-
useFocusZone_1.useFocusZone({
|
65
|
-
containerRef: listContainerRef,
|
66
|
-
focusOutBehavior: 'wrap',
|
67
|
-
focusableElementFilter: element => {
|
68
|
-
return !(element instanceof HTMLInputElement);
|
69
|
-
},
|
70
|
-
activeDescendantFocus: inputRef,
|
71
|
-
onActiveDescendantChanged: (current, previous, directlyActivated) => {
|
72
|
-
activeDescendantRef.current = current;
|
73
|
-
if (current && scrollContainerRef.current && directlyActivated) {
|
74
|
-
scrollIntoViewingArea_1.scrollIntoViewingArea(current, scrollContainerRef.current);
|
75
|
-
}
|
76
|
-
}
|
77
|
-
}, [
|
78
|
-
// List ref isn't set while loading. Need to re-bind focus zone when it changes
|
79
|
-
loading
|
80
|
-
]);
|
81
|
-
react_1.useEffect(() => {
|
82
|
-
// if items changed, we want to instantly move active descendant into view
|
83
|
-
if (activeDescendantRef.current && scrollContainerRef.current) {
|
84
|
-
scrollIntoViewingArea_1.scrollIntoViewingArea(activeDescendantRef.current, scrollContainerRef.current, 'vertical', undefined, undefined, 'auto');
|
85
|
-
}
|
86
|
-
}, [items]);
|
87
|
-
useScrollFlash_1.default(scrollContainerRef);
|
88
|
-
return (<Box_1.default display="flex" flexDirection="column" overflow="hidden" sx={sx}>
|
89
|
-
<StyledHeader>
|
90
|
-
<TextInput_1.default ref={inputRef} block width="auto" color="fg.default" value={filterValue} onChange={onInputChange} onKeyPress={onInputKeyPress} placeholder={placeholderText} aria-label={placeholderText} aria-controls={listId} {...textInputProps}/>
|
91
|
-
</StyledHeader>
|
92
|
-
<Box_1.default ref={scrollContainerRef} overflow="auto">
|
93
|
-
{loading ? (<Box_1.default width="100%" display="flex" flexDirection="row" justifyContent="center" pt={6} pb={7}>
|
94
|
-
<Spinner_1.default />
|
95
|
-
</Box_1.default>) : (<ActionList_1.ActionList ref={listContainerRef} items={items} {...listProps} role="listbox" id={listId}/>)}
|
96
|
-
</Box_1.default>
|
97
|
-
</Box_1.default>);
|
98
|
-
}
|
99
|
-
exports.FilteredActionList = FilteredActionList;
|
100
|
-
FilteredActionList.displayName = 'FilteredActionList';
|
package/lib/FilteredSearch.jsx
DELETED
@@ -1,29 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const constants_1 = require("./constants");
|
8
|
-
const sx_1 = __importDefault(require("./sx"));
|
9
|
-
const FilteredSearch = styled_components_1.default.div `
|
10
|
-
${constants_1.COMMON};
|
11
|
-
display: flex;
|
12
|
-
align-items: stretch;
|
13
|
-
|
14
|
-
summary {
|
15
|
-
border-radius: 0;
|
16
|
-
border-top-left-radius: ${constants_1.get('radii.2')};
|
17
|
-
border-bottom-left-radius: ${constants_1.get('radii.2')};
|
18
|
-
border-right: 0;
|
19
|
-
}
|
20
|
-
.TextInput-wrapper {
|
21
|
-
border-radius: 0;
|
22
|
-
border-top-right-radius: ${constants_1.get('radii.2')};
|
23
|
-
border-bottom-right-radius: ${constants_1.get('radii.2')};
|
24
|
-
z-index: 1; // Allows the focus outline to show on top of the dropdown.
|
25
|
-
}
|
26
|
-
|
27
|
-
${sx_1.default}
|
28
|
-
`;
|
29
|
-
exports.default = FilteredSearch;
|
package/lib/Flash.jsx
DELETED
@@ -1,70 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const styled_system_1 = require("styled-system");
|
8
|
-
const constants_1 = require("./constants");
|
9
|
-
const sx_1 = __importDefault(require("./sx"));
|
10
|
-
const variants = styled_system_1.variant({
|
11
|
-
variants: {
|
12
|
-
default: {
|
13
|
-
color: 'fg.default',
|
14
|
-
backgroundColor: 'accent.subtle',
|
15
|
-
borderColor: 'accent.muted',
|
16
|
-
svg: {
|
17
|
-
color: 'accent.fg'
|
18
|
-
}
|
19
|
-
},
|
20
|
-
success: {
|
21
|
-
color: 'fg.default',
|
22
|
-
backgroundColor: 'success.subtle',
|
23
|
-
borderColor: 'success.muted',
|
24
|
-
svg: {
|
25
|
-
color: 'success.fg'
|
26
|
-
}
|
27
|
-
},
|
28
|
-
danger: {
|
29
|
-
color: 'fg.default',
|
30
|
-
backgroundColor: 'danger.subtle',
|
31
|
-
borderColor: 'danger.muted',
|
32
|
-
svg: {
|
33
|
-
color: 'danger.fg'
|
34
|
-
}
|
35
|
-
},
|
36
|
-
warning: {
|
37
|
-
color: 'fg.default',
|
38
|
-
backgroundColor: 'attention.subtle',
|
39
|
-
borderColor: 'attention.muted',
|
40
|
-
svg: {
|
41
|
-
color: 'attention.fg'
|
42
|
-
}
|
43
|
-
}
|
44
|
-
}
|
45
|
-
});
|
46
|
-
const Flash = styled_components_1.default.div `
|
47
|
-
position: relative;
|
48
|
-
color: ${constants_1.get('colors.fg.default')};
|
49
|
-
padding: ${constants_1.get('space.3')};
|
50
|
-
border-style: solid;
|
51
|
-
border-width: ${props => (props.full ? '1px 0px' : '1px')};
|
52
|
-
border-radius: ${props => (props.full ? '0' : constants_1.get('radii.2'))};
|
53
|
-
margin-top: ${props => (props.full ? '-1px' : '0')};
|
54
|
-
|
55
|
-
p:last-child {
|
56
|
-
margin-bottom: 0;
|
57
|
-
}
|
58
|
-
|
59
|
-
svg {
|
60
|
-
margin-right: ${constants_1.get('space.2')};
|
61
|
-
}
|
62
|
-
|
63
|
-
${constants_1.COMMON};
|
64
|
-
${variants};
|
65
|
-
${sx_1.default};
|
66
|
-
`;
|
67
|
-
Flash.defaultProps = {
|
68
|
-
variant: 'default'
|
69
|
-
};
|
70
|
-
exports.default = Flash;
|
package/lib/Flex.jsx
DELETED
@@ -1,15 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const Box_1 = __importDefault(require("./Box"));
|
8
|
-
/**
|
9
|
-
* @deprecated Use the Box component instead (i.e. <Flex> → <Box display="flex">)
|
10
|
-
*/
|
11
|
-
const Flex = styled_components_1.default(Box_1.default) ``;
|
12
|
-
Flex.defaultProps = {
|
13
|
-
display: 'flex'
|
14
|
-
};
|
15
|
-
exports.default = Flex;
|
package/lib/FormGroup.jsx
DELETED
@@ -1,25 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const constants_1 = require("./constants");
|
8
|
-
const sx_1 = __importDefault(require("./sx"));
|
9
|
-
const FormGroup = styled_components_1.default.div `
|
10
|
-
margin: ${constants_1.get('space.3')} 0;
|
11
|
-
font-weight: ${constants_1.get('fontWeights.normal')};
|
12
|
-
${constants_1.COMMON};
|
13
|
-
${sx_1.default};
|
14
|
-
`;
|
15
|
-
const FormGroupLabel = styled_components_1.default.label `
|
16
|
-
display: block;
|
17
|
-
margin: 0 0 ${constants_1.get('space.2')};
|
18
|
-
font-size: ${constants_1.get('fontSizes.1')};
|
19
|
-
font-weight: ${constants_1.get('fontWeights.bold')};
|
20
|
-
${constants_1.TYPOGRAPHY};
|
21
|
-
${constants_1.COMMON};
|
22
|
-
${sx_1.default};
|
23
|
-
`;
|
24
|
-
FormGroupLabel.displayName = 'FormGroup.Label';
|
25
|
-
exports.default = Object.assign(FormGroup, { Label: FormGroupLabel });
|
package/lib/Grid.jsx
DELETED
@@ -1,15 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const Box_1 = __importDefault(require("./Box"));
|
8
|
-
/**
|
9
|
-
* @deprecated Use the Box component instead (i.e. <Grid> → <Box display="grid">)
|
10
|
-
*/
|
11
|
-
const Grid = styled_components_1.default(Box_1.default) ``;
|
12
|
-
Grid.defaultProps = {
|
13
|
-
display: 'grid'
|
14
|
-
};
|
15
|
-
exports.default = Grid;
|
package/lib/Header.jsx
DELETED
@@ -1,90 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
3
|
-
if (k2 === undefined) k2 = k;
|
4
|
-
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
5
|
-
}) : (function(o, m, k, k2) {
|
6
|
-
if (k2 === undefined) k2 = k;
|
7
|
-
o[k2] = m[k];
|
8
|
-
}));
|
9
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
10
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
11
|
-
}) : function(o, v) {
|
12
|
-
o["default"] = v;
|
13
|
-
});
|
14
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
15
|
-
if (mod && mod.__esModule) return mod;
|
16
|
-
var result = {};
|
17
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
18
|
-
__setModuleDefault(result, mod);
|
19
|
-
return result;
|
20
|
-
};
|
21
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
22
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
23
|
-
};
|
24
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
25
|
-
const styled_components_1 = __importStar(require("styled-components"));
|
26
|
-
const constants_1 = require("./constants");
|
27
|
-
const sx_1 = __importDefault(require("./sx"));
|
28
|
-
const Header = styled_components_1.default.div `
|
29
|
-
z-index: 32;
|
30
|
-
display: flex;
|
31
|
-
padding: ${constants_1.get('space.3')};
|
32
|
-
font-size: ${constants_1.get('fontSizes.1')};
|
33
|
-
line-height: ${constants_1.get('lineHeights.default')};
|
34
|
-
color: ${constants_1.get('colors.header.text')};
|
35
|
-
background-color: ${constants_1.get('colors.header.bg')};
|
36
|
-
align-items: center;
|
37
|
-
flex-wrap: nowrap;
|
38
|
-
|
39
|
-
${constants_1.COMMON}
|
40
|
-
${constants_1.BORDER}
|
41
|
-
${sx_1.default};
|
42
|
-
`;
|
43
|
-
const HeaderItem = styled_components_1.default.div `
|
44
|
-
display: flex;
|
45
|
-
margin-right: ${constants_1.get('space.3')};
|
46
|
-
align-self: stretch;
|
47
|
-
align-items: center;
|
48
|
-
flex-wrap: nowrap;
|
49
|
-
|
50
|
-
${({ full }) => full &&
|
51
|
-
styled_components_1.css `
|
52
|
-
flex: auto;
|
53
|
-
`};
|
54
|
-
|
55
|
-
${constants_1.COMMON};
|
56
|
-
${constants_1.BORDER};
|
57
|
-
${sx_1.default};
|
58
|
-
`;
|
59
|
-
HeaderItem.displayName = 'Header.Item';
|
60
|
-
const HeaderLink = styled_components_1.default.a.attrs(({ to }) => {
|
61
|
-
const isReactRouter = typeof to === 'string';
|
62
|
-
if (isReactRouter) {
|
63
|
-
// according to their docs, NavLink supports aria-current:
|
64
|
-
// https://reacttraining.com/react-router/web/api/NavLink/aria-current-string
|
65
|
-
return { 'aria-current': 'page' };
|
66
|
-
}
|
67
|
-
else {
|
68
|
-
return {};
|
69
|
-
}
|
70
|
-
}) `
|
71
|
-
font-weight: ${constants_1.get('fontWeights.bold')};
|
72
|
-
color: ${constants_1.get('colors.header.logo')};
|
73
|
-
white-space: nowrap;
|
74
|
-
cursor: pointer;
|
75
|
-
text-decoration: none;
|
76
|
-
display: flex;
|
77
|
-
align-items: center;
|
78
|
-
|
79
|
-
&:hover,
|
80
|
-
&:focus {
|
81
|
-
color: ${constants_1.get('colors.header.text')};
|
82
|
-
}
|
83
|
-
|
84
|
-
${constants_1.COMMON};
|
85
|
-
${constants_1.BORDER};
|
86
|
-
${constants_1.TYPOGRAPHY};
|
87
|
-
${sx_1.default};
|
88
|
-
`;
|
89
|
-
HeaderLink.displayName = 'Header.Link';
|
90
|
-
exports.default = Object.assign(Header, { Link: HeaderLink, Item: HeaderItem });
|
package/lib/Heading.jsx
DELETED
@@ -1,21 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const constants_1 = require("./constants");
|
8
|
-
const sx_1 = __importDefault(require("./sx"));
|
9
|
-
const theme_1 = __importDefault(require("./theme"));
|
10
|
-
const Heading = styled_components_1.default.h2 `
|
11
|
-
font-weight: ${constants_1.get('fontWeights.bold')};
|
12
|
-
font-size: ${constants_1.get('fontSizes.5')};
|
13
|
-
margin: 0;
|
14
|
-
${constants_1.TYPOGRAPHY};
|
15
|
-
${constants_1.COMMON};
|
16
|
-
${sx_1.default};
|
17
|
-
`;
|
18
|
-
Heading.defaultProps = {
|
19
|
-
theme: theme_1.default
|
20
|
-
};
|
21
|
-
exports.default = Heading;
|
package/lib/Label.jsx
DELETED
@@ -1,84 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
3
|
-
if (k2 === undefined) k2 = k;
|
4
|
-
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
5
|
-
}) : (function(o, m, k, k2) {
|
6
|
-
if (k2 === undefined) k2 = k;
|
7
|
-
o[k2] = m[k];
|
8
|
-
}));
|
9
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
10
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
11
|
-
}) : function(o, v) {
|
12
|
-
o["default"] = v;
|
13
|
-
});
|
14
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
15
|
-
if (mod && mod.__esModule) return mod;
|
16
|
-
var result = {};
|
17
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
18
|
-
__setModuleDefault(result, mod);
|
19
|
-
return result;
|
20
|
-
};
|
21
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
22
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
23
|
-
};
|
24
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
25
|
-
const styled_components_1 = __importStar(require("styled-components"));
|
26
|
-
const styled_system_1 = require("styled-system");
|
27
|
-
const constants_1 = require("./constants");
|
28
|
-
const sx_1 = __importDefault(require("./sx"));
|
29
|
-
const outlineStyles = styled_components_1.css `
|
30
|
-
margin-top: -1px; // offsets the 1px border
|
31
|
-
margin-bottom: -1px; // offsets the 1px border
|
32
|
-
color: ${constants_1.get('colors.fg.muted')};
|
33
|
-
border: ${constants_1.get('borderWidths.1')} solid ${constants_1.get('colors.border.default')};
|
34
|
-
box-shadow: none;
|
35
|
-
${styled_system_1.borderColor};
|
36
|
-
${constants_1.COMMON};
|
37
|
-
background-color: transparent;
|
38
|
-
`;
|
39
|
-
const sizeVariant = styled_system_1.variant({
|
40
|
-
variants: {
|
41
|
-
small: {
|
42
|
-
fontSize: 0,
|
43
|
-
lineHeight: '16px',
|
44
|
-
padding: '0px 8px'
|
45
|
-
},
|
46
|
-
medium: {
|
47
|
-
fontSize: 0,
|
48
|
-
lineHeight: '20px',
|
49
|
-
padding: '0 8px'
|
50
|
-
},
|
51
|
-
large: {
|
52
|
-
fontSize: 0,
|
53
|
-
lineHeight: '24px',
|
54
|
-
padding: '0 12px'
|
55
|
-
},
|
56
|
-
// corresponds to StateLabel fontSize/lineHeight/padding
|
57
|
-
xl: {
|
58
|
-
fontSize: 1,
|
59
|
-
lineHeight: '16px',
|
60
|
-
padding: '8px 12px'
|
61
|
-
}
|
62
|
-
}
|
63
|
-
});
|
64
|
-
const Label = styled_components_1.default.span `
|
65
|
-
display: inline-block;
|
66
|
-
font-weight: ${constants_1.get('fontWeights.semibold')};
|
67
|
-
color: ${constants_1.get('colors.fg.onEmphasis')};
|
68
|
-
border-radius: ${constants_1.get('radii.3')};
|
69
|
-
|
70
|
-
&:hover {
|
71
|
-
text-decoration: none;
|
72
|
-
}
|
73
|
-
|
74
|
-
${sizeVariant}
|
75
|
-
${constants_1.COMMON}
|
76
|
-
${props => (props.dropshadow ? 'box-shadow: inset 0 -1px 0 rgba(27, 31, 35, 0.12)' : '')}
|
77
|
-
${props => (props.outline ? outlineStyles : '')} // must be last to override other values
|
78
|
-
${sx_1.default}
|
79
|
-
`;
|
80
|
-
Label.defaultProps = {
|
81
|
-
bg: 'neutral.emphasis',
|
82
|
-
variant: 'medium'
|
83
|
-
};
|
84
|
-
exports.default = Label;
|
package/lib/LabelGroup.jsx
DELETED
@@ -1,19 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const constants_1 = require("./constants");
|
8
|
-
const sx_1 = __importDefault(require("./sx"));
|
9
|
-
const LabelGroup = styled_components_1.default.span `
|
10
|
-
${constants_1.COMMON}
|
11
|
-
& * {
|
12
|
-
margin-right: ${constants_1.get('space.1')};
|
13
|
-
}
|
14
|
-
& *:last-child {
|
15
|
-
margin-right: 0;
|
16
|
-
}
|
17
|
-
${sx_1.default};
|
18
|
-
`;
|
19
|
-
exports.default = LabelGroup;
|
package/lib/Link.jsx
DELETED
@@ -1,38 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
const styled_components_1 = __importDefault(require("styled-components"));
|
7
|
-
const styled_system_1 = require("styled-system");
|
8
|
-
const constants_1 = require("./constants");
|
9
|
-
const sx_1 = __importDefault(require("./sx"));
|
10
|
-
const hoverColor = styled_system_1.system({
|
11
|
-
hoverColor: {
|
12
|
-
property: 'color',
|
13
|
-
scale: 'colors'
|
14
|
-
}
|
15
|
-
});
|
16
|
-
const Link = styled_components_1.default.a `
|
17
|
-
color: ${props => (props.muted ? constants_1.get('colors.fg.muted')(props) : constants_1.get('colors.accent.fg')(props))};
|
18
|
-
text-decoration: ${props => (props.underline ? 'underline' : 'none')};
|
19
|
-
&:hover {
|
20
|
-
text-decoration: ${props => (props.muted ? 'none' : 'underline')};
|
21
|
-
${props => (props.hoverColor ? hoverColor : props.muted ? `color: ${constants_1.get('colors.accent.fg')(props)}` : '')};
|
22
|
-
}
|
23
|
-
&:is(button) {
|
24
|
-
display: inline-block;
|
25
|
-
padding: 0;
|
26
|
-
font-size: inherit;
|
27
|
-
white-space: nowrap;
|
28
|
-
cursor: pointer;
|
29
|
-
user-select: none;
|
30
|
-
background-color: transparent;
|
31
|
-
border: 0;
|
32
|
-
appearance: none;
|
33
|
-
}
|
34
|
-
${constants_1.TYPOGRAPHY};
|
35
|
-
${constants_1.COMMON};
|
36
|
-
${sx_1.default};
|
37
|
-
`;
|
38
|
-
exports.default = Link;
|
@@ -1,14 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
-
};
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
-
exports.Counter = void 0;
|
7
|
-
const react_1 = __importDefault(require("react"));
|
8
|
-
const CounterLabel_1 = __importDefault(require("../CounterLabel"));
|
9
|
-
const Counter = ({ children, sx: sxProp = {}, ...props }) => {
|
10
|
-
return (<CounterLabel_1.default data-component="ButtonCounter" sx={{ ml: 2, ...sxProp }} {...props}>
|
11
|
-
{children}
|
12
|
-
</CounterLabel_1.default>);
|
13
|
-
};
|
14
|
-
exports.Counter = Counter;
|