@fluentui/react-card 9.0.33 → 9.0.35

package/lib-commonjs/CardFooter.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./components/CardFooter/index"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/CardFooter/index"), exports);

package/lib-commonjs/CardFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CardFooter.js"],"sourcesContent":["export * from './components/CardFooter/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
+{"version":3,"sources":["CardFooter.js"],"sourcesContent":["export * from './components/CardFooter/index';\n"],"names":[],"mappings":";;;;;uBAAc"}

package/lib-commonjs/CardHeader.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./components/CardHeader/index"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/CardHeader/index"), exports);

package/lib-commonjs/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CardHeader.js"],"sourcesContent":["export * from './components/CardHeader/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
+{"version":3,"sources":["CardHeader.js"],"sourcesContent":["export * from './components/CardHeader/index';\n"],"names":[],"mappings":";;;;;uBAAc"}

package/lib-commonjs/CardPreview.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./components/CardPreview/index"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/CardPreview/index"), exports);

package/lib-commonjs/CardPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CardPreview.js"],"sourcesContent":["export * from './components/CardPreview/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
+{"version":3,"sources":["CardPreview.js"],"sourcesContent":["export * from './components/CardPreview/index';\n"],"names":[],"mappings":";;;;;uBAAc"}

package/lib-commonjs/components/Card/Card.js

@@ -4,18 +4,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Card", {
     enumerable: true,
-    get: ()=>Card
+    get: function() {
+        return Card;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _useCard = require("./useCard");
 const _renderCard = require("./renderCard");
-const _useCardStylesStyles = require("./useCardStyles.styles");
+const _useCardStylesstyles = require("./useCardStyles.styles");
 const _useCardContextValue = require("./useCardContextValue");
 const Card = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useCard.useCard_unstable)(props, ref);
     const cardContextValue = (0, _useCardContextValue.useCardContextValue)(state);
-    (0, _useCardStylesStyles.useCardStyles_unstable)(state);
+    (0, _useCardStylesstyles.useCardStyles_unstable)(state);
     return (0, _renderCard.renderCard_unstable)(state, cardContextValue);
 });
 Card.displayName = 'Card';

package/lib-commonjs/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Card.js"],"sourcesContent":["import * as React from 'react';\nimport { useCard_unstable } from './useCard';\nimport { renderCard_unstable } from './renderCard';\nimport { useCardStyles_unstable } from './useCardStyles.styles';\nimport { useCardContextValue } from './useCardContextValue';\n/**\n * A card provides scaffolding for hosting actions and content for a single topic.\n */ export const Card = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useCard_unstable(props, ref);\n    const cardContextValue = useCardContextValue(state);\n    useCardStyles_unstable(state);\n    return renderCard_unstable(state, cardContextValue);\n});\nCard.displayName = 'Card';\n"],"names":["Card","React","forwardRef","props","ref","state","useCard_unstable","cardContextValue","useCardContextValue","useCardStyles_unstable","renderCard_unstable","displayName"],"mappings":";;;;+BAOiBA;;aAAAA;;;6DAPM;yBACU;4BACG;qCACG;qCACH;AAGzB,MAAMA,OAAO,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACjE,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtC,MAAMG,mBAAmBC,IAAAA,wCAAmB,EAACH;IAC7CI,IAAAA,2CAAsB,EAACJ;IACvB,OAAOK,IAAAA,+BAAmB,EAACL,OAAOE;AACtC;AACAP,KAAKW,WAAW,GAAG"}
+{"version":3,"sources":["Card.js"],"sourcesContent":["import * as React from 'react';\nimport { useCard_unstable } from './useCard';\nimport { renderCard_unstable } from './renderCard';\nimport { useCardStyles_unstable } from './useCardStyles.styles';\nimport { useCardContextValue } from './useCardContextValue';\n/**\n * A card provides scaffolding for hosting actions and content for a single topic.\n */ export const Card = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useCard_unstable(props, ref);\n    const cardContextValue = useCardContextValue(state);\n    useCardStyles_unstable(state);\n    return renderCard_unstable(state, cardContextValue);\n});\nCard.displayName = 'Card';\n"],"names":["Card","React","forwardRef","props","ref","state","useCard_unstable","cardContextValue","useCardContextValue","useCardStyles_unstable","renderCard_unstable","displayName"],"mappings":";;;;+BAOiBA;;;eAAAA;;;;iEAPM;yBACU;4BACG;qCACG;qCACH;AAGzB,MAAMA,OAAO,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC3D,MAAMC,QAAQC,IAAAA,yBAAgB,EAACH,OAAOC;IACtC,MAAMG,mBAAmBC,IAAAA,wCAAmB,EAACH;IAC7CI,IAAAA,2CAAsB,EAACJ;IACvB,OAAOK,IAAAA,+BAAmB,EAACL,OAAOE;AACtC;AACAP,KAAKW,WAAW,GAAG"}

package/lib-commonjs/components/Card/Card.types.js

@@ -2,5 +2,5 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

package/lib-commonjs/components/Card/Card.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Card.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
+{"version":3,"sources":["Card.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}

package/lib-commonjs/components/Card/CardContext.js

@@ -9,12 +9,18 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    cardContextDefaultValue: ()=>cardContextDefaultValue,
-    CardProvider: ()=>CardProvider,
-    useCardContext_unstable: ()=>useCardContext_unstable
+    cardContextDefaultValue: function() {
+        return cardContextDefaultValue;
+    },
+    CardProvider: function() {
+        return CardProvider;
+    },
+    useCardContext_unstable: function() {
+        return useCardContext_unstable;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const cardContext = /*#__PURE__*/ _react.createContext(undefined);
 const cardContextDefaultValue = {
     selectableA11yProps: {

package/lib-commonjs/components/Card/CardContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CardContext.js"],"sourcesContent":["import * as React from 'react';\nconst cardContext = React.createContext(undefined);\n/**\n * @internal\n */ export const cardContextDefaultValue = {\n    selectableA11yProps: {\n        referenceId: undefined,\n        setReferenceId () {\n        /* Noop */ },\n        referenceLabel: undefined,\n        setReferenceLabel () {\n        /* Noop */ }\n    }\n};\n/**\n * @internal\n */ export const CardProvider = cardContext.Provider;\nvar _React_useContext;\n/**\n * @internal\n */ export const useCardContext_unstable = ()=>(_React_useContext = React.useContext(cardContext)) !== null && _React_useContext !== void 0 ? _React_useContext : cardContextDefaultValue;\n"],"names":["cardContextDefaultValue","CardProvider","useCardContext_unstable","cardContext","React","createContext","undefined","selectableA11yProps","referenceId","setReferenceId","referenceLabel","setReferenceLabel","Provider","_React_useContext","useContext"],"mappings":";;;;;;;;;;;IAIiBA,uBAAuB,MAAvBA;IAYAC,YAAY,MAAZA;IAIAC,uBAAuB,MAAvBA;;;6DApBM;AACvB,MAAMC,4BAAcC,OAAMC,aAAa,CAACC;AAG7B,MAAMN,0BAA0B;IACvCO,qBAAqB;QACjBC,aAAaF;QACbG,kBAAkB;QAClB,QAAQ,GAAG;QACXC,gBAAgBJ;QAChBK,qBAAqB;QACrB,QAAQ,GAAG;IACf;AACJ;AAGW,MAAMV,eAAeE,YAAYS,QAAQ;AACpD,IAAIC;AAGO,MAAMX,0BAA0B,IAAI,AAACW,CAAAA,oBAAoBT,OAAMU,UAAU,CAACX,YAAW,MAAO,IAAI,IAAIU,sBAAsB,KAAK,IAAIA,oBAAoBb,uBAAuB"}
+{"version":3,"sources":["CardContext.js"],"sourcesContent":["import * as React from 'react';\nconst cardContext = React.createContext(undefined);\n/**\n * @internal\n */ export const cardContextDefaultValue = {\n    selectableA11yProps: {\n        referenceId: undefined,\n        setReferenceId () {\n        /* Noop */ },\n        referenceLabel: undefined,\n        setReferenceLabel () {\n        /* Noop */ }\n    }\n};\n/**\n * @internal\n */ export const CardProvider = cardContext.Provider;\nvar _React_useContext;\n/**\n * @internal\n */ export const useCardContext_unstable = ()=>(_React_useContext = React.useContext(cardContext)) !== null && _React_useContext !== void 0 ? _React_useContext : cardContextDefaultValue;\n"],"names":["cardContextDefaultValue","CardProvider","useCardContext_unstable","cardContext","React","createContext","undefined","selectableA11yProps","referenceId","setReferenceId","referenceLabel","setReferenceLabel","Provider","_React_useContext","useContext"],"mappings":";;;;;;;;;;;IAIiBA,uBAAuB;eAAvBA;;IAYAC,YAAY;eAAZA;;IAIAC,uBAAuB;eAAvBA;;;;iEApBM;AACvB,MAAMC,4BAAcC,OAAMC,aAAa,CAACC;AAG7B,MAAMN,0BAA0B;IACvCO,qBAAqB;QACjBC,aAAaF;QACbG;QACA,QAAQ,GAAG;QACXC,gBAAgBJ;QAChBK;QACA,QAAQ,GAAG;IACf;AACJ;AAGW,MAAMV,eAAeE,YAAYS,QAAQ;AACpD,IAAIC;AAGO,MAAMX,0BAA0B,IAAI,AAACW,CAAAA,oBAAoBT,OAAMU,UAAU,CAACX,YAAW,MAAO,QAAQU,sBAAsB,KAAK,IAAIA,oBAAoBb"}

package/lib-commonjs/components/Card/index.js

@@ -2,10 +2,10 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./Card"), exports);
-_exportStar(require("./Card.types"), exports);
-_exportStar(require("./CardContext"), exports);
-_exportStar(require("./renderCard"), exports);
-_exportStar(require("./useCard"), exports);
-_exportStar(require("./useCardStyles.styles"), exports);
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./Card"), exports);
+_export_star._(require("./Card.types"), exports);
+_export_star._(require("./CardContext"), exports);
+_export_star._(require("./renderCard"), exports);
+_export_star._(require("./useCard"), exports);
+_export_star._(require("./useCardStyles.styles"), exports);

package/lib-commonjs/components/Card/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Card';\nexport * from './Card.types';\nexport * from './CardContext';\nexport * from './renderCard';\nexport * from './useCard';\nexport * from './useCardStyles.styles';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA"}
+{"version":3,"sources":["index.js"],"sourcesContent":["export * from './Card';\nexport * from './Card.types';\nexport * from './CardContext';\nexport * from './renderCard';\nexport * from './useCard';\nexport * from './useCardStyles.styles';\n"],"names":[],"mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/Card/renderCard.js

@@ -1,17 +1,26 @@
-/** @jsxRuntime classic */ /** @jsx createElement */ "use strict";
+/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
 Object.defineProperty(exports, "renderCard_unstable", {
     enumerable: true,
-    get: ()=>renderCard_unstable
+    get: function() {
+        return renderCard_unstable;
+    }
 });
-const _reactJsxRuntime = require("@fluentui/react-jsx-runtime");
-const _reactUtilities = require("@fluentui/react-utilities");
-const _cardContext = require("./CardContext");
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const _CardContext = require("./CardContext");
 const renderCard_unstable = (state, cardContextValue)=>{
-    (0, _reactUtilities.assertSlots)(state);
-    return /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.root, null, /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(_cardContext.CardProvider, {
-        value: cardContextValue
-    }, state.checkbox ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.checkbox, null) : null, state.floatingAction ? /*#__PURE__*/ (0, _reactJsxRuntime.createElement)(state.floatingAction, null) : null, state.root.children));
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_CardContext.CardProvider, {
+            value: cardContextValue,
+            children: [
+                state.checkbox ? /*#__PURE__*/ (0, _jsxruntime.jsx)(state.checkbox, {}) : null,
+                state.floatingAction ? /*#__PURE__*/ (0, _jsxruntime.jsx)(state.floatingAction, {}) : null,
+                state.root.children
+            ]
+        })
+    });
 };

package/lib-commonjs/components/Card/renderCard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderCard.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { CardProvider } from './CardContext';\n/**\n * Render the final JSX of Card.\n */ export const renderCard_unstable = (state, cardContextValue)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ createElement(state.root, null, /*#__PURE__*/ createElement(CardProvider, {\n        value: cardContextValue\n    }, state.checkbox ? /*#__PURE__*/ createElement(state.checkbox, null) : null, state.floatingAction ? /*#__PURE__*/ createElement(state.floatingAction, null) : null, state.root.children));\n};\n"],"names":["renderCard_unstable","state","cardContextValue","assertSlots","createElement","root","CardProvider","value","checkbox","floatingAction","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKjCA;;aAAAA;;iCALkE;gCACvD;6BACC;AAGlB,MAAMA,sBAAsB,CAACC,OAAOC,mBAAmB;IAC9DC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,8BAAa,EAACH,MAAMI,IAAI,EAAE,IAAI,EAAE,WAAW,GAAGD,IAAAA,8BAAa,EAACE,yBAAY,EAAE;QAC3FC,OAAOL;IACX,GAAGD,MAAMO,QAAQ,GAAG,WAAW,GAAGJ,IAAAA,8BAAa,EAACH,MAAMO,QAAQ,EAAE,IAAI,IAAI,IAAI,EAAEP,MAAMQ,cAAc,GAAG,WAAW,GAAGL,IAAAA,8BAAa,EAACH,MAAMQ,cAAc,EAAE,IAAI,IAAI,IAAI,EAAER,MAAMI,IAAI,CAACK,QAAQ;AAC5L"}
+{"version":3,"sources":["renderCard.js"],"sourcesContent":["/** @jsxRuntime automatic */ /** @jsxImportSource @fluentui/react-jsx-runtime */ import { jsx as _jsx, jsxs as _jsxs } from \"@fluentui/react-jsx-runtime/jsx-runtime\";\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { CardProvider } from './CardContext';\n/**\n * Render the final JSX of Card.\n */ export const renderCard_unstable = (state, cardContextValue)=>{\n    assertSlots(state);\n    return /*#__PURE__*/ _jsx(state.root, {\n        children: /*#__PURE__*/ _jsxs(CardProvider, {\n            value: cardContextValue,\n            children: [\n                state.checkbox ? /*#__PURE__*/ _jsx(state.checkbox, {}) : null,\n                state.floatingAction ? /*#__PURE__*/ _jsx(state.floatingAction, {}) : null,\n                state.root.children\n            ]\n        })\n    });\n};\n"],"names":["renderCard_unstable","state","cardContextValue","assertSlots","_jsx","root","children","_jsxs","CardProvider","value","checkbox","floatingAction"],"mappings":"AAAA,0BAA0B,GAAG,iDAAiD;;;;+BAK7DA;;;eAAAA;;;4BAL2G;gCAChG;6BACC;AAGlB,MAAMA,sBAAsB,CAACC,OAAOC;IAC3CC,IAAAA,2BAAW,EAACF;IACZ,OAAO,WAAW,GAAGG,IAAAA,eAAI,EAACH,MAAMI,IAAI,EAAE;QAClCC,UAAU,WAAW,GAAGC,IAAAA,gBAAK,EAACC,yBAAY,EAAE;YACxCC,OAAOP;YACPI,UAAU;gBACNL,MAAMS,QAAQ,GAAG,WAAW,GAAGN,IAAAA,eAAI,EAACH,MAAMS,QAAQ,EAAE,CAAC,KAAK;gBAC1DT,MAAMU,cAAc,GAAG,WAAW,GAAGP,IAAAA,eAAI,EAACH,MAAMU,cAAc,EAAE,CAAC,KAAK;gBACtEV,MAAMI,IAAI,CAACC,QAAQ;aACtB;QACL;IACJ;AACJ"}

package/lib-commonjs/components/Card/useCard.js

@@ -4,14 +4,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "useCard_unstable", {
     enumerable: true,
-    get: ()=>useCard_unstable
+    get: function() {
+        return useCard_unstable;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactUtilities = require("@fluentui/react-utilities");
-const _reactTabster = require("@fluentui/react-tabster");
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactutilities = require("@fluentui/react-utilities");
+const _reacttabster = require("@fluentui/react-tabster");
 const _useCardSelectable = require("./useCardSelectable");
-const _cardContext = require("./CardContext");
+const _CardContext = require("./CardContext");
 const focusMap = {
     off: undefined,
     'no-tab': 'limited-trap-focus',
@@ -25,7 +27,7 @@ const focusMap = {
  * and control focus properties based on that.
  *
  * @param props - props from this instance of Card
- */ const useCardInteractive = ({ focusMode ='off' , ...props })=>{
+ */ const useCardInteractive = ({ focusMode = 'off', ...props })=>{
     const interactive = [
         'onClick',
         'onDoubleClick',
@@ -38,7 +40,7 @@ const focusMap = {
         'onDragStart',
         'onDragEnd'
     ].some((prop)=>props[prop]);
-    const groupperAttrs = (0, _reactTabster.useFocusableGroup)({
+    const groupperAttrs = (0, _reacttabster.useFocusableGroup)({
         tabBehavior: focusMap[interactive ? 'no-tab' : focusMode]
     });
     const interactiveFocusAttributes = {
@@ -51,16 +53,16 @@ const focusMap = {
     };
 };
 const useCard_unstable = (props, ref)=>{
-    const { appearance ='filled' , orientation ='vertical' , size ='medium'  } = props;
-    const [referenceId, setReferenceId] = _react.useState(_cardContext.cardContextDefaultValue.selectableA11yProps.referenceId);
-    const [referenceLabel, setReferenceLabel] = _react.useState(_cardContext.cardContextDefaultValue.selectableA11yProps.referenceId);
-    const cardBaseRef = (0, _reactTabster.useFocusWithin)();
-    const { selectable , selected , selectableCardProps , selectFocused , checkboxSlot , floatingActionSlot  } = (0, _useCardSelectable.useCardSelectable)(props, {
+    const { appearance = 'filled', orientation = 'vertical', size = 'medium' } = props;
+    const [referenceId, setReferenceId] = _react.useState(_CardContext.cardContextDefaultValue.selectableA11yProps.referenceId);
+    const [referenceLabel, setReferenceLabel] = _react.useState(_CardContext.cardContextDefaultValue.selectableA11yProps.referenceId);
+    const cardBaseRef = (0, _reacttabster.useFocusWithin)();
+    const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } = (0, _useCardSelectable.useCardSelectable)(props, {
         referenceId,
         referenceLabel
     }, cardBaseRef);
-    const cardRef = (0, _reactUtilities.useMergedRefs)(cardBaseRef, ref);
-    const { interactive , focusAttributes  } = useCardInteractive(props);
+    const cardRef = (0, _reactutilities.useMergedRefs)(cardBaseRef, ref);
+    const { interactive, focusAttributes } = useCardInteractive(props);
     return {
         appearance,
         orientation,
@@ -80,7 +82,7 @@ const useCard_unstable = (props, ref)=>{
             floatingAction: 'div',
             checkbox: 'input'
         },
-        root: _reactUtilities.slot.always((0, _reactUtilities.getNativeElementProps)('div', {
+        root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
             ref: cardRef,
             role: 'group',
             ...focusAttributes,

package/lib-commonjs/components/Card/useCard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCard.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusWithin } from '@fluentui/react-tabster';\nimport { useCardSelectable } from './useCardSelectable';\nimport { cardContextDefaultValue } from './CardContext';\nconst focusMap = {\n    off: undefined,\n    'no-tab': 'limited-trap-focus',\n    'tab-exit': 'limited',\n    'tab-only': 'unlimited'\n};\n/**\n * Create the state for interactive cards.\n *\n * This internal hook defines if the card is interactive\n * and control focus properties based on that.\n *\n * @param props - props from this instance of Card\n */ const useCardInteractive = ({ focusMode ='off' , ...props })=>{\n    const interactive = [\n        'onClick',\n        'onDoubleClick',\n        'onMouseUp',\n        'onMouseDown',\n        'onPointerUp',\n        'onPointerDown',\n        'onTouchStart',\n        'onTouchEnd',\n        'onDragStart',\n        'onDragEnd'\n    ].some((prop)=>props[prop]);\n    const groupperAttrs = useFocusableGroup({\n        tabBehavior: focusMap[interactive ? 'no-tab' : focusMode]\n    });\n    const interactiveFocusAttributes = {\n        ...groupperAttrs,\n        tabIndex: 0\n    };\n    return {\n        interactive,\n        focusAttributes: focusMode === 'off' ? null : interactiveFocusAttributes\n    };\n};\n/**\n * Create the state required to render Card.\n *\n * The returned state can be modified with hooks such as useCardStyles_unstable,\n * before being passed to renderCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n */ export const useCard_unstable = (props, ref)=>{\n    const { appearance ='filled' , orientation ='vertical' , size ='medium'  } = props;\n    const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n    const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n    const cardBaseRef = useFocusWithin();\n    const { selectable , selected , selectableCardProps , selectFocused , checkboxSlot , floatingActionSlot  } = useCardSelectable(props, {\n        referenceId,\n        referenceLabel\n    }, cardBaseRef);\n    const cardRef = useMergedRefs(cardBaseRef, ref);\n    const { interactive , focusAttributes  } = useCardInteractive(props);\n    return {\n        appearance,\n        orientation,\n        size,\n        interactive,\n        selectable,\n        selectFocused,\n        selected,\n        selectableA11yProps: {\n            setReferenceId,\n            referenceId,\n            referenceLabel,\n            setReferenceLabel\n        },\n        components: {\n            root: 'div',\n            floatingAction: 'div',\n            checkbox: 'input'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref: cardRef,\n            role: 'group',\n            ...focusAttributes,\n            ...props,\n            ...selectableCardProps\n        }), {\n            elementType: 'div'\n        }),\n        floatingAction: floatingActionSlot,\n        checkbox: checkboxSlot\n    };\n};\n"],"names":["useCard_unstable","focusMap","off","undefined","useCardInteractive","focusMode","props","interactive","some","prop","groupperAttrs","useFocusableGroup","tabBehavior","interactiveFocusAttributes","tabIndex","focusAttributes","ref","appearance","orientation","size","referenceId","setReferenceId","React","useState","cardContextDefaultValue","selectableA11yProps","referenceLabel","setReferenceLabel","cardBaseRef","useFocusWithin","selectable","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","useCardSelectable","cardRef","useMergedRefs","components","root","floatingAction","checkbox","slot","always","getNativeElementProps","role","elementType"],"mappings":";;;;+BAmDiBA;;aAAAA;;;6DAnDM;gCACoC;8BACT;mCAChB;6BACM;AACxC,MAAMC,WAAW;IACbC,KAAKC;IACL,UAAU;IACV,YAAY;IACZ,YAAY;AAChB;AACA;;;;;;;CAOC,GAAG,MAAMC,qBAAqB,CAAC,EAAEC,WAAW,MAAK,EAAG,GAAGC,OAAO,GAAG;IAC9D,MAAMC,cAAc;QAChB;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;KACH,CAACC,IAAI,CAAC,CAACC,OAAOH,KAAK,CAACG,KAAK;IAC1B,MAAMC,gBAAgBC,IAAAA,+BAAiB,EAAC;QACpCC,aAAaX,QAAQ,CAACM,cAAc,WAAWF,SAAS,CAAC;IAC7D;IACA,MAAMQ,6BAA6B;QAC/B,GAAGH,aAAa;QAChBI,UAAU;IACd;IACA,OAAO;QACHP;QACAQ,iBAAiBV,cAAc,QAAQ,IAAI,GAAGQ,0BAA0B;IAC5E;AACJ;AASW,MAAMb,mBAAmB,CAACM,OAAOU,MAAM;IAC9C,MAAM,EAAEC,YAAY,SAAQ,EAAGC,aAAa,WAAU,EAAGC,MAAM,SAAQ,EAAG,GAAGb;IAC7E,MAAM,CAACc,aAAaC,eAAe,GAAGC,OAAMC,QAAQ,CAACC,oCAAuB,CAACC,mBAAmB,CAACL,WAAW;IAC5G,MAAM,CAACM,gBAAgBC,kBAAkB,GAAGL,OAAMC,QAAQ,CAACC,oCAAuB,CAACC,mBAAmB,CAACL,WAAW;IAClH,MAAMQ,cAAcC,IAAAA,4BAAc;IAClC,MAAM,EAAEC,WAAU,EAAGC,SAAQ,EAAGC,oBAAmB,EAAGC,cAAa,EAAGC,aAAY,EAAGC,mBAAkB,EAAG,GAAGC,IAAAA,oCAAiB,EAAC9B,OAAO;QAClIc;QACAM;IACJ,GAAGE;IACH,MAAMS,UAAUC,IAAAA,6BAAa,EAACV,aAAaZ;IAC3C,MAAM,EAAET,YAAW,EAAGQ,gBAAe,EAAG,GAAGX,mBAAmBE;IAC9D,OAAO;QACHW;QACAC;QACAC;QACAZ;QACAuB;QACAG;QACAF;QACAN,qBAAqB;YACjBJ;YACAD;YACAM;YACAC;QACJ;QACAY,YAAY;YACRC,MAAM;YACNC,gBAAgB;YAChBC,UAAU;QACd;QACAF,MAAMG,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3C7B,KAAKqB;YACLS,MAAM;YACN,GAAG/B,eAAe;YAClB,GAAGT,KAAK;YACR,GAAG0B,mBAAmB;QAC1B,IAAI;YACAe,aAAa;QACjB;QACAN,gBAAgBN;QAChBO,UAAUR;IACd;AACJ"}
+{"version":3,"sources":["useCard.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusWithin } from '@fluentui/react-tabster';\nimport { useCardSelectable } from './useCardSelectable';\nimport { cardContextDefaultValue } from './CardContext';\nconst focusMap = {\n    off: undefined,\n    'no-tab': 'limited-trap-focus',\n    'tab-exit': 'limited',\n    'tab-only': 'unlimited'\n};\n/**\n * Create the state for interactive cards.\n *\n * This internal hook defines if the card is interactive\n * and control focus properties based on that.\n *\n * @param props - props from this instance of Card\n */ const useCardInteractive = ({ focusMode = 'off', ...props })=>{\n    const interactive = [\n        'onClick',\n        'onDoubleClick',\n        'onMouseUp',\n        'onMouseDown',\n        'onPointerUp',\n        'onPointerDown',\n        'onTouchStart',\n        'onTouchEnd',\n        'onDragStart',\n        'onDragEnd'\n    ].some((prop)=>props[prop]);\n    const groupperAttrs = useFocusableGroup({\n        tabBehavior: focusMap[interactive ? 'no-tab' : focusMode]\n    });\n    const interactiveFocusAttributes = {\n        ...groupperAttrs,\n        tabIndex: 0\n    };\n    return {\n        interactive,\n        focusAttributes: focusMode === 'off' ? null : interactiveFocusAttributes\n    };\n};\n/**\n * Create the state required to render Card.\n *\n * The returned state can be modified with hooks such as useCardStyles_unstable,\n * before being passed to renderCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n */ export const useCard_unstable = (props, ref)=>{\n    const { appearance = 'filled', orientation = 'vertical', size = 'medium' } = props;\n    const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n    const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n    const cardBaseRef = useFocusWithin();\n    const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } = useCardSelectable(props, {\n        referenceId,\n        referenceLabel\n    }, cardBaseRef);\n    const cardRef = useMergedRefs(cardBaseRef, ref);\n    const { interactive, focusAttributes } = useCardInteractive(props);\n    return {\n        appearance,\n        orientation,\n        size,\n        interactive,\n        selectable,\n        selectFocused,\n        selected,\n        selectableA11yProps: {\n            setReferenceId,\n            referenceId,\n            referenceLabel,\n            setReferenceLabel\n        },\n        components: {\n            root: 'div',\n            floatingAction: 'div',\n            checkbox: 'input'\n        },\n        root: slot.always(getNativeElementProps('div', {\n            ref: cardRef,\n            role: 'group',\n            ...focusAttributes,\n            ...props,\n            ...selectableCardProps\n        }), {\n            elementType: 'div'\n        }),\n        floatingAction: floatingActionSlot,\n        checkbox: checkboxSlot\n    };\n};\n"],"names":["useCard_unstable","focusMap","off","undefined","useCardInteractive","focusMode","props","interactive","some","prop","groupperAttrs","useFocusableGroup","tabBehavior","interactiveFocusAttributes","tabIndex","focusAttributes","ref","appearance","orientation","size","referenceId","setReferenceId","React","useState","cardContextDefaultValue","selectableA11yProps","referenceLabel","setReferenceLabel","cardBaseRef","useFocusWithin","selectable","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","useCardSelectable","cardRef","useMergedRefs","components","root","floatingAction","checkbox","slot","always","getNativeElementProps","role","elementType"],"mappings":";;;;+BAmDiBA;;;eAAAA;;;;iEAnDM;gCACoC;8BACT;mCAChB;6BACM;AACxC,MAAMC,WAAW;IACbC,KAAKC;IACL,UAAU;IACV,YAAY;IACZ,YAAY;AAChB;AACA;;;;;;;CAOC,GAAG,MAAMC,qBAAqB,CAAC,EAAEC,YAAY,KAAK,EAAE,GAAGC,OAAO;IAC3D,MAAMC,cAAc;QAChB;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;KACH,CAACC,IAAI,CAAC,CAACC,OAAOH,KAAK,CAACG,KAAK;IAC1B,MAAMC,gBAAgBC,IAAAA,+BAAiB,EAAC;QACpCC,aAAaX,QAAQ,CAACM,cAAc,WAAWF,UAAU;IAC7D;IACA,MAAMQ,6BAA6B;QAC/B,GAAGH,aAAa;QAChBI,UAAU;IACd;IACA,OAAO;QACHP;QACAQ,iBAAiBV,cAAc,QAAQ,OAAOQ;IAClD;AACJ;AASW,MAAMb,mBAAmB,CAACM,OAAOU;IACxC,MAAM,EAAEC,aAAa,QAAQ,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGb;IAC7E,MAAM,CAACc,aAAaC,eAAe,GAAGC,OAAMC,QAAQ,CAACC,oCAAuB,CAACC,mBAAmB,CAACL,WAAW;IAC5G,MAAM,CAACM,gBAAgBC,kBAAkB,GAAGL,OAAMC,QAAQ,CAACC,oCAAuB,CAACC,mBAAmB,CAACL,WAAW;IAClH,MAAMQ,cAAcC,IAAAA,4BAAc;IAClC,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,aAAa,EAAEC,YAAY,EAAEC,kBAAkB,EAAE,GAAGC,IAAAA,oCAAiB,EAAC9B,OAAO;QAC5Hc;QACAM;IACJ,GAAGE;IACH,MAAMS,UAAUC,IAAAA,6BAAa,EAACV,aAAaZ;IAC3C,MAAM,EAAET,WAAW,EAAEQ,eAAe,EAAE,GAAGX,mBAAmBE;IAC5D,OAAO;QACHW;QACAC;QACAC;QACAZ;QACAuB;QACAG;QACAF;QACAN,qBAAqB;YACjBJ;YACAD;YACAM;YACAC;QACJ;QACAY,YAAY;YACRC,MAAM;YACNC,gBAAgB;YAChBC,UAAU;QACd;QACAF,MAAMG,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3C7B,KAAKqB;YACLS,MAAM;YACN,GAAG/B,eAAe;YAClB,GAAGT,KAAK;YACR,GAAG0B,mBAAmB;QAC1B,IAAI;YACAe,aAAa;QACjB;QACAN,gBAAgBN;QAChBO,UAAUR;IACd;AACJ"}

package/lib-commonjs/components/Card/useCardContextValue.js

@@ -4,9 +4,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "useCardContextValue", {
     enumerable: true,
-    get: ()=>useCardContextValue
+    get: function() {
+        return useCardContextValue;
+    }
 });
-function useCardContextValue({ selectableA11yProps  }) {
+function useCardContextValue({ selectableA11yProps }) {
     return {
         selectableA11yProps
     };

package/lib-commonjs/components/Card/useCardContextValue.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCardContextValue.js"],"sourcesContent":["export function useCardContextValue({ selectableA11yProps  }) {\n    return {\n        selectableA11yProps\n    };\n}\n"],"names":["useCardContextValue","selectableA11yProps"],"mappings":";;;;+BAAgBA;;aAAAA;;AAAT,SAASA,oBAAoB,EAAEC,oBAAmB,EAAG,EAAE;IAC1D,OAAO;QACHA;IACJ;AACJ"}
+{"version":3,"sources":["useCardContextValue.js"],"sourcesContent":["export function useCardContextValue({ selectableA11yProps }) {\n    return {\n        selectableA11yProps\n    };\n}\n"],"names":["useCardContextValue","selectableA11yProps"],"mappings":";;;;+BAAgBA;;;eAAAA;;;AAAT,SAASA,oBAAoB,EAAEC,mBAAmB,EAAE;IACvD,OAAO;QACHA;IACJ;AACJ"}

package/lib-commonjs/components/Card/useCardSelectable.js

@@ -4,16 +4,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "useCardSelectable", {
     enumerable: true,
-    get: ()=>useCardSelectable
+    get: function() {
+        return useCardSelectable;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactUtilities = require("@fluentui/react-utilities");
-const _keyboardKeys = require("@fluentui/keyboard-keys");
-const _reactTabster = require("@fluentui/react-tabster");
-const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
-    const { checkbox ={} , selected , defaultSelected , onSelectionChange , floatingAction , onClick , onKeyDown  } = props;
-    const { findAllFocusable  } = (0, _reactTabster.useFocusFinders)();
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactutilities = require("@fluentui/react-utilities");
+const _keyboardkeys = require("@fluentui/keyboard-keys");
+const _reacttabster = require("@fluentui/react-tabster");
+const useCardSelectable = (props, { referenceLabel, referenceId }, cardRef)=>{
+    const { checkbox = {}, selected, defaultSelected, onSelectionChange, floatingAction, onClick, onKeyDown } = props;
+    const { findAllFocusable } = (0, _reacttabster.useFocusFinders)();
     const checkboxRef = _react.useRef(null);
     const isSelectable = [
         selected,
@@ -23,13 +25,14 @@ const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
     const [isCardSelected, setIsCardSelected] = _react.useState(false);
     const [isSelectFocused, setIsSelectFocused] = _react.useState(false);
     const shouldRestrictTriggerAction = _react.useCallback((event)=>{
+        var _checkboxRef;
         if (!cardRef.current) {
             return false;
         }
         const focusableElements = findAllFocusable(cardRef.current);
         const target = event.target;
         const isElementInFocusableGroup = focusableElements.some((element)=>element.contains(target));
-        const isCheckboxSlot = (checkboxRef === null || checkboxRef === void 0 ? void 0 : checkboxRef.current) === target;
+        const isCheckboxSlot = ((_checkboxRef = checkboxRef) === null || _checkboxRef === void 0 ? void 0 : _checkboxRef.current) === target;
         return isElementInFocusableGroup && !isCheckboxSlot;
     }, [
         cardRef,
@@ -53,7 +56,7 @@ const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
     ]);
     const onKeyDownHandler = _react.useCallback((event)=>{
         if ([
-            _keyboardKeys.Enter
+            _keyboardkeys.Enter
         ].includes(event.key)) {
             event.preventDefault();
             onChangeHandler(event);
@@ -71,7 +74,7 @@ const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
         } else if (referenceLabel) {
             selectableCheckboxProps['aria-label'] = referenceLabel;
         }
-        return _reactUtilities.slot.optional(checkbox, {
+        return _reactutilities.slot.optional(checkbox, {
             defaultProps: {
                 ref: checkboxRef,
                 type: 'checkbox',
@@ -96,7 +99,7 @@ const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
         if (!floatingAction) {
             return;
         }
-        return _reactUtilities.slot.optional(floatingAction, {
+        return _reactutilities.slot.optional(floatingAction, {
             defaultProps: {
                 ref: checkboxRef
             },
@@ -110,8 +113,8 @@ const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{
             return null;
         }
         return {
-            onClick: (0, _reactUtilities.mergeCallbacks)(onClick, onChangeHandler),
-            onKeyDown: (0, _reactUtilities.mergeCallbacks)(onKeyDown, onKeyDownHandler)
+            onClick: (0, _reactutilities.mergeCallbacks)(onClick, onChangeHandler),
+            onKeyDown: (0, _reactutilities.mergeCallbacks)(onKeyDown, onKeyDownHandler)
         };
     }, [
         isSelectable,

package/lib-commonjs/components/Card/useCardSelectable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useCardSelectable.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, slot } from '@fluentui/react-utilities';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n/**\n * @internal\n *\n * Create the state related to selectable cards.\n *\n * This internal hook controls all the logic for selectable cards and is\n * intended to be used alongside with useCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param a11yProps - accessibility props shared between elements of the card\n * @param ref - reference to the root element of Card\n */ export const useCardSelectable = (props, { referenceLabel , referenceId  }, cardRef)=>{\n    const { checkbox ={} , selected , defaultSelected , onSelectionChange , floatingAction , onClick , onKeyDown  } = props;\n    const { findAllFocusable  } = useFocusFinders();\n    const checkboxRef = React.useRef(null);\n    const isSelectable = [\n        selected,\n        defaultSelected,\n        onSelectionChange\n    ].some((prop)=>typeof prop !== 'undefined');\n    const [isCardSelected, setIsCardSelected] = React.useState(false);\n    const [isSelectFocused, setIsSelectFocused] = React.useState(false);\n    const shouldRestrictTriggerAction = React.useCallback((event)=>{\n        if (!cardRef.current) {\n            return false;\n        }\n        const focusableElements = findAllFocusable(cardRef.current);\n        const target = event.target;\n        const isElementInFocusableGroup = focusableElements.some((element)=>element.contains(target));\n        const isCheckboxSlot = (checkboxRef === null || checkboxRef === void 0 ? void 0 : checkboxRef.current) === target;\n        return isElementInFocusableGroup && !isCheckboxSlot;\n    }, [\n        cardRef,\n        findAllFocusable\n    ]);\n    const onChangeHandler = React.useCallback((event)=>{\n        if (shouldRestrictTriggerAction(event)) {\n            return;\n        }\n        const newCheckedValue = !isCardSelected;\n        setIsCardSelected(newCheckedValue);\n        if (onSelectionChange) {\n            onSelectionChange(event, {\n                selected: newCheckedValue\n            });\n        }\n    }, [\n        onSelectionChange,\n        isCardSelected,\n        shouldRestrictTriggerAction\n    ]);\n    const onKeyDownHandler = React.useCallback((event)=>{\n        if ([\n            Enter\n        ].includes(event.key)) {\n            event.preventDefault();\n            onChangeHandler(event);\n        }\n    }, [\n        onChangeHandler\n    ]);\n    const checkboxSlot = React.useMemo(()=>{\n        if (!isSelectable || floatingAction) {\n            return;\n        }\n        const selectableCheckboxProps = {};\n        if (referenceId) {\n            selectableCheckboxProps['aria-labelledby'] = referenceId;\n        } else if (referenceLabel) {\n            selectableCheckboxProps['aria-label'] = referenceLabel;\n        }\n        return slot.optional(checkbox, {\n            defaultProps: {\n                ref: checkboxRef,\n                type: 'checkbox',\n                checked: isCardSelected,\n                onChange: (event)=>onChangeHandler(event),\n                onFocus: ()=>setIsSelectFocused(true),\n                onBlur: ()=>setIsSelectFocused(false),\n                ...selectableCheckboxProps\n            },\n            elementType: 'input'\n        });\n    }, [\n        checkbox,\n        floatingAction,\n        isCardSelected,\n        isSelectable,\n        onChangeHandler,\n        referenceId,\n        referenceLabel\n    ]);\n    const floatingActionSlot = React.useMemo(()=>{\n        if (!floatingAction) {\n            return;\n        }\n        return slot.optional(floatingAction, {\n            defaultProps: {\n                ref: checkboxRef\n            },\n            elementType: 'div'\n        });\n    }, [\n        floatingAction\n    ]);\n    const selectableCardProps = React.useMemo(()=>{\n        if (!isSelectable) {\n            return null;\n        }\n        return {\n            onClick: mergeCallbacks(onClick, onChangeHandler),\n            onKeyDown: mergeCallbacks(onKeyDown, onKeyDownHandler)\n        };\n    }, [\n        isSelectable,\n        onChangeHandler,\n        onClick,\n        onKeyDown,\n        onKeyDownHandler\n    ]);\n    React.useEffect(()=>setIsCardSelected(Boolean(defaultSelected !== null && defaultSelected !== void 0 ? defaultSelected : selected)), [\n        defaultSelected,\n        selected,\n        setIsCardSelected\n    ]);\n    return {\n        selected: isCardSelected,\n        selectable: isSelectable,\n        selectFocused: isSelectFocused,\n        selectableCardProps,\n        checkboxSlot,\n        floatingActionSlot\n    };\n};\n"],"names":["useCardSelectable","props","referenceLabel","referenceId","cardRef","checkbox","selected","defaultSelected","onSelectionChange","floatingAction","onClick","onKeyDown","findAllFocusable","useFocusFinders","checkboxRef","React","useRef","isSelectable","some","prop","isCardSelected","setIsCardSelected","useState","isSelectFocused","setIsSelectFocused","shouldRestrictTriggerAction","useCallback","event","current","focusableElements","target","isElementInFocusableGroup","element","contains","isCheckboxSlot","onChangeHandler","newCheckedValue","onKeyDownHandler","Enter","includes","key","preventDefault","checkboxSlot","useMemo","selectableCheckboxProps","slot","optional","defaultProps","ref","type","checked","onChange","onFocus","onBlur","elementType","floatingActionSlot","selectableCardProps","mergeCallbacks","useEffect","Boolean","selectable","selectFocused"],"mappings":"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"}
+{"version":3,"sources":["useCardSelectable.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, slot } from '@fluentui/react-utilities';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n/**\n * @internal\n *\n * Create the state related to selectable cards.\n *\n * This internal hook controls all the logic for selectable cards and is\n * intended to be used alongside with useCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param a11yProps - accessibility props shared between elements of the card\n * @param ref - reference to the root element of Card\n */ export const useCardSelectable = (props, { referenceLabel, referenceId }, cardRef)=>{\n    const { checkbox = {}, selected, defaultSelected, onSelectionChange, floatingAction, onClick, onKeyDown } = props;\n    const { findAllFocusable } = useFocusFinders();\n    const checkboxRef = React.useRef(null);\n    const isSelectable = [\n        selected,\n        defaultSelected,\n        onSelectionChange\n    ].some((prop)=>typeof prop !== 'undefined');\n    const [isCardSelected, setIsCardSelected] = React.useState(false);\n    const [isSelectFocused, setIsSelectFocused] = React.useState(false);\n    const shouldRestrictTriggerAction = React.useCallback((event)=>{\n        var _checkboxRef;\n        if (!cardRef.current) {\n            return false;\n        }\n        const focusableElements = findAllFocusable(cardRef.current);\n        const target = event.target;\n        const isElementInFocusableGroup = focusableElements.some((element)=>element.contains(target));\n        const isCheckboxSlot = ((_checkboxRef = checkboxRef) === null || _checkboxRef === void 0 ? void 0 : _checkboxRef.current) === target;\n        return isElementInFocusableGroup && !isCheckboxSlot;\n    }, [\n        cardRef,\n        findAllFocusable\n    ]);\n    const onChangeHandler = React.useCallback((event)=>{\n        if (shouldRestrictTriggerAction(event)) {\n            return;\n        }\n        const newCheckedValue = !isCardSelected;\n        setIsCardSelected(newCheckedValue);\n        if (onSelectionChange) {\n            onSelectionChange(event, {\n                selected: newCheckedValue\n            });\n        }\n    }, [\n        onSelectionChange,\n        isCardSelected,\n        shouldRestrictTriggerAction\n    ]);\n    const onKeyDownHandler = React.useCallback((event)=>{\n        if ([\n            Enter\n        ].includes(event.key)) {\n            event.preventDefault();\n            onChangeHandler(event);\n        }\n    }, [\n        onChangeHandler\n    ]);\n    const checkboxSlot = React.useMemo(()=>{\n        if (!isSelectable || floatingAction) {\n            return;\n        }\n        const selectableCheckboxProps = {};\n        if (referenceId) {\n            selectableCheckboxProps['aria-labelledby'] = referenceId;\n        } else if (referenceLabel) {\n            selectableCheckboxProps['aria-label'] = referenceLabel;\n        }\n        return slot.optional(checkbox, {\n            defaultProps: {\n                ref: checkboxRef,\n                type: 'checkbox',\n                checked: isCardSelected,\n                onChange: (event)=>onChangeHandler(event),\n                onFocus: ()=>setIsSelectFocused(true),\n                onBlur: ()=>setIsSelectFocused(false),\n                ...selectableCheckboxProps\n            },\n            elementType: 'input'\n        });\n    }, [\n        checkbox,\n        floatingAction,\n        isCardSelected,\n        isSelectable,\n        onChangeHandler,\n        referenceId,\n        referenceLabel\n    ]);\n    const floatingActionSlot = React.useMemo(()=>{\n        if (!floatingAction) {\n            return;\n        }\n        return slot.optional(floatingAction, {\n            defaultProps: {\n                ref: checkboxRef\n            },\n            elementType: 'div'\n        });\n    }, [\n        floatingAction\n    ]);\n    const selectableCardProps = React.useMemo(()=>{\n        if (!isSelectable) {\n            return null;\n        }\n        return {\n            onClick: mergeCallbacks(onClick, onChangeHandler),\n            onKeyDown: mergeCallbacks(onKeyDown, onKeyDownHandler)\n        };\n    }, [\n        isSelectable,\n        onChangeHandler,\n        onClick,\n        onKeyDown,\n        onKeyDownHandler\n    ]);\n    React.useEffect(()=>setIsCardSelected(Boolean(defaultSelected !== null && defaultSelected !== void 0 ? defaultSelected : selected)), [\n        defaultSelected,\n        selected,\n        setIsCardSelected\n    ]);\n    return {\n        selected: isCardSelected,\n        selectable: isSelectable,\n        selectFocused: isSelectFocused,\n        selectableCardProps,\n        checkboxSlot,\n        floatingActionSlot\n    };\n};\n"],"names":["useCardSelectable","props","referenceLabel","referenceId","cardRef","checkbox","selected","defaultSelected","onSelectionChange","floatingAction","onClick","onKeyDown","findAllFocusable","useFocusFinders","checkboxRef","React","useRef","isSelectable","some","prop","isCardSelected","setIsCardSelected","useState","isSelectFocused","setIsSelectFocused","shouldRestrictTriggerAction","useCallback","event","_checkboxRef","current","focusableElements","target","isElementInFocusableGroup","element","contains","isCheckboxSlot","onChangeHandler","newCheckedValue","onKeyDownHandler","Enter","includes","key","preventDefault","checkboxSlot","useMemo","selectableCheckboxProps","slot","optional","defaultProps","ref","type","checked","onChange","onFocus","onBlur","elementType","floatingActionSlot","selectableCardProps","mergeCallbacks","useEffect","Boolean","selectable","selectFocused"],"mappings":"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"}

package/lib-commonjs/components/Card/useCardStyles.styles.js

@@ -9,14 +9,20 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    cardClassNames: ()=>cardClassNames,
-    cardCSSVars: ()=>cardCSSVars,
-    useCardStyles_unstable: ()=>useCardStyles_unstable
+    cardClassNames: function() {
+        return cardClassNames;
+    },
+    cardCSSVars: function() {
+        return cardCSSVars;
+    },
+    useCardStyles_unstable: function() {
+        return useCardStyles_unstable;
+    }
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = require("@griffel/react");
-const _reactTheme = require("@fluentui/react-theme");
-const _react1 = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reacttheme = require("@fluentui/react-theme");
+const _react1 = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const cardClassNames = {
     root: 'fui-Card',
     floatingAction: 'fui-Card__floatingAction',
@@ -28,10 +34,10 @@ const cardCSSVars = {
 };
 const focusOutlineStyle = {
     outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,
-    outlineWidth: _reactTheme.tokens.strokeWidthThick,
+    outlineWidth: _reacttheme.tokens.strokeWidthThick,
     outlineOffset: '-2px'
 };
-const useStyles = /*#__PURE__*/ (0, _react["__styles"])({
+const useStyles = /*#__PURE__*/ (0, _react.__styles)({
     root: {
         B68tc82: "f1p9o1ba",
         Bmxbyg5: "f1sil6mw",