@adobe/react-spectrum 3.47.2 → 3.47.3

package/dist/private/buttongroup/ButtonGroup.mjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAsCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAA2B;IAE3B,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,yCAAU;IACxB,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE,OAAO;IAE5B,IAAI,YAAC,QAAQ,eAAE,cAAc,0BAAc,UAAU,SAAE,QAAQ,SAAS,GAAG,YAAW,GAAG;IAEzF,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,qBAAa,EAAE;IAEnD,IAAI,mBAAmB,CAAA,GAAA,kBAAU,EAAE;QACjC,IAAI,qBAAqB;YACvB,IAAI,OAAO,OAAO,IAAI,gBAAgB,cAAc;gBAClD,IAAI,sBAAsB,MAAM,IAAI,CAAC,OAAO,OAAO,CAAC,QAAQ;gBAC5D,IAAI,OAAO,OAAO,OAAO,CAAC,WAAW,GAAG,GAAG,qCAAqC;gBAChF,0EAA0E;gBAC1E,0EAA0E;gBAC1E,IACE,oBAAoB,IAAI,CACtB,CAAA,QAAS,MAAM,UAAU,GAAG,KAAK,MAAM,UAAU,GAAG,MAAM,WAAW,GAAG,OAG1E,OAAO;gBAET,OAAO;YACT;QACF;QACA,IAAI,gBAAgB,cAClB,eAAe;YACb,uCAAuC;YACvC,MAAM;YAEN,4CAA4C;YAC5C,MAAM;QACR;IAEF,uDAAuD;IACzD,GAAG;QAAC;QAAQ;QAAa;QAAO;QAAgB;KAAS;IAEzD,mDAAmD;IACnD,8HAA8H;IAC9H,CAAA,GAAA,sBAAc,EAAE;QACd;IACF,GAAG;QAAC;KAAiB;IAErB,wKAAwK;IACxK,IAAI,SAAS,CAAA,GAAA,aAAK,EAAe;IACjC,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAChB,OAAO,OAAO,GAAG,OAAO,OAAO,CAAC,aAAa;IAE/C,uDAAuD;IACzD,GAAG;QAAC,OAAO,OAAO;KAAC;IACnB,CAAA,GAAA,wBAAgB,EAAE;QAAC,KAAK;QAAQ,UAAU;IAAgB;IAE1D,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;QAC7B,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,yCAAS,EAClB,CAAA,GAAA,wDAAK,GACL,wBACA;YACE,kCAAkC,gBAAgB,cAAc;YAChE,kCAAkC,UAAU;YAC5C,qCAAqC,UAAU;QACjD,GACA,WAAW,SAAS;qBAEtB,gCAAC,CAAA,GAAA,yCAAW;QACV,OAAO;YACL,QAAQ;gBACN,kBAAkB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,wDAAK,GAAG;YACvC;QACF;qBACA,gCAAC,CAAA,GAAA,yCAAO;QAAE,YAAY;OAAa;AAI3C","sources":["packages/@adobe/react-spectrum/src/buttongroup/ButtonGroup.tsx"],"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\nimport {Alignment, DOMProps, DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport {classNames} from '../utils/classNames';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Provider, useProvider, useProviderProps} from '../provider/Provider';\nimport React, {ReactNode, useCallback, useRef} from 'react';\nimport {SlotProvider, useSlotProps} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useStyleProps} from '../utils/styleProps';\nimport {useValueEffect} from 'react-aria/private/utils/useValueEffect';\n\nexport interface SpectrumButtonGroupProps extends DOMProps, StyleProps {\n  /** Whether the Buttons in the ButtonGroup are all disabled. */\n  isDisabled?: boolean;\n  /**\n   * The axis the ButtonGroup should align with. Setting this to 'vertical' will prevent\n   * any switching behaviors between 'vertical' and 'horizontal'.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /** The Buttons contained within the ButtonGroup. */\n  children: ReactNode;\n  /**\n   * The alignment of the buttons within the ButtonGroup.\n   *\n   * @default 'start'\n   */\n  align?: Alignment | 'center';\n}\n\n/**\n * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.\n */\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(\n  props: SpectrumButtonGroupProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  props = useProviderProps(props);\n  props = useSlotProps(props, 'buttonGroup');\n\n  let {children, orientation = 'horizontal', isDisabled, align = 'start', ...otherProps} = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n  let [hasOverflow, setHasOverflow] = useValueEffect(false);\n\n  let checkForOverflow = useCallback(() => {\n    let computeHasOverflow = () => {\n      if (domRef.current && orientation === 'horizontal') {\n        let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];\n        let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors\n        // If any buttons have negative X positions (align=\"end\") or extend beyond\n        // the width of the button group (align=\"start\"), then switch to vertical.\n        if (\n          buttonGroupChildren.some(\n            child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX\n          )\n        ) {\n          return true;\n        }\n        return false;\n      }\n    };\n    if (orientation === 'horizontal') {\n      setHasOverflow(function* () {\n        // Force to horizontal for measurement.\n        yield false;\n\n        // Measure, and update if there is overflow.\n        yield computeHasOverflow();\n      });\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [domRef, orientation, scale, setHasOverflow, children]);\n\n  // There are two main reasons we need to remeasure:\n  // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)\n  useLayoutEffect(() => {\n    checkForOverflow();\n  }, [checkForOverflow]);\n\n  // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure\n  let parent = useRef<HTMLElement>(undefined);\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      parent.current = domRef.current.parentElement as HTMLElement;\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [domRef.current]);\n  useResizeObserver({ref: parent, onResize: checkForOverflow});\n\n  return (\n    <div\n      {...filterDOMProps(otherProps)}\n      {...styleProps}\n      ref={domRef}\n      className={classNames(\n        styles,\n        'spectrum-ButtonGroup',\n        {\n          'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,\n          'spectrum-ButtonGroup--alignEnd': align === 'end',\n          'spectrum-ButtonGroup--alignCenter': align === 'center'\n        },\n        styleProps.className\n      )}>\n      <SlotProvider\n        slots={{\n          button: {\n            UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')\n          }\n        }}>\n        <Provider isDisabled={isDisabled}>{children}</Provider>\n      </SlotProvider>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ButtonGroup.mjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAsCM,MAAM,0DAAc,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC,SAAS,YACnD,KAA+B,EAC/B,GAA2B;IAE3B,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,yCAAU;IACxB,QAAQ,CAAA,GAAA,yCAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,yCAAW,EAAE,OAAO;IAE5B,IAAI,YAAC,QAAQ,eAAE,cAAc,0BAAc,UAAU,SAAE,QAAQ,SAAS,GAAG,YAAW,GAAG;IAEzF,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,yCAAY,EAAE;IACjC,IAAI,SAAS,CAAA,GAAA,yCAAQ,EAAE;IACvB,IAAI,CAAC,aAAa,eAAe,GAAG,CAAA,GAAA,qBAAa,EAAE;IAEnD,mEAAmE;IACnE,IAAI,mBAAmB,CAAA,GAAA,kBAAU,EAAE;QACjC,IAAI,qBAAqB;YACvB,IAAI,OAAO,OAAO,IAAI,gBAAgB,cAAc;gBAClD,IAAI,sBAAsB,MAAM,IAAI,CAAC,OAAO,OAAO,CAAC,QAAQ;gBAC5D,IAAI,OAAO,OAAO,OAAO,CAAC,WAAW,GAAG,GAAG,qCAAqC;gBAChF,0EAA0E;gBAC1E,0EAA0E;gBAC1E,IACE,oBAAoB,IAAI,CACtB,CAAA,QAAS,MAAM,UAAU,GAAG,KAAK,MAAM,UAAU,GAAG,MAAM,WAAW,GAAG,OAG1E,OAAO;gBAET,OAAO;YACT;QACF;QACA,IAAI,gBAAgB,cAClB,eAAe;YACb,uCAAuC;YACvC,MAAM;YAEN,4CAA4C;YAC5C,MAAM;QACR;IAEJ,GAAG;QAAC;QAAQ;QAAa;QAAO;QAAgB;KAAS;IACzD,kEAAkE;IAElE,mDAAmD;IACnD,8HAA8H;IAC9H,CAAA,GAAA,sBAAc,EAAE;QACd;IACF,GAAG;QAAC;KAAiB;IAErB,wKAAwK;IACxK,IAAI,SAAS,CAAA,GAAA,aAAK,EAAe;IACjC,mEAAmE;IACnE,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAChB,OAAO,OAAO,GAAG,OAAO,OAAO,CAAC,aAAa;IAEjD,GAAG;QAAC,OAAO,OAAO;KAAC;IACnB,kEAAkE;IAClE,CAAA,GAAA,wBAAgB,EAAE;QAAC,KAAK;QAAQ,UAAU;IAAgB;IAE1D,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;QAC7B,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,yCAAS,EAClB,CAAA,GAAA,wDAAK,GACL,wBACA;YACE,kCAAkC,gBAAgB,cAAc;YAChE,kCAAkC,UAAU;YAC5C,qCAAqC,UAAU;QACjD,GACA,WAAW,SAAS;qBAEtB,gCAAC,CAAA,GAAA,yCAAW;QACV,OAAO;YACL,QAAQ;gBACN,kBAAkB,CAAA,GAAA,yCAAS,EAAE,CAAA,GAAA,wDAAK,GAAG;YACvC;QACF;qBACA,gCAAC,CAAA,GAAA,yCAAO;QAAE,YAAY;OAAa;AAI3C","sources":["packages/@adobe/react-spectrum/src/buttongroup/ButtonGroup.tsx"],"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\nimport {Alignment, DOMProps, DOMRef, Orientation, StyleProps} from '@react-types/shared';\nimport {classNames} from '../utils/classNames';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {Provider, useProvider, useProviderProps} from '../provider/Provider';\nimport React, {ReactNode, useCallback, useRef} from 'react';\nimport {SlotProvider, useSlotProps} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/buttongroup/vars.css';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useStyleProps} from '../utils/styleProps';\nimport {useValueEffect} from 'react-aria/private/utils/useValueEffect';\n\nexport interface SpectrumButtonGroupProps extends DOMProps, StyleProps {\n  /** Whether the Buttons in the ButtonGroup are all disabled. */\n  isDisabled?: boolean;\n  /**\n   * The axis the ButtonGroup should align with. Setting this to 'vertical' will prevent\n   * any switching behaviors between 'vertical' and 'horizontal'.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /** The Buttons contained within the ButtonGroup. */\n  children: ReactNode;\n  /**\n   * The alignment of the buttons within the ButtonGroup.\n   *\n   * @default 'start'\n   */\n  align?: Alignment | 'center';\n}\n\n/**\n * ButtonGroup handles overflow for a grouping of buttons whose actions are related to each other.\n */\nexport const ButtonGroup = React.forwardRef(function ButtonGroup(\n  props: SpectrumButtonGroupProps,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  props = useProviderProps(props);\n  props = useSlotProps(props, 'buttonGroup');\n\n  let {children, orientation = 'horizontal', isDisabled, align = 'start', ...otherProps} = props;\n\n  let {styleProps} = useStyleProps(otherProps);\n  let domRef = useDOMRef(ref);\n  let [hasOverflow, setHasOverflow] = useValueEffect(false);\n\n  // oxlint-disable react/react-compiler, react-hooks/exhaustive-deps\n  let checkForOverflow = useCallback(() => {\n    let computeHasOverflow = () => {\n      if (domRef.current && orientation === 'horizontal') {\n        let buttonGroupChildren = Array.from(domRef.current.children) as HTMLElement[];\n        let maxX = domRef.current.offsetWidth + 1; // + 1 to account for rounding errors\n        // If any buttons have negative X positions (align=\"end\") or extend beyond\n        // the width of the button group (align=\"start\"), then switch to vertical.\n        if (\n          buttonGroupChildren.some(\n            child => child.offsetLeft < 0 || child.offsetLeft + child.offsetWidth > maxX\n          )\n        ) {\n          return true;\n        }\n        return false;\n      }\n    };\n    if (orientation === 'horizontal') {\n      setHasOverflow(function* () {\n        // Force to horizontal for measurement.\n        yield false;\n\n        // Measure, and update if there is overflow.\n        yield computeHasOverflow();\n      });\n    }\n  }, [domRef, orientation, scale, setHasOverflow, children]);\n  // oxlint-enable react/react-compiler, react-hooks/exhaustive-deps\n\n  // There are two main reasons we need to remeasure:\n  // 1. Internal changes: Check for initial overflow or when orientation/scale/children change (from checkForOverflow dep array)\n  useLayoutEffect(() => {\n    checkForOverflow();\n  }, [checkForOverflow]);\n\n  // 2. External changes: buttongroup won't change size due to any parents changing size, so listen to its container for size changes to figure out if we should remeasure\n  let parent = useRef<HTMLElement>(undefined);\n  // oxlint-disable react/react-compiler, react-hooks/exhaustive-deps\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      parent.current = domRef.current.parentElement as HTMLElement;\n    }\n  }, [domRef.current]);\n  // oxlint-enable react/react-compiler, react-hooks/exhaustive-deps\n  useResizeObserver({ref: parent, onResize: checkForOverflow});\n\n  return (\n    <div\n      {...filterDOMProps(otherProps)}\n      {...styleProps}\n      ref={domRef}\n      className={classNames(\n        styles,\n        'spectrum-ButtonGroup',\n        {\n          'spectrum-ButtonGroup--vertical': orientation === 'vertical' || hasOverflow,\n          'spectrum-ButtonGroup--alignEnd': align === 'end',\n          'spectrum-ButtonGroup--alignCenter': align === 'center'\n        },\n        styleProps.className\n      )}>\n      <SlotProvider\n        slots={{\n          button: {\n            UNSAFE_className: classNames(styles, 'spectrum-ButtonGroup-Button')\n          }\n        }}>\n        <Provider isDisabled={isDisabled}>{children}</Provider>\n      </SlotProvider>\n    </div>\n  );\n});\n"],"names":[],"version":3,"file":"ButtonGroup.mjs.map"}

package/dist/private/card/CardBase.cjs

@@ -116,6 +116,7 @@ const $93b4a57699139677$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, ($parcel$int
                 UNSAFE_className: (0, $69fd630bd812ba47$exports.classNames)((0, ($parcel$interopDefault($59e87deeac09a752$exports))), 'spectrum-Card-image'),
                 objectFit: orientation === 'horizontal' ? 'cover' : 'contain',
                 alt: '',
+                // oxlint-disable-next-line react/react-compiler
                 ...aspectRatioEnforce
             },
             illustration: {

package/dist/private/card/CardBase.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,cAAc;AACd;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;;AAiCM,MAAM,0DAAW,CAAA,GAAA,sCAAI,EAAE,UAAU,CAAC,SAAS,SAChD,KAAuB,EACvB,GAA2B;IAE3B,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,IAAI,UAAU,CAAA,GAAA,4CAAiB,OAAO,CAAC,GAAG,qDAAqD;IAC/F,IAAI,SAAC,KAAK,EAAC,GAAG;IACd,IAAI,UAAU,OAAO;IACrB,IAAI,WACF,OAAO,eACP,cAAc,0BACd,eAAe;QAAC,MAAM;IAAS,SAC/B,IAAI,UACJ,MAAM,YACN,QAAQ,EACT,GAAG;IAEJ,IAAI,MAAM,MAAM;IAChB,IAAI,aAAa,SAAS,WAAW;IACrC,IAAI,aAAa,OAAO,aAAa,IAAI;IACzC,IAAI,WAAW,IAAM,SAAS,OAAO;IAErC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IACjC,IAAI,aAAC,SAAS,cAAE,UAAU,gBAAE,YAAY,EAAC,GAAG,8BAAQ;IACpD,IAAI,SAAS,CAAA,GAAA,mCAAQ,EAAE;IACvB,IAAI,UAAU,CAAA,GAAA,mBAAK,EAAkB;IACrC,IAAI,cAAc,CAAA,GAAA,mBAAK,EAAE;IAEzB,qFAAqF;IACrF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iCAAO,EAAE;QACrC,YAAY,YAAY,aAAa,SAAS,kBAAkB,UAAU;IAC5E;IACA,IAAI,CAAC,WAAW,aAAa,GAAG,CAAA,GAAA,qBAAO,EAAE;IACzC,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,6CAAa,EAAE;QACtC,qBAAqB;oBACrB;IACF;IAEA,wGAAwG;IACxG,IAAI,kBAAkB,CAAA,GAAA,qCAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,mDAAK,CAAC,CAAC,sBAAsB,EAAE,EAAE;IACvE,IAAI,yBAAyB,CAAA,GAAA,qCAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,mDAAK,CAAC,CAAC,6BAA6B,EAAE,EAAE;IACrF,IAAI,aAAa,mBAAmB;IAEpC,+BAA+B;IAC/B,IAAI,CAAC,QAAQ,UAAU,GAAG,CAAA,GAAA,qBAAO,EAAE;IACnC,IAAI,eAAe,CAAA,GAAA,wBAAU,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,+DAAgB,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,oBAAM,EAChB,IAAO,CAAA;YACL,OAAO;gBACL,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;gBACrC,WAAW,gBAAgB,eAAe,UAAU;gBACpD,KAAK;gBACL,gDAAgD;gBAChD,GAAG,kBAAkB;YACvB;YACA,cAAc;gBACZ,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;gBACrC,GAAG,kBAAkB;YACvB;YACA,QAAQ;gBACN,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;gBACrC,MAAM;YACR;YACA,SAAS;gBAAC,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;gBAA0B,GAAG,UAAU;YAAA;YACtF,SAAS;gBAAC,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;gBAA0B,GAAG,YAAY;YAAA;YACxF,QAAQ;gBAAC,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;YAAuB;QACvE,CAAA,GACA,uDAAuD;IACvD;QAAC;QAAY;QAAc;QAAQ;QAAS;KAAY;IAG1D,CAAA,GAAA,2DAAc,EAAE;QACd,IAAI,SAAS,SAAS;YACpB,IAAI,SAAS,CAAA,GAAA,6DAAqB,EAAE,QAAQ,OAAO;YACnD,IAAI,WAAW,OAAO,QAAQ;YAC9B,MAAO,YAAY,KAAM;gBACvB,IACE,YAAY,OAAO,IACnB,CAAC,CAAA,GAAA,8DAAW,EAAE,YAAY,OAAO,CAAC,iBAAiB,IAAI,WACvD;oBACA,QAAQ,IAAI,CACV;oBAEF;gBACF;gBACA,WAAW,OAAO,QAAQ;YAC5B;QACF;IACF,GAAG;QAAC;KAAS;IAEb,qBACE,0DAAC,CAAA,GAAA,mCAAQ;QAAE,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBAC5C,0DAAC;QACE,GAAG,UAAU;QACb,GAAG,CAAA,GAAA,qCAAS,EACX,WACA,kBACA,YACA,CAAA,GAAA,6CAAa,EAAE,QACf,aACD;QACD,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL,iBACA;YACE,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,2BACE,WAAW,eAAe,WAAW,aAAa,WAAW;QACjE,GACA,WAAW,SAAS;qBAEtB,0DAAC;QAAI,KAAK;QAAS,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;OAC9C,WAAW,QAAQ,aAAa,KAAK,wBACpC,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;qBACjC,0DAAC,CAAA,GAAA,kCAAO;QACN,KAAK;QACL,YAAY;QACZ,qBAAA;QACA,YAAY;QACZ,UAAU;QACV,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QACrC,cAAA;QACA,cAAW;uBAIjB,0DAAC,CAAA,GAAA,sCAAW;QAAE,OAAO;OAAQ,yBAC7B,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;AAK7C;AAUA,SAAS,8BAAQ,KAAsB;IACrC,IAAI,UAAU,CAAA,GAAA,2CAAQ;IACtB,IAAI,gBAAgB,CAAA,GAAA,2CAAQ;IAC5B,IAAI,aAAa,CAAA,GAAA,oBAAM,EACrB,IAAO,CAAA;YACL,IAAI;QACN,CAAA,GACA;QAAC;KAAQ;IAEX,IAAI,eAAe,CAAA,GAAA,oBAAM,EACvB,IAAO,CAAA;YACL,IAAI;QACN,CAAA,GACA;QAAC;KAAc;IAGjB,OAAO;QACL,WAAW;YACT,GAAG,CAAA,GAAA,6CAAa,EAAE,MAAM;YACxB,mBAAmB;YACnB,oBAAoB;YACpB,UAAU;QACZ;oBACA;sBACA;IACF;AACF","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        // oxlint-disable-next-line react/react-compiler\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.cjs.map"}

package/dist/private/card/CardBase.js

@@ -110,6 +110,7 @@ const $cdc2130588546f60$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $iMWH0$react
                 UNSAFE_className: (0, $512ba93e663f149c$export$ce4ab0c55987d1ff)((0, ($parcel$interopDefault($iMWH0$card_vars_cssmjs))), 'spectrum-Card-image'),
                 objectFit: orientation === 'horizontal' ? 'cover' : 'contain',
                 alt: '',
+                // oxlint-disable-next-line react/react-compiler
                 ...aspectRatioEnforce
             },
             illustration: {

package/dist/private/card/CardBase.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.js.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        // oxlint-disable-next-line react/react-compiler\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.js.map"}

package/dist/private/card/CardBase.mjs

@@ -110,6 +110,7 @@ const $957034e7d12d8044$export$7a6ccaf429ad93a8 = /*#__PURE__*/ (0, $5WJjN$react
                 UNSAFE_className: (0, $6e6392558d48dfec$export$ce4ab0c55987d1ff)((0, ($parcel$interopDefault($5WJjN$card_vars_cssmjs))), 'spectrum-Card-image'),
                 objectFit: orientation === 'horizontal' ? 'cover' : 'contain',
                 alt: '',
+                // oxlint-disable-next-line react/react-compiler
                 ...aspectRatioEnforce
             },
             illustration: {

package/dist/private/card/CardBase.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.mjs.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/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 './types';\nimport {Checkbox} from '../checkbox/Checkbox';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, Node} from '@react-types/shared';\nimport {filterDOMProps} from 'react-aria/filterDOMProps';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport {getFocusableTreeWalker} from 'react-aria/private/focus/FocusScope';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {nodeContains} from 'react-aria/private/utils/shadowdom/DOMFunctions';\nimport React, {HTMLAttributes, useCallback, useMemo, useRef, useState} from 'react';\nimport {SlotProvider} from '../utils/Slots';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCardViewContext} from './CardViewContext';\nimport {useDOMRef} from '../utils/useDOMRef';\nimport {useFocusWithin} from 'react-aria/useFocusWithin';\nimport {useHasChild} from '../utils/useHasChild';\nimport {useHover} from 'react-aria/useHover';\nimport {useLayoutEffect} from 'react-aria/private/utils/useLayoutEffect';\nimport {useProviderProps} from '../provider/Provider';\nimport {useResizeObserver} from 'react-aria/private/utils/useResizeObserver';\nimport {useSlotId} from 'react-aria/private/utils/useId';\nimport {useStyleProps} from '../utils/styleProps';\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>(\n  props: CardBaseProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\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({\n    isDisabled: manager === undefined || manager?.selectionMode === 'none' || isDisabled\n  });\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    () => ({\n      image: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-image'),\n        objectFit: orientation === 'horizontal' ? 'cover' : 'contain',\n        alt: '',\n        // oxlint-disable-next-line react/react-compiler\n        ...aspectRatioEnforce\n      },\n      illustration: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-illustration'),\n        ...aspectRatioEnforce\n      },\n      avatar: {\n        UNSAFE_className: classNames(styles, 'spectrum-Card-avatar'),\n        size: 'avatar-size-400'\n      },\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    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [titleProps, contentProps, height, isQuiet, orientation]\n  );\n\n  useLayoutEffect(() => {\n    if (gridRef?.current) {\n      let walker = getFocusableTreeWalker(gridRef.current);\n      let nextNode = walker.nextNode();\n      while (nextNode != null) {\n        if (\n          checkboxRef.current &&\n          !nodeContains(checkboxRef.current.UNSAFE_getDOMNode(), nextNode)\n        ) {\n          console.warn(\n            'Card does not support focusable elements, please contact the team regarding your use case.'\n          );\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(\n          cardProps,\n          focusWithinProps,\n          hoverProps,\n          filterDOMProps(props),\n          articleProps\n        )}\n        ref={domRef}\n        className={classNames(\n          styles,\n          'spectrum-Card',\n          {\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':\n              layout !== 'waterfall' && layout !== 'gallery' && layout !== 'grid'\n          },\n          styleProps.className\n        )}>\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              />\n            </div>\n          )}\n          <SlotProvider slots={slots}>{children}</SlotProvider>\n          <div className={classNames(styles, 'spectrum-Card-decoration')} />\n        </div>\n      </div>\n    </FocusRing>\n  );\n});\n\ninterface AriaCardOptions extends AriaCardProps {}\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    () => ({\n      id: titleId\n    }),\n    [titleId]\n  );\n  let contentProps = useMemo(\n    () => ({\n      id: descriptionId\n    }),\n    [descriptionId]\n  );\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.mjs.map"}

package/dist/private/card/CardView.cjs

@@ -118,7 +118,9 @@ const $017dba522854c0f2$export$7e52c821f7b6f422 = /*#__PURE__*/ (0, ($parcel$int
         collection: gridCollection,
         focusMode: 'cell'
     });
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.collection = gridCollection;
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.disabledKeys = state.disabledKeys;
     let { gridProps: gridProps } = (0, $ohoUA$reactariaprivategriduseGrid.useGrid)({
         ...props,
@@ -235,6 +237,7 @@ function $017dba522854c0f2$var$InternalCard(props) {
     // We don't want to focus the checkbox (or any other focusable elements) within the Card
     // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between
     // the cards in the CardView is handled by useGrid => useSelectableCollection instead.
+    // oxlint-disable-next-line react/react-compiler
     delete gridCellProps.onKeyDownCapture;
     return /*#__PURE__*/ (0, ($parcel$interopDefault($ohoUA$react))).createElement("div", {
         ...rowProps,

package/dist/private/card/CardView.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  cardViewLayout.collection = gridCollection;\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.cjs.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.collection = gridCollection;\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  // oxlint-disable-next-line react/react-compiler\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.cjs.map"}

package/dist/private/card/CardView.js

@@ -112,7 +112,9 @@ const $91cd21cb8400ff0f$export$7e52c821f7b6f422 = /*#__PURE__*/ (0, $kLk5i$react
         collection: gridCollection,
         focusMode: 'cell'
     });
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.collection = gridCollection;
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.disabledKeys = state.disabledKeys;
     let { gridProps: gridProps } = (0, $kLk5i$useGrid)({
         ...props,
@@ -229,6 +231,7 @@ function $91cd21cb8400ff0f$var$InternalCard(props) {
     // We don't want to focus the checkbox (or any other focusable elements) within the Card
     // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between
     // the cards in the CardView is handled by useGrid => useSelectableCollection instead.
+    // oxlint-disable-next-line react/react-compiler
     delete gridCellProps.onKeyDownCapture;
     return /*#__PURE__*/ (0, $kLk5i$react).createElement("div", {
         ...rowProps,

package/dist/private/card/CardView.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  cardViewLayout.collection = gridCollection;\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.js.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.collection = gridCollection;\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  // oxlint-disable-next-line react/react-compiler\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.js.map"}

package/dist/private/card/CardView.mjs

@@ -112,7 +112,9 @@ const $f30e78dbf4cce5fb$export$7e52c821f7b6f422 = /*#__PURE__*/ (0, $eEzdj$react
         collection: gridCollection,
         focusMode: 'cell'
     });
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.collection = gridCollection;
+    // oxlint-disable-next-line react/react-compiler
     cardViewLayout.disabledKeys = state.disabledKeys;
     let { gridProps: gridProps } = (0, $eEzdj$useGrid)({
         ...props,
@@ -229,6 +231,7 @@ function $f30e78dbf4cce5fb$var$InternalCard(props) {
     // We don't want to focus the checkbox (or any other focusable elements) within the Card
     // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between
     // the cards in the CardView is handled by useGrid => useSelectableCollection instead.
+    // oxlint-disable-next-line react/react-compiler
     delete gridCellProps.onKeyDownCapture;
     return /*#__PURE__*/ (0, $eEzdj$react).createElement("div", {
         ...rowProps,

package/dist/private/card/CardView.mjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  cardViewLayout.collection = gridCollection;\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.mjs.map"}
+{"mappings":"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","sources":["packages/@adobe/react-spectrum/src/card/CardView.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 {CardBase} from './CardBase';\nimport {CardViewContext, useCardViewContext} from './CardViewContext';\nimport {classNames} from '../utils/classNames';\nimport {DOMRef, DOMRefValue, Node} from '@react-types/shared';\nimport {GridCollection} from 'react-stately/private/grid/GridCollection';\nimport intlMessages from '../../intl/card/*.json';\nimport {mergeProps} from 'react-aria/mergeProps';\nimport {ProgressCircle} from '../progress/ProgressCircle';\nimport React, {ReactElement, ReactNode, useCallback, useMemo, useRef} from 'react';\nimport {ReusableView} from 'react-stately/useVirtualizerState';\nimport {SpectrumCardViewProps} from './types';\nimport styles from '@adobe/spectrum-css-temp/components/card/vars.css';\nimport {useCollator} from 'react-aria/useCollator';\nimport {useDOMRef, useUnwrapDOMRef} from '../utils/useDOMRef';\nimport {useGrid} from 'react-aria/private/grid/useGrid';\nimport {useGridCell} from 'react-aria/private/grid/useGridCell';\nimport {useGridRow} from 'react-aria/private/grid/useGridRow';\nimport {useGridState} from 'react-stately/private/grid/useGridState';\nimport {useListState} from 'react-stately/useListState';\nimport {useLocale} from 'react-aria/I18nProvider';\nimport {useLocalizedStringFormatter} from 'react-aria/useLocalizedStringFormatter';\nimport {useProvider} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {Virtualizer} from 'react-aria/private/virtualizer/Virtualizer';\nimport {VirtualizerItem} from 'react-aria/private/virtualizer/VirtualizerItem';\n\n/**\n * TODO: Add description of component here.\n */\nexport const CardView = React.forwardRef(function CardView<T extends object>(\n  props: SpectrumCardViewProps<T>,\n  ref: DOMRef<HTMLDivElement>\n) {\n  let {scale} = useProvider();\n  let {styleProps} = useStyleProps(props);\n  let domRef = useDOMRef(ref);\n  let {\n    isQuiet,\n    renderEmptyState,\n    layout,\n    loadingState,\n    onLoadMore,\n    cardOrientation = 'vertical'\n  } = props;\n\n  let collator = useCollator({usage: 'search', sensitivity: 'base'});\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n  let cardViewLayout = useMemo(\n    () => (typeof layout === 'function' ? new layout({collator, cardOrientation, scale}) : layout),\n    [layout, collator, cardOrientation, scale]\n  );\n  let layoutType = cardViewLayout.layoutType;\n\n  let {direction} = useLocale();\n  let {collection} = useListState(props);\n\n  let gridCollection = useMemo(\n    () =>\n      new GridCollection<T>({\n        columnCount: 1,\n        items: [...collection].map(item => ({\n          // Makes the Grid row use the keys the user provides to the cards so that selection change via interactions returns the card keys\n          ...item,\n          hasChildNodes: true,\n          childNodes: [\n            {\n              key: `cell-${item.key}`,\n              type: 'cell',\n              value: null,\n              level: 0,\n              rendered: null,\n              textValue: item.textValue,\n              hasChildNodes: false,\n              childNodes: []\n            }\n          ]\n        }))\n      }),\n    [collection]\n  );\n\n  let state = useGridState({\n    ...props,\n    selectionMode:\n      cardOrientation === 'horizontal' && layoutType === 'grid' ? 'none' : props.selectionMode,\n    collection: gridCollection,\n    focusMode: 'cell'\n  });\n\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.collection = gridCollection;\n  // oxlint-disable-next-line react/react-compiler\n  cardViewLayout.disabledKeys = state.disabledKeys;\n\n  let {gridProps} = useGrid(\n    {\n      ...props,\n      isVirtualized: true,\n      keyboardDelegate: cardViewLayout\n    },\n    state,\n    domRef\n  );\n\n  type View = ReusableView<Node<T>, ReactNode>;\n  let renderWrapper = useCallback(\n    (parent: View, reusableView: View) => (\n      <VirtualizerItem\n        key={reusableView.key}\n        layoutInfo={reusableView.layoutInfo}\n        virtualizer={reusableView.virtualizer}\n        parent={parent?.layoutInfo}>\n        {reusableView.rendered}\n      </VirtualizerItem>\n    ),\n    []\n  );\n\n  let focusedKey = state.selectionManager.focusedKey;\n  let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);\n  if (focusedItem?.parentKey != null) {\n    focusedKey = focusedItem.parentKey;\n  }\n\n  let persistedKeys = useMemo(\n    () => (focusedKey != null ? new Set([focusedKey]) : null),\n    [focusedKey]\n  );\n\n  // TODO: does aria-row count and aria-col count need to be modified? Perhaps aria-col count needs to be omitted\n  return (\n    <CardViewContext.Provider\n      value={{state, isQuiet, layout: cardViewLayout, cardOrientation, renderEmptyState}}>\n      <Virtualizer\n        {...gridProps}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-CardView')}\n        ref={domRef}\n        persistedKeys={persistedKeys}\n        scrollDirection=\"vertical\"\n        layout={cardViewLayout}\n        collection={gridCollection}\n        isLoading={isLoading}\n        onLoadMore={onLoadMore}\n        layoutOptions={useMemo(() => ({isLoading, direction}), [isLoading, direction])}\n        renderWrapper={renderWrapper}\n        style={{\n          ...styleProps.style,\n          scrollPaddingTop: cardViewLayout.margin || 0\n        }}>\n        {useCallback((type, item) => {\n          if (type === 'item') {\n            return <InternalCard item={item} />;\n          } else if (type === 'loader') {\n            return <LoadingState />;\n          } else if (type === 'placeholder') {\n            return <EmptyState />;\n          }\n        }, [])}\n      </Virtualizer>\n    </CardViewContext.Provider>\n  );\n}) as <T>(props: SpectrumCardViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction LoadingState() {\n  let {state} = useCardViewContext();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/card');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={\n          state.collection.size > 0\n            ? stringFormatter.format('loadingMore')\n            : stringFormatter.format('loading')\n        }\n      />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useCardViewContext();\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return <CenteredWrapper>{emptyState}</CenteredWrapper>;\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useCardViewContext();\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={classNames(styles, 'spectrum-CardView-centeredWrapper')}>\n      <div role=\"gridcell\">{children}</div>\n    </div>\n  );\n}\n\nfunction InternalCard(props) {\n  let {item} = props;\n  let cellNode = [...item.childNodes][0];\n  let {state, cardOrientation, isQuiet, layout} = useCardViewContext();\n\n  let layoutType = layout.layoutType;\n  let rowRef = useRef(undefined);\n  let cellRef = useRef<DOMRefValue<HTMLDivElement>>(undefined);\n  let unwrappedRef = useUnwrapDOMRef(cellRef);\n\n  let {rowProps: gridRowProps} = useGridRow(\n    {\n      node: item,\n      isVirtualized: true\n    },\n    state,\n    rowRef\n  );\n\n  let {gridCellProps} = useGridCell(\n    {\n      node: cellNode,\n      focusMode: 'cell'\n    },\n    state,\n    unwrappedRef\n  );\n\n  // Prevent space key from scrolling the CardView if triggered on a disabled item or on a Card in a selectionMode=\"none\" CardView.\n  let allowsInteraction = state.selectionManager.selectionMode !== 'none';\n  let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);\n\n  let onKeyDown = e => {\n    if (e.key === ' ' && isDisabled) {\n      e.preventDefault();\n    }\n  };\n\n  let rowProps = mergeProps(gridRowProps, {onKeyDown});\n\n  if (layoutType === 'grid' || layoutType === 'gallery') {\n    isQuiet = true;\n  }\n\n  if (layoutType !== 'grid') {\n    cardOrientation = 'vertical';\n  }\n\n  // We don't want to focus the checkbox (or any other focusable elements) within the Card\n  // when pressing the arrow keys so we delete the key down handler here. Arrow key navigation between\n  // the cards in the CardView is handled by useGrid => useSelectableCollection instead.\n  // oxlint-disable-next-line react/react-compiler\n  delete gridCellProps.onKeyDownCapture;\n  return (\n    <div {...rowProps} ref={rowRef} className={classNames(styles, 'spectrum-CardView-row')}>\n      <CardBase\n        ref={cellRef}\n        articleProps={gridCellProps}\n        isQuiet={isQuiet}\n        orientation={cardOrientation}\n        item={item}\n        layout={layoutType}>\n        {item.rendered}\n      </CardBase>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"CardView.mjs.map"}

package/dist/private/checkbox/Checkbox.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;AAyCM,MAAM,0DAAW,CAAA,GAAA,uBAAS,EAAE,SAAS,SAC1C,KAA4B,EAC5B,GAAmC;IAEnC,IAAI,gBAAgB;IACpB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE,KAAK;IAElC,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,kDAAc;IAC/D,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,mBAAC,kBAAkB,qBAAO,eAAe,kBAAO,SAAS,YAAE,QAAQ,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IAEjC,2EAA2E;IAC3E,gFAAgF;IAChF,8EAA8E;IAC9E,IAAI,aAAa,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,8CAAmB;IAC/C,IAAI,cAAC,UAAU,cAAE,UAAU,aAAE,SAAS,cAAE,UAAU,EAAC,GAAG,aAElD,CAAA,GAAA,qDAAmB,EACjB;QACE,GAAG,KAAK;QACR,qFAAqF;QACrF,2EAA2E;QAC3E,aAAa;QACb,OAAO,MAAM,KAAK;QAClB,2EAA2E;QAC3E,8EAA8E;QAC9E,YAAY,cAAc,UAAU;QACpC,iBAAiB,cAAc,eAAe;QAC9C,WAAW,cAAc,SAAS;IACpC,GACA,YACA,YAGF,CAAA,GAAA,uCAAU,EAAE,OAAO,CAAA,GAAA,gDAAa,EAAE,QAAQ;IAE9C,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iCAAO,EAAE;oBAAC;IAAU;IAElD,IAAI,WAAW,gCACb,0DAAC,CAAA,GAAA,yDAAQ;QAAE,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;uBAEhD,0DAAC,CAAA,GAAA,8DAAa;QAAE,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;IAGvD,IAAI,cAAc,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;QACvD,KAAK,IAAI,OAAO;YAAC;YAAc;YAAmB;SAAe,CAC/D,IAAI,aAAa,CAAC,IAAI,IAAI,MACxB,QAAQ,IAAI,CACV,GAAG,IAAI,0HAA0H,CAAC;QAIxI,IAAI,MAAM,KAAK,IAAI,MACjB,QAAQ,IAAI,CAAC;IAEjB;IAEA,qBACE,0DAAC;QACE,GAAG,UAAU;QACb,GAAG,UAAU;QACb,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL,qBACA;YACE,cAAc,WAAW,OAAO;YAChC,oBAAoB;YACpB,4BAA4B,CAAC;YAC7B,cAAc;YACd,eAAe;YACf,cAAc;QAChB,GACA,WAAW,SAAS;qBAEtB,0DAAC,CAAA,GAAA,mCAAQ;QAAE,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAAe,WAAW;qBACtE,0DAAC;QACE,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;uBAGlC,0DAAC;QAAK,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;OAA2B,WAC9D,0BACC,0DAAC;QAAK,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;OAA6B;AAIzE","sources":["packages/@adobe/react-spectrum/src/checkbox/Checkbox.tsx"],"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\nimport {AriaCheckboxProps, useCheckbox} from 'react-aria/useCheckbox';\n\nimport {CheckboxContext} from 'react-aria-components/Checkbox';\nimport {CheckboxGroupContext} from './context';\nimport CheckmarkSmall from '@spectrum-icons/ui/CheckmarkSmall';\nimport {classNames} from '../utils/classNames';\nimport DashSmall from '@spectrum-icons/ui/DashSmall';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport React, {forwardRef, useContext, useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/checkbox/vars.css';\nimport {useCheckboxGroupItem} from 'react-aria/useCheckboxGroup';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFormProps} from '../form/Form';\nimport {useHover} from 'react-aria/useHover';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {useToggleState} from 'react-stately/useToggleState';\n\nexport interface SpectrumCheckboxProps extends Omit<AriaCheckboxProps, 'onClick'>, StyleProps {\n  /**\n   * This prop sets the emphasized style which provides visual prominence.\n   */\n  isEmphasized?: boolean;\n  /**\n   * A slot name for the component. Slots allow the component to receive props from a parent\n   * component. An explicit `null` value indicates that the local props completely override all\n   * props received from a parent.\n   *\n   * @private\n   */\n  slot?: string | null;\n}\n\n/**\n * Checkboxes allow users to select multiple items from a list of individual items,\n * or to mark one individual item as selected.\n */\nexport const Checkbox = forwardRef(function Checkbox(\n  props: SpectrumCheckboxProps,\n  ref: FocusableRef<HTMLLabelElement>\n) {\n  let originalProps = props;\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  [props, domRef] = useContextProps(props, domRef, CheckboxContext);\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  let {isIndeterminate = false, isEmphasized = false, autoFocus, children, ...otherProps} = props;\n  let {styleProps} = useStyleProps(otherProps);\n\n  // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.\n  // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,\n  // but since the checkbox won't move in and out of a group, it should be safe.\n  let groupState = useContext(CheckboxGroupContext);\n  let {labelProps, inputProps, isInvalid, isDisabled} = groupState\n    ? // eslint-disable-next-line react-hooks/rules-of-hooks\n      useCheckboxGroupItem(\n        {\n          ...props,\n          // Value is optional for standalone checkboxes, but required for CheckboxGroup items;\n          // it's passed explicitly here to avoid typescript error (requires ignore).\n          // @ts-ignore\n          value: props.value,\n          // Only pass isRequired and validationState to react-aria if they came from\n          // the props for this individual checkbox, and not from the group via context.\n          isRequired: originalProps.isRequired,\n          validationState: originalProps.validationState,\n          isInvalid: originalProps.isInvalid\n        },\n        groupState,\n        inputRef\n      )\n    : // eslint-disable-next-line react-hooks/rules-of-hooks\n      useCheckbox(props, useToggleState(props), inputRef);\n\n  let {hoverProps, isHovered} = useHover({isDisabled});\n\n  let markIcon = isIndeterminate ? (\n    <DashSmall UNSAFE_className={classNames(styles, 'spectrum-Checkbox-partialCheckmark')} />\n  ) : (\n    <CheckmarkSmall UNSAFE_className={classNames(styles, 'spectrum-Checkbox-checkmark')} />\n  );\n\n  if (groupState && process.env.NODE_ENV !== 'production') {\n    for (let key of ['isSelected', 'defaultSelected', 'isEmphasized']) {\n      if (originalProps[key] != null) {\n        console.warn(\n          `${key} is unsupported on individual <Checkbox> elements within a <CheckboxGroup>. Please apply these props to the group instead.`\n        );\n      }\n    }\n    if (props.value == null) {\n      console.warn('A <Checkbox> element within a <CheckboxGroup> requires a `value` property.');\n    }\n  }\n\n  return (\n    <label\n      {...labelProps}\n      {...styleProps}\n      {...hoverProps}\n      ref={domRef}\n      className={classNames(\n        styles,\n        'spectrum-Checkbox',\n        {\n          'is-checked': inputProps.checked,\n          'is-indeterminate': isIndeterminate,\n          'spectrum-Checkbox--quiet': !isEmphasized,\n          'is-invalid': isInvalid,\n          'is-disabled': isDisabled,\n          'is-hovered': isHovered\n        },\n        styleProps.className\n      )}>\n      <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n        <input\n          {...inputProps}\n          ref={inputRef}\n          className={classNames(styles, 'spectrum-Checkbox-input')}\n        />\n      </FocusRing>\n      <span className={classNames(styles, 'spectrum-Checkbox-box')}>{markIcon}</span>\n      {children && (\n        <span className={classNames(styles, 'spectrum-Checkbox-label')}>{children}</span>\n      )}\n    </label>\n  );\n});\n"],"names":[],"version":3,"file":"Checkbox.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;AAyCM,MAAM,0DAAW,CAAA,GAAA,uBAAS,EAAE,SAAS,SAC1C,KAA4B,EAC5B,GAAmC;IAEnC,IAAI,gBAAgB;IACpB,IAAI,WAAW,CAAA,GAAA,mBAAK,EAAoB;IACxC,IAAI,SAAS,CAAA,GAAA,yCAAc,EAAE,KAAK;IAElC,CAAC,OAAO,OAAO,GAAG,CAAA,GAAA,+CAAc,EAAE,OAAO,QAAQ,CAAA,GAAA,kDAAc;IAC/D,QAAQ,CAAA,GAAA,0CAAe,EAAE;IACzB,QAAQ,CAAA,GAAA,sCAAW,EAAE;IACrB,IAAI,mBAAC,kBAAkB,qBAAO,eAAe,kBAAO,SAAS,YAAE,QAAQ,EAAE,GAAG,YAAW,GAAG;IAC1F,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,uCAAY,EAAE;IAEjC,2EAA2E;IAC3E,gFAAgF;IAChF,8EAA8E;IAC9E,IAAI,aAAa,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,8CAAmB;IAC/C,IAAI,cAAC,UAAU,cAAE,UAAU,aAAE,SAAS,cAAE,UAAU,EAAC,GAAG,aAElD,CAAA,GAAA,qDAAmB,EACjB;QACE,GAAG,KAAK;QACR,qFAAqF;QACrF,2EAA2E;QAC3E,aAAa;QACb,OAAO,MAAM,KAAK;QAClB,2EAA2E;QAC3E,8EAA8E;QAC9E,YAAY,cAAc,UAAU;QACpC,iBAAiB,cAAc,eAAe;QAC9C,WAAW,cAAc,SAAS;IACpC,GACA,YACA,YAGF,CAAA,GAAA,uCAAU,EAAE,OAAO,CAAA,GAAA,gDAAa,EAAE,QAAQ;IAE9C,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iCAAO,EAAE;oBAAC;IAAU;IAElD,IAAI,WAAW,gCACb,0DAAC,CAAA,GAAA,yDAAQ;QAAE,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;uBAEhD,0DAAC,CAAA,GAAA,8DAAa;QAAE,kBAAkB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;;IAGvD,IAAI,cAAc,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAAc;QACvD,KAAK,IAAI,OAAO;YAAC;YAAc;YAAmB;SAAe,CAC/D,IAAI,aAAa,CAAC,IAAI,IAAI,MACxB,QAAQ,IAAI,CACV,GAAG,IAAI,0HAA0H,CAAC;QAIxI,IAAI,MAAM,KAAK,IAAI,MACjB,QAAQ,IAAI,CAAC;IAEjB;IAEA,qBACE,0DAAC;QACE,GAAG,UAAU;QACb,GAAG,UAAU;QACb,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAClB,CAAA,GAAA,mDAAK,GACL,qBACA;YACE,cAAc,WAAW,OAAO;YAChC,oBAAoB;YACpB,4BAA4B,CAAC;YAC7B,cAAc;YACd,eAAe;YACf,cAAc;QAChB,GACA,WAAW,SAAS;qBAEtB,0DAAC,CAAA,GAAA,mCAAQ;QAAE,gBAAgB,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;QAAe,WAAW;qBACtE,0DAAC;QACE,GAAG,UAAU;QACd,KAAK;QACL,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;uBAGlC,0DAAC;QAAK,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;OAA2B,WAC9D,0BACC,0DAAC;QAAK,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAK,GAAG;OAA6B;AAIzE","sources":["packages/@adobe/react-spectrum/src/checkbox/Checkbox.tsx"],"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\nimport {AriaCheckboxProps, useCheckbox} from 'react-aria/useCheckbox';\n\nimport {CheckboxContext} from 'react-aria-components/Checkbox';\nimport {CheckboxGroupContext} from './context';\nimport CheckmarkSmall from '@spectrum-icons/ui/CheckmarkSmall';\nimport {classNames} from '../utils/classNames';\nimport DashSmall from '@spectrum-icons/ui/DashSmall';\nimport {FocusableRef, StyleProps} from '@react-types/shared';\nimport {FocusRing} from 'react-aria/FocusRing';\nimport React, {forwardRef, useContext, useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/checkbox/vars.css';\nimport {useCheckboxGroupItem} from 'react-aria/useCheckboxGroup';\nimport {useContextProps} from 'react-aria-components/slots';\nimport {useFocusableRef} from '../utils/useDOMRef';\nimport {useFormProps} from '../form/Form';\nimport {useHover} from 'react-aria/useHover';\nimport {useProviderProps} from '../provider/Provider';\nimport {useStyleProps} from '../utils/styleProps';\nimport {useToggleState} from 'react-stately/useToggleState';\n\nexport interface SpectrumCheckboxProps extends Omit<AriaCheckboxProps, 'onClick'>, StyleProps {\n  /**\n   * This prop sets the emphasized style which provides visual prominence.\n   */\n  isEmphasized?: boolean;\n  /**\n   * A slot name for the component. Slots allow the component to receive props from a parent\n   * component. An explicit `null` value indicates that the local props completely override all\n   * props received from a parent.\n   *\n   * @private\n   */\n  slot?: string | null;\n}\n\n/**\n * Checkboxes allow users to select multiple items from a list of individual items,\n * or to mark one individual item as selected.\n */\nexport const Checkbox = forwardRef(function Checkbox(\n  props: SpectrumCheckboxProps,\n  ref: FocusableRef<HTMLLabelElement>\n) {\n  let originalProps = props;\n  let inputRef = useRef<HTMLInputElement>(null);\n  let domRef = useFocusableRef(ref, inputRef);\n\n  [props, domRef] = useContextProps(props, domRef, CheckboxContext);\n  props = useProviderProps(props);\n  props = useFormProps(props);\n  let {isIndeterminate = false, isEmphasized = false, autoFocus, children, ...otherProps} = props;\n  let {styleProps} = useStyleProps(otherProps);\n\n  // Swap hooks depending on whether this checkbox is inside a CheckboxGroup.\n  // This is a bit unorthodox. Typically, hooks cannot be called in a conditional,\n  // but since the checkbox won't move in and out of a group, it should be safe.\n  let groupState = useContext(CheckboxGroupContext);\n  let {labelProps, inputProps, isInvalid, isDisabled} = groupState\n    ? // oxlint-disable-next-line react/react-compiler, react-hooks/rules-of-hooks\n      useCheckboxGroupItem(\n        {\n          ...props,\n          // Value is optional for standalone checkboxes, but required for CheckboxGroup items;\n          // it's passed explicitly here to avoid typescript error (requires ignore).\n          // @ts-ignore\n          value: props.value,\n          // Only pass isRequired and validationState to react-aria if they came from\n          // the props for this individual checkbox, and not from the group via context.\n          isRequired: originalProps.isRequired,\n          validationState: originalProps.validationState,\n          isInvalid: originalProps.isInvalid\n        },\n        groupState,\n        inputRef\n      )\n    : // oxlint-disable-next-line react/react-compiler, react-hooks/rules-of-hooks\n      useCheckbox(props, useToggleState(props), inputRef);\n\n  let {hoverProps, isHovered} = useHover({isDisabled});\n\n  let markIcon = isIndeterminate ? (\n    <DashSmall UNSAFE_className={classNames(styles, 'spectrum-Checkbox-partialCheckmark')} />\n  ) : (\n    <CheckmarkSmall UNSAFE_className={classNames(styles, 'spectrum-Checkbox-checkmark')} />\n  );\n\n  if (groupState && process.env.NODE_ENV !== 'production') {\n    for (let key of ['isSelected', 'defaultSelected', 'isEmphasized']) {\n      if (originalProps[key] != null) {\n        console.warn(\n          `${key} is unsupported on individual <Checkbox> elements within a <CheckboxGroup>. Please apply these props to the group instead.`\n        );\n      }\n    }\n    if (props.value == null) {\n      console.warn('A <Checkbox> element within a <CheckboxGroup> requires a `value` property.');\n    }\n  }\n\n  return (\n    <label\n      {...labelProps}\n      {...styleProps}\n      {...hoverProps}\n      ref={domRef}\n      className={classNames(\n        styles,\n        'spectrum-Checkbox',\n        {\n          'is-checked': inputProps.checked,\n          'is-indeterminate': isIndeterminate,\n          'spectrum-Checkbox--quiet': !isEmphasized,\n          'is-invalid': isInvalid,\n          'is-disabled': isDisabled,\n          'is-hovered': isHovered\n        },\n        styleProps.className\n      )}>\n      <FocusRing focusRingClass={classNames(styles, 'focus-ring')} autoFocus={autoFocus}>\n        <input\n          {...inputProps}\n          ref={inputRef}\n          className={classNames(styles, 'spectrum-Checkbox-input')}\n        />\n      </FocusRing>\n      <span className={classNames(styles, 'spectrum-Checkbox-box')}>{markIcon}</span>\n      {children && (\n        <span className={classNames(styles, 'spectrum-Checkbox-label')}>{children}</span>\n      )}\n    </label>\n  );\n});\n"],"names":[],"version":3,"file":"Checkbox.cjs.map"}