@fluentui/react-avatar 9.4.10 → 9.5.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-avatar",
-  "version": "9.4.10",
+  "version": "9.5.1",
   "description": "React components for building Microsoft web experiences.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -24,28 +24,29 @@
     "test": "jest --passWithNoTests",
     "storybook": "start-storybook",
     "type-check": "tsc -b tsconfig.json",
-    "generate-api": "just-scripts generate-api"
+    "generate-api": "just-scripts generate-api",
+    "test-ssr": "test-ssr ./stories/**/*.stories.tsx"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "9.0.0-beta.20",
+    "@fluentui/react-conformance-griffel": "9.0.0-beta.21",
     "es6-weak-map": "^2.0.2",
     "@fluentui/scripts-api-extractor": "*",
     "@fluentui/scripts-cypress": "*",
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-badge": "^9.1.10",
-    "@fluentui/react-context-selector": "^9.1.18",
+    "@fluentui/react-badge": "^9.1.12",
+    "@fluentui/react-context-selector": "^9.1.20",
     "@fluentui/react-icons": "^2.0.196",
-    "@fluentui/react-popover": "^9.5.10",
-    "@fluentui/react-shared-contexts": "^9.3.3",
-    "@fluentui/react-tabster": "^9.6.5",
-    "@fluentui/react-theme": "^9.1.7",
-    "@fluentui/react-tooltip": "^9.2.10",
-    "@fluentui/react-utilities": "^9.8.0",
-    "@fluentui/react-jsx-runtime": "9.0.0-alpha.2",
+    "@fluentui/react-popover": "^9.5.12",
+    "@fluentui/react-shared-contexts": "^9.4.0",
+    "@fluentui/react-tabster": "^9.7.1",
+    "@fluentui/react-theme": "^9.1.8",
+    "@fluentui/react-tooltip": "^9.2.12",
+    "@fluentui/react-utilities": "^9.9.0",
+    "@fluentui/react-jsx-runtime": "9.0.0-alpha.4",
     "@griffel/react": "^1.5.2",
     "@swc/helpers": "^0.4.14"
   },

package/.swcrc

@@ -1,30 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/swcrc",
-  "exclude": [
-    "/testing",
-    "/**/*.cy.ts",
-    "/**/*.cy.tsx",
-    "/**/*.spec.ts",
-    "/**/*.spec.tsx",
-    "/**/*.test.ts",
-    "/**/*.test.tsx"
-  ],
-  "jsc": {
-    "parser": {
-      "syntax": "typescript",
-      "tsx": true,
-      "decorators": false,
-      "dynamicImport": false
-    },
-    "externalHelpers": true,
-    "transform": {
-      "react": {
-        "runtime": "classic",
-        "useSpread": true
-      }
-    },
-    "target": "es2019"
-  },
-  "minify": false,
-  "sourceMaps": true
-}

package/lib/components/Avatar/useAvatarStyles.js

@@ -1,493 +0,0 @@
-import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
-export const avatarClassNames = {
-  root: 'fui-Avatar',
-  image: 'fui-Avatar__image',
-  initials: 'fui-Avatar__initials',
-  icon: 'fui-Avatar__icon',
-  badge: 'fui-Avatar__badge'
-};
-const useRootClassName = /*#__PURE__*/__resetStyles("rz243wu", null, [".rz243wu{display:inline-block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;position:relative;vertical-align:middle;border-radius:var(--borderRadiusCircular);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);font-size:var(--fontSizeBase300);width:32px;height:32px;}"]);
-const useImageClassName = /*#__PURE__*/__resetStyles("r136dc0n", "rjly0nl", [".r136dc0n{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;object-fit:cover;vertical-align:top;}", ".rjly0nl{position:absolute;top:0;right:0;width:100%;height:100%;border-radius:inherit;object-fit:cover;vertical-align:top;}"]);
-const useIconInitialsClassName = /*#__PURE__*/__resetStyles("rip04v", "r31uzil", [".rip04v{position:absolute;box-sizing:border-box;top:0;left:0;width:100%;height:100%;line-height:1;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;vertical-align:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:inherit;}", ".r31uzil{position:absolute;box-sizing:border-box;top:0;right:0;width:100%;height:100%;line-height:1;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;vertical-align:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:inherit;}"]);
-const useStyles = /*#__PURE__*/__styles({
-  textCaption2Strong: {
-    Be2twd7: "f13mqy1h"
-  },
-  textCaption1Strong: {
-    Be2twd7: "fy9rknc"
-  },
-  textSubtitle2: {
-    Be2twd7: "fod5ikn"
-  },
-  textSubtitle1: {
-    Be2twd7: "f1pp30po"
-  },
-  textTitle3: {
-    Be2twd7: "f1x0m3f5"
-  },
-  squareSmall: {
-    Bbmb7ep: ["f1g3puop", "fi2rrw2"],
-    Beyfa6y: ["fi2rrw2", "f1g3puop"],
-    B7oj6ja: ["f1rstyi9", "f1s4nn1u"],
-    Btl43ni: ["f1s4nn1u", "f1rstyi9"]
-  },
-  squareMedium: {
-    Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
-    Beyfa6y: ["f16jpd5f", "f1aa9q02"],
-    B7oj6ja: ["f1jar5jt", "fyu767a"],
-    Btl43ni: ["fyu767a", "f1jar5jt"]
-  },
-  squareLarge: {
-    Bbmb7ep: ["f1ldthgs", "frrelxk"],
-    Beyfa6y: ["frrelxk", "f1ldthgs"],
-    B7oj6ja: ["fobrfso", "ffisxpw"],
-    Btl43ni: ["ffisxpw", "fobrfso"]
-  },
-  squareXLarge: {
-    Bbmb7ep: ["fnivh3a", "fc7yr5o"],
-    Beyfa6y: ["fc7yr5o", "fnivh3a"],
-    B7oj6ja: ["f1el4m67", "f8yange"],
-    Btl43ni: ["f8yange", "f1el4m67"]
-  },
-  activeOrInactive: {
-    Bz10aip: "ftfx35i",
-    Bmy1vo4: "fv0atk9",
-    B3o57yi: "f1iry5bo",
-    Bkqvd7p: "f15n41j8",
-    Hwfdqs: "f1onx1g3",
-    Ftih45: "f1wl9k8s",
-    Brfgrao: "f1j7ml58",
-    Bciustq: "ffi060y",
-    Fbdkly: ["f1fzr1x6", "f1f351id"],
-    lawp4y: "fchca7p",
-    mdwyqc: ["f1f351id", "f1fzr1x6"],
-    Budzafs: ["f1kd9phw", "fyf2ch2"],
-    r59vdv: ["fyf2ch2", "f1kd9phw"],
-    n07z76: ["f1gnrg9b", "f1xx2lx6"],
-    ck0cow: ["f1xx2lx6", "f1gnrg9b"],
-    B8bqphf: "f1e9wvyh",
-    h7gv66: "f1vyz52m",
-    wjn42g: "f1s8xkrt",
-    B1pumaf: "f1ak47q9"
-  },
-  ring: {
-    Bdkvgpv: "f163fonl",
-    m598lv: ["f1yq6w5o", "f1jpmc5p"],
-    qa3bma: "f11yjt3y",
-    Bbv0w2i: ["f1jpmc5p", "f1yq6w5o"]
-  },
-  ringThick: {
-    qehafq: "f1rbtjc9",
-    Bicfajf: ["f1wm0e7m", "f1o0l8kp"],
-    susq4k: "f1tz5420",
-    Biibvgv: ["f1o0l8kp", "f1wm0e7m"],
-    B0qfbqy: "f1q30tuz",
-    B4f6apu: ["f9c0djs", "fcwzx2y"],
-    y0oebl: "f1hdqo1a",
-    uvfttm: ["fcwzx2y", "f9c0djs"]
-  },
-  ringThicker: {
-    qehafq: "fk7ejgl",
-    Bicfajf: ["f12sbt0w", "f1tnh028"],
-    susq4k: "fcrsff4",
-    Biibvgv: ["f1tnh028", "f12sbt0w"],
-    B0qfbqy: "f1jrge4j",
-    B4f6apu: ["fc2vpa6", "f133djwz"],
-    y0oebl: "f9hcsm3",
-    uvfttm: ["f133djwz", "fc2vpa6"]
-  },
-  ringThickest: {
-    qehafq: "fl3e39p",
-    Bicfajf: ["f14m8wrz", "fckzhtt"],
-    susq4k: "fnxq6pw",
-    Biibvgv: ["fckzhtt", "f14m8wrz"],
-    B0qfbqy: "fr6r3yi",
-    B4f6apu: ["ftxoq8w", "f4gs2h8"],
-    y0oebl: "f9gga8r",
-    uvfttm: ["f4gs2h8", "ftxoq8w"]
-  },
-  shadow4: {
-    h8m2vh: "f196qwgu"
-  },
-  shadow8: {
-    h8m2vh: "fut48mo"
-  },
-  shadow16: {
-    h8m2vh: "fh2kfig"
-  },
-  shadow28: {
-    h8m2vh: "f4c2u2p"
-  },
-  inactive: {
-    abs64n: "fp25eh",
-    Bz10aip: "f1clczzi",
-    Bkqvd7p: "f1l3s34x",
-    qehafq: "fe3o830",
-    Bicfajf: ["fzynn9s", "f1z0ukd1"],
-    susq4k: "f1kyqvp9",
-    Biibvgv: ["f1z0ukd1", "fzynn9s"],
-    vz82u: "f1dhznln",
-    wjn42g: "f1iysauc"
-  },
-  badge: {
-    qhf8xq: "f1euv43f",
-    B5kzvoi: "f1yab3r1",
-    j35jbq: ["f1e31b4d", "f1vgc2s3"],
-    E5pizo: "ffo9j2l"
-  },
-  badgeLarge: {
-    E5pizo: "f1nayfl2"
-  },
-  icon12: {
-    Be2twd7: "f1ugzwwg"
-  },
-  icon16: {
-    Be2twd7: "f4ybsrx"
-  },
-  icon20: {
-    Be2twd7: "fe5j1ua"
-  },
-  icon24: {
-    Be2twd7: "f1rt2boy"
-  },
-  icon28: {
-    Be2twd7: "f24l1pt"
-  },
-  icon32: {
-    Be2twd7: "ffl51b"
-  },
-  icon48: {
-    Be2twd7: "f18m8u13"
-  }
-}, {
-  d: [".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f1x0m3f5{font-size:var(--fontSizeBase600);}", ".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);}", ".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);}", ".f1ldthgs{border-bottom-right-radius:var(--borderRadiusLarge);}", ".frrelxk{border-bottom-left-radius:var(--borderRadiusLarge);}", ".fobrfso{border-top-right-radius:var(--borderRadiusLarge);}", ".ffisxpw{border-top-left-radius:var(--borderRadiusLarge);}", ".fnivh3a{border-bottom-right-radius:var(--borderRadiusXLarge);}", ".fc7yr5o{border-bottom-left-radius:var(--borderRadiusXLarge);}", ".f1el4m67{border-top-right-radius:var(--borderRadiusXLarge);}", ".f8yange{border-top-left-radius:var(--borderRadiusXLarge);}", ".ftfx35i{-webkit-transform:perspective(1px);-moz-transform:perspective(1px);-ms-transform:perspective(1px);transform:perspective(1px);}", ".fv0atk9{transition-property:transform,opacity;}", ".f1iry5bo{transition-duration:var(--durationUltraSlow),var(--durationFaster);}", ".f15n41j8{transition-timing-function:var(--curveEasyEaseMax),var(--curveLinear);}", ".f1wl9k8s::before{content:\"\";}", ".f1j7ml58::before{position:absolute;}", ".ffi060y::before{top:0;}", ".f1fzr1x6::before{left:0;}", ".f1f351id::before{right:0;}", ".fchca7p::before{bottom:0;}", ".f1kd9phw::before{border-bottom-right-radius:inherit;}", ".fyf2ch2::before{border-bottom-left-radius:inherit;}", ".f1gnrg9b::before{border-top-right-radius:inherit;}", ".f1xx2lx6::before{border-top-left-radius:inherit;}", ".f1e9wvyh::before{transition-property:margin,opacity;}", ".f1vyz52m::before{transition-duration:var(--durationUltraSlow),var(--durationSlower);}", ".f1s8xkrt::before{transition-timing-function:var(--curveEasyEaseMax),var(--curveLinear);}", ".f163fonl::before{border-top-style:solid;}", ".f1yq6w5o::before{border-right-style:solid;}", ".f1jpmc5p::before{border-left-style:solid;}", ".f11yjt3y::before{border-bottom-style:solid;}", ".f1rbtjc9::before{margin-top:calc(-2 * var(--strokeWidthThick));}", ".f1wm0e7m::before{margin-right:calc(-2 * var(--strokeWidthThick));}", ".f1o0l8kp::before{margin-left:calc(-2 * var(--strokeWidthThick));}", ".f1tz5420::before{margin-bottom:calc(-2 * var(--strokeWidthThick));}", ".f1q30tuz::before{border-top-width:var(--strokeWidthThick);}", ".f9c0djs::before{border-right-width:var(--strokeWidthThick);}", ".fcwzx2y::before{border-left-width:var(--strokeWidthThick);}", ".f1hdqo1a::before{border-bottom-width:var(--strokeWidthThick);}", ".fk7ejgl::before{margin-top:calc(-2 * var(--strokeWidthThicker));}", ".f12sbt0w::before{margin-right:calc(-2 * var(--strokeWidthThicker));}", ".f1tnh028::before{margin-left:calc(-2 * var(--strokeWidthThicker));}", ".fcrsff4::before{margin-bottom:calc(-2 * var(--strokeWidthThicker));}", ".f1jrge4j::before{border-top-width:var(--strokeWidthThicker);}", ".fc2vpa6::before{border-right-width:var(--strokeWidthThicker);}", ".f133djwz::before{border-left-width:var(--strokeWidthThicker);}", ".f9hcsm3::before{border-bottom-width:var(--strokeWidthThicker);}", ".fl3e39p::before{margin-top:calc(-2 * var(--strokeWidthThickest));}", ".f14m8wrz::before{margin-right:calc(-2 * var(--strokeWidthThickest));}", ".fckzhtt::before{margin-left:calc(-2 * var(--strokeWidthThickest));}", ".fnxq6pw::before{margin-bottom:calc(-2 * var(--strokeWidthThickest));}", ".fr6r3yi::before{border-top-width:var(--strokeWidthThickest);}", ".ftxoq8w::before{border-right-width:var(--strokeWidthThickest);}", ".f4gs2h8::before{border-left-width:var(--strokeWidthThickest);}", ".f9gga8r::before{border-bottom-width:var(--strokeWidthThickest);}", ".f196qwgu::before{box-shadow:var(--shadow4);}", ".fut48mo::before{box-shadow:var(--shadow8);}", ".fh2kfig::before{box-shadow:var(--shadow16);}", ".f4c2u2p::before{box-shadow:var(--shadow28);}", ".fp25eh{opacity:0.8;}", ".f1clczzi{-webkit-transform:scale(0.875);-moz-transform:scale(0.875);-ms-transform:scale(0.875);transform:scale(0.875);}", ".f1l3s34x{transition-timing-function:var(--curveDecelerateMin),var(--curveLinear);}", ".fe3o830::before{margin-top:0;}", ".fzynn9s::before{margin-right:0;}", ".f1z0ukd1::before{margin-left:0;}", ".f1kyqvp9::before{margin-bottom:0;}", ".f1dhznln::before{opacity:0;}", ".f1iysauc::before{transition-timing-function:var(--curveDecelerateMin),var(--curveLinear);}", ".f1euv43f{position:absolute;}", ".f1yab3r1{bottom:0;}", ".f1e31b4d{right:0;}", ".f1vgc2s3{left:0;}", ".ffo9j2l{box-shadow:0 0 0 var(--strokeWidthThin) var(--colorNeutralBackground1);}", ".f1nayfl2{box-shadow:0 0 0 var(--strokeWidthThick) var(--colorNeutralBackground1);}", ".f1ugzwwg{font-size:12px;}", ".f4ybsrx{font-size:16px;}", ".fe5j1ua{font-size:20px;}", ".f1rt2boy{font-size:24px;}", ".f24l1pt{font-size:28px;}", ".ffl51b{font-size:32px;}", ".f18m8u13{font-size:48px;}"],
-  m: [["@media screen and (prefers-reduced-motion: reduce){.f1onx1g3{transition-duration:0.01ms;}}", {
-    m: "screen and (prefers-reduced-motion: reduce)"
-  }], ["@media screen and (prefers-reduced-motion: reduce){.f1ak47q9::before{transition-duration:0.01ms;}}", {
-    m: "screen and (prefers-reduced-motion: reduce)"
-  }]]
-});
-export const useSizeStyles = /*#__PURE__*/__styles({
-  "16": {
-    a9b677: "fjw5fx7",
-    Bqenvij: "fd461yt"
-  },
-  "20": {
-    a9b677: "f64fuq3",
-    Bqenvij: "fjamq6b"
-  },
-  "24": {
-    a9b677: "fq4mcun",
-    Bqenvij: "frvgh55"
-  },
-  "28": {
-    a9b677: "f1w9dchk",
-    Bqenvij: "fxldao9"
-  },
-  "32": {
-    a9b677: "f1szoe96",
-    Bqenvij: "f1d2rq10"
-  },
-  "36": {
-    a9b677: "fpdz1er",
-    Bqenvij: "f8ljn23"
-  },
-  "40": {
-    a9b677: "feqmc2u",
-    Bqenvij: "fbhnoac"
-  },
-  "48": {
-    a9b677: "f124akge",
-    Bqenvij: "ff2sm71"
-  },
-  "56": {
-    a9b677: "f1u66zr1",
-    Bqenvij: "fzki0ko"
-  },
-  "64": {
-    a9b677: "fa9ln6p",
-    Bqenvij: "f16k9i2m"
-  },
-  "72": {
-    a9b677: "fhcae8x",
-    Bqenvij: "f1shusfg"
-  },
-  "96": {
-    a9b677: "f1kyr2gn",
-    Bqenvij: "fypu0ge"
-  },
-  "120": {
-    a9b677: "fwfqyga",
-    Bqenvij: "fjr5b71"
-  },
-  "128": {
-    a9b677: "f1iksgmy",
-    Bqenvij: "fele2au"
-  }
-}, {
-  d: [".fjw5fx7{width:16px;}", ".fd461yt{height:16px;}", ".f64fuq3{width:20px;}", ".fjamq6b{height:20px;}", ".fq4mcun{width:24px;}", ".frvgh55{height:24px;}", ".f1w9dchk{width:28px;}", ".fxldao9{height:28px;}", ".f1szoe96{width:32px;}", ".f1d2rq10{height:32px;}", ".fpdz1er{width:36px;}", ".f8ljn23{height:36px;}", ".feqmc2u{width:40px;}", ".fbhnoac{height:40px;}", ".f124akge{width:48px;}", ".ff2sm71{height:48px;}", ".f1u66zr1{width:56px;}", ".fzki0ko{height:56px;}", ".fa9ln6p{width:64px;}", ".f16k9i2m{height:64px;}", ".fhcae8x{width:72px;}", ".f1shusfg{height:72px;}", ".f1kyr2gn{width:96px;}", ".fypu0ge{height:96px;}", ".fwfqyga{width:120px;}", ".fjr5b71{height:120px;}", ".f1iksgmy{width:128px;}", ".fele2au{height:128px;}"]
-});
-const useColorStyles = /*#__PURE__*/__styles({
-  neutral: {
-    sj55zd: "f11d4kpn",
-    De3pzq: "f18f03hv",
-    Bic5iru: "f1uuiafn"
-  },
-  brand: {
-    sj55zd: "fonrgv7",
-    De3pzq: "f1blnnmj",
-    Bic5iru: "f1uuiafn"
-  },
-  "dark-red": {
-    sj55zd: "fqjd1y1",
-    De3pzq: "f1vq2oo4",
-    Bic5iru: "f1t2x9on"
-  },
-  cranberry: {
-    sj55zd: "fg9gses",
-    De3pzq: "f1lwxszt",
-    Bic5iru: "f1pvshc9"
-  },
-  red: {
-    sj55zd: "f23f7i0",
-    De3pzq: "f1q9qhfq",
-    Bic5iru: "f1ectbk9"
-  },
-  pumpkin: {
-    sj55zd: "fjnan08",
-    De3pzq: "fz91bi3",
-    Bic5iru: "fvzpl0b"
-  },
-  peach: {
-    sj55zd: "fknu15p",
-    De3pzq: "f1b9nr51",
-    Bic5iru: "fwj2kd7"
-  },
-  marigold: {
-    sj55zd: "f9603vw",
-    De3pzq: "f3z4w6d",
-    Bic5iru: "fr120vy"
-  },
-  gold: {
-    sj55zd: "fmq0uwp",
-    De3pzq: "fg50kya",
-    Bic5iru: "f8xmmar"
-  },
-  brass: {
-    sj55zd: "f28g5vo",
-    De3pzq: "f4w2gd0",
-    Bic5iru: "f1hbety2"
-  },
-  brown: {
-    sj55zd: "ftl572b",
-    De3pzq: "f14wu1f4",
-    Bic5iru: "f1vg3s4g"
-  },
-  forest: {
-    sj55zd: "f1gymlvd",
-    De3pzq: "f19ut4y6",
-    Bic5iru: "f1m3olm5"
-  },
-  seafoam: {
-    sj55zd: "fnnb6wn",
-    De3pzq: "f1n057jc",
-    Bic5iru: "f17xiqtr"
-  },
-  "dark-green": {
-    sj55zd: "ff58qw8",
-    De3pzq: "f11t05wk",
-    Bic5iru: "fx32vyh"
-  },
-  "light-teal": {
-    sj55zd: "f1up9qbj",
-    De3pzq: "f42feg1",
-    Bic5iru: "f1mkihwv"
-  },
-  teal: {
-    sj55zd: "f135dsb4",
-    De3pzq: "f6hvv1p",
-    Bic5iru: "fecnooh"
-  },
-  steel: {
-    sj55zd: "f151dlcp",
-    De3pzq: "f1lnp8zf",
-    Bic5iru: "f15hfgzm"
-  },
-  blue: {
-    sj55zd: "f1rjv50u",
-    De3pzq: "f1ggcpy6",
-    Bic5iru: "fqproka"
-  },
-  "royal-blue": {
-    sj55zd: "f1emykk5",
-    De3pzq: "f12rj61f",
-    Bic5iru: "f17v2w59"
-  },
-  cornflower: {
-    sj55zd: "fqsigj7",
-    De3pzq: "f8k7hur",
-    Bic5iru: "fp0q1mo"
-  },
-  navy: {
-    sj55zd: "f1nj97xi",
-    De3pzq: "f19gw0ux",
-    Bic5iru: "f1nlym55"
-  },
-  lavender: {
-    sj55zd: "fwctg0i",
-    De3pzq: "ff379vm",
-    Bic5iru: "f62vk8h"
-  },
-  purple: {
-    sj55zd: "fjrsgpu",
-    De3pzq: "f1mzf1e1",
-    Bic5iru: "f15zl69q"
-  },
-  grape: {
-    sj55zd: "f1fiiydq",
-    De3pzq: "f1o4k8oy",
-    Bic5iru: "f53w4j7"
-  },
-  lilac: {
-    sj55zd: "f1res9jt",
-    De3pzq: "f1x6mz1o",
-    Bic5iru: "fu2771t"
-  },
-  pink: {
-    sj55zd: "fv3fbbi",
-    De3pzq: "fydlv6t",
-    Bic5iru: "fzflscs"
-  },
-  magenta: {
-    sj55zd: "f1f1fwnz",
-    De3pzq: "f4xb6j5",
-    Bic5iru: "fb6rmqc"
-  },
-  plum: {
-    sj55zd: "f8ptl6j",
-    De3pzq: "fqo8e26",
-    Bic5iru: "f1a4gm5b"
-  },
-  beige: {
-    sj55zd: "f1ntv3ld",
-    De3pzq: "f101elhj",
-    Bic5iru: "f1qpf9z1"
-  },
-  mink: {
-    sj55zd: "f1fscmp",
-    De3pzq: "f13g8o5c",
-    Bic5iru: "f1l7or83"
-  },
-  platinum: {
-    sj55zd: "f1dr00v2",
-    De3pzq: "fkh7blw",
-    Bic5iru: "fzrj0iu"
-  },
-  anchor: {
-    sj55zd: "f1f3ti53",
-    De3pzq: "fu4yj0j",
-    Bic5iru: "f8oz6wf"
-  }
-}, {
-  d: [".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f18f03hv{background-color:var(--colorNeutralBackground6);}", ".f1uuiafn::before{color:var(--colorBrandStroke1);}", ".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}", ".f1blnnmj{background-color:var(--colorBrandBackgroundStatic);}", ".fqjd1y1{color:var(--colorPaletteDarkRedForeground2);}", ".f1vq2oo4{background-color:var(--colorPaletteDarkRedBackground2);}", ".f1t2x9on::before{color:var(--colorPaletteDarkRedBorderActive);}", ".fg9gses{color:var(--colorPaletteCranberryForeground2);}", ".f1lwxszt{background-color:var(--colorPaletteCranberryBackground2);}", ".f1pvshc9::before{color:var(--colorPaletteCranberryBorderActive);}", ".f23f7i0{color:var(--colorPaletteRedForeground2);}", ".f1q9qhfq{background-color:var(--colorPaletteRedBackground2);}", ".f1ectbk9::before{color:var(--colorPaletteRedBorderActive);}", ".fjnan08{color:var(--colorPalettePumpkinForeground2);}", ".fz91bi3{background-color:var(--colorPalettePumpkinBackground2);}", ".fvzpl0b::before{color:var(--colorPalettePumpkinBorderActive);}", ".fknu15p{color:var(--colorPalettePeachForeground2);}", ".f1b9nr51{background-color:var(--colorPalettePeachBackground2);}", ".fwj2kd7::before{color:var(--colorPalettePeachBorderActive);}", ".f9603vw{color:var(--colorPaletteMarigoldForeground2);}", ".f3z4w6d{background-color:var(--colorPaletteMarigoldBackground2);}", ".fr120vy::before{color:var(--colorPaletteMarigoldBorderActive);}", ".fmq0uwp{color:var(--colorPaletteGoldForeground2);}", ".fg50kya{background-color:var(--colorPaletteGoldBackground2);}", ".f8xmmar::before{color:var(--colorPaletteGoldBorderActive);}", ".f28g5vo{color:var(--colorPaletteBrassForeground2);}", ".f4w2gd0{background-color:var(--colorPaletteBrassBackground2);}", ".f1hbety2::before{color:var(--colorPaletteBrassBorderActive);}", ".ftl572b{color:var(--colorPaletteBrownForeground2);}", ".f14wu1f4{background-color:var(--colorPaletteBrownBackground2);}", ".f1vg3s4g::before{color:var(--colorPaletteBrownBorderActive);}", ".f1gymlvd{color:var(--colorPaletteForestForeground2);}", ".f19ut4y6{background-color:var(--colorPaletteForestBackground2);}", ".f1m3olm5::before{color:var(--colorPaletteForestBorderActive);}", ".fnnb6wn{color:var(--colorPaletteSeafoamForeground2);}", ".f1n057jc{background-color:var(--colorPaletteSeafoamBackground2);}", ".f17xiqtr::before{color:var(--colorPaletteSeafoamBorderActive);}", ".ff58qw8{color:var(--colorPaletteDarkGreenForeground2);}", ".f11t05wk{background-color:var(--colorPaletteDarkGreenBackground2);}", ".fx32vyh::before{color:var(--colorPaletteDarkGreenBorderActive);}", ".f1up9qbj{color:var(--colorPaletteLightTealForeground2);}", ".f42feg1{background-color:var(--colorPaletteLightTealBackground2);}", ".f1mkihwv::before{color:var(--colorPaletteLightTealBorderActive);}", ".f135dsb4{color:var(--colorPaletteTealForeground2);}", ".f6hvv1p{background-color:var(--colorPaletteTealBackground2);}", ".fecnooh::before{color:var(--colorPaletteTealBorderActive);}", ".f151dlcp{color:var(--colorPaletteSteelForeground2);}", ".f1lnp8zf{background-color:var(--colorPaletteSteelBackground2);}", ".f15hfgzm::before{color:var(--colorPaletteSteelBorderActive);}", ".f1rjv50u{color:var(--colorPaletteBlueForeground2);}", ".f1ggcpy6{background-color:var(--colorPaletteBlueBackground2);}", ".fqproka::before{color:var(--colorPaletteBlueBorderActive);}", ".f1emykk5{color:var(--colorPaletteRoyalBlueForeground2);}", ".f12rj61f{background-color:var(--colorPaletteRoyalBlueBackground2);}", ".f17v2w59::before{color:var(--colorPaletteRoyalBlueBorderActive);}", ".fqsigj7{color:var(--colorPaletteCornflowerForeground2);}", ".f8k7hur{background-color:var(--colorPaletteCornflowerBackground2);}", ".fp0q1mo::before{color:var(--colorPaletteCornflowerBorderActive);}", ".f1nj97xi{color:var(--colorPaletteNavyForeground2);}", ".f19gw0ux{background-color:var(--colorPaletteNavyBackground2);}", ".f1nlym55::before{color:var(--colorPaletteNavyBorderActive);}", ".fwctg0i{color:var(--colorPaletteLavenderForeground2);}", ".ff379vm{background-color:var(--colorPaletteLavenderBackground2);}", ".f62vk8h::before{color:var(--colorPaletteLavenderBorderActive);}", ".fjrsgpu{color:var(--colorPalettePurpleForeground2);}", ".f1mzf1e1{background-color:var(--colorPalettePurpleBackground2);}", ".f15zl69q::before{color:var(--colorPalettePurpleBorderActive);}", ".f1fiiydq{color:var(--colorPaletteGrapeForeground2);}", ".f1o4k8oy{background-color:var(--colorPaletteGrapeBackground2);}", ".f53w4j7::before{color:var(--colorPaletteGrapeBorderActive);}", ".f1res9jt{color:var(--colorPaletteLilacForeground2);}", ".f1x6mz1o{background-color:var(--colorPaletteLilacBackground2);}", ".fu2771t::before{color:var(--colorPaletteLilacBorderActive);}", ".fv3fbbi{color:var(--colorPalettePinkForeground2);}", ".fydlv6t{background-color:var(--colorPalettePinkBackground2);}", ".fzflscs::before{color:var(--colorPalettePinkBorderActive);}", ".f1f1fwnz{color:var(--colorPaletteMagentaForeground2);}", ".f4xb6j5{background-color:var(--colorPaletteMagentaBackground2);}", ".fb6rmqc::before{color:var(--colorPaletteMagentaBorderActive);}", ".f8ptl6j{color:var(--colorPalettePlumForeground2);}", ".fqo8e26{background-color:var(--colorPalettePlumBackground2);}", ".f1a4gm5b::before{color:var(--colorPalettePlumBorderActive);}", ".f1ntv3ld{color:var(--colorPaletteBeigeForeground2);}", ".f101elhj{background-color:var(--colorPaletteBeigeBackground2);}", ".f1qpf9z1::before{color:var(--colorPaletteBeigeBorderActive);}", ".f1fscmp{color:var(--colorPaletteMinkForeground2);}", ".f13g8o5c{background-color:var(--colorPaletteMinkBackground2);}", ".f1l7or83::before{color:var(--colorPaletteMinkBorderActive);}", ".f1dr00v2{color:var(--colorPalettePlatinumForeground2);}", ".fkh7blw{background-color:var(--colorPalettePlatinumBackground2);}", ".fzrj0iu::before{color:var(--colorPalettePlatinumBorderActive);}", ".f1f3ti53{color:var(--colorPaletteAnchorForeground2);}", ".fu4yj0j{background-color:var(--colorPaletteAnchorBackground2);}", ".f8oz6wf::before{color:var(--colorPaletteAnchorBorderActive);}"]
-});
-export const useAvatarStyles_unstable = state => {
-  const {
-    size,
-    shape,
-    active,
-    activeAppearance,
-    color
-  } = state;
-  const rootClassName = useRootClassName();
-  const imageClassName = useImageClassName();
-  const iconInitialsClassName = useIconInitialsClassName();
-  const styles = useStyles();
-  const sizeStyles = useSizeStyles();
-  const colorStyles = useColorStyles();
-  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size], colorStyles[color]];
-  if (size <= 24) {
-    rootClasses.push(styles.textCaption2Strong);
-  } else if (size <= 28) {
-    rootClasses.push(styles.textCaption1Strong);
-  } else if (size <= 40) {
-    // Default text size included in useRootClassName
-  } else if (size <= 56) {
-    rootClasses.push(styles.textSubtitle2);
-  } else if (size <= 96) {
-    rootClasses.push(styles.textSubtitle1);
-  } else {
-    rootClasses.push(styles.textTitle3);
-  }
-  if (shape === 'square') {
-    if (size <= 24) {
-      rootClasses.push(styles.squareSmall);
-    } else if (size <= 48) {
-      rootClasses.push(styles.squareMedium);
-    } else if (size <= 72) {
-      rootClasses.push(styles.squareLarge);
-    } else {
-      rootClasses.push(styles.squareXLarge);
-    }
-  }
-  if (active === 'active' || active === 'inactive') {
-    rootClasses.push(styles.activeOrInactive);
-    if (activeAppearance === 'ring' || activeAppearance === 'ring-shadow') {
-      rootClasses.push(styles.ring);
-      if (size <= 48) {
-        rootClasses.push(styles.ringThick);
-      } else if (size <= 64) {
-        rootClasses.push(styles.ringThicker);
-      } else {
-        rootClasses.push(styles.ringThickest);
-      }
-    }
-    if (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow') {
-      if (size <= 28) {
-        rootClasses.push(styles.shadow4);
-      } else if (size <= 48) {
-        rootClasses.push(styles.shadow8);
-      } else if (size <= 64) {
-        rootClasses.push(styles.shadow16);
-      } else {
-        rootClasses.push(styles.shadow28);
-      }
-    }
-    // Note: The inactive style overrides some of the activeAppearance styles and must be applied after them
-    if (active === 'inactive') {
-      rootClasses.push(styles.inactive);
-    }
-  }
-  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);
-  if (state.badge) {
-    state.badge.className = mergeClasses(avatarClassNames.badge, styles.badge, size >= 64 && styles.badgeLarge, state.badge.className);
-  }
-  if (state.image) {
-    state.image.className = mergeClasses(avatarClassNames.image, imageClassName, state.image.className);
-  }
-  if (state.initials) {
-    state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, state.initials.className);
-  }
-  if (state.icon) {
-    let iconSizeClass;
-    if (size <= 16) {
-      iconSizeClass = styles.icon12;
-    } else if (size <= 24) {
-      iconSizeClass = styles.icon16;
-    } else if (size <= 40) {
-      iconSizeClass = styles.icon20;
-    } else if (size <= 48) {
-      iconSizeClass = styles.icon24;
-    } else if (size <= 56) {
-      iconSizeClass = styles.icon28;
-    } else if (size <= 72) {
-      iconSizeClass = styles.icon32;
-    } else {
-      iconSizeClass = styles.icon48;
-    }
-    state.icon.className = mergeClasses(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, state.icon.className);
-  }
-  return state;
-};
-//# sourceMappingURL=useAvatarStyles.js.map

package/lib/components/Avatar/useAvatarStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","avatarClassNames","root","image","initials","icon","badge","useRootClassName","useImageClassName","useIconInitialsClassName","useStyles","textCaption2Strong","Be2twd7","textCaption1Strong","textSubtitle2","textSubtitle1","textTitle3","squareSmall","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","squareMedium","squareLarge","squareXLarge","activeOrInactive","Bz10aip","Bmy1vo4","B3o57yi","Bkqvd7p","Hwfdqs","Ftih45","Brfgrao","Bciustq","Fbdkly","lawp4y","mdwyqc","Budzafs","r59vdv","n07z76","ck0cow","B8bqphf","h7gv66","wjn42g","B1pumaf","ring","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","ringThick","qehafq","Bicfajf","susq4k","Biibvgv","B0qfbqy","B4f6apu","y0oebl","uvfttm","ringThicker","ringThickest","shadow4","h8m2vh","shadow8","shadow16","shadow28","inactive","abs64n","vz82u","qhf8xq","B5kzvoi","j35jbq","E5pizo","badgeLarge","icon12","icon16","icon20","icon24","icon28","icon32","icon48","d","m","useSizeStyles","a9b677","Bqenvij","useColorStyles","neutral","sj55zd","De3pzq","Bic5iru","brand","cranberry","red","pumpkin","peach","marigold","gold","brass","brown","forest","seafoam","teal","steel","blue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","color","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","rootClasses","push","className","iconSizeClass"],"sources":["../../../src/components/Avatar/useAvatarStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarClassNames: SlotClassNames<AvatarSlots> = {\n  root: 'fui-Avatar',\n  image: 'fui-Avatar__image',\n  initials: 'fui-Avatar__initials',\n  icon: 'fui-Avatar__icon',\n  badge: 'fui-Avatar__badge',\n};\n\nconst useRootClassName = makeResetStyles({\n  display: 'inline-block',\n  flexShrink: 0,\n  position: 'relative',\n  verticalAlign: 'middle',\n  borderRadius: tokens.borderRadiusCircular,\n  fontFamily: tokens.fontFamilyBase,\n  fontWeight: tokens.fontWeightSemibold,\n  fontSize: tokens.fontSizeBase300,\n  width: '32px',\n  height: '32px',\n});\n\nconst useImageClassName = makeResetStyles({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n\n  borderRadius: 'inherit',\n  objectFit: 'cover',\n  verticalAlign: 'top',\n});\n\nconst useIconInitialsClassName = makeResetStyles({\n  position: 'absolute',\n  boxSizing: 'border-box',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n  lineHeight: '1',\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  verticalAlign: 'center',\n  textAlign: 'center',\n  userSelect: 'none',\n  borderRadius: 'inherit',\n});\n\nconst useStyles = makeStyles({\n  textCaption2Strong: { fontSize: tokens.fontSizeBase100 },\n  textCaption1Strong: { fontSize: tokens.fontSizeBase200 },\n  textSubtitle2: { fontSize: tokens.fontSizeBase400 },\n  textSubtitle1: { fontSize: tokens.fontSizeBase500 },\n  textTitle3: { fontSize: tokens.fontSizeBase600 },\n\n  squareSmall: {\n    ...shorthands.borderRadius(tokens.borderRadiusSmall),\n  },\n  squareMedium: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n  },\n  squareLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusLarge),\n  },\n  squareXLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n  },\n\n  activeOrInactive: {\n    transform: 'perspective(1px)', // Work-around for text pixel snapping at the end of the animation\n    transitionProperty: 'transform, opacity',\n    transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n    transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n\n    '::before': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      bottom: 0,\n      right: 0,\n\n      ...shorthands.borderRadius('inherit'),\n      transitionProperty: 'margin, opacity',\n      transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n      transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n      },\n    },\n  },\n\n  ring: {\n    '::before': {\n      ...shorthands.borderStyle('solid'),\n    },\n  },\n  ringThick: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThick})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThick),\n    },\n  },\n  ringThicker: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThicker})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThicker),\n    },\n  },\n  ringThickest: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThickest})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThickest),\n    },\n  },\n\n  shadow4: { '::before': { boxShadow: tokens.shadow4 } },\n  shadow8: { '::before': { boxShadow: tokens.shadow8 } },\n  shadow16: { '::before': { boxShadow: tokens.shadow16 } },\n  shadow28: { '::before': { boxShadow: tokens.shadow28 } },\n\n  inactive: {\n    opacity: '0.8',\n    transform: 'scale(0.875)',\n    transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n\n    '::before': {\n      ...shorthands.margin(0),\n      opacity: 0,\n      transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n    },\n  },\n\n  badge: {\n    position: 'absolute',\n    bottom: 0,\n    right: 0,\n    boxShadow: `0 0 0 ${tokens.strokeWidthThin} ${tokens.colorNeutralBackground1}`,\n  },\n\n  badgeLarge: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralBackground1}`,\n  },\n\n  icon12: { fontSize: '12px' },\n  icon16: { fontSize: '16px' },\n  icon20: { fontSize: '20px' },\n  icon24: { fontSize: '24px' },\n  icon28: { fontSize: '28px' },\n  icon32: { fontSize: '32px' },\n  icon48: { fontSize: '48px' },\n});\n\nexport const useSizeStyles = makeStyles({\n  16: { width: '16px', height: '16px' },\n  20: { width: '20px', height: '20px' },\n  24: { width: '24px', height: '24px' },\n  28: { width: '28px', height: '28px' },\n  32: { width: '32px', height: '32px' },\n  36: { width: '36px', height: '36px' },\n  40: { width: '40px', height: '40px' },\n  48: { width: '48px', height: '48px' },\n  56: { width: '56px', height: '56px' },\n  64: { width: '64px', height: '64px' },\n  72: { width: '72px', height: '72px' },\n  96: { width: '96px', height: '96px' },\n  120: { width: '120px', height: '120px' },\n  128: { width: '128px', height: '128px' },\n});\n\nconst useColorStyles = makeStyles({\n  neutral: {\n    color: tokens.colorNeutralForeground3,\n    backgroundColor: tokens.colorNeutralBackground6,\n    // The ::before element is the ring when active\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  brand: {\n    color: tokens.colorNeutralForegroundStaticInverted,\n    backgroundColor: tokens.colorBrandBackgroundStatic,\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  'dark-red': {\n    color: tokens.colorPaletteDarkRedForeground2,\n    backgroundColor: tokens.colorPaletteDarkRedBackground2,\n    '::before': { color: tokens.colorPaletteDarkRedBorderActive },\n  },\n  cranberry: {\n    color: tokens.colorPaletteCranberryForeground2,\n    backgroundColor: tokens.colorPaletteCranberryBackground2,\n    '::before': { color: tokens.colorPaletteCranberryBorderActive },\n  },\n  red: {\n    color: tokens.colorPaletteRedForeground2,\n    backgroundColor: tokens.colorPaletteRedBackground2,\n    '::before': { color: tokens.colorPaletteRedBorderActive },\n  },\n  pumpkin: {\n    color: tokens.colorPalettePumpkinForeground2,\n    backgroundColor: tokens.colorPalettePumpkinBackground2,\n    '::before': { color: tokens.colorPalettePumpkinBorderActive },\n  },\n  peach: {\n    color: tokens.colorPalettePeachForeground2,\n    backgroundColor: tokens.colorPalettePeachBackground2,\n    '::before': { color: tokens.colorPalettePeachBorderActive },\n  },\n  marigold: {\n    color: tokens.colorPaletteMarigoldForeground2,\n    backgroundColor: tokens.colorPaletteMarigoldBackground2,\n    '::before': { color: tokens.colorPaletteMarigoldBorderActive },\n  },\n  gold: {\n    color: tokens.colorPaletteGoldForeground2,\n    backgroundColor: tokens.colorPaletteGoldBackground2,\n    '::before': { color: tokens.colorPaletteGoldBorderActive },\n  },\n  brass: {\n    color: tokens.colorPaletteBrassForeground2,\n    backgroundColor: tokens.colorPaletteBrassBackground2,\n    '::before': { color: tokens.colorPaletteBrassBorderActive },\n  },\n  brown: {\n    color: tokens.colorPaletteBrownForeground2,\n    backgroundColor: tokens.colorPaletteBrownBackground2,\n    '::before': { color: tokens.colorPaletteBrownBorderActive },\n  },\n  forest: {\n    color: tokens.colorPaletteForestForeground2,\n    backgroundColor: tokens.colorPaletteForestBackground2,\n    '::before': { color: tokens.colorPaletteForestBorderActive },\n  },\n  seafoam: {\n    color: tokens.colorPaletteSeafoamForeground2,\n    backgroundColor: tokens.colorPaletteSeafoamBackground2,\n    '::before': { color: tokens.colorPaletteSeafoamBorderActive },\n  },\n  'dark-green': {\n    color: tokens.colorPaletteDarkGreenForeground2,\n    backgroundColor: tokens.colorPaletteDarkGreenBackground2,\n    '::before': { color: tokens.colorPaletteDarkGreenBorderActive },\n  },\n  'light-teal': {\n    color: tokens.colorPaletteLightTealForeground2,\n    backgroundColor: tokens.colorPaletteLightTealBackground2,\n    '::before': { color: tokens.colorPaletteLightTealBorderActive },\n  },\n  teal: {\n    color: tokens.colorPaletteTealForeground2,\n    backgroundColor: tokens.colorPaletteTealBackground2,\n    '::before': { color: tokens.colorPaletteTealBorderActive },\n  },\n  steel: {\n    color: tokens.colorPaletteSteelForeground2,\n    backgroundColor: tokens.colorPaletteSteelBackground2,\n    '::before': { color: tokens.colorPaletteSteelBorderActive },\n  },\n  blue: {\n    color: tokens.colorPaletteBlueForeground2,\n    backgroundColor: tokens.colorPaletteBlueBackground2,\n    '::before': { color: tokens.colorPaletteBlueBorderActive },\n  },\n  'royal-blue': {\n    color: tokens.colorPaletteRoyalBlueForeground2,\n    backgroundColor: tokens.colorPaletteRoyalBlueBackground2,\n    '::before': { color: tokens.colorPaletteRoyalBlueBorderActive },\n  },\n  cornflower: {\n    color: tokens.colorPaletteCornflowerForeground2,\n    backgroundColor: tokens.colorPaletteCornflowerBackground2,\n    '::before': { color: tokens.colorPaletteCornflowerBorderActive },\n  },\n  navy: {\n    color: tokens.colorPaletteNavyForeground2,\n    backgroundColor: tokens.colorPaletteNavyBackground2,\n    '::before': { color: tokens.colorPaletteNavyBorderActive },\n  },\n  lavender: {\n    color: tokens.colorPaletteLavenderForeground2,\n    backgroundColor: tokens.colorPaletteLavenderBackground2,\n    '::before': { color: tokens.colorPaletteLavenderBorderActive },\n  },\n  purple: {\n    color: tokens.colorPalettePurpleForeground2,\n    backgroundColor: tokens.colorPalettePurpleBackground2,\n    '::before': { color: tokens.colorPalettePurpleBorderActive },\n  },\n  grape: {\n    color: tokens.colorPaletteGrapeForeground2,\n    backgroundColor: tokens.colorPaletteGrapeBackground2,\n    '::before': { color: tokens.colorPaletteGrapeBorderActive },\n  },\n  lilac: {\n    color: tokens.colorPaletteLilacForeground2,\n    backgroundColor: tokens.colorPaletteLilacBackground2,\n    '::before': { color: tokens.colorPaletteLilacBorderActive },\n  },\n  pink: {\n    color: tokens.colorPalettePinkForeground2,\n    backgroundColor: tokens.colorPalettePinkBackground2,\n    '::before': { color: tokens.colorPalettePinkBorderActive },\n  },\n  magenta: {\n    color: tokens.colorPaletteMagentaForeground2,\n    backgroundColor: tokens.colorPaletteMagentaBackground2,\n    '::before': { color: tokens.colorPaletteMagentaBorderActive },\n  },\n  plum: {\n    color: tokens.colorPalettePlumForeground2,\n    backgroundColor: tokens.colorPalettePlumBackground2,\n    '::before': { color: tokens.colorPalettePlumBorderActive },\n  },\n  beige: {\n    color: tokens.colorPaletteBeigeForeground2,\n    backgroundColor: tokens.colorPaletteBeigeBackground2,\n    '::before': { color: tokens.colorPaletteBeigeBorderActive },\n  },\n  mink: {\n    color: tokens.colorPaletteMinkForeground2,\n    backgroundColor: tokens.colorPaletteMinkBackground2,\n    '::before': { color: tokens.colorPaletteMinkBorderActive },\n  },\n  platinum: {\n    color: tokens.colorPalettePlatinumForeground2,\n    backgroundColor: tokens.colorPalettePlatinumBackground2,\n    '::before': { color: tokens.colorPalettePlatinumBorderActive },\n  },\n  anchor: {\n    color: tokens.colorPaletteAnchorForeground2,\n    backgroundColor: tokens.colorPaletteAnchorBackground2,\n    '::before': { color: tokens.colorPaletteAnchorBorderActive },\n  },\n});\n\nexport const useAvatarStyles_unstable = (state: AvatarState): AvatarState => {\n  const { size, shape, active, activeAppearance, color } = state;\n\n  const rootClassName = useRootClassName();\n  const imageClassName = useImageClassName();\n  const iconInitialsClassName = useIconInitialsClassName();\n  const styles = useStyles();\n  const sizeStyles = useSizeStyles();\n  const colorStyles = useColorStyles();\n\n  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size], colorStyles[color]];\n\n  if (size <= 24) {\n    rootClasses.push(styles.textCaption2Strong);\n  } else if (size <= 28) {\n    rootClasses.push(styles.textCaption1Strong);\n  } else if (size <= 40) {\n    // Default text size included in useRootClassName\n  } else if (size <= 56) {\n    rootClasses.push(styles.textSubtitle2);\n  } else if (size <= 96) {\n    rootClasses.push(styles.textSubtitle1);\n  } else {\n    rootClasses.push(styles.textTitle3);\n  }\n\n  if (shape === 'square') {\n    if (size <= 24) {\n      rootClasses.push(styles.squareSmall);\n    } else if (size <= 48) {\n      rootClasses.push(styles.squareMedium);\n    } else if (size <= 72) {\n      rootClasses.push(styles.squareLarge);\n    } else {\n      rootClasses.push(styles.squareXLarge);\n    }\n  }\n\n  if (active === 'active' || active === 'inactive') {\n    rootClasses.push(styles.activeOrInactive);\n\n    if (activeAppearance === 'ring' || activeAppearance === 'ring-shadow') {\n      rootClasses.push(styles.ring);\n\n      if (size <= 48) {\n        rootClasses.push(styles.ringThick);\n      } else if (size <= 64) {\n        rootClasses.push(styles.ringThicker);\n      } else {\n        rootClasses.push(styles.ringThickest);\n      }\n    }\n\n    if (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow') {\n      if (size <= 28) {\n        rootClasses.push(styles.shadow4);\n      } else if (size <= 48) {\n        rootClasses.push(styles.shadow8);\n      } else if (size <= 64) {\n        rootClasses.push(styles.shadow16);\n      } else {\n        rootClasses.push(styles.shadow28);\n      }\n    }\n\n    // Note: The inactive style overrides some of the activeAppearance styles and must be applied after them\n    if (active === 'inactive') {\n      rootClasses.push(styles.inactive);\n    }\n  }\n\n  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n\n  if (state.badge) {\n    state.badge.className = mergeClasses(\n      avatarClassNames.badge,\n      styles.badge,\n      size >= 64 && styles.badgeLarge,\n      state.badge.className,\n    );\n  }\n\n  if (state.image) {\n    state.image.className = mergeClasses(avatarClassNames.image, imageClassName, state.image.className);\n  }\n\n  if (state.initials) {\n    state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, state.initials.className);\n  }\n\n  if (state.icon) {\n    let iconSizeClass;\n    if (size <= 16) {\n      iconSizeClass = styles.icon12;\n    } else if (size <= 24) {\n      iconSizeClass = styles.icon16;\n    } else if (size <= 40) {\n      iconSizeClass = styles.icon20;\n    } else if (size <= 48) {\n      iconSizeClass = styles.icon24;\n    } else if (size <= 56) {\n      iconSizeClass = styles.icon28;\n    } else if (size <= 72) {\n      iconSizeClass = styles.icon32;\n    } else {\n      iconSizeClass = styles.icon48;\n    }\n\n    state.icon.className = mergeClasses(\n      avatarClassNames.icon,\n      iconInitialsClassName,\n      iconSizeClass,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}

package/lib/components/AvatarGroup/useAvatarGroupStyles.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["__styles","mergeClasses","tokens","useSizeStyles","avatarGroupClassNames","root","useStyles","base","mc9l5x","qhf8xq","pie","Bgl5zvf","De3pzq","Bsw6fvg","d","m","useAvatarGroupStyles_unstable","state","layout","size","styles","sizeStyles","className"],"sources":["../../../src/components/AvatarGroup/useAvatarGroupStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles';\nimport type { AvatarGroupSlots, AvatarGroupState } from './AvatarGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupClassNames: SlotClassNames<AvatarGroupSlots> = {\n  root: 'fui-AvatarGroup',\n};\n\n/**\n * Styles for the root slot.\n */\nconst useStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    position: 'relative',\n  },\n  pie: {\n    clipPath: 'circle(50%)',\n    backgroundColor: tokens.colorTransparentStroke,\n    '@media (forced-colors: active)': {\n      backgroundColor: 'CanvasText',\n    },\n  },\n});\n\n/**\n * Apply styling to the AvatarGroup slots based on the state\n */\nexport const useAvatarGroupStyles_unstable = (state: AvatarGroupState): AvatarGroupState => {\n  const { layout, size } = state;\n  const styles = useStyles();\n  const sizeStyles = useSizeStyles();\n\n  state.root.className = mergeClasses(\n    avatarGroupClassNames.root,\n    styles.base,\n    layout === 'pie' && sizeStyles[size],\n    layout === 'pie' && styles.pie,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ;AACzC,SAASC,MAAM,QAAQ;AACvB,SAASC,aAAa,QAAQ;AAI9B,OAAO,MAAMC,qBAAA,GAA0D;EACrEC,IAAA,EAAM;AACR;AAEA;;;AAGA,MAAMC,SAAA,gBAAYN,QAAA;EAAAO,IAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,GAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;AAAA,EAYlB;AAEA;;;AAGA,OAAO,MAAMC,6BAAA,GAAiCC,KAAA,IAA8C;EAC1F,MAAM;IAAEC,MAAA;IAAQC;EAAI,CAAE,GAAGF,KAAA;EACzB,MAAMG,MAAA,GAASd,SAAA;EACf,MAAMe,UAAA,GAAalB,aAAA;EAEnBc,KAAA,CAAMZ,IAAI,CAACiB,SAAS,GAAGrB,YAAA,CACrBG,qBAAA,CAAsBC,IAAI,EAC1Be,MAAA,CAAOb,IAAI,EACXW,MAAA,KAAW,SAASG,UAAU,CAACF,IAAA,CAAK,EACpCD,MAAA,KAAW,SAASE,MAAA,CAAOV,GAAG,EAC9BO,KAAA,CAAMZ,IAAI,CAACiB,SAAS;EAGtB,OAAOL,KAAA;AACT"}