@sanity/ui 3.3.0 → 3.3.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 +12 -0
- package/dist/_visual-editing.d.mts +2 -1126
- package/dist/_visual-editing.d.ts +2 -1126
- package/dist/_visual-editing.js +3 -31
- package/dist/_visual-editing.mjs +2 -31
- package/dist/index.d.mts +555 -2769
- package/dist/index.d.mts.map +1 -0
- package/dist/index.d.ts +555 -2769
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +2982 -1934
- package/dist/index.mjs +2950 -1903
- package/dist/index.mjs.map +1 -1
- package/dist/refractor.js +16 -0
- package/dist/refractor.mjs +21 -0
- package/dist/refractor.mjs.map +1 -0
- package/dist/tabList.js +3804 -0
- package/dist/tabList.mjs +3355 -0
- package/dist/tabList.mjs.map +1 -0
- package/dist/theme.d.mts +927 -1227
- package/dist/theme.d.mts.map +1 -0
- package/dist/theme.d.ts +927 -1227
- package/dist/theme.d.ts.map +1 -0
- package/dist/theme.js +3 -4127
- package/dist/theme.mjs +2 -4127
- package/dist/theme2.d.mts +2 -0
- package/dist/theme2.d.ts +2 -0
- package/dist/theme2.js +4104 -0
- package/dist/theme2.mjs +3851 -0
- package/dist/theme2.mjs.map +1 -0
- package/dist/useTheme.d.mts +1451 -0
- package/dist/useTheme.d.mts.map +1 -0
- package/dist/useTheme.d.ts +1451 -0
- package/dist/useTheme.d.ts.map +1 -0
- package/exports/_visual-editing.ts +1 -0
- package/package.json +52 -168
- package/src/core/_compat.ts +30 -0
- package/src/core/components/autocomplete/autocomplete.tsx +8 -0
- package/src/core/components/autocomplete/autocompleteOption.tsx +1 -0
- package/src/core/components/breadcrumbs/breadcrumbs.test.tsx +8 -5
- package/src/core/components/breadcrumbs/breadcrumbs.tsx +3 -0
- package/src/core/components/dialog/dialog.tsx +5 -2
- package/src/core/components/hotkeys/hotkeys.test.tsx +10 -5
- package/src/core/components/hotkeys/hotkeys.tsx +2 -0
- package/src/core/components/menu/menu.spacing.test.tsx +12 -7
- package/src/core/components/menu/menu.test.tsx +9 -6
- package/src/core/components/menu/menu.tsx +4 -2
- package/src/core/components/menu/menuButton.tsx +8 -0
- package/src/core/components/menu/menuDivider.ts +1 -0
- package/src/core/components/menu/menuGroup.spacing.test.tsx +9 -6
- package/src/core/components/menu/menuGroup.tsx +6 -2
- package/src/core/components/menu/menuItem.spacing.test.tsx +8 -5
- package/src/core/components/menu/menuItem.tsx +4 -0
- package/src/core/components/menu/useMenuController.ts +2 -0
- package/src/core/components/skeleton/skeleton.tsx +1 -0
- package/src/core/components/tab/tab.tsx +1 -0
- package/src/core/components/tab/tabList.test.tsx +7 -5
- package/src/core/components/tab/tabList.tsx +1 -0
- package/src/core/components/toast/toast.test.tsx +9 -4
- package/src/core/components/toast/toast.tsx +1 -0
- package/src/core/components/toast/toastLayer.tsx +1 -0
- package/src/core/components/tree/tree.test.tsx +10 -5
- package/src/core/components/tree/tree.tsx +2 -0
- package/src/core/components/tree/treeGroup.tsx +1 -0
- package/src/core/components/tree/treeItem.test.tsx +10 -5
- package/src/core/components/tree/treeItem.tsx +1 -0
- package/src/core/hooks/index.ts +1 -0
- package/src/core/hooks/useClickOutside.test.tsx +43 -15
- package/src/core/hooks/useClickOutside.ts +1 -1
- package/src/core/hooks/useClickOutsideEvent.test.tsx +8 -4
- package/src/core/hooks/useDelayed.test.ts +9 -8
- package/src/core/hooks/useElementRect/useElementRect.ts +1 -0
- package/src/core/hooks/useForwardedRef.ts +1 -0
- package/src/core/hooks/useMediaIndex/useMediaIndex.test.tsx +2 -1
- package/src/core/hooks/usePrefersDark.hydration.test.tsx +7 -5
- package/src/core/hooks/usePrefersDark.test.tsx +3 -1
- package/src/core/hooks/usePrefersReducedMotion.hydration.test.tsx +7 -5
- package/src/core/hooks/usePrefersReducedMotion.test.tsx +3 -1
- package/src/core/lib/createGlobalScopedContext.ts +1 -0
- package/src/core/lib/globalScope.ts +1 -0
- package/src/core/observers/elementSizeObserver.ts +1 -0
- package/src/core/primitives/avatar/avatar.tsx +2 -2
- package/src/core/primitives/avatar/avatarStack.tsx +1 -0
- package/src/core/primitives/badge/badge.test.tsx +3 -2
- package/src/core/primitives/badge/badge.tsx +3 -1
- package/src/core/primitives/box/box.test.tsx +18 -5
- package/src/core/primitives/box/box.tsx +9 -1
- package/src/core/primitives/button/button.test.tsx +10 -6
- package/src/core/primitives/button/button.tsx +4 -0
- package/src/core/primitives/button/styles.ts +1 -0
- package/src/core/primitives/card/card.tsx +2 -5
- package/src/core/primitives/card/types.ts +1 -0
- package/src/core/primitives/code/code.tsx +1 -0
- package/src/core/primitives/code/refractor.tsx +2 -0
- package/src/core/primitives/container/container.tsx +1 -0
- package/src/core/primitives/flex/flex.tsx +2 -3
- package/src/core/primitives/grid/grid.test.tsx +11 -5
- package/src/core/primitives/grid/grid.tsx +3 -0
- package/src/core/primitives/heading/heading.tsx +1 -0
- package/src/core/primitives/inline/inline.test.tsx +9 -5
- package/src/core/primitives/inline/inline.tsx +3 -0
- package/src/core/primitives/kbd/kbd.tsx +5 -1
- package/src/core/primitives/label/label.tsx +1 -0
- package/src/core/primitives/popover/popover.tsx +5 -4
- package/src/core/primitives/popover/popoverCard.tsx +1 -0
- package/src/core/primitives/popover/types.ts +0 -1
- package/src/core/primitives/select/select.test.tsx +9 -5
- package/src/core/primitives/select/select.tsx +1 -0
- package/src/core/primitives/stack/stack.test.tsx +9 -5
- package/src/core/primitives/stack/stack.tsx +2 -0
- package/src/core/primitives/stack/styles.ts +1 -0
- package/src/core/primitives/text/text.tsx +1 -0
- package/src/core/primitives/textInput/textInput.test.tsx +9 -5
- package/src/core/primitives/textInput/textInput.tsx +3 -0
- package/src/core/primitives/tooltip/tooltip.test.tsx +82 -49
- package/src/core/primitives/tooltip/tooltip.tsx +3 -1
- package/src/core/primitives/tooltip/tooltipCard.tsx +1 -0
- package/src/core/primitives/tooltip/tooltipDelayGroup/types.ts +2 -0
- package/src/core/styles/flex/types.ts +0 -1
- package/src/core/styles/font/responsiveFont.ts +0 -3
- package/src/core/styles/font/types.ts +1 -3
- package/src/core/styles/grid/gridStyle.ts +1 -0
- package/src/core/styles/margin/marginStyle.ts +1 -0
- package/src/core/styles/margin/marginsStyle.test.ts +2 -1
- package/src/core/styles/padding/paddingStyle.test.ts +2 -1
- package/src/core/styles/padding/paddingStyle.ts +1 -0
- package/src/core/theme/theme.test.tsx +7 -3
- package/src/core/theme/useRootTheme.ts +1 -0
- package/src/core/theme/useTheme.ts +2 -0
- package/src/core/utils/arrow/arrow.tsx +1 -0
- package/src/core/utils/boundaryElement/boundaryElement.test.tsx +9 -4
- package/src/core/utils/conditionalWrapper/conditionalWrapper.tsx +1 -0
- package/src/core/utils/getElementRef.ts +5 -0
- package/src/core/utils/layer/getLayerContext.test.ts +2 -0
- package/src/core/utils/layer/layer.test.tsx +9 -4
- package/src/core/utils/layer/layer.tsx +1 -0
- package/src/core/utils/layer/useLayer.ts +2 -0
- package/src/core/utils/portal/portal.test.tsx +9 -4
- package/src/core/utils/portal/portalProvider.tsx +1 -0
- package/src/core/utils/virtualList/virtualList.tsx +2 -1
- package/src/theme/build/_deprecated/color/_selectable/createSelectableTones.ts +10 -0
- package/src/theme/build/_deprecated/color/_solid/createSolidTones.ts +4 -0
- package/src/theme/build/_deprecated/color/button/createButtonModes.ts +5 -0
- package/src/theme/build/_deprecated/color/button/createButtonTones.ts +5 -0
- package/src/theme/build/_deprecated/color/card/createCardStates.ts +6 -0
- package/src/theme/build/_deprecated/color/color.test.ts +5 -1
- package/src/theme/build/_deprecated/color/defaults.ts +1 -0
- package/src/theme/build/_deprecated/color/factory.ts +36 -0
- package/src/theme/build/_deprecated/color/input/createInputModes.ts +5 -0
- package/src/theme/build/_deprecated/color/muted/createMuted.ts +4 -0
- package/src/theme/build/_deprecated/color/spot/createSpot.ts +3 -0
- package/src/theme/build/buildColorTheme.test.ts +2 -0
- package/src/theme/build/buildColorTheme.ts +8 -0
- package/src/theme/build/buildTheme.test.ts +2 -0
- package/src/theme/build/lib/color-fns/color-fns.test.ts +3 -1
- package/src/theme/build/merge.ts +5 -0
- package/src/theme/build/mixThemeColor.test.ts +2 -0
- package/src/theme/build/renderColorTheme.ts +6 -0
- package/src/theme/build/renderColorValue.ts +0 -2
- package/src/theme/build/resolveColorTokens.ts +6 -0
- package/src/theme/build/theme.test.ts +2 -0
- package/src/theme/config/helpers.ts +5 -0
- package/src/theme/config/system.ts +2 -0
- package/src/theme/config/tokens/color/types.ts +6 -4
- package/src/theme/config/tokens/parseTokenKey.test.ts +2 -0
- package/src/theme/config/tokens/parseTokenValue.test.ts +2 -0
- package/src/theme/config/tokens/parseTokenValue.ts +1 -0
- package/src/theme/getScopedTheme.ts +6 -1
- package/src/theme/system/color/_helpers.ts +4 -0
- package/src/theme/system/theme.ts +4 -0
- package/src/theme/system/v0/color/_system.ts +1 -0
- package/src/theme/system/v0/color/button.ts +14 -0
- package/src/theme/system/v0/color/card.ts +6 -0
- package/src/theme/system/v0/color/color.ts +11 -0
- package/src/theme/system/v0/color/input.ts +6 -0
- package/src/theme/system/v0/color/muted.ts +11 -0
- package/src/theme/system/v0/color/selectable.ts +11 -0
- package/src/theme/system/v0/color/solid.ts +11 -0
- package/src/theme/system/v0/color/spot.ts +1 -0
- package/src/theme/versioning/getTheme_v2.ts +15 -0
- package/src/theme/versioning/themeColor_v0_v2.ts +7 -0
- package/src/theme/versioning/themeColor_v2_v2_9.ts +1 -0
- package/src/theme/versioning/v0_v2.ts +13 -1
- package/src/theme/versioning/v2_v0.ts +18 -0
- package/dist/_chunks-cjs/_visual-editing.js +0 -5899
- package/dist/_chunks-cjs/_visual-editing.js.map +0 -1
- package/dist/_chunks-cjs/refractor.js +0 -23
- package/dist/_chunks-cjs/refractor.js.map +0 -1
- package/dist/_chunks-es/_visual-editing.mjs +0 -5905
- package/dist/_chunks-es/_visual-editing.mjs.map +0 -1
- package/dist/_chunks-es/refractor.mjs +0 -26
- package/dist/_chunks-es/refractor.mjs.map +0 -1
- package/dist/_visual-editing.js.map +0 -1
- package/dist/_visual-editing.mjs.map +0 -1
- package/dist/index.js.map +0 -1
- package/dist/theme.js.map +0 -1
- package/dist/theme.mjs.map +0 -1
- package/src/core/__workshop__/constants.ts +0 -293
- package/src/core/components/autocomplete/__mocks__/apiStore.ts +0 -49
- package/src/core/components/autocomplete/__mocks__/countries.ts +0 -245
- package/src/core/components/autocomplete/__workshop__/async.tsx +0 -156
- package/src/core/components/autocomplete/__workshop__/constrainedHeight.tsx +0 -137
- package/src/core/components/autocomplete/__workshop__/custom.tsx +0 -89
- package/src/core/components/autocomplete/__workshop__/example.tsx +0 -79
- package/src/core/components/autocomplete/__workshop__/focusAndBlur.tsx +0 -36
- package/src/core/components/autocomplete/__workshop__/fullscreen.tsx +0 -294
- package/src/core/components/autocomplete/__workshop__/index.ts +0 -39
- package/src/core/components/autocomplete/__workshop__/types.ts +0 -4
- package/src/core/components/breadcrumbs/__workshop__/example.tsx +0 -62
- package/src/core/components/breadcrumbs/__workshop__/index.ts +0 -14
- package/src/core/components/dialog/__workshop__/activate.tsx +0 -134
- package/src/core/components/dialog/__workshop__/autoFocus.tsx +0 -29
- package/src/core/components/dialog/__workshop__/index.ts +0 -19
- package/src/core/components/dialog/__workshop__/layering.tsx +0 -41
- package/src/core/components/dialog/__workshop__/nested.tsx +0 -72
- package/src/core/components/dialog/__workshop__/onScroll.tsx +0 -39
- package/src/core/components/dialog/__workshop__/panes.tsx +0 -82
- package/src/core/components/dialog/__workshop__/position.tsx +0 -30
- package/src/core/components/dialog/__workshop__/props.tsx +0 -75
- package/src/core/components/dialog/__workshop__/provider.tsx +0 -11
- package/src/core/components/dialog/__workshop__/wrapped.tsx +0 -76
- package/src/core/components/hotkeys/__workshop__/index.ts +0 -14
- package/src/core/components/hotkeys/__workshop__/plain.tsx +0 -9
- package/src/core/components/menu/__workshop__/asComponent.tsx +0 -45
- package/src/core/components/menu/__workshop__/avatarMenu.tsx +0 -51
- package/src/core/components/menu/__workshop__/closableMenuButton.tsx +0 -46
- package/src/core/components/menu/__workshop__/constrainedInBoundary.tsx +0 -134
- package/src/core/components/menu/__workshop__/customMenuItem.tsx +0 -45
- package/src/core/components/menu/__workshop__/customSelectedState.tsx +0 -39
- package/src/core/components/menu/__workshop__/disableFocusOnClose.tsx +0 -40
- package/src/core/components/menu/__workshop__/groups.tsx +0 -156
- package/src/core/components/menu/__workshop__/index.ts +0 -89
- package/src/core/components/menu/__workshop__/menuButton.tsx +0 -80
- package/src/core/components/menu/__workshop__/menuGroupRight.tsx +0 -65
- package/src/core/components/menu/__workshop__/nestedMenu.tsx +0 -22
- package/src/core/components/menu/__workshop__/onCloseMenuButton.tsx +0 -41
- package/src/core/components/menu/__workshop__/selectedItem.tsx +0 -69
- package/src/core/components/menu/__workshop__/shouldFocus.tsx +0 -47
- package/src/core/components/menu/__workshop__/tones.tsx +0 -25
- package/src/core/components/menu/__workshop__/withoutArrow.tsx +0 -32
- package/src/core/components/skeleton/__workshop__/delay.tsx +0 -70
- package/src/core/components/skeleton/__workshop__/index.ts +0 -11
- package/src/core/components/skeleton/__workshop__/skeleton.tsx +0 -64
- package/src/core/components/tab/__workshop__/example.tsx +0 -79
- package/src/core/components/tab/__workshop__/index.ts +0 -14
- package/src/core/components/toast/__workshop__/hook.tsx +0 -71
- package/src/core/components/toast/__workshop__/index.ts +0 -19
- package/src/core/components/toast/__workshop__/toast.tsx +0 -26
- package/src/core/components/tree/__workshop__/basic.perf.ts +0 -19
- package/src/core/components/tree/__workshop__/basic.tsx +0 -105
- package/src/core/components/tree/__workshop__/index.ts +0 -21
- package/src/core/components/tree/__workshop__/tabFromElement.tsx +0 -84
- package/src/core/hooks/useElementRect/__workshop__/example.tsx +0 -32
- package/src/core/hooks/useElementRect/__workshop__/index.ts +0 -14
- package/src/core/hooks/useMediaIndex/__workshop__/index.ts +0 -14
- package/src/core/hooks/useMediaIndex/__workshop__/test.tsx +0 -14
- package/src/core/primitives/avatar/__workshop__/asButton.tsx +0 -14
- package/src/core/primitives/avatar/__workshop__/index.ts +0 -29
- package/src/core/primitives/avatar/__workshop__/stack.tsx +0 -25
- package/src/core/primitives/avatar/__workshop__/withinButton.tsx +0 -63
- package/src/core/primitives/avatar/__workshop__/withinMenuItem.tsx +0 -70
- package/src/core/primitives/badge/__workshop__/index.ts +0 -19
- package/src/core/primitives/badge/__workshop__/props.tsx +0 -30
- package/src/core/primitives/badge/__workshop__/tones.tsx +0 -21
- package/src/core/primitives/box/__workshop__/asComponent.tsx +0 -31
- package/src/core/primitives/box/__workshop__/index.ts +0 -24
- package/src/core/primitives/box/__workshop__/props.tsx +0 -20
- package/src/core/primitives/box/__workshop__/responsive.tsx +0 -20
- package/src/core/primitives/button/__workshop__/custom.tsx +0 -51
- package/src/core/primitives/button/__workshop__/customIcons.tsx +0 -30
- package/src/core/primitives/button/__workshop__/disabled.tsx +0 -74
- package/src/core/primitives/button/__workshop__/index.ts +0 -59
- package/src/core/primitives/button/__workshop__/mixedChildren.tsx +0 -12
- package/src/core/primitives/button/__workshop__/props.tsx +0 -55
- package/src/core/primitives/button/__workshop__/sanityUploadButton.tsx +0 -36
- package/src/core/primitives/button/__workshop__/stacked.tsx +0 -58
- package/src/core/primitives/button/__workshop__/styled1.tsx +0 -17
- package/src/core/primitives/button/__workshop__/styled2.tsx +0 -19
- package/src/core/primitives/button/__workshop__/uploadButton.tsx +0 -28
- package/src/core/primitives/card/__workshop__/allTones.tsx +0 -25
- package/src/core/primitives/card/__workshop__/asButton.tsx +0 -107
- package/src/core/primitives/card/__workshop__/asComponent.tsx +0 -27
- package/src/core/primitives/card/__workshop__/checkered.tsx +0 -26
- package/src/core/primitives/card/__workshop__/index.ts +0 -18
- package/src/core/primitives/card/__workshop__/interactive.tsx +0 -30
- package/src/core/primitives/card/__workshop__/listNavigation.tsx +0 -80
- package/src/core/primitives/card/__workshop__/props.tsx +0 -53
- package/src/core/primitives/card/__workshop__/selected.tsx +0 -94
- package/src/core/primitives/card/__workshop__/styled.tsx +0 -14
- package/src/core/primitives/checkbox/__workshop__/example.tsx +0 -25
- package/src/core/primitives/checkbox/__workshop__/index.ts +0 -13
- package/src/core/primitives/checkbox/__workshop__/props.tsx +0 -33
- package/src/core/primitives/checkbox/__workshop__/readOnly.tsx +0 -16
- package/src/core/primitives/checkbox/__workshop__/tones.tsx +0 -28
- package/src/core/primitives/code/__workshop__/index.ts +0 -19
- package/src/core/primitives/code/__workshop__/opticalAlignment.tsx +0 -48
- package/src/core/primitives/code/__workshop__/props.tsx +0 -21
- package/src/core/primitives/container/__workshop__/example.tsx +0 -20
- package/src/core/primitives/container/__workshop__/index.ts +0 -8
- package/src/core/primitives/flex/__workshop__/example.tsx +0 -34
- package/src/core/primitives/flex/__workshop__/gap.tsx +0 -25
- package/src/core/primitives/flex/__workshop__/index.ts +0 -11
- package/src/core/primitives/grid/__workshop__/index.ts +0 -10
- package/src/core/primitives/grid/__workshop__/responsive.tsx +0 -54
- package/src/core/primitives/heading/__workshop__/index.ts +0 -19
- package/src/core/primitives/heading/__workshop__/opticalAlignment.tsx +0 -54
- package/src/core/primitives/heading/__workshop__/plain.tsx +0 -32
- package/src/core/primitives/inline/__workshop__/index.ts +0 -8
- package/src/core/primitives/inline/__workshop__/plain.tsx +0 -27
- package/src/core/primitives/kbd/__workshop__/index.ts +0 -8
- package/src/core/primitives/kbd/__workshop__/plain.tsx +0 -9
- package/src/core/primitives/label/__workshop__/index.ts +0 -19
- package/src/core/primitives/label/__workshop__/opticalAlignment.tsx +0 -48
- package/src/core/primitives/label/__workshop__/plain.tsx +0 -24
- package/src/core/primitives/popover/__workshop__/AlignedStory.tsx +0 -77
- package/src/core/primitives/popover/__workshop__/MarginsStory.tsx +0 -31
- package/src/core/primitives/popover/__workshop__/MatchReferenceWidthStory.tsx +0 -32
- package/src/core/primitives/popover/__workshop__/OpenOnMountStory.tsx +0 -11
- package/src/core/primitives/popover/__workshop__/PlainStory.tsx +0 -71
- package/src/core/primitives/popover/__workshop__/RecursiveStory.tsx +0 -71
- package/src/core/primitives/popover/__workshop__/SidePanelStory.tsx +0 -89
- package/src/core/primitives/popover/__workshop__/TestStory.tsx +0 -97
- package/src/core/primitives/popover/__workshop__/index.ts +0 -49
- package/src/core/primitives/radio/__workshop__/example.tsx +0 -63
- package/src/core/primitives/radio/__workshop__/index.ts +0 -11
- package/src/core/primitives/radio/__workshop__/plain.tsx +0 -28
- package/src/core/primitives/select/__workshop__/index.ts +0 -11
- package/src/core/primitives/select/__workshop__/plain.tsx +0 -27
- package/src/core/primitives/select/__workshop__/readOnly.tsx +0 -23
- package/src/core/primitives/spinner/__workshop__/Props.tsx +0 -15
- package/src/core/primitives/spinner/__workshop__/index.ts +0 -14
- package/src/core/primitives/stack/__workshop__/index.ts +0 -14
- package/src/core/primitives/stack/__workshop__/plain.tsx +0 -32
- package/src/core/primitives/switch/__workshop__/example.tsx +0 -23
- package/src/core/primitives/switch/__workshop__/index.ts +0 -11
- package/src/core/primitives/switch/__workshop__/props.tsx +0 -21
- package/src/core/primitives/text/__workshop__/colored.tsx +0 -30
- package/src/core/primitives/text/__workshop__/example.tsx +0 -39
- package/src/core/primitives/text/__workshop__/index.ts +0 -24
- package/src/core/primitives/text/__workshop__/opticalAlignment.tsx +0 -48
- package/src/core/primitives/textArea/__workshop__/index.ts +0 -14
- package/src/core/primitives/textArea/__workshop__/plain.tsx +0 -50
- package/src/core/primitives/textInput/__workshop__/clearButton.tsx +0 -30
- package/src/core/primitives/textInput/__workshop__/customValidity.tsx +0 -17
- package/src/core/primitives/textInput/__workshop__/index.ts +0 -44
- package/src/core/primitives/textInput/__workshop__/plain.tsx +0 -98
- package/src/core/primitives/textInput/__workshop__/readOnly.tsx +0 -9
- package/src/core/primitives/textInput/__workshop__/states.tsx +0 -53
- package/src/core/primitives/textInput/__workshop__/tones.tsx +0 -277
- package/src/core/primitives/textInput/__workshop__/typed.tsx +0 -23
- package/src/core/primitives/tooltip/__workshop__/customPortal.tsx +0 -102
- package/src/core/primitives/tooltip/__workshop__/index.ts +0 -29
- package/src/core/primitives/tooltip/__workshop__/overflowingBoundary.tsx +0 -74
- package/src/core/primitives/tooltip/__workshop__/props.tsx +0 -107
- package/src/core/primitives/tooltip/__workshop__/resizableBoundary.tsx +0 -86
- package/src/core/theme/__workshop__/build/Root.tsx +0 -367
- package/src/core/theme/__workshop__/build/helpers.ts +0 -46
- package/src/core/theme/__workshop__/build/story.tsx +0 -465
- package/src/core/theme/__workshop__/canvas.tsx +0 -352
- package/src/core/theme/__workshop__/color.tsx +0 -62
- package/src/core/theme/__workshop__/debug/story.tsx +0 -408
- package/src/core/theme/__workshop__/index.ts +0 -39
- package/src/core/theme/__workshop__/layer.tsx +0 -78
- package/src/core/theme/__workshop__/nestedProvider.tsx +0 -15
- package/src/core/utils/boundaryElement/__workshop__/index.ts +0 -14
- package/src/core/utils/boundaryElement/__workshop__/plain.tsx +0 -19
- package/src/core/utils/elementQuery/__workshop__/customMedia.tsx +0 -30
- package/src/core/utils/elementQuery/__workshop__/index.ts +0 -14
- package/src/core/utils/layer/__workshop__/_debug.tsx +0 -17
- package/src/core/utils/layer/__workshop__/index.ts +0 -24
- package/src/core/utils/layer/__workshop__/multipleRoots.tsx +0 -49
- package/src/core/utils/layer/__workshop__/nested.tsx +0 -98
- package/src/core/utils/layer/__workshop__/responsiveZOffset.tsx +0 -13
- package/src/core/utils/portal/__workshop__/index.ts +0 -14
- package/src/core/utils/portal/__workshop__/named.tsx +0 -63
- package/src/core/utils/virtualList/__workshop__/changingProps.tsx +0 -36
- package/src/core/utils/virtualList/__workshop__/elementScroll.tsx +0 -24
- package/src/core/utils/virtualList/__workshop__/index.ts +0 -29
- package/src/core/utils/virtualList/__workshop__/infiniteList.tsx +0 -48
- package/src/core/utils/virtualList/__workshop__/windowScrolll.tsx +0 -22
|
@@ -0,0 +1,1451 @@
|
|
|
1
|
+
import { Ct as BaseTheme$1, Dt as Theme_v2, Et as Theme$1, Hn as ThemeColorSchemeKey$1, In as ThemeColorAvatarColorKey, Qt as ThemeColorToneKey, Rn as ThemeColorButtonModeKey$1, St as createColorTheme$1, Wn as ThemeColorStateToneKey, c as parseColor$1, cn as ThemeFontSize$1, d as rgbToHex$1, dn as ThemeFonts$1, f as rgbToHsl$1, g as multiply$1, gn as ThemeColorSyntax$1, h as screen$1, in as ThemeLayer$1, l as hexToRgb$1, ln as ThemeFontWeight$1, nn as ThemeBoxShadow, on as ThemeFont$1, rn as ThemeShadow$1, s as rgba$1, sn as ThemeFontKey$1, tn as ThemeStyles, u as hslToRgb$1, un as ThemeFontWeightKey$1, v as HSL$1, wt as RootTheme$1, y as RGB$1, zn as ThemeColorCardToneKey } from "./theme.js";
|
|
2
|
+
import { Component, HTMLProps, PropsWithChildren, Ref } from "react";
|
|
3
|
+
/**
|
|
4
|
+
* @public
|
|
5
|
+
* @deprecated Use `BaseTheme` from `@sanity/ui/theme` instead.
|
|
6
|
+
*/
|
|
7
|
+
type BaseTheme = BaseTheme$1;
|
|
8
|
+
/**
|
|
9
|
+
* @public
|
|
10
|
+
* @deprecated Use `ThemeBoxShadow` from `@sanity/ui/theme` instead.
|
|
11
|
+
*/
|
|
12
|
+
type BoxShadow = ThemeBoxShadow;
|
|
13
|
+
/**
|
|
14
|
+
* @public
|
|
15
|
+
* @deprecated Use `HSL` from `@sanity/ui/theme` instead.
|
|
16
|
+
*/
|
|
17
|
+
type HSL = HSL$1;
|
|
18
|
+
/**
|
|
19
|
+
* @public
|
|
20
|
+
* @deprecated Use `RGB` from `@sanity/ui/theme` instead.
|
|
21
|
+
*/
|
|
22
|
+
type RGB = RGB$1;
|
|
23
|
+
/**
|
|
24
|
+
* @public
|
|
25
|
+
* @deprecated Use `RootTheme` from `@sanity/ui/theme` instead.
|
|
26
|
+
*/
|
|
27
|
+
type RootTheme = RootTheme$1;
|
|
28
|
+
/**
|
|
29
|
+
* @public
|
|
30
|
+
* @deprecated Use `ThemeStyles` from `@sanity/ui/theme` instead.
|
|
31
|
+
*/
|
|
32
|
+
type Styles = ThemeStyles;
|
|
33
|
+
/**
|
|
34
|
+
* @public
|
|
35
|
+
* @deprecated Use `Theme` from `@sanity/ui/theme` instead.
|
|
36
|
+
*/
|
|
37
|
+
type Theme = Theme$1;
|
|
38
|
+
/**
|
|
39
|
+
* @public
|
|
40
|
+
* @deprecated Use `ThemeColorButtonModeKey` from `@sanity/ui/theme` instead.
|
|
41
|
+
*/
|
|
42
|
+
type ThemeColorButtonModeKey = ThemeColorButtonModeKey$1;
|
|
43
|
+
/**
|
|
44
|
+
* @public
|
|
45
|
+
* @deprecated Use `ThemeColorSchemeKey` from `@sanity/ui/theme` instead.
|
|
46
|
+
*/
|
|
47
|
+
type ThemeColorSchemeKey = ThemeColorSchemeKey$1;
|
|
48
|
+
/**
|
|
49
|
+
* @public
|
|
50
|
+
* @deprecated Use `ThemeColorSyntax` from `@sanity/ui/theme` instead.
|
|
51
|
+
*/
|
|
52
|
+
type ThemeColorSyntax = ThemeColorSyntax$1;
|
|
53
|
+
/**
|
|
54
|
+
* @public
|
|
55
|
+
* @deprecated Use `ThemeFont` from `@sanity/ui/theme` instead.
|
|
56
|
+
*/
|
|
57
|
+
type ThemeFont = ThemeFont$1;
|
|
58
|
+
/**
|
|
59
|
+
* @public
|
|
60
|
+
* @deprecated Use `ThemeFontKey` from `@sanity/ui/theme` instead.
|
|
61
|
+
*/
|
|
62
|
+
type ThemeFontKey = ThemeFontKey$1;
|
|
63
|
+
/**
|
|
64
|
+
* @public
|
|
65
|
+
* @deprecated Use `ThemeFontSize` from `@sanity/ui/theme` instead.
|
|
66
|
+
*/
|
|
67
|
+
type ThemeFontSize = ThemeFontSize$1;
|
|
68
|
+
/**
|
|
69
|
+
* @public
|
|
70
|
+
* @deprecated Use `ThemeFontWeight` from `@sanity/ui/theme` instead.
|
|
71
|
+
*/
|
|
72
|
+
type ThemeFontWeight = ThemeFontWeight$1;
|
|
73
|
+
/**
|
|
74
|
+
* @public
|
|
75
|
+
* @deprecated Use `ThemeFontWeightKey` from `@sanity/ui/theme` instead.
|
|
76
|
+
*/
|
|
77
|
+
type ThemeFontWeightKey = ThemeFontWeightKey$1;
|
|
78
|
+
/**
|
|
79
|
+
* @public
|
|
80
|
+
* @deprecated Use `ThemeFonts` from `@sanity/ui/theme` instead.
|
|
81
|
+
*/
|
|
82
|
+
type ThemeFonts = ThemeFonts$1;
|
|
83
|
+
/**
|
|
84
|
+
* @public
|
|
85
|
+
* @deprecated Use `ThemeLayer` from `@sanity/ui/theme` instead.
|
|
86
|
+
*/
|
|
87
|
+
type ThemeLayer = ThemeLayer$1;
|
|
88
|
+
/**
|
|
89
|
+
* @public
|
|
90
|
+
* @deprecated Use `ThemeShadow` from `@sanity/ui/theme` instead.
|
|
91
|
+
*/
|
|
92
|
+
type ThemeShadow = ThemeShadow$1;
|
|
93
|
+
/**
|
|
94
|
+
* @public
|
|
95
|
+
* @deprecated Use `createColorTheme` from `@sanity/ui/theme` instead.
|
|
96
|
+
*/
|
|
97
|
+
declare const createColorTheme: typeof createColorTheme$1;
|
|
98
|
+
/**
|
|
99
|
+
* @public
|
|
100
|
+
* @deprecated Use `hexToRgb` from `@sanity/ui/theme` instead.
|
|
101
|
+
*/
|
|
102
|
+
declare const hexToRgb: typeof hexToRgb$1;
|
|
103
|
+
/**
|
|
104
|
+
* @public
|
|
105
|
+
* @deprecated Use `hslToRgb` from `@sanity/ui/theme` instead.
|
|
106
|
+
*/
|
|
107
|
+
declare const hslToRgb: typeof hslToRgb$1;
|
|
108
|
+
/**
|
|
109
|
+
* @public
|
|
110
|
+
* @deprecated Use `multiply` from `@sanity/ui/theme` instead.
|
|
111
|
+
*/
|
|
112
|
+
declare const multiply: typeof multiply$1;
|
|
113
|
+
/**
|
|
114
|
+
* @public
|
|
115
|
+
* @deprecated Use `parseColor` from `@sanity/ui/theme` instead.
|
|
116
|
+
*/
|
|
117
|
+
declare const parseColor: typeof parseColor$1;
|
|
118
|
+
/**
|
|
119
|
+
* @public
|
|
120
|
+
* @deprecated Use `rgbToHex` from `@sanity/ui/theme` instead.
|
|
121
|
+
*/
|
|
122
|
+
declare const rgbToHex: typeof rgbToHex$1;
|
|
123
|
+
/**
|
|
124
|
+
* @public
|
|
125
|
+
* @deprecated Use `rgbToHsl` from `@sanity/ui/theme` instead.
|
|
126
|
+
*/
|
|
127
|
+
declare const rgbToHsl: typeof rgbToHsl$1;
|
|
128
|
+
/**
|
|
129
|
+
* @public
|
|
130
|
+
* @deprecated Use `rgba` from `@sanity/ui/theme` instead.
|
|
131
|
+
*/
|
|
132
|
+
declare const rgba: typeof rgba$1;
|
|
133
|
+
/**
|
|
134
|
+
* @public
|
|
135
|
+
* @deprecated Use `screen` from `@sanity/ui/theme` instead.
|
|
136
|
+
*/
|
|
137
|
+
declare const screen: typeof screen$1;
|
|
138
|
+
/**
|
|
139
|
+
* @public
|
|
140
|
+
* @deprecated Use `buildTheme` from `@sanity/ui/theme` instead.
|
|
141
|
+
*/
|
|
142
|
+
declare const studioTheme: BaseTheme$1;
|
|
143
|
+
/**
|
|
144
|
+
* @public
|
|
145
|
+
*/
|
|
146
|
+
type AvatarPosition = 'top' | 'bottom' | 'inside';
|
|
147
|
+
/**
|
|
148
|
+
* @public
|
|
149
|
+
*/
|
|
150
|
+
type AvatarSize = 0 | 1 | 2 | 3;
|
|
151
|
+
/**
|
|
152
|
+
* @public
|
|
153
|
+
*/
|
|
154
|
+
type AvatarStatus = 'online' | 'editing' | 'inactive';
|
|
155
|
+
/**
|
|
156
|
+
* @public
|
|
157
|
+
* @deprecated No longer used
|
|
158
|
+
*/
|
|
159
|
+
type BadgeMode = 'default' | 'outline';
|
|
160
|
+
/**
|
|
161
|
+
* @public
|
|
162
|
+
*/
|
|
163
|
+
type BadgeTone = ThemeColorStateToneKey;
|
|
164
|
+
/**
|
|
165
|
+
* @public
|
|
166
|
+
*/
|
|
167
|
+
type BoxSizing = 'content' | 'border';
|
|
168
|
+
/**
|
|
169
|
+
* @public
|
|
170
|
+
*/
|
|
171
|
+
type BoxDisplay = 'none' | 'block' | 'grid' | 'flex' | 'inline-block';
|
|
172
|
+
/**
|
|
173
|
+
* @public
|
|
174
|
+
*/
|
|
175
|
+
type BoxHeight = 'stretch' | 'fill';
|
|
176
|
+
/**
|
|
177
|
+
* @public
|
|
178
|
+
*/
|
|
179
|
+
type BoxOverflow = 'visible' | 'hidden' | 'auto';
|
|
180
|
+
/**
|
|
181
|
+
* @public
|
|
182
|
+
*/
|
|
183
|
+
type ButtonMode = ThemeColorButtonModeKey$1;
|
|
184
|
+
/**
|
|
185
|
+
* @public
|
|
186
|
+
*/
|
|
187
|
+
type ButtonTextAlign = 'left' | 'right' | 'center';
|
|
188
|
+
/**
|
|
189
|
+
* @public
|
|
190
|
+
*/
|
|
191
|
+
type ButtonTone = ThemeColorStateToneKey;
|
|
192
|
+
/**
|
|
193
|
+
* @public
|
|
194
|
+
*/
|
|
195
|
+
type ButtonWidth = 'fill';
|
|
196
|
+
/**
|
|
197
|
+
* @public
|
|
198
|
+
*/
|
|
199
|
+
type CardTone = ThemeColorCardToneKey | 'inherit';
|
|
200
|
+
/**
|
|
201
|
+
* Assign properties from `U` to `T`, excluding properties that already exist in `T`.
|
|
202
|
+
*
|
|
203
|
+
* @public
|
|
204
|
+
*/
|
|
205
|
+
type Assign<T extends object, U extends object> = Omit<T, keyof U> & U;
|
|
206
|
+
/** @public */
|
|
207
|
+
type EmptyProps = object;
|
|
208
|
+
/** @public */
|
|
209
|
+
type TagType = keyof React.JSX.IntrinsicElements;
|
|
210
|
+
/** @public */
|
|
211
|
+
type ComponentType<P = any> = React.FunctionComponent<P> | React.ComponentClass<P> | React.ExoticComponent<P>;
|
|
212
|
+
/** @public */
|
|
213
|
+
type ElementType$1<P = any> = TagType | ComponentType<P>;
|
|
214
|
+
/**
|
|
215
|
+
* Resolves the props of a polymorphic component: the props of the element/component passed to `as`
|
|
216
|
+
* (defaulting to the component's own element), with the component's own props assigned on top.
|
|
217
|
+
*
|
|
218
|
+
* @public
|
|
219
|
+
*/
|
|
220
|
+
type Props<P extends EmptyProps, E extends ElementType$1<P>> = Assign<E extends TagType ? React.JSX.IntrinsicElements[E] : React.ComponentProps<E>, P & {
|
|
221
|
+
as?: E;
|
|
222
|
+
}>;
|
|
223
|
+
/**
|
|
224
|
+
* @public
|
|
225
|
+
*/
|
|
226
|
+
type DialogPosition = 'absolute' | 'fixed';
|
|
227
|
+
/**
|
|
228
|
+
* @public
|
|
229
|
+
*/
|
|
230
|
+
type FlexAlign = 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
|
|
231
|
+
/**
|
|
232
|
+
* @public
|
|
233
|
+
*/
|
|
234
|
+
type FlexDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
|
|
235
|
+
/**
|
|
236
|
+
* @public
|
|
237
|
+
*/
|
|
238
|
+
type FlexJustify = 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
|
|
239
|
+
/**
|
|
240
|
+
* @public
|
|
241
|
+
*/
|
|
242
|
+
type FlexValue = number | 'none' | 'auto' | 'initial';
|
|
243
|
+
/**
|
|
244
|
+
* @public
|
|
245
|
+
*/
|
|
246
|
+
type FlexWrap = 'wrap' | 'wrap-reverse' | 'nowrap';
|
|
247
|
+
/**
|
|
248
|
+
* @public
|
|
249
|
+
*/
|
|
250
|
+
type GridAutoRows = 'auto' | 'min' | 'max' | 'fr';
|
|
251
|
+
/**
|
|
252
|
+
* @public
|
|
253
|
+
*/
|
|
254
|
+
type GridAutoCols = 'auto' | 'min' | 'max' | 'fr';
|
|
255
|
+
/**
|
|
256
|
+
* @public
|
|
257
|
+
*/
|
|
258
|
+
type GridAutoFlow = 'row' | 'column' | 'row dense' | 'column dense';
|
|
259
|
+
/**
|
|
260
|
+
* @public
|
|
261
|
+
*/
|
|
262
|
+
type GridItemColumn = 'auto' | 'full' | number;
|
|
263
|
+
/**
|
|
264
|
+
* @public
|
|
265
|
+
*/
|
|
266
|
+
type GridItemColumnStart = 'auto' | number;
|
|
267
|
+
/**
|
|
268
|
+
* @public
|
|
269
|
+
*/
|
|
270
|
+
type GridItemColumnEnd = 'auto' | number;
|
|
271
|
+
/**
|
|
272
|
+
* @public
|
|
273
|
+
*/
|
|
274
|
+
type GridItemRow = 'auto' | 'full' | number;
|
|
275
|
+
/**
|
|
276
|
+
* @public
|
|
277
|
+
*/
|
|
278
|
+
type GridItemRowStart = 'auto' | number;
|
|
279
|
+
/**
|
|
280
|
+
* @public
|
|
281
|
+
*/
|
|
282
|
+
type GridItemRowEnd = 'auto' | number;
|
|
283
|
+
/**
|
|
284
|
+
* Placement of floating UI elements.
|
|
285
|
+
*
|
|
286
|
+
* @public
|
|
287
|
+
*/
|
|
288
|
+
type Placement = 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
|
|
289
|
+
/**
|
|
290
|
+
* @beta
|
|
291
|
+
*/
|
|
292
|
+
type PopoverMargins = [number, number, number, number];
|
|
293
|
+
/**
|
|
294
|
+
* @public
|
|
295
|
+
*/
|
|
296
|
+
type Radius = number | 'full';
|
|
297
|
+
/**
|
|
298
|
+
* @public
|
|
299
|
+
*/
|
|
300
|
+
type SelectableTone = ThemeColorStateToneKey;
|
|
301
|
+
/**
|
|
302
|
+
* @public
|
|
303
|
+
*/
|
|
304
|
+
type TextAlign = 'left' | 'right' | 'center' | 'justify' | 'initial';
|
|
305
|
+
/**
|
|
306
|
+
* @public
|
|
307
|
+
*/
|
|
308
|
+
interface HotkeysProps {
|
|
309
|
+
fontSize?: number | number[];
|
|
310
|
+
gap?: number | number[];
|
|
311
|
+
padding?: number | number[];
|
|
312
|
+
radius?: Radius | Radius[];
|
|
313
|
+
/**
|
|
314
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
315
|
+
*/
|
|
316
|
+
space?: number | number[];
|
|
317
|
+
keys?: string[];
|
|
318
|
+
}
|
|
319
|
+
/**
|
|
320
|
+
* Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
|
|
321
|
+
*
|
|
322
|
+
* @public
|
|
323
|
+
*/
|
|
324
|
+
declare const Hotkeys: import("react").ForwardRefExoticComponent<HotkeysProps & Omit<import("react").HTMLProps<HTMLElement>, "as" | "size" | "ref"> & import("react").RefAttributes<HTMLElement>>;
|
|
325
|
+
/**
|
|
326
|
+
* @public
|
|
327
|
+
*/
|
|
328
|
+
interface ResponsiveBorderProps {
|
|
329
|
+
border?: boolean | boolean[];
|
|
330
|
+
borderTop?: boolean | boolean[];
|
|
331
|
+
borderRight?: boolean | boolean[];
|
|
332
|
+
borderBottom?: boolean | boolean[];
|
|
333
|
+
borderLeft?: boolean | boolean[];
|
|
334
|
+
}
|
|
335
|
+
/**
|
|
336
|
+
* @public
|
|
337
|
+
*/
|
|
338
|
+
interface ResponsiveBoxProps {
|
|
339
|
+
display?: BoxDisplay | BoxDisplay[];
|
|
340
|
+
height?: BoxHeight | BoxHeight[];
|
|
341
|
+
overflow?: BoxOverflow | BoxOverflow[];
|
|
342
|
+
sizing?: BoxSizing | BoxSizing[];
|
|
343
|
+
}
|
|
344
|
+
/**
|
|
345
|
+
* @public
|
|
346
|
+
*/
|
|
347
|
+
interface ResponsiveFlexProps {
|
|
348
|
+
align?: FlexAlign | FlexAlign[];
|
|
349
|
+
direction?: FlexDirection | FlexDirection[];
|
|
350
|
+
justify?: FlexJustify | FlexJustify[];
|
|
351
|
+
wrap?: FlexWrap | FlexWrap[];
|
|
352
|
+
}
|
|
353
|
+
/**
|
|
354
|
+
* @public
|
|
355
|
+
*/
|
|
356
|
+
interface ResponsiveFlexItemProps {
|
|
357
|
+
/** Sets the flex CSS attribute. The property is responsive. */
|
|
358
|
+
flex?: FlexValue | FlexValue[];
|
|
359
|
+
}
|
|
360
|
+
/**
|
|
361
|
+
* @public
|
|
362
|
+
*/
|
|
363
|
+
interface ResponsiveGridProps {
|
|
364
|
+
autoRows?: GridAutoRows | GridAutoRows[];
|
|
365
|
+
autoCols?: GridAutoCols | GridAutoCols[];
|
|
366
|
+
autoFlow?: GridAutoFlow | GridAutoFlow[];
|
|
367
|
+
/**
|
|
368
|
+
* @deprecated Use `gridTemplateColumns` instead. `columns` will be removed in v4.
|
|
369
|
+
*/
|
|
370
|
+
columns?: number | number[];
|
|
371
|
+
gridTemplateColumns?: number | number[];
|
|
372
|
+
gap?: number | number[];
|
|
373
|
+
gapX?: number | number[];
|
|
374
|
+
gapY?: number | number[];
|
|
375
|
+
/**
|
|
376
|
+
* @deprecated Use `gridTemplateRows` instead. `rows` will be removed in v4.
|
|
377
|
+
*/
|
|
378
|
+
rows?: number | number[];
|
|
379
|
+
gridTemplateRows?: number | number[];
|
|
380
|
+
}
|
|
381
|
+
/**
|
|
382
|
+
* @public
|
|
383
|
+
*/
|
|
384
|
+
interface ResponsiveGridItemProps {
|
|
385
|
+
gridColumn?: GridItemColumn | GridItemColumn[];
|
|
386
|
+
/**
|
|
387
|
+
* @deprecated Use `gridColumn` instead. `column` will be removed in v4.
|
|
388
|
+
*/
|
|
389
|
+
column?: GridItemColumn | GridItemColumn[];
|
|
390
|
+
gridColumnStart?: GridItemColumnStart | GridItemColumnStart[];
|
|
391
|
+
/**
|
|
392
|
+
* @deprecated Use `gridColumnStart` instead. `columnStart` will be removed in v4.
|
|
393
|
+
*/
|
|
394
|
+
columnStart?: GridItemColumnStart | GridItemColumnStart[];
|
|
395
|
+
gridColumnEnd?: GridItemColumnEnd | GridItemColumnEnd[];
|
|
396
|
+
/**
|
|
397
|
+
* @deprecated Use `gridColumnEnd` instead. `columnEnd` will be removed in v4.
|
|
398
|
+
*/
|
|
399
|
+
columnEnd?: GridItemColumnEnd | GridItemColumnEnd[];
|
|
400
|
+
gridRow?: GridItemRow | GridItemRow[];
|
|
401
|
+
/**
|
|
402
|
+
* @deprecated Use `gridRow` instead. `row` will be removed in v4.
|
|
403
|
+
*/
|
|
404
|
+
row?: GridItemRow | GridItemRow[];
|
|
405
|
+
gridRowStart?: GridItemRowStart | GridItemRowStart[];
|
|
406
|
+
/**
|
|
407
|
+
* @deprecated Use `gridRowStart` instead. `rowStart` will be removed in v4.
|
|
408
|
+
*/
|
|
409
|
+
rowStart?: GridItemRowStart | GridItemRowStart[];
|
|
410
|
+
gridRowEnd?: GridItemRowEnd | GridItemRowEnd[];
|
|
411
|
+
/**
|
|
412
|
+
* @deprecated Use `gridRowEnd` instead. `rowEnd` will be removed in v4.
|
|
413
|
+
*/
|
|
414
|
+
rowEnd?: GridItemRowEnd | GridItemRowEnd[];
|
|
415
|
+
}
|
|
416
|
+
/**
|
|
417
|
+
* @public
|
|
418
|
+
*/
|
|
419
|
+
interface ResponsiveMarginProps {
|
|
420
|
+
/** Applies margins to all sides. The property is responsive. */
|
|
421
|
+
margin?: number | number[];
|
|
422
|
+
/** Applies margins to the left and right sides. The property is responsive. */
|
|
423
|
+
marginX?: number | number[];
|
|
424
|
+
/** Applies margins to the top and bottom sides. The property is responsive. */
|
|
425
|
+
marginY?: number | number[];
|
|
426
|
+
marginTop?: number | number[];
|
|
427
|
+
marginRight?: number | number[];
|
|
428
|
+
marginBottom?: number | number[];
|
|
429
|
+
marginLeft?: number | number[];
|
|
430
|
+
}
|
|
431
|
+
/**
|
|
432
|
+
* @public
|
|
433
|
+
*/
|
|
434
|
+
interface ResponsivePaddingProps {
|
|
435
|
+
padding?: number | number[];
|
|
436
|
+
paddingX?: number | number[];
|
|
437
|
+
paddingY?: number | number[];
|
|
438
|
+
paddingTop?: number | number[];
|
|
439
|
+
paddingRight?: number | number[];
|
|
440
|
+
paddingBottom?: number | number[];
|
|
441
|
+
paddingLeft?: number | number[];
|
|
442
|
+
}
|
|
443
|
+
/**
|
|
444
|
+
* @public
|
|
445
|
+
*/
|
|
446
|
+
interface ResponsiveRadiusProps {
|
|
447
|
+
radius?: Radius | Radius[];
|
|
448
|
+
}
|
|
449
|
+
/**
|
|
450
|
+
* @public
|
|
451
|
+
*/
|
|
452
|
+
interface ResponsiveShadowProps {
|
|
453
|
+
shadow?: number | number[];
|
|
454
|
+
}
|
|
455
|
+
/**
|
|
456
|
+
* @public
|
|
457
|
+
*/
|
|
458
|
+
interface ResponsiveWidthProps {
|
|
459
|
+
width?: number | 'auto' | (number | 'auto')[];
|
|
460
|
+
}
|
|
461
|
+
/**
|
|
462
|
+
* @public
|
|
463
|
+
*/
|
|
464
|
+
type Delay = number | Partial<{
|
|
465
|
+
open: number;
|
|
466
|
+
close: number;
|
|
467
|
+
}>;
|
|
468
|
+
/**
|
|
469
|
+
* @public
|
|
470
|
+
*/
|
|
471
|
+
interface MenuProps extends ResponsivePaddingProps {
|
|
472
|
+
/**
|
|
473
|
+
* @deprecated Use `shouldFocus="first"` instead.
|
|
474
|
+
*/
|
|
475
|
+
'focusFirst'?: boolean;
|
|
476
|
+
/**
|
|
477
|
+
* @deprecated Use `shouldFocus="last"` instead.
|
|
478
|
+
*/
|
|
479
|
+
'focusLast'?: boolean;
|
|
480
|
+
'onClickOutside'?: (event: MouseEvent) => void;
|
|
481
|
+
'onEscape'?: () => void;
|
|
482
|
+
'onItemClick'?: () => void;
|
|
483
|
+
'onItemSelect'?: (index: number) => void;
|
|
484
|
+
'originElement'?: HTMLElement | null;
|
|
485
|
+
'registerElement'?: (el: HTMLElement) => () => void;
|
|
486
|
+
'shouldFocus'?: 'first' | 'last' | null;
|
|
487
|
+
'gap'?: number | number[];
|
|
488
|
+
/**
|
|
489
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
490
|
+
*/
|
|
491
|
+
'space'?: number | number[];
|
|
492
|
+
'aria-labelledby'?: string;
|
|
493
|
+
'onBlurCapture'?: (event: FocusEvent) => void;
|
|
494
|
+
}
|
|
495
|
+
/**
|
|
496
|
+
* The `Menu` component is a building block for application menus.
|
|
497
|
+
*
|
|
498
|
+
* @public
|
|
499
|
+
*/
|
|
500
|
+
declare const Menu: import("react").ForwardRefExoticComponent<Omit<MenuProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "height" | "tabIndex" | "role">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
501
|
+
/**
|
|
502
|
+
* @public
|
|
503
|
+
*/
|
|
504
|
+
type MenuDividerProps<E extends ElementType$1 = 'hr'> = Props<EmptyProps, E>;
|
|
505
|
+
/**
|
|
506
|
+
* @public
|
|
507
|
+
*/
|
|
508
|
+
declare const MenuDivider: <E extends ElementType$1 = "hr">(props: MenuDividerProps<E>) => React.JSX.Element;
|
|
509
|
+
/**
|
|
510
|
+
* @public
|
|
511
|
+
*/
|
|
512
|
+
interface AvatarOwnProps {
|
|
513
|
+
/** @beta */
|
|
514
|
+
__unstable_hideInnerStroke?: boolean;
|
|
515
|
+
animateArrowFrom?: AvatarPosition;
|
|
516
|
+
arrowPosition?: AvatarPosition;
|
|
517
|
+
color?: ThemeColorAvatarColorKey;
|
|
518
|
+
initials?: string;
|
|
519
|
+
onImageLoadError?: (event: Error) => void;
|
|
520
|
+
size?: AvatarSize | AvatarSize[];
|
|
521
|
+
src?: string;
|
|
522
|
+
/**
|
|
523
|
+
* The status of the entity this Avatar represents.
|
|
524
|
+
* @alpha
|
|
525
|
+
*/
|
|
526
|
+
status?: AvatarStatus;
|
|
527
|
+
title?: string;
|
|
528
|
+
}
|
|
529
|
+
/**
|
|
530
|
+
* @public
|
|
531
|
+
*/
|
|
532
|
+
type AvatarProps<E extends ElementType$1 = 'div'> = Props<AvatarOwnProps, E>;
|
|
533
|
+
/**
|
|
534
|
+
* Avatars are used to represent people and other agents (e.g. bots).
|
|
535
|
+
*
|
|
536
|
+
* @public
|
|
537
|
+
*/
|
|
538
|
+
declare const Avatar: <E extends ElementType$1 = "div">(props: AvatarProps<E>) => React.JSX.Element;
|
|
539
|
+
/**
|
|
540
|
+
* @public
|
|
541
|
+
*/
|
|
542
|
+
interface AvatarCounterProps {
|
|
543
|
+
count: number;
|
|
544
|
+
size?: AvatarSize | AvatarSize[];
|
|
545
|
+
/** @deprecated No longer supported. */
|
|
546
|
+
tone?: 'navbar';
|
|
547
|
+
}
|
|
548
|
+
/**
|
|
549
|
+
* @public
|
|
550
|
+
*/
|
|
551
|
+
declare const AvatarCounter: import("react").ForwardRefExoticComponent<AvatarCounterProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
552
|
+
/**
|
|
553
|
+
* @public
|
|
554
|
+
*/
|
|
555
|
+
interface AvatarStackProps {
|
|
556
|
+
children: React.ReactNode;
|
|
557
|
+
maxLength?: number;
|
|
558
|
+
size?: AvatarSize | AvatarSize[];
|
|
559
|
+
/** @deprecated No longer supported. */
|
|
560
|
+
tone?: 'navbar';
|
|
561
|
+
}
|
|
562
|
+
/**
|
|
563
|
+
* @public
|
|
564
|
+
*/
|
|
565
|
+
declare const AvatarStack: import("react").ForwardRefExoticComponent<AvatarStackProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
566
|
+
/**
|
|
567
|
+
* @internal
|
|
568
|
+
*/
|
|
569
|
+
interface AvatarRootStyleProps {
|
|
570
|
+
$color: ThemeColorAvatarColorKey;
|
|
571
|
+
}
|
|
572
|
+
/**
|
|
573
|
+
* @internal
|
|
574
|
+
*/
|
|
575
|
+
interface ResponsiveAvatarSizeStyleProps {
|
|
576
|
+
$size: AvatarSize[];
|
|
577
|
+
}
|
|
578
|
+
/**
|
|
579
|
+
* The props that `Box` adds on top of the element it renders as.
|
|
580
|
+
*
|
|
581
|
+
* @public
|
|
582
|
+
*/
|
|
583
|
+
interface BoxOwnProps extends ResponsiveFlexItemProps, ResponsiveBoxProps, ResponsiveGridItemProps, ResponsiveMarginProps, ResponsivePaddingProps {
|
|
584
|
+
forwardedAs?: ElementType$1;
|
|
585
|
+
}
|
|
586
|
+
/**
|
|
587
|
+
* @public
|
|
588
|
+
*/
|
|
589
|
+
type BoxProps<E extends ElementType$1 = 'div'> = Props<BoxOwnProps, E>;
|
|
590
|
+
/**
|
|
591
|
+
* The `Box` component is a basic layout wrapper component which provides utility properties
|
|
592
|
+
* for flex, margins and padding.
|
|
593
|
+
*
|
|
594
|
+
* @public
|
|
595
|
+
*/
|
|
596
|
+
declare const Box: <E extends ElementType$1 = "div">(props: BoxProps<E>) => React.JSX.Element;
|
|
597
|
+
/**
|
|
598
|
+
* @public
|
|
599
|
+
*/
|
|
600
|
+
interface BadgeOwnProps extends BoxOwnProps, ResponsiveRadiusProps {
|
|
601
|
+
fontSize?: number | number[];
|
|
602
|
+
/** @deprecated No longer used. */
|
|
603
|
+
mode?: BadgeMode;
|
|
604
|
+
tone?: BadgeTone;
|
|
605
|
+
}
|
|
606
|
+
/**
|
|
607
|
+
* @public
|
|
608
|
+
*/
|
|
609
|
+
type BadgeProps<E extends ElementType$1 = 'div'> = Props<BadgeOwnProps, E>;
|
|
610
|
+
/**
|
|
611
|
+
* Badges are used to tag resources.
|
|
612
|
+
*
|
|
613
|
+
* @public
|
|
614
|
+
*/
|
|
615
|
+
declare const Badge: <E extends ElementType$1 = "div">(props: BadgeProps<E>) => React.JSX.Element;
|
|
616
|
+
/**
|
|
617
|
+
* @public
|
|
618
|
+
*/
|
|
619
|
+
interface ButtonOwnProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
|
|
620
|
+
fontSize?: number | number[];
|
|
621
|
+
mode?: ButtonMode;
|
|
622
|
+
icon?: React.ElementType | React.ReactNode;
|
|
623
|
+
iconRight?: React.ElementType | React.ReactNode;
|
|
624
|
+
justify?: FlexJustify | FlexJustify[];
|
|
625
|
+
/**
|
|
626
|
+
* @beta Do not use in production, as this might change.
|
|
627
|
+
*/
|
|
628
|
+
loading?: boolean;
|
|
629
|
+
selected?: boolean;
|
|
630
|
+
/**
|
|
631
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
632
|
+
*/
|
|
633
|
+
space?: number | number[];
|
|
634
|
+
gap?: number | number[];
|
|
635
|
+
muted?: boolean;
|
|
636
|
+
text?: React.ReactNode;
|
|
637
|
+
textAlign?: ButtonTextAlign;
|
|
638
|
+
textWeight?: ThemeFontWeightKey$1;
|
|
639
|
+
tone?: ButtonTone;
|
|
640
|
+
type?: 'button' | 'reset' | 'submit';
|
|
641
|
+
width?: ButtonWidth;
|
|
642
|
+
}
|
|
643
|
+
/**
|
|
644
|
+
* @public
|
|
645
|
+
*/
|
|
646
|
+
type ButtonProps<E extends ElementType$1 = 'button'> = Props<ButtonOwnProps, E>;
|
|
647
|
+
/**
|
|
648
|
+
* @public
|
|
649
|
+
*/
|
|
650
|
+
declare const Button: <E extends ElementType$1 = "button">(props: ButtonProps<E>) => React.JSX.Element;
|
|
651
|
+
/**
|
|
652
|
+
* @public
|
|
653
|
+
*/
|
|
654
|
+
interface CardOwnProps extends BoxOwnProps, ResponsiveBorderProps, ResponsiveRadiusProps, ResponsiveShadowProps {
|
|
655
|
+
/**
|
|
656
|
+
* Do not use in production.
|
|
657
|
+
* @beta
|
|
658
|
+
*/
|
|
659
|
+
__unstable_checkered?: boolean;
|
|
660
|
+
/**
|
|
661
|
+
* Do not use in production.
|
|
662
|
+
* @beta
|
|
663
|
+
*/
|
|
664
|
+
__unstable_focusRing?: boolean;
|
|
665
|
+
disabled?: boolean;
|
|
666
|
+
muted?: boolean;
|
|
667
|
+
pressed?: boolean;
|
|
668
|
+
scheme?: ThemeColorSchemeKey$1;
|
|
669
|
+
selected?: boolean;
|
|
670
|
+
tone?: CardTone;
|
|
671
|
+
}
|
|
672
|
+
/**
|
|
673
|
+
* @public
|
|
674
|
+
*/
|
|
675
|
+
type CardProps<E extends ElementType$1 = 'div'> = Props<CardOwnProps, E>;
|
|
676
|
+
/**
|
|
677
|
+
* The `Card` component acts much like a `Box`, but with a background and foreground color.
|
|
678
|
+
* Components within a `Card` inherit its colors.
|
|
679
|
+
*
|
|
680
|
+
* @public
|
|
681
|
+
*/
|
|
682
|
+
declare const Card: <E extends ElementType$1 = "div">(props: CardProps<E>) => React.JSX.Element;
|
|
683
|
+
/**
|
|
684
|
+
* @internal
|
|
685
|
+
*/
|
|
686
|
+
interface CardStyleProps {
|
|
687
|
+
$checkered: boolean;
|
|
688
|
+
$focusRing: boolean;
|
|
689
|
+
$muted: boolean;
|
|
690
|
+
$tone: ThemeColorToneKey;
|
|
691
|
+
}
|
|
692
|
+
/**
|
|
693
|
+
* @public
|
|
694
|
+
*/
|
|
695
|
+
interface CodeOwnProps {
|
|
696
|
+
/** Define the language to use for syntax highlighting. */
|
|
697
|
+
language?: string;
|
|
698
|
+
size?: number | number[];
|
|
699
|
+
weight?: string;
|
|
700
|
+
}
|
|
701
|
+
/**
|
|
702
|
+
* @public
|
|
703
|
+
*/
|
|
704
|
+
type CodeProps<E extends ElementType$1 = 'pre'> = Props<CodeOwnProps, E>;
|
|
705
|
+
/**
|
|
706
|
+
* @public
|
|
707
|
+
*/
|
|
708
|
+
declare const Code: <E extends ElementType$1 = "pre">(props: CodeProps<E>) => React.JSX.Element;
|
|
709
|
+
/**
|
|
710
|
+
* @public
|
|
711
|
+
*/
|
|
712
|
+
interface ContainerOwnProps extends BoxOwnProps, ResponsiveWidthProps {}
|
|
713
|
+
/**
|
|
714
|
+
* @public
|
|
715
|
+
*/
|
|
716
|
+
type ContainerProps<E extends ElementType$1 = 'div'> = Props<ContainerOwnProps, E>;
|
|
717
|
+
/**
|
|
718
|
+
* The `Container` component wraps content layout in a defined set of widths.
|
|
719
|
+
*
|
|
720
|
+
* @public
|
|
721
|
+
*/
|
|
722
|
+
declare const Container: <E extends ElementType$1 = "div">(props: ContainerProps<E>) => React.JSX.Element;
|
|
723
|
+
/**
|
|
724
|
+
* @internal
|
|
725
|
+
*/
|
|
726
|
+
interface ResponsiveWidthStyleProps {
|
|
727
|
+
$width: (number | 'auto')[];
|
|
728
|
+
}
|
|
729
|
+
/**
|
|
730
|
+
* @public
|
|
731
|
+
*/
|
|
732
|
+
interface FlexOwnProps extends Omit<BoxOwnProps, 'display'>, ResponsiveFlexProps, ResponsiveFlexItemProps {
|
|
733
|
+
gap?: number | number[];
|
|
734
|
+
}
|
|
735
|
+
/**
|
|
736
|
+
* @public
|
|
737
|
+
*/
|
|
738
|
+
type FlexProps<E extends ElementType$1 = 'div'> = Props<FlexOwnProps, E>;
|
|
739
|
+
/**
|
|
740
|
+
* The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).
|
|
741
|
+
*
|
|
742
|
+
* @public
|
|
743
|
+
*/
|
|
744
|
+
declare const Flex: <E extends ElementType$1 = "div">(props: FlexProps<E>) => React.JSX.Element;
|
|
745
|
+
/**
|
|
746
|
+
* @public
|
|
747
|
+
*/
|
|
748
|
+
interface GridOwnProps extends Omit<BoxOwnProps, 'display'>, ResponsiveGridProps {}
|
|
749
|
+
/**
|
|
750
|
+
* @public
|
|
751
|
+
*/
|
|
752
|
+
type GridProps<E extends ElementType$1 = 'div'> = Props<GridOwnProps, E>;
|
|
753
|
+
/**
|
|
754
|
+
* The `Grid` component is for building 2-dimensional layers (based on CSS grid).
|
|
755
|
+
*
|
|
756
|
+
* @public
|
|
757
|
+
*/
|
|
758
|
+
declare const Grid: <E extends ElementType$1 = "div">(props: GridProps<E>) => React.JSX.Element;
|
|
759
|
+
/**
|
|
760
|
+
* @public
|
|
761
|
+
*/
|
|
762
|
+
interface HeadingOwnProps {
|
|
763
|
+
accent?: boolean;
|
|
764
|
+
align?: TextAlign | TextAlign[];
|
|
765
|
+
muted?: boolean;
|
|
766
|
+
size?: number | number[];
|
|
767
|
+
/**
|
|
768
|
+
* Controls how overflowing text is treated.
|
|
769
|
+
* Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
|
|
770
|
+
* @beta
|
|
771
|
+
*/
|
|
772
|
+
textOverflow?: 'ellipsis';
|
|
773
|
+
weight?: ThemeFontWeightKey$1;
|
|
774
|
+
}
|
|
775
|
+
/**
|
|
776
|
+
* @public
|
|
777
|
+
*/
|
|
778
|
+
type HeadingProps<E extends ElementType$1 = 'div'> = Props<HeadingOwnProps, E>;
|
|
779
|
+
/**
|
|
780
|
+
* Typographic headings.
|
|
781
|
+
*
|
|
782
|
+
* @public
|
|
783
|
+
*/
|
|
784
|
+
declare const Heading: <E extends ElementType$1 = "div">(props: HeadingProps<E>) => React.JSX.Element;
|
|
785
|
+
/**
|
|
786
|
+
* @public
|
|
787
|
+
*/
|
|
788
|
+
interface InlineOwnProps extends Omit<BoxOwnProps, 'display'> {
|
|
789
|
+
/**
|
|
790
|
+
* The spacing between children.
|
|
791
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
792
|
+
*/
|
|
793
|
+
space?: number | number[];
|
|
794
|
+
/** The spacing between children. */
|
|
795
|
+
gap?: number | number[];
|
|
796
|
+
}
|
|
797
|
+
/**
|
|
798
|
+
* @public
|
|
799
|
+
*/
|
|
800
|
+
type InlineProps<E extends ElementType$1 = 'div'> = Props<InlineOwnProps, E>;
|
|
801
|
+
/**
|
|
802
|
+
* The `Inline` component is a layout utility for aligning and spacing items horizontally.
|
|
803
|
+
*
|
|
804
|
+
* @public
|
|
805
|
+
*/
|
|
806
|
+
declare const Inline: <E extends ElementType$1 = "div">(props: InlineProps<E>) => React.JSX.Element;
|
|
807
|
+
/**
|
|
808
|
+
* @public
|
|
809
|
+
*/
|
|
810
|
+
interface KBDOwnProps {
|
|
811
|
+
fontSize?: number | number[];
|
|
812
|
+
padding?: number | number[];
|
|
813
|
+
radius?: Radius | Radius[];
|
|
814
|
+
}
|
|
815
|
+
/**
|
|
816
|
+
* @public
|
|
817
|
+
*/
|
|
818
|
+
type KBDProps<E extends ElementType$1 = 'kbd'> = Props<KBDOwnProps, E>;
|
|
819
|
+
/**
|
|
820
|
+
* Used to define some text as keyboard input.
|
|
821
|
+
*
|
|
822
|
+
* @public
|
|
823
|
+
*/
|
|
824
|
+
declare const KBD: <E extends ElementType$1 = "kbd">(props: KBDProps<E>) => React.JSX.Element;
|
|
825
|
+
/**
|
|
826
|
+
* @public
|
|
827
|
+
*/
|
|
828
|
+
interface LabelOwnProps {
|
|
829
|
+
accent?: boolean;
|
|
830
|
+
align?: TextAlign | TextAlign[];
|
|
831
|
+
muted?: boolean;
|
|
832
|
+
size?: number | number[];
|
|
833
|
+
/**
|
|
834
|
+
* Controls how overflowing text is treated.
|
|
835
|
+
* Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
|
|
836
|
+
* @beta
|
|
837
|
+
*/
|
|
838
|
+
textOverflow?: 'ellipsis';
|
|
839
|
+
weight?: ThemeFontWeightKey$1;
|
|
840
|
+
}
|
|
841
|
+
/**
|
|
842
|
+
* @public
|
|
843
|
+
*/
|
|
844
|
+
type LabelProps<E extends ElementType$1 = 'div'> = Props<LabelOwnProps, E>;
|
|
845
|
+
/**
|
|
846
|
+
* Typographic labels.
|
|
847
|
+
*
|
|
848
|
+
* @public
|
|
849
|
+
*/
|
|
850
|
+
declare const Label: <E extends ElementType$1 = "div">(props: LabelProps<E>) => React.JSX.Element;
|
|
851
|
+
/** @internal */
|
|
852
|
+
declare const Arrow: import("react").ForwardRefExoticComponent<Omit<{
|
|
853
|
+
width: number;
|
|
854
|
+
height: number;
|
|
855
|
+
radius?: number;
|
|
856
|
+
} & Omit<HTMLProps<HTMLDivElement>, "height" | "width">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
857
|
+
/**
|
|
858
|
+
* DO NOT USE IN PRODUCTION
|
|
859
|
+
* @beta
|
|
860
|
+
*/
|
|
861
|
+
type ErrorBoundaryProps = PropsWithChildren<{
|
|
862
|
+
onCatch: (params: {
|
|
863
|
+
error: Error;
|
|
864
|
+
info: React.ErrorInfo;
|
|
865
|
+
}) => void;
|
|
866
|
+
}>;
|
|
867
|
+
/**
|
|
868
|
+
* DO NOT USE IN PRODUCTION
|
|
869
|
+
* @beta
|
|
870
|
+
*/
|
|
871
|
+
interface ErrorBoundaryState {
|
|
872
|
+
error: Error | null;
|
|
873
|
+
}
|
|
874
|
+
/**
|
|
875
|
+
* DO NOT USE IN PRODUCTION
|
|
876
|
+
* @beta
|
|
877
|
+
*/
|
|
878
|
+
declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
|
|
879
|
+
state: ErrorBoundaryState;
|
|
880
|
+
static getDerivedStateFromError(error: Error): ErrorBoundaryState;
|
|
881
|
+
componentDidCatch(error: Error, info: React.ErrorInfo): void;
|
|
882
|
+
render(): React.ReactNode;
|
|
883
|
+
}
|
|
884
|
+
/**
|
|
885
|
+
* @public
|
|
886
|
+
*/
|
|
887
|
+
interface LayerProps {
|
|
888
|
+
as?: React.ElementType | keyof React.JSX.IntrinsicElements;
|
|
889
|
+
/** A callback that fires when the layer becomes the top layer when it was not the top layer before. */
|
|
890
|
+
onActivate?: (props: {
|
|
891
|
+
activeElement: HTMLElement | null;
|
|
892
|
+
}) => void;
|
|
893
|
+
zOffset?: number | number[];
|
|
894
|
+
}
|
|
895
|
+
/**
|
|
896
|
+
* @public
|
|
897
|
+
*/
|
|
898
|
+
declare const Layer: import("react").ForwardRefExoticComponent<Omit<LayerProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
899
|
+
/**
|
|
900
|
+
* @public
|
|
901
|
+
*/
|
|
902
|
+
interface LayerProviderProps {
|
|
903
|
+
children?: React.ReactNode;
|
|
904
|
+
zOffset?: number | number[];
|
|
905
|
+
}
|
|
906
|
+
/**
|
|
907
|
+
* @public
|
|
908
|
+
*/
|
|
909
|
+
declare function LayerProvider(props: LayerProviderProps): React.JSX.Element;
|
|
910
|
+
declare namespace LayerProvider {
|
|
911
|
+
var displayName: string;
|
|
912
|
+
}
|
|
913
|
+
/**
|
|
914
|
+
* @public
|
|
915
|
+
*/
|
|
916
|
+
interface PortalProps {
|
|
917
|
+
children: React.ReactNode;
|
|
918
|
+
/**
|
|
919
|
+
* @beta This API might change. DO NOT USE IN PRODUCTION.
|
|
920
|
+
*/
|
|
921
|
+
__unstable_name?: string;
|
|
922
|
+
}
|
|
923
|
+
/**
|
|
924
|
+
* @public
|
|
925
|
+
*/
|
|
926
|
+
declare function Portal(props: PortalProps): React.ReactPortal | null;
|
|
927
|
+
declare namespace Portal {
|
|
928
|
+
var displayName: string;
|
|
929
|
+
}
|
|
930
|
+
/**
|
|
931
|
+
* @public
|
|
932
|
+
*/
|
|
933
|
+
interface PortalProviderProps {
|
|
934
|
+
/**
|
|
935
|
+
* @deprecated Use `<BoundaryElementProvider element={...} />` instead
|
|
936
|
+
*/
|
|
937
|
+
boundaryElement?: HTMLElement | null;
|
|
938
|
+
children: React.ReactNode;
|
|
939
|
+
element?: HTMLElement | null;
|
|
940
|
+
/**
|
|
941
|
+
* @beta
|
|
942
|
+
*/
|
|
943
|
+
__unstable_elements?: Record<string, HTMLElement | null | undefined>;
|
|
944
|
+
}
|
|
945
|
+
/**
|
|
946
|
+
* @public
|
|
947
|
+
*/
|
|
948
|
+
declare function PortalProvider(props: PortalProviderProps): React.JSX.Element;
|
|
949
|
+
declare namespace PortalProvider {
|
|
950
|
+
var displayName: string;
|
|
951
|
+
}
|
|
952
|
+
/**
|
|
953
|
+
* @beta
|
|
954
|
+
*/
|
|
955
|
+
interface VirtualListChangeOpts {
|
|
956
|
+
fromIndex: number;
|
|
957
|
+
gap: number;
|
|
958
|
+
itemHeight: number;
|
|
959
|
+
scrollHeight: number;
|
|
960
|
+
scrollTop: number;
|
|
961
|
+
toIndex: number;
|
|
962
|
+
}
|
|
963
|
+
/**
|
|
964
|
+
* @beta
|
|
965
|
+
*/
|
|
966
|
+
interface VirtualListProps<Item = any> {
|
|
967
|
+
as?: React.ElementType | keyof React.JSX.IntrinsicElements;
|
|
968
|
+
gap?: number;
|
|
969
|
+
getItemKey?: (item: Item, itemIndex: number) => string;
|
|
970
|
+
items?: Item[];
|
|
971
|
+
onChange?: (opts: VirtualListChangeOpts) => void;
|
|
972
|
+
renderItem?: (item: Item) => React.ReactNode;
|
|
973
|
+
}
|
|
974
|
+
/**
|
|
975
|
+
* @beta
|
|
976
|
+
*/
|
|
977
|
+
declare const VirtualList: import("react").ForwardRefExoticComponent<VirtualListProps<any> & StackOwnProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "children" | "onChange" | "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
978
|
+
/** @beta */
|
|
979
|
+
type PopoverUpdateCallback = () => void;
|
|
980
|
+
/** @public */
|
|
981
|
+
type PopoverWidth = number | 'auto';
|
|
982
|
+
/** @public */
|
|
983
|
+
interface PopoverProps extends Omit<LayerProps, 'as'>, ResponsiveRadiusProps, ResponsiveShadowProps {
|
|
984
|
+
/** @beta */
|
|
985
|
+
__unstable_margins?: PopoverMargins;
|
|
986
|
+
/**
|
|
987
|
+
* Whether the popover should animate in and out.
|
|
988
|
+
*
|
|
989
|
+
* @beta
|
|
990
|
+
* @defaultValue false
|
|
991
|
+
*/
|
|
992
|
+
animate?: boolean;
|
|
993
|
+
arrow?: boolean;
|
|
994
|
+
/** @deprecated Use `floatingBoundary` and/or `referenceBoundary` instead */
|
|
995
|
+
boundaryElement?: HTMLElement | null;
|
|
996
|
+
children?: React.JSX.Element;
|
|
997
|
+
/**
|
|
998
|
+
* When `true`, prevent overflow within the current boundary:
|
|
999
|
+
* - by flipping on its side axis
|
|
1000
|
+
* - by resizing
|
|
1001
|
+
/*
|
|
1002
|
+
* Note that:
|
|
1003
|
+
* - setting `preventOverflow` to `true` also prevents overflow on its side axis
|
|
1004
|
+
* - setting `matchReferenceWidth` to `true` also causes the popover to resize
|
|
1005
|
+
*
|
|
1006
|
+
* @defaultValue false
|
|
1007
|
+
*/
|
|
1008
|
+
constrainSize?: boolean;
|
|
1009
|
+
content?: React.ReactNode;
|
|
1010
|
+
disabled?: boolean;
|
|
1011
|
+
fallbackPlacements?: Placement[];
|
|
1012
|
+
floatingBoundary?: HTMLElement | null;
|
|
1013
|
+
/**
|
|
1014
|
+
* When `true`, set the maximum width to match the reference element, and also prevent overflow within
|
|
1015
|
+
* the current boundary by resizing.
|
|
1016
|
+
*
|
|
1017
|
+
* Note that setting `constrainSize` to `true` also causes the popover to resize
|
|
1018
|
+
*
|
|
1019
|
+
* @defaultValue false
|
|
1020
|
+
*/
|
|
1021
|
+
matchReferenceWidth?: boolean;
|
|
1022
|
+
/**
|
|
1023
|
+
* When true, blocks all pointer interaction with elements beneath the popover until closed.
|
|
1024
|
+
*
|
|
1025
|
+
* @beta
|
|
1026
|
+
* @defaultValue false
|
|
1027
|
+
*/
|
|
1028
|
+
modal?: boolean;
|
|
1029
|
+
open?: boolean;
|
|
1030
|
+
overflow?: BoxOverflow;
|
|
1031
|
+
padding?: number | number[];
|
|
1032
|
+
placement?: Placement;
|
|
1033
|
+
/**
|
|
1034
|
+
* When 'flip' (default), the placement is determined from the initial placement and the
|
|
1035
|
+
* fallback placements in order. Whichever fits in the viewport first.
|
|
1036
|
+
*
|
|
1037
|
+
* When 'autoPlacement', the initial placement and all fallback placements are evaluated
|
|
1038
|
+
* and the placement with the most viewport space available.
|
|
1039
|
+
*
|
|
1040
|
+
* Option is only relevant if either `constrainSize` or `preventOverflow` is `true`
|
|
1041
|
+
*/
|
|
1042
|
+
placementStrategy?: 'flip' | 'autoPlacement';
|
|
1043
|
+
/** Whether or not to render the popover in a portal element. */
|
|
1044
|
+
portal?: boolean | string;
|
|
1045
|
+
preventOverflow?: boolean;
|
|
1046
|
+
referenceBoundary?: HTMLElement | null;
|
|
1047
|
+
/**
|
|
1048
|
+
* When defined, the popover will be positioned relative to this element.
|
|
1049
|
+
* The children of the popover won't be rendered.
|
|
1050
|
+
*/
|
|
1051
|
+
referenceElement?: HTMLElement | null;
|
|
1052
|
+
scheme?: ThemeColorSchemeKey$1;
|
|
1053
|
+
tone?: CardTone;
|
|
1054
|
+
/** @beta */
|
|
1055
|
+
updateRef?: Ref<PopoverUpdateCallback | undefined>;
|
|
1056
|
+
width?: PopoverWidth | PopoverWidth[];
|
|
1057
|
+
}
|
|
1058
|
+
/**
|
|
1059
|
+
* The `Popover` component is used to display some content on top of another.
|
|
1060
|
+
*
|
|
1061
|
+
* @public
|
|
1062
|
+
*/
|
|
1063
|
+
declare const Popover: import("react").ForwardRefExoticComponent<Omit<PopoverProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "width" | "content" | "children">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
1064
|
+
/**
|
|
1065
|
+
* @public
|
|
1066
|
+
*/
|
|
1067
|
+
interface SelectProps {
|
|
1068
|
+
fontSize?: number | number[];
|
|
1069
|
+
gap?: number | number[];
|
|
1070
|
+
padding?: number | number[];
|
|
1071
|
+
radius?: Radius | Radius[];
|
|
1072
|
+
/**
|
|
1073
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
1074
|
+
*/
|
|
1075
|
+
space?: number | number[];
|
|
1076
|
+
customValidity?: string;
|
|
1077
|
+
}
|
|
1078
|
+
/**
|
|
1079
|
+
* The `Select` component provides control of options.
|
|
1080
|
+
*
|
|
1081
|
+
* @public
|
|
1082
|
+
*/
|
|
1083
|
+
declare const Select: import("react").ForwardRefExoticComponent<Omit<SelectProps & Omit<import("react").HTMLProps<HTMLSelectElement>, "as">, "ref"> & import("react").RefAttributes<HTMLSelectElement>>;
|
|
1084
|
+
/**
|
|
1085
|
+
* @public
|
|
1086
|
+
*/
|
|
1087
|
+
interface SpinnerProps {
|
|
1088
|
+
muted?: boolean;
|
|
1089
|
+
size?: number | number[];
|
|
1090
|
+
}
|
|
1091
|
+
/**
|
|
1092
|
+
* Indicate that something is loading for an indeterminate amount of time.
|
|
1093
|
+
*
|
|
1094
|
+
* @public
|
|
1095
|
+
*/
|
|
1096
|
+
declare const Spinner: import("react").ForwardRefExoticComponent<Omit<SpinnerProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "size">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
1097
|
+
/**
|
|
1098
|
+
* @public
|
|
1099
|
+
*/
|
|
1100
|
+
interface StackOwnProps extends BoxOwnProps {
|
|
1101
|
+
gap?: number | number[];
|
|
1102
|
+
/**
|
|
1103
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
1104
|
+
*/
|
|
1105
|
+
space?: number | number[];
|
|
1106
|
+
}
|
|
1107
|
+
/**
|
|
1108
|
+
* @public
|
|
1109
|
+
*/
|
|
1110
|
+
type StackProps<E extends ElementType$1 = 'div'> = Props<StackOwnProps, E>;
|
|
1111
|
+
/**
|
|
1112
|
+
* The `Stack` component is used to place elements on top of each other.
|
|
1113
|
+
*
|
|
1114
|
+
* @public
|
|
1115
|
+
*/
|
|
1116
|
+
declare const Stack: <E extends ElementType$1 = "div">(props: StackProps<E>) => React.JSX.Element;
|
|
1117
|
+
/**
|
|
1118
|
+
* @public
|
|
1119
|
+
*/
|
|
1120
|
+
interface TextOwnProps {
|
|
1121
|
+
accent?: boolean;
|
|
1122
|
+
align?: TextAlign | TextAlign[];
|
|
1123
|
+
/** When `true` the text color will be muted. */
|
|
1124
|
+
muted?: boolean;
|
|
1125
|
+
size?: number | number[];
|
|
1126
|
+
/**
|
|
1127
|
+
* Controls how overflowing text is treated.
|
|
1128
|
+
* Use `textOverflow="ellipsis"` to render text as a single line which is concatenated with a `…` symbol.
|
|
1129
|
+
* @beta
|
|
1130
|
+
*/
|
|
1131
|
+
textOverflow?: 'ellipsis';
|
|
1132
|
+
weight?: ThemeFontWeightKey$1;
|
|
1133
|
+
}
|
|
1134
|
+
/**
|
|
1135
|
+
* @public
|
|
1136
|
+
*/
|
|
1137
|
+
type TextProps<E extends ElementType$1 = 'div'> = Props<TextOwnProps, E>;
|
|
1138
|
+
/**
|
|
1139
|
+
* The `Text` component is an agile, themed typographic element.
|
|
1140
|
+
*
|
|
1141
|
+
* @public
|
|
1142
|
+
*/
|
|
1143
|
+
declare const Text: <E extends ElementType$1 = "div">(props: TextProps<E>) => React.JSX.Element;
|
|
1144
|
+
/**
|
|
1145
|
+
* @public
|
|
1146
|
+
*/
|
|
1147
|
+
interface TextAreaProps extends ResponsiveRadiusProps {
|
|
1148
|
+
/**
|
|
1149
|
+
* @beta
|
|
1150
|
+
*/
|
|
1151
|
+
__unstable_disableFocusRing?: boolean;
|
|
1152
|
+
border?: boolean;
|
|
1153
|
+
customValidity?: string;
|
|
1154
|
+
fontSize?: number | number[];
|
|
1155
|
+
padding?: number | number[];
|
|
1156
|
+
weight?: ThemeFontWeightKey$1;
|
|
1157
|
+
}
|
|
1158
|
+
/**
|
|
1159
|
+
* A multiline text input.
|
|
1160
|
+
*
|
|
1161
|
+
|
|
1162
|
+
* @public
|
|
1163
|
+
*/
|
|
1164
|
+
declare const TextArea: import("react").ForwardRefExoticComponent<Omit<TextAreaProps & Omit<import("react").HTMLProps<HTMLTextAreaElement>, "as">, "ref"> & import("react").RefAttributes<HTMLTextAreaElement>>;
|
|
1165
|
+
/**
|
|
1166
|
+
* @public
|
|
1167
|
+
*/
|
|
1168
|
+
type TextInputClearButtonProps = ButtonOwnProps & Omit<React.HTMLProps<HTMLButtonElement>, 'as' | 'onClick' | 'onMouseDown' | 'ref'>;
|
|
1169
|
+
/**
|
|
1170
|
+
* @public
|
|
1171
|
+
*/
|
|
1172
|
+
type TextInputType = 'search' | 'date' | 'datetime-local' | 'email' | 'url' | 'month' | 'number' | 'password' | 'tel' | 'time' | 'text' | 'week' | 'color';
|
|
1173
|
+
/**
|
|
1174
|
+
* @public
|
|
1175
|
+
*/
|
|
1176
|
+
interface TextInputProps {
|
|
1177
|
+
/**
|
|
1178
|
+
* @beta
|
|
1179
|
+
*/
|
|
1180
|
+
__unstable_disableFocusRing?: boolean;
|
|
1181
|
+
border?: boolean;
|
|
1182
|
+
/**
|
|
1183
|
+
* @beta
|
|
1184
|
+
*/
|
|
1185
|
+
clearButton?: boolean | TextInputClearButtonProps;
|
|
1186
|
+
customValidity?: string;
|
|
1187
|
+
fontSize?: number | number[];
|
|
1188
|
+
icon?: React.ElementType | React.ReactNode;
|
|
1189
|
+
iconRight?: React.ElementType | React.ReactNode;
|
|
1190
|
+
/**
|
|
1191
|
+
* @beta
|
|
1192
|
+
*/
|
|
1193
|
+
onClear?: () => void;
|
|
1194
|
+
padding?: number | number[];
|
|
1195
|
+
prefix?: React.ReactNode;
|
|
1196
|
+
radius?: Radius | Radius[];
|
|
1197
|
+
/**
|
|
1198
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
1199
|
+
*/
|
|
1200
|
+
space?: number | number[];
|
|
1201
|
+
gap?: number | number[];
|
|
1202
|
+
suffix?: React.ReactNode;
|
|
1203
|
+
type?: TextInputType;
|
|
1204
|
+
weight?: ThemeFontWeightKey$1;
|
|
1205
|
+
}
|
|
1206
|
+
/**
|
|
1207
|
+
* Single line text input.
|
|
1208
|
+
*
|
|
1209
|
+
* @public
|
|
1210
|
+
*/
|
|
1211
|
+
declare const TextInput: import("react").ForwardRefExoticComponent<Omit<TextInputProps & Omit<import("react").HTMLProps<HTMLInputElement>, "as" | "type" | "prefix">, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
1212
|
+
/**
|
|
1213
|
+
* @public
|
|
1214
|
+
*/
|
|
1215
|
+
interface TooltipProps extends Omit<LayerProps, 'as'> {
|
|
1216
|
+
/** @deprecated Use `fallbackPlacements` instead. */
|
|
1217
|
+
allowedAutoPlacements?: Placement[];
|
|
1218
|
+
arrow?: boolean;
|
|
1219
|
+
boundaryElement?: HTMLElement | null;
|
|
1220
|
+
children?: React.JSX.Element;
|
|
1221
|
+
content?: React.ReactNode;
|
|
1222
|
+
disabled?: boolean;
|
|
1223
|
+
fallbackPlacements?: Placement[];
|
|
1224
|
+
padding?: number | number[];
|
|
1225
|
+
placement?: Placement;
|
|
1226
|
+
/** Whether or not to render the tooltip in a portal element. */
|
|
1227
|
+
portal?: boolean | string;
|
|
1228
|
+
radius?: number | number[];
|
|
1229
|
+
scheme?: ThemeColorSchemeKey$1;
|
|
1230
|
+
shadow?: number | number[];
|
|
1231
|
+
/**
|
|
1232
|
+
* Adds a delay to open or close the tooltip.
|
|
1233
|
+
*
|
|
1234
|
+
* If only a `number` is passed, it will be used for both opening and closing.
|
|
1235
|
+
*
|
|
1236
|
+
* If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
|
|
1237
|
+
*
|
|
1238
|
+
* @public
|
|
1239
|
+
* @defaultValue 0
|
|
1240
|
+
*/
|
|
1241
|
+
delay?: Delay;
|
|
1242
|
+
/**
|
|
1243
|
+
* Whether the tooltip should animate in and out.
|
|
1244
|
+
*
|
|
1245
|
+
* @beta
|
|
1246
|
+
* @defaultValue false
|
|
1247
|
+
*/
|
|
1248
|
+
animate?: boolean;
|
|
1249
|
+
}
|
|
1250
|
+
/**
|
|
1251
|
+
* Tooltips display information when hovering, focusing or tapping.
|
|
1252
|
+
*
|
|
1253
|
+
* @public
|
|
1254
|
+
*/
|
|
1255
|
+
declare const Tooltip: import("react").ForwardRefExoticComponent<Omit<TooltipProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "content" | "children">, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
1256
|
+
/**
|
|
1257
|
+
* @beta
|
|
1258
|
+
*/
|
|
1259
|
+
interface TooltipDelayGroupContextValue {
|
|
1260
|
+
setIsGroupActive: (nextState: React.SetStateAction<boolean>, delay?: number | undefined) => void;
|
|
1261
|
+
setOpenTooltipId: (nextId: string | null, delay?: number | undefined) => void;
|
|
1262
|
+
openDelay: number;
|
|
1263
|
+
closeDelay: number;
|
|
1264
|
+
openTooltipId: string | null;
|
|
1265
|
+
}
|
|
1266
|
+
/**
|
|
1267
|
+
* @beta
|
|
1268
|
+
*/
|
|
1269
|
+
declare const TooltipDelayGroupContext: import("react").Context<TooltipDelayGroupContextValue | null>;
|
|
1270
|
+
/**
|
|
1271
|
+
* @public
|
|
1272
|
+
* */
|
|
1273
|
+
interface TooltipDelayGroupProviderProps {
|
|
1274
|
+
children?: React.ReactNode;
|
|
1275
|
+
/**
|
|
1276
|
+
* Handles the delays to open or close a tooltip inside a group
|
|
1277
|
+
*
|
|
1278
|
+
* If only a `number` is passed, it will be used for both opening and closing.
|
|
1279
|
+
*
|
|
1280
|
+
* If an object `{open: number; close:number}` is passed, it can be used to set different delays for each action.
|
|
1281
|
+
*
|
|
1282
|
+
* @public
|
|
1283
|
+
*/
|
|
1284
|
+
delay: Delay;
|
|
1285
|
+
}
|
|
1286
|
+
/**
|
|
1287
|
+
* @public
|
|
1288
|
+
* Provides context for a group of tooltip elements that should share a delay
|
|
1289
|
+
* which temporarily becomes 1 ms after the first floating element of the group opens.
|
|
1290
|
+
*/
|
|
1291
|
+
declare function TooltipDelayGroupProvider(props: TooltipDelayGroupProviderProps): React.JSX.Element;
|
|
1292
|
+
declare namespace TooltipDelayGroupProvider {
|
|
1293
|
+
var displayName: string;
|
|
1294
|
+
}
|
|
1295
|
+
/**
|
|
1296
|
+
* @beta
|
|
1297
|
+
*/
|
|
1298
|
+
declare function useTooltipDelayGroup(): TooltipDelayGroupContextValue | null;
|
|
1299
|
+
/**
|
|
1300
|
+
* @public
|
|
1301
|
+
*/
|
|
1302
|
+
interface MenuGroupOwnProps {
|
|
1303
|
+
fontSize?: number | number[];
|
|
1304
|
+
icon?: React.ElementType | React.ReactNode;
|
|
1305
|
+
menu?: Omit<MenuProps, 'onClickOutside' | 'onEscape' | 'onItemClick' | 'onKeyDown' | 'onMouseEnter' | 'registerElement' | 'shouldFocus' | 'onBlurCapture'>;
|
|
1306
|
+
padding?: number | number[];
|
|
1307
|
+
popover?: Omit<PopoverProps, 'content' | 'open'>;
|
|
1308
|
+
radius?: Radius | Radius[];
|
|
1309
|
+
gap?: number | number[];
|
|
1310
|
+
/**
|
|
1311
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
1312
|
+
*/
|
|
1313
|
+
space?: number | number[];
|
|
1314
|
+
text: React.ReactNode;
|
|
1315
|
+
tone?: SelectableTone;
|
|
1316
|
+
}
|
|
1317
|
+
/**
|
|
1318
|
+
* @public
|
|
1319
|
+
*/
|
|
1320
|
+
type MenuGroupProps<E extends ElementType$1 = 'button'> = Props<MenuGroupOwnProps, E>;
|
|
1321
|
+
/**
|
|
1322
|
+
* @public
|
|
1323
|
+
*/
|
|
1324
|
+
declare const MenuGroup: <E extends ElementType$1 = "button">(props: MenuGroupProps<E>) => React.JSX.Element;
|
|
1325
|
+
/**
|
|
1326
|
+
* @public
|
|
1327
|
+
*/
|
|
1328
|
+
interface MenuItemOwnProps extends ResponsivePaddingProps, ResponsiveRadiusProps {
|
|
1329
|
+
fontSize?: number | number[];
|
|
1330
|
+
hotkeys?: string[];
|
|
1331
|
+
icon?: React.ElementType | React.ReactNode;
|
|
1332
|
+
iconRight?: React.ElementType | React.ReactNode;
|
|
1333
|
+
pressed?: boolean;
|
|
1334
|
+
selected?: boolean;
|
|
1335
|
+
gap?: number | number[];
|
|
1336
|
+
/**
|
|
1337
|
+
* @deprecated Use `gap` instead. `space` will be removed in v4.
|
|
1338
|
+
*/
|
|
1339
|
+
space?: number | number[];
|
|
1340
|
+
text?: React.ReactNode;
|
|
1341
|
+
tone?: SelectableTone;
|
|
1342
|
+
}
|
|
1343
|
+
/**
|
|
1344
|
+
* @public
|
|
1345
|
+
*/
|
|
1346
|
+
type MenuItemProps<E extends ElementType$1 = 'button'> = Props<MenuItemOwnProps, E>;
|
|
1347
|
+
/**
|
|
1348
|
+
* @public
|
|
1349
|
+
*/
|
|
1350
|
+
declare const MenuItem: <E extends ElementType$1 = "button">(props: MenuItemProps<E>) => React.JSX.Element;
|
|
1351
|
+
/**
|
|
1352
|
+
* @public
|
|
1353
|
+
*/
|
|
1354
|
+
interface TabProps {
|
|
1355
|
+
/**
|
|
1356
|
+
* The `id` of the correlating `TabPanel` component.
|
|
1357
|
+
*/
|
|
1358
|
+
'aria-controls': string;
|
|
1359
|
+
'id': string;
|
|
1360
|
+
'icon'?: React.ElementType | React.ReactNode;
|
|
1361
|
+
'focused'?: boolean;
|
|
1362
|
+
'fontSize'?: number | number[];
|
|
1363
|
+
'label'?: React.ReactNode;
|
|
1364
|
+
'padding'?: number | number[];
|
|
1365
|
+
'selected'?: boolean;
|
|
1366
|
+
'tone'?: ButtonTone;
|
|
1367
|
+
}
|
|
1368
|
+
/**
|
|
1369
|
+
* @public
|
|
1370
|
+
*/
|
|
1371
|
+
declare const Tab: import("react").ForwardRefExoticComponent<Omit<TabProps & Omit<import("react").HTMLProps<HTMLButtonElement>, "as" | "label" | "type" | "width" | "id" | "aria-controls">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1372
|
+
/**
|
|
1373
|
+
* @public
|
|
1374
|
+
*/
|
|
1375
|
+
interface TabListProps extends Omit<InlineOwnProps, 'height'> {
|
|
1376
|
+
children: Array<React.JSX.Element | null | undefined | false>;
|
|
1377
|
+
}
|
|
1378
|
+
/**
|
|
1379
|
+
* @public
|
|
1380
|
+
*/
|
|
1381
|
+
declare const TabList: import("react").ForwardRefExoticComponent<Omit<TabListProps & Omit<import("react").HTMLProps<HTMLDivElement>, "as" | "height">, "ref"> & import("react").RefAttributes<unknown>>;
|
|
1382
|
+
/**
|
|
1383
|
+
* @internal
|
|
1384
|
+
*/
|
|
1385
|
+
declare function _isEnterToClickElement(element: HTMLElement): boolean;
|
|
1386
|
+
/**
|
|
1387
|
+
* @internal
|
|
1388
|
+
*/
|
|
1389
|
+
declare function isHTMLElement(node: unknown): node is HTMLElement;
|
|
1390
|
+
/**
|
|
1391
|
+
* @internal
|
|
1392
|
+
*/
|
|
1393
|
+
declare function isHTMLAnchorElement(element: unknown): element is HTMLAnchorElement;
|
|
1394
|
+
/**
|
|
1395
|
+
* @internal
|
|
1396
|
+
*/
|
|
1397
|
+
declare function isHTMLInputElement(element: unknown): element is HTMLInputElement;
|
|
1398
|
+
/**
|
|
1399
|
+
* @internal
|
|
1400
|
+
*/
|
|
1401
|
+
declare function isHTMLButtonElement(element: unknown): element is HTMLButtonElement;
|
|
1402
|
+
/**
|
|
1403
|
+
* @internal
|
|
1404
|
+
*/
|
|
1405
|
+
declare function isHTMLSelectElement(element: unknown): element is HTMLSelectElement;
|
|
1406
|
+
/**
|
|
1407
|
+
* @internal
|
|
1408
|
+
*/
|
|
1409
|
+
declare function isHTMLTextAreaElement(element: unknown): element is HTMLTextAreaElement;
|
|
1410
|
+
/**
|
|
1411
|
+
* @internal
|
|
1412
|
+
*/
|
|
1413
|
+
declare function containsOrEqualsElement(element: HTMLElement, node: Node): boolean;
|
|
1414
|
+
/**
|
|
1415
|
+
* Returns true if a dark color scheme is preferred, false if a light color scheme is preferred or the preference is not known.
|
|
1416
|
+
*
|
|
1417
|
+
* @param getServerSnapshot - Only called during server-side rendering, and hydration if using hydrateRoot. Since the server environment doesn't have access to the DOM, we can't determine the current value of the media query and we assume `(prefers-color-scheme: light)` since it's the most common scheme (https://react.dev/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
|
|
1418
|
+
*
|
|
1419
|
+
* If you persist the detected preference in a cookie or a header then you may implement your own server snapshot to read it.
|
|
1420
|
+
* Chrome supports reading the `prefers-color-scheme` media query from a header if the server response: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Sec-CH-Prefers-Color-Scheme
|
|
1421
|
+
* @example https://gist.github.com/stipsan/13c0cccf8dfc34f4b44bb1b984baf7df
|
|
1422
|
+
*
|
|
1423
|
+
* @public
|
|
1424
|
+
*/
|
|
1425
|
+
declare function usePrefersDark(getServerSnapshot?: () => boolean): boolean;
|
|
1426
|
+
/**
|
|
1427
|
+
* @public
|
|
1428
|
+
*/
|
|
1429
|
+
interface ThemeProviderProps {
|
|
1430
|
+
children?: React.ReactNode;
|
|
1431
|
+
scheme?: ThemeColorSchemeKey$1;
|
|
1432
|
+
theme?: RootTheme$1;
|
|
1433
|
+
tone?: ThemeColorCardToneKey;
|
|
1434
|
+
}
|
|
1435
|
+
/**
|
|
1436
|
+
* @public
|
|
1437
|
+
*/
|
|
1438
|
+
declare function ThemeProvider(props: ThemeProviderProps): React.JSX.Element;
|
|
1439
|
+
declare namespace ThemeProvider {
|
|
1440
|
+
var displayName: string;
|
|
1441
|
+
}
|
|
1442
|
+
/**
|
|
1443
|
+
* @public
|
|
1444
|
+
*/
|
|
1445
|
+
declare function useTheme(): Theme$1;
|
|
1446
|
+
/**
|
|
1447
|
+
* @public
|
|
1448
|
+
*/
|
|
1449
|
+
declare function useTheme_v2(): Theme_v2;
|
|
1450
|
+
export { VirtualListProps as $, ButtonWidth as $n, AvatarStackProps as $t, TooltipProps as A, GridItemColumnStart as An, multiply as Ar, ResponsiveWidthStyleProps as At, Stack as B, FlexValue as Bn, CardProps as Bt, MenuGroupProps as C, TextAlign as Cn, ThemeFontWeightKey as Cr, HeadingProps as Ct, TooltipDelayGroupContext as D, Placement as Dn, createColorTheme as Dr, Flex as Dt, TooltipDelayGroupProviderProps as E, PopoverMargins as En, ThemeShadow as Er, GridProps as Et, TextArea as F, GridAutoFlow as Fn, screen as Fr, CodeOwnProps as Ft, Select as G, ElementType$1 as Gn, BadgeOwnProps as Gt, StackProps as H, DialogPosition as Hn, ButtonOwnProps as Ht, TextAreaProps as I, GridAutoRows as In, studioTheme as Ir, CodeProps as It, PopoverProps as J, TagType as Jn, BoxOwnProps as Jt, SelectProps as K, EmptyProps as Kn, BadgeProps as Kt, Text as L, FlexAlign as Ln, CardStyleProps as Lt, TextInputClearButtonProps as M, GridItemRowEnd as Mn, rgbToHex as Mr, ContainerOwnProps as Mt, TextInputProps as N, GridItemRowStart as Nn, rgbToHsl as Nr, ContainerProps as Nt, TooltipDelayGroupContextValue as O, GridItemColumn as On, hexToRgb as Or, FlexOwnProps as Ot, TextInputType as P, GridAutoCols as Pn, rgba as Pr, Code as Pt, VirtualListChangeOpts as Q, ButtonTone as Qn, AvatarStack as Qt, TextOwnProps as R, FlexDirection as Rn, Card as Rt, MenuGroupOwnProps as S, HotkeysProps as Sn, ThemeFontWeight as Sr, HeadingOwnProps as St, TooltipDelayGroupProvider as T, Radius as Tn, ThemeLayer as Tr, GridOwnProps as Tt, Spinner as U, Assign as Un, ButtonProps as Ut, StackOwnProps as V, FlexWrap as Vn, Button as Vt, SpinnerProps as W, ComponentType as Wn, Badge as Wt, PopoverWidth as X, ButtonMode as Xn, AvatarRootStyleProps as Xt, PopoverUpdateCallback as Y, CardTone as Yn, BoxProps as Yt, VirtualList as Z, ButtonTextAlign as Zn, ResponsiveAvatarSizeStyleProps as Zt, TabProps as _, ResponsivePaddingProps as _n, ThemeColorSchemeKey as _r, KBDProps as _t, usePrefersDark as a, MenuDivider as an, BadgeTone as ar, LayerProviderProps as at, MenuItemProps as b, ResponsiveWidthProps as bn, ThemeFontKey as br, InlineProps as bt, isHTMLAnchorElement as c, MenuProps as cn, AvatarStatus as cr, ErrorBoundary as ct, isHTMLInputElement as d, ResponsiveBoxProps as dn, HSL as dr, Arrow as dt, AvatarCounter as en, BoxDisplay as er, PortalProvider as et, isHTMLSelectElement as f, ResponsiveFlexItemProps as fn, RGB as fr, Label as ft, Tab as g, ResponsiveMarginProps as gn, ThemeColorButtonModeKey as gr, KBDOwnProps as gt, TabListProps as h, ResponsiveGridProps as hn, Theme as hr, KBD as ht, ThemeProviderProps as i, AvatarProps as in, BadgeMode as ir, LayerProvider as it, TextInput as j, GridItemRow as jn, parseColor as jr, Container as jt, Tooltip as k, GridItemColumnEnd as kn, hslToRgb as kr, FlexProps as kt, isHTMLButtonElement as l, Delay as ln, BaseTheme as lr, ErrorBoundaryProps as lt, TabList as m, ResponsiveGridItemProps as mn, Styles as mr, LabelProps as mt, useTheme_v2 as n, Avatar as nn, BoxOverflow as nr, Portal as nt, _isEnterToClickElement as o, MenuDividerProps as on, AvatarPosition as or, Layer as ot, isHTMLTextAreaElement as p, ResponsiveFlexProps as pn, RootTheme as pr, LabelOwnProps as pt, Popover as q, Props as qn, Box as qt, ThemeProvider as r, AvatarOwnProps as rn, BoxSizing as rr, PortalProps as rt, containsOrEqualsElement as s, Menu as sn, AvatarSize as sr, LayerProps as st, useTheme as t, AvatarCounterProps as tn, BoxHeight as tr, PortalProviderProps as tt, isHTMLElement as u, ResponsiveBorderProps as un, BoxShadow as ur, ErrorBoundaryState as ut, MenuItem as v, ResponsiveRadiusProps as vn, ThemeColorSyntax as vr, Inline as vt, useTooltipDelayGroup as w, SelectableTone as wn, ThemeFonts as wr, Grid as wt, MenuGroup as x, Hotkeys as xn, ThemeFontSize as xr, Heading as xt, MenuItemOwnProps as y, ResponsiveShadowProps as yn, ThemeFont as yr, InlineOwnProps as yt, TextProps as z, FlexJustify as zn, CardOwnProps as zt };
|
|
1451
|
+
//# sourceMappingURL=useTheme.d.ts.map
|