@fluentui/react-badge 9.0.0-alpha.80 → 9.0.0-alpha.84

package/lib/components/PresenceBadge/PresenceBadge.d.ts

@@ -2,6 +2,5 @@ import * as React from 'react';
 import type { PresenceBadgeProps } from './PresenceBadge.types';
 /**
  * Define a styled Badge, using the `useBadge` hook.
- * {@docCategory Badge}
  */
-export declare const PresenceBadge: React.ForwardRefExoticComponent<PresenceBadgeProps & React.RefAttributes<HTMLElement>>;
+export declare const PresenceBadge: React.ForwardRefExoticComponent<Pick<PresenceBadgeProps, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "as" | "icon" | "shape" | "size" | "appearance" | "iconPosition" | "outOfOffice" | "status"> & React.RefAttributes<HTMLElement>>;

package/lib/components/PresenceBadge/PresenceBadge.js

@@ -4,7 +4,6 @@ import { usePresenceBadgeStyles } from './usePresenceBadgeStyles';
 import { renderBadge } from '../../Badge';
 /**
  * Define a styled Badge, using the `useBadge` hook.
- * {@docCategory Badge}
  */
 
 export var PresenceBadge = /*#__PURE__*/React.forwardRef(function (props, ref) {

package/lib/components/PresenceBadge/PresenceBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/PresenceBadge/PresenceBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,sBAAT,QAAuC,0BAAvC;AACA,SAAS,WAAT,QAA4B,aAA5B;AAGA;;;AAGG;;AACH,OAAO,IAAM,aAAa,gBAAG,KAAK,CAAC,UAAN,CAAkD,UAAC,KAAD,EAAQ,GAAR,EAAW;AACxF,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAD,EAAQ,GAAR,CAA9B;AACA,EAAA,sBAAsB,CAAC,KAAD,CAAtB;AAEA,SAAO,WAAW,CAAC,KAAD,CAAlB;AACD,CAL4B,CAAtB;AAOP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourcesContent":["import * as React from 'react';\nimport { usePresenceBadge } from './usePresenceBadge';\nimport { usePresenceBadgeStyles } from './usePresenceBadgeStyles';\nimport { renderBadge } from '../../Badge';\nimport type { PresenceBadgeProps } from './PresenceBadge.types';\n\n/**\n * Define a styled Badge, using the `useBadge` hook.\n * {@docCategory Badge}\n */\nexport const PresenceBadge = React.forwardRef<HTMLElement, PresenceBadgeProps>((props, ref) => {\n  const state = usePresenceBadge(props, ref);\n  usePresenceBadgeStyles(state);\n\n  return renderBadge(state);\n});\n\nPresenceBadge.displayName = 'PresenceBadge';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/PresenceBadge/PresenceBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,oBAAjC;AACA,SAAS,sBAAT,QAAuC,0BAAvC;AACA,SAAS,WAAT,QAA4B,aAA5B;AAGA;;AAEG;;AACH,OAAO,IAAM,aAAa,gBAAG,KAAK,CAAC,UAAN,CAAkD,UAAC,KAAD,EAAQ,GAAR,EAAW;AACxF,MAAM,KAAK,GAAG,gBAAgB,CAAC,KAAD,EAAQ,GAAR,CAA9B;AACA,EAAA,sBAAsB,CAAC,KAAD,CAAtB;AAEA,SAAO,WAAW,CAAC,KAAD,CAAlB;AACD,CAL4B,CAAtB;AAOP,aAAa,CAAC,WAAd,GAA4B,eAA5B","sourceRoot":""}

package/lib/components/PresenceBadge/PresenceBadge.types.d.ts

@@ -1,37 +1,17 @@
 import type { BadgeProps, BadgeState } from '../Badge/index';
-/**
- * {@docCategory PresenceBadge}
- */
 export declare type PresenceBadgeStatus = 'busy' | 'outOfOffice' | 'away' | 'available' | 'offline' | 'doNotDisturb';
-/**
- * {@docCategory PresenceBadge}
- */
-export interface PresenceBadgeProps extends Omit<BadgeProps, 'shape' | 'appearance'> {
+export interface PresenceBadgeCommons {
     /**
      * Represents several status
-     * @defaultvalue available
-     */
-    status?: PresenceBadgeStatus;
-    /**
-     * Modifies the display to indicate that the user is out of office.
-     * This can be combined with any status to display an out-of-office version of that status
-     * @defaultvalue false
-     */
-    outOfOffice?: boolean;
-}
-/**
- * {@docCategory Badge}
- */
-export interface PresenceBadgeState extends Omit<BadgeState, 'shape' | 'appearance'> {
-    /**
-     * Represents several status
-     * @defaultvalue available
+     * @default available
      */
     status: PresenceBadgeStatus;
     /**
      * Modifies the display to indicate that the user is out of office.
      * This can be combined with any status to display an out-of-office version of that status
-     * @defaultvalue false
+     * @default false
      */
     outOfOffice: boolean;
 }
+export declare type PresenceBadgeProps = BadgeProps & Partial<PresenceBadgeCommons>;
+export declare type PresenceBadgeState = BadgeState & PresenceBadgeCommons;

package/lib/components/PresenceBadge/PresenceBadge.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"PresenceBadge.types.js","sourceRoot":"../src/","sources":["components/PresenceBadge/PresenceBadge.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { BadgeProps, BadgeState } from '../Badge/index';\n\n/**\n * {@docCategory PresenceBadge}\n */\nexport type PresenceBadgeStatus = 'busy' | 'outOfOffice' | 'away' | 'available' | 'offline' | 'doNotDisturb';\n\n/**\n * {@docCategory PresenceBadge}\n */\nexport interface PresenceBadgeProps extends Omit<BadgeProps, 'shape' | 'appearance'> {\n  /**\n   * Represents several status\n   * @defaultvalue available\n   */\n  status?: PresenceBadgeStatus;\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   * @defaultvalue false\n   */\n  outOfOffice?: boolean;\n}\n\n/**\n * {@docCategory Badge}\n */\nexport interface PresenceBadgeState extends Omit<BadgeState, 'shape' | 'appearance'> {\n  /**\n   * Represents several status\n   * @defaultvalue available\n   */\n  status: PresenceBadgeStatus;\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   * @defaultvalue false\n   */\n  outOfOffice: boolean;\n}\n"]}
+{"version":3,"file":"PresenceBadge.types.js","sourceRoot":"","sources":["../../../src/components/PresenceBadge/PresenceBadge.types.ts"],"names":[],"mappings":""}

package/lib/components/PresenceBadge/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/PresenceBadge/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC","sourcesContent":["export * from './PresenceBadge';\nexport * from './PresenceBadge.types';\nexport * from './usePresenceBadge';\nexport * from './usePresenceBadgeStyles';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/PresenceBadge/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC"}

package/lib/components/PresenceBadge/usePresenceBadge.d.ts

@@ -1,10 +1,6 @@
 import * as React from 'react';
 import type { PresenceBadgeProps, PresenceBadgeState } from './PresenceBadge.types';
-/**
- * Consts listing which props are shorthand props.
- */
-export declare const presenceBadgeShorthandPropsCompat: (keyof PresenceBadgeProps)[];
 /**
  * Returns the props and state required to render the component
  */
-export declare const usePresenceBadge: (props: PresenceBadgeProps, ref: React.Ref<HTMLElement>, defaultProps?: PresenceBadgeProps | undefined) => PresenceBadgeState;
+export declare const usePresenceBadge: (props: PresenceBadgeProps, ref: React.Ref<HTMLElement>) => PresenceBadgeState;

package/lib/components/PresenceBadge/usePresenceBadge.js

@@ -1,16 +1,8 @@
+import { __assign } from "tslib";
 import * as React from 'react';
-import { makeMergePropsCompat } from '@fluentui/react-utilities';
+import { resolveShorthand } from '@fluentui/react-utilities';
 import { useBadge } from '../Badge/index';
 import { SkypeMinusIcon, SkypeClockIcon, SkypeArrowIcon, SkypeCheckIcon, CancelIcon } from './DefaultPresenceBadgeIcons';
-/**
- * Consts listing which props are shorthand props.
- */
-
-export var presenceBadgeShorthandPropsCompat = ['icon']; // eslint-disable-next-line deprecation/deprecation
-
-var mergeProps = /*#__PURE__*/makeMergePropsCompat({
-  deepMerge: presenceBadgeShorthandPropsCompat
-});
 
 var iconMap = function (outOfOffice) {
   return {
@@ -27,19 +19,21 @@ var iconMap = function (outOfOffice) {
  */
 
 
-export var usePresenceBadge = function (props, ref, defaultProps) {
-  var _a;
+export var usePresenceBadge = function (props, ref) {
+  var _a, _b, _c;
 
-  var state = useBadge(props, ref, mergeProps({
-    size: 'small',
-    status: 'available',
-    outOfOffice: false,
-    icon: {
-      as: 'span'
-    }
-  }, defaultProps));
+  var state = __assign(__assign({}, useBadge(__assign(__assign({
+    size: 'small'
+  }, props), {
+    icon: resolveShorthand(props.icon, {
+      required: true
+    })
+  }), ref)), {
+    status: (_a = props.status) !== null && _a !== void 0 ? _a : 'available',
+    outOfOffice: (_b = props.outOfOffice) !== null && _b !== void 0 ? _b : false
+  });
 
-  if (!((_a = state.icon) === null || _a === void 0 ? void 0 : _a.children)) {
+  if (!((_c = state.icon) === null || _c === void 0 ? void 0 : _c.children)) {
     state.icon.children = iconMap(state.outOfOffice)[state.status];
   }
 

package/lib/components/PresenceBadge/usePresenceBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/PresenceBadge/usePresenceBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,2BAArC;AACA,SAAS,QAAT,QAAyB,gBAAzB;AACA,SACE,cADF,EAEE,cAFF,EAGE,cAHF,EAIE,cAJF,EAKE,UALF,QAMO,6BANP;AAUA;;AAEG;;AACH,OAAO,IAAM,iCAAiC,GAAiC,CAAC,MAAD,CAAxE,C,CAEP;;AACA,IAAM,UAAU,gBAAG,oBAAoB,CAAqB;AAAE,EAAA,SAAS,EAAE;AAAb,CAArB,CAAvC;;AAEA,IAAM,OAAO,GAA8E,UAAA,WAAA,EAAW;AAAI,SAAC;AACzG,IAAA,IAAI,EAAE,IADmG;AAEzG,IAAA,SAAS,EAAE,WAAW,gBAAG,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAAH,gBAAwB,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAF2D;AAGzG,IAAA,IAAI,EAAE,WAAW,gBAAG,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAAH,gBAAwB,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAHgE;AAIzG,IAAA,OAAO,eAAE,KAAA,CAAA,aAAA,CAAC,UAAD,EAAW,IAAX,CAJgG;AAKzG,IAAA,WAAW,eAAE,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAL4F;AAMzG,IAAA,YAAY,eAAE,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf;AAN2F,GAAD;AAOxG,CAPF;AASA;;AAEG;;;AACH,OAAO,IAAM,gBAAgB,GAAG,UAC9B,KAD8B,EAE9B,GAF8B,EAG9B,YAH8B,EAGG;;;AAEjC,MAAM,KAAK,GAAG,QAAQ,CACpB,KADoB,EAEpB,GAFoB,EAGpB,UAAU,CACR;AACE,IAAA,IAAI,EAAE,OADR;AAEE,IAAA,MAAM,EAAE,WAFV;AAGE,IAAA,WAAW,EAAE,KAHf;AAIE,IAAA,IAAI,EAAE;AAAE,MAAA,EAAE,EAAE;AAAN;AAJR,GADQ,EAOR,YAPQ,CAHU,CAAtB;;AAcA,MAAI,EAAA,CAAA,EAAA,GAAC,KAAK,CAAC,IAAP,MAAW,IAAX,IAAW,EAAA,KAAA,KAAA,CAAX,GAAW,KAAA,CAAX,GAAW,EAAA,CAAE,QAAb,CAAJ,EAA2B;AACzB,IAAA,KAAK,CAAC,IAAN,CAAY,QAAZ,GAAuB,OAAO,CAAC,KAAK,CAAC,WAAP,CAAP,CAA2B,KAAK,CAAC,MAAjC,CAAvB;AACD;;AAED,SAAO,KAAP;AACD,CAxBM","sourcesContent":["import * as React from 'react';\nimport { makeMergePropsCompat } from '@fluentui/react-utilities';\nimport { useBadge } from '../Badge/index';\nimport {\n  SkypeMinusIcon,\n  SkypeClockIcon,\n  SkypeArrowIcon,\n  SkypeCheckIcon,\n  CancelIcon,\n} from './DefaultPresenceBadgeIcons';\nimport type { PresenceBadgeProps, PresenceBadgeState, PresenceBadgeStatus } from './PresenceBadge.types';\nimport type { BadgeProps } from '../Badge/index';\n\n/**\n * Consts listing which props are shorthand props.\n */\nexport const presenceBadgeShorthandPropsCompat: (keyof PresenceBadgeProps)[] = ['icon'];\n\n// eslint-disable-next-line deprecation/deprecation\nconst mergeProps = makeMergePropsCompat<PresenceBadgeState>({ deepMerge: presenceBadgeShorthandPropsCompat });\n\nconst iconMap: (outOfOffice: boolean) => Record<PresenceBadgeStatus, JSX.Element | null> = outOfOffice => ({\n  busy: null,\n  available: outOfOffice ? <SkypeArrowIcon /> : <SkypeCheckIcon />,\n  away: outOfOffice ? <SkypeArrowIcon /> : <SkypeClockIcon />,\n  offline: <CancelIcon />,\n  outOfOffice: <SkypeArrowIcon />,\n  doNotDisturb: <SkypeMinusIcon />,\n});\n\n/**\n * Returns the props and state required to render the component\n */\nexport const usePresenceBadge = (\n  props: PresenceBadgeProps,\n  ref: React.Ref<HTMLElement>,\n  defaultProps?: PresenceBadgeProps,\n): PresenceBadgeState => {\n  const state = useBadge(\n    props,\n    ref,\n    mergeProps(\n      {\n        size: 'small',\n        status: 'available',\n        outOfOffice: false,\n        icon: { as: 'span' },\n      },\n      defaultProps,\n    ) as BadgeProps,\n  ) as PresenceBadgeState;\n\n  if (!state.icon?.children) {\n    state.icon!.children = iconMap(state.outOfOffice)[state.status];\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/PresenceBadge/usePresenceBadge.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,gBAAT,QAAiC,2BAAjC;AACA,SAAS,QAAT,QAAyB,gBAAzB;AACA,SACE,cADF,EAEE,cAFF,EAGE,cAHF,EAIE,cAJF,EAKE,UALF,QAMO,6BANP;;AASA,IAAM,OAAO,GAA8E,UAAA,WAAA,EAAW;AAAI,SAAC;AACzG,IAAA,IAAI,EAAE,IADmG;AAEzG,IAAA,SAAS,EAAE,WAAW,gBAAG,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAAH,gBAAwB,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAF2D;AAGzG,IAAA,IAAI,EAAE,WAAW,gBAAG,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAAH,gBAAwB,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAHgE;AAIzG,IAAA,OAAO,eAAE,KAAA,CAAA,aAAA,CAAC,UAAD,EAAW,IAAX,CAJgG;AAKzG,IAAA,WAAW,eAAE,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf,CAL4F;AAMzG,IAAA,YAAY,eAAE,KAAA,CAAA,aAAA,CAAC,cAAD,EAAe,IAAf;AAN2F,GAAD;AAOxG,CAPF;AASA;;AAEG;;;AACH,OAAO,IAAM,gBAAgB,GAAG,UAAC,KAAD,EAA4B,GAA5B,EAAuD;;;AACrF,MAAM,KAAK,GAAA,QAAA,CAAA,QAAA,CAAA,EAAA,EACN,QAAQ,CAAA,QAAA,CAAA,QAAA,CAAA;AAEP,IAAA,IAAI,EAAE;AAFC,GAAA,EAGJ,KAHI,CAAA,EAGC;AACR,IAAA,IAAI,EAAE,gBAAgB,CAAC,KAAK,CAAC,IAAP,EAAa;AACjC,MAAA,QAAQ,EAAE;AADuB,KAAb;AADd,GAHD,CAAA,EAQT,GARS,CADF,CAAA,EAUR;AACD,IAAA,MAAM,EAAA,CAAA,EAAA,GAAE,KAAK,CAAC,MAAR,MAAc,IAAd,IAAc,EAAA,KAAA,KAAA,CAAd,GAAc,EAAd,GAAkB,WADvB;AAED,IAAA,WAAW,EAAA,CAAA,EAAA,GAAE,KAAK,CAAC,WAAR,MAAmB,IAAnB,IAAmB,EAAA,KAAA,KAAA,CAAnB,GAAmB,EAAnB,GAAuB;AAFjC,GAVQ,CAAX;;AAeA,MAAI,EAAA,CAAA,EAAA,GAAC,KAAK,CAAC,IAAP,MAAW,IAAX,IAAW,EAAA,KAAA,KAAA,CAAX,GAAW,KAAA,CAAX,GAAW,EAAA,CAAE,QAAb,CAAJ,EAA2B;AACzB,IAAA,KAAK,CAAC,IAAN,CAAY,QAAZ,GAAuB,OAAO,CAAC,KAAK,CAAC,WAAP,CAAP,CAA2B,KAAK,CAAC,MAAjC,CAAvB;AACD;;AAED,SAAO,KAAP;AACD,CArBM","sourceRoot":""}

package/lib/components/PresenceBadge/usePresenceBadgeStyles.js

@@ -77,7 +77,7 @@ var useStyles = /*#__PURE__*/__styles({
 
 export var usePresenceBadgeStyles = function (state) {
   var styles = useStyles();
-  state.className = mergeClasses(styles.root, (state.status === 'busy' || state.status === 'doNotDisturb') && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'outOfOffice' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && (state.status === 'busy' || state.status === 'doNotDisturb') && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway, (state.size === 'smallest' || state.size === 'smaller') && styles.thinBorder, state.className);
+  state.root.className = mergeClasses(styles.root, (state.status === 'busy' || state.status === 'doNotDisturb') && styles.statusBusy, state.status === 'away' && styles.statusAway, state.status === 'available' && styles.statusAvailable, state.status === 'offline' && styles.statusOffline, state.status === 'outOfOffice' && styles.statusOutOfOffice, state.outOfOffice && styles.outOfOffice, state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable, state.outOfOffice && (state.status === 'busy' || state.status === 'doNotDisturb') && styles.outOfOfficeBusy, state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway, (state.size === 'smallest' || state.size === 'smaller') && styles.thinBorder, state.root.className);
   return useBadgeStyles(state);
 };
 //# sourceMappingURL=usePresenceBadgeStyles.js.map

package/lib/components/PresenceBadge/usePresenceBadgeStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/PresenceBadge/usePresenceBadgeStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,kBAAyC,6BAAzC;AACA,SAAS,cAAT,QAA+B,aAA/B;;AAGA,IAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AA4CA;;AAEG;;;AACH,OAAO,IAAM,sBAAsB,GAAG,UAAC,KAAD,EAA0B;AAC9D,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,SAAN,GAAkB,YAAY,CAC5B,MAAM,CAAC,IADqB,EAE5B,CAAC,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAA7C,KAAgE,MAAM,CAAC,UAF3C,EAG5B,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,MAAM,CAAC,UAHN,EAI5B,KAAK,CAAC,MAAN,KAAiB,WAAjB,IAAgC,MAAM,CAAC,eAJX,EAK5B,KAAK,CAAC,MAAN,KAAiB,SAAjB,IAA8B,MAAM,CAAC,aALT,EAM5B,KAAK,CAAC,MAAN,KAAiB,aAAjB,IAAkC,MAAM,CAAC,iBANb,EAO5B,KAAK,CAAC,WAAN,IAAqB,MAAM,CAAC,WAPA,EAQ5B,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,WAAtC,IAAqD,MAAM,CAAC,oBARhC,EAS5B,KAAK,CAAC,WAAN,KAAsB,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAAlE,KAAqF,MAAM,CAAC,eAThE,EAU5B,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,MAAtC,IAAgD,MAAM,CAAC,eAV3B,EAW5B,CAAC,KAAK,CAAC,IAAN,KAAe,UAAf,IAA6B,KAAK,CAAC,IAAN,KAAe,SAA7C,KAA2D,MAAM,CAAC,UAXtC,EAY5B,KAAK,CAAC,SAZsB,CAA9B;AAeA,SAAO,cAAc,CAAC,KAAD,CAArB;AACD,CAlBM","sourcesContent":["import { mergeClasses, makeStyles } from '@fluentui/react-make-styles';\nimport { useBadgeStyles } from '../../Badge';\nimport type { PresenceBadgeState } from './PresenceBadge.types';\n\nconst useStyles = makeStyles({\n  root: theme => ({\n    padding: 0,\n    borderWidth: theme.global.strokeWidth.thick,\n  }),\n  thinBorder: theme => ({\n    borderWidth: theme.global.strokeWidth.thin,\n  }),\n  statusBusy: theme => ({\n    backgroundColor: theme.alias.color.red.background3,\n    borderColor: theme.alias.color.red.background3,\n  }),\n  statusAway: theme => ({\n    backgroundColor: theme.alias.color.marigold.background3,\n    borderColor: theme.alias.color.marigold.background3,\n  }),\n  statusAvailable: theme => ({\n    backgroundColor: theme.alias.color.lightGreen.foreground3,\n    borderColor: theme.alias.color.lightGreen.foreground3,\n  }),\n  statusOffline: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground1,\n    color: theme.alias.color.neutral.neutralForeground3,\n    borderColor: theme.alias.color.neutral.neutralForeground3,\n  }),\n  statusOutOfOffice: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground1,\n    color: theme.alias.color.berry.foreground3,\n    borderColor: theme.alias.color.berry.foreground3,\n  }),\n  outOfOffice: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground1,\n  }),\n  outOfOfficeAvailable: theme => ({\n    color: theme.alias.color.lightGreen.foreground3,\n  }),\n  outOfOfficeBusy: theme => ({\n    color: theme.alias.color.red.background3,\n  }),\n  outOfOfficeAway: theme => ({\n    color: theme.alias.color.marigold.background3,\n  }),\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const usePresenceBadgeStyles = (state: PresenceBadgeState): PresenceBadgeState => {\n  const styles = useStyles();\n  state.className = mergeClasses(\n    styles.root,\n    (state.status === 'busy' || state.status === 'doNotDisturb') && styles.statusBusy,\n    state.status === 'away' && styles.statusAway,\n    state.status === 'available' && styles.statusAvailable,\n    state.status === 'offline' && styles.statusOffline,\n    state.status === 'outOfOffice' && styles.statusOutOfOffice,\n    state.outOfOffice && styles.outOfOffice,\n    state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,\n    state.outOfOffice && (state.status === 'busy' || state.status === 'doNotDisturb') && styles.outOfOfficeBusy,\n    state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway,\n    (state.size === 'smallest' || state.size === 'smaller') && styles.thinBorder,\n    state.className,\n  );\n\n  return useBadgeStyles(state) as PresenceBadgeState;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/PresenceBadge/usePresenceBadgeStyles.ts"],"names":[],"mappings":"AAAA,SAAS,YAAT,kBAAyC,6BAAzC;AACA,SAAS,cAAT,QAA+B,aAA/B;;AAGA,IAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AA4CA;;AAEG;;;AACH,OAAO,IAAM,sBAAsB,GAAG,UAAC,KAAD,EAA0B;AAC9D,MAAM,MAAM,GAAG,SAAS,EAAxB;AACA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,MAAM,CAAC,IAD0B,EAEjC,CAAC,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAA7C,KAAgE,MAAM,CAAC,UAFtC,EAGjC,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,MAAM,CAAC,UAHD,EAIjC,KAAK,CAAC,MAAN,KAAiB,WAAjB,IAAgC,MAAM,CAAC,eAJN,EAKjC,KAAK,CAAC,MAAN,KAAiB,SAAjB,IAA8B,MAAM,CAAC,aALJ,EAMjC,KAAK,CAAC,MAAN,KAAiB,aAAjB,IAAkC,MAAM,CAAC,iBANR,EAOjC,KAAK,CAAC,WAAN,IAAqB,MAAM,CAAC,WAPK,EAQjC,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,WAAtC,IAAqD,MAAM,CAAC,oBAR3B,EASjC,KAAK,CAAC,WAAN,KAAsB,KAAK,CAAC,MAAN,KAAiB,MAAjB,IAA2B,KAAK,CAAC,MAAN,KAAiB,cAAlE,KAAqF,MAAM,CAAC,eAT3D,EAUjC,KAAK,CAAC,WAAN,IAAqB,KAAK,CAAC,MAAN,KAAiB,MAAtC,IAAgD,MAAM,CAAC,eAVtB,EAWjC,CAAC,KAAK,CAAC,IAAN,KAAe,UAAf,IAA6B,KAAK,CAAC,IAAN,KAAe,SAA7C,KAA2D,MAAM,CAAC,UAXjC,EAYjC,KAAK,CAAC,IAAN,CAAW,SAZsB,CAAnC;AAeA,SAAO,cAAc,CAAC,KAAD,CAArB;AACD,CAlBM","sourceRoot":""}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iCAAiC,CAAC;AAChD,cAAc,gBAAgB,CAAC","sourcesContent":["export * from './components/Badge/index';\nexport * from './Badge';\nexport * from './PresenceBadge';\nexport * from './components/CounterBadge/index';\nexport * from './CounterBadge';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iCAAiC,CAAC;AAChD,cAAc,gBAAgB,CAAC"}

package/lib-commonjs/Badge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Badge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,0BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Badge/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../src/Badge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,0BAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/lib-commonjs/CounterBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CounterBadge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/CounterBadge/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../src/CounterBadge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iCAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/lib-commonjs/PresenceBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PresenceBadge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/PresenceBadge/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../src/PresenceBadge.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kCAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/lib-commonjs/common/isConformant.js

@@ -13,6 +13,8 @@ function isConformant(testInfo) {
   var defaultOptions = {
     asPropHandlesRef: true,
     componentPath: module.parent.filename.replace('.test', ''),
+    // https://github.com/microsoft/fluentui/issues/19522
+    skipAsPropTests: true,
     extraTests: react_conformance_make_styles_1.default
   };
   react_conformance_1.isConformant(defaultOptions, testInfo);

package/lib-commonjs/common/isConformant.js.map

@@ -1 +1 @@
-{"version":3,"sources":["common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAGA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,UAAU,EAAE,+BAAA,CAAA;AAH+C,GAA7D;AAMA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAVD,OAAA,CAAA,YAAA,GAAA,YAAA","sourcesContent":["import { isConformant as baseIsConformant } from '@fluentui/react-conformance';\nimport makeStylesTests from '@fluentui/react-conformance-make-styles';\nimport type { IsConformantOptions, TestObject } from '@fluentui/react-conformance';\n\nexport function isConformant<TProps = {}>(\n  testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & { componentPath?: string },\n) {\n  const defaultOptions: Partial<IsConformantOptions<TProps>> = {\n    asPropHandlesRef: true,\n    componentPath: module!.parent!.filename.replace('.test', ''),\n    extraTests: makeStylesTests as TestObject<TProps>,\n  };\n\n  baseIsConformant(defaultOptions, testInfo);\n}\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AACA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAGA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D;AACA,IAAA,eAAe,EAAE,IAJ0C;AAK3D,IAAA,UAAU,EAAE,+BAAA,CAAA;AAL+C,GAA7D;AAQA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAZD,OAAA,CAAA,YAAA,GAAA,YAAA","sourceRoot":""}

package/lib-commonjs/components/Badge/Badge.d.ts

@@ -2,6 +2,5 @@ import * as React from 'react';
 import type { BadgeProps } from './Badge.types';
 /**
  * Define a styled Badge, using the `useBadge` hook.
- * {@docCategory Badge}
  */
-export declare const Badge: React.FunctionComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
+export declare const Badge: React.ForwardRefExoticComponent<Pick<BadgeProps, "slot" | "style" | "title" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "as" | "icon" | "shape" | "size" | "appearance" | "iconPosition"> & React.RefAttributes<HTMLDivElement>>;

package/lib-commonjs/components/Badge/Badge.js

@@ -14,7 +14,6 @@ var useBadgeStyles_1 = /*#__PURE__*/require("./useBadgeStyles");
 var renderBadge_1 = /*#__PURE__*/require("./renderBadge");
 /**
  * Define a styled Badge, using the `useBadge` hook.
- * {@docCategory Badge}
  */
 
 

package/lib-commonjs/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/Badge/Badge.tsx"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AACA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,IAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AAGA;;;AAGG;;;AACU,OAAA,CAAA,KAAA,gBAAgF,KAAK,CAAC,UAAN,CAG3F,UAAC,KAAD,EAAQ,GAAR,EAAW;AACX,MAAM,KAAK,GAAG,UAAA,CAAA,QAAA,CAAS,KAAT,EAAgB,GAAhB,CAAd;AACA,EAAA,gBAAA,CAAA,cAAA,CAAe,KAAf;AAEA,SAAO,aAAA,CAAA,WAAA,CAAY,KAAZ,CAAP;AACD,CAR4F,CAAhF;AAUb,OAAA,CAAA,KAAA,CAAM,WAAN,GAAoB,OAApB","sourcesContent":["import * as React from 'react';\nimport { useBadge } from './useBadge';\nimport { useBadgeStyles } from './useBadgeStyles';\nimport { renderBadge } from './renderBadge';\nimport type { BadgeProps } from './Badge.types';\n\n/**\n * Define a styled Badge, using the `useBadge` hook.\n * {@docCategory Badge}\n */\nexport const Badge: React.FunctionComponent<BadgeProps & React.RefAttributes<HTMLElement>> = React.forwardRef<\n  HTMLElement,\n  BadgeProps\n>((props, ref) => {\n  const state = useBadge(props, ref);\n  useBadgeStyles(state);\n\n  return renderBadge(state);\n});\n\nBadge.displayName = 'Badge';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AACA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,IAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,KAAA,gBAAQ,KAAK,CAAC,UAAN,CAA6C,UAAC,KAAD,EAAQ,GAAR,EAAW;AAC3E,MAAM,KAAK,GAAG,UAAA,CAAA,QAAA,CAAS,KAAT,EAAgB,GAAhB,CAAd;AACA,EAAA,gBAAA,CAAA,cAAA,CAAe,KAAf;AAEA,SAAO,aAAA,CAAA,WAAA,CAAY,KAAZ,CAAP;AACD,CALoB,CAAR;AAOb,OAAA,CAAA,KAAA,CAAM,WAAN,GAAoB,OAApB","sourceRoot":""}

package/lib-commonjs/components/Badge/Badge.types.d.ts

@@ -1,65 +1,38 @@
-import * as React from 'react';
-import type { ComponentPropsCompat, ShorthandPropsCompat, ObjectShorthandPropsCompat } from '@fluentui/react-utilities';
-/**
- * {@docCategory Badge}
- */
+import type { IntrinsicShorthandProps, ComponentProps, ComponentState } from '@fluentui/react-utilities';
 export declare type BadgeSize = 'smallest' | 'smaller' | 'small' | 'medium' | 'large' | 'larger' | 'largest';
-/**
- * {@docCategory Badge}
- */
 export declare type BadgeAppearance = 'filled' | 'outline' | 'ghost' | 'tint';
-/**
- * {@docCategory Badge}
- */
 export declare type BadgeShape = 'rounded' | 'square' | 'circular';
-/**
- * {@docCategory Badge}
- */
 export declare type BadgeColors = 'brand' | 'danger' | 'severe' | 'warning' | 'success' | 'important' | 'informative' | 'subtle';
-/**
- * {@docCategory Badge}
- */
-export interface BadgeProps extends ComponentPropsCompat, React.HTMLAttributes<HTMLElement> {
+export declare type BadgeSlots = {
+    root: Omit<IntrinsicShorthandProps<'div'>, 'color'>;
+    icon?: IntrinsicShorthandProps<'span'>;
+};
+export declare type BadgeCommons = {
     /**
      * A Badge can be sized.
-     * @defaultvalue medium
+     * @default medium
      */
-    size?: BadgeSize;
+    size: BadgeSize;
     /**
      * A Badge can be square, circular or rounded
-     * @defaultvalue circular
+     * @default circular
      */
-    shape?: BadgeShape;
+    shape: BadgeShape;
     /**
      * A Badge can be filled, outline, ghost, inverted
-     * @defaultvalue filled
+     * @default filled
      */
-    appearance?: BadgeAppearance;
+    appearance: BadgeAppearance;
     /**
      * A Badge has a preset of colors
-     * @defaultvalue filled
+     * @default brand
      */
-    color?: BadgeColors;
-    /**
-     * Icon slot
-     */
-    icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
+    color: BadgeColors;
     /**
      * Position for Icon to be rendered
-     * @defaultvalue before
-     */
-    iconPosition?: 'before' | 'after';
-}
-/**
- * {@docCategory Badge}
- */
-export interface BadgeState extends BadgeProps {
-    /**
-     * Ref to the root slot
-     */
-    ref: React.RefObject<HTMLElement>;
-    /**
-     * Icon slot when processed by internal state
+     * @default before
      */
-    icon?: ObjectShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;
-}
+    iconPosition: 'before' | 'after';
+};
+export declare type BadgeProps = ComponentProps<Partial<BadgeSlots>> & Partial<BadgeCommons>;
+export declare type BadgeState = ComponentState<BadgeSlots> & BadgeCommons;

package/lib-commonjs/components/Badge/Badge.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
+{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}

package/lib-commonjs/components/Badge/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/Badge/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Badge';\nexport * from './Badge.types';\nexport * from './renderBadge';\nexport * from './useBadge';\nexport * from './useBadgeStyles';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/Badge/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourceRoot":""}

package/lib-commonjs/components/Badge/renderBadge.js

@@ -11,14 +11,12 @@ var React = /*#__PURE__*/require("react");
 
 var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 
-var useBadge_1 = /*#__PURE__*/require("./useBadge");
-
 var renderBadge = function (state) {
-  var _a = react_utilities_1.getSlotsCompat(state, useBadge_1.badgeShorthandPropsCompat),
+  var _a = react_utilities_1.getSlots(state, ['icon', 'root']),
       slots = _a.slots,
       slotProps = _a.slotProps;
 
-  return React.createElement(slots.root, tslib_1.__assign({}, slotProps.root), state.iconPosition === 'before' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)), state.children, state.iconPosition === 'after' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)));
+  return React.createElement(slots.root, tslib_1.__assign({}, slotProps.root), state.iconPosition === 'before' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)), state.root.children, state.iconPosition === 'after' && React.createElement(slots.icon, tslib_1.__assign({}, slotProps.icon)));
 };
 
 exports.renderBadge = renderBadge;

package/lib-commonjs/components/Badge/renderBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/Badge/renderBadge.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,IAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AAGO,IAAM,WAAW,GAAG,UAAC,KAAD,EAAkB;AACrC,MAAA,EAAA,GAAuB,iBAAA,CAAA,cAAA,CAAe,KAAf,EAAsB,UAAA,CAAA,yBAAtB,CAAvB;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,KAAK,CAAC,YAAN,KAAuB,QAAvB,IAAmC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CADtC,EAEG,KAAK,CAAC,QAFT,EAGG,KAAK,CAAC,YAAN,KAAuB,OAAvB,IAAkC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAHrC,CADF;AAOD,CAVM;;AAAM,OAAA,CAAA,WAAA,GAAW,WAAX","sourcesContent":["import * as React from 'react';\nimport { getSlotsCompat } from '@fluentui/react-utilities';\nimport { badgeShorthandPropsCompat } from './useBadge';\nimport type { BadgeState } from './Badge.types';\n\nexport const renderBadge = (state: BadgeState) => {\n  const { slots, slotProps } = getSlotsCompat(state, badgeShorthandPropsCompat);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {state.iconPosition === 'before' && <slots.icon {...slotProps.icon} />}\n      {state.children}\n      {state.iconPosition === 'after' && <slots.icon {...slotProps.icon} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/Badge/renderBadge.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAGO,IAAM,WAAW,GAAG,UAAC,KAAD,EAAkB;AACrC,MAAA,EAAA,GAAuB,iBAAA,CAAA,QAAA,CAAqB,KAArB,EAA4B,CAAC,MAAD,EAAS,MAAT,CAA5B,CAAvB;AAAA,MAAE,KAAK,GAAA,EAAA,CAAA,KAAP;AAAA,MAAS,SAAS,GAAA,EAAA,CAAA,SAAlB;;AAEN,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,EACG,KAAK,CAAC,YAAN,KAAuB,QAAvB,IAAmC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CADtC,EAEG,KAAK,CAAC,IAAN,CAAW,QAFd,EAGG,KAAK,CAAC,YAAN,KAAuB,OAAvB,IAAkC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,OAAA,CAAA,QAAA,CAAA,EAAA,EAAK,SAAS,CAAC,IAAf,CAAX,CAHrC,CADF;AAOD,CAVM;;AAAM,OAAA,CAAA,WAAA,GAAW,WAAX","sourceRoot":""}

package/lib-commonjs/components/Badge/useBadge.d.ts

@@ -1,10 +1,6 @@
 import * as React from 'react';
 import type { BadgeProps, BadgeState } from './Badge.types';
-/**
- * Consts listing which props are shorthand props.
- */
-export declare const badgeShorthandPropsCompat: readonly ["icon"];
 /**
  * Returns the props and state required to render the component
  */
-export declare const useBadge: (props: BadgeProps, ref: React.Ref<HTMLElement>, defaultProps?: BadgeProps | undefined) => BadgeState;
+export declare const useBadge: (props: BadgeProps, ref: React.Ref<HTMLElement>) => BadgeState;

package/lib-commonjs/components/Badge/useBadge.js

@@ -3,32 +3,43 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useBadge = exports.badgeShorthandPropsCompat = void 0;
+exports.useBadge = void 0;
 
-var React = /*#__PURE__*/require("react");
+var tslib_1 = /*#__PURE__*/require("tslib");
 
 var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
-/**
- * Consts listing which props are shorthand props.
- */
-
-
-exports.badgeShorthandPropsCompat = ['icon'];
-var mergeProps = /*#__PURE__*/react_utilities_1.makeMergeProps({
-  deepMerge: exports.badgeShorthandPropsCompat
-});
 /**
  * Returns the props and state required to render the component
  */
 
-var useBadge = function (props, ref, defaultProps) {
-  var state = mergeProps({
-    ref: react_utilities_1.useMergedRefs(ref, React.useRef(null)),
-    shape: 'circular',
-    size: 'medium',
-    iconPosition: 'before',
-    'aria-hidden': true
-  }, defaultProps && react_utilities_1.resolveShorthandProps(defaultProps, exports.badgeShorthandPropsCompat), react_utilities_1.resolveShorthandProps(props, exports.badgeShorthandPropsCompat));
+
+var useBadge = function (props, ref) {
+  var _a = props.shape,
+      shape = _a === void 0 ? 'circular' : _a,
+      _b = props.size,
+      size = _b === void 0 ? 'medium' : _b,
+      _c = props.iconPosition,
+      iconPosition = _c === void 0 ? 'before' : _c,
+      _d = props.appearance,
+      appearance = _d === void 0 ? 'filled' : _d,
+      _e = props.color,
+      color = _e === void 0 ? 'brand' : _e;
+  var state = {
+    shape: shape,
+    size: size,
+    iconPosition: iconPosition,
+    appearance: appearance,
+    color: color,
+    components: {
+      root: 'div',
+      icon: 'span'
+    },
+    root: react_utilities_1.getNativeElementProps('div', tslib_1.__assign({
+      ref: ref,
+      'aria-hidden': true
+    }, props)),
+    icon: react_utilities_1.resolveShorthand(props.icon)
+  };
   return state;
 };
 

package/lib-commonjs/components/Badge/useBadge.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/Badge/useBadge.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACU,OAAA,CAAA,yBAAA,GAA4B,CAAC,MAAD,CAA5B;AAEb,IAAM,UAAU,gBAAG,iBAAA,CAAA,cAAA,CAA2B;AAAE,EAAA,SAAS,EAAE,OAAA,CAAA;AAAb,CAA3B,CAAnB;AAEA;;AAEG;;AACI,IAAM,QAAQ,GAAG,UAAC,KAAD,EAAoB,GAApB,EAAiD,YAAjD,EAA0E;AAChG,MAAM,KAAK,GAAG,UAAU,CACtB;AACE,IAAA,GAAG,EAAE,iBAAA,CAAA,aAAA,CAAc,GAAd,EAAmB,KAAK,CAAC,MAAN,CAAa,IAAb,CAAnB,CADP;AAEE,IAAA,KAAK,EAAE,UAFT;AAGE,IAAA,IAAI,EAAE,QAHR;AAIE,IAAA,YAAY,EAAE,QAJhB;AAKE,mBAAe;AALjB,GADsB,EAQtB,YAAY,IAAI,iBAAA,CAAA,qBAAA,CAAsB,YAAtB,EAAoC,OAAA,CAAA,yBAApC,CARM,EAStB,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,OAAA,CAAA,yBAA7B,CATsB,CAAxB;AAYA,SAAO,KAAP;AACD,CAdM;;AAAM,OAAA,CAAA,QAAA,GAAQ,QAAR","sourcesContent":["import * as React from 'react';\nimport { makeMergeProps, resolveShorthandProps, useMergedRefs } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Consts listing which props are shorthand props.\n */\nexport const badgeShorthandPropsCompat = ['icon'] as const;\n\nconst mergeProps = makeMergeProps<BadgeState>({ deepMerge: badgeShorthandPropsCompat });\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge = (props: BadgeProps, ref: React.Ref<HTMLElement>, defaultProps?: BadgeProps): BadgeState => {\n  const state = mergeProps(\n    {\n      ref: useMergedRefs(ref, React.useRef(null)),\n      shape: 'circular',\n      size: 'medium',\n      iconPosition: 'before',\n      'aria-hidden': true,\n    },\n    defaultProps && resolveShorthandProps(defaultProps, badgeShorthandPropsCompat),\n    resolveShorthandProps(props, badgeShorthandPropsCompat),\n  );\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/Badge/useBadge.ts"],"names":[],"mappings":";;;;;;;;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,IAAM,QAAQ,GAAG,UAAC,KAAD,EAAoB,GAApB,EAA+C;AAEnE,MAAA,EAAA,GAKE,KAAK,CALW,KAAlB;AAAA,MAAA,KAAK,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,UAAH,GAAa,EAAlB;AAAA,MACA,EAAA,GAIE,KAAK,CAJQ,IADf;AAAA,MACA,IAAI,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,QAAH,GAAW,EADf;AAAA,MAEA,EAAA,GAGE,KAAK,CAHgB,YAFvB;AAAA,MAEA,YAAY,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,QAAH,GAAW,EAFvB;AAAA,MAGA,EAAA,GAEE,KAAK,CAFc,UAHrB;AAAA,MAGA,UAAU,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,QAAH,GAAW,EAHrB;AAAA,MAIA,EAAA,GACE,KAAK,CADQ,KAJf;AAAA,MAIA,KAAK,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,OAAH,GAAU,EAJf;AAOF,MAAM,KAAK,GAAe;AACxB,IAAA,KAAK,EAAA,KADmB;AAExB,IAAA,IAAI,EAAA,IAFoB;AAGxB,IAAA,YAAY,EAAA,YAHY;AAIxB,IAAA,UAAU,EAAA,UAJc;AAKxB,IAAA,KAAK,EAAA,KALmB;AAMxB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,IAAI,EAAE;AAFI,KANY;AAUxB,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA2B,OAAA,CAAA,QAAA,CAAA;AAC/B,MAAA,GAAG,EAAA,GAD4B;AAE/B,qBAAe;AAFgB,KAAA,EAG5B,KAH4B,CAA3B,CAVkB;AAexB,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,IAAvB;AAfkB,GAA1B;AAkBA,SAAO,KAAP;AACD,CA5BM;;AAAM,OAAA,CAAA,QAAA,GAAQ,QAAR","sourceRoot":""}

package/lib-commonjs/components/Badge/useBadgeStyles.js

@@ -320,7 +320,7 @@ var useBadgeStyles = function (state) {
   var isImportant = state.color === 'important';
   var isInformative = state.color === 'informative';
   var isSubtle = state.color === 'subtle';
-  state.className = react_make_styles_1.mergeClasses(styles.root, state.size === 'smallest' && styles.rootSmallest, state.size === 'smaller' && styles.rootSmaller, state.size === 'small' && styles.rootSmall, state.size === 'medium' && styles.rootMedium, state.size === 'large' && styles.rootLarge, (state.size === 'larger' || state.size === 'largest') && styles.rootLargerLargest, state.shape === 'circular' && styles.rootCircular, state.shape === 'rounded' && styles.rootRounded, state.shape === 'rounded' && (state.size === 'small' || state.size === 'smaller' || state.size === 'smallest') && styles.rootRoundedSmallSmallerSmallest, isGhost && styles.rootGhost, isOutline && styles.rootOutline, isTint && styles.rootTint, isFilled && isDanger && styles.rootFilledDanger, isOutline && isDanger && styles.rootOutlineDanger, isTint && isDanger && styles.rootTintDanger, isGhost && isDanger && styles.rootGhostDanger, isFilled && isSevere && styles.rootFilledSevere, isOutline && isSevere && styles.rootOutlineSevere, isTint && isSevere && styles.rootTintSevere, isGhost && isSevere && styles.rootGhostSevere, isFilled && isWarning && styles.rootFilledWarning, isOutline && isWarning && styles.rootOutlineWarning, isTint && isWarning && styles.rootTintWarning, isGhost && isWarning && styles.rootGhostWarning, isFilled && isSuccess && styles.rootFilledSuccess, isOutline && isSuccess && styles.rootOutlineSuccess, isTint && isSuccess && styles.rootTintSuccess, isGhost && isSuccess && styles.rootGhostSuccess, isFilled && isImportant && styles.rootFilledImportant, isOutline && isImportant && styles.rootOutlineImportant, isTint && isImportant && styles.rootTintImportant, isGhost && isImportant && styles.rootGhostImportant, isFilled && isInformative && styles.rootFilledInformative, isOutline && isInformative && styles.rootOutlineInformative, isTint && isInformative && styles.rootTintInformative, isGhost && isInformative && styles.rootGhostInformative, isFilled && isSubtle && styles.rootFilledSubtle, isOutline && isSubtle && styles.rootOutlineSubtle, isTint && isSubtle && styles.rootTintSubtle, isGhost && isSubtle && styles.rootGhostSubtle, state.className);
+  state.root.className = react_make_styles_1.mergeClasses(styles.root, state.size === 'smallest' && styles.rootSmallest, state.size === 'smaller' && styles.rootSmaller, state.size === 'small' && styles.rootSmall, state.size === 'medium' && styles.rootMedium, state.size === 'large' && styles.rootLarge, (state.size === 'larger' || state.size === 'largest') && styles.rootLargerLargest, state.shape === 'circular' && styles.rootCircular, state.shape === 'rounded' && styles.rootRounded, state.shape === 'rounded' && (state.size === 'small' || state.size === 'smaller' || state.size === 'smallest') && styles.rootRoundedSmallSmallerSmallest, isGhost && styles.rootGhost, isOutline && styles.rootOutline, isTint && styles.rootTint, isFilled && isDanger && styles.rootFilledDanger, isOutline && isDanger && styles.rootOutlineDanger, isTint && isDanger && styles.rootTintDanger, isGhost && isDanger && styles.rootGhostDanger, isFilled && isSevere && styles.rootFilledSevere, isOutline && isSevere && styles.rootOutlineSevere, isTint && isSevere && styles.rootTintSevere, isGhost && isSevere && styles.rootGhostSevere, isFilled && isWarning && styles.rootFilledWarning, isOutline && isWarning && styles.rootOutlineWarning, isTint && isWarning && styles.rootTintWarning, isGhost && isWarning && styles.rootGhostWarning, isFilled && isSuccess && styles.rootFilledSuccess, isOutline && isSuccess && styles.rootOutlineSuccess, isTint && isSuccess && styles.rootTintSuccess, isGhost && isSuccess && styles.rootGhostSuccess, isFilled && isImportant && styles.rootFilledImportant, isOutline && isImportant && styles.rootOutlineImportant, isTint && isImportant && styles.rootTintImportant, isGhost && isImportant && styles.rootGhostImportant, isFilled && isInformative && styles.rootFilledInformative, isOutline && isInformative && styles.rootOutlineInformative, isTint && isInformative && styles.rootTintInformative, isGhost && isInformative && styles.rootGhostInformative, isFilled && isSubtle && styles.rootFilledSubtle, isOutline && isSubtle && styles.rootOutlineSubtle, isTint && isSubtle && styles.rootTintSubtle, isGhost && isSubtle && styles.rootGhostSubtle, state.root.className);
 
   if (state.icon) {
     state.icon.className = react_make_styles_1.mergeClasses(styles.icon, state.icon.className);

package/lib-commonjs/components/Badge/useBadgeStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/Badge/useBadgeStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { mergeClasses, makeStyles } from '@fluentui/react-make-styles';\nimport type { BadgeState } from './Badge.types';\n\nconst useStyles = makeStyles({\n  root: theme => ({\n    display: 'inline-flex',\n    boxSizing: 'border-box',\n    alignItems: 'center',\n    justifyContent: 'center',\n    backgroundColor: theme.alias.color.neutral.brandBackground,\n    borderColor: theme.alias.color.neutral.brandBackground,\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n    fontWeight: theme.global.type.fontWeights.semibold,\n    borderWidth: theme.global.strokeWidth.thin,\n    borderStyle: 'solid',\n    fontFamily: theme.global.type.fontFamilies.base,\n    position: 'relative',\n  }),\n  rootSmallest: {\n    width: '6px',\n    height: '6px',\n    fontSize: '4px',\n  },\n  rootSmaller: {\n    width: '10px',\n    height: '10px',\n    fontSize: '6px',\n  },\n  rootSmall: {\n    minWidth: '16px',\n    height: '16px',\n    paddingRight: '6px',\n    paddingLeft: '6px',\n    gap: '4px',\n    fontSize: '8px',\n  },\n  rootMedium: {\n    height: '20px',\n    minWidth: '20px',\n    gap: '4px',\n    paddingRight: '8px',\n    paddingLeft: '8px',\n    fontSize: '10px',\n  },\n  rootLarge: {\n    minWidth: '24px',\n    height: '24px',\n    paddingRight: '8px',\n    paddingLeft: '8px',\n    fontSize: '12px',\n    gap: '6px',\n  },\n  rootLargerLargest: theme => ({\n    minWidth: '32px',\n    height: '32px',\n    paddingRight: '12px',\n    paddingLeft: '12px',\n    gap: '6px',\n    fontSize: '12px',\n    borderWidth: theme.global.strokeWidth.thick,\n  }),\n  rootRounded: theme => ({ borderRadius: theme.global.borderRadius.medium }),\n  rootRoundedSmallSmallerSmallest: theme => ({ borderRadius: theme.global.borderRadius.small }),\n  rootCircular: { borderRadius: '99px' },\n  rootGhost: theme => ({\n    background: 'transparent',\n    border: 'none',\n    color: theme.alias.color.neutral.brandBackground,\n  }),\n  rootOutline: theme => ({\n    background: 'transparent',\n    borderColor: theme.alias.color.neutral.brandBackground,\n    color: theme.alias.color.neutral.brandBackground,\n  }),\n  rootTint: theme => ({\n    backgroundColor: theme.global.palette.brand.tint60,\n    color: theme.global.palette.brand.shade40,\n    borderColor: 'none',\n  }),\n  rootFilledDanger: theme => ({\n    backgroundColor: theme.alias.color.red.background3,\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n    borderColor: theme.alias.color.red.background3,\n  }),\n  rootOutlineDanger: theme => ({\n    color: theme.alias.color.red.foreground3,\n    borderColor: theme.alias.color.red.foreground3,\n  }),\n  rootTintDanger: theme => ({\n    backgroundColor: theme.alias.color.red.background1,\n    color: theme.alias.color.red.foreground1,\n    borderColor: theme.alias.color.red.foreground2,\n  }),\n  rootGhostDanger: theme => ({\n    color: theme.alias.color.red.foreground3,\n  }),\n  rootFilledSevere: theme => ({\n    backgroundColor: theme.alias.color.darkOrange.background3,\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n    borderColor: 'none',\n  }),\n  rootOutlineSevere: theme => ({\n    color: theme.alias.color.darkOrange.foreground3,\n    borderColor: theme.alias.color.darkOrange.foreground3,\n  }),\n  rootTintSevere: theme => ({\n    backgroundColor: theme.alias.color.darkOrange.background1,\n    color: theme.alias.color.darkOrange.foreground1,\n    borderColor: theme.alias.color.darkOrange.foreground2,\n  }),\n  rootGhostSevere: theme => ({\n    color: theme.alias.color.darkOrange.foreground3,\n  }),\n  rootFilledWarning: theme => ({\n    backgroundColor: theme.alias.color.yellow.background3,\n    color: theme.alias.color.neutral.neutralForeground1,\n    borderColor: theme.alias.color.yellow.background3,\n  }),\n  rootOutlineWarning: theme => ({\n    color: theme.alias.color.yellow.foreground2,\n    borderColor: theme.alias.color.yellow.foreground2,\n  }),\n  rootTintWarning: theme => ({\n    backgroundColor: theme.alias.color.yellow.background1,\n    color: theme.alias.color.yellow.foreground2,\n    borderColor: theme.alias.color.yellow.background2,\n  }),\n  rootGhostWarning: theme => ({\n    color: theme.alias.color.yellow.foreground2,\n  }),\n  rootFilledSuccess: theme => ({\n    backgroundColor: theme.alias.color.green.background3,\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n    borderColor: 'none',\n  }),\n  rootOutlineSuccess: theme => ({\n    color: theme.alias.color.green.foreground2,\n    borderColor: theme.alias.color.green.foreground2,\n  }),\n  rootTintSuccess: theme => ({\n    backgroundColor: theme.alias.color.green.background1,\n    color: theme.alias.color.green.foreground1,\n    borderColor: theme.alias.color.green.background2,\n  }),\n  rootGhostSuccess: theme => ({\n    color: theme.alias.color.green.foreground3,\n  }),\n  rootFilledImportant: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralForeground1,\n    color: theme.alias.color.neutral.neutralBackground1,\n    borderColor: theme.alias.color.neutral.transparentStroke,\n  }),\n  rootOutlineImportant: theme => ({\n    color: theme.alias.color.neutral.neutralForeground1,\n    borderColor: theme.alias.color.neutral.neutralForeground1,\n  }),\n  rootTintImportant: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralForeground3,\n    color: theme.alias.color.neutral.neutralBackground1,\n    borderColor: theme.alias.color.neutral.transparentStroke,\n  }),\n  rootGhostImportant: theme => ({\n    color: theme.alias.color.neutral.neutralForeground1,\n  }),\n  rootFilledInformative: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground5,\n    color: theme.alias.color.neutral.neutralForeground3,\n    borderColor: theme.alias.color.neutral.transparentStroke,\n  }),\n  rootOutlineInformative: theme => ({\n    backgroundColor: theme.alias.color.darkOrange.background3,\n    color: theme.alias.color.neutral.neutralBackground5,\n    borderColor: theme.alias.color.neutral.neutralBackground5,\n  }),\n  rootTintInformative: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground4,\n    color: theme.alias.color.neutral.neutralForeground3,\n    borderColor: theme.alias.color.neutral.neutralStroke2,\n  }),\n  rootGhostInformative: theme => ({\n    color: theme.alias.color.neutral.neutralBackground5,\n  }),\n  rootFilledSubtle: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground1,\n    color: theme.alias.color.neutral.neutralForeground1,\n    borderColor: theme.alias.color.neutral.transparentStroke,\n  }),\n  rootOutlineSubtle: theme => ({\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n    borderColor: theme.alias.color.neutral.neutralForegroundOnBrand,\n  }),\n  rootTintSubtle: theme => ({\n    backgroundColor: theme.alias.color.neutral.neutralBackground1,\n    color: theme.alias.color.neutral.neutralForeground3,\n    borderColor: theme.alias.color.neutral.neutralStroke2,\n  }),\n  rootGhostSubtle: theme => ({\n    color: theme.alias.color.neutral.neutralForegroundOnBrand,\n  }),\n  icon: {\n    display: 'flex',\n    alignContent: 'center',\n    alignItems: 'center',\n    height: '100%',\n  },\n});\n\n/**\n * Applies style classnames to slots\n */\nexport const useBadgeStyles = (state: BadgeState): BadgeState => {\n  const styles = useStyles();\n  const isGhost = state.appearance === 'ghost';\n  const isOutline = state.appearance === 'outline';\n  const isTint = state.appearance === 'tint';\n  const isFilled = state.appearance === 'filled';\n  const isDanger = state.color === 'danger';\n  const isSevere = state.color === 'severe';\n  const isWarning = state.color === 'warning';\n  const isSuccess = state.color === 'success';\n  const isImportant = state.color === 'important';\n  const isInformative = state.color === 'informative';\n  const isSubtle = state.color === 'subtle';\n\n  state.className = mergeClasses(\n    styles.root,\n    state.size === 'smallest' && styles.rootSmallest,\n    state.size === 'smaller' && styles.rootSmaller,\n    state.size === 'small' && styles.rootSmall,\n    state.size === 'medium' && styles.rootMedium,\n    state.size === 'large' && styles.rootLarge,\n    (state.size === 'larger' || state.size === 'largest') && styles.rootLargerLargest,\n    state.shape === 'circular' && styles.rootCircular,\n    state.shape === 'rounded' && styles.rootRounded,\n    state.shape === 'rounded' &&\n      (state.size === 'small' || state.size === 'smaller' || state.size === 'smallest') &&\n      styles.rootRoundedSmallSmallerSmallest,\n    isGhost && styles.rootGhost,\n    isOutline && styles.rootOutline,\n    isTint && styles.rootTint,\n    isFilled && isDanger && styles.rootFilledDanger,\n    isOutline && isDanger && styles.rootOutlineDanger,\n    isTint && isDanger && styles.rootTintDanger,\n    isGhost && isDanger && styles.rootGhostDanger,\n    isFilled && isSevere && styles.rootFilledSevere,\n    isOutline && isSevere && styles.rootOutlineSevere,\n    isTint && isSevere && styles.rootTintSevere,\n    isGhost && isSevere && styles.rootGhostSevere,\n    isFilled && isWarning && styles.rootFilledWarning,\n    isOutline && isWarning && styles.rootOutlineWarning,\n    isTint && isWarning && styles.rootTintWarning,\n    isGhost && isWarning && styles.rootGhostWarning,\n    isFilled && isSuccess && styles.rootFilledSuccess,\n    isOutline && isSuccess && styles.rootOutlineSuccess,\n    isTint && isSuccess && styles.rootTintSuccess,\n    isGhost && isSuccess && styles.rootGhostSuccess,\n    isFilled && isImportant && styles.rootFilledImportant,\n    isOutline && isImportant && styles.rootOutlineImportant,\n    isTint && isImportant && styles.rootTintImportant,\n    isGhost && isImportant && styles.rootGhostImportant,\n    isFilled && isInformative && styles.rootFilledInformative,\n    isOutline && isInformative && styles.rootOutlineInformative,\n    isTint && isInformative && styles.rootTintInformative,\n    isGhost && isInformative && styles.rootGhostInformative,\n    isFilled && isSubtle && styles.rootFilledSubtle,\n    isOutline && isSubtle && styles.rootOutlineSubtle,\n    isTint && isSubtle && styles.rootTintSubtle,\n    isGhost && isSubtle && styles.rootGhostSubtle,\n    state.className,\n  );\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(styles.icon, state.icon.className);\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["../../../src/components/Badge/useBadgeStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}