@fluentui/react-tabs 9.3.8 → 9.3.9

package/CHANGELOG.json

@@ -2,7 +2,40 @@
   "name": "@fluentui/react-tabs",
   "entries": [
     {
-      "date": "Thu, 06 Apr 2023 23:59:54 GMT",
+      "date": "Wed, 12 Apr 2023 09:28:17 GMT",
+      "tag": "@fluentui/react-tabs_v9.3.9",
+      "version": "9.3.9",
+      "comments": {
+        "patch": [
+          {
+            "author": "kakrookaran@gmail.com",
+            "package": "@fluentui/react-tabs",
+            "commit": "4652fbe1f9472d5080af23ace0085b1dddd3013c",
+            "comment": "added aria-orientation attribute"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabs",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.17",
+            "commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabs",
+            "comment": "Bump @fluentui/react-tabster to v9.6.4",
+            "commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-tabs",
+            "comment": "Bump @fluentui/react-utilities to v9.7.4",
+            "commit": "b48890859f5ce28fe12fd40f6bda26ed486c5e47"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 07 Apr 2023 00:01:44 GMT",
       "tag": "@fluentui/react-tabs_v9.3.8",
       "version": "9.3.8",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,24 @@
 # Change Log - @fluentui/react-tabs
 
-This log was last generated on Thu, 06 Apr 2023 23:59:54 GMT and should not be manually modified.
+This log was last generated on Wed, 12 Apr 2023 09:28:17 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.3.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabs_v9.3.9)
+
+Wed, 12 Apr 2023 09:28:17 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabs_v9.3.8..@fluentui/react-tabs_v9.3.9)
+
+### Patches
+
+- added aria-orientation attribute ([PR #27315](https://github.com/microsoft/fluentui/pull/27315) by kakrookaran@gmail.com)
+- Bump @fluentui/react-context-selector to v9.1.17 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
+- Bump @fluentui/react-tabster to v9.6.4 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
+- Bump @fluentui/react-utilities to v9.7.4 ([commit](https://github.com/microsoft/fluentui/commit/b48890859f5ce28fe12fd40f6bda26ed486c5e47) by beachball)
+
 ## [9.3.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-tabs_v9.3.8)
 
-Thu, 06 Apr 2023 23:59:54 GMT 
+Fri, 07 Apr 2023 00:01:44 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tabs_v9.3.7..@fluentui/react-tabs_v9.3.8)
 
 ### Patches

package/lib/components/TabList/useTabList.js

@@ -65,6 +65,7 @@ export const useTabList_unstable = (props, ref) => {
     root: getNativeElementProps('div', {
       ref: useMergedRefs(ref, innerRef),
       role: 'tablist',
+      'aria-orientation': vertical ? 'vertical' : 'horizontal',
       ...focusAttributes,
       ...props
     }),

package/lib/components/TabList/useTabList.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useArrowNavigationGroup","getNativeElementProps","useControllableState","useEventCallback","useMergedRefs","useTabList_unstable","props","ref","appearance","reserveSelectedTabSpace","disabled","onTabSelect","size","vertical","innerRef","useRef","focusAttributes","circular","axis","memorizeCurrent","selectedValue","setSelectedValue","state","defaultState","defaultSelectedValue","initialState","undefined","currentSelectedValue","previousSelectedValue","useEffect","current","onSelect","event","data","value","registeredTabs","onRegister","JSON","stringify","onUnregister","getRegisteredTabs","useCallback","components","root","role"],"sources":["../../../src/components/TabList/useTabList.ts"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport {\n  getNativeElementProps,\n  useControllableState,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TabRegisterData, SelectTabData, SelectTabEvent, TabListProps, TabListState } from './TabList.types';\nimport { TabValue } from '../Tab/Tab.types';\n\n/**\n * Create the state required to render TabList.\n *\n * The returned state can be modified with hooks such as useTabListStyles_unstable,\n * before being passed to renderTabList_unstable.\n *\n * @param props - props from this instance of TabList\n * @param ref - reference to root HTMLElement of TabList\n */\nexport const useTabList_unstable = (props: TabListProps, ref: React.Ref<HTMLElement>): TabListState => {\n  const {\n    appearance = 'transparent',\n    reserveSelectedTabSpace = true,\n    disabled = false,\n    onTabSelect,\n    size = 'medium',\n    vertical = false,\n  } = props;\n\n  const innerRef = React.useRef<HTMLElement>(null);\n\n  const focusAttributes = useArrowNavigationGroup({\n    circular: true,\n    axis: vertical ? 'vertical' : 'horizontal',\n    memorizeCurrent: true,\n  });\n\n  const [selectedValue, setSelectedValue] = useControllableState({\n    state: props.selectedValue,\n    defaultState: props.defaultSelectedValue,\n    initialState: undefined,\n  });\n\n  // considered usePrevious, but it is sensitive to re-renders\n  // this could cause the previous to move to current in the case where the tab list re-renders.\n  // these refs avoid getRegisteredTabs changing when selectedValue changes and causing\n  // renders for tabs that have not changed.\n  const currentSelectedValue = React.useRef<TabValue | undefined>(undefined);\n  const previousSelectedValue = React.useRef<TabValue | undefined>(undefined);\n\n  React.useEffect(() => {\n    previousSelectedValue.current = currentSelectedValue.current;\n    currentSelectedValue.current = selectedValue;\n  }, [selectedValue]);\n\n  const onSelect = useEventCallback((event: SelectTabEvent, data: SelectTabData) => {\n    setSelectedValue(data.value);\n    onTabSelect?.(event, data);\n  });\n\n  const registeredTabs = React.useRef<Record<string, TabRegisterData>>({});\n\n  const onRegister = useEventCallback((data: TabRegisterData) => {\n    registeredTabs.current[JSON.stringify(data.value)] = data;\n  });\n\n  const onUnregister = useEventCallback((data: TabRegisterData) => {\n    delete registeredTabs.current[JSON.stringify(data.value)];\n  });\n\n  const getRegisteredTabs = React.useCallback(() => {\n    return {\n      selectedValue: currentSelectedValue.current,\n      previousSelectedValue: previousSelectedValue.current,\n      registeredTabs: registeredTabs.current,\n    };\n  }, []);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, innerRef),\n      role: 'tablist',\n      ...focusAttributes,\n      ...props,\n    }),\n    appearance,\n    reserveSelectedTabSpace,\n    disabled,\n    selectedValue,\n    size,\n    vertical,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredTabs,\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,uBAAuB,QAAQ;AACxC,SACEC,qBAAqB,EACrBC,oBAAoB,EACpBC,gBAAgB,EAChBC,aAAa,QACR;AAIP;;;;;;;;;AASA,OAAO,MAAMC,mBAAA,GAAsBA,CAACC,KAAA,EAAqBC,GAAA,KAA8C;EACrG,MAAM;IACJC,UAAA,GAAa;IACbC,uBAAA,GAA0B,IAAI;IAC9BC,QAAA,GAAW,KAAK;IAChBC,WAAA;IACAC,IAAA,GAAO;IACPC,QAAA,GAAW;EAAK,CACjB,GAAGP,KAAA;EAEJ,MAAMQ,QAAA,GAAWf,KAAA,CAAMgB,MAAM,CAAc,IAAI;EAE/C,MAAMC,eAAA,GAAkBhB,uBAAA,CAAwB;IAC9CiB,QAAA,EAAU,IAAI;IACdC,IAAA,EAAML,QAAA,GAAW,aAAa,YAAY;IAC1CM,eAAA,EAAiB;EACnB;EAEA,MAAM,CAACC,aAAA,EAAeC,gBAAA,CAAiB,GAAGnB,oBAAA,CAAqB;IAC7DoB,KAAA,EAAOhB,KAAA,CAAMc,aAAa;IAC1BG,YAAA,EAAcjB,KAAA,CAAMkB,oBAAoB;IACxCC,YAAA,EAAcC;EAChB;EAEA;EACA;EACA;EACA;EACA,MAAMC,oBAAA,GAAuB5B,KAAA,CAAMgB,MAAM,CAAuBW,SAAA;EAChE,MAAME,qBAAA,GAAwB7B,KAAA,CAAMgB,MAAM,CAAuBW,SAAA;EAEjE3B,KAAA,CAAM8B,SAAS,CAAC,MAAM;IACpBD,qBAAA,CAAsBE,OAAO,GAAGH,oBAAA,CAAqBG,OAAO;IAC5DH,oBAAA,CAAqBG,OAAO,GAAGV,aAAA;EACjC,GAAG,CAACA,aAAA,CAAc;EAElB,MAAMW,QAAA,GAAW5B,gBAAA,CAAiB,CAAC6B,KAAA,EAAuBC,IAAA,KAAwB;IAChFZ,gBAAA,CAAiBY,IAAA,CAAKC,KAAK;IAC3BvB,WAAA,aAAAA,WAAA,uBAAAA,WAAA,CAAcqB,KAAA,EAAOC,IAAA;EACvB;EAEA,MAAME,cAAA,GAAiBpC,KAAA,CAAMgB,MAAM,CAAkC,CAAC;EAEtE,MAAMqB,UAAA,GAAajC,gBAAA,CAAkB8B,IAAA,IAA0B;IAC7DE,cAAA,CAAeL,OAAO,CAACO,IAAA,CAAKC,SAAS,CAACL,IAAA,CAAKC,KAAK,EAAE,GAAGD,IAAA;EACvD;EAEA,MAAMM,YAAA,GAAepC,gBAAA,CAAkB8B,IAAA,IAA0B;IAC/D,OAAOE,cAAA,CAAeL,OAAO,CAACO,IAAA,CAAKC,SAAS,CAACL,IAAA,CAAKC,KAAK,EAAE;EAC3D;EAEA,MAAMM,iBAAA,GAAoBzC,KAAA,CAAM0C,WAAW,CAAC,MAAM;IAChD,OAAO;MACLrB,aAAA,EAAeO,oBAAA,CAAqBG,OAAO;MAC3CF,qBAAA,EAAuBA,qBAAA,CAAsBE,OAAO;MACpDK,cAAA,EAAgBA,cAAA,CAAeL;IACjC;EACF,GAAG,EAAE;EAEL,OAAO;IACLY,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAM1C,qBAAA,CAAsB,OAAO;MACjCM,GAAA,EAAKH,aAAA,CAAcG,GAAA,EAAKO,QAAA;MACxB8B,IAAA,EAAM;MACN,GAAG5B,eAAe;MAClB,GAAGV;IACL;IACAE,UAAA;IACAC,uBAAA;IACAC,QAAA;IACAU,aAAA;IACAR,IAAA;IACAC,QAAA;IACAuB,UAAA;IACAG,YAAA;IACAR,QAAA;IACAS;EACF;AACF"}
+{"version":3,"names":["React","useArrowNavigationGroup","getNativeElementProps","useControllableState","useEventCallback","useMergedRefs","useTabList_unstable","props","ref","appearance","reserveSelectedTabSpace","disabled","onTabSelect","size","vertical","innerRef","useRef","focusAttributes","circular","axis","memorizeCurrent","selectedValue","setSelectedValue","state","defaultState","defaultSelectedValue","initialState","undefined","currentSelectedValue","previousSelectedValue","useEffect","current","onSelect","event","data","value","registeredTabs","onRegister","JSON","stringify","onUnregister","getRegisteredTabs","useCallback","components","root","role"],"sources":["../../../src/components/TabList/useTabList.ts"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport {\n  getNativeElementProps,\n  useControllableState,\n  useEventCallback,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TabRegisterData, SelectTabData, SelectTabEvent, TabListProps, TabListState } from './TabList.types';\nimport { TabValue } from '../Tab/Tab.types';\n\n/**\n * Create the state required to render TabList.\n *\n * The returned state can be modified with hooks such as useTabListStyles_unstable,\n * before being passed to renderTabList_unstable.\n *\n * @param props - props from this instance of TabList\n * @param ref - reference to root HTMLElement of TabList\n */\nexport const useTabList_unstable = (props: TabListProps, ref: React.Ref<HTMLElement>): TabListState => {\n  const {\n    appearance = 'transparent',\n    reserveSelectedTabSpace = true,\n    disabled = false,\n    onTabSelect,\n    size = 'medium',\n    vertical = false,\n  } = props;\n\n  const innerRef = React.useRef<HTMLElement>(null);\n\n  const focusAttributes = useArrowNavigationGroup({\n    circular: true,\n    axis: vertical ? 'vertical' : 'horizontal',\n    memorizeCurrent: true,\n  });\n\n  const [selectedValue, setSelectedValue] = useControllableState({\n    state: props.selectedValue,\n    defaultState: props.defaultSelectedValue,\n    initialState: undefined,\n  });\n\n  // considered usePrevious, but it is sensitive to re-renders\n  // this could cause the previous to move to current in the case where the tab list re-renders.\n  // these refs avoid getRegisteredTabs changing when selectedValue changes and causing\n  // renders for tabs that have not changed.\n  const currentSelectedValue = React.useRef<TabValue | undefined>(undefined);\n  const previousSelectedValue = React.useRef<TabValue | undefined>(undefined);\n\n  React.useEffect(() => {\n    previousSelectedValue.current = currentSelectedValue.current;\n    currentSelectedValue.current = selectedValue;\n  }, [selectedValue]);\n\n  const onSelect = useEventCallback((event: SelectTabEvent, data: SelectTabData) => {\n    setSelectedValue(data.value);\n    onTabSelect?.(event, data);\n  });\n\n  const registeredTabs = React.useRef<Record<string, TabRegisterData>>({});\n\n  const onRegister = useEventCallback((data: TabRegisterData) => {\n    registeredTabs.current[JSON.stringify(data.value)] = data;\n  });\n\n  const onUnregister = useEventCallback((data: TabRegisterData) => {\n    delete registeredTabs.current[JSON.stringify(data.value)];\n  });\n\n  const getRegisteredTabs = React.useCallback(() => {\n    return {\n      selectedValue: currentSelectedValue.current,\n      previousSelectedValue: previousSelectedValue.current,\n      registeredTabs: registeredTabs.current,\n    };\n  }, []);\n\n  return {\n    components: {\n      root: 'div',\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, innerRef),\n      role: 'tablist',\n      'aria-orientation': vertical ? 'vertical' : 'horizontal',\n      ...focusAttributes,\n      ...props,\n    }),\n    appearance,\n    reserveSelectedTabSpace,\n    disabled,\n    selectedValue,\n    size,\n    vertical,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredTabs,\n  };\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,uBAAuB,QAAQ;AACxC,SACEC,qBAAqB,EACrBC,oBAAoB,EACpBC,gBAAgB,EAChBC,aAAa,QACR;AAIP;;;;;;;;;AASA,OAAO,MAAMC,mBAAA,GAAsBA,CAACC,KAAA,EAAqBC,GAAA,KAA8C;EACrG,MAAM;IACJC,UAAA,GAAa;IACbC,uBAAA,GAA0B,IAAI;IAC9BC,QAAA,GAAW,KAAK;IAChBC,WAAA;IACAC,IAAA,GAAO;IACPC,QAAA,GAAW;EAAK,CACjB,GAAGP,KAAA;EAEJ,MAAMQ,QAAA,GAAWf,KAAA,CAAMgB,MAAM,CAAc,IAAI;EAE/C,MAAMC,eAAA,GAAkBhB,uBAAA,CAAwB;IAC9CiB,QAAA,EAAU,IAAI;IACdC,IAAA,EAAML,QAAA,GAAW,aAAa,YAAY;IAC1CM,eAAA,EAAiB;EACnB;EAEA,MAAM,CAACC,aAAA,EAAeC,gBAAA,CAAiB,GAAGnB,oBAAA,CAAqB;IAC7DoB,KAAA,EAAOhB,KAAA,CAAMc,aAAa;IAC1BG,YAAA,EAAcjB,KAAA,CAAMkB,oBAAoB;IACxCC,YAAA,EAAcC;EAChB;EAEA;EACA;EACA;EACA;EACA,MAAMC,oBAAA,GAAuB5B,KAAA,CAAMgB,MAAM,CAAuBW,SAAA;EAChE,MAAME,qBAAA,GAAwB7B,KAAA,CAAMgB,MAAM,CAAuBW,SAAA;EAEjE3B,KAAA,CAAM8B,SAAS,CAAC,MAAM;IACpBD,qBAAA,CAAsBE,OAAO,GAAGH,oBAAA,CAAqBG,OAAO;IAC5DH,oBAAA,CAAqBG,OAAO,GAAGV,aAAA;EACjC,GAAG,CAACA,aAAA,CAAc;EAElB,MAAMW,QAAA,GAAW5B,gBAAA,CAAiB,CAAC6B,KAAA,EAAuBC,IAAA,KAAwB;IAChFZ,gBAAA,CAAiBY,IAAA,CAAKC,KAAK;IAC3BvB,WAAA,aAAAA,WAAA,uBAAAA,WAAA,CAAcqB,KAAA,EAAOC,IAAA;EACvB;EAEA,MAAME,cAAA,GAAiBpC,KAAA,CAAMgB,MAAM,CAAkC,CAAC;EAEtE,MAAMqB,UAAA,GAAajC,gBAAA,CAAkB8B,IAAA,IAA0B;IAC7DE,cAAA,CAAeL,OAAO,CAACO,IAAA,CAAKC,SAAS,CAACL,IAAA,CAAKC,KAAK,EAAE,GAAGD,IAAA;EACvD;EAEA,MAAMM,YAAA,GAAepC,gBAAA,CAAkB8B,IAAA,IAA0B;IAC/D,OAAOE,cAAA,CAAeL,OAAO,CAACO,IAAA,CAAKC,SAAS,CAACL,IAAA,CAAKC,KAAK,EAAE;EAC3D;EAEA,MAAMM,iBAAA,GAAoBzC,KAAA,CAAM0C,WAAW,CAAC,MAAM;IAChD,OAAO;MACLrB,aAAA,EAAeO,oBAAA,CAAqBG,OAAO;MAC3CF,qBAAA,EAAuBA,qBAAA,CAAsBE,OAAO;MACpDK,cAAA,EAAgBA,cAAA,CAAeL;IACjC;EACF,GAAG,EAAE;EAEL,OAAO;IACLY,UAAA,EAAY;MACVC,IAAA,EAAM;IACR;IACAA,IAAA,EAAM1C,qBAAA,CAAsB,OAAO;MACjCM,GAAA,EAAKH,aAAA,CAAcG,GAAA,EAAKO,QAAA;MACxB8B,IAAA,EAAM;MACN,oBAAoB/B,QAAA,GAAW,aAAa,YAAY;MACxD,GAAGG,eAAe;MAClB,GAAGV;IACL;IACAE,UAAA;IACAC,uBAAA;IACAC,QAAA;IACAU,aAAA;IACAR,IAAA;IACAC,QAAA;IACAuB,UAAA;IACAG,YAAA;IACAR,QAAA;IACAS;EACF;AACF"}

package/lib-commonjs/components/TabList/useTabList.js

@@ -60,6 +60,7 @@ const useTabList_unstable = (props, ref)=>{
         root: (0, _reactUtilities.getNativeElementProps)('div', {
             ref: (0, _reactUtilities.useMergedRefs)(ref, innerRef),
             role: 'tablist',
+            'aria-orientation': vertical ? 'vertical' : 'horizontal',
             ...focusAttributes,
             ...props
         }),

package/lib-commonjs/components/TabList/useTabList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/TabList/useTabList.js"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { getNativeElementProps, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TabList.\n *\n * The returned state can be modified with hooks such as useTabListStyles_unstable,\n * before being passed to renderTabList_unstable.\n *\n * @param props - props from this instance of TabList\n * @param ref - reference to root HTMLElement of TabList\n */\nexport const useTabList_unstable = (props, ref) => {\n  const {\n    appearance = 'transparent',\n    reserveSelectedTabSpace = true,\n    disabled = false,\n    onTabSelect,\n    size = 'medium',\n    vertical = false\n  } = props;\n  const innerRef = React.useRef(null);\n  const focusAttributes = useArrowNavigationGroup({\n    circular: true,\n    axis: vertical ? 'vertical' : 'horizontal',\n    memorizeCurrent: true\n  });\n  const [selectedValue, setSelectedValue] = useControllableState({\n    state: props.selectedValue,\n    defaultState: props.defaultSelectedValue,\n    initialState: undefined\n  });\n  // considered usePrevious, but it is sensitive to re-renders\n  // this could cause the previous to move to current in the case where the tab list re-renders.\n  // these refs avoid getRegisteredTabs changing when selectedValue changes and causing\n  // renders for tabs that have not changed.\n  const currentSelectedValue = React.useRef(undefined);\n  const previousSelectedValue = React.useRef(undefined);\n  React.useEffect(() => {\n    previousSelectedValue.current = currentSelectedValue.current;\n    currentSelectedValue.current = selectedValue;\n  }, [selectedValue]);\n  const onSelect = useEventCallback((event, data) => {\n    setSelectedValue(data.value);\n    onTabSelect === null || onTabSelect === void 0 ? void 0 : onTabSelect(event, data);\n  });\n  const registeredTabs = React.useRef({});\n  const onRegister = useEventCallback(data => {\n    registeredTabs.current[JSON.stringify(data.value)] = data;\n  });\n  const onUnregister = useEventCallback(data => {\n    delete registeredTabs.current[JSON.stringify(data.value)];\n  });\n  const getRegisteredTabs = React.useCallback(() => {\n    return {\n      selectedValue: currentSelectedValue.current,\n      previousSelectedValue: previousSelectedValue.current,\n      registeredTabs: registeredTabs.current\n    };\n  }, []);\n  return {\n    components: {\n      root: 'div'\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, innerRef),\n      role: 'tablist',\n      ...focusAttributes,\n      ...props\n    }),\n    appearance,\n    reserveSelectedTabSpace,\n    disabled,\n    selectedValue,\n    size,\n    vertical,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredTabs\n  };\n};\n//# sourceMappingURL=useTabList.js.map"],"names":["useTabList_unstable","props","ref","appearance","reserveSelectedTabSpace","disabled","onTabSelect","size","vertical","innerRef","React","useRef","focusAttributes","useArrowNavigationGroup","circular","axis","memorizeCurrent","selectedValue","setSelectedValue","useControllableState","state","defaultState","defaultSelectedValue","initialState","undefined","currentSelectedValue","previousSelectedValue","useEffect","current","onSelect","useEventCallback","event","data","value","registeredTabs","onRegister","JSON","stringify","onUnregister","getRegisteredTabs","useCallback","components","root","getNativeElementProps","useMergedRefs","role"],"mappings":";;;;+BAYaA;;aAAAA;;;6DAZU;8BACiB;gCACqD;AAUtF,MAAMA,sBAAsB,CAACC,OAAOC,MAAQ;IACjD,MAAM,EACJC,YAAa,cAAa,EAC1BC,yBAA0B,IAAI,CAAA,EAC9BC,UAAW,KAAK,CAAA,EAChBC,YAAW,EACXC,MAAO,SAAQ,EACfC,UAAW,KAAK,CAAA,EACjB,GAAGP;IACJ,MAAMQ,WAAWC,OAAMC,MAAM,CAAC,IAAI;IAClC,MAAMC,kBAAkBC,IAAAA,qCAAuB,EAAC;QAC9CC,UAAU,IAAI;QACdC,MAAMP,WAAW,aAAa,YAAY;QAC1CQ,iBAAiB,IAAI;IACvB;IACA,MAAM,CAACC,eAAeC,iBAAiB,GAAGC,IAAAA,oCAAoB,EAAC;QAC7DC,OAAOnB,MAAMgB,aAAa;QAC1BI,cAAcpB,MAAMqB,oBAAoB;QACxCC,cAAcC;IAChB;IACA,4DAA4D;IAC5D,8FAA8F;IAC9F,qFAAqF;IACrF,0CAA0C;IAC1C,MAAMC,uBAAuBf,OAAMC,MAAM,CAACa;IAC1C,MAAME,wBAAwBhB,OAAMC,MAAM,CAACa;IAC3Cd,OAAMiB,SAAS,CAAC,IAAM;QACpBD,sBAAsBE,OAAO,GAAGH,qBAAqBG,OAAO;QAC5DH,qBAAqBG,OAAO,GAAGX;IACjC,GAAG;QAACA;KAAc;IAClB,MAAMY,WAAWC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAS;QACjDd,iBAAiBc,KAAKC,KAAK;QAC3B3B,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYyB,OAAOC,KAAK;IACpF;IACA,MAAME,iBAAiBxB,OAAMC,MAAM,CAAC,CAAC;IACrC,MAAMwB,aAAaL,IAAAA,gCAAgB,EAACE,CAAAA,OAAQ;QAC1CE,eAAeN,OAAO,CAACQ,KAAKC,SAAS,CAACL,KAAKC,KAAK,EAAE,GAAGD;IACvD;IACA,MAAMM,eAAeR,IAAAA,gCAAgB,EAACE,CAAAA,OAAQ;QAC5C,OAAOE,eAAeN,OAAO,CAACQ,KAAKC,SAAS,CAACL,KAAKC,KAAK,EAAE;IAC3D;IACA,MAAMM,oBAAoB7B,OAAM8B,WAAW,CAAC,IAAM;QAChD,OAAO;YACLvB,eAAeQ,qBAAqBG,OAAO;YAC3CF,uBAAuBA,sBAAsBE,OAAO;YACpDM,gBAAgBA,eAAeN,OAAO;QACxC;IACF,GAAG,EAAE;IACL,OAAO;QACLa,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjCzC,KAAK0C,IAAAA,6BAAa,EAAC1C,KAAKO;YACxBoC,MAAM;YACN,GAAGjC,eAAe;YAClB,GAAGX,KAAK;QACV;QACAE;QACAC;QACAC;QACAY;QACAV;QACAC;QACA2B;QACAG;QACAT;QACAU;IACF;AACF,GACA,sCAAsC"}
+{"version":3,"sources":["../../../lib/components/TabList/useTabList.js"],"sourcesContent":["import * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { getNativeElementProps, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\n/**\n * Create the state required to render TabList.\n *\n * The returned state can be modified with hooks such as useTabListStyles_unstable,\n * before being passed to renderTabList_unstable.\n *\n * @param props - props from this instance of TabList\n * @param ref - reference to root HTMLElement of TabList\n */\nexport const useTabList_unstable = (props, ref) => {\n  const {\n    appearance = 'transparent',\n    reserveSelectedTabSpace = true,\n    disabled = false,\n    onTabSelect,\n    size = 'medium',\n    vertical = false\n  } = props;\n  const innerRef = React.useRef(null);\n  const focusAttributes = useArrowNavigationGroup({\n    circular: true,\n    axis: vertical ? 'vertical' : 'horizontal',\n    memorizeCurrent: true\n  });\n  const [selectedValue, setSelectedValue] = useControllableState({\n    state: props.selectedValue,\n    defaultState: props.defaultSelectedValue,\n    initialState: undefined\n  });\n  // considered usePrevious, but it is sensitive to re-renders\n  // this could cause the previous to move to current in the case where the tab list re-renders.\n  // these refs avoid getRegisteredTabs changing when selectedValue changes and causing\n  // renders for tabs that have not changed.\n  const currentSelectedValue = React.useRef(undefined);\n  const previousSelectedValue = React.useRef(undefined);\n  React.useEffect(() => {\n    previousSelectedValue.current = currentSelectedValue.current;\n    currentSelectedValue.current = selectedValue;\n  }, [selectedValue]);\n  const onSelect = useEventCallback((event, data) => {\n    setSelectedValue(data.value);\n    onTabSelect === null || onTabSelect === void 0 ? void 0 : onTabSelect(event, data);\n  });\n  const registeredTabs = React.useRef({});\n  const onRegister = useEventCallback(data => {\n    registeredTabs.current[JSON.stringify(data.value)] = data;\n  });\n  const onUnregister = useEventCallback(data => {\n    delete registeredTabs.current[JSON.stringify(data.value)];\n  });\n  const getRegisteredTabs = React.useCallback(() => {\n    return {\n      selectedValue: currentSelectedValue.current,\n      previousSelectedValue: previousSelectedValue.current,\n      registeredTabs: registeredTabs.current\n    };\n  }, []);\n  return {\n    components: {\n      root: 'div'\n    },\n    root: getNativeElementProps('div', {\n      ref: useMergedRefs(ref, innerRef),\n      role: 'tablist',\n      'aria-orientation': vertical ? 'vertical' : 'horizontal',\n      ...focusAttributes,\n      ...props\n    }),\n    appearance,\n    reserveSelectedTabSpace,\n    disabled,\n    selectedValue,\n    size,\n    vertical,\n    onRegister,\n    onUnregister,\n    onSelect,\n    getRegisteredTabs\n  };\n};\n//# sourceMappingURL=useTabList.js.map"],"names":["useTabList_unstable","props","ref","appearance","reserveSelectedTabSpace","disabled","onTabSelect","size","vertical","innerRef","React","useRef","focusAttributes","useArrowNavigationGroup","circular","axis","memorizeCurrent","selectedValue","setSelectedValue","useControllableState","state","defaultState","defaultSelectedValue","initialState","undefined","currentSelectedValue","previousSelectedValue","useEffect","current","onSelect","useEventCallback","event","data","value","registeredTabs","onRegister","JSON","stringify","onUnregister","getRegisteredTabs","useCallback","components","root","getNativeElementProps","useMergedRefs","role"],"mappings":";;;;+BAYaA;;aAAAA;;;6DAZU;8BACiB;gCACqD;AAUtF,MAAMA,sBAAsB,CAACC,OAAOC,MAAQ;IACjD,MAAM,EACJC,YAAa,cAAa,EAC1BC,yBAA0B,IAAI,CAAA,EAC9BC,UAAW,KAAK,CAAA,EAChBC,YAAW,EACXC,MAAO,SAAQ,EACfC,UAAW,KAAK,CAAA,EACjB,GAAGP;IACJ,MAAMQ,WAAWC,OAAMC,MAAM,CAAC,IAAI;IAClC,MAAMC,kBAAkBC,IAAAA,qCAAuB,EAAC;QAC9CC,UAAU,IAAI;QACdC,MAAMP,WAAW,aAAa,YAAY;QAC1CQ,iBAAiB,IAAI;IACvB;IACA,MAAM,CAACC,eAAeC,iBAAiB,GAAGC,IAAAA,oCAAoB,EAAC;QAC7DC,OAAOnB,MAAMgB,aAAa;QAC1BI,cAAcpB,MAAMqB,oBAAoB;QACxCC,cAAcC;IAChB;IACA,4DAA4D;IAC5D,8FAA8F;IAC9F,qFAAqF;IACrF,0CAA0C;IAC1C,MAAMC,uBAAuBf,OAAMC,MAAM,CAACa;IAC1C,MAAME,wBAAwBhB,OAAMC,MAAM,CAACa;IAC3Cd,OAAMiB,SAAS,CAAC,IAAM;QACpBD,sBAAsBE,OAAO,GAAGH,qBAAqBG,OAAO;QAC5DH,qBAAqBG,OAAO,GAAGX;IACjC,GAAG;QAACA;KAAc;IAClB,MAAMY,WAAWC,IAAAA,gCAAgB,EAAC,CAACC,OAAOC,OAAS;QACjDd,iBAAiBc,KAAKC,KAAK;QAC3B3B,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAI,KAAK,IAAIA,YAAYyB,OAAOC,KAAK;IACpF;IACA,MAAME,iBAAiBxB,OAAMC,MAAM,CAAC,CAAC;IACrC,MAAMwB,aAAaL,IAAAA,gCAAgB,EAACE,CAAAA,OAAQ;QAC1CE,eAAeN,OAAO,CAACQ,KAAKC,SAAS,CAACL,KAAKC,KAAK,EAAE,GAAGD;IACvD;IACA,MAAMM,eAAeR,IAAAA,gCAAgB,EAACE,CAAAA,OAAQ;QAC5C,OAAOE,eAAeN,OAAO,CAACQ,KAAKC,SAAS,CAACL,KAAKC,KAAK,EAAE;IAC3D;IACA,MAAMM,oBAAoB7B,OAAM8B,WAAW,CAAC,IAAM;QAChD,OAAO;YACLvB,eAAeQ,qBAAqBG,OAAO;YAC3CF,uBAAuBA,sBAAsBE,OAAO;YACpDM,gBAAgBA,eAAeN,OAAO;QACxC;IACF,GAAG,EAAE;IACL,OAAO;QACLa,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjCzC,KAAK0C,IAAAA,6BAAa,EAAC1C,KAAKO;YACxBoC,MAAM;YACN,oBAAoBrC,WAAW,aAAa,YAAY;YACxD,GAAGI,eAAe;YAClB,GAAGX,KAAK;QACV;QACAE;QACAC;QACAC;QACAY;QACAV;QACAC;QACA2B;QACAG;QACAT;QACAU;IACF;AACF,GACA,sCAAsC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-tabs",
-  "version": "9.3.8",
+  "version": "9.3.9",
   "description": "Fluent UI React tabs components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -31,11 +31,11 @@
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-context-selector": "^9.1.16",
+    "@fluentui/react-context-selector": "^9.1.17",
     "@fluentui/react-shared-contexts": "^9.3.3",
-    "@fluentui/react-tabster": "^9.6.3",
+    "@fluentui/react-tabster": "^9.6.4",
     "@fluentui/react-theme": "^9.1.7",
-    "@fluentui/react-utilities": "^9.7.3",
+    "@fluentui/react-utilities": "^9.7.4",
     "@griffel/react": "^1.5.2",
     "@swc/helpers": "^0.4.14"
   },