@fluentui/react-badge 9.4.0 → 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.
- package/CHANGELOG.md +12 -2
- package/lib/Badge.js.map +1 -1
- package/lib/CounterBadge.js.map +1 -1
- package/lib/PresenceBadge.js.map +1 -1
- package/lib/components/Badge/Badge.js.map +1 -1
- package/lib/components/Badge/Badge.types.js.map +1 -1
- package/lib/components/Badge/index.js.map +1 -1
- package/lib/components/Badge/renderBadge.js.map +1 -1
- package/lib/components/Badge/useBadge.js.map +1 -1
- package/lib/components/Badge/useBadgeStyles.styles.raw.js.map +1 -1
- package/lib/components/CounterBadge/CounterBadge.js.map +1 -1
- package/lib/components/CounterBadge/CounterBadge.types.js.map +1 -1
- package/lib/components/CounterBadge/index.js.map +1 -1
- package/lib/components/CounterBadge/useCounterBadge.js.map +1 -1
- package/lib/components/CounterBadge/useCounterBadgeStyles.styles.raw.js.map +1 -1
- package/lib/components/PresenceBadge/PresenceBadge.js.map +1 -1
- package/lib/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
- package/lib/components/PresenceBadge/index.js.map +1 -1
- package/lib/components/PresenceBadge/presenceIcons.js.map +1 -1
- package/lib/components/PresenceBadge/usePresenceBadge.js.map +1 -1
- package/lib/components/PresenceBadge/usePresenceBadgeStyles.styles.raw.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Badge.js.map +1 -1
- package/lib-commonjs/CounterBadge.js.map +1 -1
- package/lib-commonjs/PresenceBadge.js.map +1 -1
- package/lib-commonjs/components/Badge/Badge.js.map +1 -1
- package/lib-commonjs/components/Badge/Badge.types.js.map +1 -1
- package/lib-commonjs/components/Badge/index.js.map +1 -1
- package/lib-commonjs/components/Badge/renderBadge.js.map +1 -1
- package/lib-commonjs/components/Badge/useBadge.js.map +1 -1
- package/lib-commonjs/components/Badge/useBadgeStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Badge/useBadgeStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/CounterBadge.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/CounterBadge.types.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/index.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/useCounterBadge.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.styles.js.map +1 -1
- package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/PresenceBadge.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/PresenceBadge.types.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/index.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/presenceIcons.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/usePresenceBadge.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.js.map +1 -1
- package/lib-commonjs/components/PresenceBadge/usePresenceBadgeStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +3 -3
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n minWidth: '20px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n minWidth: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n minWidth: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n minWidth: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: tokens.borderRadiusNone\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n roundedSmallToTiny: {\n borderRadius: tokens.borderRadiusSmall\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"names":["badgeClassNames","useBadgeStyles_unstable","root","icon","textPadding","tokens","spacingHorizontalXXS","useRootClassName","__resetStyles","useRootStyles","__styles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","state","rootClassName","rootStyles","smallToTiny","size","className","mergeClasses","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
1
|
+
{"version":3,"sources":["useBadgeStyles.styles.js"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const badgeClassNames = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon'\n};\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n minWidth: '20px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit'\n }\n});\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong\n },\n // size\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset'\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset'\n },\n small: {\n minWidth: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n medium: {\n },\n large: {\n minWidth: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n 'extra-large': {\n minWidth: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`\n },\n // shape\n square: {\n borderRadius: tokens.borderRadiusNone\n },\n rounded: {\n borderRadius: tokens.borderRadiusMedium\n },\n roundedSmallToTiny: {\n borderRadius: tokens.borderRadiusSmall\n },\n circular: {\n },\n // hide the boder when appearance is \"ghost\"\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none'\n }\n },\n // appearance: filled\n filled: {\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static\n },\n // appearance: ghost\n ghost: {\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: outline\n outline: {\n ...shorthands.borderColor('currentColor')\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible)\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2)\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2\n },\n // appearance: tint\n tint: {\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2)\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1)\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke)\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1)\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2)\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1)\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1)\n }\n});\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`,\n fontSize: '12px'\n});\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`\n },\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`\n },\n // size\n tiny: {\n fontSize: '6px'\n },\n 'extra-small': {\n fontSize: '10px'\n },\n small: {\n fontSize: '12px'\n },\n medium: {\n },\n large: {\n fontSize: '16px'\n },\n 'extra-large': {\n fontSize: '20px'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n state.root.className = mergeClasses(badgeClassNames.root, rootClassName, smallToTiny && rootStyles.fontSmallToTiny, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny, state.appearance === 'ghost' && rootStyles.borderGhost, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n state.icon.className = mergeClasses(badgeClassNames.icon, iconRootClassName, iconPositionClass, iconStyles[state.size], state.icon.className);\n }\n return state;\n};\n"],"names":["shorthands","__resetStyles","__styles","mergeClasses","tokens","typographyStyles","badgeClassNames","root","icon","textPadding","spacingHorizontalXXS","useRootClassName","useRootStyles","fontSmallToTiny","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","tiny","a9b677","Bqenvij","Bf4jedk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","small","medium","large","square","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","rounded","roundedSmallToTiny","circular","borderGhost","ap17g6","filled","De3pzq","sj55zd","ghost","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","tint","d","p","useIconRootClassName","useIconStyles","beforeText","t21cq0","afterText","Frg6f3","beforeTextXL","afterTextXL","useBadgeStyles_unstable","state","rootClassName","rootStyles","smallToTiny","size","className","shape","appearance","color","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/Badge/useBadgeStyles.styles.ts"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { BadgeSlots, BadgeState } from './Badge.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const badgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon',\n};\n\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n minWidth: '20px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit',\n },\n});\n\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong,\n },\n\n // size\n\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset',\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset',\n },\n small: {\n minWidth: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n medium: {\n // Set by useRootClassName\n },\n large: {\n minWidth: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n 'extra-large': {\n minWidth: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`,\n },\n\n // shape\n\n square: { borderRadius: tokens.borderRadiusNone },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n roundedSmallToTiny: { borderRadius: tokens.borderRadiusSmall },\n circular: {\n // Set by useRootClassName\n },\n // hide the boder when appearance is \"ghost\"\n\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none',\n },\n },\n\n // appearance: filled\n\n filled: {\n // Set by useRootClassName\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1,\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3,\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static,\n },\n\n // appearance: ghost\n\n ghost: {\n // No shared colors between ghost appearances\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1,\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3,\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1,\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3,\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3,\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3,\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2,\n },\n\n // appearance: outline\n\n outline: {\n ...shorthands.borderColor('currentColor'),\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1,\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3,\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2),\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2,\n },\n\n // appearance: tint\n\n tint: {\n // No shared colors between tint appearances\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2),\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1),\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1),\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1),\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1),\n },\n});\n\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`, // Remove text padding added to root\n fontSize: '12px',\n});\n\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n\n // size\n\n tiny: {\n fontSize: '6px',\n },\n 'extra-small': {\n fontSize: '10px',\n },\n small: {\n fontSize: '12px',\n },\n medium: {\n // Set by useIconRootClassName\n },\n large: {\n fontSize: '16px',\n },\n 'extra-large': {\n fontSize: '20px',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useBadgeStyles_unstable = (state: BadgeState): BadgeState => {\n 'use no memo';\n\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n\n state.root.className = mergeClasses(\n badgeClassNames.root,\n rootClassName,\n smallToTiny && rootStyles.fontSmallToTiny,\n rootStyles[state.size],\n rootStyles[state.shape],\n state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny,\n state.appearance === 'ghost' && rootStyles.borderGhost,\n rootStyles[state.appearance],\n rootStyles[`${state.appearance}-${state.color}` as const],\n state.root.className,\n );\n\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n\n state.icon.className = mergeClasses(\n badgeClassNames.icon,\n iconRootClassName,\n iconPositionClass,\n iconStyles[state.size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"names":["badgeClassNames","useBadgeStyles_unstable","root","icon","textPadding","tokens","spacingHorizontalXXS","useRootClassName","makeResetStyles","display","boxSizing","alignItems","justifyContent","position","typographyStyles","caption1Strong","height","minWidth","padding","spacingHorizontalXS","borderRadius","borderRadiusCircular","borderColor","colorTransparentStroke","content","top","left","bottom","right","borderStyle","borderWidth","strokeWidthThin","useRootStyles","makeStyles","fontSmallToTiny","caption2Strong","tiny","width","fontSize","lineHeight","small","medium","large","spacingHorizontalSNudge","square","borderRadiusNone","rounded","borderRadiusMedium","roundedSmallToTiny","borderRadiusSmall","circular","borderGhost","filled","backgroundColor","colorBrandBackground","color","colorNeutralForegroundOnBrand","colorPaletteRedBackground3","colorNeutralForeground1","colorNeutralBackground1","colorNeutralBackground5","colorNeutralForeground3","colorPaletteDarkOrangeBackground3","colorPaletteGreenBackground3","colorPaletteYellowBackground3","colorNeutralForeground1Static","ghost","colorBrandForeground1","colorPaletteRedForeground3","colorPaletteDarkOrangeForeground3","colorNeutralForegroundStaticInverted","colorPaletteGreenForeground3","colorPaletteYellowForeground2","outline","shorthands","colorPaletteRedBorder2","colorNeutralStrokeAccessible","colorNeutralStroke2","colorPaletteGreenBorder2","tint","colorBrandBackground2","colorBrandForeground2","colorBrandStroke2","colorPaletteRedBackground1","colorPaletteRedForeground1","colorPaletteRedBorder1","colorNeutralBackground4","colorPaletteDarkOrangeBackground1","colorPaletteDarkOrangeForeground1","colorPaletteDarkOrangeBorder1","colorPaletteGreenBackground1","colorPaletteGreenForeground1","colorPaletteGreenBorder1","colorPaletteYellowBackground1","colorPaletteYellowForeground1","colorPaletteYellowBorder1","useIconRootClassName","margin","useIconStyles","beforeText","marginRight","afterText","marginLeft","beforeTextXL","afterTextXL","state","rootClassName","rootStyles","smallToTiny","size","className","mergeClasses","shape","appearance","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
1
|
+
{"version":3,"sources":["../src/components/Badge/useBadgeStyles.styles.ts"],"sourcesContent":["import { shorthands, makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { BadgeSlots, BadgeState } from './Badge.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const badgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-Badge',\n icon: 'fui-Badge__icon',\n};\n\n// The text content of the badge has additional horizontal padding, but there is no `text` slot to add that padding to.\n// Instead, add extra padding to the root, and a negative margin on the icon to \"remove\" the extra padding on the icon.\nconst textPadding = tokens.spacingHorizontalXXS;\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n ...typographyStyles.caption1Strong,\n height: '20px',\n minWidth: '20px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n borderRadius: tokens.borderRadiusCircular,\n // Use a transparent stroke (rather than no border) so the border is visible in high contrast\n borderColor: tokens.colorTransparentStroke,\n\n '::after': {\n content: '\"\"',\n position: 'absolute',\n top: 0,\n left: 0,\n bottom: 0,\n right: 0,\n borderStyle: 'solid',\n borderColor: 'inherit',\n borderWidth: tokens.strokeWidthThin,\n borderRadius: 'inherit',\n },\n});\n\nconst useRootStyles = makeStyles({\n fontSmallToTiny: {\n ...typographyStyles.caption2Strong,\n },\n\n // size\n\n tiny: {\n width: '6px',\n height: '6px',\n fontSize: '4px',\n lineHeight: '4px',\n minWidth: 'unset',\n padding: 'unset',\n },\n 'extra-small': {\n width: '10px',\n height: '10px',\n fontSize: '6px',\n lineHeight: '6px',\n minWidth: 'unset',\n padding: 'unset',\n },\n small: {\n minWidth: '16px',\n height: '16px',\n padding: `0 calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n medium: {\n // Set by useRootClassName\n },\n large: {\n minWidth: '24px',\n height: '24px',\n padding: `0 calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n 'extra-large': {\n minWidth: '32px',\n height: '32px',\n padding: `0 calc(${tokens.spacingHorizontalSNudge} + ${textPadding})`,\n },\n\n // shape\n\n square: { borderRadius: tokens.borderRadiusNone },\n rounded: { borderRadius: tokens.borderRadiusMedium },\n roundedSmallToTiny: { borderRadius: tokens.borderRadiusSmall },\n circular: {\n // Set by useRootClassName\n },\n // hide the boder when appearance is \"ghost\"\n\n borderGhost: {\n // The border is applied in an ::after pseudo-element because it should not affect layout.\n // The padding and size of the badge should be the same regardless of whether or not it has a border.\n '::after': {\n display: 'none',\n },\n },\n\n // appearance: filled\n\n filled: {\n // Set by useRootClassName\n },\n 'filled-brand': {\n backgroundColor: tokens.colorBrandBackground,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-danger': {\n backgroundColor: tokens.colorPaletteRedBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-important': {\n backgroundColor: tokens.colorNeutralForeground1,\n color: tokens.colorNeutralBackground1,\n },\n 'filled-informative': {\n backgroundColor: tokens.colorNeutralBackground5,\n color: tokens.colorNeutralForeground3,\n },\n 'filled-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n },\n 'filled-success': {\n backgroundColor: tokens.colorPaletteGreenBackground3,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n 'filled-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground3,\n color: tokens.colorNeutralForeground1Static,\n },\n\n // appearance: ghost\n\n ghost: {\n // No shared colors between ghost appearances\n },\n 'ghost-brand': {\n color: tokens.colorBrandForeground1,\n },\n 'ghost-danger': {\n color: tokens.colorPaletteRedForeground3,\n },\n 'ghost-important': {\n color: tokens.colorNeutralForeground1,\n },\n 'ghost-informative': {\n color: tokens.colorNeutralForeground3,\n },\n 'ghost-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3,\n },\n 'ghost-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n 'ghost-success': {\n color: tokens.colorPaletteGreenForeground3,\n },\n 'ghost-warning': {\n color: tokens.colorPaletteYellowForeground2,\n },\n\n // appearance: outline\n\n outline: {\n ...shorthands.borderColor('currentColor'),\n },\n 'outline-brand': {\n color: tokens.colorBrandForeground1,\n },\n 'outline-danger': {\n color: tokens.colorPaletteRedForeground3,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder2),\n },\n 'outline-important': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStrokeAccessible),\n },\n 'outline-informative': {\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'outline-severe': {\n color: tokens.colorPaletteDarkOrangeForeground3,\n },\n 'outline-subtle': {\n color: tokens.colorNeutralForegroundStaticInverted,\n },\n 'outline-success': {\n color: tokens.colorPaletteGreenForeground3,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder2),\n },\n 'outline-warning': {\n color: tokens.colorPaletteYellowForeground2,\n },\n\n // appearance: tint\n\n tint: {\n // No shared colors between tint appearances\n },\n 'tint-brand': {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2,\n ...shorthands.borderColor(tokens.colorBrandStroke2),\n },\n 'tint-danger': {\n backgroundColor: tokens.colorPaletteRedBackground1,\n color: tokens.colorPaletteRedForeground1,\n ...shorthands.borderColor(tokens.colorPaletteRedBorder1),\n },\n 'tint-important': {\n backgroundColor: tokens.colorNeutralForeground3,\n color: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n 'tint-informative': {\n backgroundColor: tokens.colorNeutralBackground4,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'tint-severe': {\n backgroundColor: tokens.colorPaletteDarkOrangeBackground1,\n color: tokens.colorPaletteDarkOrangeForeground1,\n ...shorthands.borderColor(tokens.colorPaletteDarkOrangeBorder1),\n },\n 'tint-subtle': {\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground3,\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n },\n 'tint-success': {\n backgroundColor: tokens.colorPaletteGreenBackground1,\n color: tokens.colorPaletteGreenForeground1,\n ...shorthands.borderColor(tokens.colorPaletteGreenBorder1),\n },\n 'tint-warning': {\n backgroundColor: tokens.colorPaletteYellowBackground1,\n color: tokens.colorPaletteYellowForeground1,\n ...shorthands.borderColor(tokens.colorPaletteYellowBorder1),\n },\n});\n\nconst useIconRootClassName = makeResetStyles({\n display: 'flex',\n lineHeight: '1',\n margin: `0 calc(-1 * ${textPadding})`, // Remove text padding added to root\n fontSize: '12px',\n});\n\nconst useIconStyles = makeStyles({\n beforeText: {\n marginRight: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n afterText: {\n marginLeft: `calc(${tokens.spacingHorizontalXXS} + ${textPadding})`,\n },\n\n beforeTextXL: {\n marginRight: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n afterTextXL: {\n marginLeft: `calc(${tokens.spacingHorizontalXS} + ${textPadding})`,\n },\n\n // size\n\n tiny: {\n fontSize: '6px',\n },\n 'extra-small': {\n fontSize: '10px',\n },\n small: {\n fontSize: '12px',\n },\n medium: {\n // Set by useIconRootClassName\n },\n large: {\n fontSize: '16px',\n },\n 'extra-large': {\n fontSize: '20px',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useBadgeStyles_unstable = (state: BadgeState): BadgeState => {\n 'use no memo';\n\n const rootClassName = useRootClassName();\n const rootStyles = useRootStyles();\n\n const smallToTiny = state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny';\n\n state.root.className = mergeClasses(\n badgeClassNames.root,\n rootClassName,\n smallToTiny && rootStyles.fontSmallToTiny,\n rootStyles[state.size],\n rootStyles[state.shape],\n state.shape === 'rounded' && smallToTiny && rootStyles.roundedSmallToTiny,\n state.appearance === 'ghost' && rootStyles.borderGhost,\n rootStyles[state.appearance],\n rootStyles[`${state.appearance}-${state.color}` as const],\n state.root.className,\n );\n\n const iconRootClassName = useIconRootClassName();\n const iconStyles = useIconStyles();\n if (state.icon) {\n let iconPositionClass;\n if (state.root.children) {\n if (state.size === 'extra-large') {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterTextXL : iconStyles.beforeTextXL;\n } else {\n iconPositionClass = state.iconPosition === 'after' ? iconStyles.afterText : iconStyles.beforeText;\n }\n }\n\n state.icon.className = mergeClasses(\n badgeClassNames.icon,\n iconRootClassName,\n iconPositionClass,\n iconStyles[state.size],\n state.icon.className,\n );\n }\n\n return state;\n};\n"],"names":["shorthands","makeResetStyles","makeStyles","mergeClasses","tokens","typographyStyles","badgeClassNames","root","icon","textPadding","spacingHorizontalXXS","useRootClassName","display","boxSizing","alignItems","justifyContent","position","caption1Strong","height","minWidth","padding","spacingHorizontalXS","borderRadius","borderRadiusCircular","borderColor","colorTransparentStroke","content","top","left","bottom","right","borderStyle","borderWidth","strokeWidthThin","useRootStyles","fontSmallToTiny","caption2Strong","tiny","width","fontSize","lineHeight","small","medium","large","spacingHorizontalSNudge","square","borderRadiusNone","rounded","borderRadiusMedium","roundedSmallToTiny","borderRadiusSmall","circular","borderGhost","filled","backgroundColor","colorBrandBackground","color","colorNeutralForegroundOnBrand","colorPaletteRedBackground3","colorNeutralForeground1","colorNeutralBackground1","colorNeutralBackground5","colorNeutralForeground3","colorPaletteDarkOrangeBackground3","colorPaletteGreenBackground3","colorPaletteYellowBackground3","colorNeutralForeground1Static","ghost","colorBrandForeground1","colorPaletteRedForeground3","colorPaletteDarkOrangeForeground3","colorNeutralForegroundStaticInverted","colorPaletteGreenForeground3","colorPaletteYellowForeground2","outline","colorPaletteRedBorder2","colorNeutralStrokeAccessible","colorNeutralStroke2","colorPaletteGreenBorder2","tint","colorBrandBackground2","colorBrandForeground2","colorBrandStroke2","colorPaletteRedBackground1","colorPaletteRedForeground1","colorPaletteRedBorder1","colorNeutralBackground4","colorPaletteDarkOrangeBackground1","colorPaletteDarkOrangeForeground1","colorPaletteDarkOrangeBorder1","colorPaletteGreenBackground1","colorPaletteGreenForeground1","colorPaletteGreenBorder1","colorPaletteYellowBackground1","colorPaletteYellowForeground1","colorPaletteYellowBorder1","useIconRootClassName","margin","useIconStyles","beforeText","marginRight","afterText","marginLeft","beforeTextXL","afterTextXL","useBadgeStyles_unstable","state","rootClassName","rootStyles","smallToTiny","size","className","shape","appearance","iconRootClassName","iconStyles","iconPositionClass","children","iconPosition"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.\n */\nexport const CounterBadge: ForwardRefComponent<CounterBadgeProps> = React.forwardRef((props, ref) => {\n const state = useCounterBadge_unstable(props, ref);\n\n useCounterBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"names":["
|
1
|
+
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps } from './CounterBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.\n */\nexport const CounterBadge: ForwardRefComponent<CounterBadgeProps> = React.forwardRef((props, ref) => {\n const state = useCounterBadge_unstable(props, ref);\n\n useCounterBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('useCounterBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"names":["React","useCounterBadge_unstable","useCounterBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","CounterBadge","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;iCACU,oBAAoB;6CACd,iCAAiC;qCACpC,kCAAkC;uBACzC,iBAAiB;AAO/C,qBAAMA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,6CAAAA,EAAyBM,OAAOC;QAE9CN,2DAAAA,EAA+BO;QAE/BN,gDAAAA,EAA4B,kCAAkCM;IAE9D,WAAOL,2BAAAA,EAAqBK;AAC9B,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.types.ts"],"sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\nexport type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'color' | 'shape'> & {\n /**\n * A Badge can have different appearances that emphasize certain parts of it:\n * - filled: The default appearance if one is not specified.\n * The badge background is filled with color with a contrasting foreground text to match.\n * - ghost: The badge background is transparent, with the foreground text taking color to emphasize it.\n * @default filled\n */\n appearance?: 'filled' | 'ghost';\n\n /**\n * Semantic colors for a counter badge\n * @default brand\n */\n color?: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;\n\n /**\n * Value displayed by the Badge\n * @default 0\n */\n count?: number;\n\n /**\n * If a dot should be displayed without the count\n * @default false\n */\n dot?: boolean;\n\n /**\n * Max number to be displayed\n * @default 99\n */\n overflowCount?: number;\n\n /**\n * A Badge can be circular or rounded\n * @default circular\n */\n shape?: 'circular' | 'rounded';\n\n /**\n * If the badge should be shown when count is 0\n * @default false\n */\n showZero?: boolean;\n};\n\nexport type CounterBadgeState = Omit<BadgeState, 'appearance' | 'color' | 'shape'> &\n Required<Pick<CounterBadgeProps, 'appearance' | 'color' | 'count' | 'dot' | 'shape' | 'showZero'>>;\n"],"names":[],"
|
1
|
+
{"version":3,"sources":["../src/components/CounterBadge/CounterBadge.types.ts"],"sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\nexport type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'color' | 'shape'> & {\n /**\n * A Badge can have different appearances that emphasize certain parts of it:\n * - filled: The default appearance if one is not specified.\n * The badge background is filled with color with a contrasting foreground text to match.\n * - ghost: The badge background is transparent, with the foreground text taking color to emphasize it.\n * @default filled\n */\n appearance?: 'filled' | 'ghost';\n\n /**\n * Semantic colors for a counter badge\n * @default brand\n */\n color?: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;\n\n /**\n * Value displayed by the Badge\n * @default 0\n */\n count?: number;\n\n /**\n * If a dot should be displayed without the count\n * @default false\n */\n dot?: boolean;\n\n /**\n * Max number to be displayed\n * @default 99\n */\n overflowCount?: number;\n\n /**\n * A Badge can be circular or rounded\n * @default circular\n */\n shape?: 'circular' | 'rounded';\n\n /**\n * If the badge should be shown when count is 0\n * @default false\n */\n showZero?: boolean;\n};\n\nexport type CounterBadgeState = Omit<BadgeState, 'appearance' | 'color' | 'shape'> &\n Required<Pick<CounterBadgeProps, 'appearance' | 'color' | 'count' | 'dot' | 'shape' | 'showZero'>>;\n"],"names":[],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/CounterBadge/index.ts"],"sourcesContent":["export { CounterBadge } from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\nexport { useCounterBadge_unstable } from './useCounterBadge';\nexport { counterBadgeClassNames, useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\n"],"names":["CounterBadge","
|
1
|
+
{"version":3,"sources":["../src/components/CounterBadge/index.ts"],"sourcesContent":["export { CounterBadge } from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\nexport { useCounterBadge_unstable } from './useCounterBadge';\nexport { counterBadgeClassNames, useCounterBadgeStyles_unstable } from './useCounterBadgeStyles.styles';\n"],"names":["CounterBadge","useCounterBadge_unstable","counterBadgeClassNames","useCounterBadgeStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAGZE,mDAAsB;;;eAAEC,2DAA8B;;;eADtDF,yCAAwB;;;8BAFJ,iBAAiB;iCAEL,oBAAoB;6CACU,iCAAiC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/CounterBadge/useCounterBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport type { BadgeState } from '../Badge/index';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useCounterBadge_unstable = (props: CounterBadgeProps, ref: React.Ref<HTMLElement>): CounterBadgeState => {\n const {\n shape = 'circular',\n appearance = 'filled',\n showZero = false,\n overflowCount = 99,\n count = 0,\n dot = false,\n } = props;\n\n const state: CounterBadgeState = {\n ...(useBadge_unstable(props, ref) as Pick<CounterBadgeState, keyof BadgeState>),\n shape,\n appearance,\n showZero,\n count,\n dot,\n };\n\n if ((count !== 0 || showZero) && !dot && !state.root.children) {\n state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;\n }\n\n return state;\n};\n"],"names":["useCounterBadge_unstable","props","ref","shape","appearance","showZero","overflowCount","count","dot","state","
|
1
|
+
{"version":3,"sources":["../src/components/CounterBadge/useCounterBadge.ts"],"sourcesContent":["import * as React from 'react';\nimport type { BadgeState } from '../Badge/index';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useCounterBadge_unstable = (props: CounterBadgeProps, ref: React.Ref<HTMLElement>): CounterBadgeState => {\n const {\n shape = 'circular',\n appearance = 'filled',\n showZero = false,\n overflowCount = 99,\n count = 0,\n dot = false,\n } = props;\n\n const state: CounterBadgeState = {\n ...(useBadge_unstable(props, ref) as Pick<CounterBadgeState, keyof BadgeState>),\n shape,\n appearance,\n showZero,\n count,\n dot,\n };\n\n if ((count !== 0 || showZero) && !dot && !state.root.children) {\n state.root.children = count > overflowCount ? `${overflowCount}+` : `${count}`;\n }\n\n return state;\n};\n"],"names":["React","useBadge_unstable","useCounterBadge_unstable","props","ref","shape","appearance","showZero","overflowCount","count","dot","state","root","children"],"mappings":";;;;+BAQaE;;;;;;;iEARU,QAAQ;uBAEG,iBAAiB;AAM5C,iCAAiC,CAACC,OAA0BC;IACjE,MAAM,EACJC,QAAQ,UAAU,EAClBC,aAAa,QAAQ,EACrBC,WAAW,KAAK,EAChBC,gBAAgB,EAAE,EAClBC,QAAQ,CAAC,EACTC,MAAM,KAAK,EACZ,GAAGP;IAEJ,MAAMQ,QAA2B;QAC/B,OAAIV,wBAAAA,EAAkBE,OAAOC,IAAI;QACjCC;QACAC;QACAC;QACAE;QACAC;IACF;IAEA,IAAKD,CAAAA,UAAU,KAAKF,QAAAA,CAAO,IAAM,CAACG,OAAO,CAACC,MAAMC,IAAI,CAACC,QAAQ,EAAE;QAC7DF,MAAMC,IAAI,CAACC,QAAQ,GAAGJ,QAAQD,gBAAgB,GAAGA,cAAc,CAAC,CAAC,GAAG,GAAGC,OAAO;IAChF;IAEA,OAAOE;AACT,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useCounterBadgeStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nexport const counterBadgeClassNames = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon'\n};\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n padding: '0'\n },\n hide: {\n display: 'none'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useCounterBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(counterBadgeClassNames.root, state.dot && styles.dot, !state.root.children && !state.dot && styles.hide, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n return useBadgeStyles_unstable(state);\n};\n"],"names":["
|
1
|
+
{"version":3,"sources":["useCounterBadgeStyles.styles.js"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nexport const counterBadgeClassNames = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon'\n};\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n padding: '0'\n },\n hide: {\n display: 'none'\n }\n});\n/**\n * Applies style classnames to slots\n */ export const useCounterBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(counterBadgeClassNames.root, state.dot && styles.dot, !state.root.children && !state.dot && styles.hide, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n return useBadgeStyles_unstable(state);\n};\n"],"names":["mergeClasses","__styles","useBadgeStyles_unstable","counterBadgeClassNames","root","icon","useStyles","dot","Bf4jedk","a9b677","Bqenvij","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","hide","mc9l5x","d","p","useCounterBadgeStyles_unstable","state","styles","className","children"],"mappings":";;;;;;;;;;;IAEaG,sBAAsB;;;IAiBlBiB,8BAA8B;;;;uBAnBN,gBAAgB;sCACjB,gCAAgC;AACjE,+BAA+B;IAClChB,IAAI,EAAE,kBAAkB;IACxBC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,GAAGL,mBAAA,EAAA;IAAAM,GAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,IAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;KAAA;AAAA,CAUjB,CAAC;AAGS,uCAAwCE,KAAK,IAAG;IACvD,aAAa;IACb,MAAMC,MAAM,GAAGhB,SAAS,CAAC,CAAC;IAC1Be,KAAK,CAACjB,IAAI,CAACmB,SAAS,OAAGvB,mBAAY,EAACG,sBAAsB,CAACC,IAAI,EAAEiB,KAAK,CAACd,GAAG,IAAIe,MAAM,CAACf,GAAG,EAAE,CAACc,KAAK,CAACjB,IAAI,CAACoB,QAAQ,IAAI,CAACH,KAAK,CAACd,GAAG,IAAIe,MAAM,CAACN,IAAI,EAAEK,KAAK,CAACjB,IAAI,CAACmB,SAAS,CAAC;IAClK,IAAIF,KAAK,CAAChB,IAAI,EAAE;QACZgB,KAAK,CAAChB,IAAI,CAACkB,SAAS,OAAGvB,mBAAY,EAACG,sBAAsB,CAACE,IAAI,EAAEgB,KAAK,CAAChB,IAAI,CAACkB,SAAS,CAAC;IAC1F;IACA,WAAOrB,6CAAuB,EAACmB,KAAK,CAAC;AACzC,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/CounterBadge/useCounterBadgeStyles.styles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { CounterBadgeState } from './CounterBadge.types';\n\nexport const counterBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon',\n};\n\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n padding: '0',\n },\n hide: {\n display: 'none',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useCounterBadgeStyles_unstable = (state: CounterBadgeState): CounterBadgeState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(\n counterBadgeClassNames.root,\n state.dot && styles.dot,\n !state.root.children && !state.dot && styles.hide,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n\n return useBadgeStyles_unstable(state) as CounterBadgeState;\n};\n"],"names":["
|
1
|
+
{"version":3,"sources":["../src/components/CounterBadge/useCounterBadgeStyles.styles.ts"],"sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { useBadgeStyles_unstable } from '../Badge/useBadgeStyles.styles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { CounterBadgeState } from './CounterBadge.types';\n\nexport const counterBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-CounterBadge',\n icon: 'fui-CounterBadge__icon',\n};\n\nconst useStyles = makeStyles({\n dot: {\n minWidth: 'auto',\n width: '6px',\n height: '6px',\n padding: '0',\n },\n hide: {\n display: 'none',\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useCounterBadgeStyles_unstable = (state: CounterBadgeState): CounterBadgeState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(\n counterBadgeClassNames.root,\n state.dot && styles.dot,\n !state.root.children && !state.dot && styles.hide,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(counterBadgeClassNames.icon, state.icon.className);\n }\n\n return useBadgeStyles_unstable(state) as CounterBadgeState;\n};\n"],"names":["mergeClasses","makeStyles","useBadgeStyles_unstable","counterBadgeClassNames","root","icon","useStyles","dot","minWidth","width","height","padding","hide","display","useCounterBadgeStyles_unstable","state","styles","className","children"],"mappings":";;;;;;;;;;;IAMaG,sBAAAA;;;IAoBAW,8BAAAA;;;;uBA1B4B,iBAAiB;sCAClB,iCAAiC;AAKlE,+BAA2D;IAChEV,MAAM;IACNC,MAAM;AACR,EAAE;AAEF,MAAMC,gBAAYL,iBAAAA,EAAW;IAC3BM,KAAK;QACHC,UAAU;QACVC,OAAO;QACPC,QAAQ;QACRC,SAAS;IACX;IACAC,MAAM;QACJC,SAAS;IACX;AACF;AAKO,uCAAuC,CAACE;IAC7C;IAEA,MAAMC,SAASV;IACfS,MAAMX,IAAI,CAACa,SAAS,OAAGjB,mBAAAA,EACrBG,uBAAuBC,IAAI,EAC3BW,MAAMR,GAAG,IAAIS,OAAOT,GAAG,EACvB,CAACQ,MAAMX,IAAI,CAACc,QAAQ,IAAI,CAACH,MAAMR,GAAG,IAAIS,OAAOJ,IAAI,EACjDG,MAAMX,IAAI,CAACa,SAAS;IAGtB,IAAIF,MAAMV,IAAI,EAAE;QACdU,MAAMV,IAAI,CAACY,SAAS,OAAGjB,mBAAAA,EAAaG,uBAAuBE,IAAI,EAAEU,MAAMV,IAAI,CAACY,SAAS;IACvF;IAEA,WAAOf,6CAAAA,EAAwBa;AACjC,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge_unstable } from './usePresenceBadge';\nimport { usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const PresenceBadge: ForwardRefComponent<PresenceBadgeProps> = React.forwardRef((props, ref) => {\n const state = usePresenceBadge_unstable(props, ref);\n\n usePresenceBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"names":["
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge_unstable } from './usePresenceBadge';\nimport { usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { renderBadge_unstable } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Define a styled Badge, using the `useBadge_unstable` hook.\n */\nexport const PresenceBadge: ForwardRefComponent<PresenceBadgeProps> = React.forwardRef((props, ref) => {\n const state = usePresenceBadge_unstable(props, ref);\n\n usePresenceBadgeStyles_unstable(state);\n\n useCustomStyleHook_unstable('usePresenceBadgeStyles_unstable')(state);\n\n return renderBadge_unstable(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"names":["React","usePresenceBadge_unstable","usePresenceBadgeStyles_unstable","useCustomStyleHook_unstable","renderBadge_unstable","PresenceBadge","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAWaK;;;;;;;iEAXU,QAAQ;kCACW,qBAAqB;8CACf,kCAAkC;qCACtC,kCAAkC;uBACzC,cAAc;AAO5C,sBAAMA,WAAAA,GAAyDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,+CAAAA,EAA0BM,OAAOC;QAE/CN,6DAAAA,EAAgCO;QAEhCN,gDAAAA,EAA4B,mCAAmCM;IAE/D,WAAOL,2BAAAA,EAAqBK;AAC9B,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState, BadgeSlots } from '../Badge/Badge.types';\n\nexport type PresenceBadgeStatus =\n | 'busy'\n | 'out-of-office'\n | 'away'\n | 'available'\n | 'offline'\n | 'do-not-disturb'\n | 'unknown'\n | 'blocked';\n\nexport type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root' | 'icon'>>, 'color'> &\n Pick<BadgeProps, 'size'> & {\n /**\n * Represents several status\n * @default available\n */\n status?: PresenceBadgeStatus;\n\n /**\n * Modifies the display to indicate that the user is out of office.\n * This can be combined with any status to display an out-of-office version of that status\n * @default false\n */\n outOfOffice?: boolean;\n };\n\nexport type PresenceBadgeState = ComponentState<BadgeSlots> &\n BadgeState &\n Required<Pick<PresenceBadgeProps, 'status' | 'outOfOffice'>>;\n"],"names":[],"
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/PresenceBadge.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState, BadgeSlots } from '../Badge/Badge.types';\n\nexport type PresenceBadgeStatus =\n | 'busy'\n | 'out-of-office'\n | 'away'\n | 'available'\n | 'offline'\n | 'do-not-disturb'\n | 'unknown'\n | 'blocked';\n\nexport type PresenceBadgeProps = Omit<ComponentProps<Pick<BadgeSlots, 'root' | 'icon'>>, 'color'> &\n Pick<BadgeProps, 'size'> & {\n /**\n * Represents several status\n * @default available\n */\n status?: PresenceBadgeStatus;\n\n /**\n * Modifies the display to indicate that the user is out of office.\n * This can be combined with any status to display an out-of-office version of that status\n * @default false\n */\n outOfOffice?: boolean;\n };\n\nexport type PresenceBadgeState = ComponentState<BadgeSlots> &\n BadgeState &\n Required<Pick<PresenceBadgeProps, 'status' | 'outOfOffice'>>;\n"],"names":[],"mappings":""}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/index.ts"],"sourcesContent":["export { PresenceBadge } from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\nexport { usePresenceBadge_unstable } from './usePresenceBadge';\nexport { presenceBadgeClassNames, usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nexport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceAwayRegular,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\n"],"names":["PresenceBadge","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/index.ts"],"sourcesContent":["export { PresenceBadge } from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\nexport { usePresenceBadge_unstable } from './usePresenceBadge';\nexport { presenceBadgeClassNames, usePresenceBadgeStyles_unstable } from './usePresenceBadgeStyles.styles';\nexport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceAwayRegular,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\n"],"names":["PresenceBadge","usePresenceBadge_unstable","presenceBadgeClassNames","usePresenceBadgeStyles_unstable","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular"],"mappings":";;;;;;;;;;;IAASA;2CAAa;;2BAKG;eAAvBI;;;eACAC,uCAAwB;;;eACxBC,iCAAkB;;uBACC;eAAnBC;;;eALOL,qDAAuB;;;eAM9BM,qCAAsB;;;eACtBC,iCAAkB;;;eAClBC,gCAAiB;;;eACjBC,iCAAkB;;IAClBC;oDAAsB;;;eACtBC,iCAAkB;;;eAClBC,qCAAsB;;;eAZUX,6DAA+B;;;eADxDF,2CAAyB;;;+BAFJ,kBAAkB;kCAEN,qBAAqB;8CACU,kCAAkC;+BAapG,kBAAkB"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/presenceIcons.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n PresenceAvailable10Regular,\n PresenceAvailable12Regular,\n PresenceAvailable16Regular,\n PresenceAvailable20Regular,\n PresenceAvailable10Filled,\n PresenceAvailable12Filled,\n PresenceAvailable16Filled,\n PresenceAvailable20Filled,\n PresenceAway10Regular,\n PresenceAway12Regular,\n PresenceAway16Regular,\n PresenceAway20Regular,\n PresenceAway10Filled,\n PresenceAway12Filled,\n PresenceAway16Filled,\n PresenceAway20Filled,\n PresenceBlocked10Regular,\n PresenceBlocked12Regular,\n PresenceBlocked16Regular,\n PresenceBlocked20Regular,\n PresenceBusy10Filled,\n PresenceBusy12Filled,\n PresenceBusy16Filled,\n PresenceBusy20Filled,\n PresenceDnd10Regular,\n PresenceDnd12Regular,\n PresenceDnd16Regular,\n PresenceDnd20Regular,\n PresenceDnd10Filled,\n PresenceDnd12Filled,\n PresenceDnd16Filled,\n PresenceDnd20Filled,\n PresenceOof10Regular,\n PresenceOof12Regular,\n PresenceOof16Regular,\n PresenceOof20Regular,\n PresenceOffline10Regular,\n PresenceOffline12Regular,\n PresenceOffline16Regular,\n PresenceOffline20Regular,\n PresenceUnknown10Regular,\n PresenceUnknown12Regular,\n PresenceUnknown16Regular,\n PresenceUnknown20Regular,\n} from '@fluentui/react-icons';\nimport type { PresenceBadgeState } from './PresenceBadge.types';\n\nexport const presenceAwayRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAway10Regular,\n 'extra-small': PresenceAway10Regular,\n small: PresenceAway12Regular,\n medium: PresenceAway16Regular,\n large: PresenceAway20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAway20Regular,\n};\n\nexport const presenceAwayFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAway10Filled,\n 'extra-small': PresenceAway10Filled,\n small: PresenceAway12Filled,\n medium: PresenceAway16Filled,\n large: PresenceAway20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAway20Filled,\n};\n\nexport const presenceAvailableRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAvailable10Regular,\n 'extra-small': PresenceAvailable10Regular,\n small: PresenceAvailable12Regular,\n medium: PresenceAvailable16Regular,\n large: PresenceAvailable20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAvailable20Regular,\n};\n\nexport const presenceAvailableFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAvailable10Filled,\n 'extra-small': PresenceAvailable10Filled,\n small: PresenceAvailable12Filled,\n medium: PresenceAvailable16Filled,\n large: PresenceAvailable20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAvailable20Filled,\n};\n\nexport const presenceBlockedRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceBlocked10Regular,\n 'extra-small': PresenceBlocked10Regular,\n small: PresenceBlocked12Regular,\n medium: PresenceBlocked16Regular,\n large: PresenceBlocked20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceBlocked20Regular,\n};\n\nexport const presenceBusyFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceBusy10Filled,\n 'extra-small': PresenceBusy10Filled,\n small: PresenceBusy12Filled,\n medium: PresenceBusy16Filled,\n large: PresenceBusy20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceBusy20Filled,\n};\n\nexport const presenceDndFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceDnd10Filled,\n 'extra-small': PresenceDnd10Filled,\n small: PresenceDnd12Filled,\n medium: PresenceDnd16Filled,\n large: PresenceDnd20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceDnd20Filled,\n};\n\nexport const presenceDndRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceDnd10Regular,\n 'extra-small': PresenceDnd10Regular,\n small: PresenceDnd12Regular,\n medium: PresenceDnd16Regular,\n large: PresenceDnd20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceDnd20Regular,\n};\n\nexport const presenceOofRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceOof10Regular,\n 'extra-small': PresenceOof10Regular,\n small: PresenceOof12Regular,\n medium: PresenceOof16Regular,\n large: PresenceOof20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceOof20Regular,\n};\n\nexport const presenceOfflineRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceOffline10Regular,\n 'extra-small': PresenceOffline10Regular,\n small: PresenceOffline12Regular,\n medium: PresenceOffline16Regular,\n large: PresenceOffline20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceOffline20Regular,\n};\n\nexport const presenceUnknownRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceUnknown10Regular,\n 'extra-small': PresenceUnknown10Regular,\n small: PresenceUnknown12Regular,\n medium: PresenceUnknown16Regular,\n large: PresenceUnknown20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceUnknown20Regular,\n};\n"],"names":["presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceAwayRegular","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular","tiny","PresenceAway10Regular","small","PresenceAway12Regular","medium","PresenceAway16Regular","large","PresenceAway20Regular","PresenceAway10Filled","PresenceAway12Filled","PresenceAway16Filled","PresenceAway20Filled","PresenceAvailable10Regular","PresenceAvailable12Regular","PresenceAvailable16Regular","PresenceAvailable20Regular","PresenceAvailable10Filled","PresenceAvailable12Filled","PresenceAvailable16Filled","PresenceAvailable20Filled","PresenceBlocked10Regular","PresenceBlocked12Regular","PresenceBlocked16Regular","PresenceBlocked20Regular","PresenceBusy10Filled","PresenceBusy12Filled","PresenceBusy16Filled","PresenceBusy20Filled","PresenceDnd10Filled","PresenceDnd12Filled","PresenceDnd16Filled","PresenceDnd20Filled","PresenceDnd10Regular","PresenceDnd12Regular","PresenceDnd16Regular","PresenceDnd20Regular","PresenceOof10Regular","PresenceOof12Regular","PresenceOof16Regular","PresenceOof20Regular","PresenceOffline10Regular","PresenceOffline12Regular","PresenceOffline16Regular","PresenceOffline20Regular","PresenceUnknown10Regular","PresenceUnknown12Regular","PresenceUnknown16Regular","PresenceUnknown20Regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/presenceIcons.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n PresenceAvailable10Regular,\n PresenceAvailable12Regular,\n PresenceAvailable16Regular,\n PresenceAvailable20Regular,\n PresenceAvailable10Filled,\n PresenceAvailable12Filled,\n PresenceAvailable16Filled,\n PresenceAvailable20Filled,\n PresenceAway10Regular,\n PresenceAway12Regular,\n PresenceAway16Regular,\n PresenceAway20Regular,\n PresenceAway10Filled,\n PresenceAway12Filled,\n PresenceAway16Filled,\n PresenceAway20Filled,\n PresenceBlocked10Regular,\n PresenceBlocked12Regular,\n PresenceBlocked16Regular,\n PresenceBlocked20Regular,\n PresenceBusy10Filled,\n PresenceBusy12Filled,\n PresenceBusy16Filled,\n PresenceBusy20Filled,\n PresenceDnd10Regular,\n PresenceDnd12Regular,\n PresenceDnd16Regular,\n PresenceDnd20Regular,\n PresenceDnd10Filled,\n PresenceDnd12Filled,\n PresenceDnd16Filled,\n PresenceDnd20Filled,\n PresenceOof10Regular,\n PresenceOof12Regular,\n PresenceOof16Regular,\n PresenceOof20Regular,\n PresenceOffline10Regular,\n PresenceOffline12Regular,\n PresenceOffline16Regular,\n PresenceOffline20Regular,\n PresenceUnknown10Regular,\n PresenceUnknown12Regular,\n PresenceUnknown16Regular,\n PresenceUnknown20Regular,\n} from '@fluentui/react-icons';\nimport type { PresenceBadgeState } from './PresenceBadge.types';\n\nexport const presenceAwayRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAway10Regular,\n 'extra-small': PresenceAway10Regular,\n small: PresenceAway12Regular,\n medium: PresenceAway16Regular,\n large: PresenceAway20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAway20Regular,\n};\n\nexport const presenceAwayFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAway10Filled,\n 'extra-small': PresenceAway10Filled,\n small: PresenceAway12Filled,\n medium: PresenceAway16Filled,\n large: PresenceAway20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAway20Filled,\n};\n\nexport const presenceAvailableRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAvailable10Regular,\n 'extra-small': PresenceAvailable10Regular,\n small: PresenceAvailable12Regular,\n medium: PresenceAvailable16Regular,\n large: PresenceAvailable20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAvailable20Regular,\n};\n\nexport const presenceAvailableFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceAvailable10Filled,\n 'extra-small': PresenceAvailable10Filled,\n small: PresenceAvailable12Filled,\n medium: PresenceAvailable16Filled,\n large: PresenceAvailable20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceAvailable20Filled,\n};\n\nexport const presenceBlockedRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceBlocked10Regular,\n 'extra-small': PresenceBlocked10Regular,\n small: PresenceBlocked12Regular,\n medium: PresenceBlocked16Regular,\n large: PresenceBlocked20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceBlocked20Regular,\n};\n\nexport const presenceBusyFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceBusy10Filled,\n 'extra-small': PresenceBusy10Filled,\n small: PresenceBusy12Filled,\n medium: PresenceBusy16Filled,\n large: PresenceBusy20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceBusy20Filled,\n};\n\nexport const presenceDndFilled: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceDnd10Filled,\n 'extra-small': PresenceDnd10Filled,\n small: PresenceDnd12Filled,\n medium: PresenceDnd16Filled,\n large: PresenceDnd20Filled,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceDnd20Filled,\n};\n\nexport const presenceDndRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceDnd10Regular,\n 'extra-small': PresenceDnd10Regular,\n small: PresenceDnd12Regular,\n medium: PresenceDnd16Regular,\n large: PresenceDnd20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceDnd20Regular,\n};\n\nexport const presenceOofRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceOof10Regular,\n 'extra-small': PresenceOof10Regular,\n small: PresenceOof12Regular,\n medium: PresenceOof16Regular,\n large: PresenceOof20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceOof20Regular,\n};\n\nexport const presenceOfflineRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceOffline10Regular,\n 'extra-small': PresenceOffline10Regular,\n small: PresenceOffline12Regular,\n medium: PresenceOffline16Regular,\n large: PresenceOffline20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceOffline20Regular,\n};\n\nexport const presenceUnknownRegular: Record<PresenceBadgeState['size'], React.FunctionComponent> = {\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n tiny: PresenceUnknown10Regular,\n 'extra-small': PresenceUnknown10Regular,\n small: PresenceUnknown12Regular,\n medium: PresenceUnknown16Regular,\n large: PresenceUnknown20Regular,\n // FIXME not all presence icon sizes are available\n // https://github.com/microsoft/fluentui/issues/20650\n 'extra-large': PresenceUnknown20Regular,\n};\n"],"names":["React","PresenceAvailable10Regular","PresenceAvailable12Regular","PresenceAvailable16Regular","PresenceAvailable20Regular","PresenceAvailable10Filled","PresenceAvailable12Filled","PresenceAvailable16Filled","PresenceAvailable20Filled","PresenceAway10Regular","PresenceAway12Regular","PresenceAway16Regular","PresenceAway20Regular","PresenceAway10Filled","PresenceAway12Filled","PresenceAway16Filled","PresenceAway20Filled","PresenceBlocked10Regular","PresenceBlocked12Regular","PresenceBlocked16Regular","PresenceBlocked20Regular","PresenceBusy10Filled","PresenceBusy12Filled","PresenceBusy16Filled","PresenceBusy20Filled","PresenceDnd10Regular","PresenceDnd12Regular","PresenceDnd16Regular","PresenceDnd20Regular","PresenceDnd10Filled","PresenceDnd12Filled","PresenceDnd16Filled","PresenceDnd20Filled","PresenceOof10Regular","PresenceOof12Regular","PresenceOof16Regular","PresenceOof20Regular","PresenceOffline10Regular","PresenceOffline12Regular","PresenceOffline16Regular","PresenceOffline20Regular","PresenceUnknown10Regular","PresenceUnknown12Regular","PresenceUnknown16Regular","PresenceUnknown20Regular","presenceAwayRegular","tiny","small","medium","large","presenceAwayFilled","presenceAvailableRegular","presenceAvailableFilled","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOofRegular","presenceOfflineRegular","presenceUnknownRegular"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/usePresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';\n\nconst iconMap = (status: PresenceBadgeState['status'], outOfOffice: boolean, size: PresenceBadgeState['size']) => {\n switch (status) {\n case 'available':\n return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];\n case 'away':\n return outOfOffice ? presenceOofRegular[size] : presenceAwayFilled[size];\n case 'blocked':\n return presenceBlockedRegular[size];\n case 'busy':\n return outOfOffice ? presenceUnknownRegular[size] : presenceBusyFilled[size];\n case 'do-not-disturb':\n return outOfOffice ? presenceDndRegular[size] : presenceDndFilled[size];\n case 'offline':\n return outOfOffice ? presenceOofRegular[size] : presenceOfflineRegular[size];\n case 'out-of-office':\n return presenceOofRegular[size];\n case 'unknown':\n return presenceUnknownRegular[size];\n }\n};\n\nconst DEFAULT_STRINGS = {\n busy: 'busy',\n 'out-of-office': 'out of office',\n away: 'away',\n available: 'available',\n offline: 'offline',\n 'do-not-disturb': 'do not disturb',\n unknown: 'unknown',\n blocked: 'blocked',\n};\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge_unstable = (\n props: PresenceBadgeProps,\n ref: React.Ref<HTMLElement>,\n): PresenceBadgeState => {\n const { size = 'medium', status = 'available', outOfOffice = false } = props;\n\n const statusText = DEFAULT_STRINGS[status];\n const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';\n\n const IconElement = iconMap(status, outOfOffice, size);\n\n const state: PresenceBadgeState = {\n ...useBadge_unstable(\n {\n 'aria-label': statusText + oofText,\n role: 'img',\n ...props,\n size,\n icon: slot.optional(props.icon, {\n defaultProps: {\n children: IconElement ? <IconElement /> : null,\n },\n renderByDefault: true,\n elementType: 'span',\n }),\n },\n ref,\n ),\n status,\n outOfOffice,\n };\n\n return state;\n};\n"],"names":["
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/usePresenceBadge.tsx"],"sourcesContent":["import * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport {\n presenceAvailableFilled,\n presenceAvailableRegular,\n presenceAwayFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndFilled,\n presenceDndRegular,\n presenceOfflineRegular,\n presenceOofRegular,\n presenceUnknownRegular,\n} from './presenceIcons';\nimport { useBadge_unstable } from '../Badge/index';\nimport type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';\n\nconst iconMap = (status: PresenceBadgeState['status'], outOfOffice: boolean, size: PresenceBadgeState['size']) => {\n switch (status) {\n case 'available':\n return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];\n case 'away':\n return outOfOffice ? presenceOofRegular[size] : presenceAwayFilled[size];\n case 'blocked':\n return presenceBlockedRegular[size];\n case 'busy':\n return outOfOffice ? presenceUnknownRegular[size] : presenceBusyFilled[size];\n case 'do-not-disturb':\n return outOfOffice ? presenceDndRegular[size] : presenceDndFilled[size];\n case 'offline':\n return outOfOffice ? presenceOofRegular[size] : presenceOfflineRegular[size];\n case 'out-of-office':\n return presenceOofRegular[size];\n case 'unknown':\n return presenceUnknownRegular[size];\n }\n};\n\nconst DEFAULT_STRINGS = {\n busy: 'busy',\n 'out-of-office': 'out of office',\n away: 'away',\n available: 'available',\n offline: 'offline',\n 'do-not-disturb': 'do not disturb',\n unknown: 'unknown',\n blocked: 'blocked',\n};\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge_unstable = (\n props: PresenceBadgeProps,\n ref: React.Ref<HTMLElement>,\n): PresenceBadgeState => {\n const { size = 'medium', status = 'available', outOfOffice = false } = props;\n\n const statusText = DEFAULT_STRINGS[status];\n const oofText = props.outOfOffice && props.status !== 'out-of-office' ? ` ${DEFAULT_STRINGS['out-of-office']}` : '';\n\n const IconElement = iconMap(status, outOfOffice, size);\n\n const state: PresenceBadgeState = {\n ...useBadge_unstable(\n {\n 'aria-label': statusText + oofText,\n role: 'img',\n ...props,\n size,\n icon: slot.optional(props.icon, {\n defaultProps: {\n children: IconElement ? <IconElement /> : null,\n },\n renderByDefault: true,\n elementType: 'span',\n }),\n },\n ref,\n ),\n status,\n outOfOffice,\n };\n\n return state;\n};\n"],"names":["React","slot","presenceAvailableFilled","presenceAvailableRegular","presenceAwayFilled","presenceBlockedRegular","presenceBusyFilled","presenceDndFilled","presenceDndRegular","presenceOfflineRegular","presenceOofRegular","presenceUnknownRegular","useBadge_unstable","iconMap","status","outOfOffice","size","DEFAULT_STRINGS","busy","away","available","offline","unknown","blocked","usePresenceBadge_unstable","props","ref","statusText","oofText","IconElement","state","role","icon","optional","defaultProps","children","renderByDefault","elementType"],"mappings":";;;;+BAoDawB;;;;;;;iEApDU,QAAQ;gCACV,4BAA4B;+BAY1C,kBAAkB;uBACS,iBAAiB;AAGnD,MAAMX,UAAU,CAACC,QAAsCC,aAAsBC;IAC3E,OAAQF;QACN,KAAK;YACH,OAAOC,cAAcZ,uCAAwB,CAACa,KAAK,GAAGd,sCAAuB,CAACc,KAAK;QACrF,KAAK;YACH,OAAOD,cAAcL,iCAAkB,CAACM,KAAK,GAAGZ,iCAAkB,CAACY,KAAK;QAC1E,KAAK;YACH,OAAOX,qCAAsB,CAACW,KAAK;QACrC,KAAK;YACH,OAAOD,cAAcJ,qCAAsB,CAACK,KAAK,GAAGV,iCAAkB,CAACU,KAAK;QAC9E,KAAK;YACH,OAAOD,cAAcP,iCAAkB,CAACQ,KAAK,GAAGT,gCAAiB,CAACS,KAAK;QACzE,KAAK;YACH,OAAOD,cAAcL,iCAAkB,CAACM,KAAK,GAAGP,qCAAsB,CAACO,KAAK;QAC9E,KAAK;YACH,OAAON,iCAAkB,CAACM,KAAK;QACjC,KAAK;YACH,OAAOL,qCAAsB,CAACK,KAAK;IACvC;AACF;AAEA,MAAMC,kBAAkB;IACtBC,MAAM;IACN,iBAAiB;IACjBC,MAAM;IACNC,WAAW;IACXC,SAAS;IACT,kBAAkB;IAClBC,SAAS;IACTC,SAAS;AACX;AAKO,kCAAkC,CACvCE,OACAC;IAEA,MAAM,EAAEV,OAAO,QAAQ,EAAEF,SAAS,WAAW,EAAEC,cAAc,KAAK,EAAE,GAAGU;IAEvE,MAAME,aAAaV,eAAe,CAACH,OAAO;IAC1C,MAAMc,UAAUH,MAAMV,WAAW,IAAIU,MAAMX,MAAM,KAAK,kBAAkB,CAAC,CAAC,EAAEG,eAAe,CAAC,gBAAgB,EAAE,GAAG;IAEjH,MAAMY,cAAchB,QAAQC,QAAQC,aAAaC;IAEjD,MAAMc,QAA4B;QAChC,OAAGlB,wBAAAA,EACD;YACE,cAAce,aAAaC;YAC3BG,MAAM;YACN,GAAGN,KAAK;YACRT;YACAgB,MAAM/B,oBAAAA,CAAKgC,QAAQ,CAACR,MAAMO,IAAI,EAAE;gBAC9BE,cAAc;oBACZC,UAAUN,cAAAA,WAAAA,GAAc,OAAA,aAAA,CAACA,aAAAA,QAAiB;gBAC5C;gBACAO,iBAAiB;gBACjBC,aAAa;YACf;QACF,GACAX,IACD;QACDZ;QACAC;IACF;IAEA,OAAOe;AACT,EAAE"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\n});\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3\n },\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n backgroundClip: 'unset',\n '& svg': {\n width: '6px !important',\n height: '6px !important'\n }\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important'\n }\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important'\n }\n }\n});\n/**\n * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.status === 'unknown' && styles.statusUnknown, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && (state.status === 'out-of-office' || state.status === 'away' || state.status === 'offline') && styles.statusOutOfOffice, state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"names":["
|
1
|
+
{"version":3,"sources":["usePresenceBadgeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const presenceBadgeClassNames = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon'\n};\nconst getIsBusy = (status)=>{\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n return false;\n};\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box'\n});\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px'\n});\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3\n },\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n backgroundClip: 'unset',\n '& svg': {\n width: '6px !important',\n height: '6px !important'\n }\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important'\n }\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important'\n }\n }\n});\n/**\n * Applies style classnames to slots\n */ export const usePresenceBadgeStyles_unstable = (state)=>{\n 'use no memo';\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(presenceBadgeClassNames.root, rootClassName, isBusy && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'out-of-office' && styles.statusOutOfOffice, state.status === 'unknown' && styles.statusUnknown, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && isBusy && styles.outOfOfficeBusy, state.outOfOffice && (state.status === 'out-of-office' || state.status === 'away' || state.status === 'offline') && styles.statusOutOfOffice, state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown, state.size === 'tiny' && styles.tiny, state.size === 'large' && styles.large, state.size === 'extra-large' && styles.extraLarge, state.root.className);\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n return state;\n};\n"],"names":["__resetStyles","__styles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","useIconClassName","useStyles","statusBusy","sj55zd","statusAway","statusAvailable","statusOffline","statusOutOfOffice","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","Bubjx69","a9b677","B2eet1l","B5pe6w7","p4uzdd","large","extraLarge","d","usePresenceBadgeStyles_unstable","state","rootClassName","iconClassName","styles","isBusy","className","size"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/components/PresenceBadge/usePresenceBadgeStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n\n return false;\n};\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box',\n});\n\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px',\n});\n\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3,\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3,\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n backgroundClip: 'unset', // tiny icons have a border less than 1px wide, and can't use the backgroundClip fix\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n 'use no memo';\n\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(\n presenceBadgeClassNames.root,\n rootClassName,\n isBusy && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.status === 'unknown' && styles.statusUnknown,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && isBusy && styles.outOfOfficeBusy,\n state.outOfOffice &&\n (state.status === 'out-of-office' || state.status === 'away' || state.status === 'offline') &&\n styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n\n return state;\n};\n"],"names":["
|
1
|
+
{"version":3,"sources":["../src/components/PresenceBadge/usePresenceBadgeStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { BadgeSlots } from '../Badge/Badge.types';\nimport type { PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\n\nexport const presenceBadgeClassNames: SlotClassNames<BadgeSlots> = {\n root: 'fui-PresenceBadge',\n icon: 'fui-PresenceBadge__icon',\n};\n\nconst getIsBusy = (status: PresenceBadgeStatus): boolean => {\n if (status === 'busy' || status === 'do-not-disturb' || status === 'blocked') {\n return true;\n }\n\n return false;\n};\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-flex',\n boxSizing: 'border-box',\n alignItems: 'center',\n justifyContent: 'center',\n\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorNeutralBackground1,\n\n // The background color bleeds around the edge of the icon due to antialiasing on the svg and element background.\n // Since all presence icons have a border around the edge that is at least 1px wide*, we can inset the background\n // using padding and backgroundClip. The icon has margin: -1px to account for the padding.\n // (* except size=\"tiny\", where backgroundClip is unset)\n padding: '1px',\n backgroundClip: 'content-box',\n});\n\nconst useIconClassName = makeResetStyles({\n display: 'flex',\n margin: '-1px',\n});\n\nconst useStyles = makeStyles({\n statusBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n statusAway: {\n color: tokens.colorPaletteMarigoldBackground3,\n },\n statusAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n statusOffline: {\n color: tokens.colorNeutralForeground3,\n },\n statusOutOfOffice: {\n color: tokens.colorPaletteBerryForeground3,\n },\n statusUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n outOfOffice: {\n color: tokens.colorNeutralBackground1,\n },\n outOfOfficeAvailable: {\n color: tokens.colorPaletteLightGreenForeground3,\n },\n outOfOfficeBusy: {\n color: tokens.colorPaletteRedBackground3,\n },\n outOfOfficeUnknown: {\n color: tokens.colorNeutralForeground3,\n },\n\n // Icons are not resizeable, and these sizes are currently missing\n // use `!important` to size the currently available icons to the missing ones\n //\n tiny: {\n aspectRatio: '1',\n width: '6px',\n backgroundClip: 'unset', // tiny icons have a border less than 1px wide, and can't use the backgroundClip fix\n '& svg': {\n width: '6px !important',\n height: '6px !important',\n },\n },\n large: {\n aspectRatio: '1',\n width: '20px',\n '& svg': {\n width: '20px !important',\n height: '20px !important',\n },\n },\n extraLarge: {\n aspectRatio: '1',\n width: '28px',\n '& svg': {\n width: '28px !important',\n height: '28px !important',\n },\n },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): PresenceBadgeState => {\n 'use no memo';\n\n const rootClassName = useRootClassName();\n const iconClassName = useIconClassName();\n const styles = useStyles();\n const isBusy = getIsBusy(state.status);\n state.root.className = mergeClasses(\n presenceBadgeClassNames.root,\n rootClassName,\n isBusy && styles.statusBusy,\n state.status === 'away' && styles.statusAway,\n state.status === 'available' && styles.statusAvailable,\n state.status === 'offline' && styles.statusOffline,\n state.status === 'out-of-office' && styles.statusOutOfOffice,\n state.status === 'unknown' && styles.statusUnknown,\n state.outOfOffice && styles.outOfOffice,\n state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n state.outOfOffice && isBusy && styles.outOfOfficeBusy,\n state.outOfOffice &&\n (state.status === 'out-of-office' || state.status === 'away' || state.status === 'offline') &&\n styles.statusOutOfOffice,\n state.outOfOffice && state.status === 'unknown' && styles.outOfOfficeUnknown,\n state.size === 'tiny' && styles.tiny,\n state.size === 'large' && styles.large,\n state.size === 'extra-large' && styles.extraLarge,\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(presenceBadgeClassNames.icon, iconClassName, state.icon.className);\n }\n\n return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","presenceBadgeClassNames","root","icon","getIsBusy","status","useRootClassName","display","boxSizing","alignItems","justifyContent","borderRadius","borderRadiusCircular","backgroundColor","colorNeutralBackground1","padding","backgroundClip","useIconClassName","margin","useStyles","statusBusy","color","colorPaletteRedBackground3","statusAway","colorPaletteMarigoldBackground3","statusAvailable","colorPaletteLightGreenForeground3","statusOffline","colorNeutralForeground3","statusOutOfOffice","colorPaletteBerryForeground3","statusUnknown","outOfOffice","outOfOfficeAvailable","outOfOfficeBusy","outOfOfficeUnknown","tiny","aspectRatio","width","height","large","extraLarge","usePresenceBadgeStyles_unstable","state","rootClassName","iconClassName","styles","isBusy","className","size"],"mappings":"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"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { Badge, badgeClassNames, renderBadge_unstable, useBadgeStyles_unstable, useBadge_unstable } from './Badge';\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge';\nexport {\n PresenceBadge,\n presenceBadgeClassNames,\n usePresenceBadgeStyles_unstable,\n usePresenceBadge_unstable,\n presenceAwayRegular,\n presenceAwayFilled,\n presenceAvailableRegular,\n presenceAvailableFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndRegular,\n presenceDndFilled,\n presenceOofRegular,\n presenceOfflineRegular,\n presenceUnknownRegular,\n} from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge';\nexport {\n CounterBadge,\n counterBadgeClassNames,\n useCounterBadgeStyles_unstable,\n useCounterBadge_unstable,\n} from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge';\n"],"names":["Badge","
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { Badge, badgeClassNames, renderBadge_unstable, useBadgeStyles_unstable, useBadge_unstable } from './Badge';\nexport type { BadgeProps, BadgeSlots, BadgeState } from './Badge';\nexport {\n PresenceBadge,\n presenceBadgeClassNames,\n usePresenceBadgeStyles_unstable,\n usePresenceBadge_unstable,\n presenceAwayRegular,\n presenceAwayFilled,\n presenceAvailableRegular,\n presenceAvailableFilled,\n presenceBlockedRegular,\n presenceBusyFilled,\n presenceDndRegular,\n presenceDndFilled,\n presenceOofRegular,\n presenceOfflineRegular,\n presenceUnknownRegular,\n} from './PresenceBadge';\nexport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge';\nexport {\n CounterBadge,\n counterBadgeClassNames,\n useCounterBadgeStyles_unstable,\n useCounterBadge_unstable,\n} from './CounterBadge';\nexport type { CounterBadgeProps, CounterBadgeState } from './CounterBadge';\n"],"names":["Badge","badgeClassNames","renderBadge_unstable","useBadgeStyles_unstable","useBadge_unstable","PresenceBadge","presenceBadgeClassNames","usePresenceBadgeStyles_unstable","usePresenceBadge_unstable","presenceAwayRegular","presenceAwayFilled","presenceAvailableRegular","presenceAvailableFilled","presenceBlockedRegular","presenceBusyFilled","presenceDndRegular","presenceDndFilled","presenceOofRegular","presenceOfflineRegular","presenceUnknownRegular","CounterBadge","counterBadgeClassNames","useCounterBadgeStyles_unstable","useCounterBadge_unstable"],"mappings":";;;;;;;;;;;IAASA,KAAK;;;IAqBZoB,YAAY;;;;eAlBZf,4BAAa;;;eAHCJ,sBAAe;;IAsB7BoB;mDAAsB;;IAZtBT,uBAAuB;;;;eADvBD,uCAAwB;;;eADxBD,iCAAkB;;;eADlBD,kCAAmB;;;eAHnBH,sCAAuB;;IAOvBO,sBAAsB;;;;eACtBC,iCAAkB;;;eAElBE,gCAAiB;;sBADC;eAAlBD;;;eAGAG,qCAAsB;;sBADJ;eAAlBD;;;eAEAE,qCAAsB;;;eAjBSjB,2BAAoB;;2BAAyB;eAAvBC;;;eAAyBC,wBAAiB;;;eAuB/FkB,4CAA8B;;;eAC9BC,sCAAwB;;;eAnBxBhB,8CAA+B;;;eAC/BC,wCAAyB;;;uBAN8E,UAAU;+BAkB5G,kBAAkB;8BAOlB,iBAAiB"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-badge",
|
3
|
-
"version": "9.4.
|
3
|
+
"version": "9.4.1",
|
4
4
|
"description": "React components for building web experiences",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -19,10 +19,10 @@
|
|
19
19
|
},
|
20
20
|
"dependencies": {
|
21
21
|
"@fluentui/react-icons": "^2.0.245",
|
22
|
-
"@fluentui/react-jsx-runtime": "^9.1.
|
22
|
+
"@fluentui/react-jsx-runtime": "^9.1.3",
|
23
23
|
"@fluentui/react-shared-contexts": "^9.24.0",
|
24
24
|
"@fluentui/react-theme": "^9.1.24",
|
25
|
-
"@fluentui/react-utilities": "^9.
|
25
|
+
"@fluentui/react-utilities": "^9.23.0",
|
26
26
|
"@griffel/react": "^1.5.22",
|
27
27
|
"@swc/helpers": "^0.5.1"
|
28
28
|
},
|