npm - @fluentui/react-card - Versions diffs - 9.3.3 → 9.4.1 - Mend

@fluentui/react-card 9.3.3 → 9.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (78) hide show

package/lib-commonjs/components/Card/useCardStyles.styles.raw.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../src/components/Card/useCardStyles.styles.ts"],"sourcesContent":["import * as React from '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 { FocusOutlineStyleOptions, 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 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\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: 1,\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\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.interactive || state.selectable;\n\n const focusedClassName = React.useMemo(() => {\n if (state.selectable) {\n if (state.selectFocused) {\n return styles.selectableFocused;\n }\n\n return '';\n }\n\n return styles.focused;\n }, [state.selectFocused, state.selectable, styles.focused, styles.selectableFocused]);\n\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.root.className,\n );\n\n if (state.floatingAction) {\n state.floatingAction.className = mergeClasses(\n cardClassNames.floatingAction,\n styles.select,\n state.floatingAction.className,\n );\n }\n\n if (state.checkbox) {\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","useCardStyles","focused","style","selector","selectableFocused","orientationHorizontal","flexDirection","alignItems","marginTop","marginBottom","marginLeft","marginRight","flexGrow","orientationVertical","sizeSmall","borderRadiusSmall","sizeMedium","borderRadiusMedium","sizeLarge","borderRadiusLarge","interactive","filled","backgroundColor","colorNeutralBackground1","boxShadow","shadow4","borderColor","colorTransparentStroke","filledInteractive","cursor","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","subtle","colorSubtleBackground","subtleInteractive","colorSubtleBackgroundHover","colorSubtleBackgroundPressed","subtleInteractiveSelected","colorSubtleBackgroundSelected","highContrastSelected","forcedColorAdjust","highContrastInteractive","select","zIndex","hiddenCheckbox","width","height","clip","clipPath","whiteSpace","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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"}

package/lib-commonjs/components/CardFooter/CardFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardFooter/CardFooter.tsx"],"sourcesContent":["import * 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":["~~CardFooter~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useCardFooter_unstable~~","~~useCardFooterStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderCardFooter_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAWaA;;;eAAAA;;;;~~iEAXU;+~~BACgB~~;~~kCACG~~;~~2CACG~~;~~qCAGD~~;~~AAKrC~~,~~MAAMA~~,~~aAAAA,~~WAAAA,~~GAAmDC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,~~QAAQC~~,~~IAAAA~~,~~qCAAAA~~,~~EAAuBH,~~OAAOC;~~IAE5CG~~,~~IAAAA,~~uDAAAA,~~EAA6BF~~;~~IAE7BG~~,~~IAAAA,~~gDAAAA,EAA4B,~~gCAAgCH~~;IAE5D,~~OAAOI~~,~~IAAAA,~~2CAAAA,~~EAA0BJ~~;AACnC;~~AAEAL~~,~~WAAWU~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/CardFooter/CardFooter.tsx"],"sourcesContent":["import * 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":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;+BACQ,kBAAkB;kCACf,qBAAqB;2CAClB,+BAA+B;qCAGhC,kCAAkC;AAKvE,mBAAMA,WAAAA,GAAmDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,yCAAAA,EAAuBM,OAAOC;QAE5CL,uDAAAA,EAA6BM;QAE7BL,gDAAAA,EAA4B,gCAAgCK;IAE5D,WAAOP,2CAAAA,EAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib-commonjs/components/CardFooter/CardFooter.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardFooter/CardFooter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the CardFooter component.\n /\nexport type CardFooterSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Container that renders on the far end of the footer, used for action buttons.\n /\n action?: Slot<'div'>;\n};\n\n/\n CardFooter component props.\n /\nexport type CardFooterProps = ComponentProps<CardFooterSlots>;\n\n/\n State used in rendering CardFooter.\n */\nexport type CardFooterState = ComponentState<CardFooterSlots>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAsBA;;CAEC"}
1	+ {"version":3,"sources":["../src/components/CardFooter/CardFooter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the CardFooter component.\n /\nexport type CardFooterSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Container that renders on the far end of the footer, used for action buttons.\n /\n action?: Slot<'div'>;\n};\n\n/\n CardFooter component props.\n /\nexport type CardFooterProps = ComponentProps<CardFooterSlots>;\n\n/\n State used in rendering CardFooter.\n */\nexport type CardFooterState = ComponentState<CardFooterSlots>;\n"],"names":[],"mappings":"AAsBA;;CAEC,GACD,WAA8D"}

package/lib-commonjs/components/CardFooter/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardFooter/index.ts"],"sourcesContent":["export { CardFooter } from './CardFooter';\nexport type { CardFooterProps, CardFooterSlots, CardFooterState } from './CardFooter.types';\nexport { renderCardFooter_unstable } from './renderCardFooter';\nexport { useCardFooter_unstable } from './useCardFooter';\nexport { cardFooterClassNames, useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\n"],"names":["CardFooter","~~cardFooterClassNames~~","~~renderCardFooter_unstable~~","~~useCardFooterStyles_unstable~~","~~useCardFooter_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~UAAU;eAAVA,~~sBAAU~~;;IAIVC,oBAAoB;eAApBA~~,+CAAoB~~;;IAFpBC~~,~~yBAAyB;eAAzBA,~~2CAAyB~~;;IAEHC~~,~~4BAA4B;eAA5BA,~~uDAA4B~~;;IADlDC~~,~~sBAAsB;eAAtBA,~~qCAAsB;;;4BAHJ;~~kCAEe~~;+~~BACH~~;~~2CAC4B~~"}
1	+ {"version":3,"sources":["../src/components/CardFooter/index.ts"],"sourcesContent":["export { CardFooter } from './CardFooter';\nexport type { CardFooterProps, CardFooterSlots, CardFooterState } from './CardFooter.types';\nexport { renderCardFooter_unstable } from './renderCardFooter';\nexport { useCardFooter_unstable } from './useCardFooter';\nexport { cardFooterClassNames, useCardFooterStyles_unstable } from './useCardFooterStyles.styles';\n"],"names":["CardFooter","renderCardFooter_unstable","useCardFooter_unstable","cardFooterClassNames","useCardFooterStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,sBAAU;;;eAIVG,+CAAoB;;;eAFpBF,2CAAyB;;;eAEHG,uDAA4B;;;eADlDF,qCAAsB;;;4BAHJ,eAAe;kCAEA,qBAAqB;+BACxB,kBAAkB;2CACU,+BAA+B"}

package/lib-commonjs/components/CardFooter/renderCardFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardFooter/renderCardFooter.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardFooterSlots, CardFooterState } from './CardFooter.types';\n\n/\n Render the final JSX of CardFooter.\n */\nexport const renderCardFooter_unstable = (state: CardFooterState) => {\n assertSlots<CardFooterSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.action && <state.action />}\n </state.root>\n );\n};\n"],"names":["~~renderCardFooter_unstable~~","~~state~~","~~assertSlots~~","~~_jsxs","~~root","children","action"~~,"_jsx"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BASaA;;;eAAAA;;;~~4BARb;~~gCAE4B~~;~~AAMrB~~,~~MAAMA~~,~~4BAA4B,~~CAACC;~~IACxCC~~,~~IAAAA,~~2BAAAA,~~EAA6BD~~;IAE7B,OAAA,WAAA,~~GACEE~~,~~IAAAA,~~gBAAA,~~EAACF~~,~~MAAMG~~,IAAI,EAAA;;~~YACRH~~,~~MAAMG~~,IAAI,CAACC,QAAQ;~~YACnBJ~~,~~MAAMK~~,MAAM,IAAA,WAAA,~~GAAIC~~,~~IAAAA,~~eAAA,~~EAACN~~,~~MAAMK~~,MAAM,EAAA,CAAA;;;AAGpC"}
1	+ {"version":3,"sources":["../src/components/CardFooter/renderCardFooter.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardFooterSlots, CardFooterState } from './CardFooter.types';\n\n/\n Render the final JSX of CardFooter.\n */\nexport const renderCardFooter_unstable = (state: CardFooterState) => {\n assertSlots<CardFooterSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.action && <state.action />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderCardFooter_unstable","state","root","children","action"],"mappings":";;;;+BASaC;;;;;;4BARb,iCAAiD;gCAErB,4BAA4B;AAMjD,kCAAkC,CAACC;QACxCF,2BAAAA,EAA6BE;IAE7B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAMC,IAAI,CAACC,QAAQ;YACnBF,MAAMG,MAAM,IAAA,WAAA,OAAI,eAAA,EAACH,MAAMG,MAAM,EAAA,CAAA;;;AAGpC,EAAE"}

package/lib-commonjs/components/CardFooter/useCardFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardFooter/useCardFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { CardFooterProps, CardFooterState } from './CardFooter.types';\n\n/*\n Create the state required to render CardFooter.\n \n The returned state can be modified with hooks such as useCardFooterStyles_unstable,\n * before being passed to renderCardFooter_unstable.\n \n @param props - props from this instance of CardFooter\n * @param ref - reference to root HTMLElement of CardFooter\n */\nexport const useCardFooter_unstable = (props: CardFooterProps, ref: React.Ref<HTMLElement>): CardFooterState => {\n const { action } = props;\n\n return {\n components: {\n root: 'div',\n action: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n ),\n action: slot.optional(action, { elementType: 'div' }),\n };\n};\n"],"names":["useCardFooter_unstable","props","ref","action","components","root","~~slot","~~always","~~getIntrinsicElementProps","~~elementType","optional"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAaaA;;;eAAAA;;;;~~iEAbU;~~gCACwB~~;~~AAYxC~~,~~MAAMA,yBAAyB,~~CAACC,OAAwBC;IAC7D,MAAM,EAAEC,MAAM,EAAE,GAAGF;IAEnB,OAAO;QACLG,YAAY;YACVC,MAAM;YACNF,QAAQ;QACV;QAEAE,~~MAAMC~~,oBAAAA,~~CAAKC~~,MAAM,~~CACfC~~,~~IAAAA~~,~~wCAAAA,~~EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;~~YAC5FN~~,KAAKA;YACL,GAAGD,KAAK;QACV,IACA;~~YAAEQ~~,aAAa;QAAM;~~QAEvBN~~,~~QAAQG~~,oBAAAA,~~CAAKI~~,QAAQ,~~CAACP~~,QAAQ;~~YAAEM~~,aAAa;QAAM;IACrD;AACF"}
1	+ {"version":3,"sources":["../src/components/CardFooter/useCardFooter.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { CardFooterProps, CardFooterState } from './CardFooter.types';\n\n/*\n Create the state required to render CardFooter.\n \n The returned state can be modified with hooks such as useCardFooterStyles_unstable,\n * before being passed to renderCardFooter_unstable.\n \n @param props - props from this instance of CardFooter\n * @param ref - reference to root HTMLElement of CardFooter\n */\nexport const useCardFooter_unstable = (props: CardFooterProps, ref: React.Ref<HTMLElement>): CardFooterState => {\n const { action } = props;\n\n return {\n components: {\n root: 'div',\n action: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n ),\n action: slot.optional(action, { elementType: 'div' }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useCardFooter_unstable","props","ref","action","components","root","always","elementType","optional"],"mappings":";;;;+BAaaG;;;;;;;iEAbU,QAAQ;gCACgB,4BAA4B;AAYpE,+BAA+B,CAACC,OAAwBC;IAC7D,MAAM,EAAEC,MAAM,EAAE,GAAGF;IAEnB,OAAO;QACLG,YAAY;YACVC,MAAM;YACNF,QAAQ;QACV;QAEAE,MAAMN,oBAAAA,CAAKO,MAAM,CACfR,4CAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FI,KAAKA;YACL,GAAGD,KAAK;QACV,IACA;YAAEM,aAAa;QAAM;QAEvBJ,QAAQJ,oBAAAA,CAAKS,QAAQ,CAACL,QAAQ;YAAEI,aAAa;QAAM;IACrD;AACF,EAAE"}

package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useCardFooterStyles.styles.js"],"sourcesContent":["import { 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 state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n if (state.action) {\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"],"names":["~~cardFooterClassNames~~","~~useCardFooterStyles_unstable~~","root","action","useStyles","~~__styles","~~mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","Frg6f3","B7frvx2","B06c7xf","B8uq84v","snkdo8","Bpf22ct","apjfyd","d","p","m","state","styles","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAGiBA~~,oBAAoB~~;eAApBA;;IAyBAC~~,4BAA4B;~~eAA5BA;;;uBA5BoC~~;~~AAG1C~~,~~MAAMD~~,~~uBAAuB~~;~~IACpCE~~,MAAM~~;IACNC~~,~~QAAQ~~;AACZ;~~AACA~~,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAH~~,~~MAAA~~;~~QAAAI~~,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;~~IAAAP~~,~~QAAA~~;~~QAAAQ~~,~~QAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;AAAA,GAAA;IAAAC,~~GAAA~~;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,~~GAAA~~,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;IAAAC,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;KAAA;AAAA;~~AAqBP~~,~~MAAMnB,+BAAgCoB~~,~~CAAAA~~;~~IAC7C~~;~~IACA~~,MAAMC,~~SAASlB~~;~~IACfiB~~,~~MAAMnB~~,IAAI,CAACqB,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAACxB~~,~~qBAAqBE~~,IAAI,EAAEoB,~~OAAOpB~~,IAAI,EAAEmB,~~MAAMnB~~,IAAI,CAACqB,SAAS;~~IAChG~~,IAAIF,~~MAAMlB~~,MAAM,EAAE;QACdkB,~~MAAMlB~~,MAAM,CAACoB,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAACxB~~,~~qBAAqBG~~,MAAM,EAAEmB,~~OAAOnB~~,MAAM,EAAEkB,~~MAAMlB~~,MAAM,CAACoB,SAAS;~~IAC5G~~;IACA,OAAOF;~~AACX~~"}
1	+ {"version":3,"sources":["useCardFooterStyles.styles.js"],"sourcesContent":["import { 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 state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n if (state.action) {\n state.action.className = mergeClasses(cardFooterClassNames.action, styles.action, state.action.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","cardFooterClassNames","root","action","useStyles","mc9l5x","Beiy3e4","i8kkvl","Belr9w4","rmohyg","Frg6f3","B7frvx2","B06c7xf","B8uq84v","snkdo8","Bpf22ct","apjfyd","d","p","m","useCardFooterStyles_unstable","state","styles","className"],"mappings":";;;;;;;;;;;IAGiBG,oBAAoB;;;IAyBpBmB,4BAA4B;;;;uBA5BQ,gBAAgB;AAG1D,6BAA6B;IACpClB,IAAI,EAAE,gBAAgB;IACtBC,MAAM,EAAE;AACZ,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGN,eAAA,EAAA;IAAAI,IAAA,EAAA;QAAAG,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAN,MAAA,EAAA;QAAAO,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA;YAAA;SAAA;KAAA;AAAA,CAkBjB,CAAC;AAGS,qCAAsCE,KAAK,IAAG;IACrD,aAAa;IACb,MAAMC,MAAM,GAAGlB,SAAS,CAAC,CAAC;IAC1BiB,KAAK,CAACnB,IAAI,CAACqB,SAAS,OAAGxB,mBAAY,EAACE,oBAAoB,CAACC,IAAI,EAAEoB,MAAM,CAACpB,IAAI,EAAEmB,KAAK,CAACnB,IAAI,CAACqB,SAAS,CAAC;IACjG,IAAIF,KAAK,CAAClB,MAAM,EAAE;QACdkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,OAAGxB,mBAAY,EAACE,oBAAoB,CAACE,MAAM,EAAEmB,MAAM,CAACnB,MAAM,EAAEkB,KAAK,CAAClB,MAAM,CAACoB,SAAS,CAAC;IAC7G;IACA,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.raw.js ADDED Viewed

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    cardFooterClassNames: function() {
+        return cardFooterClassNames;
+    },
+    useCardFooterStyles_unstable: function() {
+        return useCardFooterStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const cardFooterClassNames = {
+    root: 'fui-CardFooter',
+    action: 'fui-CardFooter__action'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        display: 'flex',
+        flexDirection: 'row',
+        gap: '12px'
+    },
+    action: {
+        marginLeft: 'auto',
+        // when the card is selected or hovered, it has custom high contrast color and background styles
+        // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode
+        '@media (forced-colors: active)': {
+            '& .fui-Button, & .fui-Link': {
+                ..._react.shorthands.borderColor('currentColor'),
+                color: 'currentColor',
+                outlineColor: 'currentColor'
+            }
+        }
+    }
+});
+const useCardFooterStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(cardFooterClassNames.root, styles.root, state.root.className);
+    if (state.action) {
+        state.action.className = (0, _react.mergeClasses)(cardFooterClassNames.action, styles.action, state.action.className);
+    }
+    return state;
+};

package/lib-commonjs/components/CardFooter/useCardFooterStyles.styles.raw.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../src/components/CardFooter/useCardFooterStyles.styles.ts"],"sourcesContent":["import 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 state.root.className = mergeClasses(cardFooterClassNames.root, styles.root, state.root.className);\n\n if (state.action) {\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":";;;;;;;;;;;IAOaG,oBAAAA;;;IA6BAW,4BAAAA;;;;uBAnCwC,iBAAiB;AAM/D,6BAA8D;IACnEV,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF,MAAMC,gBAAYN,iBAAAA,EAAW;IAC3BI,MAAM;QACJG,SAAS;QACTC,eAAe;QACfC,KAAK;IACP;IACAJ,QAAQ;QACNK,YAAY;QAEZ,gGAAgG;QAChG,qGAAqG;QACrG,kCAAkC;YAChC,8BAA8B;gBAC5B,GAAGR,iBAAAA,CAAWS,WAAW,CAAC,eAAe;gBACzCC,OAAO;gBACPC,cAAc;YAChB;QACF;IACF;AACF;AAKO,qCAAqC,CAACE;IAC3C;IAEA,MAAMC,SAASV;IACfS,MAAMX,IAAI,CAACa,SAAS,OAAGhB,mBAAAA,EAAaE,qBAAqBC,IAAI,EAAEY,OAAOZ,IAAI,EAAEW,MAAMX,IAAI,CAACa,SAAS;IAEhG,IAAIF,MAAMV,MAAM,EAAE;QAChBU,MAAMV,MAAM,CAACY,SAAS,OAAGhB,mBAAAA,EAAaE,qBAAqBE,MAAM,EAAEW,OAAOX,MAAM,EAAEU,MAAMV,MAAM,CAACY,SAAS;IAC1G;IAEA,OAAOF;AACT,EAAE"}

package/lib-commonjs/components/CardHeader/CardHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCardHeader_unstable } from './useCardHeader';\nimport { renderCardHeader_unstable } from './renderCardHeader';\nimport { useCardHeaderStyles_unstable } from './useCardHeaderStyles.styles';\nimport type { CardHeaderProps } from './CardHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Component to render an image, text and an action in a Card component.\n */\nexport const CardHeader: ForwardRefComponent<CardHeaderProps> = React.forwardRef((props, ref) => {\n const state = useCardHeader_unstable(props, ref);\n\n useCardHeaderStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardHeaderStyles_unstable')(state);\n\n return renderCardHeader_unstable(state);\n});\n\nCardHeader.displayName = 'CardHeader';\n"],"names":["~~CardHeader~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useCardHeader_unstable~~","~~useCardHeaderStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderCardHeader_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAWaA;;;eAAAA;;;;~~iEAXU;+~~BACgB~~;~~kCACG~~;~~2CACG~~;~~qCAGD~~;~~AAKrC~~,~~MAAMA~~,~~aAAAA,~~WAAAA,~~GAAmDC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,~~QAAQC~~,~~IAAAA~~,~~qCAAAA~~,~~EAAuBH,~~OAAOC;~~IAE5CG~~,~~IAAAA,~~uDAAAA,~~EAA6BF~~;~~IAE7BG~~,~~IAAAA,~~gDAAAA,EAA4B,~~gCAAgCH~~;IAE5D,~~OAAOI~~,~~IAAAA,~~2CAAAA,~~EAA0BJ~~;AACnC;~~AAEAL~~,~~WAAWU~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/CardHeader/CardHeader.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCardHeader_unstable } from './useCardHeader';\nimport { renderCardHeader_unstable } from './renderCardHeader';\nimport { useCardHeaderStyles_unstable } from './useCardHeaderStyles.styles';\nimport type { CardHeaderProps } from './CardHeader.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Component to render an image, text and an action in a Card component.\n */\nexport const CardHeader: ForwardRefComponent<CardHeaderProps> = React.forwardRef((props, ref) => {\n const state = useCardHeader_unstable(props, ref);\n\n useCardHeaderStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardHeaderStyles_unstable')(state);\n\n return renderCardHeader_unstable(state);\n});\n\nCardHeader.displayName = 'CardHeader';\n"],"names":["React","useCardHeader_unstable","renderCardHeader_unstable","useCardHeaderStyles_unstable","useCustomStyleHook_unstable","CardHeader","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;+BACQ,kBAAkB;kCACf,qBAAqB;2CAClB,+BAA+B;qCAGhC,kCAAkC;AAKvE,mBAAMA,WAAAA,GAAmDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQR,yCAAAA,EAAuBM,OAAOC;QAE5CL,uDAAAA,EAA6BM;QAE7BL,gDAAAA,EAA4B,gCAAgCK;IAE5D,WAAOP,2CAAAA,EAA0BO;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib-commonjs/components/CardHeader/CardHeader.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardHeader/CardHeader.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the CardHeader component.\n /\nexport type CardHeaderSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Element used to render an image or avatar related to the card.\n /\n image: Slot<'div', 'img'>;\n\n /\n Element used to render the main header title.\n /\n header: Slot<'div'>;\n\n /\n Element used to render short descriptions related to the title.\n /\n description: Slot<'div'>;\n\n /\n Container that renders on the far end of the footer, used for action buttons.\n /\n action?: Slot<'div'>;\n};\n\n/\n CardHeader component props.\n /\nexport type CardHeaderProps = ComponentProps<Partial<CardHeaderSlots>>;\n\n/\n State used in rendering CardHeader.\n */\nexport type CardHeaderState = ComponentState<CardHeaderSlots>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAqCA;;CAEC"}
1	+ {"version":3,"sources":["../src/components/CardHeader/CardHeader.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the CardHeader component.\n /\nexport type CardHeaderSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Element used to render an image or avatar related to the card.\n /\n image: Slot<'div', 'img'>;\n\n /\n Element used to render the main header title.\n /\n header: Slot<'div'>;\n\n /\n Element used to render short descriptions related to the title.\n /\n description: Slot<'div'>;\n\n /\n Container that renders on the far end of the footer, used for action buttons.\n /\n action?: Slot<'div'>;\n};\n\n/\n CardHeader component props.\n /\nexport type CardHeaderProps = ComponentProps<Partial<CardHeaderSlots>>;\n\n/\n State used in rendering CardHeader.\n */\nexport type CardHeaderState = ComponentState<CardHeaderSlots>;\n"],"names":[],"mappings":"AAqCA;;CAEC,GACD,WAA8D"}

package/lib-commonjs/components/CardHeader/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardHeader/index.ts"],"sourcesContent":["export { CardHeader } from './CardHeader';\nexport type { CardHeaderProps, CardHeaderSlots, CardHeaderState } from './CardHeader.types';\nexport { renderCardHeader_unstable } from './renderCardHeader';\nexport { useCardHeader_unstable } from './useCardHeader';\nexport { cardHeaderCSSVars, cardHeaderClassNames, useCardHeaderStyles_unstable } from './useCardHeaderStyles.styles';\n"],"names":["CardHeader","~~cardHeaderCSSVars~~","~~cardHeaderClassNames~~","~~renderCardHeader_unstable~~","~~useCardHeaderStyles_unstable~~","~~useCardHeader_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~UAAU;eAAVA,~~sBAAU~~;;IAIVC~~,~~iBAAiB;eAAjBA,~~4CAAiB~~;;IAAEC,oBAAoB;eAApBA~~,+CAAoB~~;;IAFvCC~~,~~yBAAyB;eAAzBA,~~2CAAyB~~;;IAEgBC~~,~~4BAA4B;eAA5BA,~~uDAA4B~~;;IADrEC~~,~~sBAAsB;eAAtBA,~~qCAAsB;;;4BAHJ;~~kCAEe~~;+~~BACH~~;~~2CAC~~+C"}
1	+ {"version":3,"sources":["../src/components/CardHeader/index.ts"],"sourcesContent":["export { CardHeader } from './CardHeader';\nexport type { CardHeaderProps, CardHeaderSlots, CardHeaderState } from './CardHeader.types';\nexport { renderCardHeader_unstable } from './renderCardHeader';\nexport { useCardHeader_unstable } from './useCardHeader';\nexport { cardHeaderCSSVars, cardHeaderClassNames, useCardHeaderStyles_unstable } from './useCardHeaderStyles.styles';\n"],"names":["CardHeader","renderCardHeader_unstable","useCardHeader_unstable","cardHeaderCSSVars","cardHeaderClassNames","useCardHeaderStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,sBAAU;;;eAIVG,4CAAiB;;;eAAEC,+CAAoB;;;eAFvCH,2CAAyB;;;eAEgBI,uDAA4B;;;eADrEH,qCAAsB;;;4BAHJ,eAAe;kCAEA,qBAAqB;+BACxB,kBAAkB;2CAC6B,+BAA+B"}

package/lib-commonjs/components/CardHeader/renderCardHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardHeader/renderCardHeader.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';\n\n/\n Render the final JSX of CardHeader.\n */\nexport const renderCardHeader_unstable = (state: CardHeaderState) => {\n assertSlots<CardHeaderSlots>(state);\n\n return (\n <state.root>\n {state.image && <state.image />}\n {state.header && <state.header />}\n {state.description && <state.description />}\n {state.action && <state.action />}\n </state.root>\n );\n};\n"],"names":["~~renderCardHeader_unstable~~","~~state~~","~~assertSlots~~","~~_jsxs","~~root","image","~~_jsx","~~header","description","action"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BASaA;;;eAAAA;;;~~4BARb;~~gCAE4B~~;~~AAMrB~~,~~MAAMA~~,~~4BAA4B,~~CAACC;~~IACxCC~~,~~IAAAA,~~2BAAAA,~~EAA6BD~~;IAE7B,OAAA,WAAA,~~GACEE~~,~~IAAAA,~~gBAAA,~~EAACF~~,~~MAAMG~~,IAAI,EAAA;;~~YACRH~~,~~MAAMI~~,KAAK,IAAA,WAAA,~~GAAIC~~,~~IAAAA,~~eAAA,~~EAACL~~,~~MAAMI~~,KAAK,EAAA,CAAA;~~YAC3BJ~~,~~MAAMM~~,MAAM,IAAA,WAAA,~~GAAID~~,~~IAAAA,~~eAAA,~~EAACL~~,~~MAAMM~~,MAAM,EAAA,CAAA;~~YAC7BN~~,~~MAAMO~~,WAAW,IAAA,WAAA,~~GAAIF~~,~~IAAAA,~~eAAA,~~EAACL~~,~~MAAMO~~,WAAW,EAAA,CAAA;~~YACvCP~~,~~MAAMQ~~,MAAM,IAAA,WAAA,~~GAAIH~~,~~IAAAA,~~eAAA,EAACL,~~MAAMQ~~,MAAM,EAAA,CAAA;;;AAGpC"}
1	+ {"version":3,"sources":["../src/components/CardHeader/renderCardHeader.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';\n\n/\n Render the final JSX of CardHeader.\n */\nexport const renderCardHeader_unstable = (state: CardHeaderState) => {\n assertSlots<CardHeaderSlots>(state);\n\n return (\n <state.root>\n {state.image && <state.image />}\n {state.header && <state.header />}\n {state.description && <state.description />}\n {state.action && <state.action />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderCardHeader_unstable","state","root","image","header","description","action"],"mappings":";;;;+BASaC;;;;;;4BARb,iCAAiD;gCAErB,4BAA4B;AAMjD,kCAAkC,CAACC;QACxCF,2BAAAA,EAA6BE;IAE7B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAME,KAAK,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,KAAK,EAAA,CAAA;YAC3BF,MAAMG,MAAM,IAAA,WAAA,OAAI,eAAA,EAACH,MAAMG,MAAM,EAAA,CAAA;YAC7BH,MAAMI,WAAW,IAAA,WAAA,OAAI,eAAA,EAACJ,MAAMI,WAAW,EAAA,CAAA;YACvCJ,MAAMK,MAAM,IAAA,WAAA,OAAI,eAAA,EAACL,MAAMK,MAAM,EAAA,CAAA;;;AAGpC,EAAE"}

package/lib-commonjs/components/CardHeader/useCardHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardHeader/useCardHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { CardHeaderProps, CardHeaderState } from './CardHeader.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardHeaderClassNames } from './useCardHeaderStyles.styles';\n\n/*\n Finds the first child of CardHeader with an id prop.\n \n @param header - the header prop of CardHeader\n /\nfunction getChildWithId(header: React.ReactNode) {\n function isReactElementWithIdProp(element: React.ReactNode): element is React.ReactElement {\n return React.isValidElement(element) && Boolean(element.props.id);\n }\n\n return React.Children.toArray(header).find(isReactElementWithIdProp);\n}\n\n/\n Returns the id to use for the CardHeader root element.\n \n @param headerId - the id prop of the CardHeader component\n * @param childWithId - the first child of the CardHeader component with an id prop\n * @param generatedId - a generated id\n \n @returns the id to use for the CardHeader root element\n /\nfunction getReferenceId(\n headerId: string \| undefined,\n childWithId: React.ReactElement \| undefined,\n generatedId: string,\n): string {\n if (headerId) {\n return headerId;\n }\n\n if (childWithId?.props.id) {\n return childWithId.props.id;\n }\n\n return generatedId;\n}\n\n/\n Create the state required to render CardHeader.\n \n The returned state can be modified with hooks such as useCardHeaderStyles_unstable,\n * before being passed to renderCardHeader_unstable.\n \n @param props - props from this instance of CardHeader\n * @param ref - reference to root HTMLElement of CardHeader\n */\nexport const useCardHeader_unstable = (props: CardHeaderProps, ref: React.Ref<HTMLElement>): CardHeaderState => {\n const { image, header, description, action } = props;\n\n const {\n selectableA11yProps: { referenceId, setReferenceId },\n } = useCardContext_unstable();\n const headerRef = React.useRef<HTMLDivElement>(null);\n\n const hasChildId = React.useRef(false);\n const generatedId = useId(cardHeaderClassNames.header, referenceId);\n\n const headerSlot = slot.optional(header, {\n renderByDefault: true,\n defaultProps: {\n ref: headerRef,\n id: !hasChildId.current ? referenceId : undefined,\n },\n elementType: 'div',\n });\n React.useEffect(() => {\n const headerId = !hasChildId.current ? headerRef.current?.id : undefined;\n const childWithId = getChildWithId(headerSlot?.children);\n hasChildId.current = Boolean(childWithId);\n setReferenceId(getReferenceId(headerId, childWithId, generatedId));\n }, [generatedId, header, headerSlot, setReferenceId]);\n return {\n components: { root: 'div', image: 'div', header: 'div', description: 'div', action: 'div' },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n ),\n image: slot.optional(image, { elementType: 'div' }),\n header: headerSlot,\n description: slot.optional(description, { elementType: 'div' }),\n action: slot.optional(action, { elementType: 'div' }),\n };\n};\n"],"names":["~~useCardHeader_unstable~~","getChildWithId","header","isReactElementWithIdProp","element","~~React","~~isValidElement","Boolean","props","id","Children","toArray","find","getReferenceId","headerId","childWithId","generatedId","ref","image","description","action","selectableA11yProps","referenceId","setReferenceId","~~useCardContext_unstable","~~headerRef","useRef","hasChildId","~~useId","cardHeaderClassNames","~~headerSlot","~~slot","~~optional","renderByDefault","defaultProps","current","undefined","elementType","useEffect","children","components","root","always"~~,"getIntrinsicElementProps"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAqDaA;;;eAAAA;;;;~~iEArDU;~~gCAC~~+B;~~6BAEd;2CACH;AAErC~~;;;;CAIC,GACD,~~SAASC~~,eAAeC,MAAuB;IAC7C,SAASC,yBAAyBC,OAAwB;QACxD,~~qBAAOC~~,~~OAAMC~~,cAAc,~~CAACF~~,~~YAAYG~~,~~QAAQH~~,~~QAAQI~~,KAAK,CAACC,EAAE;IAClE;IAEA,~~OAAOJ~~,~~OAAMK~~,QAAQ,CAACC,OAAO,~~CAACT~~,~~QAAQU~~,IAAI,~~CAACT~~;AAC7C;AAEA;;;;;;;;CAQC,GACD,~~SAASU~~,eACPC,QAA4B,EAC5BC,WAA2C,EAC3CC,WAAmB;IAEnB,IAAIF,UAAU;QACZ,OAAOA;IACT;IAEA,IAAIC,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,YAAaP,KAAK,CAACC,EAAE,EAAE;QACzB,OAAOM,YAAYP,KAAK,CAACC,EAAE;IAC7B;IAEA,OAAOO;AACT;AAWO,~~MAAMhB~~,~~yBAAyB,CAACQ,OAAwBS~~;IAC7D,MAAM,EAAEC,KAAK,EAAEhB,MAAM,EAAEiB,WAAW,EAAEC,MAAM,EAAE,~~GAAGZ~~;IAE/C,MAAM,~~EACJa~~,qBAAqB,EAAEC,WAAW,EAAEC,cAAc,EAAE,EACrD,~~GAAGC~~,~~IAAAA,~~oCAAAA;IACJ,~~MAAMC~~,~~YAAYpB~~,~~OAAMqB~~,MAAM,CAAiB;IAE/C,MAAMC,~~aAAatB~~,~~OAAMqB~~,MAAM,CAAC;IAChC,MAAMV,~~cAAcY~~,~~IAAAA,~~qBAAAA,~~EAAMC~~,+CAAAA,~~CAAqB3B~~,MAAM,EAAEoB;IAEvD,~~MAAMQ~~,~~aAAaC~~,oBAAAA,~~CAAKC~~,QAAQ,~~CAAC9B~~,QAAQ;~~QACvC+B~~,iBAAiB;QACjBC,cAAc;~~YACZjB~~,~~KAAKQ~~;YACLhB,IAAI,CAACkB,~~WAAWQ~~,OAAO,~~GAAGb~~,~~cAAcc~~;QAC1C;QACAC,aAAa;IACf;~~IACAhC~~,~~OAAMiC~~,SAAS,CAAC;~~YACyBb~~;QAAvC,MAAMX,WAAW,CAACa,~~WAAWQ~~,OAAO,GAAA,~~AAAGV~~,~~CAAAA,~~qBAAAA,~~UAAUU~~,~~OAAO~~,~~AAAPA~~,~~MAAO~~,~~QAAjBV~~,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBhB,EAAE,~~GAAG2B~~;QAC/D,~~MAAMrB~~,~~cAAcd~~,~~eAAe6B~~,eAAAA,QAAAA,eAAAA,KAAAA,IAAAA,KAAAA,IAAAA,~~WAAYS~~,QAAQ;~~QACvDZ~~,~~WAAWQ~~,OAAO,~~GAAG5B~~,QAAQQ;~~QAC7BQ~~,~~eAAeV~~,eAAeC,UAAUC,aAAaC;IACvD,GAAG;QAACA;~~QAAad~~;~~QAAQ4B~~;~~QAAYP~~;KAAe;IACpD,OAAO;~~QACLiB~~,YAAY;YAAEC,MAAM;~~YAAOvB~~,OAAO;YAAOhB,QAAQ;YAAOiB,aAAa;YAAOC,QAAQ;QAAM;~~QAE1FqB~~,~~MAAMV~~,oBAAAA,~~CAAKW~~,MAAM,~~CACfC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;~~YAC5F1B~~,KAAKA;YACL,~~GAAGT~~,KAAK;QACV,IACA;~~YAAE6B~~,aAAa;QAAM;~~QAEvBnB~~,~~OAAOa~~,oBAAAA,~~CAAKC~~,QAAQ,~~CAACd~~,OAAO;~~YAAEmB~~,aAAa;QAAM;~~QACjDnC~~,~~QAAQ4B~~;~~QACRX~~,~~aAAaY~~,oBAAAA,~~CAAKC~~,QAAQ,~~CAACb~~,aAAa;~~YAAEkB~~,aAAa;QAAM;~~QAC7DjB~~,~~QAAQW~~,oBAAAA,~~CAAKC~~,QAAQ,~~CAACZ~~,QAAQ;~~YAAEiB~~,aAAa;QAAM;IACrD;AACF"}
1	+ {"version":3,"sources":["../src/components/CardHeader/useCardHeader.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { CardHeaderProps, CardHeaderState } from './CardHeader.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardHeaderClassNames } from './useCardHeaderStyles.styles';\n\n/*\n Finds the first child of CardHeader with an id prop.\n \n @param header - the header prop of CardHeader\n /\nfunction getChildWithId(header: React.ReactNode) {\n function isReactElementWithIdProp(element: React.ReactNode): element is React.ReactElement {\n return React.isValidElement(element) && Boolean(element.props.id);\n }\n\n return React.Children.toArray(header).find(isReactElementWithIdProp);\n}\n\n/\n Returns the id to use for the CardHeader root element.\n \n @param headerId - the id prop of the CardHeader component\n * @param childWithId - the first child of the CardHeader component with an id prop\n * @param generatedId - a generated id\n \n @returns the id to use for the CardHeader root element\n /\nfunction getReferenceId(\n headerId: string \| undefined,\n childWithId: React.ReactElement \| undefined,\n generatedId: string,\n): string {\n if (headerId) {\n return headerId;\n }\n\n if (childWithId?.props.id) {\n return childWithId.props.id;\n }\n\n return generatedId;\n}\n\n/\n Create the state required to render CardHeader.\n \n The returned state can be modified with hooks such as useCardHeaderStyles_unstable,\n * before being passed to renderCardHeader_unstable.\n \n @param props - props from this instance of CardHeader\n * @param ref - reference to root HTMLElement of CardHeader\n */\nexport const useCardHeader_unstable = (props: CardHeaderProps, ref: React.Ref<HTMLElement>): CardHeaderState => {\n const { image, header, description, action } = props;\n\n const {\n selectableA11yProps: { referenceId, setReferenceId },\n } = useCardContext_unstable();\n const headerRef = React.useRef<HTMLDivElement>(null);\n\n const hasChildId = React.useRef(false);\n const generatedId = useId(cardHeaderClassNames.header, referenceId);\n\n const headerSlot = slot.optional(header, {\n renderByDefault: true,\n defaultProps: {\n ref: headerRef,\n id: !hasChildId.current ? referenceId : undefined,\n },\n elementType: 'div',\n });\n React.useEffect(() => {\n const headerId = !hasChildId.current ? headerRef.current?.id : undefined;\n const childWithId = getChildWithId(headerSlot?.children);\n hasChildId.current = Boolean(childWithId);\n setReferenceId(getReferenceId(headerId, childWithId, generatedId));\n }, [generatedId, header, headerSlot, setReferenceId]);\n return {\n components: { root: 'div', image: 'div', header: 'div', description: 'div', action: 'div' },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n ),\n image: slot.optional(image, { elementType: 'div' }),\n header: headerSlot,\n description: slot.optional(description, { elementType: 'div' }),\n action: slot.optional(action, { elementType: 'div' }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useId","slot","useCardContext_unstable","cardHeaderClassNames","getChildWithId","header","isReactElementWithIdProp","element","isValidElement","Boolean","props","id","Children","toArray","find","getReferenceId","headerId","childWithId","generatedId","useCardHeader_unstable","ref","image","description","action","selectableA11yProps","referenceId","setReferenceId","headerRef","useRef","hasChildId","headerSlot","optional","renderByDefault","defaultProps","current","undefined","elementType","useEffect","children","components","root","always"],"mappings":";;;;+BAqDaqB;;;;;;;iEArDU,QAAQ;gCACuB,4BAA4B;6BAE1C,sBAAsB;2CACzB,+BAA+B;AAEpE;;;;CAIC,GACD,SAASf,eAAeC,MAAuB;IAC7C,SAASC,yBAAyBC,OAAwB;QACxD,qBAAOT,OAAMU,cAAc,CAACD,YAAYE,QAAQF,QAAQG,KAAK,CAACC,EAAE;IAClE;IAEA,OAAOb,OAAMc,QAAQ,CAACC,OAAO,CAACR,QAAQS,IAAI,CAACR;AAC7C;AAEA;;;;;;;;CAQC,GACD,SAASS,eACPC,QAA4B,EAC5BC,WAA2C,EAC3CC,WAAmB;IAEnB,IAAIF,UAAU;QACZ,OAAOA;IACT;IAEA,IAAIC,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,YAAaP,KAAK,CAACC,EAAE,EAAE;QACzB,OAAOM,YAAYP,KAAK,CAACC,EAAE;IAC7B;IAEA,OAAOO;AACT;AAWO,+BAA+B,CAACR,OAAwBU;IAC7D,MAAM,EAAEC,KAAK,EAAEhB,MAAM,EAAEiB,WAAW,EAAEC,MAAM,EAAE,GAAGb;IAE/C,MAAM,EACJc,qBAAqB,EAAEC,WAAW,EAAEC,cAAc,EAAE,EACrD,OAAGxB,oCAAAA;IACJ,MAAMyB,YAAY7B,OAAM8B,MAAM,CAAiB;IAE/C,MAAMC,aAAa/B,OAAM8B,MAAM,CAAC;IAChC,MAAMV,kBAAclB,qBAAAA,EAAMG,+CAAAA,CAAqBE,MAAM,EAAEoB;IAEvD,MAAMK,aAAa7B,oBAAAA,CAAK8B,QAAQ,CAAC1B,QAAQ;QACvC2B,iBAAiB;QACjBC,cAAc;YACZb,KAAKO;YACLhB,IAAI,CAACkB,WAAWK,OAAO,GAAGT,cAAcU;QAC1C;QACAC,aAAa;IACf;IACAtC,OAAMuC,SAAS,CAAC;YACyBV;QAAvC,MAAMX,WAAW,CAACa,WAAWK,OAAO,GAAA,CAAGP,qBAAAA,UAAUO,OAAAA,AAAO,MAAA,QAAjBP,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBhB,EAAE,GAAGwB;QAC/D,MAAMlB,cAAcb,eAAe0B,eAAAA,QAAAA,eAAAA,KAAAA,IAAAA,KAAAA,IAAAA,WAAYQ,QAAQ;QACvDT,WAAWK,OAAO,GAAGzB,QAAQQ;QAC7BS,eAAeX,eAAeC,UAAUC,aAAaC;IACvD,GAAG;QAACA;QAAab;QAAQyB;QAAYJ;KAAe;IACpD,OAAO;QACLa,YAAY;YAAEC,MAAM;YAAOnB,OAAO;YAAOhB,QAAQ;YAAOiB,aAAa;YAAOC,QAAQ;QAAM;QAE1FiB,MAAMvC,oBAAAA,CAAKwC,MAAM,KACf1C,wCAAAA,EAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FqB,KAAKA;YACL,GAAGV,KAAK;QACV,IACA;YAAE0B,aAAa;QAAM;QAEvBf,OAAOpB,oBAAAA,CAAK8B,QAAQ,CAACV,OAAO;YAAEe,aAAa;QAAM;QACjD/B,QAAQyB;QACRR,aAAarB,oBAAAA,CAAK8B,QAAQ,CAACT,aAAa;YAAEc,aAAa;QAAM;QAC7Db,QAAQtB,oBAAAA,CAAK8B,QAAQ,CAACR,QAAQ;YAAEa,aAAa;QAAM;IACrD;AACF,EAAE"}

package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useCardHeaderStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\n/*\n Static CSS class names used internally for the component slots.\n / export const cardHeaderClassNames = {\n root: 'fui-CardHeader',\n image: 'fui-CardHeader__image',\n header: 'fui-CardHeader__header',\n description: 'fui-CardHeader__description',\n action: 'fui-CardHeader__action'\n};\n/\n CSS variable names used internally for uniform styling in CardHeader.\n / export const cardHeaderCSSVars = {\n cardHeaderGapVar: '--fui-CardHeader--gap'\n};\nconst useStyles = makeStyles({\n root: {\n [cardHeaderCSSVars.cardHeaderGapVar]: '12px',\n alignItems: 'center'\n },\n image: {\n display: 'inline-flex',\n marginRight: `var(${cardHeaderCSSVars.cardHeaderGapVar})`\n },\n header: {\n display: 'flex'\n },\n description: {\n display: 'flex'\n },\n action: {\n marginLeft: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\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});\nconst useStylesGrid = makeStyles({\n root: {\n display: 'grid',\n gridAutoColumns: 'min-content 1fr min-content'\n },\n image: {\n gridColumnStart: '1',\n gridRowStart: 'span 2'\n },\n header: {\n gridColumnStart: '2',\n gridRowStart: '1'\n },\n description: {\n gridColumnStart: '2',\n gridRowStart: '2'\n },\n action: {\n gridColumnStart: '3',\n gridRowStart: 'span 2'\n }\n});\nconst useStylesFlex = makeStyles({\n root: {\n display: 'flex'\n },\n header: {\n flexGrow: 1\n },\n image: {},\n description: {},\n action: {}\n});\n/\n Apply styling to the CardHeader slots based on the state.\n */ export const useCardHeaderStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const stylesGrid = useStylesGrid();\n const stylesFlex = useStylesFlex();\n const boxModelStyles = state.description ? stylesGrid : stylesFlex;\n const getSlotStyles = (slotName)=>{\n var _state_slotName;\n return mergeClasses(cardHeaderClassNames[slotName], styles[slotName], boxModelStyles[slotName], (_state_slotName = state[slotName]) === null \|\| _state_slotName === void 0 ? void 0 : _state_slotName.className);\n };\n state.root.className = getSlotStyles('root');\n if (state.image) {\n state.image.className = getSlotStyles('image');\n }\n if (state.header) {\n state.header.className = getSlotStyles('header');\n }\n if (state.description) {\n state.description.className = getSlotStyles('description');\n }\n if (state.action) {\n state.action.className = getSlotStyles('action');\n }\n return state;\n};\n"],"names":["~~cardHeaderCSSVars~~","~~cardHeaderClassNames~~","~~useCardHeaderStyles_unstable~~","root","image","header","description","action","~~cardHeaderGapVar~~","~~useStyles~~","~~__styles~~","Bkc6ea2","Bt984gj","mc9l5x","t21cq0","Frg6f3","B7frvx2","B06c7xf","B8uq84v","snkdo8","Bpf22ct","apjfyd","d","m","useStylesGrid","t4k1zu","Br312pm","Ijaq50","useStylesFlex","Bh6795r","state","styles","stylesGrid","stylesFlex","boxModelStyles","getSlotStyles","slotName","_state_slotName","~~mergeClasses","~~className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;~~IAYiBA~~,iBAAiB~~;eAAjBA;;IATAC~~,oBAAoB;~~eAApBA;;IA2EAC,4BAA4B;eAA5BA~~;;;uBA9EoC;~~AAG1C~~,~~MAAMD~~,uBAAuB;~~IACpCE~~,MAAM~~;IACNC~~,~~OAAO;IACPC~~,~~QAAQ~~;~~IACRC~~,~~aAAa~~;~~IACbC~~,~~QAAQ~~;AACZ;~~AAGW~~,~~MAAMP,oBAAoB~~;~~IACjCQ~~,~~kBAAkB~~;AACtB;~~AACA~~,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAP~~,~~MAAA~~;QAAAQ,~~SAAA~~;QAAAC,~~SAAA~~;IAAA;IAAAR,~~OAAA~~;QAAAS,~~QAAA~~;QAAAC,~~QAAA~~;YAAA;YAAA;SAAA;IAAA;IAAAT,~~QAAA~~;QAAAQ,~~QAAA~~;IAAA;IAAAP,~~aAAA~~;QAAAO,~~QAAA~~;IAAA;IAAAN,~~QAAA~~;QAAAQ,~~QAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;YAAA;YAAA;SAAA;QAAAC,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;AAAA,GAAA;IAAAC,~~GAAA~~;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,~~GAAA~~;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;QAAA;YAAA;YAAA;gBAAAA,~~GAAA~~;YAAA;SAAA;KAAA;AAAA;~~AA4BlB~~,MAAMC,~~gBAAa~~,WAAA,~~GAAGd~~,~~IAAAA,~~eAAA,EAAA;~~IAAAP~~,~~MAAA~~;QAAAU,~~QAAA~~;QAAAY,~~QAAA~~;IAAA;IAAArB,~~OAAA~~;QAAAsB,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;IAAAtB,~~QAAA~~;QAAAqB,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;IAAArB,~~aAAA~~;QAAAoB,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;IAAApB,~~QAAA~~;QAAAmB,~~SAAA~~;QAAAC,~~QAAA~~;IAAA;AAAA,GAAA;IAAAL,~~GAAA~~;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;~~AAsBtB~~,MAAMM,~~gBAAa~~,WAAA,~~GAAGlB~~,~~IAAAA,~~eAAA,EAAA;~~IAAAP~~,~~MAAA~~;QAAAU,~~QAAA~~;IAAA;IAAAR,~~QAAA~~;QAAAwB,~~SAAA~~;IAAA;IAAAzB,~~OAAA~~,CAAA;IAAAE,~~aAAA~~,CAAA;IAAAC,~~QAAA~~,CAAA;AAAA,GAAA;IAAAe,~~GAAA~~;QAAA;QAAA;KAAA;AAAA;~~AAaX~~,~~MAAMpB,+BAAgC4B~~,~~CAAAA~~;~~IAC7C~~;~~IACA~~,MAAMC,~~SAAStB~~;~~IACf~~,MAAMuB,~~aAAaR~~;~~IACnB~~,~~MAAMS~~,~~aAAaL~~;~~IACnB~~,~~MAAMM~~,~~iBAAiBJ~~,~~MAAMxB~~,WAAW,~~GAAG0B~~,~~aAAaC~~;~~IACxD~~,MAAME,~~gBAAiBC~~,~~CAAAA~~;~~QACnB~~,IAAIC;~~QACJ~~,~~OAAOC~~,~~IAAAA,~~mBAAY,~~EAACrC~~,oBAAoB,CAACmC,~~SAAS~~,EAAEL,MAAM,CAACK,~~SAAS~~,EAAEF,cAAc,CAACE,~~SAAS~~,EAAE,~~AAACC~~,~~CAAAA~~,~~kBAAkBP~~,KAAK,CAACM,~~SAAS~~,~~AAAD~~,~~MAAO~~,~~QAAQC~~,~~oBAAoB~~,KAAK,~~IAAI~~,KAAK,~~IAAIA~~,~~gBAAgBE~~,SAAS;~~IACnN~~;~~IACAT~~,~~MAAM3B~~,IAAI,CAACoC,SAAS,~~GAAGJ~~,~~cAAc~~;~~IACrC~~,IAAIL,~~MAAM1B~~,KAAK,EAAE;~~QACb0B~~,~~MAAM1B~~,KAAK,CAACmC,SAAS,~~GAAGJ~~,~~cAAc~~;~~IAC1C~~;IACA,IAAIL,~~MAAMzB~~,MAAM,EAAE;~~QACdyB~~,~~MAAMzB~~,MAAM,CAACkC,SAAS,~~GAAGJ~~,~~cAAc~~;~~IAC3C~~;IACA,IAAIL,~~MAAMxB~~,WAAW,EAAE;~~QACnBwB~~,~~MAAMxB~~,WAAW,CAACiC,SAAS,~~GAAGJ~~,~~cAAc~~;~~IAChD~~;IACA,IAAIL,~~MAAMvB~~,MAAM,EAAE;~~QACduB~~,~~MAAMvB~~,MAAM,CAACgC,SAAS,~~GAAGJ~~,~~cAAc~~;~~IAC3C~~;IACA,OAAOL;~~AACX~~"}
1	+ {"version":3,"sources":["useCardHeaderStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\n/*\n Static CSS class names used internally for the component slots.\n / export const cardHeaderClassNames = {\n root: 'fui-CardHeader',\n image: 'fui-CardHeader__image',\n header: 'fui-CardHeader__header',\n description: 'fui-CardHeader__description',\n action: 'fui-CardHeader__action'\n};\n/\n CSS variable names used internally for uniform styling in CardHeader.\n / export const cardHeaderCSSVars = {\n cardHeaderGapVar: '--fui-CardHeader--gap'\n};\nconst useStyles = makeStyles({\n root: {\n [cardHeaderCSSVars.cardHeaderGapVar]: '12px',\n alignItems: 'center'\n },\n image: {\n display: 'inline-flex',\n marginRight: `var(${cardHeaderCSSVars.cardHeaderGapVar})`\n },\n header: {\n display: 'flex'\n },\n description: {\n display: 'flex'\n },\n action: {\n marginLeft: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\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});\nconst useStylesGrid = makeStyles({\n root: {\n display: 'grid',\n gridAutoColumns: 'min-content 1fr min-content'\n },\n image: {\n gridColumnStart: '1',\n gridRowStart: 'span 2'\n },\n header: {\n gridColumnStart: '2',\n gridRowStart: '1'\n },\n description: {\n gridColumnStart: '2',\n gridRowStart: '2'\n },\n action: {\n gridColumnStart: '3',\n gridRowStart: 'span 2'\n }\n});\nconst useStylesFlex = makeStyles({\n root: {\n display: 'flex'\n },\n header: {\n flexGrow: 1\n },\n image: {},\n description: {},\n action: {}\n});\n/\n Apply styling to the CardHeader slots based on the state.\n */ export const useCardHeaderStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n const stylesGrid = useStylesGrid();\n const stylesFlex = useStylesFlex();\n const boxModelStyles = state.description ? stylesGrid : stylesFlex;\n const getSlotStyles = (slotName)=>{\n var _state_slotName;\n return mergeClasses(cardHeaderClassNames[slotName], styles[slotName], boxModelStyles[slotName], (_state_slotName = state[slotName]) === null \|\| _state_slotName === void 0 ? void 0 : _state_slotName.className);\n };\n state.root.className = getSlotStyles('root');\n if (state.image) {\n state.image.className = getSlotStyles('image');\n }\n if (state.header) {\n state.header.className = getSlotStyles('header');\n }\n if (state.description) {\n state.description.className = getSlotStyles('description');\n }\n if (state.action) {\n state.action.className = getSlotStyles('action');\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","shorthands","cardHeaderClassNames","root","image","header","description","action","cardHeaderCSSVars","cardHeaderGapVar","useStyles","Bkc6ea2","Bt984gj","mc9l5x","t21cq0","Frg6f3","B7frvx2","B06c7xf","B8uq84v","snkdo8","Bpf22ct","apjfyd","d","m","useStylesGrid","t4k1zu","Br312pm","Ijaq50","useStylesFlex","Bh6795r","useCardHeaderStyles_unstable","state","styles","stylesGrid","stylesFlex","boxModelStyles","getSlotStyles","slotName","_state_slotName","className"],"mappings":"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"}

package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.raw.js ADDED Viewed

@@ -0,0 +1,118 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    cardHeaderCSSVars: function() {
+        return cardHeaderCSSVars;
+    },
+    cardHeaderClassNames: function() {
+        return cardHeaderClassNames;
+    },
+    useCardHeaderStyles_unstable: function() {
+        return useCardHeaderStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const cardHeaderClassNames = {
+    root: 'fui-CardHeader',
+    image: 'fui-CardHeader__image',
+    header: 'fui-CardHeader__header',
+    description: 'fui-CardHeader__description',
+    action: 'fui-CardHeader__action'
+};
+const cardHeaderCSSVars = {
+    cardHeaderGapVar: '--fui-CardHeader--gap'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        [cardHeaderCSSVars.cardHeaderGapVar]: '12px',
+        alignItems: 'center'
+    },
+    image: {
+        display: 'inline-flex',
+        marginRight: `var(${cardHeaderCSSVars.cardHeaderGapVar})`
+    },
+    header: {
+        display: 'flex'
+    },
+    description: {
+        display: 'flex'
+    },
+    action: {
+        marginLeft: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,
+        // when the card is selected or hovered, it has custom high contrast color and background styles
+        // setting this ensures action buttons adopt those colors and are still visible in forced-colors mode
+        '@media (forced-colors: active)': {
+            '& .fui-Button, & .fui-Link': {
+                ..._react.shorthands.borderColor('currentColor'),
+                color: 'currentColor',
+                outlineColor: 'currentColor'
+            }
+        }
+    }
+});
+const useStylesGrid = (0, _react.makeStyles)({
+    root: {
+        display: 'grid',
+        gridAutoColumns: 'min-content 1fr min-content'
+    },
+    image: {
+        gridColumnStart: '1',
+        gridRowStart: 'span 2'
+    },
+    header: {
+        gridColumnStart: '2',
+        gridRowStart: '1'
+    },
+    description: {
+        gridColumnStart: '2',
+        gridRowStart: '2'
+    },
+    action: {
+        gridColumnStart: '3',
+        gridRowStart: 'span 2'
+    }
+});
+const useStylesFlex = (0, _react.makeStyles)({
+    root: {
+        display: 'flex'
+    },
+    header: {
+        flexGrow: 1
+    },
+    image: {},
+    description: {},
+    action: {}
+});
+const useCardHeaderStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    const stylesGrid = useStylesGrid();
+    const stylesFlex = useStylesFlex();
+    const boxModelStyles = state.description ? stylesGrid : stylesFlex;
+    const getSlotStyles = (slotName)=>{
+        var _state_slotName;
+        return (0, _react.mergeClasses)(cardHeaderClassNames[slotName], styles[slotName], boxModelStyles[slotName], (_state_slotName = state[slotName]) === null || _state_slotName === void 0 ? void 0 : _state_slotName.className);
+    };
+    state.root.className = getSlotStyles('root');
+    if (state.image) {
+        state.image.className = getSlotStyles('image');
+    }
+    if (state.header) {
+        state.header.className = getSlotStyles('header');
+    }
+    if (state.description) {
+        state.description.className = getSlotStyles('description');
+    }
+    if (state.action) {
+        state.action.className = getSlotStyles('action');
+    }
+    return state;
+};

package/lib-commonjs/components/CardHeader/useCardHeaderStyles.styles.raw.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../src/components/CardHeader/useCardHeaderStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { CardHeaderSlots, CardHeaderState } from './CardHeader.types';\n\n/**\n * Static CSS class names used internally for the component slots.\n */\nexport const cardHeaderClassNames: SlotClassNames<CardHeaderSlots> = {\n root: 'fui-CardHeader',\n image: 'fui-CardHeader__image',\n header: 'fui-CardHeader__header',\n description: 'fui-CardHeader__description',\n action: 'fui-CardHeader__action',\n};\n\n/**\n * CSS variable names used internally for uniform styling in CardHeader.\n */\nexport const cardHeaderCSSVars = {\n cardHeaderGapVar: '--fui-CardHeader--gap',\n};\n\nconst useStyles = makeStyles<keyof CardHeaderSlots>({\n root: {\n [cardHeaderCSSVars.cardHeaderGapVar]: '12px',\n alignItems: 'center',\n },\n image: {\n display: 'inline-flex',\n marginRight: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\n },\n header: {\n display: 'flex',\n },\n description: {\n display: 'flex',\n },\n action: {\n marginLeft: `var(${cardHeaderCSSVars.cardHeaderGapVar})`,\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\nconst useStylesGrid = makeStyles<keyof CardHeaderSlots>({\n root: {\n display: 'grid',\n gridAutoColumns: 'min-content 1fr min-content',\n },\n\n image: {\n gridColumnStart: '1',\n gridRowStart: 'span 2',\n },\n\n header: {\n gridColumnStart: '2',\n gridRowStart: '1',\n },\n\n description: {\n gridColumnStart: '2',\n gridRowStart: '2',\n },\n\n action: {\n gridColumnStart: '3',\n gridRowStart: 'span 2',\n },\n});\n\nconst useStylesFlex = makeStyles<keyof CardHeaderSlots>({\n root: {\n display: 'flex',\n },\n\n header: {\n flexGrow: 1,\n },\n\n image: {},\n description: {},\n action: {},\n});\n\n/**\n * Apply styling to the CardHeader slots based on the state.\n */\nexport const useCardHeaderStyles_unstable = (state: CardHeaderState): CardHeaderState => {\n 'use no memo';\n\n const styles = useStyles();\n const stylesGrid = useStylesGrid();\n const stylesFlex = useStylesFlex();\n\n const boxModelStyles = state.description ? stylesGrid : stylesFlex;\n\n const getSlotStyles = (slotName: keyof CardHeaderSlots): string => {\n return mergeClasses(\n cardHeaderClassNames[slotName],\n styles[slotName],\n boxModelStyles[slotName],\n state[slotName]?.className,\n );\n };\n\n state.root.className = getSlotStyles('root');\n\n if (state.image) {\n state.image.className = getSlotStyles('image');\n }\n\n if (state.header) {\n state.header.className = getSlotStyles('header');\n }\n\n if (state.description) {\n state.description.className = getSlotStyles('description');\n }\n\n if (state.action) {\n state.action.className = getSlotStyles('action');\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","cardHeaderClassNames","root","image","header","description","action","cardHeaderCSSVars","cardHeaderGapVar","useStyles","alignItems","display","marginRight","marginLeft","borderColor","color","outlineColor","useStylesGrid","gridAutoColumns","gridColumnStart","gridRowStart","useStylesFlex","flexGrow","useCardHeaderStyles_unstable","state","styles","stylesGrid","stylesFlex","boxModelStyles","getSlotStyles","slotName","className"],"mappings":";;;;;;;;;;;IAkBaS,iBAAAA;;;IAXAN,oBAAAA;;;IAyFAsB,4BAAAA;;;;uBA/FwC,iBAAiB;AAM/D,6BAA8D;IACnErB,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,aAAa;IACbC,QAAQ;AACV,EAAE;AAKK,0BAA0B;IAC/BE,kBAAkB;AACpB,EAAE;AAEF,MAAMC,gBAAYX,iBAAAA,EAAkC;IAClDI,MAAM;QACJ,CAACK,kBAAkBC,gBAAgB,CAAC,EAAE;QACtCE,YAAY;IACd;IACAP,OAAO;QACLQ,SAAS;QACTC,aAAa,CAAC,IAAI,EAAEL,kBAAkBC,gBAAgB,CAAC,CAAC,CAAC;IAC3D;IACAJ,QAAQ;QACNO,SAAS;IACX;IACAN,aAAa;QACXM,SAAS;IACX;IACAL,QAAQ;QACNO,YAAY,CAAC,IAAI,EAAEN,kBAAkBC,gBAAgB,CAAC,CAAC,CAAC;QAExD,gGAAgG;QAChG,qGAAqG;QACrG,kCAAkC;YAChC,8BAA8B;gBAC5B,GAAGR,iBAAAA,CAAWc,WAAW,CAAC,eAAe;gBACzCC,OAAO;gBACPC,cAAc;YAChB;QACF;IACF;AACF;AAEA,MAAMC,oBAAgBnB,iBAAAA,EAAkC;IACtDI,MAAM;QACJS,SAAS;QACTO,iBAAiB;IACnB;IAEAf,OAAO;QACLgB,iBAAiB;QACjBC,cAAc;IAChB;IAEAhB,QAAQ;QACNe,iBAAiB;QACjBC,cAAc;IAChB;IAEAf,aAAa;QACXc,iBAAiB;QACjBC,cAAc;IAChB;IAEAd,QAAQ;QACNa,iBAAiB;QACjBC,cAAc;IAChB;AACF;AAEA,MAAMC,oBAAgBvB,iBAAAA,EAAkC;IACtDI,MAAM;QACJS,SAAS;IACX;IAEAP,QAAQ;QACNkB,UAAU;IACZ;IAEAnB,OAAO,CAAC;IACRE,aAAa,CAAC;IACdC,QAAQ,CAAC;AACX;AAKO,qCAAqC,CAACkB;IAC3C;IAEA,MAAMC,SAAShB;IACf,MAAMiB,aAAaT;IACnB,MAAMU,aAAaN;IAEnB,MAAMO,iBAAiBJ,MAAMnB,WAAW,GAAGqB,aAAaC;IAExD,MAAME,gBAAgB,CAACC;YAKnBN;QAJF,WAAOzB,mBAAAA,EACLE,oBAAoB,CAAC6B,SAAS,EAC9BL,MAAM,CAACK,SAAS,EAChBF,cAAc,CAACE,SAAS,EAAA,CACxBN,kBAAAA,KAAK,CAACM,SAAAA,AAAS,MAAA,QAAfN,oBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,gBAAiBO,SAAS;IAE9B;IAEAP,MAAMtB,IAAI,CAAC6B,SAAS,GAAGF,cAAc;IAErC,IAAIL,MAAMrB,KAAK,EAAE;QACfqB,MAAMrB,KAAK,CAAC4B,SAAS,GAAGF,cAAc;IACxC;IAEA,IAAIL,MAAMpB,MAAM,EAAE;QAChBoB,MAAMpB,MAAM,CAAC2B,SAAS,GAAGF,cAAc;IACzC;IAEA,IAAIL,MAAMnB,WAAW,EAAE;QACrBmB,MAAMnB,WAAW,CAAC0B,SAAS,GAAGF,cAAc;IAC9C;IAEA,IAAIL,MAAMlB,MAAM,EAAE;QAChBkB,MAAMlB,MAAM,CAACyB,SAAS,GAAGF,cAAc;IACzC;IAEA,OAAOL;AACT,EAAE"}

package/lib-commonjs/components/CardPreview/CardPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardPreview/CardPreview.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCardPreview_unstable } from './useCardPreview';\nimport { renderCardPreview_unstable } from './renderCardPreview';\nimport { useCardPreviewStyles_unstable } from './useCardPreviewStyles.styles';\nimport type { CardPreviewProps } from './CardPreview.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Component to render image previews of documents or articles in a Card component.\n */\nexport const CardPreview: ForwardRefComponent<CardPreviewProps> = React.forwardRef((props, ref) => {\n const state = useCardPreview_unstable(props, ref);\n\n useCardPreviewStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardPreviewStyles_unstable')(state);\n\n return renderCardPreview_unstable(state);\n});\n\nCardPreview.displayName = 'CardPreview';\n"],"names":["~~CardPreview~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useCardPreview_unstable~~","~~useCardPreviewStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderCardPreview_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAWaA;;;eAAAA;;;;~~iEAXU;~~gCACiB~~;~~mCACG~~;~~4CACG~~;~~qCAGF~~;~~AAKrC~~,~~MAAMA~~,~~cAAAA,~~WAAAA,~~GAAqDC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,~~QAAQC~~,~~IAAAA~~,~~uCAAAA~~,~~EAAwBH,~~OAAOC;~~IAE7CG~~,~~IAAAA,~~yDAAAA,~~EAA8BF~~;~~IAE9BG~~,~~IAAAA,~~gDAAAA,EAA4B,~~iCAAiCH~~;IAE7D,~~OAAOI~~,~~IAAAA,~~6CAAAA,~~EAA2BJ~~;AACpC;~~AAEAL~~,~~YAAYU~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/CardPreview/CardPreview.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCardPreview_unstable } from './useCardPreview';\nimport { renderCardPreview_unstable } from './renderCardPreview';\nimport { useCardPreviewStyles_unstable } from './useCardPreviewStyles.styles';\nimport type { CardPreviewProps } from './CardPreview.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Component to render image previews of documents or articles in a Card component.\n */\nexport const CardPreview: ForwardRefComponent<CardPreviewProps> = React.forwardRef((props, ref) => {\n const state = useCardPreview_unstable(props, ref);\n\n useCardPreviewStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCardPreviewStyles_unstable')(state);\n\n return renderCardPreview_unstable(state);\n});\n\nCardPreview.displayName = 'CardPreview';\n"],"names":["React","useCardPreview_unstable","renderCardPreview_unstable","useCardPreviewStyles_unstable","useCustomStyleHook_unstable","CardPreview","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;gCACS,mBAAmB;mCAChB,sBAAsB;4CACnB,gCAAgC;qCAGlC,kCAAkC;AAKvE,oBAAMA,WAAAA,GAAqDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,2CAAAA,EAAwBM,OAAOC;QAE7CL,yDAAAA,EAA8BM;QAE9BL,gDAAAA,EAA4B,iCAAiCK;IAE7D,WAAOP,6CAAAA,EAA2BO;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}

package/lib-commonjs/components/CardPreview/CardPreview.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardPreview/CardPreview.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the Card component.\n /\nexport type CardPreviewSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Container that holds a logo related to the image preview provided.\n /\n logo?: Slot<'div', 'img'>;\n};\n\n/\n CardPreview component props.\n /\nexport type CardPreviewProps = ComponentProps<CardPreviewSlots>;\n\n/\n State used in rendering CardPreview.\n */\nexport type CardPreviewState = ComponentState<CardPreviewSlots>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAsBA;;CAEC"}
1	+ {"version":3,"sources":["../src/components/CardPreview/CardPreview.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/*\n Slots available in the Card component.\n /\nexport type CardPreviewSlots = {\n /\n Root element of the component.\n /\n root: Slot<'div'>;\n\n /\n Container that holds a logo related to the image preview provided.\n /\n logo?: Slot<'div', 'img'>;\n};\n\n/\n CardPreview component props.\n /\nexport type CardPreviewProps = ComponentProps<CardPreviewSlots>;\n\n/\n State used in rendering CardPreview.\n */\nexport type CardPreviewState = ComponentState<CardPreviewSlots>;\n"],"names":[],"mappings":"AAsBA;;CAEC,GACD,WAAgE"}

package/lib-commonjs/components/CardPreview/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardPreview/index.ts"],"sourcesContent":["export { CardPreview } from './CardPreview';\nexport type { CardPreviewProps, CardPreviewSlots, CardPreviewState } from './CardPreview.types';\nexport { renderCardPreview_unstable } from './renderCardPreview';\nexport { useCardPreview_unstable } from './useCardPreview';\nexport { cardPreviewClassNames, useCardPreviewStyles_unstable } from './useCardPreviewStyles.styles';\n"],"names":["CardPreview","~~cardPreviewClassNames~~","~~renderCardPreview_unstable~~","~~useCardPreviewStyles_unstable~~","~~useCardPreview_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~WAAW;eAAXA,~~wBAAW~~;;IAIXC~~,~~qBAAqB;eAArBA,~~iDAAqB~~;;IAFrBC~~,~~0BAA0B;eAA1BA,~~6CAA0B~~;;IAEHC~~,~~6BAA6B;eAA7BA,~~yDAA6B~~;;IADpDC~~,~~uBAAuB;eAAvBA,~~uCAAuB;;;6BAHJ;~~mCAEe~~;~~gCACH~~;~~4CAC6B~~"}
1	+ {"version":3,"sources":["../src/components/CardPreview/index.ts"],"sourcesContent":["export { CardPreview } from './CardPreview';\nexport type { CardPreviewProps, CardPreviewSlots, CardPreviewState } from './CardPreview.types';\nexport { renderCardPreview_unstable } from './renderCardPreview';\nexport { useCardPreview_unstable } from './useCardPreview';\nexport { cardPreviewClassNames, useCardPreviewStyles_unstable } from './useCardPreviewStyles.styles';\n"],"names":["CardPreview","renderCardPreview_unstable","useCardPreview_unstable","cardPreviewClassNames","useCardPreviewStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,wBAAW;;;eAIXG,iDAAqB;;;eAFrBF,6CAA0B;;;eAEHG,yDAA6B;;;eADpDF,uCAAuB;;;6BAHJ,gBAAgB;mCAED,sBAAsB;gCACzB,mBAAmB;4CACU,gCAAgC"}

package/lib-commonjs/components/CardPreview/renderCardPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardPreview/renderCardPreview.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';\n\n/\n Render the final JSX of CardPreview.\n */\nexport const renderCardPreview_unstable = (state: CardPreviewState) => {\n assertSlots<CardPreviewSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.logo && <state.logo />}\n </state.root>\n );\n};\n"],"names":["~~renderCardPreview_unstable~~","~~state~~","~~assertSlots~~","~~_jsxs","~~root","children","logo"~~,"_jsx"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BASaA;;;eAAAA;;;~~4BARb;~~gCAE4B~~;~~AAMrB~~,~~MAAMA~~,~~6BAA6B,~~CAACC;~~IACzCC~~,~~IAAAA,~~2BAAAA,~~EAA8BD~~;IAE9B,OAAA,WAAA,~~GACEE~~,~~IAAAA,~~gBAAA,~~EAACF~~,~~MAAMG~~,IAAI,EAAA;;~~YACRH~~,~~MAAMG~~,IAAI,CAACC,QAAQ;~~YACnBJ~~,~~MAAMK~~,IAAI,IAAA,WAAA,~~GAAIC~~,~~IAAAA,~~eAAA,~~EAACN~~,~~MAAMK~~,IAAI,EAAA,CAAA;;;AAGhC"}
1	+ {"version":3,"sources":["../src/components/CardPreview/renderCardPreview.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { CardPreviewSlots, CardPreviewState } from './CardPreview.types';\n\n/\n Render the final JSX of CardPreview.\n */\nexport const renderCardPreview_unstable = (state: CardPreviewState) => {\n assertSlots<CardPreviewSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.logo && <state.logo />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderCardPreview_unstable","state","root","children","logo"],"mappings":";;;;+BASaC;;;;;;4BARb,iCAAiD;gCAErB,4BAA4B;AAMjD,mCAAmC,CAACC;QACzCF,2BAAAA,EAA8BE;IAE9B,OAAA,WAAA,OACE,gBAAA,EAACA,MAAMC,IAAI,EAAA;;YACRD,MAAMC,IAAI,CAACC,QAAQ;YACnBF,MAAMG,IAAI,IAAA,WAAA,OAAI,eAAA,EAACH,MAAMG,IAAI,EAAA,CAAA;;;AAGhC,EAAE"}

package/lib-commonjs/components/CardPreview/useCardPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/CardPreview/useCardPreview.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport type { CardPreviewProps, CardPreviewState } from './CardPreview.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardPreviewClassNames } from './useCardPreviewStyles.styles';\n\n/*\n Create the state required to render CardPreview.\n \n The returned state can be modified with hooks such as useCardPreviewStyles_unstable,\n * before being passed to renderCardPreview_unstable.\n \n @param props - props from this instance of CardPreview\n * @param ref - reference to root HTMLElement of CardPreview\n */\nexport const useCardPreview_unstable = (props: CardPreviewProps, ref: React.Ref<HTMLElement>): CardPreviewState => {\n const { logo } = props;\n\n const {\n selectableA11yProps: { referenceLabel, referenceId, setReferenceLabel, setReferenceId },\n } = useCardContext_unstable();\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n const previewRef = useMergedRefs(ref as React.Ref<HTMLDivElement>, React.useRef<HTMLDivElement>(null));\n\n React.useEffect(() => {\n if (referenceLabel && referenceId) {\n return;\n }\n\n if (previewRef.current && previewRef.current.parentNode) {\n const img = previewRef.current.parentNode.querySelector<HTMLImageElement>(`.${cardPreviewClassNames.root} > img`);\n\n if (img) {\n const ariaLabel = img.getAttribute('aria-label');\n const ariaDescribedby = img.getAttribute('aria-describedby');\n\n if (ariaDescribedby) {\n setReferenceId(ariaDescribedby);\n } else if (img.alt) {\n setReferenceLabel(img.alt);\n } else if (ariaLabel) {\n setReferenceLabel(ariaLabel);\n }\n }\n }\n }, [setReferenceLabel, referenceLabel, previewRef, referenceId, setReferenceId]);\n\n return {\n components: {\n root: 'div',\n logo: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: previewRef,\n ...props,\n }),\n { elementType: 'div' },\n ),\n logo: slot.optional(logo, { elementType: 'div' }),\n };\n};\n"],"names":["useCardPreview_unstable","props","ref","logo","selectableA11yProps","referenceLabel","referenceId","setReferenceLabel","setReferenceId","~~useCardContext_unstable","~~previewRef","~~useMergedRefs","React","~~useRef","useEffect","current","parentNode","img","querySelector","~~cardPreviewClassNames","~~root","ariaLabel","getAttribute","ariaDescribedby","alt","components","~~slot","~~always","~~getIntrinsicElementProps","~~elementType","optional"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAeaA;;;eAAAA;;;;~~iEAfU;~~gCACuC~~;~~6BAEtB~~;~~4CACF~~;AAW/B,~~MAAMA~~,~~0BAA0B,~~CAACC,OAAyBC;IAC/D,MAAM,EAAEC,IAAI,EAAE,GAAGF;IAEjB,MAAM,EACJG,qBAAqB,EAAEC,cAAc,EAAEC,WAAW,EAAEC,iBAAiB,EAAEC,cAAc,EAAE,EACxF,~~GAAGC~~,~~IAAAA,~~oCAAAA;IACJ,SAAS;IACT,4EAA4E;IAC5E,4FAA4F;IAC5F,~~MAAMC~~,~~aAAaC~~,~~IAAAA,~~6BAAAA,~~EAAcT~~,~~KAAkCU~~,~~OAAMC~~,MAAM,CAAiB;~~IAEhGD~~,~~OAAME~~,SAAS,CAAC;QACd,~~IAAIT~~,kBAAkBC,aAAa;YACjC;QACF;QAEA,~~IAAII~~,~~WAAWK~~,OAAO,~~IAAIL~~,~~WAAWK~~,OAAO,CAACC,UAAU,EAAE;YACvD,MAAMC,~~MAAMP~~,~~WAAWK~~,OAAO,CAACC,UAAU,CAACE,aAAa,CAAmB,CAAC,CAAC,~~EAAEC~~,iDAAAA,~~CAAsBC~~,IAAI,CAAC,MAAM,CAAC;YAEhH,~~IAAIH~~,KAAK;gBACP,~~MAAMI~~,~~YAAYJ~~,~~IAAIK~~,YAAY,CAAC;gBACnC,MAAMC,~~kBAAkBN~~,~~IAAIK~~,YAAY,CAAC;gBAEzC,IAAIC,iBAAiB;~~oBACnBf~~,~~eAAee~~;gBACjB,OAAO,~~IAAIN~~,~~IAAIO~~,GAAG,EAAE;~~oBAClBjB~~,~~kBAAkBU~~,~~IAAIO~~,GAAG;gBAC3B,OAAO,IAAIH,WAAW;~~oBACpBd~~,~~kBAAkBc~~;gBACpB;YACF;QACF;IACF,GAAG;~~QAACd~~;QAAmBF;~~QAAgBK~~;~~QAAYJ~~;QAAaE;KAAe;IAE/E,OAAO;~~QACLiB~~,YAAY;YACVL,MAAM;~~YACNjB~~,MAAM;QACR;~~QAEAiB~~,~~MAAMM~~,oBAAAA,~~CAAKC~~,MAAM,~~CACfC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;~~YAC9B1B~~,~~KAAKQ~~;YACL,~~GAAGT~~,KAAK;QACV,IACA;~~YAAE4B~~,aAAa;QAAM;~~QAEvB1B~~,~~MAAMuB~~,oBAAAA,~~CAAKI~~,QAAQ,~~CAAC3B~~,MAAM;~~YAAE0B~~,aAAa;QAAM;IACjD;AACF"}
1	+ {"version":3,"sources":["../src/components/CardPreview/useCardPreview.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport type { CardPreviewProps, CardPreviewState } from './CardPreview.types';\nimport { useCardContext_unstable } from '../Card/CardContext';\nimport { cardPreviewClassNames } from './useCardPreviewStyles.styles';\n\n/*\n Create the state required to render CardPreview.\n \n The returned state can be modified with hooks such as useCardPreviewStyles_unstable,\n * before being passed to renderCardPreview_unstable.\n \n @param props - props from this instance of CardPreview\n * @param ref - reference to root HTMLElement of CardPreview\n */\nexport const useCardPreview_unstable = (props: CardPreviewProps, ref: React.Ref<HTMLElement>): CardPreviewState => {\n const { logo } = props;\n\n const {\n selectableA11yProps: { referenceLabel, referenceId, setReferenceLabel, setReferenceId },\n } = useCardContext_unstable();\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n const previewRef = useMergedRefs(ref as React.Ref<HTMLDivElement>, React.useRef<HTMLDivElement>(null));\n\n React.useEffect(() => {\n if (referenceLabel && referenceId) {\n return;\n }\n\n if (previewRef.current && previewRef.current.parentNode) {\n const img = previewRef.current.parentNode.querySelector<HTMLImageElement>(`.${cardPreviewClassNames.root} > img`);\n\n if (img) {\n const ariaLabel = img.getAttribute('aria-label');\n const ariaDescribedby = img.getAttribute('aria-describedby');\n\n if (ariaDescribedby) {\n setReferenceId(ariaDescribedby);\n } else if (img.alt) {\n setReferenceLabel(img.alt);\n } else if (ariaLabel) {\n setReferenceLabel(ariaLabel);\n }\n }\n }\n }, [setReferenceLabel, referenceLabel, previewRef, referenceId, setReferenceId]);\n\n return {\n components: {\n root: 'div',\n logo: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: previewRef,\n ...props,\n }),\n { elementType: 'div' },\n ),\n logo: slot.optional(logo, { elementType: 'div' }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useMergedRefs","slot","useCardContext_unstable","cardPreviewClassNames","useCardPreview_unstable","props","ref","logo","selectableA11yProps","referenceLabel","referenceId","setReferenceLabel","setReferenceId","previewRef","useRef","useEffect","current","parentNode","img","querySelector","root","ariaLabel","getAttribute","ariaDescribedby","alt","components","always","elementType","optional"],"mappings":";;;;+BAeaM;;;;;;;iEAfU,QAAQ;gCAC+B,4BAA4B;6BAElD,sBAAsB;4CACxB,gCAAgC;AAW/D,gCAAgC,CAACC,OAAyBC;IAC/D,MAAM,EAAEC,IAAI,EAAE,GAAGF;IAEjB,MAAM,EACJG,qBAAqB,EAAEC,cAAc,EAAEC,WAAW,EAAEC,iBAAiB,EAAEC,cAAc,EAAE,EACxF,OAAGV,oCAAAA;IACJ,SAAS;IACT,4EAA4E;IAC5E,4FAA4F;IAC5F,MAAMW,iBAAab,6BAAAA,EAAcM,KAAkCR,OAAMgB,MAAM,CAAiB;IAEhGhB,OAAMiB,SAAS,CAAC;QACd,IAAIN,kBAAkBC,aAAa;YACjC;QACF;QAEA,IAAIG,WAAWG,OAAO,IAAIH,WAAWG,OAAO,CAACC,UAAU,EAAE;YACvD,MAAMC,MAAML,WAAWG,OAAO,CAACC,UAAU,CAACE,aAAa,CAAmB,CAAC,CAAC,EAAEhB,iDAAAA,CAAsBiB,IAAI,CAAC,MAAM,CAAC;YAEhH,IAAIF,KAAK;gBACP,MAAMG,YAAYH,IAAII,YAAY,CAAC;gBACnC,MAAMC,kBAAkBL,IAAII,YAAY,CAAC;gBAEzC,IAAIC,iBAAiB;oBACnBX,eAAeW;gBACjB,OAAO,IAAIL,IAAIM,GAAG,EAAE;oBAClBb,kBAAkBO,IAAIM,GAAG;gBAC3B,OAAO,IAAIH,WAAW;oBACpBV,kBAAkBU;gBACpB;YACF;QACF;IACF,GAAG;QAACV;QAAmBF;QAAgBI;QAAYH;QAAaE;KAAe;IAE/E,OAAO;QACLa,YAAY;YACVL,MAAM;YACNb,MAAM;QACR;QAEAa,MAAMnB,oBAAAA,CAAKyB,MAAM,KACf3B,wCAAAA,EAAyB,OAAO;YAC9BO,KAAKO;YACL,GAAGR,KAAK;QACV,IACA;YAAEsB,aAAa;QAAM;QAEvBpB,MAAMN,oBAAAA,CAAK2B,QAAQ,CAACrB,MAAM;YAAEoB,aAAa;QAAM;IACjD;AACF,EAAE"}

package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useCardPreviewStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\n/*\n Static CSS class names used internally for the component slots.\n / export const cardPreviewClassNames = {\n root: 'fui-CardPreview',\n logo: 'fui-CardPreview__logo'\n};\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n [`> :not(.${cardPreviewClassNames.logo})`]: {\n display: 'block',\n height: '100%',\n width: '100%'\n }\n },\n logo: {\n position: 'absolute',\n bottom: '12px',\n left: '12px',\n width: '32px',\n height: '32px'\n }\n});\n/\n Apply styling to the CardPreview slots based on the state.\n */ export const useCardPreviewStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(cardPreviewClassNames.root, styles.root, state.root.className);\n if (state.logo) {\n state.logo.className = mergeClasses(cardPreviewClassNames.logo, styles.logo, state.logo.className);\n }\n return state;\n};\n"],"names":["~~cardPreviewClassNames~~","~~useCardPreviewStyles_unstable~~","root","logo","useStyles","~~__styles","~~qhf8xq","Byfpedg","Btj6oj6","B1m4t4s","B5kzvoi","oyh7mz","a9b677","Bqenvij","d","state","styles","className"~~,"mergeClasses"~~],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAGiBA~~,qBAAqB;~~eAArBA;;IAuBAC,6BAA6B;eAA7BA~~;;;uBA1BwB;~~AAG9B~~,~~MAAMD,wBAAwB~~;~~IACrCE~~,~~MAAM~~;~~IACNC~~,~~MAAM~~;AACV;~~AACA~~,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAH~~,~~MAAA~~;~~QAAAI~~,~~QAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;QAAAC,~~SAAA~~;IAAA;~~IAAAN~~,~~MAAA~~;~~QAAAG~~,~~QAAA~~;QAAAI,~~SAAA~~;QAAAC,~~QAAA~~;YAAA;YAAA;SAAA;QAAAC,~~QAAA~~;QAAAC,~~SAAA~~;IAAA;AAAA,GAAA;IAAAC,~~GAAA~~;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA;~~AAmBP~~,~~MAAMb~~,~~gCAAiCc~~,~~CAAAA~~;~~IAC9C~~;~~IACA~~,MAAMC,~~SAASZ~~;~~IACfW~~,~~MAAMb~~,IAAI,CAACe,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAAClB~~,~~sBAAsBE~~,IAAI,EAAEc,~~OAAOd~~,IAAI,EAAEa,~~MAAMb~~,IAAI,CAACe,SAAS;~~IACjG~~,IAAIF,~~MAAMZ~~,IAAI,EAAE;QACZY,~~MAAMZ~~,IAAI,CAACc,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAAClB~~,~~sBAAsBG~~,IAAI,EAAEa,~~OAAOb~~,IAAI,EAAEY,~~MAAMZ~~,IAAI,CAACc,SAAS;~~IACrG~~;IACA,OAAOF;~~AACX~~"}
1	+ {"version":3,"sources":["useCardPreviewStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\n/*\n Static CSS class names used internally for the component slots.\n / export const cardPreviewClassNames = {\n root: 'fui-CardPreview',\n logo: 'fui-CardPreview__logo'\n};\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n [`> :not(.${cardPreviewClassNames.logo})`]: {\n display: 'block',\n height: '100%',\n width: '100%'\n }\n },\n logo: {\n position: 'absolute',\n bottom: '12px',\n left: '12px',\n width: '32px',\n height: '32px'\n }\n});\n/\n Apply styling to the CardPreview slots based on the state.\n */ export const useCardPreviewStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(cardPreviewClassNames.root, styles.root, state.root.className);\n if (state.logo) {\n state.logo.className = mergeClasses(cardPreviewClassNames.logo, styles.logo, state.logo.className);\n }\n return state;\n};\n"],"names":["__styles","mergeClasses","cardPreviewClassNames","root","logo","useStyles","qhf8xq","Byfpedg","Btj6oj6","B1m4t4s","B5kzvoi","oyh7mz","a9b677","Bqenvij","d","useCardPreviewStyles_unstable","state","styles","className"],"mappings":";;;;;;;;;;;IAGiBE,qBAAqB;;;iCAuBQ;eAA7Ba;;;uBA1BwB,gBAAgB;AAG9C,8BAA8B;IACrCZ,IAAI,EAAE,iBAAiB;IACvBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGL,eAAA,EAAA;IAAAG,IAAA,EAAA;QAAAG,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAL,IAAA,EAAA;QAAAE,MAAA,EAAA;QAAAI,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAgBjB,CAAC;AAGS,uCAAuCE,KAAK,IAAG;IACtD,aAAa;IACb,MAAMC,MAAM,GAAGZ,SAAS,CAAC,CAAC;IAC1BW,KAAK,CAACb,IAAI,CAACe,SAAS,OAAGjB,mBAAY,EAACC,qBAAqB,CAACC,IAAI,EAAEc,MAAM,CAACd,IAAI,EAAEa,KAAK,CAACb,IAAI,CAACe,SAAS,CAAC;IAClG,IAAIF,KAAK,CAACZ,IAAI,EAAE;QACZY,KAAK,CAACZ,IAAI,CAACc,SAAS,OAAGjB,mBAAY,EAACC,qBAAqB,CAACE,IAAI,EAAEa,MAAM,CAACb,IAAI,EAAEY,KAAK,CAACZ,IAAI,CAACc,SAAS,CAAC;IACtG;IACA,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/CardPreview/useCardPreviewStyles.styles.raw.js ADDED Viewed

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    cardPreviewClassNames: function() {
+        return cardPreviewClassNames;
+    },
+    useCardPreviewStyles_unstable: function() {
+        return useCardPreviewStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const cardPreviewClassNames = {
+    root: 'fui-CardPreview',
+    logo: 'fui-CardPreview__logo'
+};
+const useStyles = (0, _react.makeStyles)({
+    root: {
+        position: 'relative',
+        [`> :not(.${cardPreviewClassNames.logo})`]: {
+            display: 'block',
+            height: '100%',
+            width: '100%'
+        }
+    },
+    logo: {
+        position: 'absolute',
+        bottom: '12px',
+        left: '12px',
+        width: '32px',
+        height: '32px'
+    }
+});
+const useCardPreviewStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _react.mergeClasses)(cardPreviewClassNames.root, styles.root, state.root.className);
+    if (state.logo) {
+        state.logo.className = (0, _react.mergeClasses)(cardPreviewClassNames.logo, styles.logo, state.logo.className);
+    }
+    return state;
+};