@fluentui/react-badge 0.0.0-nightly-20220302-0405.1

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

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useBadge_unstable = void 0;
+
+const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
+/**
+ * Returns the props and state required to render the component
+ */
+
+
+const useBadge_unstable = (props, ref) => {
+  const {
+    shape = 'circular',
+    size = 'medium',
+    iconPosition = 'before',
+    appearance = 'filled',
+    color = 'brand'
+  } = props;
+  const state = {
+    shape,
+    size,
+    iconPosition,
+    appearance,
+    color,
+    components: {
+      root: 'div',
+      icon: 'span'
+    },
+    root: react_utilities_1.getNativeElementProps('div', {
+      ref,
+      'aria-hidden': true,
+      ...props
+    }),
+    icon: react_utilities_1.resolveShorthand(props.icon)
+  };
+  return state;
+};
+
+exports.useBadge_unstable = useBadge_unstable;
+//# sourceMappingURL=useBadge.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/Badge/useBadge.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAA+D;AAC9F,QAAM;AACJ,IAAA,KAAK,GAAG,UADJ;AAEJ,IAAA,IAAI,GAAG,QAFH;AAGJ,IAAA,YAAY,GAAG,QAHX;AAIJ,IAAA,UAAU,GAAG,QAJT;AAKJ,IAAA,KAAK,GAAG;AALJ,MAMF,KANJ;AAQA,QAAM,KAAK,GAAe;AACxB,IAAA,KADwB;AAExB,IAAA,IAFwB;AAGxB,IAAA,YAHwB;AAIxB,IAAA,UAJwB;AAKxB,IAAA,KALwB;AAMxB,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,IAAI,EAAE;AAFI,KANY;AAUxB,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;AACjC,MAAA,GADiC;AAEjC,qBAAe,IAFkB;AAGjC,SAAG;AAH8B,KAA7B,CAVkB;AAexB,IAAA,IAAI,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,IAAvB;AAfkB,GAA1B;AAkBA,SAAO,KAAP;AACD,CA5BM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { BadgeProps, BadgeState } from './Badge.types';\n\n/**\n * Returns the props and state required to render the component\n */\nexport const useBadge_unstable = (props: BadgeProps, ref: React.Ref<HTMLElement>): BadgeState => {\n  const {\n    shape = 'circular',\n    size = 'medium',\n    iconPosition = 'before',\n    appearance = 'filled',\n    color = 'brand',\n  } = props;\n\n  const state: BadgeState = {\n    shape,\n    size,\n    iconPosition,\n    appearance,\n    color,\n    components: {\n      root: 'div',\n      icon: 'span',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      'aria-hidden': true,\n      ...props,\n    }),\n    icon: resolveShorthand(props.icon),\n  };\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

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

@@ -0,0 +1,6 @@
+import type { BadgeState } from './Badge.types';
+export declare const badgeClassName = "fui-Badge";
+/**
+ * Applies style classnames to slots
+ */
+export declare const useBadgeStyles_unstable: (state: BadgeState) => BadgeState;

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

@@ -0,0 +1,342 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useBadgeStyles_unstable = exports.badgeClassName = void 0;
+
+const react_1 = /*#__PURE__*/require("@griffel/react");
+
+const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
+
+exports.badgeClassName = 'fui-Badge';
+
+const useRootStyles = /*#__PURE__*/react_1.__styles({
+  "base": {
+    "mc9l5x": "ftuwxu6",
+    "B7ck84d": "f1ewtqcl",
+    "Bt984gj": "f122n59",
+    "Brf1p80": "f4d9j23",
+    "Bhrd7zp": "fl43uef",
+    "B4j52fo": "f192inf7",
+    "Bekrc4i": ["f5tn483", "f1ojsxk5"],
+    "Bn0qgzm": "f1vxd6vx",
+    "ibv6hh": ["f1ojsxk5", "f5tn483"],
+    "icvyot": "fzkkow9",
+    "vrafjx": ["fcdblym", "fjik90z"],
+    "oivjwe": "fg706s2",
+    "wvpqe5": ["fjik90z", "fcdblym"],
+    "Bahqtrf": "fk6fouc",
+    "qhf8xq": "f10pi13n"
+  },
+  "tiny": {
+    "a9b677": "f16dn6v3",
+    "Bqenvij": "f3mu39s",
+    "Be2twd7": "f130uwy9"
+  },
+  "extra-small": {
+    "a9b677": "fpd43o0",
+    "Bqenvij": "f30q22z",
+    "Be2twd7": "f1tccstq"
+  },
+  "small": {
+    "Bf4jedk": "fq2vo04",
+    "Bqenvij": "fd461yt",
+    "z8tnut": "fq1loh5",
+    "z189sj": ["f12huiiw", "f161knb0"],
+    "Byoj8tv": "futqtb8",
+    "uwmqm3": ["f161knb0", "f12huiiw"],
+    "i8kkvl": "f1q8lukm",
+    "Belr9w4": "f1ma2n7n",
+    "Be2twd7": "f1n0apg3"
+  },
+  "medium": {
+    "Bqenvij": "fjamq6b",
+    "Bf4jedk": "f11u7vat",
+    "i8kkvl": "f1q8lukm",
+    "Belr9w4": "f1ma2n7n",
+    "z8tnut": "f10ra9hq",
+    "z189sj": ["f8wuabp", "fycuoez"],
+    "Byoj8tv": "f1y2xyjm",
+    "uwmqm3": ["fycuoez", "f8wuabp"],
+    "Be2twd7": "fnmn6fi"
+  },
+  "large": {
+    "Bf4jedk": "f17fgpbq",
+    "Bqenvij": "frvgh55",
+    "z8tnut": "f10ra9hq",
+    "z189sj": ["f8wuabp", "fycuoez"],
+    "Byoj8tv": "f1y2xyjm",
+    "uwmqm3": ["fycuoez", "f8wuabp"],
+    "Be2twd7": "f1ugzwwg",
+    "i8kkvl": "f1q8lukm",
+    "Belr9w4": "f1ma2n7n"
+  },
+  "extra-large": {
+    "Bf4jedk": "fwbmr0d",
+    "Bqenvij": "f1d2rq10",
+    "z8tnut": "f1xp5gbu",
+    "z189sj": ["f1sgzk6v", "f1bg5zqg"],
+    "Byoj8tv": "f1d7kygh",
+    "uwmqm3": ["f1bg5zqg", "f1sgzk6v"],
+    "i8kkvl": "fgfbwa2",
+    "Belr9w4": "f1y3hx6l",
+    "Be2twd7": "f1ugzwwg",
+    "B4j52fo": "f18zi460",
+    "Bekrc4i": ["f1wpluaz", "fsfsuhs"],
+    "Bn0qgzm": "fmklw6v",
+    "ibv6hh": ["fsfsuhs", "f1wpluaz"]
+  },
+  "square": {},
+  "rounded": {
+    "Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
+    "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
+    "B7oj6ja": ["f1jar5jt", "fyu767a"],
+    "Btl43ni": ["fyu767a", "f1jar5jt"]
+  },
+  "roundedSmallToTiny": {
+    "Bbmb7ep": ["f1g3puop", "fi2rrw2"],
+    "Beyfa6y": ["fi2rrw2", "f1g3puop"],
+    "B7oj6ja": ["f1rstyi9", "f1s4nn1u"],
+    "Btl43ni": ["f1s4nn1u", "f1rstyi9"]
+  },
+  "circular": {
+    "Bbmb7ep": ["fxyqdnz", "fib3qew"],
+    "Beyfa6y": ["fib3qew", "fxyqdnz"],
+    "B7oj6ja": ["f14p2bvz", "fdqj3q4"],
+    "Btl43ni": ["fdqj3q4", "f14p2bvz"]
+  },
+  "filled": {
+    "g2u3we": "fghlq4f",
+    "h3c5rm": ["f1gn591s", "fjscplz"],
+    "B9xav0g": "fb073pr",
+    "zhjwy3": ["fjscplz", "f1gn591s"]
+  },
+  "filled-brand": {
+    "De3pzq": "ffp7eso",
+    "sj55zd": "f1phragk",
+    "g2u3we": "f1vp46cd",
+    "h3c5rm": ["f1lxz1cr", "ff8nh0i"],
+    "B9xav0g": "fe9j8it",
+    "zhjwy3": ["ff8nh0i", "f1lxz1cr"]
+  },
+  "filled-danger": {
+    "De3pzq": "fdl5y0r",
+    "sj55zd": "f1phragk",
+    "g2u3we": "f11ttmz8",
+    "h3c5rm": ["f1ratw88", "f459ikj"],
+    "B9xav0g": "fvovscg",
+    "zhjwy3": ["f459ikj", "f1ratw88"]
+  },
+  "filled-important": {
+    "De3pzq": "f1c73kur",
+    "sj55zd": "fr0bkrk"
+  },
+  "filled-informative": {
+    "De3pzq": "f3vzo32",
+    "sj55zd": "f11d4kpn"
+  },
+  "filled-severe": {
+    "De3pzq": "f1s438gw",
+    "sj55zd": "f1phragk"
+  },
+  "filled-subtle": {
+    "De3pzq": "fxugw4r",
+    "sj55zd": "f19n0e5"
+  },
+  "filled-success": {
+    "De3pzq": "flxk52p",
+    "sj55zd": "f1phragk"
+  },
+  "filled-warning": {
+    "De3pzq": "ffq97bm",
+    "sj55zd": "f19n0e5",
+    "g2u3we": "f1gyeiz5",
+    "h3c5rm": ["f1jnj1iq", "fd1epeu"],
+    "B9xav0g": "f102bkgo",
+    "zhjwy3": ["fd1epeu", "f1jnj1iq"]
+  },
+  "ghost": {
+    "icvyot": "f1ern45e",
+    "vrafjx": ["f1n71otn", "f1deefiw"],
+    "oivjwe": "f1h8hb77",
+    "wvpqe5": ["f1deefiw", "f1n71otn"]
+  },
+  "ghost-brand": {
+    "sj55zd": "f1817uup"
+  },
+  "ghost-danger": {
+    "sj55zd": "f1whyuy6"
+  },
+  "ghost-important": {
+    "sj55zd": "f19n0e5"
+  },
+  "ghost-informative": {
+    "sj55zd": "f11d4kpn"
+  },
+  "ghost-severe": {
+    "sj55zd": "f1l8vj45"
+  },
+  "ghost-subtle": {
+    "sj55zd": "fqpbvvt"
+  },
+  "ghost-success": {
+    "sj55zd": "f1m7fhi8"
+  },
+  "ghost-warning": {
+    "sj55zd": "fpti2h4"
+  },
+  "outline": {
+    "g2u3we": "f23ftbb",
+    "h3c5rm": ["f1gkuv52", "f1p1bl80"],
+    "B9xav0g": "fioka3i",
+    "zhjwy3": ["f1p1bl80", "f1gkuv52"]
+  },
+  "outline-brand": {
+    "sj55zd": "f1817uup"
+  },
+  "outline-danger": {
+    "sj55zd": "f1whyuy6"
+  },
+  "outline-important": {
+    "sj55zd": "f11d4kpn",
+    "g2u3we": "fq0vr37",
+    "h3c5rm": ["f1byw159", "f11cr0be"],
+    "B9xav0g": "f1c1zstj",
+    "zhjwy3": ["f11cr0be", "f1byw159"]
+  },
+  "outline-informative": {
+    "sj55zd": "f11d4kpn",
+    "g2u3we": "f68mrw8",
+    "h3c5rm": ["f7pw515", "fw35ms5"],
+    "B9xav0g": "frpde29",
+    "zhjwy3": ["fw35ms5", "f7pw515"]
+  },
+  "outline-severe": {
+    "sj55zd": "f1l8vj45"
+  },
+  "outline-subtle": {
+    "sj55zd": "fqpbvvt"
+  },
+  "outline-success": {
+    "sj55zd": "f1sms7z7"
+  },
+  "outline-warning": {
+    "sj55zd": "fpti2h4"
+  },
+  "tint": {},
+  "tint-brand": {
+    "De3pzq": "f16xkysk",
+    "sj55zd": "faj9fo0",
+    "g2u3we": "f161y7kd",
+    "h3c5rm": ["f1c8dzaj", "f1sl6hi9"],
+    "B9xav0g": "f1619yhw",
+    "zhjwy3": ["f1sl6hi9", "f1c8dzaj"]
+  },
+  "tint-danger": {
+    "De3pzq": "ff0poqj",
+    "sj55zd": "f1hcrxcs",
+    "g2u3we": "f1oqjm8o",
+    "h3c5rm": ["fkgrb8g", "frb5wm0"],
+    "B9xav0g": "f1iai1ph",
+    "zhjwy3": ["frb5wm0", "fkgrb8g"]
+  },
+  "tint-important": {
+    "De3pzq": "f945g0u",
+    "sj55zd": "fr0bkrk",
+    "g2u3we": "fghlq4f",
+    "h3c5rm": ["f1gn591s", "fjscplz"],
+    "B9xav0g": "fb073pr",
+    "zhjwy3": ["fjscplz", "f1gn591s"]
+  },
+  "tint-informative": {
+    "De3pzq": "f1ctqxl6",
+    "sj55zd": "f11d4kpn",
+    "g2u3we": "f68mrw8",
+    "h3c5rm": ["f7pw515", "fw35ms5"],
+    "B9xav0g": "frpde29",
+    "zhjwy3": ["fw35ms5", "f7pw515"]
+  },
+  "tint-severe": {
+    "De3pzq": "f1xzsg4",
+    "sj55zd": "f1k5f75o",
+    "g2u3we": "f18s257e",
+    "h3c5rm": ["f13ptu4t", "fiwx4jo"],
+    "B9xav0g": "f1geyuz0",
+    "zhjwy3": ["fiwx4jo", "f13ptu4t"]
+  },
+  "tint-subtle": {
+    "De3pzq": "fxugw4r",
+    "sj55zd": "f11d4kpn",
+    "g2u3we": "f68mrw8",
+    "h3c5rm": ["f7pw515", "fw35ms5"],
+    "B9xav0g": "frpde29",
+    "zhjwy3": ["fw35ms5", "f7pw515"]
+  },
+  "tint-success": {
+    "De3pzq": "f2vsrz6",
+    "sj55zd": "ffmvakt",
+    "g2u3we": "f3m3qtd",
+    "h3c5rm": ["f1bjyn17", "fksln3n"],
+    "B9xav0g": "frg4y0o",
+    "zhjwy3": ["fksln3n", "f1bjyn17"]
+  },
+  "tint-warning": {
+    "De3pzq": "f10s6hli",
+    "sj55zd": "fpti2h4",
+    "g2u3we": "f1e2bpek",
+    "h3c5rm": ["fnu3uvp", "fdpwmi9"],
+    "B9xav0g": "fk8fs0c",
+    "zhjwy3": ["fdpwmi9", "fnu3uvp"]
+  }
+}, {
+  "d": [".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f1ewtqcl{box-sizing:border-box;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f192inf7{border-top-width:var(--strokeWidthThin);}", ".f5tn483{border-right-width:var(--strokeWidthThin);}", ".f1ojsxk5{border-left-width:var(--strokeWidthThin);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f10pi13n{position:relative;}", ".f16dn6v3{width:6px;}", ".f3mu39s{height:6px;}", ".f130uwy9{font-size:4px;}", ".fpd43o0{width:10px;}", ".f30q22z{height:10px;}", ".f1tccstq{font-size:6px;}", ".fq2vo04{min-width:16px;}", ".fd461yt{height:16px;}", ".fq1loh5{padding-top:2px;}", ".f12huiiw{padding-right:2px;}", ".f161knb0{padding-left:2px;}", ".futqtb8{padding-bottom:2px;}", ".f1q8lukm{-webkit-column-gap:4px;column-gap:4px;}", ".f1ma2n7n{row-gap:4px;}", ".f1n0apg3{font-size:8px;}", ".fjamq6b{height:20px;}", ".f11u7vat{min-width:20px;}", ".f10ra9hq{padding-top:4px;}", ".f8wuabp{padding-right:4px;}", ".fycuoez{padding-left:4px;}", ".f1y2xyjm{padding-bottom:4px;}", ".fnmn6fi{font-size:10px;}", ".f17fgpbq{min-width:24px;}", ".frvgh55{height:24px;}", ".f1ugzwwg{font-size:12px;}", ".fwbmr0d{min-width:32px;}", ".f1d2rq10{height:32px;}", ".f1xp5gbu{padding-top:6px;}", ".f1sgzk6v{padding-right:6px;}", ".f1bg5zqg{padding-left:6px;}", ".f1d7kygh{padding-bottom:6px;}", ".fgfbwa2{-webkit-column-gap:6px;column-gap:6px;}", ".f1y3hx6l{row-gap:6px;}", ".f18zi460{border-top-width:var(--strokeWidthThick);}", ".f1wpluaz{border-right-width:var(--strokeWidthThick);}", ".fsfsuhs{border-left-width:var(--strokeWidthThick);}", ".fmklw6v{border-bottom-width:var(--strokeWidthThick);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1g3puop{border-bottom-right-radius:var(--borderRadiusSmall);}", ".fi2rrw2{border-bottom-left-radius:var(--borderRadiusSmall);}", ".f1rstyi9{border-top-right-radius:var(--borderRadiusSmall);}", ".f1s4nn1u{border-top-left-radius:var(--borderRadiusSmall);}", ".fxyqdnz{border-bottom-right-radius:99px;}", ".fib3qew{border-bottom-left-radius:99px;}", ".f14p2bvz{border-top-right-radius:99px;}", ".fdqj3q4{border-top-left-radius:99px;}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".ffp7eso{background-color:var(--colorBrandBackground);}", ".f1phragk{color:var(--colorNeutralForegroundOnBrand);}", ".f1vp46cd{border-top-color:var(--colorBrandBackground);}", ".f1lxz1cr{border-right-color:var(--colorBrandBackground);}", ".ff8nh0i{border-left-color:var(--colorBrandBackground);}", ".fe9j8it{border-bottom-color:var(--colorBrandBackground);}", ".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}", ".f11ttmz8{border-top-color:var(--colorPaletteRedBackground3);}", ".f1ratw88{border-right-color:var(--colorPaletteRedBackground3);}", ".f459ikj{border-left-color:var(--colorPaletteRedBackground3);}", ".fvovscg{border-bottom-color:var(--colorPaletteRedBackground3);}", ".f1c73kur{background-color:var(--colorNeutralForeground1);}", ".fr0bkrk{color:var(--colorNeutralBackground1);}", ".f3vzo32{background-color:var(--colorNeutralBackground5);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".flxk52p{background-color:var(--colorPaletteGreenBackground3);}", ".ffq97bm{background-color:var(--colorPaletteYellowBackground3);}", ".f1gyeiz5{border-top-color:var(--colorPaletteYellowBackground3);}", ".f1jnj1iq{border-right-color:var(--colorPaletteYellowBackground3);}", ".fd1epeu{border-left-color:var(--colorPaletteYellowBackground3);}", ".f102bkgo{border-bottom-color:var(--colorPaletteYellowBackground3);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", ".f1817uup{color:var(--colorBrandBackground);}", ".f1whyuy6{color:var(--colorPaletteRedForeground3);}", ".f1l8vj45{color:var(--colorPaletteDarkOrangeForeground3);}", ".fqpbvvt{color:var(--colorNeutralForegroundInverted);}", ".f1m7fhi8{color:var(--colorPaletteGreenForeground3);}", ".fpti2h4{color:var(--colorPaletteYellowForeground2);}", ".f23ftbb{border-top-color:currentColor;}", ".f1gkuv52{border-right-color:currentColor;}", ".f1p1bl80{border-left-color:currentColor;}", ".fioka3i{border-bottom-color:currentColor;}", ".fq0vr37{border-top-color:var(--colorNeutralStrokeAccessible);}", ".f1byw159{border-right-color:var(--colorNeutralStrokeAccessible);}", ".f11cr0be{border-left-color:var(--colorNeutralStrokeAccessible);}", ".f1c1zstj{border-bottom-color:var(--colorNeutralStrokeAccessible);}", ".f68mrw8{border-top-color:var(--colorNeutralStroke2);}", ".f7pw515{border-right-color:var(--colorNeutralStroke2);}", ".fw35ms5{border-left-color:var(--colorNeutralStroke2);}", ".frpde29{border-bottom-color:var(--colorNeutralStroke2);}", ".f1sms7z7{color:var(--colorPaletteGreenForeground2);}", ".f16xkysk{background-color:var(--colorBrandBackground2);}", ".faj9fo0{color:var(--colorBrandForeground2);}", ".f161y7kd{border-top-color:var(--colorBrandStroke2);}", ".f1c8dzaj{border-right-color:var(--colorBrandStroke2);}", ".f1sl6hi9{border-left-color:var(--colorBrandStroke2);}", ".f1619yhw{border-bottom-color:var(--colorBrandStroke2);}", ".ff0poqj{background-color:var(--colorPaletteRedBackground1);}", ".f1hcrxcs{color:var(--colorPaletteRedForeground1);}", ".f1oqjm8o{border-top-color:var(--colorPaletteRedBorder1);}", ".fkgrb8g{border-right-color:var(--colorPaletteRedBorder1);}", ".frb5wm0{border-left-color:var(--colorPaletteRedBorder1);}", ".f1iai1ph{border-bottom-color:var(--colorPaletteRedBorder1);}", ".f945g0u{background-color:var(--colorNeutralForeground3);}", ".f1ctqxl6{background-color:var(--colorNeutralBackground4);}", ".f1xzsg4{background-color:var(--colorPaletteDarkOrangeBackground1);}", ".f1k5f75o{color:var(--colorPaletteDarkOrangeForeground1);}", ".f18s257e{border-top-color:var(--colorPaletteDarkOrangeForeground2);}", ".f13ptu4t{border-right-color:var(--colorPaletteDarkOrangeForeground2);}", ".fiwx4jo{border-left-color:var(--colorPaletteDarkOrangeForeground2);}", ".f1geyuz0{border-bottom-color:var(--colorPaletteDarkOrangeForeground2);}", ".f2vsrz6{background-color:var(--colorPaletteGreenBackground1);}", ".ffmvakt{color:var(--colorPaletteGreenForeground1);}", ".f3m3qtd{border-top-color:var(--colorPaletteGreenBackground2);}", ".f1bjyn17{border-right-color:var(--colorPaletteGreenBackground2);}", ".fksln3n{border-left-color:var(--colorPaletteGreenBackground2);}", ".frg4y0o{border-bottom-color:var(--colorPaletteGreenBackground2);}", ".f10s6hli{background-color:var(--colorPaletteYellowBackground1);}", ".f1e2bpek{border-top-color:var(--colorPaletteYellowBackground2);}", ".fnu3uvp{border-right-color:var(--colorPaletteYellowBackground2);}", ".fdpwmi9{border-left-color:var(--colorPaletteYellowBackground2);}", ".fk8fs0c{border-bottom-color:var(--colorPaletteYellowBackground2);}"]
+});
+
+const useIconStyles = /*#__PURE__*/react_1.__styles({
+  "base": {
+    "mc9l5x": "f22iagw",
+    "Bmliigx": "fxe27oy",
+    "Bt984gj": "f122n59",
+    "Bqenvij": "f1l02sjl"
+  },
+  "tiny": {
+    "Be2twd7": "f1tccstq"
+  },
+  "extra-small": {
+    "Be2twd7": "fnmn6fi"
+  },
+  "small": {
+    "Be2twd7": "f1ugzwwg"
+  },
+  "medium": {
+    "Be2twd7": "f1ugzwwg"
+  },
+  "large": {
+    "Be2twd7": "f4ybsrx"
+  },
+  "extra-large": {
+    "Be2twd7": "fe5j1ua"
+  }
+}, {
+  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fxe27oy{-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1l02sjl{height:100%;}", ".f1tccstq{font-size:6px;}", ".fnmn6fi{font-size:10px;}", ".f1ugzwwg{font-size:12px;}", ".f4ybsrx{font-size:16px;}", ".fe5j1ua{font-size:20px;}"]
+});
+/**
+ * Applies style classnames to slots
+ */
+
+
+const useBadgeStyles_unstable = state => {
+  const rootStyles = useRootStyles();
+  state.root.className = react_1.mergeClasses(exports.badgeClassName, rootStyles.base, rootStyles[state.size], rootStyles[state.shape], state.shape === 'rounded' && (state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny') && rootStyles.roundedSmallToTiny, rootStyles[state.appearance], rootStyles[`${state.appearance}-${state.color}`], state.root.className);
+  const iconStyles = useIconStyles();
+
+  if (state.icon) {
+    state.icon.className = react_1.mergeClasses(iconStyles.base, iconStyles[state.size], state.icon.className);
+  }
+
+  return state;
+};
+
+exports.useBadgeStyles_unstable = useBadgeStyles_unstable;
+//# sourceMappingURL=useBadgeStyles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/Badge/useBadgeStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { BadgeState } from './Badge.types';\n\nexport const badgeClassName = 'fui-Badge';\n\nconst useRootStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    boxSizing: 'border-box',\n    alignItems: 'center',\n    justifyContent: 'center',\n    fontWeight: tokens.fontWeightSemibold,\n    ...shorthands.borderWidth(tokens.strokeWidthThin),\n    ...shorthands.borderStyle('solid'),\n    fontFamily: tokens.fontFamilyBase,\n    position: 'relative',\n  },\n\n  // size\n\n  tiny: {\n    width: '6px',\n    height: '6px',\n    fontSize: '4px',\n  },\n  'extra-small': {\n    width: '10px',\n    height: '10px',\n    fontSize: '6px',\n  },\n  small: {\n    minWidth: '16px',\n    height: '16px',\n    ...shorthands.padding('2px'),\n    ...shorthands.gap('4px'),\n    fontSize: '8px',\n  },\n  medium: {\n    height: '20px',\n    minWidth: '20px',\n    ...shorthands.gap('4px'),\n    ...shorthands.padding('4px'),\n    fontSize: '10px',\n  },\n  large: {\n    minWidth: '24px',\n    height: '24px',\n    ...shorthands.padding('4px'),\n    fontSize: '12px',\n    ...shorthands.gap('4px'),\n  },\n  'extra-large': {\n    minWidth: '32px',\n    height: '32px',\n    ...shorthands.padding('6px'),\n    ...shorthands.gap('6px'),\n    fontSize: '12px',\n    ...shorthands.borderWidth(tokens.strokeWidthThick),\n  },\n\n  // shape\n\n  square: {\n    // Default border radius\n  },\n  rounded: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n  },\n  roundedSmallToTiny: {\n    ...shorthands.borderRadius(tokens.borderRadiusSmall),\n  },\n  circular: {\n    ...shorthands.borderRadius('99px'),\n  },\n\n  // appearance: filled\n\n  filled: {\n    ...shorthands.borderColor(tokens.colorTransparentStroke),\n  },\n  'filled-brand': {\n    backgroundColor: tokens.colorBrandBackground,\n    color: tokens.colorNeutralForegroundOnBrand,\n    ...shorthands.borderColor(tokens.colorBrandBackground),\n  },\n  'filled-danger': {\n    backgroundColor: tokens.colorPaletteRedBackground3,\n    color: tokens.colorNeutralForegroundOnBrand,\n    ...shorthands.borderColor(tokens.colorPaletteRedBackground3),\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.colorNeutralForeground1,\n    ...shorthands.borderColor(tokens.colorPaletteYellowBackground3),\n  },\n\n  // appearance: ghost\n\n  ghost: {\n    ...shorthands.borderStyle('none'),\n  },\n  'ghost-brand': {\n    color: tokens.colorBrandBackground,\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.colorNeutralForegroundInverted,\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.colorBrandBackground,\n  },\n  'outline-danger': {\n    color: tokens.colorPaletteRedForeground3,\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.colorNeutralForegroundInverted,\n  },\n  'outline-success': {\n    color: tokens.colorPaletteGreenForeground2,\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.colorPaletteDarkOrangeForeground2),\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.colorPaletteGreenBackground2),\n  },\n  'tint-warning': {\n    backgroundColor: tokens.colorPaletteYellowBackground1,\n    color: tokens.colorPaletteYellowForeground2,\n    ...shorthands.borderColor(tokens.colorPaletteYellowBackground2),\n  },\n});\n\nconst useIconStyles = makeStyles({\n  base: {\n    display: 'flex',\n    alignContent: 'center',\n    alignItems: 'center',\n    height: '100%',\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    fontSize: '12px',\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  const rootStyles = useRootStyles();\n\n  state.root.className = mergeClasses(\n    badgeClassName,\n    rootStyles.base,\n    rootStyles[state.size],\n    rootStyles[state.shape],\n    state.shape === 'rounded' &&\n      (state.size === 'small' || state.size === 'extra-small' || state.size === 'tiny') &&\n      rootStyles.roundedSmallToTiny,\n    rootStyles[state.appearance],\n    rootStyles[`${state.appearance}-${state.color}` as const],\n    state.root.className,\n  );\n\n  const iconStyles = useIconStyles();\n  if (state.icon) {\n    state.icon.className = mergeClasses(iconStyles.base, iconStyles[state.size], state.icon.className);\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

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

@@ -0,0 +1,6 @@
+import type { CounterBadgeProps } from './CounterBadge.types';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+/**
+ * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.
+ */
+export declare const CounterBadge: ForwardRefComponent<CounterBadgeProps>;

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

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CounterBadge = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useCounterBadge_1 = /*#__PURE__*/require("./useCounterBadge");
+
+const useCounterBadgeStyles_1 = /*#__PURE__*/require("./useCounterBadgeStyles");
+
+const index_1 = /*#__PURE__*/require("../Badge/index");
+/**
+ * Define a styled CounterBadge, using the `useCounterBadge_unstable` hook.
+ */
+
+
+exports.CounterBadge = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useCounterBadge_1.useCounterBadge_unstable(props, ref);
+  useCounterBadgeStyles_1.useCounterBadgeStyles_unstable(state);
+  return index_1.renderBadge_unstable(state);
+});
+exports.CounterBadge.displayName = 'CounterBadge';
+//# sourceMappingURL=CounterBadge.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/CounterBadge/CounterBadge.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,YAAA,gBAAuD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAClG,QAAM,KAAK,GAAG,iBAAA,CAAA,wBAAA,CAAyB,KAAzB,EAAgC,GAAhC,CAAd;AACA,EAAA,uBAAA,CAAA,8BAAA,CAA+B,KAA/B;AAEA,SAAO,OAAA,CAAA,oBAAA,CAAqB,KAArB,CAAP;AACD,CALmE,CAAvD;AAOb,OAAA,CAAA,YAAA,CAAa,WAAb,GAA2B,cAA3B","sourcesContent":["import * as React from 'react';\nimport { useCounterBadge_unstable } from './useCounterBadge';\nimport { useCounterBadgeStyles_unstable } from './useCounterBadgeStyles';\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  useCounterBadgeStyles_unstable(state);\n\n  return renderBadge_unstable(state);\n});\n\nCounterBadge.displayName = 'CounterBadge';\n"],"sourceRoot":"../src/"}

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

@@ -0,0 +1,41 @@
+import type { BadgeProps, BadgeState } from '../Badge/index';
+declare type CounterBadgeCommons = {
+    /**
+     * Max number to be displayed
+     * @default 99
+     */
+    overflowCount: number;
+    /**
+     * Value displayed by the Badge
+     * @default 0
+     */
+    count: number;
+    /**
+     * If the badge should be shown when count is 0
+     * @default false
+     */
+    showZero: boolean;
+    /**
+     * If a dot should be displayed without the count
+     * @default false
+     */
+    dot: boolean;
+    /**
+     * A Badge can be circular or rounded
+     * @default circular
+     */
+    shape: 'circular' | 'rounded';
+    /**
+     * A Badge can be filled, ghost
+     * @default filled
+     */
+    appearance: 'filled' | 'ghost';
+    /**
+     * Semantic colors for a counter badge
+     * @default brand
+     */
+    color: Extract<BadgeProps['color'], 'brand' | 'danger' | 'important' | 'informative'>;
+};
+export declare type CounterBadgeProps = Omit<BadgeProps, 'appearance' | 'shape' | 'color'> & Partial<CounterBadgeCommons>;
+export declare type CounterBadgeState = Omit<BadgeState, 'appearance' | 'shape' | 'color'> & CounterBadgeCommons;
+export {};

package/lib-commonjs/components/CounterBadge/CounterBadge.types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=CounterBadge.types.js.map

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

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

package/lib-commonjs/components/CounterBadge/index.d.ts

@@ -0,0 +1,4 @@
+export * from './CounterBadge';
+export * from './CounterBadge.types';
+export * from './useCounterBadge';
+export * from './useCounterBadgeStyles';

package/lib-commonjs/components/CounterBadge/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+const tslib_1 = /*#__PURE__*/require("tslib");
+
+tslib_1.__exportStar(require("./CounterBadge"), exports);
+
+tslib_1.__exportStar(require("./CounterBadge.types"), exports);
+
+tslib_1.__exportStar(require("./useCounterBadge"), exports);
+
+tslib_1.__exportStar(require("./useCounterBadgeStyles"), exports);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["components/CounterBadge/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,gBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,yBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './CounterBadge';\nexport * from './CounterBadge.types';\nexport * from './useCounterBadge';\nexport * from './useCounterBadgeStyles';\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/CounterBadge/useCounterBadge.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import type { CounterBadgeProps, CounterBadgeState } from './CounterBadge.types';
+/**
+ * Returns the props and state required to render the component
+ */
+export declare const useCounterBadge_unstable: (props: CounterBadgeProps, ref: React.Ref<HTMLElement>) => CounterBadgeState;

package/lib-commonjs/components/CounterBadge/useCounterBadge.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCounterBadge_unstable = void 0;
+
+const index_1 = /*#__PURE__*/require("../Badge/index");
+/**
+ * Returns the props and state required to render the component
+ */
+
+
+const useCounterBadge_unstable = (props, ref) => {
+  const {
+    shape = 'circular',
+    appearance = 'filled',
+    showZero = false,
+    overflowCount = 99,
+    count = 0,
+    dot = false
+  } = props;
+  const state = { ...index_1.useBadge_unstable(props, ref),
+    shape,
+    appearance,
+    showZero,
+    overflowCount,
+    count,
+    dot
+  };
+
+  if (!state.dot && !state.root.children) {
+    state.root.children = state.count > state.overflowCount ? `${state.overflowCount}+` : `${state.count}`;
+  }
+
+  return state;
+};
+
+exports.useCounterBadge_unstable = useCounterBadge_unstable;
+//# sourceMappingURL=useCounterBadge.js.map

package/lib-commonjs/components/CounterBadge/useCounterBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["components/CounterBadge/useCounterBadge.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,wBAAwB,GAAG,CAAC,KAAD,EAA2B,GAA3B,KAA6E;AACnH,QAAM;AACJ,IAAA,KAAK,GAAG,UADJ;AAEJ,IAAA,UAAU,GAAG,QAFT;AAGJ,IAAA,QAAQ,GAAG,KAHP;AAIJ,IAAA,aAAa,GAAG,EAJZ;AAKJ,IAAA,KAAK,GAAG,CALJ;AAMJ,IAAA,GAAG,GAAG;AANF,MAOF,KAPJ;AASA,QAAM,KAAK,GAAsB,EAC/B,GAAI,OAAA,CAAA,iBAAA,CAAkB,KAAlB,EAAyB,GAAzB,CAD2B;AAE/B,IAAA,KAF+B;AAG/B,IAAA,UAH+B;AAI/B,IAAA,QAJ+B;AAK/B,IAAA,aAL+B;AAM/B,IAAA,KAN+B;AAO/B,IAAA;AAP+B,GAAjC;;AAUA,MAAI,CAAC,KAAK,CAAC,GAAP,IAAc,CAAC,KAAK,CAAC,IAAN,CAAW,QAA9B,EAAwC;AACtC,IAAA,KAAK,CAAC,IAAN,CAAW,QAAX,GAAsB,KAAK,CAAC,KAAN,GAAc,KAAK,CAAC,aAApB,GAAoC,GAAG,KAAK,CAAC,aAAa,GAA1D,GAAgE,GAAG,KAAK,CAAC,KAAK,EAApG;AACD;;AAED,SAAO,KAAP;AACD,CAzBM;;AAAM,OAAA,CAAA,wBAAA,GAAwB,wBAAxB","sourcesContent":["import * as React from 'react';\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 CounterBadgeState),\n    shape,\n    appearance,\n    showZero,\n    overflowCount,\n    count,\n    dot,\n  };\n\n  if (!state.dot && !state.root.children) {\n    state.root.children = state.count > state.overflowCount ? `${state.overflowCount}+` : `${state.count}`;\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}

package/lib-commonjs/components/CounterBadge/useCounterBadgeStyles.d.ts

@@ -0,0 +1,6 @@
+import type { CounterBadgeState } from './CounterBadge.types';
+export declare const counterBadgeClassName = "fui-CounterBadge";
+/**
+ * Applies style classnames to slots
+ */
+export declare const useCounterBadgeStyles_unstable: (state: CounterBadgeState) => CounterBadgeState;