@sanity/ui 4.1.0 → 4.2.0

package/dist/{flex-CySCBzQm.js → flex-DmbDG2ks.js}

@@ -1,6 +1,6 @@
 import { a as rem, i as _responsive, n as _getArrayProp } from "./helpers-C8xxXAQC.js";
 import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
-import { x as flexItemStyle, y as Box } from "./useLayer-jUJIz8mh.js";
+import { x as flexItemStyle, y as Box } from "./useLayer-D1usxIE0.js";
 import { c } from "react/compiler-runtime";
 import { styled } from "styled-components";
 import { jsx } from "react/jsx-runtime";
@@ -73,4 +73,4 @@ function FlexComponent(props) {
 const Flex = FlexComponent;
 export { Flex as t };
 
-//# sourceMappingURL=flex-CySCBzQm.js.map
+//# sourceMappingURL=flex-DmbDG2ks.js.map

package/dist/{flex-CySCBzQm.js.map → flex-DmbDG2ks.js.map}

@@ -1 +1 @@
-{"version":3,"file":"flex-CySCBzQm.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    />"],"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, 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\nexport function responsiveFlexStyle(): Array<\n  CSSObject | ((props: ResponsiveFlexStyleProps & ThemeProps) => CSSObject[])\n> {\n  return [\n    BASE_STYLE,\n    responsiveFlexAlignStyle,\n    responsiveFlexGapStyle,\n    responsiveFlexWrapStyle,\n    responsiveFlexJustifyStyle,\n    responsiveFlexDirectionStyle,\n  ]\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":";;;;;;AAMA,MAAM,aAAwB,EAC5B,oBAAoB,EAClB,SAAS,OACX,EACF;AAEA,SAAgB,sBAEd;CACA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF;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"}
+{"version":3,"file":"flex-DmbDG2ks.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    />"],"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, 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\nexport function responsiveFlexStyle(): Array<\n  CSSObject | ((props: ResponsiveFlexStyleProps & ThemeProps) => CSSObject[])\n> {\n  return [\n    BASE_STYLE,\n    responsiveFlexAlignStyle,\n    responsiveFlexGapStyle,\n    responsiveFlexWrapStyle,\n    responsiveFlexJustifyStyle,\n    responsiveFlexDirectionStyle,\n  ]\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":";;;;;;AAMA,MAAM,aAAwB,EAC5B,oBAAoB,EAClB,SAAS,OACX,EACF;AAEA,SAAgB,sBAEd;CACA,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;CACF;AACF;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"}

package/dist/{getElementRef-5HZQ-Owu.js → getElementRef-Jw7gY0eV.js}

@@ -29,6 +29,17 @@ const origin = {
 		} };
 	}
 };
+/**
+* Converts the `origin` middleware data into a plain `transform-origin` CSS value.
+*
+* The value is intentionally applied as a regular CSS property rather than motion's
+* `originX`/`originY` style keys: motion turns those into motion values that it resets to
+* their initial (unpositioned, `undefined`) state whenever the element re-mounts, which is
+* what happens every time an `Activity`-hidden popover or tooltip is shown again.
+*/
+function getTransformOrigin(originX, originY) {
+	if (originX !== void 0 && originY !== void 0) return `${originX * 100}% ${originY * 100}%`;
+}
 function clamp(num, min, max) {
 	return Math.min(Math.max(num, min), max);
 }
@@ -86,6 +97,6 @@ function getElementRef(element) {
 	let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
 	return mayWarn ? element.ref : (getter = Object.getOwnPropertyDescriptor(element, "ref")?.get, mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning, mayWarn ? element.props.ref : element.props.ref || element.ref);
 }
-export { AnimateActivity as n, origin as r, getElementRef as t };
+export { origin as i, AnimateActivity as n, getTransformOrigin as r, getElementRef as t };
 
-//# sourceMappingURL=getElementRef-5HZQ-Owu.js.map
+//# sourceMappingURL=getElementRef-Jw7gY0eV.js.map

package/dist/getElementRef-Jw7gY0eV.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getElementRef-Jw7gY0eV.js","names":["{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>"],"sources":["../src/core/middleware/origin.ts","../src/core/utils/animateActivity.tsx","../src/core/utils/getElementRef.ts"],"sourcesContent":["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(element: React.ReactElement) {\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 any).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<unknown>}).ref\n  }\n\n  // Not DEV\n  // oxlint-disable-next-line no-unsafe-type-assertion\n  return (element.props as {ref?: React.Ref<unknown>}).ref || (element as any).ref\n}\n"],"mappings":";;;;;;;;;;;;;AAWA,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;CACrF,gBAAY,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,aAAlCA,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,cAAc,SAA6B;CAGzD,IAAI,SAAS,OAAO,yBAAyB,QAAQ,OAAO,KAAK,CAAC,EAAE,KAChE,UAAU,UAAU,oBAAoB,UAAU,OAAO;CAmB7D,OAjBI,UAEM,QAAgB,OAK1B,SAAS,OAAO,yBAAyB,SAAS,KAAK,CAAC,EAAE,KAC1D,UAAU,UAAU,oBAAoB,UAAU,OAAO,gBAErD,UAEM,QAAQ,MAAqC,MAK/C,QAAQ,MAAqC,OAAQ,QAAgB;AAC/E"}

package/dist/{grid-I2TNptX-.js → grid-6JSgMj1O.js}

@@ -1,6 +1,6 @@
 import { a as rem, i as _responsive, n as _getArrayProp } from "./helpers-C8xxXAQC.js";
 import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
-import { y as Box } from "./useLayer-jUJIz8mh.js";
+import { y as Box } from "./useLayer-D1usxIE0.js";
 import { c } from "react/compiler-runtime";
 import { styled } from "styled-components";
 import { jsx } from "react/jsx-runtime";
@@ -112,4 +112,4 @@ function GridComponent(props) {
 const Grid = GridComponent;
 export { Grid as t };
 
-//# sourceMappingURL=grid-I2TNptX-.js.map
+//# sourceMappingURL=grid-6JSgMj1O.js.map

package/dist/{grid-I2TNptX-.js.map → grid-6JSgMj1O.js.map}

@@ -1 +1 @@
-{"version":3,"file":"grid-I2TNptX-.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"],"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, 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\nexport function responsiveGridStyle(): Array<\n  CSSObject | ((props: ResponsiveGridStyleProps & ThemeProps) => CSSObject[])\n> {\n  return [\n    GRID_CSS,\n    responsiveGridAutoFlowStyle,\n    responsiveGridAutoRowsStyle,\n    responsiveGridAutoColsStyle,\n    responsiveGridColumnsStyle,\n    responsiveGridRowsStyle,\n    responsiveGridGapStyle,\n    responsiveGridGapXStyle,\n    responsiveGridGapYStyle,\n  ]\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 */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Grid = GridComponent as unknown as <E extends ElementType = 'div'>(\n  props: GridProps<E>,\n) => React.JSX.Element\n"],"mappings":"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"}
+{"version":3,"file":"grid-6JSgMj1O.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"],"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, 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\nexport function responsiveGridStyle(): Array<\n  CSSObject | ((props: ResponsiveGridStyleProps & ThemeProps) => CSSObject[])\n> {\n  return [\n    GRID_CSS,\n    responsiveGridAutoFlowStyle,\n    responsiveGridAutoRowsStyle,\n    responsiveGridAutoColsStyle,\n    responsiveGridColumnsStyle,\n    responsiveGridRowsStyle,\n    responsiveGridGapStyle,\n    responsiveGridGapXStyle,\n    responsiveGridGapYStyle,\n  ]\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 */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const Grid = GridComponent as unknown as <E extends ElementType = 'div'>(\n  props: GridProps<E>,\n) => React.JSX.Element\n"],"mappings":"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"}

package/dist/{hotkeys-Bi6Q5963.js → hotkeys-CaHsQlsO.js}

@@ -1,7 +1,7 @@
 import { a as rem, i as _responsive, n as _getArrayProp } from "./helpers-C8xxXAQC.js";
 import { t as getTheme_v2 } from "./getTheme_v2-y09KqtEb.js";
-import { v as responsiveRadiusStyle, y as Box } from "./useLayer-jUJIz8mh.js";
-import { n as Text } from "./stack-BGFEokua.js";
+import { v as responsiveRadiusStyle, y as Box } from "./useLayer-D1usxIE0.js";
+import { n as Text } from "./stack-rsNFPq2-.js";
 import { c } from "react/compiler-runtime";
 import { clsx } from "clsx/lite";
 import { Children, useEffect } from "react";
@@ -116,7 +116,11 @@ function KBDComponent(props) {
 * @public
 */
 const KBD = KBDComponent;
-var hotkey = "_1ljw6pi1", hotkeys = "_1ljw6pi0";
+var hotkeys = "_1ljw6pi0";
+const Key = styled(KBD).withConfig({
+	displayName: "Key",
+	componentId: "sc-ttp6vu-0"
+})`&:not([hidden]){display:block;}`;
 /**
 * Represent hotkeys (a keyboard combination) with semantic `<kbd>` elements.
 *
@@ -137,8 +141,7 @@ function Hotkeys(props) {
 	let t3;
 	if ($[14] !== fontSize || $[15] !== keys || $[16] !== padding || $[17] !== radius) {
 		let t4;
-		$[19] !== fontSize || $[20] !== padding || $[21] !== radius ? (t4 = (key, i) => /* @__PURE__ */ jsx(KBD, {
-			className: hotkey,
+		$[19] !== fontSize || $[20] !== padding || $[21] !== radius ? (t4 = (key, i) => /* @__PURE__ */ jsx(Key, {
 			fontSize,
 			padding,
 			radius,
@@ -162,4 +165,4 @@ function Hotkeys(props) {
 }
 export { useGlobalKeyDown as i, KBD as n, Inline as r, Hotkeys as t };
 
-//# sourceMappingURL=hotkeys-Bi6Q5963.js.map
+//# sourceMappingURL=hotkeys-CaHsQlsO.js.map

package/dist/hotkeys-CaHsQlsO.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hotkeys-CaHsQlsO.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    // oxlint-disable-next-line react/exhaustive-effect-dependencies\n  }","event","[options]","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>","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>","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>"],"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    // oxlint-disable-next-line react/exhaustive-effect-dependencies\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\nfunction kbdStyle() {\n  return 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}\n\nconst StyledKBD = styled.kbd<ResponsiveRadiusStyleProps>(responsiveRadiusStyle, kbdStyle)\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 */\n// oxlint-disable-next-line no-unsafe-type-assertion\nexport const KBD = KBDComponent as unknown as <E extends ElementType = 'kbd'>(\n  props: KBDProps<E>,\n) => React.JSX.Element\n","import {style} from '@vanilla-extract/css'\n\nexport const hotkeys = style({\n  font: 'inherit',\n  padding: '1px',\n  selectors: {\n    '&:not([hidden])': {\n      display: 'block',\n    },\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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"}