@sanity/ui 4.4.6 → 4.4.8

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.
@@ -1 +1 @@
1
- {"version":3,"file":"button-DnJrhWml.js","names":["<SpinnerIcon className={spinnerIcon} />","<Text data-ui=\"Spinner\" {...props}>\n <SpinnerIcon className={spinnerIcon} />\n </Text>","_c","fontSize = 1","justifyProp = 'center'","mode = 'default'","paddingProp = 3","radiusProp = 2","gap = 3","tone = 'default'","type = 'button'","muted = false","_getArrayProp(justifyProp)","_getArrayProp(paddingProp)","_getArrayProp(paddingXProp)","_getArrayProp(paddingYProp)","_getArrayProp(paddingTopProp)","_getArrayProp(paddingBottomProp)","_getArrayProp(paddingLeftProp)","_getArrayProp(paddingRightProp)","_getArrayProp(radiusProp)","_getArrayProp(gap)","{\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }","useMemo(\n () => ({\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }),\n [padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight],\n )","Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )","(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )","button.textWeight","children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )","<StyledButton\n data-ui=\"Button\"\n {...restProps}\n $mode={mode}\n $radius={radius}\n $tone={tone}\n data-disabled={Boolean(loading || disabled)}\n data-selected={selected ? '' : undefined}\n disabled={Boolean(loading || disabled)}\n ref={ref}\n type={type}\n $width={width}\n >\n {Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )}\n\n {(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )}\n\n {children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )}\n </StyledButton>","Boolean(loading || disabled)","selected ? '' : undefined","_c"],"sources":["../src/core/primitives/spinner/spinner.css.ts","../src/core/primitives/spinner/spinner.tsx","../src/core/primitives/button/styles.ts","../src/core/primitives/button/button.css.ts","../src/core/primitives/button/button.tsx"],"sourcesContent":["import {css, keyframes} from '#styled-system/css'\n\nconst rotate = keyframes({\n from: {transform: 'rotate(0deg)'},\n to: {transform: 'rotate(360deg)'},\n})\n\nconst size = 'round(1em, 2px)'\nexport const spinnerIcon = css({\n animation: `${rotate} 500ms linear infinite`,\n // Prevents a wobbly spinner on Safari\n height: size,\n width: size,\n})\n","import {SpinnerIcon} from '@sanity/icons/Spinner'\n\nimport {Text} from '../text/text'\n\nimport {spinnerIcon} from './spinner.css'\n\n/**\n * @public\n */\nexport interface SpinnerProps {\n muted?: boolean\n size?: number | number[]\n}\n\n/**\n * Indicate that something is loading for an indeterminate amount of time.\n *\n * @public\n */\nexport function Spinner(\n props: SpinnerProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'size'>,\n) {\n return (\n <Text data-ui=\"Spinner\" {...props}>\n <SpinnerIcon className={spinnerIcon} />\n </Text>\n )\n}\n","import {css} from 'styled-components'\n\nimport {ThemeColorCard_v2} from '../../../theme/system/color/color'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_cardColorStyle} from '../../styles/card/_cardColorStyle'\nimport {focusRingBorderStyle, focusRingStyle} from '../../styles/focusRing'\nimport {ThemeProps} from '../../styles/types'\nimport {ButtonMode, ButtonTone} from '../../types/button'\n\nfunction buttonToneColor(\n base: ThemeColorCard_v2,\n {$mode, $tone}: {$mode: ButtonMode; $tone: ButtonTone},\n) {\n const mode = base.button[$mode] || base.button.default\n\n return mode[$tone] || mode.default\n}\n\n/**\n * @internal\n */\nexport function buttonBaseStyles(props: ThemeProps): ReturnType<typeof css> {\n const {button} = getTheme_v2(props.theme)\n const borderBoxShadow = focusRingBorderStyle({\n width: button.border.width,\n color: 'var(--card-border-color)',\n })\n\n return css`\n /* Stays here: Breadcrumbs' expand button overrides it at equal specificity */\n margin: 0;\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n box-shadow: ${borderBoxShadow};\n\n &:not([data-disabled='true']) {\n &:focus:not(:focus-visible) {\n box-shadow: ${borderBoxShadow};\n }\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonColorStyles(\n props: {$mode: ButtonMode; $tone: ButtonTone} & ThemeProps,\n): ReturnType<typeof css> {\n const {color: baseColor} = getTheme_v2(props.theme)\n const color = buttonToneColor(baseColor, props)\n\n return css`\n ${_cardColorStyle(baseColor, color.enabled)}\n\n &:not([data-disabled='true']) {\n @media (hover: hover) {\n &:hover {\n ${_cardColorStyle(baseColor, color.hovered)}\n }\n\n &:active {\n ${_cardColorStyle(baseColor, color.pressed)}\n }\n\n &[data-hovered] {\n ${_cardColorStyle(baseColor, color.hovered)}\n }\n }\n\n &[data-selected] {\n ${_cardColorStyle(baseColor, color.pressed)}\n }\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonDisabledAndFocusStyles(\n props: {$mode: ButtonMode; $tone: ButtonTone} & ThemeProps,\n): ReturnType<typeof css> {\n const {button, color: baseColor} = getTheme_v2(props.theme)\n const color = buttonToneColor(baseColor, props)\n\n return css`\n &:disabled,\n &[data-disabled='true'] {\n ${_cardColorStyle(baseColor, color.disabled)}\n }\n\n &:not([data-disabled='true']):focus {\n box-shadow: ${focusRingStyle({\n base: baseColor,\n border: {width: 2, color: baseColor.bg},\n focusRing: button.focusRing,\n })};\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonStyles(props: ThemeProps): ReturnType<typeof css> {\n const {style} = getTheme_v2(props.theme)\n\n return css`\n ${style?.button?.root}\n `\n}\n","import {css, firstThatWorks} from '#styled-system/css'\n\nexport const buttonRoot = css({\n 'WebkitFontSmoothing': 'inherit',\n 'appearance': 'none',\n 'display': 'inline-flex',\n 'alignItems': 'center',\n 'font': 'inherit',\n 'border': 0,\n 'outline': 'none',\n 'userSelect': 'none',\n 'textDecoration': 'none',\n 'boxSizing': 'border-box',\n 'padding': 0,\n 'whiteSpace': 'nowrap',\n 'textAlign': 'left',\n 'position': 'relative',\n 'verticalAlign': 'top',\n '&::-moz-focus-inner': {\n border: 0,\n padding: 0,\n },\n '& > span': {\n display: 'block',\n flex: 1,\n minWidth: 0,\n borderRadius: 'inherit',\n },\n})\n\nexport const buttonWidthFill = css({\n width: firstThatWorks('stretch', '-webkit-fill-available', '-moz-available'),\n})\n\nexport const buttonLoadingBox = css({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: 'var(--card-bg-color)',\n borderRadius: 'inherit',\n zIndex: 1,\n boxShadow: 'inherit',\n})\n","import {isValidElement, useMemo} from 'react'\nimport {isValidElementType} from 'react-is'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {useTheme_v2} from '../../theme/useTheme'\nimport {ButtonMode, ButtonTextAlign, ButtonTone, ButtonWidth} from '../../types/button'\nimport {ElementType, Props} from '../../types/component'\nimport {FlexJustify} from '../../types/flex'\nimport {Box} from '../box/box'\nimport {Flex} from '../flex/flex'\nimport {Spinner} from '../spinner/spinner'\nimport {Text} from '../text/text'\nimport {ResponsivePaddingProps, ResponsiveRadiusProps} from '../types'\nimport {\n buttonBaseStyles,\n buttonColorStyles,\n buttonDisabledAndFocusStyles,\n buttonStyles,\n} from './styles'\n\nimport {buttonLoadingBox, buttonRoot, buttonWidthFill} from './button.css'\n\n/**\n * @public\n */\nexport interface ButtonOwnProps extends ResponsivePaddingProps, ResponsiveRadiusProps {\n fontSize?: number | number[]\n mode?: ButtonMode\n // oxlint-disable-next-line no-redundant-type-constituents\n icon?: React.ElementType | React.ReactNode\n // oxlint-disable-next-line no-redundant-type-constituents\n iconRight?: React.ElementType | React.ReactNode\n justify?: FlexJustify | FlexJustify[]\n /**\n * @beta Do not use in production, as this might change.\n */\n loading?: boolean\n selected?: boolean\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n gap?: number | number[]\n muted?: boolean\n text?: React.ReactNode\n textAlign?: ButtonTextAlign\n textWeight?: ThemeFontWeightKey\n tone?: ButtonTone\n type?: 'button' | 'reset' | 'submit'\n width?: ButtonWidth\n}\n\n/**\n * @public\n */\nexport type ButtonProps<E extends ElementType = 'button'> = Props<ButtonOwnProps, E>\n\n// The static rules live in `buttonRoot` in styles.css; `width=\"fill\"` is the\n// `buttonWidthFill` class on the last level\nconst ButtonBase = styled.button.attrs({className: buttonRoot})(buttonBaseStyles)\n\nconst ButtonColor = styled(ButtonBase)<{$mode: ButtonMode; $tone: ButtonTone}>(buttonColorStyles)\n\nconst ButtonDisabledAndFocus = styled(ButtonColor)<{$mode: ButtonMode; $tone: ButtonTone}>(\n buttonDisabledAndFocusStyles,\n)\n\nconst StyledButton = styled(ButtonDisabledAndFocus).attrs<{$width?: ButtonWidth}>((props) => ({\n className: props.$width === 'fill' ? buttonWidthFill : undefined,\n}))<{$width?: ButtonWidth} & ResponsiveRadiusStyleProps>(responsiveRadiusStyle, buttonStyles)\n\nfunction ButtonComponent(\n props: ButtonOwnProps & {as?: ElementType} & Omit<\n React.HTMLProps<HTMLButtonElement>,\n 'as' | 'width'\n >,\n) {\n const {\n children,\n disabled,\n ref,\n fontSize = 1,\n icon: IconComponent,\n iconRight: IconRightComponent,\n justify: justifyProp = 'center',\n loading,\n mode = 'default',\n padding: paddingProp = 3,\n paddingX: paddingXProp,\n paddingY: paddingYProp,\n paddingTop: paddingTopProp,\n paddingBottom: paddingBottomProp,\n paddingLeft: paddingLeftProp,\n paddingRight: paddingRightProp,\n radius: radiusProp = 2,\n selected,\n gap = 3,\n text,\n textAlign,\n textWeight,\n tone = 'default',\n type = 'button',\n muted = false,\n width,\n ...restProps\n } = props\n const {button} = useTheme_v2()\n\n const justify = _getArrayProp(justifyProp)\n const padding = _getArrayProp(paddingProp)\n const paddingX = _getArrayProp(paddingXProp)\n const paddingY = _getArrayProp(paddingYProp)\n const paddingTop = _getArrayProp(paddingTopProp)\n const paddingBottom = _getArrayProp(paddingBottomProp)\n const paddingLeft = _getArrayProp(paddingLeftProp)\n const paddingRight = _getArrayProp(paddingRightProp)\n const radius = _getArrayProp(radiusProp)\n const spacing = _getArrayProp(gap)\n\n const boxProps = useMemo(\n () => ({\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }),\n [padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight],\n )\n\n return (\n <StyledButton\n data-ui=\"Button\"\n {...restProps}\n $mode={mode}\n $radius={radius}\n $tone={tone}\n data-disabled={Boolean(loading || disabled)}\n data-selected={selected ? '' : undefined}\n disabled={Boolean(loading || disabled)}\n ref={ref}\n type={type}\n $width={width}\n >\n {Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )}\n\n {(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )}\n\n {children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )}\n </StyledButton>\n )\n}\n\n/**\n * @public\n */\nexport const Button: <E extends ElementType = 'button'>(\n props: ButtonProps<E>,\n) => React.JSX.Element = ButtonComponent\n"],"mappings":"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"}
1
+ {"version":3,"file":"button-DnJrhWml.js","names":["<SpinnerIcon className={spinnerIcon} />","<Text data-ui=\"Spinner\" {...props}>\n <SpinnerIcon className={spinnerIcon} />\n </Text>","_c","fontSize = 1","justifyProp = 'center'","mode = 'default'","paddingProp = 3","radiusProp = 2","gap = 3","tone = 'default'","type = 'button'","muted = false","_getArrayProp(justifyProp)","_getArrayProp(paddingProp)","_getArrayProp(paddingXProp)","_getArrayProp(paddingYProp)","_getArrayProp(paddingTopProp)","_getArrayProp(paddingBottomProp)","_getArrayProp(paddingLeftProp)","_getArrayProp(paddingRightProp)","_getArrayProp(radiusProp)","_getArrayProp(gap)","{\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }","useMemo(\n () => ({\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }),\n [padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight],\n )","Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )","(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )","button.textWeight","children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )","<StyledButton\n data-ui=\"Button\"\n {...restProps}\n $mode={mode}\n $radius={radius}\n $tone={tone}\n data-disabled={Boolean(loading || disabled)}\n data-selected={selected ? '' : undefined}\n disabled={Boolean(loading || disabled)}\n ref={ref}\n type={type}\n $width={width}\n >\n {Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )}\n\n {(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )}\n\n {children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )}\n </StyledButton>","Boolean(loading || disabled)","selected ? '' : undefined","_c"],"sources":["../src/core/primitives/spinner/spinner.css.ts","../src/core/primitives/spinner/spinner.tsx","../src/core/primitives/button/styles.ts","../src/core/primitives/button/button.css.ts","../src/core/primitives/button/button.tsx"],"sourcesContent":["import {css, keyframes} from '#styled-system/css'\n\nconst rotate = keyframes({\n from: {transform: 'rotate(0deg)'},\n to: {transform: 'rotate(360deg)'},\n})\n\nconst size = 'round(1em, 2px)'\nexport const spinnerIcon = css({\n animation: `${rotate} 500ms linear infinite`,\n // Prevents a wobbly spinner on Safari\n height: size,\n width: size,\n})\n","import {SpinnerIcon} from '@sanity/icons/Spinner'\n\nimport {Text} from '../text/text'\n\nimport {spinnerIcon} from './spinner.css'\n\n/**\n * @public\n */\nexport interface SpinnerProps {\n muted?: boolean\n size?: number | number[]\n}\n\n/**\n * Indicate that something is loading for an indeterminate amount of time.\n *\n * @public\n */\nexport function Spinner(\n props: SpinnerProps & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'size'>,\n) {\n return (\n <Text data-ui=\"Spinner\" {...props}>\n <SpinnerIcon className={spinnerIcon} />\n </Text>\n )\n}\n","import {css} from 'styled-components'\n\nimport {ThemeColorCard_v2} from '../../../theme/system/color/color'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_cardColorStyle} from '../../styles/card/_cardColorStyle'\nimport {focusRingBorderStyle, focusRingStyle} from '../../styles/focusRing'\nimport {ThemeProps} from '../../styles/types'\nimport {ButtonMode, ButtonTone} from '../../types/button'\n\nfunction buttonToneColor(\n base: ThemeColorCard_v2,\n {$mode, $tone}: {$mode: ButtonMode; $tone: ButtonTone},\n) {\n const mode = base.button[$mode] || base.button.default\n\n return mode[$tone] || mode.default\n}\n\n/**\n * @internal\n */\nexport function buttonBaseStyles(props: ThemeProps): ReturnType<typeof css> {\n const {button} = getTheme_v2(props.theme)\n const borderBoxShadow = focusRingBorderStyle({\n width: button.border.width,\n color: 'var(--card-border-color)',\n })\n\n return css`\n /* Stays here: Breadcrumbs' expand button overrides it at equal specificity */\n margin: 0;\n background-color: var(--card-bg-color);\n color: var(--card-fg-color);\n box-shadow: ${borderBoxShadow};\n\n &:not([data-disabled='true']) {\n &:focus:not(:focus-visible) {\n box-shadow: ${borderBoxShadow};\n }\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonColorStyles(\n props: {$mode: ButtonMode; $tone: ButtonTone} & ThemeProps,\n): ReturnType<typeof css> {\n const {color: baseColor} = getTheme_v2(props.theme)\n const color = buttonToneColor(baseColor, props)\n\n return css`\n ${_cardColorStyle(baseColor, color.enabled)}\n\n &:not([data-disabled='true']) {\n @media (hover: hover) {\n &:hover {\n ${_cardColorStyle(baseColor, color.hovered)}\n }\n\n &:active {\n ${_cardColorStyle(baseColor, color.pressed)}\n }\n\n &[data-hovered] {\n ${_cardColorStyle(baseColor, color.hovered)}\n }\n }\n\n &[data-selected] {\n ${_cardColorStyle(baseColor, color.pressed)}\n }\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonDisabledAndFocusStyles(\n props: {$mode: ButtonMode; $tone: ButtonTone} & ThemeProps,\n): ReturnType<typeof css> {\n const {button, color: baseColor} = getTheme_v2(props.theme)\n const color = buttonToneColor(baseColor, props)\n\n return css`\n &:disabled,\n &[data-disabled='true'] {\n ${_cardColorStyle(baseColor, color.disabled)}\n }\n\n &:not([data-disabled='true']):focus {\n box-shadow: ${focusRingStyle({\n base: baseColor,\n border: {width: 2, color: baseColor.bg},\n focusRing: button.focusRing,\n })};\n }\n `\n}\n\n/**\n * @internal\n */\nexport function buttonStyles(props: ThemeProps): ReturnType<typeof css> {\n const {style} = getTheme_v2(props.theme)\n\n return css`\n ${style?.button?.root}\n `\n}\n","import {css, firstThatWorks} from '#styled-system/css'\n\nexport const buttonRoot = css({\n 'WebkitFontSmoothing': 'inherit',\n 'appearance': 'none',\n 'display': 'inline-flex',\n 'alignItems': 'center',\n 'font': 'inherit',\n 'border': 0,\n 'outline': 'none',\n 'userSelect': 'none',\n 'textDecoration': 'none',\n 'boxSizing': 'border-box',\n 'padding': 0,\n 'whiteSpace': 'nowrap',\n 'textAlign': 'left',\n 'position': 'relative',\n 'verticalAlign': 'top',\n '&::-moz-focus-inner': {\n border: 0,\n padding: 0,\n },\n '& > span': {\n display: 'block',\n flex: 1,\n minWidth: 0,\n borderRadius: 'inherit',\n },\n})\n\nexport const buttonWidthFill = css({\n width: firstThatWorks('stretch', '-webkit-fill-available', '-moz-available'),\n})\n\nexport const buttonLoadingBox = css({\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: 'var(--card-bg-color)',\n borderRadius: 'inherit',\n zIndex: 1,\n boxShadow: 'inherit',\n})\n","import {isValidElement, useMemo} from 'react'\nimport {isValidElementType} from 'react-is'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {useTheme_v2} from '../../theme/useTheme'\nimport {ButtonMode, ButtonTextAlign, ButtonTone, ButtonWidth} from '../../types/button'\nimport {ElementType, Props} from '../../types/component'\nimport {FlexJustify} from '../../types/flex'\nimport {Box} from '../box/box'\nimport {Flex} from '../flex/flex'\nimport {Spinner} from '../spinner/spinner'\nimport {Text} from '../text/text'\nimport {ResponsivePaddingProps, ResponsiveRadiusProps} from '../types'\nimport {\n buttonBaseStyles,\n buttonColorStyles,\n buttonDisabledAndFocusStyles,\n buttonStyles,\n} from './styles'\n\nimport {buttonLoadingBox, buttonRoot, buttonWidthFill} from './button.css'\n\n/**\n * @public\n */\nexport interface ButtonOwnProps extends ResponsivePaddingProps, ResponsiveRadiusProps {\n fontSize?: number | number[]\n mode?: ButtonMode\n // oxlint-disable-next-line no-redundant-type-constituents\n icon?: React.ElementType | React.ReactNode\n // oxlint-disable-next-line no-redundant-type-constituents\n iconRight?: React.ElementType | React.ReactNode\n justify?: FlexJustify | FlexJustify[]\n /**\n * @beta Do not use in production, as this might change.\n */\n loading?: boolean\n selected?: boolean\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n gap?: number | number[]\n muted?: boolean\n text?: React.ReactNode\n textAlign?: ButtonTextAlign\n textWeight?: ThemeFontWeightKey\n tone?: ButtonTone\n type?: 'button' | 'reset' | 'submit'\n width?: ButtonWidth\n}\n\n/**\n * @public\n */\nexport type ButtonProps<E extends ElementType = 'button'> = Props<ButtonOwnProps, E>\n\n// The static rules live in `buttonRoot` in styles.css; `width=\"fill\"` is the\n// `buttonWidthFill` class on the last level\nconst ButtonBase = styled.button.attrs({className: buttonRoot})(buttonBaseStyles)\n\nconst ButtonColor = styled(ButtonBase)<{$mode: ButtonMode; $tone: ButtonTone}>(buttonColorStyles)\n\nconst ButtonDisabledAndFocus = styled(ButtonColor)<{$mode: ButtonMode; $tone: ButtonTone}>(\n buttonDisabledAndFocusStyles,\n)\n\nconst StyledButton = styled(ButtonDisabledAndFocus).attrs<{$width?: ButtonWidth}>((props) => ({\n className: props.$width === 'fill' ? buttonWidthFill : undefined,\n}))<{$width?: ButtonWidth} & ResponsiveRadiusStyleProps>(responsiveRadiusStyle, buttonStyles)\n\nfunction ButtonComponent(\n props: ButtonOwnProps & {as?: ElementType} & Omit<\n React.HTMLProps<HTMLButtonElement>,\n 'as' | 'width'\n >,\n) {\n const {\n children,\n disabled,\n ref,\n fontSize = 1,\n icon: IconComponent,\n iconRight: IconRightComponent,\n justify: justifyProp = 'center',\n loading,\n mode = 'default',\n padding: paddingProp = 3,\n paddingX: paddingXProp,\n paddingY: paddingYProp,\n paddingTop: paddingTopProp,\n paddingBottom: paddingBottomProp,\n paddingLeft: paddingLeftProp,\n paddingRight: paddingRightProp,\n radius: radiusProp = 2,\n selected,\n gap = 3,\n text,\n textAlign,\n textWeight,\n tone = 'default',\n type = 'button',\n muted = false,\n width,\n ...restProps\n } = props\n const {button} = useTheme_v2()\n\n const justify = _getArrayProp(justifyProp)\n const padding = _getArrayProp(paddingProp)\n const paddingX = _getArrayProp(paddingXProp)\n const paddingY = _getArrayProp(paddingYProp)\n const paddingTop = _getArrayProp(paddingTopProp)\n const paddingBottom = _getArrayProp(paddingBottomProp)\n const paddingLeft = _getArrayProp(paddingLeftProp)\n const paddingRight = _getArrayProp(paddingRightProp)\n const radius = _getArrayProp(radiusProp)\n const spacing = _getArrayProp(gap)\n\n const boxProps = useMemo(\n () => ({\n // flex: 1,\n padding,\n paddingX,\n paddingY,\n paddingTop,\n paddingBottom,\n paddingLeft,\n paddingRight,\n }),\n [padding, paddingX, paddingY, paddingTop, paddingBottom, paddingLeft, paddingRight],\n )\n\n return (\n <StyledButton\n data-ui=\"Button\"\n {...restProps}\n $mode={mode}\n $radius={radius}\n $tone={tone}\n data-disabled={Boolean(loading || disabled)}\n data-selected={selected ? '' : undefined}\n disabled={Boolean(loading || disabled)}\n ref={ref}\n type={type}\n $width={width}\n >\n {Boolean(loading) && (\n <div className={buttonLoadingBox} data-ui=\"ButtonLoading\">\n <Spinner />\n </div>\n )}\n\n {(IconComponent || text || IconRightComponent) && (\n <Box as=\"span\" {...boxProps}>\n <Flex as=\"span\" justify={justify} gap={spacing}>\n {IconComponent && (\n <Text size={fontSize}>\n {isValidElement(IconComponent) && IconComponent}\n {isValidElementType(IconComponent) && <IconComponent />}\n </Text>\n )}\n\n {text && (\n <Box>\n <Text\n muted={muted}\n align={textAlign}\n size={fontSize}\n textOverflow=\"ellipsis\"\n weight={textWeight ?? button.textWeight}\n >\n {text}\n </Text>\n </Box>\n )}\n\n {IconRightComponent && (\n <Text size={fontSize}>\n {isValidElement(IconRightComponent) && IconRightComponent}\n {isValidElementType(IconRightComponent) && <IconRightComponent />}\n </Text>\n )}\n </Flex>\n </Box>\n )}\n\n {children && (\n <Box as=\"span\" {...boxProps}>\n {children}\n </Box>\n )}\n </StyledButton>\n )\n}\n\n/**\n * @public\n */\nexport const Button: <E extends ElementType = 'button'>(\n props: ButtonProps<E>,\n) => React.JSX.Element = ButtonComponent\n"],"mappings":"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"}
package/dist/code.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"code.js","names":["size = 2","_getArrayProp(size)","<code>{children}</code>","<LazyRefractor language={language} value={children} />","<Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>","<StyledCode\n data-ui=\"Code\"\n {...restProps}\n $size={_getArrayProp(size)}\n // oxlint-disable-next-line no-unsafe-type-assertion -- `weight` is typed as `string` in the public API; unknown weights fall back to `regular` at runtime\n $weight={weight as ThemeFontWeightKey | undefined}\n ref={ref}\n >\n <Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>\n </StyledCode>","weight as ThemeFontWeightKey | undefined","_c"],"sources":["../src/core/primitives/code/styles.ts","../src/core/primitives/code/code.tsx"],"sourcesContent":["import {css, ExecutionContext} from 'styled-components'\n\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_fontBase} from '../../styles/font/responsiveFont'\nimport {ThemeProps} from '../../styles/types'\n\nfunction codeSyntaxHighlightingStyle({theme}: ExecutionContext) {\n const {\n color: {syntax: color},\n } = getTheme_v2(theme)\n\n return {\n '&.atrule': {color: color.atrule},\n '&.attr-name': {color: color.attrName},\n '&.attr-value': {color: color.attrValue},\n '&.attribute': {color: color.attribute},\n '&.boolean': {color: color.boolean},\n '&.builtin': {color: color.builtin},\n '&.cdata': {color: color.cdata},\n '&.char': {color: color.char},\n '&.class': {color: color.class},\n '&.class-name': {color: color.className},\n '&.comment': {color: color.comment},\n '&.constant': {color: color.constant},\n '&.deleted': {color: color.deleted},\n '&.doctype': {color: color.doctype},\n '&.entity': {color: color.entity},\n '&.function': {color: color.function},\n '&.hexcode': {color: color.hexcode},\n '&.id': {color: color.id},\n '&.important': {color: color.important},\n '&.inserted': {color: color.inserted},\n '&.keyword': {color: color.keyword},\n '&.number': {color: color.number},\n '&.operator': {color: color.operator},\n '&.prolog': {color: color.prolog},\n '&.property': {color: color.property},\n '&.pseudo-class': {color: color.pseudoClass},\n '&.pseudo-element': {color: color.pseudoElement},\n '&.punctuation': {color: color.punctuation},\n '&.regex': {color: color.regex},\n '&.selector': {color: color.selector},\n '&.string': {color: color.string},\n '&.symbol': {color: color.symbol},\n '&.tag': {color: color.tag},\n '&.unit': {color: color.unit},\n '&.url': {color: color.url},\n '&.variable': {color: color.variable},\n }\n}\n\nexport function codeBaseStyle(props: ThemeProps): ReturnType<typeof css> {\n return css`\n color: var(--card-code-fg-color);\n\n & code {\n font-family: inherit;\n }\n\n & a {\n color: inherit;\n text-decoration: underline;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n /* ...and aren't squeezed by resets that set max-width: 100% */\n max-width: unset;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n\n ${_fontBase('code', props)}\n `\n}\n\nexport const codeSyntaxStyle = css`\n & code.refractor .token {\n ${codeSyntaxHighlightingStyle}\n }\n`\n","import {lazy, Suspense} from 'react'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {_fontWeight, _responsiveFontSize} from '../../styles/font/responsiveFont'\nimport {FontWeightStyleProps, ResponsiveFontSizeStyleProps} from '../../styles/font/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {codeBaseStyle, codeSyntaxStyle} from './styles'\n\nconst LazyRefractor = lazy(() => import('./refractor'))\n\n/**\n * @public\n */\nexport interface CodeOwnProps {\n /** Define the language to use for syntax highlighting. */\n language?: string\n size?: number | number[]\n weight?: string\n}\n\n/**\n * @public\n */\nexport type CodeProps<E extends ElementType = 'pre'> = Props<CodeOwnProps, E>\n\nconst CodeBase = styled.pre(codeBaseStyle)\n\nconst CodeSyntax = styled(CodeBase)`\n ${codeSyntaxStyle}\n`\n\nconst StyledCode = styled(CodeSyntax)<FontWeightStyleProps & ResponsiveFontSizeStyleProps>(\n (props) => _fontWeight('code', props),\n (props) => _responsiveFontSize('code', props),\n)\n\nfunction CodeComponent(\n props: CodeOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLPreElement>, 'as' | 'size'>,\n) {\n const {children, language, ref, size = 2, weight, ...restProps} = props\n\n return (\n <StyledCode\n data-ui=\"Code\"\n {...restProps}\n $size={_getArrayProp(size)}\n // oxlint-disable-next-line no-unsafe-type-assertion -- `weight` is typed as `string` in the public API; unknown weights fall back to `regular` at runtime\n $weight={weight as ThemeFontWeightKey | undefined}\n ref={ref}\n >\n <Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>\n </StyledCode>\n )\n}\n\n/**\n * @public\n */\nexport const Code: <E extends ElementType = 'pre'>(props: CodeProps<E>) => React.JSX.Element =\n CodeComponent\n"],"mappings":"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"}
1
+ {"version":3,"file":"code.js","names":["size = 2","_getArrayProp(size)","<code>{children}</code>","<LazyRefractor language={language} value={children} />","<Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>","<StyledCode\n data-ui=\"Code\"\n {...restProps}\n $size={_getArrayProp(size)}\n // oxlint-disable-next-line no-unsafe-type-assertion -- `weight` is typed as `string` in the public API; unknown weights fall back to `regular` at runtime\n $weight={weight as ThemeFontWeightKey | undefined}\n ref={ref}\n >\n <Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>\n </StyledCode>","weight as ThemeFontWeightKey | undefined","_c"],"sources":["../src/core/primitives/code/styles.ts","../src/core/primitives/code/code.tsx"],"sourcesContent":["import {css, ExecutionContext} from 'styled-components'\n\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_fontBase} from '../../styles/font/responsiveFont'\nimport {ThemeProps} from '../../styles/types'\n\nfunction codeSyntaxHighlightingStyle({theme}: ExecutionContext) {\n const {\n color: {syntax: color},\n } = getTheme_v2(theme)\n\n return {\n '&.atrule': {color: color.atrule},\n '&.attr-name': {color: color.attrName},\n '&.attr-value': {color: color.attrValue},\n '&.attribute': {color: color.attribute},\n '&.boolean': {color: color.boolean},\n '&.builtin': {color: color.builtin},\n '&.cdata': {color: color.cdata},\n '&.char': {color: color.char},\n '&.class': {color: color.class},\n '&.class-name': {color: color.className},\n '&.comment': {color: color.comment},\n '&.constant': {color: color.constant},\n '&.deleted': {color: color.deleted},\n '&.doctype': {color: color.doctype},\n '&.entity': {color: color.entity},\n '&.function': {color: color.function},\n '&.hexcode': {color: color.hexcode},\n '&.id': {color: color.id},\n '&.important': {color: color.important},\n '&.inserted': {color: color.inserted},\n '&.keyword': {color: color.keyword},\n '&.number': {color: color.number},\n '&.operator': {color: color.operator},\n '&.prolog': {color: color.prolog},\n '&.property': {color: color.property},\n '&.pseudo-class': {color: color.pseudoClass},\n '&.pseudo-element': {color: color.pseudoElement},\n '&.punctuation': {color: color.punctuation},\n '&.regex': {color: color.regex},\n '&.selector': {color: color.selector},\n '&.string': {color: color.string},\n '&.symbol': {color: color.symbol},\n '&.tag': {color: color.tag},\n '&.unit': {color: color.unit},\n '&.url': {color: color.url},\n '&.variable': {color: color.variable},\n }\n}\n\nexport function codeBaseStyle(props: ThemeProps): ReturnType<typeof css> {\n return css`\n color: var(--card-code-fg-color);\n\n & code {\n font-family: inherit;\n }\n\n & a {\n color: inherit;\n text-decoration: underline;\n border-radius: 1px;\n }\n\n & svg {\n /* Certain popular CSS libraries changes the defaults for SVG display */\n /* Make sure SVGs are rendered as inline elements */\n display: inline;\n /* ...and aren't squeezed by resets that set max-width: 100% */\n max-width: unset;\n }\n\n & [data-sanity-icon] {\n vertical-align: baseline;\n }\n\n ${_fontBase('code', props)}\n `\n}\n\nexport const codeSyntaxStyle = css`\n & code.refractor .token {\n ${codeSyntaxHighlightingStyle}\n }\n`\n","import {lazy, Suspense} from 'react'\nimport {styled} from 'styled-components'\n\nimport {ThemeFontWeightKey} from '../../../theme/system/font'\nimport {_fontWeight, _responsiveFontSize} from '../../styles/font/responsiveFont'\nimport {FontWeightStyleProps, ResponsiveFontSizeStyleProps} from '../../styles/font/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {codeBaseStyle, codeSyntaxStyle} from './styles'\n\nconst LazyRefractor = lazy(() => import('./refractor'))\n\n/**\n * @public\n */\nexport interface CodeOwnProps {\n /** Define the language to use for syntax highlighting. */\n language?: string\n size?: number | number[]\n weight?: string\n}\n\n/**\n * @public\n */\nexport type CodeProps<E extends ElementType = 'pre'> = Props<CodeOwnProps, E>\n\nconst CodeBase = styled.pre(codeBaseStyle)\n\nconst CodeSyntax = styled(CodeBase)`\n ${codeSyntaxStyle}\n`\n\nconst StyledCode = styled(CodeSyntax)<FontWeightStyleProps & ResponsiveFontSizeStyleProps>(\n (props) => _fontWeight('code', props),\n (props) => _responsiveFontSize('code', props),\n)\n\nfunction CodeComponent(\n props: CodeOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLPreElement>, 'as' | 'size'>,\n) {\n const {children, language, ref, size = 2, weight, ...restProps} = props\n\n return (\n <StyledCode\n data-ui=\"Code\"\n {...restProps}\n $size={_getArrayProp(size)}\n // oxlint-disable-next-line no-unsafe-type-assertion -- `weight` is typed as `string` in the public API; unknown weights fall back to `regular` at runtime\n $weight={weight as ThemeFontWeightKey | undefined}\n ref={ref}\n >\n <Suspense fallback={<code>{children}</code>}>\n <LazyRefractor language={language} value={children} />\n </Suspense>\n </StyledCode>\n )\n}\n\n/**\n * @public\n */\nexport const Code: <E extends ElementType = 'pre'>(props: CodeProps<E>) => React.JSX.Element =\n CodeComponent\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"flex-ohP2jG9d.js","names":["direction = 'row'","_getArrayProp(align)","_getArrayProp(direction)","_getArrayProp(gap)","_getArrayProp(justify)","_getArrayProp(wrap)","<StyledFlex\n data-ui=\"Flex\"\n {...restProps}\n $align={_getArrayProp(align)}\n $direction={_getArrayProp(direction)}\n $gap={_getArrayProp(gap)}\n $justify={_getArrayProp(justify)}\n $wrap={_getArrayProp(wrap)}\n forwardedAs={as}\n ref={ref}\n />","_c"],"sources":["../src/core/styles/flex/flexStyle.ts","../src/core/primitives/flex/flex.tsx"],"sourcesContent":["import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, _ruleSet, rem} from '../helpers'\nimport {ThemeProps} from '../types'\nimport {ResponsiveFlexStyleProps} from './types'\n\nconst BASE_STYLE: CSSObject = {\n '&&:not([hidden])': {\n display: 'flex',\n },\n}\n\nconst RULES = _ruleSet(\n BASE_STYLE,\n responsiveFlexAlignStyle,\n responsiveFlexGapStyle,\n responsiveFlexWrapStyle,\n responsiveFlexJustifyStyle,\n responsiveFlexDirectionStyle,\n)\n\nexport function responsiveFlexStyle(): CSSObject[] {\n return RULES\n}\n\nfunction responsiveFlexAlignStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$align, (align) => {\n return {alignItems: align}\n })\n}\n\nfunction responsiveFlexGapStyle(props: ResponsiveFlexStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gap, (gap) => ({\n gap: gap ? rem(space[gap]) : undefined,\n }))\n}\n\nfunction responsiveFlexWrapStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$wrap, (wrap) => {\n return {flexWrap: wrap}\n })\n}\n\nfunction responsiveFlexJustifyStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$justify, (justify) => {\n return {justifyContent: justify}\n })\n}\n\nfunction responsiveFlexDirectionStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$direction, (direction) => {\n return {flexDirection: direction}\n })\n}\n","import {styled} from 'styled-components'\n\nimport {flexItemStyle} from '../../styles/flex/flexItemStyle'\nimport {responsiveFlexStyle} from '../../styles/flex/flexStyle'\nimport {FlexItemStyleProps, ResponsiveFlexStyleProps} from '../../styles/flex/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {ResponsiveFlexItemProps, ResponsiveFlexProps} from '../types'\n\n/**\n * @public\n */\nexport interface FlexOwnProps\n extends Omit<BoxOwnProps, 'display'>, ResponsiveFlexProps, ResponsiveFlexItemProps {\n gap?: number | number[]\n}\n\n/**\n * @public\n */\nexport type FlexProps<E extends ElementType = 'div'> = Props<FlexOwnProps, E>\n\nconst StyledFlex = styled(Box)<FlexItemStyleProps & ResponsiveFlexStyleProps>(\n flexItemStyle,\n responsiveFlexStyle,\n)\n\nfunction FlexComponent(\n props: FlexOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'wrap'>,\n) {\n const {align, as, direction = 'row', gap, justify, ref, wrap, ...restProps} = props\n\n return (\n <StyledFlex\n data-ui=\"Flex\"\n {...restProps}\n $align={_getArrayProp(align)}\n $direction={_getArrayProp(direction)}\n $gap={_getArrayProp(gap)}\n $justify={_getArrayProp(justify)}\n $wrap={_getArrayProp(wrap)}\n forwardedAs={as}\n ref={ref}\n />\n )\n}\n\n/**\n * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).\n *\n * @public\n */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Flex = FlexComponent as unknown as <E extends ElementType = 'div'>(\n props: FlexProps<E>,\n) => React.JSX.Element\n"],"mappings":";;;;;;AAYA,MAAM,QAAQ,SACZ,EANA,oBAAoB,EAClB,SAAS,OACX,EAIA,GACA,0BACA,wBACA,yBACA,4BACA,4BACF;AAEA,SAAgB,sBAAmC;CACjD,OAAO;AACT;AAEA,SAAS,yBAAyB,OAA2D;CAC3F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,SAAS,WAChC,EAAC,YAAY,MAAK,EAC1B;AACH;AAEA,SAAS,uBAAuB,OAA8C;CAC5E,IAAM,EAAC,OAAO,UAAS,YAAY,MAAM,KAAK;CAE9C,OAAO,YAAY,OAAO,MAAM,OAAO,SAAS,EAC9C,KAAK,MAAM,IAAI,MAAM,IAAI,IAAI,KAAA,EAC/B,EAAE;AACJ;AAEA,SAAS,wBAAwB,OAA2D;CAC1F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,QAAQ,UAC/B,EAAC,UAAU,KAAI,EACvB;AACH;AAEA,SAAS,2BAA2B,OAA2D;CAC7F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,WAAW,aAClC,EAAC,gBAAgB,QAAO,EAChC;AACH;AAEA,SAAS,6BAA6B,OAA2D;CAC/F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,aAAa,eACpC,EAAC,eAAe,UAAS,EACjC;AACH;ACxCA,MAAM,aAAa,uBAAO,GAAG,CAAC,CAAA,WAAA;;;AAC5B,CAAA,CAAA,CAAA,eACA,mBACF;AAEA,SAAS,cACP,OACA;gBACO,OAAO,IAAuB,KAAK,SAAS,KAAc,WAA/CA,IAAsC;CAAsB,AAAA,EAAA,OAAA,uHAAxE,CAAC,OAAO,IAAI,WAAA,IAAmB,KAAK,SAAS,KAAK,MAAM,GAAA,aAAgB;CAA5D,IAAA,YAAA,OAAA,KAAA,IAAY,QAAZA,IAMNC;CAAc,AAAA,EAAA,OAAA,sBAAd,KAAA,cAAc,KAAK,GAAL,EAAA,KAAA;CACVC,IAAAA;CAAc,AAAA,EAAA,QAAA,0BAAd,KAAA,cAAc,SAAS,GAAT,EAAA,MAAA;CACpBC,IAAAA;CAAc,AAAA,EAAA,QAAA,oBAAd,KAAA,cAAc,GAAG,GAAH,EAAA,MAAA;CACVC,IAAAA;CAAc,AAAA,EAAA,QAAA,wBAAd,KAAA,cAAc,OAAO,GAAP,EAAA,MAAA;CACjBC,IAAAA;CAAc,AAAA,EAAA,QAAA,qBAAd,KAAA,cAAc,IAAI,GAAJ,EAAA,MAAA;CAPvBC,IAAAA;CADF,OASiB,EAAA,QAAA,MAAA,EAAA,QACR,OAAA,EAAA,QAPD,aAAA,EAAA,QACIL,MAAAA,EAAAA,QACIC,MAAAA,EAAAA,QACNC,MAAAA,EAAAA,QACIC,MAAAA,EAAAA,QACHC,MAPT,KAAA,oBAAC,YAAD;EACE,WAAQ;EACR,GAAI;EACJ,QAAQJ;EACR,YAAYC;EACZ,MAAMC;EACN,UAAUC;EACV,OAAOC;EACP,aAAa;EACR;CACN,CAAA,GAFc,EAAA,MAAA,IACR,EAAA,MAAA,KAPD,EAAA,MAAA,WACIJ,EAAAA,MAAAA,IACIC,EAAAA,MAAAA,IACNC,EAAAA,MAAAA,IACIC,EAAAA,MAAAA,IACHC,EAAAA,MAAAA,8BAPTC;AAYJ;;;;;;AAQA,MAAa,OAAO"}
1
+ {"version":3,"file":"flex-ohP2jG9d.js","names":["direction = 'row'","_getArrayProp(align)","_getArrayProp(direction)","_getArrayProp(gap)","_getArrayProp(justify)","_getArrayProp(wrap)","<StyledFlex\n data-ui=\"Flex\"\n {...restProps}\n $align={_getArrayProp(align)}\n $direction={_getArrayProp(direction)}\n $gap={_getArrayProp(gap)}\n $justify={_getArrayProp(justify)}\n $wrap={_getArrayProp(wrap)}\n forwardedAs={as}\n ref={ref}\n />","_c"],"sources":["../src/core/styles/flex/flexStyle.ts","../src/core/primitives/flex/flex.tsx"],"sourcesContent":["import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, _ruleSet, rem} from '../helpers'\nimport {ThemeProps} from '../types'\nimport {ResponsiveFlexStyleProps} from './types'\n\nconst BASE_STYLE: CSSObject = {\n '&&:not([hidden])': {\n display: 'flex',\n },\n}\n\nconst RULES = _ruleSet(\n BASE_STYLE,\n responsiveFlexAlignStyle,\n responsiveFlexGapStyle,\n responsiveFlexWrapStyle,\n responsiveFlexJustifyStyle,\n responsiveFlexDirectionStyle,\n)\n\nexport function responsiveFlexStyle(): CSSObject[] {\n return RULES\n}\n\nfunction responsiveFlexAlignStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$align, (align) => {\n return {alignItems: align}\n })\n}\n\nfunction responsiveFlexGapStyle(props: ResponsiveFlexStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gap, (gap) => ({\n gap: gap ? rem(space[gap]) : undefined,\n }))\n}\n\nfunction responsiveFlexWrapStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$wrap, (wrap) => {\n return {flexWrap: wrap}\n })\n}\n\nfunction responsiveFlexJustifyStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$justify, (justify) => {\n return {justifyContent: justify}\n })\n}\n\nfunction responsiveFlexDirectionStyle(props: ResponsiveFlexStyleProps & ThemeProps): CSSObject[] {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$direction, (direction) => {\n return {flexDirection: direction}\n })\n}\n","import {styled} from 'styled-components'\n\nimport {flexItemStyle} from '../../styles/flex/flexItemStyle'\nimport {responsiveFlexStyle} from '../../styles/flex/flexStyle'\nimport {FlexItemStyleProps, ResponsiveFlexStyleProps} from '../../styles/flex/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {ResponsiveFlexItemProps, ResponsiveFlexProps} from '../types'\n\n/**\n * @public\n */\nexport interface FlexOwnProps\n extends Omit<BoxOwnProps, 'display'>, ResponsiveFlexProps, ResponsiveFlexItemProps {\n gap?: number | number[]\n}\n\n/**\n * @public\n */\nexport type FlexProps<E extends ElementType = 'div'> = Props<FlexOwnProps, E>\n\nconst StyledFlex = styled(Box)<FlexItemStyleProps & ResponsiveFlexStyleProps>(\n flexItemStyle,\n responsiveFlexStyle,\n)\n\nfunction FlexComponent(\n props: FlexOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLDivElement>, 'as' | 'wrap'>,\n) {\n const {align, as, direction = 'row', gap, justify, ref, wrap, ...restProps} = props\n\n return (\n <StyledFlex\n data-ui=\"Flex\"\n {...restProps}\n $align={_getArrayProp(align)}\n $direction={_getArrayProp(direction)}\n $gap={_getArrayProp(gap)}\n $justify={_getArrayProp(justify)}\n $wrap={_getArrayProp(wrap)}\n forwardedAs={as}\n ref={ref}\n />\n )\n}\n\n/**\n * The `Flex` component is a wrapper component for flexible elements (`Box`, `Card` and `Flex`).\n *\n * @public\n */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Flex = FlexComponent as unknown as <E extends ElementType = 'div'>(\n props: FlexProps<E>,\n) => React.JSX.Element\n"],"mappings":";;;;;;AAYA,MAAM,QAAQ,SACZ,EANA,oBAAoB,EAClB,SAAS,OACX,EAIA,GACA,0BACA,wBACA,yBACA,4BACA,4BACF;AAEA,SAAgB,sBAAmC;CACjD,OAAO;AACT;AAEA,SAAS,yBAAyB,OAA2D;CAC3F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,SAAS,WAChC,EAAC,YAAY,MAAK,EAC1B;AACH;AAEA,SAAS,uBAAuB,OAA8C;CAC5E,IAAM,EAAC,OAAO,UAAS,YAAY,MAAM,KAAK;CAE9C,OAAO,YAAY,OAAO,MAAM,OAAO,SAAS,EAC9C,KAAK,MAAM,IAAI,MAAM,IAAI,IAAI,KAAA,EAC/B,EAAE;AACJ;AAEA,SAAS,wBAAwB,OAA2D;CAC1F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,QAAQ,UAC/B,EAAC,UAAU,KAAI,EACvB;AACH;AAEA,SAAS,2BAA2B,OAA2D;CAC7F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,WAAW,aAClC,EAAC,gBAAgB,QAAO,EAChC;AACH;AAEA,SAAS,6BAA6B,OAA2D;CAC/F,IAAM,EAAC,UAAS,YAAY,MAAM,KAAK;CAEvC,OAAO,YAAY,OAAO,MAAM,aAAa,eACpC,EAAC,eAAe,UAAS,EACjC;AACH;ACxCA,MAAM,aAAa,uBAAO,GAAG,CAAC,CAAA,WAAA;;;AAC5B,CAAA,CAAA,CAAA,eACA,mBACF;AAEA,SAAS,cACP,OACA;C,eACO,OAAO,IAAuB,KAAK,SAAS,KAAc,WAA/CA,IAAsC;CAAsB,AAAA,EAAA,OAAA,S,8GAAxE,CAAC,OAAO,IAAI,WAAA,IAAmB,KAAK,SAAS,KAAK,MAAM,GAAA,aAAgB,O;CAA5D,IAAA,YAAA,OAAA,KAAA,IAAY,QAAZA,IAMNC;CAAc,AAAA,EAAA,OAAA,Q,cAAd,KAAA,cAAc,KAAK,GAAL,EAAA,KAAA,O;CACVC,IAAAA;CAAc,AAAA,EAAA,QAAA,Y,cAAd,KAAA,cAAc,SAAS,GAAT,EAAA,MAAA,W;CACpBC,IAAAA;CAAc,AAAA,EAAA,QAAA,M,cAAd,KAAA,cAAc,GAAG,GAAH,EAAA,MAAA,K;CACVC,IAAAA;CAAc,AAAA,EAAA,QAAA,U,cAAd,KAAA,cAAc,OAAO,GAAP,EAAA,MAAA,S;CACjBC,IAAAA;CAAc,AAAA,EAAA,QAAA,O,cAAd,KAAA,cAAc,IAAI,GAAJ,EAAA,MAAA,M;CAPvBC,IAAAA;CADF,OASiB,EAAA,QAAA,MAAA,EAAA,QACR,OAAA,EAAA,QAPD,aAAA,EAAA,QACIL,MAAAA,EAAAA,QACIC,MAAAA,EAAAA,QACNC,MAAAA,EAAAA,QACIC,MAAAA,EAAAA,QACHC,MAPT,KAAA,oBAAC,YAAD;EACE,WAAQ;EACR,GAAI;EACJ,QAAQJ;EACR,YAAYC;EACZ,MAAMC;EACN,UAAUC;EACV,OAAOC;EACP,aAAa;EACR;CACN,CAAA,GAFc,EAAA,MAAA,IACR,EAAA,MAAA,KAPD,EAAA,MAAA,WACIJ,EAAAA,MAAAA,IACIC,EAAAA,MAAAA,IACNC,EAAAA,MAAAA,IACIC,EAAAA,MAAAA,IACHC,EAAAA,MAAAA,I,0BAPTC;AAYJ;;;;;;AAQA,MAAa,OAAO"}
@@ -1 +1 @@
1
- {"version":3,"file":"getElementRef-BLVMlHTn.js","names":["() => {\n ref.current = value\n }","[value]","_c","(node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n }","childRefRef.current","refs.floating.current","useCallback(\n (node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n },\n [childRefRef, onAttach, refs],\n )","() => {\n syncChildRef(attachmentRef, childRef, referenceRef.current)\n }","[childRef]","() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }","useCallback(() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }, [refs])","{handOverReference, referenceRef, setReference}","_c","{mode: modeFromProps, layoutMode, children}: AnimateActivityProps","() => setMode('hidden')","<PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>","!isPresent ? onExitComplete : undefined","layoutMode === 'pop' ? 'popLayout' : 'sync'","children as any","<Activity mode={mode}>\n <PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>\n </Activity>","_c"],"sources":["../src/core/hooks/useLatestRef.ts","../src/core/utils/attachRef.ts","../src/core/hooks/useReferenceElement.ts","../src/core/middleware/origin.ts","../src/core/utils/animateActivity.tsx","../src/core/utils/getElementRef.ts"],"sourcesContent":["import {useInsertionEffect, useRef} from 'react'\n\n/**\n * A ref that always holds the latest `value`, updated before any layout effect of the same commit\n * runs (the same mechanism `use-effect-event` uses), for callbacks that run outside render.\n *\n * @internal\n */\nexport function useLatestRef<T>(value: T): React.RefObject<T> {\n const ref = useRef(value)\n\n useInsertionEffect(() => {\n ref.current = value\n }, [value])\n\n return ref\n}\n","/**\n * Attaches `value` to `ref` the way React attaches an element's `ref` prop, and returns the\n * function that detaches it: the cleanup a callback ref returned, or else a call with `null`.\n *\n * @internal\n */\nexport function attachRef<T>(ref: React.Ref<T> | undefined, value: T): () => void {\n if (!ref) return noop\n\n if (typeof ref === 'function') {\n const cleanup = ref(value)\n\n return typeof cleanup === 'function' ? cleanup : () => ref(null)\n }\n\n ref.current = value\n\n return () => {\n ref.current = null\n }\n}\n\nfunction noop() {}\n","import {useCallback, useLayoutEffect, useRef} from 'react'\n\nimport {attachRef} from '../utils/attachRef'\nimport {useLatestRef} from './useLatestRef'\n\n/** The part of Floating UI's `refs` used here, whichever reference element type it was given */\ninterface FloatingRefs {\n floating: React.RefObject<Element | null>\n setReference: (node: HTMLElement | null) => void\n}\n\ninterface ChildRefAttachment {\n detach: () => void\n node: HTMLElement\n ref: React.Ref<HTMLElement>\n}\n\n/**\n * Keeps the element of the child that `Tooltip` and `Popover` clone in a ref rather than in state.\n * A ref callback runs in the commit phase, where a state update is scheduled at Immediate priority:\n * inside a `<ViewTransition>` such an update holds up the animation, and makes React skip the\n * transition if sync work is flushed while the browser prepares it. Floating UI is handed the\n * element as the floating element mounts, or right away when it is replaced while shown.\n *\n * The child's own `ref` is attached to the element too. A change of that ref alone (an inline\n * callback ref) is applied from a layout effect, so that `setReference` keeps its identity and a\n * re-render does not detach the element from Floating UI and `onAttach`.\n *\n * @internal\n */\nexport function useReferenceElement(\n refs: FloatingRefs,\n childRef: React.Ref<HTMLElement> | undefined,\n onAttach?: (node: HTMLElement) => () => void,\n): {\n handOverReference: () => void\n referenceRef: React.RefObject<HTMLElement | null>\n setReference: React.RefCallback<HTMLElement>\n} {\n const referenceRef = useRef<HTMLElement | null>(null)\n const attachmentRef = useRef<ChildRefAttachment | null>(null)\n const childRefRef = useLatestRef(childRef)\n\n const setReference = useCallback(\n (node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n },\n [childRefRef, onAttach, refs],\n )\n\n useLayoutEffect(() => {\n syncChildRef(attachmentRef, childRef, referenceRef.current)\n }, [childRef])\n\n const handOverReference = useCallback(() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }, [refs])\n\n return {handOverReference, referenceRef, setReference}\n}\n\n/** Attaches `ref` to `node` unless it is attached already, detaching whatever else was */\nfunction syncChildRef(\n attachmentRef: React.RefObject<ChildRefAttachment | null>,\n ref: React.Ref<HTMLElement> | undefined,\n node: HTMLElement | null,\n) {\n const attachment = attachmentRef.current\n\n if (attachment && attachment.ref === ref && attachment.node === node) return\n\n attachmentRef.current = null\n attachment?.detach()\n\n if (ref && node) attachmentRef.current = {detach: attachRef(ref, node), node, ref}\n}\n","import {Middleware} from '@floating-ui/react-dom'\n\n/**\n * Custom floating-ui middleware which calculates transform-origin X + Y offsets\n * based on the current floating rect's dimensions and shift offset.\n *\n * Scaling popovers with these transform-origin offsets will give the effect of\n * popvers slightly 'growing' from the origin/reference element.\n *\n * This middleware must be applied after both `@sanity/ui/size` and `shift` middlewares.\n */\nexport const origin: Middleware = {\n name: '@sanity/ui/origin',\n fn({middlewareData, placement, rects}) {\n const [side] = placement.split('-')\n\n const floatingWidth = rects.floating.width\n const floatingHeight = rects.floating.height\n\n const shiftX = middlewareData.shift?.x || 0\n const shiftY = middlewareData.shift?.y || 0\n\n if (floatingWidth <= 0 || floatingHeight <= 0) {\n return {}\n }\n\n const isVerticalPlacement = ['bottom', 'top'].includes(side)\n\n const {originX, originY}: {originX: number; originY: number} = isVerticalPlacement\n ? {\n originX: clamp(0.5 - shiftX / floatingWidth, 0, 1),\n originY: side === 'bottom' ? 0 : 1,\n }\n : {\n originX: side === 'left' ? 1 : 0,\n originY: clamp(0.5 - shiftY / floatingHeight, 0, 1),\n }\n\n return {\n data: {originX, originY},\n }\n },\n}\n\n/**\n * Converts the `origin` middleware data into a plain `transform-origin` CSS value.\n *\n * The value is intentionally applied as a regular CSS property rather than motion's\n * `originX`/`originY` style keys: motion turns those into motion values that it resets to\n * their initial (unpositioned, `undefined`) state whenever the element re-mounts, which is\n * what happens every time an `Activity`-hidden popover or tooltip is shown again.\n */\nexport function getTransformOrigin(originX?: number, originY?: number): string | undefined {\n if (originX === undefined || originY === undefined) return undefined\n\n return `${originX * 100}% ${originY * 100}%`\n}\n\nfunction clamp(num: number, min: number, max: number) {\n return Math.min(Math.max(num, min), max)\n}\n","/**\n * MIT License\n *\n * Copyright (c) 2024 Motion One\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport {invariant, PresenceChild} from 'motion/react'\nimport {Activity, useState} from 'react'\n\ninterface AnimateActivityProps {\n mode: 'visible' | 'hidden'\n layoutMode: 'default' | 'pop'\n children: React.ReactNode\n}\n\n/**\n * Animated version of React's `Activity` that defers `mode=\"hidden\"` until\n * child exit animations have finished.\n *\n * @internal\n */\nexport function AnimateActivity({mode: modeFromProps, layoutMode, children}: AnimateActivityProps) {\n /**\n * This is the mode that we'll render.\n */\n const [mode, setMode] = useState(modeFromProps)\n\n /**\n * This is the goal state as defined by props.\n */\n const isPresent = modeFromProps === 'visible'\n\n /**\n * Immediately switch to mode=\"visible\" when the user\n * changes the mode prop.\n */\n if (isPresent && mode !== 'visible') {\n setMode('visible')\n return null\n }\n\n /**\n * Set mode to \"hidden\" only when the exit animation is complete.\n */\n const onExitComplete = () => setMode('hidden')\n\n invariant(Boolean(Activity), 'Activity component not found - upgrade to React 19.2.0 or higher')\n\n return (\n <Activity mode={mode}>\n <PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>\n </Activity>\n )\n}\n","// Based on https://github.com/radix-ui/primitives/blob/0bade6a704e5821b90a6da0f3d8cfa8a7711127d/packages/react/slot/src/Slot.tsx#L128-L150\n// Before React 19 accessing `element.props.ref` will throw a warning and suggest using `element.ref`\n// After React 19 accessing `element.ref` does the opposite.\n// https://github.com/facebook/react/pull/28348\n//\n// Access the ref using the method that doesn't yield a warning.\nexport function getElementRef<T = unknown>(element: React.ReactElement): React.Ref<T> | undefined {\n // React <=18 in DEV\n // oxlint-disable-next-line unbound-method\n let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get\n let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning\n\n if (mayWarn) {\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element as {ref?: React.Ref<T>}).ref\n }\n\n // React 19 in DEV\n // oxlint-disable-next-line unbound-method\n getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get\n mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning\n\n if (mayWarn) {\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element.props as {ref?: React.Ref<T>}).ref\n }\n\n // Not DEV\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element.props as {ref?: React.Ref<T>}).ref || (element as {ref?: React.Ref<T>}).ref\n}\n"],"mappings":";;;;;;;;;;AAQA,SAAgB,aAAgB,OAA8B;eACtD,MAAM,OAAO,KAAK,GAELA,IAEhBC;CAEH,OAHgB,EAAA,OAAA,kCADG,WAAM;EACvB,IAAI,UAAU;CAChB,GAAG,KAAA,CAAC,KAAK,GADO,EAAA,KAAA,8BADhB,mBAAmBD,IAEhBC,EAAO,GAEH;AACT;;;;;;;ACVA,SAAgB,UAAa,KAA+B,OAAsB;CAChF,IAAI,CAAC,KAAK,OAAO;CAEjB,IAAI,OAAO,OAAQ,YAAY;EAC7B,IAAM,UAAU,IAAI,KAAK;EAEzB,OAAO,OAAO,WAAY,aAAa,gBAAgB,IAAI,IAAI;CACjE;CAIA,OAFA,IAAI,UAAU,aAED;EACX,IAAI,UAAU;CAChB;AACF;AAEA,SAAS,OAAO,CAAC;;;;;;;;;;;;;;ACQjB,SAAgB,oBACd,MACA,UACA,UAKA;gBACM,eAAe,OAA2B,IAAI,GAC9C,gBAAgB,OAAkC,IAAI,GACtD,cAAc,aAAa,QAAQ,GAGvCE;CAI8BC,AAAAA,EAAAA,OAAAA,eAAAA,EAAAA,OADb,YAAA,EAAA,OADXC,QAFN,MAAC,SAAsB;EAErB,AADA,aAAa,UAAU,MACnB,KAAK,SAAS,WAAS,KAAK,aAAa,IAAI;EACjD,IAAM,SAAS,WAAW,IAAI;EAG9B,OAFA,aAAa,eAAe,YAAY,SAAS,IAAI,SAExC;GAIX,AAHA,aAAa,eAAe,KAAA,GAAW,IAAI,GAC3C,SAAS,GACT,aAAa,UAAU,MACnB,KAAK,SAAS,WAAS,KAAK,aAAa,IAAI;EACnD;CACF,GAR8BD,EAAAA,KAAAA,aADb,EAAA,KAAA,UADXC,EAAAA,KAAAA;CAHR,IAAM,eAAeC,IAiBLC,IAEbC;CAFH,AAC8B,EAAA,OAAA,qCADd,WAAM;EACpB,aAAa,eAAe,UAAU,aAAa,OAAO;CAC5D,GAAG,KAAA,CAAC,QAAQ,GADkB,EAAA,KAAA,iCAD9B,gBAAgBD,IAEbC,EAAU;CAEyBC,IAAAA;CAEV,AAAA,EAAA,OAAA,oBAFU,WAAM;EAE1C,AAAI,aAAa,WAAS,KAAK,aAAa,aAAa,OAAO;CAClE,GAD4B,EAAA,KAAA;CAF5B,IAAM,oBAAoBC,IAKnBC;CAAP,OAAQ,EAAA,OAAA,qBAAA,EAAA,QAAiC,gBAAlC,KAAA;EAAC;EAAmB;EAAc;CAAY,GAA7C,EAAA,KAAA,mBAAiC,EAAA,MAAA,wCAAlCA;AACT;;AAGA,SAAS,aACP,eACA,KACA,MACA;CACA,IAAM,aAAa,cAAc;CAEjC,AAAI,cAAc,WAAW,QAAQ,OAAO,WAAW,SAAS,SAEhE,cAAc,UAAU,MACxB,YAAY,OAAO,GAEf,OAAO,SAAM,cAAc,UAAU;EAAC,QAAQ,UAAU,KAAK,IAAI;EAAG;EAAM;CAAG;AACnF;;;;;;;;;;AC3EA,MAAa,SAAqB;CAChC,MAAM;CACN,GAAG,EAAC,gBAAgB,WAAW,SAAQ;EACrC,IAAM,CAAC,QAAQ,UAAU,MAAM,GAAG,GAE5B,gBAAgB,MAAM,SAAS,OAC/B,iBAAiB,MAAM,SAAS,QAEhC,SAAS,eAAe,OAAO,KAAK,GACpC,SAAS,eAAe,OAAO,KAAK;EAE1C,IAAI,iBAAiB,KAAK,kBAAkB,GAC1C,OAAO,CAAC;EAKV,IAAM,EAAC,SAAS,YAFY,CAAC,UAAU,KAAK,CAAC,CAAC,SAAS,IAEQ,IAC3D;GACE,SAAS,MAAM,KAAM,SAAS,eAAe,GAAG,CAAC;GACjD,SAAS,SAAS,WAAW,IAAI;EACnC,IACA;GACE,SAAS,WAAS;GAClB,SAAS,MAAM,KAAM,SAAS,gBAAgB,GAAG,CAAC;EACpD;EAEJ,OAAO,EACL,MAAM;GAAC;GAAS;EAAO,EACzB;CACF;AACF;;;;;;;;;AAUA,SAAgB,mBAAmB,SAAkB,SAAsC;CACzF,IAAI,YAAY,KAAA,KAAa,YAAY,KAAA,GAEzC,OAAO,GAAG,UAAU,IAAI,IAAI,UAAU,IAAI;AAC5C;AAEA,SAAS,MAAM,KAAa,KAAa,KAAa;CACpD,OAAO,KAAK,IAAI,KAAK,IAAI,KAAK,GAAG,GAAG,GAAG;AACzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrBA,SAAgB,gBAAA,IAAmF;eAAnE,EAAC,MAAM,eAAe,YAAY,aAAlCE,IAIxB,CAAC,MAAM,WAAW,SAAS,aAAa,GAKxC,YAAY,kBAAkB;CAMpC,IAAI,aAAa,SAAS,WAExB,OADA,QAAQ,SAAS,GACV;CAMcC,IAAAA;qDAAM,WAAA,QAAQ,QAAQ;CAA7C,IAAM,iBAAiBA;CAEvB,UAAU,EAAQ,UAAW,kEAAkE;CAMzE,IAAA,KAAC,YAA6B,KAAA,IAAjB,gBAEvB,KAAA,eAAe,QAAQ,cAAc,QAG1C,KAAA,UAPHC;CACa,AAAA,EAAA,OAAA,aAAA,EAAA,OACKC,MAAAA,EAAAA,OAEVC,MAAAA,EAAAA,OAGLC,MAPH,KAAA,oBAAC,eAAD;EACa;EACX,gBAAgBF;EAChB,uBAAuB;EACvB,MAAMC;EAGLC,UAAAA;CACY,CAAA,GAPF,EAAA,KAAA,WACKF,EAAAA,KAAAA,IAEVC,EAAAA,KAAAA,IAGLC,EAAAA,KAAAA;CARLC,IAAAA;CADF,OACkB,EAAA,OAAA,QAAA,EAAA,OACdJ,MADF,KAAA,oBAAC,UAAD;EAAgB;EACdA,UAAAA;CASQ,CAAA,GAVM,EAAA,KAAA,MACdA,EAAAA,KAAAA,4BADFI;AAYJ;ACzEA,SAAgB,cAA2B,SAAuD;CAGhG,IAAI,SAAS,OAAO,yBAAyB,QAAQ,OAAO,KAAK,CAAC,EAAE,KAChE,UAAU,UAAU,oBAAoB,UAAU,OAAO;CAmB7D,OAjBI,UAEM,QAAiC,OAK3C,SAAS,OAAO,yBAAyB,SAAS,KAAK,CAAC,EAAE,KAC1D,UAAU,UAAU,oBAAoB,UAAU,OAAO,gBAErD,UAEM,QAAQ,MAA+B,MAKzC,QAAQ,MAA+B,OAAQ,QAAiC;AAC1F"}
1
+ {"version":3,"file":"getElementRef-BLVMlHTn.js","names":["() => {\n ref.current = value\n }","[value]","_c","(node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n }","childRefRef.current","refs.floating.current","useCallback(\n (node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n },\n [childRefRef, onAttach, refs],\n )","() => {\n syncChildRef(attachmentRef, childRef, referenceRef.current)\n }","[childRef]","() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }","useCallback(() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }, [refs])","{handOverReference, referenceRef, setReference}","_c","{mode: modeFromProps, layoutMode, children}: AnimateActivityProps","() => setMode('hidden')","<PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>","!isPresent ? onExitComplete : undefined","layoutMode === 'pop' ? 'popLayout' : 'sync'","children as any","<Activity mode={mode}>\n <PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>\n </Activity>","_c"],"sources":["../src/core/hooks/useLatestRef.ts","../src/core/utils/attachRef.ts","../src/core/hooks/useReferenceElement.ts","../src/core/middleware/origin.ts","../src/core/utils/animateActivity.tsx","../src/core/utils/getElementRef.ts"],"sourcesContent":["import {useInsertionEffect, useRef} from 'react'\n\n/**\n * A ref that always holds the latest `value`, updated before any layout effect of the same commit\n * runs (the same mechanism `use-effect-event` uses), for callbacks that run outside render.\n *\n * @internal\n */\nexport function useLatestRef<T>(value: T): React.RefObject<T> {\n const ref = useRef(value)\n\n useInsertionEffect(() => {\n ref.current = value\n }, [value])\n\n return ref\n}\n","/**\n * Attaches `value` to `ref` the way React attaches an element's `ref` prop, and returns the\n * function that detaches it: the cleanup a callback ref returned, or else a call with `null`.\n *\n * @internal\n */\nexport function attachRef<T>(ref: React.Ref<T> | undefined, value: T): () => void {\n if (!ref) return noop\n\n if (typeof ref === 'function') {\n const cleanup = ref(value)\n\n return typeof cleanup === 'function' ? cleanup : () => ref(null)\n }\n\n ref.current = value\n\n return () => {\n ref.current = null\n }\n}\n\nfunction noop() {}\n","import {useCallback, useLayoutEffect, useRef} from 'react'\n\nimport {attachRef} from '../utils/attachRef'\nimport {useLatestRef} from './useLatestRef'\n\n/** The part of Floating UI's `refs` used here, whichever reference element type it was given */\ninterface FloatingRefs {\n floating: React.RefObject<Element | null>\n setReference: (node: HTMLElement | null) => void\n}\n\ninterface ChildRefAttachment {\n detach: () => void\n node: HTMLElement\n ref: React.Ref<HTMLElement>\n}\n\n/**\n * Keeps the element of the child that `Tooltip` and `Popover` clone in a ref rather than in state.\n * A ref callback runs in the commit phase, where a state update is scheduled at Immediate priority:\n * inside a `<ViewTransition>` such an update holds up the animation, and makes React skip the\n * transition if sync work is flushed while the browser prepares it. Floating UI is handed the\n * element as the floating element mounts, or right away when it is replaced while shown.\n *\n * The child's own `ref` is attached to the element too. A change of that ref alone (an inline\n * callback ref) is applied from a layout effect, so that `setReference` keeps its identity and a\n * re-render does not detach the element from Floating UI and `onAttach`.\n *\n * @internal\n */\nexport function useReferenceElement(\n refs: FloatingRefs,\n childRef: React.Ref<HTMLElement> | undefined,\n onAttach?: (node: HTMLElement) => () => void,\n): {\n handOverReference: () => void\n referenceRef: React.RefObject<HTMLElement | null>\n setReference: React.RefCallback<HTMLElement>\n} {\n const referenceRef = useRef<HTMLElement | null>(null)\n const attachmentRef = useRef<ChildRefAttachment | null>(null)\n const childRefRef = useLatestRef(childRef)\n\n const setReference = useCallback(\n (node: HTMLElement) => {\n referenceRef.current = node\n if (refs.floating.current) refs.setReference(node)\n const detach = onAttach?.(node)\n syncChildRef(attachmentRef, childRefRef.current, node)\n\n return () => {\n syncChildRef(attachmentRef, undefined, null)\n detach?.()\n referenceRef.current = null\n if (refs.floating.current) refs.setReference(null)\n }\n },\n [childRefRef, onAttach, refs],\n )\n\n useLayoutEffect(() => {\n syncChildRef(attachmentRef, childRef, referenceRef.current)\n }, [childRef])\n\n const handOverReference = useCallback(() => {\n // Never `null`: that would replace `Popover`'s `referenceElement` option in `refs.reference`\n if (referenceRef.current) refs.setReference(referenceRef.current)\n }, [refs])\n\n return {handOverReference, referenceRef, setReference}\n}\n\n/** Attaches `ref` to `node` unless it is attached already, detaching whatever else was */\nfunction syncChildRef(\n attachmentRef: React.RefObject<ChildRefAttachment | null>,\n ref: React.Ref<HTMLElement> | undefined,\n node: HTMLElement | null,\n) {\n const attachment = attachmentRef.current\n\n if (attachment && attachment.ref === ref && attachment.node === node) return\n\n attachmentRef.current = null\n attachment?.detach()\n\n if (ref && node) attachmentRef.current = {detach: attachRef(ref, node), node, ref}\n}\n","import {Middleware} from '@floating-ui/react-dom'\n\n/**\n * Custom floating-ui middleware which calculates transform-origin X + Y offsets\n * based on the current floating rect's dimensions and shift offset.\n *\n * Scaling popovers with these transform-origin offsets will give the effect of\n * popvers slightly 'growing' from the origin/reference element.\n *\n * This middleware must be applied after both `@sanity/ui/size` and `shift` middlewares.\n */\nexport const origin: Middleware = {\n name: '@sanity/ui/origin',\n fn({middlewareData, placement, rects}) {\n const [side] = placement.split('-')\n\n const floatingWidth = rects.floating.width\n const floatingHeight = rects.floating.height\n\n const shiftX = middlewareData.shift?.x || 0\n const shiftY = middlewareData.shift?.y || 0\n\n if (floatingWidth <= 0 || floatingHeight <= 0) {\n return {}\n }\n\n const isVerticalPlacement = ['bottom', 'top'].includes(side)\n\n const {originX, originY}: {originX: number; originY: number} = isVerticalPlacement\n ? {\n originX: clamp(0.5 - shiftX / floatingWidth, 0, 1),\n originY: side === 'bottom' ? 0 : 1,\n }\n : {\n originX: side === 'left' ? 1 : 0,\n originY: clamp(0.5 - shiftY / floatingHeight, 0, 1),\n }\n\n return {\n data: {originX, originY},\n }\n },\n}\n\n/**\n * Converts the `origin` middleware data into a plain `transform-origin` CSS value.\n *\n * The value is intentionally applied as a regular CSS property rather than motion's\n * `originX`/`originY` style keys: motion turns those into motion values that it resets to\n * their initial (unpositioned, `undefined`) state whenever the element re-mounts, which is\n * what happens every time an `Activity`-hidden popover or tooltip is shown again.\n */\nexport function getTransformOrigin(originX?: number, originY?: number): string | undefined {\n if (originX === undefined || originY === undefined) return undefined\n\n return `${originX * 100}% ${originY * 100}%`\n}\n\nfunction clamp(num: number, min: number, max: number) {\n return Math.min(Math.max(num, min), max)\n}\n","/**\n * MIT License\n *\n * Copyright (c) 2024 Motion One\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport {invariant, PresenceChild} from 'motion/react'\nimport {Activity, useState} from 'react'\n\ninterface AnimateActivityProps {\n mode: 'visible' | 'hidden'\n layoutMode: 'default' | 'pop'\n children: React.ReactNode\n}\n\n/**\n * Animated version of React's `Activity` that defers `mode=\"hidden\"` until\n * child exit animations have finished.\n *\n * @internal\n */\nexport function AnimateActivity({mode: modeFromProps, layoutMode, children}: AnimateActivityProps) {\n /**\n * This is the mode that we'll render.\n */\n const [mode, setMode] = useState(modeFromProps)\n\n /**\n * This is the goal state as defined by props.\n */\n const isPresent = modeFromProps === 'visible'\n\n /**\n * Immediately switch to mode=\"visible\" when the user\n * changes the mode prop.\n */\n if (isPresent && mode !== 'visible') {\n setMode('visible')\n return null\n }\n\n /**\n * Set mode to \"hidden\" only when the exit animation is complete.\n */\n const onExitComplete = () => setMode('hidden')\n\n invariant(Boolean(Activity), 'Activity component not found - upgrade to React 19.2.0 or higher')\n\n return (\n <Activity mode={mode}>\n <PresenceChild\n isPresent={isPresent}\n onExitComplete={!isPresent ? onExitComplete : undefined}\n presenceAffectsLayout={false}\n mode={layoutMode === 'pop' ? 'popLayout' : 'sync'}\n >\n {/* oxlint-disable-next-line no-unsafe-type-assertion -- PresenceChild expects a single ReactElement */}\n {children as any}\n </PresenceChild>\n </Activity>\n )\n}\n","// Based on https://github.com/radix-ui/primitives/blob/0bade6a704e5821b90a6da0f3d8cfa8a7711127d/packages/react/slot/src/Slot.tsx#L128-L150\n// Before React 19 accessing `element.props.ref` will throw a warning and suggest using `element.ref`\n// After React 19 accessing `element.ref` does the opposite.\n// https://github.com/facebook/react/pull/28348\n//\n// Access the ref using the method that doesn't yield a warning.\nexport function getElementRef<T = unknown>(element: React.ReactElement): React.Ref<T> | undefined {\n // React <=18 in DEV\n // oxlint-disable-next-line unbound-method\n let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get\n let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning\n\n if (mayWarn) {\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element as {ref?: React.Ref<T>}).ref\n }\n\n // React 19 in DEV\n // oxlint-disable-next-line unbound-method\n getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get\n mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning\n\n if (mayWarn) {\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element.props as {ref?: React.Ref<T>}).ref\n }\n\n // Not DEV\n // oxlint-disable-next-line no-unsafe-type-assertion\n return (element.props as {ref?: React.Ref<T>}).ref || (element as {ref?: React.Ref<T>}).ref\n}\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"grid-D-gOpN8z.js","names":["_getArrayProp(autoRows)","_getArrayProp(autoCols)","_getArrayProp(autoFlow)","_getArrayProp(gridTemplateColumns)","_getArrayProp(gap)","_getArrayProp(gapX)","_getArrayProp(gapY)","_getArrayProp(gridTemplateRows)","<StyledGrid\n data-as={typeof as === 'string' ? as : undefined}\n data-ui=\"Grid\"\n {...restProps}\n $autoRows={_getArrayProp(autoRows)}\n $autoCols={_getArrayProp(autoCols)}\n $autoFlow={_getArrayProp(autoFlow)}\n $columns={_getArrayProp(gridTemplateColumns)}\n $gap={_getArrayProp(gap)}\n $gapX={_getArrayProp(gapX)}\n $gapY={_getArrayProp(gapY)}\n $rows={_getArrayProp(gridTemplateRows)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledGrid>","typeof as === 'string' ? as : undefined","_c"],"sources":["../src/core/styles/grid/gridStyle.ts","../src/core/primitives/grid/grid.tsx"],"sourcesContent":["import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, _ruleSet, rem} from '../helpers'\nimport {ThemeProps} from '../types'\nimport {ResponsiveGridStyleProps} from './types'\n\nconst GRID_CSS = {\n '&&:not([hidden])': {\n display: 'grid',\n },\n '&[data-as=\"ul\"],&[data-as=\"ol\"]': {\n listStyle: 'none',\n },\n}\n\nconst GRID_AUTO_COLUMS = {\n auto: 'auto',\n min: 'min-content',\n max: 'max-content',\n fr: 'minmax(0, 1fr)',\n}\n\nconst GRID_AUTO_ROWS = {\n auto: 'auto',\n min: 'min-content',\n max: 'max-content',\n fr: 'minmax(0, 1fr)',\n}\n\nconst RULES = _ruleSet(\n GRID_CSS,\n responsiveGridAutoFlowStyle,\n responsiveGridAutoRowsStyle,\n responsiveGridAutoColsStyle,\n responsiveGridColumnsStyle,\n responsiveGridRowsStyle,\n responsiveGridGapStyle,\n responsiveGridGapXStyle,\n responsiveGridGapYStyle,\n)\n\nexport function responsiveGridStyle(): CSSObject[] {\n return RULES\n}\n\nfunction responsiveGridAutoFlowStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoFlow, (autoFlow) => ({\n gridAutoFlow: autoFlow,\n }))\n}\n\nfunction responsiveGridAutoRowsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoRows, (autoRows) => ({\n gridAutoRows: autoRows && GRID_AUTO_ROWS[autoRows],\n }))\n}\n\nfunction responsiveGridAutoColsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoCols, (autoCols) => ({\n gridAutoColumns: autoCols && GRID_AUTO_COLUMS[autoCols],\n }))\n}\n\nfunction responsiveGridColumnsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$columns, (columns) => ({\n gridTemplateColumns: columns && `repeat(${columns},minmax(0,1fr));`,\n }))\n}\n\nfunction responsiveGridRowsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$rows, (rows) => ({\n gridTemplateRows: rows && `repeat(${rows},minmax(0,1fr));`,\n }))\n}\n\nfunction responsiveGridGapStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gap, (gap) => ({\n // oxlint-disable-next-line no-deprecated\n gridGap: gap ? rem(space[gap]) : undefined,\n }))\n}\n\nfunction responsiveGridGapXStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gapX, (gapX) => ({\n columnGap: gapX ? rem(space[gapX]) : undefined,\n }))\n}\n\nfunction responsiveGridGapYStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gapY, (gapY) => ({\n rowGap: gapY ? rem(space[gapY]) : undefined,\n }))\n}\n","import {styled} from 'styled-components'\n\nimport {responsiveGridStyle} from '../../styles/grid/gridStyle'\nimport {ResponsiveGridStyleProps} from '../../styles/grid/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {ResponsiveGridProps} from '../types'\n\n/**\n * @public\n */\nexport interface GridOwnProps extends Omit<BoxOwnProps, 'display'>, ResponsiveGridProps {}\n\n/**\n * @public\n */\nexport type GridProps<E extends ElementType = 'div'> = Props<GridOwnProps, E>\n\nconst StyledGrid = styled(Box)<ResponsiveGridStyleProps>(responsiveGridStyle)\n\nfunction GridComponent(\n props: GridOwnProps & {as?: ElementType} & Omit<\n React.HTMLProps<HTMLDivElement>,\n 'as' | 'height' | 'rows'\n >,\n) {\n const {\n as,\n autoRows,\n autoCols,\n autoFlow,\n gridTemplateColumns,\n gap,\n gapX,\n gapY,\n gridTemplateRows,\n children,\n ref,\n ...restProps\n } = props\n\n return (\n <StyledGrid\n data-as={typeof as === 'string' ? as : undefined}\n data-ui=\"Grid\"\n {...restProps}\n $autoRows={_getArrayProp(autoRows)}\n $autoCols={_getArrayProp(autoCols)}\n $autoFlow={_getArrayProp(autoFlow)}\n $columns={_getArrayProp(gridTemplateColumns)}\n $gap={_getArrayProp(gap)}\n $gapX={_getArrayProp(gapX)}\n $gapY={_getArrayProp(gapY)}\n $rows={_getArrayProp(gridTemplateRows)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledGrid>\n )\n}\n\n/**\n * The `Grid` component is for building 2-dimensional layers (based on CSS grid).\n *\n * @public\n */\nexport const Grid: <E extends ElementType = 'div'>(props: GridProps<E>) => React.JSX.Element =\n GridComponent\n"],"mappings":"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"}
1
+ {"version":3,"file":"grid-D-gOpN8z.js","names":["_getArrayProp(autoRows)","_getArrayProp(autoCols)","_getArrayProp(autoFlow)","_getArrayProp(gridTemplateColumns)","_getArrayProp(gap)","_getArrayProp(gapX)","_getArrayProp(gapY)","_getArrayProp(gridTemplateRows)","<StyledGrid\n data-as={typeof as === 'string' ? as : undefined}\n data-ui=\"Grid\"\n {...restProps}\n $autoRows={_getArrayProp(autoRows)}\n $autoCols={_getArrayProp(autoCols)}\n $autoFlow={_getArrayProp(autoFlow)}\n $columns={_getArrayProp(gridTemplateColumns)}\n $gap={_getArrayProp(gap)}\n $gapX={_getArrayProp(gapX)}\n $gapY={_getArrayProp(gapY)}\n $rows={_getArrayProp(gridTemplateRows)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledGrid>","typeof as === 'string' ? as : undefined","_c"],"sources":["../src/core/styles/grid/gridStyle.ts","../src/core/primitives/grid/grid.tsx"],"sourcesContent":["import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, _ruleSet, rem} from '../helpers'\nimport {ThemeProps} from '../types'\nimport {ResponsiveGridStyleProps} from './types'\n\nconst GRID_CSS = {\n '&&:not([hidden])': {\n display: 'grid',\n },\n '&[data-as=\"ul\"],&[data-as=\"ol\"]': {\n listStyle: 'none',\n },\n}\n\nconst GRID_AUTO_COLUMS = {\n auto: 'auto',\n min: 'min-content',\n max: 'max-content',\n fr: 'minmax(0, 1fr)',\n}\n\nconst GRID_AUTO_ROWS = {\n auto: 'auto',\n min: 'min-content',\n max: 'max-content',\n fr: 'minmax(0, 1fr)',\n}\n\nconst RULES = _ruleSet(\n GRID_CSS,\n responsiveGridAutoFlowStyle,\n responsiveGridAutoRowsStyle,\n responsiveGridAutoColsStyle,\n responsiveGridColumnsStyle,\n responsiveGridRowsStyle,\n responsiveGridGapStyle,\n responsiveGridGapXStyle,\n responsiveGridGapYStyle,\n)\n\nexport function responsiveGridStyle(): CSSObject[] {\n return RULES\n}\n\nfunction responsiveGridAutoFlowStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoFlow, (autoFlow) => ({\n gridAutoFlow: autoFlow,\n }))\n}\n\nfunction responsiveGridAutoRowsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoRows, (autoRows) => ({\n gridAutoRows: autoRows && GRID_AUTO_ROWS[autoRows],\n }))\n}\n\nfunction responsiveGridAutoColsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$autoCols, (autoCols) => ({\n gridAutoColumns: autoCols && GRID_AUTO_COLUMS[autoCols],\n }))\n}\n\nfunction responsiveGridColumnsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$columns, (columns) => ({\n gridTemplateColumns: columns && `repeat(${columns},minmax(0,1fr));`,\n }))\n}\n\nfunction responsiveGridRowsStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$rows, (rows) => ({\n gridTemplateRows: rows && `repeat(${rows},minmax(0,1fr));`,\n }))\n}\n\nfunction responsiveGridGapStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gap, (gap) => ({\n // oxlint-disable-next-line no-deprecated\n gridGap: gap ? rem(space[gap]) : undefined,\n }))\n}\n\nfunction responsiveGridGapXStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gapX, (gapX) => ({\n columnGap: gapX ? rem(space[gapX]) : undefined,\n }))\n}\n\nfunction responsiveGridGapYStyle(props: ResponsiveGridStyleProps & ThemeProps) {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$gapY, (gapY) => ({\n rowGap: gapY ? rem(space[gapY]) : undefined,\n }))\n}\n","import {styled} from 'styled-components'\n\nimport {responsiveGridStyle} from '../../styles/grid/gridStyle'\nimport {ResponsiveGridStyleProps} from '../../styles/grid/types'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {ResponsiveGridProps} from '../types'\n\n/**\n * @public\n */\nexport interface GridOwnProps extends Omit<BoxOwnProps, 'display'>, ResponsiveGridProps {}\n\n/**\n * @public\n */\nexport type GridProps<E extends ElementType = 'div'> = Props<GridOwnProps, E>\n\nconst StyledGrid = styled(Box)<ResponsiveGridStyleProps>(responsiveGridStyle)\n\nfunction GridComponent(\n props: GridOwnProps & {as?: ElementType} & Omit<\n React.HTMLProps<HTMLDivElement>,\n 'as' | 'height' | 'rows'\n >,\n) {\n const {\n as,\n autoRows,\n autoCols,\n autoFlow,\n gridTemplateColumns,\n gap,\n gapX,\n gapY,\n gridTemplateRows,\n children,\n ref,\n ...restProps\n } = props\n\n return (\n <StyledGrid\n data-as={typeof as === 'string' ? as : undefined}\n data-ui=\"Grid\"\n {...restProps}\n $autoRows={_getArrayProp(autoRows)}\n $autoCols={_getArrayProp(autoCols)}\n $autoFlow={_getArrayProp(autoFlow)}\n $columns={_getArrayProp(gridTemplateColumns)}\n $gap={_getArrayProp(gap)}\n $gapX={_getArrayProp(gapX)}\n $gapY={_getArrayProp(gapY)}\n $rows={_getArrayProp(gridTemplateRows)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledGrid>\n )\n}\n\n/**\n * The `Grid` component is for building 2-dimensional layers (based on CSS grid).\n *\n * @public\n */\nexport const Grid: <E extends ElementType = 'div'>(props: GridProps<E>) => React.JSX.Element =\n GridComponent\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"hotkeys-Bd5rZOMO.js","names":["(event: KeyboardEvent) => onKeyDown(event)","() => {\n const handler = (event: KeyboardEvent) => handleKeyDown(event)\n\n window.addEventListener('keydown', handler, options)\n\n return () => window.removeEventListener('keydown', handler, options)\n }","event","[options]","_c","Children.map(childrenProp, (child) => child && <div>{child}</div>)","(child) => child && <div>{child}</div>","useMemo(\n () => Children.map(childrenProp, (child) => child && <div>{child}</div>),\n [childrenProp],\n )","_getArrayProp(gap)","<StyledInline\n data-ui=\"Inline\"\n {...restProps}\n $space={_getArrayProp(gap)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledInline>","_c","fontSize = 0","padding = 1","radius = 2","_getArrayProp(radius)","<Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>","<Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>","<StyledKBD data-ui=\"KBD\" {...restProps} $radius={_getArrayProp(radius)} ref={ref}>\n <Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>\n </StyledKBD>","_c","gap = 0.5","_getArrayProp(gap)","<></>","clsx(hotkeys, className)","keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))","(key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n )","<Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>","<kbd className={clsx(hotkeys, className)} data-ui=\"Hotkeys\" ref={ref} {...restProps}>\n <Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>\n </kbd>","_c","_Fragment","\"lineHeight\"","\"margin\""],"sources":["../src/core/hooks/useGlobalKeyDown.ts","../src/core/primitives/inline/styles.ts","../src/core/primitives/inline/inline.tsx","../src/core/primitives/kbd/kbd.tsx","../src/core/components/hotkeys/hotkeys.css.ts","../src/core/components/hotkeys/hotkeys.tsx"],"sourcesContent":["import {useEffect} from 'react'\n// TODO: switch to `useEffectEvent` from `react` once\n// https://github.com/facebook/react/issues/34818 is fixed in the lowest React\n// version we support: on React 19.2 the native hook never sees values past\n// the first render when the calling component is wrapped in `forwardRef` or\n// `memo`. This public hook runs in the fiber of whatever component calls it\n// (consumers may call it from `forwardRef` or `memo` components).\nimport {useEffectEvent} from 'use-effect-event'\n\n/**\n * Adds global keydown event listener to the window.\n *\n * @param onKeyDown - The function to call when a keydown event is triggered.\n * @param options - The options to pass to the addEventListener function (example, capture: true)\n * @beta\n */\nexport function useGlobalKeyDown(\n onKeyDown: (event: KeyboardEvent) => void,\n options?: AddEventListenerOptions,\n): void {\n const handleKeyDown = useEffectEvent((event: KeyboardEvent) => onKeyDown(event))\n\n useEffect(() => {\n const handler = (event: KeyboardEvent) => handleKeyDown(event)\n\n window.addEventListener('keydown', handler, options)\n\n return () => window.removeEventListener('keydown', handler, options)\n }, [options])\n}\n","import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, rem} from '../../styles/helpers'\nimport {ThemeProps} from '../../styles/types'\nimport {ResponsiveInlineSpaceStyleProps} from './types'\n\nexport function inlineBaseStyle(): CSSObject {\n return {\n 'lineHeight': '0',\n\n '&&:not([hidden])': {\n display: 'block',\n },\n\n '& > div': {\n display: 'inline-block',\n verticalAlign: 'middle',\n },\n }\n}\n\nexport function inlineSpaceStyle(props: ResponsiveInlineSpaceStyleProps & ThemeProps): CSSObject[] {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$space, (spaceIndex) => {\n const _space = rem(spaceIndex === 0.5 ? space[1] / 2 : space[spaceIndex])\n\n return {\n 'margin': `-${_space} 0 0 -${_space}`,\n '& > div': {padding: `${_space} 0 0 ${_space}`},\n }\n })\n}\n","import {Children, useMemo} from 'react'\nimport {styled} from 'styled-components'\n\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {inlineBaseStyle, inlineSpaceStyle} from './styles'\nimport {ResponsiveInlineSpaceStyleProps} from './types'\n\n/**\n * @public\n */\nexport interface InlineOwnProps extends Omit<BoxOwnProps, 'display'> {\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n /** The spacing between children. */\n gap?: number | number[]\n}\n\n/**\n * @public\n */\nexport type InlineProps<E extends ElementType = 'div'> = Props<InlineOwnProps, E>\n\nconst StyledInline = styled(Box)<ResponsiveInlineSpaceStyleProps>(inlineBaseStyle, inlineSpaceStyle)\n\nfunction InlineComponent(\n props: InlineOwnProps & {as?: ElementType} & React.HTMLProps<HTMLDivElement>,\n) {\n const {as, children: childrenProp, gap, ref, ...restProps} = props\n\n const children = useMemo(\n () => Children.map(childrenProp, (child) => child && <div>{child}</div>),\n [childrenProp],\n )\n\n return (\n <StyledInline\n data-ui=\"Inline\"\n {...restProps}\n $space={_getArrayProp(gap)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledInline>\n )\n}\n\n/**\n * The `Inline` component is a layout utility for aligning and spacing items horizontally.\n *\n * @public\n */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Inline = InlineComponent as unknown as <E extends ElementType = 'div'>(\n props: InlineProps<E>,\n) => React.JSX.Element\n","import {css, styled} from 'styled-components'\n\nimport {_getArrayProp} from '../../styles/helpers'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {ElementType, Props} from '../../types/component'\nimport {Radius} from '../../types/radius'\nimport {Box} from '../box/box'\nimport {Text} from '../text/text'\n\n/**\n * @public\n */\nexport interface KBDOwnProps {\n fontSize?: number | number[]\n padding?: number | number[]\n radius?: Radius | Radius[]\n}\n\n/**\n * @public\n */\nexport type KBDProps<E extends ElementType = 'kbd'> = Props<KBDOwnProps, E>\n\nconst kbdBaseStyle = css`\n --card-bg-color: var(--card-kbd-bg-color);\n --card-border-color: var(--card-kbd-border-color);\n --card-fg-color: var(--card-kbd-fg-color);\n\n box-shadow: inset 0 0 0 1px var(--card-border-color);\n background: var(--card-bg-color);\n font: inherit;\n\n vertical-align: top;\n\n &:not([hidden]) {\n display: inline-block;\n }\n`\n\nconst KBDBase = styled.kbd`\n ${kbdBaseStyle}\n`\n\nconst StyledKBD = styled(KBDBase)<ResponsiveRadiusStyleProps>(responsiveRadiusStyle)\n\nfunction KBDComponent(\n props: KBDOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLElement>, 'as' | 'size'>,\n) {\n const {children, fontSize = 0, padding = 1, radius = 2, ref, ...restProps} = props\n\n return (\n <StyledKBD data-ui=\"KBD\" {...restProps} $radius={_getArrayProp(radius)} ref={ref}>\n <Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>\n </StyledKBD>\n )\n}\n\n/**\n * Used to define some text as keyboard input.\n *\n * @public\n */\nexport const KBD: <E extends ElementType = 'kbd'>(props: KBDProps<E>) => React.JSX.Element =\n KBDComponent\n","import {css} from '#styled-system/css'\n\nexport const hotkeys = css({\n 'font': 'inherit',\n 'padding': '1px',\n '&:not([hidden])': {\n display: 'block',\n },\n})\n","import {clsx} from 'clsx/lite'\nimport {styled} from 'styled-components'\n\nimport {Inline} from '../../primitives/inline/inline'\nimport {KBD} from '../../primitives/kbd/kbd'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {Radius} from '../../types/radius'\n\nimport {hotkeys} from './hotkeys.css'\n\n/**\n * @public\n */\nexport interface HotkeysProps {\n fontSize?: number | number[]\n gap?: number | number[]\n padding?: number | number[]\n radius?: Radius | Radius[]\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n keys?: string[]\n}\n\n// Stays on styled-components: `display: block` must beat KBD's runtime\n// `display: inline-block` at equal specificity, which needs both rules in the\n// runtime stylesheet.\nconst Key = styled(KBD)`\n &:not([hidden]) {\n display: block;\n }\n`\n\n/**\n * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.\n *\n * @public\n */\nexport function Hotkeys(props: HotkeysProps & Omit<React.HTMLProps<HTMLElement>, 'as' | 'size'>) {\n const {className, fontSize, gap = 0.5, keys, padding, radius, ref, ...restProps} = props\n const spacing = _getArrayProp(gap)\n\n if (!keys || keys.length === 0) {\n return <></>\n }\n\n return (\n <kbd className={clsx(hotkeys, className)} data-ui=\"Hotkeys\" ref={ref} {...restProps}>\n <Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>\n </kbd>\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"hotkeys-Bd5rZOMO.js","names":["(event: KeyboardEvent) => onKeyDown(event)","() => {\n const handler = (event: KeyboardEvent) => handleKeyDown(event)\n\n window.addEventListener('keydown', handler, options)\n\n return () => window.removeEventListener('keydown', handler, options)\n }","event","[options]","_c","Children.map(childrenProp, (child) => child && <div>{child}</div>)","(child) => child && <div>{child}</div>","useMemo(\n () => Children.map(childrenProp, (child) => child && <div>{child}</div>),\n [childrenProp],\n )","_getArrayProp(gap)","<StyledInline\n data-ui=\"Inline\"\n {...restProps}\n $space={_getArrayProp(gap)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledInline>","_c","fontSize = 0","padding = 1","radius = 2","_getArrayProp(radius)","<Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>","<Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>","<StyledKBD data-ui=\"KBD\" {...restProps} $radius={_getArrayProp(radius)} ref={ref}>\n <Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>\n </StyledKBD>","_c","gap = 0.5","_getArrayProp(gap)","<></>","clsx(hotkeys, className)","keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))","(key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n )","<Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>","<kbd className={clsx(hotkeys, className)} data-ui=\"Hotkeys\" ref={ref} {...restProps}>\n <Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>\n </kbd>","_c","_Fragment","\"lineHeight\"","\"margin\""],"sources":["../src/core/hooks/useGlobalKeyDown.ts","../src/core/primitives/inline/styles.ts","../src/core/primitives/inline/inline.tsx","../src/core/primitives/kbd/kbd.tsx","../src/core/components/hotkeys/hotkeys.css.ts","../src/core/components/hotkeys/hotkeys.tsx"],"sourcesContent":["import {useEffect} from 'react'\n// TODO: switch to `useEffectEvent` from `react` once\n// https://github.com/facebook/react/issues/34818 is fixed in the lowest React\n// version we support: on React 19.2 the native hook never sees values past\n// the first render when the calling component is wrapped in `forwardRef` or\n// `memo`. This public hook runs in the fiber of whatever component calls it\n// (consumers may call it from `forwardRef` or `memo` components).\nimport {useEffectEvent} from 'use-effect-event'\n\n/**\n * Adds global keydown event listener to the window.\n *\n * @param onKeyDown - The function to call when a keydown event is triggered.\n * @param options - The options to pass to the addEventListener function (example, capture: true)\n * @beta\n */\nexport function useGlobalKeyDown(\n onKeyDown: (event: KeyboardEvent) => void,\n options?: AddEventListenerOptions,\n): void {\n const handleKeyDown = useEffectEvent((event: KeyboardEvent) => onKeyDown(event))\n\n useEffect(() => {\n const handler = (event: KeyboardEvent) => handleKeyDown(event)\n\n window.addEventListener('keydown', handler, options)\n\n return () => window.removeEventListener('keydown', handler, options)\n }, [options])\n}\n","import {CSSObject} from '../../../theme/system/css'\nimport {getTheme_v2} from '../../../theme/versioning/getTheme_v2'\nimport {_responsive, rem} from '../../styles/helpers'\nimport {ThemeProps} from '../../styles/types'\nimport {ResponsiveInlineSpaceStyleProps} from './types'\n\nexport function inlineBaseStyle(): CSSObject {\n return {\n 'lineHeight': '0',\n\n '&&:not([hidden])': {\n display: 'block',\n },\n\n '& > div': {\n display: 'inline-block',\n verticalAlign: 'middle',\n },\n }\n}\n\nexport function inlineSpaceStyle(props: ResponsiveInlineSpaceStyleProps & ThemeProps): CSSObject[] {\n const {media, space} = getTheme_v2(props.theme)\n\n return _responsive(media, props.$space, (spaceIndex) => {\n const _space = rem(spaceIndex === 0.5 ? space[1] / 2 : space[spaceIndex])\n\n return {\n 'margin': `-${_space} 0 0 -${_space}`,\n '& > div': {padding: `${_space} 0 0 ${_space}`},\n }\n })\n}\n","import {Children, useMemo} from 'react'\nimport {styled} from 'styled-components'\n\nimport {_getArrayProp} from '../../styles/helpers'\nimport {ElementType, Props} from '../../types/component'\nimport {Box, BoxOwnProps} from '../box/box'\nimport {inlineBaseStyle, inlineSpaceStyle} from './styles'\nimport {ResponsiveInlineSpaceStyleProps} from './types'\n\n/**\n * @public\n */\nexport interface InlineOwnProps extends Omit<BoxOwnProps, 'display'> {\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n /** The spacing between children. */\n gap?: number | number[]\n}\n\n/**\n * @public\n */\nexport type InlineProps<E extends ElementType = 'div'> = Props<InlineOwnProps, E>\n\nconst StyledInline = styled(Box)<ResponsiveInlineSpaceStyleProps>(inlineBaseStyle, inlineSpaceStyle)\n\nfunction InlineComponent(\n props: InlineOwnProps & {as?: ElementType} & React.HTMLProps<HTMLDivElement>,\n) {\n const {as, children: childrenProp, gap, ref, ...restProps} = props\n\n const children = useMemo(\n () => Children.map(childrenProp, (child) => child && <div>{child}</div>),\n [childrenProp],\n )\n\n return (\n <StyledInline\n data-ui=\"Inline\"\n {...restProps}\n $space={_getArrayProp(gap)}\n forwardedAs={as}\n ref={ref}\n >\n {children}\n </StyledInline>\n )\n}\n\n/**\n * The `Inline` component is a layout utility for aligning and spacing items horizontally.\n *\n * @public\n */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Inline = InlineComponent as unknown as <E extends ElementType = 'div'>(\n props: InlineProps<E>,\n) => React.JSX.Element\n","import {css, styled} from 'styled-components'\n\nimport {_getArrayProp} from '../../styles/helpers'\nimport {responsiveRadiusStyle} from '../../styles/radius/radiusStyle'\nimport {ResponsiveRadiusStyleProps} from '../../styles/radius/types'\nimport {ElementType, Props} from '../../types/component'\nimport {Radius} from '../../types/radius'\nimport {Box} from '../box/box'\nimport {Text} from '../text/text'\n\n/**\n * @public\n */\nexport interface KBDOwnProps {\n fontSize?: number | number[]\n padding?: number | number[]\n radius?: Radius | Radius[]\n}\n\n/**\n * @public\n */\nexport type KBDProps<E extends ElementType = 'kbd'> = Props<KBDOwnProps, E>\n\nconst kbdBaseStyle = css`\n --card-bg-color: var(--card-kbd-bg-color);\n --card-border-color: var(--card-kbd-border-color);\n --card-fg-color: var(--card-kbd-fg-color);\n\n box-shadow: inset 0 0 0 1px var(--card-border-color);\n background: var(--card-bg-color);\n font: inherit;\n\n vertical-align: top;\n\n &:not([hidden]) {\n display: inline-block;\n }\n`\n\nconst KBDBase = styled.kbd`\n ${kbdBaseStyle}\n`\n\nconst StyledKBD = styled(KBDBase)<ResponsiveRadiusStyleProps>(responsiveRadiusStyle)\n\nfunction KBDComponent(\n props: KBDOwnProps & {as?: ElementType} & Omit<React.HTMLProps<HTMLElement>, 'as' | 'size'>,\n) {\n const {children, fontSize = 0, padding = 1, radius = 2, ref, ...restProps} = props\n\n return (\n <StyledKBD data-ui=\"KBD\" {...restProps} $radius={_getArrayProp(radius)} ref={ref}>\n <Box as=\"span\" padding={padding}>\n <Text as=\"span\" size={fontSize} weight=\"semibold\">\n {children}\n </Text>\n </Box>\n </StyledKBD>\n )\n}\n\n/**\n * Used to define some text as keyboard input.\n *\n * @public\n */\nexport const KBD: <E extends ElementType = 'kbd'>(props: KBDProps<E>) => React.JSX.Element =\n KBDComponent\n","import {css} from '#styled-system/css'\n\nexport const hotkeys = css({\n 'font': 'inherit',\n 'padding': '1px',\n '&:not([hidden])': {\n display: 'block',\n },\n})\n","import {clsx} from 'clsx/lite'\nimport {styled} from 'styled-components'\n\nimport {Inline} from '../../primitives/inline/inline'\nimport {KBD} from '../../primitives/kbd/kbd'\nimport {_getArrayProp} from '../../styles/helpers'\nimport {Radius} from '../../types/radius'\n\nimport {hotkeys} from './hotkeys.css'\n\n/**\n * @public\n */\nexport interface HotkeysProps {\n fontSize?: number | number[]\n gap?: number | number[]\n padding?: number | number[]\n radius?: Radius | Radius[]\n /**\n * @deprecated Use `gap` instead.\n */\n space?: never\n keys?: string[]\n}\n\n// Stays on styled-components: `display: block` must beat KBD's runtime\n// `display: inline-block` at equal specificity, which needs both rules in the\n// runtime stylesheet.\nconst Key = styled(KBD)`\n &:not([hidden]) {\n display: block;\n }\n`\n\n/**\n * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.\n *\n * @public\n */\nexport function Hotkeys(props: HotkeysProps & Omit<React.HTMLProps<HTMLElement>, 'as' | 'size'>) {\n const {className, fontSize, gap = 0.5, keys, padding, radius, ref, ...restProps} = props\n const spacing = _getArrayProp(gap)\n\n if (!keys || keys.length === 0) {\n return <></>\n }\n\n return (\n <kbd className={clsx(hotkeys, className)} data-ui=\"Hotkeys\" ref={ref} {...restProps}>\n <Inline as=\"span\" gap={spacing}>\n {keys.map((key, i) => (\n // oxlint-disable-next-line no-array-index-key\n <Key key={i} fontSize={fontSize} padding={padding} radius={radius}>\n {key}\n </Key>\n ))}\n </Inline>\n </kbd>\n )\n}\n"],"mappings":"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"}