@sanity/ui 3.0.0-static.2 → 3.0.0-static.21
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 +7 -6
- package/bin/{ui.js → sanity-ui.cjs} +1 -1
- package/dist/_chunks-cjs/_visual-editing.cjs +2488 -0
- package/dist/_chunks-cjs/_visual-editing.cjs.map +1 -0
- package/dist/_chunks-cjs/{refractor.js → refractor.cjs} +1 -2
- package/dist/_chunks-cjs/refractor.cjs.map +1 -0
- package/dist/_chunks-es/_visual-editing.js +2500 -0
- package/dist/_chunks-es/_visual-editing.js.map +1 -0
- package/dist/_chunks-es/{refractor.mjs → refractor.js} +1 -2
- package/dist/_chunks-es/refractor.js.map +1 -0
- package/dist/_visual-editing.cjs +30 -0
- package/dist/_visual-editing.cjs.map +1 -0
- package/dist/_visual-editing.d.cts +893 -0
- package/dist/_visual-editing.d.ts +503 -416
- package/dist/_visual-editing.js +29 -30
- package/dist/_visual-editing.js.map +1 -1
- package/dist/css.cjs +598 -0
- package/dist/css.cjs.map +1 -0
- package/dist/css.d.cts +14884 -0
- package/dist/css.d.ts +14379 -1630
- package/dist/css.js +480 -4594
- package/dist/css.js.map +1 -1
- package/dist/index.cjs +2222 -0
- package/dist/index.cjs.map +1 -0
- package/dist/{index.d.mts → index.d.cts} +1284 -961
- package/dist/index.d.ts +1284 -961
- package/dist/index.js +1270 -592
- package/dist/index.js.map +1 -1
- package/dist/{theme.mjs → theme.cjs} +2843 -2571
- package/dist/theme.cjs.map +1 -0
- package/dist/{theme.d.mts → theme.d.cts} +331 -311
- package/dist/theme.d.ts +331 -311
- package/dist/theme.js +2843 -2569
- package/dist/theme.js.map +1 -1
- package/dist/ui.css +22564 -0
- package/exports/_visual-editing.ts +0 -1
- package/package.json +84 -79
- package/src/cli/buildCommand.ts +3 -41
- package/src/cli/index.ts +2 -14
- package/src/core/_compat/helpers.ts +72 -0
- package/src/core/_compat/index.ts +1 -6
- package/src/core/_compat/styles/_responsive.ts +1 -1
- package/src/core/_compat/theme/theme.test.tsx +4 -5
- package/src/core/_compat/theme/themeColorProvider.tsx +4 -10
- package/src/core/_compat/theme/themeContext.ts +5 -5
- package/src/core/_compat/theme/themeProvider.tsx +19 -13
- package/src/core/_compat/theme/types.ts +2 -4
- package/src/core/_compat/theme/useRootTheme.ts +2 -4
- package/src/core/_compat/theme/useTheme.ts +3 -7
- package/src/core/_compat/types.ts +0 -73
- package/src/core/components/autocomplete/__workshop__/async.tsx +6 -6
- package/src/core/components/autocomplete/__workshop__/constrainedHeight.tsx +11 -18
- package/src/core/components/autocomplete/__workshop__/custom.tsx +21 -20
- package/src/core/components/autocomplete/__workshop__/example.tsx +17 -17
- package/src/core/components/autocomplete/__workshop__/focusAndBlur.tsx +5 -5
- package/src/core/components/autocomplete/__workshop__/fullscreen.tsx +57 -59
- package/src/core/components/autocomplete/autocomplete.tsx +106 -140
- package/src/core/components/autocomplete/autocompleteOption.tsx +1 -1
- package/src/core/components/autocomplete/autocompleteReducer.ts +1 -1
- package/src/core/components/autocomplete/constants.ts +1 -1
- package/src/core/components/autocomplete/types.ts +4 -9
- package/src/core/components/breadcrumbs/__workshop__/example.tsx +2 -3
- package/src/core/components/breadcrumbs/breadcrumbs.tsx +32 -28
- package/src/core/components/dialog/__workshop__/activate.tsx +4 -4
- package/src/core/components/dialog/__workshop__/autoFocus.tsx +2 -2
- package/src/core/components/dialog/__workshop__/onScroll.tsx +16 -4
- package/src/core/components/dialog/__workshop__/position.tsx +4 -4
- package/src/core/components/dialog/__workshop__/props.tsx +7 -7
- package/src/core/components/dialog/__workshop__/wrapped.tsx +2 -2
- package/src/core/components/dialog/dialog.tsx +104 -304
- package/src/core/components/dialog/dialogCard.tsx +190 -0
- package/src/core/components/dialog/dialogContext.ts +5 -3
- package/src/core/components/dialog/dialogProvider.tsx +6 -7
- package/src/core/components/dialog/isTargetWithinScope.ts +14 -0
- package/src/core/components/dialog/useDialog.ts +1 -1
- package/src/core/components/hotkeys/hotkeys.tsx +41 -27
- package/src/core/components/menu/__workshop__/asComponent.tsx +6 -6
- package/src/core/components/menu/__workshop__/closableMenuButton.tsx +5 -4
- package/src/core/components/menu/__workshop__/constrainedInBoundary.tsx +2 -2
- package/src/core/components/menu/__workshop__/customMenuItem.tsx +3 -3
- package/src/core/components/menu/__workshop__/disableFocusOnClose.tsx +1 -1
- package/src/core/components/menu/__workshop__/groups.tsx +2 -2
- package/src/core/components/menu/__workshop__/menuButton.tsx +4 -4
- package/src/core/components/menu/__workshop__/menuGroupRight.tsx +1 -1
- package/src/core/components/menu/__workshop__/nestedMenu.tsx +1 -1
- package/src/core/components/menu/__workshop__/onCloseMenuButton.tsx +13 -4
- package/src/core/components/menu/__workshop__/selectedItem.tsx +2 -2
- package/src/core/components/menu/__workshop__/tones.tsx +3 -3
- package/src/core/components/menu/__workshop__/withoutArrow.tsx +1 -1
- package/src/core/components/menu/menu.test.tsx +6 -7
- package/src/core/components/menu/menu.tsx +27 -35
- package/src/core/components/menu/menuButton.tsx +18 -24
- package/src/core/components/menu/menuContext.ts +1 -1
- package/src/core/components/menu/menuDivider.tsx +25 -15
- package/src/core/components/menu/menuGroup.tsx +39 -33
- package/src/core/components/menu/menuItem.tsx +58 -46
- package/src/core/components/menu/useMenu.ts +1 -1
- package/src/core/components/menu/useMenuController.ts +4 -4
- package/src/core/components/skeleton/__workshop__/delay.tsx +3 -3
- package/src/core/components/skeleton/__workshop__/skeleton.tsx +4 -4
- package/src/core/components/skeleton/codeSkeleton.tsx +49 -0
- package/src/core/components/skeleton/headingSkeleton.tsx +48 -0
- package/src/core/components/skeleton/index.ts +3 -0
- package/src/core/components/skeleton/labelSkeleton.tsx +47 -0
- package/src/core/components/skeleton/skeleton.tsx +37 -18
- package/src/core/components/skeleton/textSkeleton.tsx +29 -112
- package/src/core/components/tab/__workshop__/example.tsx +2 -2
- package/src/core/components/tab/tab.tsx +28 -26
- package/src/core/components/tab/tabList.tsx +49 -28
- package/src/core/components/tab/tabPanel.tsx +29 -22
- package/src/core/components/toast/__workshop__/hook.tsx +1 -1
- package/src/core/components/toast/__workshop__/toast.tsx +5 -5
- package/src/core/components/toast/toast.test.tsx +5 -5
- package/src/core/components/toast/toast.tsx +30 -57
- package/src/core/components/toast/toastContext.ts +1 -1
- package/src/core/components/toast/toastLayer.tsx +29 -13
- package/src/core/components/toast/toastProvider.tsx +5 -10
- package/src/core/components/toast/types.ts +3 -7
- package/src/core/components/toast/useToast.ts +2 -4
- package/src/core/components/tree/__workshop__/basic.perf.ts +1 -1
- package/src/core/components/tree/__workshop__/basic.tsx +1 -1
- package/src/core/components/tree/__workshop__/tabFromElement.tsx +1 -1
- package/src/core/components/tree/helpers.ts +1 -1
- package/src/core/components/tree/tree.tsx +196 -191
- package/src/core/components/tree/treeContext.ts +1 -1
- package/src/core/components/tree/treeGroup.tsx +24 -6
- package/src/core/components/tree/treeItem.tsx +44 -34
- package/src/core/components/tree/types.ts +2 -2
- package/src/core/components/tree/useTree.ts +1 -1
- package/src/core/constants.ts +6 -0
- package/src/core/helpers/props.ts +18 -0
- package/src/core/hooks/index.ts +1 -0
- package/src/core/hooks/useArrayProp.ts +1 -4
- package/src/core/hooks/useClickOutside.test.tsx +15 -16
- package/src/core/hooks/useClickOutside.ts +2 -6
- package/src/core/hooks/useClickOutsideEvent.test.tsx +4 -5
- package/src/core/hooks/useClickOutsideEvent.ts +3 -9
- package/src/core/hooks/useDelayed.test.ts +6 -7
- package/src/core/hooks/useDelayedState.ts +1 -1
- package/src/core/hooks/useElementRect/__workshop__/example.tsx +1 -1
- package/src/core/hooks/useElementSize.ts +1 -1
- package/src/core/hooks/useForwardedRef.ts +1 -1
- package/src/core/hooks/useMatchMedia.ts +13 -31
- package/src/core/hooks/useMediaIndex/__workshop__/test.tsx +1 -1
- package/src/core/hooks/useMediaIndex/useMediaIndex.test.tsx +3 -18
- package/src/core/hooks/useMediaIndex/useMediaIndex.ts +12 -12
- package/src/core/hooks/usePrefersDark.hydration.test.tsx +4 -4
- package/src/core/hooks/usePrefersDark.test.tsx +1 -0
- package/src/core/hooks/usePrefersReducedMotion.hydration.test.tsx +4 -4
- package/src/core/hooks/usePrefersReducedMotion.test.tsx +1 -0
- package/src/core/hooks/useResponsiveProp.ts +28 -0
- package/src/core/index.ts +0 -1
- package/src/core/lib/isArray.ts +3 -0
- package/src/core/middleware/origin.ts +1 -1
- package/src/core/primitives/_selectable/selectable.tsx +33 -24
- package/src/core/primitives/avatar/__workshop__/asButton.tsx +2 -2
- package/src/core/primitives/avatar/__workshop__/stack.tsx +2 -2
- package/src/core/primitives/avatar/__workshop__/withinButton.tsx +2 -2
- package/src/core/primitives/avatar/__workshop__/withinMenuItem.tsx +1 -1
- package/src/core/primitives/avatar/avatar.tsx +43 -48
- package/src/core/primitives/avatar/avatarCounter.tsx +46 -39
- package/src/core/primitives/avatar/avatarStack.tsx +44 -45
- package/src/core/primitives/avatar/types.ts +3 -3
- package/src/core/primitives/badge/__workshop__/props.tsx +6 -17
- package/src/core/primitives/badge/__workshop__/tones.tsx +1 -6
- package/src/core/primitives/badge/badge.test.tsx +2 -3
- package/src/core/primitives/badge/badge.tsx +34 -40
- package/src/core/primitives/badge/types.ts +2 -1
- package/src/core/primitives/box/__workshop__/props.tsx +2 -2
- package/src/core/primitives/box/__workshop__/responsive.tsx +2 -1
- package/src/core/primitives/box/box.tsx +153 -88
- package/src/core/primitives/button/__workshop__/custom.tsx +19 -42
- package/src/core/primitives/button/__workshop__/customIcons.tsx +3 -3
- package/src/core/primitives/button/__workshop__/disabled.tsx +9 -9
- package/src/core/primitives/button/__workshop__/props.tsx +19 -22
- package/src/core/primitives/button/__workshop__/sanityUploadButton.tsx +3 -3
- package/src/core/primitives/button/__workshop__/stacked.tsx +15 -16
- package/src/core/primitives/button/__workshop__/uploadButton.tsx +2 -1
- package/src/core/primitives/button/button.test.tsx +3 -18
- package/src/core/primitives/button/button.tsx +67 -76
- package/src/core/primitives/card/__workshop__/asButton.tsx +14 -14
- package/src/core/primitives/card/__workshop__/asComponent.tsx +3 -3
- package/src/core/primitives/card/__workshop__/checkered.tsx +1 -1
- package/src/core/primitives/card/__workshop__/index.ts +1 -1
- package/src/core/primitives/card/__workshop__/interactive.tsx +3 -4
- package/src/core/primitives/card/__workshop__/listNavigation.tsx +3 -3
- package/src/core/primitives/card/__workshop__/props.tsx +14 -17
- package/src/core/primitives/card/__workshop__/selected.tsx +10 -41
- package/src/core/primitives/card/__workshop__/{allTones.tsx → tones.tsx} +3 -3
- package/src/core/primitives/card/card.tsx +52 -48
- package/src/core/primitives/card/cardContext.ts +10 -0
- package/src/core/primitives/card/cardProvider.tsx +27 -0
- package/src/core/primitives/card/index.ts +2 -0
- package/src/core/primitives/card/types.ts +19 -3
- package/src/core/primitives/card/useCard.ts +9 -0
- package/src/core/primitives/checkbox/__workshop__/props.tsx +6 -4
- package/src/core/primitives/checkbox/__workshop__/tones.tsx +11 -20
- package/src/core/primitives/checkbox/checkbox.tsx +30 -23
- package/src/core/primitives/code/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/code/__workshop__/props.tsx +4 -7
- package/src/core/primitives/code/code.tsx +27 -30
- package/src/core/primitives/code/refractor.tsx +0 -2
- package/src/core/primitives/container/__workshop__/example.tsx +2 -2
- package/src/core/primitives/container/container.tsx +27 -25
- package/src/core/primitives/flex/__workshop__/example.tsx +2 -2
- package/src/core/primitives/flex/flex.tsx +44 -17
- package/src/core/primitives/grid/grid.tsx +20 -17
- package/src/core/primitives/heading/__workshop__/opticalAlignment.tsx +2 -2
- package/src/core/primitives/heading/__workshop__/plain.tsx +12 -15
- package/src/core/primitives/heading/heading.tsx +51 -33
- package/src/core/primitives/inline/__workshop__/plain.tsx +2 -5
- package/src/core/primitives/inline/inline.tsx +46 -27
- package/src/core/primitives/inline/types.ts +1 -0
- package/src/core/primitives/kbd/kbd.tsx +28 -28
- package/src/core/primitives/label/__workshop__/plain.tsx +8 -17
- package/src/core/primitives/label/label.tsx +49 -39
- package/src/core/primitives/popover/__workshop__/AlignedStory.tsx +6 -6
- package/src/core/primitives/popover/__workshop__/MatchReferenceWidthStory.tsx +3 -3
- package/src/core/primitives/popover/__workshop__/OpenOnMountStory.tsx +1 -1
- package/src/core/primitives/popover/__workshop__/PlainStory.tsx +3 -3
- package/src/core/primitives/popover/__workshop__/RecursiveStory.tsx +3 -4
- package/src/core/primitives/popover/__workshop__/SidePanelStory.tsx +10 -6
- package/src/core/primitives/popover/__workshop__/TestStory.tsx +5 -4
- package/src/core/primitives/popover/constants.ts +1 -1
- package/src/core/primitives/popover/floating-ui/size.ts +2 -2
- package/src/core/primitives/popover/helpers.ts +1 -1
- package/src/core/primitives/popover/popover.tsx +299 -335
- package/src/core/primitives/popover/popoverLayer.tsx +147 -0
- package/src/core/primitives/popover/types.ts +3 -2
- package/src/core/primitives/radio/__workshop__/example.tsx +3 -3
- package/src/core/primitives/radio/__workshop__/plain.tsx +3 -3
- package/src/core/primitives/radio/radio.tsx +34 -19
- package/src/core/primitives/select/__workshop__/plain.tsx +15 -6
- package/src/core/primitives/select/__workshop__/readOnly.tsx +1 -1
- package/src/core/primitives/select/select.tsx +28 -28
- package/src/core/primitives/spinner/__workshop__/Props.tsx +4 -5
- package/src/core/primitives/spinner/animatedSpinnerIcon.tsx +7 -9
- package/src/core/primitives/spinner/spinner.tsx +27 -15
- package/src/core/primitives/stack/__workshop__/plain.tsx +2 -2
- package/src/core/primitives/stack/stack.tsx +44 -20
- package/src/core/primitives/switch/switch.tsx +31 -17
- package/src/core/primitives/text/__workshop__/colored.tsx +6 -6
- package/src/core/primitives/text/__workshop__/example.tsx +9 -20
- package/src/core/primitives/text/__workshop__/opticalAlignment.tsx +1 -1
- package/src/core/primitives/text/text.tsx +52 -44
- package/src/core/primitives/textArea/__workshop__/plain.tsx +44 -33
- package/src/core/primitives/textArea/textArea.tsx +47 -22
- package/src/core/primitives/textInput/__workshop__/customValidity.tsx +2 -2
- package/src/core/primitives/textInput/__workshop__/plain.tsx +36 -30
- package/src/core/primitives/textInput/__workshop__/states.tsx +5 -5
- package/src/core/primitives/textInput/__workshop__/tones.tsx +2 -2
- package/src/core/primitives/textInput/__workshop__/typed.tsx +2 -2
- package/src/core/primitives/textInput/textInput.tsx +80 -106
- package/src/core/primitives/tooltip/__workshop__/customPortal.tsx +5 -5
- package/src/core/primitives/tooltip/__workshop__/overflowingBoundary.tsx +2 -2
- package/src/core/primitives/tooltip/__workshop__/props.tsx +9 -8
- package/src/core/primitives/tooltip/__workshop__/resizableBoundary.tsx +1 -1
- package/src/core/primitives/tooltip/constants.ts +1 -1
- package/src/core/primitives/tooltip/tooltip.test.tsx +61 -60
- package/src/core/primitives/tooltip/tooltip.tsx +107 -90
- package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupContext.tsx +1 -1
- package/src/core/primitives/tooltip/tooltipDelayGroup/tooltipDelayGroupProvider.tsx +3 -5
- package/src/core/primitives/tooltip/tooltipDelayGroup/useTooltipDelayGroup.ts +1 -1
- package/src/core/primitives/tooltip/tooltipLayer.tsx +105 -0
- package/src/core/primitives/types.ts +19 -30
- package/src/core/types/avatar.ts +3 -6
- package/src/core/types/badge.ts +2 -4
- package/src/core/types/button.ts +2 -4
- package/src/core/types/card.ts +2 -4
- package/src/core/types/dialog.ts +1 -3
- package/src/core/types/flex.ts +3 -3
- package/src/core/types/props.ts +20 -10
- package/src/core/types/selectable.ts +1 -1
- package/src/core/utils/arrow/arrow.tsx +43 -28
- package/src/core/utils/boundaryElement/boundaryElement.test.tsx +5 -5
- package/src/core/utils/boundaryElement/boundaryElementContext.ts +1 -1
- package/src/core/utils/boundaryElement/boundaryElementProvider.tsx +4 -10
- package/src/core/utils/boundaryElement/types.ts +1 -3
- package/src/core/utils/boundaryElement/useBoundaryElement.ts +2 -4
- package/src/core/utils/elementQuery/__workshop__/customMedia.tsx +15 -8
- package/src/core/utils/elementQuery/elementQuery.tsx +41 -19
- package/src/core/utils/errorBoundary.tsx +6 -4
- package/src/core/utils/index.ts +0 -1
- package/src/core/utils/layer/__workshop__/multipleRoots.tsx +5 -5
- package/src/core/utils/layer/__workshop__/nested.tsx +3 -3
- package/src/core/utils/layer/__workshop__/responsiveZOffset.tsx +9 -5
- package/src/core/utils/layer/getLayerContext.test.ts +3 -1
- package/src/core/utils/layer/getLayerContext.ts +1 -1
- package/src/core/utils/layer/layer.test.tsx +5 -5
- package/src/core/utils/layer/layer.tsx +25 -95
- package/src/core/utils/layer/layerCard.tsx +90 -0
- package/src/core/utils/layer/layerContext.ts +1 -1
- package/src/core/utils/layer/layerProvider.tsx +20 -17
- package/src/core/utils/layer/useLayer.ts +2 -4
- package/src/core/utils/portal/__workshop__/named.tsx +3 -3
- package/src/core/utils/portal/portal.test.tsx +5 -5
- package/src/core/utils/portal/{portal.ts → portal.tsx} +17 -11
- package/src/core/utils/portal/portalContext.ts +1 -1
- package/src/core/utils/portal/portalProvider.tsx +4 -10
- package/src/core/utils/portal/types.ts +1 -3
- package/src/core/utils/portal/usePortal.ts +2 -4
- package/src/core/utils/srOnly/srOnly.tsx +25 -27
- package/src/core/utils/virtualList/__workshop__/infiniteList.tsx +1 -1
- package/src/core/utils/virtualList/virtualList.tsx +71 -55
- package/src/css/__theme/index.ts +16 -0
- package/src/css/__theme/lib/contract/buildVarContract.ts +78 -0
- package/src/css/__theme/lib/contract/index.ts +4 -0
- package/src/css/__theme/lib/contract/types.ts +17 -0
- package/src/css/__theme/resolveTheme.ts +865 -0
- package/src/css/_assign.ts +3 -0
- package/src/css/_composeClassNames.ts +12 -0
- package/src/css/_fromEntries.ts +3 -0
- package/src/css/_getClassNames.ts +9 -0
- package/src/css/_responsiveClassName.ts +45 -0
- package/src/css/_responsiveStyle.css.ts +34 -0
- package/src/css/_style.css.ts +9 -0
- package/src/css/components/breadcrumbs/breadcrumbs.css.ts +6 -0
- package/src/css/components/breadcrumbs/breadcrumbs.ts +5 -3
- package/src/css/components/dialog/dialog.css.ts +81 -0
- package/src/css/components/dialog/dialog.ts +20 -11
- package/src/css/components/index.ts +6 -0
- package/src/css/components/menu/menu.css.ts +14 -0
- package/src/css/components/menu/menu.ts +8 -5
- package/src/css/components/skeleton/skeleton.css.ts +132 -0
- package/src/css/components/skeleton/skeleton.ts +14 -9
- package/src/css/components/skeleton/types.ts +13 -5
- package/src/css/components/toast/toast.css.ts +16 -0
- package/src/css/components/toast/toast.ts +5 -15
- package/src/css/components/tree/tree.css.ts +65 -0
- package/src/css/components/tree/tree.ts +5 -3
- package/src/css/constants.ts +10 -0
- package/src/css/defaultTheme.css.ts +468 -0
- package/src/css/index.ts +12 -38
- package/src/css/layers.css.ts +9 -0
- package/src/css/primitives/_arrow/_arrow.css.ts +68 -0
- package/src/css/primitives/_arrow/_arrow.ts +18 -6
- package/src/css/primitives/_input/_input.css.ts +258 -0
- package/src/css/primitives/_input/input.ts +17 -14
- package/src/css/primitives/_input/types.ts +3 -3
- package/src/css/primitives/_selectable/_selectable.css.ts +121 -0
- package/src/css/primitives/_selectable/selectable.ts +5 -5
- package/src/css/primitives/_selectable/types.ts +3 -2
- package/src/css/primitives/avatar/avatar.css.ts +175 -0
- package/src/css/primitives/avatar/avatar.ts +52 -11
- package/src/css/primitives/avatar/types.ts +5 -3
- package/src/css/primitives/badge/badge.css.ts +26 -0
- package/src/css/primitives/badge/badge.ts +4 -4
- package/src/css/primitives/badge/types.ts +5 -4
- package/src/css/primitives/box/box.css.ts +19 -0
- package/src/css/primitives/box/box.ts +52 -16
- package/src/css/primitives/box/types.ts +46 -22
- package/src/css/primitives/button/button.css.ts +285 -0
- package/src/css/primitives/button/button.ts +15 -33
- package/src/css/primitives/button/index.ts +1 -0
- package/src/css/primitives/button/types.ts +19 -0
- package/src/css/primitives/card/card.css.ts +365 -0
- package/src/css/primitives/card/card.ts +9 -12
- package/src/css/primitives/card/types.ts +4 -6
- package/src/css/primitives/checkbox/checkbox.css.ts +193 -0
- package/src/css/primitives/checkbox/checkbox.ts +13 -5
- package/src/css/primitives/code/code.css.ts +271 -0
- package/src/css/primitives/code/code.ts +13 -5
- package/src/css/primitives/code/types.ts +4 -3
- package/src/css/primitives/container/container.css.ts +4 -0
- package/src/css/primitives/container/container.ts +12 -4
- package/src/css/primitives/container/types.ts +4 -2
- package/src/css/primitives/heading/heading.css.ts +85 -0
- package/src/css/primitives/heading/heading.ts +13 -11
- package/src/css/primitives/heading/types.ts +6 -3
- package/src/css/primitives/index.ts +24 -0
- package/src/css/primitives/kbd/kbd.css.ts +16 -0
- package/src/css/primitives/kbd/kbd.ts +6 -4
- package/src/css/primitives/kbd/types.ts +2 -3
- package/src/css/primitives/label/label.css.ts +85 -0
- package/src/css/primitives/label/label.ts +13 -10
- package/src/css/primitives/label/types.ts +13 -5
- package/src/css/primitives/popover/popover.css.ts +6 -0
- package/src/css/primitives/popover/popover.ts +10 -3
- package/src/css/primitives/radio/radio.css.ts +78 -0
- package/src/css/primitives/radio/radio.ts +15 -3
- package/src/css/primitives/select/select.css.ts +24 -0
- package/src/css/primitives/select/select.ts +7 -4
- package/src/css/primitives/select/types.ts +1 -1
- package/src/css/primitives/spinner/index.ts +1 -0
- package/src/css/primitives/spinner/spinner.css.ts +23 -0
- package/src/css/primitives/spinner/spinner.ts +9 -5
- package/src/css/primitives/spinner/types.ts +4 -0
- package/src/css/primitives/stack/index.ts +1 -0
- package/src/css/primitives/stack/stack.css.ts +6 -0
- package/src/css/primitives/stack/stack.ts +7 -0
- package/src/css/primitives/switch/switch.css.ts +98 -0
- package/src/css/primitives/switch/switch.ts +13 -7
- package/src/css/primitives/text/text.css.ts +85 -0
- package/src/css/primitives/text/text.ts +13 -11
- package/src/css/primitives/text/types.ts +9 -3
- package/src/css/primitives/textArea/textArea.css.ts +4 -0
- package/src/css/primitives/textArea/textArea.ts +5 -3
- package/src/css/primitives/textArea/types.ts +5 -3
- package/src/css/primitives/textInput/textInput.css.ts +41 -0
- package/src/css/primitives/textInput/textInput.ts +20 -4
- package/src/css/primitives/textInput/types.ts +3 -7
- package/src/css/primitives/tooltip/index.ts +1 -0
- package/src/css/primitives/tooltip/tooltip.css.ts +6 -0
- package/src/css/primitives/tooltip/tooltip.ts +8 -7
- package/src/css/primitives/tooltip/types.ts +4 -0
- package/src/css/props/alignItems/alignItems.css.ts +22 -0
- package/src/css/props/alignItems/alignItems.ts +8 -0
- package/src/css/props/alignItems/index.ts +2 -0
- package/src/css/props/alignItems/types.ts +9 -0
- package/src/css/props/border/border.css.ts +65 -0
- package/src/css/props/border/border.ts +36 -0
- package/src/css/props/border/types.ts +13 -0
- package/src/css/props/boxSizing/boxSizing.css.ts +11 -0
- package/src/css/props/boxSizing/boxSizing.ts +10 -0
- package/src/css/props/boxSizing/index.ts +2 -0
- package/src/css/props/boxSizing/types.ts +7 -0
- package/src/css/props/display/display.css.ts +56 -0
- package/src/css/props/display/display.ts +17 -0
- package/src/css/{styles → props}/display/types.ts +3 -4
- package/src/css/props/flex/flex.css.ts +52 -0
- package/src/css/props/flex/flex.ts +8 -0
- package/src/css/props/flex/types.ts +9 -0
- package/src/css/props/flexDirection/flexDirection.css.ts +19 -0
- package/src/css/props/flexDirection/flexDirection.ts +8 -0
- package/src/css/props/flexDirection/index.ts +2 -0
- package/src/css/props/flexDirection/types.ts +9 -0
- package/src/css/props/flexWrap/flexWrap.css.ts +16 -0
- package/src/css/props/flexWrap/flexWrap.ts +8 -0
- package/src/css/props/flexWrap/index.ts +2 -0
- package/src/css/props/flexWrap/types.ts +9 -0
- package/src/css/props/font/font.css.ts +93 -0
- package/src/css/props/font/font.ts +8 -0
- package/src/css/props/font/types.ts +6 -0
- package/src/css/props/gap/gap.css.ts +40 -0
- package/src/css/props/gap/gap.ts +13 -0
- package/src/css/{styles → props}/gap/types.ts +2 -2
- package/src/css/props/gridAutoColumns/gridAutoColumns.css.ts +19 -0
- package/src/css/props/gridAutoColumns/gridAutoColumns.ts +8 -0
- package/src/css/props/gridAutoColumns/index.ts +2 -0
- package/src/css/props/gridAutoColumns/types.ts +19 -0
- package/src/css/props/gridAutoFlow/gridAutoFlow.css.ts +19 -0
- package/src/css/props/gridAutoFlow/gridAutoFlow.ts +8 -0
- package/src/css/props/gridAutoFlow/index.ts +2 -0
- package/src/css/props/gridAutoFlow/types.ts +13 -0
- package/src/css/props/gridAutoRows/gridAutoRows.css.ts +19 -0
- package/src/css/props/gridAutoRows/gridAutoRows.ts +8 -0
- package/src/css/props/gridAutoRows/index.ts +2 -0
- package/src/css/props/gridAutoRows/types.ts +13 -0
- package/src/css/props/gridColumn/gridColumn.css.ts +49 -0
- package/src/css/props/gridColumn/gridColumn.ts +8 -0
- package/src/css/props/gridColumn/index.ts +2 -0
- package/src/css/props/gridColumn/types.ts +19 -0
- package/src/css/props/gridColumnEnd/gridColumnEnd.css.ts +46 -0
- package/src/css/props/gridColumnEnd/gridColumnEnd.ts +8 -0
- package/src/css/props/gridColumnEnd/index.ts +2 -0
- package/src/css/props/gridColumnEnd/types.ts +19 -0
- package/src/css/props/gridColumnStart/gridColumnStart.css.ts +46 -0
- package/src/css/props/gridColumnStart/gridColumnStart.ts +11 -0
- package/src/css/props/gridColumnStart/index.ts +2 -0
- package/src/css/props/gridColumnStart/types.ts +19 -0
- package/src/css/props/gridRow/gridRow.css.ts +49 -0
- package/src/css/props/gridRow/gridRow.ts +8 -0
- package/src/css/props/gridRow/index.ts +2 -0
- package/src/css/props/gridRow/types.ts +19 -0
- package/src/css/props/gridRowEnd/gridRowEnd.css.ts +46 -0
- package/src/css/props/gridRowEnd/gridRowEnd.ts +8 -0
- package/src/css/props/gridRowEnd/index.ts +2 -0
- package/src/css/props/gridRowEnd/types.ts +19 -0
- package/src/css/props/gridRowStart/gridRowStart.css.ts +46 -0
- package/src/css/props/gridRowStart/gridRowStart.ts +8 -0
- package/src/css/props/gridRowStart/index.ts +2 -0
- package/src/css/props/gridRowStart/types.ts +19 -0
- package/src/css/props/gridTemplateColumns/gridTemplateColumns.css.ts +43 -0
- package/src/css/props/gridTemplateColumns/gridTemplateColumns.ts +8 -0
- package/src/css/props/gridTemplateColumns/index.ts +2 -0
- package/src/css/props/gridTemplateColumns/types.ts +19 -0
- package/src/css/props/gridTemplateRows/gridTemplateRows.css.ts +43 -0
- package/src/css/props/gridTemplateRows/gridTemplateRows.ts +8 -0
- package/src/css/props/gridTemplateRows/index.ts +2 -0
- package/src/css/props/gridTemplateRows/types.ts +19 -0
- package/src/css/props/height/height.css.ts +25 -0
- package/src/css/props/height/height.ts +8 -0
- package/src/css/props/height/index.ts +2 -0
- package/src/css/props/height/types.ts +15 -0
- package/src/css/props/index.ts +37 -0
- package/src/css/props/inset/inset.css.ts +37 -0
- package/src/css/props/inset/inset.ts +21 -0
- package/src/css/{styles → props}/inset/types.ts +1 -1
- package/src/css/props/justifyContent/index.ts +2 -0
- package/src/css/props/justifyContent/justifyContent.css.ts +25 -0
- package/src/css/props/justifyContent/justifyContent.ts +8 -0
- package/src/css/props/justifyContent/types.ts +15 -0
- package/src/css/props/margin/margin.css.ts +117 -0
- package/src/css/props/margin/margin.ts +25 -0
- package/src/css/props/margin/types.ts +17 -0
- package/src/css/props/maxWidth/maxWidth.css.ts +32 -0
- package/src/css/props/maxWidth/maxWidth.ts +8 -0
- package/src/css/props/maxWidth/types.ts +11 -0
- package/src/css/props/minHeight/index.ts +2 -0
- package/src/css/props/minHeight/minHeight.css.ts +13 -0
- package/src/css/props/minHeight/minHeight.ts +8 -0
- package/src/css/props/minHeight/types.ts +9 -0
- package/src/css/props/minWidth/index.ts +2 -0
- package/src/css/props/minWidth/minWidth.css.ts +25 -0
- package/src/css/props/minWidth/minWidth.ts +8 -0
- package/src/css/props/minWidth/types.ts +9 -0
- package/src/css/props/outline/index.ts +2 -0
- package/src/css/props/outline/outline.css.ts +10 -0
- package/src/css/props/outline/outline.ts +8 -0
- package/src/css/props/outline/types.ts +7 -0
- package/src/css/props/overflow/overflow.css.ts +16 -0
- package/src/css/props/overflow/overflow.ts +8 -0
- package/src/css/props/overflow/types.ts +17 -0
- package/src/css/props/padding/padding.css.ts +87 -0
- package/src/css/props/padding/padding.ts +25 -0
- package/src/css/props/padding/types.ts +17 -0
- package/src/css/props/pointerEvents/pointerEvents.css.ts +13 -0
- package/src/css/props/pointerEvents/pointerEvents.ts +8 -0
- package/src/css/props/position/position.css.ts +22 -0
- package/src/css/props/position/position.ts +8 -0
- package/src/css/{styles → props}/position/types.ts +1 -1
- package/src/css/props/radius/radius.css.ts +21 -0
- package/src/css/props/radius/radius.ts +8 -0
- package/src/css/props/radius/types.ts +8 -0
- package/src/css/props/shadow/shadow.css.ts +23 -0
- package/src/css/props/shadow/shadow.ts +8 -0
- package/src/css/props/shadow/types.ts +8 -0
- package/src/css/props/textAlign/index.ts +2 -0
- package/src/css/props/textAlign/textAlign.css.ts +22 -0
- package/src/css/props/textAlign/textAlign.ts +8 -0
- package/src/css/props/textAlign/types.ts +7 -0
- package/src/css/props/textOverflow/textOverflow.css.ts +13 -0
- package/src/css/props/textOverflow/textOverflow.ts +8 -0
- package/src/css/{styles → props}/textOverflow/types.ts +5 -1
- package/src/css/props/width/types.ts +11 -0
- package/src/css/props/width/width.css.ts +28 -0
- package/src/css/props/width/width.ts +8 -0
- package/src/css/types.ts +221 -766
- package/src/css/util.ts +3 -8
- package/src/css/utils/index.ts +1 -0
- package/src/css/utils/srOnly/srOnly.css.ts +10 -0
- package/src/css/utils/srOnly/srOnly.ts +5 -3
- package/src/css/vars.css.ts +676 -0
- package/src/theme/getScopedTheme.ts +4 -4
- package/src/theme/index.ts +0 -5
- package/src/theme/types.ts +6 -10
- package/src/theme/v0/color/_generic.ts +1 -1
- package/src/theme/v0/color/button.ts +1 -1
- package/src/theme/v0/color/card.ts +1 -1
- package/src/theme/v0/color/color.ts +11 -11
- package/src/theme/v0/color/input.ts +1 -1
- package/src/theme/v0/color/muted.ts +1 -1
- package/src/theme/v0/color/selectable.ts +1 -1
- package/src/theme/v0/color/solid.ts +1 -1
- package/src/theme/v0/color/spot.ts +1 -1
- package/src/theme/v0/focusRing.ts +1 -3
- package/src/theme/v0/font.ts +6 -19
- package/src/theme/v0/layer.ts +1 -3
- package/src/theme/v0/shadow.ts +2 -6
- package/src/theme/v0/styles.ts +1 -1
- package/src/theme/v0/theme.ts +7 -7
- package/src/theme/v2/avatar.ts +2 -4
- package/src/theme/{build → v2/build}/_deprecated/color/_selectable/createSelectableTones.ts +3 -3
- package/src/theme/{build → v2/build}/_deprecated/color/_solid/createSolidTones.ts +2 -2
- package/src/theme/{build → v2/build}/_deprecated/color/button/createButtonModes.ts +7 -2
- package/src/theme/{build → v2/build}/_deprecated/color/button/createButtonTones.ts +4 -4
- package/src/theme/{build → v2/build}/_deprecated/color/card/createCardStates.ts +3 -3
- package/src/theme/{build → v2/build}/_deprecated/color/color.test.ts +1 -1
- package/src/theme/{build → v2/build}/_deprecated/color/defaults.ts +1 -1
- package/src/theme/{build → v2/build}/_deprecated/color/factory.ts +3 -3
- package/src/theme/{build → v2/build}/_deprecated/color/input/createInputModes.ts +7 -2
- package/src/theme/{build → v2/build}/_deprecated/color/muted/createMuted.ts +2 -2
- package/src/theme/{build → v2/build}/_deprecated/color/spot/createSpot.ts +2 -2
- package/src/theme/{build → v2/build}/buildColorTheme.test.ts +3 -1
- package/src/theme/{build → v2/build}/buildColorTheme.ts +24 -24
- package/src/theme/{build → v2/build}/buildTheme.test.ts +10 -8
- package/src/theme/v2/build/buildTheme.ts +12 -0
- package/src/theme/{build → v2/build}/colorToken/colorToken.ts +2 -2
- package/src/theme/{build → v2/build}/colorToken/compileColorToken.ts +1 -1
- package/src/theme/{build → v2/build}/colorToken/types.ts +2 -2
- package/src/theme/{build → v2/build}/lib/color-fns/blend/mix.ts +1 -1
- package/src/theme/{build → v2/build}/lib/color-fns/blend/multiply.ts +1 -1
- package/src/theme/{build → v2/build}/lib/color-fns/blend/screen.ts +1 -1
- package/src/theme/{build → v2/build}/lib/color-fns/color-fns.test.ts +1 -1
- package/src/theme/{build → v2/build}/lib/color-fns/contrastRatio.ts +5 -2
- package/src/theme/{build → v2/build}/lib/color-fns/convert.ts +1 -1
- package/src/theme/{build → v2/build}/lib/color-fns/parse.ts +1 -1
- package/src/theme/{build → v2/build}/mixThemeColor.test.ts +2 -0
- package/src/theme/{build → v2/build}/mixThemeColor.ts +1 -1
- package/src/theme/{build → v2/build}/renderColorTheme.ts +27 -27
- package/src/theme/{build → v2/build}/renderColorValue.ts +3 -3
- package/src/theme/{build → v2/build}/resolveColorTokens.ts +13 -13
- package/src/theme/v2/color/_helpers.ts +2 -2
- package/src/theme/v2/color/_system.ts +2 -4
- package/src/theme/v2/color/avatar.ts +3 -7
- package/src/theme/v2/color/badge.ts +3 -7
- package/src/theme/v2/color/button.ts +5 -11
- package/src/theme/v2/color/color.ts +10 -16
- package/src/theme/v2/color/input.ts +8 -10
- package/src/theme/v2/color/kbd.ts +1 -3
- package/src/theme/v2/color/selectable.ts +4 -8
- package/src/theme/v2/color/state.ts +5 -7
- package/src/theme/v2/color/syntax.ts +1 -3
- package/src/theme/{config → v2/config}/helpers.ts +6 -13
- package/src/theme/{config → v2/config}/system.ts +11 -12
- package/src/theme/{config → v2/config}/tokens/color/types.ts +14 -10
- package/src/theme/{config → v2/config}/tokens/index.ts +0 -1
- package/src/theme/{config → v2/config}/tokens/parseTokenValue.test.ts +2 -0
- package/src/theme/{config → v2/config}/tokens/parseTokenValue.ts +2 -2
- package/src/theme/{config → v2/config}/tokens/types.ts +3 -3
- package/src/theme/{config → v2/config}/types.ts +8 -6
- package/src/theme/{defaults → v2/defaults}/colorPalette.ts +1 -1
- package/src/theme/{defaults → v2/defaults}/colorTokens.ts +3 -3
- package/src/theme/{defaults → v2/defaults}/config.ts +2 -2
- package/src/theme/{defaults → v2/defaults}/fonts.ts +5 -6
- package/src/theme/v2/index.ts +2 -0
- package/src/theme/v2/input.ts +2 -4
- package/src/theme/v2/theme.ts +10 -14
- package/src/theme/{_constants.ts → v3/_constants.ts} +6 -3
- package/src/theme/v3/{color/parseColor.ts → _parseColorToken.ts} +59 -46
- package/src/theme/v3/buildTheme_v3.ts +20 -11
- package/src/theme/v3/color/_constants.ts +15 -0
- package/src/theme/v3/color/avatar.ts +14 -0
- package/src/theme/v3/color/card.ts +58 -95
- package/src/theme/v3/color/color.ts +75 -71
- package/src/theme/v3/color/element.ts +8 -8
- package/src/theme/v3/color/index.ts +2 -2
- package/src/theme/v3/color/token.ts +19 -4
- package/src/theme/v3/color/tokens.ts +2 -2
- package/src/theme/v3/defaultFonts.ts +250 -0
- package/src/theme/v3/defaultTokens.ts +199 -0
- package/src/theme/v3/index.ts +4 -1
- package/src/theme/{palette → v3/palette}/constants.ts +3 -3
- package/src/theme/v3/palette/types.ts +7 -0
- package/src/theme/v3/resolveTokens.ts +70 -65
- package/src/theme/v3/tokens.ts +2 -2
- package/src/theme/v3/types.ts +97 -12
- package/src/theme/versioning/getTheme_v2.ts +3 -3
- package/src/theme/versioning/is_v0.ts +2 -2
- package/src/theme/versioning/is_v2.ts +2 -2
- package/src/theme/versioning/themeColor_v0_v2.ts +2 -2
- package/src/theme/versioning/themeColor_v2_v2_9.ts +1 -1
- package/src/theme/versioning/themeColor_v3_v2.ts +229 -52
- package/src/theme/versioning/v0_v2.ts +3 -3
- package/src/theme/versioning/v2_v0.ts +4 -4
- package/src/theme/versioning/v3_v2.ts +62 -40
- package/dist/_chunks-cjs/_visual-editing.js +0 -3059
- package/dist/_chunks-cjs/_visual-editing.js.map +0 -1
- package/dist/_chunks-cjs/buildCommand.js +0 -32
- package/dist/_chunks-cjs/buildCommand.js.map +0 -1
- package/dist/_chunks-cjs/refractor.js.map +0 -1
- package/dist/_chunks-cjs/v3_v2.js +0 -251
- package/dist/_chunks-cjs/v3_v2.js.map +0 -1
- package/dist/_chunks-es/_visual-editing.mjs +0 -3066
- package/dist/_chunks-es/_visual-editing.mjs.map +0 -1
- package/dist/_chunks-es/refractor.mjs.map +0 -1
- package/dist/_chunks-es/v3_v2.mjs +0 -252
- package/dist/_chunks-es/v3_v2.mjs.map +0 -1
- package/dist/_visual-editing.d.mts +0 -806
- package/dist/_visual-editing.mjs +0 -31
- package/dist/_visual-editing.mjs.map +0 -1
- package/dist/cli.d.ts +0 -1
- package/dist/cli.js +0 -357
- package/dist/cli.js.map +0 -1
- package/dist/css.d.mts +0 -2135
- package/dist/css.mjs +0 -4713
- package/dist/css.mjs.map +0 -1
- package/dist/index.mjs +0 -1542
- package/dist/index.mjs.map +0 -1
- package/dist/sanity-palette.css +0 -9
- package/dist/sanity-theme.css +0 -1
- package/dist/system.css +0 -3577
- package/dist/theme.mjs.map +0 -1
- package/src/core/StyleTags.tsx +0 -24
- package/src/core/primitives/popover/popoverCard.tsx +0 -148
- package/src/core/primitives/tooltip/tooltipCard.tsx +0 -115
- package/src/core/utils/conditionalWrapper/conditionalWrapper.tsx +0 -23
- package/src/core/utils/conditionalWrapper/index.ts +0 -1
- package/src/css/_resp.ts +0 -31
- package/src/css/compile/compilePalette.ts +0 -60
- package/src/css/compile/compileRule.ts +0 -90
- package/src/css/compile/compileRules.test.ts +0 -35
- package/src/css/compile/compileRules.ts +0 -40
- package/src/css/compile/compileSystem.ts +0 -7
- package/src/css/compile/compileTheme.ts +0 -15
- package/src/css/compile/compileTheme_v3.ts +0 -410
- package/src/css/compile/types.ts +0 -6
- package/src/css/components/breadcrumbs/rules.ts +0 -25
- package/src/css/components/dialog/rules.ts +0 -76
- package/src/css/components/menu/rules.ts +0 -15
- package/src/css/components/skeleton/rules.ts +0 -112
- package/src/css/components/toast/rules.ts +0 -17
- package/src/css/components/tree/rules.ts +0 -168
- package/src/css/composeClassNames.ts +0 -13
- package/src/css/primitives/_arrow/rules.ts +0 -71
- package/src/css/primitives/_input/rules.ts +0 -163
- package/src/css/primitives/_selectable/__style.ts +0 -117
- package/src/css/primitives/_selectable/_contants.ts +0 -11
- package/src/css/primitives/_selectable/rules.ts +0 -129
- package/src/css/primitives/avatar/rules.ts +0 -176
- package/src/css/primitives/badge/rules.ts +0 -22
- package/src/css/primitives/box/rules.ts +0 -28
- package/src/css/primitives/button/_constants.ts +0 -17
- package/src/css/primitives/button/rules.ts +0 -293
- package/src/css/primitives/card/_constants.ts +0 -13
- package/src/css/primitives/card/rules.ts +0 -471
- package/src/css/primitives/checkbox/__styles.ts +0 -129
- package/src/css/primitives/checkbox/rules.ts +0 -152
- package/src/css/primitives/code/rules.ts +0 -96
- package/src/css/primitives/container/rules.ts +0 -8
- package/src/css/primitives/heading/rules.ts +0 -155
- package/src/css/primitives/kbd/rules.ts +0 -20
- package/src/css/primitives/label/rules.ts +0 -137
- package/src/css/primitives/popover/rules.ts +0 -5
- package/src/css/primitives/radio/rules.ts +0 -121
- package/src/css/primitives/select/rules.ts +0 -22
- package/src/css/primitives/spinner/rules.ts +0 -20
- package/src/css/primitives/switch/rules.ts +0 -340
- package/src/css/primitives/text/rules.ts +0 -164
- package/src/css/primitives/textArea/rules.ts +0 -7
- package/src/css/primitives/textInput/rules.ts +0 -224
- package/src/css/primitives/token/rules.ts +0 -45
- package/src/css/primitives/tooltip/rules.ts +0 -19
- package/src/css/responsiveRules.ts +0 -25
- package/src/css/rules.ts +0 -113
- package/src/css/styles/border/border.ts +0 -22
- package/src/css/styles/border/rules.ts +0 -24
- package/src/css/styles/border/types.ts +0 -10
- package/src/css/styles/display/display.ts +0 -7
- package/src/css/styles/display/rules.ts +0 -62
- package/src/css/styles/flex/flex.ts +0 -20
- package/src/css/styles/flex/rules.ts +0 -28
- package/src/css/styles/flex/types.ts +0 -35
- package/src/css/styles/flexItem/flexItem.ts +0 -8
- package/src/css/styles/flexItem/index.ts +0 -2
- package/src/css/styles/flexItem/rules.ts +0 -12
- package/src/css/styles/flexItem/types.ts +0 -11
- package/src/css/styles/font/font.ts +0 -17
- package/src/css/styles/font/rules.ts +0 -148
- package/src/css/styles/font/types.ts +0 -12
- package/src/css/styles/gap/gap.ts +0 -8
- package/src/css/styles/gap/rules.ts +0 -34
- package/src/css/styles/grid/grid.ts +0 -13
- package/src/css/styles/grid/index.ts +0 -2
- package/src/css/styles/grid/rules.ts +0 -146
- package/src/css/styles/grid/types.ts +0 -29
- package/src/css/styles/gridItem/gridItem.ts +0 -15
- package/src/css/styles/gridItem/index.ts +0 -2
- package/src/css/styles/gridItem/rules.ts +0 -96
- package/src/css/styles/gridItem/types.ts +0 -41
- package/src/css/styles/height/rules.ts +0 -7
- package/src/css/styles/index.ts +0 -19
- package/src/css/styles/inset/inset.ts +0 -13
- package/src/css/styles/inset/rules.ts +0 -16
- package/src/css/styles/margin/margin.ts +0 -15
- package/src/css/styles/margin/rules.ts +0 -64
- package/src/css/styles/margin/types.ts +0 -11
- package/src/css/styles/maxWidth/maxWidth.ts +0 -6
- package/src/css/styles/maxWidth/rules.ts +0 -13
- package/src/css/styles/maxWidth/types.ts +0 -7
- package/src/css/styles/outline/rules.ts +0 -7
- package/src/css/styles/overflow/overflow.ts +0 -11
- package/src/css/styles/overflow/rules.ts +0 -9
- package/src/css/styles/overflow/types.ts +0 -11
- package/src/css/styles/padding/padding.ts +0 -15
- package/src/css/styles/padding/rules.ts +0 -62
- package/src/css/styles/padding/types.ts +0 -14
- package/src/css/styles/pointerEvents/pointerEvents.ts +0 -6
- package/src/css/styles/pointerEvents/rules.ts +0 -11
- package/src/css/styles/position/position.ts +0 -7
- package/src/css/styles/position/rules.ts +0 -24
- package/src/css/styles/radius/radius.ts +0 -8
- package/src/css/styles/radius/rules.ts +0 -13
- package/src/css/styles/radius/types.ts +0 -8
- package/src/css/styles/shadow/rules.ts +0 -53
- package/src/css/styles/shadow/shadow.ts +0 -7
- package/src/css/styles/shadow/types.ts +0 -8
- package/src/css/styles/textOverflow/rules.ts +0 -17
- package/src/css/styles/textOverflow/textOverflow.ts +0 -6
- package/src/css/styles/width/rules.ts +0 -7
- package/src/css/styles/width/types.ts +0 -9
- package/src/css/styles/width/width.ts +0 -6
- package/src/css/utils/srOnly/rules.ts +0 -11
- package/src/css/varNames.ts +0 -473
- package/src/css/vars.ts +0 -443
- package/src/theme/_types.ts +0 -41
- package/src/theme/build/buildTheme.ts +0 -12
- package/src/theme/build/theme.test.ts +0 -27
- package/src/theme/config/tokens/parseTokenKey.test.ts +0 -64
- package/src/theme/config/tokens/parseTokenKey.ts +0 -67
- package/src/theme/palette/types.ts +0 -16
- package/src/theme/v3/buildTheme_v3.test.ts +0 -40
- package/src/theme/v3/color/buildColor_v3.ts +0 -193
- package/src/theme/v3/color/parseColor.test.ts +0 -79
- package/src/theme/v3/color/renderColor.test.ts +0 -19
- package/src/theme/v3/color/renderColor.ts +0 -33
- package/src/theme/v3/defaults.ts +0 -205
- /package/src/core/components/autocomplete/{__mocks__ → __workshop__/mock}/apiStore.ts +0 -0
- /package/src/core/components/autocomplete/{__mocks__ → __workshop__/mock}/countries.ts +0 -0
- /package/src/css/{styles → props}/border/index.ts +0 -0
- /package/src/css/{styles → props}/display/index.ts +0 -0
- /package/src/css/{styles → props}/flex/index.ts +0 -0
- /package/src/css/{styles → props}/font/index.ts +0 -0
- /package/src/css/{styles → props}/gap/index.ts +0 -0
- /package/src/css/{styles → props}/inset/index.ts +0 -0
- /package/src/css/{styles → props}/margin/index.ts +0 -0
- /package/src/css/{styles → props}/maxWidth/index.ts +0 -0
- /package/src/css/{styles → props}/overflow/index.ts +0 -0
- /package/src/css/{styles → props}/padding/index.ts +0 -0
- /package/src/css/{styles → props}/pointerEvents/index.ts +0 -0
- /package/src/css/{styles → props}/pointerEvents/types.ts +0 -0
- /package/src/css/{styles → props}/position/index.ts +0 -0
- /package/src/css/{styles → props}/radius/index.ts +0 -0
- /package/src/css/{styles → props}/shadow/index.ts +0 -0
- /package/src/css/{styles → props}/textOverflow/index.ts +0 -0
- /package/src/css/{styles → props}/width/index.ts +0 -0
- /package/src/theme/{build → v2/build}/_deprecated/color/index.ts +0 -0
- /package/src/theme/{build → v2/build}/colorToken/index.ts +0 -0
- /package/src/theme/{build → v2/build}/index.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/color-fns/blend/index.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/color-fns/index.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/color-fns/rgba.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/color-fns/types.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/isRecord.ts +0 -0
- /package/src/theme/{build → v2/build}/lib/utils.ts +0 -0
- /package/src/theme/{build → v2/build}/merge.ts +0 -0
- /package/src/theme/{config → v2/config}/index.ts +0 -0
- /package/src/theme/{config → v2/config}/tokens/color/index.ts +0 -0
- /package/src/theme/{palette → v3/palette}/index.ts +0 -0
|
@@ -0,0 +1,2500 @@
|
|
|
1
|
+
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { c } from "react-compiler-runtime";
|
|
3
|
+
import { getScopedTheme, getTheme_v2 } from "@sanity/ui/theme";
|
|
4
|
+
import { createContext, useContext, useEffect, useDebugValue, useState, useSyncExternalStore, isValidElement, lazy, Suspense, useImperativeHandle, useRef, useMemo, useCallback, cloneElement, useId, useLayoutEffect, Children } from "react";
|
|
5
|
+
import { ThemeProvider as ThemeProvider$1, useTheme as useTheme$1 } from "styled-components";
|
|
6
|
+
import { BREAKPOINTS, box, text, textOverflow, animatedSpinnerIcon, spinner, button, buttonLoadingBox, card, code, kbd, _arrow, vars, _arrowSvg, _arrowStrokeMask, _arrowStroke, _arrowShape, popoverCard, popover, stack, textInput, textInputPrefix, textInputElement, _inputElement, _inputPresentation, textInputSuffix, tooltip, menu, menuDivider, _selectable } from "@sanity/ui/css";
|
|
7
|
+
import { ResizeObserver } from "@juggle/resize-observer";
|
|
8
|
+
import { useEffectEvent } from "use-effect-event";
|
|
9
|
+
import { SpinnerIcon, CloseIcon, ChevronRightIcon } from "@sanity/icons";
|
|
10
|
+
import { isValidElementType } from "react-is";
|
|
11
|
+
import { detectOverflow, flip, offset, shift, arrow, hide, useFloating, autoUpdate } from "@floating-ui/react-dom";
|
|
12
|
+
import { motion, AnimatePresence } from "framer-motion";
|
|
13
|
+
import { assignInlineVars } from "@vanilla-extract/dynamic";
|
|
14
|
+
import { createPortal } from "react-dom";
|
|
15
|
+
function getGlobalScope() {
|
|
16
|
+
if (typeof globalThis < "u") return globalThis;
|
|
17
|
+
if (typeof window < "u") return window;
|
|
18
|
+
if (typeof self < "u") return self;
|
|
19
|
+
if (typeof global < "u") return global;
|
|
20
|
+
throw new Error("@sanity/ui: could not locate global scope");
|
|
21
|
+
}
|
|
22
|
+
const globalScope = getGlobalScope();
|
|
23
|
+
function createGlobalScopedContext(key2, defaultValue) {
|
|
24
|
+
const symbol = Symbol.for(key2);
|
|
25
|
+
return typeof document > "u" ? createContext(defaultValue) : (globalScope[symbol] = globalScope[symbol] || createContext(defaultValue), globalScope[symbol]);
|
|
26
|
+
}
|
|
27
|
+
const CardContext = createGlobalScopedContext("@sanity/ui/context/card", null);
|
|
28
|
+
function CardProvider(props) {
|
|
29
|
+
const $ = c(7), {
|
|
30
|
+
children,
|
|
31
|
+
tone,
|
|
32
|
+
scheme,
|
|
33
|
+
unstable_CompatProvider
|
|
34
|
+
} = props;
|
|
35
|
+
let t0, t1;
|
|
36
|
+
$[0] !== scheme || $[1] !== tone || $[2] !== unstable_CompatProvider ? (t1 = {
|
|
37
|
+
tone,
|
|
38
|
+
scheme,
|
|
39
|
+
unstable_CompatProvider
|
|
40
|
+
}, $[0] = scheme, $[1] = tone, $[2] = unstable_CompatProvider, $[3] = t1) : t1 = $[3], t0 = t1;
|
|
41
|
+
let t2;
|
|
42
|
+
return $[4] !== children || $[5] !== t0 ? (t2 = /* @__PURE__ */ jsx(CardContext.Provider, { value: t0, children }), $[4] = children, $[5] = t0, $[6] = t2) : t2 = $[6], t2;
|
|
43
|
+
}
|
|
44
|
+
const ThemeContext = createGlobalScopedContext("@sanity/ui/context/theme", null);
|
|
45
|
+
function ThemeProvider(props) {
|
|
46
|
+
const $ = c(19), parentTheme = useContext(ThemeContext), {
|
|
47
|
+
children
|
|
48
|
+
} = props, scheme = props.scheme ?? (parentTheme?.scheme || "light"), rootTheme = props.theme ?? (parentTheme?.theme || null), tone = props.tone ?? (parentTheme?.tone || "default");
|
|
49
|
+
let t0;
|
|
50
|
+
bb0: {
|
|
51
|
+
if (!rootTheme) {
|
|
52
|
+
t0 = null;
|
|
53
|
+
break bb0;
|
|
54
|
+
}
|
|
55
|
+
let t12;
|
|
56
|
+
$[0] !== rootTheme || $[1] !== scheme || $[2] !== tone ? (t12 = {
|
|
57
|
+
version: 0,
|
|
58
|
+
theme: rootTheme,
|
|
59
|
+
scheme,
|
|
60
|
+
tone
|
|
61
|
+
}, $[0] = rootTheme, $[1] = scheme, $[2] = tone, $[3] = t12) : t12 = $[3], t0 = t12;
|
|
62
|
+
}
|
|
63
|
+
const themeContext = t0;
|
|
64
|
+
let t1;
|
|
65
|
+
bb1: {
|
|
66
|
+
if (!rootTheme) {
|
|
67
|
+
t1 = null;
|
|
68
|
+
break bb1;
|
|
69
|
+
}
|
|
70
|
+
let t22;
|
|
71
|
+
$[4] !== rootTheme || $[5] !== scheme || $[6] !== tone ? (t22 = getScopedTheme(rootTheme, scheme, tone), $[4] = rootTheme, $[5] = scheme, $[6] = tone, $[7] = t22) : t22 = $[7], t1 = t22;
|
|
72
|
+
}
|
|
73
|
+
const theme = t1;
|
|
74
|
+
if (!theme) {
|
|
75
|
+
let t22;
|
|
76
|
+
return $[8] === Symbol.for("react.memo_cache_sentinel") ? (t22 = /* @__PURE__ */ jsx("pre", { children: 'ThemeProvider: no "theme" property provided' }), $[8] = t22) : t22 = $[8], t22;
|
|
77
|
+
}
|
|
78
|
+
let t2;
|
|
79
|
+
$[9] !== children || $[10] !== theme ? (t2 = /* @__PURE__ */ jsx(ThemeProvider$1, { theme, children }), $[9] = children, $[10] = theme, $[11] = t2) : t2 = $[11];
|
|
80
|
+
let t3;
|
|
81
|
+
$[12] !== t2 || $[13] !== themeContext ? (t3 = /* @__PURE__ */ jsx(ThemeContext.Provider, { value: themeContext, children: t2 }), $[12] = t2, $[13] = themeContext, $[14] = t3) : t3 = $[14];
|
|
82
|
+
let t4;
|
|
83
|
+
return $[15] !== scheme || $[16] !== t3 || $[17] !== tone ? (t4 = /* @__PURE__ */ jsx(CardProvider, { scheme, tone, unstable_CompatProvider: ThemeColorProvider, children: t3 }), $[15] = scheme, $[16] = t3, $[17] = tone, $[18] = t4) : t4 = $[18], t4;
|
|
84
|
+
}
|
|
85
|
+
function useRootTheme() {
|
|
86
|
+
const value = useContext(ThemeContext);
|
|
87
|
+
if (!value)
|
|
88
|
+
throw new Error("useRootTheme(): missing context value");
|
|
89
|
+
return value;
|
|
90
|
+
}
|
|
91
|
+
function ThemeColorProvider(props) {
|
|
92
|
+
const $ = c(5), {
|
|
93
|
+
children,
|
|
94
|
+
scheme,
|
|
95
|
+
tone
|
|
96
|
+
} = props, root = useRootTheme(), t0 = scheme || root.scheme;
|
|
97
|
+
let t1;
|
|
98
|
+
return $[0] !== children || $[1] !== root.theme || $[2] !== t0 || $[3] !== tone ? (t1 = /* @__PURE__ */ jsx(ThemeProvider, { scheme: t0, theme: root.theme, tone, children }), $[0] = children, $[1] = root.theme, $[2] = t0, $[3] = tone, $[4] = t1) : t1 = $[4], t1;
|
|
99
|
+
}
|
|
100
|
+
function useTheme() {
|
|
101
|
+
return useTheme$1();
|
|
102
|
+
}
|
|
103
|
+
function useTheme_v2() {
|
|
104
|
+
const $ = c(2), t0 = useTheme$1();
|
|
105
|
+
let t1;
|
|
106
|
+
return $[0] !== t0 ? (t1 = getTheme_v2(t0), $[0] = t0, $[1] = t1) : t1 = $[1], t1;
|
|
107
|
+
}
|
|
108
|
+
const EMPTY_ARRAY = [], EMPTY_RECORD = {}, POPOVER_MOTION_PROPS = {
|
|
109
|
+
card: {
|
|
110
|
+
initial: {
|
|
111
|
+
scale: 0.97,
|
|
112
|
+
willChange: "transform"
|
|
113
|
+
},
|
|
114
|
+
hidden: {
|
|
115
|
+
opacity: 0
|
|
116
|
+
},
|
|
117
|
+
visible: {
|
|
118
|
+
opacity: 1,
|
|
119
|
+
transition: {
|
|
120
|
+
when: "beforeChildren",
|
|
121
|
+
duration: 0.1
|
|
122
|
+
}
|
|
123
|
+
},
|
|
124
|
+
scaleIn: {
|
|
125
|
+
scale: 1
|
|
126
|
+
},
|
|
127
|
+
scaleOut: {
|
|
128
|
+
scale: 0.97
|
|
129
|
+
}
|
|
130
|
+
},
|
|
131
|
+
transition: {
|
|
132
|
+
type: "spring",
|
|
133
|
+
visualDuration: 0.2,
|
|
134
|
+
bounce: 0.25
|
|
135
|
+
}
|
|
136
|
+
}, Z_OFFSETS = {
|
|
137
|
+
dialog: 600,
|
|
138
|
+
popover: 400,
|
|
139
|
+
tooltip: 200
|
|
140
|
+
};
|
|
141
|
+
function _isEnterToClickElement(element) {
|
|
142
|
+
return isHTMLAnchorElement(element) || isHTMLButtonElement(element);
|
|
143
|
+
}
|
|
144
|
+
function isHTMLElement(node) {
|
|
145
|
+
return node instanceof Node && node.nodeType === Node.ELEMENT_NODE;
|
|
146
|
+
}
|
|
147
|
+
function isHTMLAnchorElement(element) {
|
|
148
|
+
return isHTMLElement(element) && element.nodeName === "A";
|
|
149
|
+
}
|
|
150
|
+
function isHTMLInputElement(element) {
|
|
151
|
+
return isHTMLElement(element) && element.nodeName === "INPUT";
|
|
152
|
+
}
|
|
153
|
+
function isHTMLButtonElement(element) {
|
|
154
|
+
return isHTMLElement(element) && element.nodeName === "BUTTON";
|
|
155
|
+
}
|
|
156
|
+
function isHTMLSelectElement(element) {
|
|
157
|
+
return isHTMLElement(element) && element.nodeName === "SELECT";
|
|
158
|
+
}
|
|
159
|
+
function isHTMLTextAreaElement(element) {
|
|
160
|
+
return isHTMLElement(element) && element.nodeName === "TEXTAREA";
|
|
161
|
+
}
|
|
162
|
+
function containsOrEqualsElement(element, node) {
|
|
163
|
+
return element.contains(node) || element === node;
|
|
164
|
+
}
|
|
165
|
+
function isArray(val) {
|
|
166
|
+
return Array.isArray(val);
|
|
167
|
+
}
|
|
168
|
+
function isRecord(value) {
|
|
169
|
+
return !!(value && typeof value == "object" && !Array.isArray(value));
|
|
170
|
+
}
|
|
171
|
+
function _getArrayProp(val, defaultVal) {
|
|
172
|
+
return val === void 0 ? defaultVal || EMPTY_ARRAY : Array.isArray(val) ? val : [val];
|
|
173
|
+
}
|
|
174
|
+
function _getResponsiveProp(val, defaultVal) {
|
|
175
|
+
return val === void 0 ? defaultVal || EMPTY_ARRAY : isArray(val) || isRecord(val) ? val : [val];
|
|
176
|
+
}
|
|
177
|
+
function useClickOutsideEvent(listener, t0, boundaryElement) {
|
|
178
|
+
const $ = c(9), elementsArg = t0 === void 0 ? _temp$5 : t0;
|
|
179
|
+
let t1;
|
|
180
|
+
$[0] !== boundaryElement || $[1] !== elementsArg || $[2] !== listener ? (t1 = (evt) => {
|
|
181
|
+
if (!listener)
|
|
182
|
+
return;
|
|
183
|
+
const target = evt.target;
|
|
184
|
+
if (!(target instanceof Node))
|
|
185
|
+
return;
|
|
186
|
+
const resolvedBoundaryElement = boundaryElement?.();
|
|
187
|
+
if (resolvedBoundaryElement && !resolvedBoundaryElement.contains(target))
|
|
188
|
+
return;
|
|
189
|
+
const elements = elementsArg().flat();
|
|
190
|
+
for (const el of elements)
|
|
191
|
+
if (el && (target === el || el.contains(target)))
|
|
192
|
+
return;
|
|
193
|
+
listener(evt);
|
|
194
|
+
}, $[0] = boundaryElement, $[1] = elementsArg, $[2] = listener, $[3] = t1) : t1 = $[3];
|
|
195
|
+
const onEvent = useEffectEvent(t1), hasListener = !!listener;
|
|
196
|
+
let t2;
|
|
197
|
+
$[4] !== hasListener || $[5] !== onEvent ? (t2 = () => {
|
|
198
|
+
if (!hasListener)
|
|
199
|
+
return;
|
|
200
|
+
const handleEvent = (evt_0) => onEvent(evt_0);
|
|
201
|
+
return document.addEventListener("mousedown", handleEvent), () => {
|
|
202
|
+
document.removeEventListener("mousedown", handleEvent);
|
|
203
|
+
};
|
|
204
|
+
}, $[4] = hasListener, $[5] = onEvent, $[6] = t2) : t2 = $[6];
|
|
205
|
+
let t3;
|
|
206
|
+
$[7] !== hasListener ? (t3 = [hasListener], $[7] = hasListener, $[8] = t3) : t3 = $[8], useEffect(t2, t3), useDebugValue(listener ? "MouseDown On" : "MouseDown Off");
|
|
207
|
+
}
|
|
208
|
+
function _temp$5() {
|
|
209
|
+
return EMPTY_ARRAY;
|
|
210
|
+
}
|
|
211
|
+
function useCustomValidity(ref, customValidity) {
|
|
212
|
+
const $ = c(6);
|
|
213
|
+
let t0;
|
|
214
|
+
$[0] !== customValidity || $[1] !== ref.current ? (t0 = () => {
|
|
215
|
+
ref.current?.setCustomValidity(customValidity || "");
|
|
216
|
+
}, $[0] = customValidity, $[1] = ref.current, $[2] = t0) : t0 = $[2];
|
|
217
|
+
let t1;
|
|
218
|
+
$[3] !== customValidity || $[4] !== ref ? (t1 = [customValidity, ref], $[3] = customValidity, $[4] = ref, $[5] = t1) : t1 = $[5], useEffect(t0, t1);
|
|
219
|
+
}
|
|
220
|
+
const _ResizeObserver = typeof document < "u" && typeof window < "u" && window.ResizeObserver ? window.ResizeObserver : ResizeObserver, _elementSizeObserver = _createElementSizeObserver();
|
|
221
|
+
function _createElementRectValueListener() {
|
|
222
|
+
return {
|
|
223
|
+
subscribe(element, subscriber) {
|
|
224
|
+
const resizeObserver = new _ResizeObserver(([entry]) => {
|
|
225
|
+
subscriber({
|
|
226
|
+
_contentRect: entry.contentRect,
|
|
227
|
+
border: {
|
|
228
|
+
width: entry.borderBoxSize[0].inlineSize,
|
|
229
|
+
height: entry.borderBoxSize[0].blockSize
|
|
230
|
+
},
|
|
231
|
+
content: {
|
|
232
|
+
width: entry.contentRect.width,
|
|
233
|
+
height: entry.contentRect.height
|
|
234
|
+
}
|
|
235
|
+
});
|
|
236
|
+
});
|
|
237
|
+
return resizeObserver.observe(element), () => {
|
|
238
|
+
resizeObserver.unobserve(element), resizeObserver.disconnect();
|
|
239
|
+
};
|
|
240
|
+
}
|
|
241
|
+
};
|
|
242
|
+
}
|
|
243
|
+
function _createElementSizeObserver() {
|
|
244
|
+
const disposeCache = /* @__PURE__ */ new WeakMap(), subscribersCache = /* @__PURE__ */ new WeakMap();
|
|
245
|
+
return {
|
|
246
|
+
subscribe(element, subscriber) {
|
|
247
|
+
const subscribers = subscribersCache.get(element) || [];
|
|
248
|
+
let dispose = disposeCache.get(element);
|
|
249
|
+
return subscribersCache.has(element) || (subscribersCache.set(element, subscribers), dispose = _createElementRectValueListener().subscribe(element, (elementRect) => {
|
|
250
|
+
for (const sub of subscribers)
|
|
251
|
+
sub(elementRect);
|
|
252
|
+
})), subscribers.push(subscriber), () => {
|
|
253
|
+
const idx = subscribers.indexOf(subscriber);
|
|
254
|
+
idx > -1 && subscribers.splice(idx, 1), subscribers.length === 0 && dispose && dispose();
|
|
255
|
+
};
|
|
256
|
+
}
|
|
257
|
+
};
|
|
258
|
+
}
|
|
259
|
+
function useElementSize(element) {
|
|
260
|
+
const $ = c(3), [size2, setSize] = useState(null);
|
|
261
|
+
let t0, t1;
|
|
262
|
+
return $[0] !== element ? (t0 = () => {
|
|
263
|
+
if (element)
|
|
264
|
+
return _elementSizeObserver.subscribe(element, setSize);
|
|
265
|
+
}, t1 = [element], $[0] = element, $[1] = t0, $[2] = t1) : (t0 = $[1], t1 = $[2]), useEffect(t0, t1), size2;
|
|
266
|
+
}
|
|
267
|
+
function useGlobalKeyDown(onKeyDown) {
|
|
268
|
+
const $ = c(5);
|
|
269
|
+
let t0;
|
|
270
|
+
$[0] !== onKeyDown ? (t0 = (event) => onKeyDown(event), $[0] = onKeyDown, $[1] = t0) : t0 = $[1];
|
|
271
|
+
const handleKeyDown = useEffectEvent(t0);
|
|
272
|
+
let t1;
|
|
273
|
+
$[2] !== handleKeyDown ? (t1 = () => {
|
|
274
|
+
const handler = (event_0) => handleKeyDown(event_0);
|
|
275
|
+
return window.addEventListener("keydown", handler), () => window.removeEventListener("keydown", handler);
|
|
276
|
+
}, $[2] = handleKeyDown, $[3] = t1) : t1 = $[3];
|
|
277
|
+
let t2;
|
|
278
|
+
$[4] === Symbol.for("react.memo_cache_sentinel") ? (t2 = [], $[4] = t2) : t2 = $[4], useEffect(t1, t2);
|
|
279
|
+
}
|
|
280
|
+
function useMatchMedia(mediaQueryString, getServerSnapshot2) {
|
|
281
|
+
const $ = c(4);
|
|
282
|
+
useDebugValue(mediaQueryString);
|
|
283
|
+
let t0;
|
|
284
|
+
$[0] !== mediaQueryString ? (t0 = (onStoreChange) => {
|
|
285
|
+
const media2 = window.matchMedia(mediaQueryString);
|
|
286
|
+
return media2.addEventListener("change", onStoreChange), () => media2.removeEventListener("change", onStoreChange);
|
|
287
|
+
}, $[0] = mediaQueryString, $[1] = t0) : t0 = $[1];
|
|
288
|
+
let t1;
|
|
289
|
+
return $[2] !== mediaQueryString ? (t1 = () => window.matchMedia(mediaQueryString).matches, $[2] = mediaQueryString, $[3] = t1) : t1 = $[3], useSyncExternalStore(t0, t1, getServerSnapshot2);
|
|
290
|
+
}
|
|
291
|
+
const media = Object.values(BREAKPOINTS);
|
|
292
|
+
function _getMediaQuery(media2, index) {
|
|
293
|
+
return index === 0 ? `screen and (max-width: ${media2[index + 1] - 1}px)` : index === media2.length - 1 ? `screen and (min-width: ${media2[index]}px)` : `screen and (min-width: ${media2[index]}px) and (max-width: ${media2[index + 1] - 1}px)`;
|
|
294
|
+
}
|
|
295
|
+
function _createMediaStore() {
|
|
296
|
+
const mediaLen = media.length;
|
|
297
|
+
let sizes;
|
|
298
|
+
const getSizes = () => {
|
|
299
|
+
if (!sizes) {
|
|
300
|
+
sizes = [];
|
|
301
|
+
for (let index = mediaLen; index > -1; index -= 1) {
|
|
302
|
+
const mediaQuery = _getMediaQuery(media, index);
|
|
303
|
+
sizes.push({
|
|
304
|
+
index,
|
|
305
|
+
mq: window.matchMedia(mediaQuery)
|
|
306
|
+
});
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
return sizes;
|
|
310
|
+
};
|
|
311
|
+
return {
|
|
312
|
+
getSnapshot: () => {
|
|
313
|
+
for (const {
|
|
314
|
+
index,
|
|
315
|
+
mq
|
|
316
|
+
} of getSizes())
|
|
317
|
+
if (mq.matches) return index;
|
|
318
|
+
return 0;
|
|
319
|
+
},
|
|
320
|
+
subscribe: (onStoreChange) => {
|
|
321
|
+
const disposeFns = [];
|
|
322
|
+
for (const {
|
|
323
|
+
mq
|
|
324
|
+
} of getSizes()) {
|
|
325
|
+
const handleChange = () => {
|
|
326
|
+
mq.matches && onStoreChange();
|
|
327
|
+
};
|
|
328
|
+
mq.addEventListener("change", handleChange), disposeFns.push(() => mq.removeEventListener("change", handleChange));
|
|
329
|
+
}
|
|
330
|
+
return () => {
|
|
331
|
+
for (const disposeFn of disposeFns)
|
|
332
|
+
disposeFn();
|
|
333
|
+
};
|
|
334
|
+
}
|
|
335
|
+
};
|
|
336
|
+
}
|
|
337
|
+
function getServerSnapshot() {
|
|
338
|
+
return 0;
|
|
339
|
+
}
|
|
340
|
+
function useMediaIndex() {
|
|
341
|
+
const $ = c(1);
|
|
342
|
+
let t0, t1;
|
|
343
|
+
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t1 = _createMediaStore(), $[0] = t1) : t1 = $[0], t0 = t1;
|
|
344
|
+
const store = t0;
|
|
345
|
+
return useSyncExternalStore(store.subscribe, store.getSnapshot, getServerSnapshot);
|
|
346
|
+
}
|
|
347
|
+
function usePrefersDark(t0) {
|
|
348
|
+
return useMatchMedia("(prefers-color-scheme: dark)", t0 === void 0 ? _temp$4 : t0);
|
|
349
|
+
}
|
|
350
|
+
function _temp$4() {
|
|
351
|
+
return !1;
|
|
352
|
+
}
|
|
353
|
+
function usePrefersReducedMotion(t0) {
|
|
354
|
+
return useMatchMedia("(prefers-reduced-motion: reduce)", t0 === void 0 ? _temp$3 : t0);
|
|
355
|
+
}
|
|
356
|
+
function _temp$3() {
|
|
357
|
+
return !1;
|
|
358
|
+
}
|
|
359
|
+
function useResponsiveProp(val, defaultVal) {
|
|
360
|
+
const $ = c(3);
|
|
361
|
+
let t0;
|
|
362
|
+
$[0] !== defaultVal || $[1] !== val ? (t0 = () => [_getResponsiveProp(val, defaultVal), JSON.stringify(val ?? defaultVal)], $[0] = defaultVal, $[1] = val, $[2] = t0) : t0 = $[2];
|
|
363
|
+
const [t1, setCache] = useState(t0), [cachedVal, cachedHash] = t1, hash = JSON.stringify(val ?? defaultVal);
|
|
364
|
+
return hash !== cachedHash && setCache([_getResponsiveProp(val, defaultVal), hash]), cachedVal;
|
|
365
|
+
}
|
|
366
|
+
const DEFAULT_BOX_ELEMENT = "div";
|
|
367
|
+
function Box(props) {
|
|
368
|
+
const $ = c(154), t0 = props;
|
|
369
|
+
let alignItems, autoCols, autoFlow, autoRows, borderBottom, borderLeft, borderRight, borderTop, children, className, column, columnEnd, columnStart, columns, flex, flexDirection, flexWrap, gap, gapX, gapY, gridAutoColumns, gridAutoFlow, gridAutoRows, gridColumn, gridColumnEnd, gridColumnStart, gridRow, gridRowEnd, gridRowStart, gridTemplateColumns, gridTemplateRows, height, inset, insetBottom, insetLeft, insetRight, insetTop, justifyContent, marginBottom, marginLeft, marginRight, marginTop, marginX, marginY, maxWidth, muted, outline, overflow, overflowX, overflowY, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, pointerEvents, position, radius, rest, row, rowEnd, rowStart, rows, shadow, t1, t2, t3, t4, t5, t6, t7, t8, textAlign, width;
|
|
370
|
+
$[0] !== t0 ? ({
|
|
371
|
+
alignItems,
|
|
372
|
+
as: t1,
|
|
373
|
+
autoCols,
|
|
374
|
+
autoFlow,
|
|
375
|
+
autoRows,
|
|
376
|
+
border: t2,
|
|
377
|
+
borderTop,
|
|
378
|
+
borderRight,
|
|
379
|
+
borderBottom,
|
|
380
|
+
borderLeft,
|
|
381
|
+
className,
|
|
382
|
+
children,
|
|
383
|
+
column,
|
|
384
|
+
columnStart,
|
|
385
|
+
columnEnd,
|
|
386
|
+
columns,
|
|
387
|
+
display: t3,
|
|
388
|
+
flex,
|
|
389
|
+
flexDirection,
|
|
390
|
+
flexWrap,
|
|
391
|
+
gap,
|
|
392
|
+
gapX,
|
|
393
|
+
gapY,
|
|
394
|
+
gridAutoColumns,
|
|
395
|
+
gridAutoFlow,
|
|
396
|
+
gridAutoRows,
|
|
397
|
+
gridColumn,
|
|
398
|
+
gridColumnEnd,
|
|
399
|
+
gridColumnStart,
|
|
400
|
+
gridRow,
|
|
401
|
+
gridRowEnd,
|
|
402
|
+
gridRowStart,
|
|
403
|
+
gridTemplateColumns,
|
|
404
|
+
gridTemplateRows,
|
|
405
|
+
height,
|
|
406
|
+
inset,
|
|
407
|
+
insetBottom,
|
|
408
|
+
insetLeft,
|
|
409
|
+
insetRight,
|
|
410
|
+
insetTop,
|
|
411
|
+
justifyContent,
|
|
412
|
+
margin: t4,
|
|
413
|
+
marginX,
|
|
414
|
+
marginY,
|
|
415
|
+
marginTop,
|
|
416
|
+
marginRight,
|
|
417
|
+
marginBottom,
|
|
418
|
+
marginLeft,
|
|
419
|
+
maxWidth,
|
|
420
|
+
minHeight: t5,
|
|
421
|
+
minWidth: t6,
|
|
422
|
+
muted,
|
|
423
|
+
outline,
|
|
424
|
+
overflow,
|
|
425
|
+
overflowX,
|
|
426
|
+
overflowY,
|
|
427
|
+
padding: t7,
|
|
428
|
+
paddingX,
|
|
429
|
+
paddingY,
|
|
430
|
+
paddingTop,
|
|
431
|
+
paddingRight,
|
|
432
|
+
paddingBottom,
|
|
433
|
+
paddingLeft,
|
|
434
|
+
pointerEvents,
|
|
435
|
+
position,
|
|
436
|
+
radius,
|
|
437
|
+
row,
|
|
438
|
+
rows,
|
|
439
|
+
rowStart,
|
|
440
|
+
rowEnd,
|
|
441
|
+
shadow,
|
|
442
|
+
sizing: t8,
|
|
443
|
+
textAlign,
|
|
444
|
+
width,
|
|
445
|
+
...rest
|
|
446
|
+
} = t0, $[0] = t0, $[1] = alignItems, $[2] = autoCols, $[3] = autoFlow, $[4] = autoRows, $[5] = borderBottom, $[6] = borderLeft, $[7] = borderRight, $[8] = borderTop, $[9] = children, $[10] = className, $[11] = column, $[12] = columnEnd, $[13] = columnStart, $[14] = columns, $[15] = flex, $[16] = flexDirection, $[17] = flexWrap, $[18] = gap, $[19] = gapX, $[20] = gapY, $[21] = gridAutoColumns, $[22] = gridAutoFlow, $[23] = gridAutoRows, $[24] = gridColumn, $[25] = gridColumnEnd, $[26] = gridColumnStart, $[27] = gridRow, $[28] = gridRowEnd, $[29] = gridRowStart, $[30] = gridTemplateColumns, $[31] = gridTemplateRows, $[32] = height, $[33] = inset, $[34] = insetBottom, $[35] = insetLeft, $[36] = insetRight, $[37] = insetTop, $[38] = justifyContent, $[39] = marginBottom, $[40] = marginLeft, $[41] = marginRight, $[42] = marginTop, $[43] = marginX, $[44] = marginY, $[45] = maxWidth, $[46] = muted, $[47] = outline, $[48] = overflow, $[49] = overflowX, $[50] = overflowY, $[51] = paddingBottom, $[52] = paddingLeft, $[53] = paddingRight, $[54] = paddingTop, $[55] = paddingX, $[56] = paddingY, $[57] = pointerEvents, $[58] = position, $[59] = radius, $[60] = rest, $[61] = row, $[62] = rowEnd, $[63] = rowStart, $[64] = rows, $[65] = shadow, $[66] = t1, $[67] = t2, $[68] = t3, $[69] = t4, $[70] = t5, $[71] = t6, $[72] = t7, $[73] = t8, $[74] = textAlign, $[75] = width) : (alignItems = $[1], autoCols = $[2], autoFlow = $[3], autoRows = $[4], borderBottom = $[5], borderLeft = $[6], borderRight = $[7], borderTop = $[8], children = $[9], className = $[10], column = $[11], columnEnd = $[12], columnStart = $[13], columns = $[14], flex = $[15], flexDirection = $[16], flexWrap = $[17], gap = $[18], gapX = $[19], gapY = $[20], gridAutoColumns = $[21], gridAutoFlow = $[22], gridAutoRows = $[23], gridColumn = $[24], gridColumnEnd = $[25], gridColumnStart = $[26], gridRow = $[27], gridRowEnd = $[28], gridRowStart = $[29], gridTemplateColumns = $[30], gridTemplateRows = $[31], height = $[32], inset = $[33], insetBottom = $[34], insetLeft = $[35], insetRight = $[36], insetTop = $[37], justifyContent = $[38], marginBottom = $[39], marginLeft = $[40], marginRight = $[41], marginTop = $[42], marginX = $[43], marginY = $[44], maxWidth = $[45], muted = $[46], outline = $[47], overflow = $[48], overflowX = $[49], overflowY = $[50], paddingBottom = $[51], paddingLeft = $[52], paddingRight = $[53], paddingTop = $[54], paddingX = $[55], paddingY = $[56], pointerEvents = $[57], position = $[58], radius = $[59], rest = $[60], row = $[61], rowEnd = $[62], rowStart = $[63], rows = $[64], shadow = $[65], t1 = $[66], t2 = $[67], t3 = $[68], t4 = $[69], t5 = $[70], t6 = $[71], t7 = $[72], t8 = $[73], textAlign = $[74], width = $[75]);
|
|
447
|
+
const Element = t1 === void 0 ? DEFAULT_BOX_ELEMENT : t1, border = t2 === void 0 ? !1 : t2, display = t3 === void 0 ? "block" : t3, margin = t4 === void 0 ? 0 : t4, minHeight = t5 === void 0 ? 0 : t5, minWidth = t6 === void 0 ? 0 : t6, padding = t7 === void 0 ? 0 : t7, sizing = t8 === void 0 ? "border" : t8;
|
|
448
|
+
let t9;
|
|
449
|
+
$[76] !== alignItems || $[77] !== autoCols || $[78] !== autoFlow || $[79] !== autoRows || $[80] !== border || $[81] !== borderBottom || $[82] !== borderLeft || $[83] !== borderRight || $[84] !== borderTop || $[85] !== className || $[86] !== column || $[87] !== columnEnd || $[88] !== columnStart || $[89] !== columns || $[90] !== display || $[91] !== flex || $[92] !== flexDirection || $[93] !== flexWrap || $[94] !== gap || $[95] !== gapX || $[96] !== gapY || $[97] !== gridAutoColumns || $[98] !== gridAutoFlow || $[99] !== gridAutoRows || $[100] !== gridColumn || $[101] !== gridColumnEnd || $[102] !== gridColumnStart || $[103] !== gridRow || $[104] !== gridRowEnd || $[105] !== gridRowStart || $[106] !== gridTemplateColumns || $[107] !== gridTemplateRows || $[108] !== height || $[109] !== inset || $[110] !== insetBottom || $[111] !== insetLeft || $[112] !== insetRight || $[113] !== insetTop || $[114] !== justifyContent || $[115] !== margin || $[116] !== marginBottom || $[117] !== marginLeft || $[118] !== marginRight || $[119] !== marginTop || $[120] !== marginX || $[121] !== marginY || $[122] !== maxWidth || $[123] !== minHeight || $[124] !== minWidth || $[125] !== muted || $[126] !== outline || $[127] !== overflow || $[128] !== overflowX || $[129] !== overflowY || $[130] !== padding || $[131] !== paddingBottom || $[132] !== paddingLeft || $[133] !== paddingRight || $[134] !== paddingTop || $[135] !== paddingX || $[136] !== paddingY || $[137] !== pointerEvents || $[138] !== position || $[139] !== radius || $[140] !== row || $[141] !== rowEnd || $[142] !== rowStart || $[143] !== rows || $[144] !== shadow || $[145] !== sizing || $[146] !== textAlign || $[147] !== width ? (t9 = box({
|
|
450
|
+
className,
|
|
451
|
+
alignItems,
|
|
452
|
+
autoCols,
|
|
453
|
+
autoFlow,
|
|
454
|
+
autoRows,
|
|
455
|
+
border,
|
|
456
|
+
borderTop,
|
|
457
|
+
borderRight,
|
|
458
|
+
borderBottom,
|
|
459
|
+
borderLeft,
|
|
460
|
+
column,
|
|
461
|
+
columnStart,
|
|
462
|
+
columnEnd,
|
|
463
|
+
columns,
|
|
464
|
+
display,
|
|
465
|
+
flex,
|
|
466
|
+
flexDirection,
|
|
467
|
+
flexWrap,
|
|
468
|
+
gap,
|
|
469
|
+
gapX,
|
|
470
|
+
gapY,
|
|
471
|
+
gridAutoColumns,
|
|
472
|
+
gridAutoFlow,
|
|
473
|
+
gridAutoRows,
|
|
474
|
+
gridColumn,
|
|
475
|
+
gridColumnEnd,
|
|
476
|
+
gridColumnStart,
|
|
477
|
+
gridRow,
|
|
478
|
+
gridRowEnd,
|
|
479
|
+
gridRowStart,
|
|
480
|
+
gridTemplateColumns,
|
|
481
|
+
gridTemplateRows,
|
|
482
|
+
height,
|
|
483
|
+
inset,
|
|
484
|
+
insetBottom,
|
|
485
|
+
insetLeft,
|
|
486
|
+
insetRight,
|
|
487
|
+
insetTop,
|
|
488
|
+
justifyContent,
|
|
489
|
+
margin,
|
|
490
|
+
marginX,
|
|
491
|
+
marginY,
|
|
492
|
+
marginTop,
|
|
493
|
+
marginRight,
|
|
494
|
+
marginBottom,
|
|
495
|
+
marginLeft,
|
|
496
|
+
maxWidth,
|
|
497
|
+
minHeight,
|
|
498
|
+
minWidth,
|
|
499
|
+
muted,
|
|
500
|
+
outline,
|
|
501
|
+
overflow,
|
|
502
|
+
overflowX,
|
|
503
|
+
overflowY,
|
|
504
|
+
padding,
|
|
505
|
+
paddingX,
|
|
506
|
+
paddingY,
|
|
507
|
+
paddingTop,
|
|
508
|
+
paddingRight,
|
|
509
|
+
paddingBottom,
|
|
510
|
+
paddingLeft,
|
|
511
|
+
pointerEvents,
|
|
512
|
+
position,
|
|
513
|
+
radius,
|
|
514
|
+
row,
|
|
515
|
+
rows,
|
|
516
|
+
rowStart,
|
|
517
|
+
rowEnd,
|
|
518
|
+
shadow,
|
|
519
|
+
sizing,
|
|
520
|
+
textAlign,
|
|
521
|
+
width
|
|
522
|
+
}), $[76] = alignItems, $[77] = autoCols, $[78] = autoFlow, $[79] = autoRows, $[80] = border, $[81] = borderBottom, $[82] = borderLeft, $[83] = borderRight, $[84] = borderTop, $[85] = className, $[86] = column, $[87] = columnEnd, $[88] = columnStart, $[89] = columns, $[90] = display, $[91] = flex, $[92] = flexDirection, $[93] = flexWrap, $[94] = gap, $[95] = gapX, $[96] = gapY, $[97] = gridAutoColumns, $[98] = gridAutoFlow, $[99] = gridAutoRows, $[100] = gridColumn, $[101] = gridColumnEnd, $[102] = gridColumnStart, $[103] = gridRow, $[104] = gridRowEnd, $[105] = gridRowStart, $[106] = gridTemplateColumns, $[107] = gridTemplateRows, $[108] = height, $[109] = inset, $[110] = insetBottom, $[111] = insetLeft, $[112] = insetRight, $[113] = insetTop, $[114] = justifyContent, $[115] = margin, $[116] = marginBottom, $[117] = marginLeft, $[118] = marginRight, $[119] = marginTop, $[120] = marginX, $[121] = marginY, $[122] = maxWidth, $[123] = minHeight, $[124] = minWidth, $[125] = muted, $[126] = outline, $[127] = overflow, $[128] = overflowX, $[129] = overflowY, $[130] = padding, $[131] = paddingBottom, $[132] = paddingLeft, $[133] = paddingRight, $[134] = paddingTop, $[135] = paddingX, $[136] = paddingY, $[137] = pointerEvents, $[138] = position, $[139] = radius, $[140] = row, $[141] = rowEnd, $[142] = rowStart, $[143] = rows, $[144] = shadow, $[145] = sizing, $[146] = textAlign, $[147] = width, $[148] = t9) : t9 = $[148];
|
|
523
|
+
let t10;
|
|
524
|
+
return $[149] !== Element || $[150] !== children || $[151] !== rest || $[152] !== t9 ? (t10 = /* @__PURE__ */ jsx(Element, { "data-ui": "Box", ...rest, className: t9, children }), $[149] = Element, $[150] = children, $[151] = rest, $[152] = t9, $[153] = t10) : t10 = $[153], t10;
|
|
525
|
+
}
|
|
526
|
+
const DEFAULT_TEXT_ELEMENT = "div";
|
|
527
|
+
function Text(props) {
|
|
528
|
+
const $ = c(30), t0 = props;
|
|
529
|
+
let accent, align, children, className, flex, muted, rest, t1, t2, t3, textOverflowProp;
|
|
530
|
+
$[0] !== t0 ? ({
|
|
531
|
+
accent,
|
|
532
|
+
align,
|
|
533
|
+
as: t1,
|
|
534
|
+
children,
|
|
535
|
+
className,
|
|
536
|
+
flex,
|
|
537
|
+
muted,
|
|
538
|
+
size: t2,
|
|
539
|
+
textOverflow: textOverflowProp,
|
|
540
|
+
weight: t3,
|
|
541
|
+
...rest
|
|
542
|
+
} = t0, $[0] = t0, $[1] = accent, $[2] = align, $[3] = children, $[4] = className, $[5] = flex, $[6] = muted, $[7] = rest, $[8] = t1, $[9] = t2, $[10] = t3, $[11] = textOverflowProp) : (accent = $[1], align = $[2], children = $[3], className = $[4], flex = $[5], muted = $[6], rest = $[7], t1 = $[8], t2 = $[9], t3 = $[10], textOverflowProp = $[11]);
|
|
543
|
+
const Element = t1 === void 0 ? DEFAULT_TEXT_ELEMENT : t1, size2 = t2 === void 0 ? 2 : t2, weight = t3 === void 0 ? "regular" : t3;
|
|
544
|
+
let t4;
|
|
545
|
+
$[12] !== accent || $[13] !== align || $[14] !== className || $[15] !== flex || $[16] !== muted || $[17] !== size2 || $[18] !== weight ? (t4 = text({
|
|
546
|
+
className,
|
|
547
|
+
accent,
|
|
548
|
+
align,
|
|
549
|
+
flex,
|
|
550
|
+
muted,
|
|
551
|
+
size: size2,
|
|
552
|
+
weight
|
|
553
|
+
}), $[12] = accent, $[13] = align, $[14] = className, $[15] = flex, $[16] = muted, $[17] = size2, $[18] = weight, $[19] = t4) : t4 = $[19];
|
|
554
|
+
let t5;
|
|
555
|
+
$[20] !== textOverflowProp ? (t5 = textOverflow({
|
|
556
|
+
textOverflow: textOverflowProp
|
|
557
|
+
}), $[20] = textOverflowProp, $[21] = t5) : t5 = $[21];
|
|
558
|
+
let t6;
|
|
559
|
+
$[22] !== children || $[23] !== t5 ? (t6 = /* @__PURE__ */ jsx("span", { className: t5, children }), $[22] = children, $[23] = t5, $[24] = t6) : t6 = $[24];
|
|
560
|
+
let t7;
|
|
561
|
+
return $[25] !== Element || $[26] !== rest || $[27] !== t4 || $[28] !== t6 ? (t7 = /* @__PURE__ */ jsx(Element, { "data-ui": "Text", ...rest, className: t4, children: t6 }), $[25] = Element, $[26] = rest, $[27] = t4, $[28] = t6, $[29] = t7) : t7 = $[29], t7;
|
|
562
|
+
}
|
|
563
|
+
function AnimatedSpinnerIcon(props) {
|
|
564
|
+
const $ = c(5);
|
|
565
|
+
let rest;
|
|
566
|
+
$[0] !== props ? ({
|
|
567
|
+
...rest
|
|
568
|
+
} = props, $[0] = props, $[1] = rest) : rest = $[1];
|
|
569
|
+
let t0;
|
|
570
|
+
$[2] === Symbol.for("react.memo_cache_sentinel") ? (t0 = animatedSpinnerIcon(), $[2] = t0) : t0 = $[2];
|
|
571
|
+
let t1;
|
|
572
|
+
return $[3] !== rest ? (t1 = /* @__PURE__ */ jsx(SpinnerIcon, { "data-sanity-icon": "animated-spinner", ...rest, className: t0 }), $[3] = rest, $[4] = t1) : t1 = $[4], t1;
|
|
573
|
+
}
|
|
574
|
+
const DEFAULT_SPINNER_ELEMENT = "div";
|
|
575
|
+
function Spinner(props) {
|
|
576
|
+
const $ = c(11), t0 = props;
|
|
577
|
+
let className, rest, t1;
|
|
578
|
+
$[0] !== t0 ? ({
|
|
579
|
+
as: t1,
|
|
580
|
+
className,
|
|
581
|
+
...rest
|
|
582
|
+
} = t0, $[0] = t0, $[1] = className, $[2] = rest, $[3] = t1) : (className = $[1], rest = $[2], t1 = $[3]);
|
|
583
|
+
const as = t1 === void 0 ? DEFAULT_SPINNER_ELEMENT : t1;
|
|
584
|
+
let t2;
|
|
585
|
+
$[4] !== className ? (t2 = spinner({
|
|
586
|
+
className
|
|
587
|
+
}), $[4] = className, $[5] = t2) : t2 = $[5];
|
|
588
|
+
let t3;
|
|
589
|
+
$[6] === Symbol.for("react.memo_cache_sentinel") ? (t3 = /* @__PURE__ */ jsx(AnimatedSpinnerIcon, {}), $[6] = t3) : t3 = $[6];
|
|
590
|
+
let t4;
|
|
591
|
+
return $[7] !== as || $[8] !== rest || $[9] !== t2 ? (t4 = /* @__PURE__ */ jsx(Text, { as, "data-ui": "Spinner", ...rest, className: t2, children: t3 }), $[7] = as, $[8] = rest, $[9] = t2, $[10] = t4) : t4 = $[10], t4;
|
|
592
|
+
}
|
|
593
|
+
const DEFAULT_BUTTON_ELEMENT = "button";
|
|
594
|
+
function Button(props) {
|
|
595
|
+
const {
|
|
596
|
+
align = "center",
|
|
597
|
+
as: Element = DEFAULT_BUTTON_ELEMENT,
|
|
598
|
+
children,
|
|
599
|
+
className,
|
|
600
|
+
disabled,
|
|
601
|
+
display = "inline-flex",
|
|
602
|
+
flex,
|
|
603
|
+
fontSize = 1,
|
|
604
|
+
gap = props.space ?? props.padding ?? 3,
|
|
605
|
+
gapX,
|
|
606
|
+
gapY,
|
|
607
|
+
icon: IconComponent,
|
|
608
|
+
iconRight: IconRightComponent,
|
|
609
|
+
justify = "center",
|
|
610
|
+
loading,
|
|
611
|
+
mode = "default",
|
|
612
|
+
padding = 3,
|
|
613
|
+
paddingX,
|
|
614
|
+
paddingY,
|
|
615
|
+
paddingTop,
|
|
616
|
+
paddingBottom,
|
|
617
|
+
paddingLeft,
|
|
618
|
+
paddingRight,
|
|
619
|
+
radius = 2,
|
|
620
|
+
selected,
|
|
621
|
+
space = props.gap ?? props.space ?? props.padding ?? 3,
|
|
622
|
+
// eslint-disable-line @typescript-eslint/no-unused-vars
|
|
623
|
+
text: text2,
|
|
624
|
+
textAlign,
|
|
625
|
+
textOverflow: textOverflow2 = "ellipsis",
|
|
626
|
+
textWeight = "medium",
|
|
627
|
+
tone = "default",
|
|
628
|
+
type = "button",
|
|
629
|
+
muted = !1,
|
|
630
|
+
width,
|
|
631
|
+
...rest
|
|
632
|
+
} = props;
|
|
633
|
+
let href;
|
|
634
|
+
return "href" in rest && (href = typeof rest.href == "string" ? rest.href : href, delete rest.href), /* @__PURE__ */ jsxs(
|
|
635
|
+
Element,
|
|
636
|
+
{
|
|
637
|
+
"data-ui": "Button",
|
|
638
|
+
...rest,
|
|
639
|
+
className: button({
|
|
640
|
+
className,
|
|
641
|
+
display,
|
|
642
|
+
flex,
|
|
643
|
+
mode,
|
|
644
|
+
radius,
|
|
645
|
+
tone,
|
|
646
|
+
width
|
|
647
|
+
}),
|
|
648
|
+
"data-disabled": loading || disabled ? "" : void 0,
|
|
649
|
+
"data-selected": selected ? "" : void 0,
|
|
650
|
+
disabled: !!(loading || disabled),
|
|
651
|
+
href: disabled ? void 0 : href,
|
|
652
|
+
type,
|
|
653
|
+
children: [
|
|
654
|
+
!!loading && /* @__PURE__ */ jsx(Box, { alignItems: "center", as: "span", className: buttonLoadingBox(), display: "flex", flex: 1, justifyContent: "center", width: "fill", children: /* @__PURE__ */ jsx(Spinner, { size: fontSize }) }),
|
|
655
|
+
(IconComponent || text2 || IconRightComponent) && /* @__PURE__ */ jsxs(Box, { alignItems: align, as: "span", display: "flex", flex: 1, gap, gapX, gapY, justifyContent: justify, padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight, children: [
|
|
656
|
+
IconComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
|
|
657
|
+
isValidElement(IconComponent) && IconComponent,
|
|
658
|
+
isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
|
|
659
|
+
] }),
|
|
660
|
+
text2 && /* @__PURE__ */ jsx(Text, { align: textAlign, as: "span", flex: "none", muted, size: fontSize, textOverflow: textOverflow2, weight: textWeight, children: text2 }),
|
|
661
|
+
IconRightComponent && /* @__PURE__ */ jsxs(Text, { as: "span", flex: "none", muted: !0, size: fontSize, children: [
|
|
662
|
+
isValidElement(IconRightComponent) && IconRightComponent,
|
|
663
|
+
isValidElementType(IconRightComponent) && /* @__PURE__ */ jsx(IconRightComponent, {})
|
|
664
|
+
] })
|
|
665
|
+
] }),
|
|
666
|
+
children && /* @__PURE__ */ jsx(Box, { as: "span", flex: 1, padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight, children })
|
|
667
|
+
]
|
|
668
|
+
}
|
|
669
|
+
);
|
|
670
|
+
}
|
|
671
|
+
function useCard() {
|
|
672
|
+
return useContext(CardContext);
|
|
673
|
+
}
|
|
674
|
+
const DEFAULT_CARD_ELEMENT = "div";
|
|
675
|
+
function Card(props) {
|
|
676
|
+
const $ = c(38), t0 = props;
|
|
677
|
+
let className, disabled, pressed, rest, schemeProp, selected, style, t1, t2, t3, t4, t5;
|
|
678
|
+
$[0] !== t0 ? ({
|
|
679
|
+
__unstable_checkered: t1,
|
|
680
|
+
__unstable_focusRing: t2,
|
|
681
|
+
as: t3,
|
|
682
|
+
className,
|
|
683
|
+
disabled,
|
|
684
|
+
pressed,
|
|
685
|
+
radius: t4,
|
|
686
|
+
scheme: schemeProp,
|
|
687
|
+
selected,
|
|
688
|
+
style,
|
|
689
|
+
tone: t5,
|
|
690
|
+
...rest
|
|
691
|
+
} = t0, $[0] = t0, $[1] = className, $[2] = disabled, $[3] = pressed, $[4] = rest, $[5] = schemeProp, $[6] = selected, $[7] = style, $[8] = t1, $[9] = t2, $[10] = t3, $[11] = t4, $[12] = t5) : (className = $[1], disabled = $[2], pressed = $[3], rest = $[4], schemeProp = $[5], selected = $[6], style = $[7], t1 = $[8], t2 = $[9], t3 = $[10], t4 = $[11], t5 = $[12]);
|
|
692
|
+
const checkered = t1 === void 0 ? !1 : t1, focusRing = t2 === void 0 ? !1 : t2, as = t3 === void 0 ? DEFAULT_CARD_ELEMENT : t3, radius = t4 === void 0 ? 0 : t4, toneProp = t5 === void 0 ? "default" : t5, parent = useCard(), tone = toneProp === "inherit" ? parent?.tone : toneProp, scheme = schemeProp === void 0 ? parent?.scheme : schemeProp, t6 = scheme === parent?.scheme ? void 0 : scheme;
|
|
693
|
+
let t7;
|
|
694
|
+
$[13] !== className || $[14] !== t6 || $[15] !== tone ? (t7 = card({
|
|
695
|
+
className,
|
|
696
|
+
scheme: t6,
|
|
697
|
+
tone
|
|
698
|
+
}), $[13] = className, $[14] = t6, $[15] = tone, $[16] = t7) : t7 = $[16];
|
|
699
|
+
const t8 = checkered ? "" : void 0, t9 = disabled ? "" : void 0, t10 = focusRing ? "" : void 0, t11 = pressed ? "" : void 0, t12 = selected ? "" : void 0;
|
|
700
|
+
let t13;
|
|
701
|
+
$[17] !== as || $[18] !== radius || $[19] !== rest || $[20] !== style || $[21] !== t10 || $[22] !== t11 || $[23] !== t12 || $[24] !== t7 || $[25] !== t8 || $[26] !== t9 ? (t13 = /* @__PURE__ */ jsx(Box, { "data-ui": "Card", ...rest, as, className: t7, "data-checkered": t8, "data-disabled": t9, "data-focus-ring": t10, "data-pressed": t11, "data-selected": t12, radius, style }), $[17] = as, $[18] = radius, $[19] = rest, $[20] = style, $[21] = t10, $[22] = t11, $[23] = t12, $[24] = t7, $[25] = t8, $[26] = t9, $[27] = t13) : t13 = $[27];
|
|
702
|
+
let node = t13;
|
|
703
|
+
if (scheme === parent?.scheme && tone === parent?.tone)
|
|
704
|
+
return node;
|
|
705
|
+
const t14 = scheme ?? "light", t15 = tone ?? "default", t16 = parent?.unstable_CompatProvider;
|
|
706
|
+
let t17;
|
|
707
|
+
if ($[28] !== node || $[29] !== t14 || $[30] !== t15 || $[31] !== t16 ? (t17 = /* @__PURE__ */ jsx(CardProvider, { scheme: t14, tone: t15, unstable_CompatProvider: t16, children: node }), $[28] = node, $[29] = t14, $[30] = t15, $[31] = t16, $[32] = t17) : t17 = $[32], node = t17, parent?.unstable_CompatProvider) {
|
|
708
|
+
const CompatProvider = parent.unstable_CompatProvider, t18 = scheme ?? "light", t19 = tone ?? parent?.tone ?? "default";
|
|
709
|
+
let t20;
|
|
710
|
+
return $[33] !== CompatProvider || $[34] !== node || $[35] !== t18 || $[36] !== t19 ? (t20 = /* @__PURE__ */ jsx(CompatProvider, { scheme: t18, tone: t19, children: node }), $[33] = CompatProvider, $[34] = node, $[35] = t18, $[36] = t19, $[37] = t20) : t20 = $[37], t20;
|
|
711
|
+
}
|
|
712
|
+
return node;
|
|
713
|
+
}
|
|
714
|
+
const LazyRefractor = lazy(() => import("./refractor.js")), DEFAULT_CODE_ELEMENT = "pre";
|
|
715
|
+
function Code(props) {
|
|
716
|
+
const $ = c(25), t0 = props;
|
|
717
|
+
let children, className, languageProp, rest, t1, t2, t3;
|
|
718
|
+
$[0] !== t0 ? ({
|
|
719
|
+
as: t1,
|
|
720
|
+
children,
|
|
721
|
+
className,
|
|
722
|
+
language: languageProp,
|
|
723
|
+
size: t2,
|
|
724
|
+
weight: t3,
|
|
725
|
+
...rest
|
|
726
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = className, $[3] = languageProp, $[4] = rest, $[5] = t1, $[6] = t2, $[7] = t3) : (children = $[1], className = $[2], languageProp = $[3], rest = $[4], t1 = $[5], t2 = $[6], t3 = $[7]);
|
|
727
|
+
const Element = t1 === void 0 ? DEFAULT_CODE_ELEMENT : t1, size2 = t2 === void 0 ? 2 : t2, weight = t3 === void 0 ? "regular" : t3, language = typeof languageProp == "string" ? languageProp : void 0;
|
|
728
|
+
let t4;
|
|
729
|
+
$[8] !== className || $[9] !== size2 || $[10] !== weight ? (t4 = code({
|
|
730
|
+
className,
|
|
731
|
+
size: size2,
|
|
732
|
+
weight
|
|
733
|
+
}), $[8] = className, $[9] = size2, $[10] = weight, $[11] = t4) : t4 = $[11];
|
|
734
|
+
let t5;
|
|
735
|
+
$[12] !== children ? (t5 = /* @__PURE__ */ jsx("code", { children }), $[12] = children, $[13] = t5) : t5 = $[13];
|
|
736
|
+
let t6;
|
|
737
|
+
$[14] !== children || $[15] !== language ? (t6 = /* @__PURE__ */ jsx(LazyRefractor, { language, value: children }), $[14] = children, $[15] = language, $[16] = t6) : t6 = $[16];
|
|
738
|
+
let t7;
|
|
739
|
+
$[17] !== t5 || $[18] !== t6 ? (t7 = /* @__PURE__ */ jsx(Suspense, { fallback: t5, children: t6 }), $[17] = t5, $[18] = t6, $[19] = t7) : t7 = $[19];
|
|
740
|
+
let t8;
|
|
741
|
+
return $[20] !== Element || $[21] !== rest || $[22] !== t4 || $[23] !== t7 ? (t8 = /* @__PURE__ */ jsx(Element, { "data-ui": "Code", ...rest, className: t4, children: t7 }), $[20] = Element, $[21] = rest, $[22] = t4, $[23] = t7, $[24] = t8) : t8 = $[24], t8;
|
|
742
|
+
}
|
|
743
|
+
const DEFAULT_FLEX_ELEMENT = "div";
|
|
744
|
+
function Flex(props) {
|
|
745
|
+
const $ = c(14), t0 = props;
|
|
746
|
+
let align, justify, rest, t1, t2, wrap;
|
|
747
|
+
$[0] !== t0 ? ({
|
|
748
|
+
align,
|
|
749
|
+
as: t1,
|
|
750
|
+
direction: t2,
|
|
751
|
+
justify,
|
|
752
|
+
wrap,
|
|
753
|
+
...rest
|
|
754
|
+
} = t0, $[0] = t0, $[1] = align, $[2] = justify, $[3] = rest, $[4] = t1, $[5] = t2, $[6] = wrap) : (align = $[1], justify = $[2], rest = $[3], t1 = $[4], t2 = $[5], wrap = $[6]);
|
|
755
|
+
const as = t1 === void 0 ? DEFAULT_FLEX_ELEMENT : t1, direction = t2 === void 0 ? "row" : t2;
|
|
756
|
+
let t3;
|
|
757
|
+
return $[7] !== align || $[8] !== as || $[9] !== direction || $[10] !== justify || $[11] !== rest || $[12] !== wrap ? (t3 = /* @__PURE__ */ jsx(Box, { "data-ui": "Flex", ...rest, alignItems: align, as, display: "flex", flexDirection: direction, flexWrap: wrap, justifyContent: justify }), $[7] = align, $[8] = as, $[9] = direction, $[10] = justify, $[11] = rest, $[12] = wrap, $[13] = t3) : t3 = $[13], t3;
|
|
758
|
+
}
|
|
759
|
+
const DEFAULT_GRID_ELEMENT = "div";
|
|
760
|
+
function Grid(props) {
|
|
761
|
+
const $ = c(8), t0 = props;
|
|
762
|
+
let children, rest, t1;
|
|
763
|
+
$[0] !== t0 ? ({
|
|
764
|
+
as: t1,
|
|
765
|
+
children,
|
|
766
|
+
...rest
|
|
767
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = rest, $[3] = t1) : (children = $[1], rest = $[2], t1 = $[3]);
|
|
768
|
+
const as = t1 === void 0 ? DEFAULT_GRID_ELEMENT : t1;
|
|
769
|
+
let t2;
|
|
770
|
+
return $[4] !== as || $[5] !== children || $[6] !== rest ? (t2 = /* @__PURE__ */ jsx(Box, { "data-ui": "Grid", ...rest, as, display: "grid", children }), $[4] = as, $[5] = children, $[6] = rest, $[7] = t2) : t2 = $[7], t2;
|
|
771
|
+
}
|
|
772
|
+
const DEFAULT_KBD_ELEMENT = "kbd";
|
|
773
|
+
function KBD(props) {
|
|
774
|
+
const $ = c(22), t0 = props;
|
|
775
|
+
let children, className, rest, t1, t2, t3, t4, t5;
|
|
776
|
+
$[0] !== t0 ? ({
|
|
777
|
+
as: t1,
|
|
778
|
+
children,
|
|
779
|
+
className,
|
|
780
|
+
display: t2,
|
|
781
|
+
fontSize: t3,
|
|
782
|
+
padding: t4,
|
|
783
|
+
radius: t5,
|
|
784
|
+
...rest
|
|
785
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = className, $[3] = rest, $[4] = t1, $[5] = t2, $[6] = t3, $[7] = t4, $[8] = t5) : (children = $[1], className = $[2], rest = $[3], t1 = $[4], t2 = $[5], t3 = $[6], t4 = $[7], t5 = $[8]);
|
|
786
|
+
const as = t1 === void 0 ? DEFAULT_KBD_ELEMENT : t1, display = t2 === void 0 ? "inline-block" : t2, fontSize = t3 === void 0 ? 0 : t3, padding = t4 === void 0 ? 1 : t4, radius = t5 === void 0 ? 2 : t5, t6 = as;
|
|
787
|
+
let t7;
|
|
788
|
+
$[9] !== className || $[10] !== radius ? (t7 = kbd({
|
|
789
|
+
className,
|
|
790
|
+
radius
|
|
791
|
+
}), $[9] = className, $[10] = radius, $[11] = t7) : t7 = $[11];
|
|
792
|
+
let t8;
|
|
793
|
+
$[12] !== children || $[13] !== fontSize ? (t8 = /* @__PURE__ */ jsx(Text, { as: "span", muted: !0, size: fontSize, weight: "semibold", children }), $[12] = children, $[13] = fontSize, $[14] = t8) : t8 = $[14];
|
|
794
|
+
let t9;
|
|
795
|
+
return $[15] !== display || $[16] !== padding || $[17] !== rest || $[18] !== t6 || $[19] !== t7 || $[20] !== t8 ? (t9 = /* @__PURE__ */ jsx(Box, { "data-ui": "KBD", ...rest, as: t6, className: t7, display, muted: !0, padding, children: t8 }), $[15] = display, $[16] = padding, $[17] = rest, $[18] = t6, $[19] = t7, $[20] = t8, $[21] = t9) : t9 = $[21], t9;
|
|
796
|
+
}
|
|
797
|
+
const origin = {
|
|
798
|
+
name: "@sanity/ui/origin",
|
|
799
|
+
fn({
|
|
800
|
+
middlewareData,
|
|
801
|
+
placement,
|
|
802
|
+
rects
|
|
803
|
+
}) {
|
|
804
|
+
const [side] = placement.split("-"), floatingWidth = rects.floating.width, floatingHeight = rects.floating.height, shiftX = middlewareData.shift?.x || 0, shiftY = middlewareData.shift?.y || 0;
|
|
805
|
+
if (floatingWidth <= 0 || floatingHeight <= 0)
|
|
806
|
+
return {};
|
|
807
|
+
const isVerticalPlacement = ["bottom", "top"].includes(side), {
|
|
808
|
+
originX,
|
|
809
|
+
originY
|
|
810
|
+
} = isVerticalPlacement ? {
|
|
811
|
+
originX: clamp(0.5 - shiftX / floatingWidth, 0, 1),
|
|
812
|
+
originY: side === "bottom" ? 0 : 1
|
|
813
|
+
} : {
|
|
814
|
+
originX: side === "left" ? 1 : 0,
|
|
815
|
+
originY: clamp(0.5 - shiftY / floatingHeight, 0, 1)
|
|
816
|
+
};
|
|
817
|
+
return {
|
|
818
|
+
data: {
|
|
819
|
+
originX,
|
|
820
|
+
originY
|
|
821
|
+
}
|
|
822
|
+
};
|
|
823
|
+
}
|
|
824
|
+
};
|
|
825
|
+
function clamp(num, min, max) {
|
|
826
|
+
return Math.min(Math.max(num, min), max);
|
|
827
|
+
}
|
|
828
|
+
function moveTowardsLength(movingPoint, targetPoint, amount) {
|
|
829
|
+
const width = targetPoint.x - movingPoint.x, height = targetPoint.y - movingPoint.y, distance = Math.sqrt(width * width + height * height);
|
|
830
|
+
return moveTowardsFractional(movingPoint, targetPoint, Math.min(1, amount / distance));
|
|
831
|
+
}
|
|
832
|
+
function moveTowardsFractional(movingPoint, targetPoint, fraction) {
|
|
833
|
+
return {
|
|
834
|
+
x: movingPoint.x + (targetPoint.x - movingPoint.x) * fraction,
|
|
835
|
+
y: movingPoint.y + (targetPoint.y - movingPoint.y) * fraction
|
|
836
|
+
};
|
|
837
|
+
}
|
|
838
|
+
function getRoundedCommands(points) {
|
|
839
|
+
const len = points.length, cmds = [];
|
|
840
|
+
for (let i = 0; i < len; i += 1) {
|
|
841
|
+
const point = points[i], prevPoint = points[i - 1], nextPoint = points[i + 1];
|
|
842
|
+
if (prevPoint && point.radius) {
|
|
843
|
+
const curveStart = moveTowardsLength(point, prevPoint, point.radius), curveEnd = moveTowardsLength(point, nextPoint, point.radius), startControl = moveTowardsFractional(curveStart, point, 0.5), endControl = moveTowardsFractional(point, curveEnd, 0.5);
|
|
844
|
+
cmds.push({
|
|
845
|
+
type: "point",
|
|
846
|
+
...curveStart
|
|
847
|
+
}), cmds.push({
|
|
848
|
+
type: "curve",
|
|
849
|
+
curveEnd,
|
|
850
|
+
startControl,
|
|
851
|
+
endControl
|
|
852
|
+
});
|
|
853
|
+
} else
|
|
854
|
+
cmds.push({
|
|
855
|
+
type: "point",
|
|
856
|
+
...point
|
|
857
|
+
});
|
|
858
|
+
}
|
|
859
|
+
return cmds;
|
|
860
|
+
}
|
|
861
|
+
function compileCommands(cmds) {
|
|
862
|
+
return cmds.map((n, idx) => n.type === "point" ? `${idx === 0 ? "M" : "L"} ${n.x} ${n.y}` : n.type === "curve" ? `C ${n.startControl.x} ${n.startControl.y} ${n.endControl.x} ${n.endControl.y} ${n.curveEnd.x} ${n.curveEnd.y}` : "").join(" ");
|
|
863
|
+
}
|
|
864
|
+
const DEFAULT_ARROW_ELEMENT = "div";
|
|
865
|
+
function Arrow(props) {
|
|
866
|
+
const $ = c(34), t0 = props;
|
|
867
|
+
let h, rest, style, t1, t2, w;
|
|
868
|
+
$[0] !== t0 ? ({
|
|
869
|
+
as: t1,
|
|
870
|
+
width: w,
|
|
871
|
+
height: h,
|
|
872
|
+
radius: t2,
|
|
873
|
+
style,
|
|
874
|
+
...rest
|
|
875
|
+
} = t0, $[0] = t0, $[1] = h, $[2] = rest, $[3] = style, $[4] = t1, $[5] = t2, $[6] = w) : (h = $[1], rest = $[2], style = $[3], t1 = $[4], t2 = $[5], w = $[6]);
|
|
876
|
+
const Element = t1 === void 0 ? DEFAULT_ARROW_ELEMENT : t1, radius = t2 === void 0 ? 0 : t2, center = w / 2;
|
|
877
|
+
let t3;
|
|
878
|
+
const points = [{
|
|
879
|
+
x: 0,
|
|
880
|
+
y: 0
|
|
881
|
+
}, {
|
|
882
|
+
x: radius,
|
|
883
|
+
y: 0,
|
|
884
|
+
radius
|
|
885
|
+
}, {
|
|
886
|
+
x: center,
|
|
887
|
+
y: h - 1,
|
|
888
|
+
radius
|
|
889
|
+
}, {
|
|
890
|
+
x: w - radius,
|
|
891
|
+
y: 0,
|
|
892
|
+
radius
|
|
893
|
+
}, {
|
|
894
|
+
x: w,
|
|
895
|
+
y: 0
|
|
896
|
+
}], cmds = getRoundedCommands(points);
|
|
897
|
+
t3 = compileCommands(cmds);
|
|
898
|
+
const path = t3, strokePath = `${path}`, fillPath = `${path} M ${w} -1 M 0 -1 Z`;
|
|
899
|
+
let t4;
|
|
900
|
+
$[7] === Symbol.for("react.memo_cache_sentinel") ? (t4 = _arrow(), $[7] = t4) : t4 = $[7];
|
|
901
|
+
const t5 = `${w}px`;
|
|
902
|
+
let t6;
|
|
903
|
+
$[8] !== t5 ? (t6 = assignInlineVars({
|
|
904
|
+
[vars.arrow.size]: t5
|
|
905
|
+
}), $[8] = t5, $[9] = t6) : t6 = $[9];
|
|
906
|
+
let t7;
|
|
907
|
+
$[10] !== style || $[11] !== t6 ? (t7 = {
|
|
908
|
+
...style,
|
|
909
|
+
...t6
|
|
910
|
+
}, $[10] = style, $[11] = t6, $[12] = t7) : t7 = $[12];
|
|
911
|
+
let t8;
|
|
912
|
+
$[13] === Symbol.for("react.memo_cache_sentinel") ? (t8 = _arrowSvg(), $[13] = t8) : t8 = $[13];
|
|
913
|
+
const t9 = `0 0 ${w} ${w}`;
|
|
914
|
+
let t10;
|
|
915
|
+
$[14] === Symbol.for("react.memo_cache_sentinel") ? (t10 = _arrowStrokeMask(), $[14] = t10) : t10 = $[14];
|
|
916
|
+
let t11;
|
|
917
|
+
$[15] !== w ? (t11 = /* @__PURE__ */ jsx("mask", { id: "stroke-mask", children: /* @__PURE__ */ jsx("rect", { className: t10, x: 0, width: w, height: w, fill: "white" }) }), $[15] = w, $[16] = t11) : t11 = $[16];
|
|
918
|
+
let t12;
|
|
919
|
+
$[17] === Symbol.for("react.memo_cache_sentinel") ? (t12 = _arrowStroke(), $[17] = t12) : t12 = $[17];
|
|
920
|
+
let t13;
|
|
921
|
+
$[18] !== strokePath ? (t13 = /* @__PURE__ */ jsx("path", { className: t12, d: strokePath, mask: "url(#stroke-mask)" }), $[18] = strokePath, $[19] = t13) : t13 = $[19];
|
|
922
|
+
let t14;
|
|
923
|
+
$[20] === Symbol.for("react.memo_cache_sentinel") ? (t14 = _arrowShape(), $[20] = t14) : t14 = $[20];
|
|
924
|
+
let t15;
|
|
925
|
+
$[21] !== fillPath ? (t15 = /* @__PURE__ */ jsx("path", { className: t14, d: fillPath }), $[21] = fillPath, $[22] = t15) : t15 = $[22];
|
|
926
|
+
let t16;
|
|
927
|
+
$[23] !== t11 || $[24] !== t13 || $[25] !== t15 || $[26] !== t9 || $[27] !== w ? (t16 = /* @__PURE__ */ jsxs("svg", { className: t8, width: w, height: w, viewBox: t9, children: [
|
|
928
|
+
t11,
|
|
929
|
+
t13,
|
|
930
|
+
t15
|
|
931
|
+
] }), $[23] = t11, $[24] = t13, $[25] = t15, $[26] = t9, $[27] = w, $[28] = t16) : t16 = $[28];
|
|
932
|
+
let t17;
|
|
933
|
+
return $[29] !== Element || $[30] !== rest || $[31] !== t16 || $[32] !== t7 ? (t17 = /* @__PURE__ */ jsx(Element, { ...rest, className: t4, style: t7, children: t16 }), $[29] = Element, $[30] = rest, $[31] = t16, $[32] = t7, $[33] = t17) : t17 = $[33], t17;
|
|
934
|
+
}
|
|
935
|
+
const BoundaryElementContext = createGlobalScopedContext("@sanity/ui/context/boundaryElement", null), DEFAULT_VALUE = {
|
|
936
|
+
version: 0,
|
|
937
|
+
element: null
|
|
938
|
+
};
|
|
939
|
+
function useBoundaryElement() {
|
|
940
|
+
const value = useContext(BoundaryElementContext);
|
|
941
|
+
if (value && (!isRecord(value) || value.version !== 0))
|
|
942
|
+
throw new Error("useBoundaryElement(): the context value is not compatible");
|
|
943
|
+
return value || DEFAULT_VALUE;
|
|
944
|
+
}
|
|
945
|
+
function findMaxBreakpoints(media2, width) {
|
|
946
|
+
const ret = [];
|
|
947
|
+
for (let i = 0; i < media2.length; i += 1)
|
|
948
|
+
media2[i] > width && ret.push(i);
|
|
949
|
+
return ret;
|
|
950
|
+
}
|
|
951
|
+
function findMinBreakpoints(media2, width) {
|
|
952
|
+
const ret = [];
|
|
953
|
+
for (let i = 0; i < media2.length; i += 1)
|
|
954
|
+
media2[i] <= width && ret.push(i);
|
|
955
|
+
return ret;
|
|
956
|
+
}
|
|
957
|
+
const DEFAULT_ELEMENT_QUERY_ELEMENT = "div", DEFAULT_BREAKPOINTS = Object.values(BREAKPOINTS);
|
|
958
|
+
function ElementQuery(props) {
|
|
959
|
+
const $ = c(21), t0 = props;
|
|
960
|
+
let children, forwardedRef, mediaProp, rest, t1;
|
|
961
|
+
$[0] !== t0 ? ({
|
|
962
|
+
as: t1,
|
|
963
|
+
children,
|
|
964
|
+
media: mediaProp,
|
|
965
|
+
ref: forwardedRef,
|
|
966
|
+
...rest
|
|
967
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = forwardedRef, $[3] = mediaProp, $[4] = rest, $[5] = t1) : (children = $[1], forwardedRef = $[2], mediaProp = $[3], rest = $[4], t1 = $[5]);
|
|
968
|
+
const Element = t1 === void 0 ? DEFAULT_ELEMENT_QUERY_ELEMENT : t1, breakpoints = mediaProp ?? DEFAULT_BREAKPOINTS, [element, setElement] = useState(null), elementSize = useElementSize(element);
|
|
969
|
+
let t2;
|
|
970
|
+
t2 = elementSize?.border.width ?? window.innerWidth;
|
|
971
|
+
const width = t2;
|
|
972
|
+
let t3, t4;
|
|
973
|
+
if ($[6] !== breakpoints || $[7] !== width) {
|
|
974
|
+
const eq = findMaxBreakpoints(breakpoints, width);
|
|
975
|
+
t4 = eq.length ? eq.join(" ") : void 0, $[6] = breakpoints, $[7] = width, $[8] = t4;
|
|
976
|
+
} else
|
|
977
|
+
t4 = $[8];
|
|
978
|
+
t3 = t4;
|
|
979
|
+
const max = t3;
|
|
980
|
+
let t5, t6;
|
|
981
|
+
if ($[9] !== breakpoints || $[10] !== width) {
|
|
982
|
+
const eq_0 = findMinBreakpoints(breakpoints, width);
|
|
983
|
+
t6 = eq_0.length ? eq_0.join(" ") : void 0, $[9] = breakpoints, $[10] = width, $[11] = t6;
|
|
984
|
+
} else
|
|
985
|
+
t6 = $[11];
|
|
986
|
+
t5 = t6;
|
|
987
|
+
const min = t5;
|
|
988
|
+
let t7, t8;
|
|
989
|
+
$[12] !== element ? (t7 = () => element, t8 = [element], $[12] = element, $[13] = t7, $[14] = t8) : (t7 = $[13], t8 = $[14]), useImperativeHandle(forwardedRef, t7, t8);
|
|
990
|
+
let t9;
|
|
991
|
+
return $[15] !== Element || $[16] !== children || $[17] !== max || $[18] !== min || $[19] !== rest ? (t9 = /* @__PURE__ */ jsx(Element, { "data-ui": "ElementQuery", ...rest, "data-eq-max": max, "data-eq-min": min, ref: setElement, children }), $[15] = Element, $[16] = children, $[17] = max, $[18] = min, $[19] = rest, $[20] = t9) : t9 = $[20], t9;
|
|
992
|
+
}
|
|
993
|
+
function getLayerContext(contextValue) {
|
|
994
|
+
if (!isRecord(contextValue) || contextValue.version !== 0)
|
|
995
|
+
throw new Error("the context value is not compatible");
|
|
996
|
+
if (!contextValue)
|
|
997
|
+
throw new Error("components using `useLayer()` should be wrapped in a <LayerProvider>.");
|
|
998
|
+
if (contextValue.version === 0)
|
|
999
|
+
return contextValue;
|
|
1000
|
+
throw new Error("could not get layer context");
|
|
1001
|
+
}
|
|
1002
|
+
const LayerContext = createGlobalScopedContext("@sanity/ui/context/layer", null);
|
|
1003
|
+
function useLayer() {
|
|
1004
|
+
const $ = c(2), value = useContext(LayerContext);
|
|
1005
|
+
if (!value)
|
|
1006
|
+
throw new Error("useLayer(): missing context value");
|
|
1007
|
+
try {
|
|
1008
|
+
let t1;
|
|
1009
|
+
return $[0] !== value ? (t1 = getLayerContext(value), $[0] = value, $[1] = t1) : t1 = $[1], t1;
|
|
1010
|
+
} catch (t0) {
|
|
1011
|
+
const err = t0;
|
|
1012
|
+
throw err instanceof Error ? new Error(`useLayer(): ${err.message}`) : new Error(`useLayer(): ${err}`);
|
|
1013
|
+
}
|
|
1014
|
+
}
|
|
1015
|
+
const DEFAULT_LAYER_CARD_ELEMENT = "div";
|
|
1016
|
+
function LayerCard(props) {
|
|
1017
|
+
const $ = c(27), t0 = props;
|
|
1018
|
+
let children, forwardedRef, onActivate, onFocus, rest, t1, t2, t3;
|
|
1019
|
+
$[0] !== t0 ? ({
|
|
1020
|
+
as: t1,
|
|
1021
|
+
children,
|
|
1022
|
+
onActivate,
|
|
1023
|
+
onFocus,
|
|
1024
|
+
position: t2,
|
|
1025
|
+
ref: forwardedRef,
|
|
1026
|
+
style: t3,
|
|
1027
|
+
...rest
|
|
1028
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = forwardedRef, $[3] = onActivate, $[4] = onFocus, $[5] = rest, $[6] = t1, $[7] = t2, $[8] = t3) : (children = $[1], forwardedRef = $[2], onActivate = $[3], onFocus = $[4], rest = $[5], t1 = $[6], t2 = $[7], t3 = $[8]);
|
|
1029
|
+
const as = t1 === void 0 ? DEFAULT_LAYER_CARD_ELEMENT : t1, position = t2 === void 0 ? "relative" : t2, style = t3 === void 0 ? EMPTY_RECORD : t3, {
|
|
1030
|
+
zIndex,
|
|
1031
|
+
isTopLayer
|
|
1032
|
+
} = useLayer(), lastFocusedRef = useRef(null), ref = useRef(null), isTopLayerRef = useRef(isTopLayer);
|
|
1033
|
+
let t4;
|
|
1034
|
+
$[9] === Symbol.for("react.memo_cache_sentinel") ? (t4 = () => ref.current, $[9] = t4) : t4 = $[9], useImperativeHandle(forwardedRef, t4);
|
|
1035
|
+
let t5, t6;
|
|
1036
|
+
$[10] !== isTopLayer || $[11] !== onActivate ? (t5 = () => {
|
|
1037
|
+
isTopLayerRef.current !== isTopLayer && isTopLayer && onActivate?.({
|
|
1038
|
+
activeElement: lastFocusedRef.current
|
|
1039
|
+
}), isTopLayerRef.current = isTopLayer;
|
|
1040
|
+
}, t6 = [isTopLayer, onActivate], $[10] = isTopLayer, $[11] = onActivate, $[12] = t5, $[13] = t6) : (t5 = $[12], t6 = $[13]), useEffect(t5, t6);
|
|
1041
|
+
let t7;
|
|
1042
|
+
$[14] !== isTopLayer || $[15] !== onFocus ? (t7 = (event) => {
|
|
1043
|
+
onFocus?.(event);
|
|
1044
|
+
const rootElement = ref.current, target = document.activeElement;
|
|
1045
|
+
!isTopLayer || !rootElement || !target || isHTMLElement(target) && containsOrEqualsElement(rootElement, target) && (lastFocusedRef.current = target);
|
|
1046
|
+
}, $[14] = isTopLayer, $[15] = onFocus, $[16] = t7) : t7 = $[16];
|
|
1047
|
+
const handleFocus = t7, t8 = as;
|
|
1048
|
+
let t9;
|
|
1049
|
+
$[17] !== style || $[18] !== zIndex ? (t9 = {
|
|
1050
|
+
...style,
|
|
1051
|
+
zIndex
|
|
1052
|
+
}, $[17] = style, $[18] = zIndex, $[19] = t9) : t9 = $[19];
|
|
1053
|
+
let t10;
|
|
1054
|
+
return $[20] !== children || $[21] !== handleFocus || $[22] !== position || $[23] !== rest || $[24] !== t8 || $[25] !== t9 ? (t10 = /* @__PURE__ */ jsx(Card, { "data-ui": "Layer", ...rest, as: t8, onFocus: handleFocus, position, ref, style: t9, children }), $[20] = children, $[21] = handleFocus, $[22] = position, $[23] = rest, $[24] = t8, $[25] = t9, $[26] = t10) : t10 = $[26], t10;
|
|
1055
|
+
}
|
|
1056
|
+
function LayerProvider(props) {
|
|
1057
|
+
const $ = c(19), {
|
|
1058
|
+
children,
|
|
1059
|
+
zOffset: t0
|
|
1060
|
+
} = props, zOffsetProp = t0 === void 0 ? 0 : t0, parentContextValue = useContext(LayerContext);
|
|
1061
|
+
let t1;
|
|
1062
|
+
$[0] !== parentContextValue ? (t1 = parentContextValue && getLayerContext(parentContextValue), $[0] = parentContextValue, $[1] = t1) : t1 = $[1];
|
|
1063
|
+
const parent = t1, parentRegisterChild = parent?.registerChild, level = (parent?.level ?? 0) + 1, zOffset = useResponsiveProp(zOffsetProp), maxMediaIndex = Object.values(zOffset).length - 1, mediaIndex = Math.min(useMediaIndex(), maxMediaIndex), zIndex = parent ? parent.zIndex + (zOffset[mediaIndex] ?? 0) : zOffset[mediaIndex] ?? 0;
|
|
1064
|
+
let t2;
|
|
1065
|
+
$[2] === Symbol.for("react.memo_cache_sentinel") ? (t2 = {}, $[2] = t2) : t2 = $[2];
|
|
1066
|
+
const [, setChildLayers] = useState(t2), [size2, setSize] = useState(0), isTopLayer = size2 === 0;
|
|
1067
|
+
let t3;
|
|
1068
|
+
$[3] !== parentRegisterChild || $[4] !== setChildLayers ? (t3 = (childLevel) => {
|
|
1069
|
+
const parentDispose = parentRegisterChild?.(childLevel);
|
|
1070
|
+
return childLevel !== void 0 ? setChildLayers((state) => {
|
|
1071
|
+
const prevLen = state[childLevel] ?? 0, nextState = {
|
|
1072
|
+
...state,
|
|
1073
|
+
[childLevel]: prevLen + 1
|
|
1074
|
+
};
|
|
1075
|
+
return setSize(Object.keys(nextState).length), nextState;
|
|
1076
|
+
}) : setSize(_temp$2), () => {
|
|
1077
|
+
childLevel !== void 0 ? setChildLayers((state_0) => {
|
|
1078
|
+
const nextState_0 = {
|
|
1079
|
+
...state_0
|
|
1080
|
+
};
|
|
1081
|
+
return nextState_0[childLevel] === 1 ? (delete nextState_0[childLevel], setSize(Object.keys(nextState_0).length)) : nextState_0[childLevel] = nextState_0[childLevel] - 1, nextState_0;
|
|
1082
|
+
}) : setSize(_temp2$2), parentDispose?.();
|
|
1083
|
+
};
|
|
1084
|
+
}, $[3] = parentRegisterChild, $[4] = setChildLayers, $[5] = t3) : t3 = $[5];
|
|
1085
|
+
const registerChild = t3;
|
|
1086
|
+
let t4, t5;
|
|
1087
|
+
$[6] !== level || $[7] !== parentRegisterChild ? (t4 = () => parentRegisterChild?.(level), t5 = [level, parentRegisterChild], $[6] = level, $[7] = parentRegisterChild, $[8] = t4, $[9] = t5) : (t4 = $[8], t5 = $[9]), useEffect(t4, t5);
|
|
1088
|
+
let t6, t7;
|
|
1089
|
+
$[10] !== isTopLayer || $[11] !== level || $[12] !== registerChild || $[13] !== size2 || $[14] !== zIndex ? (t7 = {
|
|
1090
|
+
version: 0,
|
|
1091
|
+
isTopLayer,
|
|
1092
|
+
level,
|
|
1093
|
+
registerChild,
|
|
1094
|
+
size: size2,
|
|
1095
|
+
zIndex
|
|
1096
|
+
}, $[10] = isTopLayer, $[11] = level, $[12] = registerChild, $[13] = size2, $[14] = zIndex, $[15] = t7) : t7 = $[15], t6 = t7;
|
|
1097
|
+
const value = t6;
|
|
1098
|
+
let t8;
|
|
1099
|
+
return $[16] !== children || $[17] !== value ? (t8 = /* @__PURE__ */ jsx(LayerContext.Provider, { value, children }), $[16] = children, $[17] = value, $[18] = t8) : t8 = $[18], t8;
|
|
1100
|
+
}
|
|
1101
|
+
function _temp2$2(v_0) {
|
|
1102
|
+
return v_0 - 1;
|
|
1103
|
+
}
|
|
1104
|
+
function _temp$2(v) {
|
|
1105
|
+
return v + 1;
|
|
1106
|
+
}
|
|
1107
|
+
const DEFAULT_LAYER_ELEMENT = "div";
|
|
1108
|
+
function Layer(props) {
|
|
1109
|
+
const $ = c(12), t0 = props;
|
|
1110
|
+
let children, rest, t1, t2;
|
|
1111
|
+
$[0] !== t0 ? ({
|
|
1112
|
+
as: t1,
|
|
1113
|
+
children,
|
|
1114
|
+
zOffset: t2,
|
|
1115
|
+
...rest
|
|
1116
|
+
} = t0, $[0] = t0, $[1] = children, $[2] = rest, $[3] = t1, $[4] = t2) : (children = $[1], rest = $[2], t1 = $[3], t2 = $[4]);
|
|
1117
|
+
const as = t1 === void 0 ? DEFAULT_LAYER_ELEMENT : t1, zOffset = t2 === void 0 ? 1 : t2;
|
|
1118
|
+
let t3;
|
|
1119
|
+
$[5] !== as || $[6] !== children || $[7] !== rest ? (t3 = /* @__PURE__ */ jsx(LayerCard, { ...rest, as, children }), $[5] = as, $[6] = children, $[7] = rest, $[8] = t3) : t3 = $[8];
|
|
1120
|
+
let t4;
|
|
1121
|
+
return $[9] !== t3 || $[10] !== zOffset ? (t4 = /* @__PURE__ */ jsx(LayerProvider, { zOffset, children: t3 }), $[9] = t3, $[10] = zOffset, $[11] = t4) : t4 = $[11], t4;
|
|
1122
|
+
}
|
|
1123
|
+
const key = "@sanity/ui/context/portal", elementKey = Symbol.for(`${key}/element`);
|
|
1124
|
+
globalScope[elementKey] = null;
|
|
1125
|
+
const defaultContextValue = {
|
|
1126
|
+
version: 0,
|
|
1127
|
+
boundaryElement: null,
|
|
1128
|
+
get element() {
|
|
1129
|
+
return typeof document > "u" ? null : (globalScope[elementKey] || (globalScope[elementKey] = document.createElement("div"), globalScope[elementKey].setAttribute("data-portal", ""), document.body.appendChild(globalScope[elementKey])), globalScope[elementKey]);
|
|
1130
|
+
}
|
|
1131
|
+
}, PortalContext = createGlobalScopedContext(key, defaultContextValue);
|
|
1132
|
+
function usePortal() {
|
|
1133
|
+
const value = useContext(PortalContext);
|
|
1134
|
+
if (!value)
|
|
1135
|
+
throw new Error("usePortal(): missing context value");
|
|
1136
|
+
if (!isRecord(value) || value.version !== 0)
|
|
1137
|
+
throw new Error("usePortal(): the context value is not compatible");
|
|
1138
|
+
return value;
|
|
1139
|
+
}
|
|
1140
|
+
function Portal(props) {
|
|
1141
|
+
const $ = c(6), {
|
|
1142
|
+
children,
|
|
1143
|
+
__unstable_name: name
|
|
1144
|
+
} = props, card2 = useCard(), portal = usePortal(), portalElement = (name ? portal.elements && portal.elements[name] : portal.element) || portal.elements?.default;
|
|
1145
|
+
if (!portalElement)
|
|
1146
|
+
return null;
|
|
1147
|
+
const t0 = card2?.scheme || "light";
|
|
1148
|
+
let t1;
|
|
1149
|
+
$[0] !== children || $[1] !== t0 ? (t1 = /* @__PURE__ */ jsx(CardProvider, { tone: "transparent", scheme: t0, children }), $[0] = children, $[1] = t0, $[2] = t1) : t1 = $[2];
|
|
1150
|
+
let t2;
|
|
1151
|
+
return $[3] !== portalElement || $[4] !== t1 ? (t2 = createPortal(t1, portalElement), $[3] = portalElement, $[4] = t1, $[5] = t2) : t2 = $[5], t2;
|
|
1152
|
+
}
|
|
1153
|
+
function PortalProvider(props) {
|
|
1154
|
+
const $ = c(7), {
|
|
1155
|
+
boundaryElement,
|
|
1156
|
+
children,
|
|
1157
|
+
element,
|
|
1158
|
+
__unstable_elements: elementsProp
|
|
1159
|
+
} = props, elements = useUnique(elementsProp), fallbackElement = useSyncExternalStore(emptySubscribe, _temp$1, _temp2$1);
|
|
1160
|
+
let t0;
|
|
1161
|
+
const t1 = boundaryElement || null, t2 = element || fallbackElement;
|
|
1162
|
+
let t3;
|
|
1163
|
+
$[0] !== elements || $[1] !== t1 || $[2] !== t2 ? (t3 = {
|
|
1164
|
+
version: 0,
|
|
1165
|
+
boundaryElement: t1,
|
|
1166
|
+
element: t2,
|
|
1167
|
+
elements
|
|
1168
|
+
}, $[0] = elements, $[1] = t1, $[2] = t2, $[3] = t3) : t3 = $[3], t0 = t3;
|
|
1169
|
+
const value = t0;
|
|
1170
|
+
let t4;
|
|
1171
|
+
return $[4] !== children || $[5] !== value ? (t4 = /* @__PURE__ */ jsx(PortalContext.Provider, { value, children }), $[4] = children, $[5] = value, $[6] = t4) : t4 = $[6], t4;
|
|
1172
|
+
}
|
|
1173
|
+
function _temp2$1() {
|
|
1174
|
+
return null;
|
|
1175
|
+
}
|
|
1176
|
+
function _temp$1() {
|
|
1177
|
+
return document.body;
|
|
1178
|
+
}
|
|
1179
|
+
const emptySubscribe = () => () => {
|
|
1180
|
+
};
|
|
1181
|
+
function useUnique(value) {
|
|
1182
|
+
const valueRef = useRef(value);
|
|
1183
|
+
return _isEqual(valueRef.current, value) || (valueRef.current = value), valueRef.current;
|
|
1184
|
+
}
|
|
1185
|
+
function _isEqual(objA, objB) {
|
|
1186
|
+
if (!objA || !objB)
|
|
1187
|
+
return objA === objB;
|
|
1188
|
+
const keysA = Object.keys(objA), keysB = Object.keys(objB);
|
|
1189
|
+
return keysA.length !== keysB.length ? !1 : keysA.every((key2) => objA[key2] === objB[key2]);
|
|
1190
|
+
}
|
|
1191
|
+
const DEFAULT_POPOVER_DISTANCE = 4, DEFAULT_POPOVER_PADDING = 4, DEFAULT_POPOVER_ARROW_WIDTH = 19, DEFAULT_POPOVER_ARROW_HEIGHT = 8, DEFAULT_POPOVER_ARROW_RADIUS = 2, DEFAULT_POPOVER_MARGINS = [0, 0, 0, 0], DEFAULT_FALLBACK_PLACEMENTS$1 = {
|
|
1192
|
+
top: ["bottom", "left", "right"],
|
|
1193
|
+
"top-start": ["bottom-start", "left-start", "right-start"],
|
|
1194
|
+
"top-end": ["bottom-end", "left-end", "right-end"],
|
|
1195
|
+
bottom: ["top", "left", "right"],
|
|
1196
|
+
"bottom-start": ["top-start", "left-start", "right-start"],
|
|
1197
|
+
"bottom-end": ["top-end", "left-end", "right-end"],
|
|
1198
|
+
left: ["right", "top", "bottom"],
|
|
1199
|
+
"left-start": ["right-start", "top-start", "bottom-start"],
|
|
1200
|
+
"left-end": ["right-end", "top-end", "bottom-end"],
|
|
1201
|
+
right: ["left", "top", "bottom"],
|
|
1202
|
+
"right-start": ["left-start", "top-start", "bottom-start"],
|
|
1203
|
+
"right-end": ["left-end", "top-end", "bottom-end"]
|
|
1204
|
+
};
|
|
1205
|
+
function size(options) {
|
|
1206
|
+
const {
|
|
1207
|
+
apply,
|
|
1208
|
+
margins,
|
|
1209
|
+
padding = 0
|
|
1210
|
+
} = options;
|
|
1211
|
+
return {
|
|
1212
|
+
name: "@sanity/ui/size",
|
|
1213
|
+
async fn(args) {
|
|
1214
|
+
const {
|
|
1215
|
+
elements,
|
|
1216
|
+
placement,
|
|
1217
|
+
platform,
|
|
1218
|
+
rects
|
|
1219
|
+
} = args, {
|
|
1220
|
+
floating,
|
|
1221
|
+
reference
|
|
1222
|
+
} = rects, overflow = await detectOverflow(args, {
|
|
1223
|
+
altBoundary: !0,
|
|
1224
|
+
boundary: options.boundaryElement || void 0,
|
|
1225
|
+
elementContext: "floating",
|
|
1226
|
+
padding,
|
|
1227
|
+
rootBoundary: "viewport"
|
|
1228
|
+
});
|
|
1229
|
+
let maxWidth = 1 / 0, maxHeight = 1 / 0;
|
|
1230
|
+
const floatingW = floating.width, floatingH = floating.height;
|
|
1231
|
+
placement.includes("top") && (maxWidth = floatingW - (overflow.left + overflow.right), maxHeight = floatingH - overflow.top), placement.includes("right") && (maxWidth = floatingW - overflow.right, maxHeight = floatingH - (overflow.top + overflow.bottom)), placement.includes("bottom") && (maxWidth = floatingW - (overflow.left + overflow.right), maxHeight = floatingH - overflow.bottom), placement.includes("left") && (maxWidth = floatingW - overflow.left, maxHeight = floatingH - (overflow.top + overflow.bottom)), apply({
|
|
1232
|
+
availableWidth: maxWidth - margins[1] - margins[3],
|
|
1233
|
+
availableHeight: maxHeight - margins[0] - margins[2],
|
|
1234
|
+
elements,
|
|
1235
|
+
referenceWidth: reference.width - margins[1] - margins[3]
|
|
1236
|
+
});
|
|
1237
|
+
const nextDimensions = await platform.getDimensions(elements.floating), targetH = nextDimensions.height, targetW = nextDimensions.width;
|
|
1238
|
+
return floatingW !== targetW || floatingH !== targetH ? {
|
|
1239
|
+
reset: {
|
|
1240
|
+
rects: !0
|
|
1241
|
+
}
|
|
1242
|
+
} : {};
|
|
1243
|
+
}
|
|
1244
|
+
};
|
|
1245
|
+
}
|
|
1246
|
+
function PopoverLayer(props) {
|
|
1247
|
+
const $ = c(65);
|
|
1248
|
+
let animate, arrow2, arrowRef, arrowX, arrowY, children, marginsProp, maxWidth, originX, originY, overflow, padding, placement, radius, referenceWidth, rest, shadow, strategy, style, t0, xProp, yProp;
|
|
1249
|
+
$[0] !== props ? ({
|
|
1250
|
+
__unstable_margins: marginsProp,
|
|
1251
|
+
animate,
|
|
1252
|
+
arrow: arrow2,
|
|
1253
|
+
arrowRef,
|
|
1254
|
+
arrowX,
|
|
1255
|
+
arrowY,
|
|
1256
|
+
children,
|
|
1257
|
+
maxWidth,
|
|
1258
|
+
padding,
|
|
1259
|
+
placement,
|
|
1260
|
+
originX,
|
|
1261
|
+
originY,
|
|
1262
|
+
overflow,
|
|
1263
|
+
radius,
|
|
1264
|
+
referenceWidth,
|
|
1265
|
+
shadow,
|
|
1266
|
+
strategy,
|
|
1267
|
+
style,
|
|
1268
|
+
tone: t0,
|
|
1269
|
+
x: xProp,
|
|
1270
|
+
y: yProp,
|
|
1271
|
+
...rest
|
|
1272
|
+
} = props, $[0] = props, $[1] = animate, $[2] = arrow2, $[3] = arrowRef, $[4] = arrowX, $[5] = arrowY, $[6] = children, $[7] = marginsProp, $[8] = maxWidth, $[9] = originX, $[10] = originY, $[11] = overflow, $[12] = padding, $[13] = placement, $[14] = radius, $[15] = referenceWidth, $[16] = rest, $[17] = shadow, $[18] = strategy, $[19] = style, $[20] = t0, $[21] = xProp, $[22] = yProp) : (animate = $[1], arrow2 = $[2], arrowRef = $[3], arrowX = $[4], arrowY = $[5], children = $[6], marginsProp = $[7], maxWidth = $[8], originX = $[9], originY = $[10], overflow = $[11], padding = $[12], placement = $[13], radius = $[14], referenceWidth = $[15], rest = $[16], shadow = $[17], strategy = $[18], style = $[19], t0 = $[20], xProp = $[21], yProp = $[22]);
|
|
1273
|
+
const tone = t0 === void 0 ? "inherit" : t0;
|
|
1274
|
+
let t1;
|
|
1275
|
+
t1 = marginsProp || DEFAULT_POPOVER_MARGINS;
|
|
1276
|
+
const margins = t1, x = (xProp ?? 0) + margins[3], y = (yProp ?? 0) + margins[0];
|
|
1277
|
+
let t2;
|
|
1278
|
+
const t3 = animate ? "transform" : void 0;
|
|
1279
|
+
let t4;
|
|
1280
|
+
$[23] !== originX || $[24] !== originY || $[25] !== referenceWidth || $[26] !== style || $[27] !== t3 || $[28] !== x || $[29] !== y ? (t4 = {
|
|
1281
|
+
left: x,
|
|
1282
|
+
originX,
|
|
1283
|
+
originY,
|
|
1284
|
+
top: y,
|
|
1285
|
+
width: referenceWidth,
|
|
1286
|
+
willChange: t3,
|
|
1287
|
+
...style
|
|
1288
|
+
}, $[23] = originX, $[24] = originY, $[25] = referenceWidth, $[26] = style, $[27] = t3, $[28] = x, $[29] = y, $[30] = t4) : t4 = $[30], t2 = t4;
|
|
1289
|
+
const rootStyle = t2;
|
|
1290
|
+
let t5;
|
|
1291
|
+
const t6 = arrowX !== null ? arrowX : void 0, t7 = arrowY !== null ? arrowY : void 0;
|
|
1292
|
+
let t8;
|
|
1293
|
+
$[31] !== t6 || $[32] !== t7 ? (t8 = {
|
|
1294
|
+
left: t6,
|
|
1295
|
+
top: t7,
|
|
1296
|
+
right: void 0,
|
|
1297
|
+
bottom: void 0
|
|
1298
|
+
}, $[31] = t6, $[32] = t7, $[33] = t8) : t8 = $[33], t5 = t8;
|
|
1299
|
+
const arrowStyle = t5;
|
|
1300
|
+
let t9;
|
|
1301
|
+
$[34] === Symbol.for("react.memo_cache_sentinel") ? (t9 = popoverCard(), $[34] = t9) : t9 = $[34];
|
|
1302
|
+
let t10;
|
|
1303
|
+
$[35] !== animate ? (t10 = animate ? ["hidden", "initial"] : void 0, $[35] = animate, $[36] = t10) : t10 = $[36];
|
|
1304
|
+
let t11;
|
|
1305
|
+
$[37] !== animate ? (t11 = animate ? ["visible", "scaleIn"] : void 0, $[37] = animate, $[38] = t11) : t11 = $[38];
|
|
1306
|
+
let t12;
|
|
1307
|
+
$[39] !== animate ? (t12 = animate ? ["hidden", "scaleOut"] : void 0, $[39] = animate, $[40] = t12) : t12 = $[40];
|
|
1308
|
+
let t13;
|
|
1309
|
+
$[41] !== children || $[42] !== padding ? (t13 = /* @__PURE__ */ jsx(Flex, { direction: "column", flex: 1, padding, children }), $[41] = children, $[42] = padding, $[43] = t13) : t13 = $[43];
|
|
1310
|
+
let t14;
|
|
1311
|
+
$[44] !== maxWidth || $[45] !== overflow || $[46] !== t13 ? (t14 = /* @__PURE__ */ jsx(Flex, { "data-ui": "Popover__wrapper", direction: "column", flex: 1, maxWidth, overflow, children: t13 }), $[44] = maxWidth, $[45] = overflow, $[46] = t13, $[47] = t14) : t14 = $[47];
|
|
1312
|
+
let t15;
|
|
1313
|
+
$[48] !== arrow2 || $[49] !== arrowRef || $[50] !== arrowStyle ? (t15 = arrow2 && /* @__PURE__ */ jsx(Arrow, { ref: arrowRef, style: arrowStyle, width: DEFAULT_POPOVER_ARROW_WIDTH, height: DEFAULT_POPOVER_ARROW_HEIGHT, radius: DEFAULT_POPOVER_ARROW_RADIUS }), $[48] = arrow2, $[49] = arrowRef, $[50] = arrowStyle, $[51] = t15) : t15 = $[51];
|
|
1314
|
+
let t16;
|
|
1315
|
+
return $[52] !== placement || $[53] !== radius || $[54] !== rest || $[55] !== rootStyle || $[56] !== shadow || $[57] !== strategy || $[58] !== t10 || $[59] !== t11 || $[60] !== t12 || $[61] !== t14 || $[62] !== t15 || $[63] !== tone ? (t16 = /* @__PURE__ */ jsxs(Layer, { className: t9, "data-ui": "Popover", ...rest, as: motion.div, "data-context-tone": tone, "data-placement": placement, flexDirection: "column", display: "flex", position: strategy, radius, shadow, sizing: "border", style: rootStyle, tone, variants: POPOVER_MOTION_PROPS.card, transition: POPOVER_MOTION_PROPS.transition, initial: t10, animate: t11, exit: t12, children: [
|
|
1316
|
+
t14,
|
|
1317
|
+
t15
|
|
1318
|
+
] }), $[52] = placement, $[53] = radius, $[54] = rest, $[55] = rootStyle, $[56] = shadow, $[57] = strategy, $[58] = t10, $[59] = t11, $[60] = t12, $[61] = t14, $[62] = t15, $[63] = tone, $[64] = t16) : t16 = $[64], t16;
|
|
1319
|
+
}
|
|
1320
|
+
const DEFAULT_POPOVER_ELEMENT = "div";
|
|
1321
|
+
function ViewportOverlay() {
|
|
1322
|
+
const $ = c(2), {
|
|
1323
|
+
zIndex
|
|
1324
|
+
} = useLayer();
|
|
1325
|
+
let t0;
|
|
1326
|
+
return $[0] !== zIndex ? (t0 = /* @__PURE__ */ jsx("div", { style: {
|
|
1327
|
+
position: "fixed",
|
|
1328
|
+
inset: 0,
|
|
1329
|
+
width: "100vw",
|
|
1330
|
+
height: "100vh",
|
|
1331
|
+
zIndex
|
|
1332
|
+
} }), $[0] = zIndex, $[1] = t0) : t0 = $[1], t0;
|
|
1333
|
+
}
|
|
1334
|
+
function Popover(props) {
|
|
1335
|
+
const boundaryElementContext = useBoundaryElement(), {
|
|
1336
|
+
__unstable_margins: margins = DEFAULT_POPOVER_MARGINS,
|
|
1337
|
+
animate: _animate = !1,
|
|
1338
|
+
arrow: arrowProp = !1,
|
|
1339
|
+
as = DEFAULT_POPOVER_ELEMENT,
|
|
1340
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1341
|
+
boundaryElement = boundaryElementContext.element,
|
|
1342
|
+
children: childProp,
|
|
1343
|
+
className,
|
|
1344
|
+
constrainSize = !1,
|
|
1345
|
+
content,
|
|
1346
|
+
disabled,
|
|
1347
|
+
fallbackPlacements = props.fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS$1[props.placement ?? "bottom"],
|
|
1348
|
+
matchReferenceWidth,
|
|
1349
|
+
floatingBoundary = props.boundaryElement ?? boundaryElementContext.element,
|
|
1350
|
+
modal,
|
|
1351
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
1352
|
+
onActivate,
|
|
1353
|
+
open,
|
|
1354
|
+
overflow = "hidden",
|
|
1355
|
+
padding,
|
|
1356
|
+
placement: placementProp = "bottom",
|
|
1357
|
+
portal,
|
|
1358
|
+
preventOverflow = !0,
|
|
1359
|
+
radius = 3,
|
|
1360
|
+
ref: forwardedRef,
|
|
1361
|
+
referenceBoundary = props.boundaryElement ?? boundaryElementContext.element,
|
|
1362
|
+
referenceElement,
|
|
1363
|
+
scheme,
|
|
1364
|
+
shadow = 3,
|
|
1365
|
+
tone = "inherit",
|
|
1366
|
+
width: widthProp = "auto",
|
|
1367
|
+
zOffset: zOffsetProp = Z_OFFSETS.popover,
|
|
1368
|
+
updateRef,
|
|
1369
|
+
...rest
|
|
1370
|
+
} = props, card2 = useCard(), animate = usePrefersReducedMotion() ? !1 : _animate, zOffset = useResponsiveProp(zOffsetProp), ref = useRef(null), arrowRef = useRef(null), rootBoundary = "viewport";
|
|
1371
|
+
useImperativeHandle(forwardedRef, () => ref.current);
|
|
1372
|
+
const referenceWidthRef = useRef(void 0), middleware = useMemo(() => {
|
|
1373
|
+
const ret = [];
|
|
1374
|
+
return (constrainSize || preventOverflow) && ret.push(flip({
|
|
1375
|
+
boundary: floatingBoundary || void 0,
|
|
1376
|
+
fallbackPlacements,
|
|
1377
|
+
padding: DEFAULT_POPOVER_PADDING,
|
|
1378
|
+
rootBoundary
|
|
1379
|
+
})), ret.push(offset({
|
|
1380
|
+
mainAxis: DEFAULT_POPOVER_DISTANCE
|
|
1381
|
+
})), (constrainSize || matchReferenceWidth) && ret.push(size({
|
|
1382
|
+
apply({
|
|
1383
|
+
availableWidth,
|
|
1384
|
+
availableHeight,
|
|
1385
|
+
elements,
|
|
1386
|
+
referenceWidth
|
|
1387
|
+
}) {
|
|
1388
|
+
referenceWidthRef.current = referenceWidth, matchReferenceWidth && (elements.floating.style.width = `${referenceWidth}px`), constrainSize && (elements.floating.style.maxWidth = `${availableWidth}px`, elements.floating.style.maxHeight = `${availableHeight}px`);
|
|
1389
|
+
},
|
|
1390
|
+
boundaryElement: floatingBoundary || void 0,
|
|
1391
|
+
margins,
|
|
1392
|
+
padding: DEFAULT_POPOVER_PADDING
|
|
1393
|
+
})), preventOverflow && ret.push(shift({
|
|
1394
|
+
boundary: floatingBoundary || void 0,
|
|
1395
|
+
rootBoundary,
|
|
1396
|
+
padding: DEFAULT_POPOVER_PADDING
|
|
1397
|
+
})), arrowProp && ret.push(arrow({
|
|
1398
|
+
element: arrowRef,
|
|
1399
|
+
padding: DEFAULT_POPOVER_PADDING
|
|
1400
|
+
})), animate && ret.push(origin), ret.push(hide({
|
|
1401
|
+
boundary: referenceBoundary || void 0,
|
|
1402
|
+
padding: DEFAULT_POPOVER_PADDING,
|
|
1403
|
+
strategy: "referenceHidden"
|
|
1404
|
+
})), ret;
|
|
1405
|
+
}, [animate, arrowProp, constrainSize, fallbackPlacements, floatingBoundary, margins, matchReferenceWidth, preventOverflow, referenceBoundary]), {
|
|
1406
|
+
x,
|
|
1407
|
+
y,
|
|
1408
|
+
middlewareData,
|
|
1409
|
+
placement,
|
|
1410
|
+
refs,
|
|
1411
|
+
strategy,
|
|
1412
|
+
update
|
|
1413
|
+
} = useFloating({
|
|
1414
|
+
middleware,
|
|
1415
|
+
placement: placementProp,
|
|
1416
|
+
whileElementsMounted: autoUpdate,
|
|
1417
|
+
elements: referenceElement ? {
|
|
1418
|
+
reference: referenceElement
|
|
1419
|
+
} : void 0
|
|
1420
|
+
}), referenceHidden = middlewareData.hide?.referenceHidden, arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, setArrow = useCallback((arrowEl) => {
|
|
1421
|
+
arrowRef.current = arrowEl;
|
|
1422
|
+
}, []), setFloating = useCallback((node) => {
|
|
1423
|
+
ref.current = node, refs.setFloating(node);
|
|
1424
|
+
}, [refs]), setReference = useCallback((node_0) => {
|
|
1425
|
+
refs.setReference(node_0);
|
|
1426
|
+
const childRef = getElementRef$1(childProp);
|
|
1427
|
+
typeof childRef == "function" ? childRef(node_0) : childRef && (childRef.current = node_0);
|
|
1428
|
+
}, [childProp, refs]), child = useMemo(() => referenceElement ? childProp : childProp ? cloneElement(childProp, {
|
|
1429
|
+
ref: setReference
|
|
1430
|
+
}) : null, [childProp, referenceElement, setReference]);
|
|
1431
|
+
if (useEffect(() => {
|
|
1432
|
+
updateRef && (typeof updateRef == "function" ? updateRef(update) : updateRef && (updateRef.current = update));
|
|
1433
|
+
}, [update, updateRef]), disabled)
|
|
1434
|
+
return childProp || /* @__PURE__ */ jsx(Fragment, {});
|
|
1435
|
+
const node_1 = /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1436
|
+
modal && /* @__PURE__ */ jsx(ViewportOverlay, {}),
|
|
1437
|
+
/* @__PURE__ */ jsx(PopoverLayer, { ...rest, __unstable_margins: margins, animate, arrow: arrowProp, arrowRef: setArrow, arrowX, arrowY, as, className: popover({
|
|
1438
|
+
className
|
|
1439
|
+
}), hidden: referenceHidden, maxWidth: widthProp, overflow, padding, placement, radius, ref: setFloating, scheme, shadow, originX, originY, strategy, x, y, zOffset, children: content })
|
|
1440
|
+
] }), children = open && (portal ? /* @__PURE__ */ jsx(Portal, { __unstable_name: typeof portal == "string" ? portal : void 0, children: /* @__PURE__ */ jsx(CardProvider, { tone: tone === "inherit" ? card2?.tone ?? "default" : tone, scheme: scheme ?? "light", children: node_1 }) }) : node_1);
|
|
1441
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1442
|
+
animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children,
|
|
1443
|
+
child
|
|
1444
|
+
] });
|
|
1445
|
+
}
|
|
1446
|
+
function getElementRef$1(element) {
|
|
1447
|
+
let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
1448
|
+
return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
|
|
1449
|
+
}
|
|
1450
|
+
const DEFAULT_STACK_ELEMENT = "div";
|
|
1451
|
+
function Stack(props) {
|
|
1452
|
+
const $ = c(13), t0 = props;
|
|
1453
|
+
let className, gap, rest, space, t1;
|
|
1454
|
+
$[0] !== t0 ? ({
|
|
1455
|
+
as: t1,
|
|
1456
|
+
className,
|
|
1457
|
+
gap,
|
|
1458
|
+
space,
|
|
1459
|
+
...rest
|
|
1460
|
+
} = t0, $[0] = t0, $[1] = className, $[2] = gap, $[3] = rest, $[4] = space, $[5] = t1) : (className = $[1], gap = $[2], rest = $[3], space = $[4], t1 = $[5]);
|
|
1461
|
+
const as = t1 === void 0 ? DEFAULT_STACK_ELEMENT : t1;
|
|
1462
|
+
let t2;
|
|
1463
|
+
$[6] !== className ? (t2 = stack({
|
|
1464
|
+
className
|
|
1465
|
+
}), $[6] = className, $[7] = t2) : t2 = $[7];
|
|
1466
|
+
const t3 = gap ?? space;
|
|
1467
|
+
let t4;
|
|
1468
|
+
return $[8] !== as || $[9] !== rest || $[10] !== t2 || $[11] !== t3 ? (t4 = /* @__PURE__ */ jsx(Box, { "data-ui": "Stack", ...rest, as, gridAutoRows: "min", className: t2, display: "grid", gap: t3 }), $[8] = as, $[9] = rest, $[10] = t2, $[11] = t3, $[12] = t4) : t4 = $[12], t4;
|
|
1469
|
+
}
|
|
1470
|
+
const DEFAULT_TEXT_INPUT_ELEMENT = "input";
|
|
1471
|
+
function TextInput(props) {
|
|
1472
|
+
const $ = c(89), t0 = props;
|
|
1473
|
+
let IconComponent, IconRightComponent, __unstable_disableFocusRing, className, clearButton, customValidity, forwardedRef, gap, onClear, prefix, readOnly, rest, suffix, t1, t2, t3, t4, t5, t6, t7, t8, width;
|
|
1474
|
+
if ($[0] !== t0) {
|
|
1475
|
+
const {
|
|
1476
|
+
__unstable_disableFocusRing: t92,
|
|
1477
|
+
as: t102,
|
|
1478
|
+
border: t112,
|
|
1479
|
+
className: t122,
|
|
1480
|
+
clearButton: t132,
|
|
1481
|
+
disabled: t142,
|
|
1482
|
+
fontSize: t152,
|
|
1483
|
+
gap: t162,
|
|
1484
|
+
icon: t172,
|
|
1485
|
+
iconRight: t182,
|
|
1486
|
+
onClear: t192,
|
|
1487
|
+
padding: t202,
|
|
1488
|
+
prefix: t212,
|
|
1489
|
+
radius: t222,
|
|
1490
|
+
readOnly: t232,
|
|
1491
|
+
ref: t242,
|
|
1492
|
+
space: t252,
|
|
1493
|
+
suffix: t262,
|
|
1494
|
+
customValidity: t272,
|
|
1495
|
+
type: t282,
|
|
1496
|
+
weight: _width,
|
|
1497
|
+
width: t292,
|
|
1498
|
+
...t302
|
|
1499
|
+
} = t0;
|
|
1500
|
+
__unstable_disableFocusRing = t92, t1 = t102, t2 = t112, className = t122, clearButton = t132, t3 = t142, t4 = t152, gap = t162, IconComponent = t172, IconRightComponent = t182, onClear = t192, t5 = t202, prefix = t212, t6 = t222, readOnly = t232, forwardedRef = t242, t7 = t252, suffix = t262, customValidity = t272, t8 = t282, width = t292, rest = t302, $[0] = t0, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = __unstable_disableFocusRing, $[4] = className, $[5] = clearButton, $[6] = customValidity, $[7] = forwardedRef, $[8] = gap, $[9] = onClear, $[10] = prefix, $[11] = readOnly, $[12] = rest, $[13] = suffix, $[14] = t1, $[15] = t2, $[16] = t3, $[17] = t4, $[18] = t5, $[19] = t6, $[20] = t7, $[21] = t8, $[22] = width;
|
|
1501
|
+
} else
|
|
1502
|
+
IconComponent = $[1], IconRightComponent = $[2], __unstable_disableFocusRing = $[3], className = $[4], clearButton = $[5], customValidity = $[6], forwardedRef = $[7], gap = $[8], onClear = $[9], prefix = $[10], readOnly = $[11], rest = $[12], suffix = $[13], t1 = $[14], t2 = $[15], t3 = $[16], t4 = $[17], t5 = $[18], t6 = $[19], t7 = $[20], t8 = $[21], width = $[22];
|
|
1503
|
+
const Element = t1 === void 0 ? DEFAULT_TEXT_INPUT_ELEMENT : t1, border = t2 === void 0 ? !0 : t2, disabled = t3 === void 0 ? !1 : t3, fontSize = t4 === void 0 ? 2 : t4, padding = t5 === void 0 ? 3 : t5, radius = t6 === void 0 ? 2 : t6, space = t7 === void 0 ? 3 : t7, type = t8 === void 0 ? "text" : t8, ref = useRef(null), responsivePadding = useResponsiveProp(padding), withClearButton = !!clearButton;
|
|
1504
|
+
let t9;
|
|
1505
|
+
$[23] === Symbol.for("react.memo_cache_sentinel") ? (t9 = () => ref.current, $[23] = t9) : t9 = $[23], useImperativeHandle(forwardedRef, t9), useCustomValidity(ref, customValidity);
|
|
1506
|
+
const handleClearMouseDown = _temp;
|
|
1507
|
+
let t10;
|
|
1508
|
+
$[24] !== onClear ? (t10 = (event_0) => {
|
|
1509
|
+
event_0.preventDefault(), event_0.stopPropagation(), onClear && onClear(), ref.current?.focus();
|
|
1510
|
+
}, $[24] = onClear, $[25] = t10) : t10 = $[25];
|
|
1511
|
+
const handleClearClick = t10;
|
|
1512
|
+
let t11, t12;
|
|
1513
|
+
$[26] !== responsivePadding ? (t12 = Object.fromEntries(Object.entries(responsivePadding).map(_temp2)), $[26] = responsivePadding, $[27] = t12) : t12 = $[27], t11 = t12;
|
|
1514
|
+
const clearButtonBoxPadding = t11;
|
|
1515
|
+
let t13, t14;
|
|
1516
|
+
$[28] !== responsivePadding ? (t14 = Object.fromEntries(Object.entries(responsivePadding).map(_temp3)), $[28] = responsivePadding, $[29] = t14) : t14 = $[29], t13 = t14;
|
|
1517
|
+
const clearButtonPadding = t13;
|
|
1518
|
+
let t15;
|
|
1519
|
+
t15 = isRecord(clearButton) ? clearButton : EMPTY_RECORD;
|
|
1520
|
+
const clearButtonProps = t15, t16 = gap ?? space;
|
|
1521
|
+
let t17;
|
|
1522
|
+
$[30] !== border || $[31] !== className || $[32] !== fontSize || $[33] !== padding || $[34] !== radius || $[35] !== t16 || $[36] !== width ? (t17 = textInput({
|
|
1523
|
+
className,
|
|
1524
|
+
border,
|
|
1525
|
+
fontSize,
|
|
1526
|
+
padding,
|
|
1527
|
+
radius,
|
|
1528
|
+
gap: t16,
|
|
1529
|
+
width
|
|
1530
|
+
}), $[30] = border, $[31] = className, $[32] = fontSize, $[33] = padding, $[34] = radius, $[35] = t16, $[36] = width, $[37] = t17) : t17 = $[37];
|
|
1531
|
+
const t18 = IconComponent ? "" : void 0, t19 = IconRightComponent ? "" : void 0, t20 = customValidity ? "" : void 0, t21 = prefix ? "" : void 0, t22 = !disabled && readOnly ? "" : void 0, t23 = suffix ? "" : void 0;
|
|
1532
|
+
let t24;
|
|
1533
|
+
$[38] !== prefix ? (t24 = prefix && /* @__PURE__ */ jsx(Box, { className: textInputPrefix(), sizing: "border", children: /* @__PURE__ */ jsx("span", { children: prefix }) }), $[38] = prefix, $[39] = t24) : t24 = $[39];
|
|
1534
|
+
let t25;
|
|
1535
|
+
$[40] === Symbol.for("react.memo_cache_sentinel") ? (t25 = textInputElement(), $[40] = t25) : t25 = $[40];
|
|
1536
|
+
let t26;
|
|
1537
|
+
$[41] === Symbol.for("react.memo_cache_sentinel") ? (t26 = _inputElement(), $[41] = t26) : t26 = $[41];
|
|
1538
|
+
const t27 = __unstable_disableFocusRing ? "" : void 0;
|
|
1539
|
+
let t28;
|
|
1540
|
+
$[42] !== Element || $[43] !== disabled || $[44] !== readOnly || $[45] !== rest || $[46] !== t27 || $[47] !== type ? (t28 = /* @__PURE__ */ jsx(Element, { ...rest, className: t26, "data-no-focus-ring": t27, disabled, readOnly, ref, type }), $[42] = Element, $[43] = disabled, $[44] = readOnly, $[45] = rest, $[46] = t27, $[47] = type, $[48] = t28) : t28 = $[48];
|
|
1541
|
+
let t29;
|
|
1542
|
+
$[49] === Symbol.for("react.memo_cache_sentinel") ? (t29 = _inputPresentation(), $[49] = t29) : t29 = $[49];
|
|
1543
|
+
let t30;
|
|
1544
|
+
$[50] !== IconComponent || $[51] !== fontSize || $[52] !== padding ? (t30 = IconComponent && /* @__PURE__ */ jsx(Box, { padding, position: "absolute", insetTop: 0, insetLeft: 0, children: /* @__PURE__ */ jsxs(Text, { size: fontSize, children: [
|
|
1545
|
+
isValidElement(IconComponent) && IconComponent,
|
|
1546
|
+
isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
|
|
1547
|
+
] }) }), $[50] = IconComponent, $[51] = fontSize, $[52] = padding, $[53] = t30) : t30 = $[53];
|
|
1548
|
+
let t31;
|
|
1549
|
+
$[54] !== IconRightComponent || $[55] !== fontSize || $[56] !== padding || $[57] !== withClearButton ? (t31 = !withClearButton && IconRightComponent && /* @__PURE__ */ jsx(Box, { padding, position: "absolute", insetTop: 0, insetRight: 0, children: /* @__PURE__ */ jsxs(Text, { size: fontSize, children: [
|
|
1550
|
+
isValidElement(IconRightComponent) && IconRightComponent,
|
|
1551
|
+
isValidElementType(IconRightComponent) && /* @__PURE__ */ jsx(IconRightComponent, {})
|
|
1552
|
+
] }) }), $[54] = IconRightComponent, $[55] = fontSize, $[56] = padding, $[57] = withClearButton, $[58] = t31) : t31 = $[58];
|
|
1553
|
+
let t32;
|
|
1554
|
+
$[59] !== t30 || $[60] !== t31 ? (t32 = /* @__PURE__ */ jsxs(Box, { className: t29, position: "absolute", children: [
|
|
1555
|
+
t30,
|
|
1556
|
+
t31
|
|
1557
|
+
] }), $[59] = t30, $[60] = t31, $[61] = t32) : t32 = $[61];
|
|
1558
|
+
let t33;
|
|
1559
|
+
$[62] !== clearButton || $[63] !== clearButtonBoxPadding || $[64] !== clearButtonPadding || $[65] !== clearButtonProps || $[66] !== disabled || $[67] !== fontSize || $[68] !== handleClearClick || $[69] !== radius || $[70] !== readOnly ? (t33 = !disabled && !readOnly && clearButton && /* @__PURE__ */ jsx(Box, { insetTop: 0, insetRight: 0, padding: clearButtonBoxPadding, position: "absolute", style: {
|
|
1560
|
+
zIndex: 2
|
|
1561
|
+
}, children: /* @__PURE__ */ jsx(Button, { "aria-label": "Clear", "data-qa": "clear-button", display: "block", fontSize, icon: CloseIcon, mode: "bleed", padding: clearButtonPadding, radius, ...clearButtonProps, onClick: handleClearClick, onMouseDown: handleClearMouseDown }) }), $[62] = clearButton, $[63] = clearButtonBoxPadding, $[64] = clearButtonPadding, $[65] = clearButtonProps, $[66] = disabled, $[67] = fontSize, $[68] = handleClearClick, $[69] = radius, $[70] = readOnly, $[71] = t33) : t33 = $[71];
|
|
1562
|
+
let t34;
|
|
1563
|
+
$[72] !== t28 || $[73] !== t32 || $[74] !== t33 ? (t34 = /* @__PURE__ */ jsxs(Box, { className: t25, flex: 1, position: "relative", children: [
|
|
1564
|
+
t28,
|
|
1565
|
+
t32,
|
|
1566
|
+
t33
|
|
1567
|
+
] }), $[72] = t28, $[73] = t32, $[74] = t33, $[75] = t34) : t34 = $[75];
|
|
1568
|
+
let t35;
|
|
1569
|
+
$[76] !== suffix ? (t35 = suffix && /* @__PURE__ */ jsx(Box, { className: textInputSuffix(), sizing: "border", children: /* @__PURE__ */ jsx("span", { children: suffix }) }), $[76] = suffix, $[77] = t35) : t35 = $[77];
|
|
1570
|
+
let t36;
|
|
1571
|
+
return $[78] !== t17 || $[79] !== t18 || $[80] !== t19 || $[81] !== t20 || $[82] !== t21 || $[83] !== t22 || $[84] !== t23 || $[85] !== t24 || $[86] !== t34 || $[87] !== t35 ? (t36 = /* @__PURE__ */ jsxs(Box, { alignItems: "center", className: t17, "data-icon-left": t18, "data-icon-right": t19, "data-invalid": t20, "data-prefix": t21, "data-read-only": t22, "data-suffix": t23, "data-ui": "TextInput", display: "flex", children: [
|
|
1572
|
+
t24,
|
|
1573
|
+
t34,
|
|
1574
|
+
t35
|
|
1575
|
+
] }), $[78] = t17, $[79] = t18, $[80] = t19, $[81] = t20, $[82] = t21, $[83] = t22, $[84] = t23, $[85] = t24, $[86] = t34, $[87] = t35, $[88] = t36) : t36 = $[88], t36;
|
|
1576
|
+
}
|
|
1577
|
+
function _temp3(t0) {
|
|
1578
|
+
const [key_0, value_0] = t0;
|
|
1579
|
+
return value_0 === 0 ? [key_0, 0] : value_0 === 1 ? [key_0, 0] : value_0 === 2 ? [key_0, 1] : [key_0, typeof value_0 == "number" ? value_0 - 1 : 0];
|
|
1580
|
+
}
|
|
1581
|
+
function _temp2(t0) {
|
|
1582
|
+
const [key2, value] = t0;
|
|
1583
|
+
return value === 0 ? [key2, 0] : value === 1 ? [key2, 1] : value === 2 ? [key2, 1] : [key2, typeof value == "number" ? value - 2 : 0];
|
|
1584
|
+
}
|
|
1585
|
+
function _temp(event) {
|
|
1586
|
+
event.preventDefault(), event.stopPropagation();
|
|
1587
|
+
}
|
|
1588
|
+
function useDelayedState(initialState) {
|
|
1589
|
+
const $ = c(3), [state, setState] = useState(initialState), delayedAction = useRef(void 0);
|
|
1590
|
+
let t0;
|
|
1591
|
+
$[0] === Symbol.for("react.memo_cache_sentinel") ? (t0 = (nextState, delay) => {
|
|
1592
|
+
const action = () => {
|
|
1593
|
+
setState(nextState);
|
|
1594
|
+
};
|
|
1595
|
+
if (delayedAction.current && (clearTimeout(delayedAction.current), delayedAction.current = void 0), !delay)
|
|
1596
|
+
return action();
|
|
1597
|
+
delayedAction.current = setTimeout(action, delay);
|
|
1598
|
+
}, $[0] = t0) : t0 = $[0];
|
|
1599
|
+
const onStateChange = t0;
|
|
1600
|
+
let t1;
|
|
1601
|
+
return $[1] !== state ? (t1 = [state, onStateChange], $[1] = state, $[2] = t1) : t1 = $[2], t1;
|
|
1602
|
+
}
|
|
1603
|
+
function getElementRef(element) {
|
|
1604
|
+
let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
1605
|
+
return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
|
|
1606
|
+
}
|
|
1607
|
+
const DEFAULT_TOOLTIP_ARROW_WIDTH = 15, DEFAULT_TOOLTIP_ARROW_HEIGHT = 6, DEFAULT_TOOLTIP_ARROW_RADIUS = 2, DEFAULT_TOOLTIP_DISTANCE = 4, DEFAULT_TOOLTIP_PADDING = 4, DEFAULT_FALLBACK_PLACEMENTS = {
|
|
1608
|
+
top: ["top-end", "top-start", "bottom", "left", "right"],
|
|
1609
|
+
"top-start": ["top", "top-end", "bottom-start", "left-start", "right-start"],
|
|
1610
|
+
"top-end": ["top", "top-start", "bottom-end", "left-end", "right-end"],
|
|
1611
|
+
bottom: ["bottom-end", "bottom-start", "top", "left", "right"],
|
|
1612
|
+
"bottom-start": ["bottom", "bottom-end", "top-start", "left-start", "right-start"],
|
|
1613
|
+
"bottom-end": ["bottom", "bottom-start", "top-end", "left-end", "right-end"],
|
|
1614
|
+
left: ["left-end", "left-start", "right", "top", "bottom"],
|
|
1615
|
+
"left-start": ["left", "left-end", "right-start", "top-start", "bottom-start"],
|
|
1616
|
+
"left-end": ["left", "left-start", "right-end", "top-end", "bottom-end"],
|
|
1617
|
+
right: ["right-end", "right-start", "left", "top", "bottom"],
|
|
1618
|
+
"right-start": ["right", "right-end", "left-start", "top-start", "bottom-start"],
|
|
1619
|
+
"right-end": ["right", "right-start", "left-end", "top-end", "bottom-end"]
|
|
1620
|
+
}, TooltipDelayGroupContext = createGlobalScopedContext("@sanity/ui/context/tooltipDelayGroup", null);
|
|
1621
|
+
function useTooltipDelayGroup() {
|
|
1622
|
+
return useContext(TooltipDelayGroupContext);
|
|
1623
|
+
}
|
|
1624
|
+
function TooltipLayer(props) {
|
|
1625
|
+
const $ = c(50);
|
|
1626
|
+
let animate, arrow2, arrowRef, arrowX, arrowY, children, originX, originY, padding, placement, radius, rest, scheme, shadow, style, t0;
|
|
1627
|
+
$[0] !== props ? ({
|
|
1628
|
+
animate,
|
|
1629
|
+
arrow: arrow2,
|
|
1630
|
+
arrowRef,
|
|
1631
|
+
arrowX,
|
|
1632
|
+
arrowY,
|
|
1633
|
+
children,
|
|
1634
|
+
originX,
|
|
1635
|
+
originY,
|
|
1636
|
+
padding,
|
|
1637
|
+
placement,
|
|
1638
|
+
radius,
|
|
1639
|
+
scheme,
|
|
1640
|
+
shadow,
|
|
1641
|
+
style,
|
|
1642
|
+
tone: t0,
|
|
1643
|
+
...rest
|
|
1644
|
+
} = props, $[0] = props, $[1] = animate, $[2] = arrow2, $[3] = arrowRef, $[4] = arrowX, $[5] = arrowY, $[6] = children, $[7] = originX, $[8] = originY, $[9] = padding, $[10] = placement, $[11] = radius, $[12] = rest, $[13] = scheme, $[14] = shadow, $[15] = style, $[16] = t0) : (animate = $[1], arrow2 = $[2], arrowRef = $[3], arrowX = $[4], arrowY = $[5], children = $[6], originX = $[7], originY = $[8], padding = $[9], placement = $[10], radius = $[11], rest = $[12], scheme = $[13], shadow = $[14], style = $[15], t0 = $[16]);
|
|
1645
|
+
const tone = t0 === void 0 ? "inherit" : t0;
|
|
1646
|
+
let t1;
|
|
1647
|
+
const t2 = animate ? "transform" : void 0;
|
|
1648
|
+
let t3;
|
|
1649
|
+
$[17] !== originX || $[18] !== originY || $[19] !== style || $[20] !== t2 ? (t3 = {
|
|
1650
|
+
originX,
|
|
1651
|
+
originY,
|
|
1652
|
+
willChange: t2,
|
|
1653
|
+
...style
|
|
1654
|
+
}, $[17] = originX, $[18] = originY, $[19] = style, $[20] = t2, $[21] = t3) : t3 = $[21], t1 = t3;
|
|
1655
|
+
const rootStyle = t1;
|
|
1656
|
+
let t4;
|
|
1657
|
+
const t5 = arrowX !== null ? arrowX : void 0, t6 = arrowY !== null ? arrowY : void 0;
|
|
1658
|
+
let t7;
|
|
1659
|
+
$[22] !== t5 || $[23] !== t6 ? (t7 = {
|
|
1660
|
+
left: t5,
|
|
1661
|
+
top: t6,
|
|
1662
|
+
right: void 0,
|
|
1663
|
+
bottom: void 0
|
|
1664
|
+
}, $[22] = t5, $[23] = t6, $[24] = t7) : t7 = $[24], t4 = t7;
|
|
1665
|
+
const arrowStyle = t4, t8 = animate ? "" : void 0;
|
|
1666
|
+
let t9;
|
|
1667
|
+
$[25] !== animate ? (t9 = animate ? ["hidden", "initial"] : void 0, $[25] = animate, $[26] = t9) : t9 = $[26];
|
|
1668
|
+
let t10;
|
|
1669
|
+
$[27] !== animate ? (t10 = animate ? ["visible", "scaleIn"] : void 0, $[27] = animate, $[28] = t10) : t10 = $[28];
|
|
1670
|
+
let t11;
|
|
1671
|
+
$[29] !== animate ? (t11 = animate ? ["hidden", "scaleOut"] : void 0, $[29] = animate, $[30] = t11) : t11 = $[30];
|
|
1672
|
+
let t12;
|
|
1673
|
+
$[31] !== arrow2 || $[32] !== arrowRef || $[33] !== arrowStyle ? (t12 = arrow2 && /* @__PURE__ */ jsx(Arrow, { ref: arrowRef, style: arrowStyle, width: DEFAULT_TOOLTIP_ARROW_WIDTH, height: DEFAULT_TOOLTIP_ARROW_HEIGHT, radius: DEFAULT_TOOLTIP_ARROW_RADIUS }), $[31] = arrow2, $[32] = arrowRef, $[33] = arrowStyle, $[34] = t12) : t12 = $[34];
|
|
1674
|
+
let t13;
|
|
1675
|
+
return $[35] !== children || $[36] !== padding || $[37] !== placement || $[38] !== radius || $[39] !== rest || $[40] !== rootStyle || $[41] !== scheme || $[42] !== shadow || $[43] !== t10 || $[44] !== t11 || $[45] !== t12 || $[46] !== t8 || $[47] !== t9 || $[48] !== tone ? (t13 = /* @__PURE__ */ jsxs(Layer, { "data-ui": "Tooltip__layer", ...rest, as: motion.div, "data-animate": t8, "data-placement": placement, padding, radius, scheme, shadow, style: rootStyle, variants: POPOVER_MOTION_PROPS.card, transition: POPOVER_MOTION_PROPS.transition, initial: t9, animate: t10, exit: t11, tone, children: [
|
|
1676
|
+
children,
|
|
1677
|
+
t12
|
|
1678
|
+
] }), $[35] = children, $[36] = padding, $[37] = placement, $[38] = radius, $[39] = rest, $[40] = rootStyle, $[41] = scheme, $[42] = shadow, $[43] = t10, $[44] = t11, $[45] = t12, $[46] = t8, $[47] = t9, $[48] = tone, $[49] = t13) : t13 = $[49], t13;
|
|
1679
|
+
}
|
|
1680
|
+
const DEFAULT_TOOLTIP_ELEMENT = "div";
|
|
1681
|
+
function Tooltip(props) {
|
|
1682
|
+
const boundaryElementContext = useBoundaryElement(), {
|
|
1683
|
+
animate: _animate = !1,
|
|
1684
|
+
arrow: arrowProp = !1,
|
|
1685
|
+
as = DEFAULT_TOOLTIP_ELEMENT,
|
|
1686
|
+
boundaryElement = boundaryElementContext?.element,
|
|
1687
|
+
children: childProp,
|
|
1688
|
+
className,
|
|
1689
|
+
content,
|
|
1690
|
+
delay,
|
|
1691
|
+
disabled,
|
|
1692
|
+
fallbackPlacements = props.fallbackPlacements ?? DEFAULT_FALLBACK_PLACEMENTS[props.placement ?? "bottom"],
|
|
1693
|
+
padding = 2,
|
|
1694
|
+
placement: placementProp = "bottom",
|
|
1695
|
+
portal: portalProp,
|
|
1696
|
+
radius = 3,
|
|
1697
|
+
ref: forwardedRef,
|
|
1698
|
+
scheme,
|
|
1699
|
+
shadow = 2,
|
|
1700
|
+
zOffset = Z_OFFSETS.tooltip,
|
|
1701
|
+
tone = "inherit",
|
|
1702
|
+
...rest
|
|
1703
|
+
} = props, card2 = useCard(), animate = usePrefersReducedMotion() ? !1 : _animate, ref = useRef(null), [referenceElement, setReferenceElement] = useState(null), arrowRef = useRef(null), rootBoundary = "viewport", [tooltipMaxWidth, setTooltipMaxWidth] = useState(0);
|
|
1704
|
+
useImperativeHandle(forwardedRef, () => ref.current);
|
|
1705
|
+
const portal = usePortal(), portalElement = typeof portalProp == "string" ? portal.elements?.[portalProp] || null : portal.element, middleware = useMemo(() => {
|
|
1706
|
+
const ret = [];
|
|
1707
|
+
return ret.push(flip({
|
|
1708
|
+
boundary: boundaryElement || void 0,
|
|
1709
|
+
fallbackPlacements,
|
|
1710
|
+
padding: DEFAULT_TOOLTIP_PADDING,
|
|
1711
|
+
rootBoundary
|
|
1712
|
+
})), ret.push(offset({
|
|
1713
|
+
mainAxis: DEFAULT_TOOLTIP_DISTANCE
|
|
1714
|
+
})), ret.push(shift({
|
|
1715
|
+
boundary: boundaryElement || void 0,
|
|
1716
|
+
rootBoundary,
|
|
1717
|
+
padding: DEFAULT_TOOLTIP_PADDING
|
|
1718
|
+
})), arrowProp && ret.push(arrow({
|
|
1719
|
+
element: arrowRef,
|
|
1720
|
+
padding: DEFAULT_TOOLTIP_PADDING
|
|
1721
|
+
})), animate && ret.push(origin), ret;
|
|
1722
|
+
}, [animate, arrowProp, boundaryElement, fallbackPlacements]), {
|
|
1723
|
+
floatingStyles,
|
|
1724
|
+
placement,
|
|
1725
|
+
middlewareData,
|
|
1726
|
+
refs,
|
|
1727
|
+
update
|
|
1728
|
+
} = useFloating({
|
|
1729
|
+
middleware,
|
|
1730
|
+
placement: placementProp,
|
|
1731
|
+
whileElementsMounted: autoUpdate,
|
|
1732
|
+
elements: {
|
|
1733
|
+
reference: referenceElement
|
|
1734
|
+
},
|
|
1735
|
+
transform: !1
|
|
1736
|
+
}), arrowX = middlewareData.arrow?.x, arrowY = middlewareData.arrow?.y, originX = middlewareData["@sanity/ui/origin"]?.originX, originY = middlewareData["@sanity/ui/origin"]?.originY, tooltipId = useId(), [isOpen, setIsOpen] = useDelayedState(!1), delayGroupContext = useTooltipDelayGroup(), {
|
|
1737
|
+
setIsGroupActive,
|
|
1738
|
+
setOpenTooltipId
|
|
1739
|
+
} = delayGroupContext || {}, showTooltip = isOpen || delayGroupContext?.openTooltipId === tooltipId, isInsideGroup = delayGroupContext !== null, openDelayProp = typeof delay == "number" ? delay : delay?.open || 0, closeDelayProp = typeof delay == "number" ? delay : delay?.close || 0, openDelay = isInsideGroup ? delayGroupContext.openDelay : openDelayProp, closeDelay = isInsideGroup ? delayGroupContext.closeDelay : closeDelayProp, handleIsOpenChange = useCallback((open, immediate) => {
|
|
1740
|
+
if (isInsideGroup)
|
|
1741
|
+
if (open) {
|
|
1742
|
+
const groupedOpenDelay = immediate ? 0 : openDelay;
|
|
1743
|
+
setIsGroupActive?.(open, groupedOpenDelay), setOpenTooltipId?.(tooltipId, groupedOpenDelay);
|
|
1744
|
+
} else {
|
|
1745
|
+
const groupDeactivateDelay = closeDelay > 200 ? closeDelay : 200;
|
|
1746
|
+
setIsGroupActive?.(open, groupDeactivateDelay), setOpenTooltipId?.(null, immediate ? 0 : closeDelay);
|
|
1747
|
+
}
|
|
1748
|
+
else
|
|
1749
|
+
setIsOpen(open, immediate ? 0 : open ? openDelay : closeDelay);
|
|
1750
|
+
}, [isInsideGroup, openDelay, setIsGroupActive, setOpenTooltipId, tooltipId, closeDelay, setIsOpen]), handleBlur = useCallback((e) => {
|
|
1751
|
+
handleIsOpenChange(!1), childProp?.props?.onBlur?.(e);
|
|
1752
|
+
}, [childProp?.props, handleIsOpenChange]), handleClick = useCallback((e_0) => {
|
|
1753
|
+
handleIsOpenChange(!1, !0), childProp?.props.onClick?.(e_0);
|
|
1754
|
+
}, [childProp?.props, handleIsOpenChange]), handleContextMenu = useCallback((e_1) => {
|
|
1755
|
+
handleIsOpenChange(!1, !0), childProp?.props.onContextMenu?.(e_1);
|
|
1756
|
+
}, [childProp?.props, handleIsOpenChange]), handleFocus = useCallback((e_2) => {
|
|
1757
|
+
handleIsOpenChange(!0), childProp?.props?.onFocus?.(e_2);
|
|
1758
|
+
}, [childProp?.props, handleIsOpenChange]), handleMouseEnter = useCallback((e_3) => {
|
|
1759
|
+
handleIsOpenChange(!0), childProp?.props?.onMouseEnter?.(e_3);
|
|
1760
|
+
}, [childProp?.props, handleIsOpenChange]), handleMouseLeave = useCallback((e_4) => {
|
|
1761
|
+
handleIsOpenChange(!1), childProp?.props?.onMouseLeave?.(e_4);
|
|
1762
|
+
}, [childProp?.props, handleIsOpenChange]);
|
|
1763
|
+
useCloseOnMouseLeave({
|
|
1764
|
+
handleIsOpenChange,
|
|
1765
|
+
referenceElement,
|
|
1766
|
+
showTooltip,
|
|
1767
|
+
isInsideGroup
|
|
1768
|
+
}), useEffect(() => {
|
|
1769
|
+
disabled && showTooltip && handleIsOpenChange(!1);
|
|
1770
|
+
}, [disabled, handleIsOpenChange, showTooltip]), useEffect(() => {
|
|
1771
|
+
!content && showTooltip && handleIsOpenChange(!1);
|
|
1772
|
+
}, [content, handleIsOpenChange, showTooltip]), useEffect(() => {
|
|
1773
|
+
if (!showTooltip) return;
|
|
1774
|
+
function handleWindowKeyDown(event) {
|
|
1775
|
+
event.key === "Escape" && handleIsOpenChange(!1, !0);
|
|
1776
|
+
}
|
|
1777
|
+
return window.addEventListener("keydown", handleWindowKeyDown), () => {
|
|
1778
|
+
window.removeEventListener("keydown", handleWindowKeyDown);
|
|
1779
|
+
};
|
|
1780
|
+
}, [handleIsOpenChange, showTooltip]), useLayoutEffect(() => {
|
|
1781
|
+
const availableWidths = [...boundaryElement ? [boundaryElement.offsetWidth] : [], portalElement?.offsetWidth || document.body.offsetWidth];
|
|
1782
|
+
setTooltipMaxWidth(Math.min(...availableWidths) - DEFAULT_TOOLTIP_PADDING * 2);
|
|
1783
|
+
}, [boundaryElement, portalElement]);
|
|
1784
|
+
const setArrow = useCallback((arrowEl) => {
|
|
1785
|
+
arrowRef.current = arrowEl, update();
|
|
1786
|
+
}, [update]), setFloating = useCallback((node) => {
|
|
1787
|
+
ref.current = node, refs.setFloating(node);
|
|
1788
|
+
}, [refs]), child = useMemo(() => childProp ? cloneElement(childProp, {
|
|
1789
|
+
onBlur: handleBlur,
|
|
1790
|
+
onFocus: handleFocus,
|
|
1791
|
+
onMouseEnter: handleMouseEnter,
|
|
1792
|
+
onMouseLeave: handleMouseLeave,
|
|
1793
|
+
onClick: handleClick,
|
|
1794
|
+
onContextMenu: handleContextMenu,
|
|
1795
|
+
ref: setReferenceElement
|
|
1796
|
+
}) : null, [childProp, handleBlur, handleClick, handleContextMenu, handleFocus, handleMouseEnter, handleMouseLeave]);
|
|
1797
|
+
if (useImperativeHandle(childProp ? getElementRef(childProp) : null, () => referenceElement, [referenceElement]), !child) return /* @__PURE__ */ jsx(Fragment, {});
|
|
1798
|
+
if (disabled) return child;
|
|
1799
|
+
const node_0 = /* @__PURE__ */ jsx(TooltipLayer, { "data-ui": "Tooltip", ...rest, animate, arrow: arrowProp, arrowRef: setArrow, arrowX, arrowY, as, className: tooltip({
|
|
1800
|
+
className
|
|
1801
|
+
}), originX, originY, padding, placement, radius, ref: setFloating, scheme, shadow, style: {
|
|
1802
|
+
...floatingStyles,
|
|
1803
|
+
maxWidth: tooltipMaxWidth > 0 ? `${tooltipMaxWidth}px` : void 0
|
|
1804
|
+
}, tone, zOffset, children: content }), children = showTooltip && (portalProp ? /* @__PURE__ */ jsx(Portal, { __unstable_name: typeof portalProp == "string" ? portalProp : void 0, children: /* @__PURE__ */ jsx(CardProvider, { tone: tone === "inherit" ? card2?.tone ?? "default" : tone, scheme: scheme ?? "light", children: node_0 }) }) : node_0);
|
|
1805
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
1806
|
+
animate ? /* @__PURE__ */ jsx(AnimatePresence, { children }) : children,
|
|
1807
|
+
child
|
|
1808
|
+
] });
|
|
1809
|
+
}
|
|
1810
|
+
function useCloseOnMouseLeave(t0) {
|
|
1811
|
+
const $ = c(10), {
|
|
1812
|
+
handleIsOpenChange,
|
|
1813
|
+
referenceElement,
|
|
1814
|
+
showTooltip,
|
|
1815
|
+
isInsideGroup
|
|
1816
|
+
} = t0;
|
|
1817
|
+
let t1;
|
|
1818
|
+
$[0] !== handleIsOpenChange || $[1] !== referenceElement ? (t1 = (target, teardown) => {
|
|
1819
|
+
referenceElement && (referenceElement === target || target instanceof Node && referenceElement.contains(target) || (handleIsOpenChange(!1), teardown()));
|
|
1820
|
+
}, $[0] = handleIsOpenChange, $[1] = referenceElement, $[2] = t1) : t1 = $[2];
|
|
1821
|
+
const onMouseMove = useEffectEvent(t1);
|
|
1822
|
+
let t2;
|
|
1823
|
+
$[3] !== isInsideGroup || $[4] !== onMouseMove || $[5] !== showTooltip ? (t2 = () => {
|
|
1824
|
+
if (!showTooltip || isInsideGroup)
|
|
1825
|
+
return;
|
|
1826
|
+
const handleMouseMove = (event) => {
|
|
1827
|
+
onMouseMove(event.target, () => window.removeEventListener("mousemove", handleMouseMove));
|
|
1828
|
+
};
|
|
1829
|
+
return window.addEventListener("mousemove", handleMouseMove), () => window.removeEventListener("mousemove", handleMouseMove);
|
|
1830
|
+
}, $[3] = isInsideGroup, $[4] = onMouseMove, $[5] = showTooltip, $[6] = t2) : t2 = $[6];
|
|
1831
|
+
let t3;
|
|
1832
|
+
$[7] !== isInsideGroup || $[8] !== showTooltip ? (t3 = [isInsideGroup, showTooltip], $[7] = isInsideGroup, $[8] = showTooltip, $[9] = t3) : t3 = $[9], useEffect(t2, t3);
|
|
1833
|
+
}
|
|
1834
|
+
const DEFAULT_HOTKEYS_ELEMENT = "kbd";
|
|
1835
|
+
function Hotkeys(props) {
|
|
1836
|
+
const $ = c(27), t0 = props;
|
|
1837
|
+
let fontSize, gap, gapX, gapY, keys, padding, radius, rest, t1, t2;
|
|
1838
|
+
$[0] !== t0 ? ({
|
|
1839
|
+
as: t1,
|
|
1840
|
+
fontSize,
|
|
1841
|
+
gap,
|
|
1842
|
+
gapX,
|
|
1843
|
+
gapY,
|
|
1844
|
+
keys,
|
|
1845
|
+
padding,
|
|
1846
|
+
radius,
|
|
1847
|
+
space: t2,
|
|
1848
|
+
...rest
|
|
1849
|
+
} = t0, $[0] = t0, $[1] = fontSize, $[2] = gap, $[3] = gapX, $[4] = gapY, $[5] = keys, $[6] = padding, $[7] = radius, $[8] = rest, $[9] = t1, $[10] = t2) : (fontSize = $[1], gap = $[2], gapX = $[3], gapY = $[4], keys = $[5], padding = $[6], radius = $[7], rest = $[8], t1 = $[9], t2 = $[10]);
|
|
1850
|
+
const as = t1 === void 0 ? DEFAULT_HOTKEYS_ELEMENT : t1, space = t2 === void 0 ? 1 : t2;
|
|
1851
|
+
if (!keys || keys.length === 0)
|
|
1852
|
+
return;
|
|
1853
|
+
const t3 = gap ?? space;
|
|
1854
|
+
let t4;
|
|
1855
|
+
if ($[11] !== fontSize || $[12] !== keys || $[13] !== padding || $[14] !== radius) {
|
|
1856
|
+
let t52;
|
|
1857
|
+
$[16] !== fontSize || $[17] !== padding || $[18] !== radius ? (t52 = (key2, i) => /* @__PURE__ */ jsx(KBD, { fontSize, padding, radius, children: key2 }, i), $[16] = fontSize, $[17] = padding, $[18] = radius, $[19] = t52) : t52 = $[19], t4 = keys.map(t52), $[11] = fontSize, $[12] = keys, $[13] = padding, $[14] = radius, $[15] = t4;
|
|
1858
|
+
} else
|
|
1859
|
+
t4 = $[15];
|
|
1860
|
+
let t5;
|
|
1861
|
+
return $[20] !== as || $[21] !== gapX || $[22] !== gapY || $[23] !== rest || $[24] !== t3 || $[25] !== t4 ? (t5 = /* @__PURE__ */ jsx(Box, { as, "data-ui": "Hotkeys", ...rest, display: "flex", gap: t3, gapX, gapY, children: t4 }), $[20] = as, $[21] = gapX, $[22] = gapY, $[23] = rest, $[24] = t3, $[25] = t4, $[26] = t5) : t5 = $[26], t5;
|
|
1862
|
+
}
|
|
1863
|
+
const MenuContext = createGlobalScopedContext("@sanity/ui/context/menu", null);
|
|
1864
|
+
function _isFocusable(element) {
|
|
1865
|
+
return isHTMLAnchorElement(element) && element.getAttribute("data-disabled") !== "true" || isHTMLButtonElement(element) && !element.disabled;
|
|
1866
|
+
}
|
|
1867
|
+
function _getFocusableElements(elements) {
|
|
1868
|
+
return elements.filter(_isFocusable);
|
|
1869
|
+
}
|
|
1870
|
+
function _getDOMPath(rootElement, el) {
|
|
1871
|
+
const path = [];
|
|
1872
|
+
let e = el;
|
|
1873
|
+
for (; e !== rootElement; ) {
|
|
1874
|
+
const parentElement = e.parentElement;
|
|
1875
|
+
if (!parentElement) return path;
|
|
1876
|
+
const index = Array.from(parentElement.childNodes).indexOf(e);
|
|
1877
|
+
if (path.unshift(index), parentElement === rootElement)
|
|
1878
|
+
return path;
|
|
1879
|
+
e = parentElement;
|
|
1880
|
+
}
|
|
1881
|
+
return path;
|
|
1882
|
+
}
|
|
1883
|
+
const EMPTY_PATH = [];
|
|
1884
|
+
function _sortElements(rootElement, elements) {
|
|
1885
|
+
if (!rootElement) return;
|
|
1886
|
+
const map = /* @__PURE__ */ new WeakMap();
|
|
1887
|
+
for (const el of elements)
|
|
1888
|
+
map.set(el, _getDOMPath(rootElement, el));
|
|
1889
|
+
const _sort = (a, b) => {
|
|
1890
|
+
const _a = map.get(a) || EMPTY_PATH, _b = map.get(b) || EMPTY_PATH, len = Math.max(_a.length, _b.length);
|
|
1891
|
+
for (let i = 0; i < len; i += 1) {
|
|
1892
|
+
const aIndex = _a[i] || -1, bIndex = _b[i] || -1;
|
|
1893
|
+
if (aIndex !== bIndex)
|
|
1894
|
+
return aIndex - bIndex;
|
|
1895
|
+
}
|
|
1896
|
+
return 0;
|
|
1897
|
+
};
|
|
1898
|
+
elements.sort(_sort);
|
|
1899
|
+
}
|
|
1900
|
+
function useMenuController(props) {
|
|
1901
|
+
const {
|
|
1902
|
+
onKeyDown,
|
|
1903
|
+
originElement,
|
|
1904
|
+
shouldFocus,
|
|
1905
|
+
rootElementRef
|
|
1906
|
+
} = props, elementsRef = useRef([]), [activeIndex, _setActiveIndex] = useState(-1), activeIndexRef = useRef(activeIndex), activeElement = useMemo(() => elementsRef.current[activeIndex] || null, [activeIndex]), mounted = !!rootElementRef.current, setActiveIndex = useCallback((nextActiveIndex) => {
|
|
1907
|
+
_setActiveIndex(nextActiveIndex), activeIndexRef.current = nextActiveIndex;
|
|
1908
|
+
}, []), mount = useCallback((element, selected) => {
|
|
1909
|
+
if (!element) return () => {
|
|
1910
|
+
};
|
|
1911
|
+
if (elementsRef.current.indexOf(element) === -1 && (elementsRef.current.push(element), _sortElements(rootElementRef.current, elementsRef.current)), selected) {
|
|
1912
|
+
const selectedIndex = elementsRef.current.indexOf(element);
|
|
1913
|
+
setActiveIndex(selectedIndex);
|
|
1914
|
+
}
|
|
1915
|
+
return () => {
|
|
1916
|
+
const idx = elementsRef.current.indexOf(element);
|
|
1917
|
+
idx > -1 && elementsRef.current.splice(idx, 1);
|
|
1918
|
+
};
|
|
1919
|
+
}, [rootElementRef, setActiveIndex]), handleKeyDown = useCallback((event) => {
|
|
1920
|
+
if (event.key === "Tab") {
|
|
1921
|
+
originElement && originElement.focus();
|
|
1922
|
+
return;
|
|
1923
|
+
}
|
|
1924
|
+
if (event.key === "Home") {
|
|
1925
|
+
event.preventDefault(), event.stopPropagation();
|
|
1926
|
+
const el = _getFocusableElements(elementsRef.current)[0];
|
|
1927
|
+
if (!el) return;
|
|
1928
|
+
const currentIndex = elementsRef.current.indexOf(el);
|
|
1929
|
+
setActiveIndex(currentIndex);
|
|
1930
|
+
return;
|
|
1931
|
+
}
|
|
1932
|
+
if (event.key === "End") {
|
|
1933
|
+
event.preventDefault(), event.stopPropagation();
|
|
1934
|
+
const focusableElements_0 = _getFocusableElements(elementsRef.current), el_0 = focusableElements_0[focusableElements_0.length - 1];
|
|
1935
|
+
if (!el_0) return;
|
|
1936
|
+
const currentIndex_0 = elementsRef.current.indexOf(el_0);
|
|
1937
|
+
setActiveIndex(currentIndex_0);
|
|
1938
|
+
return;
|
|
1939
|
+
}
|
|
1940
|
+
if (event.key === "ArrowUp") {
|
|
1941
|
+
event.preventDefault(), event.stopPropagation();
|
|
1942
|
+
const focusableElements_1 = _getFocusableElements(elementsRef.current), focusableLen = focusableElements_1.length;
|
|
1943
|
+
if (focusableLen === 0) return;
|
|
1944
|
+
const focusedElement = elementsRef.current[activeIndexRef.current];
|
|
1945
|
+
let focusedIndex = focusableElements_1.indexOf(focusedElement);
|
|
1946
|
+
focusedIndex = (focusedIndex - 1 + focusableLen) % focusableLen;
|
|
1947
|
+
const el_1 = focusableElements_1[focusedIndex], currentIndex_1 = elementsRef.current.indexOf(el_1);
|
|
1948
|
+
setActiveIndex(currentIndex_1);
|
|
1949
|
+
return;
|
|
1950
|
+
}
|
|
1951
|
+
if (event.key === "ArrowDown") {
|
|
1952
|
+
event.preventDefault(), event.stopPropagation();
|
|
1953
|
+
const focusableElements_2 = _getFocusableElements(elementsRef.current), focusableLen_0 = focusableElements_2.length;
|
|
1954
|
+
if (focusableLen_0 === 0) return;
|
|
1955
|
+
const focusedElement_0 = elementsRef.current[activeIndexRef.current];
|
|
1956
|
+
let focusedIndex_0 = focusableElements_2.indexOf(focusedElement_0);
|
|
1957
|
+
focusedIndex_0 = (focusedIndex_0 + 1) % focusableLen_0;
|
|
1958
|
+
const el_2 = focusableElements_2[focusedIndex_0], currentIndex_2 = elementsRef.current.indexOf(el_2);
|
|
1959
|
+
setActiveIndex(currentIndex_2);
|
|
1960
|
+
return;
|
|
1961
|
+
}
|
|
1962
|
+
onKeyDown && onKeyDown(event);
|
|
1963
|
+
}, [onKeyDown, originElement, setActiveIndex]), handleItemMouseEnter = useCallback((event_0) => {
|
|
1964
|
+
const element_0 = event_0.currentTarget, currentIndex_3 = elementsRef.current.indexOf(element_0);
|
|
1965
|
+
setActiveIndex(currentIndex_3);
|
|
1966
|
+
}, [setActiveIndex]), handleItemMouseLeave = useCallback(() => {
|
|
1967
|
+
setActiveIndex(-2), rootElementRef.current?.focus();
|
|
1968
|
+
}, [rootElementRef, setActiveIndex]);
|
|
1969
|
+
return useEffect(() => {
|
|
1970
|
+
if (!mounted) return;
|
|
1971
|
+
const rafId = requestAnimationFrame(() => {
|
|
1972
|
+
if (activeIndex === -1) {
|
|
1973
|
+
if (shouldFocus === "first") {
|
|
1974
|
+
const el_3 = _getFocusableElements(elementsRef.current)[0];
|
|
1975
|
+
if (el_3) {
|
|
1976
|
+
const currentIndex_4 = elementsRef.current.indexOf(el_3);
|
|
1977
|
+
setActiveIndex(currentIndex_4);
|
|
1978
|
+
}
|
|
1979
|
+
}
|
|
1980
|
+
if (shouldFocus === "last") {
|
|
1981
|
+
const focusableElements_4 = _getFocusableElements(elementsRef.current), el_4 = focusableElements_4[focusableElements_4.length - 1];
|
|
1982
|
+
if (el_4) {
|
|
1983
|
+
const currentIndex_5 = elementsRef.current.indexOf(el_4);
|
|
1984
|
+
setActiveIndex(currentIndex_5);
|
|
1985
|
+
}
|
|
1986
|
+
}
|
|
1987
|
+
return;
|
|
1988
|
+
}
|
|
1989
|
+
(elementsRef.current[activeIndex] || null)?.focus();
|
|
1990
|
+
});
|
|
1991
|
+
return () => cancelAnimationFrame(rafId);
|
|
1992
|
+
}, [activeIndex, mounted, setActiveIndex, shouldFocus]), {
|
|
1993
|
+
activeElement,
|
|
1994
|
+
activeIndex,
|
|
1995
|
+
handleItemMouseEnter,
|
|
1996
|
+
handleItemMouseLeave,
|
|
1997
|
+
handleKeyDown,
|
|
1998
|
+
mount
|
|
1999
|
+
};
|
|
2000
|
+
}
|
|
2001
|
+
const DEFAULT_MENU_ELEMENT = "div";
|
|
2002
|
+
function Menu(props) {
|
|
2003
|
+
const $ = c(58), t0 = props;
|
|
2004
|
+
let _shouldFocus, children, className, forwardedRef, gap, onClickOutside, onEscape, onItemClick, onItemSelect, onKeyDown, originElement, registerElement, rest, t1, t2, t3;
|
|
2005
|
+
if ($[0] !== t0) {
|
|
2006
|
+
const {
|
|
2007
|
+
as: t42,
|
|
2008
|
+
children: t52,
|
|
2009
|
+
className: t62,
|
|
2010
|
+
focusFirst,
|
|
2011
|
+
focusLast,
|
|
2012
|
+
gap: t72,
|
|
2013
|
+
onClickOutside: t82,
|
|
2014
|
+
onEscape: t92,
|
|
2015
|
+
onItemClick: t102,
|
|
2016
|
+
onItemSelect: t112,
|
|
2017
|
+
onKeyDown: t122,
|
|
2018
|
+
originElement: t132,
|
|
2019
|
+
padding: t142,
|
|
2020
|
+
ref: t152,
|
|
2021
|
+
registerElement: t162,
|
|
2022
|
+
shouldFocus: t172,
|
|
2023
|
+
space: t18,
|
|
2024
|
+
...t19
|
|
2025
|
+
} = t0;
|
|
2026
|
+
t1 = t42, children = t52, className = t62, gap = t72, onClickOutside = t82, onEscape = t92, onItemClick = t102, onItemSelect = t112, onKeyDown = t122, originElement = t132, t2 = t142, forwardedRef = t152, registerElement = t162, _shouldFocus = t172, t3 = t18, rest = t19, $[0] = t0, $[1] = _shouldFocus, $[2] = children, $[3] = className, $[4] = forwardedRef, $[5] = gap, $[6] = onClickOutside, $[7] = onEscape, $[8] = onItemClick, $[9] = onItemSelect, $[10] = onKeyDown, $[11] = originElement, $[12] = registerElement, $[13] = rest, $[14] = t1, $[15] = t2, $[16] = t3;
|
|
2027
|
+
} else
|
|
2028
|
+
_shouldFocus = $[1], children = $[2], className = $[3], forwardedRef = $[4], gap = $[5], onClickOutside = $[6], onEscape = $[7], onItemClick = $[8], onItemSelect = $[9], onKeyDown = $[10], originElement = $[11], registerElement = $[12], rest = $[13], t1 = $[14], t2 = $[15], t3 = $[16];
|
|
2029
|
+
const as = t1 === void 0 ? DEFAULT_MENU_ELEMENT : t1, padding = t2 === void 0 ? 1 : t2, space = t3 === void 0 ? 1 : t3, shouldFocus = _shouldFocus ?? (props.focusFirst && "first" || props.focusLast && "last" || null), ref = useRef(null);
|
|
2030
|
+
let t4;
|
|
2031
|
+
$[17] === Symbol.for("react.memo_cache_sentinel") ? (t4 = () => ref.current, $[17] = t4) : t4 = $[17], useImperativeHandle(forwardedRef, t4);
|
|
2032
|
+
const {
|
|
2033
|
+
isTopLayer
|
|
2034
|
+
} = useLayer();
|
|
2035
|
+
let t5;
|
|
2036
|
+
$[18] !== onKeyDown || $[19] !== originElement || $[20] !== shouldFocus ? (t5 = {
|
|
2037
|
+
onKeyDown,
|
|
2038
|
+
originElement,
|
|
2039
|
+
shouldFocus,
|
|
2040
|
+
rootElementRef: ref
|
|
2041
|
+
}, $[18] = onKeyDown, $[19] = originElement, $[20] = shouldFocus, $[21] = t5) : t5 = $[21];
|
|
2042
|
+
const {
|
|
2043
|
+
activeElement,
|
|
2044
|
+
activeIndex,
|
|
2045
|
+
handleItemMouseEnter,
|
|
2046
|
+
handleItemMouseLeave,
|
|
2047
|
+
handleKeyDown,
|
|
2048
|
+
mount
|
|
2049
|
+
} = useMenuController(t5), unregisterElementRef = useRef(null);
|
|
2050
|
+
let t6;
|
|
2051
|
+
$[22] !== registerElement ? (t6 = (el) => {
|
|
2052
|
+
unregisterElementRef.current && (unregisterElementRef.current(), unregisterElementRef.current = null), ref.current = el, ref.current && registerElement && (unregisterElementRef.current = registerElement(ref.current));
|
|
2053
|
+
}, $[22] = registerElement, $[23] = t6) : t6 = $[23];
|
|
2054
|
+
const handleRefChange = t6;
|
|
2055
|
+
let t7, t8;
|
|
2056
|
+
$[24] !== activeIndex || $[25] !== onItemSelect ? (t7 = () => {
|
|
2057
|
+
onItemSelect && onItemSelect(activeIndex);
|
|
2058
|
+
}, t8 = [activeIndex, onItemSelect], $[24] = activeIndex, $[25] = onItemSelect, $[26] = t7, $[27] = t8) : (t7 = $[26], t8 = $[27]), useEffect(t7, t8);
|
|
2059
|
+
let t9;
|
|
2060
|
+
$[28] === Symbol.for("react.memo_cache_sentinel") ? (t9 = () => [ref.current], $[28] = t9) : t9 = $[28], useClickOutsideEvent(isTopLayer && onClickOutside, t9);
|
|
2061
|
+
let t10;
|
|
2062
|
+
$[29] !== isTopLayer || $[30] !== onEscape ? (t10 = (event) => {
|
|
2063
|
+
isTopLayer && event.key === "Escape" && (event.stopPropagation(), onEscape && onEscape());
|
|
2064
|
+
}, $[29] = isTopLayer, $[30] = onEscape, $[31] = t10) : t10 = $[31], useGlobalKeyDown(t10);
|
|
2065
|
+
let t11, t12;
|
|
2066
|
+
$[32] !== activeElement || $[33] !== activeIndex || $[34] !== handleItemMouseEnter || $[35] !== handleItemMouseLeave || $[36] !== mount || $[37] !== onClickOutside || $[38] !== onEscape || $[39] !== onItemClick || $[40] !== registerElement ? (t12 = {
|
|
2067
|
+
version: 0,
|
|
2068
|
+
activeElement,
|
|
2069
|
+
activeIndex,
|
|
2070
|
+
mount,
|
|
2071
|
+
onClickOutside,
|
|
2072
|
+
onEscape,
|
|
2073
|
+
onItemClick,
|
|
2074
|
+
onItemMouseEnter: handleItemMouseEnter,
|
|
2075
|
+
onItemMouseLeave: handleItemMouseLeave,
|
|
2076
|
+
registerElement,
|
|
2077
|
+
onMouseEnter: handleItemMouseEnter,
|
|
2078
|
+
onMouseLeave: handleItemMouseLeave
|
|
2079
|
+
}, $[32] = activeElement, $[33] = activeIndex, $[34] = handleItemMouseEnter, $[35] = handleItemMouseLeave, $[36] = mount, $[37] = onClickOutside, $[38] = onEscape, $[39] = onItemClick, $[40] = registerElement, $[41] = t12) : t12 = $[41], t11 = t12;
|
|
2080
|
+
const value = t11;
|
|
2081
|
+
let t13;
|
|
2082
|
+
$[42] !== className ? (t13 = menu({
|
|
2083
|
+
className
|
|
2084
|
+
}), $[42] = className, $[43] = t13) : t13 = $[43];
|
|
2085
|
+
const t14 = gap ?? space;
|
|
2086
|
+
let t15;
|
|
2087
|
+
$[44] !== children || $[45] !== t14 ? (t15 = /* @__PURE__ */ jsx(Stack, { gap: t14, children }), $[44] = children, $[45] = t14, $[46] = t15) : t15 = $[46];
|
|
2088
|
+
let t16;
|
|
2089
|
+
$[47] !== as || $[48] !== handleKeyDown || $[49] !== handleRefChange || $[50] !== padding || $[51] !== rest || $[52] !== t13 || $[53] !== t15 ? (t16 = /* @__PURE__ */ jsx(Box, { "data-ui": "Menu", ...rest, as, className: t13, onKeyDown: handleKeyDown, overflow: "auto", outline: "none", padding, ref: handleRefChange, role: "menu", tabIndex: -1, children: t15 }), $[47] = as, $[48] = handleKeyDown, $[49] = handleRefChange, $[50] = padding, $[51] = rest, $[52] = t13, $[53] = t15, $[54] = t16) : t16 = $[54];
|
|
2090
|
+
let t17;
|
|
2091
|
+
return $[55] !== t16 || $[56] !== value ? (t17 = /* @__PURE__ */ jsx(MenuContext.Provider, { value, children: t16 }), $[55] = t16, $[56] = value, $[57] = t17) : t17 = $[57], t17;
|
|
2092
|
+
}
|
|
2093
|
+
const DEFAULT_MENU_DIVIDER_ELEMENT = "hr";
|
|
2094
|
+
function MenuDivider(props) {
|
|
2095
|
+
const $ = c(10), t0 = props;
|
|
2096
|
+
let className, rest, t1;
|
|
2097
|
+
$[0] !== t0 ? ({
|
|
2098
|
+
as: t1,
|
|
2099
|
+
className,
|
|
2100
|
+
...rest
|
|
2101
|
+
} = t0, $[0] = t0, $[1] = className, $[2] = rest, $[3] = t1) : (className = $[1], rest = $[2], t1 = $[3]);
|
|
2102
|
+
const Element = t1 === void 0 ? DEFAULT_MENU_DIVIDER_ELEMENT : t1;
|
|
2103
|
+
let t2;
|
|
2104
|
+
$[4] !== className ? (t2 = menuDivider({
|
|
2105
|
+
className
|
|
2106
|
+
}), $[4] = className, $[5] = t2) : t2 = $[5];
|
|
2107
|
+
let t3;
|
|
2108
|
+
return $[6] !== Element || $[7] !== rest || $[8] !== t2 ? (t3 = /* @__PURE__ */ jsx(Element, { ...rest, className: t2 }), $[6] = Element, $[7] = rest, $[8] = t2, $[9] = t3) : t3 = $[9], t3;
|
|
2109
|
+
}
|
|
2110
|
+
const DEFAULT_SELECTABLE_ELEMENT = "button";
|
|
2111
|
+
function Selectable(props) {
|
|
2112
|
+
const $ = c(14), t0 = props;
|
|
2113
|
+
let className, radius, rest, t1, tone;
|
|
2114
|
+
$[0] !== t0 ? ({
|
|
2115
|
+
as: t1,
|
|
2116
|
+
className,
|
|
2117
|
+
radius,
|
|
2118
|
+
tone,
|
|
2119
|
+
...rest
|
|
2120
|
+
} = t0, $[0] = t0, $[1] = className, $[2] = radius, $[3] = rest, $[4] = t1, $[5] = tone) : (className = $[1], radius = $[2], rest = $[3], t1 = $[4], tone = $[5]);
|
|
2121
|
+
const as = t1 === void 0 ? DEFAULT_SELECTABLE_ELEMENT : t1;
|
|
2122
|
+
let t2;
|
|
2123
|
+
$[6] !== className || $[7] !== radius || $[8] !== tone ? (t2 = _selectable({
|
|
2124
|
+
className,
|
|
2125
|
+
radius,
|
|
2126
|
+
tone
|
|
2127
|
+
}), $[6] = className, $[7] = radius, $[8] = tone, $[9] = t2) : t2 = $[9];
|
|
2128
|
+
let t3;
|
|
2129
|
+
return $[10] !== as || $[11] !== rest || $[12] !== t2 ? (t3 = /* @__PURE__ */ jsx(Box, { ...rest, as, className: t2 }), $[10] = as, $[11] = rest, $[12] = t2, $[13] = t3) : t3 = $[13], t3;
|
|
2130
|
+
}
|
|
2131
|
+
function useMenu() {
|
|
2132
|
+
const value = useContext(MenuContext);
|
|
2133
|
+
if (!value)
|
|
2134
|
+
throw new Error("useMenu(): missing context value");
|
|
2135
|
+
if (!isRecord(value) || value.version !== 0)
|
|
2136
|
+
throw new Error("useMenu(): the context value is not compatible");
|
|
2137
|
+
return value;
|
|
2138
|
+
}
|
|
2139
|
+
const DEFAULT_MENU_GROUP_ELEMENT = "button";
|
|
2140
|
+
function MenuGroup(props) {
|
|
2141
|
+
const $ = c(79), t0 = props;
|
|
2142
|
+
let IconComponent, children, gap, menuProps, onClick, popover2, rest, t1, t2, t3, t4, t5, t6, text2;
|
|
2143
|
+
$[0] !== t0 ? ({
|
|
2144
|
+
as: t1,
|
|
2145
|
+
children,
|
|
2146
|
+
fontSize: t2,
|
|
2147
|
+
gap,
|
|
2148
|
+
icon: IconComponent,
|
|
2149
|
+
menu: menuProps,
|
|
2150
|
+
onClick,
|
|
2151
|
+
padding: t3,
|
|
2152
|
+
popover: popover2,
|
|
2153
|
+
radius: t4,
|
|
2154
|
+
space: t5,
|
|
2155
|
+
text: text2,
|
|
2156
|
+
tone: t6,
|
|
2157
|
+
...rest
|
|
2158
|
+
} = t0, $[0] = t0, $[1] = IconComponent, $[2] = children, $[3] = gap, $[4] = menuProps, $[5] = onClick, $[6] = popover2, $[7] = rest, $[8] = t1, $[9] = t2, $[10] = t3, $[11] = t4, $[12] = t5, $[13] = t6, $[14] = text2) : (IconComponent = $[1], children = $[2], gap = $[3], menuProps = $[4], onClick = $[5], popover2 = $[6], rest = $[7], t1 = $[8], t2 = $[9], t3 = $[10], t4 = $[11], t5 = $[12], t6 = $[13], text2 = $[14]);
|
|
2159
|
+
const as = t1 === void 0 ? DEFAULT_MENU_GROUP_ELEMENT : t1, fontSize = t2 === void 0 ? 1 : t2, padding = t3 === void 0 ? 3 : t3, radius = t4 === void 0 ? 2 : t4, space = t5 === void 0 ? 3 : t5, tone = t6 === void 0 ? "default" : t6, menu2 = useMenu(), {
|
|
2160
|
+
activeElement,
|
|
2161
|
+
mount,
|
|
2162
|
+
onClickOutside,
|
|
2163
|
+
onEscape,
|
|
2164
|
+
onItemClick,
|
|
2165
|
+
onItemMouseEnter: _onItemMouseEnter,
|
|
2166
|
+
registerElement
|
|
2167
|
+
} = menu2, onItemMouseEnter = _onItemMouseEnter ?? menu2.onMouseEnter, [rootElement, setRootElement] = useState(null), [open, setOpen] = useState(!1), [shouldFocus, setShouldFocus] = useState(null), active = !!activeElement && activeElement === rootElement, [withinMenu, setWithinMenu] = useState(!1);
|
|
2168
|
+
let t7;
|
|
2169
|
+
$[15] !== onItemMouseEnter ? (t7 = (event) => {
|
|
2170
|
+
setWithinMenu(!1), onItemMouseEnter(event), setOpen(!0);
|
|
2171
|
+
}, $[15] = onItemMouseEnter, $[16] = t7) : t7 = $[16];
|
|
2172
|
+
const handleMouseEnter = t7;
|
|
2173
|
+
let t8;
|
|
2174
|
+
$[17] !== rootElement ? (t8 = (event_0) => {
|
|
2175
|
+
event_0.key === "ArrowLeft" && (event_0.stopPropagation(), setOpen(!1), requestAnimationFrame(() => {
|
|
2176
|
+
rootElement?.focus();
|
|
2177
|
+
}));
|
|
2178
|
+
}, $[17] = rootElement, $[18] = t8) : t8 = $[18];
|
|
2179
|
+
const handleMenuKeyDown = t8;
|
|
2180
|
+
let t9;
|
|
2181
|
+
$[19] !== onClick ? (t9 = (event_1) => {
|
|
2182
|
+
onClick?.(event_1), setShouldFocus("first"), setOpen(!0);
|
|
2183
|
+
}, $[19] = onClick, $[20] = t9) : t9 = $[20];
|
|
2184
|
+
const handleClick = t9;
|
|
2185
|
+
let t10;
|
|
2186
|
+
$[21] !== onItemClick ? (t10 = () => {
|
|
2187
|
+
setOpen(!1), onItemClick?.();
|
|
2188
|
+
}, $[21] = onItemClick, $[22] = t10) : t10 = $[22];
|
|
2189
|
+
const handleChildItemClick = t10;
|
|
2190
|
+
let t11;
|
|
2191
|
+
$[23] === Symbol.for("react.memo_cache_sentinel") ? (t11 = () => setWithinMenu(!0), $[23] = t11) : t11 = $[23];
|
|
2192
|
+
const handleMenuMouseEnter = t11;
|
|
2193
|
+
let t12, t13;
|
|
2194
|
+
$[24] !== mount || $[25] !== rootElement ? (t12 = () => mount(rootElement), t13 = [mount, rootElement], $[24] = mount, $[25] = rootElement, $[26] = t12, $[27] = t13) : (t12 = $[26], t13 = $[27]), useEffect(t12, t13);
|
|
2195
|
+
let t14, t15;
|
|
2196
|
+
$[28] !== active ? (t14 = () => {
|
|
2197
|
+
active || setOpen(!1);
|
|
2198
|
+
}, t15 = [active], $[28] = active, $[29] = t14, $[30] = t15) : (t14 = $[29], t15 = $[30]), useEffect(t14, t15);
|
|
2199
|
+
let t16, t17;
|
|
2200
|
+
$[31] !== open ? (t16 = () => {
|
|
2201
|
+
open || setWithinMenu(!1);
|
|
2202
|
+
}, t17 = [open], $[31] = open, $[32] = t16, $[33] = t17) : (t16 = $[32], t17 = $[33]), useEffect(t16, t17);
|
|
2203
|
+
let t18, t19;
|
|
2204
|
+
$[34] !== shouldFocus ? (t18 = () => {
|
|
2205
|
+
if (!shouldFocus)
|
|
2206
|
+
return;
|
|
2207
|
+
const rafId = requestAnimationFrame(() => setShouldFocus(null));
|
|
2208
|
+
return () => cancelAnimationFrame(rafId);
|
|
2209
|
+
}, t19 = [shouldFocus], $[34] = shouldFocus, $[35] = t18, $[36] = t19) : (t18 = $[35], t19 = $[36]), useEffect(t18, t19);
|
|
2210
|
+
let t20;
|
|
2211
|
+
$[37] !== children || $[38] !== handleChildItemClick || $[39] !== handleMenuKeyDown || $[40] !== menuProps || $[41] !== onClickOutside || $[42] !== onEscape || $[43] !== registerElement || $[44] !== shouldFocus ? (t20 = /* @__PURE__ */ jsx(Menu, { ...menuProps, onClickOutside, onEscape, onItemClick: handleChildItemClick, onKeyDown: handleMenuKeyDown, onMouseEnter: handleMenuMouseEnter, registerElement, shouldFocus, children }), $[37] = children, $[38] = handleChildItemClick, $[39] = handleMenuKeyDown, $[40] = menuProps, $[41] = onClickOutside, $[42] = onEscape, $[43] = registerElement, $[44] = shouldFocus, $[45] = t20) : t20 = $[45];
|
|
2212
|
+
const childMenu = t20;
|
|
2213
|
+
let t21;
|
|
2214
|
+
$[46] === Symbol.for("react.memo_cache_sentinel") ? (t21 = (event_2) => {
|
|
2215
|
+
const target = event_2.currentTarget;
|
|
2216
|
+
if (document.activeElement === target && event_2.key === "ArrowRight") {
|
|
2217
|
+
setShouldFocus("first"), setOpen(!0), setWithinMenu(!0);
|
|
2218
|
+
return;
|
|
2219
|
+
}
|
|
2220
|
+
}, $[46] = t21) : t21 = $[46];
|
|
2221
|
+
const handleKeyDown = t21, t22 = as === "button" ? withinMenu : void 0, t23 = as !== "button" ? withinMenu : void 0, t24 = !withinMenu && active ? "" : void 0, t25 = as === "button" ? "button" : void 0, t26 = gap ?? space;
|
|
2222
|
+
let t27;
|
|
2223
|
+
$[47] !== IconComponent || $[48] !== fontSize ? (t27 = IconComponent && /* @__PURE__ */ jsxs(Text, { size: fontSize, children: [
|
|
2224
|
+
isValidElement(IconComponent) && IconComponent,
|
|
2225
|
+
isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
|
|
2226
|
+
] }), $[47] = IconComponent, $[48] = fontSize, $[49] = t27) : t27 = $[49];
|
|
2227
|
+
let t28;
|
|
2228
|
+
$[50] !== fontSize || $[51] !== text2 ? (t28 = /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(Text, { size: fontSize, textOverflow: "ellipsis", weight: "medium", children: text2 }) }), $[50] = fontSize, $[51] = text2, $[52] = t28) : t28 = $[52];
|
|
2229
|
+
let t29;
|
|
2230
|
+
$[53] === Symbol.for("react.memo_cache_sentinel") ? (t29 = /* @__PURE__ */ jsx(ChevronRightIcon, {}), $[53] = t29) : t29 = $[53];
|
|
2231
|
+
let t30;
|
|
2232
|
+
$[54] !== fontSize ? (t30 = /* @__PURE__ */ jsx(Text, { size: fontSize, children: t29 }), $[54] = fontSize, $[55] = t30) : t30 = $[55];
|
|
2233
|
+
let t31;
|
|
2234
|
+
$[56] !== padding || $[57] !== t26 || $[58] !== t27 || $[59] !== t28 || $[60] !== t30 ? (t31 = /* @__PURE__ */ jsxs(Flex, { gap: t26, padding, children: [
|
|
2235
|
+
t27,
|
|
2236
|
+
t28,
|
|
2237
|
+
t30
|
|
2238
|
+
] }), $[56] = padding, $[57] = t26, $[58] = t27, $[59] = t28, $[60] = t30, $[61] = t31) : t31 = $[61];
|
|
2239
|
+
let t32;
|
|
2240
|
+
$[62] !== as || $[63] !== handleClick || $[64] !== handleMouseEnter || $[65] !== radius || $[66] !== rest || $[67] !== t22 || $[68] !== t23 || $[69] !== t24 || $[70] !== t25 || $[71] !== t31 || $[72] !== tone ? (t32 = /* @__PURE__ */ jsx(Selectable, { "data-ui": "MenuGroup", ...rest, "aria-pressed": t22, as, "data-pressed": t23, "data-selected": t24, onClick: handleClick, onKeyDown: handleKeyDown, onMouseEnter: handleMouseEnter, radius, ref: setRootElement, tabIndex: -1, tone, type: t25, children: t31 }), $[62] = as, $[63] = handleClick, $[64] = handleMouseEnter, $[65] = radius, $[66] = rest, $[67] = t22, $[68] = t23, $[69] = t24, $[70] = t25, $[71] = t31, $[72] = tone, $[73] = t32) : t32 = $[73];
|
|
2241
|
+
let t33;
|
|
2242
|
+
return $[74] !== childMenu || $[75] !== open || $[76] !== popover2 || $[77] !== t32 ? (t33 = /* @__PURE__ */ jsx(Popover, { ...popover2, content: childMenu, "data-ui": "MenuGroup__popover", open, children: t32 }), $[74] = childMenu, $[75] = open, $[76] = popover2, $[77] = t32, $[78] = t33) : t33 = $[78], t33;
|
|
2243
|
+
}
|
|
2244
|
+
const DEFAULT_MENU_ITEM_ELEMENT = "button";
|
|
2245
|
+
function MenuItem(props) {
|
|
2246
|
+
const $ = c(75), t0 = props;
|
|
2247
|
+
let IconComponent, IconRightComponent, children, disabled, forwardedRef, gap, gapX, gapY, hotkeys, onClick, paddingBottom, paddingLeft, paddingRight, paddingTop, paddingX, paddingY, pressed, rest, selectedProp, t1, t2, t3, t4, t5, t6, text2;
|
|
2248
|
+
$[0] !== t0 ? ({
|
|
2249
|
+
as: t1,
|
|
2250
|
+
children,
|
|
2251
|
+
disabled,
|
|
2252
|
+
fontSize: t2,
|
|
2253
|
+
gap,
|
|
2254
|
+
gapX,
|
|
2255
|
+
gapY,
|
|
2256
|
+
hotkeys,
|
|
2257
|
+
icon: IconComponent,
|
|
2258
|
+
iconRight: IconRightComponent,
|
|
2259
|
+
onClick,
|
|
2260
|
+
padding: t3,
|
|
2261
|
+
paddingX,
|
|
2262
|
+
paddingY,
|
|
2263
|
+
paddingTop,
|
|
2264
|
+
paddingRight,
|
|
2265
|
+
paddingBottom,
|
|
2266
|
+
paddingLeft,
|
|
2267
|
+
pressed,
|
|
2268
|
+
radius: t4,
|
|
2269
|
+
ref: forwardedRef,
|
|
2270
|
+
selected: selectedProp,
|
|
2271
|
+
space: t5,
|
|
2272
|
+
text: text2,
|
|
2273
|
+
tone: t6,
|
|
2274
|
+
...rest
|
|
2275
|
+
} = t0, $[0] = t0, $[1] = IconComponent, $[2] = IconRightComponent, $[3] = children, $[4] = disabled, $[5] = forwardedRef, $[6] = gap, $[7] = gapX, $[8] = gapY, $[9] = hotkeys, $[10] = onClick, $[11] = paddingBottom, $[12] = paddingLeft, $[13] = paddingRight, $[14] = paddingTop, $[15] = paddingX, $[16] = paddingY, $[17] = pressed, $[18] = rest, $[19] = selectedProp, $[20] = t1, $[21] = t2, $[22] = t3, $[23] = t4, $[24] = t5, $[25] = t6, $[26] = text2) : (IconComponent = $[1], IconRightComponent = $[2], children = $[3], disabled = $[4], forwardedRef = $[5], gap = $[6], gapX = $[7], gapY = $[8], hotkeys = $[9], onClick = $[10], paddingBottom = $[11], paddingLeft = $[12], paddingRight = $[13], paddingTop = $[14], paddingX = $[15], paddingY = $[16], pressed = $[17], rest = $[18], selectedProp = $[19], t1 = $[20], t2 = $[21], t3 = $[22], t4 = $[23], t5 = $[24], t6 = $[25], text2 = $[26]);
|
|
2276
|
+
const as = t1 === void 0 ? DEFAULT_MENU_ITEM_ELEMENT : t1, fontSize = t2 === void 0 ? 1 : t2, padding = t3 === void 0 ? 3 : t3, radius = t4 === void 0 ? 2 : t4, space = t5 === void 0 ? 3 : t5, tone = t6 === void 0 ? "default" : t6, menu2 = useMenu(), {
|
|
2277
|
+
activeElement,
|
|
2278
|
+
mount,
|
|
2279
|
+
onItemClick,
|
|
2280
|
+
onItemMouseEnter: _onItemMouseEnter,
|
|
2281
|
+
onItemMouseLeave: _onItemMouseLeave
|
|
2282
|
+
} = menu2, onItemMouseEnter = _onItemMouseEnter ?? menu2.onMouseEnter, onItemMouseLeave = _onItemMouseLeave ?? menu2.onMouseLeave, [rootElement, setRootElement] = useState(null), active = !!activeElement && activeElement === rootElement, ref = useRef(null);
|
|
2283
|
+
let t7;
|
|
2284
|
+
$[27] === Symbol.for("react.memo_cache_sentinel") ? (t7 = () => ref.current, $[27] = t7) : t7 = $[27], useImperativeHandle(forwardedRef, t7);
|
|
2285
|
+
let t8, t9;
|
|
2286
|
+
$[28] !== mount || $[29] !== rootElement || $[30] !== selectedProp ? (t8 = () => mount(rootElement, selectedProp), t9 = [mount, rootElement, selectedProp], $[28] = mount, $[29] = rootElement, $[30] = selectedProp, $[31] = t8, $[32] = t9) : (t8 = $[31], t9 = $[32]), useEffect(t8, t9);
|
|
2287
|
+
let t10;
|
|
2288
|
+
$[33] !== disabled || $[34] !== onClick || $[35] !== onItemClick ? (t10 = (event) => {
|
|
2289
|
+
disabled || (onClick && onClick(event), onItemClick && onItemClick());
|
|
2290
|
+
}, $[33] = disabled, $[34] = onClick, $[35] = onItemClick, $[36] = t10) : t10 = $[36];
|
|
2291
|
+
const handleClick = t10;
|
|
2292
|
+
let t11, t12;
|
|
2293
|
+
$[37] !== padding || $[38] !== paddingBottom || $[39] !== paddingLeft || $[40] !== paddingRight || $[41] !== paddingTop || $[42] !== paddingX || $[43] !== paddingY ? (t12 = {
|
|
2294
|
+
padding,
|
|
2295
|
+
paddingX,
|
|
2296
|
+
paddingY,
|
|
2297
|
+
paddingTop,
|
|
2298
|
+
paddingRight,
|
|
2299
|
+
paddingBottom,
|
|
2300
|
+
paddingLeft
|
|
2301
|
+
}, $[37] = padding, $[38] = paddingBottom, $[39] = paddingLeft, $[40] = paddingRight, $[41] = paddingTop, $[42] = paddingX, $[43] = paddingY, $[44] = t12) : t12 = $[44], t11 = t12;
|
|
2302
|
+
const paddingProps = t11;
|
|
2303
|
+
let t13;
|
|
2304
|
+
$[45] === Symbol.for("react.memo_cache_sentinel") ? (t13 = (el) => {
|
|
2305
|
+
ref.current = el, setRootElement(el);
|
|
2306
|
+
}, $[45] = t13) : t13 = $[45];
|
|
2307
|
+
const setRef = t13, t14 = pressed ? "" : void 0, t15 = active ? "" : void 0, t16 = disabled ? "" : void 0, t17 = as === "button" ? "button" : void 0;
|
|
2308
|
+
let t18;
|
|
2309
|
+
$[46] !== IconComponent || $[47] !== IconRightComponent || $[48] !== fontSize || $[49] !== gap || $[50] !== gapX || $[51] !== gapY || $[52] !== hotkeys || $[53] !== paddingProps || $[54] !== space || $[55] !== text2 ? (t18 = (IconComponent || text2 || IconRightComponent) && /* @__PURE__ */ jsxs(Flex, { as: "span", gap: gap ?? space, gapX, gapY, align: "center", ...paddingProps, children: [
|
|
2310
|
+
IconComponent && /* @__PURE__ */ jsxs(Text, { muted: !0, size: fontSize, children: [
|
|
2311
|
+
isValidElement(IconComponent) && IconComponent,
|
|
2312
|
+
isValidElementType(IconComponent) && /* @__PURE__ */ jsx(IconComponent, {})
|
|
2313
|
+
] }),
|
|
2314
|
+
text2 && /* @__PURE__ */ jsx(Box, { flex: 1, children: /* @__PURE__ */ jsx(Text, { size: fontSize, textOverflow: "ellipsis", weight: "medium", children: text2 }) }),
|
|
2315
|
+
hotkeys && /* @__PURE__ */ jsx(Hotkeys, { keys: hotkeys, style: {
|
|
2316
|
+
marginTop: -4,
|
|
2317
|
+
marginBottom: -4
|
|
2318
|
+
} }),
|
|
2319
|
+
IconRightComponent && /* @__PURE__ */ jsxs(Text, { muted: !0, size: fontSize, children: [
|
|
2320
|
+
isValidElement(IconRightComponent) && IconRightComponent,
|
|
2321
|
+
isValidElementType(IconRightComponent) && /* @__PURE__ */ jsx(IconRightComponent, {})
|
|
2322
|
+
] })
|
|
2323
|
+
] }), $[46] = IconComponent, $[47] = IconRightComponent, $[48] = fontSize, $[49] = gap, $[50] = gapX, $[51] = gapY, $[52] = hotkeys, $[53] = paddingProps, $[54] = space, $[55] = text2, $[56] = t18) : t18 = $[56];
|
|
2324
|
+
let t19;
|
|
2325
|
+
$[57] !== children || $[58] !== paddingProps ? (t19 = children && /* @__PURE__ */ jsx(Box, { as: "span", ...paddingProps, children }), $[57] = children, $[58] = paddingProps, $[59] = t19) : t19 = $[59];
|
|
2326
|
+
let t20;
|
|
2327
|
+
return $[60] !== as || $[61] !== disabled || $[62] !== handleClick || $[63] !== onItemMouseEnter || $[64] !== onItemMouseLeave || $[65] !== radius || $[66] !== rest || $[67] !== t14 || $[68] !== t15 || $[69] !== t16 || $[70] !== t17 || $[71] !== t18 || $[72] !== t19 || $[73] !== tone ? (t20 = /* @__PURE__ */ jsxs(Selectable, { "data-ui": "MenuItem", ...rest, as, "data-pressed": t14, "data-selected": t15, "data-disabled": t16, radius, disabled, onClick: handleClick, onMouseEnter: onItemMouseEnter, onMouseLeave: onItemMouseLeave, ref: setRef, role: "menuitem", tabIndex: -1, tone, type: t17, children: [
|
|
2328
|
+
t18,
|
|
2329
|
+
t19
|
|
2330
|
+
] }), $[60] = as, $[61] = disabled, $[62] = handleClick, $[63] = onItemMouseEnter, $[64] = onItemMouseLeave, $[65] = radius, $[66] = rest, $[67] = t14, $[68] = t15, $[69] = t16, $[70] = t17, $[71] = t18, $[72] = t19, $[73] = tone, $[74] = t20) : t20 = $[74], t20;
|
|
2331
|
+
}
|
|
2332
|
+
const DEFAULT_TAB_ELEMENT = "button";
|
|
2333
|
+
function Tab(props) {
|
|
2334
|
+
const $ = c(33), t0 = props;
|
|
2335
|
+
let focused, forwardedRef, icon, id, label, onClick, onFocus, rest, selected, t1, t2, t3;
|
|
2336
|
+
$[0] !== t0 ? ({
|
|
2337
|
+
as: t1,
|
|
2338
|
+
icon,
|
|
2339
|
+
id,
|
|
2340
|
+
focused,
|
|
2341
|
+
fontSize: t2,
|
|
2342
|
+
label,
|
|
2343
|
+
onClick,
|
|
2344
|
+
onFocus,
|
|
2345
|
+
padding: t3,
|
|
2346
|
+
ref: forwardedRef,
|
|
2347
|
+
selected,
|
|
2348
|
+
...rest
|
|
2349
|
+
} = t0, $[0] = t0, $[1] = focused, $[2] = forwardedRef, $[3] = icon, $[4] = id, $[5] = label, $[6] = onClick, $[7] = onFocus, $[8] = rest, $[9] = selected, $[10] = t1, $[11] = t2, $[12] = t3) : (focused = $[1], forwardedRef = $[2], icon = $[3], id = $[4], label = $[5], onClick = $[6], onFocus = $[7], rest = $[8], selected = $[9], t1 = $[10], t2 = $[11], t3 = $[12]);
|
|
2350
|
+
const as = t1 === void 0 ? DEFAULT_TAB_ELEMENT : t1, fontSize = t2 === void 0 ? 1 : t2, padding = t3 === void 0 ? 2 : t3, ref = useRef(null), focusedRef = useRef(!1);
|
|
2351
|
+
let t4;
|
|
2352
|
+
$[13] === Symbol.for("react.memo_cache_sentinel") ? (t4 = () => ref.current, $[13] = t4) : t4 = $[13], useImperativeHandle(forwardedRef, t4);
|
|
2353
|
+
let t5;
|
|
2354
|
+
$[14] === Symbol.for("react.memo_cache_sentinel") ? (t5 = () => {
|
|
2355
|
+
focusedRef.current = !1;
|
|
2356
|
+
}, $[14] = t5) : t5 = $[14];
|
|
2357
|
+
const handleBlur = t5;
|
|
2358
|
+
let t6;
|
|
2359
|
+
$[15] !== onFocus ? (t6 = (event) => {
|
|
2360
|
+
focusedRef.current = !0, onFocus && onFocus(event);
|
|
2361
|
+
}, $[15] = onFocus, $[16] = t6) : t6 = $[16];
|
|
2362
|
+
const handleFocus = t6;
|
|
2363
|
+
let t7, t8;
|
|
2364
|
+
$[17] !== focused ? (t7 = () => {
|
|
2365
|
+
focused && !focusedRef.current && (ref.current && ref.current.focus(), focusedRef.current = !0);
|
|
2366
|
+
}, t8 = [focused], $[17] = focused, $[18] = t7, $[19] = t8) : (t7 = $[18], t8 = $[19]), useEffect(t7, t8);
|
|
2367
|
+
const t9 = selected ? "true" : "false", t10 = selected ? 0 : -1;
|
|
2368
|
+
let t11;
|
|
2369
|
+
return $[20] !== as || $[21] !== fontSize || $[22] !== handleFocus || $[23] !== icon || $[24] !== id || $[25] !== label || $[26] !== onClick || $[27] !== padding || $[28] !== rest || $[29] !== selected || $[30] !== t10 || $[31] !== t9 ? (t11 = /* @__PURE__ */ jsx(Button, { "data-ui": "Tab", ...rest, "aria-selected": t9, as, fontSize, icon, id, mode: "bleed", onClick, onBlur: handleBlur, onFocus: handleFocus, padding, ref, role: "tab", selected, tabIndex: t10, text: label, type: "button" }), $[20] = as, $[21] = fontSize, $[22] = handleFocus, $[23] = icon, $[24] = id, $[25] = label, $[26] = onClick, $[27] = padding, $[28] = rest, $[29] = selected, $[30] = t10, $[31] = t9, $[32] = t11) : t11 = $[32], t11;
|
|
2370
|
+
}
|
|
2371
|
+
const DEFAULT_TAB_LIST_ELEMENT = "div";
|
|
2372
|
+
function TabList(props) {
|
|
2373
|
+
const $ = c(21), t0 = props;
|
|
2374
|
+
let childrenProp, rest, t1, t2, t3, t4;
|
|
2375
|
+
$[0] !== t0 ? ({
|
|
2376
|
+
as: t1,
|
|
2377
|
+
children: childrenProp,
|
|
2378
|
+
gap: t2,
|
|
2379
|
+
space: t3,
|
|
2380
|
+
wrap: t4,
|
|
2381
|
+
...rest
|
|
2382
|
+
} = t0, $[0] = t0, $[1] = childrenProp, $[2] = rest, $[3] = t1, $[4] = t2, $[5] = t3, $[6] = t4) : (childrenProp = $[1], rest = $[2], t1 = $[3], t2 = $[4], t3 = $[5], t4 = $[6]);
|
|
2383
|
+
const as = t1 === void 0 ? DEFAULT_TAB_LIST_ELEMENT : t1, gap = t2 === void 0 ? 1 : t2, space = t3 === void 0 ? 1 : t3, wrap = t4 === void 0 ? "nowrap" : t4, [focusedIndex, setFocusedIndex] = useState(-1);
|
|
2384
|
+
let t5;
|
|
2385
|
+
if ($[7] !== childrenProp || $[8] !== focusedIndex) {
|
|
2386
|
+
const children = Children.toArray(childrenProp).filter(_isReactElement);
|
|
2387
|
+
let t62;
|
|
2388
|
+
$[10] !== focusedIndex ? (t62 = (child, childIndex) => cloneElement(child, {
|
|
2389
|
+
focused: focusedIndex === childIndex,
|
|
2390
|
+
key: childIndex,
|
|
2391
|
+
onFocus: () => setFocusedIndex(childIndex)
|
|
2392
|
+
}), $[10] = focusedIndex, $[11] = t62) : t62 = $[11], t5 = children.map(t62), $[7] = childrenProp, $[8] = focusedIndex, $[9] = t5;
|
|
2393
|
+
} else
|
|
2394
|
+
t5 = $[9];
|
|
2395
|
+
const tabs = t5, numTabs = tabs.length;
|
|
2396
|
+
let t6;
|
|
2397
|
+
$[12] !== numTabs ? (t6 = (event) => {
|
|
2398
|
+
event.key === "ArrowLeft" && setFocusedIndex((prevIndex) => (prevIndex + numTabs - 1) % numTabs), event.key === "ArrowRight" && setFocusedIndex((prevIndex_0) => (prevIndex_0 + 1) % numTabs);
|
|
2399
|
+
}, $[12] = numTabs, $[13] = t6) : t6 = $[13];
|
|
2400
|
+
const handleKeyDown = t6, t7 = gap ?? space;
|
|
2401
|
+
let t8;
|
|
2402
|
+
return $[14] !== as || $[15] !== handleKeyDown || $[16] !== rest || $[17] !== t7 || $[18] !== tabs || $[19] !== wrap ? (t8 = /* @__PURE__ */ jsx(Flex, { "data-ui": "TabList", ...rest, as, gap: t7, onKeyDown: handleKeyDown, role: "tablist", wrap, children: tabs }), $[14] = as, $[15] = handleKeyDown, $[16] = rest, $[17] = t7, $[18] = tabs, $[19] = wrap, $[20] = t8) : t8 = $[20], t8;
|
|
2403
|
+
}
|
|
2404
|
+
function _isReactElement(node) {
|
|
2405
|
+
return !!node;
|
|
2406
|
+
}
|
|
2407
|
+
export {
|
|
2408
|
+
AnimatedSpinnerIcon,
|
|
2409
|
+
Arrow,
|
|
2410
|
+
BoundaryElementContext,
|
|
2411
|
+
Box,
|
|
2412
|
+
Button,
|
|
2413
|
+
Card,
|
|
2414
|
+
CardProvider,
|
|
2415
|
+
Code,
|
|
2416
|
+
DEFAULT_ARROW_ELEMENT,
|
|
2417
|
+
DEFAULT_BOX_ELEMENT,
|
|
2418
|
+
DEFAULT_BUTTON_ELEMENT,
|
|
2419
|
+
DEFAULT_CARD_ELEMENT,
|
|
2420
|
+
DEFAULT_CODE_ELEMENT,
|
|
2421
|
+
DEFAULT_ELEMENT_QUERY_ELEMENT,
|
|
2422
|
+
DEFAULT_FLEX_ELEMENT,
|
|
2423
|
+
DEFAULT_GRID_ELEMENT,
|
|
2424
|
+
DEFAULT_HOTKEYS_ELEMENT,
|
|
2425
|
+
DEFAULT_KBD_ELEMENT,
|
|
2426
|
+
DEFAULT_LAYER_ELEMENT,
|
|
2427
|
+
DEFAULT_MENU_DIVIDER_ELEMENT,
|
|
2428
|
+
DEFAULT_MENU_ELEMENT,
|
|
2429
|
+
DEFAULT_MENU_GROUP_ELEMENT,
|
|
2430
|
+
DEFAULT_MENU_ITEM_ELEMENT,
|
|
2431
|
+
DEFAULT_POPOVER_ELEMENT,
|
|
2432
|
+
DEFAULT_SPINNER_ELEMENT,
|
|
2433
|
+
DEFAULT_STACK_ELEMENT,
|
|
2434
|
+
DEFAULT_TAB_ELEMENT,
|
|
2435
|
+
DEFAULT_TAB_LIST_ELEMENT,
|
|
2436
|
+
DEFAULT_TEXT_ELEMENT,
|
|
2437
|
+
DEFAULT_TEXT_INPUT_ELEMENT,
|
|
2438
|
+
DEFAULT_TOOLTIP_ELEMENT,
|
|
2439
|
+
EMPTY_ARRAY,
|
|
2440
|
+
EMPTY_RECORD,
|
|
2441
|
+
ElementQuery,
|
|
2442
|
+
Flex,
|
|
2443
|
+
Grid,
|
|
2444
|
+
Hotkeys,
|
|
2445
|
+
KBD,
|
|
2446
|
+
Layer,
|
|
2447
|
+
LayerProvider,
|
|
2448
|
+
Menu,
|
|
2449
|
+
MenuDivider,
|
|
2450
|
+
MenuGroup,
|
|
2451
|
+
MenuItem,
|
|
2452
|
+
Popover,
|
|
2453
|
+
Portal,
|
|
2454
|
+
PortalProvider,
|
|
2455
|
+
Selectable,
|
|
2456
|
+
Spinner,
|
|
2457
|
+
Stack,
|
|
2458
|
+
Tab,
|
|
2459
|
+
TabList,
|
|
2460
|
+
Text,
|
|
2461
|
+
TextInput,
|
|
2462
|
+
ThemeColorProvider,
|
|
2463
|
+
ThemeProvider,
|
|
2464
|
+
Tooltip,
|
|
2465
|
+
TooltipDelayGroupContext,
|
|
2466
|
+
Z_OFFSETS,
|
|
2467
|
+
_ResizeObserver,
|
|
2468
|
+
_elementSizeObserver,
|
|
2469
|
+
_getArrayProp,
|
|
2470
|
+
_getResponsiveProp,
|
|
2471
|
+
_isEnterToClickElement,
|
|
2472
|
+
containsOrEqualsElement,
|
|
2473
|
+
createGlobalScopedContext,
|
|
2474
|
+
isHTMLAnchorElement,
|
|
2475
|
+
isHTMLButtonElement,
|
|
2476
|
+
isHTMLElement,
|
|
2477
|
+
isHTMLInputElement,
|
|
2478
|
+
isHTMLSelectElement,
|
|
2479
|
+
isHTMLTextAreaElement,
|
|
2480
|
+
isRecord,
|
|
2481
|
+
useBoundaryElement,
|
|
2482
|
+
useCard,
|
|
2483
|
+
useClickOutsideEvent,
|
|
2484
|
+
useCustomValidity,
|
|
2485
|
+
useDelayedState,
|
|
2486
|
+
useElementSize,
|
|
2487
|
+
useGlobalKeyDown,
|
|
2488
|
+
useLayer,
|
|
2489
|
+
useMatchMedia,
|
|
2490
|
+
useMediaIndex,
|
|
2491
|
+
usePortal,
|
|
2492
|
+
usePrefersDark,
|
|
2493
|
+
usePrefersReducedMotion,
|
|
2494
|
+
useResponsiveProp,
|
|
2495
|
+
useRootTheme,
|
|
2496
|
+
useTheme,
|
|
2497
|
+
useTheme_v2,
|
|
2498
|
+
useTooltipDelayGroup
|
|
2499
|
+
};
|
|
2500
|
+
//# sourceMappingURL=_visual-editing.js.map
|