@fluentui/react-card 9.7.0 → 9.7.2

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 (139) hide show
  1. package/CHANGELOG.md +31 -2
  2. package/dist/index.d.cts +485 -0
  3. package/lib/Card.js +1 -1
  4. package/lib/Card.js.map +1 -1
  5. package/lib/CardFooter.js +1 -1
  6. package/lib/CardFooter.js.map +1 -1
  7. package/lib/CardHeader.js +1 -1
  8. package/lib/CardHeader.js.map +1 -1
  9. package/lib/CardPreview.js +1 -1
  10. package/lib/CardPreview.js.map +1 -1
  11. package/lib/components/Card/Card.js +6 -6
  12. package/lib/components/Card/Card.js.map +1 -1
  13. package/lib/components/Card/CardContext.js +1 -1
  14. package/lib/components/Card/index.js +5 -5
  15. package/lib/components/Card/index.js.map +1 -1
  16. package/lib/components/Card/renderCard.js +2 -2
  17. package/lib/components/Card/renderCard.js.map +1 -1
  18. package/lib/components/Card/useCard.js +5 -5
  19. package/lib/components/Card/useCard.js.map +1 -1
  20. package/lib/components/Card/useCardSelectable.js +3 -3
  21. package/lib/components/Card/useCardStyles.styles.js +8 -10
  22. package/lib/components/Card/useCardStyles.styles.js.map +1 -1
  23. package/lib/components/Card/useCardStyles.styles.raw.js +8 -9
  24. package/lib/components/Card/useCardStyles.styles.raw.js.map +1 -1
  25. package/lib/components/CardFooter/CardFooter.js +5 -5
  26. package/lib/components/CardFooter/CardFooter.js.map +1 -1
  27. package/lib/components/CardFooter/index.js +4 -4
  28. package/lib/components/CardFooter/index.js.map +1 -1
  29. package/lib/components/CardFooter/renderCardFooter.js +1 -1
  30. package/lib/components/CardFooter/useCardFooter.js +1 -1
  31. package/lib/components/CardFooter/useCardFooterStyles.styles.js +1 -3
  32. package/lib/components/CardFooter/useCardFooterStyles.styles.js.map +1 -1
  33. package/lib/components/CardFooter/useCardFooterStyles.styles.raw.js +1 -2
  34. package/lib/components/CardFooter/useCardFooterStyles.styles.raw.js.map +1 -1
  35. package/lib/components/CardHeader/CardHeader.js +5 -5
  36. package/lib/components/CardHeader/CardHeader.js.map +1 -1
  37. package/lib/components/CardHeader/index.js +4 -4
  38. package/lib/components/CardHeader/index.js.map +1 -1
  39. package/lib/components/CardHeader/renderCardHeader.js +1 -1
  40. package/lib/components/CardHeader/useCardHeader.js +3 -3
  41. package/lib/components/CardHeader/useCardHeader.js.map +1 -1
  42. package/lib/components/CardHeader/useCardHeaderStyles.styles.js +1 -3
  43. package/lib/components/CardHeader/useCardHeaderStyles.styles.js.map +1 -1
  44. package/lib/components/CardHeader/useCardHeaderStyles.styles.raw.js +1 -2
  45. package/lib/components/CardHeader/useCardHeaderStyles.styles.raw.js.map +1 -1
  46. package/lib/components/CardPreview/CardPreview.js +5 -5
  47. package/lib/components/CardPreview/CardPreview.js.map +1 -1
  48. package/lib/components/CardPreview/index.js +4 -4
  49. package/lib/components/CardPreview/index.js.map +1 -1
  50. package/lib/components/CardPreview/renderCardPreview.js +1 -1
  51. package/lib/components/CardPreview/useCardPreview.js +3 -3
  52. package/lib/components/CardPreview/useCardPreview.js.map +1 -1
  53. package/lib/components/CardPreview/useCardPreviewStyles.styles.js +1 -3
  54. package/lib/components/CardPreview/useCardPreviewStyles.styles.js.map +1 -1
  55. package/lib/components/CardPreview/useCardPreviewStyles.styles.raw.js +1 -2
  56. package/lib/components/CardPreview/useCardPreviewStyles.styles.raw.js.map +1 -1
  57. package/lib/index.js +5 -5
  58. package/lib/index.js.map +1 -1
  59. package/lib-commonjs/{Card.js → Card.cjs} +1 -1
  60. package/lib-commonjs/{Card.js.map → Card.cjs.map} +1 -1
  61. package/lib-commonjs/{CardFooter.js → CardFooter.cjs} +1 -1
  62. package/lib-commonjs/{CardFooter.js.map → CardFooter.cjs.map} +1 -1
  63. package/lib-commonjs/{CardHeader.js → CardHeader.cjs} +1 -1
  64. package/lib-commonjs/{CardHeader.js.map → CardHeader.cjs.map} +1 -1
  65. package/lib-commonjs/{CardPreview.js → CardPreview.cjs} +1 -1
  66. package/lib-commonjs/{CardPreview.js.map → CardPreview.cjs.map} +1 -1
  67. package/lib-commonjs/components/Card/{Card.js → Card.cjs} +4 -4
  68. package/lib-commonjs/components/Card/{Card.js.map → Card.cjs.map} +1 -1
  69. package/lib-commonjs/components/Card/{index.js → index.cjs} +5 -5
  70. package/lib-commonjs/components/Card/{index.js.map → index.cjs.map} +1 -1
  71. package/lib-commonjs/components/Card/{renderCard.js → renderCard.cjs} +1 -1
  72. package/lib-commonjs/components/Card/{renderCard.js.map → renderCard.cjs.map} +1 -1
  73. package/lib-commonjs/components/Card/{useCard.js → useCard.cjs} +2 -2
  74. package/lib-commonjs/components/Card/{useCard.js.map → useCard.cjs.map} +1 -1
  75. package/lib-commonjs/components/Card/{useCardStyles.styles.js → useCardStyles.styles.cjs} +0 -1
  76. package/lib-commonjs/components/Card/useCardStyles.styles.cjs.map +1 -0
  77. package/lib-commonjs/components/Card/{useCardStyles.styles.raw.js → useCardStyles.styles.raw.cjs} +3 -4
  78. package/lib-commonjs/components/Card/useCardStyles.styles.raw.cjs.map +1 -0
  79. package/lib-commonjs/components/CardFooter/{CardFooter.js → CardFooter.cjs} +3 -3
  80. package/lib-commonjs/components/CardFooter/{CardFooter.js.map → CardFooter.cjs.map} +1 -1
  81. package/lib-commonjs/components/CardFooter/{index.js → index.cjs} +4 -4
  82. package/lib-commonjs/components/CardFooter/{index.js.map → index.cjs.map} +1 -1
  83. package/lib-commonjs/components/CardFooter/{useCardFooterStyles.styles.js → useCardFooterStyles.styles.cjs} +0 -1
  84. package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.cjs.map +1 -0
  85. package/lib-commonjs/components/CardFooter/{useCardFooterStyles.styles.raw.js → useCardFooterStyles.styles.raw.cjs} +0 -1
  86. package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.raw.cjs.map +1 -0
  87. package/lib-commonjs/components/CardHeader/{CardHeader.js → CardHeader.cjs} +3 -3
  88. package/lib-commonjs/components/CardHeader/{CardHeader.js.map → CardHeader.cjs.map} +1 -1
  89. package/lib-commonjs/components/CardHeader/{index.js → index.cjs} +4 -4
  90. package/lib-commonjs/components/CardHeader/{index.js.map → index.cjs.map} +1 -1
  91. package/lib-commonjs/components/CardHeader/{useCardHeader.js → useCardHeader.cjs} +1 -1
  92. package/lib-commonjs/components/CardHeader/{useCardHeader.js.map → useCardHeader.cjs.map} +1 -1
  93. package/lib-commonjs/components/CardHeader/{useCardHeaderStyles.styles.js → useCardHeaderStyles.styles.cjs} +0 -1
  94. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.cjs.map +1 -0
  95. package/lib-commonjs/components/CardHeader/{useCardHeaderStyles.styles.raw.js → useCardHeaderStyles.styles.raw.cjs} +0 -1
  96. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.raw.cjs.map +1 -0
  97. package/lib-commonjs/components/CardPreview/{CardPreview.js → CardPreview.cjs} +3 -3
  98. package/lib-commonjs/components/CardPreview/{CardPreview.js.map → CardPreview.cjs.map} +1 -1
  99. package/lib-commonjs/components/CardPreview/{index.js → index.cjs} +4 -4
  100. package/lib-commonjs/components/CardPreview/{index.js.map → index.cjs.map} +1 -1
  101. package/lib-commonjs/components/CardPreview/{useCardPreview.js → useCardPreview.cjs} +1 -1
  102. package/lib-commonjs/components/CardPreview/{useCardPreview.js.map → useCardPreview.cjs.map} +1 -1
  103. package/lib-commonjs/components/CardPreview/{useCardPreviewStyles.styles.js → useCardPreviewStyles.styles.cjs} +0 -1
  104. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.cjs.map +1 -0
  105. package/lib-commonjs/components/CardPreview/{useCardPreviewStyles.styles.raw.js → useCardPreviewStyles.styles.raw.cjs} +0 -1
  106. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.raw.cjs.map +1 -0
  107. package/lib-commonjs/{index.js → index.cjs} +4 -4
  108. package/lib-commonjs/{index.js.map → index.cjs.map} +1 -1
  109. package/package.json +20 -15
  110. package/lib-commonjs/components/Card/useCardStyles.styles.js.map +0 -1
  111. package/lib-commonjs/components/Card/useCardStyles.styles.raw.js.map +0 -1
  112. package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.js.map +0 -1
  113. package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.raw.js.map +0 -1
  114. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.js.map +0 -1
  115. package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.raw.js.map +0 -1
  116. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.js.map +0 -1
  117. package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.raw.js.map +0 -1
  118. /package/lib-commonjs/components/Card/{Card.types.js → Card.types.cjs} +0 -0
  119. /package/lib-commonjs/components/Card/{Card.types.js.map → Card.types.cjs.map} +0 -0
  120. /package/lib-commonjs/components/Card/{CardContext.js → CardContext.cjs} +0 -0
  121. /package/lib-commonjs/components/Card/{CardContext.js.map → CardContext.cjs.map} +0 -0
  122. /package/lib-commonjs/components/Card/{useCardContextValue.js → useCardContextValue.cjs} +0 -0
  123. /package/lib-commonjs/components/Card/{useCardContextValue.js.map → useCardContextValue.cjs.map} +0 -0
  124. /package/lib-commonjs/components/Card/{useCardSelectable.js → useCardSelectable.cjs} +0 -0
  125. /package/lib-commonjs/components/Card/{useCardSelectable.js.map → useCardSelectable.cjs.map} +0 -0
  126. /package/lib-commonjs/components/CardFooter/{CardFooter.types.js → CardFooter.types.cjs} +0 -0
  127. /package/lib-commonjs/components/CardFooter/{CardFooter.types.js.map → CardFooter.types.cjs.map} +0 -0
  128. /package/lib-commonjs/components/CardFooter/{renderCardFooter.js → renderCardFooter.cjs} +0 -0
  129. /package/lib-commonjs/components/CardFooter/{renderCardFooter.js.map → renderCardFooter.cjs.map} +0 -0
  130. /package/lib-commonjs/components/CardFooter/{useCardFooter.js → useCardFooter.cjs} +0 -0
  131. /package/lib-commonjs/components/CardFooter/{useCardFooter.js.map → useCardFooter.cjs.map} +0 -0
  132. /package/lib-commonjs/components/CardHeader/{CardHeader.types.js → CardHeader.types.cjs} +0 -0
  133. /package/lib-commonjs/components/CardHeader/{CardHeader.types.js.map → CardHeader.types.cjs.map} +0 -0
  134. /package/lib-commonjs/components/CardHeader/{renderCardHeader.js → renderCardHeader.cjs} +0 -0
  135. /package/lib-commonjs/components/CardHeader/{renderCardHeader.js.map → renderCardHeader.cjs.map} +0 -0
  136. /package/lib-commonjs/components/CardPreview/{CardPreview.types.js → CardPreview.types.cjs} +0 -0
  137. /package/lib-commonjs/components/CardPreview/{CardPreview.types.js.map → CardPreview.types.cjs.map} +0 -0
  138. /package/lib-commonjs/components/CardPreview/{renderCardPreview.js → renderCardPreview.cjs} +0 -0
  139. /package/lib-commonjs/components/CardPreview/{renderCardPreview.js.map → renderCardPreview.cjs.map} +0 -0
@@ -1,9 +1,9 @@
1
1
  'use client';
2
- import * as React from 'react';
3
- import { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';
4
- import { useFocusableGroup, useFocusFinders, useFocusWithin } from '@fluentui/react-tabster';
5
- import { useCardSelectable } from './useCardSelectable';
6
- import { cardContextDefaultValue } from './CardContext';
2
+ import * as React from "react";
3
+ import { getIntrinsicElementProps, useMergedRefs, slot } from "@fluentui/react-utilities";
4
+ import { useFocusableGroup, useFocusFinders, useFocusWithin } from "@fluentui/react-tabster";
5
+ import { useCardSelectable } from "./useCardSelectable.js";
6
+ import { cardContextDefaultValue } from "./CardContext.js";
7
7
  const focusMap = {
8
8
  off: undefined,
9
9
  'no-tab': 'limited-trap-focus',
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Card/useCard.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusFinders, useFocusWithin } from '@fluentui/react-tabster';\n\nimport type { CardBaseProps, CardBaseState, CardOnSelectionChangeEvent, 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\nconst interactiveEventProps = [\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\n/**\n * Compute whether a Card is interactive based on the presence of pointer/mouse\n * event props and the disabled flag. This intentionally does not depend on\n * focus management utilities so it can be used from headless contexts.\n */\nconst computeInteractive = (props: CardProps): boolean => {\n if (props.disabled) {\n return false;\n }\n\n return interactiveEventProps.some(prop => props[prop] !== undefined);\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', ...cardProps } = props;\n const { disabled = false, focusMode: focusModeProp } = props;\n\n // Focus-within ref drives the styled focus outline; merged with the user ref\n // before being passed down so the base hook does not depend on react-tabster.\n const focusWithinRef = useFocusWithin<HTMLDivElement>();\n const cardRef = useMergedRefs(focusWithinRef, ref);\n\n // Focus-aware predicate that prevents toggling the selection when the user\n // interacts with an inner focusable element.\n const { findAllFocusable } = useFocusFinders();\n const shouldRestrictTriggerAction = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (!focusWithinRef.current) {\n return false;\n }\n\n const focusableElements = findAllFocusable(focusWithinRef.current);\n const target = event.target as HTMLElement;\n\n return focusableElements.some(element => element.contains(target));\n },\n [findAllFocusable, focusWithinRef],\n );\n\n const interactive = computeInteractive(props);\n const focusMode = focusModeProp ?? (interactive ? 'no-tab' : 'off');\n const groupperAttrs = useFocusableGroup({\n tabBehavior: focusMap[focusMode],\n });\n\n const state = useCardBase_unstable(\n {\n shouldRestrictTriggerAction,\n ...cardProps,\n },\n cardRef,\n );\n\n // Apply focusable-group attributes only when the card is not selectable, not\n // disabled and the focus mode is enabled.\n const shouldApplyFocusAttributes = !disabled && !state.selectable && focusMode !== 'off';\n if (shouldApplyFocusAttributes) {\n Object.assign(state.root, groupperAttrs, { tabIndex: 0 });\n }\n\n return {\n ...state,\n appearance,\n orientation,\n size,\n };\n};\n\n/**\n * Base hook for Card component, which manages state related to interactivity, selection,\n * ARIA attributes, and slot structure without design props or focus management.\n *\n * This hook is intentionally free of `@fluentui/react-tabster` so that it can be\n * consumed by headless component packages. Focus management (focusable group\n * attributes, focus-within, focus-restriction predicate) is layered on top in\n * `useCard_unstable`.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n * @param options - optional behavior overrides such as a focus-aware restriction predicate\n */\nexport const useCardBase_unstable = (props: CardBaseProps, ref: React.Ref<HTMLDivElement>): CardBaseState => {\n const { disabled = false, ...restProps } = props;\n\n const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n\n const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } =\n useCardSelectable(props, { referenceId, referenceLabel });\n\n const interactive = computeInteractive(props);\n\n let cardRootProps = {\n ...restProps,\n ...selectableCardProps,\n };\n\n if (disabled) {\n cardRootProps = {\n ...restProps,\n 'aria-disabled': true,\n onClick: undefined,\n };\n }\n\n return {\n interactive,\n selectable,\n selectFocused,\n selected,\n disabled,\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,\n role: 'group',\n ...cardRootProps,\n }),\n { elementType: 'div' },\n ),\n\n floatingAction: floatingActionSlot,\n checkbox: checkboxSlot,\n };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","slot","useFocusableGroup","useFocusFinders","useFocusWithin","useCardSelectable","cardContextDefaultValue","focusMap","off","undefined","interactiveEventProps","computeInteractive","props","disabled","some","prop","useCard_unstable","ref","appearance","orientation","size","cardProps","focusMode","focusModeProp","focusWithinRef","cardRef","findAllFocusable","shouldRestrictTriggerAction","useCallback","event","current","focusableElements","target","element","contains","interactive","groupperAttrs","tabBehavior","state","useCardBase_unstable","shouldApplyFocusAttributes","selectable","Object","assign","root","tabIndex","restProps","referenceId","setReferenceId","useState","selectableA11yProps","referenceLabel","setReferenceLabel","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","cardRootProps","onClick","components","floatingAction","checkbox","always","role","elementType"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Card/useCard.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useFocusableGroup, useFocusFinders, useFocusWithin } from '@fluentui/react-tabster';\n\nimport type { CardBaseProps, CardBaseState, CardOnSelectionChangeEvent, 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\nconst interactiveEventProps = [\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\n/**\n * Compute whether a Card is interactive based on the presence of pointer/mouse\n * event props and the disabled flag. This intentionally does not depend on\n * focus management utilities so it can be used from headless contexts.\n */\nconst computeInteractive = (props: CardProps): boolean => {\n if (props.disabled) {\n return false;\n }\n\n return interactiveEventProps.some(prop => props[prop] !== undefined);\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', ...cardProps } = props;\n const { disabled = false, focusMode: focusModeProp } = props;\n\n // Focus-within ref drives the styled focus outline; merged with the user ref\n // before being passed down so the base hook does not depend on react-tabster.\n const focusWithinRef = useFocusWithin<HTMLDivElement>();\n const cardRef = useMergedRefs(focusWithinRef, ref);\n\n // Focus-aware predicate that prevents toggling the selection when the user\n // interacts with an inner focusable element.\n const { findAllFocusable } = useFocusFinders();\n const shouldRestrictTriggerAction = React.useCallback(\n (event: CardOnSelectionChangeEvent) => {\n if (!focusWithinRef.current) {\n return false;\n }\n\n const focusableElements = findAllFocusable(focusWithinRef.current);\n const target = event.target as HTMLElement;\n\n return focusableElements.some(element => element.contains(target));\n },\n [findAllFocusable, focusWithinRef],\n );\n\n const interactive = computeInteractive(props);\n const focusMode = focusModeProp ?? (interactive ? 'no-tab' : 'off');\n const groupperAttrs = useFocusableGroup({\n tabBehavior: focusMap[focusMode],\n });\n\n const state = useCardBase_unstable(\n {\n shouldRestrictTriggerAction,\n ...cardProps,\n },\n cardRef,\n );\n\n // Apply focusable-group attributes only when the card is not selectable, not\n // disabled and the focus mode is enabled.\n const shouldApplyFocusAttributes = !disabled && !state.selectable && focusMode !== 'off';\n if (shouldApplyFocusAttributes) {\n Object.assign(state.root, groupperAttrs, { tabIndex: 0 });\n }\n\n return {\n ...state,\n appearance,\n orientation,\n size,\n };\n};\n\n/**\n * Base hook for Card component, which manages state related to interactivity, selection,\n * ARIA attributes, and slot structure without design props or focus management.\n *\n * This hook is intentionally free of `@fluentui/react-tabster` so that it can be\n * consumed by headless component packages. Focus management (focusable group\n * attributes, focus-within, focus-restriction predicate) is layered on top in\n * `useCard_unstable`.\n *\n * @param props - props from this instance of Card\n * @param ref - reference to the root element of Card\n * @param options - optional behavior overrides such as a focus-aware restriction predicate\n */\nexport const useCardBase_unstable = (props: CardBaseProps, ref: React.Ref<HTMLDivElement>): CardBaseState => {\n const { disabled = false, ...restProps } = props;\n\n const [referenceId, setReferenceId] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n const [referenceLabel, setReferenceLabel] = React.useState(cardContextDefaultValue.selectableA11yProps.referenceId);\n\n const { selectable, selected, selectableCardProps, selectFocused, checkboxSlot, floatingActionSlot } =\n useCardSelectable(props, { referenceId, referenceLabel });\n\n const interactive = computeInteractive(props);\n\n let cardRootProps = {\n ...restProps,\n ...selectableCardProps,\n };\n\n if (disabled) {\n cardRootProps = {\n ...restProps,\n 'aria-disabled': true,\n onClick: undefined,\n };\n }\n\n return {\n interactive,\n selectable,\n selectFocused,\n selected,\n disabled,\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,\n role: 'group',\n ...cardRootProps,\n }),\n { elementType: 'div' },\n ),\n\n floatingAction: floatingActionSlot,\n checkbox: checkboxSlot,\n };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","slot","useFocusableGroup","useFocusFinders","useFocusWithin","useCardSelectable","cardContextDefaultValue","focusMap","off","undefined","interactiveEventProps","computeInteractive","props","disabled","some","prop","useCard_unstable","ref","appearance","orientation","size","cardProps","focusMode","focusModeProp","focusWithinRef","cardRef","findAllFocusable","shouldRestrictTriggerAction","useCallback","event","current","focusableElements","target","element","contains","interactive","groupperAttrs","tabBehavior","state","useCardBase_unstable","shouldApplyFocusAttributes","selectable","Object","assign","root","tabIndex","restProps","referenceId","setReferenceId","useState","selectableA11yProps","referenceLabel","setReferenceLabel","selected","selectableCardProps","selectFocused","checkboxSlot","floatingActionSlot","cardRootProps","onClick","components","floatingAction","checkbox","always","role","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAC1F,SAASC,iBAAiB,EAAEC,eAAe,EAAEC,cAAc,QAAQ,0BAA0B;AAG7F,SAASC,iBAAiB,QAAQ,yBAAsB;AACxD,SAASC,uBAAuB,QAAQ,mBAAgB;AAExD,MAAMC,WAAW;IACfC,KAAKC;IACL,UAAU;IACV,YAAY;IACZ,YAAY;AACd;AAEA,MAAMC,wBAAwB;IAC5B;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AAED;;;;CAIC,GACD,MAAMC,qBAAqB,CAACC;IAC1B,IAAIA,MAAMC,QAAQ,EAAE;QAClB,OAAO;IACT;IAEA,OAAOH,sBAAsBI,IAAI,CAACC,CAAAA,OAAQH,KAAK,CAACG,KAAK,KAAKN;AAC5D;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMO,mBAAmB,CAACJ,OAAkBK;IACjD,MAAM,EAAEC,aAAa,QAAQ,EAAEC,cAAc,UAAU,EAAEC,OAAO,QAAQ,EAAE,GAAGC,WAAW,GAAGT;IAC3F,MAAM,EAAEC,WAAW,KAAK,EAAES,WAAWC,aAAa,EAAE,GAAGX;IAEvD,6EAA6E;IAC7E,8EAA8E;IAC9E,MAAMY,iBAAiBpB;IACvB,MAAMqB,UAAUzB,cAAcwB,gBAAgBP;IAE9C,2EAA2E;IAC3E,6CAA6C;IAC7C,MAAM,EAAES,gBAAgB,EAAE,GAAGvB;IAC7B,MAAMwB,8BAA8B7B,MAAM8B,WAAW,CACnD,CAACC;QACC,IAAI,CAACL,eAAeM,OAAO,EAAE;YAC3B,OAAO;QACT;QAEA,MAAMC,oBAAoBL,iBAAiBF,eAAeM,OAAO;QACjE,MAAME,SAASH,MAAMG,MAAM;QAE3B,OAAOD,kBAAkBjB,IAAI,CAACmB,CAAAA,UAAWA,QAAQC,QAAQ,CAACF;IAC5D,GACA;QAACN;QAAkBF;KAAe;IAGpC,MAAMW,cAAcxB,mBAAmBC;IACvC,MAAMU,YAAYC,0BAAAA,2BAAAA,gBAAkBY,cAAc,WAAW;IAC7D,MAAMC,gBAAgBlC,kBAAkB;QACtCmC,aAAa9B,QAAQ,CAACe,UAAU;IAClC;IAEA,MAAMgB,QAAQC,qBACZ;QACEZ;QACA,GAAGN,SAAS;IACd,GACAI;IAGF,6EAA6E;IAC7E,0CAA0C;IAC1C,MAAMe,6BAA6B,CAAC3B,YAAY,CAACyB,MAAMG,UAAU,IAAInB,cAAc;IACnF,IAAIkB,4BAA4B;QAC9BE,OAAOC,MAAM,CAACL,MAAMM,IAAI,EAAER,eAAe;YAAES,UAAU;QAAE;IACzD;IAEA,OAAO;QACL,GAAGP,KAAK;QACRpB;QACAC;QACAC;IACF;AACF,EAAE;AAEF;;;;;;;;;;;;CAYC,GACD,OAAO,MAAMmB,uBAAuB,CAAC3B,OAAsBK;IACzD,MAAM,EAAEJ,WAAW,KAAK,EAAE,GAAGiC,WAAW,GAAGlC;IAE3C,MAAM,CAACmC,aAAaC,eAAe,GAAGlD,MAAMmD,QAAQ,CAAC3C,wBAAwB4C,mBAAmB,CAACH,WAAW;IAC5G,MAAM,CAACI,gBAAgBC,kBAAkB,GAAGtD,MAAMmD,QAAQ,CAAC3C,wBAAwB4C,mBAAmB,CAACH,WAAW;IAElH,MAAM,EAAEN,UAAU,EAAEY,QAAQ,EAAEC,mBAAmB,EAAEC,aAAa,EAAEC,YAAY,EAAEC,kBAAkB,EAAE,GAClGpD,kBAAkBO,OAAO;QAAEmC;QAAaI;IAAe;IAEzD,MAAMhB,cAAcxB,mBAAmBC;IAEvC,IAAI8C,gBAAgB;QAClB,GAAGZ,SAAS;QACZ,GAAGQ,mBAAmB;IACxB;IAEA,IAAIzC,UAAU;QACZ6C,gBAAgB;YACd,GAAGZ,SAAS;YACZ,iBAAiB;YACjBa,SAASlD;QACX;IACF;IAEA,OAAO;QACL0B;QACAM;QACAc;QACAF;QACAxC;QACAqC,qBAAqB;YACnBF;YACAD;YACAI;YACAC;QACF;QAEAQ,YAAY;YACVhB,MAAM;YACNiB,gBAAgB;YAChBC,UAAU;QACZ;QAEAlB,MAAM3C,KAAK8D,MAAM,CACfhE,yBAAyB,OAAO;YAC9BkB;YACA+C,MAAM;YACN,GAAGN,aAAa;QAClB,IACA;YAAEO,aAAa;QAAM;QAGvBJ,gBAAgBJ;QAChBK,UAAUN;IACZ;AACF,EAAE"}
@@ -1,7 +1,7 @@
1
1
  'use client';
2
- import * as React from 'react';
3
- import { mergeCallbacks, slot, useControllableState } from '@fluentui/react-utilities';
4
- import { Enter } from '@fluentui/keyboard-keys';
2
+ import * as React from "react";
3
+ import { mergeCallbacks, slot, useControllableState } from "@fluentui/react-utilities";
4
+ import { Enter } from "@fluentui/keyboard-keys";
5
5
  /**
6
6
  * Create the state related to selectable cards.
7
7
  *
@@ -1,13 +1,13 @@
1
1
  'use client';
2
2
 
3
- import * as React from 'react';
4
- import { shorthands, __styles, mergeClasses, __resetStyles } from '@griffel/react';
5
- import { tokens } from '@fluentui/react-theme';
6
- import { textClassNames } from '@fluentui/react-text';
7
- import { createFocusOutlineStyle } from '@fluentui/react-tabster';
8
- import { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';
9
- import { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';
10
- import { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';
3
+ import * as React from "react";
4
+ import { shorthands, __styles, mergeClasses, __resetStyles } from "@griffel/react";
5
+ import { tokens } from "@fluentui/react-theme";
6
+ import { textClassNames } from "@fluentui/react-text";
7
+ import { createFocusOutlineStyle } from "@fluentui/react-tabster";
8
+ import { cardPreviewClassNames } from "../CardPreview/useCardPreviewStyles.styles.js";
9
+ import { cardHeaderClassNames } from "../CardHeader/useCardHeaderStyles.styles.js";
10
+ import { cardFooterClassNames } from "../CardFooter/useCardFooterStyles.styles.js";
11
11
  /**
12
12
  * Static CSS class names used internally for the component slots.
13
13
  */
@@ -444,8 +444,6 @@ const useCardStyles = /*#__PURE__*/__styles({
444
444
  * Apply styling to the Card slots based on the state.
445
445
  */
446
446
  export const useCardStyles_unstable = state => {
447
- 'use no memo';
448
-
449
447
  const resetStyles = useCardResetStyles();
450
448
  const styles = useCardStyles();
451
449
  const orientationMap = {
@@ -1 +1 @@
1
- {"version":3,"names":["React","shorthands","__styles","mergeClasses","__resetStyles","tokens","textClassNames","createFocusOutlineStyle","cardPreviewClassNames","cardHeaderClassNames","cardFooterClassNames","cardClassNames","root","floatingAction","checkbox","cardCSSVars","cardSizeVar","cardBorderRadiusVar","focusOutlineStyle","outlineRadius","outlineWidth","strokeWidthThick","outlineOffset","useCardResetStyles","disabledStyles","cursor","userSelect","color","colorNeutralForegroundDisabled","backgroundColor","colorNeutralBackgroundDisabled","boxShadow","shadow2","borderColor","colorNeutralStrokeDisabled","content","position","inset","zIndex","zIndexContent","useCardStyles","focused","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bqhya38","Bwxa6fj","Bdhvstf","B7zbvrb","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","f6g5ot","Boxcth7","Bhdgwq3","hgwjuy","Bshpdp8","Bsom6fd","Blkhhs4","Bonggc9","Ddfuxk","i03rao","kclons","clg4pj","Bpqj9nj","B6dhp37","Bf4ptjt","Bqtpl0w","i4rwgc","Dah5zi","B1tsrr9","qqdqy8","Bkh64rk","e3fwne","J0r882","Bule8hv","Bjwuhne","Ghsupd","selectableFocused","Bssx7fj","uh7if5","clntm0","Dlk2r6","h6p2u","I6qiy5","yzno9d","By0wis0","B2j2mmj","wigs8","pbfy6t","B0v4ure","Byrf0fs","Bsiemmq","Bwckmig","skfxo0","Iidy0u","B98u21t","Bvwlmkc","jo1ztg","Ba1iezr","Blmvk6g","B24cy0v","Bil7v7r","Br3gin4","nr063g","ghq09","Bbgo44z","Bseh09z","az1dzo","Ba3ybja","B6352mv","vppk2z","Biaj6j7","B2pnrqr","B29w5g4","Bhhzhcn","Bec0n69","orientationHorizontal","Beiy3e4","Bt984gj","Binpb3b","qrt8p2","k6ws3r","Btcwela","Fer9m8","orientationVertical","B5nvv7i","Baxg94k","tn21ii","B0ud6bj","Bgdo4j","sizeSmall","B7balbw","B1h88n7","sizeMedium","sizeLarge","interactive","rhjd8f","filled","De3pzq","E5pizo","B0n5ga8","s924m2","B1q35kw","Gp14am","filledInteractive","Bceei9c","Bi91k9c","Jwef8y","Bvxd0ez","ecr2s2","filledInteractiveSelected","filledAlternative","filledAlternativeInteractive","filledAlternativeInteractiveSelected","outline","outlineInteractive","Be0v6ae","B5kxglz","B3pwyw6","Bymgtzf","dmfk","B4ofi8","jgq6uv","Baxewws","outlineInteractiveSelected","outlineDisabled","g2u3we","h3c5rm","B9xav0g","zhjwy3","ezxybo","wc7uws","subtle","subtleInteractive","subtleInteractiveSelected","highContrastSelected","B8gzw0y","By8wz76","B7iucu3","Boo9lyk","sga51p","qj1yg9","B8acmzm","Gezqo6","highContrastInteractive","waf3gn","B96h8j5","Bpd3jnq","uhbujs","select","qhf8xq","Bhzewxz","j35jbq","Bj3rh1h","hiddenCheckbox","B68tc82","Bmxbyg5","Bpg54ce","a9b677","Bqenvij","Bh84pgu","Bgl5zvf","Huce71","disabled","famaaq","sj55zd","Ftih45","Brfgrao","lawp4y","Fbdkly","mdwyqc","Bciustq","gc50h5","Ehzi8l","Bikrtoi","G8qf51","Brxh4y7","gp3uxg","Fohawp","Bxulg6k","vcjq4m","Bsqkqe9","fskg1g","iwiei9","Effecx","Bkt1b9m","jfmxvr","orauir","B2yd9ot","Fn9tzk","Bv0wker","Bp2dl5b","pzn0iz","f","i","d","p","m","h","a","useCardStyles_unstable","state","resetStyles","styles","orientationMap","horizontal","vertical","sizeMap","small","medium","large","appearanceMap","selectedMap","interactiveMap","isSelectableOrInteractive","selectable","focusedClassName","useMemo","selectFocused","className","orientation","size","appearance","selected"],"sources":["useCardStyles.styles.js"],"sourcesContent":["'use client';\nimport * as React from 'react';\nimport { shorthands, makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { textClassNames } from '@fluentui/react-text';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';\nimport { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';\nimport { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';\n/**\n * Static CSS class names used internally for the component slots.\n */ export const cardClassNames = {\n root: 'fui-Card',\n floatingAction: 'fui-Card__floatingAction',\n checkbox: 'fui-Card__checkbox'\n};\n/**\n * CSS variable names used internally for uniform styling in Card.\n */ export const cardCSSVars = {\n cardSizeVar: '--fui-Card--size',\n cardBorderRadiusVar: '--fui-Card--border-radius'\n};\nconst focusOutlineStyle = {\n outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n outlineWidth: tokens.strokeWidthThick,\n outlineOffset: '-2px'\n};\nconst useCardResetStyles = makeResetStyles({\n overflow: 'hidden',\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n padding: `var(${cardCSSVars.cardSizeVar})`,\n gap: `var(${cardCSSVars.cardSizeVar})`,\n display: 'flex',\n position: 'relative',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n // Border setting using after pseudo element to allow CardPreview to render behind it.\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`\n },\n // Prevents CardHeader and CardFooter from shrinking.\n [`> .${cardHeaderClassNames.root}, > .${cardFooterClassNames.root}`]: {\n flexShrink: 0\n }\n});\nconst disabledStyles = {\n cursor: 'not-allowed',\n userSelect: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n boxShadow: tokens.shadow2,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '::before': {\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n zIndex: `calc(${tokens.zIndexContent} + 1)`\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n }\n};\nconst useCardStyles = makeStyles({\n focused: {\n ...createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus'\n })\n },\n selectableFocused: createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus-within'\n }),\n orientationHorizontal: {\n flexDirection: 'row',\n alignItems: 'center',\n // Remove vertical padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on horizontal cards, the left padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the last element.\n // Since this is on horizontal cards, the right padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // If the last child is a CardHeader or CardFooter, allow it to grow to fill the available space.\n [`> .${cardHeaderClassNames.root}:last-of-type, > .${cardFooterClassNames.root}:last-of-type`]: {\n flexGrow: 1\n }\n },\n orientationVertical: {\n flexDirection: 'column',\n // Remove lateral padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the top padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n [`> .${cardClassNames.floatingAction} + .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the bottom padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n }\n },\n sizeSmall: {\n [cardCSSVars.cardSizeVar]: '8px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusSmall\n },\n sizeMedium: {\n [cardCSSVars.cardSizeVar]: '12px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusMedium\n },\n sizeLarge: {\n [cardCSSVars.cardSizeVar]: '16px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusLarge\n },\n interactive: {\n [`& .${textClassNames.root}`]: {\n color: 'currentColor'\n }\n },\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed\n }\n },\n filledInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorNeutralBackground1Selected\n }\n },\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed\n }\n },\n filledAlternativeInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground2Selected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Selected,\n backgroundColor: tokens.colorNeutralBackground2Selected\n }\n },\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorTransparentBackgroundHover,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover)\n }\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed)\n }\n }\n },\n outlineInteractiveSelected: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorTransparentBackgroundSelected\n }\n },\n outlineDisabled: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '&:hover, &:active': {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none'\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n }\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed\n }\n },\n subtleInteractiveSelected: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorSubtleBackgroundSelected\n }\n },\n highContrastSelected: {\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto'\n },\n '::after': {\n ...shorthands.borderColor('Highlight')\n }\n }\n },\n highContrastInteractive: {\n '@media (forced-colors: active)': {\n ':hover, :active': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto'\n }\n },\n '::after': {\n ...shorthands.borderColor('Highlight')\n }\n }\n },\n select: {\n position: 'absolute',\n top: '4px',\n right: '4px',\n zIndex: tokens.zIndexContent\n },\n hiddenCheckbox: {\n overflow: 'hidden',\n width: '1px',\n height: '1px',\n position: 'absolute',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(50%)',\n whiteSpace: 'nowrap'\n },\n disabled: {\n ...disabledStyles,\n '&:hover, &:active': disabledStyles\n }\n});\n/**\n * Apply styling to the Card slots based on the state.\n */ export const useCardStyles_unstable = (state)=>{\n 'use no memo';\n const resetStyles = useCardResetStyles();\n const styles = useCardStyles();\n const orientationMap = {\n horizontal: styles.orientationHorizontal,\n vertical: styles.orientationVertical\n };\n const sizeMap = {\n small: styles.sizeSmall,\n medium: styles.sizeMedium,\n large: styles.sizeLarge\n };\n const appearanceMap = {\n filled: styles.filled,\n 'filled-alternative': styles.filledAlternative,\n outline: styles.outline,\n subtle: styles.subtle\n };\n const selectedMap = {\n filled: styles.filledInteractiveSelected,\n 'filled-alternative': styles.filledAlternativeInteractiveSelected,\n outline: styles.outlineInteractiveSelected,\n subtle: styles.subtleInteractiveSelected\n };\n const interactiveMap = {\n filled: styles.filledInteractive,\n 'filled-alternative': styles.filledAlternativeInteractive,\n outline: styles.outlineInteractive,\n subtle: styles.subtleInteractive\n };\n const isSelectableOrInteractive = !state.disabled && (state.interactive || state.selectable);\n const focusedClassName = React.useMemo(()=>{\n if (state.disabled) {\n return '';\n }\n if (state.selectable) {\n if (state.selectFocused) {\n return styles.selectableFocused;\n }\n return '';\n }\n return styles.focused;\n }, [\n state.disabled,\n state.selectFocused,\n state.selectable,\n styles.focused,\n styles.selectableFocused\n ]);\n // eslint-disable-next-line react-hooks/immutability\n 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.disabled && styles.disabled, state.disabled && state.appearance === 'outline' && styles.outlineDisabled, state.root.className);\n if (state.floatingAction) {\n // eslint-disable-next-line react-hooks/immutability\n state.floatingAction.className = mergeClasses(cardClassNames.floatingAction, styles.select, state.floatingAction.className);\n }\n if (state.checkbox) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkbox.className = mergeClasses(cardClassNames.checkbox, styles.hiddenCheckbox, state.checkbox.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["React","shorthands","__styles","mergeClasses","__resetStyles","tokens","textClassNames","createFocusOutlineStyle","cardPreviewClassNames","cardHeaderClassNames","cardFooterClassNames","cardClassNames","root","floatingAction","checkbox","cardCSSVars","cardSizeVar","cardBorderRadiusVar","focusOutlineStyle","outlineRadius","outlineWidth","strokeWidthThick","outlineOffset","useCardResetStyles","disabledStyles","cursor","userSelect","color","colorNeutralForegroundDisabled","backgroundColor","colorNeutralBackgroundDisabled","boxShadow","shadow2","borderColor","colorNeutralStrokeDisabled","content","position","inset","zIndex","zIndexContent","useCardStyles","focused","Brovlpu","B486eqv","B8q5s1w","Bci5o5g","n8qw10","Bdrgwmp","Bqhya38","Bwxa6fj","Bdhvstf","B7zbvrb","Bm4h7ae","B7ys5i9","Busjfv9","Bhk32uz","f6g5ot","Boxcth7","Bhdgwq3","hgwjuy","Bshpdp8","Bsom6fd","Blkhhs4","Bonggc9","Ddfuxk","i03rao","kclons","clg4pj","Bpqj9nj","B6dhp37","Bf4ptjt","Bqtpl0w","i4rwgc","Dah5zi","B1tsrr9","qqdqy8","Bkh64rk","e3fwne","J0r882","Bule8hv","Bjwuhne","Ghsupd","selectableFocused","Bssx7fj","uh7if5","clntm0","Dlk2r6","h6p2u","I6qiy5","yzno9d","By0wis0","B2j2mmj","wigs8","pbfy6t","B0v4ure","Byrf0fs","Bsiemmq","Bwckmig","skfxo0","Iidy0u","B98u21t","Bvwlmkc","jo1ztg","Ba1iezr","Blmvk6g","B24cy0v","Bil7v7r","Br3gin4","nr063g","ghq09","Bbgo44z","Bseh09z","az1dzo","Ba3ybja","B6352mv","vppk2z","Biaj6j7","B2pnrqr","B29w5g4","Bhhzhcn","Bec0n69","orientationHorizontal","Beiy3e4","Bt984gj","Binpb3b","qrt8p2","k6ws3r","Btcwela","Fer9m8","orientationVertical","B5nvv7i","Baxg94k","tn21ii","B0ud6bj","Bgdo4j","sizeSmall","B7balbw","B1h88n7","sizeMedium","sizeLarge","interactive","rhjd8f","filled","De3pzq","E5pizo","B0n5ga8","s924m2","B1q35kw","Gp14am","filledInteractive","Bceei9c","Bi91k9c","Jwef8y","Bvxd0ez","ecr2s2","filledInteractiveSelected","filledAlternative","filledAlternativeInteractive","filledAlternativeInteractiveSelected","outline","outlineInteractive","Be0v6ae","B5kxglz","B3pwyw6","Bymgtzf","dmfk","B4ofi8","jgq6uv","Baxewws","outlineInteractiveSelected","outlineDisabled","g2u3we","h3c5rm","B9xav0g","zhjwy3","ezxybo","wc7uws","subtle","subtleInteractive","subtleInteractiveSelected","highContrastSelected","B8gzw0y","By8wz76","B7iucu3","Boo9lyk","sga51p","qj1yg9","B8acmzm","Gezqo6","highContrastInteractive","waf3gn","B96h8j5","Bpd3jnq","uhbujs","select","qhf8xq","Bhzewxz","j35jbq","Bj3rh1h","hiddenCheckbox","B68tc82","Bmxbyg5","Bpg54ce","a9b677","Bqenvij","Bh84pgu","Bgl5zvf","Huce71","disabled","famaaq","sj55zd","Ftih45","Brfgrao","lawp4y","Fbdkly","mdwyqc","Bciustq","gc50h5","Ehzi8l","Bikrtoi","G8qf51","Brxh4y7","gp3uxg","Fohawp","Bxulg6k","vcjq4m","Bsqkqe9","fskg1g","iwiei9","Effecx","Bkt1b9m","jfmxvr","orauir","B2yd9ot","Fn9tzk","Bv0wker","Bp2dl5b","pzn0iz","f","i","d","p","m","h","a","useCardStyles_unstable","state","resetStyles","styles","orientationMap","horizontal","vertical","sizeMap","small","medium","large","appearanceMap","selectedMap","interactiveMap","isSelectableOrInteractive","selectable","focusedClassName","useMemo","selectFocused","className","orientation","size","appearance","selected"],"sources":["useCardStyles.styles.js"],"sourcesContent":["'use client';\nimport * as React from \"react\";\nimport { shorthands, makeStyles, mergeClasses, makeResetStyles } from \"@griffel/react\";\nimport { tokens } from \"@fluentui/react-theme\";\nimport { textClassNames } from \"@fluentui/react-text\";\nimport { createFocusOutlineStyle } from \"@fluentui/react-tabster\";\nimport { cardPreviewClassNames } from \"../CardPreview/useCardPreviewStyles.styles.js\";\nimport { cardHeaderClassNames } from \"../CardHeader/useCardHeaderStyles.styles.js\";\nimport { cardFooterClassNames } from \"../CardFooter/useCardFooterStyles.styles.js\";\n/**\n * Static CSS class names used internally for the component slots.\n */ export const cardClassNames = {\n root: 'fui-Card',\n floatingAction: 'fui-Card__floatingAction',\n checkbox: 'fui-Card__checkbox'\n};\n/**\n * CSS variable names used internally for uniform styling in Card.\n */ export const cardCSSVars = {\n cardSizeVar: '--fui-Card--size',\n cardBorderRadiusVar: '--fui-Card--border-radius'\n};\nconst focusOutlineStyle = {\n outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n outlineWidth: tokens.strokeWidthThick,\n outlineOffset: '-2px'\n};\nconst useCardResetStyles = makeResetStyles({\n overflow: 'hidden',\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n padding: `var(${cardCSSVars.cardSizeVar})`,\n gap: `var(${cardCSSVars.cardSizeVar})`,\n display: 'flex',\n position: 'relative',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n // Border setting using after pseudo element to allow CardPreview to render behind it.\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`\n },\n // Prevents CardHeader and CardFooter from shrinking.\n [`> .${cardHeaderClassNames.root}, > .${cardFooterClassNames.root}`]: {\n flexShrink: 0\n }\n});\nconst disabledStyles = {\n cursor: 'not-allowed',\n userSelect: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n boxShadow: tokens.shadow2,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '::before': {\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n zIndex: `calc(${tokens.zIndexContent} + 1)`\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n }\n};\nconst useCardStyles = makeStyles({\n focused: {\n ...createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus'\n })\n },\n selectableFocused: createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus-within'\n }),\n orientationHorizontal: {\n flexDirection: 'row',\n alignItems: 'center',\n // Remove vertical padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on horizontal cards, the left padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the last element.\n // Since this is on horizontal cards, the right padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // If the last child is a CardHeader or CardFooter, allow it to grow to fill the available space.\n [`> .${cardHeaderClassNames.root}:last-of-type, > .${cardFooterClassNames.root}:last-of-type`]: {\n flexGrow: 1\n }\n },\n orientationVertical: {\n flexDirection: 'column',\n // Remove lateral padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the top padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n [`> .${cardClassNames.floatingAction} + .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the bottom padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`\n }\n },\n sizeSmall: {\n [cardCSSVars.cardSizeVar]: '8px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusSmall\n },\n sizeMedium: {\n [cardCSSVars.cardSizeVar]: '12px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusMedium\n },\n sizeLarge: {\n [cardCSSVars.cardSizeVar]: '16px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusLarge\n },\n interactive: {\n [`& .${textClassNames.root}`]: {\n color: 'currentColor'\n }\n },\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed\n }\n },\n filledInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorNeutralBackground1Selected\n }\n },\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed\n }\n },\n filledAlternativeInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground2Selected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground2Selected,\n backgroundColor: tokens.colorNeutralBackground2Selected\n }\n },\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n }\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorTransparentBackgroundHover,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover)\n }\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed)\n }\n }\n },\n outlineInteractiveSelected: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorTransparentBackgroundSelected\n }\n },\n outlineDisabled: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n '&:hover, &:active': {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none'\n },\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n }\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n }\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed\n }\n },\n subtleInteractiveSelected: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n },\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorSubtleBackgroundSelected\n }\n },\n highContrastSelected: {\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto'\n },\n '::after': {\n ...shorthands.borderColor('Highlight')\n }\n }\n },\n highContrastInteractive: {\n '@media (forced-colors: active)': {\n ':hover, :active': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto'\n }\n },\n '::after': {\n ...shorthands.borderColor('Highlight')\n }\n }\n },\n select: {\n position: 'absolute',\n top: '4px',\n right: '4px',\n zIndex: tokens.zIndexContent\n },\n hiddenCheckbox: {\n overflow: 'hidden',\n width: '1px',\n height: '1px',\n position: 'absolute',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(50%)',\n whiteSpace: 'nowrap'\n },\n disabled: {\n ...disabledStyles,\n '&:hover, &:active': disabledStyles\n }\n});\n/**\n * Apply styling to the Card slots based on the state.\n */ export const useCardStyles_unstable = (state)=>{\n const resetStyles = useCardResetStyles();\n const styles = useCardStyles();\n const orientationMap = {\n horizontal: styles.orientationHorizontal,\n vertical: styles.orientationVertical\n };\n const sizeMap = {\n small: styles.sizeSmall,\n medium: styles.sizeMedium,\n large: styles.sizeLarge\n };\n const appearanceMap = {\n filled: styles.filled,\n 'filled-alternative': styles.filledAlternative,\n outline: styles.outline,\n subtle: styles.subtle\n };\n const selectedMap = {\n filled: styles.filledInteractiveSelected,\n 'filled-alternative': styles.filledAlternativeInteractiveSelected,\n outline: styles.outlineInteractiveSelected,\n subtle: styles.subtleInteractiveSelected\n };\n const interactiveMap = {\n filled: styles.filledInteractive,\n 'filled-alternative': styles.filledAlternativeInteractive,\n outline: styles.outlineInteractive,\n subtle: styles.subtleInteractive\n };\n const isSelectableOrInteractive = !state.disabled && (state.interactive || state.selectable);\n const focusedClassName = React.useMemo(()=>{\n if (state.disabled) {\n return '';\n }\n if (state.selectable) {\n if (state.selectFocused) {\n return styles.selectableFocused;\n }\n return '';\n }\n return styles.focused;\n }, [\n state.disabled,\n state.selectFocused,\n state.selectable,\n styles.focused,\n styles.selectableFocused\n ]);\n // eslint-disable-next-line react-hooks/immutability\n 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.disabled && styles.disabled, state.disabled && state.appearance === 'outline' && styles.outlineDisabled, state.root.className);\n if (state.floatingAction) {\n // eslint-disable-next-line react-hooks/immutability\n state.floatingAction.className = mergeClasses(cardClassNames.floatingAction, styles.select, state.floatingAction.className);\n }\n if (state.checkbox) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkbox.className = mergeClasses(cardClassNames.checkbox, styles.hiddenCheckbox, state.checkbox.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
@@ -1,12 +1,12 @@
1
1
  'use client';
2
- import * as React from 'react';
3
- import { shorthands, makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';
4
- import { tokens } from '@fluentui/react-theme';
5
- import { textClassNames } from '@fluentui/react-text';
6
- import { createFocusOutlineStyle } from '@fluentui/react-tabster';
7
- import { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';
8
- import { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';
9
- import { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';
2
+ import * as React from "react";
3
+ import { shorthands, makeStyles, mergeClasses, makeResetStyles } from "@griffel/react";
4
+ import { tokens } from "@fluentui/react-theme";
5
+ import { textClassNames } from "@fluentui/react-text";
6
+ import { createFocusOutlineStyle } from "@fluentui/react-tabster";
7
+ import { cardPreviewClassNames } from "../CardPreview/useCardPreviewStyles.styles.js";
8
+ import { cardHeaderClassNames } from "../CardHeader/useCardHeaderStyles.styles.js";
9
+ import { cardFooterClassNames } from "../CardFooter/useCardFooterStyles.styles.js";
10
10
  /**
11
11
  * Static CSS class names used internally for the component slots.
12
12
  */ export const cardClassNames = {
@@ -344,7 +344,6 @@ const useCardStyles = makeStyles({
344
344
  /**
345
345
  * Apply styling to the Card slots based on the state.
346
346
  */ export const useCardStyles_unstable = (state)=>{
347
- 'use no memo';
348
347
  const resetStyles = useCardResetStyles();
349
348
  const styles = useCardStyles();
350
349
  const orientationMap = {
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Card/useCardStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { GriffelStyle } from '@griffel/react';\nimport { shorthands, makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { textClassNames } from '@fluentui/react-text';\nimport type { FocusOutlineStyleOptions } from '@fluentui/react-tabster';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nimport { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';\nimport { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';\nimport { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';\nimport type { CardSlots, CardState } from './Card.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardClassNames: SlotClassNames<CardSlots> = {\n root: 'fui-Card',\n floatingAction: 'fui-Card__floatingAction',\n checkbox: 'fui-Card__checkbox',\n};\n\n/**\n * CSS variable names used internally for uniform styling in Card.\n */\nexport const cardCSSVars = {\n cardSizeVar: '--fui-Card--size',\n cardBorderRadiusVar: '--fui-Card--border-radius',\n};\n\nconst focusOutlineStyle: Partial<FocusOutlineStyleOptions> = {\n outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n outlineWidth: tokens.strokeWidthThick,\n outlineOffset: '-2px', // FIXME: tokens.strokeWidthThick causes some weird bugs\n};\n\nconst useCardResetStyles = makeResetStyles({\n overflow: 'hidden',\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n padding: `var(${cardCSSVars.cardSizeVar})`,\n gap: `var(${cardCSSVars.cardSizeVar})`,\n\n display: 'flex',\n position: 'relative',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n\n // Border setting using after pseudo element to allow CardPreview to render behind it.\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n },\n\n // Prevents CardHeader and CardFooter from shrinking.\n [`> .${cardHeaderClassNames.root}, > .${cardFooterClassNames.root}`]: {\n flexShrink: 0,\n },\n});\n\nconst disabledStyles: GriffelStyle = {\n cursor: 'not-allowed',\n userSelect: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n boxShadow: tokens.shadow2,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n '::before': {\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n zIndex: `calc(${tokens.zIndexContent} + 1)`,\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n },\n};\n\nconst useCardStyles = makeStyles({\n focused: {\n ...createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus',\n }),\n },\n\n selectableFocused: createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus-within',\n }),\n\n orientationHorizontal: {\n flexDirection: 'row',\n alignItems: 'center',\n\n // Remove vertical padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on horizontal cards, the left padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the last element.\n // Since this is on horizontal cards, the right padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // If the last child is a CardHeader or CardFooter, allow it to grow to fill the available space.\n [`> .${cardHeaderClassNames.root}:last-of-type, > .${cardFooterClassNames.root}:last-of-type`]: {\n flexGrow: 1,\n },\n },\n orientationVertical: {\n flexDirection: 'column',\n\n // Remove lateral padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the top padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n [`> .${cardClassNames.floatingAction} + .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the bottom padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n },\n\n sizeSmall: {\n [cardCSSVars.cardSizeVar]: '8px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusSmall,\n },\n sizeMedium: {\n [cardCSSVars.cardSizeVar]: '12px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusMedium,\n },\n sizeLarge: {\n [cardCSSVars.cardSizeVar]: '16px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusLarge,\n },\n\n interactive: {\n [`& .${textClassNames.root}`]: {\n color: 'currentColor',\n },\n },\n\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n },\n },\n filledInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorNeutralBackground1Selected,\n },\n },\n\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed,\n },\n },\n filledAlternativeInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground2Selected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground2Selected,\n backgroundColor: tokens.colorNeutralBackground2Selected,\n },\n },\n\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorTransparentBackgroundHover,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n },\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n },\n },\n },\n outlineInteractiveSelected: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n },\n },\n outlineDisabled: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n '&:hover, &:active': {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n },\n },\n\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\n subtleInteractiveSelected: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n },\n },\n\n highContrastSelected: {\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto',\n },\n\n '::after': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n\n highContrastInteractive: {\n '@media (forced-colors: active)': {\n ':hover, :active': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto',\n },\n },\n\n '::after': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n\n select: {\n position: 'absolute',\n top: '4px',\n right: '4px',\n zIndex: tokens.zIndexContent,\n },\n\n hiddenCheckbox: {\n overflow: 'hidden',\n width: '1px',\n height: '1px',\n position: 'absolute',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(50%)',\n whiteSpace: 'nowrap',\n },\n\n disabled: {\n ...disabledStyles,\n '&:hover, &:active': disabledStyles,\n },\n});\n\n/**\n * Apply styling to the Card slots based on the state.\n */\nexport const useCardStyles_unstable = (state: CardState): CardState => {\n 'use no memo';\n\n const resetStyles = useCardResetStyles();\n const styles = useCardStyles();\n\n const orientationMap = {\n horizontal: styles.orientationHorizontal,\n vertical: styles.orientationVertical,\n };\n\n const sizeMap = {\n small: styles.sizeSmall,\n medium: styles.sizeMedium,\n large: styles.sizeLarge,\n };\n\n const appearanceMap = {\n filled: styles.filled,\n 'filled-alternative': styles.filledAlternative,\n outline: styles.outline,\n subtle: styles.subtle,\n };\n\n const selectedMap = {\n filled: styles.filledInteractiveSelected,\n 'filled-alternative': styles.filledAlternativeInteractiveSelected,\n outline: styles.outlineInteractiveSelected,\n subtle: styles.subtleInteractiveSelected,\n };\n const interactiveMap = {\n filled: styles.filledInteractive,\n 'filled-alternative': styles.filledAlternativeInteractive,\n outline: styles.outlineInteractive,\n subtle: styles.subtleInteractive,\n };\n\n const isSelectableOrInteractive = !state.disabled && (state.interactive || state.selectable);\n\n const focusedClassName = React.useMemo(() => {\n if (state.disabled) {\n return '';\n }\n\n if (state.selectable) {\n if (state.selectFocused) {\n return styles.selectableFocused;\n }\n\n return '';\n }\n\n return styles.focused;\n }, [state.disabled, state.selectFocused, state.selectable, styles.focused, styles.selectableFocused]);\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n cardClassNames.root,\n resetStyles,\n orientationMap[state.orientation],\n sizeMap[state.size],\n appearanceMap[state.appearance],\n isSelectableOrInteractive && styles.interactive,\n isSelectableOrInteractive && interactiveMap[state.appearance],\n state.selected && selectedMap[state.appearance],\n focusedClassName,\n isSelectableOrInteractive && styles.highContrastInteractive,\n state.selected && styles.highContrastSelected,\n state.disabled && styles.disabled,\n state.disabled && state.appearance === 'outline' && styles.outlineDisabled,\n state.root.className,\n );\n\n if (state.floatingAction) {\n // eslint-disable-next-line react-hooks/immutability\n state.floatingAction.className = mergeClasses(\n cardClassNames.floatingAction,\n styles.select,\n state.floatingAction.className,\n );\n }\n\n if (state.checkbox) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkbox.className = mergeClasses(cardClassNames.checkbox, styles.hiddenCheckbox, state.checkbox.className);\n }\n\n return state;\n};\n"],"names":["React","shorthands","makeStyles","mergeClasses","makeResetStyles","tokens","textClassNames","createFocusOutlineStyle","cardPreviewClassNames","cardHeaderClassNames","cardFooterClassNames","cardClassNames","root","floatingAction","checkbox","cardCSSVars","cardSizeVar","cardBorderRadiusVar","focusOutlineStyle","outlineRadius","outlineWidth","strokeWidthThick","outlineOffset","useCardResetStyles","overflow","borderRadius","padding","gap","display","position","boxSizing","color","colorNeutralForeground1","top","left","right","bottom","content","pointerEvents","borderStyle","borderWidth","strokeWidthThin","flexShrink","disabledStyles","cursor","userSelect","colorNeutralForegroundDisabled","backgroundColor","colorNeutralBackgroundDisabled","boxShadow","shadow2","borderColor","colorNeutralStrokeDisabled","inset","zIndex","zIndexContent","useCardStyles","focused","style","selector","selectableFocused","orientationHorizontal","flexDirection","alignItems","marginTop","marginBottom","marginLeft","marginRight","flexGrow","orientationVertical","sizeSmall","borderRadiusSmall","sizeMedium","borderRadiusMedium","sizeLarge","borderRadiusLarge","interactive","filled","colorNeutralBackground1","shadow4","colorTransparentStroke","filledInteractive","colorNeutralForeground1Hover","colorNeutralBackground1Hover","shadow8","colorNeutralBackground1Pressed","filledInteractiveSelected","colorNeutralBackground1Selected","colorNeutralStroke1Selected","colorNeutralForeground1Selected","filledAlternative","colorNeutralBackground2","filledAlternativeInteractive","colorNeutralForeground2Hover","colorNeutralBackground2Hover","colorNeutralBackground2Pressed","filledAlternativeInteractiveSelected","colorNeutralBackground2Selected","colorNeutralForeground2Selected","outline","colorTransparentBackground","colorNeutralStroke1","outlineInteractive","colorTransparentBackgroundHover","colorNeutralStroke1Hover","colorTransparentBackgroundPressed","colorNeutralStroke1Pressed","outlineInteractiveSelected","colorTransparentBackgroundSelected","outlineDisabled","subtle","colorSubtleBackground","subtleInteractive","colorSubtleBackgroundHover","colorSubtleBackgroundPressed","subtleInteractiveSelected","colorSubtleBackgroundSelected","highContrastSelected","forcedColorAdjust","highContrastInteractive","select","hiddenCheckbox","width","height","clip","clipPath","whiteSpace","disabled","useCardStyles_unstable","state","resetStyles","styles","orientationMap","horizontal","vertical","sizeMap","small","medium","large","appearanceMap","selectedMap","interactiveMap","isSelectableOrInteractive","selectable","focusedClassName","useMemo","selectFocused","className","orientation","size","appearance","selected"],"mappings":"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"}
1
+ {"version":3,"sources":["../src/components/Card/useCardStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { GriffelStyle } from '@griffel/react';\nimport { shorthands, makeStyles, mergeClasses, makeResetStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { textClassNames } from '@fluentui/react-text';\nimport type { FocusOutlineStyleOptions } from '@fluentui/react-tabster';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\n\nimport { cardPreviewClassNames } from '../CardPreview/useCardPreviewStyles.styles';\nimport { cardHeaderClassNames } from '../CardHeader/useCardHeaderStyles.styles';\nimport { cardFooterClassNames } from '../CardFooter/useCardFooterStyles.styles';\nimport type { CardSlots, CardState } from './Card.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardClassNames: SlotClassNames<CardSlots> = {\n root: 'fui-Card',\n floatingAction: 'fui-Card__floatingAction',\n checkbox: 'fui-Card__checkbox',\n};\n\n/**\n * CSS variable names used internally for uniform styling in Card.\n */\nexport const cardCSSVars = {\n cardSizeVar: '--fui-Card--size',\n cardBorderRadiusVar: '--fui-Card--border-radius',\n};\n\nconst focusOutlineStyle: Partial<FocusOutlineStyleOptions> = {\n outlineRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n outlineWidth: tokens.strokeWidthThick,\n outlineOffset: '-2px', // FIXME: tokens.strokeWidthThick causes some weird bugs\n};\n\nconst useCardResetStyles = makeResetStyles({\n overflow: 'hidden',\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n padding: `var(${cardCSSVars.cardSizeVar})`,\n gap: `var(${cardCSSVars.cardSizeVar})`,\n\n display: 'flex',\n position: 'relative',\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n\n // Border setting using after pseudo element to allow CardPreview to render behind it.\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n borderRadius: `var(${cardCSSVars.cardBorderRadiusVar})`,\n },\n\n // Prevents CardHeader and CardFooter from shrinking.\n [`> .${cardHeaderClassNames.root}, > .${cardFooterClassNames.root}`]: {\n flexShrink: 0,\n },\n});\n\nconst disabledStyles: GriffelStyle = {\n cursor: 'not-allowed',\n userSelect: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n boxShadow: tokens.shadow2,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n '::before': {\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n zIndex: `calc(${tokens.zIndexContent} + 1)`,\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n },\n};\n\nconst useCardStyles = makeStyles({\n focused: {\n ...createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus',\n }),\n },\n\n selectableFocused: createFocusOutlineStyle({\n style: focusOutlineStyle,\n selector: 'focus-within',\n }),\n\n orientationHorizontal: {\n flexDirection: 'row',\n alignItems: 'center',\n\n // Remove vertical padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on horizontal cards, the left padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the last element.\n // Since this is on horizontal cards, the right padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // If the last child is a CardHeader or CardFooter, allow it to grow to fill the available space.\n [`> .${cardHeaderClassNames.root}:last-of-type, > .${cardFooterClassNames.root}:last-of-type`]: {\n flexGrow: 1,\n },\n },\n orientationVertical: {\n flexDirection: 'column',\n\n // Remove lateral padding to keep CardPreview content flush with Card's borders.\n [`> .${cardPreviewClassNames.root}`]: {\n marginLeft: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n marginRight: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the top padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:first-of-type`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n [`> .${cardClassNames.floatingAction} + .${cardPreviewClassNames.root}`]: {\n marginTop: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n\n // Due to Tabster's \"Groupper\" focus functionality, hidden elements are injected before and after Card's content.\n // As such, the code below targets a CardPreview, when it's the first element.\n // Since this is on vertical cards, the bottom padding is removed to keep the content flush with the border.\n [`> :not([aria-hidden=\"true\"]).${cardPreviewClassNames.root}:last-of-type`]: {\n marginBottom: `calc(var(${cardCSSVars.cardSizeVar}) * -1)`,\n },\n },\n\n sizeSmall: {\n [cardCSSVars.cardSizeVar]: '8px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusSmall,\n },\n sizeMedium: {\n [cardCSSVars.cardSizeVar]: '12px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusMedium,\n },\n sizeLarge: {\n [cardCSSVars.cardSizeVar]: '16px',\n [cardCSSVars.cardBorderRadiusVar]: tokens.borderRadiusLarge,\n },\n\n interactive: {\n [`& .${textClassNames.root}`]: {\n color: 'currentColor',\n },\n },\n\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n },\n },\n filledInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorNeutralBackground1Selected,\n },\n },\n\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed,\n },\n },\n filledAlternativeInteractiveSelected: {\n backgroundColor: tokens.colorNeutralBackground2Selected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground2Selected,\n backgroundColor: tokens.colorNeutralBackground2Selected,\n },\n },\n\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorTransparentBackgroundHover,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n },\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n },\n },\n },\n outlineInteractiveSelected: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n },\n },\n outlineDisabled: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n\n '&:hover, &:active': {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n },\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n },\n },\n\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\n subtleInteractiveSelected: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n ':hover': {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n },\n },\n\n highContrastSelected: {\n '@media (forced-colors: active)': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto',\n },\n\n '::after': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n\n highContrastInteractive: {\n '@media (forced-colors: active)': {\n ':hover, :active': {\n forcedColorAdjust: 'none',\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n\n [`& .${cardPreviewClassNames.root}, & .${cardFooterClassNames.root}`]: {\n forcedColorAdjust: 'auto',\n },\n },\n\n '::after': {\n ...shorthands.borderColor('Highlight'),\n },\n },\n },\n\n select: {\n position: 'absolute',\n top: '4px',\n right: '4px',\n zIndex: tokens.zIndexContent,\n },\n\n hiddenCheckbox: {\n overflow: 'hidden',\n width: '1px',\n height: '1px',\n position: 'absolute',\n clip: 'rect(0 0 0 0)',\n clipPath: 'inset(50%)',\n whiteSpace: 'nowrap',\n },\n\n disabled: {\n ...disabledStyles,\n '&:hover, &:active': disabledStyles,\n },\n});\n\n/**\n * Apply styling to the Card slots based on the state.\n */\nexport const useCardStyles_unstable = (state: CardState): CardState => {\n const resetStyles = useCardResetStyles();\n const styles = useCardStyles();\n\n const orientationMap = {\n horizontal: styles.orientationHorizontal,\n vertical: styles.orientationVertical,\n };\n\n const sizeMap = {\n small: styles.sizeSmall,\n medium: styles.sizeMedium,\n large: styles.sizeLarge,\n };\n\n const appearanceMap = {\n filled: styles.filled,\n 'filled-alternative': styles.filledAlternative,\n outline: styles.outline,\n subtle: styles.subtle,\n };\n\n const selectedMap = {\n filled: styles.filledInteractiveSelected,\n 'filled-alternative': styles.filledAlternativeInteractiveSelected,\n outline: styles.outlineInteractiveSelected,\n subtle: styles.subtleInteractiveSelected,\n };\n const interactiveMap = {\n filled: styles.filledInteractive,\n 'filled-alternative': styles.filledAlternativeInteractive,\n outline: styles.outlineInteractive,\n subtle: styles.subtleInteractive,\n };\n\n const isSelectableOrInteractive = !state.disabled && (state.interactive || state.selectable);\n\n const focusedClassName = React.useMemo(() => {\n if (state.disabled) {\n return '';\n }\n\n if (state.selectable) {\n if (state.selectFocused) {\n return styles.selectableFocused;\n }\n\n return '';\n }\n\n return styles.focused;\n }, [state.disabled, state.selectFocused, state.selectable, styles.focused, styles.selectableFocused]);\n\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(\n cardClassNames.root,\n resetStyles,\n orientationMap[state.orientation],\n sizeMap[state.size],\n appearanceMap[state.appearance],\n isSelectableOrInteractive && styles.interactive,\n isSelectableOrInteractive && interactiveMap[state.appearance],\n state.selected && selectedMap[state.appearance],\n focusedClassName,\n isSelectableOrInteractive && styles.highContrastInteractive,\n state.selected && styles.highContrastSelected,\n state.disabled && styles.disabled,\n state.disabled && state.appearance === 'outline' && styles.outlineDisabled,\n state.root.className,\n );\n\n if (state.floatingAction) {\n // eslint-disable-next-line react-hooks/immutability\n state.floatingAction.className = mergeClasses(\n cardClassNames.floatingAction,\n styles.select,\n state.floatingAction.className,\n );\n }\n\n if (state.checkbox) {\n // eslint-disable-next-line react-hooks/immutability\n state.checkbox.className = mergeClasses(cardClassNames.checkbox, styles.hiddenCheckbox, state.checkbox.className);\n }\n\n return state;\n};\n"],"names":["React","shorthands","makeStyles","mergeClasses","makeResetStyles","tokens","textClassNames","createFocusOutlineStyle","cardPreviewClassNames","cardHeaderClassNames","cardFooterClassNames","cardClassNames","root","floatingAction","checkbox","cardCSSVars","cardSizeVar","cardBorderRadiusVar","focusOutlineStyle","outlineRadius","outlineWidth","strokeWidthThick","outlineOffset","useCardResetStyles","overflow","borderRadius","padding","gap","display","position","boxSizing","color","colorNeutralForeground1","top","left","right","bottom","content","pointerEvents","borderStyle","borderWidth","strokeWidthThin","flexShrink","disabledStyles","cursor","userSelect","colorNeutralForegroundDisabled","backgroundColor","colorNeutralBackgroundDisabled","boxShadow","shadow2","borderColor","colorNeutralStrokeDisabled","inset","zIndex","zIndexContent","useCardStyles","focused","style","selector","selectableFocused","orientationHorizontal","flexDirection","alignItems","marginTop","marginBottom","marginLeft","marginRight","flexGrow","orientationVertical","sizeSmall","borderRadiusSmall","sizeMedium","borderRadiusMedium","sizeLarge","borderRadiusLarge","interactive","filled","colorNeutralBackground1","shadow4","colorTransparentStroke","filledInteractive","colorNeutralForeground1Hover","colorNeutralBackground1Hover","shadow8","colorNeutralBackground1Pressed","filledInteractiveSelected","colorNeutralBackground1Selected","colorNeutralStroke1Selected","colorNeutralForeground1Selected","filledAlternative","colorNeutralBackground2","filledAlternativeInteractive","colorNeutralForeground2Hover","colorNeutralBackground2Hover","colorNeutralBackground2Pressed","filledAlternativeInteractiveSelected","colorNeutralBackground2Selected","colorNeutralForeground2Selected","outline","colorTransparentBackground","colorNeutralStroke1","outlineInteractive","colorTransparentBackgroundHover","colorNeutralStroke1Hover","colorTransparentBackgroundPressed","colorNeutralStroke1Pressed","outlineInteractiveSelected","colorTransparentBackgroundSelected","outlineDisabled","subtle","colorSubtleBackground","subtleInteractive","colorSubtleBackgroundHover","colorSubtleBackgroundPressed","subtleInteractiveSelected","colorSubtleBackgroundSelected","highContrastSelected","forcedColorAdjust","highContrastInteractive","select","hiddenCheckbox","width","height","clip","clipPath","whiteSpace","disabled","useCardStyles_unstable","state","resetStyles","styles","orientationMap","horizontal","vertical","sizeMap","small","medium","large","appearanceMap","selectedMap","interactiveMap","isSelectableOrInteractive","selectable","focusedClassName","useMemo","selectFocused","className","orientation","size","appearance","selected"],"mappings":"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"}
@@ -1,9 +1,9 @@
1
1
  'use client';
2
- import * as React from 'react';
3
- import { useCardFooter_unstable } from './useCardFooter';
4
- import { renderCardFooter_unstable } from './renderCardFooter';
5
- import { useCardFooterStyles_unstable } from './useCardFooterStyles.styles';
6
- import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
2
+ import * as React from "react";
3
+ import { useCardFooter_unstable } from "./useCardFooter.js";
4
+ import { renderCardFooter_unstable } from "./renderCardFooter.js";
5
+ import { useCardFooterStyles_unstable } from "./useCardFooterStyles.styles.js";
6
+ import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
7
7
  /**
8
8
  * Component to render Button actions in a Card component.
9
9
  */ export const CardFooter = /*#__PURE__*/ React.forwardRef((props, ref)=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CardFooter/CardFooter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useCardFooter_unstable } from './useCardFooter';\nimport { renderCardFooter_unstable } from './renderCardFooter';\nimport { useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\nimport type { CardFooterProps } from './CardFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Component to render Button actions in a Card component.\n */\nexport const CardFooter: ForwardRefComponent<CardFooterProps> = React.forwardRef((props, ref) => {\n const state = useCardFooter_unstable(props, ref);\n\n useCardFooterStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardFooterStyles_unstable')(state);\n\n return renderCardFooter_unstable(state);\n});\n\nCardFooter.displayName = 'CardFooter';\n"],"names":["React","useCardFooter_unstable","renderCardFooter_unstable","useCardFooterStyles_unstable","useCustomStyleHook_unstable","CardFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAE7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/CardFooter/CardFooter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useCardFooter_unstable } from './useCardFooter';\nimport { renderCardFooter_unstable } from './renderCardFooter';\nimport { useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\nimport type { CardFooterProps } from './CardFooter.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Component to render Button actions in a Card component.\n */\nexport const CardFooter: ForwardRefComponent<CardFooterProps> = React.forwardRef((props, ref) => {\n const state = useCardFooter_unstable(props, ref);\n\n useCardFooterStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardFooterStyles_unstable')(state);\n\n return renderCardFooter_unstable(state);\n});\n\nCardFooter.displayName = 'CardFooter';\n"],"names":["React","useCardFooter_unstable","renderCardFooter_unstable","useCardFooterStyles_unstable","useCustomStyleHook_unstable","CardFooter","forwardRef","props","ref","state","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,qBAAkB;AACzD,SAASC,yBAAyB,QAAQ,wBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,kCAA+B;AAG5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,2BAAmDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,uBAAuBM,OAAOC;IAE5CL,6BAA6BM;IAE7BL,4BAA4B,gCAAgCK;IAE5D,OAAOP,0BAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}
@@ -1,4 +1,4 @@
1
- export { CardFooter } from './CardFooter';
2
- export { renderCardFooter_unstable } from './renderCardFooter';
3
- export { useCardFooter_unstable, useCardFooterBase_unstable } from './useCardFooter';
4
- export { cardFooterClassNames, useCardFooterStyles_unstable } from './useCardFooterStyles.styles';
1
+ export { CardFooter } from "./CardFooter.js";
2
+ export { renderCardFooter_unstable } from "./renderCardFooter.js";
3
+ export { useCardFooter_unstable, useCardFooterBase_unstable } from "./useCardFooter.js";
4
+ export { cardFooterClassNames, useCardFooterStyles_unstable } from "./useCardFooterStyles.styles.js";
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CardFooter/index.ts"],"sourcesContent":["export { CardFooter } from './CardFooter';\nexport type {\n CardFooterBaseProps,\n CardFooterBaseState,\n CardFooterProps,\n CardFooterSlots,\n CardFooterState,\n} from './CardFooter.types';\nexport { renderCardFooter_unstable } from './renderCardFooter';\nexport { useCardFooter_unstable, useCardFooterBase_unstable } from './useCardFooter';\nexport { cardFooterClassNames, useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\n"],"names":["CardFooter","renderCardFooter_unstable","useCardFooter_unstable","useCardFooterBase_unstable","cardFooterClassNames","useCardFooterStyles_unstable"],"mappings":"AAAA,SAASA,UAAU,QAAQ,eAAe;AAQ1C,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,EAAEC,0BAA0B,QAAQ,kBAAkB;AACrF,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,+BAA+B"}
1
+ {"version":3,"sources":["../src/components/CardFooter/index.ts"],"sourcesContent":["export { CardFooter } from './CardFooter';\nexport type {\n CardFooterBaseProps,\n CardFooterBaseState,\n CardFooterProps,\n CardFooterSlots,\n CardFooterState,\n} from './CardFooter.types';\nexport { renderCardFooter_unstable } from './renderCardFooter';\nexport { useCardFooter_unstable, useCardFooterBase_unstable } from './useCardFooter';\nexport { cardFooterClassNames, useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\n"],"names":["CardFooter","renderCardFooter_unstable","useCardFooter_unstable","useCardFooterBase_unstable","cardFooterClassNames","useCardFooterStyles_unstable"],"mappings":"AAAA,SAASA,UAAU,QAAQ,kBAAe;AAQ1C,SAASC,yBAAyB,QAAQ,wBAAqB;AAC/D,SAASC,sBAAsB,EAAEC,0BAA0B,QAAQ,qBAAkB;AACrF,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,kCAA+B"}
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
2
- import { assertSlots } from '@fluentui/react-utilities';
2
+ import { assertSlots } from "@fluentui/react-utilities";
3
3
  /**
4
4
  * Render the final JSX of CardFooter.
5
5
  */ export const renderCardFooter_unstable = (state)=>{
@@ -1,5 +1,5 @@
1
1
  'use client';
2
- import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, slot } from "@fluentui/react-utilities";
3
3
  /**
4
4
  * Create the state required to render CardFooter.
5
5
  *
@@ -1,6 +1,6 @@
1
1
  'use client';
2
2
 
3
- import { __styles, mergeClasses, shorthands } from '@griffel/react';
3
+ import { __styles, mergeClasses, shorthands } from "@griffel/react";
4
4
  /**
5
5
  * Static CSS class names used internally for the component slots.
6
6
  */
@@ -45,8 +45,6 @@ const useStyles = /*#__PURE__*/__styles({
45
45
  * Apply styling to the CardFooter slots based on the state.
46
46
  */
47
47
  export const useCardFooterStyles_unstable = state => {
48
- 'use no memo';
49
-
50
48
  const styles = useStyles();
51
49
  // eslint-disable-next-line react-hooks/immutability
52
50
  state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","shorthands","cardFooterClassNames","root","action","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","Frg6f3","rjrqlh","Boue1pl","Bhz1vi0","etxrgc","Bdua9ef","cbfxhg","d","p","m","useCardFooterStyles_unstable","state","styles","className"],"sources":["useCardFooterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\n/**\n * Static CSS class names used internally for the component slots.\n */ export const cardFooterClassNames = {\n root: 'fui-CardFooter',\n action: 'fui-CardFooter__action'\n};\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n gap: '12px'\n },\n action: {\n marginLeft: 'auto',\n // when the card is selected or hovered, it has custom high contrast color and background styles\n // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode\n '@media (forced-colors: active)': {\n '& .fui-Button, & .fui-Link': {\n ...shorthands.borderColor('currentColor'),\n color: 'currentColor',\n outlineColor: 'currentColor'\n }\n }\n }\n});\n/**\n * Apply styling to the CardFooter slots based on the state.\n */ export const useCardFooterStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n if (state.action) {\n // eslint-disable-next-line react-hooks/immutability\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE;AACA;AACA;AAAI,OAAO,MAAMC,oBAAoB,GAAG;EACpCC,IAAI,EAAE,gBAAgB;EACtBC,MAAM,EAAE;AACZ,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAI,IAAA;IAAAG,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAN,MAAA;IAAAO,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAkBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,4BAA4B,GAAIC,KAAK,IAAG;EACrD,aAAa;;EACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B;EACAiB,KAAK,CAACnB,IAAI,CAACqB,SAAS,GAAGxB,YAAY,CAACE,oBAAoB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEmB,KAAK,CAACnB,IAAI,CAACqB,SAAS,CAAC;EACjG,IAAIF,KAAK,CAAClB,MAAM,EAAE;IACd;IACAkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,GAAGxB,YAAY,CAACE,oBAAoB,CAACE,MAAM,EAAEmB,MAAM,CAACnB,MAAM,EAAEkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,CAAC;EAC7G;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["__styles","mergeClasses","shorthands","cardFooterClassNames","root","action","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","Frg6f3","rjrqlh","Boue1pl","Bhz1vi0","etxrgc","Bdua9ef","cbfxhg","d","p","m","useCardFooterStyles_unstable","state","styles","className"],"sources":["useCardFooterStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from \"@griffel/react\";\n/**\n * Static CSS class names used internally for the component slots.\n */ export const cardFooterClassNames = {\n root: 'fui-CardFooter',\n action: 'fui-CardFooter__action'\n};\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n gap: '12px'\n },\n action: {\n marginLeft: 'auto',\n // when the card is selected or hovered, it has custom high contrast color and background styles\n // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode\n '@media (forced-colors: active)': {\n '& .fui-Button, & .fui-Link': {\n ...shorthands.borderColor('currentColor'),\n color: 'currentColor',\n outlineColor: 'currentColor'\n }\n }\n }\n});\n/**\n * Apply styling to the CardFooter slots based on the state.\n */ export const useCardFooterStyles_unstable = (state)=>{\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n if (state.action) {\n // eslint-disable-next-line react-hooks/immutability\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE;AACA;AACA;AAAI,OAAO,MAAMC,oBAAoB,GAAG;EACpCC,IAAI,EAAE,gBAAgB;EACtBC,MAAM,EAAE;AACZ,CAAC;AACD,MAAMC,SAAS,gBAAGN,QAAA;EAAAI,IAAA;IAAAG,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAN,MAAA;IAAAO,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAkBjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,4BAA4B,GAAIC,KAAK,IAAG;EACrD,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;EAC1B;EACAiB,KAAK,CAACnB,IAAI,CAACqB,SAAS,GAAGxB,YAAY,CAACE,oBAAoB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEmB,KAAK,CAACnB,IAAI,CAACqB,SAAS,CAAC;EACjG,IAAIF,KAAK,CAAClB,MAAM,EAAE;IACd;IACAkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,GAAGxB,YAAY,CAACE,oBAAoB,CAACE,MAAM,EAAEmB,MAAM,CAACnB,MAAM,EAAEkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,CAAC;EAC7G;EACA,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
@@ -1,5 +1,5 @@
1
1
  'use client';
2
- import { makeStyles, mergeClasses, shorthands } from '@griffel/react';
2
+ import { makeStyles, mergeClasses, shorthands } from "@griffel/react";
3
3
  /**
4
4
  * Static CSS class names used internally for the component slots.
5
5
  */ export const cardFooterClassNames = {
@@ -28,7 +28,6 @@ const useStyles = makeStyles({
28
28
  /**
29
29
  * Apply styling to the CardFooter slots based on the state.
30
30
  */ export const useCardFooterStyles_unstable = (state)=>{
31
- 'use no memo';
32
31
  const styles = useStyles();
33
32
  // eslint-disable-next-line react-hooks/immutability
34
33
  state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CardFooter/useCardFooterStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { CardFooterSlots, CardFooterState } from './CardFooter.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardFooterClassNames: SlotClassNames<CardFooterSlots> = {\n root: 'fui-CardFooter',\n action: 'fui-CardFooter__action',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n gap: '12px',\n },\n action: {\n marginLeft: 'auto',\n\n // when the card is selected or hovered, it has custom high contrast color and background styles\n // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode\n '@media (forced-colors: active)': {\n '& .fui-Button, & .fui-Link': {\n ...shorthands.borderColor('currentColor'),\n color: 'currentColor',\n outlineColor: 'currentColor',\n },\n },\n },\n});\n\n/**\n * Apply styling to the CardFooter slots based on the state.\n */\nexport const useCardFooterStyles_unstable = (state: CardFooterState): CardFooterState => {\n 'use no memo';\n\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n\n if (state.action) {\n // eslint-disable-next-line react-hooks/immutability\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","cardFooterClassNames","root","action","useStyles","display","flexDirection","gap","marginLeft","borderColor","color","outlineColor","useCardFooterStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE;;CAEC,GACD,OAAO,MAAMC,uBAAwD;IACnEC,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF,MAAMC,YAAYN,WAAW;IAC3BI,MAAM;QACJG,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAJ,QAAQ;QACNK,YAAY;QAEZ,gGAAgG;QAChG,qGAAqG;QACrG,kCAAkC;YAChC,8BAA8B;gBAC5B,GAAGR,WAAWS,WAAW,CAAC,eAAe;gBACzCC,OAAO;gBACPC,cAAc;YAChB;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3C;IAEA,MAAMC,SAASV;IACf,oDAAoD;IACpDS,MAAMX,IAAI,CAACa,SAAS,GAAGhB,aAAaE,qBAAqBC,IAAI,EAAEY,OAAOZ,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IAEhG,IAAIF,MAAMV,MAAM,EAAE;QAChB,oDAAoD;QACpDU,MAAMV,MAAM,CAACY,SAAS,GAAGhB,aAAaE,qBAAqBE,MAAM,EAAEW,OAAOX,MAAM,EAAEU,MAAMV,MAAM,CAACY,SAAS;IAC1G;IAEA,OAAOF;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CardFooter/useCardFooterStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { CardFooterSlots, CardFooterState } from './CardFooter.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardFooterClassNames: SlotClassNames<CardFooterSlots> = {\n root: 'fui-CardFooter',\n action: 'fui-CardFooter__action',\n};\n\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n gap: '12px',\n },\n action: {\n marginLeft: 'auto',\n\n // when the card is selected or hovered, it has custom high contrast color and background styles\n // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode\n '@media (forced-colors: active)': {\n '& .fui-Button, & .fui-Link': {\n ...shorthands.borderColor('currentColor'),\n color: 'currentColor',\n outlineColor: 'currentColor',\n },\n },\n },\n});\n\n/**\n * Apply styling to the CardFooter slots based on the state.\n */\nexport const useCardFooterStyles_unstable = (state: CardFooterState): CardFooterState => {\n const styles = useStyles();\n // eslint-disable-next-line react-hooks/immutability\n state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n\n if (state.action) {\n // eslint-disable-next-line react-hooks/immutability\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","cardFooterClassNames","root","action","useStyles","display","flexDirection","gap","marginLeft","borderColor","color","outlineColor","useCardFooterStyles_unstable","state","styles","className"],"mappings":"AAAA;AAGA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AAGtE;;CAEC,GACD,OAAO,MAAMC,uBAAwD;IACnEC,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF,MAAMC,YAAYN,WAAW;IAC3BI,MAAM;QACJG,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAJ,QAAQ;QACNK,YAAY;QAEZ,gGAAgG;QAChG,qGAAqG;QACrG,kCAAkC;YAChC,8BAA8B;gBAC5B,GAAGR,WAAWS,WAAW,CAAC,eAAe;gBACzCC,OAAO;gBACPC,cAAc;YAChB;QACF;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3C,MAAMC,SAASV;IACf,oDAAoD;IACpDS,MAAMX,IAAI,CAACa,SAAS,GAAGhB,aAAaE,qBAAqBC,IAAI,EAAEY,OAAOZ,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IAEhG,IAAIF,MAAMV,MAAM,EAAE;QAChB,oDAAoD;QACpDU,MAAMV,MAAM,CAACY,SAAS,GAAGhB,aAAaE,qBAAqBE,MAAM,EAAEW,OAAOX,MAAM,EAAEU,MAAMV,MAAM,CAACY,SAAS;IAC1G;IAEA,OAAOF;AACT,EAAE"}
@@ -1,9 +1,9 @@
1
1
  'use client';
2
- import * as React from 'react';
3
- import { useCardHeader_unstable } from './useCardHeader';
4
- import { renderCardHeader_unstable } from './renderCardHeader';
5
- import { useCardHeaderStyles_unstable } from './useCardHeaderStyles.styles';
6
- import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
2
+ import * as React from "react";
3
+ import { useCardHeader_unstable } from "./useCardHeader.js";
4
+ import { renderCardHeader_unstable } from "./renderCardHeader.js";
5
+ import { useCardHeaderStyles_unstable } from "./useCardHeaderStyles.styles.js";
6
+ import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
7
7
  /**
8
8
  * Component to render an image, text and an action in a Card component.
9
9
  */ export const CardHeader = /*#__PURE__*/ React.forwardRef((props, ref)=>{