@fluentui/react-tags 0.0.0-nightly-20231004-0414.1

package/lib-commonjs/components/Tag/useTagStyles.styles.js

@@ -0,0 +1,569 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    tagClassNames: function() {
+        return tagClassNames;
+    },
+    useIconStyles: function() {
+        return useIconStyles;
+    },
+    useMediaStyles: function() {
+        return useMediaStyles;
+    },
+    usePrimaryTextStyles: function() {
+        return usePrimaryTextStyles;
+    },
+    useSecondaryTextBaseClassName: function() {
+        return useSecondaryTextBaseClassName;
+    },
+    useTagStyles_unstable: function() {
+        return useTagStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _reacttheme = require("@fluentui/react-theme");
+const tagClassNames = {
+    root: 'fui-Tag',
+    media: 'fui-Tag__media',
+    icon: 'fui-Tag__icon',
+    primaryText: 'fui-Tag__primaryText',
+    secondaryText: 'fui-Tag__secondaryText',
+    dismissIcon: 'fui-Tag__dismissIcon'
+};
+/**
+ * Inner horizontal space left and right of Tag
+ */ const tagSpacingMedium = '7px';
+const tagSpacingSmall = '5px';
+const tagSpacingExtraSmall = '5px';
+const mediumIconSize = '20px';
+const smallIconSize = '16px';
+const extraSmallIconSize = '12px';
+const baseStyles = {
+    // reset default button style:
+    fontFamily: 'inherit',
+    padding: '0px',
+    appearance: 'button',
+    textAlign: 'unset',
+    display: 'inline-grid',
+    alignItems: 'center',
+    gridTemplateAreas: `
+  "media primary   dismissIcon"
+  "media secondary dismissIcon"
+  `,
+    boxSizing: 'border-box',
+    width: 'fit-content',
+    border: `${_reacttheme.tokens.strokeWidthThin} solid ${_reacttheme.tokens.colorTransparentStroke}`
+};
+const useRootRoundedBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r1d3fbai", "r89ofxt", {
+    r: [
+        ".r1d3fbai{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\"media primary   dismissIcon\" \"media secondary dismissIcon\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusMedium);}",
+        ".r1d3fbai[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}",
+        ".r89ofxt{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\"media primary   dismissIcon\" \"media secondary dismissIcon\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusMedium);}",
+        ".r89ofxt[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}"
+    ],
+    s: [
+        "@media (forced-colors: active){.r1d3fbai{position:relative;}.r1d3fbai::before{content:\"\";border-top-width:var(--strokeWidthThin);border-top-style:solid;position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);}}",
+        "@media (forced-colors: active){.r89ofxt{position:relative;}.r89ofxt::before{content:\"\";border-top-width:var(--strokeWidthThin);border-top-style:solid;position:absolute;top:-1px;right:-1px;left:-1px;bottom:-1px;border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);}}"
+    ]
+});
+const useRootCircularBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r76els4", "r1g7lw0i", {
+    r: [
+        ".r76els4{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\"media primary   dismissIcon\" \"media secondary dismissIcon\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusCircular);}",
+        ".r76els4[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusCircular);border-bottom-left-radius:var(--borderRadiusCircular);border-top-right-radius:var(--borderRadiusCircular);border-top-left-radius:var(--borderRadiusCircular);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}",
+        ".r1g7lw0i{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\"media primary   dismissIcon\" \"media secondary dismissIcon\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusCircular);}",
+        ".r1g7lw0i[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusCircular);border-bottom-right-radius:var(--borderRadiusCircular);border-top-left-radius:var(--borderRadiusCircular);border-top-right-radius:var(--borderRadiusCircular);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}"
+    ],
+    s: [
+        "@media (forced-colors: active){.r76els4{position:relative;}.r76els4::before{content:\"\";border-top-width:var(--strokeWidthThin);border-top-style:solid;border-left-width:var(--strokeWidthThin);border-left-style:solid;border-right-width:var(--strokeWidthThin);border-right-style:solid;position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:var(--borderRadiusCircular);}}",
+        "@media (forced-colors: active){.r1g7lw0i{position:relative;}.r1g7lw0i::before{content:\"\";border-top-width:var(--strokeWidthThin);border-top-style:solid;border-right-width:var(--strokeWidthThin);border-right-style:solid;border-left-width:var(--strokeWidthThin);border-left-style:solid;position:absolute;top:-1px;right:-1px;left:-1px;bottom:-1px;border-radius:var(--borderRadiusCircular);}}"
+    ]
+});
+const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
+    filled: {
+        De3pzq: "f16xq7d1",
+        sj55zd: "fkfq4zb"
+    },
+    outline: {
+        De3pzq: "fhovq9v",
+        sj55zd: "fkfq4zb",
+        g2u3we: "fj3muxo",
+        h3c5rm: [
+            "f1akhkt",
+            "f1lxtadh"
+        ],
+        B9xav0g: "f1aperda",
+        zhjwy3: [
+            "f1lxtadh",
+            "f1akhkt"
+        ]
+    },
+    brand: {
+        De3pzq: "f16xkysk",
+        sj55zd: "faj9fo0"
+    },
+    medium: {
+        Bqenvij: "f1d2rq10"
+    },
+    small: {
+        Bqenvij: "frvgh55"
+    },
+    "extra-small": {
+        Bqenvij: "fjamq6b"
+    }
+}, {
+    d: [
+        ".f16xq7d1{background-color:var(--colorNeutralBackground3);}",
+        ".fkfq4zb{color:var(--colorNeutralForeground2);}",
+        ".fhovq9v{background-color:var(--colorSubtleBackground);}",
+        ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}",
+        ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}",
+        ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}",
+        ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}",
+        ".f16xkysk{background-color:var(--colorBrandBackground2);}",
+        ".faj9fo0{color:var(--colorBrandForeground2);}",
+        ".f1d2rq10{height:32px;}",
+        ".frvgh55{height:24px;}",
+        ".fjamq6b{height:20px;}"
+    ]
+});
+const useRootDisabledStyles = /*#__PURE__*/ (0, _react.__styles)({
+    filled: {
+        Bceei9c: "fdrzuqr",
+        De3pzq: "f1bg9a2p",
+        sj55zd: "f1s2aq7o",
+        g2u3we: "fgig46g",
+        h3c5rm: [
+            "f1mxt3zg",
+            "fziff3p"
+        ],
+        B9xav0g: "f250w3l",
+        zhjwy3: [
+            "fziff3p",
+            "f1mxt3zg"
+        ]
+    },
+    outline: {
+        Bceei9c: "fdrzuqr",
+        De3pzq: "fhovq9v",
+        sj55zd: "f1s2aq7o",
+        g2u3we: "f1jj8ep1",
+        h3c5rm: [
+            "f15xbau",
+            "fy0fskl"
+        ],
+        B9xav0g: "f4ikngz",
+        zhjwy3: [
+            "fy0fskl",
+            "f15xbau"
+        ]
+    },
+    brand: {
+        Bceei9c: "fdrzuqr",
+        De3pzq: "f1bg9a2p",
+        sj55zd: "f1s2aq7o",
+        g2u3we: "fgig46g",
+        h3c5rm: [
+            "f1mxt3zg",
+            "fziff3p"
+        ],
+        B9xav0g: "f250w3l",
+        zhjwy3: [
+            "fziff3p",
+            "f1mxt3zg"
+        ]
+    }
+}, {
+    d: [
+        ".fdrzuqr{cursor:not-allowed;}",
+        ".f1bg9a2p{background-color:var(--colorNeutralBackgroundDisabled);}",
+        ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}",
+        ".fgig46g{border-top-color:var(--colorTransparentStrokeDisabled);}",
+        ".f1mxt3zg{border-right-color:var(--colorTransparentStrokeDisabled);}",
+        ".fziff3p{border-left-color:var(--colorTransparentStrokeDisabled);}",
+        ".f250w3l{border-bottom-color:var(--colorTransparentStrokeDisabled);}",
+        ".fhovq9v{background-color:var(--colorSubtleBackground);}",
+        ".f1jj8ep1{border-top-color:var(--colorNeutralStrokeDisabled);}",
+        ".f15xbau{border-right-color:var(--colorNeutralStrokeDisabled);}",
+        ".fy0fskl{border-left-color:var(--colorNeutralStrokeDisabled);}",
+        ".f4ikngz{border-bottom-color:var(--colorNeutralStrokeDisabled);}"
+    ]
+});
+/**
+ * Styles for root slot when Tag is without leading media/icon
+ */ const useRootWithoutMediaStyles = /*#__PURE__*/ (0, _react.__styles)({
+    medium: {
+        uwmqm3: [
+            "f1rtp3s9",
+            "f18k1jr3"
+        ]
+    },
+    small: {
+        uwmqm3: [
+            "f15vdbe4",
+            "fwiuce9"
+        ]
+    },
+    "extra-small": {
+        uwmqm3: [
+            "f15vdbe4",
+            "fwiuce9"
+        ]
+    }
+}, {
+    d: [
+        ".f1rtp3s9{padding-left:7px;}",
+        ".f18k1jr3{padding-right:7px;}",
+        ".f15vdbe4{padding-left:5px;}",
+        ".fwiuce9{padding-right:5px;}"
+    ]
+});
+/**
+ * Styles for root slot when Tag is without dismiss icon
+ */ const useRootWithoutDismissStyles = /*#__PURE__*/ (0, _react.__styles)({
+    medium: {
+        z189sj: [
+            "f18k1jr3",
+            "f1rtp3s9"
+        ]
+    },
+    small: {
+        z189sj: [
+            "fwiuce9",
+            "f15vdbe4"
+        ]
+    },
+    "extra-small": {
+        z189sj: [
+            "fwiuce9",
+            "f15vdbe4"
+        ]
+    }
+}, {
+    d: [
+        ".f18k1jr3{padding-right:7px;}",
+        ".f1rtp3s9{padding-left:7px;}",
+        ".fwiuce9{padding-right:5px;}",
+        ".f15vdbe4{padding-left:5px;}"
+    ]
+});
+const useIconStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Ijaq50: "f11uok23",
+        Br312pm: "f1qdfnnj",
+        nk6f5a: "f1s27gz",
+        Bw0ie65: "f86d0yl",
+        mc9l5x: "f22iagw"
+    },
+    medium: {
+        uwmqm3: [
+            "f1rtp3s9",
+            "f18k1jr3"
+        ],
+        z189sj: [
+            "f7x41pl",
+            "fruq291"
+        ],
+        a9b677: "f64fuq3",
+        Be2twd7: "fe5j1ua"
+    },
+    small: {
+        uwmqm3: [
+            "f15vdbe4",
+            "fwiuce9"
+        ],
+        z189sj: [
+            "ffczdla",
+            "fgiv446"
+        ],
+        a9b677: "fjw5fx7",
+        Be2twd7: "f4ybsrx"
+    },
+    "extra-small": {
+        uwmqm3: [
+            "f15vdbe4",
+            "fwiuce9"
+        ],
+        z189sj: [
+            "ffczdla",
+            "fgiv446"
+        ],
+        a9b677: "frx94fk",
+        Be2twd7: "f1ugzwwg"
+    }
+}, {
+    d: [
+        ".f11uok23{grid-row-start:media;}",
+        ".f1qdfnnj{grid-column-start:media;}",
+        ".f1s27gz{grid-row-end:media;}",
+        ".f86d0yl{grid-column-end:media;}",
+        ".f22iagw{display:flex;}",
+        ".f1rtp3s9{padding-left:7px;}",
+        ".f18k1jr3{padding-right:7px;}",
+        ".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
+        ".fruq291{padding-left:var(--spacingHorizontalXS);}",
+        ".f64fuq3{width:20px;}",
+        ".fe5j1ua{font-size:20px;}",
+        ".f15vdbe4{padding-left:5px;}",
+        ".fwiuce9{padding-right:5px;}",
+        ".ffczdla{padding-right:var(--spacingHorizontalXXS);}",
+        ".fgiv446{padding-left:var(--spacingHorizontalXXS);}",
+        ".fjw5fx7{width:16px;}",
+        ".f4ybsrx{font-size:16px;}",
+        ".frx94fk{width:12px;}",
+        ".f1ugzwwg{font-size:12px;}"
+    ]
+});
+const useMediaStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Ijaq50: "f11uok23",
+        Br312pm: "f1qdfnnj",
+        nk6f5a: "f1s27gz",
+        Bw0ie65: "f86d0yl",
+        mc9l5x: "f22iagw",
+        uwmqm3: [
+            "f10xn8zz",
+            "f136y8j8"
+        ]
+    },
+    medium: {
+        z189sj: [
+            "f1vdfbxk",
+            "f1f5gg8d"
+        ]
+    },
+    small: {
+        z189sj: [
+            "fdw0yi8",
+            "fk8j09s"
+        ]
+    },
+    "extra-small": {
+        z189sj: [
+            "fdw0yi8",
+            "fk8j09s"
+        ]
+    }
+}, {
+    d: [
+        ".f11uok23{grid-row-start:media;}",
+        ".f1qdfnnj{grid-column-start:media;}",
+        ".f1s27gz{grid-row-end:media;}",
+        ".f86d0yl{grid-column-end:media;}",
+        ".f22iagw{display:flex;}",
+        ".f10xn8zz{padding-left:1px;}",
+        ".f136y8j8{padding-right:1px;}",
+        ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}",
+        ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}",
+        ".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}",
+        ".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}"
+    ]
+});
+const useDismissIconStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Ijaq50: "fneo8i2",
+        Br312pm: "frbqjvc",
+        nk6f5a: "f1a6k60w",
+        Bw0ie65: "f1ay3jj",
+        mc9l5x: "f22iagw",
+        ze5xyy: "f4xjyn1",
+        oy3o9n: "f1xtr1b3"
+    },
+    medium: {
+        uwmqm3: [
+            "fruq291",
+            "f7x41pl"
+        ],
+        z189sj: [
+            "f18k1jr3",
+            "f1rtp3s9"
+        ],
+        Be2twd7: "fe5j1ua"
+    },
+    small: {
+        uwmqm3: [
+            "fgiv446",
+            "ffczdla"
+        ],
+        z189sj: [
+            "fwiuce9",
+            "f15vdbe4"
+        ],
+        Be2twd7: "f4ybsrx"
+    },
+    "extra-small": {
+        uwmqm3: [
+            "fgiv446",
+            "ffczdla"
+        ],
+        z189sj: [
+            "fwiuce9",
+            "f15vdbe4"
+        ],
+        Be2twd7: "f1ugzwwg"
+    },
+    filled: {
+        eoavqd: "f8491dx",
+        Bi91k9c: "f3ymbdj",
+        lj723h: "fryz5bw"
+    },
+    outline: {
+        eoavqd: "f8491dx",
+        Bi91k9c: "f3ymbdj",
+        lj723h: "fryz5bw"
+    },
+    brand: {
+        eoavqd: "f8491dx",
+        Bi91k9c: "f3ymbdj",
+        lj723h: "fryz5bw"
+    }
+}, {
+    d: [
+        ".fneo8i2{grid-row-start:dismissIcon;}",
+        ".frbqjvc{grid-column-start:dismissIcon;}",
+        ".f1a6k60w{grid-row-end:dismissIcon;}",
+        ".f1ay3jj{grid-column-end:dismissIcon;}",
+        ".f22iagw{display:flex;}",
+        ".fruq291{padding-left:var(--spacingHorizontalXS);}",
+        ".f7x41pl{padding-right:var(--spacingHorizontalXS);}",
+        ".f18k1jr3{padding-right:7px;}",
+        ".f1rtp3s9{padding-left:7px;}",
+        ".fe5j1ua{font-size:20px;}",
+        ".fgiv446{padding-left:var(--spacingHorizontalXXS);}",
+        ".ffczdla{padding-right:var(--spacingHorizontalXXS);}",
+        ".fwiuce9{padding-right:5px;}",
+        ".f15vdbe4{padding-left:5px;}",
+        ".f4ybsrx{font-size:16px;}",
+        ".f1ugzwwg{font-size:12px;}"
+    ],
+    m: [
+        [
+            "@media (forced-colors: active){.f4xjyn1:hover{color:Highlight;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ],
+        [
+            "@media (forced-colors: active){.f1xtr1b3:active{color:Highlight;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ]
+    ],
+    h: [
+        ".f8491dx:hover{cursor:pointer;}",
+        ".f3ymbdj:hover{color:var(--colorCompoundBrandForeground1Hover);}"
+    ],
+    a: [
+        ".fryz5bw:active{color:var(--colorCompoundBrandForeground1Pressed);}"
+    ]
+});
+const usePrimaryTextStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Huce71: "fz5stix",
+        uwmqm3: [
+            "fgiv446",
+            "ffczdla"
+        ],
+        z189sj: [
+            "ffczdla",
+            "fgiv446"
+        ]
+    },
+    medium: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fkhj508",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "f1i3iumi"
+    },
+    small: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm"
+    },
+    "extra-small": {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm"
+    },
+    withoutSecondaryText: {
+        Br312pm: "faqcfhe",
+        Ijaq50: "f1q3ipgb",
+        nk6f5a: "fc0ab3q",
+        Byoj8tv: "f1g03r3y"
+    },
+    withSecondaryText: {
+        Ijaq50: "f1q3ipgb",
+        Br312pm: "faqcfhe",
+        nk6f5a: "fs32cm1",
+        Bw0ie65: "f1bo7viq",
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "fwrc4pm",
+        B6of3ja: "f1ryq6si"
+    }
+}, {
+    d: [
+        ".fz5stix{white-space:nowrap;}",
+        ".fgiv446{padding-left:var(--spacingHorizontalXXS);}",
+        ".ffczdla{padding-right:var(--spacingHorizontalXXS);}",
+        ".fk6fouc{font-family:var(--fontFamilyBase);}",
+        ".fkhj508{font-size:var(--fontSizeBase300);}",
+        ".figsok6{font-weight:var(--fontWeightRegular);}",
+        ".f1i3iumi{line-height:var(--lineHeightBase300);}",
+        ".fy9rknc{font-size:var(--fontSizeBase200);}",
+        ".fwrc4pm{line-height:var(--lineHeightBase200);}",
+        ".faqcfhe{grid-column-start:primary;}",
+        ".f1q3ipgb{grid-row-start:primary;}",
+        ".fc0ab3q{grid-row-end:secondary;}",
+        ".f1g03r3y{padding-bottom:var(--spacingHorizontalXXS);}",
+        ".fs32cm1{grid-row-end:primary;}",
+        ".f1bo7viq{grid-column-end:primary;}",
+        ".f1ryq6si{margin-top:-2px;}"
+    ]
+});
+const useSecondaryTextBaseClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r7hv1ps", "rnrslm9", [
+    ".r7hv1ps{grid-area:secondary;padding-left:var(--spacingHorizontalXXS);padding-right:var(--spacingHorizontalXXS);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase100);white-space:nowrap;}",
+    ".rnrslm9{grid-area:secondary;padding-right:var(--spacingHorizontalXXS);padding-left:var(--spacingHorizontalXXS);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase100);white-space:nowrap;}"
+]);
+const useTagStyles_unstable = (state)=>{
+    const rootRoundedBaseClassName = useRootRoundedBaseClassName();
+    const rootCircularBaseClassName = useRootCircularBaseClassName();
+    const rootStyles = useRootStyles();
+    const rootDisabledStyles = useRootDisabledStyles();
+    const rootWithoutMediaStyles = useRootWithoutMediaStyles();
+    const rootWithoutDismissStyles = useRootWithoutDismissStyles();
+    const iconStyles = useIconStyles();
+    const mediaStyles = useMediaStyles();
+    const dismissIconStyles = useDismissIconStyles();
+    const primaryTextStyles = usePrimaryTextStyles();
+    const secondaryTextBaseClassName = useSecondaryTextBaseClassName();
+    const { shape, size, appearance } = state;
+    state.root.className = (0, _react.mergeClasses)(tagClassNames.root, shape === 'rounded' ? rootRoundedBaseClassName : rootCircularBaseClassName, state.disabled ? rootDisabledStyles[appearance] : rootStyles[appearance], rootStyles[size], !state.media && !state.icon && rootWithoutMediaStyles[size], !state.dismissIcon && rootWithoutDismissStyles[size], state.root.className);
+    if (state.media) {
+        state.media.className = (0, _react.mergeClasses)(tagClassNames.media, mediaStyles.base, mediaStyles[size], state.media.className);
+    }
+    if (state.icon) {
+        state.icon.className = (0, _react.mergeClasses)(tagClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);
+    }
+    if (state.primaryText) {
+        state.primaryText.className = (0, _react.mergeClasses)(tagClassNames.primaryText, primaryTextStyles.base, primaryTextStyles[size], state.secondaryText ? primaryTextStyles.withSecondaryText : primaryTextStyles.withoutSecondaryText, state.primaryText.className);
+    }
+    if (state.secondaryText) {
+        state.secondaryText.className = (0, _react.mergeClasses)(tagClassNames.secondaryText, secondaryTextBaseClassName, state.secondaryText.className);
+    }
+    if (state.dismissIcon) {
+        state.dismissIcon.className = (0, _react.mergeClasses)(tagClassNames.dismissIcon, dismissIconStyles.base, dismissIconStyles[size], !state.disabled && dismissIconStyles[appearance], state.dismissIcon.className);
+    }
+    return state;
+}; //# sourceMappingURL=useTagStyles.styles.js.map

package/lib-commonjs/components/Tag/useTagStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useTagStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tagClassNames = {\n  root: 'fui-Tag',\n  media: 'fui-Tag__media',\n  icon: 'fui-Tag__icon',\n  primaryText: 'fui-Tag__primaryText',\n  secondaryText: 'fui-Tag__secondaryText',\n  dismissIcon: 'fui-Tag__dismissIcon'\n};\n/**\n * Inner horizontal space left and right of Tag\n */\nconst tagSpacingMedium = '7px';\nconst tagSpacingSmall = '5px';\nconst tagSpacingExtraSmall = '5px';\nconst mediumIconSize = '20px';\nconst smallIconSize = '16px';\nconst extraSmallIconSize = '12px';\nconst baseStyles = {\n  // reset default button style:\n  fontFamily: 'inherit',\n  padding: '0px',\n  appearance: 'button',\n  textAlign: 'unset',\n  display: 'inline-grid',\n  alignItems: 'center',\n  gridTemplateAreas: `\n  \"media primary   dismissIcon\"\n  \"media secondary dismissIcon\"\n  `,\n  boxSizing: 'border-box',\n  width: 'fit-content',\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n};\nconst useRootRoundedBaseClassName = /*#__PURE__*/__resetStyles(\"r1d3fbai\", \"r89ofxt\", {\n  r: [\".r1d3fbai{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\\\"media primary   dismissIcon\\\" \\\"media secondary dismissIcon\\\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusMedium);}\", \".r1d3fbai[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\", \".r89ofxt{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\\\"media primary   dismissIcon\\\" \\\"media secondary dismissIcon\\\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusMedium);}\", \".r89ofxt[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\"],\n  s: [\"@media (forced-colors: active){.r1d3fbai{position:relative;}.r1d3fbai::before{content:\\\"\\\";border-top-width:var(--strokeWidthThin);border-top-style:solid;position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);}}\", \"@media (forced-colors: active){.r89ofxt{position:relative;}.r89ofxt::before{content:\\\"\\\";border-top-width:var(--strokeWidthThin);border-top-style:solid;position:absolute;top:-1px;right:-1px;left:-1px;bottom:-1px;border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);}}\"]\n});\nconst useRootCircularBaseClassName = /*#__PURE__*/__resetStyles(\"r76els4\", \"r1g7lw0i\", {\n  r: [\".r76els4{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\\\"media primary   dismissIcon\\\" \\\"media secondary dismissIcon\\\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusCircular);}\", \".r76els4[data-fui-focus-visible]{border-bottom-right-radius:var(--borderRadiusCircular);border-bottom-left-radius:var(--borderRadiusCircular);border-top-right-radius:var(--borderRadiusCircular);border-top-left-radius:var(--borderRadiusCircular);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\", \".r1g7lw0i{font-family:inherit;padding:0px;-webkit-appearance:button;-moz-appearance:button;-ms-appearance:button;appearance:button;text-align:unset;display:inline-grid;align-items:center;grid-template-areas:\\\"media primary   dismissIcon\\\" \\\"media secondary dismissIcon\\\";box-sizing:border-box;width:fit-content;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);border-radius:var(--borderRadiusCircular);}\", \".r1g7lw0i[data-fui-focus-visible]{border-bottom-left-radius:var(--borderRadiusCircular);border-bottom-right-radius:var(--borderRadiusCircular);border-top-left-radius:var(--borderRadiusCircular);border-top-right-radius:var(--borderRadiusCircular);outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\"],\n  s: [\"@media (forced-colors: active){.r76els4{position:relative;}.r76els4::before{content:\\\"\\\";border-top-width:var(--strokeWidthThin);border-top-style:solid;border-left-width:var(--strokeWidthThin);border-left-style:solid;border-right-width:var(--strokeWidthThin);border-right-style:solid;position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:var(--borderRadiusCircular);}}\", \"@media (forced-colors: active){.r1g7lw0i{position:relative;}.r1g7lw0i::before{content:\\\"\\\";border-top-width:var(--strokeWidthThin);border-top-style:solid;border-right-width:var(--strokeWidthThin);border-right-style:solid;border-left-width:var(--strokeWidthThin);border-left-style:solid;position:absolute;top:-1px;right:-1px;left:-1px;bottom:-1px;border-radius:var(--borderRadiusCircular);}}\"]\n});\nconst useRootStyles = /*#__PURE__*/__styles({\n  filled: {\n    De3pzq: \"f16xq7d1\",\n    sj55zd: \"fkfq4zb\"\n  },\n  outline: {\n    De3pzq: \"fhovq9v\",\n    sj55zd: \"fkfq4zb\",\n    g2u3we: \"fj3muxo\",\n    h3c5rm: [\"f1akhkt\", \"f1lxtadh\"],\n    B9xav0g: \"f1aperda\",\n    zhjwy3: [\"f1lxtadh\", \"f1akhkt\"]\n  },\n  brand: {\n    De3pzq: \"f16xkysk\",\n    sj55zd: \"faj9fo0\"\n  },\n  medium: {\n    Bqenvij: \"f1d2rq10\"\n  },\n  small: {\n    Bqenvij: \"frvgh55\"\n  },\n  \"extra-small\": {\n    Bqenvij: \"fjamq6b\"\n  }\n}, {\n  d: [\".f16xq7d1{background-color:var(--colorNeutralBackground3);}\", \".fkfq4zb{color:var(--colorNeutralForeground2);}\", \".fhovq9v{background-color:var(--colorSubtleBackground);}\", \".fj3muxo{border-top-color:var(--colorNeutralStroke1);}\", \".f1akhkt{border-right-color:var(--colorNeutralStroke1);}\", \".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}\", \".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}\", \".f16xkysk{background-color:var(--colorBrandBackground2);}\", \".faj9fo0{color:var(--colorBrandForeground2);}\", \".f1d2rq10{height:32px;}\", \".frvgh55{height:24px;}\", \".fjamq6b{height:20px;}\"]\n});\nconst useRootDisabledStyles = /*#__PURE__*/__styles({\n  filled: {\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1bg9a2p\",\n    sj55zd: \"f1s2aq7o\",\n    g2u3we: \"fgig46g\",\n    h3c5rm: [\"f1mxt3zg\", \"fziff3p\"],\n    B9xav0g: \"f250w3l\",\n    zhjwy3: [\"fziff3p\", \"f1mxt3zg\"]\n  },\n  outline: {\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"fhovq9v\",\n    sj55zd: \"f1s2aq7o\",\n    g2u3we: \"f1jj8ep1\",\n    h3c5rm: [\"f15xbau\", \"fy0fskl\"],\n    B9xav0g: \"f4ikngz\",\n    zhjwy3: [\"fy0fskl\", \"f15xbau\"]\n  },\n  brand: {\n    Bceei9c: \"fdrzuqr\",\n    De3pzq: \"f1bg9a2p\",\n    sj55zd: \"f1s2aq7o\",\n    g2u3we: \"fgig46g\",\n    h3c5rm: [\"f1mxt3zg\", \"fziff3p\"],\n    B9xav0g: \"f250w3l\",\n    zhjwy3: [\"fziff3p\", \"f1mxt3zg\"]\n  }\n}, {\n  d: [\".fdrzuqr{cursor:not-allowed;}\", \".f1bg9a2p{background-color:var(--colorNeutralBackgroundDisabled);}\", \".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}\", \".fgig46g{border-top-color:var(--colorTransparentStrokeDisabled);}\", \".f1mxt3zg{border-right-color:var(--colorTransparentStrokeDisabled);}\", \".fziff3p{border-left-color:var(--colorTransparentStrokeDisabled);}\", \".f250w3l{border-bottom-color:var(--colorTransparentStrokeDisabled);}\", \".fhovq9v{background-color:var(--colorSubtleBackground);}\", \".f1jj8ep1{border-top-color:var(--colorNeutralStrokeDisabled);}\", \".f15xbau{border-right-color:var(--colorNeutralStrokeDisabled);}\", \".fy0fskl{border-left-color:var(--colorNeutralStrokeDisabled);}\", \".f4ikngz{border-bottom-color:var(--colorNeutralStrokeDisabled);}\"]\n});\n/**\n * Styles for root slot when Tag is without leading media/icon\n */\nconst useRootWithoutMediaStyles = /*#__PURE__*/__styles({\n  medium: {\n    uwmqm3: [\"f1rtp3s9\", \"f18k1jr3\"]\n  },\n  small: {\n    uwmqm3: [\"f15vdbe4\", \"fwiuce9\"]\n  },\n  \"extra-small\": {\n    uwmqm3: [\"f15vdbe4\", \"fwiuce9\"]\n  }\n}, {\n  d: [\".f1rtp3s9{padding-left:7px;}\", \".f18k1jr3{padding-right:7px;}\", \".f15vdbe4{padding-left:5px;}\", \".fwiuce9{padding-right:5px;}\"]\n});\n/**\n * Styles for root slot when Tag is without dismiss icon\n */\nconst useRootWithoutDismissStyles = /*#__PURE__*/__styles({\n  medium: {\n    z189sj: [\"f18k1jr3\", \"f1rtp3s9\"]\n  },\n  small: {\n    z189sj: [\"fwiuce9\", \"f15vdbe4\"]\n  },\n  \"extra-small\": {\n    z189sj: [\"fwiuce9\", \"f15vdbe4\"]\n  }\n}, {\n  d: [\".f18k1jr3{padding-right:7px;}\", \".f1rtp3s9{padding-left:7px;}\", \".fwiuce9{padding-right:5px;}\", \".f15vdbe4{padding-left:5px;}\"]\n});\nexport const useIconStyles = /*#__PURE__*/__styles({\n  base: {\n    Ijaq50: \"f11uok23\",\n    Br312pm: \"f1qdfnnj\",\n    nk6f5a: \"f1s27gz\",\n    Bw0ie65: \"f86d0yl\",\n    mc9l5x: \"f22iagw\"\n  },\n  medium: {\n    uwmqm3: [\"f1rtp3s9\", \"f18k1jr3\"],\n    z189sj: [\"f7x41pl\", \"fruq291\"],\n    a9b677: \"f64fuq3\",\n    Be2twd7: \"fe5j1ua\"\n  },\n  small: {\n    uwmqm3: [\"f15vdbe4\", \"fwiuce9\"],\n    z189sj: [\"ffczdla\", \"fgiv446\"],\n    a9b677: \"fjw5fx7\",\n    Be2twd7: \"f4ybsrx\"\n  },\n  \"extra-small\": {\n    uwmqm3: [\"f15vdbe4\", \"fwiuce9\"],\n    z189sj: [\"ffczdla\", \"fgiv446\"],\n    a9b677: \"frx94fk\",\n    Be2twd7: \"f1ugzwwg\"\n  }\n}, {\n  d: [\".f11uok23{grid-row-start:media;}\", \".f1qdfnnj{grid-column-start:media;}\", \".f1s27gz{grid-row-end:media;}\", \".f86d0yl{grid-column-end:media;}\", \".f22iagw{display:flex;}\", \".f1rtp3s9{padding-left:7px;}\", \".f18k1jr3{padding-right:7px;}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f64fuq3{width:20px;}\", \".fe5j1ua{font-size:20px;}\", \".f15vdbe4{padding-left:5px;}\", \".fwiuce9{padding-right:5px;}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".fjw5fx7{width:16px;}\", \".f4ybsrx{font-size:16px;}\", \".frx94fk{width:12px;}\", \".f1ugzwwg{font-size:12px;}\"]\n});\nexport const useMediaStyles = /*#__PURE__*/__styles({\n  base: {\n    Ijaq50: \"f11uok23\",\n    Br312pm: \"f1qdfnnj\",\n    nk6f5a: \"f1s27gz\",\n    Bw0ie65: \"f86d0yl\",\n    mc9l5x: \"f22iagw\",\n    uwmqm3: [\"f10xn8zz\", \"f136y8j8\"]\n  },\n  medium: {\n    z189sj: [\"f1vdfbxk\", \"f1f5gg8d\"]\n  },\n  small: {\n    z189sj: [\"fdw0yi8\", \"fk8j09s\"]\n  },\n  \"extra-small\": {\n    z189sj: [\"fdw0yi8\", \"fk8j09s\"]\n  }\n}, {\n  d: [\".f11uok23{grid-row-start:media;}\", \".f1qdfnnj{grid-column-start:media;}\", \".f1s27gz{grid-row-end:media;}\", \".f86d0yl{grid-column-end:media;}\", \".f22iagw{display:flex;}\", \".f10xn8zz{padding-left:1px;}\", \".f136y8j8{padding-right:1px;}\", \".f1vdfbxk{padding-right:var(--spacingHorizontalS);}\", \".f1f5gg8d{padding-left:var(--spacingHorizontalS);}\", \".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}\", \".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}\"]\n});\nconst useDismissIconStyles = /*#__PURE__*/__styles({\n  base: {\n    Ijaq50: \"fneo8i2\",\n    Br312pm: \"frbqjvc\",\n    nk6f5a: \"f1a6k60w\",\n    Bw0ie65: \"f1ay3jj\",\n    mc9l5x: \"f22iagw\",\n    ze5xyy: \"f4xjyn1\",\n    oy3o9n: \"f1xtr1b3\"\n  },\n  medium: {\n    uwmqm3: [\"fruq291\", \"f7x41pl\"],\n    z189sj: [\"f18k1jr3\", \"f1rtp3s9\"],\n    Be2twd7: \"fe5j1ua\"\n  },\n  small: {\n    uwmqm3: [\"fgiv446\", \"ffczdla\"],\n    z189sj: [\"fwiuce9\", \"f15vdbe4\"],\n    Be2twd7: \"f4ybsrx\"\n  },\n  \"extra-small\": {\n    uwmqm3: [\"fgiv446\", \"ffczdla\"],\n    z189sj: [\"fwiuce9\", \"f15vdbe4\"],\n    Be2twd7: \"f1ugzwwg\"\n  },\n  filled: {\n    eoavqd: \"f8491dx\",\n    Bi91k9c: \"f3ymbdj\",\n    lj723h: \"fryz5bw\"\n  },\n  outline: {\n    eoavqd: \"f8491dx\",\n    Bi91k9c: \"f3ymbdj\",\n    lj723h: \"fryz5bw\"\n  },\n  brand: {\n    eoavqd: \"f8491dx\",\n    Bi91k9c: \"f3ymbdj\",\n    lj723h: \"fryz5bw\"\n  }\n}, {\n  d: [\".fneo8i2{grid-row-start:dismissIcon;}\", \".frbqjvc{grid-column-start:dismissIcon;}\", \".f1a6k60w{grid-row-end:dismissIcon;}\", \".f1ay3jj{grid-column-end:dismissIcon;}\", \".f22iagw{display:flex;}\", \".fruq291{padding-left:var(--spacingHorizontalXS);}\", \".f7x41pl{padding-right:var(--spacingHorizontalXS);}\", \".f18k1jr3{padding-right:7px;}\", \".f1rtp3s9{padding-left:7px;}\", \".fe5j1ua{font-size:20px;}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fwiuce9{padding-right:5px;}\", \".f15vdbe4{padding-left:5px;}\", \".f4ybsrx{font-size:16px;}\", \".f1ugzwwg{font-size:12px;}\"],\n  m: [[\"@media (forced-colors: active){.f4xjyn1:hover{color:Highlight;}}\", {\n    m: \"(forced-colors: active)\"\n  }], [\"@media (forced-colors: active){.f1xtr1b3:active{color:Highlight;}}\", {\n    m: \"(forced-colors: active)\"\n  }]],\n  h: [\".f8491dx:hover{cursor:pointer;}\", \".f3ymbdj:hover{color:var(--colorCompoundBrandForeground1Hover);}\"],\n  a: [\".fryz5bw:active{color:var(--colorCompoundBrandForeground1Pressed);}\"]\n});\nexport const usePrimaryTextStyles = /*#__PURE__*/__styles({\n  base: {\n    Huce71: \"fz5stix\",\n    uwmqm3: [\"fgiv446\", \"ffczdla\"],\n    z189sj: [\"ffczdla\", \"fgiv446\"]\n  },\n  medium: {\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fkhj508\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"f1i3iumi\"\n  },\n  small: {\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fy9rknc\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"fwrc4pm\"\n  },\n  \"extra-small\": {\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fy9rknc\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"fwrc4pm\"\n  },\n  withoutSecondaryText: {\n    Br312pm: \"faqcfhe\",\n    Ijaq50: \"f1q3ipgb\",\n    nk6f5a: \"fc0ab3q\",\n    Byoj8tv: \"f1g03r3y\"\n  },\n  withSecondaryText: {\n    Ijaq50: \"f1q3ipgb\",\n    Br312pm: \"faqcfhe\",\n    nk6f5a: \"fs32cm1\",\n    Bw0ie65: \"f1bo7viq\",\n    Bahqtrf: \"fk6fouc\",\n    Be2twd7: \"fy9rknc\",\n    Bhrd7zp: \"figsok6\",\n    Bg96gwp: \"fwrc4pm\",\n    B6of3ja: \"f1ryq6si\"\n  }\n}, {\n  d: [\".fz5stix{white-space:nowrap;}\", \".fgiv446{padding-left:var(--spacingHorizontalXXS);}\", \".ffczdla{padding-right:var(--spacingHorizontalXXS);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".fy9rknc{font-size:var(--fontSizeBase200);}\", \".fwrc4pm{line-height:var(--lineHeightBase200);}\", \".faqcfhe{grid-column-start:primary;}\", \".f1q3ipgb{grid-row-start:primary;}\", \".fc0ab3q{grid-row-end:secondary;}\", \".f1g03r3y{padding-bottom:var(--spacingHorizontalXXS);}\", \".fs32cm1{grid-row-end:primary;}\", \".f1bo7viq{grid-column-end:primary;}\", \".f1ryq6si{margin-top:-2px;}\"]\n});\nexport const useSecondaryTextBaseClassName = /*#__PURE__*/__resetStyles(\"r7hv1ps\", \"rnrslm9\", [\".r7hv1ps{grid-area:secondary;padding-left:var(--spacingHorizontalXXS);padding-right:var(--spacingHorizontalXXS);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase100);white-space:nowrap;}\", \".rnrslm9{grid-area:secondary;padding-right:var(--spacingHorizontalXXS);padding-left:var(--spacingHorizontalXXS);font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase100);white-space:nowrap;}\"]);\n/**\n * Apply styling to the Tag slots based on the state\n */\nexport const useTagStyles_unstable = state => {\n  const rootRoundedBaseClassName = useRootRoundedBaseClassName();\n  const rootCircularBaseClassName = useRootCircularBaseClassName();\n  const rootStyles = useRootStyles();\n  const rootDisabledStyles = useRootDisabledStyles();\n  const rootWithoutMediaStyles = useRootWithoutMediaStyles();\n  const rootWithoutDismissStyles = useRootWithoutDismissStyles();\n  const iconStyles = useIconStyles();\n  const mediaStyles = useMediaStyles();\n  const dismissIconStyles = useDismissIconStyles();\n  const primaryTextStyles = usePrimaryTextStyles();\n  const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n  const {\n    shape,\n    size,\n    appearance\n  } = state;\n  state.root.className = mergeClasses(tagClassNames.root, shape === 'rounded' ? rootRoundedBaseClassName : rootCircularBaseClassName, state.disabled ? rootDisabledStyles[appearance] : rootStyles[appearance], rootStyles[size], !state.media && !state.icon && rootWithoutMediaStyles[size], !state.dismissIcon && rootWithoutDismissStyles[size], state.root.className);\n  if (state.media) {\n    state.media.className = mergeClasses(tagClassNames.media, mediaStyles.base, mediaStyles[size], state.media.className);\n  }\n  if (state.icon) {\n    state.icon.className = mergeClasses(tagClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);\n  }\n  if (state.primaryText) {\n    state.primaryText.className = mergeClasses(tagClassNames.primaryText, primaryTextStyles.base, primaryTextStyles[size], state.secondaryText ? primaryTextStyles.withSecondaryText : primaryTextStyles.withoutSecondaryText, state.primaryText.className);\n  }\n  if (state.secondaryText) {\n    state.secondaryText.className = mergeClasses(tagClassNames.secondaryText, secondaryTextBaseClassName, state.secondaryText.className);\n  }\n  if (state.dismissIcon) {\n    state.dismissIcon.className = mergeClasses(tagClassNames.dismissIcon, dismissIconStyles.base, dismissIconStyles[size], !state.disabled && dismissIconStyles[appearance], state.dismissIcon.className);\n  }\n  return state;\n};\n//# sourceMappingURL=useTagStyles.styles.js.map"],"names":["tagClassNames","useIconStyles","useMediaStyles","usePrimaryTextStyles","useSecondaryTextBaseClassName","useTagStyles_unstable","root","media","icon","primaryText","secondaryText","dismissIcon","tagSpacingMedium","tagSpacingSmall","tagSpacingExtraSmall","mediumIconSize","smallIconSize","extraSmallIconSize","baseStyles","fontFamily","padding","appearance","textAlign","display","alignItems","gridTemplateAreas","boxSizing","width","border","tokens","strokeWidthThin","colorTransparentStroke","useRootRoundedBaseClassName","__resetStyles","r","s","useRootCircularBaseClassName","useRootStyles","__styles","filled","De3pzq","sj55zd","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","brand","medium","Bqenvij","small","d","useRootDisabledStyles","Bceei9c","useRootWithoutMediaStyles","uwmqm3","useRootWithoutDismissStyles","z189sj","base","Ijaq50","Br312pm","nk6f5a","Bw0ie65","mc9l5x","a9b677","Be2twd7","useDismissIconStyles","ze5xyy","oy3o9n","eoavqd","Bi91k9c","lj723h","m","h","a","Huce71","Bahqtrf","Bhrd7zp","Bg96gwp","withoutSecondaryText","Byoj8tv","withSecondaryText","B6of3ja","state","rootRoundedBaseClassName","rootCircularBaseClassName","rootStyles","rootDisabledStyles","rootWithoutMediaStyles","rootWithoutDismissStyles","iconStyles","mediaStyles","dismissIconStyles","primaryTextStyles","secondaryTextBaseClassName","shape","size","className","mergeClasses","disabled"],"mappings":"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"}

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

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "TagGroup", {
+    enumerable: true,
+    get: function() {
+        return TagGroup;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _useTagGroup = require("./useTagGroup");
+const _renderTagGroup = require("./renderTagGroup");
+const _useTagGroupStylesstyles = require("./useTagGroupStyles.styles");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useTagGroupContextValues = require("./useTagGroupContextValues");
+const TagGroup = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useTagGroup.useTagGroup_unstable)(props, ref);
+    (0, _useTagGroupStylesstyles.useTagGroupStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useTagGroupStyles_unstable')(state);
+    return (0, _renderTagGroup.renderTagGroup_unstable)(state, (0, _useTagGroupContextValues.useTagGroupContextValues_unstable)(state));
+});
+TagGroup.displayName = 'TagGroup';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["TagGroup.js"],"sourcesContent":["import * as React from 'react';\nimport { useTagGroup_unstable } from './useTagGroup';\nimport { renderTagGroup_unstable } from './renderTagGroup';\nimport { useTagGroupStyles_unstable } from './useTagGroupStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTagGroupContextValues_unstable } from './useTagGroupContextValues';\n/**\n * TagGroup component - a container for multiple tags.\n * Provides context to size or dismiss children tags.\n */ export const TagGroup = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useTagGroup_unstable(props, ref);\n    useTagGroupStyles_unstable(state);\n    useCustomStyleHook_unstable('useTagGroupStyles_unstable')(state);\n    return renderTagGroup_unstable(state, useTagGroupContextValues_unstable(state));\n});\nTagGroup.displayName = 'TagGroup';\n"],"names":["TagGroup","React","forwardRef","props","ref","state","useTagGroup_unstable","useTagGroupStyles_unstable","useCustomStyleHook_unstable","renderTagGroup_unstable","useTagGroupContextValues_unstable","displayName"],"mappings":";;;;+BASiBA;;;eAAAA;;;;iEATM;6BACc;gCACG;yCACG;qCACC;0CACM;AAIvC,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/D,MAAMC,QAAQC,IAAAA,iCAAoB,EAACH,OAAOC;IAC1CG,IAAAA,mDAA0B,EAACF;IAC3BG,IAAAA,gDAA2B,EAAC,8BAA8BH;IAC1D,OAAOI,IAAAA,uCAAuB,EAACJ,OAAOK,IAAAA,2DAAiC,EAACL;AAC5E;AACAL,SAASW,WAAW,GAAG"}

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

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});