@fluentui/react-card 9.0.0-beta.2 → 9.0.0-beta.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +359 -1
- package/CHANGELOG.md +77 -2
- package/README.md +3 -1
- package/Spec.md +523 -0
- package/assets/Card.png +0 -0
- package/assets/CardHeader.png +0 -0
- package/assets/CardPreview.png +0 -0
- package/assets/context-interaction-keyboard.png +0 -0
- package/assets/context-interaction-mouse.png +0 -0
- package/assets/context-narrator.png +0 -0
- package/assets/disabled-narrator.png +0 -0
- package/assets/disabled.png +0 -0
- package/assets/interactive-interaction-keyboard.png +0 -0
- package/assets/interactive-interaction-mouse.png +0 -0
- package/assets/interactive-narrator.png +0 -0
- package/assets/non-interactive-interaction-keyboard.png +0 -0
- package/assets/non-interactive-interaction-mouse.png +0 -0
- package/assets/non-interactive-narrator.png +0 -0
- package/assets/non-interactive-selectable-interaction-keyboard.png +0 -0
- package/assets/non-interactive-selectable-interaction-mouse.png +0 -0
- package/assets/selectable-interaction-keyboard.png +0 -0
- package/assets/selectable-interaction-mouse.png +0 -0
- package/assets/selectable-narrator.png +0 -0
- package/dist/react-card.d.ts +43 -49
- package/lib/components/Card/Card.d.ts +1 -1
- package/lib/components/Card/Card.js +8 -8
- package/lib/components/Card/Card.js.map +1 -1
- package/lib/components/Card/Card.types.d.ts +4 -5
- package/lib/components/Card/renderCard.d.ts +1 -1
- package/lib/components/Card/renderCard.js +7 -7
- package/lib/components/Card/renderCard.js.map +1 -1
- package/lib/components/Card/useCard.d.ts +3 -3
- package/lib/components/Card/useCard.js +12 -11
- package/lib/components/Card/useCard.js.map +1 -1
- package/lib/components/Card/useCardStyles.d.ts +2 -1
- package/lib/components/Card/useCardStyles.js +21 -13
- package/lib/components/Card/useCardStyles.js.map +1 -1
- package/lib/components/CardFooter/CardFooter.js +7 -7
- package/lib/components/CardFooter/CardFooter.js.map +1 -1
- package/lib/components/CardFooter/CardFooter.types.d.ts +3 -3
- package/lib/components/CardFooter/renderCardFooter.d.ts +1 -1
- package/lib/components/CardFooter/renderCardFooter.js +8 -8
- package/lib/components/CardFooter/renderCardFooter.js.map +1 -1
- package/lib/components/CardFooter/useCardFooter.d.ts +4 -8
- package/lib/components/CardFooter/useCardFooter.js +10 -13
- package/lib/components/CardFooter/useCardFooter.js.map +1 -1
- package/lib/components/CardFooter/useCardFooterStyles.d.ts +2 -1
- package/lib/components/CardFooter/useCardFooterStyles.js +9 -7
- package/lib/components/CardFooter/useCardFooterStyles.js.map +1 -1
- package/lib/components/CardHeader/CardHeader.js +7 -7
- package/lib/components/CardHeader/CardHeader.js.map +1 -1
- package/lib/components/CardHeader/CardHeader.types.d.ts +8 -8
- package/lib/components/CardHeader/renderCardHeader.d.ts +1 -1
- package/lib/components/CardHeader/renderCardHeader.js +12 -8
- package/lib/components/CardHeader/renderCardHeader.js.map +1 -1
- package/lib/components/CardHeader/useCardHeader.d.ts +4 -5
- package/lib/components/CardHeader/useCardHeader.js +14 -13
- package/lib/components/CardHeader/useCardHeader.js.map +1 -1
- package/lib/components/CardHeader/useCardHeaderStyles.d.ts +2 -1
- package/lib/components/CardHeader/useCardHeaderStyles.js +9 -7
- package/lib/components/CardHeader/useCardHeaderStyles.js.map +1 -1
- package/lib/components/CardPreview/CardPreview.js +7 -7
- package/lib/components/CardPreview/CardPreview.js.map +1 -1
- package/lib/components/CardPreview/CardPreview.types.d.ts +3 -3
- package/lib/components/CardPreview/renderCardPreview.d.ts +1 -1
- package/lib/components/CardPreview/renderCardPreview.js +8 -8
- package/lib/components/CardPreview/renderCardPreview.js.map +1 -1
- package/lib/components/CardPreview/useCardPreview.d.ts +4 -8
- package/lib/components/CardPreview/useCardPreview.js +10 -13
- package/lib/components/CardPreview/useCardPreview.js.map +1 -1
- package/lib/components/CardPreview/useCardPreviewStyles.d.ts +2 -1
- package/lib/components/CardPreview/useCardPreviewStyles.js +6 -5
- package/lib/components/CardPreview/useCardPreviewStyles.js.map +1 -1
- package/lib-commonjs/Card.js +1 -1
- package/lib-commonjs/CardFooter.js +1 -1
- package/lib-commonjs/CardHeader.js +1 -1
- package/lib-commonjs/CardPreview.js +1 -1
- package/lib-commonjs/components/Card/Card.d.ts +1 -1
- package/lib-commonjs/components/Card/Card.js +9 -9
- package/lib-commonjs/components/Card/Card.js.map +1 -1
- package/lib-commonjs/components/Card/Card.types.d.ts +4 -5
- package/lib-commonjs/components/Card/index.js +1 -1
- package/lib-commonjs/components/Card/renderCard.d.ts +1 -1
- package/lib-commonjs/components/Card/renderCard.js +11 -12
- package/lib-commonjs/components/Card/renderCard.js.map +1 -1
- package/lib-commonjs/components/Card/useCard.d.ts +3 -3
- package/lib-commonjs/components/Card/useCard.js +15 -15
- package/lib-commonjs/components/Card/useCard.js.map +1 -1
- package/lib-commonjs/components/Card/useCardStyles.d.ts +2 -1
- package/lib-commonjs/components/Card/useCardStyles.js +26 -16
- package/lib-commonjs/components/Card/useCardStyles.js.map +1 -1
- package/lib-commonjs/components/CardFooter/CardFooter.js +8 -8
- package/lib-commonjs/components/CardFooter/CardFooter.js.map +1 -1
- package/lib-commonjs/components/CardFooter/CardFooter.types.d.ts +3 -3
- package/lib-commonjs/components/CardFooter/index.js +1 -1
- package/lib-commonjs/components/CardFooter/renderCardFooter.d.ts +1 -1
- package/lib-commonjs/components/CardFooter/renderCardFooter.js +12 -14
- package/lib-commonjs/components/CardFooter/renderCardFooter.js.map +1 -1
- package/lib-commonjs/components/CardFooter/useCardFooter.d.ts +4 -8
- package/lib-commonjs/components/CardFooter/useCardFooter.js +14 -18
- package/lib-commonjs/components/CardFooter/useCardFooter.js.map +1 -1
- package/lib-commonjs/components/CardFooter/useCardFooterStyles.d.ts +2 -1
- package/lib-commonjs/components/CardFooter/useCardFooterStyles.js +13 -11
- package/lib-commonjs/components/CardFooter/useCardFooterStyles.js.map +1 -1
- package/lib-commonjs/components/CardHeader/CardHeader.js +8 -8
- package/lib-commonjs/components/CardHeader/CardHeader.js.map +1 -1
- package/lib-commonjs/components/CardHeader/CardHeader.types.d.ts +8 -8
- package/lib-commonjs/components/CardHeader/index.js +1 -1
- package/lib-commonjs/components/CardHeader/renderCardHeader.d.ts +1 -1
- package/lib-commonjs/components/CardHeader/renderCardHeader.js +16 -14
- package/lib-commonjs/components/CardHeader/renderCardHeader.js.map +1 -1
- package/lib-commonjs/components/CardHeader/useCardHeader.d.ts +4 -5
- package/lib-commonjs/components/CardHeader/useCardHeader.js +19 -19
- package/lib-commonjs/components/CardHeader/useCardHeader.js.map +1 -1
- package/lib-commonjs/components/CardHeader/useCardHeaderStyles.d.ts +2 -1
- package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js +14 -12
- package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/CardPreview/CardPreview.js +8 -8
- package/lib-commonjs/components/CardPreview/CardPreview.js.map +1 -1
- package/lib-commonjs/components/CardPreview/CardPreview.types.d.ts +3 -3
- package/lib-commonjs/components/CardPreview/index.js +1 -1
- package/lib-commonjs/components/CardPreview/renderCardPreview.d.ts +1 -1
- package/lib-commonjs/components/CardPreview/renderCardPreview.js +12 -14
- package/lib-commonjs/components/CardPreview/renderCardPreview.js.map +1 -1
- package/lib-commonjs/components/CardPreview/useCardPreview.d.ts +4 -8
- package/lib-commonjs/components/CardPreview/useCardPreview.js +14 -18
- package/lib-commonjs/components/CardPreview/useCardPreview.js.map +1 -1
- package/lib-commonjs/components/CardPreview/useCardPreviewStyles.d.ts +2 -1
- package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js +10 -9
- package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js.map +1 -1
- package/lib-commonjs/index.js +1 -1
- package/package.json +11 -13
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -11
- package/lib/common/isConformant.js.map +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -22
- package/lib-commonjs/common/isConformant.js.map +0 -1
@@ -1,28 +1,30 @@
|
|
1
|
-
import { __styles, mergeClasses } from '@
|
1
|
+
import { __styles, mergeClasses, shorthands } from '@griffel/react';
|
2
|
+
export const cardFooterClassName = 'fui-CardFooter';
|
2
3
|
/**
|
3
4
|
* Styles for the root slot
|
4
5
|
*/
|
5
6
|
|
6
|
-
|
7
|
+
const useStyles = /*#__PURE__*/__styles({
|
7
8
|
"root": {
|
8
9
|
"mc9l5x": "f22iagw",
|
9
10
|
"Beiy3e4": "f1063pyq",
|
10
|
-
"
|
11
|
+
"i8kkvl": "f4akndk",
|
12
|
+
"Belr9w4": "fe5j3v"
|
11
13
|
},
|
12
14
|
"action": {
|
13
15
|
"Frg6f3": ["fcgxt0o", "f1ujusj6"]
|
14
16
|
}
|
15
17
|
}, {
|
16
|
-
"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;}", ".
|
18
|
+
"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;}"]
|
17
19
|
});
|
18
20
|
/**
|
19
21
|
* Apply styling to the CardFooter slots based on the state
|
20
22
|
*/
|
21
23
|
|
22
24
|
|
23
|
-
export
|
24
|
-
|
25
|
-
state.root.className = mergeClasses(styles.root, state.root.className);
|
25
|
+
export const useCardFooterStyles_unstable = state => {
|
26
|
+
const styles = useStyles();
|
27
|
+
state.root.className = mergeClasses(cardFooterClassName, styles.root, state.root.className);
|
26
28
|
|
27
29
|
if (state.action) {
|
28
30
|
state.action.className = mergeClasses(styles.action, state.action.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardFooter/useCardFooterStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,
|
1
|
+
{"version":3,"sources":["../../../src/components/CardFooter/useCardFooterStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;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,4BAA4B,GAAI,KAAD,IAA4C;AACtF,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":""}
|
@@ -1,15 +1,15 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import {
|
2
|
+
import { useCardHeader_unstable } from './useCardHeader';
|
3
|
+
import { renderCardHeader_unstable } from './renderCardHeader';
|
4
|
+
import { useCardHeaderStyles_unstable } from './useCardHeaderStyles';
|
5
5
|
/**
|
6
6
|
* Component to render an image, text and an action in a Card component.
|
7
7
|
*/
|
8
8
|
|
9
|
-
export
|
10
|
-
|
11
|
-
|
12
|
-
return
|
9
|
+
export const CardHeader = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
|
+
const state = useCardHeader_unstable(props, ref);
|
11
|
+
useCardHeaderStyles_unstable(state);
|
12
|
+
return renderCardHeader_unstable(state);
|
13
13
|
});
|
14
14
|
CardHeader.displayName = 'CardHeader';
|
15
15
|
//# sourceMappingURL=CardHeader.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardHeader/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["../../../src/components/CardHeader/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AAIA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,sBAAsB,CAAC,KAAD,EAAQ,GAAR,CAApC;AAEA,EAAA,4BAA4B,CAAC,KAAD,CAA5B;AACA,SAAO,yBAAyB,CAAC,KAAD,CAAhC;AACD,CAL+D,CAAzD;AAOP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourceRoot":""}
|
@@ -1,16 +1,16 @@
|
|
1
|
-
import type { ComponentProps, ComponentState,
|
1
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
2
2
|
export declare type CardHeaderSlots = {
|
3
|
-
root:
|
4
|
-
image:
|
5
|
-
content?:
|
6
|
-
header:
|
7
|
-
description:
|
8
|
-
action?:
|
3
|
+
root: Slot<'div'>;
|
4
|
+
image: Slot<'div'>;
|
5
|
+
content?: Slot<'div'>;
|
6
|
+
header: Slot<'span'>;
|
7
|
+
description: Slot<'span'>;
|
8
|
+
action?: Slot<'div'>;
|
9
9
|
};
|
10
10
|
/**
|
11
11
|
* CardHeader props
|
12
12
|
*/
|
13
|
-
export declare type CardHeaderProps = ComponentProps<CardHeaderSlots
|
13
|
+
export declare type CardHeaderProps = ComponentProps<Partial<CardHeaderSlots>>;
|
14
14
|
/**
|
15
15
|
* State used in rendering CardHeader
|
16
16
|
*/
|
@@ -2,4 +2,4 @@ import type { CardHeaderState } from './CardHeader.types';
|
|
2
2
|
/**
|
3
3
|
* Render the final JSX of CardHeader
|
4
4
|
*/
|
5
|
-
export declare const
|
5
|
+
export declare const renderCardHeader_unstable: (state: CardHeaderState) => JSX.Element;
|
@@ -1,16 +1,20 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { getSlots } from '@fluentui/react-utilities';
|
4
|
-
import { cardHeaderShorthandProps } from './useCardHeader';
|
5
3
|
/**
|
6
4
|
* Render the final JSX of CardHeader
|
7
5
|
*/
|
8
6
|
|
9
|
-
export
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
7
|
+
export const renderCardHeader_unstable = state => {
|
8
|
+
const {
|
9
|
+
slots,
|
10
|
+
slotProps
|
11
|
+
} = getSlots(state);
|
12
|
+
return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
|
13
|
+
}, /*#__PURE__*/React.createElement(slots.image, { ...slotProps.image
|
14
|
+
}), slots.content && /*#__PURE__*/React.createElement(slots.content, { ...slotProps.content
|
15
|
+
}, /*#__PURE__*/React.createElement(slots.header, { ...slotProps.header
|
16
|
+
}), /*#__PURE__*/React.createElement(slots.description, { ...slotProps.description
|
17
|
+
})), slots.action && /*#__PURE__*/React.createElement(slots.action, { ...slotProps.action
|
18
|
+
}));
|
15
19
|
};
|
16
20
|
//# sourceMappingURL=renderCardHeader.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardHeader/renderCardHeader.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardHeader/renderCardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,yBAAyB,GAAI,KAAD,IAA2B;AAClE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAkB,KAAlB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;AAAf,GAAZ,CADF,EAEG,KAAK,CAAC,OAAN,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;AAAf,GAAd,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,EAAA,GAAK,SAAS,CAAC;AAAf,GAAb,CADF,eAEE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,WAAP,EAAkB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAlB,CAFF,CAHJ,EAQG,KAAK,CAAC,MAAN,iBAAgB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,MAAP,EAAa,EAAA,GAAK,SAAS,CAAC;AAAf,GAAb,CARnB,CADF;AAYD,CAfM","sourceRoot":""}
|
@@ -1,13 +1,12 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import type { CardHeaderProps,
|
3
|
-
export declare const cardHeaderShorthandProps: Array<keyof CardHeaderSlots>;
|
2
|
+
import type { CardHeaderProps, CardHeaderState } from './CardHeader.types';
|
4
3
|
/**
|
5
4
|
* Create the state required to render CardHeader.
|
6
5
|
*
|
7
|
-
* The returned state can be modified with hooks such as
|
8
|
-
* before being passed to
|
6
|
+
* The returned state can be modified with hooks such as useCardHeaderStyles_unstable,
|
7
|
+
* before being passed to renderCardHeader_unstable.
|
9
8
|
*
|
10
9
|
* @param props - props from this instance of CardHeader
|
11
10
|
* @param ref - reference to root HTMLElement of CardHeader
|
12
11
|
*/
|
13
|
-
export declare const
|
12
|
+
export declare const useCardHeader_unstable: (props: CardHeaderProps, ref: React.Ref<HTMLElement>) => CardHeaderState;
|
@@ -1,23 +1,23 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
|
4
|
-
export var cardHeaderShorthandProps = ['root', 'image', 'content', 'header', 'description', 'action'];
|
5
3
|
/**
|
6
4
|
* Create the state required to render CardHeader.
|
7
5
|
*
|
8
|
-
* The returned state can be modified with hooks such as
|
9
|
-
* before being passed to
|
6
|
+
* The returned state can be modified with hooks such as useCardHeaderStyles_unstable,
|
7
|
+
* before being passed to renderCardHeader_unstable.
|
10
8
|
*
|
11
9
|
* @param props - props from this instance of CardHeader
|
12
10
|
* @param ref - reference to root HTMLElement of CardHeader
|
13
11
|
*/
|
14
12
|
|
15
|
-
export
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
13
|
+
export const useCardHeader_unstable = (props, ref) => {
|
14
|
+
const {
|
15
|
+
image,
|
16
|
+
content,
|
17
|
+
header,
|
18
|
+
description,
|
19
|
+
action
|
20
|
+
} = props;
|
21
21
|
return {
|
22
22
|
components: {
|
23
23
|
root: 'div',
|
@@ -27,9 +27,10 @@ export var useCardHeader = function (props, ref) {
|
|
27
27
|
description: React.Fragment,
|
28
28
|
action: 'div'
|
29
29
|
},
|
30
|
-
root: getNativeElementProps('div',
|
31
|
-
ref
|
32
|
-
|
30
|
+
root: getNativeElementProps('div', {
|
31
|
+
ref,
|
32
|
+
...props
|
33
|
+
}),
|
33
34
|
image: resolveShorthand(image, {
|
34
35
|
required: true
|
35
36
|
}),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardHeader/useCardHeader.ts"],"names":[],"mappings":"
|
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;;;;;;;;AAQG;;AACH,OAAO,MAAM,sBAAsB,GAAG,CAAC,KAAD,EAAyB,GAAzB,KAAyE;AAC7G,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":""}
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import type { CardHeaderState } from './CardHeader.types';
|
2
|
+
export declare const cardHeaderClassName = "fui-CardHeader";
|
2
3
|
/**
|
3
4
|
* Apply styling to the CardHeader slots based on the state
|
4
5
|
*/
|
5
|
-
export declare const
|
6
|
+
export declare const useCardHeaderStyles_unstable: (state: CardHeaderState) => CardHeaderState;
|
@@ -1,14 +1,16 @@
|
|
1
|
-
import { __styles, mergeClasses } from '@
|
1
|
+
import { __styles, mergeClasses, shorthands } from '@griffel/react';
|
2
|
+
export const cardHeaderClassName = 'fui-CardHeader';
|
2
3
|
/**
|
3
4
|
* Styles for the root slot
|
4
5
|
*/
|
5
6
|
|
6
|
-
|
7
|
+
const useStyles = /*#__PURE__*/__styles({
|
7
8
|
"root": {
|
8
9
|
"mc9l5x": "f22iagw",
|
9
10
|
"Beiy3e4": "f1063pyq",
|
10
11
|
"Bt984gj": "f122n59",
|
11
|
-
"
|
12
|
+
"i8kkvl": "f4akndk",
|
13
|
+
"Belr9w4": "fe5j3v",
|
12
14
|
"Bqenvij": "f1d2rq10"
|
13
15
|
},
|
14
16
|
"image": {
|
@@ -31,16 +33,16 @@ var useStyles = /*#__PURE__*/__styles({
|
|
31
33
|
"Bn3e79g": "f1con4nn"
|
32
34
|
}
|
33
35
|
}, {
|
34
|
-
"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;}", ".
|
36
|
+
"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%;}"]
|
35
37
|
});
|
36
38
|
/**
|
37
39
|
* Apply styling to the CardHeader slots based on the state
|
38
40
|
*/
|
39
41
|
|
40
42
|
|
41
|
-
export
|
42
|
-
|
43
|
-
state.root.className = mergeClasses(styles.root, state.root.className);
|
43
|
+
export const useCardHeaderStyles_unstable = state => {
|
44
|
+
const styles = useStyles();
|
45
|
+
state.root.className = mergeClasses(cardHeaderClassName, styles.root, state.root.className);
|
44
46
|
|
45
47
|
if (state.image) {
|
46
48
|
state.image.className = mergeClasses(styles.image, state.image.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,
|
1
|
+
{"version":3,"sources":["../../../src/components/CardHeader/useCardHeaderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,EAAmC,UAAnC,QAAqD,gBAArD;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,4BAA4B,GAAI,KAAD,IAA4C;AACtF,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":""}
|
@@ -1,15 +1,15 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import {
|
2
|
+
import { useCardPreview_unstable } from './useCardPreview';
|
3
|
+
import { renderCardPreview_unstable } from './renderCardPreview';
|
4
|
+
import { useCardPreviewStyles_unstable } from './useCardPreviewStyles';
|
5
5
|
/**
|
6
6
|
* Component to render image previews of documents or articles in a Card component.
|
7
7
|
*/
|
8
8
|
|
9
|
-
export
|
10
|
-
|
11
|
-
|
12
|
-
return
|
9
|
+
export const CardPreview = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
|
+
const state = useCardPreview_unstable(props, ref);
|
11
|
+
useCardPreviewStyles_unstable(state);
|
12
|
+
return renderCardPreview_unstable(state);
|
13
13
|
});
|
14
14
|
CardPreview.displayName = 'CardPreview';
|
15
15
|
//# sourceMappingURL=CardPreview.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardPreview/CardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["../../../src/components/CardPreview/CardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,uBAAT,QAAwC,kBAAxC;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AAIA;;AAEG;;AACH,OAAO,MAAM,WAAW,gBAA0C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,uBAAuB,CAAC,KAAD,EAAQ,GAAR,CAArC;AAEA,EAAA,6BAA6B,CAAC,KAAD,CAA7B;AACA,SAAO,0BAA0B,CAAC,KAAD,CAAjC;AACD,CALiE,CAA3D;AAOP,WAAW,CAAC,WAAZ,GAA0B,aAA1B","sourceRoot":""}
|
@@ -1,7 +1,7 @@
|
|
1
|
-
import type { ComponentProps, ComponentState,
|
1
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
2
2
|
export declare type CardPreviewSlots = {
|
3
|
-
root:
|
4
|
-
logo?:
|
3
|
+
root: Slot<'div'>;
|
4
|
+
logo?: Slot<'div'>;
|
5
5
|
};
|
6
6
|
/**
|
7
7
|
* CardPreview props
|
@@ -2,4 +2,4 @@ import type { CardPreviewState } from './CardPreview.types';
|
|
2
2
|
/**
|
3
3
|
* Render the final JSX of CardPreview
|
4
4
|
*/
|
5
|
-
export declare const
|
5
|
+
export declare const renderCardPreview_unstable: (state: CardPreviewState) => JSX.Element;
|
@@ -1,16 +1,16 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import * as React from 'react';
|
3
2
|
import { getSlots } from '@fluentui/react-utilities';
|
4
|
-
import { cardPreviewShorthandProps } from './useCardPreview';
|
5
3
|
/**
|
6
4
|
* Render the final JSX of CardPreview
|
7
5
|
*/
|
8
6
|
|
9
|
-
export
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
7
|
+
export const renderCardPreview_unstable = state => {
|
8
|
+
const {
|
9
|
+
slots,
|
10
|
+
slotProps
|
11
|
+
} = getSlots(state);
|
12
|
+
return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
|
13
|
+
}, slotProps.root.children, slots.logo && /*#__PURE__*/React.createElement(slots.logo, { ...slotProps.logo
|
14
|
+
}));
|
15
15
|
};
|
16
16
|
//# sourceMappingURL=renderCardPreview.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardPreview/renderCardPreview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,0BAA0B,GAAI,KAAD,IAA4B;AACpE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAmB,KAAnB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,EAEG,KAAK,CAAC,IAAN,iBAAc,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAFjB,CADF;AAMD,CATM","sourceRoot":""}
|
@@ -1,16 +1,12 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import type { CardPreviewProps,
|
3
|
-
/**
|
4
|
-
* Array of all shorthand properties listed in CardPreviewShorthandProps
|
5
|
-
*/
|
6
|
-
export declare const cardPreviewShorthandProps: Array<keyof CardPreviewSlots>;
|
2
|
+
import type { CardPreviewProps, CardPreviewState } from './CardPreview.types';
|
7
3
|
/**
|
8
4
|
* Create the state required to render CardPreview.
|
9
5
|
*
|
10
|
-
* The returned state can be modified with hooks such as
|
11
|
-
* before being passed to
|
6
|
+
* The returned state can be modified with hooks such as useCardPreviewStyles_unstable,
|
7
|
+
* before being passed to renderCardPreview_unstable.
|
12
8
|
*
|
13
9
|
* @param props - props from this instance of CardPreview
|
14
10
|
* @param ref - reference to root HTMLElement of CardPreview
|
15
11
|
*/
|
16
|
-
export declare const
|
12
|
+
export declare const useCardPreview_unstable: (props: CardPreviewProps, ref: React.Ref<HTMLElement>) => CardPreviewState;
|
@@ -1,30 +1,27 @@
|
|
1
|
-
import { __assign } from "tslib";
|
2
1
|
import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
|
3
|
-
/**
|
4
|
-
* Array of all shorthand properties listed in CardPreviewShorthandProps
|
5
|
-
*/
|
6
|
-
|
7
|
-
export var cardPreviewShorthandProps = ['root', 'logo'];
|
8
2
|
/**
|
9
3
|
* Create the state required to render CardPreview.
|
10
4
|
*
|
11
|
-
* The returned state can be modified with hooks such as
|
12
|
-
* before being passed to
|
5
|
+
* The returned state can be modified with hooks such as useCardPreviewStyles_unstable,
|
6
|
+
* before being passed to renderCardPreview_unstable.
|
13
7
|
*
|
14
8
|
* @param props - props from this instance of CardPreview
|
15
9
|
* @param ref - reference to root HTMLElement of CardPreview
|
16
10
|
*/
|
17
11
|
|
18
|
-
export
|
19
|
-
|
12
|
+
export const useCardPreview_unstable = (props, ref) => {
|
13
|
+
const {
|
14
|
+
logo
|
15
|
+
} = props;
|
20
16
|
return {
|
21
17
|
components: {
|
22
18
|
root: 'div',
|
23
19
|
logo: 'div'
|
24
20
|
},
|
25
|
-
root: getNativeElementProps('div',
|
26
|
-
ref
|
27
|
-
|
21
|
+
root: getNativeElementProps('div', {
|
22
|
+
ref,
|
23
|
+
...props
|
24
|
+
}),
|
28
25
|
logo: resolveShorthand(logo)
|
29
26
|
};
|
30
27
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardPreview/useCardPreview.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../../src/components/CardPreview/useCardPreview.ts"],"names":[],"mappings":"AACA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;AAChH,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":""}
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import type { CardPreviewState } from './CardPreview.types';
|
2
|
+
export declare const cardPreviewClassName = "fui-CardPreview";
|
2
3
|
/**
|
3
4
|
* Apply styling to the CardPreview slots based on the state
|
4
5
|
*/
|
5
|
-
export declare const
|
6
|
+
export declare const useCardPreviewStyles_unstable: (state: CardPreviewState) => CardPreviewState;
|
@@ -1,9 +1,10 @@
|
|
1
|
-
import { __styles, mergeClasses } from '@
|
1
|
+
import { shorthands, __styles, mergeClasses } from '@griffel/react';
|
2
|
+
export const cardPreviewClassName = 'fui-CardPreview';
|
2
3
|
/**
|
3
4
|
* Styles for the root slot
|
4
5
|
*/
|
5
6
|
|
6
|
-
|
7
|
+
const useStyles = /*#__PURE__*/__styles({
|
7
8
|
"root": {
|
8
9
|
"qhf8xq": "f10pi13n",
|
9
10
|
"B6of3ja": "f1hu3pq6",
|
@@ -28,9 +29,9 @@ var useStyles = /*#__PURE__*/__styles({
|
|
28
29
|
*/
|
29
30
|
|
30
31
|
|
31
|
-
export
|
32
|
-
|
33
|
-
state.root.className = mergeClasses(
|
32
|
+
export const useCardPreviewStyles_unstable = state => {
|
33
|
+
const styles = useStyles();
|
34
|
+
state.root.className = mergeClasses(cardPreviewClassName, styles.root, state.root.className);
|
34
35
|
|
35
36
|
if (state.logo) {
|
36
37
|
state.logo.className = mergeClasses(styles.logo, state.logo.className);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"sources":["../../../src/components/CardPreview/useCardPreviewStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,gBAArD;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,6BAA6B,GAAI,KAAD,IAA8C;AACzF,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
CHANGED
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
|
7
|
-
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
8
8
|
|
9
9
|
tslib_1.__exportStar(require("./components/Card/index"), exports);
|
10
10
|
//# sourceMappingURL=Card.js.map
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
|
7
|
-
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
8
8
|
|
9
9
|
tslib_1.__exportStar(require("./components/CardFooter/index"), exports);
|
10
10
|
//# sourceMappingURL=CardFooter.js.map
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
|
7
|
-
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
8
8
|
|
9
9
|
tslib_1.__exportStar(require("./components/CardHeader/index"), exports);
|
10
10
|
//# sourceMappingURL=CardHeader.js.map
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
|
7
|
-
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
8
8
|
|
9
9
|
tslib_1.__exportStar(require("./components/CardPreview/index"), exports);
|
10
10
|
//# sourceMappingURL=CardPreview.js.map
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import type { CardProps } from './Card.types';
|
2
2
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
3
3
|
/**
|
4
|
-
*
|
4
|
+
* A card provides scaffolding for hosting actions and content for a single topic.
|
5
5
|
*/
|
6
6
|
export declare const Card: ForwardRefComponent<CardProps>;
|
@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
});
|
6
6
|
exports.Card = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
9
|
|
10
|
-
|
10
|
+
const useCard_1 = /*#__PURE__*/require("./useCard");
|
11
11
|
|
12
|
-
|
12
|
+
const renderCard_1 = /*#__PURE__*/require("./renderCard");
|
13
13
|
|
14
|
-
|
14
|
+
const useCardStyles_1 = /*#__PURE__*/require("./useCardStyles");
|
15
15
|
/**
|
16
|
-
*
|
16
|
+
* A card provides scaffolding for hosting actions and content for a single topic.
|
17
17
|
*/
|
18
18
|
|
19
19
|
|
20
|
-
exports.Card = /*#__PURE__*/React.forwardRef(
|
21
|
-
|
22
|
-
useCardStyles_1.
|
23
|
-
return renderCard_1.
|
20
|
+
exports.Card = /*#__PURE__*/React.forwardRef((props, ref) => {
|
21
|
+
const state = useCard_1.useCard_unstable(props, ref);
|
22
|
+
useCardStyles_1.useCardStyles_unstable(state);
|
23
|
+
return renderCard_1.renderCard_unstable(state);
|
24
24
|
});
|
25
25
|
exports.Card.displayName = 'Card';
|
26
26
|
//# sourceMappingURL=Card.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Card/Card.tsx"],"names":[],"mappings":";;;;;;;AAAA,
|
1
|
+
{"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,gBAAA,CAAiB,KAAjB,EAAwB,GAAxB,CAAd;AAEA,EAAA,eAAA,CAAA,sBAAA,CAAuB,KAAvB;AACA,SAAO,YAAA,CAAA,mBAAA,CAAoB,KAApB,CAAP;AACD,CALmD,CAAvC;AAOb,OAAA,CAAA,IAAA,CAAK,WAAL,GAAmB,MAAnB","sourceRoot":""}
|
@@ -1,13 +1,12 @@
|
|
1
|
-
import type { ComponentProps, ComponentState,
|
1
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
2
2
|
export declare type CardSlots = {
|
3
|
-
root:
|
3
|
+
root: Slot<'div'>;
|
4
4
|
};
|
5
|
-
export declare type CardCommons = {};
|
6
5
|
/**
|
7
6
|
* Card Props
|
8
7
|
*/
|
9
|
-
export declare type CardProps = ComponentProps<CardSlots
|
8
|
+
export declare type CardProps = ComponentProps<CardSlots>;
|
10
9
|
/**
|
11
10
|
* State used in rendering Card
|
12
11
|
*/
|
13
|
-
export declare type CardState = ComponentState<CardSlots
|
12
|
+
export declare type CardState = ComponentState<CardSlots>;
|