@fluentui/react-card 9.0.0-beta.36 → 9.0.0-beta.38

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.
Files changed (101) hide show
  1. package/CHANGELOG.json +89 -1
  2. package/CHANGELOG.md +26 -2
  3. package/lib/components/Card/Card.js +0 -1
  4. package/lib/components/Card/Card.js.map +1 -1
  5. package/lib/components/Card/CardContext.js +0 -8
  6. package/lib/components/Card/CardContext.js.map +1 -1
  7. package/lib/components/Card/renderCard.js +6 -4
  8. package/lib/components/Card/renderCard.js.map +1 -1
  9. package/lib/components/Card/useCard.js +2 -4
  10. package/lib/components/Card/useCard.js.map +1 -1
  11. package/lib/components/Card/useCardContextValue.js.map +1 -1
  12. package/lib/components/Card/useCardSelectable.js +0 -8
  13. package/lib/components/Card/useCardSelectable.js.map +1 -1
  14. package/lib/components/Card/useCardStyles.js +247 -255
  15. package/lib/components/Card/useCardStyles.js.map +1 -1
  16. package/lib/components/CardFooter/CardFooter.js +0 -1
  17. package/lib/components/CardFooter/CardFooter.js.map +1 -1
  18. package/lib/components/CardFooter/renderCardFooter.js +4 -3
  19. package/lib/components/CardFooter/renderCardFooter.js.map +1 -1
  20. package/lib/components/CardFooter/useCardFooter.js +0 -1
  21. package/lib/components/CardFooter/useCardFooter.js.map +1 -1
  22. package/lib/components/CardFooter/useCardFooterStyles.js +8 -14
  23. package/lib/components/CardFooter/useCardFooterStyles.js.map +1 -1
  24. package/lib/components/CardHeader/CardHeader.js +0 -1
  25. package/lib/components/CardHeader/CardHeader.js.map +1 -1
  26. package/lib/components/CardHeader/renderCardHeader.js +10 -6
  27. package/lib/components/CardHeader/renderCardHeader.js.map +1 -1
  28. package/lib/components/CardHeader/useCardHeader.js +0 -1
  29. package/lib/components/CardHeader/useCardHeader.js.map +1 -1
  30. package/lib/components/CardHeader/useCardHeaderStyles.js +22 -32
  31. package/lib/components/CardHeader/useCardHeaderStyles.js.map +1 -1
  32. package/lib/components/CardPreview/CardPreview.js +0 -1
  33. package/lib/components/CardPreview/CardPreview.js.map +1 -1
  34. package/lib/components/CardPreview/renderCardPreview.js +4 -3
  35. package/lib/components/CardPreview/renderCardPreview.js.map +1 -1
  36. package/lib/components/CardPreview/useCardPreview.js +0 -4
  37. package/lib/components/CardPreview/useCardPreview.js.map +1 -1
  38. package/lib/components/CardPreview/useCardPreviewStyles.js +12 -18
  39. package/lib/components/CardPreview/useCardPreviewStyles.js.map +1 -1
  40. package/lib/index.js.map +1 -1
  41. package/lib-commonjs/Card.js +0 -2
  42. package/lib-commonjs/Card.js.map +1 -1
  43. package/lib-commonjs/CardFooter.js +0 -2
  44. package/lib-commonjs/CardFooter.js.map +1 -1
  45. package/lib-commonjs/CardHeader.js +0 -2
  46. package/lib-commonjs/CardHeader.js.map +1 -1
  47. package/lib-commonjs/CardPreview.js +0 -2
  48. package/lib-commonjs/CardPreview.js.map +1 -1
  49. package/lib-commonjs/components/Card/Card.js +0 -7
  50. package/lib-commonjs/components/Card/Card.js.map +1 -1
  51. package/lib-commonjs/components/Card/Card.types.js.map +1 -1
  52. package/lib-commonjs/components/Card/CardContext.js +0 -11
  53. package/lib-commonjs/components/Card/CardContext.js.map +1 -1
  54. package/lib-commonjs/components/Card/index.js +0 -7
  55. package/lib-commonjs/components/Card/index.js.map +1 -1
  56. package/lib-commonjs/components/Card/renderCard.js +6 -9
  57. package/lib-commonjs/components/Card/renderCard.js.map +1 -1
  58. package/lib-commonjs/components/Card/useCard.js +2 -11
  59. package/lib-commonjs/components/Card/useCard.js.map +1 -1
  60. package/lib-commonjs/components/Card/useCardContextValue.js +0 -2
  61. package/lib-commonjs/components/Card/useCardContextValue.js.map +1 -1
  62. package/lib-commonjs/components/Card/useCardSelectable.js +0 -14
  63. package/lib-commonjs/components/Card/useCardSelectable.js.map +1 -1
  64. package/lib-commonjs/components/Card/useCardStyles.js +247 -263
  65. package/lib-commonjs/components/Card/useCardStyles.js.map +1 -1
  66. package/lib-commonjs/components/CardFooter/CardFooter.js +0 -6
  67. package/lib-commonjs/components/CardFooter/CardFooter.js.map +1 -1
  68. package/lib-commonjs/components/CardFooter/CardFooter.types.js.map +1 -1
  69. package/lib-commonjs/components/CardFooter/index.js +0 -6
  70. package/lib-commonjs/components/CardFooter/index.js.map +1 -1
  71. package/lib-commonjs/components/CardFooter/renderCardFooter.js +4 -7
  72. package/lib-commonjs/components/CardFooter/renderCardFooter.js.map +1 -1
  73. package/lib-commonjs/components/CardFooter/useCardFooter.js +0 -4
  74. package/lib-commonjs/components/CardFooter/useCardFooter.js.map +1 -1
  75. package/lib-commonjs/components/CardFooter/useCardFooterStyles.js +8 -17
  76. package/lib-commonjs/components/CardFooter/useCardFooterStyles.js.map +1 -1
  77. package/lib-commonjs/components/CardHeader/CardHeader.js +0 -6
  78. package/lib-commonjs/components/CardHeader/CardHeader.js.map +1 -1
  79. package/lib-commonjs/components/CardHeader/CardHeader.types.js.map +1 -1
  80. package/lib-commonjs/components/CardHeader/index.js +0 -6
  81. package/lib-commonjs/components/CardHeader/index.js.map +1 -1
  82. package/lib-commonjs/components/CardHeader/renderCardHeader.js +10 -10
  83. package/lib-commonjs/components/CardHeader/renderCardHeader.js.map +1 -1
  84. package/lib-commonjs/components/CardHeader/useCardHeader.js +0 -7
  85. package/lib-commonjs/components/CardHeader/useCardHeader.js.map +1 -1
  86. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js +22 -35
  87. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.js.map +1 -1
  88. package/lib-commonjs/components/CardPreview/CardPreview.js +0 -6
  89. package/lib-commonjs/components/CardPreview/CardPreview.js.map +1 -1
  90. package/lib-commonjs/components/CardPreview/CardPreview.types.js.map +1 -1
  91. package/lib-commonjs/components/CardPreview/index.js +0 -6
  92. package/lib-commonjs/components/CardPreview/index.js.map +1 -1
  93. package/lib-commonjs/components/CardPreview/renderCardPreview.js +4 -7
  94. package/lib-commonjs/components/CardPreview/renderCardPreview.js.map +1 -1
  95. package/lib-commonjs/components/CardPreview/useCardPreview.js +0 -10
  96. package/lib-commonjs/components/CardPreview/useCardPreview.js.map +1 -1
  97. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js +12 -21
  98. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.js.map +1 -1
  99. package/lib-commonjs/index.js +0 -10
  100. package/lib-commonjs/index.js.map +1 -1
  101. package/package.json +7 -7
package/CHANGELOG.json CHANGED
@@ -2,7 +2,95 @@
2
2
  "name": "@fluentui/react-card",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 21 Dec 2022 10:17:16 GMT",
5
+ "date": "Mon, 09 Jan 2023 14:31:42 GMT",
6
+ "tag": "@fluentui/react-card_v9.0.0-beta.38",
7
+ "version": "9.0.0-beta.38",
8
+ "comments": {
9
+ "none": [
10
+ {
11
+ "author": "martinhochel@microsoft.com",
12
+ "package": "@fluentui/react-card",
13
+ "commit": "abae9f7a10d544d8d6b530b974fff235cfd2f956",
14
+ "comment": "chore: introduce more barrel file api within /scripts"
15
+ }
16
+ ],
17
+ "prerelease": [
18
+ {
19
+ "author": "beachball",
20
+ "package": "@fluentui/react-card",
21
+ "comment": "Bump @fluentui/react-tabster to v9.3.6",
22
+ "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
23
+ },
24
+ {
25
+ "author": "beachball",
26
+ "package": "@fluentui/react-card",
27
+ "comment": "Bump @fluentui/react-utilities to v9.4.0",
28
+ "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
29
+ },
30
+ {
31
+ "author": "beachball",
32
+ "package": "@fluentui/react-card",
33
+ "comment": "Bump @fluentui/react-button to v9.1.14",
34
+ "commit": "26f0364b3837056ee8e0df42a7932c298c68290e"
35
+ }
36
+ ]
37
+ }
38
+ },
39
+ {
40
+ "date": "Wed, 04 Jan 2023 01:40:54 GMT",
41
+ "tag": "@fluentui/react-card_v9.0.0-beta.37",
42
+ "version": "9.0.0-beta.37",
43
+ "comments": {
44
+ "none": [
45
+ {
46
+ "author": "martinhochel@microsoft.com",
47
+ "package": "@fluentui/react-card",
48
+ "commit": "194b0cf0cc27c1c1233aa945f09b3ad29778d8ca",
49
+ "comment": "chore(scripts): use for @fluentui/scripts version within all package.json"
50
+ },
51
+ {
52
+ "author": "martinhochel@microsoft.com",
53
+ "package": "@fluentui/react-card",
54
+ "commit": "4ec2b998b294d6d9c3196d3d82893bdd97d0c105",
55
+ "comment": "chore(scripts): move index.ts to to follow sub-folder domain packaging"
56
+ }
57
+ ],
58
+ "prerelease": [
59
+ {
60
+ "author": "olfedias@microsoft.com",
61
+ "package": "@fluentui/react-card",
62
+ "commit": "2c38f1e4ae07b2b60df596efe11015a68f166dbf",
63
+ "comment": "chore: Update Griffel to latest version"
64
+ },
65
+ {
66
+ "author": "beachball",
67
+ "package": "@fluentui/react-card",
68
+ "comment": "Bump @fluentui/react-tabster to v9.3.5",
69
+ "commit": "3e322d15529451be153e97298873253e21af4082"
70
+ },
71
+ {
72
+ "author": "beachball",
73
+ "package": "@fluentui/react-card",
74
+ "comment": "Bump @fluentui/react-utilities to v9.3.1",
75
+ "commit": "3e322d15529451be153e97298873253e21af4082"
76
+ },
77
+ {
78
+ "author": "beachball",
79
+ "package": "@fluentui/react-card",
80
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19",
81
+ "commit": "3e322d15529451be153e97298873253e21af4082"
82
+ },
83
+ {
84
+ "author": "beachball",
85
+ "package": "@fluentui/react-card",
86
+ "comment": "Bump @fluentui/react-button to v9.1.13",
87
+ "commit": "3e322d15529451be153e97298873253e21af4082"
88
+ }
89
+ ]
90
+ }
91
+ },
92
+ {
93
+ "date": "Wed, 21 Dec 2022 10:20:33 GMT",
6
94
  "tag": "@fluentui/react-card_v9.0.0-beta.36",
7
95
  "version": "9.0.0-beta.36",
8
96
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,36 @@
1
1
  # Change Log - @fluentui/react-card
2
2
 
3
- This log was last generated on Wed, 21 Dec 2022 10:17:16 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 09 Jan 2023 14:31:42 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.0-beta.38](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.0-beta.38)
8
+
9
+ Mon, 09 Jan 2023 14:31:42 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.0-beta.37..@fluentui/react-card_v9.0.0-beta.38)
11
+
12
+ ### Changes
13
+
14
+ - Bump @fluentui/react-tabster to v9.3.6 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
15
+ - Bump @fluentui/react-utilities to v9.4.0 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
16
+ - Bump @fluentui/react-button to v9.1.14 ([PR #26257](https://github.com/microsoft/fluentui/pull/26257) by beachball)
17
+
18
+ ## [9.0.0-beta.37](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.0-beta.37)
19
+
20
+ Wed, 04 Jan 2023 01:40:54 GMT
21
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.0-beta.36..@fluentui/react-card_v9.0.0-beta.37)
22
+
23
+ ### Changes
24
+
25
+ - chore: Update Griffel to latest version ([PR #26045](https://github.com/microsoft/fluentui/pull/26045) by olfedias@microsoft.com)
26
+ - Bump @fluentui/react-tabster to v9.3.5 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
27
+ - Bump @fluentui/react-utilities to v9.3.1 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
28
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.19 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
29
+ - Bump @fluentui/react-button to v9.1.13 ([PR #26114](https://github.com/microsoft/fluentui/pull/26114) by beachball)
30
+
7
31
  ## [9.0.0-beta.36](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.0-beta.36)
8
32
 
9
- Wed, 21 Dec 2022 10:17:16 GMT
33
+ Wed, 21 Dec 2022 10:20:33 GMT
10
34
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.0-beta.35..@fluentui/react-card_v9.0.0-beta.36)
11
35
 
12
36
  ### Changes
@@ -6,7 +6,6 @@ import { useCardContextValue } from './useCardContextValue';
6
6
  /**
7
7
  * A card provides scaffolding for hosting actions and content for a single topic.
8
8
  */
9
-
10
9
  export const Card = /*#__PURE__*/React.forwardRef((props, ref) => {
11
10
  const state = useCard_unstable(props, ref);
12
11
  const cardContextValue = useCardContextValue(state);
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,WAAjC;AACA,SAAS,mBAAT,QAAoC,cAApC;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AAGA,SAAS,mBAAT,QAAoC,uBAApC;AAEA;;AAEG;;AACH,OAAO,MAAM,IAAI,gBAAmC,KAAK,CAAC,UAAN,CAAiC,CAAC,KAAD,EAAQ,GAAR,KAAe;EAClG,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAD,EAAQ,GAAR,CAA9B;EACA,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,KAAD,CAA5C;EAEA,sBAAsB,CAAC,KAAD,CAAtB;EACA,OAAO,mBAAmB,CAAC,KAAD,EAAQ,gBAAR,CAA1B;AACD,CANmD,CAA7C;AAQP,IAAI,CAAC,WAAL,GAAmB,MAAnB","sourcesContent":["import * as React from 'react';\nimport { useCard_unstable } from './useCard';\nimport { renderCard_unstable } from './renderCard';\nimport { useCardStyles_unstable } from './useCardStyles';\nimport type { CardProps } from './Card.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCardContextValue } from './useCardContextValue';\n\n/**\n * A card provides scaffolding for hosting actions and content for a single topic.\n */\nexport const Card: ForwardRefComponent<CardProps> = React.forwardRef<HTMLDivElement>((props, ref) => {\n const state = useCard_unstable(props, ref);\n const cardContextValue = useCardContextValue(state);\n\n useCardStyles_unstable(state);\n return renderCard_unstable(state, cardContextValue);\n});\n\nCard.displayName = 'Card';\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,gBAAgB,QAAQ,WAAW;AAC5C,SAASC,mBAAmB,QAAQ,cAAc;AAClD,SAASC,sBAAsB,QAAQ,iBAAiB;AAGxD,SAASC,mBAAmB,QAAQ,uBAAuB;AAE3D;;;AAGA,OAAO,MAAMC,IAAI,gBAAmCL,KAAK,CAACM,UAAU,CAAiB,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGR,gBAAgB,CAACM,KAAK,EAAEC,GAAG,CAAC;EAC1C,MAAME,gBAAgB,GAAGN,mBAAmB,CAACK,KAAK,CAAC;EAEnDN,sBAAsB,CAACM,KAAK,CAAC;EAC7B,OAAOP,mBAAmB,CAACO,KAAK,EAAEC,gBAAgB,CAAC;AACrD,CAAC,CAAC;AAEFL,IAAI,CAACM,WAAW,GAAG,MAAM","names":["React","useCard_unstable","renderCard_unstable","useCardStyles_unstable","useCardContextValue","Card","forwardRef","props","ref","state","cardContextValue","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/Card.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCard_unstable } from './useCard';\nimport { renderCard_unstable } from './renderCard';\nimport { useCardStyles_unstable } from './useCardStyles';\nimport type { CardProps } from './Card.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCardContextValue } from './useCardContextValue';\n\n/**\n * A card provides scaffolding for hosting actions and content for a single topic.\n */\nexport const Card: ForwardRefComponent<CardProps> = React.forwardRef<HTMLDivElement>((props, ref) => {\n const state = useCard_unstable(props, ref);\n const cardContextValue = useCardContextValue(state);\n\n useCardStyles_unstable(state);\n return renderCard_unstable(state, cardContextValue);\n});\n\nCard.displayName = 'Card';\n"]}
@@ -3,35 +3,27 @@ const cardContext = /*#__PURE__*/React.createContext(undefined);
3
3
  /**
4
4
  * @internal
5
5
  */
6
-
7
6
  export const cardContextDefaultValue = {
8
7
  selectableA11yProps: {
9
8
  referenceId: undefined,
10
-
11
9
  setReferenceId() {
12
10
  /* Noop */
13
11
  },
14
-
15
12
  referenceLabel: undefined,
16
-
17
13
  setReferenceLabel() {
18
14
  /* Noop */
19
15
  }
20
-
21
16
  }
22
17
  };
23
18
  /**
24
19
  * @internal
25
20
  */
26
-
27
21
  export const CardProvider = cardContext.Provider;
28
22
  /**
29
23
  * @internal
30
24
  */
31
-
32
25
  export const useCardContext_unstable = () => {
33
26
  var _a;
34
-
35
27
  return (_a = React.useContext(cardContext)) !== null && _a !== void 0 ? _a : cardContextDefaultValue;
36
28
  };
37
29
  //# sourceMappingURL=CardContext.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/CardContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,MAAM,WAAW,gBAAG,KAAK,CAAC,aAAN,CAAkD,SAAlD,CAApB;AAEA;;AAEG;;AACH,OAAO,MAAM,uBAAuB,GAAqB;EACvD,mBAAmB,EAAE;IACnB,WAAW,EAAE,SADM;;IAEnB,cAAc,GAAA;MACZ;IACD,CAJkB;;IAKnB,cAAc,EAAE,SALG;;IAMnB,iBAAiB,GAAA;MACf;IACD;;EARkB;AADkC,CAAlD;AAaP;;AAEG;;AACH,OAAO,MAAM,YAAY,GAAG,WAAW,CAAC,QAAjC;AAEP;;AAEG;;AACH,OAAO,MAAM,uBAAuB,GAAG,MAAK;EAAA,IAAA,EAAA;;EAAC,OAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,CAAiB,WAAjB,CAAA,MAA6B,IAA7B,IAA6B,EAAA,KAAA,KAAA,CAA7B,GAA6B,EAA7B,GAAiC,uBAAjC;AAAwD,CAA9F","sourcesContent":["import * as React from 'react';\nimport { CardContextValue } from './Card.types';\n\nconst cardContext = React.createContext<CardContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport const cardContextDefaultValue: CardContextValue = {\n selectableA11yProps: {\n referenceId: undefined,\n setReferenceId() {\n /* Noop */\n },\n referenceLabel: undefined,\n setReferenceLabel() {\n /* Noop */\n },\n },\n};\n\n/**\n * @internal\n */\nexport const CardProvider = cardContext.Provider;\n\n/**\n * @internal\n */\nexport const useCardContext_unstable = () => React.useContext(cardContext) ?? cardContextDefaultValue;\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAG9B,MAAMC,WAAW,gBAAGD,KAAK,CAACE,aAAa,CAA+BC,SAAS,CAAC;AAEhF;;;AAGA,OAAO,MAAMC,uBAAuB,GAAqB;EACvDC,mBAAmB,EAAE;IACnBC,WAAW,EAAEH,SAAS;IACtBI,cAAc;MACZ;IAAA,CACD;IACDC,cAAc,EAAEL,SAAS;IACzBM,iBAAiB;MACf;IAAA;;CAGL;AAED;;;AAGA,OAAO,MAAMC,YAAY,GAAGT,WAAW,CAACU,QAAQ;AAEhD;;;AAGA,OAAO,MAAMC,uBAAuB,GAAG,MAAK;EAAA;EAAC,kBAAK,CAACC,UAAU,CAACZ,WAAW,CAAC,mCAAIG,uBAAuB;AAAA","names":["React","cardContext","createContext","undefined","cardContextDefaultValue","selectableA11yProps","referenceId","setReferenceId","referenceLabel","setReferenceLabel","CardProvider","Provider","useCardContext_unstable","useContext"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/CardContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { CardContextValue } from './Card.types';\n\nconst cardContext = React.createContext<CardContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport const cardContextDefaultValue: CardContextValue = {\n selectableA11yProps: {\n referenceId: undefined,\n setReferenceId() {\n /* Noop */\n },\n referenceLabel: undefined,\n setReferenceLabel() {\n /* Noop */\n },\n },\n};\n\n/**\n * @internal\n */\nexport const CardProvider = cardContext.Provider;\n\n/**\n * @internal\n */\nexport const useCardContext_unstable = () => React.useContext(cardContext) ?? cardContextDefaultValue;\n"]}
@@ -4,17 +4,19 @@ import { CardProvider } from './CardContext';
4
4
  /**
5
5
  * Render the final JSX of Card.
6
6
  */
7
-
8
7
  export const renderCard_unstable = (state, cardContextValue) => {
9
8
  const {
10
9
  slots,
11
10
  slotProps
12
11
  } = getSlots(state);
13
- return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
12
+ return /*#__PURE__*/React.createElement(slots.root, {
13
+ ...slotProps.root
14
14
  }, /*#__PURE__*/React.createElement(CardProvider, {
15
15
  value: cardContextValue
16
- }, slots.checkbox ? /*#__PURE__*/React.createElement(slots.checkbox, { ...slotProps.checkbox
17
- }) : null, slots.floatingAction ? /*#__PURE__*/React.createElement(slots.floatingAction, { ...slotProps.floatingAction
16
+ }, slots.checkbox ? /*#__PURE__*/React.createElement(slots.checkbox, {
17
+ ...slotProps.checkbox
18
+ }) : null, slots.floatingAction ? /*#__PURE__*/React.createElement(slots.floatingAction, {
19
+ ...slotProps.floatingAction
18
20
  }) : null, slotProps.root.children));
19
21
  };
20
22
  //# sourceMappingURL=renderCard.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/renderCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAEA,SAAS,YAAT,QAA6B,eAA7B;AAEA;;AAEG;;AACH,OAAO,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAmB,gBAAnB,KAAyD;EAC1F,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAY,KAAZ,CAArC;EAEA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,eACE,KAAA,CAAA,aAAA,CAAC,YAAD,EAAa;IAAC,KAAK,EAAE;EAAR,CAAb,EACG,KAAK,CAAC,QAAN,gBAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,QAAP,EAAe,EAAA,GAAK,SAAS,CAAC;EAAf,CAAf,CAAjB,GAA8D,IADjE,EAEG,KAAK,CAAC,cAAN,gBAAuB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,cAAP,EAAqB,EAAA,GAAK,SAAS,CAAC;EAAf,CAArB,CAAvB,GAAgF,IAFnF,EAGG,SAAS,CAAC,IAAV,CAAe,QAHlB,CADF,CADF;AASD,CAZM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { CardContextValue, CardSlots, CardState } from './Card.types';\nimport { CardProvider } from './CardContext';\n\n/**\n * Render the final JSX of Card.\n */\nexport const renderCard_unstable = (state: CardState, cardContextValue: CardContextValue) => {\n const { slots, slotProps } = getSlots<CardSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <CardProvider value={cardContextValue}>\n {slots.checkbox ? <slots.checkbox {...slotProps.checkbox} /> : null}\n {slots.floatingAction ? <slots.floatingAction {...slotProps.floatingAction} /> : null}\n {slotProps.root.children}\n </CardProvider>\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,YAAY,QAAQ,eAAe;AAE5C;;;AAGA,OAAO,MAAMC,mBAAmB,GAAG,CAACC,KAAgB,EAAEC,gBAAkC,KAAI;EAC1F,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAYG,KAAK,CAAC;EAEvD,oBACEJ,oBAACM,KAAK,CAACE,IAAI;IAAA,GAAKD,SAAS,CAACC;EAAI,gBAC5BR,oBAACE,YAAY;IAACO,KAAK,EAAEJ;EAAgB,GAClCC,KAAK,CAACI,QAAQ,gBAAGV,oBAACM,KAAK,CAACI,QAAQ;IAAA,GAAKH,SAAS,CAACG;EAAQ,EAAI,GAAG,IAAI,EAClEJ,KAAK,CAACK,cAAc,gBAAGX,oBAACM,KAAK,CAACK,cAAc;IAAA,GAAKJ,SAAS,CAACI;EAAc,EAAI,GAAG,IAAI,EACpFJ,SAAS,CAACC,IAAI,CAACI,QAAQ,CACX,CACJ;AAEjB,CAAC","names":["React","getSlots","CardProvider","renderCard_unstable","state","cardContextValue","slots","slotProps","root","value","checkbox","floatingAction","children"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/renderCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { CardContextValue, CardSlots, CardState } from './Card.types';\nimport { CardProvider } from './CardContext';\n\n/**\n * Render the final JSX of Card.\n */\nexport const renderCard_unstable = (state: CardState, cardContextValue: CardContextValue) => {\n const { slots, slotProps } = getSlots<CardSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <CardProvider value={cardContextValue}>\n {slots.checkbox ? <slots.checkbox {...slotProps.checkbox} /> : null}\n {slots.floatingAction ? <slots.floatingAction {...slotProps.floatingAction} /> : null}\n {slotProps.root.children}\n </CardProvider>\n </slots.root>\n );\n};\n"]}
@@ -17,7 +17,6 @@ const focusMap = {
17
17
  *
18
18
  * @param props - props from this instance of Card
19
19
  */
20
-
21
20
  const useCardInteractive = ({
22
21
  focusMode = 'off',
23
22
  ...props
@@ -26,7 +25,8 @@ const useCardInteractive = ({
26
25
  const groupperAttrs = useFocusableGroup({
27
26
  tabBehavior: focusMap[interactive ? 'no-tab' : focusMode]
28
27
  });
29
- const interactiveFocusAttributes = { ...groupperAttrs,
28
+ const interactiveFocusAttributes = {
29
+ ...groupperAttrs,
30
30
  tabIndex: 0
31
31
  };
32
32
  return {
@@ -43,8 +43,6 @@ const useCardInteractive = ({
43
43
  * @param props - props from this instance of Card
44
44
  * @param ref - reference to the root element of Card
45
45
  */
46
-
47
-
48
46
  export const useCard_unstable = (props, ref) => {
49
47
  const {
50
48
  appearance = 'filled',
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/useCard.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,aAAlD,QAAuE,2BAAvE;AACA,SAAS,iBAAT,EAA4B,cAA5B,QAAkD,yBAAlD;AAGA,SAAS,iBAAT,QAAkC,qBAAlC;AACA,SAAS,uBAAT,QAAwC,eAAxC;AAEA,MAAM,QAAQ,GAAG;EACf,GAAG,EAAE,SADU;EAEf,UAAU,oBAFK;EAGf,YAAY,SAHG;EAIf,YAAY;AAJG,CAAjB;AAOA;;;;;;;AAOG;;AACH,MAAM,kBAAkB,GAAG,CAAC;EAAE,SAAS,GAAG,KAAd;EAAqB,GAAG;AAAxB,CAAD,KAA+C;EACxE,MAAM,WAAW,GAAI,CACnB,SADmB,EAEnB,eAFmB,EAGnB,WAHmB,EAInB,aAJmB,EAKnB,aALmB,EAMnB,eANmB,EAOnB,cAPmB,EAQnB,YARmB,EASnB,aATmB,EAUnB,WAVmB,EAW6B,IAX7B,CAWkC,IAAI,IAAI,KAAK,CAAC,IAAD,CAX/C,CAArB;EAaA,MAAM,aAAa,GAAG,iBAAiB,CAAC;IACtC,WAAW,EAAE,QAAQ,CAAC,WAAW,GAAG,QAAH,GAAc,SAA1B;EADiB,CAAD,CAAvC;EAIA,MAAM,0BAA0B,GAAG,EACjC,GAAG,aAD8B;IAEjC,QAAQ,EAAE;EAFuB,CAAnC;EAKA,OAAO;IACL,WADK;IAEL,eAAe,EAAE,SAAS,KAAK,KAAd,GAAsB,IAAtB,GAA6B;EAFzC,CAAP;AAID,CA3BD;AA6BA;;;;;;;;AAQG;;;AACH,OAAO,MAAM,gBAAgB,GAAG,CAAC,KAAD,EAAmB,GAAnB,KAAgE;EAC9F,MAAM;IAAE,UAAU,GAAG,QAAf;IAAyB,WAAW,GAAG,UAAvC;IAAmD,IAAI,GAAG,QAA1D;IAAoE;EAApE,IAAuF,KAA7F;EAEA,MAAM,CAAC,WAAD,EAAc,cAAd,IAAgC,KAAK,CAAC,QAAN,CAAe,uBAAuB,CAAC,mBAAxB,CAA4C,WAA3D,CAAtC;EACA,MAAM,CAAC,cAAD,EAAiB,iBAAjB,IAAsC,KAAK,CAAC,QAAN,CAAe,uBAAuB,CAAC,mBAAxB,CAA4C,WAA3D,CAA5C;EAEA,MAAM,WAAW,GAAG,cAAc,EAAlC;EACA,MAAM;IAAE,UAAF;IAAc,QAAd;IAAwB,mBAAxB;IAA6C,aAA7C;IAA4D;EAA5D,IAA6E,iBAAiB,CAClG,KADkG,EAElG;IAAE,WAAF;IAAe;EAAf,CAFkG,EAGlG,WAHkG,CAApG;EAMA,MAAM,OAAO,GAAG,aAAa,CAAC,WAAD,EAAc,GAAd,CAA7B;EAEA,MAAM;IAAE,WAAF;IAAe;EAAf,IAAmC,kBAAkB,CAAC,KAAD,CAA3D;EAEA,OAAO;IACL,UADK;IAEL,WAFK;IAGL,IAHK;IAIL,WAJK;IAKL,UALK;IAML,aANK;IAOL,QAPK;IAQL,mBAAmB,EAAE;MACnB,cADmB;MAEnB,WAFmB;MAGnB,cAHmB;MAInB;IAJmB,CARhB;IAeL,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,cAAc,EAAE,KAFN;MAGV,QAAQ,EAAE;IAHA,CAfP;IAqBL,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;MACjC,GAAG,EAAE,OAD4B;MAEjC,IAAI,EAAE,OAF2B;MAGjC,GAAG,eAH8B;MAIjC,GAAG,KAJ8B;MAKjC,GAAG;IAL8B,CAAR,CArBtB;IA6BL,cAAc,EAAE,gBAAgB,CAAC,cAAD,CA7B3B;IA8BL,QAAQ,EAAE;EA9BL,CAAP;AAgCD,CAjDM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useMergedRefs } 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 '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>)[]).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: 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', floatingAction } = 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 } = useCardSelectable(\n props,\n { referenceId, referenceLabel },\n cardBaseRef,\n );\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: getNativeElementProps('div', {\n ref: cardRef,\n role: 'group',\n ...focusAttributes,\n ...props,\n ...selectableCardProps,\n }),\n\n floatingAction: resolveShorthand(floatingAction),\n checkbox: checkboxSlot,\n };\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,2BAA2B;AAClG,SAASC,iBAAiB,EAAEC,cAAc,QAAQ,yBAAyB;AAG3E,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,SAASC,uBAAuB,QAAQ,eAAe;AAEvD,MAAMC,QAAQ,GAAG;EACfC,GAAG,EAAEC,SAAS;EACd,QAAQ,EAAE,oBAAoB;EAC9B,UAAU,EAAE,SAAS;EACrB,UAAU,EAAE;CACJ;AAEV;;;;;;;;AAQA,MAAMC,kBAAkB,GAAG,CAAC;EAAEC,SAAS,GAAG,KAAK;EAAE,GAAGC;AAAK,CAAa,KAAI;EACxE,MAAMC,WAAW,GAAI,CACnB,SAAS,EACT,eAAe,EACf,WAAW,EACX,aAAa,EACb,aAAa,EACb,eAAe,EACf,cAAc,EACd,YAAY,EACZ,aAAa,EACb,WAAW,CACoC,CAACC,IAAI,CAACC,IAAI,IAAIH,KAAK,CAACG,IAAI,CAAC,CAAC;EAE3E,MAAMC,aAAa,GAAGb,iBAAiB,CAAC;IACtCc,WAAW,EAAEV,QAAQ,CAACM,WAAW,GAAG,QAAQ,GAAGF,SAAS;GACzD,CAAC;EAEF,MAAMO,0BAA0B,GAAG;IACjC,GAAGF,aAAa;IAChBG,QAAQ,EAAE;GACX;EAED,OAAO;IACLN,WAAW;IACXO,eAAe,EAAET,SAAS,KAAK,KAAK,GAAG,IAAI,GAAGO;GAC/C;AACH,CAAC;AAED;;;;;;;;;AASA,OAAO,MAAMG,gBAAgB,GAAG,CAACT,KAAgB,EAAEU,GAA8B,KAAe;EAC9F,MAAM;IAAEC,UAAU,GAAG,QAAQ;IAAEC,WAAW,GAAG,UAAU;IAAEC,IAAI,GAAG,QAAQ;IAAEC;EAAc,CAAE,GAAGd,KAAK;EAElG,MAAM,CAACe,WAAW,EAAEC,cAAc,CAAC,GAAG7B,KAAK,CAAC8B,QAAQ,CAACvB,uBAAuB,CAACwB,mBAAmB,CAACH,WAAW,CAAC;EAC7G,MAAM,CAACI,cAAc,EAAEC,iBAAiB,CAAC,GAAGjC,KAAK,CAAC8B,QAAQ,CAACvB,uBAAuB,CAACwB,mBAAmB,CAACH,WAAW,CAAC;EAEnH,MAAMM,WAAW,GAAG7B,cAAc,EAAkB;EACpD,MAAM;IAAE8B,UAAU;IAAEC,QAAQ;IAAEC,mBAAmB;IAAEC,aAAa;IAAEC;EAAY,CAAE,GAAGjC,iBAAiB,CAClGO,KAAK,EACL;IAAEe,WAAW;IAAEI;EAAc,CAAE,EAC/BE,WAAW,CACZ;EAED,MAAMM,OAAO,GAAGrC,aAAa,CAAC+B,WAAW,EAAEX,GAAG,CAAC;EAE/C,MAAM;IAAET,WAAW;IAAEO;EAAe,CAAE,GAAGV,kBAAkB,CAACE,KAAK,CAAC;EAElE,OAAO;IACLW,UAAU;IACVC,WAAW;IACXC,IAAI;IACJZ,WAAW;IACXqB,UAAU;IACVG,aAAa;IACbF,QAAQ;IACRL,mBAAmB,EAAE;MACnBF,cAAc;MACdD,WAAW;MACXI,cAAc;MACdC;KACD;IAEDQ,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXf,cAAc,EAAE,KAAK;MACrBgB,QAAQ,EAAE;KACX;IAEDD,IAAI,EAAEzC,qBAAqB,CAAC,KAAK,EAAE;MACjCsB,GAAG,EAAEiB,OAAO;MACZI,IAAI,EAAE,OAAO;MACb,GAAGvB,eAAe;MAClB,GAAGR,KAAK;MACR,GAAGwB;KACJ,CAAC;IAEFV,cAAc,EAAEzB,gBAAgB,CAACyB,cAAc,CAAC;IAChDgB,QAAQ,EAAEJ;GACX;AACH,CAAC","names":["React","getNativeElementProps","resolveShorthand","useMergedRefs","useFocusableGroup","useFocusWithin","useCardSelectable","cardContextDefaultValue","focusMap","off","undefined","useCardInteractive","focusMode","props","interactive","some","prop","groupperAttrs","tabBehavior","interactiveFocusAttributes","tabIndex","focusAttributes","useCard_unstable","ref","appearance","orientation","size","floatingAction","referenceId","setReferenceId","useState","selectableA11yProps","referenceLabel","setReferenceLabel","cardBaseRef","selectable","selected","selectableCardProps","selectFocused","checkboxSlot","cardRef","components","root","checkbox","role"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/useCard.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useMergedRefs } 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 '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>)[]).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: 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', floatingAction } = 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 } = useCardSelectable(\n props,\n { referenceId, referenceLabel },\n cardBaseRef,\n );\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: getNativeElementProps('div', {\n ref: cardRef,\n role: 'group',\n ...focusAttributes,\n ...props,\n ...selectableCardProps,\n }),\n\n floatingAction: resolveShorthand(floatingAction),\n checkbox: checkboxSlot,\n };\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/useCardContextValue.ts"],"names":[],"mappings":"AAEA,OAAM,SAAU,mBAAV,CAA8B;EAAE;AAAF,CAA9B,EAAgE;EACpE,OAAO;IAAE;EAAF,CAAP;AACD","sourcesContent":["import type { CardContextValue, CardState } from './Card.types';\n\nexport function useCardContextValue({ selectableA11yProps }: CardState): CardContextValue {\n return { selectableA11yProps };\n}\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"AAEA,OAAM,SAAUA,mBAAmB,CAAC;EAAEC;AAAmB,CAAa;EACpE,OAAO;IAAEA;EAAmB,CAAE;AAChC","names":["useCardContextValue","selectableA11yProps"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/useCardContextValue.ts"],"sourcesContent":["import type { CardContextValue, CardState } from './Card.types';\n\nexport function useCardContextValue({ selectableA11yProps }: CardState): CardContextValue {\n return { selectableA11yProps };\n}\n"]}
@@ -14,7 +14,6 @@ import { useFocusFinders } from '@fluentui/react-tabster';
14
14
  * @param a11yProps - accessibility props shared between elements of the card
15
15
  * @param ref - reference to the root element of Card
16
16
  */
17
-
18
17
  export const useCardSelectable = (props, {
19
18
  referenceLabel,
20
19
  referenceId
@@ -39,7 +38,6 @@ export const useCardSelectable = (props, {
39
38
  if (!cardRef.current) {
40
39
  return false;
41
40
  }
42
-
43
41
  const focusableElements = findAllFocusable(cardRef.current);
44
42
  const target = event.target;
45
43
  const isElementInFocusableGroup = focusableElements.some(element => element.contains(target));
@@ -50,10 +48,8 @@ export const useCardSelectable = (props, {
50
48
  if (shouldRestrictTriggerAction(event)) {
51
49
  return;
52
50
  }
53
-
54
51
  const newCheckedValue = !isCardSelected;
55
52
  setIsCardSelected(newCheckedValue);
56
-
57
53
  if (onSelectionChange) {
58
54
  onSelectionChange(event, {
59
55
  selected: newCheckedValue
@@ -70,15 +66,12 @@ export const useCardSelectable = (props, {
70
66
  if (!isSelectable || !!floatingAction) {
71
67
  return;
72
68
  }
73
-
74
69
  const selectableCheckboxProps = {};
75
-
76
70
  if (referenceId) {
77
71
  selectableCheckboxProps['aria-labelledby'] = referenceId;
78
72
  } else if (referenceLabel) {
79
73
  selectableCheckboxProps['aria-label'] = referenceLabel;
80
74
  }
81
-
82
75
  return resolveShorthand(checkbox, {
83
76
  defaultProps: {
84
77
  ref: checkboxRef,
@@ -95,7 +88,6 @@ export const useCardSelectable = (props, {
95
88
  if (!isSelectable) {
96
89
  return null;
97
90
  }
98
-
99
91
  return {
100
92
  onClick: mergeCallbacks(onClick, onChangeHandler),
101
93
  onKeyDown: mergeCallbacks(onKeyDown, onKeyDownHandler)
@@ -1 +1 @@
1
- {"version":3,"sources":["packages/react-components/react-card/src/components/Card/useCardSelectable.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { mergeCallbacks, resolveShorthand } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\nimport type { CardContextValue, CardOnSelectionChangeEvent, CardProps, CardSlots } from './Card.types';\n\n/**\n * @internal\n *\n * Create the state related to selectable cards.\n *\n * This internal hook controls all the logic for selectable cards and is\n * intended to be used alongside with useCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param a11yProps - accessibility props shared between elements of the card\n * @param ref - reference to the root element of Card\n */\nexport const useCardSelectable = (\n props: CardProps,\n { referenceLabel, referenceId }: Pick<CardContextValue['selectableA11yProps'], 'referenceId' | 'referenceLabel'>,\n cardRef: React.RefObject<HTMLDivElement>,\n) => {\n const { checkbox = {}, selected, defaultSelected, onSelectionChange, floatingAction, onClick, onKeyDown } = props;\n\n const { findAllFocusable } = useFocusFinders();\n\n const checkboxRef = React.useRef<HTMLInputElement>(null);\n\n const isSelectable = [selected, defaultSelected, onSelectionChange].some(prop => typeof prop !== 'undefined');\n\n const [isCardSelected, setIsCardSelected] = React.useState(false);\n const [isSelectFocused, setIsSelectFocused] = React.useState(false);\n\n const shouldRestrictTriggerAction = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (!cardRef.current) {\n return false;\n }\n\n const focusableElements = findAllFocusable(cardRef.current);\n const target = event.target as HTMLElement;\n const isElementInFocusableGroup = focusableElements.some(element => element.contains(target));\n const isCheckboxSlot = checkboxRef?.current === target;\n\n return isElementInFocusableGroup && !isCheckboxSlot;\n },\n [cardRef, findAllFocusable],\n );\n\n const onChangeHandler = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (shouldRestrictTriggerAction(event)) {\n return;\n }\n\n const newCheckedValue = !isCardSelected;\n\n setIsCardSelected(newCheckedValue);\n\n if (onSelectionChange) {\n onSelectionChange(event, { selected: newCheckedValue });\n }\n },\n [onSelectionChange, isCardSelected, shouldRestrictTriggerAction],\n );\n\n const onKeyDownHandler = React.useCallback(\n (event: React.KeyboardEvent<HTMLElement>) => {\n if ([Enter, Space].includes(event.key)) {\n event.preventDefault();\n onChangeHandler(event);\n }\n },\n [onChangeHandler],\n );\n\n const checkboxSlot = React.useMemo(() => {\n if (!isSelectable || !!floatingAction) {\n return;\n }\n\n const selectableCheckboxProps: CardSlots['checkbox'] = {};\n\n if (referenceId) {\n selectableCheckboxProps['aria-labelledby'] = referenceId;\n } else if (referenceLabel) {\n selectableCheckboxProps['aria-label'] = referenceLabel;\n }\n\n return resolveShorthand(checkbox, {\n defaultProps: {\n ref: checkboxRef,\n type: 'checkbox',\n checked: isCardSelected,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => onChangeHandler(event),\n onFocus: () => setIsSelectFocused(true),\n onBlur: () => setIsSelectFocused(false),\n ...selectableCheckboxProps,\n },\n });\n }, [isSelectable, floatingAction, referenceId, referenceLabel, checkbox, isCardSelected, onChangeHandler]);\n\n const selectableCardProps = React.useMemo(() => {\n if (!isSelectable) {\n return null;\n }\n\n return {\n onClick: mergeCallbacks(onClick, onChangeHandler),\n onKeyDown: mergeCallbacks(onKeyDown, onKeyDownHandler),\n };\n }, [isSelectable, onChangeHandler, onClick, onKeyDown, onKeyDownHandler]);\n\n React.useEffect(() => setIsCardSelected(Boolean(defaultSelected ?? selected)), [\n defaultSelected,\n selected,\n setIsCardSelected,\n ]);\n\n return {\n selected: isCardSelected,\n selectable: isSelectable,\n selectFocused: isSelectFocused,\n selectableCardProps,\n checkboxSlot,\n };\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"mappings":"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","names":["React","Enter","Space","mergeCallbacks","resolveShorthand","useFocusFinders","useCardSelectable","props","referenceLabel","referenceId","cardRef","checkbox","selected","defaultSelected","onSelectionChange","floatingAction","onClick","onKeyDown","findAllFocusable","checkboxRef","useRef","isSelectable","some","prop","isCardSelected","setIsCardSelected","useState","isSelectFocused","setIsSelectFocused","shouldRestrictTriggerAction","useCallback","event","current","focusableElements","target","isElementInFocusableGroup","element","contains","isCheckboxSlot","onChangeHandler","newCheckedValue","onKeyDownHandler","includes","key","preventDefault","checkboxSlot","useMemo","selectableCheckboxProps","defaultProps","ref","type","checked","onChange","onFocus","onBlur","selectableCardProps","useEffect","Boolean","selectable","selectFocused"],"sourceRoot":"../src/","sources":["packages/react-components/react-card/src/components/Card/useCardSelectable.ts"],"sourcesContent":["import * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { mergeCallbacks, resolveShorthand } from '@fluentui/react-utilities';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\nimport type { CardContextValue, CardOnSelectionChangeEvent, CardProps, CardSlots } from './Card.types';\n\n/**\n * @internal\n *\n * Create the state related to selectable cards.\n *\n * This internal hook controls all the logic for selectable cards and is\n * intended to be used alongside with useCard_unstable.\n *\n * @param props - props from this instance of Card\n * @param a11yProps - accessibility props shared between elements of the card\n * @param ref - reference to the root element of Card\n */\nexport const useCardSelectable = (\n props: CardProps,\n { referenceLabel, referenceId }: Pick<CardContextValue['selectableA11yProps'], 'referenceId' | 'referenceLabel'>,\n cardRef: React.RefObject<HTMLDivElement>,\n) => {\n const { checkbox = {}, selected, defaultSelected, onSelectionChange, floatingAction, onClick, onKeyDown } = props;\n\n const { findAllFocusable } = useFocusFinders();\n\n const checkboxRef = React.useRef<HTMLInputElement>(null);\n\n const isSelectable = [selected, defaultSelected, onSelectionChange].some(prop => typeof prop !== 'undefined');\n\n const [isCardSelected, setIsCardSelected] = React.useState(false);\n const [isSelectFocused, setIsSelectFocused] = React.useState(false);\n\n const shouldRestrictTriggerAction = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (!cardRef.current) {\n return false;\n }\n\n const focusableElements = findAllFocusable(cardRef.current);\n const target = event.target as HTMLElement;\n const isElementInFocusableGroup = focusableElements.some(element => element.contains(target));\n const isCheckboxSlot = checkboxRef?.current === target;\n\n return isElementInFocusableGroup && !isCheckboxSlot;\n },\n [cardRef, findAllFocusable],\n );\n\n const onChangeHandler = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (shouldRestrictTriggerAction(event)) {\n return;\n }\n\n const newCheckedValue = !isCardSelected;\n\n setIsCardSelected(newCheckedValue);\n\n if (onSelectionChange) {\n onSelectionChange(event, { selected: newCheckedValue });\n }\n },\n [onSelectionChange, isCardSelected, shouldRestrictTriggerAction],\n );\n\n const onKeyDownHandler = React.useCallback(\n (event: React.KeyboardEvent<HTMLElement>) => {\n if ([Enter, Space].includes(event.key)) {\n event.preventDefault();\n onChangeHandler(event);\n }\n },\n [onChangeHandler],\n );\n\n const checkboxSlot = React.useMemo(() => {\n if (!isSelectable || !!floatingAction) {\n return;\n }\n\n const selectableCheckboxProps: CardSlots['checkbox'] = {};\n\n if (referenceId) {\n selectableCheckboxProps['aria-labelledby'] = referenceId;\n } else if (referenceLabel) {\n selectableCheckboxProps['aria-label'] = referenceLabel;\n }\n\n return resolveShorthand(checkbox, {\n defaultProps: {\n ref: checkboxRef,\n type: 'checkbox',\n checked: isCardSelected,\n onChange: (event: React.ChangeEvent<HTMLInputElement>) => onChangeHandler(event),\n onFocus: () => setIsSelectFocused(true),\n onBlur: () => setIsSelectFocused(false),\n ...selectableCheckboxProps,\n },\n });\n }, [isSelectable, floatingAction, referenceId, referenceLabel, checkbox, isCardSelected, onChangeHandler]);\n\n const selectableCardProps = React.useMemo(() => {\n if (!isSelectable) {\n return null;\n }\n\n return {\n onClick: mergeCallbacks(onClick, onChangeHandler),\n onKeyDown: mergeCallbacks(onKeyDown, onKeyDownHandler),\n };\n }, [isSelectable, onChangeHandler, onClick, onKeyDown, onKeyDownHandler]);\n\n React.useEffect(() => setIsCardSelected(Boolean(defaultSelected ?? selected)), [\n defaultSelected,\n selected,\n setIsCardSelected,\n ]);\n\n return {\n selected: isCardSelected,\n selectable: isSelectable,\n selectFocused: isSelectFocused,\n selectableCardProps,\n checkboxSlot,\n };\n};\n"]}