@fluentui/react-card 0.0.0-nightly-20230223-2115.1 → 0.0.0-nightly-20230228-0425.1

package/lib-commonjs/components/CardHeader/useCardHeader.js

@@ -1,54 +1,68 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "useCardHeader_unstable", {
-    enumerable: true,
-    get: ()=>useCardHeader_unstable
+  value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactUtilities = require("@fluentui/react-utilities");
-const _cardContext = require("../Card/CardContext");
-const _useCardHeaderStyles = require("./useCardHeaderStyles");
-const useCardHeader_unstable = (props, ref)=>{
-    const { image , header , description , action  } = props;
-    const { selectableA11yProps: { referenceId , setReferenceId  }  } = (0, _cardContext.useCardContext_unstable)();
-    const headerRef = _react.useRef(null);
-    const generatedId = (0, _reactUtilities.useId)(_useCardHeaderStyles.cardHeaderClassNames.header, referenceId);
-    _react.useEffect(()=>{
-        if (header && headerRef.current) {
-            const { id  } = headerRef.current;
-            setReferenceId(id ? id : generatedId);
-        }
-    }, [
-        header,
-        setReferenceId,
-        generatedId
-    ]);
-    return {
-        components: {
-            root: 'div',
-            image: 'div',
-            header: 'div',
-            description: 'div',
-            action: 'div'
-        },
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
-            ref,
-            ...props
-        }),
-        image: (0, _reactUtilities.resolveShorthand)(image),
-        header: (0, _reactUtilities.resolveShorthand)(header, {
-            required: true,
-            defaultProps: {
-                ref: headerRef,
-                id: referenceId
-            }
-        }),
-        description: (0, _reactUtilities.resolveShorthand)(description),
-        action: (0, _reactUtilities.resolveShorthand)(action)
-    };
-}; //# sourceMappingURL=useCardHeader.js.map
-
+exports.useCardHeader_unstable = void 0;
+const React = /*#__PURE__*/require("react");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+const CardContext_1 = /*#__PURE__*/require("../Card/CardContext");
+const useCardHeaderStyles_1 = /*#__PURE__*/require("./useCardHeaderStyles");
+/**
+ * Create the state required to render CardHeader.
+ *
+ * The returned state can be modified with hooks such as useCardHeaderStyles_unstable,
+ * before being passed to renderCardHeader_unstable.
+ *
+ * @param props - props from this instance of CardHeader
+ * @param ref - reference to root HTMLElement of CardHeader
+ */
+const useCardHeader_unstable = (props, ref) => {
+  const {
+    image,
+    header,
+    description,
+    action
+  } = props;
+  const {
+    selectableA11yProps: {
+      referenceId,
+      setReferenceId
+    }
+  } = CardContext_1.useCardContext_unstable();
+  const headerRef = React.useRef(null);
+  const generatedId = react_utilities_1.useId(useCardHeaderStyles_1.cardHeaderClassNames.header, referenceId);
+  React.useEffect(() => {
+    if (header && headerRef.current) {
+      const {
+        id
+      } = headerRef.current;
+      setReferenceId(id ? id : generatedId);
+    }
+  }, [header, setReferenceId, generatedId]);
+  return {
+    components: {
+      root: 'div',
+      image: 'div',
+      header: 'div',
+      description: 'div',
+      action: 'div'
+    },
+    root: react_utilities_1.getNativeElementProps('div', {
+      ref,
+      ...props
+    }),
+    image: react_utilities_1.resolveShorthand(image),
+    header: react_utilities_1.resolveShorthand(header, {
+      required: true,
+      defaultProps: {
+        ref: headerRef,
+        id: referenceId
+      }
+    }),
+    description: react_utilities_1.resolveShorthand(description),
+    action: react_utilities_1.resolveShorthand(action)
+  };
+};
+exports.useCardHeader_unstable = useCardHeader_unstable;
 //# sourceMappingURL=useCardHeader.js.map

package/lib-commonjs/components/CardHeader/useCardHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardHeader/useCardHeader.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardHeaderClassNames } from './useCardHeaderStyles';\n/**\n * Create the state required to render CardHeader.\n *\n * The returned state can be modified with hooks such as useCardHeaderStyles_unstable,\n * before being passed to renderCardHeader_unstable.\n *\n * @param props - props from this instance of CardHeader\n * @param ref - reference to root HTMLElement of CardHeader\n */\nexport const useCardHeader_unstable = (props, ref) => {\n  const {\n    image,\n    header,\n    description,\n    action\n  } = props;\n  const {\n    selectableA11yProps: {\n      referenceId,\n      setReferenceId\n    }\n  } = useCardContext_unstable();\n  const headerRef = React.useRef(null);\n  const generatedId = useId(cardHeaderClassNames.header, referenceId);\n  React.useEffect(() => {\n    if (header && headerRef.current) {\n      const {\n        id\n      } = headerRef.current;\n      setReferenceId(id ? id : generatedId);\n    }\n  }, [header, setReferenceId, generatedId]);\n  return {\n    components: {\n      root: 'div',\n      image: 'div',\n      header: 'div',\n      description: 'div',\n      action: 'div'\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      ...props\n    }),\n    image: resolveShorthand(image),\n    header: resolveShorthand(header, {\n      required: true,\n      defaultProps: {\n        ref: headerRef,\n        id: referenceId\n      }\n    }),\n    description: resolveShorthand(description),\n    action: resolveShorthand(action)\n  };\n};\n//# sourceMappingURL=useCardHeader.js.map"],"names":["useCardHeader_unstable","props","ref","image","header","description","action","selectableA11yProps","referenceId","setReferenceId","useCardContext_unstable","headerRef","React","useRef","generatedId","useId","cardHeaderClassNames","useEffect","current","id","components","root","getNativeElementProps","resolveShorthand","required","defaultProps"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;gCACwC;6BACvB;qCACH;AAU9B,MAAMA,yBAAyB,CAACC,OAAOC,MAAQ;IACpD,MAAM,EACJC,MAAK,EACLC,OAAM,EACNC,YAAW,EACXC,OAAM,EACP,GAAGL;IACJ,MAAM,EACJM,qBAAqB,EACnBC,YAAW,EACXC,eAAc,EACf,CAAA,EACF,GAAGC,IAAAA,oCAAuB;IAC3B,MAAMC,YAAYC,OAAMC,MAAM,CAAC,IAAI;IACnC,MAAMC,cAAcC,IAAAA,qBAAK,EAACC,yCAAoB,CAACZ,MAAM,EAAEI;IACvDI,OAAMK,SAAS,CAAC,IAAM;QACpB,IAAIb,UAAUO,UAAUO,OAAO,EAAE;YAC/B,MAAM,EACJC,GAAE,EACH,GAAGR,UAAUO,OAAO;YACrBT,eAAeU,KAAKA,KAAKL,WAAW;QACtC,CAAC;IACH,GAAG;QAACV;QAAQK;QAAgBK;KAAY;IACxC,OAAO;QACLM,YAAY;YACVC,MAAM;YACNlB,OAAO;YACPC,QAAQ;YACRC,aAAa;YACbC,QAAQ;QACV;QACAe,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjCpB;YACA,GAAGD,KAAK;QACV;QACAE,OAAOoB,IAAAA,gCAAgB,EAACpB;QACxBC,QAAQmB,IAAAA,gCAAgB,EAACnB,QAAQ;YAC/BoB,UAAU,IAAI;YACdC,cAAc;gBACZvB,KAAKS;gBACLQ,IAAIX;YACN;QACF;QACAH,aAAakB,IAAAA,gCAAgB,EAAClB;QAC9BC,QAAQiB,IAAAA,gCAAgB,EAACjB;IAC3B;AACF,GACA,yCAAyC"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAEA;;;;;;;;;AASO,MAAMA,sBAAsB,GAAG,CAACC,KAAsB,EAAEC,GAA2B,KAAqB;EAC7G,MAAM;IAAEC,KAAK;IAAEC,MAAM;IAAEC,WAAW;IAAEC;EAAM,CAAE,GAAGL,KAAK;EAEpD,MAAM;IACJM,mBAAmB,EAAE;MAAEC,WAAW;MAAEC;IAAc;EAAE,CACrD,GAAGC,qCAAuB,EAAE;EAC7B,MAAMC,SAAS,GAAGC,KAAK,CAACC,MAAM,CAAiB,IAAI,CAAC;EAEpD,MAAMC,WAAW,GAAGC,uBAAK,CAACC,0CAAoB,CAACZ,MAAM,EAAEI,WAAW,CAAC;EAEnEI,KAAK,CAACK,SAAS,CAAC,MAAK;IACnB,IAAIb,MAAM,IAAIO,SAAS,CAACO,OAAO,EAAE;MAC/B,MAAM;QAAEC;MAAE,CAAE,GAAGR,SAAS,CAACO,OAAO;MAEhCT,cAAc,CAACU,EAAE,GAAGA,EAAE,GAAGL,WAAW,CAAC;;EAEzC,CAAC,EAAE,CAACV,MAAM,EAAEK,cAAc,EAAEK,WAAW,CAAC,CAAC;EAEzC,OAAO;IACLM,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXlB,KAAK,EAAE,KAAK;MACZC,MAAM,EAAE,KAAK;MACbC,WAAW,EAAE,KAAK;MAClBC,MAAM,EAAE;KACT;IAEDe,IAAI,EAAEN,uCAAqB,CAAC,KAAK,EAAE;MACjCb,GAAG;MACH,GAAGD;KACJ,CAAC;IACFE,KAAK,EAAEY,kCAAgB,CAACZ,KAAK,CAAC;IAC9BC,MAAM,EAAEW,kCAAgB,CAACX,MAAM,EAAE;MAC/BkB,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZrB,GAAG,EAAES,SAAS;QACdQ,EAAE,EAAEX;;KAEP,CAAC;IACFH,WAAW,EAAEU,kCAAgB,CAACV,WAAW,CAAC;IAC1CC,MAAM,EAAES,kCAAgB,CAACT,MAAM;GAChC;AACH,CAAC;AA1CYkB,8BAAsB","names":["useCardHeader_unstable","props","ref","image","header","description","action","selectableA11yProps","referenceId","setReferenceId","CardContext_1","headerRef","React","useRef","generatedId","react_utilities_1","useCardHeaderStyles_1","useEffect","current","id","components","root","required","defaultProps","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardHeader/useCardHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { CardHeaderProps, CardHeaderState } from './CardHeader.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardHeaderClassNames } from './useCardHeaderStyles';\n\n/**\n * Create the state required to render CardHeader.\n *\n * The returned state can be modified with hooks such as useCardHeaderStyles_unstable,\n * before being passed to renderCardHeader_unstable.\n *\n * @param props - props from this instance of CardHeader\n * @param ref - reference to root HTMLElement of CardHeader\n */\nexport const useCardHeader_unstable = (props: CardHeaderProps, ref: React.Ref<HTMLElement>): CardHeaderState => {\n  const { image, header, description, action } = props;\n\n  const {\n    selectableA11yProps: { referenceId, setReferenceId },\n  } = useCardContext_unstable();\n  const headerRef = React.useRef<HTMLDivElement>(null);\n\n  const generatedId = useId(cardHeaderClassNames.header, referenceId);\n\n  React.useEffect(() => {\n    if (header && headerRef.current) {\n      const { id } = headerRef.current;\n\n      setReferenceId(id ? id : generatedId);\n    }\n  }, [header, setReferenceId, generatedId]);\n\n  return {\n    components: {\n      root: 'div',\n      image: 'div',\n      header: 'div',\n      description: 'div',\n      action: 'div',\n    },\n\n    root: getNativeElementProps('div', {\n      ref,\n      ...props,\n    }),\n    image: resolveShorthand(image),\n    header: resolveShorthand(header, {\n      required: true,\n      defaultProps: {\n        ref: headerRef,\n        id: referenceId,\n      },\n    }),\n    description: resolveShorthand(description),\n    action: resolveShorthand(action),\n  };\n};\n"]}

package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js

@@ -1,96 +1,75 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-function _export(target, all) {
-    for(var name in all)Object.defineProperty(target, name, {
-        enumerable: true,
-        get: all[name]
-    });
-}
-_export(exports, {
-    cardHeaderClassNames: ()=>cardHeaderClassNames,
-    cardHeaderCSSVars: ()=>cardHeaderCSSVars,
-    useCardHeaderStyles_unstable: ()=>useCardHeaderStyles_unstable
+  value: true
 });
-const _react = require("@griffel/react");
-const cardHeaderClassNames = {
-    root: 'fui-CardHeader',
-    image: 'fui-CardHeader__image',
-    header: 'fui-CardHeader__header',
-    description: 'fui-CardHeader__description',
-    action: 'fui-CardHeader__action'
+exports.useCardHeaderStyles_unstable = exports.cardHeaderCSSVars = exports.cardHeaderClassNames = void 0;
+const react_1 = /*#__PURE__*/require("@griffel/react");
+/**
+ * Static CSS class names used internally for the component slots.
+ */
+exports.cardHeaderClassNames = {
+  root: 'fui-CardHeader',
+  image: 'fui-CardHeader__image',
+  header: 'fui-CardHeader__header',
+  description: 'fui-CardHeader__description',
+  action: 'fui-CardHeader__action'
 };
-const cardHeaderCSSVars = {
-    cardHeaderGapVar: '--fui-CardHeader--gap'
+/**
+ * CSS variable names used internally for uniform styling in CardHeader.
+ */
+exports.cardHeaderCSSVars = {
+  cardHeaderGapVar: '--fui-CardHeader--gap'
 };
-const useStyles = /*#__PURE__*/ (0, _react["__styles"])({
-    root: {
-        Bkc6ea2: "fkufhic",
-        mc9l5x: "f13qh94s",
-        t4k1zu: "f8a668j",
-        v29qe6: "f4h39za",
-        Bt984gj: "f122n59"
-    },
-    image: {
-        mc9l5x: "ftuwxu6",
-        t21cq0: [
-            "fql5097",
-            "f6yss9k"
-        ],
-        Br312pm: "fwpfdsa",
-        Ijaq50: "fldnz9j"
-    },
-    header: {
-        Br312pm: "fd46tj4",
-        Ijaq50: "f16hsg94"
-    },
-    description: {
-        Br312pm: "fd46tj4",
-        Ijaq50: "faunodf"
-    },
-    action: {
-        Frg6f3: [
-            "f6yss9k",
-            "fql5097"
-        ],
-        Br312pm: "fis13di",
-        Ijaq50: "fldnz9j"
-    }
+const useStyles = /*#__PURE__*/react_1.__styles({
+  root: {
+    Bkc6ea2: "fkufhic",
+    mc9l5x: "f13qh94s",
+    t4k1zu: "f8a668j",
+    v29qe6: "f4h39za",
+    Bt984gj: "f122n59"
+  },
+  image: {
+    mc9l5x: "ftuwxu6",
+    t21cq0: ["fql5097", "f6yss9k"],
+    Br312pm: "fwpfdsa",
+    Ijaq50: "fldnz9j"
+  },
+  header: {
+    Br312pm: "fd46tj4",
+    Ijaq50: "f16hsg94"
+  },
+  description: {
+    Br312pm: "fd46tj4",
+    Ijaq50: "faunodf"
+  },
+  action: {
+    Frg6f3: ["f6yss9k", "fql5097"],
+    Br312pm: "fis13di",
+    Ijaq50: "fldnz9j"
+  }
 }, {
-    d: [
-        ".fkufhic{--fui-CardHeader--gap:12px;}",
-        ".f13qh94s{display:grid;}",
-        ".f8a668j{grid-auto-columns:min-content 1fr min-content;}",
-        ".f4h39za{grid-auto-rows:1fr min-content;}",
-        ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}",
-        ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}",
-        ".fql5097{margin-right:var(--fui-CardHeader--gap);}",
-        ".f6yss9k{margin-left:var(--fui-CardHeader--gap);}",
-        ".fwpfdsa{grid-column-start:1;}",
-        ".fldnz9j{grid-row-start:span 2;}",
-        ".fd46tj4{grid-column-start:2;}",
-        ".f16hsg94{grid-row-start:1;}",
-        ".faunodf{grid-row-start:2;}",
-        ".fis13di{grid-column-start:3;}"
-    ]
+  d: [".fkufhic{--fui-CardHeader--gap:12px;}", ".f13qh94s{display:grid;}", ".f8a668j{grid-auto-columns:min-content 1fr min-content;}", ".f4h39za{grid-auto-rows:1fr min-content;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fql5097{margin-right:var(--fui-CardHeader--gap);}", ".f6yss9k{margin-left:var(--fui-CardHeader--gap);}", ".fwpfdsa{grid-column-start:1;}", ".fldnz9j{grid-row-start:span 2;}", ".fd46tj4{grid-column-start:2;}", ".f16hsg94{grid-row-start:1;}", ".faunodf{grid-row-start:2;}", ".fis13di{grid-column-start:3;}"]
 });
-const useCardHeaderStyles_unstable = (state)=>{
-    const styles = useStyles();
-    state.root.className = (0, _react.mergeClasses)(cardHeaderClassNames.root, styles.root, state.root.className);
-    if (state.image) {
-        state.image.className = (0, _react.mergeClasses)(cardHeaderClassNames.image, styles.image, state.image.className);
-    }
-    if (state.header) {
-        state.header.className = (0, _react.mergeClasses)(cardHeaderClassNames.header, styles.header, state.header.className);
-    }
-    if (state.description) {
-        state.description.className = (0, _react.mergeClasses)(cardHeaderClassNames.description, styles.description, state.description.className);
-    }
-    if (state.action) {
-        state.action.className = (0, _react.mergeClasses)(cardHeaderClassNames.action, styles.action, state.action.className);
-    }
-    return state;
-}; //# sourceMappingURL=useCardHeaderStyles.js.map
-
+/**
+ * Apply styling to the CardHeader slots based on the state.
+ */
+const useCardHeaderStyles_unstable = state => {
+  const styles = useStyles();
+  state.root.className = react_1.mergeClasses(exports.cardHeaderClassNames.root, styles.root, state.root.className);
+  if (state.image) {
+    state.image.className = react_1.mergeClasses(exports.cardHeaderClassNames.image, styles.image, state.image.className);
+  }
+  if (state.header) {
+    state.header.className = react_1.mergeClasses(exports.cardHeaderClassNames.header, styles.header, state.header.className);
+  }
+  if (state.description) {
+    state.description.className = react_1.mergeClasses(exports.cardHeaderClassNames.description, styles.description, state.description.className);
+  }
+  if (state.action) {
+    state.action.className = react_1.mergeClasses(exports.cardHeaderClassNames.action, styles.action, state.action.className);
+  }
+  return state;
+};
+exports.useCardHeaderStyles_unstable = useCardHeaderStyles_unstable;
 //# sourceMappingURL=useCardHeaderStyles.js.map

package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardHeader/useCardHeaderStyles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/react';\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardHeaderClassNames = {\n  root: 'fui-CardHeader',\n  image: 'fui-CardHeader__image',\n  header: 'fui-CardHeader__header',\n  description: 'fui-CardHeader__description',\n  action: 'fui-CardHeader__action'\n};\n/**\n * CSS variable names used internally for uniform styling in CardHeader.\n */\nexport const cardHeaderCSSVars = {\n  cardHeaderGapVar: '--fui-CardHeader--gap'\n};\nconst useStyles = /*#__PURE__*/__styles({\n  root: {\n    Bkc6ea2: \"fkufhic\",\n    mc9l5x: \"f13qh94s\",\n    t4k1zu: \"f8a668j\",\n    v29qe6: \"f4h39za\",\n    Bt984gj: \"f122n59\"\n  },\n  image: {\n    mc9l5x: \"ftuwxu6\",\n    t21cq0: [\"fql5097\", \"f6yss9k\"],\n    Br312pm: \"fwpfdsa\",\n    Ijaq50: \"fldnz9j\"\n  },\n  header: {\n    Br312pm: \"fd46tj4\",\n    Ijaq50: \"f16hsg94\"\n  },\n  description: {\n    Br312pm: \"fd46tj4\",\n    Ijaq50: \"faunodf\"\n  },\n  action: {\n    Frg6f3: [\"f6yss9k\", \"fql5097\"],\n    Br312pm: \"fis13di\",\n    Ijaq50: \"fldnz9j\"\n  }\n}, {\n  d: [\".fkufhic{--fui-CardHeader--gap:12px;}\", \".f13qh94s{display:grid;}\", \".f8a668j{grid-auto-columns:min-content 1fr min-content;}\", \".f4h39za{grid-auto-rows:1fr min-content;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}\", \".fql5097{margin-right:var(--fui-CardHeader--gap);}\", \".f6yss9k{margin-left:var(--fui-CardHeader--gap);}\", \".fwpfdsa{grid-column-start:1;}\", \".fldnz9j{grid-row-start:span 2;}\", \".fd46tj4{grid-column-start:2;}\", \".f16hsg94{grid-row-start:1;}\", \".faunodf{grid-row-start:2;}\", \".fis13di{grid-column-start:3;}\"]\n});\n/**\n * Apply styling to the CardHeader slots based on the state.\n */\nexport const useCardHeaderStyles_unstable = state => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(cardHeaderClassNames.root, styles.root, state.root.className);\n  if (state.image) {\n    state.image.className = mergeClasses(cardHeaderClassNames.image, styles.image, state.image.className);\n  }\n  if (state.header) {\n    state.header.className = mergeClasses(cardHeaderClassNames.header, styles.header, state.header.className);\n  }\n  if (state.description) {\n    state.description.className = mergeClasses(cardHeaderClassNames.description, styles.description, state.description.className);\n  }\n  if (state.action) {\n    state.action.className = mergeClasses(cardHeaderClassNames.action, styles.action, state.action.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useCardHeaderStyles.js.map"],"names":["cardHeaderClassNames","cardHeaderCSSVars","useCardHeaderStyles_unstable","root","image","header","description","action","cardHeaderGapVar","useStyles","__styles","Bkc6ea2","mc9l5x","t4k1zu","v29qe6","Bt984gj","t21cq0","Br312pm","Ijaq50","Frg6f3","d","state","styles","className","mergeClasses"],"mappings":";;;;;;;;;;;IAIaA,oBAAoB,MAApBA;IAUAC,iBAAiB,MAAjBA;IAoCAC,4BAA4B,MAA5BA;;uBAlD0B;AAIhC,MAAMF,uBAAuB;IAClCG,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,aAAa;IACbC,QAAQ;AACV;AAIO,MAAMN,oBAAoB;IAC/BO,kBAAkB;AACpB;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCP,MAAM;QACJQ,SAAS;QACTC,QAAQ;QACRC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACAX,OAAO;QACLQ,QAAQ;QACRI,QAAQ;YAAC;YAAW;SAAU;QAC9BC,SAAS;QACTC,QAAQ;IACV;IACAb,QAAQ;QACNY,SAAS;QACTC,QAAQ;IACV;IACAZ,aAAa;QACXW,SAAS;QACTC,QAAQ;IACV;IACAX,QAAQ;QACNY,QAAQ;YAAC;YAAW;SAAU;QAC9BF,SAAS;QACTC,QAAQ;IACV;AACF,GAAG;IACDE,GAAG;QAAC;QAAyC;QAA4B;QAA4D;QAA6C;QAA2G;QAAoH;QAAsD;QAAqD;QAAkC;QAAoC;QAAkC;QAAgC;QAA+B;KAAiC;AACtsB;AAIO,MAAMlB,+BAA+BmB,CAAAA,QAAS;IACnD,MAAMC,SAASb;IACfY,MAAMlB,IAAI,CAACoB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,qBAAqBG,IAAI,EAAEmB,OAAOnB,IAAI,EAAEkB,MAAMlB,IAAI,CAACoB,SAAS;IAChG,IAAIF,MAAMjB,KAAK,EAAE;QACfiB,MAAMjB,KAAK,CAACmB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,qBAAqBI,KAAK,EAAEkB,OAAOlB,KAAK,EAAEiB,MAAMjB,KAAK,CAACmB,SAAS;IACtG,CAAC;IACD,IAAIF,MAAMhB,MAAM,EAAE;QAChBgB,MAAMhB,MAAM,CAACkB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,qBAAqBK,MAAM,EAAEiB,OAAOjB,MAAM,EAAEgB,MAAMhB,MAAM,CAACkB,SAAS;IAC1G,CAAC;IACD,IAAIF,MAAMf,WAAW,EAAE;QACrBe,MAAMf,WAAW,CAACiB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,qBAAqBM,WAAW,EAAEgB,OAAOhB,WAAW,EAAEe,MAAMf,WAAW,CAACiB,SAAS;IAC9H,CAAC;IACD,IAAIF,MAAMd,MAAM,EAAE;QAChBc,MAAMd,MAAM,CAACgB,SAAS,GAAGC,IAAAA,mBAAY,EAACxB,qBAAqBO,MAAM,EAAEe,OAAOf,MAAM,EAAEc,MAAMd,MAAM,CAACgB,SAAS;IAC1G,CAAC;IACD,OAAOF;AACT,GACA,+CAA+C"}
+{"version":3,"mappings":";;;;;;AACA;AAGA;;;AAGaA,4BAAoB,GAAoC;EACnEC,IAAI,EAAE,gBAAgB;EACtBC,KAAK,EAAE,uBAAuB;EAC9BC,MAAM,EAAE,wBAAwB;EAChCC,WAAW,EAAE,6BAA6B;EAC1CC,MAAM,EAAE;CACT;AAED;;;AAGaL,yBAAiB,GAAG;EAC/BM,gBAAgB,EAAE;CACnB;AAED,MAAMC,SAAS,gBAAGC,gBAAU;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EA2B1B;AAEF;;;AAGO,MAAMC,4BAA4B,GAAIC,KAAsB,IAAqB;EACtF,MAAMC,MAAM,GAAGJ,SAAS,EAAE;EAC1BG,KAAK,CAACT,IAAI,CAACW,SAAS,GAAGJ,oBAAY,CAACR,4BAAoB,CAACC,IAAI,EAAEU,MAAM,CAACV,IAAI,EAAES,KAAK,CAACT,IAAI,CAACW,SAAS,CAAC;EAEjG,IAAIF,KAAK,CAACR,KAAK,EAAE;IACfQ,KAAK,CAACR,KAAK,CAACU,SAAS,GAAGJ,oBAAY,CAACR,4BAAoB,CAACE,KAAK,EAAES,MAAM,CAACT,KAAK,EAAEQ,KAAK,CAACR,KAAK,CAACU,SAAS,CAAC;;EAGvG,IAAIF,KAAK,CAACP,MAAM,EAAE;IAChBO,KAAK,CAACP,MAAM,CAACS,SAAS,GAAGJ,oBAAY,CAACR,4BAAoB,CAACG,MAAM,EAAEQ,MAAM,CAACR,MAAM,EAAEO,KAAK,CAACP,MAAM,CAACS,SAAS,CAAC;;EAG3G,IAAIF,KAAK,CAACN,WAAW,EAAE;IACrBM,KAAK,CAACN,WAAW,CAACQ,SAAS,GAAGJ,oBAAY,CACxCR,4BAAoB,CAACI,WAAW,EAChCO,MAAM,CAACP,WAAW,EAClBM,KAAK,CAACN,WAAW,CAACQ,SAAS,CAC5B;;EAGH,IAAIF,KAAK,CAACL,MAAM,EAAE;IAChBK,KAAK,CAACL,MAAM,CAACO,SAAS,GAAGJ,oBAAY,CAACR,4BAAoB,CAACK,MAAM,EAAEM,MAAM,CAACN,MAAM,EAAEK,KAAK,CAACL,MAAM,CAACO,SAAS,CAAC;;EAG3G,OAAOF,KAAK;AACd,CAAC;AAzBYV,oCAA4B","names":["exports","root","image","header","description","action","cardHeaderGapVar","useStyles","react_1","useCardHeaderStyles_unstable","state","styles","className"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardHeader/useCardHeaderStyles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardHeaderClassNames: SlotClassNames<CardHeaderSlots> = {\n  root: 'fui-CardHeader',\n  image: 'fui-CardHeader__image',\n  header: 'fui-CardHeader__header',\n  description: 'fui-CardHeader__description',\n  action: 'fui-CardHeader__action',\n};\n\n/**\n * CSS variable names used internally for uniform styling in CardHeader.\n */\nexport const cardHeaderCSSVars = {\n  cardHeaderGapVar: '--fui-CardHeader--gap',\n};\n\nconst useStyles = makeStyles({\n  root: {\n    [cardHeaderCSSVars.cardHeaderGapVar]: '12px',\n    display: 'grid',\n    gridAutoColumns: 'min-content 1fr min-content',\n    gridAutoRows: '1fr min-content',\n    alignItems: 'center',\n  },\n  image: {\n    display: 'inline-flex',\n    marginRight: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\n    gridColumnStart: '1',\n    gridRowStart: 'span 2',\n  },\n  header: {\n    gridColumnStart: '2',\n    gridRowStart: '1',\n  },\n  description: {\n    gridColumnStart: '2',\n    gridRowStart: '2',\n  },\n  action: {\n    marginLeft: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\n    gridColumnStart: '3',\n    gridRowStart: 'span 2',\n  },\n});\n\n/**\n * Apply styling to the CardHeader slots based on the state.\n */\nexport const useCardHeaderStyles_unstable = (state: CardHeaderState): CardHeaderState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(cardHeaderClassNames.root, styles.root, state.root.className);\n\n  if (state.image) {\n    state.image.className = mergeClasses(cardHeaderClassNames.image, styles.image, state.image.className);\n  }\n\n  if (state.header) {\n    state.header.className = mergeClasses(cardHeaderClassNames.header, styles.header, state.header.className);\n  }\n\n  if (state.description) {\n    state.description.className = mergeClasses(\n      cardHeaderClassNames.description,\n      styles.description,\n      state.description.className,\n    );\n  }\n\n  if (state.action) {\n    state.action.className = mergeClasses(cardHeaderClassNames.action, styles.action, state.action.className);\n  }\n\n  return state;\n};\n"]}

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

@@ -1,21 +1,20 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "CardPreview", {
-    enumerable: true,
-    get: ()=>CardPreview
+  value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _useCardPreview = require("./useCardPreview");
-const _renderCardPreview = require("./renderCardPreview");
-const _useCardPreviewStyles = require("./useCardPreviewStyles");
-const CardPreview = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
-    const state = (0, _useCardPreview.useCardPreview_unstable)(props, ref);
-    (0, _useCardPreviewStyles.useCardPreviewStyles_unstable)(state);
-    return (0, _renderCardPreview.renderCardPreview_unstable)(state);
+exports.CardPreview = void 0;
+const React = /*#__PURE__*/require("react");
+const useCardPreview_1 = /*#__PURE__*/require("./useCardPreview");
+const renderCardPreview_1 = /*#__PURE__*/require("./renderCardPreview");
+const useCardPreviewStyles_1 = /*#__PURE__*/require("./useCardPreviewStyles");
+/**
+ * Component to render image previews of documents or articles in a Card component.
+ */
+exports.CardPreview = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useCardPreview_1.useCardPreview_unstable(props, ref);
+  useCardPreviewStyles_1.useCardPreviewStyles_unstable(state);
+  return renderCardPreview_1.renderCardPreview_unstable(state);
 });
-CardPreview.displayName = 'CardPreview'; //# sourceMappingURL=CardPreview.js.map
-
+exports.CardPreview.displayName = 'CardPreview';
 //# sourceMappingURL=CardPreview.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardPreview/CardPreview.js"],"sourcesContent":["import * as React from 'react';\nimport { useCardPreview_unstable } from './useCardPreview';\nimport { renderCardPreview_unstable } from './renderCardPreview';\nimport { useCardPreviewStyles_unstable } from './useCardPreviewStyles';\n/**\n * Component to render image previews of documents or articles in a Card component.\n */\nexport const CardPreview = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useCardPreview_unstable(props, ref);\n  useCardPreviewStyles_unstable(state);\n  return renderCardPreview_unstable(state);\n});\nCardPreview.displayName = 'CardPreview';\n//# sourceMappingURL=CardPreview.js.map"],"names":["CardPreview","React","forwardRef","props","ref","state","useCardPreview_unstable","useCardPreviewStyles_unstable","renderCardPreview_unstable","displayName"],"mappings":";;;;+BAOaA;;aAAAA;;;6DAPU;gCACiB;mCACG;sCACG;AAIvC,MAAMA,cAAc,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACvE,MAAMC,QAAQC,IAAAA,uCAAuB,EAACH,OAAOC;IAC7CG,IAAAA,mDAA6B,EAACF;IAC9B,OAAOG,IAAAA,6CAA0B,EAACH;AACpC;AACAL,YAAYS,WAAW,GAAG,eAC1B,uCAAuC"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,mBAAW,gBAA0CC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGC,wCAAuB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEjDG,oDAA6B,CAACF,KAAK,CAAC;EACpC,OAAOG,8CAA0B,CAACH,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFL,mBAAW,CAACS,WAAW,GAAG,aAAa","names":["exports","React","forwardRef","props","ref","state","useCardPreview_1","useCardPreviewStyles_1","renderCardPreview_1","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardPreview/CardPreview.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCardPreview_unstable } from './useCardPreview';\nimport { renderCardPreview_unstable } from './renderCardPreview';\nimport { useCardPreviewStyles_unstable } from './useCardPreviewStyles';\nimport type { CardPreviewProps } from './CardPreview.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Component to render image previews of documents or articles in a Card component.\n */\nexport const CardPreview: ForwardRefComponent<CardPreviewProps> = React.forwardRef((props, ref) => {\n  const state = useCardPreview_unstable(props, ref);\n\n  useCardPreviewStyles_unstable(state);\n  return renderCardPreview_unstable(state);\n});\n\nCardPreview.displayName = 'CardPreview';\n"]}

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

@@ -1,7 +1,6 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
- //# sourceMappingURL=CardPreview.types.js.map
-
 //# sourceMappingURL=CardPreview.types.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardPreview/CardPreview.types.js"],"sourcesContent":["export {};\n//# sourceMappingURL=CardPreview.types.js.map"],"names":[],"mappings":";;;;CACA,6CAA6C"}
+{"version":3,"mappings":"","names":[],"sourceRoot":"","sources":[],"sourcesContent":[]}

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

@@ -1,13 +1,12 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
-_exportStar(require("./CardPreview"), exports);
-_exportStar(require("./CardPreview.types"), exports);
-_exportStar(require("./renderCardPreview"), exports);
-_exportStar(require("./useCardPreview"), exports);
-_exportStar(require("./useCardPreviewStyles"), exports);
- //# sourceMappingURL=index.js.map
-
+const tslib_1 = /*#__PURE__*/require("tslib");
+tslib_1.__exportStar(require("./CardPreview"), exports);
+tslib_1.__exportStar(require("./CardPreview.types"), exports);
+tslib_1.__exportStar(require("./renderCardPreview"), exports);
+tslib_1.__exportStar(require("./useCardPreview"), exports);
+tslib_1.__exportStar(require("./useCardPreviewStyles"), exports);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardPreview/index.js"],"sourcesContent":["export * from './CardPreview';\nexport * from './CardPreview.types';\nexport * from './renderCardPreview';\nexport * from './useCardPreview';\nexport * from './useCardPreviewStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
+{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardPreview/index.ts"],"sourcesContent":["export * from './CardPreview';\nexport * from './CardPreview.types';\nexport * from './renderCardPreview';\nexport * from './useCardPreview';\nexport * from './useCardPreviewStyles';\n"]}

package/lib-commonjs/components/CardPreview/renderCardPreview.js

@@ -1,19 +1,24 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "renderCardPreview_unstable", {
-    enumerable: true,
-    get: ()=>renderCardPreview_unstable
+  value: true
 });
-const _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _extends = require("@swc/helpers/lib/_extends.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactUtilities = require("@fluentui/react-utilities");
-const renderCardPreview_unstable = (state)=>{
-    const { slots , slotProps  } = (0, _reactUtilities.getSlots)(state);
-    return /*#__PURE__*/ _react.createElement(slots.root, _extends({}, slotProps.root), slotProps.root.children, slots.logo && /*#__PURE__*/ _react.createElement(slots.logo, _extends({}, slotProps.logo)));
-}; //# sourceMappingURL=renderCardPreview.js.map
-
+exports.renderCardPreview_unstable = void 0;
+const React = /*#__PURE__*/require("react");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+/**
+ * Render the final JSX of CardPreview.
+ */
+const renderCardPreview_unstable = state => {
+  const {
+    slots,
+    slotProps
+  } = react_utilities_1.getSlots(state);
+  return React.createElement(slots.root, {
+    ...slotProps.root
+  }, slotProps.root.children, slots.logo && React.createElement(slots.logo, {
+    ...slotProps.logo
+  }));
+};
+exports.renderCardPreview_unstable = renderCardPreview_unstable;
 //# sourceMappingURL=renderCardPreview.js.map

package/lib-commonjs/components/CardPreview/renderCardPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardPreview/renderCardPreview.js"],"sourcesContent":["import _extends from \"@swc/helpers/src/_extends.mjs\";\nimport * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of CardPreview.\n */\nexport const renderCardPreview_unstable = state => {\n  const {\n    slots,\n    slotProps\n  } = getSlots(state);\n  return /*#__PURE__*/React.createElement(slots.root, _extends({}, slotProps.root), slotProps.root.children, slots.logo && /*#__PURE__*/React.createElement(slots.logo, _extends({}, slotProps.logo)));\n};\n//# sourceMappingURL=renderCardPreview.js.map"],"names":["renderCardPreview_unstable","state","slots","slotProps","getSlots","React","createElement","root","_extends","children","logo"],"mappings":";;;;+BAMaA;;aAAAA;;;;yBANQ;6DACE;gCACE;AAIlB,MAAMA,6BAA6BC,CAAAA,QAAS;IACjD,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACH;IACb,OAAO,WAAW,GAAEI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEC,SAAS,CAAC,GAAGL,UAAUI,IAAI,GAAGJ,UAAUI,IAAI,CAACE,QAAQ,EAAEP,MAAMQ,IAAI,IAAI,WAAW,GAAEL,OAAMC,aAAa,CAACJ,MAAMQ,IAAI,EAAEF,SAAS,CAAC,GAAGL,UAAUO,IAAI;AACnM,GACA,6CAA6C"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAmBH,KAAK,CAAC;EAE9D,OACEI,oBAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BH,SAAS,CAACG,IAAI,CAACC,QAAQ,EACvBL,KAAK,CAACM,IAAI,IAAIH,oBAACH,KAAK,CAACM,IAAI;IAAA,GAAKL,SAAS,CAACK;EAAI,EAAI,CACtC;AAEjB,CAAC;AATYC,kCAA0B","names":["renderCardPreview_unstable","state","slots","slotProps","react_utilities_1","React","root","children","logo","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardPreview/renderCardPreview.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';\n\n/**\n * Render the final JSX of CardPreview.\n */\nexport const renderCardPreview_unstable = (state: CardPreviewState) => {\n  const { slots, slotProps } = getSlots<CardPreviewSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slotProps.root.children}\n      {slots.logo && <slots.logo {...slotProps.logo} />}\n    </slots.root>\n  );\n};\n"]}

package/lib-commonjs/components/CardPreview/useCardPreview.js

@@ -1,56 +1,65 @@
 "use strict";
+
 Object.defineProperty(exports, "__esModule", {
-    value: true
-});
-Object.defineProperty(exports, "useCardPreview_unstable", {
-    enumerable: true,
-    get: ()=>useCardPreview_unstable
+  value: true
 });
-const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
-const _reactUtilities = require("@fluentui/react-utilities");
-const _cardContext = require("../Card/CardContext");
-const _useCardPreviewStyles = require("./useCardPreviewStyles");
-const useCardPreview_unstable = (props, ref)=>{
-    const { logo  } = props;
-    const { selectableA11yProps: { referenceLabel , referenceId , setReferenceLabel , setReferenceId  }  } = (0, _cardContext.useCardContext_unstable)();
-    const previewRef = (0, _reactUtilities.useMergedRefs)(ref, _react.useRef(null));
-    _react.useEffect(()=>{
-        if (referenceLabel && referenceId) {
-            return;
+exports.useCardPreview_unstable = void 0;
+const React = /*#__PURE__*/require("react");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+const CardContext_1 = /*#__PURE__*/require("../Card/CardContext");
+const useCardPreviewStyles_1 = /*#__PURE__*/require("./useCardPreviewStyles");
+/**
+ * Create the state required to render CardPreview.
+ *
+ * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,
+ * before being passed to renderCardPreview_unstable.
+ *
+ * @param props - props from this instance of CardPreview
+ * @param ref - reference to root HTMLElement of CardPreview
+ */
+const useCardPreview_unstable = (props, ref) => {
+  const {
+    logo
+  } = props;
+  const {
+    selectableA11yProps: {
+      referenceLabel,
+      referenceId,
+      setReferenceLabel,
+      setReferenceId
+    }
+  } = CardContext_1.useCardContext_unstable();
+  const previewRef = react_utilities_1.useMergedRefs(ref, React.useRef(null));
+  React.useEffect(() => {
+    if (referenceLabel && referenceId) {
+      return;
+    }
+    if (previewRef.current && previewRef.current.parentNode) {
+      const img = previewRef.current.parentNode.querySelector(`.${useCardPreviewStyles_1.cardPreviewClassNames.root} > img`);
+      if (img) {
+        const ariaLabel = img.getAttribute('aria-label');
+        const ariaDescribedby = img.getAttribute('aria-describedby');
+        if (ariaDescribedby) {
+          setReferenceId(ariaDescribedby);
+        } else if (img.alt) {
+          setReferenceLabel(img.alt);
+        } else if (ariaLabel) {
+          setReferenceLabel(ariaLabel);
         }
-        if (previewRef.current && previewRef.current.parentNode) {
-            const img = previewRef.current.parentNode.querySelector(`.${_useCardPreviewStyles.cardPreviewClassNames.root} > img`);
-            if (img) {
-                const ariaLabel = img.getAttribute('aria-label');
-                const ariaDescribedby = img.getAttribute('aria-describedby');
-                if (ariaDescribedby) {
-                    setReferenceId(ariaDescribedby);
-                } else if (img.alt) {
-                    setReferenceLabel(img.alt);
-                } else if (ariaLabel) {
-                    setReferenceLabel(ariaLabel);
-                }
-            }
-        }
-    }, [
-        setReferenceLabel,
-        referenceLabel,
-        previewRef,
-        referenceId,
-        setReferenceId
-    ]);
-    return {
-        components: {
-            root: 'div',
-            logo: 'div'
-        },
-        root: (0, _reactUtilities.getNativeElementProps)('div', {
-            ref: previewRef,
-            ...props
-        }),
-        logo: (0, _reactUtilities.resolveShorthand)(logo)
-    };
-}; //# sourceMappingURL=useCardPreview.js.map
-
+      }
+    }
+  }, [setReferenceLabel, referenceLabel, previewRef, referenceId, setReferenceId]);
+  return {
+    components: {
+      root: 'div',
+      logo: 'div'
+    },
+    root: react_utilities_1.getNativeElementProps('div', {
+      ref: previewRef,
+      ...props
+    }),
+    logo: react_utilities_1.resolveShorthand(logo)
+  };
+};
+exports.useCardPreview_unstable = useCardPreview_unstable;
 //# sourceMappingURL=useCardPreview.js.map

package/lib-commonjs/components/CardPreview/useCardPreview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/CardPreview/useCardPreview.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardPreviewClassNames } from './useCardPreviewStyles';\n/**\n * Create the state required to render CardPreview.\n *\n * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,\n * before being passed to renderCardPreview_unstable.\n *\n * @param props - props from this instance of CardPreview\n * @param ref - reference to root HTMLElement of CardPreview\n */\nexport const useCardPreview_unstable = (props, ref) => {\n  const {\n    logo\n  } = props;\n  const {\n    selectableA11yProps: {\n      referenceLabel,\n      referenceId,\n      setReferenceLabel,\n      setReferenceId\n    }\n  } = useCardContext_unstable();\n  const previewRef = useMergedRefs(ref, React.useRef(null));\n  React.useEffect(() => {\n    if (referenceLabel && referenceId) {\n      return;\n    }\n    if (previewRef.current && previewRef.current.parentNode) {\n      const img = previewRef.current.parentNode.querySelector(`.${cardPreviewClassNames.root} > img`);\n      if (img) {\n        const ariaLabel = img.getAttribute('aria-label');\n        const ariaDescribedby = img.getAttribute('aria-describedby');\n        if (ariaDescribedby) {\n          setReferenceId(ariaDescribedby);\n        } else if (img.alt) {\n          setReferenceLabel(img.alt);\n        } else if (ariaLabel) {\n          setReferenceLabel(ariaLabel);\n        }\n      }\n    }\n  }, [setReferenceLabel, referenceLabel, previewRef, referenceId, setReferenceId]);\n  return {\n    components: {\n      root: 'div',\n      logo: 'div'\n    },\n    root: getNativeElementProps('div', {\n      ref: previewRef,\n      ...props\n    }),\n    logo: resolveShorthand(logo)\n  };\n};\n//# sourceMappingURL=useCardPreview.js.map"],"names":["useCardPreview_unstable","props","ref","logo","selectableA11yProps","referenceLabel","referenceId","setReferenceLabel","setReferenceId","useCardContext_unstable","previewRef","useMergedRefs","React","useRef","useEffect","current","parentNode","img","querySelector","cardPreviewClassNames","root","ariaLabel","getAttribute","ariaDescribedby","alt","components","getNativeElementProps","resolveShorthand"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;gCACgD;6BAC/B;sCACF;AAU/B,MAAMA,0BAA0B,CAACC,OAAOC,MAAQ;IACrD,MAAM,EACJC,KAAI,EACL,GAAGF;IACJ,MAAM,EACJG,qBAAqB,EACnBC,eAAc,EACdC,YAAW,EACXC,kBAAiB,EACjBC,eAAc,EACf,CAAA,EACF,GAAGC,IAAAA,oCAAuB;IAC3B,MAAMC,aAAaC,IAAAA,6BAAa,EAACT,KAAKU,OAAMC,MAAM,CAAC,IAAI;IACvDD,OAAME,SAAS,CAAC,IAAM;QACpB,IAAIT,kBAAkBC,aAAa;YACjC;QACF,CAAC;QACD,IAAII,WAAWK,OAAO,IAAIL,WAAWK,OAAO,CAACC,UAAU,EAAE;YACvD,MAAMC,MAAMP,WAAWK,OAAO,CAACC,UAAU,CAACE,aAAa,CAAC,CAAC,CAAC,EAAEC,2CAAqB,CAACC,IAAI,CAAC,MAAM,CAAC;YAC9F,IAAIH,KAAK;gBACP,MAAMI,YAAYJ,IAAIK,YAAY,CAAC;gBACnC,MAAMC,kBAAkBN,IAAIK,YAAY,CAAC;gBACzC,IAAIC,iBAAiB;oBACnBf,eAAee;gBACjB,OAAO,IAAIN,IAAIO,GAAG,EAAE;oBAClBjB,kBAAkBU,IAAIO,GAAG;gBAC3B,OAAO,IAAIH,WAAW;oBACpBd,kBAAkBc;gBACpB,CAAC;YACH,CAAC;QACH,CAAC;IACH,GAAG;QAACd;QAAmBF;QAAgBK;QAAYJ;QAAaE;KAAe;IAC/E,OAAO;QACLiB,YAAY;YACVL,MAAM;YACNjB,MAAM;QACR;QACAiB,MAAMM,IAAAA,qCAAqB,EAAC,OAAO;YACjCxB,KAAKQ;YACL,GAAGT,KAAK;QACV;QACAE,MAAMwB,IAAAA,gCAAgB,EAACxB;IACzB;AACF,GACA,0CAA0C"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AAEA;AACA;AAEA;;;;;;;;;AASO,MAAMA,uBAAuB,GAAG,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,MAAM;IAAEC;EAAI,CAAE,GAAGF,KAAK;EAEtB,MAAM;IACJG,mBAAmB,EAAE;MAAEC,cAAc;MAAEC,WAAW;MAAEC,iBAAiB;MAAEC;IAAc;EAAE,CACxF,GAAGC,qCAAuB,EAAE;EAC7B,MAAMC,UAAU,GAAGC,+BAAa,CAACT,GAAG,EAAEU,KAAK,CAACC,MAAM,CAAiB,IAAI,CAAC,CAAC;EAEzED,KAAK,CAACE,SAAS,CAAC,MAAK;IACnB,IAAIT,cAAc,IAAIC,WAAW,EAAE;MACjC;;IAGF,IAAII,UAAU,CAACK,OAAO,IAAIL,UAAU,CAACK,OAAO,CAACC,UAAU,EAAE;MACvD,MAAMC,GAAG,GAAGP,UAAU,CAACK,OAAO,CAACC,UAAU,CAACE,aAAa,CAAmB,IAAIC,4CAAqB,CAACC,IAAI,QAAQ,CAAC;MAEjH,IAAIH,GAAG,EAAE;QACP,MAAMI,SAAS,GAAGJ,GAAG,CAACK,YAAY,CAAC,YAAY,CAAC;QAChD,MAAMC,eAAe,GAAGN,GAAG,CAACK,YAAY,CAAC,kBAAkB,CAAC;QAE5D,IAAIC,eAAe,EAAE;UACnBf,cAAc,CAACe,eAAe,CAAC;SAChC,MAAM,IAAIN,GAAG,CAACO,GAAG,EAAE;UAClBjB,iBAAiB,CAACU,GAAG,CAACO,GAAG,CAAC;SAC3B,MAAM,IAAIH,SAAS,EAAE;UACpBd,iBAAiB,CAACc,SAAS,CAAC;;;;EAIpC,CAAC,EAAE,CAACd,iBAAiB,EAAEF,cAAc,EAAEK,UAAU,EAAEJ,WAAW,EAAEE,cAAc,CAAC,CAAC;EAEhF,OAAO;IACLiB,UAAU,EAAE;MACVL,IAAI,EAAE,KAAK;MACXjB,IAAI,EAAE;KACP;IAEDiB,IAAI,EAAET,uCAAqB,CAAC,KAAK,EAAE;MACjCT,GAAG,EAAEQ,UAAU;MACf,GAAGT;KACJ,CAAC;IACFE,IAAI,EAAEQ,kCAAgB,CAACR,IAAI;GAC5B;AACH,CAAC;AA3CYuB,+BAAuB","names":["useCardPreview_unstable","props","ref","logo","selectableA11yProps","referenceLabel","referenceId","setReferenceLabel","setReferenceId","CardContext_1","previewRef","react_utilities_1","React","useRef","useEffect","current","parentNode","img","querySelector","useCardPreviewStyles_1","root","ariaLabel","getAttribute","ariaDescribedby","alt","components","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-card/src/components/CardPreview/useCardPreview.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useMergedRefs } from '@fluentui/react-utilities';\nimport type { CardPreviewProps, CardPreviewState } from './CardPreview.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardPreviewClassNames } from './useCardPreviewStyles';\n\n/**\n * Create the state required to render CardPreview.\n *\n * The returned state can be modified with hooks such as useCardPreviewStyles_unstable,\n * before being passed to renderCardPreview_unstable.\n *\n * @param props - props from this instance of CardPreview\n * @param ref - reference to root HTMLElement of CardPreview\n */\nexport const useCardPreview_unstable = (props: CardPreviewProps, ref: React.Ref<HTMLElement>): CardPreviewState => {\n  const { logo } = props;\n\n  const {\n    selectableA11yProps: { referenceLabel, referenceId, setReferenceLabel, setReferenceId },\n  } = useCardContext_unstable();\n  const previewRef = useMergedRefs(ref, React.useRef<HTMLDivElement>(null));\n\n  React.useEffect(() => {\n    if (referenceLabel && referenceId) {\n      return;\n    }\n\n    if (previewRef.current && previewRef.current.parentNode) {\n      const img = previewRef.current.parentNode.querySelector<HTMLImageElement>(`.${cardPreviewClassNames.root} > img`);\n\n      if (img) {\n        const ariaLabel = img.getAttribute('aria-label');\n        const ariaDescribedby = img.getAttribute('aria-describedby');\n\n        if (ariaDescribedby) {\n          setReferenceId(ariaDescribedby);\n        } else if (img.alt) {\n          setReferenceLabel(img.alt);\n        } else if (ariaLabel) {\n          setReferenceLabel(ariaLabel);\n        }\n      }\n    }\n  }, [setReferenceLabel, referenceLabel, previewRef, referenceId, setReferenceId]);\n\n  return {\n    components: {\n      root: 'div',\n      logo: 'div',\n    },\n\n    root: getNativeElementProps('div', {\n      ref: previewRef,\n      ...props,\n    }),\n    logo: resolveShorthand(logo),\n  };\n};\n"]}