@sanity/ui 3.3.1 → 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/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 +49 -102
- 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
|
@@ -1,26 +1,29 @@
|
|
|
1
|
-
/** @
|
|
1
|
+
/** @vitest-environment jsdom */
|
|
2
|
+
|
|
3
|
+
import {beforeEach, describe, expect, it, vi} from 'vitest'
|
|
2
4
|
|
|
3
5
|
import {render} from '../../../../test'
|
|
4
6
|
import {Stack} from './stack'
|
|
5
7
|
import {responsiveStackSpaceStyle} from './styles'
|
|
6
8
|
|
|
7
|
-
|
|
8
|
-
const actual =
|
|
9
|
+
vi.mock('./styles', async (importOriginal) => {
|
|
10
|
+
const actual = await importOriginal<typeof import('./styles')>()
|
|
9
11
|
|
|
10
12
|
return {
|
|
11
13
|
...actual,
|
|
12
|
-
responsiveStackSpaceStyle:
|
|
14
|
+
responsiveStackSpaceStyle: vi.fn(actual.responsiveStackSpaceStyle),
|
|
13
15
|
}
|
|
14
16
|
})
|
|
15
17
|
|
|
16
18
|
describe('primitives/stack', () => {
|
|
17
|
-
const mockedResponsiveStackSpaceStyle =
|
|
19
|
+
const mockedResponsiveStackSpaceStyle = vi.mocked(responsiveStackSpaceStyle)
|
|
18
20
|
beforeEach(() => {
|
|
19
21
|
mockedResponsiveStackSpaceStyle.mockClear()
|
|
20
22
|
})
|
|
21
23
|
|
|
22
24
|
it('should support `space` and `gap` with the same behavior', () => {
|
|
23
25
|
render(
|
|
26
|
+
// oxlint-disable-next-line no-deprecated
|
|
24
27
|
<Stack space={2}>
|
|
25
28
|
<span>One</span>
|
|
26
29
|
<span>Two</span>
|
|
@@ -45,6 +48,7 @@ describe('primitives/stack', () => {
|
|
|
45
48
|
|
|
46
49
|
it('should prefer `gap` over `space` when both are provided', () => {
|
|
47
50
|
render(
|
|
51
|
+
// oxlint-disable-next-line no-deprecated
|
|
48
52
|
<Stack gap={3} space={1}>
|
|
49
53
|
<span>One</span>
|
|
50
54
|
<span>Two</span>
|
|
@@ -31,6 +31,7 @@ const StackComponent = forwardRef(function Stack(
|
|
|
31
31
|
props: StackOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'ref'>,
|
|
32
32
|
ref: React.ForwardedRef<HTMLDivElement>,
|
|
33
33
|
) {
|
|
34
|
+
// oxlint-disable-next-line no-deprecated
|
|
34
35
|
const {as, gap, space: deprecated_space, ...restProps} = props
|
|
35
36
|
const spacing = gap === undefined ? deprecated_space : gap
|
|
36
37
|
|
|
@@ -52,6 +53,7 @@ StackComponent.displayName = 'ForwardRef(Stack)'
|
|
|
52
53
|
*
|
|
53
54
|
* @public
|
|
54
55
|
*/
|
|
56
|
+
// oxlint-disable-next-line no-unsafe-type-assertion
|
|
55
57
|
export const Stack = StackComponent as unknown as <E extends ElementType = 'div'>(
|
|
56
58
|
props: StackProps<E>,
|
|
57
59
|
) => React.JSX.Element
|
|
@@ -1,26 +1,29 @@
|
|
|
1
|
-
/** @
|
|
1
|
+
/** @vitest-environment jsdom */
|
|
2
|
+
|
|
3
|
+
import {beforeEach, describe, expect, it, vi} from 'vitest'
|
|
2
4
|
|
|
3
5
|
import {render} from '../../../../test'
|
|
4
6
|
import {responsiveInputPaddingStyle} from '../../styles/internal'
|
|
5
7
|
import {TextInput} from './textInput'
|
|
6
8
|
|
|
7
|
-
|
|
8
|
-
const actual =
|
|
9
|
+
vi.mock('../../styles/internal', async (importOriginal) => {
|
|
10
|
+
const actual = await importOriginal<typeof import('../../styles/internal')>()
|
|
9
11
|
|
|
10
12
|
return {
|
|
11
13
|
...actual,
|
|
12
|
-
responsiveInputPaddingStyle:
|
|
14
|
+
responsiveInputPaddingStyle: vi.fn(actual.responsiveInputPaddingStyle),
|
|
13
15
|
}
|
|
14
16
|
})
|
|
15
17
|
|
|
16
18
|
describe('primitives/textInput', () => {
|
|
17
|
-
const mockedResponsiveInputPaddingStyle =
|
|
19
|
+
const mockedResponsiveInputPaddingStyle = vi.mocked(responsiveInputPaddingStyle)
|
|
18
20
|
|
|
19
21
|
beforeEach(() => {
|
|
20
22
|
mockedResponsiveInputPaddingStyle.mockClear()
|
|
21
23
|
})
|
|
22
24
|
|
|
23
25
|
it('should support `space` and `gap` with the same behavior', () => {
|
|
26
|
+
// oxlint-disable-next-line no-deprecated
|
|
24
27
|
render(<TextInput icon={() => null} space={2} />)
|
|
25
28
|
|
|
26
29
|
expect(mockedResponsiveInputPaddingStyle).toHaveBeenCalledWith(
|
|
@@ -36,6 +39,7 @@ describe('primitives/textInput', () => {
|
|
|
36
39
|
})
|
|
37
40
|
|
|
38
41
|
it('should prefer `gap` over `space` when both are provided', () => {
|
|
42
|
+
// oxlint-disable-next-line no-deprecated
|
|
39
43
|
render(<TextInput gap={3} icon={() => null} space={1} />)
|
|
40
44
|
|
|
41
45
|
expect(mockedResponsiveInputPaddingStyle).toHaveBeenCalledWith(
|
|
@@ -65,7 +65,9 @@ export interface TextInputProps {
|
|
|
65
65
|
clearButton?: boolean | TextInputClearButtonProps
|
|
66
66
|
customValidity?: string
|
|
67
67
|
fontSize?: number | number[]
|
|
68
|
+
// oxlint-disable-next-line no-redundant-type-constituents
|
|
68
69
|
icon?: React.ElementType | React.ReactNode
|
|
70
|
+
// oxlint-disable-next-line no-redundant-type-constituents
|
|
69
71
|
iconRight?: React.ElementType | React.ReactNode
|
|
70
72
|
/**
|
|
71
73
|
* @beta
|
|
@@ -174,6 +176,7 @@ export const TextInput = forwardRef(function TextInput(
|
|
|
174
176
|
prefix,
|
|
175
177
|
radius: radiusProp = 2,
|
|
176
178
|
readOnly,
|
|
179
|
+
// oxlint-disable-next-line no-deprecated
|
|
177
180
|
space: deprecated_space = 3,
|
|
178
181
|
suffix,
|
|
179
182
|
customValidity,
|
|
@@ -1,22 +1,25 @@
|
|
|
1
|
-
/** @
|
|
2
|
-
import '../../../../test/mocks/resizeObserver.mock'
|
|
3
|
-
import '../../../../test/mocks/matchMedia.mock'
|
|
1
|
+
/** @vitest-environment jsdom */
|
|
4
2
|
|
|
5
3
|
import {act, fireEvent, screen} from '@testing-library/react'
|
|
6
4
|
|
|
5
|
+
// oxlint-disable-next-line no-unassigned-import
|
|
6
|
+
import '../../../../test/mocks/resizeObserver.mock'
|
|
7
|
+
// oxlint-disable-next-line no-unassigned-import
|
|
8
|
+
import '../../../../test/mocks/matchMedia.mock'
|
|
9
|
+
import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest'
|
|
10
|
+
|
|
7
11
|
import {render} from '../../../../test'
|
|
8
12
|
import {Button, Text} from '../../primitives'
|
|
9
13
|
import {Tooltip, TooltipDelayGroupProvider} from '../tooltip'
|
|
10
14
|
|
|
11
|
-
// Fake timers using Jest
|
|
12
15
|
beforeEach(() => {
|
|
13
|
-
|
|
16
|
+
vi.useFakeTimers()
|
|
14
17
|
})
|
|
15
18
|
|
|
16
|
-
//
|
|
19
|
+
// Run all pending timers and switch back to real timers
|
|
17
20
|
afterEach(() => {
|
|
18
|
-
|
|
19
|
-
|
|
21
|
+
vi.runOnlyPendingTimers()
|
|
22
|
+
vi.useRealTimers()
|
|
20
23
|
})
|
|
21
24
|
|
|
22
25
|
describe('Tooltip', () => {
|
|
@@ -43,7 +46,7 @@ describe('Tooltip', () => {
|
|
|
43
46
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
44
47
|
})
|
|
45
48
|
it('should support delays to show and hide the tooltip.', () => {
|
|
46
|
-
|
|
49
|
+
vi.useFakeTimers()
|
|
47
50
|
const delay = 200
|
|
48
51
|
|
|
49
52
|
render(
|
|
@@ -63,10 +66,12 @@ describe('Tooltip', () => {
|
|
|
63
66
|
|
|
64
67
|
fireEvent.mouseEnter(button)
|
|
65
68
|
|
|
66
|
-
|
|
69
|
+
// oxlint-disable-next-line no-floating-promises
|
|
70
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
67
71
|
// Content should not be rendered yet
|
|
68
72
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
69
|
-
|
|
73
|
+
// oxlint-disable-next-line no-floating-promises
|
|
74
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
70
75
|
|
|
71
76
|
// Validate tooltip content is rendered
|
|
72
77
|
screen.getByText('Tooltip content')
|
|
@@ -74,12 +79,13 @@ describe('Tooltip', () => {
|
|
|
74
79
|
fireEvent.mouseOut(button)
|
|
75
80
|
// Validate tooltip content is still showing.
|
|
76
81
|
screen.getByText('Tooltip content')
|
|
77
|
-
|
|
82
|
+
// oxlint-disable-next-line no-floating-promises
|
|
83
|
+
act(() => vi.advanceTimersByTime(delay))
|
|
78
84
|
// Validate tooltip content is not rendered anymore
|
|
79
85
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
80
86
|
})
|
|
81
87
|
it('should support different open and close delays to show and hide the tooltip.', () => {
|
|
82
|
-
|
|
88
|
+
vi.useFakeTimers()
|
|
83
89
|
const openDelay = 200
|
|
84
90
|
const closeDelay = 150
|
|
85
91
|
|
|
@@ -103,10 +109,12 @@ describe('Tooltip', () => {
|
|
|
103
109
|
|
|
104
110
|
fireEvent.mouseEnter(button)
|
|
105
111
|
|
|
106
|
-
|
|
112
|
+
// oxlint-disable-next-line no-floating-promises
|
|
113
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
107
114
|
// Content should not be rendered yet
|
|
108
115
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
109
|
-
|
|
116
|
+
// oxlint-disable-next-line no-floating-promises
|
|
117
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
110
118
|
|
|
111
119
|
// Validate tooltip content is rendered
|
|
112
120
|
screen.getByText('Tooltip content')
|
|
@@ -114,7 +122,8 @@ describe('Tooltip', () => {
|
|
|
114
122
|
fireEvent.mouseOut(button)
|
|
115
123
|
// Validate tooltip content is still showing.
|
|
116
124
|
screen.getByText('Tooltip content')
|
|
117
|
-
|
|
125
|
+
// oxlint-disable-next-line no-floating-promises
|
|
126
|
+
act(() => vi.advanceTimersByTime(closeDelay))
|
|
118
127
|
// Validate tooltip content is not rendered anymore
|
|
119
128
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
120
129
|
})
|
|
@@ -124,7 +133,7 @@ describe('Tooltip', () => {
|
|
|
124
133
|
it('should support groups with the same delay to open and close.', () => {
|
|
125
134
|
const delay = 150
|
|
126
135
|
|
|
127
|
-
|
|
136
|
+
vi.useFakeTimers()
|
|
128
137
|
render(
|
|
129
138
|
<TooltipDelayGroupProvider delay={delay}>
|
|
130
139
|
<Tooltip content={<Text size={1}>{'Tooltip 1'}</Text>} placement={'top'} delay={400}>
|
|
@@ -149,11 +158,13 @@ describe('Tooltip', () => {
|
|
|
149
158
|
|
|
150
159
|
// Hovers on first button, it should show first tooltip only
|
|
151
160
|
fireEvent.mouseEnter(button1)
|
|
152
|
-
|
|
161
|
+
// oxlint-disable-next-line no-floating-promises
|
|
162
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
153
163
|
// Content should not be rendered yet, we have a delay of 150ms
|
|
154
164
|
expect(screen.queryByText('Tooltip 1')).not.toBeInTheDocument()
|
|
155
165
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
156
|
-
|
|
166
|
+
// oxlint-disable-next-line no-floating-promises
|
|
167
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
157
168
|
|
|
158
169
|
// Validate Tooltip 1 is rendered
|
|
159
170
|
screen.getByText('Tooltip 1')
|
|
@@ -164,38 +175,45 @@ describe('Tooltip', () => {
|
|
|
164
175
|
fireEvent.mouseEnter(button2)
|
|
165
176
|
|
|
166
177
|
// Validate Tooltip 1 is not rendered, now tooltip 2 is open.
|
|
167
|
-
|
|
178
|
+
// oxlint-disable-next-line no-floating-promises
|
|
179
|
+
act(() => vi.advanceTimersByTime(1))
|
|
168
180
|
expect(screen.queryByText('Tooltip 1')).not.toBeInTheDocument()
|
|
169
181
|
screen.getByText('Tooltip 2')
|
|
170
182
|
|
|
171
183
|
// Validate tooltip content is not rendered anymore
|
|
172
184
|
fireEvent.mouseOut(button2)
|
|
173
|
-
|
|
185
|
+
// oxlint-disable-next-line no-floating-promises
|
|
186
|
+
act(() => vi.advanceTimersByTime(delay + 1))
|
|
174
187
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
175
188
|
|
|
176
189
|
// Hovering again, should trigger the tooltip to show immediately, as the group is not deactivated yet
|
|
177
190
|
fireEvent.mouseEnter(button2)
|
|
178
|
-
|
|
191
|
+
// oxlint-disable-next-line no-floating-promises
|
|
192
|
+
act(() => vi.advanceTimersByTime(1))
|
|
179
193
|
screen.getByText('Tooltip 2')
|
|
180
194
|
|
|
181
195
|
// Validate tooltip content is not rendered anymore
|
|
182
196
|
fireEvent.mouseOut(button2)
|
|
183
|
-
|
|
197
|
+
// oxlint-disable-next-line no-floating-promises
|
|
198
|
+
act(() => vi.advanceTimersByTime(delay + 1))
|
|
184
199
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
185
200
|
|
|
186
201
|
// Wait 200ms, the group is deactivated, hovering again should trigger the delay
|
|
187
|
-
|
|
202
|
+
// oxlint-disable-next-line no-floating-promises
|
|
203
|
+
act(() => vi.advanceTimersByTime(200))
|
|
188
204
|
fireEvent.mouseEnter(button2)
|
|
189
|
-
|
|
205
|
+
// oxlint-disable-next-line no-floating-promises
|
|
206
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
190
207
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
191
|
-
|
|
208
|
+
// oxlint-disable-next-line no-floating-promises
|
|
209
|
+
act(() => vi.advanceTimersByTime(delay / 2))
|
|
192
210
|
screen.getByText('Tooltip 2')
|
|
193
211
|
})
|
|
194
212
|
it('should support groups with different open and close delay.', () => {
|
|
195
213
|
const openDelay = 250
|
|
196
214
|
const closeDelay = 150
|
|
197
215
|
|
|
198
|
-
|
|
216
|
+
vi.useFakeTimers()
|
|
199
217
|
render(
|
|
200
218
|
<TooltipDelayGroupProvider
|
|
201
219
|
delay={{
|
|
@@ -225,11 +243,13 @@ describe('Tooltip', () => {
|
|
|
225
243
|
|
|
226
244
|
// Hovers on first button, it should show first tooltip only
|
|
227
245
|
fireEvent.mouseEnter(button1)
|
|
228
|
-
|
|
246
|
+
// oxlint-disable-next-line no-floating-promises
|
|
247
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
229
248
|
// Content should not be rendered yet, we have a delay of2150ms
|
|
230
249
|
expect(screen.queryByText('Tooltip 1')).not.toBeInTheDocument()
|
|
231
250
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
232
|
-
|
|
251
|
+
// oxlint-disable-next-line no-floating-promises
|
|
252
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
233
253
|
|
|
234
254
|
// Validate Tooltip 1 is rendered
|
|
235
255
|
screen.getByText('Tooltip 1')
|
|
@@ -240,31 +260,38 @@ describe('Tooltip', () => {
|
|
|
240
260
|
fireEvent.mouseEnter(button2)
|
|
241
261
|
|
|
242
262
|
// Validate Tooltip 1 is not rendered, now tooltip 2 is open.
|
|
243
|
-
|
|
263
|
+
// oxlint-disable-next-line no-floating-promises
|
|
264
|
+
act(() => vi.advanceTimersByTime(1))
|
|
244
265
|
expect(screen.queryByText('Tooltip 1')).not.toBeInTheDocument()
|
|
245
266
|
screen.getByText('Tooltip 2')
|
|
246
267
|
|
|
247
268
|
// Validate tooltip content is not rendered anymore
|
|
248
269
|
fireEvent.mouseOut(button2)
|
|
249
|
-
|
|
270
|
+
// oxlint-disable-next-line no-floating-promises
|
|
271
|
+
act(() => vi.advanceTimersByTime(closeDelay + 1))
|
|
250
272
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
251
273
|
|
|
252
274
|
// Hovering again, should trigger the tooltip to show immediately, as the group is not deactivated yet
|
|
253
275
|
fireEvent.mouseEnter(button2)
|
|
254
|
-
|
|
276
|
+
// oxlint-disable-next-line no-floating-promises
|
|
277
|
+
act(() => vi.advanceTimersByTime(1))
|
|
255
278
|
screen.getByText('Tooltip 2')
|
|
256
279
|
|
|
257
280
|
// Validate tooltip content is not rendered anymore
|
|
258
281
|
fireEvent.mouseOut(button2)
|
|
259
|
-
|
|
282
|
+
// oxlint-disable-next-line no-floating-promises
|
|
283
|
+
act(() => vi.advanceTimersByTime(closeDelay + 1))
|
|
260
284
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
261
285
|
|
|
262
286
|
// Wait 200ms, the group is deactivated, hovering again should trigger the delay
|
|
263
|
-
|
|
287
|
+
// oxlint-disable-next-line no-floating-promises
|
|
288
|
+
act(() => vi.advanceTimersByTime(200))
|
|
264
289
|
fireEvent.mouseEnter(button2)
|
|
265
|
-
|
|
290
|
+
// oxlint-disable-next-line no-floating-promises
|
|
291
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
266
292
|
expect(screen.queryByText('Tooltip 2')).not.toBeInTheDocument()
|
|
267
|
-
|
|
293
|
+
// oxlint-disable-next-line no-floating-promises
|
|
294
|
+
act(() => vi.advanceTimersByTime(openDelay / 2))
|
|
268
295
|
screen.getByText('Tooltip 2')
|
|
269
296
|
})
|
|
270
297
|
})
|
|
@@ -273,7 +300,7 @@ describe('Tooltip', () => {
|
|
|
273
300
|
it('Standalone tooltip closes immediately with Escape key', () => {
|
|
274
301
|
const delay = 150
|
|
275
302
|
|
|
276
|
-
|
|
303
|
+
vi.useFakeTimers()
|
|
277
304
|
|
|
278
305
|
render(
|
|
279
306
|
<Tooltip
|
|
@@ -290,7 +317,8 @@ describe('Tooltip', () => {
|
|
|
290
317
|
// Validate tooltip content is not rendered
|
|
291
318
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
292
319
|
fireEvent.focus(button)
|
|
293
|
-
|
|
320
|
+
// oxlint-disable-next-line no-floating-promises
|
|
321
|
+
act(() => vi.advanceTimersByTime(delay))
|
|
294
322
|
|
|
295
323
|
// Validate tooltip content is rendered
|
|
296
324
|
screen.getByText('Tooltip content')
|
|
@@ -304,7 +332,7 @@ describe('Tooltip', () => {
|
|
|
304
332
|
it('With <TooltipDelayGroupProvider /> closes immediately with Escape key', () => {
|
|
305
333
|
const delay = 150
|
|
306
334
|
|
|
307
|
-
|
|
335
|
+
vi.useFakeTimers()
|
|
308
336
|
|
|
309
337
|
render(
|
|
310
338
|
<TooltipDelayGroupProvider delay={{close: delay}}>
|
|
@@ -324,7 +352,8 @@ describe('Tooltip', () => {
|
|
|
324
352
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
325
353
|
fireEvent.focus(button)
|
|
326
354
|
|
|
327
|
-
|
|
355
|
+
// oxlint-disable-next-line no-floating-promises
|
|
356
|
+
act(() => vi.advanceTimersByTime(delay))
|
|
328
357
|
|
|
329
358
|
// Validate tooltip content is rendered
|
|
330
359
|
screen.getByText('Tooltip content')
|
|
@@ -353,11 +382,13 @@ describe('Tooltip', () => {
|
|
|
353
382
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
354
383
|
fireEvent.focus(button)
|
|
355
384
|
|
|
356
|
-
|
|
385
|
+
// oxlint-disable-next-line no-floating-promises
|
|
386
|
+
act(() => vi.advanceTimersByTime(delay))
|
|
357
387
|
|
|
358
388
|
// Assertion: the tooltip is not visible
|
|
359
389
|
expect(screen.queryByText('Tooltip content')).toBeVisible()
|
|
360
390
|
|
|
391
|
+
// oxlint-disable-next-line no-floating-promises
|
|
361
392
|
act(() => fireEvent.click(button))
|
|
362
393
|
|
|
363
394
|
// Assertion: tooltip does not exist in the document
|
|
@@ -379,11 +410,13 @@ describe('Tooltip', () => {
|
|
|
379
410
|
expect(screen.queryByText('Tooltip content')).not.toBeInTheDocument()
|
|
380
411
|
fireEvent.focus(button)
|
|
381
412
|
|
|
382
|
-
|
|
413
|
+
// oxlint-disable-next-line no-floating-promises
|
|
414
|
+
act(() => vi.advanceTimersByTime(delay))
|
|
383
415
|
|
|
384
416
|
// Assertion: the tooltip is not visible
|
|
385
417
|
expect(screen.queryByText('Tooltip content')).toBeVisible()
|
|
386
418
|
|
|
419
|
+
// oxlint-disable-next-line no-floating-promises
|
|
387
420
|
act(() => fireEvent.contextMenu(button))
|
|
388
421
|
|
|
389
422
|
// Assertion: tooltip does not exist in the document
|
|
@@ -392,12 +425,12 @@ describe('Tooltip', () => {
|
|
|
392
425
|
})
|
|
393
426
|
|
|
394
427
|
describe('Used defined events on <Tooltip /> child should fire correctly', () => {
|
|
395
|
-
const handleBlur =
|
|
396
|
-
const handleClick =
|
|
397
|
-
const handleContextMenu =
|
|
398
|
-
const handleFocus =
|
|
399
|
-
const handleMouseEnter =
|
|
400
|
-
const handleMouseLeave =
|
|
428
|
+
const handleBlur = vi.fn()
|
|
429
|
+
const handleClick = vi.fn()
|
|
430
|
+
const handleContextMenu = vi.fn()
|
|
431
|
+
const handleFocus = vi.fn()
|
|
432
|
+
const handleMouseEnter = vi.fn()
|
|
433
|
+
const handleMouseLeave = vi.fn()
|
|
401
434
|
|
|
402
435
|
beforeEach(() => {
|
|
403
436
|
render(
|
|
@@ -417,7 +450,7 @@ describe('Tooltip', () => {
|
|
|
417
450
|
)
|
|
418
451
|
})
|
|
419
452
|
|
|
420
|
-
afterEach(() =>
|
|
453
|
+
afterEach(() => vi.clearAllMocks())
|
|
421
454
|
|
|
422
455
|
it('should fire the onBlur event', () => {
|
|
423
456
|
fireEvent.blur(screen.getByTestId('btn'))
|
|
@@ -271,6 +271,7 @@ export const Tooltip = forwardRef(function Tooltip(
|
|
|
271
271
|
|
|
272
272
|
window.addEventListener('keydown', handleWindowKeyDown)
|
|
273
273
|
|
|
274
|
+
// oxlint-disable-next-line consistent-return
|
|
274
275
|
return () => {
|
|
275
276
|
window.removeEventListener('keydown', handleWindowKeyDown)
|
|
276
277
|
}
|
|
@@ -286,7 +287,7 @@ export const Tooltip = forwardRef(function Tooltip(
|
|
|
286
287
|
portalElement?.offsetWidth || document.body.offsetWidth,
|
|
287
288
|
]
|
|
288
289
|
|
|
289
|
-
//
|
|
290
|
+
// oxlint-disable-next-line react-compiler
|
|
290
291
|
setTooltipMaxWidth(Math.min(...availableWidths) - DEFAULT_TOOLTIP_PADDING * 2)
|
|
291
292
|
}, [boundaryElement, portalElement])
|
|
292
293
|
|
|
@@ -490,6 +491,7 @@ function useCloseOnMouseLeave({
|
|
|
490
491
|
|
|
491
492
|
window.addEventListener('mousemove', handleMouseMove)
|
|
492
493
|
|
|
494
|
+
// oxlint-disable-next-line consistent-return
|
|
493
495
|
return () => window.removeEventListener('mousemove', handleMouseMove)
|
|
494
496
|
}, [isInsideGroup, showTooltip])
|
|
495
497
|
}
|
|
@@ -78,6 +78,7 @@ export const TooltipCard = forwardRef(function TooltipCard(
|
|
|
78
78
|
return (
|
|
79
79
|
<MotionCard
|
|
80
80
|
data-ui="Tooltip__card"
|
|
81
|
+
// oxlint-disable-next-line no-unsafe-type-assertion
|
|
81
82
|
{...(restProps as CardProps & MotionProps)}
|
|
82
83
|
data-placement={placement}
|
|
83
84
|
padding={padding}
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
* @beta
|
|
3
3
|
*/
|
|
4
4
|
export interface TooltipDelayGroupContextValue {
|
|
5
|
+
// oxlint-disable-next-line no-duplicate-type-constituents
|
|
5
6
|
setIsGroupActive: (nextState: React.SetStateAction<boolean>, delay?: number | undefined) => void
|
|
7
|
+
// oxlint-disable-next-line no-duplicate-type-constituents
|
|
6
8
|
setOpenTooltipId: (nextId: string | null, delay?: number | undefined) => void
|
|
7
9
|
openDelay: number
|
|
8
10
|
closeDelay: number
|
|
@@ -17,7 +17,6 @@ export function responsiveFont(
|
|
|
17
17
|
const {family, sizes, weights} = font[fontKey]
|
|
18
18
|
const fontWeight = ($weight && weights[$weight]) || weights.regular
|
|
19
19
|
|
|
20
|
-
// eslint-disable-next-line no-warning-comments
|
|
21
20
|
// @todo: make this configurable
|
|
22
21
|
const defaultSize = sizes[2]
|
|
23
22
|
|
|
@@ -49,12 +48,10 @@ export function responsiveFont(
|
|
|
49
48
|
},
|
|
50
49
|
}
|
|
51
50
|
|
|
52
|
-
// eslint-disable-next-line no-warning-comments
|
|
53
51
|
// @TODO fix the real condition that is causing $size to be undefined sometimes
|
|
54
52
|
if (!$size) {
|
|
55
53
|
// @ts-expect-error: `warned` isn't typed, the underlying issue should be solved rather than typing it
|
|
56
54
|
if (!responsiveFont.warned) {
|
|
57
|
-
// eslint-disable-next-line no-console
|
|
58
55
|
console.warn('No size specified for responsive font', {fontKey, $size, props, base})
|
|
59
56
|
// @ts-expect-error: `warned` isn't typed, the underlying issue should be solved rather than typing it
|
|
60
57
|
responsiveFont.warned = true
|
|
@@ -27,9 +27,7 @@ export interface ResponsiveTextAlignStyleProps {
|
|
|
27
27
|
* @internal
|
|
28
28
|
*/
|
|
29
29
|
export interface ResponsiveFontStyleProps
|
|
30
|
-
extends FontWeightStyleProps,
|
|
31
|
-
ResponsiveFontSizeStyleProps,
|
|
32
|
-
ResponsiveTextAlignStyleProps {
|
|
30
|
+
extends FontWeightStyleProps, ResponsiveFontSizeStyleProps, ResponsiveTextAlignStyleProps {
|
|
33
31
|
$accent?: boolean
|
|
34
32
|
$muted?: boolean
|
|
35
33
|
}
|
|
@@ -87,6 +87,7 @@ function responsiveGridGapStyle(props: ResponsiveGridStyleProps & ThemeProps) {
|
|
|
87
87
|
const {media, space} = getTheme_v2(props.theme)
|
|
88
88
|
|
|
89
89
|
return _responsive(media, props.$gap, (gap) => ({
|
|
90
|
+
// oxlint-disable-next-line no-deprecated
|
|
90
91
|
gridGap: gap ? rem(space[gap]) : undefined,
|
|
91
92
|
}))
|
|
92
93
|
}
|
|
@@ -9,6 +9,7 @@ export function responsiveMarginStyle(
|
|
|
9
9
|
): CSSObject[][] {
|
|
10
10
|
const {theme} = props
|
|
11
11
|
|
|
12
|
+
// oxlint-disable-next-line no-unsafe-type-assertion
|
|
12
13
|
return [
|
|
13
14
|
_getResponsiveSpace(theme, ['margin'], props.$margin),
|
|
14
15
|
_getResponsiveSpace(theme, ['marginLeft', 'marginRight'], props.$marginX),
|
|
@@ -9,6 +9,7 @@ export function responsivePaddingStyle(
|
|
|
9
9
|
): CSSObject[][] {
|
|
10
10
|
const {theme} = props
|
|
11
11
|
|
|
12
|
+
// oxlint-disable-next-line no-unsafe-type-assertion
|
|
12
13
|
return [
|
|
13
14
|
_getResponsiveSpace(theme, ['padding'], props.$padding),
|
|
14
15
|
_getResponsiveSpace(theme, ['paddingLeft', 'paddingRight'], props.$paddingX),
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
/** @
|
|
1
|
+
/** @vitest-environment jsdom */
|
|
2
2
|
|
|
3
3
|
import {buildTheme} from '@sanity/ui/theme'
|
|
4
|
+
import {describe, expect, it, vi} from 'vitest'
|
|
4
5
|
|
|
5
6
|
import {render} from '../../../test'
|
|
6
7
|
import {ThemeContext} from './themeContext'
|
|
@@ -10,7 +11,7 @@ import {useRootTheme} from './useRootTheme'
|
|
|
10
11
|
describe('theme', () => {
|
|
11
12
|
describe('useRootTheme', () => {
|
|
12
13
|
it('should get context value', async () => {
|
|
13
|
-
const log =
|
|
14
|
+
const log = vi.fn()
|
|
14
15
|
|
|
15
16
|
function Debug() {
|
|
16
17
|
const rootTheme = useRootTheme()
|
|
@@ -22,6 +23,7 @@ describe('theme', () => {
|
|
|
22
23
|
|
|
23
24
|
function Root() {
|
|
24
25
|
const value: ThemeContextValue = {
|
|
26
|
+
// oxlint-disable-next-line no-deprecated
|
|
25
27
|
version: 0.0,
|
|
26
28
|
scheme: 'light',
|
|
27
29
|
theme: buildTheme(),
|
|
@@ -29,6 +31,7 @@ describe('theme', () => {
|
|
|
29
31
|
}
|
|
30
32
|
|
|
31
33
|
return (
|
|
34
|
+
// oxlint-disable-next-line jsx-no-constructed-context-values
|
|
32
35
|
<ThemeContext.Provider value={value}>
|
|
33
36
|
<Debug />
|
|
34
37
|
</ThemeContext.Provider>
|
|
@@ -43,7 +46,7 @@ describe('theme', () => {
|
|
|
43
46
|
})
|
|
44
47
|
|
|
45
48
|
it('should fail when no context value is provided', async () => {
|
|
46
|
-
const log =
|
|
49
|
+
const log = vi.fn()
|
|
47
50
|
|
|
48
51
|
function Debug() {
|
|
49
52
|
try {
|
|
@@ -59,6 +62,7 @@ describe('theme', () => {
|
|
|
59
62
|
const value = undefined
|
|
60
63
|
|
|
61
64
|
return (
|
|
65
|
+
// oxlint-disable-next-line no-unsafe-type-assertion
|
|
62
66
|
<ThemeContext.Provider value={value as any}>
|
|
63
67
|
<Debug />
|
|
64
68
|
</ThemeContext.Provider>
|