@react-spectrum/card 3.0.0-alpha.45 → 3.0.0-alpha.46

package/dist/CardBase.main.js

@@ -1,4 +1,4 @@
-require("./card.370c5606.css");
+require("./card.4d5d6544.css");
 var $71570f0038472fa2$exports = require("./card_vars_css.main.js");
 var $e57ab98cef2f01a5$exports = require("./CardViewContext.main.js");
 var $1rjnI$reactspectrumcheckbox = require("@react-spectrum/checkbox");
@@ -44,7 +44,9 @@ const $7888205ff7de382f$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, ($parcel$int
     let context = (0, $e57ab98cef2f01a5$exports.useCardViewContext)() || {}; // we can call again here, won't change from Card.tsx
     let { state: state } = context;
     let manager = state === null || state === void 0 ? void 0 : state.selectionManager;
-    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {}, item: item, layout: layout, children: children } = props;
+    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {
+        role: 'article'
+    }, item: item, layout: layout, children: children } = props;
     let key = item === null || item === void 0 ? void 0 : item.key;
     let isSelected = manager === null || manager === void 0 ? void 0 : manager.isSelected(key);
     let isDisabled = state === null || state === void 0 ? void 0 : state.disabledKeys.has(key);
@@ -137,7 +139,7 @@ const $7888205ff7de382f$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, ($parcel$int
     ]);
     return /*#__PURE__*/ (0, ($parcel$interopDefault($1rjnI$react))).createElement((0, $1rjnI$reactariafocus.FocusRing), {
         focusRingClass: (0, $1rjnI$reactspectrumutils.classNames)((0, ($parcel$interopDefault($71570f0038472fa2$exports))), 'focus-ring')
-    }, /*#__PURE__*/ (0, ($parcel$interopDefault($1rjnI$react))).createElement("article", {
+    }, /*#__PURE__*/ (0, ($parcel$interopDefault($1rjnI$react))).createElement("div", {
         ...styleProps,
         ...(0, $1rjnI$reactariautils.mergeProps)(cardProps, focusWithinProps, hoverProps, (0, $1rjnI$reactariautils.filterDOMProps)(props), articleProps),
         ref: domRef,

package/dist/CardBase.main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["// @ts-nocheck\n/*\n * Copyright 2021 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 {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n  articleProps?: HTMLAttributes<HTMLElement>,\n  item?: Node<T>\n}\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardBase = React.forwardRef(function CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n  let {state} = context;\n  let manager = state?.selectionManager;\n  let {\n    isQuiet,\n    orientation = 'vertical',\n    articleProps = {},\n    item,\n    layout,\n    children\n  } = props;\n\n  let key = item?.key;\n  let isSelected = manager?.isSelected(key);\n  let isDisabled = state?.disabledKeys.has(key);\n  let onChange = () => manager?.select(key);\n\n  let {styleProps} = useStyleProps(props);\n  let {cardProps, titleProps, contentProps} = useCard(props);\n  let domRef = useDOMRef(ref);\n  let gridRef = useRef<HTMLDivElement>(undefined);\n  let checkboxRef = useRef(null);\n\n  // cards are only interactive if there is a selection manager and it allows selection\n  let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusWithinProps} = useFocusWithin({\n    onFocusWithinChange: setIsFocused,\n    isDisabled\n  });\n\n  // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n  let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n  let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n  let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n  // this is for horizontal cards\n  let [height, setHeight] = useState(NaN);\n  let updateHeight = useCallback(() => {\n    if (orientation !== 'horizontal') {\n      return;\n    }\n\n    let cardHeight = gridRef.current.getBoundingClientRect().height;\n    setHeight(cardHeight);\n  }, [orientation, gridRef, setHeight]);\n  useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n  let aspectRatioEnforce = undefined;\n  if (orientation === 'horizontal' && !isNaN(height)) {\n    aspectRatioEnforce = {\n      height: `${height}px`,\n      width: `${height}px`\n    };\n  }\n\n  let slots = useMemo(() => ({\n    image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n    illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n    avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n    heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n    content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n    detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n          console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n          break;\n        }\n        nextNode = walker.nextNode();\n      }\n    }\n  }, [children]);\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <article\n        {...styleProps}\n        {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n        ref={domRef}\n        className={classNames(styles, 'spectrum-Card', {\n          'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--horizontal': orientation === 'horizontal',\n          'spectrum-Card--noPreview': !hasPreview,\n          'is-hovered': isHovered,\n          'is-focused': isFocused,\n          'is-selected': isSelected,\n          'spectrum-Card--waterfall': layout === 'waterfall',\n          'spectrum-Card--gallery': layout === 'gallery',\n          'spectrum-Card--grid': layout === 'grid',\n          'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n        }, styleProps.className)}>\n        <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n          {manager && manager.selectionMode !== 'none' && (\n            <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n              <Checkbox\n                ref={checkboxRef}\n                isDisabled={isDisabled}\n                excludeFromTabOrder\n                isSelected={isSelected}\n                onChange={onChange}\n                UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n                isEmphasized\n                aria-label=\"select\" />\n            </div>\n          )}\n          <SlotProvider slots={slots}>\n            {children}\n          </SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </article>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n  cardProps: HTMLAttributes<HTMLDivElement>,\n  titleProps: HTMLAttributes<HTMLDivElement>,\n  contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n  let titleId = useSlotId();\n  let descriptionId = useSlotId();\n  let titleProps = useMemo(() => ({\n    id: titleId\n  }), [titleId]);\n  let contentProps = useMemo(() => ({\n    id: descriptionId\n  }), [descriptionId]);\n\n  return {\n    cardProps: {\n      ...filterDOMProps(props),\n      'aria-labelledby': titleId,\n      'aria-describedby': descriptionId,\n      tabIndex: 0\n    },\n    titleProps,\n    contentProps\n  };\n}\n"],"names":[],"version":3,"file":"CardBase.main.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["// @ts-nocheck\n/*\n * Copyright 2021 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 {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n  articleProps?: HTMLAttributes<HTMLElement>,\n  item?: Node<T>\n}\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardBase = React.forwardRef(function CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n  let {state} = context;\n  let manager = state?.selectionManager;\n  let {\n    isQuiet,\n    orientation = 'vertical',\n    articleProps = {role: 'article'},\n    item,\n    layout,\n    children\n  } = props;\n\n  let key = item?.key;\n  let isSelected = manager?.isSelected(key);\n  let isDisabled = state?.disabledKeys.has(key);\n  let onChange = () => manager?.select(key);\n\n  let {styleProps} = useStyleProps(props);\n  let {cardProps, titleProps, contentProps} = useCard(props);\n  let domRef = useDOMRef(ref);\n  let gridRef = useRef<HTMLDivElement>(undefined);\n  let checkboxRef = useRef(null);\n\n  // cards are only interactive if there is a selection manager and it allows selection\n  let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusWithinProps} = useFocusWithin({\n    onFocusWithinChange: setIsFocused,\n    isDisabled\n  });\n\n  // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n  let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n  let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n  let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n  // this is for horizontal cards\n  let [height, setHeight] = useState(NaN);\n  let updateHeight = useCallback(() => {\n    if (orientation !== 'horizontal') {\n      return;\n    }\n\n    let cardHeight = gridRef.current.getBoundingClientRect().height;\n    setHeight(cardHeight);\n  }, [orientation, gridRef, setHeight]);\n  useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n  let aspectRatioEnforce = undefined;\n  if (orientation === 'horizontal' && !isNaN(height)) {\n    aspectRatioEnforce = {\n      height: `${height}px`,\n      width: `${height}px`\n    };\n  }\n\n  let slots = useMemo(() => ({\n    image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n    illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n    avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n    heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n    content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n    detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n          console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n          break;\n        }\n        nextNode = walker.nextNode();\n      }\n    }\n  }, [children]);\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <div\n        {...styleProps}\n        {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n        ref={domRef}\n        className={classNames(styles, 'spectrum-Card', {\n          'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--horizontal': orientation === 'horizontal',\n          'spectrum-Card--noPreview': !hasPreview,\n          'is-hovered': isHovered,\n          'is-focused': isFocused,\n          'is-selected': isSelected,\n          'spectrum-Card--waterfall': layout === 'waterfall',\n          'spectrum-Card--gallery': layout === 'gallery',\n          'spectrum-Card--grid': layout === 'grid',\n          'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n        }, styleProps.className)}>\n        <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n          {manager && manager.selectionMode !== 'none' && (\n            <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n              <Checkbox\n                ref={checkboxRef}\n                isDisabled={isDisabled}\n                excludeFromTabOrder\n                isSelected={isSelected}\n                onChange={onChange}\n                UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n                isEmphasized\n                aria-label=\"select\" />\n            </div>\n          )}\n          <SlotProvider slots={slots}>\n            {children}\n          </SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n  cardProps: HTMLAttributes<HTMLDivElement>,\n  titleProps: HTMLAttributes<HTMLDivElement>,\n  contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n  let titleId = useSlotId();\n  let descriptionId = useSlotId();\n  let titleProps = useMemo(() => ({\n    id: titleId\n  }), [titleId]);\n  let contentProps = useMemo(() => ({\n    id: descriptionId\n  }), [descriptionId]);\n\n  return {\n    cardProps: {\n      ...filterDOMProps(props),\n      'aria-labelledby': titleId,\n      'aria-describedby': descriptionId,\n      tabIndex: 0\n    },\n    titleProps,\n    contentProps\n  };\n}\n"],"names":[],"version":3,"file":"CardBase.main.js.map"}

package/dist/CardBase.mjs

@@ -1,4 +1,4 @@
-import "./card.370c5606.css";
+import "./card.4d5d6544.css";
 import $8eFIe$card_vars_cssmodulejs from "./card_vars_css.mjs";
 import {useCardViewContext as $8d180a244893de14$export$fea0b38586ec8f13} from "./CardViewContext.mjs";
 import {Checkbox as $8eFIe$Checkbox} from "@react-spectrum/checkbox";
@@ -38,7 +38,9 @@ const $643dd8fa80926f94$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $8eFIe$react
     let context = (0, $8d180a244893de14$export$fea0b38586ec8f13)() || {}; // we can call again here, won't change from Card.tsx
     let { state: state } = context;
     let manager = state === null || state === void 0 ? void 0 : state.selectionManager;
-    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {}, item: item, layout: layout, children: children } = props;
+    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {
+        role: 'article'
+    }, item: item, layout: layout, children: children } = props;
     let key = item === null || item === void 0 ? void 0 : item.key;
     let isSelected = manager === null || manager === void 0 ? void 0 : manager.isSelected(key);
     let isDisabled = state === null || state === void 0 ? void 0 : state.disabledKeys.has(key);
@@ -131,7 +133,7 @@ const $643dd8fa80926f94$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $8eFIe$react
     ]);
     return /*#__PURE__*/ (0, $8eFIe$react).createElement((0, $8eFIe$FocusRing), {
         focusRingClass: (0, $8eFIe$classNames)((0, ($parcel$interopDefault($8eFIe$card_vars_cssmodulejs))), 'focus-ring')
-    }, /*#__PURE__*/ (0, $8eFIe$react).createElement("article", {
+    }, /*#__PURE__*/ (0, $8eFIe$react).createElement("div", {
         ...styleProps,
         ...(0, $8eFIe$mergeProps)(cardProps, focusWithinProps, hoverProps, (0, $8eFIe$filterDOMProps)(props), articleProps),
         ref: domRef,

package/dist/CardBase.module.js

@@ -1,4 +1,4 @@
-import "./card.370c5606.css";
+import "./card.4d5d6544.css";
 import $8eFIe$card_vars_cssmodulejs from "./card_vars_css.module.js";
 import {useCardViewContext as $8d180a244893de14$export$fea0b38586ec8f13} from "./CardViewContext.module.js";
 import {Checkbox as $8eFIe$Checkbox} from "@react-spectrum/checkbox";
@@ -38,7 +38,9 @@ const $643dd8fa80926f94$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $8eFIe$react
     let context = (0, $8d180a244893de14$export$fea0b38586ec8f13)() || {}; // we can call again here, won't change from Card.tsx
     let { state: state } = context;
     let manager = state === null || state === void 0 ? void 0 : state.selectionManager;
-    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {}, item: item, layout: layout, children: children } = props;
+    let { isQuiet: isQuiet, orientation: orientation = 'vertical', articleProps: articleProps = {
+        role: 'article'
+    }, item: item, layout: layout, children: children } = props;
     let key = item === null || item === void 0 ? void 0 : item.key;
     let isSelected = manager === null || manager === void 0 ? void 0 : manager.isSelected(key);
     let isDisabled = state === null || state === void 0 ? void 0 : state.disabledKeys.has(key);
@@ -131,7 +133,7 @@ const $643dd8fa80926f94$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $8eFIe$react
     ]);
     return /*#__PURE__*/ (0, $8eFIe$react).createElement((0, $8eFIe$FocusRing), {
         focusRingClass: (0, $8eFIe$classNames)((0, ($parcel$interopDefault($8eFIe$card_vars_cssmodulejs))), 'focus-ring')
-    }, /*#__PURE__*/ (0, $8eFIe$react).createElement("article", {
+    }, /*#__PURE__*/ (0, $8eFIe$react).createElement("div", {
         ...styleProps,
         ...(0, $8eFIe$mergeProps)(cardProps, focusWithinProps, hoverProps, (0, $8eFIe$filterDOMProps)(props), articleProps),
         ref: domRef,

package/dist/CardBase.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;AAAA,cAAc;AACd;;;;;;;;;;CAUC;;;;;;;;;AAsBM,MAAM,0DAAW,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,SAA2B,KAAuB,EAAE,GAA2B;IAC/H,QAAQ,CAAA,GAAA,uBAAe,EAAE;IACzB,IAAI,UAAU,CAAA,GAAA,yCAAiB,OAAO,CAAC,GAAG,qDAAqD;IAC/F,IAAI,SAAC,KAAK,EAAC,GAAG;IACd,IAAI,UAAU,kBAAA,4BAAA,MAAO,gBAAgB;IACrC,IAAI,WACF,OAAO,eACP,cAAc,0BACd,eAAe,CAAC,SAChB,IAAI,UACJ,MAAM,YACN,QAAQ,EACT,GAAG;IAEJ,IAAI,MAAM,iBAAA,2BAAA,KAAM,GAAG;IACnB,IAAI,aAAa,oBAAA,8BAAA,QAAS,UAAU,CAAC;IACrC,IAAI,aAAa,kBAAA,4BAAA,MAAO,YAAY,CAAC,GAAG,CAAC;IACzC,IAAI,WAAW,IAAM,oBAAA,8BAAA,QAAS,MAAM,CAAC;IAErC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,oBAAY,EAAE;IACjC,IAAI,aAAC,SAAS,cAAE,UAAU,gBAAE,YAAY,EAAC,GAAG,8BAAQ;IACpD,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,UAAU,CAAA,GAAA,aAAK,EAAkB;IACrC,IAAI,cAAc,CAAA,GAAA,aAAK,EAAE;IAEzB,qFAAqF;IACrF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAAC,YAAY,YAAY,aAAa,CAAA,oBAAA,8BAAA,QAAS,aAAa,MAAK,UAAU;IAAU;IAC5H,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,eAAO,EAAE;IACzC,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,qBAAa,EAAE;QACtC,qBAAqB;oBACrB;IACF;IAEA,wGAAwG;IACxG,IAAI,kBAAkB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,sDAAK,CAAC,CAAC,sBAAsB,EAAE,EAAE;IACvE,IAAI,yBAAyB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,sDAAK,CAAC,CAAC,6BAA6B,EAAE,EAAE;IACrF,IAAI,aAAa,mBAAmB;IAEpC,+BAA+B;IAC/B,IAAI,CAAC,QAAQ,UAAU,GAAG,CAAA,GAAA,eAAO,EAAE;IACnC,IAAI,eAAe,CAAA,GAAA,kBAAU,EAAE;QAC7B,IAAI,gBAAgB,cAClB;QAGF,IAAI,aAAa,QAAQ,OAAO,CAAC,qBAAqB,GAAG,MAAM;QAC/D,UAAU;IACZ,GAAG;QAAC;QAAa;QAAS;KAAU;IACpC,CAAA,GAAA,wBAAgB,EAAE;QAAC,KAAK;QAAS,UAAU;IAAY;IAEvD,IAAI,qBAAqB;IACzB,IAAI,gBAAgB,gBAAgB,CAAC,MAAM,SACzC,qBAAqB;QACnB,QAAQ,GAAG,OAAO,EAAE,CAAC;QACrB,OAAO,GAAG,OAAO,EAAE,CAAC;IACtB;IAGF,IAAI,QAAQ,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YACzB,OAAO;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAAwB,WAAW,gBAAgB,eAAe,UAAU;gBAAW,KAAK;gBAAI,GAAG,kBAAkB;YAAA;YAClK,cAAc;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA+B,GAAG,kBAAkB;YAAA;YACxG,QAAQ;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAAyB,MAAM;YAAiB;YAC9F,SAAS;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA0B,GAAG,UAAU;YAAA;YACtF,SAAS;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;gBAA0B,GAAG,YAAY;YAAA;YACxF,QAAQ;gBAAC,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;YAAuB;QAEvE,CAAA,GAAI;QAAC;QAAY;QAAc;QAAQ;QAAS;KAAY;IAE5D,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,oBAAA,8BAAA,QAAS,OAAO,EAAE;YACpB,IAAI,SAAS,CAAA,GAAA,6BAAqB,EAAE,QAAQ,OAAO;YACnD,IAAI,WAAW,OAAO,QAAQ;YAC9B,MAAO,YAAY,KAAM;gBACvB,IAAI,YAAY,OAAO,IAAI,CAAC,YAAY,OAAO,CAAC,iBAAiB,GAAG,QAAQ,CAAC,WAAW;oBACtF,QAAQ,IAAI,CAAC;oBACb;gBACF;gBACA,WAAW,OAAO,QAAQ;YAC5B;QACF;IACF,GAAG;QAAC;KAAS;IAEb,qBACE,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;qBAC5C,gCAAC;QACE,GAAG,UAAU;QACb,GAAG,CAAA,GAAA,iBAAS,EAAE,WAAW,kBAAkB,YAAY,CAAA,GAAA,qBAAa,EAAE,QAAQ,aAAa;QAC5F,KAAK;QACL,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG,iBAAiB;YAC7C,0BAA0B,CAAC,WAAW,gBAAgB;YACtD,0BAA0B,WAAW,gBAAgB;YACrD,6BAA6B,gBAAgB;YAC7C,4BAA4B,CAAC;YAC7B,cAAc;YACd,cAAc;YACd,eAAe;YACf,4BAA4B,WAAW;YACvC,0BAA0B,WAAW;YACrC,uBAAuB,WAAW;YAClC,2BAA2B,WAAW,eAAe,WAAW,aAAa,WAAW;QAC1F,GAAG,WAAW,SAAS;qBACvB,gCAAC;QAAI,KAAK;QAAS,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;OAC9C,WAAW,QAAQ,aAAa,KAAK,wBACpC,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;qBACjC,gCAAC,CAAA,GAAA,eAAO;QACN,KAAK;QACL,YAAY;QACZ,qBAAA;QACA,YAAY;QACZ,UAAU;QACV,kBAAkB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;QACrC,cAAA;QACA,cAAW;uBAGjB,gCAAC,CAAA,GAAA,mBAAW;QAAE,OAAO;OAClB,yBAEH,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,sDAAK,GAAG;;AAK7C;AAWA,SAAS,8BAAQ,KAAsB;IACrC,IAAI,UAAU,CAAA,GAAA,gBAAQ;IACtB,IAAI,gBAAgB,CAAA,GAAA,gBAAQ;IAC5B,IAAI,aAAa,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YAC9B,IAAI;QACN,CAAA,GAAI;QAAC;KAAQ;IACb,IAAI,eAAe,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;YAChC,IAAI;QACN,CAAA,GAAI;QAAC;KAAc;IAEnB,OAAO;QACL,WAAW;YACT,GAAG,CAAA,GAAA,qBAAa,EAAE,MAAM;YACxB,mBAAmB;YACnB,oBAAoB;YACpB,UAAU;QACZ;oBACA;sBACA;IACF;AACF","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["// @ts-nocheck\n/*\n * Copyright 2021 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 {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n  articleProps?: HTMLAttributes<HTMLElement>,\n  item?: Node<T>\n}\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardBase = React.forwardRef(function CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n  let {state} = context;\n  let manager = state?.selectionManager;\n  let {\n    isQuiet,\n    orientation = 'vertical',\n    articleProps = {},\n    item,\n    layout,\n    children\n  } = props;\n\n  let key = item?.key;\n  let isSelected = manager?.isSelected(key);\n  let isDisabled = state?.disabledKeys.has(key);\n  let onChange = () => manager?.select(key);\n\n  let {styleProps} = useStyleProps(props);\n  let {cardProps, titleProps, contentProps} = useCard(props);\n  let domRef = useDOMRef(ref);\n  let gridRef = useRef<HTMLDivElement>(undefined);\n  let checkboxRef = useRef(null);\n\n  // cards are only interactive if there is a selection manager and it allows selection\n  let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusWithinProps} = useFocusWithin({\n    onFocusWithinChange: setIsFocused,\n    isDisabled\n  });\n\n  // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n  let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n  let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n  let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n  // this is for horizontal cards\n  let [height, setHeight] = useState(NaN);\n  let updateHeight = useCallback(() => {\n    if (orientation !== 'horizontal') {\n      return;\n    }\n\n    let cardHeight = gridRef.current.getBoundingClientRect().height;\n    setHeight(cardHeight);\n  }, [orientation, gridRef, setHeight]);\n  useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n  let aspectRatioEnforce = undefined;\n  if (orientation === 'horizontal' && !isNaN(height)) {\n    aspectRatioEnforce = {\n      height: `${height}px`,\n      width: `${height}px`\n    };\n  }\n\n  let slots = useMemo(() => ({\n    image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n    illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n    avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n    heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n    content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n    detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n          console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n          break;\n        }\n        nextNode = walker.nextNode();\n      }\n    }\n  }, [children]);\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <article\n        {...styleProps}\n        {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n        ref={domRef}\n        className={classNames(styles, 'spectrum-Card', {\n          'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--horizontal': orientation === 'horizontal',\n          'spectrum-Card--noPreview': !hasPreview,\n          'is-hovered': isHovered,\n          'is-focused': isFocused,\n          'is-selected': isSelected,\n          'spectrum-Card--waterfall': layout === 'waterfall',\n          'spectrum-Card--gallery': layout === 'gallery',\n          'spectrum-Card--grid': layout === 'grid',\n          'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n        }, styleProps.className)}>\n        <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n          {manager && manager.selectionMode !== 'none' && (\n            <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n              <Checkbox\n                ref={checkboxRef}\n                isDisabled={isDisabled}\n                excludeFromTabOrder\n                isSelected={isSelected}\n                onChange={onChange}\n                UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n                isEmphasized\n                aria-label=\"select\" />\n            </div>\n          )}\n          <SlotProvider slots={slots}>\n            {children}\n          </SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </article>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n  cardProps: HTMLAttributes<HTMLDivElement>,\n  titleProps: HTMLAttributes<HTMLDivElement>,\n  contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n  let titleId = useSlotId();\n  let descriptionId = useSlotId();\n  let titleProps = useMemo(() => ({\n    id: titleId\n  }), [titleId]);\n  let contentProps = useMemo(() => ({\n    id: descriptionId\n  }), [descriptionId]);\n\n  return {\n    cardProps: {\n      ...filterDOMProps(props),\n      'aria-labelledby': titleId,\n      'aria-describedby': descriptionId,\n      tabIndex: 0\n    },\n    titleProps,\n    contentProps\n  };\n}\n"],"names":[],"version":3,"file":"CardBase.module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/card/src/CardBase.tsx"],"sourcesContent":["// @ts-nocheck\n/*\n * Copyright 2021 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 {AriaCardProps, SpectrumCardProps} from '@react-types/card';\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport {classNames, SlotProvider, useDOMRef, useHasChild, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps, mergeProps, useLayoutEffect, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {FocusRing, getFocusableTreeWalker} from '@react-aria/focus';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useFocusWithin, useHover} from '@react-aria/interactions';\nimport {useProviderProps} from '@react-spectrum/provider';\n\ninterface CardBaseProps<T> extends SpectrumCardProps {\n  articleProps?: HTMLAttributes<HTMLElement>,\n  item?: Node<T>\n}\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardBase = React.forwardRef(function CardBase<T extends object>(props: CardBaseProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let context = useCardViewContext() || {}; // we can call again here, won't change from Card.tsx\n  let {state} = context;\n  let manager = state?.selectionManager;\n  let {\n    isQuiet,\n    orientation = 'vertical',\n    articleProps = {role: 'article'},\n    item,\n    layout,\n    children\n  } = props;\n\n  let key = item?.key;\n  let isSelected = manager?.isSelected(key);\n  let isDisabled = state?.disabledKeys.has(key);\n  let onChange = () => manager?.select(key);\n\n  let {styleProps} = useStyleProps(props);\n  let {cardProps, titleProps, contentProps} = useCard(props);\n  let domRef = useDOMRef(ref);\n  let gridRef = useRef<HTMLDivElement>(undefined);\n  let checkboxRef = useRef(null);\n\n  // cards are only interactive if there is a selection manager and it allows selection\n  let {hoverProps, isHovered} = useHover({isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled});\n  let [isFocused, setIsFocused] = useState(false);\n  let {focusWithinProps} = useFocusWithin({\n    onFocusWithinChange: setIsFocused,\n    isDisabled\n  });\n\n  // ToDo: see css for comment about avatar under selector .spectrum-Card--noLayout.spectrum-Card--default\n  let hasPreviewImage = useHasChild(`.${styles['spectrum-Card-image']}`, gridRef);\n  let hasPreviewIllustration = useHasChild(`.${styles['spectrum-Card-illustration']}`, gridRef);\n  let hasPreview = hasPreviewImage || hasPreviewIllustration;\n\n  // this is for horizontal cards\n  let [height, setHeight] = useState(NaN);\n  let updateHeight = useCallback(() => {\n    if (orientation !== 'horizontal') {\n      return;\n    }\n\n    let cardHeight = gridRef.current.getBoundingClientRect().height;\n    setHeight(cardHeight);\n  }, [orientation, gridRef, setHeight]);\n  useResizeObserver({ref: gridRef, onResize: updateHeight});\n\n  let aspectRatioEnforce = undefined;\n  if (orientation === 'horizontal' && !isNaN(height)) {\n    aspectRatioEnforce = {\n      height: `${height}px`,\n      width: `${height}px`\n    };\n  }\n\n  let slots = useMemo(() => ({\n    image: {UNSAFE_className: classNames(styles, 'spectrum-Card-image'), objectFit: orientation === 'horizontal' ? 'cover' : 'contain', alt: '', ...aspectRatioEnforce},\n    illustration: {UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'), ...aspectRatioEnforce},\n    avatar: {UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'), size: 'avatar-size-400'},\n    heading: {UNSAFE_className: classNames(styles, 'spectrum-Card-heading'), ...titleProps},\n    content: {UNSAFE_className: classNames(styles, 'spectrum-Card-content'), ...contentProps},\n    detail: {UNSAFE_className: classNames(styles, 'spectrum-Card-detail')}\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }), [titleProps, contentProps, height, isQuiet, orientation]);\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (checkboxRef.current && !checkboxRef.current.UNSAFE_getDOMNode().contains(nextNode)) {\n          console.warn('Card does not support focusable elements, please contact the team regarding your use case.');\n          break;\n        }\n        nextNode = walker.nextNode();\n      }\n    }\n  }, [children]);\n\n  return (\n    <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>\n      <div\n        {...styleProps}\n        {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}\n        ref={domRef}\n        className={classNames(styles, 'spectrum-Card', {\n          'spectrum-Card--default': !isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--isQuiet': isQuiet && orientation !== 'horizontal',\n          'spectrum-Card--horizontal': orientation === 'horizontal',\n          'spectrum-Card--noPreview': !hasPreview,\n          'is-hovered': isHovered,\n          'is-focused': isFocused,\n          'is-selected': isSelected,\n          'spectrum-Card--waterfall': layout === 'waterfall',\n          'spectrum-Card--gallery': layout === 'gallery',\n          'spectrum-Card--grid': layout === 'grid',\n          'spectrum-Card--noLayout': layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n        }, styleProps.className)}>\n        <div ref={gridRef} className={classNames(styles, 'spectrum-Card-grid')}>\n          {manager && manager.selectionMode !== 'none' && (\n            <div className={classNames(styles, 'spectrum-Card-checkboxWrapper')}>\n              <Checkbox\n                ref={checkboxRef}\n                isDisabled={isDisabled}\n                excludeFromTabOrder\n                isSelected={isSelected}\n                onChange={onChange}\n                UNSAFE_className={classNames(styles, 'spectrum-Card-checkbox')}\n                isEmphasized\n                aria-label=\"select\" />\n            </div>\n          )}\n          <SlotProvider slots={slots}>\n            {children}\n          </SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {\n}\n\ninterface CardAria {\n  cardProps: HTMLAttributes<HTMLDivElement>,\n  titleProps: HTMLAttributes<HTMLDivElement>,\n  contentProps: HTMLAttributes<HTMLDivElement>\n}\n\nfunction useCard(props: AriaCardOptions): CardAria {\n  let titleId = useSlotId();\n  let descriptionId = useSlotId();\n  let titleProps = useMemo(() => ({\n    id: titleId\n  }), [titleId]);\n  let contentProps = useMemo(() => ({\n    id: descriptionId\n  }), [descriptionId]);\n\n  return {\n    cardProps: {\n      ...filterDOMProps(props),\n      'aria-labelledby': titleId,\n      'aria-describedby': descriptionId,\n      tabIndex: 0\n    },\n    titleProps,\n    contentProps\n  };\n}\n"],"names":[],"version":3,"file":"CardBase.module.js.map"}

package/dist/CardView.main.js

@@ -1,7 +1,7 @@
 var $7888205ff7de382f$exports = require("./CardBase.main.js");
 var $e57ab98cef2f01a5$exports = require("./CardViewContext.main.js");
 var $85c597beff94758b$exports = require("./intlStrings.main.js");
-require("./card.370c5606.css");
+require("./card.4d5d6544.css");
 var $71570f0038472fa2$exports = require("./card_vars_css.main.js");
 var $kFdxB$reactspectrumutils = require("@react-spectrum/utils");
 var $kFdxB$reactstatelygrid = require("@react-stately/grid");

package/dist/CardView.mjs

@@ -1,7 +1,7 @@
 import {CardBase as $643dd8fa80926f94$export$7a6ccaf429ad93a8} from "./CardBase.mjs";
 import {CardViewContext as $8d180a244893de14$export$64992ac69f286e5c, useCardViewContext as $8d180a244893de14$export$fea0b38586ec8f13} from "./CardViewContext.mjs";
 import $iOsT7$intlStringsmodulejs from "./intlStrings.mjs";
-import "./card.370c5606.css";
+import "./card.4d5d6544.css";
 import $iOsT7$card_vars_cssmodulejs from "./card_vars_css.mjs";
 import {useStyleProps as $iOsT7$useStyleProps, useDOMRef as $iOsT7$useDOMRef, classNames as $iOsT7$classNames, useUnwrapDOMRef as $iOsT7$useUnwrapDOMRef} from "@react-spectrum/utils";
 import {GridCollection as $iOsT7$GridCollection, useGridState as $iOsT7$useGridState} from "@react-stately/grid";

package/dist/CardView.module.js

@@ -1,7 +1,7 @@
 import {CardBase as $643dd8fa80926f94$export$7a6ccaf429ad93a8} from "./CardBase.module.js";
 import {CardViewContext as $8d180a244893de14$export$64992ac69f286e5c, useCardViewContext as $8d180a244893de14$export$fea0b38586ec8f13} from "./CardViewContext.module.js";
 import $iOsT7$intlStringsmodulejs from "./intlStrings.module.js";
-import "./card.370c5606.css";
+import "./card.4d5d6544.css";
 import $iOsT7$card_vars_cssmodulejs from "./card_vars_css.module.js";
 import {useStyleProps as $iOsT7$useStyleProps, useDOMRef as $iOsT7$useDOMRef, classNames as $iOsT7$classNames, useUnwrapDOMRef as $iOsT7$useUnwrapDOMRef} from "@react-spectrum/utils";
 import {GridCollection as $iOsT7$GridCollection, useGridState as $iOsT7$useGridState} from "@react-stately/grid";

package/dist/{card.370c5606.css → card.4d5d6544.css}

@@ -183,13 +183,6 @@
   display: none;
 }
 
-.NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--default {
-  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
-  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
-  border-style: solid;
-  position: relative;
-}
-
 .NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--default .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -199,6 +192,13 @@
   pointer-events: none;
 }
 
+.NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--default {
+  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
+  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
+  border-style: solid;
+  position: relative;
+}
+
 .NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--default:before {
   content: " ";
   border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
@@ -404,13 +404,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--default {
-  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
-  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
-  border-style: solid;
-  position: relative;
-}
-
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--default .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -420,6 +413,13 @@
   pointer-events: none;
 }
 
+.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--default {
+  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
+  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
+  border-style: solid;
+  position: relative;
+}
+
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--default:before {
   content: " ";
   border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
@@ -628,13 +628,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--default {
-  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
-  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
-  border-style: solid;
-  position: relative;
-}
-
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--default .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -644,6 +637,13 @@
   pointer-events: none;
 }
 
+.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--default {
+  border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
+  border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
+  border-style: solid;
+  position: relative;
+}
+
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--default:before {
   content: " ";
   border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
@@ -850,10 +850,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--isQuiet {
-  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
-}
-
 .NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -866,6 +862,10 @@
   z-index: 2;
 }
 
+.NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--isQuiet {
+  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
+}
+
 .NOE1la_spectrum-Card--waterfall.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-grid {
   grid-template-columns: minmax(0, auto) minmax(var(--spectrum-global-dimension-size-500), 1fr) minmax(0, auto);
   grid-template-rows: minmax(var(--spectrum-card-coverphoto-height, var(--spectrum-global-dimension-size-1700)), 1fr) var(--spectrum-card-quiet-body-header-margin-top, var(--spectrum-global-dimension-size-175)) minmax(var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height)), auto) auto;
@@ -929,10 +929,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--gallery.NOE1la_spectrum-Card--isQuiet {
-  min-inline-size: 0;
-}
-
 .NOE1la_spectrum-Card--gallery.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -945,6 +941,10 @@
   z-index: 2;
 }
 
+.NOE1la_spectrum-Card--gallery.NOE1la_spectrum-Card--isQuiet {
+  min-inline-size: 0;
+}
+
 .NOE1la_spectrum-Card--gallery.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-grid {
   grid-template-columns: minmax(0, auto) minmax(var(--spectrum-global-dimension-size-500), 1fr) minmax(0, auto);
   grid-template-rows: 1fr var(--spectrum-card-quiet-body-header-margin-top, var(--spectrum-global-dimension-size-175)) var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height)) var(--spectrum-alias-single-line-height, var(--spectrum-global-dimension-size-400));
@@ -1028,10 +1028,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--isQuiet {
-  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
-}
-
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -1044,6 +1040,10 @@
   z-index: 2;
 }
 
+.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--isQuiet {
+  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
+}
+
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-grid {
   grid-template-columns: minmax(0, auto) minmax(var(--spectrum-global-dimension-size-500), 1fr) minmax(0, auto);
   grid-template-rows: auto var(--spectrum-card-quiet-body-header-margin-top, var(--spectrum-global-dimension-size-175)) minmax(var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height)), auto) var(--spectrum-alias-single-line-height, var(--spectrum-global-dimension-size-400)) 1fr;
@@ -1119,10 +1119,6 @@
   margin-block-end: 5px;
 }
 
-.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--isQuiet {
-  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
-}
-
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-checkboxWrapper {
   z-index: 3;
 }
@@ -1135,6 +1131,10 @@
   z-index: 2;
 }
 
+.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--isQuiet {
+  min-inline-size: var(--spectrum-card-quiet-min-size, var(--spectrum-global-dimension-size-1700));
+}
+
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--isQuiet .NOE1la_spectrum-Card-grid {
   grid-template-columns: minmax(0, auto) minmax(var(--spectrum-global-dimension-size-500), 1fr) minmax(0, auto);
   grid-template-rows: auto var(--spectrum-card-quiet-body-header-margin-top, var(--spectrum-global-dimension-size-175)) minmax(var(--spectrum-actionbutton-height, var(--spectrum-alias-single-line-height)), auto) auto var(--spectrum-card-body-padding-bottom, var(--spectrum-global-dimension-size-250));
@@ -1206,16 +1206,16 @@
   margin-block-end: 5px;
 }
 
+.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-grid:after {
+  z-index: 2;
+}
+
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal {
   border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
   border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
   border-style: solid;
 }
 
-.NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-grid:after {
-  z-index: 2;
-}
-
 .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal.NOE1la_is-focused .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal.NOE1la_is-selected .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--grid.NOE1la_spectrum-Card--horizontal.NOE1la_is-hovered .NOE1la_spectrum-Card-checkboxWrapper {
   display: none;
 }
@@ -1324,16 +1324,16 @@
   overflow: hidden;
 }
 
+.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-grid:after {
+  z-index: 2;
+}
+
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal {
   border-width: var(--spectrum-card-border-size, var(--spectrum-alias-border-size-thin));
   border-radius: var(--spectrum-card-border-radius, var(--spectrum-alias-border-radius-regular));
   border-style: solid;
 }
 
-.NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-grid:after {
-  z-index: 2;
-}
-
 .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal.NOE1la_is-focused .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal.NOE1la_is-selected .NOE1la_spectrum-Card-checkboxWrapper, .NOE1la_spectrum-Card--noLayout.NOE1la_spectrum-Card--horizontal.NOE1la_is-hovered .NOE1la_spectrum-Card-checkboxWrapper {
   display: none;
 }
@@ -1668,4 +1668,4 @@
 .NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-image, .NOE1la_spectrum-Card--horizontal .NOE1la_spectrum-Card-illustration {
   border-inline-end-color: var(--spectrum-card-coverphoto-border-color, var(--spectrum-global-color-gray-200));
 }
-/*# sourceMappingURL=card.370c5606.css.map */
+/*# sourceMappingURL=card.4d5d6544.css.map */

package/dist/card.4d5d6544.css.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@adobe/spectrum-css-temp/components/card/vars.css"],"sourcesContent":["/*\n * Copyright 2020 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\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"card.4d5d6544.css.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/card",
-  "version": "3.0.0-alpha.45",
+  "version": "3.0.0-alpha.46",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -40,22 +40,22 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/focus": "^3.20.5",
-    "@react-aria/grid": "^3.14.2",
-    "@react-aria/i18n": "^3.12.10",
-    "@react-aria/interactions": "^3.25.3",
-    "@react-aria/utils": "^3.29.1",
-    "@react-aria/virtualizer": "^4.1.7",
-    "@react-spectrum/checkbox": "^3.9.18",
-    "@react-spectrum/progress": "^3.7.17",
-    "@react-spectrum/utils": "^3.12.6",
-    "@react-stately/collections": "^3.12.5",
-    "@react-stately/grid": "^3.11.3",
-    "@react-stately/list": "^3.12.3",
-    "@react-stately/virtualizer": "^4.4.1",
-    "@react-types/card": "3.0.0-alpha.37",
-    "@react-types/provider": "^3.8.10",
-    "@react-types/shared": "^3.30.0",
+    "@react-aria/focus": "^3.21.0",
+    "@react-aria/grid": "^3.14.3",
+    "@react-aria/i18n": "^3.12.11",
+    "@react-aria/interactions": "^3.25.4",
+    "@react-aria/utils": "^3.30.0",
+    "@react-aria/virtualizer": "^4.1.8",
+    "@react-spectrum/checkbox": "^3.10.0",
+    "@react-spectrum/progress": "^3.7.18",
+    "@react-spectrum/utils": "^3.12.7",
+    "@react-stately/collections": "^3.12.6",
+    "@react-stately/grid": "^3.11.4",
+    "@react-stately/list": "^3.12.4",
+    "@react-stately/virtualizer": "^4.4.2",
+    "@react-types/card": "3.0.0-alpha.38",
+    "@react-types/provider": "^3.8.11",
+    "@react-types/shared": "^3.31.0",
     "@swc/helpers": "^0.5.0"
   },
   "devDependencies": {
@@ -69,5 +69,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a063122082d2b372e4846b58c85ae69ec73887ff"
+  "gitHead": "8b9348ff255e018b2dd9b27e2a45507cadfa1d35"
 }

package/src/CardBase.tsx

@@ -39,7 +39,7 @@ export const CardBase = React.forwardRef(function CardBase<T extends object>(pro
   let {
     isQuiet,
     orientation = 'vertical',
-    articleProps = {},
+    articleProps = {role: 'article'},
     item,
     layout,
     children
@@ -115,7 +115,7 @@ export const CardBase = React.forwardRef(function CardBase<T extends object>(pro
 
   return (
     <FocusRing focusRingClass={classNames(styles, 'focus-ring')}>
-      <article
+      <div
         {...styleProps}
         {...mergeProps(cardProps, focusWithinProps, hoverProps, filterDOMProps(props), articleProps)}
         ref={domRef}
@@ -151,7 +151,7 @@ export const CardBase = React.forwardRef(function CardBase<T extends object>(pro
           </SlotProvider>
           <div className={classNames(styles, 'spectrum-Card-decoration')} />
         </div>
-      </article>
+      </div>
     </FocusRing>
   );
 });

package/dist/card.370c5606.css.map

@@ -1 +0,0 @@
-{"mappings":"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","sources":["packages/@adobe/spectrum-css-temp/components/card/vars.css"],"sourcesContent":["/*\n * Copyright 2020 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\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"card.370c5606.css.map"}