@fluentui/react-combobox 9.0.0-beta.19 → 9.0.0-beta.21

package/lib-commonjs/components/Option/useOptionStyles.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useOptionStyles_unstable = exports.optionClassNames = void 0;
-
 const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
-
 const react_1 = /*#__PURE__*/require("@griffel/react");
-
 exports.optionClassNames = {
   root: 'fui-Option',
   checkIcon: 'fui-Option__checkIcon'
@@ -16,99 +13,96 @@ exports.optionClassNames = {
 /**
  * Styles for the root slot
  */
-
 const useStyles = /*#__PURE__*/react_1.__styles({
-  "root": {
-    "Bt984gj": "f122n59",
-    "Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
-    "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
-    "B7oj6ja": ["f1jar5jt", "fyu767a"],
-    "Btl43ni": ["fyu767a", "f1jar5jt"],
-    "sj55zd": "f19n0e5",
-    "i8kkvl": "f1ufnopg",
-    "Bceei9c": "f1k6fduh",
-    "mc9l5x": "f22iagw",
-    "Bahqtrf": "fk6fouc",
-    "Be2twd7": "fkhj508",
-    "Bg96gwp": "f1i3iumi",
-    "z8tnut": "fp2oml8",
-    "z189sj": ["f1vdfbxk", "f1f5gg8d"],
-    "Byoj8tv": "f1tdddsa",
-    "uwmqm3": ["f1f5gg8d", "f1vdfbxk"],
-    "qhf8xq": "f10pi13n",
-    "Jwef8y": "f1knas48",
-    "ecr2s2": "fb40n2d"
+  root: {
+    Bt984gj: "f122n59",
+    Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
+    Beyfa6y: ["f16jpd5f", "f1aa9q02"],
+    B7oj6ja: ["f1jar5jt", "fyu767a"],
+    Btl43ni: ["fyu767a", "f1jar5jt"],
+    sj55zd: "f19n0e5",
+    i8kkvl: "f1ufnopg",
+    Bceei9c: "f1k6fduh",
+    mc9l5x: "f22iagw",
+    Bahqtrf: "fk6fouc",
+    Be2twd7: "fkhj508",
+    Bg96gwp: "f1i3iumi",
+    z8tnut: "fp2oml8",
+    z189sj: ["f1vdfbxk", "f1f5gg8d"],
+    Byoj8tv: "f1tdddsa",
+    uwmqm3: ["f1f5gg8d", "f1vdfbxk"],
+    qhf8xq: "f10pi13n",
+    Jwef8y: "f1knas48",
+    ecr2s2: "fb40n2d"
   },
-  "active": {
-    "Bsft5z2": "f13zj6fq",
-    "E3zdtr": "f1mdlcz9",
-    "B80jsxd": "f1nwj1ja",
-    "t2ki1e": "ffmd2fr",
-    "Bm2nyyq": "f8rth92",
-    "Barhvk9": ["flthirb", "ftkbnf5"],
-    "Bw17bha": "f1lh990p",
-    "vfts7": ["ftkbnf5", "flthirb"],
-    "xrcqlc": "fc9v8v1",
-    "Ihftqj": ["f1mwfetb", "f18mat8f"],
-    "Bcgy8vk": "f1cb6c3",
-    "Bhxzhr1": ["f18mat8f", "f1mwfetb"],
-    "B3778ie": ["f1ibwz09", "f1kp91vd"],
-    "d9w3h3": ["f1kp91vd", "f1ibwz09"],
-    "Bl18szs": ["f1pix4dl", "f13nd1z4"],
-    "B4j8arr": ["f13nd1z4", "f1pix4dl"],
-    "B0n5ga8": "f1qw5sz7",
-    "s924m2": ["f19va7ni", "f1a9v3mw"],
-    "B1q35kw": "fkkziue",
-    "Gp14am": ["f1a9v3mw", "f19va7ni"],
-    "bn5sak": "f1a97anr",
-    "By385i5": "f5226zp",
-    "Eqx8gd": ["fa2bdqt", "fei6g0k"],
-    "B1piin3": ["fei6g0k", "fa2bdqt"]
+  active: {
+    Bsft5z2: "f13zj6fq",
+    E3zdtr: "f1mdlcz9",
+    B80jsxd: "f1nwj1ja",
+    t2ki1e: "ffmd2fr",
+    Bm2nyyq: "f8rth92",
+    Barhvk9: ["flthirb", "ftkbnf5"],
+    Bw17bha: "f1lh990p",
+    vfts7: ["ftkbnf5", "flthirb"],
+    xrcqlc: "fc9v8v1",
+    Ihftqj: ["f1mwfetb", "f18mat8f"],
+    Bcgy8vk: "f1cb6c3",
+    Bhxzhr1: ["f18mat8f", "f1mwfetb"],
+    B3778ie: ["f1ibwz09", "f1kp91vd"],
+    d9w3h3: ["f1kp91vd", "f1ibwz09"],
+    Bl18szs: ["f1pix4dl", "f13nd1z4"],
+    B4j8arr: ["f13nd1z4", "f1pix4dl"],
+    B0n5ga8: "f1qw5sz7",
+    s924m2: ["f19va7ni", "f1a9v3mw"],
+    B1q35kw: "fkkziue",
+    Gp14am: ["f1a9v3mw", "f19va7ni"],
+    bn5sak: "f1a97anr",
+    By385i5: "f5226zp",
+    Eqx8gd: ["fa2bdqt", "fei6g0k"],
+    B1piin3: ["fei6g0k", "fa2bdqt"]
   },
-  "disabled": {
-    "sj55zd": "f1s2aq7o",
-    "Jwef8y": "f9ql6rf",
-    "ecr2s2": "fgj9um3",
-    "Bbusuzp": "f1dcs8yz"
+  disabled: {
+    sj55zd: "f1s2aq7o",
+    Jwef8y: "f9ql6rf",
+    ecr2s2: "fgj9um3",
+    Bbusuzp: "f1dcs8yz"
   },
-  "selected": {},
-  "checkIcon": {
-    "Be2twd7": "fod5ikn",
-    "Frg6f3": ["f18b9hdq", "fn6qj8t"],
-    "t21cq0": ["f1xk557c", "f1h9en5y"],
-    "Bcdw1i0": "fd7fpy0",
-    "Bo70h7d": "fvc9v3g"
+  selected: {},
+  checkIcon: {
+    Be2twd7: "fod5ikn",
+    Frg6f3: ["f18b9hdq", "fn6qj8t"],
+    t21cq0: ["f1xk557c", "f1h9en5y"],
+    Bcdw1i0: "fd7fpy0",
+    Bo70h7d: "fvc9v3g"
   },
-  "multiselectCheck": {
-    "sj55zd": "f11d4kpn",
-    "Be2twd7": "f1pp30po",
-    "Bcdw1i0": "f1022m68"
+  multiselectCheck: {
+    sj55zd: "f11d4kpn",
+    Be2twd7: "f1pp30po",
+    Bcdw1i0: "f1022m68"
   },
-  "selectedCheck": {
-    "Bcdw1i0": "f1022m68"
+  selectedCheck: {
+    Bcdw1i0: "f1022m68"
   },
-  "selectedMultiselectCheck": {
-    "sj55zd": "f1817uup"
+  selectedMultiselectCheck: {
+    sj55zd: "f1817uup"
   },
-  "checkDisabled": {
-    "sj55zd": "f1s2aq7o",
-    "Bbusuzp": "f1dcs8yz"
+  checkDisabled: {
+    sj55zd: "f1s2aq7o",
+    Bbusuzp: "f1dcs8yz"
   }
 }, {
-  "d": [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".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);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}", ".f1k6fduh{cursor:pointer;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fp2oml8{padding-top:var(--spacingVerticalSNudge);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f1tdddsa{padding-bottom:var(--spacingVerticalSNudge);}", ".f10pi13n{position:relative;}", ".f13zj6fq::after{content:\"\";}", ".f1mdlcz9::after{position:absolute;}", ".f1nwj1ja::after{pointer-events:none;}", ".ffmd2fr::after{z-index:1;}", ".f8rth92::after{border-top-style:solid;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f1lh990p::after{border-bottom-style:solid;}", ".fc9v8v1::after{border-top-width:2px;}", ".f1mwfetb::after{border-right-width:2px;}", ".f18mat8f::after{border-left-width:2px;}", ".f1cb6c3::after{border-bottom-width:2px;}", ".f1ibwz09::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kp91vd::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1pix4dl::after{border-top-right-radius:var(--borderRadiusMedium);}", ".f13nd1z4::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1qw5sz7::after{border-top-color:var(--colorStrokeFocus2);}", ".f19va7ni::after{border-right-color:var(--colorStrokeFocus2);}", ".f1a9v3mw::after{border-left-color:var(--colorStrokeFocus2);}", ".fkkziue::after{border-bottom-color:var(--colorStrokeFocus2);}", ".f1a97anr::after{top:-2px;}", ".f5226zp::after{bottom:-2px;}", ".fa2bdqt::after{left:-2px;}", ".fei6g0k::after{right:-2px;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f18b9hdq{margin-left:calc(var(--spacingHorizontalXXS) * -1);}", ".fn6qj8t{margin-right:calc(var(--spacingHorizontalXXS) * -1);}", ".f1xk557c{margin-right:var(--spacingHorizontalXXS);}", ".f1h9en5y{margin-left:var(--spacingHorizontalXXS);}", ".fd7fpy0{visibility:hidden;}", ".fvc9v3g svg{display:block;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f1022m68{visibility:visible;}", ".f1817uup{color:var(--colorBrandBackground);}"],
-  "h": [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".f9ql6rf:hover{background-color:var(--colorTransparentBackground);}"],
-  "a": [".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".fgj9um3:active{background-color:var(--colorTransparentBackground);}"],
-  "m": [["@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}", {
-    "m": "(forced-colors: active)"
+  d: [".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".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);}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1ufnopg{-webkit-column-gap:var(--spacingHorizontalXS);column-gap:var(--spacingHorizontalXS);}", ".f1k6fduh{cursor:pointer;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fp2oml8{padding-top:var(--spacingVerticalSNudge);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f1tdddsa{padding-bottom:var(--spacingVerticalSNudge);}", ".f10pi13n{position:relative;}", ".f13zj6fq::after{content:\"\";}", ".f1mdlcz9::after{position:absolute;}", ".f1nwj1ja::after{pointer-events:none;}", ".ffmd2fr::after{z-index:1;}", ".f8rth92::after{border-top-style:solid;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f1lh990p::after{border-bottom-style:solid;}", ".fc9v8v1::after{border-top-width:2px;}", ".f1mwfetb::after{border-right-width:2px;}", ".f18mat8f::after{border-left-width:2px;}", ".f1cb6c3::after{border-bottom-width:2px;}", ".f1ibwz09::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kp91vd::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1pix4dl::after{border-top-right-radius:var(--borderRadiusMedium);}", ".f13nd1z4::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f1qw5sz7::after{border-top-color:var(--colorStrokeFocus2);}", ".f19va7ni::after{border-right-color:var(--colorStrokeFocus2);}", ".f1a9v3mw::after{border-left-color:var(--colorStrokeFocus2);}", ".fkkziue::after{border-bottom-color:var(--colorStrokeFocus2);}", ".f1a97anr::after{top:-2px;}", ".f5226zp::after{bottom:-2px;}", ".fa2bdqt::after{left:-2px;}", ".fei6g0k::after{right:-2px;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f18b9hdq{margin-left:calc(var(--spacingHorizontalXXS) * -1);}", ".fn6qj8t{margin-right:calc(var(--spacingHorizontalXXS) * -1);}", ".f1xk557c{margin-right:var(--spacingHorizontalXXS);}", ".f1h9en5y{margin-left:var(--spacingHorizontalXXS);}", ".fd7fpy0{visibility:hidden;}", ".fvc9v3g svg{display:block;}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f1022m68{visibility:visible;}", ".f1817uup{color:var(--colorBrandBackground);}"],
+  h: [".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".f9ql6rf:hover{background-color:var(--colorTransparentBackground);}"],
+  a: [".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".fgj9um3:active{background-color:var(--colorTransparentBackground);}"],
+  m: [["@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}", {
+    m: "(forced-colors: active)"
   }], ["@media (forced-colors: active){.f1dcs8yz{color:GrayText;}}", {
-    "m": "(forced-colors: active)"
+    m: "(forced-colors: active)"
   }]]
 });
 /**
  * Apply styling to the Option slots based on the state
  */
-
-
 const useOptionStyles_unstable = state => {
   const {
     active,
@@ -119,13 +113,10 @@ const useOptionStyles_unstable = state => {
   } = state;
   const styles = useStyles();
   state.root.className = react_1.mergeClasses(exports.optionClassNames.root, styles.root, active && focusVisible && styles.active, disabled && styles.disabled, selected && styles.selected, state.root.className);
-
   if (state.checkIcon) {
     state.checkIcon.className = react_1.mergeClasses(exports.optionClassNames.checkIcon, styles.checkIcon, state.checkIcon.className, multiselect && styles.multiselectCheck, selected && styles.selectedCheck, selected && multiselect && styles.selectedMultiselectCheck, disabled && styles.checkDisabled);
   }
-
   return state;
 };
-
 exports.useOptionStyles_unstable = useOptionStyles_unstable;
 //# sourceMappingURL=useOptionStyles.js.map

package/lib-commonjs/components/Option/useOptionStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/Option/useOptionStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGa,OAAA,CAAA,gBAAA,GAAgD;EAC3D,IAAI,EAAE,YADqD;EAE3D,SAAS,EAAE;AAFgD,CAAhD;AAKb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAAlB;AAkGA;;AAEG;;;AACI,MAAM,wBAAwB,GAAI,KAAD,IAAoC;EAC1E,MAAM;IAAE,MAAF;IAAU,QAAV;IAAoB,YAApB;IAAkC,WAAlC;IAA+C;EAA/C,IAA4D,KAAlE;EACA,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,gBAAA,CAAiB,IADI,EAErB,MAAM,CAAC,IAFc,EAGrB,MAAM,IAAI,YAAV,IAA0B,MAAM,CAAC,MAHZ,EAIrB,QAAQ,IAAI,MAAM,CAAC,QAJE,EAKrB,QAAQ,IAAI,MAAM,CAAC,QALE,EAMrB,KAAK,CAAC,IAAN,CAAW,SANU,CAAvB;;EASA,IAAI,KAAK,CAAC,SAAV,EAAqB;IACnB,KAAK,CAAC,SAAN,CAAgB,SAAhB,GAA4B,OAAA,CAAA,YAAA,CAC1B,OAAA,CAAA,gBAAA,CAAiB,SADS,EAE1B,MAAM,CAAC,SAFmB,EAG1B,KAAK,CAAC,SAAN,CAAgB,SAHU,EAI1B,WAAW,IAAI,MAAM,CAAC,gBAJI,EAK1B,QAAQ,IAAI,MAAM,CAAC,aALO,EAM1B,QAAQ,IAAI,WAAZ,IAA2B,MAAM,CAAC,wBANR,EAO1B,QAAQ,IAAI,MAAM,CAAC,aAPO,CAA5B;EASD;;EAED,OAAO,KAAP;AACD,CAzBM;;AAAM,OAAA,CAAA,wBAAA,GAAwB,wBAAxB","sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { OptionSlots, OptionState } from './Option.types';\n\nexport const optionClassNames: SlotClassNames<OptionSlots> = {\n  root: 'fui-Option',\n  checkIcon: 'fui-Option__checkIcon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    alignItems: 'center',\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    color: tokens.colorNeutralForeground1,\n    columnGap: tokens.spacingHorizontalXS,\n    cursor: 'pointer',\n    display: 'flex',\n    fontFamily: tokens.fontFamilyBase,\n    fontSize: tokens.fontSizeBase300,\n    lineHeight: tokens.lineHeightBase300,\n    ...shorthands.padding(tokens.spacingVerticalSNudge, tokens.spacingHorizontalS),\n    position: 'relative',\n\n    '&:hover': {\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n    },\n\n    '&:active': {\n      backgroundColor: tokens.colorNeutralBackground1Pressed,\n    },\n  },\n\n  active: {\n    // taken from @fluentui/react-tabster\n    // cannot use createFocusIndicatorStyle() directly, since we aren't using the :focus selector\n    '::after': {\n      content: '\"\"',\n      position: 'absolute',\n      pointerEvents: 'none',\n      zIndex: 1,\n\n      ...shorthands.borderStyle('solid'),\n      ...shorthands.borderWidth('2px'),\n      ...shorthands.borderRadius(tokens.borderRadiusMedium),\n      ...shorthands.borderColor(tokens.colorStrokeFocus2),\n\n      top: '-2px',\n      bottom: '-2px',\n      left: '-2px',\n      right: '-2px',\n    },\n  },\n\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n\n    '&:hover': {\n      backgroundColor: tokens.colorTransparentBackground,\n    },\n\n    '&:active': {\n      backgroundColor: tokens.colorTransparentBackground,\n    },\n\n    '@media (forced-colors: active)': {\n      color: 'GrayText',\n    },\n  },\n\n  selected: {},\n\n  checkIcon: {\n    fontSize: tokens.fontSizeBase400,\n    // Shift icon(s) to the left to give text content extra spacing without needing an extra node\n    // This is done instead of gap since the extra space only exists between icon > content, not icon > icon\n    marginLeft: `calc(${tokens.spacingHorizontalXXS} * -1)`,\n    marginRight: tokens.spacingHorizontalXXS,\n    visibility: 'hidden',\n\n    '& svg': {\n      display: 'block',\n    },\n  },\n\n  multiselectCheck: {\n    color: tokens.colorNeutralForeground3,\n    fontSize: tokens.fontSizeBase500,\n    visibility: 'visible',\n  },\n\n  selectedCheck: {\n    visibility: 'visible',\n  },\n\n  selectedMultiselectCheck: {\n    color: tokens.colorBrandBackground,\n  },\n\n  checkDisabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n\n    '@media (forced-colors: active)': {\n      color: 'GrayText',\n    },\n  },\n});\n\n/**\n * Apply styling to the Option slots based on the state\n */\nexport const useOptionStyles_unstable = (state: OptionState): OptionState => {\n  const { active, disabled, focusVisible, multiselect, selected } = state;\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    optionClassNames.root,\n    styles.root,\n    active && focusVisible && styles.active,\n    disabled && styles.disabled,\n    selected && styles.selected,\n    state.root.className,\n  );\n\n  if (state.checkIcon) {\n    state.checkIcon.className = mergeClasses(\n      optionClassNames.checkIcon,\n      styles.checkIcon,\n      state.checkIcon.className,\n      multiselect && styles.multiselectCheck,\n      selected && styles.selectedCheck,\n      selected && multiselect && styles.selectedMultiselectCheck,\n      disabled && styles.checkDisabled,\n    );\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AAEA;AAGaA,wBAAgB,GAAgC;EAC3DC,IAAI,EAAE,YAAY;EAClBC,SAAS,EAAE;CACZ;AAED;;;AAGA,MAAMC,SAAS,gBAAGC,gBAAU;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAgG1B;AAEF;;;AAGO,MAAMC,wBAAwB,GAAIC,KAAkB,IAAiB;EAC1E,MAAM;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,YAAY;IAAEC,WAAW;IAAEC;EAAQ,CAAE,GAAGL,KAAK;EACvE,MAAMM,MAAM,GAAGT,SAAS,EAAE;EAC1BG,KAAK,CAACL,IAAI,CAACY,SAAS,GAAGT,oBAAY,CACjCJ,wBAAgB,CAACC,IAAI,EACrBW,MAAM,CAACX,IAAI,EACXM,MAAM,IAAIE,YAAY,IAAIG,MAAM,CAACL,MAAM,EACvCC,QAAQ,IAAII,MAAM,CAACJ,QAAQ,EAC3BG,QAAQ,IAAIC,MAAM,CAACD,QAAQ,EAC3BL,KAAK,CAACL,IAAI,CAACY,SAAS,CACrB;EAED,IAAIP,KAAK,CAACJ,SAAS,EAAE;IACnBI,KAAK,CAACJ,SAAS,CAACW,SAAS,GAAGT,oBAAY,CACtCJ,wBAAgB,CAACE,SAAS,EAC1BU,MAAM,CAACV,SAAS,EAChBI,KAAK,CAACJ,SAAS,CAACW,SAAS,EACzBH,WAAW,IAAIE,MAAM,CAACE,gBAAgB,EACtCH,QAAQ,IAAIC,MAAM,CAACG,aAAa,EAChCJ,QAAQ,IAAID,WAAW,IAAIE,MAAM,CAACI,wBAAwB,EAC1DR,QAAQ,IAAII,MAAM,CAACK,aAAa,CACjC;;EAGH,OAAOX,KAAK;AACd,CAAC;AAzBYN,gCAAwB","names":["exports","root","checkIcon","useStyles","react_1","useOptionStyles_unstable","state","active","disabled","focusVisible","multiselect","selected","styles","className","multiselectCheck","selectedCheck","selectedMultiselectCheck","checkDisabled"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/Option/useOptionStyles.ts"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { OptionSlots, OptionState } from './Option.types';\n\nexport const optionClassNames: SlotClassNames<OptionSlots> = {\n  root: 'fui-Option',\n  checkIcon: 'fui-Option__checkIcon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    alignItems: 'center',\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    color: tokens.colorNeutralForeground1,\n    columnGap: tokens.spacingHorizontalXS,\n    cursor: 'pointer',\n    display: 'flex',\n    fontFamily: tokens.fontFamilyBase,\n    fontSize: tokens.fontSizeBase300,\n    lineHeight: tokens.lineHeightBase300,\n    ...shorthands.padding(tokens.spacingVerticalSNudge, tokens.spacingHorizontalS),\n    position: 'relative',\n\n    '&:hover': {\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n    },\n\n    '&:active': {\n      backgroundColor: tokens.colorNeutralBackground1Pressed,\n    },\n  },\n\n  active: {\n    // taken from @fluentui/react-tabster\n    // cannot use createFocusIndicatorStyle() directly, since we aren't using the :focus selector\n    '::after': {\n      content: '\"\"',\n      position: 'absolute',\n      pointerEvents: 'none',\n      zIndex: 1,\n\n      ...shorthands.borderStyle('solid'),\n      ...shorthands.borderWidth('2px'),\n      ...shorthands.borderRadius(tokens.borderRadiusMedium),\n      ...shorthands.borderColor(tokens.colorStrokeFocus2),\n\n      top: '-2px',\n      bottom: '-2px',\n      left: '-2px',\n      right: '-2px',\n    },\n  },\n\n  disabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n\n    '&:hover': {\n      backgroundColor: tokens.colorTransparentBackground,\n    },\n\n    '&:active': {\n      backgroundColor: tokens.colorTransparentBackground,\n    },\n\n    '@media (forced-colors: active)': {\n      color: 'GrayText',\n    },\n  },\n\n  selected: {},\n\n  checkIcon: {\n    fontSize: tokens.fontSizeBase400,\n    // Shift icon(s) to the left to give text content extra spacing without needing an extra node\n    // This is done instead of gap since the extra space only exists between icon > content, not icon > icon\n    marginLeft: `calc(${tokens.spacingHorizontalXXS} * -1)`,\n    marginRight: tokens.spacingHorizontalXXS,\n    visibility: 'hidden',\n\n    '& svg': {\n      display: 'block',\n    },\n  },\n\n  multiselectCheck: {\n    color: tokens.colorNeutralForeground3,\n    fontSize: tokens.fontSizeBase500,\n    visibility: 'visible',\n  },\n\n  selectedCheck: {\n    visibility: 'visible',\n  },\n\n  selectedMultiselectCheck: {\n    color: tokens.colorBrandBackground,\n  },\n\n  checkDisabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n\n    '@media (forced-colors: active)': {\n      color: 'GrayText',\n    },\n  },\n});\n\n/**\n * Apply styling to the Option slots based on the state\n */\nexport const useOptionStyles_unstable = (state: OptionState): OptionState => {\n  const { active, disabled, focusVisible, multiselect, selected } = state;\n  const styles = useStyles();\n  state.root.className = mergeClasses(\n    optionClassNames.root,\n    styles.root,\n    active && focusVisible && styles.active,\n    disabled && styles.disabled,\n    selected && styles.selected,\n    state.root.className,\n  );\n\n  if (state.checkIcon) {\n    state.checkIcon.className = mergeClasses(\n      optionClassNames.checkIcon,\n      styles.checkIcon,\n      state.checkIcon.className,\n      multiselect && styles.multiselectCheck,\n      selected && styles.selectedCheck,\n      selected && multiselect && styles.selectedMultiselectCheck,\n      disabled && styles.checkDisabled,\n    );\n  }\n\n  return state;\n};\n"]}

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

@@ -4,19 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.OptionGroup = void 0;
-
 const React = /*#__PURE__*/require("react");
-
 const useOptionGroup_1 = /*#__PURE__*/require("./useOptionGroup");
-
 const renderOptionGroup_1 = /*#__PURE__*/require("./renderOptionGroup");
-
 const useOptionGroupStyles_1 = /*#__PURE__*/require("./useOptionGroupStyles");
 /**
  * OptionGroup component: allows grouping of Option components within a Combobox
  */
-
-
 exports.OptionGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useOptionGroup_1.useOptionGroup_unstable(props, ref);
   useOptionGroupStyles_1.useOptionGroupStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/OptionGroup/OptionGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EAChG,MAAM,KAAK,GAAG,gBAAA,CAAA,uBAAA,CAAwB,KAAxB,EAA+B,GAA/B,CAAd;EAEA,sBAAA,CAAA,6BAAA,CAA8B,KAA9B;EACA,OAAO,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,CAAP;AACD,CALiE,CAArD;AAOb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { useOptionGroup_unstable } from './useOptionGroup';\nimport { renderOptionGroup_unstable } from './renderOptionGroup';\nimport { useOptionGroupStyles_unstable } from './useOptionGroupStyles';\nimport type { OptionGroupProps } from './OptionGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * OptionGroup component: allows grouping of Option components within a Combobox\n */\nexport const OptionGroup: ForwardRefComponent<OptionGroupProps> = React.forwardRef((props, ref) => {\n  const state = useOptionGroup_unstable(props, ref);\n\n  useOptionGroupStyles_unstable(state);\n  return renderOptionGroup_unstable(state);\n});\n\nOptionGroup.displayName = 'OptionGroup';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,mBAAW,gBAA0CC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGC,wCAAuB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEjDG,oDAA6B,CAACF,KAAK,CAAC;EACpC,OAAOG,8CAA0B,CAACH,KAAK,CAAC;AAC1C,CAAC,CAAC;AAEFL,mBAAW,CAACS,WAAW,GAAG,aAAa","names":["exports","React","forwardRef","props","ref","state","useOptionGroup_1","useOptionGroupStyles_1","renderOptionGroup_1","displayName"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/OptionGroup/OptionGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useOptionGroup_unstable } from './useOptionGroup';\nimport { renderOptionGroup_unstable } from './renderOptionGroup';\nimport { useOptionGroupStyles_unstable } from './useOptionGroupStyles';\nimport type { OptionGroupProps } from './OptionGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * OptionGroup component: allows grouping of Option components within a Combobox\n */\nexport const OptionGroup: ForwardRefComponent<OptionGroupProps> = React.forwardRef((props, ref) => {\n  const state = useOptionGroup_unstable(props, ref);\n\n  useOptionGroupStyles_unstable(state);\n  return renderOptionGroup_unstable(state);\n});\n\nOptionGroup.displayName = 'OptionGroup';\n"]}

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

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

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

@@ -3,16 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 const tslib_1 = /*#__PURE__*/require("tslib");
-
 tslib_1.__exportStar(require("./OptionGroup"), exports);
-
 tslib_1.__exportStar(require("./OptionGroup.types"), exports);
-
 tslib_1.__exportStar(require("./renderOptionGroup"), exports);
-
 tslib_1.__exportStar(require("./useOptionGroup"), exports);
-
 tslib_1.__exportStar(require("./useOptionGroupStyles"), exports);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/OptionGroup/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './OptionGroup';\nexport * from './OptionGroup.types';\nexport * from './renderOptionGroup';\nexport * from './useOptionGroup';\nexport * from './useOptionGroupStyles';\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/OptionGroup/index.ts"],"sourcesContent":["export * from './OptionGroup';\nexport * from './OptionGroup.types';\nexport * from './renderOptionGroup';\nexport * from './useOptionGroup';\nexport * from './useOptionGroupStyles';\n"]}

package/lib-commonjs/components/OptionGroup/renderOptionGroup.js

@@ -4,24 +4,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.renderOptionGroup_unstable = void 0;
-
 const React = /*#__PURE__*/require("react");
-
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Render the final JSX of OptionGroup
  */
-
-
 const renderOptionGroup_unstable = state => {
   const {
     slots,
     slotProps
   } = react_utilities_1.getSlots(state);
-  return React.createElement(slots.root, { ...slotProps.root
-  }, slots.label && React.createElement(slots.label, { ...slotProps.label
+  return React.createElement(slots.root, {
+    ...slotProps.root
+  }, slots.label && React.createElement(slots.label, {
+    ...slotProps.label
   }, slotProps.label.children), slotProps.root.children);
 };
-
 exports.renderOptionGroup_unstable = renderOptionGroup_unstable;
 //# sourceMappingURL=renderOptionGroup.js.map

package/lib-commonjs/components/OptionGroup/renderOptionGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/OptionGroup/renderOptionGroup.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAA4B;EACpE,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAA2B,KAA3B,CAA7B;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,IAAe,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,EAAmC,SAAS,CAAC,KAAV,CAAgB,QAAnD,CADlB,EAEG,SAAS,CAAC,IAAV,CAAe,QAFlB,CADF;AAMD,CATM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { OptionGroupState, OptionGroupSlots } from './OptionGroup.types';\n\n/**\n * Render the final JSX of OptionGroup\n */\nexport const renderOptionGroup_unstable = (state: OptionGroupState) => {\n  const { slots, slotProps } = getSlots<OptionGroupSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && <slots.label {...slotProps.label}>{slotProps.label.children}</slots.label>}\n      {slotProps.root.children}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,0BAA0B,GAAIC,KAAuB,IAAI;EACpE,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAmBH,KAAK,CAAC;EAE9D,OACEI,oBAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BJ,KAAK,CAACK,KAAK,IAAIF,oBAACH,KAAK,CAACK,KAAK;IAAA,GAAKJ,SAAS,CAACI;EAAK,GAAGJ,SAAS,CAACI,KAAK,CAACC,QAAQ,CAAe,EACzFL,SAAS,CAACG,IAAI,CAACE,QAAQ,CACb;AAEjB,CAAC;AATYC,kCAA0B","names":["renderOptionGroup_unstable","state","slots","slotProps","react_utilities_1","React","root","label","children","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/OptionGroup/renderOptionGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { OptionGroupState, OptionGroupSlots } from './OptionGroup.types';\n\n/**\n * Render the final JSX of OptionGroup\n */\nexport const renderOptionGroup_unstable = (state: OptionGroupState) => {\n  const { slots, slotProps } = getSlots<OptionGroupSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && <slots.label {...slotProps.label}>{slotProps.label.children}</slots.label>}\n      {slotProps.root.children}\n    </slots.root>\n  );\n};\n"]}

package/lib-commonjs/components/OptionGroup/useOptionGroup.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useOptionGroup_unstable = void 0;
-
 const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
 /**
  * Create the state required to render OptionGroup.
@@ -15,8 +14,6 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
  * @param props - props from this instance of OptionGroup
  * @param ref - reference to root HTMLElement of OptionGroup
  */
-
-
 const useOptionGroup_unstable = (props, ref) => {
   const labelId = react_utilities_1.useId('group-label');
   const {
@@ -41,6 +38,5 @@ const useOptionGroup_unstable = (props, ref) => {
     })
   };
 };
-
 exports.useOptionGroup_unstable = useOptionGroup_unstable;
 //# sourceMappingURL=useOptionGroup.js.map

package/lib-commonjs/components/OptionGroup/useOptionGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/OptionGroup/useOptionGroup.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,uBAAuB,GAAG,CAAC,KAAD,EAA0B,GAA1B,KAA2E;EAChH,MAAM,OAAO,GAAG,iBAAA,CAAA,KAAA,CAAM,aAAN,CAAhB;EACA,MAAM;IAAE;EAAF,IAAY,KAAlB;EAEA,OAAO;IACL,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,KAAK,EAAE;IAFG,CADP;IAKL,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;MACjC,GADiC;MAEjC,IAAI,EAAE,OAF2B;MAGjC,mBAAmB,KAAK,GAAG,OAAH,GAAa,SAHJ;MAIjC,GAAG;IAJ8B,CAA7B,CALD;IAWL,KAAK,EAAE,iBAAA,CAAA,gBAAA,CAAiB,KAAjB,EAAwB;MAC7B,YAAY,EAAE;QACZ,EAAE,EAAE,OADQ;QAEZ,IAAI,EAAE;MAFM;IADe,CAAxB;EAXF,CAAP;AAkBD,CAtBM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { OptionGroupProps, OptionGroupState } from './OptionGroup.types';\n\n/**\n * Create the state required to render OptionGroup.\n *\n * The returned state can be modified with hooks such as useOptionGroupStyles_unstable,\n * before being passed to renderOptionGroup_unstable.\n *\n * @param props - props from this instance of OptionGroup\n * @param ref - reference to root HTMLElement of OptionGroup\n */\nexport const useOptionGroup_unstable = (props: OptionGroupProps, ref: React.Ref<HTMLElement>): OptionGroupState => {\n  const labelId = useId('group-label');\n  const { label } = props;\n\n  return {\n    components: {\n      root: 'div',\n      label: 'span',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      role: 'group',\n      'aria-labelledby': label ? labelId : undefined,\n      ...props,\n    }),\n    label: resolveShorthand(label, {\n      defaultProps: {\n        id: labelId,\n        role: 'presentation',\n      },\n    }),\n  };\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AACA;AAGA;;;;;;;;;AASO,MAAMA,uBAAuB,GAAG,CAACC,KAAuB,EAAEC,GAA2B,KAAsB;EAChH,MAAMC,OAAO,GAAGC,uBAAK,CAAC,aAAa,CAAC;EACpC,MAAM;IAAEC;EAAK,CAAE,GAAGJ,KAAK;EAEvB,OAAO;IACLK,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXF,KAAK,EAAE;KACR;IACDE,IAAI,EAAEH,uCAAqB,CAAC,KAAK,EAAE;MACjCF,GAAG;MACHM,IAAI,EAAE,OAAO;MACb,iBAAiB,EAAEH,KAAK,GAAGF,OAAO,GAAGM,SAAS;MAC9C,GAAGR;KACJ,CAAC;IACFI,KAAK,EAAED,kCAAgB,CAACC,KAAK,EAAE;MAC7BK,YAAY,EAAE;QACZC,EAAE,EAAER,OAAO;QACXK,IAAI,EAAE;;KAET;GACF;AACH,CAAC;AAtBYI,+BAAuB","names":["useOptionGroup_unstable","props","ref","labelId","react_utilities_1","label","components","root","role","undefined","defaultProps","id","exports"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/OptionGroup/useOptionGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport type { OptionGroupProps, OptionGroupState } from './OptionGroup.types';\n\n/**\n * Create the state required to render OptionGroup.\n *\n * The returned state can be modified with hooks such as useOptionGroupStyles_unstable,\n * before being passed to renderOptionGroup_unstable.\n *\n * @param props - props from this instance of OptionGroup\n * @param ref - reference to root HTMLElement of OptionGroup\n */\nexport const useOptionGroup_unstable = (props: OptionGroupProps, ref: React.Ref<HTMLElement>): OptionGroupState => {\n  const labelId = useId('group-label');\n  const { label } = props;\n\n  return {\n    components: {\n      root: 'div',\n      label: 'span',\n    },\n    root: getNativeElementProps('div', {\n      ref,\n      role: 'group',\n      'aria-labelledby': label ? labelId : undefined,\n      ...props,\n    }),\n    label: resolveShorthand(label, {\n      defaultProps: {\n        id: labelId,\n        role: 'presentation',\n      },\n    }),\n  };\n};\n"]}

package/lib-commonjs/components/OptionGroup/useOptionGroupStyles.js

@@ -4,11 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useOptionGroupStyles_unstable = exports.optionGroupClassNames = void 0;
-
 const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
-
 const react_1 = /*#__PURE__*/require("@griffel/react");
-
 exports.optionGroupClassNames = {
   root: 'fui-OptionGroup',
   label: 'fui-OptionGroup__label'
@@ -16,56 +13,50 @@ exports.optionGroupClassNames = {
 /**
  * Styles for the root slot
  */
-
 const useStyles = /*#__PURE__*/react_1.__styles({
-  "root": {
-    "mc9l5x": "f22iagw",
-    "Beiy3e4": "f1vx9l62",
-    "Belr9w4": "fiut8dr",
-    "B8lkq7l": "f1xxzjds",
-    "Gwp8xu": "fu19d3i",
-    "H93o2g": "flylvvz",
-    "eii1in": "f1ug5m11",
-    "om0q45": "f5642y",
-    "Hl9o3s": "ffdf81h",
-    "Bi9x0x4": "flgyru6",
-    "B0i58d9": ["f1fjgumo", "f1sgo0dv"],
-    "sl1c2c": "fwsdxdw",
-    "z4hxbw": ["f1sgo0dv", "f1fjgumo"]
+  root: {
+    mc9l5x: "f22iagw",
+    Beiy3e4: "f1vx9l62",
+    Belr9w4: "fiut8dr",
+    B8lkq7l: "f1xxzjds",
+    Gwp8xu: "fu19d3i",
+    H93o2g: "flylvvz",
+    eii1in: "f1ug5m11",
+    om0q45: "f5642y",
+    Hl9o3s: "ffdf81h",
+    Bi9x0x4: "flgyru6",
+    B0i58d9: ["f1fjgumo", "f1sgo0dv"],
+    sl1c2c: "fwsdxdw",
+    z4hxbw: ["f1sgo0dv", "f1fjgumo"]
   },
-  "label": {
-    "Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
-    "Beyfa6y": ["f16jpd5f", "f1aa9q02"],
-    "B7oj6ja": ["f1jar5jt", "fyu767a"],
-    "Btl43ni": ["fyu767a", "f1jar5jt"],
-    "sj55zd": "f11d4kpn",
-    "mc9l5x": "ftgm304",
-    "Be2twd7": "fy9rknc",
-    "Bhrd7zp": "fl43uef",
-    "Bg96gwp": "fwrc4pm",
-    "z8tnut": "f17mpqex",
-    "z189sj": ["fdw0yi8", "fk8j09s"],
-    "Byoj8tv": "fdvome7",
-    "uwmqm3": ["fk8j09s", "fdw0yi8"]
+  label: {
+    Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
+    Beyfa6y: ["f16jpd5f", "f1aa9q02"],
+    B7oj6ja: ["f1jar5jt", "fyu767a"],
+    Btl43ni: ["fyu767a", "f1jar5jt"],
+    sj55zd: "f11d4kpn",
+    mc9l5x: "ftgm304",
+    Be2twd7: "fy9rknc",
+    Bhrd7zp: "fl43uef",
+    Bg96gwp: "fwrc4pm",
+    z8tnut: "f17mpqex",
+    z189sj: ["fdw0yi8", "fk8j09s"],
+    Byoj8tv: "fdvome7",
+    uwmqm3: ["fk8j09s", "fdw0yi8"]
   }
 }, {
-  "d": [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fiut8dr{row-gap:var(--spacingHorizontalXXS);}", ".f1xxzjds:not(:last-child)::after{content:\"\";}", ".fu19d3i:not(:last-child)::after{border-bottom-width:var(--strokeWidthThin);}", ".flylvvz:not(:last-child)::after{border-bottom-style:solid;}", ".f1ug5m11:not(:last-child)::after{border-bottom-color:var(--colorNeutralStroke2);}", ".f5642y:not(:last-child)::after{display:block;}", ".ffdf81h:not(:last-child)::after{padding-bottom:var(--spacingHorizontalXS);}", ".flgyru6:not(:last-child)::after{margin-top:0;}", ".f1fjgumo:not(:last-child)::after{margin-right:calc(var(--spacingHorizontalXS) * -1);}", ".f1sgo0dv:not(:last-child)::after{margin-left:calc(var(--spacingHorizontalXS) * -1);}", ".fwsdxdw:not(:last-child)::after{margin-bottom:var(--spacingVerticalXS);}", ".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);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".ftgm304{display:block;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mpqex{padding-top:var(--spacingHorizontalS);}", ".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}", ".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}", ".fdvome7{padding-bottom:var(--spacingHorizontalS);}"]
+  d: [".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}", ".fiut8dr{row-gap:var(--spacingHorizontalXXS);}", ".f1xxzjds:not(:last-child)::after{content:\"\";}", ".fu19d3i:not(:last-child)::after{border-bottom-width:var(--strokeWidthThin);}", ".flylvvz:not(:last-child)::after{border-bottom-style:solid;}", ".f1ug5m11:not(:last-child)::after{border-bottom-color:var(--colorNeutralStroke2);}", ".f5642y:not(:last-child)::after{display:block;}", ".ffdf81h:not(:last-child)::after{padding-bottom:var(--spacingHorizontalXS);}", ".flgyru6:not(:last-child)::after{margin-top:0;}", ".f1fjgumo:not(:last-child)::after{margin-right:calc(var(--spacingHorizontalXS) * -1);}", ".f1sgo0dv:not(:last-child)::after{margin-left:calc(var(--spacingHorizontalXS) * -1);}", ".fwsdxdw:not(:last-child)::after{margin-bottom:var(--spacingVerticalXS);}", ".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);}", ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".ftgm304{display:block;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".f17mpqex{padding-top:var(--spacingHorizontalS);}", ".fdw0yi8{padding-right:var(--spacingHorizontalSNudge);}", ".fk8j09s{padding-left:var(--spacingHorizontalSNudge);}", ".fdvome7{padding-bottom:var(--spacingHorizontalS);}"]
 });
 /**
  * Apply styling to the OptionGroup slots based on the state
  */
-
-
 const useOptionGroupStyles_unstable = state => {
   const styles = useStyles();
   state.root.className = react_1.mergeClasses(exports.optionGroupClassNames.root, styles.root, state.root.className);
-
   if (state.label) {
     state.label.className = react_1.mergeClasses(exports.optionGroupClassNames.label, styles.label, state.label.className);
   }
-
   return state;
 };
-
 exports.useOptionGroupStyles_unstable = useOptionGroupStyles_unstable;
 //# sourceMappingURL=useOptionGroupStyles.js.map

package/lib-commonjs/components/OptionGroup/useOptionGroupStyles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/components/OptionGroup/useOptionGroupStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAGa,OAAA,CAAA,qBAAA,GAA0D;EACrE,IAAI,EAAE,iBAD+D;EAErE,KAAK,EAAE;AAF8D,CAA1D;AAKb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAlB;AA0BA;;AAEG;;;AACI,MAAM,6BAA6B,GAAI,KAAD,IAA8C;EACzF,MAAM,MAAM,GAAG,SAAS,EAAxB;EACA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,qBAAA,CAAsB,IAAnC,EAAyC,MAAM,CAAC,IAAhD,EAAsD,KAAK,CAAC,IAAN,CAAW,SAAjE,CAAvB;;EAEA,IAAI,KAAK,CAAC,KAAV,EAAiB;IACf,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,qBAAA,CAAsB,KAAnC,EAA0C,MAAM,CAAC,KAAjD,EAAwD,KAAK,CAAC,KAAN,CAAY,SAApE,CAAxB;EACD;;EAED,OAAO,KAAP;AACD,CATM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { OptionGroupSlots, OptionGroupState } from './OptionGroup.types';\n\nexport const optionGroupClassNames: SlotClassNames<OptionGroupSlots> = {\n  root: 'fui-OptionGroup',\n  label: 'fui-OptionGroup__label',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    rowGap: tokens.spacingHorizontalXXS,\n\n    '&:not(:last-child)::after': {\n      content: '\"\"',\n      ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n      display: 'block',\n      paddingBottom: tokens.spacingHorizontalXS,\n      ...shorthands.margin(0, `calc(${tokens.spacingHorizontalXS} * -1)`, tokens.spacingVerticalXS),\n    },\n  },\n\n  label: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    color: tokens.colorNeutralForeground3,\n    display: 'block',\n    fontSize: tokens.fontSizeBase200,\n    fontWeight: tokens.fontWeightSemibold,\n    lineHeight: tokens.lineHeightBase200,\n    ...shorthands.padding(tokens.spacingHorizontalS, tokens.spacingHorizontalSNudge),\n  },\n});\n\n/**\n * Apply styling to the OptionGroup slots based on the state\n */\nexport const useOptionGroupStyles_unstable = (state: OptionGroupState): OptionGroupState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(optionGroupClassNames.root, styles.root, state.root.className);\n\n  if (state.label) {\n    state.label.className = mergeClasses(optionGroupClassNames.label, styles.label, state.label.className);\n  }\n\n  return state;\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AAEA;AAGaA,6BAAqB,GAAqC;EACrEC,IAAI,EAAE,iBAAiB;EACvBC,KAAK,EAAE;CACR;AAED;;;AAGA,MAAMC,SAAS,gBAAGC,gBAAU;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAwB1B;AAEF;;;AAGO,MAAMC,6BAA6B,GAAIC,KAAuB,IAAsB;EACzF,MAAMC,MAAM,GAAGJ,SAAS,EAAE;EAC1BG,KAAK,CAACL,IAAI,CAACO,SAAS,GAAGJ,oBAAY,CAACJ,6BAAqB,CAACC,IAAI,EAAEM,MAAM,CAACN,IAAI,EAAEK,KAAK,CAACL,IAAI,CAACO,SAAS,CAAC;EAElG,IAAIF,KAAK,CAACJ,KAAK,EAAE;IACfI,KAAK,CAACJ,KAAK,CAACM,SAAS,GAAGJ,oBAAY,CAACJ,6BAAqB,CAACE,KAAK,EAAEK,MAAM,CAACL,KAAK,EAAEI,KAAK,CAACJ,KAAK,CAACM,SAAS,CAAC;;EAGxG,OAAOF,KAAK;AACd,CAAC;AATYN,qCAA6B","names":["exports","root","label","useStyles","react_1","useOptionGroupStyles_unstable","state","styles","className"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/components/OptionGroup/useOptionGroupStyles.ts"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport type { OptionGroupSlots, OptionGroupState } from './OptionGroup.types';\n\nexport const optionGroupClassNames: SlotClassNames<OptionGroupSlots> = {\n  root: 'fui-OptionGroup',\n  label: 'fui-OptionGroup__label',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    display: 'flex',\n    flexDirection: 'column',\n    rowGap: tokens.spacingHorizontalXXS,\n\n    '&:not(:last-child)::after': {\n      content: '\"\"',\n      ...shorthands.borderBottom(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n      display: 'block',\n      paddingBottom: tokens.spacingHorizontalXS,\n      ...shorthands.margin(0, `calc(${tokens.spacingHorizontalXS} * -1)`, tokens.spacingVerticalXS),\n    },\n  },\n\n  label: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n    color: tokens.colorNeutralForeground3,\n    display: 'block',\n    fontSize: tokens.fontSizeBase200,\n    fontWeight: tokens.fontWeightSemibold,\n    lineHeight: tokens.lineHeightBase200,\n    ...shorthands.padding(tokens.spacingHorizontalS, tokens.spacingHorizontalSNudge),\n  },\n});\n\n/**\n * Apply styling to the OptionGroup slots based on the state\n */\nexport const useOptionGroupStyles_unstable = (state: OptionGroupState): OptionGroupState => {\n  const styles = useStyles();\n  state.root.className = mergeClasses(optionGroupClassNames.root, styles.root, state.root.className);\n\n  if (state.label) {\n    state.label.className = mergeClasses(optionGroupClassNames.label, styles.label, state.label.className);\n  }\n\n  return state;\n};\n"]}

package/lib-commonjs/contexts/ComboboxContext.js

@@ -4,31 +4,26 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ComboboxProvider = exports.ComboboxContext = void 0;
-
-const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector"); // eslint-disable-next-line @fluentui/no-context-default-value
-
-
+const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector");
+// eslint-disable-next-line @fluentui/no-context-default-value
 exports.ComboboxContext = /*#__PURE__*/react_context_selector_1.createContext({
   activeOption: undefined,
   appearance: 'outline',
   focusVisible: false,
   open: false,
-
   registerOption() {
     return () => undefined;
   },
-
   selectedOptions: [],
-
-  selectOption() {// noop
+  selectOption() {
+    // noop
   },
-
-  setActiveOption() {// noop
+  setActiveOption() {
+    // noop
   },
-
-  setOpen() {// noop
+  setOpen() {
+    // noop
   },
-
   size: 'medium'
 });
 exports.ComboboxProvider = exports.ComboboxContext.Provider;

package/lib-commonjs/contexts/ComboboxContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/contexts/ComboboxContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA,C,CAoBA;;;AACa,OAAA,CAAA,eAAA,gBAAkB,wBAAA,CAAA,aAAA,CAAoC;EACjE,YAAY,EAAE,SADmD;EAEjE,UAAU,EAAE,SAFqD;EAGjE,YAAY,EAAE,KAHmD;EAIjE,IAAI,EAAE,KAJ2D;;EAKjE,cAAc,GAAA;IACZ,OAAO,MAAM,SAAb;EACD,CAPgE;;EAQjE,eAAe,EAAE,EARgD;;EASjE,YAAY,GAAA,CACV;EACD,CAXgE;;EAYjE,eAAe,GAAA,CACb;EACD,CAdgE;;EAejE,OAAO,GAAA,CACL;EACD,CAjBgE;;EAkBjE,IAAI,EAAE;AAlB2D,CAApC,CAAlB;AAqBA,OAAA,CAAA,gBAAA,GAAmB,OAAA,CAAA,eAAA,CAAgB,QAAnC","sourcesContent":["import { createContext } from '@fluentui/react-context-selector';\nimport { ComboboxState } from '../components/Combobox/Combobox.types';\n\n/**\n * Context shared with Combobox, Listbox, & Options\n */\nexport type ComboboxContextValue = Pick<\n  ComboboxState,\n  | 'activeOption'\n  | 'appearance'\n  | 'focusVisible'\n  | 'open'\n  | 'registerOption'\n  | 'selectedOptions'\n  | 'selectOption'\n  | 'setActiveOption'\n  | 'setOpen'\n  | 'size'\n>;\n\n// eslint-disable-next-line @fluentui/no-context-default-value\nexport const ComboboxContext = createContext<ComboboxContextValue>({\n  activeOption: undefined,\n  appearance: 'outline',\n  focusVisible: false,\n  open: false,\n  registerOption() {\n    return () => undefined;\n  },\n  selectedOptions: [],\n  selectOption() {\n    // noop\n  },\n  setActiveOption() {\n    // noop\n  },\n  setOpen() {\n    // noop\n  },\n  size: 'medium',\n});\n\nexport const ComboboxProvider = ComboboxContext.Provider;\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AAoBA;AACaA,uBAAe,gBAAGC,sCAAa,CAAuB;EACjEC,YAAY,EAAEC,SAAS;EACvBC,UAAU,EAAE,SAAS;EACrBC,YAAY,EAAE,KAAK;EACnBC,IAAI,EAAE,KAAK;EACXC,cAAc;IACZ,OAAO,MAAMJ,SAAS;EACxB,CAAC;EACDK,eAAe,EAAE,EAAE;EACnBC,YAAY;IACV;EAAA,CACD;EACDC,eAAe;IACb;EAAA,CACD;EACDC,OAAO;IACL;EAAA,CACD;EACDC,IAAI,EAAE;CACP,CAAC;AAEWZ,wBAAgB,GAAGA,uBAAe,CAACa,QAAQ","names":["exports","react_context_selector_1","activeOption","undefined","appearance","focusVisible","open","registerOption","selectedOptions","selectOption","setActiveOption","setOpen","size","Provider"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/contexts/ComboboxContext.ts"],"sourcesContent":["import { createContext } from '@fluentui/react-context-selector';\nimport { ComboboxState } from '../components/Combobox/Combobox.types';\n\n/**\n * Context shared with Combobox, Listbox, & Options\n */\nexport type ComboboxContextValue = Pick<\n  ComboboxState,\n  | 'activeOption'\n  | 'appearance'\n  | 'focusVisible'\n  | 'open'\n  | 'registerOption'\n  | 'selectedOptions'\n  | 'selectOption'\n  | 'setActiveOption'\n  | 'setOpen'\n  | 'size'\n>;\n\n// eslint-disable-next-line @fluentui/no-context-default-value\nexport const ComboboxContext = createContext<ComboboxContextValue>({\n  activeOption: undefined,\n  appearance: 'outline',\n  focusVisible: false,\n  open: false,\n  registerOption() {\n    return () => undefined;\n  },\n  selectedOptions: [],\n  selectOption() {\n    // noop\n  },\n  setActiveOption() {\n    // noop\n  },\n  setOpen() {\n    // noop\n  },\n  size: 'medium',\n});\n\nexport const ComboboxProvider = ComboboxContext.Provider;\n"]}

package/lib-commonjs/contexts/ListboxContext.js

@@ -4,27 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ListboxProvider = exports.ListboxContext = void 0;
-
-const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector"); // eslint-disable-next-line @fluentui/no-context-default-value
-
-
+const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector");
+// eslint-disable-next-line @fluentui/no-context-default-value
 exports.ListboxContext = /*#__PURE__*/react_context_selector_1.createContext({
   activeOption: undefined,
   focusVisible: false,
   multiselect: false,
-
   registerOption() {
     return () => undefined;
   },
-
   selectedOptions: [],
-
-  selectOption() {// noop
+  selectOption() {
+    // noop
   },
-
-  setActiveOption() {// noop
+  setActiveOption() {
+    // noop
   }
-
 });
 exports.ListboxProvider = exports.ListboxContext.Provider;
 //# sourceMappingURL=ListboxContext.js.map

package/lib-commonjs/contexts/ListboxContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["packages/react-components/react-combobox/src/contexts/ListboxContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA,C,CAiBA;;;AACa,OAAA,CAAA,cAAA,gBAAiB,wBAAA,CAAA,aAAA,CAAmC;EAC/D,YAAY,EAAE,SADiD;EAE/D,YAAY,EAAE,KAFiD;EAG/D,WAAW,EAAE,KAHkD;;EAI/D,cAAc,GAAA;IACZ,OAAO,MAAM,SAAb;EACD,CAN8D;;EAO/D,eAAe,EAAE,EAP8C;;EAQ/D,YAAY,GAAA,CACV;EACD,CAV8D;;EAW/D,eAAe,GAAA,CACb;EACD;;AAb8D,CAAnC,CAAjB;AAgBA,OAAA,CAAA,eAAA,GAAkB,OAAA,CAAA,cAAA,CAAe,QAAjC","sourcesContent":["import { createContext } from '@fluentui/react-context-selector';\nimport { ListboxState } from '../components/Listbox/Listbox.types';\n\n/**\n * Context shared with all Listbox Options\n */\nexport type ListboxContextValue = Pick<\n  ListboxState,\n  | 'activeOption'\n  | 'focusVisible'\n  | 'multiselect'\n  | 'registerOption'\n  | 'selectedOptions'\n  | 'selectOption'\n  | 'setActiveOption'\n>;\n\n// eslint-disable-next-line @fluentui/no-context-default-value\nexport const ListboxContext = createContext<ListboxContextValue>({\n  activeOption: undefined,\n  focusVisible: false,\n  multiselect: false,\n  registerOption() {\n    return () => undefined;\n  },\n  selectedOptions: [],\n  selectOption() {\n    // noop\n  },\n  setActiveOption() {\n    // noop\n  },\n});\n\nexport const ListboxProvider = ListboxContext.Provider;\n"],"sourceRoot":"../src/"}
+{"version":3,"mappings":";;;;;;AAAA;AAiBA;AACaA,sBAAc,gBAAGC,sCAAa,CAAsB;EAC/DC,YAAY,EAAEC,SAAS;EACvBC,YAAY,EAAE,KAAK;EACnBC,WAAW,EAAE,KAAK;EAClBC,cAAc;IACZ,OAAO,MAAMH,SAAS;EACxB,CAAC;EACDI,eAAe,EAAE,EAAE;EACnBC,YAAY;IACV;EAAA,CACD;EACDC,eAAe;IACb;EAAA;CAEH,CAAC;AAEWT,uBAAe,GAAGA,sBAAc,CAACU,QAAQ","names":["exports","react_context_selector_1","activeOption","undefined","focusVisible","multiselect","registerOption","selectedOptions","selectOption","setActiveOption","Provider"],"sourceRoot":"../src/","sources":["packages/react-components/react-combobox/src/contexts/ListboxContext.ts"],"sourcesContent":["import { createContext } from '@fluentui/react-context-selector';\nimport { ListboxState } from '../components/Listbox/Listbox.types';\n\n/**\n * Context shared with all Listbox Options\n */\nexport type ListboxContextValue = Pick<\n  ListboxState,\n  | 'activeOption'\n  | 'focusVisible'\n  | 'multiselect'\n  | 'registerOption'\n  | 'selectedOptions'\n  | 'selectOption'\n  | 'setActiveOption'\n>;\n\n// eslint-disable-next-line @fluentui/no-context-default-value\nexport const ListboxContext = createContext<ListboxContextValue>({\n  activeOption: undefined,\n  focusVisible: false,\n  multiselect: false,\n  registerOption() {\n    return () => undefined;\n  },\n  selectedOptions: [],\n  selectOption() {\n    // noop\n  },\n  setActiveOption() {\n    // noop\n  },\n});\n\nexport const ListboxProvider = ListboxContext.Provider;\n"]}