@fluentui/react-card 9.0.0-beta.11 → 9.0.0-beta.14

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

@@ -1 +1 @@
-{"version":3,"file":"Card.types.js","sourceRoot":"../src/","sources":["components/Card/Card.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type CardSlots = {\n  root: Slot<'div'>;\n};\n\nexport type CardCommons = {\n  appearance: 'filled' | 'filled-alternative' | 'outline' | 'subtle';\n};\n\n/**\n * Card Props\n */\nexport type CardProps = ComponentProps<CardSlots> & Partial<CardCommons>;\n\n/**\n * State used in rendering Card\n */\nexport type CardState = ComponentState<CardSlots> & CardCommons;\n"]}
+{"version":3,"file":"Card.types.js","sourceRoot":"../src/","sources":["components/Card/Card.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type CardSlots = {\n  root: Slot<'div'>;\n};\n\nexport type CardCommons = {\n  appearance: 'filled' | 'filled-alternative' | 'outline' | 'subtle';\n\n  /**\n   * Sets the focus behavior for the card. If `true`, the card will use the `noTab` focus behavior.\n   *\n   * `off`\n   * The card will not focusable.\n   *\n   * `no-tab`\n   * This behaviour traps the focus inside of the Card when pressing the Enter key and will only release focus when\n   * pressing the Escape key.\n   *\n   * `tab-exit`\n   * This behaviour traps the focus inside of the Card when pressing the Enter key but will release focus when pressing\n   * the Tab key on the last inner element.\n   *\n   * `tab-only`\n   * This behaviour will cycle through all elements inside of the Card when pressing the Tab key and then release focus\n   * after the last inner element.\n   *\n   * @defaultvalue off\n   */\n  focusMode: 'off' | 'no-tab' | 'tab-exit' | 'tab-only';\n};\n\n/**\n * Card Props\n */\nexport type CardProps = ComponentProps<CardSlots> & Partial<CardCommons>;\n\n/**\n * State used in rendering Card\n */\nexport type CardState = ComponentState<CardSlots> & CardCommons;\n"]}

package/lib/components/Card/useCard.js

@@ -11,20 +11,29 @@ import { useFocusableGroup } from '@fluentui/react-tabster';
  */
 
 export const useCard_unstable = (props, ref) => {
-  const groupperAttrs = useFocusableGroup({
-    tabBehavior: 'limitedTrapFocus'
-  });
   const {
-    appearance = 'filled'
+    appearance = 'filled',
+    focusMode = 'off'
   } = props;
+  const focusMap = {
+    off: undefined,
+    'no-tab': 'limitedTrapFocus',
+    'tab-exit': 'limited',
+    'tab-only': 'unlimited'
+  };
+  const groupperAttrs = useFocusableGroup({
+    tabBehavior: focusMap[focusMode]
+  });
   return {
     appearance,
+    focusMode,
     components: {
       root: 'div'
     },
     root: getNativeElementProps(props.as || 'div', {
       ref,
       role: 'group',
+      tabIndex: focusMode !== 'off' ? 0 : undefined,
       ...groupperAttrs,
       ...props
     })

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Card/useCard.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAEA,SAAS,iBAAT,QAAkC,yBAAlC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,gBAAgB,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAA6D;AAC3F,QAAM,aAAa,GAAG,iBAAiB,CAAC;AACtC,IAAA,WAAW,EAAE;AADyB,GAAD,CAAvC;AAIA,QAAM;AAAE,IAAA,UAAU,GAAG;AAAf,MAA4B,KAAlC;AACA,SAAO;AACL,IAAA,UADK;AAGL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KAHP;AAIL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAK,CAAC,EAAN,IAAY,KAAb,EAAoB;AAC7C,MAAA,GAD6C;AAE7C,MAAA,IAAI,EAAE,OAFuC;AAG7C,SAAG,aAH0C;AAI7C,SAAG;AAJ0C,KAApB;AAJtB,GAAP;AAWD,CAjBM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { CardProps, CardState } from './Card.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\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 root HTMLElement of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLElement>): CardState => {\n  const groupperAttrs = useFocusableGroup({\n    tabBehavior: 'limitedTrapFocus',\n  });\n\n  const { appearance = 'filled' } = props;\n  return {\n    appearance,\n\n    components: { root: 'div' },\n    root: getNativeElementProps(props.as || 'div', {\n      ref,\n      role: 'group',\n      ...groupperAttrs,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["components/Card/useCard.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,QAAsC,2BAAtC;AAEA,SAAS,iBAAT,QAAkC,yBAAlC;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,gBAAgB,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAA6D;AAC3F,QAAM;AAAE,IAAA,UAAU,GAAG,QAAf;AAAyB,IAAA,SAAS,GAAG;AAArC,MAA+C,KAArD;AAEA,QAAM,QAAQ,GAAG;AACf,IAAA,GAAG,EAAE,SADU;AAEf,cAAU,kBAFK;AAGf,gBAAY,SAHG;AAIf,gBAAY;AAJG,GAAjB;AAOA,QAAM,aAAa,GAAG,iBAAiB,CAAC;AACtC,IAAA,WAAW,EAAE,QAAQ,CAAC,SAAD;AADiB,GAAD,CAAvC;AAIA,SAAO;AACL,IAAA,UADK;AAEL,IAAA,SAFK;AAIL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KAJP;AAKL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAK,CAAC,EAAN,IAAY,KAAb,EAAoB;AAC7C,MAAA,GAD6C;AAE7C,MAAA,IAAI,EAAE,OAFuC;AAG7C,MAAA,QAAQ,EAAE,SAAS,KAAK,KAAd,GAAsB,CAAtB,GAA0B,SAHS;AAI7C,SAAG,aAJ0C;AAK7C,SAAG;AAL0C,KAApB;AALtB,GAAP;AAaD,CA3BM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { CardProps, CardState } from './Card.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\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 root HTMLElement of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLElement>): CardState => {\n  const { appearance = 'filled', focusMode = 'off' } = props;\n\n  const focusMap = {\n    off: undefined,\n    'no-tab': 'limitedTrapFocus',\n    'tab-exit': 'limited',\n    'tab-only': 'unlimited',\n  } as const;\n\n  const groupperAttrs = useFocusableGroup({\n    tabBehavior: focusMap[focusMode],\n  });\n\n  return {\n    appearance,\n    focusMode,\n\n    components: { root: 'div' },\n    root: getNativeElementProps(props.as || 'div', {\n      ref,\n      role: 'group',\n      tabIndex: focusMode !== 'off' ? 0 : undefined,\n      ...groupperAttrs,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}

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

@@ -20,20 +20,29 @@ const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
 
 
 const useCard_unstable = (props, ref) => {
-  const groupperAttrs = react_tabster_1.useFocusableGroup({
-    tabBehavior: 'limitedTrapFocus'
-  });
   const {
-    appearance = 'filled'
+    appearance = 'filled',
+    focusMode = 'off'
   } = props;
+  const focusMap = {
+    off: undefined,
+    'no-tab': 'limitedTrapFocus',
+    'tab-exit': 'limited',
+    'tab-only': 'unlimited'
+  };
+  const groupperAttrs = react_tabster_1.useFocusableGroup({
+    tabBehavior: focusMap[focusMode]
+  });
   return {
     appearance,
+    focusMode,
     components: {
       root: 'div'
     },
     root: react_utilities_1.getNativeElementProps(props.as || 'div', {
       ref,
       role: 'group',
+      tabIndex: focusMode !== 'off' ? 0 : undefined,
       ...groupperAttrs,
       ...props
     })

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

@@ -1 +1 @@
-{"version":3,"sources":["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,gBAAgB,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAA6D;AAC3F,QAAM,aAAa,GAAG,eAAA,CAAA,iBAAA,CAAkB;AACtC,IAAA,WAAW,EAAE;AADyB,GAAlB,CAAtB;AAIA,QAAM;AAAE,IAAA,UAAU,GAAG;AAAf,MAA4B,KAAlC;AACA,SAAO;AACL,IAAA,UADK;AAGL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KAHP;AAIL,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;AAJD,GAAP;AAWD,CAjBM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { CardProps, CardState } from './Card.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\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 root HTMLElement of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLElement>): CardState => {\n  const groupperAttrs = useFocusableGroup({\n    tabBehavior: 'limitedTrapFocus',\n  });\n\n  const { appearance = 'filled' } = props;\n  return {\n    appearance,\n\n    components: { root: 'div' },\n    root: getNativeElementProps(props.as || 'div', {\n      ref,\n      role: 'group',\n      ...groupperAttrs,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["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,gBAAgB,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAA6D;AAC3F,QAAM;AAAE,IAAA,UAAU,GAAG,QAAf;AAAyB,IAAA,SAAS,GAAG;AAArC,MAA+C,KAArD;AAEA,QAAM,QAAQ,GAAG;AACf,IAAA,GAAG,EAAE,SADU;AAEf,cAAU,kBAFK;AAGf,gBAAY,SAHG;AAIf,gBAAY;AAJG,GAAjB;AAOA,QAAM,aAAa,GAAG,eAAA,CAAA,iBAAA,CAAkB;AACtC,IAAA,WAAW,EAAE,QAAQ,CAAC,SAAD;AADiB,GAAlB,CAAtB;AAIA,SAAO;AACL,IAAA,UADK;AAEL,IAAA,SAFK;AAIL,IAAA,UAAU,EAAE;AAAE,MAAA,IAAI,EAAE;AAAR,KAJP;AAKL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAK,CAAC,EAAN,IAAY,KAAlC,EAAyC;AAC7C,MAAA,GAD6C;AAE7C,MAAA,IAAI,EAAE,OAFuC;AAG7C,MAAA,QAAQ,EAAE,SAAS,KAAK,KAAd,GAAsB,CAAtB,GAA0B,SAHS;AAI7C,SAAG,aAJ0C;AAK7C,SAAG;AAL0C,KAAzC;AALD,GAAP;AAaD,CA3BM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport type { CardProps, CardState } from './Card.types';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\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 root HTMLElement of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLElement>): CardState => {\n  const { appearance = 'filled', focusMode = 'off' } = props;\n\n  const focusMap = {\n    off: undefined,\n    'no-tab': 'limitedTrapFocus',\n    'tab-exit': 'limited',\n    'tab-only': 'unlimited',\n  } as const;\n\n  const groupperAttrs = useFocusableGroup({\n    tabBehavior: focusMap[focusMode],\n  });\n\n  return {\n    appearance,\n    focusMode,\n\n    components: { root: 'div' },\n    root: getNativeElementProps(props.as || 'div', {\n      ref,\n      role: 'group',\n      tabIndex: focusMode !== 'off' ? 0 : undefined,\n      ...groupperAttrs,\n      ...props,\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@fluentui/react-card",
-  "version": "9.0.0-beta.11",
+  "version": "9.0.0-beta.14",
   "private": false,
   "description": "Card container components for Fluent UI React.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
-  "typings": "lib/index.d.ts",
+  "typings": "dist/index.d.ts",
   "sideEffects": false,
   "repository": {
     "type": "git",
@@ -17,28 +17,29 @@
     "bundle-size": "bundle-size measure",
     "clean": "just-scripts clean",
     "code-style": "just-scripts code-style",
+    "e2e": "e2e",
     "just": "just-scripts",
     "lint": "just-scripts lint",
     "start": "yarn storybook",
     "test": "jest --passWithNoTests",
     "docs": "api-extractor run --config=config/api-extractor.local.json --local",
-    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-card/src && yarn docs",
-    "storybook": "node ../../scripts/storybook/runner",
+    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/packages/react-components/react-card/src && yarn docs",
+    "storybook": "node ../../../scripts/storybook/runner",
     "type-check": "tsc -b tsconfig.json"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "9.0.0-beta.4",
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.5",
     "@fluentui/scripts": "^1.0.0",
-    "@fluentui/react-text": "9.0.0-rc.6",
-    "@fluentui/react-button": "9.0.0-rc.6"
+    "@fluentui/react-text": "9.0.0-rc.8",
+    "@fluentui/react-button": "9.0.0-rc.9"
   },
   "dependencies": {
     "@griffel/react": "1.0.3",
-    "@fluentui/react-utilities": "9.0.0-rc.6",
-    "@fluentui/react-tabster": "9.0.0-rc.6",
-    "@fluentui/react-theme": "9.0.0-rc.5",
+    "@fluentui/react-utilities": "9.0.0-rc.8",
+    "@fluentui/react-tabster": "9.0.0-rc.9",
+    "@fluentui/react-theme": "9.0.0-rc.7",
     "tslib": "^2.1.0"
   },
   "peerDependencies": {

package/lib/Card.d.ts

@@ -1 +0,0 @@
-export * from './components/Card/index';

package/lib/CardFooter.d.ts

@@ -1 +0,0 @@
-export * from './components/CardFooter/index';

package/lib/CardHeader.d.ts

@@ -1 +0,0 @@
-export * from './components/CardHeader/index';

package/lib/CardPreview.d.ts

@@ -1 +0,0 @@
-export * from './components/CardPreview/index';

package/lib/components/Card/Card.d.ts

@@ -1,6 +0,0 @@
-import type { CardProps } from './Card.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * A card provides scaffolding for hosting actions and content for a single topic.
- */
-export declare const Card: ForwardRefComponent<CardProps>;

package/lib/components/Card/Card.types.d.ts

@@ -1,15 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardSlots = {
-    root: Slot<'div'>;
-};
-export declare type CardCommons = {
-    appearance: 'filled' | 'filled-alternative' | 'outline' | 'subtle';
-};
-/**
- * Card Props
- */
-export declare type CardProps = ComponentProps<CardSlots> & Partial<CardCommons>;
-/**
- * State used in rendering Card
- */
-export declare type CardState = ComponentState<CardSlots> & CardCommons;

package/lib/components/Card/index.d.ts

@@ -1,5 +0,0 @@
-export * from './Card';
-export * from './Card.types';
-export * from './renderCard';
-export * from './useCard';
-export * from './useCardStyles';

package/lib/components/Card/renderCard.d.ts

@@ -1,5 +0,0 @@
-import type { CardState } from './Card.types';
-/**
- * Render the final JSX of Card
- */
-export declare const renderCard_unstable: (state: CardState) => JSX.Element;

package/lib/components/Card/useCard.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardProps, CardState } from './Card.types';
-/**
- * Create the state required to render Card.
- *
- * The returned state can be modified with hooks such as useCardStyles_unstable,
- * before being passed to renderCard_unstable.
- *
- * @param props - props from this instance of Card
- * @param ref - reference to root HTMLElement of Card
- */
-export declare const useCard_unstable: (props: CardProps, ref: React.Ref<HTMLElement>) => CardState;

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

@@ -1,11 +0,0 @@
-import type { CardSlots, CardState } from './Card.types';
-import type { SlotClassNames } from '@fluentui/react-utilities';
-/**
- * @deprecated Use `cardClassNames.root` instead.
- */
-export declare const cardClassName = "fui-Card";
-export declare const cardClassNames: SlotClassNames<CardSlots>;
-/**
- * Apply styling to the Card slots based on the state
- */
-export declare const useCardStyles_unstable: (state: CardState) => CardState;

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

@@ -1,6 +0,0 @@
-import type { CardFooterProps } from './CardFooter.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * Component to render Button actions in a Card component.
- */
-export declare const CardFooter: ForwardRefComponent<CardFooterProps>;

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

@@ -1,13 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardFooterSlots = {
-    root: Slot<'div'>;
-    action?: Slot<'div'>;
-};
-/**
- * CardFooter props
- */
-export declare type CardFooterProps = ComponentProps<CardFooterSlots>;
-/**
- * State used in rendering CardFooter
- */
-export declare type CardFooterState = ComponentState<CardFooterSlots>;

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

@@ -1,5 +0,0 @@
-export * from './CardFooter';
-export * from './CardFooter.types';
-export * from './renderCardFooter';
-export * from './useCardFooter';
-export * from './useCardFooterStyles';

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

@@ -1,5 +0,0 @@
-import type { CardFooterState } from './CardFooter.types';
-/**
- * Render the final JSX of CardFooter
- */
-export declare const renderCardFooter_unstable: (state: CardFooterState) => JSX.Element;

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

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardFooterProps, CardFooterState } from './CardFooter.types';
-/**
- * Create the state required to render CardFooter.
- *
- * The returned state can be modified with hooks such as useCardFooterStyles_unstable,
- * before being passed to renderCardFooter_unstable.
- *
- * @param props - props from this instance of CardFooter
- * @param ref - reference to root HTMLElement of CardFooter
- */
-export declare const useCardFooter_unstable: (props: CardFooterProps, ref: React.Ref<HTMLElement>) => CardFooterState;

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

@@ -1,11 +0,0 @@
-import type { SlotClassNames } from '@fluentui/react-utilities';
-import type { CardFooterSlots, CardFooterState } from './CardFooter.types';
-/**
- * @deprecated Use `cardFooterClassNames.root` instead.
- */
-export declare const cardFooterClassName = "fui-CardFooter";
-export declare const cardFooterClassNames: SlotClassNames<CardFooterSlots>;
-/**
- * Apply styling to the CardFooter slots based on the state
- */
-export declare const useCardFooterStyles_unstable: (state: CardFooterState) => CardFooterState;

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

@@ -1,6 +0,0 @@
-import type { CardHeaderProps } from './CardHeader.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * Component to render an image, text and an action in a Card component.
- */
-export declare const CardHeader: ForwardRefComponent<CardHeaderProps>;

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

@@ -1,17 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardHeaderSlots = {
-    root: Slot<'div'>;
-    image: Slot<'div'>;
-    content?: Slot<'div'>;
-    header: Slot<'span'>;
-    description: Slot<'span'>;
-    action?: Slot<'div'>;
-};
-/**
- * CardHeader props
- */
-export declare type CardHeaderProps = ComponentProps<Partial<CardHeaderSlots>>;
-/**
- * State used in rendering CardHeader
- */
-export declare type CardHeaderState = ComponentState<CardHeaderSlots>;

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

@@ -1,5 +0,0 @@
-export * from './CardHeader';
-export * from './CardHeader.types';
-export * from './renderCardHeader';
-export * from './useCardHeader';
-export * from './useCardHeaderStyles';

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

@@ -1,5 +0,0 @@
-import type { CardHeaderState } from './CardHeader.types';
-/**
- * Render the final JSX of CardHeader
- */
-export declare const renderCardHeader_unstable: (state: CardHeaderState) => JSX.Element;

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

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardHeaderProps, CardHeaderState } from './CardHeader.types';
-/**
- * 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
- */
-export declare const useCardHeader_unstable: (props: CardHeaderProps, ref: React.Ref<HTMLElement>) => CardHeaderState;

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

@@ -1,11 +0,0 @@
-import type { SlotClassNames } from '@fluentui/react-utilities';
-import type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';
-/**
- * @deprecated Use `cardHeaderClassNames.root` instead.
- */
-export declare const cardHeaderClassName = "fui-CardHeader";
-export declare const cardHeaderClassNames: SlotClassNames<CardHeaderSlots>;
-/**
- * Apply styling to the CardHeader slots based on the state
- */
-export declare const useCardHeaderStyles_unstable: (state: CardHeaderState) => CardHeaderState;

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

@@ -1,6 +0,0 @@
-import type { CardPreviewProps } from './CardPreview.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * Component to render image previews of documents or articles in a Card component.
- */
-export declare const CardPreview: ForwardRefComponent<CardPreviewProps>;

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

@@ -1,13 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardPreviewSlots = {
-    root: Slot<'div'>;
-    logo?: Slot<'div'>;
-};
-/**
- * CardPreview props
- */
-export declare type CardPreviewProps = ComponentProps<CardPreviewSlots>;
-/**
- * State used in rendering CardPreview
- */
-export declare type CardPreviewState = ComponentState<CardPreviewSlots>;

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

@@ -1,5 +0,0 @@
-export * from './CardPreview';
-export * from './CardPreview.types';
-export * from './renderCardPreview';
-export * from './useCardPreview';
-export * from './useCardPreviewStyles';

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

@@ -1,5 +0,0 @@
-import type { CardPreviewState } from './CardPreview.types';
-/**
- * Render the final JSX of CardPreview
- */
-export declare const renderCardPreview_unstable: (state: CardPreviewState) => JSX.Element;

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

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardPreviewProps, CardPreviewState } from './CardPreview.types';
-/**
- * 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
- */
-export declare const useCardPreview_unstable: (props: CardPreviewProps, ref: React.Ref<HTMLElement>) => CardPreviewState;

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

@@ -1,11 +0,0 @@
-import type { SlotClassNames } from '@fluentui/react-utilities';
-import type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';
-/**
- * @deprecated Use `cardPreviewClassNames.root` instead.
- */
-export declare const cardPreviewClassName = "fui-CardPreview";
-export declare const cardPreviewClassNames: SlotClassNames<CardPreviewSlots>;
-/**
- * Apply styling to the CardPreview slots based on the state
- */
-export declare const useCardPreviewStyles_unstable: (state: CardPreviewState) => CardPreviewState;

package/lib/index.d.ts

@@ -1,8 +0,0 @@
-export { Card, cardClassName, cardClassNames, renderCard_unstable, useCardStyles_unstable, useCard_unstable, } from './Card';
-export type { CardCommons, CardProps, CardSlots, CardState } from './Card';
-export { CardFooter, cardFooterClassName, cardFooterClassNames, renderCardFooter_unstable, useCardFooterStyles_unstable, useCardFooter_unstable, } from './CardFooter';
-export type { CardFooterProps, CardFooterSlots, CardFooterState } from './CardFooter';
-export { CardHeader, cardHeaderClassName, cardHeaderClassNames, renderCardHeader_unstable, useCardHeaderStyles_unstable, useCardHeader_unstable, } from './CardHeader';
-export type { CardHeaderProps, CardHeaderSlots, CardHeaderState } from './CardHeader';
-export { CardPreview, cardPreviewClassName, cardPreviewClassNames, renderCardPreview_unstable, useCardPreviewStyles_unstable, useCardPreview_unstable, } from './CardPreview';
-export type { CardPreviewProps, CardPreviewSlots, CardPreviewState } from './CardPreview';

package/lib-commonjs/Card.d.ts

@@ -1 +0,0 @@
-export * from './components/Card/index';

package/lib-commonjs/CardFooter.d.ts

@@ -1 +0,0 @@
-export * from './components/CardFooter/index';

package/lib-commonjs/CardHeader.d.ts

@@ -1 +0,0 @@
-export * from './components/CardHeader/index';

package/lib-commonjs/CardPreview.d.ts

@@ -1 +0,0 @@
-export * from './components/CardPreview/index';

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

@@ -1,6 +0,0 @@
-import type { CardProps } from './Card.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * A card provides scaffolding for hosting actions and content for a single topic.
- */
-export declare const Card: ForwardRefComponent<CardProps>;

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

@@ -1,15 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardSlots = {
-    root: Slot<'div'>;
-};
-export declare type CardCommons = {
-    appearance: 'filled' | 'filled-alternative' | 'outline' | 'subtle';
-};
-/**
- * Card Props
- */
-export declare type CardProps = ComponentProps<CardSlots> & Partial<CardCommons>;
-/**
- * State used in rendering Card
- */
-export declare type CardState = ComponentState<CardSlots> & CardCommons;

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

@@ -1,5 +0,0 @@
-export * from './Card';
-export * from './Card.types';
-export * from './renderCard';
-export * from './useCard';
-export * from './useCardStyles';

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

@@ -1,5 +0,0 @@
-import type { CardState } from './Card.types';
-/**
- * Render the final JSX of Card
- */
-export declare const renderCard_unstable: (state: CardState) => JSX.Element;

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

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardProps, CardState } from './Card.types';
-/**
- * Create the state required to render Card.
- *
- * The returned state can be modified with hooks such as useCardStyles_unstable,
- * before being passed to renderCard_unstable.
- *
- * @param props - props from this instance of Card
- * @param ref - reference to root HTMLElement of Card
- */
-export declare const useCard_unstable: (props: CardProps, ref: React.Ref<HTMLElement>) => CardState;

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

@@ -1,11 +0,0 @@
-import type { CardSlots, CardState } from './Card.types';
-import type { SlotClassNames } from '@fluentui/react-utilities';
-/**
- * @deprecated Use `cardClassNames.root` instead.
- */
-export declare const cardClassName = "fui-Card";
-export declare const cardClassNames: SlotClassNames<CardSlots>;
-/**
- * Apply styling to the Card slots based on the state
- */
-export declare const useCardStyles_unstable: (state: CardState) => CardState;

package/lib-commonjs/components/CardFooter/CardFooter.d.ts

@@ -1,6 +0,0 @@
-import type { CardFooterProps } from './CardFooter.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * Component to render Button actions in a Card component.
- */
-export declare const CardFooter: ForwardRefComponent<CardFooterProps>;

package/lib-commonjs/components/CardFooter/CardFooter.types.d.ts

@@ -1,13 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardFooterSlots = {
-    root: Slot<'div'>;
-    action?: Slot<'div'>;
-};
-/**
- * CardFooter props
- */
-export declare type CardFooterProps = ComponentProps<CardFooterSlots>;
-/**
- * State used in rendering CardFooter
- */
-export declare type CardFooterState = ComponentState<CardFooterSlots>;

package/lib-commonjs/components/CardFooter/index.d.ts

@@ -1,5 +0,0 @@
-export * from './CardFooter';
-export * from './CardFooter.types';
-export * from './renderCardFooter';
-export * from './useCardFooter';
-export * from './useCardFooterStyles';

package/lib-commonjs/components/CardFooter/renderCardFooter.d.ts

@@ -1,5 +0,0 @@
-import type { CardFooterState } from './CardFooter.types';
-/**
- * Render the final JSX of CardFooter
- */
-export declare const renderCardFooter_unstable: (state: CardFooterState) => JSX.Element;

package/lib-commonjs/components/CardFooter/useCardFooter.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { CardFooterProps, CardFooterState } from './CardFooter.types';
-/**
- * Create the state required to render CardFooter.
- *
- * The returned state can be modified with hooks such as useCardFooterStyles_unstable,
- * before being passed to renderCardFooter_unstable.
- *
- * @param props - props from this instance of CardFooter
- * @param ref - reference to root HTMLElement of CardFooter
- */
-export declare const useCardFooter_unstable: (props: CardFooterProps, ref: React.Ref<HTMLElement>) => CardFooterState;

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

@@ -1,11 +0,0 @@
-import type { SlotClassNames } from '@fluentui/react-utilities';
-import type { CardFooterSlots, CardFooterState } from './CardFooter.types';
-/**
- * @deprecated Use `cardFooterClassNames.root` instead.
- */
-export declare const cardFooterClassName = "fui-CardFooter";
-export declare const cardFooterClassNames: SlotClassNames<CardFooterSlots>;
-/**
- * Apply styling to the CardFooter slots based on the state
- */
-export declare const useCardFooterStyles_unstable: (state: CardFooterState) => CardFooterState;

package/lib-commonjs/components/CardHeader/CardHeader.d.ts

@@ -1,6 +0,0 @@
-import type { CardHeaderProps } from './CardHeader.types';
-import type { ForwardRefComponent } from '@fluentui/react-utilities';
-/**
- * Component to render an image, text and an action in a Card component.
- */
-export declare const CardHeader: ForwardRefComponent<CardHeaderProps>;

package/lib-commonjs/components/CardHeader/CardHeader.types.d.ts

@@ -1,17 +0,0 @@
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type CardHeaderSlots = {
-    root: Slot<'div'>;
-    image: Slot<'div'>;
-    content?: Slot<'div'>;
-    header: Slot<'span'>;
-    description: Slot<'span'>;
-    action?: Slot<'div'>;
-};
-/**
- * CardHeader props
- */
-export declare type CardHeaderProps = ComponentProps<Partial<CardHeaderSlots>>;
-/**
- * State used in rendering CardHeader
- */
-export declare type CardHeaderState = ComponentState<CardHeaderSlots>;

package/lib-commonjs/components/CardHeader/index.d.ts

@@ -1,5 +0,0 @@
-export * from './CardHeader';
-export * from './CardHeader.types';
-export * from './renderCardHeader';
-export * from './useCardHeader';
-export * from './useCardHeaderStyles';