@react-spectrum/s2 3.0.0-nightly-527c98a84-250305 → 3.0.0-nightly-b4695c8fd-250307

package/dist/CardView.cjs

@@ -6,7 +6,6 @@ var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
 var $gDulG$reactjsxruntime = require("react/jsx-runtime");
 var $gDulG$reactariacomponents = require("react-aria-components");
 var $gDulG$react = require("react");
-var $gDulG$reactstatelyvirtualizer = require("@react-stately/virtualizer");
 var $gDulG$reactspectrumutils = require("@react-spectrum/utils");
 var $gDulG$reactariautils = require("@react-aria/utils");
 
@@ -36,91 +35,90 @@ $parcel$export(module.exports, "CardView", () => $1aaf8931044a97bd$export$7e52c8
 
 
 
-
 const $1aaf8931044a97bd$var$layoutOptions = {
     XS: {
         compact: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(6, 6),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(100, 100),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(140, 140)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(6, 6),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(100, 100),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(140, 140)
         },
         regular: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(8, 8),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(100, 100),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(140, 140)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(8, 8),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(100, 100),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(140, 140)
         },
         spacious: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(12, 12),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(100, 100),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(140, 140)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(12, 12),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(100, 100),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(140, 140)
         }
     },
     S: {
         compact: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(8, 8),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(150, 150),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(210, 210)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(8, 8),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(150, 150),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(210, 210)
         },
         regular: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(12, 12),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(150, 150),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(210, 210)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(12, 12),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(150, 150),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(210, 210)
         },
         spacious: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(16, 16),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(150, 150),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(210, 210)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(16, 16),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(150, 150),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(210, 210)
         }
     },
     M: {
         compact: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(12, 12),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(200, 200),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(280, 280)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(12, 12),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(200, 200),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(280, 280)
         },
         regular: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(16, 16),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(200, 200),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(280, 280)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(16, 16),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(200, 200),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(280, 280)
         },
         spacious: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(20, 20),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(200, 200),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(280, 280)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(20, 20),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(200, 200),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(280, 280)
         }
     },
     L: {
         compact: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(16, 16),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(270, 270),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(370, 370)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(16, 16),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(270, 270),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(370, 370)
         },
         regular: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(20, 20),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(270, 270),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(370, 370)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(20, 20),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(270, 270),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(370, 370)
         },
         spacious: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(24, 24),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(270, 270),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(370, 370)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(24, 24),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(270, 270),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(370, 370)
         }
     },
     XL: {
         compact: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(20, 20),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(340, 340),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(460, 460)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(20, 20),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(340, 340),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(460, 460)
         },
         regular: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(24, 24),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(340, 340),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(460, 460)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(24, 24),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(340, 340),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(460, 460)
         },
         spacious: {
-            minSpace: new (0, $gDulG$reactstatelyvirtualizer.Size)(28, 28),
-            minItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(340, 340),
-            maxItemSize: new (0, $gDulG$reactstatelyvirtualizer.Size)(460, 460)
+            minSpace: new (0, $gDulG$reactariacomponents.Size)(28, 28),
+            minItemSize: new (0, $gDulG$reactariacomponents.Size)(340, 340),
+            maxItemSize: new (0, $gDulG$reactariacomponents.Size)(460, 460)
         }
     }
 };

package/dist/CardView.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {Size} from '@react-stately/virtualizer';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.cjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Size,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.cjs.map"}

package/dist/CardView.css.map

@@ -1 +1 @@
-{"mappings":"AC+JuB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsBD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtBC;;AAAA;EAAA;IAAA","sources":["bcfa03266ec99ed3","packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["@import \"b9a56ec855293cb6\";\n@import \"879fd470e85635cf\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {Size} from '@react-stately/virtualizer';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.css.map"}
+{"mappings":"AC+JuB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsBD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtBC;;AAAA;EAAA;IAAA","sources":["bcfa03266ec99ed3","packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["@import \"b9a56ec855293cb6\";\n@import \"879fd470e85635cf\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Size,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.css.map"}

package/dist/CardView.mjs

@@ -4,9 +4,8 @@ import {ImageCoordinator as $4b5e069e9e001e8b$export$1b926c015f09611d} from "./I
 import {useActionBarContainer as $f21f2186348fbc5b$export$13f32e21845e01d0} from "./ActionBar.mjs";
 import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
 import {jsx as $aG2ym$jsx, jsxs as $aG2ym$jsxs} from "react/jsx-runtime";
-import {WaterfallLayout as $aG2ym$WaterfallLayout, GridLayout as $aG2ym$GridLayout, Virtualizer as $aG2ym$Virtualizer, GridListItem as $aG2ym$GridListItem, GridList as $aG2ym$GridList} from "react-aria-components";
+import {Size as $aG2ym$Size, WaterfallLayout as $aG2ym$WaterfallLayout, GridLayout as $aG2ym$GridLayout, Virtualizer as $aG2ym$Virtualizer, GridListItem as $aG2ym$GridListItem, GridList as $aG2ym$GridList} from "react-aria-components";
 import {createContext as $aG2ym$createContext, forwardRef as $aG2ym$forwardRef, useRef as $aG2ym$useRef, useState as $aG2ym$useState, useMemo as $aG2ym$useMemo} from "react";
-import {Size as $aG2ym$Size} from "@react-stately/virtualizer";
 import {useDOMRef as $aG2ym$useDOMRef} from "@react-spectrum/utils";
 import {useEffectEvent as $aG2ym$useEffectEvent, useResizeObserver as $aG2ym$useResizeObserver, useLayoutEffect as $aG2ym$useLayoutEffect, useLoadMore as $aG2ym$useLoadMore} from "@react-aria/utils";
 
@@ -29,7 +28,6 @@ import {useEffectEvent as $aG2ym$useEffectEvent, useResizeObserver as $aG2ym$use
 
 
 
-
 const $bbcff092fe610ff3$var$layoutOptions = {
     XS: {
         compact: {

package/dist/CardView.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {Size} from '@react-stately/virtualizer';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.mjs.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/s2/src/CardView.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  GridList as AriaGridList,\n  ContextValue,\n  GridLayout,\n  GridListItem,\n  GridListProps,\n  Size,\n  Virtualizer,\n  WaterfallLayout\n} from 'react-aria-components';\nimport {CardContext, InternalCardViewContext} from './Card';\nimport {createContext, forwardRef, ReactElement, useMemo, useRef, useState} from 'react';\nimport {DOMRef, DOMRefValue, forwardRefType, Key, LoadingState} from '@react-types/shared';\nimport {focusRing, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {ImageCoordinator} from './ImageCoordinator';\nimport {useActionBarContainer} from './ActionBar';\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useEffectEvent, useLayoutEffect, useLoadMore, useResizeObserver} from '@react-aria/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface CardViewProps<T> extends Omit<GridListProps<T>, 'layout' | 'keyboardNavigationBehavior' | 'selectionBehavior' | 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The layout of the cards.\n   * @default 'grid'\n   */\n  layout?: 'grid' | 'waterfall',\n  /**\n   * The size of the cards.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L' | 'XL',\n  /**\n   * The amount of space between the cards.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The visual style of the cards.\n   * @default 'primary'\n   */\n  variant?: 'primary' | 'secondary' | 'tertiary' | 'quiet',\n  /**\n   * How selection should be displayed.\n   * @default 'checkbox'\n   */\n  selectionStyle?: 'checkbox' | 'highlight',\n  /** The loading state of the CardView. */\n  loadingState?: LoadingState,\n  /** Handler that is called when more items should be loaded, e.g. while scrolling near the bottom. */\n  onLoadMore?: () => void,\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight,\n  /** Provides the ActionBar to render when cards are selected in the CardView. */\n  renderActionBar?: (selectedKeys: 'all' | Set<Key>) => ReactElement\n}\n\nconst layoutOptions = {\n  XS: {\n    compact: {\n      minSpace: new Size(6, 6),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    regular: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    },\n    spacious: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(100, 100),\n      maxItemSize: new Size(140, 140)\n    }\n  },\n  S: {\n    compact: {\n      minSpace: new Size(8, 8),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    regular: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    },\n    spacious: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(150, 150),\n      maxItemSize: new Size(210, 210)\n    }\n  },\n  M: {\n    compact: {\n      minSpace: new Size(12, 12),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    regular: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    },\n    spacious: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(200, 200),\n      maxItemSize: new Size(280, 280)\n    }\n  },\n  L: {\n    compact: {\n      minSpace: new Size(16, 16),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    regular: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    },\n    spacious: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(270, 270),\n      maxItemSize: new Size(370, 370)\n    }\n  },\n  XL: {\n    compact: {\n      minSpace: new Size(20, 20),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    regular: {\n      minSpace: new Size(24, 24),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    },\n    spacious: {\n      minSpace: new Size(28, 28),\n      minItemSize: new Size(340, 340),\n      maxItemSize: new Size(460, 460)\n    }\n  }\n};\n\nconst SIZES = ['XS', 'S', 'M', 'L', 'XL'] as const;\n\nconst cardViewStyles = style({\n  overflowY: {\n    default: 'auto',\n    isLoading: 'hidden'\n  },\n  display: {\n    isEmpty: 'flex'\n  },\n  boxSizing: 'border-box',\n  flexDirection: 'column',\n  alignItems: 'center',\n  justifyContent: 'center',\n  ...focusRing(),\n  outlineStyle: {\n    default: 'none',\n    isEmpty: {\n      isFocusVisible: 'solid'\n    }\n  },\n  outlineOffset: -2\n}, getAllowedOverrides({height: true}));\n\nconst wrapperStyles = style({\n  position: 'relative', \n  overflow: 'clip', \n  size: 'fit'\n}, getAllowedOverrides({height: true}));\n\nexport const CardViewContext = createContext<ContextValue<Partial<CardViewProps<any>>, DOMRefValue<HTMLDivElement>>>(null);\n\nexport const CardView = /*#__PURE__*/ (forwardRef as forwardRefType)(function CardView<T extends object>(props: CardViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CardViewContext);\n  let {children, layout: layoutName = 'grid', size: sizeProp = 'M', density = 'regular', variant = 'primary', selectionStyle = 'checkbox', UNSAFE_className = '', UNSAFE_style, styles, ...otherProps} = props;\n  let domRef = useDOMRef(ref);\n  let innerRef = useRef(null);\n  let scrollRef = props.renderActionBar ? innerRef : domRef;\n\n  // This calculates the maximum t-shirt size where at least two columns fit in the available width.\n  let [maxSizeIndex, setMaxSizeIndex] = useState(SIZES.length - 1);\n  let updateSize = useEffectEvent(() => {\n    let w = scrollRef.current?.clientWidth ?? 0;\n    let i = SIZES.length - 1;\n    while (i > 0) {\n      let opts = layoutOptions[SIZES[i]][density];\n      if (w >= opts.minItemSize.width * 2 + opts.minSpace.width * 3) {\n        break;\n      }\n      i--;\n    }\n    setMaxSizeIndex(i);\n  });\n\n  useResizeObserver({\n    ref: scrollRef,\n    box: 'border-box',\n    onResize: updateSize\n  });\n\n  useLayoutEffect(() => {\n    updateSize();\n  }, [updateSize]);\n\n  // The actual rendered t-shirt size is the minimum between the size prop and the maximum possible size.\n  let size = SIZES[Math.min(maxSizeIndex, SIZES.indexOf(sizeProp))];\n  let layout = layoutName === 'waterfall' ? WaterfallLayout : GridLayout;\n  let options = layoutOptions[size][density];\n\n  useLoadMore({\n    isLoading: props.loadingState !== 'idle' && props.loadingState !== 'error',\n    items: props.items, // TODO: ideally this would be the collection. items won't exist for static collections, or those using <Collection>\n    onLoadMore: props.onLoadMore\n  }, scrollRef);\n\n  let ctx = useMemo(() => ({size, variant}), [size, variant]);\n\n  let {selectedKeys, onSelectionChange, actionBar, actionBarHeight} = useActionBarContainer({...props, scrollRef});\n\n  let cardView = (\n    <Virtualizer layout={layout} layoutOptions={options}>\n      <InternalCardViewContext.Provider value={GridListItem}>\n        <CardContext.Provider value={ctx}>\n          <ImageCoordinator>\n            <AriaGridList\n              ref={scrollRef}\n              {...otherProps}\n              layout=\"grid\"\n              selectionBehavior={selectionStyle === 'highlight' ? 'replace' : 'toggle'}\n              selectedKeys={selectedKeys}\n              defaultSelectedKeys={undefined}\n              onSelectionChange={onSelectionChange}\n              style={{\n                ...(!props.renderActionBar ? UNSAFE_style : {}),\n                // Add padding at the bottom when the action bar is visible so users can scroll to the last items.\n                // Also add scroll padding so keyboard navigating preserves the padding.\n                paddingBottom: actionBarHeight > 0 ? actionBarHeight + options.minSpace.height : 0,\n                scrollPadding: options.minSpace.height,\n                scrollPaddingBottom: actionBarHeight + options.minSpace.height\n              }}\n              className={renderProps => (!props.renderActionBar ? UNSAFE_className : '') + cardViewStyles({...renderProps, isLoading: props.loadingState === 'loading'}, !props.renderActionBar ? styles : undefined)}>\n              {children}\n            </AriaGridList>\n          </ImageCoordinator>\n        </CardContext.Provider>\n      </InternalCardViewContext.Provider>\n    </Virtualizer>\n  );\n\n  // Add extra wrapper if there is an action bar so we can position relative to it.\n  // ActionBar cannot be inside the GridList due to ARIA and focus management requirements.\n  if (props.renderActionBar) {\n    return (\n      <div ref={domRef} className={UNSAFE_className + wrapperStyles(null, styles)} style={UNSAFE_style}>\n        {cardView}\n        {actionBar}\n      </div>\n    );\n  }\n\n  return cardView;\n});\n"],"names":[],"version":3,"file":"CardView.mjs.map"}

package/dist/ColorSwatch.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAmCM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAwE;AAC/G,MAAM,0DAA6B,CAAA,GAAA,0BAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,kBAC5B,KAAK,EACN,GAAG;IACJ,IAAI,eAAe,SAAS;IAC5B,QAAQ,CAAA,GAAA,oBAAM,EAAE,IAAM,OAAO,iBAAiB,WAAW,CAAA,GAAA,qCAAS,EAAE,gBAAgB,cAAc;QAAC;KAAa;IAEhH,IAAI,uBACF,gCAAC,CAAA,GAAA,sCAAc;QACZ,GAAG,KAAK;QACT,OAAO;QACP,KAAK;QACL,OAAO,CAAC,SAAC,KAAK,EAAC,GAAM,CAAA;gBACnB,oFAAoF;gBACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;YACN,CAAA;QACA,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyB6B;kBAAC;sBAAM;QAAQ,GAAG,MAAM,MAAM;;IAG1E,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAmCM,MAAM,0DAAqB,CAAA,GAAA,0BAAY,EAAwE;AAC/G,MAAM,0DAA6B,CAAA,GAAA,0BAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,uBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,MAAM,CAAA,GAAA,uBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,kBAC5B,KAAK,EACN,GAAG;IACJ,IAAI,eAAe,SAAS;IAC5B,QAAQ,CAAA,GAAA,oBAAM,EAAE,IAAM,OAAO,iBAAiB,WAAW,CAAA,GAAA,qCAAS,EAAE,gBAAgB,cAAc;QAAC;KAAa;IAEhH,IAAI,uBACF,gCAAC,CAAA,GAAA,sCAAc;QACZ,GAAG,KAAK;QACT,OAAO;QACP,KAAK;QACL,OAAO,CAAC,SAAC,KAAK,EAAC,GAAM,CAAA;gBACnB,oFAAoF;gBACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;YACN,CAAA;QACA,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyB6B;kBAAC;sBAAM;QAAQ,GAAG,MAAM,MAAM;;IAG1E,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  Color,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.cjs.map"}

package/dist/ColorSwatch.css.map

@@ -1 +1 @@
-{"mappings":"AA2EiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.css.map"}
+{"mappings":"AA2EiB;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAAA","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  Color,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.css.map"}

package/dist/ColorSwatch.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAmCM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAwE;AAC/G,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,kBAC5B,KAAK,EACN,GAAG;IACJ,IAAI,eAAe,SAAS;IAC5B,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAM,OAAO,iBAAiB,WAAW,CAAA,GAAA,iBAAS,EAAE,gBAAgB,cAAc;QAAC;KAAa;IAEhH,IAAI,uBACF,gBAAC,CAAA,GAAA,kBAAc;QACZ,GAAG,KAAK;QACT,OAAO;QACP,KAAK;QACL,OAAO,CAAC,SAAC,KAAK,EAAC,GAAM,CAAA;gBACnB,oFAAoF;gBACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;YACN,CAAA;QACA,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyB6B;kBAAC;sBAAM;QAAQ,GAAG,MAAM,MAAM;;IAG1E,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.mjs.map"}
+{"mappings":";;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAmCM,MAAM,0DAAqB,CAAA,GAAA,oBAAY,EAAwE;AAC/G,MAAM,0DAA6B,CAAA,GAAA,oBAAY,EAA0C;AAKzF,MAAM,0DAAc,CAAA,GAAA,iBAAS,EAAE,SAAS,YAAY,KAAuB,EAAE,GAA2B;IAC7G,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,MAAM,CAAA,GAAA,iBAAS,EAAE;IACrB,IAAI,QACF,OAAO,KAAK,QAAQ,eACpB,WAAW,KAAK,YAAY,kBAC5B,KAAK,EACN,GAAG;IACJ,IAAI,eAAe,SAAS;IAC5B,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAM,OAAO,iBAAiB,WAAW,CAAA,GAAA,iBAAS,EAAE,gBAAgB,cAAc;QAAC;KAAa;IAEhH,IAAI,uBACF,gBAAC,CAAA,GAAA,kBAAc;QACZ,GAAG,KAAK;QACT,OAAO;QACP,KAAK;QACL,OAAO,CAAC,SAAC,KAAK,EAAC,GAAM,CAAA;gBACnB,oFAAoF;gBACpF,YAAY,MAAM,eAAe,CAAC,WAAW,IACzC,CAAC,gBAAgB,EAAE,MAAM,EAAE,EAAE,MAAM,4EAA4E,CAAC,GAEhH;YACN,CAAA;QACA,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAyB6B;kBAAC;sBAAM;QAAQ,GAAG,MAAM,MAAM;;IAG1E,+DAA+D;IAC/D,IAAI,KACF,OAAO,IAAI,UAAU,CAAC,QAAQ,OAAO;IAGvC,OAAO;AACT","sources":["packages/@react-spectrum/s2/src/ColorSwatch.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  ColorSwatch as AriaColorSwatch,\n  ColorSwatchProps as AriaColorSwatchProps,\n  Color,\n  ContextValue,\n  parseColor\n} from 'react-aria-components';\nimport {createContext, forwardRef, JSX, ReactElement, useContext, useMemo} from 'react';\nimport {DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with {type: 'macro'};\nimport {style} from '../style' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchProps extends Omit<AriaColorSwatchProps, 'className' | 'style'>, UnsafeStyles {\n  /**\n   * The size of the ColorSwatch.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the ColorSwatch.\n   * @default 'default'\n   */\n  rounding?: 'default' | 'none' | 'full',\n  /** Spectrum-defined styles, returned by the `style()` macro. */\n  styles?: StylesPropWithHeight\n}\n\ninterface SpectrumColorSwatchContextValue extends Pick<ColorSwatchProps, 'size' | 'rounding'> {\n  useWrapper: (swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) => JSX.Element\n}\n\nexport const ColorSwatchContext = createContext<ContextValue<Partial<ColorSwatchProps>, DOMRefValue<HTMLDivElement>>>(null);\nexport const InternalColorSwatchContext = createContext<SpectrumColorSwatchContextValue | null>(null);\n\n/**\n * A ColorSwatch displays a preview of a selected color.\n */\nexport const ColorSwatch = forwardRef(function ColorSwatch(props: ColorSwatchProps, ref: DOMRef<HTMLDivElement>): JSX.Element {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchContext);\n  let domRef = useDOMRef(ref);\n  let ctx = useContext(InternalColorSwatchContext);\n  let {\n    size = ctx?.size || 'M',\n    rounding = ctx?.rounding || 'default',\n    color\n  } = props;\n  let nonNullValue = color || '#fff0';\n  color = useMemo(() => typeof nonNullValue === 'string' ? parseColor(nonNullValue) : nonNullValue, [nonNullValue]);\n\n  let swatch = (\n    <AriaColorSwatch\n      {...props}\n      color={color}\n      ref={domRef}\n      style={({color}) => ({\n        // TODO: should there be a distinction between transparent and no value (e.g. null)?\n        background: color.getChannelValue('alpha') > 0\n          ? `linear-gradient(${color}, ${color}), repeating-conic-gradient(#e6e6e6 0% 25%, white 0% 50%) 0% 50% / 16px 16px`\n          // Red slash to indicate there is no selected color.\n          : 'linear-gradient(to bottom right, transparent calc(50% - 2px), var(--slash-color) calc(50% - 2px) calc(50% + 2px), transparent calc(50% + 2px)) no-repeat'\n      })}\n      className={style({\n        size: {\n          size: {\n            XS: 16,\n            S: 24,\n            M: 32,\n            L: 40\n          }\n        },\n        borderRadius: {\n          rounding: {\n            default: 'sm',\n            none: 'none',\n            full: 'full'\n          }\n        },\n        borderColor: 'gray-1000/42',\n        borderWidth: 1,\n        borderStyle: 'solid',\n        boxSizing: 'border-box',\n        forcedColorAdjust: 'none',\n        '--slash-color': {\n          type: 'color',\n          value: 'red-900'\n        }\n      }, getAllowedOverrides({height: true}))({size, rounding}, props.styles)} />\n  );\n\n  // ColorSwatchPicker needs to wrap the swatch in a ListBoxItem.\n  if (ctx) {\n    return ctx.useWrapper(swatch, color, rounding);\n  }\n\n  return swatch;\n});\n"],"names":[],"version":3,"file":"ColorSwatch.mjs.map"}

package/dist/ColorSwatchPicker.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAgCM,MAAM,0DAA2B,CAAA,GAAA,0BAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,4CAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gCAAC,CAAA,GAAA,oDAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gCAAC,CAAA,GAAA,gDAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gCAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, ContextValue, SlotProps} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA+BM,MAAM,0DAA2B,CAAA,GAAA,0BAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,uBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,iDAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IAEvB,qBACE,gCAAC,CAAA,GAAA,4CAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gCAAC,CAAA,GAAA,oDAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gCAAC,CAAA,GAAA,gDAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gCAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.cjs.map"}

package/dist/ColorSwatchPicker.css.map

@@ -1 +1 @@
-{"mappings":"AC6D0C;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsBV;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAgBT;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtCmB;;AAsBV;EAAA;IAAA","sources":["26baf334ec196f8c","packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["@import \"e16c0c8e50c537a4\";\n@import \"6325f62168102e9d\";\n@import \"aa108d3a66fddade\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, ContextValue, SlotProps} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.css.map"}
+{"mappings":"AC4D0C;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAsBV;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAgBT;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAtCmB;;AAsBV;EAAA;IAAA","sources":["26baf334ec196f8c","packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["@import \"e16c0c8e50c537a4\";\n@import \"6325f62168102e9d\";\n@import \"aa108d3a66fddade\";\n","/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.css.map"}

package/dist/ColorSwatchPicker.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AAgCM,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gBAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gBAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gBAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, ContextValue, SlotProps} from 'react-aria-components';\nimport {Color} from '@react-types/color';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.mjs.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;AA+BM,MAAM,0DAA2B,CAAA,GAAA,oBAAY,EAA8E;AAK3H,MAAM,0DAAoB,CAAA,GAAA,iBAAS,EAAE,SAAS,kBAAkB,KAA6B,EAAE,GAA2B;IAC/H,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,WACF,UAAU,iBACV,OAAO,eACP,WAAW,QACX,GAAG,YACJ,GAAG;IACJ,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IAEvB,qBACE,gBAAC,CAAA,GAAA,wBAAoB;QAClB,GAAG,UAAU;QACd,KAAK;QACL,WAAW,MAAM,gBAAgB,GAAG;;;;;;;;;;;;;UAUV;qBAAC;QAAO,GAAG,MAAM,MAAM;kBACjD,cAAA,gBAAC,CAAA,GAAA,yCAAyB,EAAE,QAAQ;YAAC,OAAO;4BAAC;sBAAY;0BAAM;YAAQ;sBACpE,MAAM,QAAQ;;;AAIvB;AAEA,SAAS,iCAAW,MAAoB,EAAE,KAAY,EAAE,QAAsC;IAC5F,qBACE,gBAAC,CAAA,GAAA,4BAAwB;QACvB,OAAO;QACP,WAAW,CAAA,cAAe;;;;;;;;;;;;;;;;;;;;;;eAUvB;gBAAC,GAAG,WAAW;0BAAE;YAAQ;kBAC3B,CAAC,cAAC,UAAU,EAAC,iBAAM;;oBACjB;oBACA,4BACC,gBAAC;wBACC,aAAW;wBACX,SAAS;;;;;AAmBrB","sources":["packages/@react-spectrum/s2/src/ColorSwatchPicker.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ColorSwatchPicker as AriaColorSwatchPicker, ColorSwatchPickerItem as AriaColorSwatchPickerItem, Color, ContextValue, SlotProps} from 'react-aria-components';\nimport {ColorSwatchProps, InternalColorSwatchContext} from './ColorSwatch';\nimport {createContext, forwardRef, ReactElement, ReactNode} from 'react';\nimport {DOMRef, DOMRefValue, ValueBase} from '@react-types/shared';\nimport {focusRing, space, style} from '../style' with {type: 'macro'};\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ColorSwatchPickerProps extends ValueBase<string | Color, Color>, StyleProps, SlotProps {\n  /** The ColorSwatches within the ColorSwatchPicker. */\n  children: ReactNode,\n  /**\n   * The amount of padding between the swatches.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /**\n   * The size of the color swatches.\n   * @default 'M'\n   */\n  size?: 'XS' | 'S' | 'M' | 'L',\n  /**\n   * The corner rounding of the color swatches.\n   * @default 'none'\n   */\n  rounding?: 'none' | 'default' | 'full'\n}\n\nexport const ColorSwatchPickerContext = createContext<ContextValue<Partial<ColorSwatchPickerProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * A ColorSwatchPicker displays a list of color swatches and allows a user to select one of them.\n */\nexport const ColorSwatchPicker = forwardRef(function ColorSwatchPicker(props: ColorSwatchPickerProps, ref: DOMRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, ColorSwatchPickerContext);\n  let {\n    density = 'regular',\n    size = 'M',\n    rounding = 'none',\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n\n  return (\n    <AriaColorSwatchPicker\n      {...otherProps}\n      ref={domRef}\n      className={props.UNSAFE_className + style({\n        display: 'flex',\n        flexWrap: 'wrap',\n        gap: {\n          density: {\n            compact: space(2),\n            regular: 4,\n            spacious: space(6)\n          }\n        }\n      }, getAllowedOverrides())({density}, props.styles)}>\n      <InternalColorSwatchContext.Provider value={{useWrapper, size, rounding}}>\n        {props.children}\n      </InternalColorSwatchContext.Provider>\n    </AriaColorSwatchPicker>\n  );\n});\n\nfunction useWrapper(swatch: ReactElement, color: Color, rounding: ColorSwatchProps['rounding']) {\n  return (\n    <AriaColorSwatchPickerItem\n      color={color}\n      className={renderProps => style({\n        ...focusRing(),\n        position: 'relative',\n        borderRadius: {\n          rounding: {\n            none: 'none',\n            default: 'sm',\n            full: 'full'\n          }\n        }\n      })({...renderProps, rounding})}>\n      {({isSelected}) => (<>\n        {swatch}\n        {isSelected && (\n          <div\n            aria-hidden\n            className={style({\n              position: 'absolute',\n              pointerEvents: 'none',\n              inset: 0,\n              boxSizing: 'border-box',\n              borderColor: 'gray-900',\n              borderStyle: 'solid',\n              borderWidth: 2,\n              outlineColor: 'gray-25',\n              outlineStyle: 'solid',\n              outlineWidth: 2,\n              outlineOffset: -4,\n              forcedColorAdjust: 'none',\n              borderRadius: '[inherit]'\n            })} />\n        )}\n      </>)}\n    </AriaColorSwatchPickerItem>\n  );\n}\n"],"names":[],"version":3,"file":"ColorSwatchPicker.mjs.map"}

package/dist/TableView.cjs

@@ -15,7 +15,6 @@ var $ac757a4c2bd72aee$exports = require("../icons/useSpectrumContextProps.cjs");
 var $iLVc8$reactjsxruntime = require("react/jsx-runtime");
 var $iLVc8$reactariacomponents = require("react-aria-components");
 var $iLVc8$react = require("react");
-var $iLVc8$reactstatelyvirtualizer = require("@react-stately/virtualizer");
 var $iLVc8$reactspectrumutils = require("@react-spectrum/utils");
 var $iLVc8$reactariautils = require("@react-aria/utils");
 var $iLVc8$reactariai18n = require("@react-aria/i18n");
@@ -67,7 +66,6 @@ $parcel$export(module.exports, "Row", () => $bed37377ec7a3a9e$export$b59bdbef9ce
 
 
 
-
 let $bed37377ec7a3a9e$var$InternalTableContext = /*#__PURE__*/ (0, $iLVc8$react.createContext)({});
 const $bed37377ec7a3a9e$var$tableWrapper = " oo qo _0d __Ga __S-yksgrp Vc __wc __xc";
 const $bed37377ec7a3a9e$var$table = function anonymous(props, overrides) {
@@ -178,7 +176,7 @@ class $bed37377ec7a3a9e$export$4e03bdf0174fd602 extends (0, $iLVc8$reactariacomp
         layoutInfo.allowOverflow = true;
         // If loading or empty, we'll want the body to be sticky and centered
         if (children?.length === 0) {
-            layoutInfo.rect = new (0, $iLVc8$reactstatelyvirtualizer.Rect)(40, 40, this.virtualizer.visibleRect.width - 80, this.virtualizer.visibleRect.height - 80);
+            layoutInfo.rect = new (0, $iLVc8$reactariacomponents.Rect)(40, 40, this.virtualizer.visibleRect.width - 80, this.virtualizer.visibleRect.height - 80);
             layoutInfo.isSticky = true;
         }
         return {