@fluentui/react-card 0.0.0-nightly-20240819-2052.1 → 0.0.0-nightly-20240819-2137.1

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.md CHANGED
@@ -1,45 +1,26 @@
1
1
  # Change Log - @fluentui/react-card
2
2
 
3
- This log was last generated on Mon, 19 Aug 2024 20:57:25 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 19 Aug 2024 21:48:22 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20240819-2052.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v0.0.0-nightly-20240819-2052.1)
7
+ ## [0.0.0-nightly-20240819-2137.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v0.0.0-nightly-20240819-2137.1)
8
8
 
9
- Mon, 19 Aug 2024 20:57:25 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.89..@fluentui/react-card_v0.0.0-nightly-20240819-2052.1)
9
+ Mon, 19 Aug 2024 21:48:22 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.87..@fluentui/react-card_v0.0.0-nightly-20240819-2137.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
16
- - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
17
- - Bump @fluentui/react-tabster to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
18
- - Bump @fluentui/react-text to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
19
- - Bump @fluentui/react-theme to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
20
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
21
- - Bump @fluentui/react-button to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
22
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
23
- - Bump @fluentui/react-conformance to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
24
- - Bump @fluentui/react-provider to v0.0.0-nightly-20240819-2052.1 ([commit](https://github.com/microsoft/fluentui/commit/f7885920740849a4ba4aa36957bde7ce8e856a3e) by beachball)
25
-
26
- ## [9.0.89](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.89)
27
-
28
- Tue, 06 Aug 2024 21:40:43 GMT
29
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.88..@fluentui/react-card_v9.0.89)
30
-
31
- ### Patches
32
-
33
- - fix: Card does not override specified focusMode based on event listeners ([PR #32200](https://github.com/microsoft/fluentui/pull/32200) by sarah.higley@microsoft.com)
34
-
35
- ## [9.0.88](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.88)
36
-
37
- Tue, 30 Jul 2024 18:47:32 GMT
38
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.87..@fluentui/react-card_v9.0.88)
39
-
40
- ### Patches
41
-
42
- - fix: improve hover for HC mode ([PR #31953](https://github.com/microsoft/fluentui/pull/31953) by marcosvmmoura@gmail.com)
15
+ - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
16
+ - Bump @fluentui/react-tabster to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
17
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
18
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
19
+ - Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
20
+ - Bump @fluentui/react-provider to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
21
+ - Bump @fluentui/react-button to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
22
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
23
+ - Bump @fluentui/react-conformance to v0.0.0-nightly-20240819-2137.1 ([commit](https://github.com/microsoft/fluentui/commit/58023e0682dfefa133a691f330cc309911710cc7) by beachball)
43
24
 
44
25
  ## [9.0.87](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.87)
45
26
 
@@ -16,7 +16,7 @@ const focusMap = {
16
16
  * and control focus properties based on that.
17
17
  *
18
18
  * @param props - props from this instance of Card
19
- */ const useCardInteractive = ({ focusMode: initialFocusMode, ...props })=>{
19
+ */ const useCardInteractive = ({ focusMode = 'off', ...props })=>{
20
20
  const interactive = [
21
21
  'onClick',
22
22
  'onDoubleClick',
@@ -29,10 +29,8 @@ const focusMap = {
29
29
  'onDragStart',
30
30
  'onDragEnd'
31
31
  ].some((prop)=>props[prop]);
32
- // default focusMode to tab-only when interactive, and off when not
33
- const focusMode = initialFocusMode !== null && initialFocusMode !== void 0 ? initialFocusMode : interactive ? 'no-tab' : 'off';
34
32
  const groupperAttrs = useFocusableGroup({
35
- tabBehavior: focusMap[focusMode]
33
+ tabBehavior: focusMap[interactive ? 'no-tab' : focusMode]
36
34
  });
37
35
  const interactiveFocusAttributes = {
38
36
  ...groupperAttrs,
@@ -40,7 +38,7 @@ const focusMap = {
40
38
  };
41
39
  return {
42
40
  interactive,
43
- focusAttributes: focusMode === 'off' ? null : interactiveFocusAttributes
41
+ focusAttributes: !interactive && focusMode === 'off' ? null : interactiveFocusAttributes
44
42
  };
45
43
  };
46
44
  /**
@@ -1 +1 @@
1
- {"version":3,"sources":["useCard.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusWithin } from '@fluentui/react-tabster';\n\nimport type { CardProps, CardState } from './Card.types';\nimport { useCardSelectable } from './useCardSelectable';\nimport { cardContextDefaultValue } from './CardContext';\n\nconst focusMap = {\n off: undefined,\n 'no-tab': 'limited-trap-focus',\n 'tab-exit': 'limited',\n 'tab-only': 'unlimited',\n} as const;\n\n/**\n * Create the state for interactive cards.\n *\n * This internal hook defines if the card is interactive\n * and control focus properties based on that.\n *\n * @param props - props from this instance of Card\n */\nconst useCardInteractive = ({ focusMode: initialFocusMode, ...props }: CardProps) => {\n const interactive = (\n [\n 'onClick',\n 'onDoubleClick',\n 'onMouseUp',\n 'onMouseDown',\n 'onPointerUp',\n 'onPointerDown',\n 'onTouchStart',\n 'onTouchEnd',\n 'onDragStart',\n 'onDragEnd',\n ] as (keyof React.HTMLAttributes<HTMLElement>)[]\n ).some(prop => props[prop]);\n\n // default focusMode to tab-only when interactive, and off when not\n const focusMode = initialFocusMode ?? (interactive ? 'no-tab' : 'off');\n\n const groupperAttrs = useFocusableGroup({\n tabBehavior: focusMap[focusMode],\n });\n\n const interactiveFocusAttributes = {\n ...groupperAttrs,\n tabIndex: 0,\n };\n\n return {\n interactive,\n focusAttributes: focusMode === 'off' ? null : interactiveFocusAttributes,\n };\n};\n\n/**\n * Create the state required to render Card.\n *\n * The returned state can be modified with hooks such as useCardStyles_unstable,\n * before being passed to renderCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLDivElement>): CardState => {\n const { appearance = 'filled', orientation = 'vertical', size = 'medium' } = props;\n\n const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n\n const cardBaseRef = useFocusWithin<HTMLDivElement>();\n const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } =\n useCardSelectable(props, { referenceId, referenceLabel }, cardBaseRef);\n\n const cardRef = useMergedRefs(cardBaseRef, ref);\n\n const { interactive, focusAttributes } = useCardInteractive(props);\n\n return {\n appearance,\n orientation,\n size,\n interactive,\n selectable,\n selectFocused,\n selected,\n selectableA11yProps: {\n setReferenceId,\n referenceId,\n referenceLabel,\n setReferenceLabel,\n },\n\n components: {\n root: 'div',\n floatingAction: 'div',\n checkbox: 'input',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: cardRef,\n role: 'group',\n ...(!selectable ? focusAttributes : null),\n ...props,\n ...selectableCardProps,\n }),\n { elementType: 'div' },\n ),\n\n floatingAction: floatingActionSlot,\n checkbox: checkboxSlot,\n };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","slot","useFocusableGroup","useFocusWithin","useCardSelectable","cardContextDefaultValue","focusMap","off","undefined","useCardInteractive","focusMode","initialFocusMode","props","interactive","some","prop","groupperAttrs","tabBehavior","interactiveFocusAttributes","tabIndex","focusAttributes","useCard_unstable","ref","appearance","orientation","size","referenceId","setReferenceId","useState","selectableA11yProps","referenceLabel","setReferenceLabel","cardBaseRef","selectable","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","cardRef","components","root","floatingAction","checkbox","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAC1F,SAASC,iBAAiB,EAAEC,cAAc,QAAQ,0BAA0B;AAG5E,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,uBAAuB,QAAQ,gBAAgB;AAExD,MAAMC,WAAW;IACfC,KAAKC;IACL,UAAU;IACV,YAAY;IACZ,YAAY;AACd;AAEA;;;;;;;CAOC,GACD,MAAMC,qBAAqB,CAAC,EAAEC,WAAWC,gBAAgB,EAAE,GAAGC,OAAkB;IAC9E,MAAMC,cAAc,AAClB;QACE;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;KACD,CACDC,IAAI,CAACC,CAAAA,OAAQH,KAAK,CAACG,KAAK;IAE1B,mEAAmE;IACnE,MAAML,YAAYC,6BAAAA,8BAAAA,mBAAqBE,cAAc,WAAW;IAEhE,MAAMG,gBAAgBd,kBAAkB;QACtCe,aAAaX,QAAQ,CAACI,UAAU;IAClC;IAEA,MAAMQ,6BAA6B;QACjC,GAAGF,aAAa;QAChBG,UAAU;IACZ;IAEA,OAAO;QACLN;QACAO,iBAAiBV,cAAc,QAAQ,OAAOQ;IAChD;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMG,mBAAmB,CAACT,OAAkBU;IACjD,MAAM,EAAEC,aAAa,QAAQ,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGb;IAE7E,MAAM,CAACc,aAAaC,eAAe,GAAG7B,MAAM8B,QAAQ,CAACvB,wBAAwBwB,mBAAmB,CAACH,WAAW;IAC5G,MAAM,CAACI,gBAAgBC,kBAAkB,GAAGjC,MAAM8B,QAAQ,CAACvB,wBAAwBwB,mBAAmB,CAACH,WAAW;IAElH,MAAMM,cAAc7B;IACpB,MAAM,EAAE8B,UAAU,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,aAAa,EAAEC,YAAY,EAAEC,kBAAkB,EAAE,GAClGlC,kBAAkBQ,OAAO;QAAEc;QAAaI;IAAe,GAAGE;IAE5D,MAAMO,UAAUvC,cAAcgC,aAAaV;IAE3C,MAAM,EAAET,WAAW,EAAEO,eAAe,EAAE,GAAGX,mBAAmBG;IAE5D,OAAO;QACLW;QACAC;QACAC;QACAZ;QACAoB;QACAG;QACAF;QACAL,qBAAqB;YACnBF;YACAD;YACAI;YACAC;QACF;QAEAS,YAAY;YACVC,MAAM;YACNC,gBAAgB;YAChBC,UAAU;QACZ;QAEAF,MAAMxC,KAAK2C,MAAM,CACf7C,yBAAyB,OAAO;YAC9BuB,KAAKiB;YACLM,MAAM;YACN,GAAI,CAACZ,aAAab,kBAAkB,IAAI;YACxC,GAAGR,KAAK;YACR,GAAGuB,mBAAmB;QACxB,IACA;YAAEW,aAAa;QAAM;QAGvBJ,gBAAgBJ;QAChBK,UAAUN;IACZ;AACF,EAAE"}
1
+ {"version":3,"sources":["useCard.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusWithin } from '@fluentui/react-tabster';\n\nimport type { CardProps, CardState } from './Card.types';\nimport { useCardSelectable } from './useCardSelectable';\nimport { cardContextDefaultValue } from './CardContext';\n\nconst focusMap = {\n off: undefined,\n 'no-tab': 'limited-trap-focus',\n 'tab-exit': 'limited',\n 'tab-only': 'unlimited',\n} as const;\n\n/**\n * Create the state for interactive cards.\n *\n * This internal hook defines if the card is interactive\n * and control focus properties based on that.\n *\n * @param props - props from this instance of Card\n */\nconst useCardInteractive = ({ focusMode = 'off', ...props }: CardProps) => {\n const interactive = (\n [\n 'onClick',\n 'onDoubleClick',\n 'onMouseUp',\n 'onMouseDown',\n 'onPointerUp',\n 'onPointerDown',\n 'onTouchStart',\n 'onTouchEnd',\n 'onDragStart',\n 'onDragEnd',\n ] as (keyof React.HTMLAttributes<HTMLElement>)[]\n ).some(prop => props[prop]);\n\n const groupperAttrs = useFocusableGroup({\n tabBehavior: focusMap[interactive ? 'no-tab' : focusMode],\n });\n\n const interactiveFocusAttributes = {\n ...groupperAttrs,\n tabIndex: 0,\n };\n\n return {\n interactive,\n focusAttributes: !interactive && focusMode === 'off' ? null : interactiveFocusAttributes,\n };\n};\n\n/**\n * Create the state required to render Card.\n *\n * The returned state can be modified with hooks such as useCardStyles_unstable,\n * before being passed to renderCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n */\nexport const useCard_unstable = (props: CardProps, ref: React.Ref<HTMLDivElement>): CardState => {\n const { appearance = 'filled', orientation = 'vertical', size = 'medium' } = props;\n\n const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n\n const cardBaseRef = useFocusWithin<HTMLDivElement>();\n const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } =\n useCardSelectable(props, { referenceId, referenceLabel }, cardBaseRef);\n\n const cardRef = useMergedRefs(cardBaseRef, ref);\n\n const { interactive, focusAttributes } = useCardInteractive(props);\n\n return {\n appearance,\n orientation,\n size,\n interactive,\n selectable,\n selectFocused,\n selected,\n selectableA11yProps: {\n setReferenceId,\n referenceId,\n referenceLabel,\n setReferenceLabel,\n },\n\n components: {\n root: 'div',\n floatingAction: 'div',\n checkbox: 'input',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: cardRef,\n role: 'group',\n ...(!selectable ? focusAttributes : null),\n ...props,\n ...selectableCardProps,\n }),\n { elementType: 'div' },\n ),\n\n floatingAction: floatingActionSlot,\n checkbox: checkboxSlot,\n };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","slot","useFocusableGroup","useFocusWithin","useCardSelectable","cardContextDefaultValue","focusMap","off","undefined","useCardInteractive","focusMode","props","interactive","some","prop","groupperAttrs","tabBehavior","interactiveFocusAttributes","tabIndex","focusAttributes","useCard_unstable","ref","appearance","orientation","size","referenceId","setReferenceId","useState","selectableA11yProps","referenceLabel","setReferenceLabel","cardBaseRef","selectable","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","cardRef","components","root","floatingAction","checkbox","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAC1F,SAASC,iBAAiB,EAAEC,cAAc,QAAQ,0BAA0B;AAG5E,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,uBAAuB,QAAQ,gBAAgB;AAExD,MAAMC,WAAW;IACfC,KAAKC;IACL,UAAU;IACV,YAAY;IACZ,YAAY;AACd;AAEA;;;;;;;CAOC,GACD,MAAMC,qBAAqB,CAAC,EAAEC,YAAY,KAAK,EAAE,GAAGC,OAAkB;IACpE,MAAMC,cAAc,AAClB;QACE;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;KACD,CACDC,IAAI,CAACC,CAAAA,OAAQH,KAAK,CAACG,KAAK;IAE1B,MAAMC,gBAAgBb,kBAAkB;QACtCc,aAAaV,QAAQ,CAACM,cAAc,WAAWF,UAAU;IAC3D;IAEA,MAAMO,6BAA6B;QACjC,GAAGF,aAAa;QAChBG,UAAU;IACZ;IAEA,OAAO;QACLN;QACAO,iBAAiB,CAACP,eAAeF,cAAc,QAAQ,OAAOO;IAChE;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMG,mBAAmB,CAACT,OAAkBU;IACjD,MAAM,EAAEC,aAAa,QAAQ,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGb;IAE7E,MAAM,CAACc,aAAaC,eAAe,GAAG5B,MAAM6B,QAAQ,CAACtB,wBAAwBuB,mBAAmB,CAACH,WAAW;IAC5G,MAAM,CAACI,gBAAgBC,kBAAkB,GAAGhC,MAAM6B,QAAQ,CAACtB,wBAAwBuB,mBAAmB,CAACH,WAAW;IAElH,MAAMM,cAAc5B;IACpB,MAAM,EAAE6B,UAAU,EAAEC,QAAQ,EAAEC,mBAAmB,EAAEC,aAAa,EAAEC,YAAY,EAAEC,kBAAkB,EAAE,GAClGjC,kBAAkBO,OAAO;QAAEc;QAAaI;IAAe,GAAGE;IAE5D,MAAMO,UAAUtC,cAAc+B,aAAaV;IAE3C,MAAM,EAAET,WAAW,EAAEO,eAAe,EAAE,GAAGV,mBAAmBE;IAE5D,OAAO;QACLW;QACAC;QACAC;QACAZ;QACAoB;QACAG;QACAF;QACAL,qBAAqB;YACnBF;YACAD;YACAI;YACAC;QACF;QAEAS,YAAY;YACVC,MAAM;YACNC,gBAAgB;YAChBC,UAAU;QACZ;QAEAF,MAAMvC,KAAK0C,MAAM,CACf5C,yBAAyB,OAAO;YAC9BsB,KAAKiB;YACLM,MAAM;YACN,GAAI,CAACZ,aAAab,kBAAkB,IAAI;YACxC,GAAGR,KAAK;YACR,GAAGuB,mBAAmB;QACxB,IACA;YAAEW,aAAa;QAAM;QAGvBJ,gBAAgBJ;QAChBK,UAAUN;IACZ;AACF,EAAE"}
@@ -1,11 +1,10 @@
1
- import * as React from 'react';
2
- import { shorthands, __styles, mergeClasses, __resetStyles } from '@griffel/react';
1
+ import { shorthands, __styles, mergeClasses } from '@griffel/react';
3
2
  import { tokens } from '@fluentui/react-theme';
4
- import { textClassNames } from '@fluentui/react-text';
5
3
  import { createFocusOutlineStyle } from '@fluentui/react-tabster';
6
4
  import { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';
7
5
  import { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';
8
6
  import { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';
7
+ import * as React from 'react';
9
8
  /**
10
9
  * Static CSS class names used internally for the component slots.
11
10
  */
@@ -23,11 +22,53 @@ export const cardCSSVars = {
23
22
  };
24
23
  const focusOutlineStyle = {
25
24
  outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,
26
- outlineWidth: `var(--697, var(--698, ${tokens.strokeWidthThick}))`,
25
+ outlineWidth: `var(--ctrl-token-Card-697, var(--semantic-token-Card-698, ${tokens.strokeWidthThick}))`,
27
26
  outlineOffset: '-2px'
28
27
  };
29
- const useCardResetStyles = /*#__PURE__*/__resetStyles("r1fgywha", "rwpg34w", [".r1fgywha{overflow:hidden;border-radius:var(--fui-Card--border-radius);padding:var(--fui-Card--size);gap:var(--fui-Card--size);display:flex;position:relative;box-sizing:border-box;color:var(--699, var(--700, var(--colorNeutralForeground1));&::after{position:absolute;top:0;left:0;right:0;bottom:0;content:\"\";pointer-events:none;border-top-style:solid;border-right-style:solid;border-bottom-style:solid;border-left-style:solid;border-top-width:var(--strokeWidthThin);border-right-width:var(--strokeWidthThin);border-bottom-width:var(--strokeWidthThin);border-left-width:var(--strokeWidthThin);border-radius:var(--fui-Card--border-radius);}&> .fui-CardHeader,& > .fui-CardFooter{flex-shrink:0;}};}", ".rwpg34w{overflow:hidden;border-radius:var(--fui-Card--border-radius);padding:var(--fui-Card--size);gap:var(--fui-Card--size);display:flex;position:relative;box-sizing:border-box;color:var(--699, var(--700, var(--colorNeutralForeground1));&::after{position:absolute;top:0;right:0;left:0;bottom:0;content:\"\";pointer-events:none;border-top-style:solid;border-left-style:solid;border-bottom-style:solid;border-right-style:solid;border-top-width:var(--strokeWidthThin);border-left-width:var(--strokeWidthThin);border-bottom-width:var(--strokeWidthThin);border-right-width:var(--strokeWidthThin);border-radius:var(--fui-Card--border-radius);}&> .fui-CardHeader,& > .fui-CardFooter{flex-shrink:0;}};}"]);
30
- const useCardStyles = /*#__PURE__*/__styles({
28
+ const useStyles = /*#__PURE__*/__styles({
29
+ root: {
30
+ B68tc82: 0,
31
+ Bmxbyg5: 0,
32
+ Bpg54ce: "f1a3p1vp",
33
+ Beyfa6y: 0,
34
+ Bbmb7ep: 0,
35
+ Btl43ni: 0,
36
+ B7oj6ja: 0,
37
+ Dimara: "flpxrij",
38
+ Byoj8tv: 0,
39
+ uwmqm3: 0,
40
+ z189sj: 0,
41
+ z8tnut: 0,
42
+ B0ocmuz: "fi54ll6",
43
+ i8kkvl: 0,
44
+ Belr9w4: 0,
45
+ rmohyg: "fs0zar4",
46
+ mc9l5x: "f22iagw",
47
+ qhf8xq: "f10pi13n",
48
+ B7ck84d: "f1ewtqcl",
49
+ sj55zd: "f1py3b4z",
50
+ E3zdtr: "f1mdlcz9",
51
+ bn5sak: "frwkxtg",
52
+ Eqx8gd: ["f1n6gb5g", "f15yvnhg"],
53
+ B1piin3: ["f15yvnhg", "f1n6gb5g"],
54
+ By385i5: "fo72kxq",
55
+ Bsft5z2: "f13zj6fq",
56
+ B80jsxd: "f1nwj1ja",
57
+ Bm2nyyq: "f8rth92",
58
+ Barhvk9: ["flthirb", "ftkbnf5"],
59
+ Bw17bha: "f1lh990p",
60
+ vfts7: ["ftkbnf5", "flthirb"],
61
+ xrcqlc: "f6czdpx",
62
+ Ihftqj: ["f13hvwk3", "f1en4csx"],
63
+ Bcgy8vk: "f1i1u9k0",
64
+ Bhxzhr1: ["f1en4csx", "f13hvwk3"],
65
+ d9w3h3: 0,
66
+ B3778ie: 0,
67
+ B4j8arr: 0,
68
+ Bl18szs: 0,
69
+ Blrzh8d: "fw3u9gn",
70
+ Bwr1qzv: "fnk4z59"
71
+ },
31
72
  focused: {
32
73
  Brovlpu: "ftqa4ok",
33
74
  B486eqv: "f2hkw1w",
@@ -59,16 +100,16 @@ const useCardStyles = /*#__PURE__*/__styles({
59
100
  B6dhp37: 0,
60
101
  Bf4ptjt: 0,
61
102
  Bqtpl0w: 0,
62
- i4rwgc: "f1pjxlw4",
103
+ i4rwgc: "f1xbuv65",
63
104
  Dah5zi: 0,
64
105
  B1tsrr9: 0,
65
106
  qqdqy8: 0,
66
107
  Bkh64rk: 0,
67
108
  e3fwne: "fnd8nzh",
68
- J0r882: "f1x3nap9",
69
- Bule8hv: ["f7wspi5", "f1hn9lz"],
70
- Bjwuhne: "fsnb5w7",
71
- Ghsupd: ["f1hn9lz", "f7wspi5"]
109
+ J0r882: "f1ja06rw",
110
+ Bule8hv: ["f1fgi2v", "f13s1pi5"],
111
+ Bjwuhne: "f5o6laa",
112
+ Ghsupd: ["f13s1pi5", "f1fgi2v"]
72
113
  },
73
114
  selectableFocused: {
74
115
  Brovlpu: "ftqa4ok",
@@ -101,16 +142,16 @@ const useCardStyles = /*#__PURE__*/__styles({
101
142
  nr063g: 0,
102
143
  ghq09: 0,
103
144
  Bbgo44z: 0,
104
- Bseh09z: "f1f7o0bi",
145
+ Bseh09z: "f5o6rnv",
105
146
  az1dzo: 0,
106
147
  Ba3ybja: 0,
107
148
  B6352mv: 0,
108
149
  vppk2z: 0,
109
150
  Biaj6j7: "f1nh8hsq",
110
- B2pnrqr: "f1wk50th",
111
- B29w5g4: ["f10jz3mr", "fc1dnuj"],
112
- Bhhzhcn: "f10o2p02",
113
- Bec0n69: ["fc1dnuj", "f10jz3mr"]
151
+ B2pnrqr: "f1vngpbu",
152
+ B29w5g4: ["f1pf2b7l", "fb1a886"],
153
+ Bhhzhcn: "f1bquznm",
154
+ Bec0n69: ["fb1a886", "f1pf2b7l"]
114
155
  },
115
156
  orientationHorizontal: {
116
157
  Beiy3e4: "f1063pyq",
@@ -131,22 +172,19 @@ const useCardStyles = /*#__PURE__*/__styles({
131
172
  },
132
173
  sizeSmall: {
133
174
  B7balbw: "f1pi9uxy",
134
- B1h88n7: "fir8pkv"
175
+ B1h88n7: "f15mxzhv"
135
176
  },
136
177
  sizeMedium: {
137
178
  B7balbw: "frsmuga",
138
- B1h88n7: "f1uqf95q"
179
+ B1h88n7: "fw2n66"
139
180
  },
140
181
  sizeLarge: {
141
182
  B7balbw: "f1qua4xo",
142
- B1h88n7: "f1u1hr7d"
143
- },
144
- interactive: {
145
- rhjd8f: "f1epqm3e"
183
+ B1h88n7: "f18zjdj0"
146
184
  },
147
185
  filled: {
148
- De3pzq: "fltf6vh",
149
- E5pizo: "fwitwng",
186
+ De3pzq: "f1y5ql7n",
187
+ E5pizo: "f1l2ude5",
150
188
  B0n5ga8: "f16gxe2i",
151
189
  s924m2: ["fpgykix", "fzybk4o"],
152
190
  B1q35kw: "f1osi826",
@@ -154,29 +192,27 @@ const useCardStyles = /*#__PURE__*/__styles({
154
192
  },
155
193
  filledInteractive: {
156
194
  Bceei9c: "f1k6fduh",
157
- De3pzq: "f1h5vatx",
158
- E5pizo: "f1uxkkbl",
195
+ De3pzq: "fiekp45",
196
+ E5pizo: "f7rwcsy",
159
197
  B0n5ga8: "f16gxe2i",
160
198
  s924m2: ["fpgykix", "fzybk4o"],
161
199
  B1q35kw: "f1osi826",
162
200
  Gp14am: ["fzybk4o", "fpgykix"],
163
- Bi91k9c: "feu1g3u",
164
- Jwef8y: "f7oweeb",
165
- Bvxd0ez: "f18emohc",
166
- ecr2s2: "fqbzxcg"
201
+ Jwef8y: "f9iybsv",
202
+ Bvxd0ez: "f1b9qmj4",
203
+ ecr2s2: "fljdlzu"
167
204
  },
168
205
  filledInteractiveSelected: {
169
- De3pzq: "f1ksn0ep",
206
+ De3pzq: "f12vh31t",
170
207
  B0n5ga8: "f16eln5f",
171
208
  s924m2: ["fa2okxs", "fg4zq3l"],
172
209
  B1q35kw: "ff6932p",
173
210
  Gp14am: ["fg4zq3l", "fa2okxs"],
174
- Bi91k9c: "fx9teim",
175
- Jwef8y: "f1bwa2ac"
211
+ Jwef8y: "fe4l7lm"
176
212
  },
177
213
  filledAlternative: {
178
- De3pzq: "far5xx1",
179
- E5pizo: "fsznyw7",
214
+ De3pzq: "f145rpb8",
215
+ E5pizo: "f1jrlzwb",
180
216
  B0n5ga8: "f16gxe2i",
181
217
  s924m2: ["fpgykix", "fzybk4o"],
182
218
  B1q35kw: "f1osi826",
@@ -184,27 +220,26 @@ const useCardStyles = /*#__PURE__*/__styles({
184
220
  },
185
221
  filledAlternativeInteractive: {
186
222
  Bceei9c: "f1k6fduh",
187
- De3pzq: "f7smas5",
188
- E5pizo: "f1ubef17",
223
+ De3pzq: "f1kgqpjs",
224
+ E5pizo: "f1a2zne9",
189
225
  B0n5ga8: "f16gxe2i",
190
226
  s924m2: ["fpgykix", "fzybk4o"],
191
227
  B1q35kw: "f1osi826",
192
228
  Gp14am: ["fzybk4o", "fpgykix"],
193
- Bi91k9c: "fnwyq0v",
194
- Jwef8y: "fzx3r4q",
195
- Bvxd0ez: "fug60o5",
196
- ecr2s2: "f1ha9751"
229
+ Jwef8y: "fqm50rs",
230
+ Bvxd0ez: "fq5fk87",
231
+ ecr2s2: "f15wjqsw"
197
232
  },
198
233
  filledAlternativeInteractiveSelected: {
199
- De3pzq: "fufun8q",
234
+ De3pzq: "flecxhl",
200
235
  B0n5ga8: "f16eln5f",
201
236
  s924m2: ["fa2okxs", "fg4zq3l"],
202
237
  B1q35kw: "ff6932p",
203
238
  Gp14am: ["fg4zq3l", "fa2okxs"],
204
- Jwef8y: "frbale"
239
+ Jwef8y: "f1oin7as"
205
240
  },
206
241
  outline: {
207
- De3pzq: "faq45x3",
242
+ De3pzq: "f11a8mzo",
208
243
  E5pizo: "f1couhl3",
209
244
  B0n5ga8: "ft83z1f",
210
245
  s924m2: ["f1g4150c", "f192dr6e"],
@@ -213,35 +248,33 @@ const useCardStyles = /*#__PURE__*/__styles({
213
248
  },
214
249
  outlineInteractive: {
215
250
  Bceei9c: "f1k6fduh",
216
- De3pzq: "f80i76d",
251
+ De3pzq: "f134r7n3",
217
252
  E5pizo: "f1couhl3",
218
253
  B0n5ga8: "ft83z1f",
219
254
  s924m2: ["f1g4150c", "f192dr6e"],
220
255
  B1q35kw: "f1qnawh6",
221
256
  Gp14am: ["f192dr6e", "f1g4150c"],
222
- Bi91k9c: "feu1g3u",
223
- Jwef8y: "f1qzbeqf",
257
+ Jwef8y: "frxoo8s",
224
258
  Be0v6ae: "f1llr77y",
225
259
  B5kxglz: ["fzk0khw", "fjj8tog"],
226
260
  B3pwyw6: "fb1u8ub",
227
261
  Bymgtzf: ["fjj8tog", "fzk0khw"],
228
- ecr2s2: "fny1dgt",
262
+ ecr2s2: "f1djjq2p",
229
263
  dmfk: "f1uohb70",
230
264
  B4ofi8: ["f1jm7v1n", "f1bus3rq"],
231
265
  jgq6uv: "f1fbu7rr",
232
266
  Baxewws: ["f1bus3rq", "f1jm7v1n"]
233
267
  },
234
268
  outlineInteractiveSelected: {
235
- De3pzq: "f1l0mf4q",
269
+ De3pzq: "f3jdprh",
236
270
  B0n5ga8: "f16eln5f",
237
271
  s924m2: ["fa2okxs", "fg4zq3l"],
238
272
  B1q35kw: "ff6932p",
239
273
  Gp14am: ["fg4zq3l", "fa2okxs"],
240
- Bi91k9c: "fx9teim",
241
- Jwef8y: "f12erfqo"
274
+ Jwef8y: "f1tbkf9f"
242
275
  },
243
276
  subtle: {
244
- De3pzq: "fkapjeb",
277
+ De3pzq: "focdvv2",
245
278
  E5pizo: "f1couhl3",
246
279
  B0n5ga8: "f16gxe2i",
247
280
  s924m2: ["fpgykix", "fzybk4o"],
@@ -250,24 +283,22 @@ const useCardStyles = /*#__PURE__*/__styles({
250
283
  },
251
284
  subtleInteractive: {
252
285
  Bceei9c: "f1k6fduh",
253
- De3pzq: "f51qof6",
286
+ De3pzq: "f1rfvwxm",
254
287
  E5pizo: "f1couhl3",
255
288
  B0n5ga8: "f16gxe2i",
256
289
  s924m2: ["fpgykix", "fzybk4o"],
257
290
  B1q35kw: "f1osi826",
258
291
  Gp14am: ["fzybk4o", "fpgykix"],
259
- Bi91k9c: "feu1g3u",
260
- Jwef8y: "fopo1yw",
261
- ecr2s2: "ftzbayt"
292
+ Jwef8y: "f1cdzzdq",
293
+ ecr2s2: "fe89iq9"
262
294
  },
263
295
  subtleInteractiveSelected: {
264
- De3pzq: "f998m3t",
296
+ De3pzq: "f8hjf28",
265
297
  B0n5ga8: "f16eln5f",
266
298
  s924m2: ["fa2okxs", "fg4zq3l"],
267
299
  B1q35kw: "ff6932p",
268
300
  Gp14am: ["fg4zq3l", "fa2okxs"],
269
- Bi91k9c: "fx9teim",
270
- Jwef8y: "fbohybn"
301
+ Jwef8y: "f241ven"
271
302
  },
272
303
  highContrastSelected: {
273
304
  ycbfsm: "fkc42ay",
@@ -307,19 +338,29 @@ const useCardStyles = /*#__PURE__*/__styles({
307
338
  Huce71: "fz5stix"
308
339
  }
309
340
  }, {
310
- f: [".ftqa4ok:focus{outline-style:none;}"],
311
- i: [".f2hkw1w:focus-visible{outline-style:none;}"],
312
- d: [".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", [".f1pjxlw4[data-fui-focus-visible]::after{border:var(--697, var(--698, var(--strokeWidthThick))) solid var(--colorStrokeFocus2);}", {
341
+ d: [[".f1a3p1vp{overflow:hidden;}", {
342
+ p: -1
343
+ }], [".flpxrij{border-radius:var(--fui-Card--border-radius);}", {
344
+ p: -1
345
+ }], [".fi54ll6{padding:var(--fui-Card--size);}", {
346
+ p: -1
347
+ }], [".fs0zar4{gap:var(--fui-Card--size);}", {
348
+ p: -1
349
+ }], ".f22iagw{display:flex;}", ".f10pi13n{position:relative;}", ".f1ewtqcl{box-sizing:border-box;}", ".f1py3b4z{color:var(--ctrl-token-Card-699, var(--semantic-token-Card-700, var(--colorNeutralForeground1)));}", ".f1mdlcz9::after{position:absolute;}", ".frwkxtg::after{top:0;}", ".f1n6gb5g::after{left:0;}", ".f15yvnhg::after{right:0;}", ".fo72kxq::after{bottom:0;}", ".f13zj6fq::after{content:\"\";}", ".f1nwj1ja::after{pointer-events:none;}", ".f8rth92::after{border-top-style:solid;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f1lh990p::after{border-bottom-style:solid;}", ".f6czdpx::after{border-top-width:var(--strokeWidthThin);}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f1i1u9k0::after{border-bottom-width:var(--strokeWidthThin);}", [".fw3u9gn::after{border-radius:var(--fui-Card--border-radius);}", {
350
+ p: -1
351
+ }], ".fnk4z59>.fui-CardHeader,.fnk4z59>.fui-CardFooter{flex-shrink:0;}", ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", [".f1xbuv65[data-fui-focus-visible]::after{border:var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) solid var(--colorStrokeFocus2);}", {
313
352
  p: -2
314
353
  }], [".fnd8nzh[data-fui-focus-visible]::after{border-radius:var(--fui-Card--border-radius);}", {
315
354
  p: -1
316
- }], ".f1x3nap9[data-fui-focus-visible]::after{top:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f7wspi5[data-fui-focus-visible]::after{right:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f1hn9lz[data-fui-focus-visible]::after{left:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".fsnb5w7[data-fui-focus-visible]::after{bottom:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f1b1k54r[data-fui-focus-within]:focus-within{border-top-color:transparent;}", ".f4ne723[data-fui-focus-within]:focus-within{border-right-color:transparent;}", ".fqqcjud[data-fui-focus-within]:focus-within{border-left-color:transparent;}", ".fh7aioi[data-fui-focus-within]:focus-within{border-bottom-color:transparent;}", ".ffht0p2[data-fui-focus-within]:focus-within::after{content:\"\";}", ".f1p0ul1q[data-fui-focus-within]:focus-within::after{position:absolute;}", ".f1c901ms[data-fui-focus-within]:focus-within::after{pointer-events:none;}", ".f1alokd7[data-fui-focus-within]:focus-within::after{z-index:1;}", [".f1f7o0bi[data-fui-focus-within]:focus-within::after{border:var(--697, var(--698, var(--strokeWidthThick))) solid var(--colorStrokeFocus2);}", {
355
+ }], ".f1ja06rw[data-fui-focus-visible]::after{top:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f1fgi2v[data-fui-focus-visible]::after{right:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f13s1pi5[data-fui-focus-visible]::after{left:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f5o6laa[data-fui-focus-visible]::after{bottom:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f1b1k54r[data-fui-focus-within]:focus-within{border-top-color:transparent;}", ".f4ne723[data-fui-focus-within]:focus-within{border-right-color:transparent;}", ".fqqcjud[data-fui-focus-within]:focus-within{border-left-color:transparent;}", ".fh7aioi[data-fui-focus-within]:focus-within{border-bottom-color:transparent;}", ".ffht0p2[data-fui-focus-within]:focus-within::after{content:\"\";}", ".f1p0ul1q[data-fui-focus-within]:focus-within::after{position:absolute;}", ".f1c901ms[data-fui-focus-within]:focus-within::after{pointer-events:none;}", ".f1alokd7[data-fui-focus-within]:focus-within::after{z-index:1;}", [".f5o6rnv[data-fui-focus-within]:focus-within::after{border:var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) solid var(--colorStrokeFocus2);}", {
317
356
  p: -2
318
357
  }], [".f1nh8hsq[data-fui-focus-within]:focus-within::after{border-radius:var(--fui-Card--border-radius);}", {
319
358
  p: -1
320
- }], ".f1wk50th[data-fui-focus-within]:focus-within::after{top:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f10jz3mr[data-fui-focus-within]:focus-within::after{right:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".fc1dnuj[data-fui-focus-within]:focus-within::after{left:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f10o2p02[data-fui-focus-within]:focus-within::after{bottom:calc(0px - var(--697, var(--698, var(--strokeWidthThick))) - -2px);}", ".f1063pyq{flex-direction:row;}", ".f122n59{align-items:center;}", ".ftrw7vg>.fui-CardPreview{margin-top:calc(var(--fui-Card--size) * -1);}", ".f18opajm>.fui-CardPreview{margin-bottom:calc(var(--fui-Card--size) * -1);}", ".f13002it>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-left:calc(var(--fui-Card--size) * -1);}", ".fqo182t>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-right:calc(var(--fui-Card--size) * -1);}", ".f18yna97>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-right:calc(var(--fui-Card--size) * -1);}", ".f1kd6wh7>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-left:calc(var(--fui-Card--size) * -1);}", ".f4i4759>.fui-CardHeader:last-of-type,.f4i4759>.fui-CardFooter:last-of-type{flex-grow:1;}", ".f1vx9l62{flex-direction:column;}", ".f14k419y>.fui-CardPreview{margin-left:calc(var(--fui-Card--size) * -1);}", ".f1fgo9fz>.fui-CardPreview{margin-right:calc(var(--fui-Card--size) * -1);}", ".fvqmfsm>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-top:calc(var(--fui-Card--size) * -1);}", ".f3am6yf>.fui-Card__floatingAction+.fui-CardPreview{margin-top:calc(var(--fui-Card--size) * -1);}", ".f1r5wgso>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-bottom:calc(var(--fui-Card--size) * -1);}", ".f1pi9uxy{--fui-Card--size:8px;}", ".fir8pkv{--fui-Card--border-radius:var(--701, var(--702, var(--borderRadiusSmall)));}", ".frsmuga{--fui-Card--size:12px;}", ".f1uqf95q{--fui-Card--border-radius:var(--703, var(--704, var(--borderRadiusMedium)));}", ".f1qua4xo{--fui-Card--size:16px;}", ".f1u1hr7d{--fui-Card--border-radius:var(--705, var(--706, var(--borderRadiusLarge)));}", ".f1epqm3e .fui-Text{color:currentColor;}", ".fltf6vh{background-color:var(--707, var(--708, var(--colorNeutralBackground1)));}", ".fwitwng{box-shadow:var(--709, var(--710, var(--shadow4)));}", ".f16gxe2i::after{border-top-color:var(--colorTransparentStroke);}", ".fpgykix::after{border-right-color:var(--colorTransparentStroke);}", ".fzybk4o::after{border-left-color:var(--colorTransparentStroke);}", ".f1osi826::after{border-bottom-color:var(--colorTransparentStroke);}", ".f1k6fduh{cursor:pointer;}", ".f1h5vatx{background-color:var(--711, var(--712, var(--colorNeutralBackground1)));}", ".f1uxkkbl{box-shadow:var(--713, var(--714, var(--shadow4)));}", ".f1ksn0ep{background-color:var(--721, var(--722, var(--colorNeutralBackground1Selected)));}", ".f16eln5f::after{border-top-color:var(--colorNeutralStroke1Selected);}", ".fa2okxs::after{border-right-color:var(--colorNeutralStroke1Selected);}", ".fg4zq3l::after{border-left-color:var(--colorNeutralStroke1Selected);}", ".ff6932p::after{border-bottom-color:var(--colorNeutralStroke1Selected);}", ".far5xx1{background-color:var(--725, var(--726, var(--colorNeutralBackground2)));}", ".fsznyw7{box-shadow:var(--727, var(--728, var(--shadow4)));}", ".f7smas5{background-color:var(--729, var(--730, var(--colorNeutralBackground2)));}", ".f1ubef17{box-shadow:var(--731, var(--732, var(--shadow4)));}", ".fufun8q{background-color:var(--739, var(--740, var(--colorNeutralBackground2Selected)));}", ".faq45x3{background-color:var(--743, var(--744, var(--colorTransparentBackground)));}", ".f1couhl3{box-shadow:none;}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}", ".f80i76d{background-color:var(--745, var(--746, var(--colorTransparentBackground)));}", ".f1l0mf4q{background-color:var(--751, var(--752, var(--colorTransparentBackgroundSelected)));}", ".fkapjeb{background-color:var(--755, var(--756, var(--colorSubtleBackground)));}", ".f51qof6{background-color:var(--757, var(--758, var(--colorSubtleBackground)));}", ".f998m3t{background-color:var(--763, var(--764, var(--colorSubtleBackgroundSelected)));}", ".f1euv43f{position:absolute;}", ".fqclxi7{top:4px;}", ".fiv86kb{right:4px;}", ".f36uhnt{left:4px;}", ".f19g0ac{z-index:1;}", [".f1a3p1vp{overflow:hidden;}", {
359
+ }], ".f1vngpbu[data-fui-focus-within]:focus-within::after{top:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f1pf2b7l[data-fui-focus-within]:focus-within::after{right:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".fb1a886[data-fui-focus-within]:focus-within::after{left:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f1bquznm[data-fui-focus-within]:focus-within::after{bottom:calc(0px - var(--ctrl-token-Card-697, var(--semantic-token-Card-698, var(--strokeWidthThick))) - -2px);}", ".f1063pyq{flex-direction:row;}", ".f122n59{align-items:center;}", ".ftrw7vg>.fui-CardPreview{margin-top:calc(var(--fui-Card--size) * -1);}", ".f18opajm>.fui-CardPreview{margin-bottom:calc(var(--fui-Card--size) * -1);}", ".f13002it>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-left:calc(var(--fui-Card--size) * -1);}", ".fqo182t>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-right:calc(var(--fui-Card--size) * -1);}", ".f18yna97>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-right:calc(var(--fui-Card--size) * -1);}", ".f1kd6wh7>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-left:calc(var(--fui-Card--size) * -1);}", ".f4i4759>.fui-CardHeader:last-of-type,.f4i4759>.fui-CardFooter:last-of-type{flex-grow:1;}", ".f1vx9l62{flex-direction:column;}", ".f14k419y>.fui-CardPreview{margin-left:calc(var(--fui-Card--size) * -1);}", ".f1fgo9fz>.fui-CardPreview{margin-right:calc(var(--fui-Card--size) * -1);}", ".fvqmfsm>:not([aria-hidden=\"true\"]).fui-CardPreview:first-of-type{margin-top:calc(var(--fui-Card--size) * -1);}", ".f3am6yf>.fui-Card__floatingAction+.fui-CardPreview{margin-top:calc(var(--fui-Card--size) * -1);}", ".f1r5wgso>:not([aria-hidden=\"true\"]).fui-CardPreview:last-of-type{margin-bottom:calc(var(--fui-Card--size) * -1);}", ".f1pi9uxy{--fui-Card--size:8px;}", ".f15mxzhv{--fui-Card--border-radius:var(--ctrl-token-Card-701, var(--semantic-token-Card-702, var(--borderRadiusSmall)));}", ".frsmuga{--fui-Card--size:12px;}", ".fw2n66{--fui-Card--border-radius:var(--ctrl-token-Card-703, var(--semantic-token-Card-704, var(--borderRadiusMedium)));}", ".f1qua4xo{--fui-Card--size:16px;}", ".f18zjdj0{--fui-Card--border-radius:var(--ctrl-token-Card-705, var(--semantic-token-Card-706, var(--borderRadiusLarge)));}", ".f1y5ql7n{background-color:var(--ctrl-token-Card-707, var(--semantic-token-Card-708, var(--colorNeutralBackground1)));}", ".f1l2ude5{box-shadow:var(--ctrl-token-Card-709, var(--semantic-token-Card-710, var(--shadow4)));}", ".f16gxe2i::after{border-top-color:var(--colorTransparentStroke);}", ".fpgykix::after{border-right-color:var(--colorTransparentStroke);}", ".fzybk4o::after{border-left-color:var(--colorTransparentStroke);}", ".f1osi826::after{border-bottom-color:var(--colorTransparentStroke);}", ".f1k6fduh{cursor:pointer;}", ".fiekp45{background-color:var(--ctrl-token-Card-711, var(--semantic-token-Card-712, var(--colorNeutralBackground1)));}", ".f7rwcsy{box-shadow:var(--ctrl-token-Card-713, var(--semantic-token-Card-714, var(--shadow4)));}", ".f12vh31t{background-color:var(--ctrl-token-Card-721, var(--semantic-token-Card-722, var(--colorNeutralBackground1Selected)));}", ".f16eln5f::after{border-top-color:var(--colorNeutralStroke1Selected);}", ".fa2okxs::after{border-right-color:var(--colorNeutralStroke1Selected);}", ".fg4zq3l::after{border-left-color:var(--colorNeutralStroke1Selected);}", ".ff6932p::after{border-bottom-color:var(--colorNeutralStroke1Selected);}", ".f145rpb8{background-color:var(--ctrl-token-Card-725, var(--semantic-token-Card-726, var(--colorNeutralBackground2)));}", ".f1jrlzwb{box-shadow:var(--ctrl-token-Card-727, var(--semantic-token-Card-728, var(--shadow4)));}", ".f1kgqpjs{background-color:var(--ctrl-token-Card-729, var(--semantic-token-Card-730, var(--colorNeutralBackground2)));}", ".f1a2zne9{box-shadow:var(--ctrl-token-Card-731, var(--semantic-token-Card-732, var(--shadow4)));}", ".flecxhl{background-color:var(--ctrl-token-Card-739, var(--semantic-token-Card-740, var(--colorNeutralBackground2Selected)));}", ".f11a8mzo{background-color:var(--ctrl-token-Card-743, var(--semantic-token-Card-744, var(--colorTransparentBackground)));}", ".f1couhl3{box-shadow:none;}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}", ".f134r7n3{background-color:var(--ctrl-token-Card-745, var(--semantic-token-Card-746, var(--colorTransparentBackground)));}", ".f3jdprh{background-color:var(--ctrl-token-Card-751, var(--semantic-token-Card-752, var(--colorTransparentBackgroundSelected)));}", ".focdvv2{background-color:var(--ctrl-token-Card-755, var(--semantic-token-Card-756, var(--colorSubtleBackground)));}", ".f1rfvwxm{background-color:var(--ctrl-token-Card-757, var(--semantic-token-Card-758, var(--colorSubtleBackground)));}", ".f8hjf28{background-color:var(--ctrl-token-Card-763, var(--semantic-token-Card-764, var(--colorSubtleBackgroundSelected)));}", ".f1euv43f{position:absolute;}", ".fqclxi7{top:4px;}", ".fiv86kb{right:4px;}", ".f36uhnt{left:4px;}", ".f19g0ac{z-index:1;}", [".f1a3p1vp{overflow:hidden;}", {
321
360
  p: -1
322
361
  }], ".frkrog8{width:1px;}", ".f1mpe4l3{height:1px;}", ".fmf1zke{clip:rect(0 0 0 0);}", ".f1wch0ki{clip-path:inset(50%);}", ".fz5stix{white-space:nowrap;}"],
362
+ f: [".ftqa4ok:focus{outline-style:none;}"],
363
+ i: [".f2hkw1w:focus-visible{outline-style:none;}"],
323
364
  m: [["@media (forced-colors: active){.f226i61[data-fui-focus-visible]::after{border-top-color:Highlight;}}", {
324
365
  m: "(forced-colors: active)"
325
366
  }], ["@media (forced-colors: active){.f13kzufm[data-fui-focus-visible]::after{border-right-color:Highlight;}.fsx75g8[data-fui-focus-visible]::after{border-left-color:Highlight;}}", {
@@ -355,8 +396,8 @@ const useCardStyles = /*#__PURE__*/__styles({
355
396
  }], ["@media (forced-colors: active){.fnn5dk0:hover .fui-CardPreview,.fnn5dk0 :active .fui-CardPreview,.fnn5dk0:hover .fui-CardFooter,.fnn5dk0 :active .fui-CardFooter{forced-color-adjust:auto;}}", {
356
397
  m: "(forced-colors: active)"
357
398
  }]],
358
- h: [".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".f7oweeb:hover{background-color:var(--715, var(--716, var(--colorNeutralBackground1Hover)));}", ".f18emohc:hover{box-shadow:var(--717, var(--718, var(--shadow8)));}", ".fx9teim:hover{color:var(--colorNeutralForeground1Selected);}", ".f1bwa2ac:hover{background-color:var(--723, var(--724, var(--colorNeutralBackground1Selected)));}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}", ".fzx3r4q:hover{background-color:var(--733, var(--734, var(--colorNeutralBackground2Hover)));}", ".fug60o5:hover{box-shadow:var(--735, var(--736, var(--shadow8)));}", ".frbale:hover{background-color:var(--741, var(--742, var(--colorNeutralBackground2Selected)));}", ".f1qzbeqf:hover{background-color:var(--747, var(--748, var(--colorTransparentBackgroundHover)));}", ".f1llr77y:hover::after{border-top-color:var(--colorNeutralStroke1Hover);}", ".fzk0khw:hover::after{border-right-color:var(--colorNeutralStroke1Hover);}", ".fjj8tog:hover::after{border-left-color:var(--colorNeutralStroke1Hover);}", ".fb1u8ub:hover::after{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".f12erfqo:hover{background-color:var(--753, var(--754, var(--colorTransparentBackgroundSelected)));}", ".fopo1yw:hover{background-color:var(--759, var(--760, var(--colorSubtleBackgroundHover)));}", ".fbohybn:hover{background-color:var(--765, var(--766, var(--colorSubtleBackgroundSelected)));}"],
359
- a: [".fqbzxcg:active{background-color:var(--719, var(--720, var(--colorNeutralBackground1Pressed)));}", ".f1ha9751:active{background-color:var(--737, var(--738, var(--colorNeutralBackground2Pressed)));}", ".fny1dgt:active{background-color:var(--749, var(--750, var(--colorTransparentBackgroundPressed)));}", ".f1uohb70:active::after{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1jm7v1n:active::after{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f1bus3rq:active::after{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1fbu7rr:active::after{border-bottom-color:var(--colorNeutralStroke1Pressed);}", ".ftzbayt:active{background-color:var(--761, var(--762, var(--colorSubtleBackgroundPressed)));}"]
399
+ h: [".f9iybsv:hover{background-color:var(--ctrl-token-Card-715, var(--semantic-token-Card-716, var(--colorNeutralBackground1Hover)));}", ".f1b9qmj4:hover{box-shadow:var(--ctrl-token-Card-717, var(--semantic-token-Card-718, var(--shadow8)));}", ".fe4l7lm:hover{background-color:var(--ctrl-token-Card-723, var(--semantic-token-Card-724, var(--colorNeutralBackground1Selected)));}", ".fqm50rs:hover{background-color:var(--ctrl-token-Card-733, var(--semantic-token-Card-734, var(--colorNeutralBackground2Hover)));}", ".fq5fk87:hover{box-shadow:var(--ctrl-token-Card-735, var(--semantic-token-Card-736, var(--shadow8)));}", ".f1oin7as:hover{background-color:var(--ctrl-token-Card-741, var(--semantic-token-Card-742, var(--colorNeutralBackground2Selected)));}", ".frxoo8s:hover{background-color:var(--ctrl-token-Card-747, var(--semantic-token-Card-748, var(--colorTransparentBackgroundHover)));}", ".f1llr77y:hover::after{border-top-color:var(--colorNeutralStroke1Hover);}", ".fzk0khw:hover::after{border-right-color:var(--colorNeutralStroke1Hover);}", ".fjj8tog:hover::after{border-left-color:var(--colorNeutralStroke1Hover);}", ".fb1u8ub:hover::after{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".f1tbkf9f:hover{background-color:var(--ctrl-token-Card-753, var(--semantic-token-Card-754, var(--colorTransparentBackgroundSelected)));}", ".f1cdzzdq:hover{background-color:var(--ctrl-token-Card-759, var(--semantic-token-Card-760, var(--colorSubtleBackgroundHover)));}", ".f241ven:hover{background-color:var(--ctrl-token-Card-765, var(--semantic-token-Card-766, var(--colorSubtleBackgroundSelected)));}"],
400
+ a: [".fljdlzu:active{background-color:var(--ctrl-token-Card-719, var(--semantic-token-Card-720, var(--colorNeutralBackground1Pressed)));}", ".f15wjqsw:active{background-color:var(--ctrl-token-Card-737, var(--semantic-token-Card-738, var(--colorNeutralBackground2Pressed)));}", ".f1djjq2p:active{background-color:var(--ctrl-token-Card-749, var(--semantic-token-Card-750, var(--colorTransparentBackgroundPressed)));}", ".f1uohb70:active::after{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1jm7v1n:active::after{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f1bus3rq:active::after{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1fbu7rr:active::after{border-bottom-color:var(--colorNeutralStroke1Pressed);}", ".fe89iq9:active{background-color:var(--ctrl-token-Card-761, var(--semantic-token-Card-762, var(--colorSubtleBackgroundPressed)));}"]
360
401
  });
361
402
  /**
362
403
  * Apply styling to the Card slots based on the state.
@@ -364,8 +405,7 @@ const useCardStyles = /*#__PURE__*/__styles({
364
405
  export const useCardStyles_unstable = state => {
365
406
  'use no memo';
366
407
 
367
- const resetStyles = useCardResetStyles();
368
- const styles = useCardStyles();
408
+ const styles = useStyles();
369
409
  const orientationMap = {
370
410
  horizontal: styles.orientationHorizontal,
371
411
  vertical: styles.orientationVertical
@@ -403,7 +443,11 @@ export const useCardStyles_unstable = state => {
403
443
  }
404
444
  return styles.focused;
405
445
  }, [state.selectFocused, state.selectable, styles.focused, styles.selectableFocused]);
406
- state.root.className = mergeClasses(cardClassNames.root, resetStyles, orientationMap[state.orientation], sizeMap[state.size], appearanceMap[state.appearance], isSelectableOrInteractive && styles.interactive, isSelectableOrInteractive && interactiveMap[state.appearance], state.selected && selectedMap[state.appearance], focusedClassName, isSelectableOrInteractive && styles.highContrastInteractive, state.selected && styles.highContrastSelected, state.root.className);
446
+ state.root.className = mergeClasses(cardClassNames.root, styles.root, orientationMap[state.orientation], sizeMap[state.size], appearanceMap[state.appearance], isSelectableOrInteractive && interactiveMap[state.appearance], state.selected && selectedMap[state.appearance],
447
+ // Focus overrides
448
+ focusedClassName,
449
+ // High contrast overrides
450
+ isSelectableOrInteractive && styles.highContrastInteractive, state.selected && styles.highContrastSelected, state.root.className);
407
451
  if (state.floatingAction) {
408
452
  state.floatingAction.className = mergeClasses(cardClassNames.floatingAction, styles.select, state.floatingAction.className);
409
453
  }