@fluentui/react-card 0.0.0-nightly0e0cf06c3420211029.1 → 0.0.0-nightly554221a5aa20211202.1

package/lib/components/CardFooter/useCardFooterStyles.d.ts

@@ -1,4 +1,5 @@
 import type { CardFooterState } from './CardFooter.types';
+export declare const cardFooterClassName = "fui-CardFooter";
 /**
  * Apply styling to the CardFooter slots based on the state
  */

package/lib/components/CardFooter/useCardFooterStyles.js

@@ -1,28 +1,30 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { __styles, mergeClasses, shorthands } from '@fluentui/react-make-styles';
+export const cardFooterClassName = 'fui-CardFooter';
 /**
  * Styles for the root slot
  */
 
-var useStyles = /*#__PURE__*/__styles({
+const useStyles = /*#__PURE__*/__styles({
   "root": {
     "mc9l5x": "f22iagw",
     "Beiy3e4": "f1063pyq",
-    "rmohyg": "fsbu5mz"
+    "i8kkvl": "f4akndk",
+    "Belr9w4": "fe5j3v"
   },
   "action": {
     "Frg6f3": ["fcgxt0o", "f1ujusj6"]
   }
 }, {
-  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".fsbu5mz{gap:12px;}", ".fcgxt0o{margin-left:auto;}", ".f1ujusj6{margin-right:auto;}"]
+  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".f4akndk{-webkit-column-gap:12px;column-gap:12px;}", ".fe5j3v{row-gap:12px;}", ".fcgxt0o{margin-left:auto;}", ".f1ujusj6{margin-right:auto;}"]
 });
 /**
  * Apply styling to the CardFooter slots based on the state
  */
 
 
-export var useCardFooterStyles = function (state) {
-  var styles = useStyles();
-  state.root.className = mergeClasses(styles.root, state.root.className);
+export const useCardFooterStyles = state => {
+  const styles = useStyles();
+  state.root.className = mergeClasses(cardFooterClassName, styles.root, state.root.className);
 
   if (state.action) {
     state.action.className = mergeClasses(styles.action, state.action.className);

package/lib/components/CardFooter/useCardFooterStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardFooter/useCardFooterStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,6BAAzC;AAGA;;AAEG;;AACH,IAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAWA;;AAEG;;;AACH,OAAO,IAAM,mBAAmB,GAAG,UAAC,KAAD,EAAuB;AACxD,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,MAAM,CAAC,IAAR,EAAc,KAAK,CAAC,IAAN,CAAW,SAAzB,CAAnC;;AAEA,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,IAAA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,YAAY,CAAC,MAAM,CAAC,MAAR,EAAgB,KAAK,CAAC,MAAN,CAAa,SAA7B,CAArC;AACD;;AAED,SAAO,KAAP;AACD,CATM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardFooter/useCardFooterStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,6BAArD;AAGA,OAAO,MAAM,mBAAmB,GAAG,gBAA5B;AAEP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAWA;;AAEG;;;AACH,OAAO,MAAM,mBAAmB,GAAI,KAAD,IAA4C;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,mBAAD,EAAsB,MAAM,CAAC,IAA7B,EAAmC,KAAK,CAAC,IAAN,CAAW,SAA9C,CAAnC;;AAEA,MAAI,KAAK,CAAC,MAAV,EAAkB;AAChB,IAAA,KAAK,CAAC,MAAN,CAAa,SAAb,GAAyB,YAAY,CAAC,MAAM,CAAC,MAAR,EAAgB,KAAK,CAAC,MAAN,CAAa,SAA7B,CAArC;AACD;;AAED,SAAO,KAAP;AACD,CATM","sourceRoot":""}

package/lib/components/CardHeader/CardHeader.js

@@ -6,8 +6,8 @@ import { useCardHeaderStyles } from './useCardHeaderStyles';
  * Component to render an image, text and an action in a Card component.
  */
 
-export var CardHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var state = useCardHeader(props, ref);
+export const CardHeader = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useCardHeader(props, ref);
   useCardHeaderStyles(state);
   return renderCardHeader(state);
 });

package/lib/components/CardHeader/CardHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardHeader/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,mBAAT,QAAoC,uBAApC;AAIA;;AAEG;;AACH,OAAO,IAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,UAAC,KAAD,EAAQ,GAAR,EAAW;AAC1F,MAAM,KAAK,GAAG,aAAa,CAAC,KAAD,EAAQ,GAAR,CAA3B;AAEA,EAAA,mBAAmB,CAAC,KAAD,CAAnB;AACA,SAAO,gBAAgB,CAAC,KAAD,CAAvB;AACD,CAL+D,CAAzD;AAOP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardHeader/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,aAAT,QAA8B,iBAA9B;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,mBAAT,QAAoC,uBAApC;AAIA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,aAAa,CAAC,KAAD,EAAQ,GAAR,CAA3B;AAEA,EAAA,mBAAmB,CAAC,KAAD,CAAnB;AACA,SAAO,gBAAgB,CAAC,KAAD,CAAvB;AACD,CAL+D,CAAzD;AAOP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourceRoot":""}

package/lib/components/CardHeader/renderCardHeader.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import * as React from 'react';
 import { getSlots } from '@fluentui/react-utilities';
 import { cardHeaderShorthandProps } from './useCardHeader';
@@ -6,11 +5,11 @@ import { cardHeaderShorthandProps } from './useCardHeader';
  * Render the final JSX of CardHeader
  */
 
-export var renderCardHeader = function (state) {
-  var _a = getSlots(state, cardHeaderShorthandProps),
-      slots = _a.slots,
-      slotProps = _a.slotProps;
-
-  return /*#__PURE__*/React.createElement(slots.root, __assign({}, slotProps.root), /*#__PURE__*/React.createElement(slots.image, __assign({}, slotProps.image)), /*#__PURE__*/React.createElement(slots.content, __assign({}, slotProps.content), /*#__PURE__*/React.createElement(slots.header, __assign({}, slotProps.header)), /*#__PURE__*/React.createElement(slots.description, __assign({}, slotProps.description))), /*#__PURE__*/React.createElement(slots.action, __assign({}, slotProps.action)));
+export const renderCardHeader = state => {
+  const {
+    slots,
+    slotProps
+  } = getSlots(state, cardHeaderShorthandProps);
+  return /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), /*#__PURE__*/React.createElement(slots.image, Object.assign({}, slotProps.image)), /*#__PURE__*/React.createElement(slots.content, Object.assign({}, slotProps.content), /*#__PURE__*/React.createElement(slots.header, Object.assign({}, slotProps.header)), /*#__PURE__*/React.createElement(slots.description, Object.assign({}, slotProps.description))), /*#__PURE__*/React.createElement(slots.action, Object.assign({}, slotProps.action)));
 };
 //# sourceMappingURL=renderCardHeader.js.map

package/lib/components/CardHeader/renderCardHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardHeader/renderCardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAEA,SAAS,wBAAT,QAAyC,iBAAzC;AAEA;;AAEG;;AACH,OAAO,IAAM,gBAAgB,GAAG,UAAC,KAAD,EAAuB;AAC/C,MAAA,EAAA,GAAuB,QAAQ,CAAkB,KAAlB,EAAyB,wBAAzB,CAA/B;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,OAAf,CAAd,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,MAAf,CAAb,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,WAAP,EAAkB,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,WAAf,CAAlB,CAFF,CAFF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,MAAf,CAAb,CANF,CADF;AAUD,CAbM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardHeader/renderCardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAEA,SAAS,wBAAT,QAAyC,iBAAzC;AAEA;;AAEG;;AACH,OAAO,MAAM,gBAAgB,GAAI,KAAD,IAA2B;AACzD,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAkB,KAAlB,EAAyB,wBAAzB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,KAAf,CAAZ,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,OAAf,CAAd,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,MAAf,CAAb,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,WAAP,EAAkB,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,WAAf,CAAlB,CAFF,CAFF,eAME,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,MAAf,CAAb,CANF,CADF;AAUD,CAbM","sourceRoot":""}

package/lib/components/CardHeader/useCardHeader.js

@@ -1,7 +1,6 @@
-import { __assign } from "tslib";
 import * as React from 'react';
 import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
-export var cardHeaderShorthandProps = ['root', 'image', 'content', 'header', 'description', 'action'];
+export const cardHeaderShorthandProps = ['root', 'image', 'content', 'header', 'description', 'action'];
 /**
  * Create the state required to render CardHeader.
  *
@@ -12,12 +11,14 @@ export var cardHeaderShorthandProps = ['root', 'image', 'content', 'header', 'de
  * @param ref - reference to root HTMLElement of CardHeader
  */
 
-export var useCardHeader = function (props, ref) {
-  var image = props.image,
-      content = props.content,
-      header = props.header,
-      description = props.description,
-      action = props.action;
+export const useCardHeader = (props, ref) => {
+  const {
+    image,
+    content,
+    header,
+    description,
+    action
+  } = props;
   return {
     components: {
       root: 'div',
@@ -27,9 +28,10 @@ export var useCardHeader = function (props, ref) {
       description: React.Fragment,
       action: 'div'
     },
-    root: getNativeElementProps('div', __assign({
-      ref: ref
-    }, props)),
+    root: getNativeElementProps('div', {
+      ref,
+      ...props
+    }),
     image: resolveShorthand(image, {
       required: true
     }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardHeader/useCardHeader.ts"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA,OAAO,IAAM,wBAAwB,GAAiC,CACpE,MADoE,EAEpE,OAFoE,EAGpE,SAHoE,EAIpE,QAJoE,EAKpE,aALoE,EAMpE,QANoE,CAA/D;AASP;;;;;;;;AAQG;;AACH,OAAO,IAAM,aAAa,GAAG,UAAC,KAAD,EAAyB,GAAzB,EAAoD;AACvE,MAAA,KAAK,GAA2C,KAAK,CAAhD,KAAL;AAAA,MAAO,OAAO,GAAkC,KAAK,CAAvC,OAAd;AAAA,MAAgB,MAAM,GAA0B,KAAK,CAA/B,MAAtB;AAAA,MAAwB,WAAW,GAAa,KAAK,CAAlB,WAAnC;AAAA,MAAqC,MAAM,GAAK,KAAK,CAAV,MAA3C;AAER,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,OAAO,EAAE,KAHC;AAIV,MAAA,MAAM,EAAE,KAAK,CAAC,QAJJ;AAKV,MAAA,WAAW,EAAE,KAAK,CAAC,QALT;AAMV,MAAA,MAAM,EAAE;AANE,KADP;AAUL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAM,QAAA,CAAA;AAC/B,MAAA,GAAG,EAAA;AAD4B,KAAA,EAE5B,KAF4B,CAAN,CAVtB;AAcL,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE;AADmB,KAAR,CAdlB;AAiBL,IAAA,OAAO,EAAE,gBAAgB,CAAC,OAAO,IAAI,EAAZ,CAjBpB;AAkBL,IAAA,MAAM,EAAE,gBAAgB,CAAC,MAAD,EAAS;AAC/B,MAAA,QAAQ,EAAE;AADqB,KAAT,CAlBnB;AAqBL,IAAA,WAAW,EAAE,gBAAgB,CAAC,WAAD,EAAc;AACzC,MAAA,QAAQ,EAAE;AAD+B,KAAd,CArBxB;AAwBL,IAAA,MAAM,EAAE,gBAAgB,CAAC,MAAD;AAxBnB,GAAP;AA0BD,CA7BM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardHeader/useCardHeader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA,OAAO,MAAM,wBAAwB,GAAiC,CACpE,MADoE,EAEpE,OAFoE,EAGpE,SAHoE,EAIpE,QAJoE,EAKpE,aALoE,EAMpE,QANoE,CAA/D;AASP;;;;;;;;AAQG;;AACH,OAAO,MAAM,aAAa,GAAG,CAAC,KAAD,EAAyB,GAAzB,KAAyE;AACpG,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,OAAT;AAAkB,IAAA,MAAlB;AAA0B,IAAA,WAA1B;AAAuC,IAAA;AAAvC,MAAkD,KAAxD;AAEA,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,KAAK,EAAE,KAFG;AAGV,MAAA,OAAO,EAAE,KAHC;AAIV,MAAA,MAAM,EAAE,KAAK,CAAC,QAJJ;AAKV,MAAA,WAAW,EAAE,KAAK,CAAC,QALT;AAMV,MAAA,MAAM,EAAE;AANE,KADP;AAUL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AACjC,MAAA,GADiC;AAEjC,SAAG;AAF8B,KAAR,CAVtB;AAcL,IAAA,KAAK,EAAE,gBAAgB,CAAC,KAAD,EAAQ;AAC7B,MAAA,QAAQ,EAAE;AADmB,KAAR,CAdlB;AAiBL,IAAA,OAAO,EAAE,gBAAgB,CAAC,OAAO,IAAI,EAAZ,CAjBpB;AAkBL,IAAA,MAAM,EAAE,gBAAgB,CAAC,MAAD,EAAS;AAC/B,MAAA,QAAQ,EAAE;AADqB,KAAT,CAlBnB;AAqBL,IAAA,WAAW,EAAE,gBAAgB,CAAC,WAAD,EAAc;AACzC,MAAA,QAAQ,EAAE;AAD+B,KAAd,CArBxB;AAwBL,IAAA,MAAM,EAAE,gBAAgB,CAAC,MAAD;AAxBnB,GAAP;AA0BD,CA7BM","sourceRoot":""}

package/lib/components/CardHeader/useCardHeaderStyles.d.ts

@@ -1,4 +1,5 @@
 import type { CardHeaderState } from './CardHeader.types';
+export declare const cardHeaderClassName = "fui-CardHeader";
 /**
  * Apply styling to the CardHeader slots based on the state
  */

package/lib/components/CardHeader/useCardHeaderStyles.js

@@ -1,14 +1,16 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { __styles, mergeClasses, shorthands } from '@fluentui/react-make-styles';
+export const cardHeaderClassName = 'fui-CardHeader';
 /**
  * Styles for the root slot
  */
 
-var useStyles = /*#__PURE__*/__styles({
+const useStyles = /*#__PURE__*/__styles({
   "root": {
     "mc9l5x": "f22iagw",
     "Beiy3e4": "f1063pyq",
     "Bt984gj": "f122n59",
-    "rmohyg": "fsbu5mz",
+    "i8kkvl": "f4akndk",
+    "Belr9w4": "fe5j3v",
     "Bqenvij": "f1d2rq10"
   },
   "image": {
@@ -31,16 +33,16 @@ var useStyles = /*#__PURE__*/__styles({
     "Bn3e79g": "f1con4nn"
   }
 }, {
-  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".fsbu5mz{gap:12px;}", ".f1d2rq10{height:32px;}", ".f17fgpbq{min-width:24px;}", ".f1pha7fy{min-height:24px;}", ".f44c6la{max-width:32px;}", ".f17bzqcb{max-height:32px;}", ".fgn7ydb>*{min-width:inherit;}", ".f1jevvm1>*{min-height:inherit;}", ".fqihwjc>*{max-width:100%;}", ".f6x1sus>*{max-height:100%;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fwk23hs{height:inherit;}", ".f1con4nn>*{height:50%;}"]
+  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f4akndk{-webkit-column-gap:12px;column-gap:12px;}", ".fe5j3v{row-gap:12px;}", ".f1d2rq10{height:32px;}", ".f17fgpbq{min-width:24px;}", ".f1pha7fy{min-height:24px;}", ".f44c6la{max-width:32px;}", ".f17bzqcb{max-height:32px;}", ".fgn7ydb>*{min-width:inherit;}", ".f1jevvm1>*{min-height:inherit;}", ".fqihwjc>*{max-width:100%;}", ".f6x1sus>*{max-height:100%;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".fwk23hs{height:inherit;}", ".f1con4nn>*{height:50%;}"]
 });
 /**
  * Apply styling to the CardHeader slots based on the state
  */
 
 
-export var useCardHeaderStyles = function (state) {
-  var styles = useStyles();
-  state.root.className = mergeClasses(styles.root, state.root.className);
+export const useCardHeaderStyles = state => {
+  const styles = useStyles();
+  state.root.className = mergeClasses(cardHeaderClassName, styles.root, state.root.className);
 
   if (state.image) {
     state.image.className = mergeClasses(styles.image, state.image.className);

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,6BAAzC;AAGA;;AAEG;;AACH,IAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqCA;;AAEG;;;AACH,OAAO,IAAM,mBAAmB,GAAG,UAAC,KAAD,EAAuB;AACxD,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,MAAM,CAAC,IAAR,EAAc,KAAK,CAAC,IAAN,CAAW,SAAzB,CAAnC;;AAEA,MAAI,KAAK,CAAC,KAAV,EAAiB;AACf,IAAA,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,YAAY,CAAC,MAAM,CAAC,KAAR,EAAe,KAAK,CAAC,KAAN,CAAY,SAA3B,CAApC;AACD;;AAED,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CAAC,MAAM,CAAC,aAAR,EAAuB,KAAK,CAAC,OAAN,CAAc,SAArC,CAAtC;AACD;;AAED,SAAO,KAAP;AACD,CAbM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,6BAArD;AAGA,OAAO,MAAM,mBAAmB,GAAG,gBAA5B;AAEP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqCA;;AAEG;;;AACH,OAAO,MAAM,mBAAmB,GAAI,KAAD,IAA4C;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,mBAAD,EAAsB,MAAM,CAAC,IAA7B,EAAmC,KAAK,CAAC,IAAN,CAAW,SAA9C,CAAnC;;AAEA,MAAI,KAAK,CAAC,KAAV,EAAiB;AACf,IAAA,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,YAAY,CAAC,MAAM,CAAC,KAAR,EAAe,KAAK,CAAC,KAAN,CAAY,SAA3B,CAApC;AACD;;AAED,MAAI,KAAK,CAAC,OAAV,EAAmB;AACjB,IAAA,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,YAAY,CAAC,MAAM,CAAC,aAAR,EAAuB,KAAK,CAAC,OAAN,CAAc,SAArC,CAAtC;AACD;;AAED,SAAO,KAAP;AACD,CAbM","sourceRoot":""}

package/lib/components/CardPreview/CardPreview.js

@@ -6,8 +6,8 @@ import { useCardPreviewStyles } from './useCardPreviewStyles';
  * Component to render image previews of documents or articles in a Card component.
  */
 
-export var CardPreview = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var state = useCardPreview(props, ref);
+export const CardPreview = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useCardPreview(props, ref);
   useCardPreviewStyles(state);
   return renderCardPreview(state);
 });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardPreview/CardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,cAAT,QAA+B,kBAA/B;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAIA;;AAEG;;AACH,OAAO,IAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,UAAC,KAAD,EAAQ,GAAR,EAAW;AAC5F,MAAM,KAAK,GAAG,cAAc,CAAC,KAAD,EAAQ,GAAR,CAA5B;AAEA,EAAA,oBAAoB,CAAC,KAAD,CAApB;AACA,SAAO,iBAAiB,CAAC,KAAD,CAAxB;AACD,CALiE,CAA3D;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardPreview/CardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,cAAT,QAA+B,kBAA/B;AACA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,oBAAT,QAAqC,wBAArC;AAIA;;AAEG;;AACH,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,cAAc,CAAC,KAAD,EAAQ,GAAR,CAA5B;AAEA,EAAA,oBAAoB,CAAC,KAAD,CAApB;AACA,SAAO,iBAAiB,CAAC,KAAD,CAAxB;AACD,CALiE,CAA3D;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourceRoot":""}

package/lib/components/CardPreview/renderCardPreview.js

@@ -1,4 +1,3 @@
-import { __assign } from "tslib";
 import * as React from 'react';
 import { getSlots } from '@fluentui/react-utilities';
 import { cardPreviewShorthandProps } from './useCardPreview';
@@ -6,11 +5,11 @@ import { cardPreviewShorthandProps } from './useCardPreview';
  * Render the final JSX of CardPreview
  */
 
-export var renderCardPreview = function (state) {
-  var _a = getSlots(state, cardPreviewShorthandProps),
-      slots = _a.slots,
-      slotProps = _a.slotProps;
-
-  return /*#__PURE__*/React.createElement(slots.root, __assign({}, slotProps.root), slotProps.root.children, /*#__PURE__*/React.createElement(slots.logo, __assign({}, slotProps.logo)));
+export const renderCardPreview = state => {
+  const {
+    slots,
+    slotProps
+  } = getSlots(state, cardPreviewShorthandProps);
+  return /*#__PURE__*/React.createElement(slots.root, Object.assign({}, slotProps.root), slotProps.root.children, /*#__PURE__*/React.createElement(slots.logo, Object.assign({}, slotProps.logo)));
 };
 //# sourceMappingURL=renderCardPreview.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,yBAAT,QAA0C,kBAA1C;AAGA;;AAEG;;AACH,OAAO,IAAM,iBAAiB,GAAG,UAAC,KAAD,EAAwB;AACjD,MAAA,EAAA,GAAuB,QAAQ,CAAmB,KAAnB,EAA0B,yBAA1B,CAA/B;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAFF,CADF;AAMD,CATM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AACA,SAAS,yBAAT,QAA0C,kBAA1C;AAGA;;AAEG;;AACH,OAAO,MAAM,iBAAiB,GAAI,KAAD,IAA4B;AAC3D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAmB,KAAnB,EAA0B,yBAA1B,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAFF,CADF;AAMD,CATM","sourceRoot":""}

package/lib/components/CardPreview/useCardPreview.js

@@ -1,10 +1,9 @@
-import { __assign } from "tslib";
 import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
 /**
  * Array of all shorthand properties listed in CardPreviewShorthandProps
  */
 
-export var cardPreviewShorthandProps = ['root', 'logo'];
+export const cardPreviewShorthandProps = ['root', 'logo'];
 /**
  * Create the state required to render CardPreview.
  *
@@ -15,16 +14,19 @@ export var cardPreviewShorthandProps = ['root', 'logo'];
  * @param ref - reference to root HTMLElement of CardPreview
  */
 
-export var useCardPreview = function (props, ref) {
-  var logo = props.logo;
+export const useCardPreview = (props, ref) => {
+  const {
+    logo
+  } = props;
   return {
     components: {
       root: 'div',
       logo: 'div'
     },
-    root: getNativeElementProps('div', __assign({
-      ref: ref
-    }, props)),
+    root: getNativeElementProps('div', {
+      ref,
+      ...props
+    }),
     logo: resolveShorthand(logo)
   };
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardPreview/useCardPreview.ts"],"names":[],"mappings":";AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;AAEG;;AACH,OAAO,IAAM,yBAAyB,GAAkC,CAAC,MAAD,EAAS,MAAT,CAAjE;AAEP;;;;;;;;AAQG;;AACH,OAAO,IAAM,cAAc,GAAG,UAAC,KAAD,EAA0B,GAA1B,EAAqD;AACzE,MAAA,IAAI,GAAK,KAAK,CAAV,IAAJ;AACR,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,IAAI,EAAE;AAFI,KADP;AAML,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAM,QAAA,CAAA;AAC/B,MAAA,GAAG,EAAA;AAD4B,KAAA,EAE5B,KAF4B,CAAN,CANtB;AAUL,IAAA,IAAI,EAAE,gBAAgB,CAAC,IAAD;AAVjB,GAAP;AAYD,CAdM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardPreview/useCardPreview.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;AAEG;;AACH,OAAO,MAAM,yBAAyB,GAAkC,CAAC,MAAD,EAAS,MAAT,CAAjE;AAEP;;;;;;;;AAQG;;AACH,OAAO,MAAM,cAAc,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;AACvG,QAAM;AAAE,IAAA;AAAF,MAAW,KAAjB;AACA,SAAO;AACL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,IAAI,EAAE;AAFI,KADP;AAML,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AACjC,MAAA,GADiC;AAEjC,SAAG;AAF8B,KAAR,CANtB;AAUL,IAAA,IAAI,EAAE,gBAAgB,CAAC,IAAD;AAVjB,GAAP;AAYD,CAdM","sourceRoot":""}

package/lib/components/CardPreview/useCardPreviewStyles.d.ts

@@ -1,4 +1,5 @@
 import type { CardPreviewState } from './CardPreview.types';
+export declare const cardPreviewClassName = "fui-CardPreview";
 /**
  * Apply styling to the CardPreview slots based on the state
  */

package/lib/components/CardPreview/useCardPreviewStyles.js

@@ -1,9 +1,10 @@
-import { __styles, mergeClasses } from '@fluentui/react-make-styles';
+import { shorthands, __styles, mergeClasses } from '@fluentui/react-make-styles';
+export const cardPreviewClassName = 'fui-CardPreview';
 /**
  * Styles for the root slot
  */
 
-var useStyles = /*#__PURE__*/__styles({
+const useStyles = /*#__PURE__*/__styles({
   "root": {
     "qhf8xq": "f10pi13n",
     "B6of3ja": "f1hu3pq6",
@@ -28,9 +29,9 @@ var useStyles = /*#__PURE__*/__styles({
  */
 
 
-export var useCardPreviewStyles = function (state) {
-  var styles = useStyles();
-  state.root.className = mergeClasses('fluentui-react-card-preview', styles.root, state.root.className);
+export const useCardPreviewStyles = state => {
+  const styles = useStyles();
+  state.root.className = mergeClasses(cardPreviewClassName, styles.root, state.root.className);
 
   if (state.logo) {
     state.logo.className = mergeClasses(styles.logo, state.logo.className);

package/lib/components/CardPreview/useCardPreviewStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,6BAAzC;AAGA;;AAEG;;AACH,IAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACH,OAAO,IAAM,oBAAoB,GAAG,UAAC,KAAD,EAAwB;AAC1D,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,6BAAD,EAAgC,MAAM,CAAC,IAAvC,EAA6C,KAAK,CAAC,IAAN,CAAW,SAAxD,CAAnC;;AAEA,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,MAAM,CAAC,IAAR,EAAc,KAAK,CAAC,IAAN,CAAW,SAAzB,CAAnC;AACD;;AAED,SAAO,KAAP;AACD,CATM","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,6BAArD;AAGA,OAAO,MAAM,oBAAoB,GAAG,iBAA7B;AAEP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAqBA;;AAEG;;;AACH,OAAO,MAAM,oBAAoB,GAAI,KAAD,IAA8C;AAChF,QAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,oBAAD,EAAuB,MAAM,CAAC,IAA9B,EAAoC,KAAK,CAAC,IAAN,CAAW,SAA/C,CAAnC;;AAEA,MAAI,KAAK,CAAC,IAAV,EAAgB;AACd,IAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,MAAM,CAAC,IAAR,EAAc,KAAK,CAAC,IAAN,CAAW,SAAzB,CAAnC;AACD;;AAED,SAAO,KAAP;AACD,CATM","sourceRoot":""}

package/lib-commonjs/Card.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./components/Card/index"), exports);
 //# sourceMappingURL=Card.js.map

package/lib-commonjs/CardFooter.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./components/CardFooter/index"), exports);
 //# sourceMappingURL=CardFooter.js.map

package/lib-commonjs/CardHeader.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./components/CardHeader/index"), exports);
 //# sourceMappingURL=CardHeader.js.map

package/lib-commonjs/CardPreview.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./components/CardPreview/index"), exports);
 //# sourceMappingURL=CardPreview.js.map

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

@@ -5,20 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Card = void 0;
 
-var React = /*#__PURE__*/require("react");
+const React = /*#__PURE__*/require("react");
 
-var useCard_1 = /*#__PURE__*/require("./useCard");
+const useCard_1 = /*#__PURE__*/require("./useCard");
 
-var renderCard_1 = /*#__PURE__*/require("./renderCard");
+const renderCard_1 = /*#__PURE__*/require("./renderCard");
 
-var useCardStyles_1 = /*#__PURE__*/require("./useCardStyles");
+const useCardStyles_1 = /*#__PURE__*/require("./useCardStyles");
 /**
  * A card provides scaffolding for hosting actions and content for a single topic.
  */
 
 
-exports.Card = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var state = useCard_1.useCard(props, ref);
+exports.Card = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useCard_1.useCard(props, ref);
   useCardStyles_1.useCardStyles(state);
   return renderCard_1.renderCard(state);
 });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,SAAA,gBAAA,OAAA,CAAA,WAAA,CAAA;;AACA,IAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,IAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,IAAA,gBAAuC,KAAK,CAAC,UAAN,CAAiB,UAAC,KAAD,EAAQ,GAAR,EAAW;AAC9E,MAAM,KAAK,GAAG,SAAA,CAAA,OAAA,CAAQ,KAAR,EAAe,GAAf,CAAd;AAEA,EAAA,eAAA,CAAA,aAAA,CAAc,KAAd;AACA,SAAO,YAAA,CAAA,UAAA,CAAW,KAAX,CAAP;AACD,CALmD,CAAvC;AAOb,OAAA,CAAA,IAAA,CAAK,WAAL,GAAmB,MAAnB","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,SAAA,gBAAA,OAAA,CAAA,WAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,IAAA,gBAAuC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAClF,QAAM,KAAK,GAAG,SAAA,CAAA,OAAA,CAAQ,KAAR,EAAe,GAAf,CAAd;AAEA,EAAA,eAAA,CAAA,aAAA,CAAc,KAAd;AACA,SAAO,YAAA,CAAA,UAAA,CAAW,KAAX,CAAP;AACD,CALmD,CAAvC;AAOb,OAAA,CAAA,IAAA,CAAK,WAAL,GAAmB,MAAnB","sourceRoot":""}

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const tslib_1 = /*#__PURE__*/require("tslib");
 
 tslib_1.__exportStar(require("./Card"), exports);
 

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

@@ -5,22 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.renderCard = void 0;
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const React = /*#__PURE__*/require("react");
 
-var React = /*#__PURE__*/require("react");
-
-var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Render the final JSX of Card
  */
 
 
-var renderCard = function (state) {
-  var _a = react_utilities_1.getSlots(state),
-      slots = _a.slots,
-      slotProps = _a.slotProps;
-
-  return React.createElement(slots.root, tslib_1.__assign({}, slotProps.root));
+const renderCard = state => {
+  const {
+    slots,
+    slotProps
+  } = react_utilities_1.getSlots(state);
+  return React.createElement(slots.root, Object.assign({}, slotProps.root));
 };
 
 exports.renderCard = renderCard;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Card/renderCard.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,IAAM,UAAU,GAAG,UAAC,KAAD,EAAiB;AACnC,MAAA,EAAA,GAAuB,iBAAA,CAAA,QAAA,CAAoB,KAApB,CAAvB;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,SAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/Card/renderCard.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,UAAU,GAAI,KAAD,IAAqB;AAC7C,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAAoB,KAApB,CAA7B;AAEA,SAAO,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAAP;AACD,CAJM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourceRoot":""}

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

@@ -5,11 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useCard = void 0;
 
-var tslib_1 = /*#__PURE__*/require("tslib");
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 
-var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-
-var react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
+const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
 /**
  * Create the state required to render Card.
  *
@@ -21,18 +19,20 @@ var react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
  */
 
 
-var useCard = function (props, ref) {
-  var groupperAttrs = react_tabster_1.useFocusableGroup({
-    tabBehavior: react_tabster_1.FocusableGroupTabBehavior.LimitedTrapFocus
+const useCard = (props, ref) => {
+  const groupperAttrs = react_tabster_1.useFocusableGroup({
+    tabBehavior: 'limitedTrapFocus'
   });
   return {
     components: {
       root: 'div'
     },
-    root: react_utilities_1.getNativeElementProps(props.as || 'div', tslib_1.__assign(tslib_1.__assign({
-      ref: ref,
-      role: 'group'
-    }, groupperAttrs), props))
+    root: react_utilities_1.getNativeElementProps(props.as || 'div', {
+      ref,
+      role: 'group',
+      ...groupperAttrs,
+      ...props
+    })
   };
 };
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Card/useCard.ts"],"names":[],"mappings":";;;;;;;;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,IAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,IAAM,OAAO,GAAG,UAAC,KAAD,EAAmB,GAAnB,EAA8C;AACnE,MAAM,aAAa,GAAG,eAAA,CAAA,iBAAA,CAAkB;AACtC,IAAA,WAAW,EAAE,eAAA,CAAA,yBAAA,CAA0B;AADD,GAAlB,CAAtB;AAIA,SAAO;AACL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KADP;AAGL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAK,CAAC,EAAN,IAAY,KAAlC,EAAuC,OAAA,CAAA,QAAA,CAAA,OAAA,CAAA,QAAA,CAAA;AAC3C,MAAA,GAAG,EAAA,GADwC;AAE3C,MAAA,IAAI,EAAE;AAFqC,KAAA,EAGxC,aAHwC,CAAA,EAIxC,KAJwC,CAAvC;AAHD,GAAP;AAUD,CAfM;;AAAM,OAAA,CAAA,OAAA,GAAO,OAAP","sourceRoot":""}
+{"version":3,"sources":["../../../src/components/Card/useCard.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,OAAO,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAA6D;AAClF,QAAM,aAAa,GAAG,eAAA,CAAA,iBAAA,CAAkB;AACtC,IAAA,WAAW,EAAE;AADyB,GAAlB,CAAtB;AAIA,SAAO;AACL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KADP;AAGL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAK,CAAC,EAAN,IAAY,KAAlC,EAAyC;AAC7C,MAAA,GAD6C;AAE7C,MAAA,IAAI,EAAE,OAFuC;AAG7C,SAAG,aAH0C;AAI7C,SAAG;AAJ0C,KAAzC;AAHD,GAAP;AAUD,CAfM;;AAAM,OAAA,CAAA,OAAA,GAAO,OAAP","sourceRoot":""}

package/lib-commonjs/components/Card/useCardStyles.d.ts

@@ -1,4 +1,5 @@
 import type { CardState } from './Card.types';
+export declare const cardClassName = "fui-Card";
 /**
  * Apply styling to the Card slots based on the state
  */

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

@@ -3,31 +3,39 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useCardStyles = void 0;
+exports.useCardStyles = exports.cardClassName = void 0;
 
-var react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
+const react_make_styles_1 = /*#__PURE__*/require("@fluentui/react-make-styles");
+
+const index_1 = /*#__PURE__*/require("../CardPreview/index");
+
+exports.cardClassName = 'fui-Card';
 /**
  * Styles for the root slot
  */
 
-
-var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
+const useStyles = /*#__PURE__*/react_make_styles_1.__styles({
   "root": {
     "mc9l5x": "f22iagw",
     "Beiy3e4": "f1vx9l62",
-    "Bpg54ce": "f1a3p1vp",
-    "E5pizo": ["f1whvlc6", "fzb35q0"],
+    "B68tc82": "f1p9o1ba",
+    "Bmxbyg5": "f1sil6mw",
+    "E5pizo": "f1whvlc6",
     "sj55zd": "f19n0e5",
     "De3pzq": "fxugw4r",
     "z8tnut": "f1kcqot9",
     "z189sj": ["f11qrl6u", "fjlbh76"],
     "Byoj8tv": "fpe6lb7",
     "uwmqm3": ["fjlbh76", "f11qrl6u"],
-    "rmohyg": "fsbu5mz",
-    "Dimara": "ft85np5",
-    "Beromem": ["f1kp1iwg", "f1819hsr"],
-    "tyvvez": ["f1819hsr", "f1kp1iwg"],
-    "kr49nh": "fthnjpr"
+    "i8kkvl": "f4akndk",
+    "Belr9w4": "fe5j3v",
+    "Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
+    "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
+    "B7oj6ja": ["f1jar5jt", "fyu767a"],
+    "Btl43ni": ["fyu767a", "f1jar5jt"],
+    "Bt4kzjz": ["fwanz6y", "f1sdy22h"],
+    "B1ou843": ["f1sdy22h", "fwanz6y"],
+    "Bx3mhbb": "f12h22a6"
   },
   "interactive": {
     "Bceei9c": "f1k6fduh",
@@ -35,7 +43,7 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
     "ecr2s2": "fb40n2d"
   }
 }, {
-  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f1a3p1vp{overflow:hidden;}", ".f1whvlc6{box-shadow:var(--shadow4);}", ".fzb35q0{box-shadow:var(--shadow-4);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1kcqot9{padding-top:12px;}", ".f11qrl6u{padding-right:12px;}", ".fjlbh76{padding-left:12px;}", ".fpe6lb7{padding-bottom:12px;}", ".fsbu5mz{gap:12px;}", ".ft85np5{border-radius:var(--borderRadiusMedium);}", ".f1kp1iwg>.fluentui-react-card-preview{margin-left:-12px;}", ".f1819hsr>.fluentui-react-card-preview{margin-right:-12px;}", ".fthnjpr>.fluentui-react-card-preview:first-child{margin-top:-12px;}", ".f1k6fduh{cursor:pointer;}"],
+  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f1whvlc6{box-shadow:var(--shadow4);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1kcqot9{padding-top:12px;}", ".f11qrl6u{padding-right:12px;}", ".fjlbh76{padding-left:12px;}", ".fpe6lb7{padding-bottom:12px;}", ".f4akndk{-webkit-column-gap:12px;column-gap:12px;}", ".fe5j3v{row-gap:12px;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".fwanz6y>.fui-CardPreview{margin-left:-12px;}", ".f1sdy22h>.fui-CardPreview{margin-right:-12px;}", ".f12h22a6>.fui-CardPreview:first-child{margin-top:-12px;}", ".f1k6fduh{cursor:pointer;}"],
   "h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}"],
   "a": [".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}"]
 });
@@ -44,9 +52,9 @@ var useStyles = /*#__PURE__*/react_make_styles_1.__styles({
  */
 
 
-var useCardStyles = function (state) {
-  var styles = useStyles();
-  state.root.className = react_make_styles_1.mergeClasses(styles.root, (state.root.onClick || state.root.onMouseUp || state.root.onMouseDown || state.root.onPointerUp || state.root.onPointerDown || state.root.onTouchStart || state.root.onTouchEnd) && styles.interactive, state.root.className);
+const useCardStyles = state => {
+  const styles = useStyles();
+  state.root.className = react_make_styles_1.mergeClasses(exports.cardClassName, styles.root, (state.root.onClick || state.root.onMouseUp || state.root.onMouseDown || state.root.onPointerUp || state.root.onPointerDown || state.root.onTouchStart || state.root.onTouchEnd) && styles.interactive, state.root.className);
   return state;
 };