@fluentui/react-tabs 9.3.3 → 9.3.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (100) hide show
  1. package/.swcrc +30 -0
  2. package/CHANGELOG.json +85 -1
  3. package/CHANGELOG.md +29 -2
  4. package/lib/Tab.js.map +1 -1
  5. package/lib/TabList.js.map +1 -1
  6. package/lib/components/Tab/Tab.js.map +1 -1
  7. package/lib/components/Tab/Tab.types.js.map +1 -1
  8. package/lib/components/Tab/index.js.map +1 -1
  9. package/lib/components/Tab/renderTab.js +1 -7
  10. package/lib/components/Tab/renderTab.js.map +1 -1
  11. package/lib/components/Tab/useTab.js.map +1 -1
  12. package/lib/components/Tab/useTabAnimatedIndicator.js +4 -4
  13. package/lib/components/Tab/useTabAnimatedIndicator.js.map +1 -1
  14. package/lib/components/Tab/useTabStyles.js +4 -6
  15. package/lib/components/Tab/useTabStyles.js.map +1 -1
  16. package/lib/components/TabList/TabList.js.map +1 -1
  17. package/lib/components/TabList/TabList.types.js +1 -1
  18. package/lib/components/TabList/TabList.types.js.map +1 -1
  19. package/lib/components/TabList/TabListContext.js +3 -6
  20. package/lib/components/TabList/TabListContext.js.map +1 -1
  21. package/lib/components/TabList/index.js.map +1 -1
  22. package/lib/components/TabList/renderTabList.js +1 -3
  23. package/lib/components/TabList/renderTabList.js.map +1 -1
  24. package/lib/components/TabList/useTabList.js.map +1 -1
  25. package/lib/components/TabList/useTabListContextValues.js.map +1 -1
  26. package/lib/components/TabList/useTabListStyles.js.map +1 -1
  27. package/lib/index.js.map +1 -1
  28. package/lib-commonjs/Tab.js +5 -4
  29. package/lib-commonjs/Tab.js.map +1 -1
  30. package/lib-commonjs/TabList.js +5 -4
  31. package/lib-commonjs/TabList.js.map +1 -1
  32. package/lib-commonjs/components/Tab/Tab.js +19 -20
  33. package/lib-commonjs/components/Tab/Tab.js.map +1 -1
  34. package/lib-commonjs/components/Tab/Tab.types.js +3 -2
  35. package/lib-commonjs/components/Tab/Tab.types.js.map +1 -1
  36. package/lib-commonjs/components/Tab/index.js +10 -9
  37. package/lib-commonjs/components/Tab/index.js.map +1 -1
  38. package/lib-commonjs/components/Tab/renderTab.js +16 -25
  39. package/lib-commonjs/components/Tab/renderTab.js.map +1 -1
  40. package/lib-commonjs/components/Tab/useTab.js +76 -82
  41. package/lib-commonjs/components/Tab/useTab.js.map +1 -1
  42. package/lib-commonjs/components/Tab/useTabAnimatedIndicator.js +133 -117
  43. package/lib-commonjs/components/Tab/useTabAnimatedIndicator.js.map +1 -1
  44. package/lib-commonjs/components/Tab/useTabStyles.js +751 -396
  45. package/lib-commonjs/components/Tab/useTabStyles.js.map +1 -1
  46. package/lib-commonjs/components/TabList/TabList.js +21 -22
  47. package/lib-commonjs/components/TabList/TabList.js.map +1 -1
  48. package/lib-commonjs/components/TabList/TabList.types.js +5 -2
  49. package/lib-commonjs/components/TabList/TabList.types.js.map +1 -1
  50. package/lib-commonjs/components/TabList/TabListContext.js +34 -28
  51. package/lib-commonjs/components/TabList/TabListContext.js.map +1 -1
  52. package/lib-commonjs/components/TabList/index.js +11 -10
  53. package/lib-commonjs/components/TabList/index.js.map +1 -1
  54. package/lib-commonjs/components/TabList/renderTabList.js +16 -21
  55. package/lib-commonjs/components/TabList/renderTabList.js.map +1 -1
  56. package/lib-commonjs/components/TabList/useTabList.js +73 -84
  57. package/lib-commonjs/components/TabList/useTabList.js.map +1 -1
  58. package/lib-commonjs/components/TabList/useTabListContextValues.js +23 -32
  59. package/lib-commonjs/components/TabList/useTabListContextValues.js.map +1 -1
  60. package/lib-commonjs/components/TabList/useTabListStyles.js +46 -36
  61. package/lib-commonjs/components/TabList/useTabListStyles.js.map +1 -1
  62. package/lib-commonjs/index.js +27 -84
  63. package/lib-commonjs/index.js.map +1 -1
  64. package/package.json +10 -9
  65. package/lib-amd/Tab.js +0 -6
  66. package/lib-amd/Tab.js.map +0 -1
  67. package/lib-amd/TabList.js +0 -6
  68. package/lib-amd/TabList.js.map +0 -1
  69. package/lib-amd/components/Tab/Tab.js +0 -17
  70. package/lib-amd/components/Tab/Tab.js.map +0 -1
  71. package/lib-amd/components/Tab/Tab.types.js +0 -5
  72. package/lib-amd/components/Tab/Tab.types.js.map +0 -1
  73. package/lib-amd/components/Tab/index.js +0 -11
  74. package/lib-amd/components/Tab/index.js.map +0 -1
  75. package/lib-amd/components/Tab/renderTab.js +0 -17
  76. package/lib-amd/components/Tab/renderTab.js.map +0 -1
  77. package/lib-amd/components/Tab/useTab.js +0 -63
  78. package/lib-amd/components/Tab/useTab.js.map +0 -1
  79. package/lib-amd/components/Tab/useTabAnimatedIndicator.js +0 -112
  80. package/lib-amd/components/Tab/useTabAnimatedIndicator.js.map +0 -1
  81. package/lib-amd/components/Tab/useTabStyles.js +0 -380
  82. package/lib-amd/components/Tab/useTabStyles.js.map +0 -1
  83. package/lib-amd/components/TabList/TabList.js +0 -18
  84. package/lib-amd/components/TabList/TabList.js.map +0 -1
  85. package/lib-amd/components/TabList/TabList.types.js +0 -5
  86. package/lib-amd/components/TabList/TabList.types.js.map +0 -1
  87. package/lib-amd/components/TabList/TabListContext.js +0 -37
  88. package/lib-amd/components/TabList/TabListContext.js.map +0 -1
  89. package/lib-amd/components/TabList/index.js +0 -12
  90. package/lib-amd/components/TabList/index.js.map +0 -1
  91. package/lib-amd/components/TabList/renderTabList.js +0 -15
  92. package/lib-amd/components/TabList/renderTabList.js.map +0 -1
  93. package/lib-amd/components/TabList/useTabList.js +0 -74
  94. package/lib-amd/components/TabList/useTabList.js.map +0 -1
  95. package/lib-amd/components/TabList/useTabListContextValues.js +0 -23
  96. package/lib-amd/components/TabList/useTabListContextValues.js.map +0 -1
  97. package/lib-amd/components/TabList/useTabListStyles.js +0 -39
  98. package/lib-amd/components/TabList/useTabListStyles.js.map +0 -1
  99. package/lib-amd/index.js +0 -19
  100. package/lib-amd/index.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"names":["createContext","useContextSelector","tabListContextDefaultValue","appearance","reserveSelectedTabSpace","disabled","selectedValue","undefined","onRegister","onUnregister","onSelect","getRegisteredTabs","registeredTabs","size","vertical","TabListContext","TabListProvider","Provider","useTabListContext_unstable","selector","ctx"],"sources":["../src/packages/react-components/react-tabs/src/components/TabList/TabListContext.ts"],"sourcesContent":["import { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { Context, ContextSelector } from '@fluentui/react-context-selector';\nimport { TabListContextValue } from './TabList.types';\n\nconst tabListContextDefaultValue: TabListContextValue = {\n appearance: 'transparent',\n reserveSelectedTabSpace: true,\n disabled: false,\n selectedValue: undefined,\n onRegister: () => {\n /* noop */\n },\n onUnregister: () => {\n /* noop */\n },\n onSelect: () => {\n /* noop */\n },\n getRegisteredTabs: () => {\n return {\n registeredTabs: {},\n };\n },\n size: 'medium',\n vertical: false,\n};\n\nexport const TabListContext: Context<TabListContextValue> = createContext<TabListContextValue | undefined>(\n undefined,\n) as Context<TabListContextValue>;\n\nexport const TabListProvider = TabListContext.Provider;\nexport const useTabListContext_unstable = <T>(selector: ContextSelector<TabListContextValue, T>): T =>\n useContextSelector(TabListContext, (ctx = tabListContextDefaultValue) => selector(ctx));\n"],"mappings":"AAAA,SAASA,aAAa,EAAEC,kBAAkB,QAAQ,kCAAkC;AAIpF,MAAMC,0BAA0B,GAAwB;EACtDC,UAAU,EAAE,aAAa;EACzBC,uBAAuB,EAAE,IAAI;EAC7BC,QAAQ,EAAE,KAAK;EACfC,aAAa,EAAEC,SAAS;EACxBC,UAAU,EAAEA,CAAA,KAAK;IACf;EAAA,CACD;EACDC,YAAY,EAAEA,CAAA,KAAK;IACjB;EAAA,CACD;EACDC,QAAQ,EAAEA,CAAA,KAAK;IACb;EAAA,CACD;EACDC,iBAAiB,EAAEA,CAAA,KAAK;IACtB,OAAO;MACLC,cAAc,EAAE;KACjB;EACH,CAAC;EACDC,IAAI,EAAE,QAAQ;EACdC,QAAQ,EAAE;CACX;AAED,OAAO,MAAMC,cAAc,gBAAiCf,aAAa,CACvEO,SAAS,CACsB;AAEjC,OAAO,MAAMS,eAAe,GAAGD,cAAc,CAACE,QAAQ;AACtD,OAAO,MAAMC,0BAA0B,GAAOC,QAAiD,IAC7FlB,kBAAkB,CAACc,cAAc,EAAE,CAACK,GAAG,GAAGlB,0BAA0B,KAAKiB,QAAQ,CAACC,GAAG,CAAC,CAAC"}
1
+ {"version":3,"names":["createContext","useContextSelector","tabListContextDefaultValue","appearance","reserveSelectedTabSpace","disabled","selectedValue","undefined","onRegister","onUnregister","onSelect","getRegisteredTabs","registeredTabs","size","vertical","TabListContext","TabListProvider","Provider","useTabListContext_unstable","selector","ctx"],"sources":["../../../src/components/TabList/TabListContext.ts"],"sourcesContent":["import { createContext, useContextSelector } from '@fluentui/react-context-selector';\nimport type { Context, ContextSelector } from '@fluentui/react-context-selector';\nimport { TabListContextValue } from './TabList.types';\n\nconst tabListContextDefaultValue: TabListContextValue = {\n appearance: 'transparent',\n reserveSelectedTabSpace: true,\n disabled: false,\n selectedValue: undefined,\n onRegister: () => {\n /* noop */\n },\n onUnregister: () => {\n /* noop */\n },\n onSelect: () => {\n /* noop */\n },\n getRegisteredTabs: () => {\n return {\n registeredTabs: {},\n };\n },\n size: 'medium',\n vertical: false,\n};\n\nexport const TabListContext: Context<TabListContextValue> = createContext<TabListContextValue | undefined>(\n undefined,\n) as Context<TabListContextValue>;\n\nexport const TabListProvider = TabListContext.Provider;\nexport const useTabListContext_unstable = <T>(selector: ContextSelector<TabListContextValue, T>): T =>\n useContextSelector(TabListContext, (ctx = tabListContextDefaultValue) => selector(ctx));\n"],"mappings":"AAAA,SAASA,aAAa,EAAEC,kBAAkB,QAAQ;AAIlD,MAAMC,0BAAA,GAAkD;EACtDC,UAAA,EAAY;EACZC,uBAAA,EAAyB,IAAI;EAC7BC,QAAA,EAAU,KAAK;EACfC,aAAA,EAAeC,SAAA;EACfC,UAAA,EAAYA,CAAA,KAAM;IAChB,WACF;EACAC,YAAA,EAAcA,CAAA,KAAM;IAClB,WACF;EACAC,QAAA,EAAUA,CAAA,KAAM;IACd,WACF;EACAC,iBAAA,EAAmBA,CAAA,KAAM;IACvB,OAAO;MACLC,cAAA,EAAgB,CAAC;IACnB;EACF;EACAC,IAAA,EAAM;EACNC,QAAA,EAAU;AACZ;AAEA,OAAO,MAAMC,cAAA,gBAA+Cf,aAAA,CAC1DO,SAAA;AAGF,OAAO,MAAMS,eAAA,GAAkBD,cAAA,CAAeE,QAAQ;AACtD,OAAO,MAAMC,0BAAA,GAAiCC,QAAA,IAC5ClB,kBAAA,CAAmBc,cAAA,EAAgB,CAACK,GAAA,GAAMlB,0BAA0B,KAAKiB,QAAA,CAASC,GAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-tabs/src/components/TabList/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './TabList';\nexport * from './TabList.types';\nexport * from './TabListContext';\nexport * from './renderTabList';\nexport * from './useTabList';\nexport * from './useTabListContextValues';\nexport * from './useTabListStyles';\n"]}
1
+ {"version":3,"names":[],"sources":["../../../src/components/TabList/index.ts"],"sourcesContent":["export * from './TabList';\nexport * from './TabList.types';\nexport * from './TabListContext';\nexport * from './renderTabList';\nexport * from './useTabList';\nexport * from './useTabListContextValues';\nexport * from './useTabListStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
@@ -9,9 +9,7 @@ export const renderTabList_unstable = (state, contextValues) => {
9
9
  slots,
10
10
  slotProps
11
11
  } = getSlots(state);
12
- return /*#__PURE__*/React.createElement(slots.root, {
13
- ...slotProps.root
14
- }, /*#__PURE__*/React.createElement(TabListProvider, {
12
+ return /*#__PURE__*/React.createElement(slots.root, slotProps.root, /*#__PURE__*/React.createElement(TabListProvider, {
15
13
  value: contextValues.tabList
16
14
  }, state.root.children));
17
15
  };
@@ -1 +1 @@
1
- {"version":3,"names":["React","getSlots","TabListProvider","renderTabList_unstable","state","contextValues","slots","slotProps","createElement","root","value","tabList","children"],"sources":["../src/packages/react-components/react-tabs/src/components/TabList/renderTabList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TabListState, TabListSlots, TabListContextValues } from './TabList.types';\nimport { TabListProvider } from './TabListContext';\n\n/**\n * Render the final JSX of TabList\n */\nexport const renderTabList_unstable = (state: TabListState, contextValues: TabListContextValues) => {\n const { slots, slotProps } = getSlots<TabListSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <TabListProvider value={contextValues.tabList}>{state.root.children}</TabListProvider>\n </slots.root>\n );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAEpD,SAASC,eAAe,QAAQ,kBAAkB;AAElD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAGA,CAACC,KAAmB,EAAEC,aAAmC,KAAI;EACjG,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAeG,KAAK,CAAC;EAE1D,oBACEJ,KAAA,CAAAQ,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,gBAC5BT,KAAA,CAAAQ,aAAA,CAACN,eAAe;IAACQ,KAAK,EAAEL,aAAa,CAACM;EAAO,GAAGP,KAAK,CAACK,IAAI,CAACG,QAAQ,CAAmB,CAC3E;AAEjB,CAAC"}
1
+ {"version":3,"names":["React","getSlots","TabListProvider","renderTabList_unstable","state","contextValues","slots","slotProps","createElement","root","value","tabList","children"],"sources":["../../../src/components/TabList/renderTabList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TabListState, TabListSlots, TabListContextValues } from './TabList.types';\nimport { TabListProvider } from './TabListContext';\n\n/**\n * Render the final JSX of TabList\n */\nexport const renderTabList_unstable = (state: TabListState, contextValues: TabListContextValues) => {\n const { slots, slotProps } = getSlots<TabListSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n <TabListProvider value={contextValues.tabList}>{state.root.children}</TabListProvider>\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAEzB,SAASC,eAAe,QAAQ;AAEhC;;;AAGA,OAAO,MAAMC,sBAAA,GAAyBA,CAACC,KAAA,EAAqBC,aAAA,KAAwC;EAClG,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAAuBG,KAAA;EAEpD,oBACEJ,KAAA,CAAAQ,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,eAC5BT,KAAA,CAAAQ,aAAA,CAACN,eAAA;IAAgBQ,KAAA,EAAOL,aAAA,CAAcM;KAAUP,KAAA,CAAMK,IAAI,CAACG,QAAQ;AAGzE"}
@@ -1 +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/packages/react-components/react-tabs/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,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,uBAAuB,QAAQ,yBAAyB;AACjE,SACEC,qBAAqB,EACrBC,oBAAoB,EACpBC,gBAAgB,EAChBC,aAAa,QACR,2BAA2B;AAIlC;;;;;;;;;AASA,OAAO,MAAMC,mBAAmB,GAAGA,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG,MAAM;IACJC,UAAU,GAAG,aAAa;IAC1BC,uBAAuB,GAAG,IAAI;IAC9BC,QAAQ,GAAG,KAAK;IAChBC,WAAW;IACXC,IAAI,GAAG,QAAQ;IACfC,QAAQ,GAAG;EAAK,CACjB,GAAGP,KAAK;EAET,MAAMQ,QAAQ,GAAGf,KAAK,CAACgB,MAAM,CAAc,IAAI,CAAC;EAEhD,MAAMC,eAAe,GAAGhB,uBAAuB,CAAC;IAC9CiB,QAAQ,EAAE,IAAI;IACdC,IAAI,EAAEL,QAAQ,GAAG,UAAU,GAAG,YAAY;IAC1CM,eAAe,EAAE;GAClB,CAAC;EAEF,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGnB,oBAAoB,CAAC;IAC7DoB,KAAK,EAAEhB,KAAK,CAACc,aAAa;IAC1BG,YAAY,EAAEjB,KAAK,CAACkB,oBAAoB;IACxCC,YAAY,EAAEC;GACf,CAAC;EAEF;EACA;EACA;EACA;EACA,MAAMC,oBAAoB,GAAG5B,KAAK,CAACgB,MAAM,CAAuBW,SAAS,CAAC;EAC1E,MAAME,qBAAqB,GAAG7B,KAAK,CAACgB,MAAM,CAAuBW,SAAS,CAAC;EAE3E3B,KAAK,CAAC8B,SAAS,CAAC,MAAK;IACnBD,qBAAqB,CAACE,OAAO,GAAGH,oBAAoB,CAACG,OAAO;IAC5DH,oBAAoB,CAACG,OAAO,GAAGV,aAAa;EAC9C,CAAC,EAAE,CAACA,aAAa,CAAC,CAAC;EAEnB,MAAMW,QAAQ,GAAG5B,gBAAgB,CAAC,CAAC6B,KAAqB,EAAEC,IAAmB,KAAI;IAC/EZ,gBAAgB,CAACY,IAAI,CAACC,KAAK,CAAC;IAC5BvB,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAGqB,KAAK,EAAEC,IAAI,CAAC;EAC5B,CAAC,CAAC;EAEF,MAAME,cAAc,GAAGpC,KAAK,CAACgB,MAAM,CAAkC,EAAE,CAAC;EAExE,MAAMqB,UAAU,GAAGjC,gBAAgB,CAAE8B,IAAqB,IAAI;IAC5DE,cAAc,CAACL,OAAO,CAACO,IAAI,CAACC,SAAS,CAACL,IAAI,CAACC,KAAK,CAAC,CAAC,GAAGD,IAAI;EAC3D,CAAC,CAAC;EAEF,MAAMM,YAAY,GAAGpC,gBAAgB,CAAE8B,IAAqB,IAAI;IAC9D,OAAOE,cAAc,CAACL,OAAO,CAACO,IAAI,CAACC,SAAS,CAACL,IAAI,CAACC,KAAK,CAAC,CAAC;EAC3D,CAAC,CAAC;EAEF,MAAMM,iBAAiB,GAAGzC,KAAK,CAAC0C,WAAW,CAAC,MAAK;IAC/C,OAAO;MACLrB,aAAa,EAAEO,oBAAoB,CAACG,OAAO;MAC3CF,qBAAqB,EAAEA,qBAAqB,CAACE,OAAO;MACpDK,cAAc,EAAEA,cAAc,CAACL;KAChC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IACLY,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IACDA,IAAI,EAAE1C,qBAAqB,CAAC,KAAK,EAAE;MACjCM,GAAG,EAAEH,aAAa,CAACG,GAAG,EAAEO,QAAQ,CAAC;MACjC8B,IAAI,EAAE,SAAS;MACf,GAAG5B,eAAe;MAClB,GAAGV;KACJ,CAAC;IACFE,UAAU;IACVC,uBAAuB;IACvBC,QAAQ;IACRU,aAAa;IACbR,IAAI;IACJC,QAAQ;IACRuB,UAAU;IACVG,YAAY;IACZR,QAAQ;IACRS;GACD;AACH,CAAC"}
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"}
@@ -1 +1 @@
1
- {"version":3,"names":["useTabListContextValues_unstable","state","appearance","reserveSelectedTabSpace","disabled","selectedValue","selectedKey","onRegister","onUnregister","onSelect","getRegisteredTabs","size","vertical","tabList"],"sources":["../src/packages/react-components/react-tabs/src/components/TabList/useTabListContextValues.tsx"],"sourcesContent":["import { TabListContextValue, TabListContextValues, TabListState } from './TabList.types';\n\nexport function useTabListContextValues_unstable(state: TabListState): TabListContextValues {\n const {\n appearance,\n reserveSelectedTabSpace,\n disabled,\n selectedValue: selectedKey,\n onRegister,\n onUnregister,\n onSelect,\n getRegisteredTabs,\n size,\n vertical,\n } = state;\n\n const tabList: TabListContextValue = {\n appearance,\n reserveSelectedTabSpace,\n disabled,\n selectedValue: selectedKey,\n onSelect,\n onRegister,\n onUnregister,\n getRegisteredTabs,\n size,\n vertical,\n };\n\n return { tabList };\n}\n"],"mappings":"AAEA,OAAM,SAAUA,gCAAgCA,CAACC,KAAmB;EAClE,MAAM;IACJC,UAAU;IACVC,uBAAuB;IACvBC,QAAQ;IACRC,aAAa,EAAEC,WAAW;IAC1BC,UAAU;IACVC,YAAY;IACZC,QAAQ;IACRC,iBAAiB;IACjBC,IAAI;IACJC;EAAQ,CACT,GAAGX,KAAK;EAET,MAAMY,OAAO,GAAwB;IACnCX,UAAU;IACVC,uBAAuB;IACvBC,QAAQ;IACRC,aAAa,EAAEC,WAAW;IAC1BG,QAAQ;IACRF,UAAU;IACVC,YAAY;IACZE,iBAAiB;IACjBC,IAAI;IACJC;GACD;EAED,OAAO;IAAEC;EAAO,CAAE;AACpB"}
1
+ {"version":3,"names":["useTabListContextValues_unstable","state","appearance","reserveSelectedTabSpace","disabled","selectedValue","selectedKey","onRegister","onUnregister","onSelect","getRegisteredTabs","size","vertical","tabList"],"sources":["../../../src/components/TabList/useTabListContextValues.tsx"],"sourcesContent":["import { TabListContextValue, TabListContextValues, TabListState } from './TabList.types';\n\nexport function useTabListContextValues_unstable(state: TabListState): TabListContextValues {\n const {\n appearance,\n reserveSelectedTabSpace,\n disabled,\n selectedValue: selectedKey,\n onRegister,\n onUnregister,\n onSelect,\n getRegisteredTabs,\n size,\n vertical,\n } = state;\n\n const tabList: TabListContextValue = {\n appearance,\n reserveSelectedTabSpace,\n disabled,\n selectedValue: selectedKey,\n onSelect,\n onRegister,\n onUnregister,\n getRegisteredTabs,\n size,\n vertical,\n };\n\n return { tabList };\n}\n"],"mappings":"AAEA,OAAO,SAASA,iCAAiCC,KAAmB,EAAwB;EAC1F,MAAM;IACJC,UAAA;IACAC,uBAAA;IACAC,QAAA;IACAC,aAAA,EAAeC,WAAA;IACfC,UAAA;IACAC,YAAA;IACAC,QAAA;IACAC,iBAAA;IACAC,IAAA;IACAC;EAAQ,CACT,GAAGX,KAAA;EAEJ,MAAMY,OAAA,GAA+B;IACnCX,UAAA;IACAC,uBAAA;IACAC,QAAA;IACAC,aAAA,EAAeC,WAAA;IACfG,QAAA;IACAF,UAAA;IACAC,YAAA;IACAE,iBAAA;IACAC,IAAA;IACAC;EACF;EAEA,OAAO;IAAEC;EAAQ;AACnB"}
@@ -1 +1 @@
1
- {"version":3,"names":["__styles","mergeClasses","tabListClassNames","root","useStyles","mc9l5x","Beiy3e4","Bnnss6s","Eh141a","qhf8xq","horizontal","Bt984gj","vertical","d","useTabListStyles_unstable","state","styles","className"],"sources":["../src/packages/react-components/react-tabs/src/components/TabList/useTabListStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TabListSlots, TabListState } from './TabList.types';\n\nexport const tabListClassNames: SlotClassNames<TabListSlots> = {\n root: 'fui-TabList',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n flexShrink: 0,\n flexWrap: 'nowrap',\n position: 'relative',\n },\n horizontal: {\n alignItems: 'stretch',\n flexDirection: 'row',\n },\n vertical: {\n alignItems: 'stretch',\n flexDirection: 'column',\n },\n});\n\n/**\n * Apply styling to the TabList slots based on the state\n */\nexport const useTabListStyles_unstable = (state: TabListState): TabListState => {\n const { vertical } = state;\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n tabListClassNames.root,\n styles.root,\n vertical ? styles.vertical : styles.horizontal,\n state.root.className,\n );\n\n return state;\n};\n"],"mappings":"AACA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AAGzD,OAAO,MAAMC,iBAAiB,GAAiC;EAC7DC,IAAI,EAAE;CACP;AAED;;;AAGA,MAAMC,SAAS,gBAAGJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAL,OAAA;EAAA;EAAAM,QAAA;IAAAD,OAAA;IAAAL,OAAA;EAAA;AAAA;EAAAO,CAAA;AAAA,EAgBhB;AAEF;;;AAGA,OAAO,MAAMC,yBAAyB,GAAIC,KAAmB,IAAkB;EAC7E,MAAM;IAAEH;EAAQ,CAAE,GAAGG,KAAK;EAE1B,MAAMC,MAAM,GAAGZ,SAAS,EAAE;EAE1BW,KAAK,CAACZ,IAAI,CAACc,SAAS,GAAGhB,YAAY,CACjCC,iBAAiB,CAACC,IAAI,EACtBa,MAAM,CAACb,IAAI,EACXS,QAAQ,GAAGI,MAAM,CAACJ,QAAQ,GAAGI,MAAM,CAACN,UAAU,EAC9CK,KAAK,CAACZ,IAAI,CAACc,SAAS,CACrB;EAED,OAAOF,KAAK;AACd,CAAC"}
1
+ {"version":3,"names":["__styles","mergeClasses","tabListClassNames","root","useStyles","mc9l5x","Beiy3e4","Bnnss6s","Eh141a","qhf8xq","horizontal","Bt984gj","vertical","d","useTabListStyles_unstable","state","styles","className"],"sources":["../../../src/components/TabList/useTabListStyles.ts"],"sourcesContent":["import { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport type { TabListSlots, TabListState } from './TabList.types';\n\nexport const tabListClassNames: SlotClassNames<TabListSlots> = {\n root: 'fui-TabList',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexDirection: 'row',\n flexShrink: 0,\n flexWrap: 'nowrap',\n position: 'relative',\n },\n horizontal: {\n alignItems: 'stretch',\n flexDirection: 'row',\n },\n vertical: {\n alignItems: 'stretch',\n flexDirection: 'column',\n },\n});\n\n/**\n * Apply styling to the TabList slots based on the state\n */\nexport const useTabListStyles_unstable = (state: TabListState): TabListState => {\n const { vertical } = state;\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n tabListClassNames.root,\n styles.root,\n vertical ? styles.vertical : styles.horizontal,\n state.root.className,\n );\n\n return state;\n};\n"],"mappings":"AACA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ;AAGzC,OAAO,MAAMC,iBAAA,GAAkD;EAC7DC,IAAA,EAAM;AACR;AAEA;;;AAGA,MAAMC,SAAA,gBAAYJ,QAAA;EAAAG,IAAA;IAAAE,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,UAAA;IAAAC,OAAA;IAAAL,OAAA;EAAA;EAAAM,QAAA;IAAAD,OAAA;IAAAL,OAAA;EAAA;AAAA;EAAAO,CAAA;AAAA,EAgBlB;AAEA;;;AAGA,OAAO,MAAMC,yBAAA,GAA6BC,KAAA,IAAsC;EAC9E,MAAM;IAAEH;EAAQ,CAAE,GAAGG,KAAA;EAErB,MAAMC,MAAA,GAASZ,SAAA;EAEfW,KAAA,CAAMZ,IAAI,CAACc,SAAS,GAAGhB,YAAA,CACrBC,iBAAA,CAAkBC,IAAI,EACtBa,MAAA,CAAOb,IAAI,EACXS,QAAA,GAAWI,MAAA,CAAOJ,QAAQ,GAAGI,MAAA,CAAON,UAAU,EAC9CK,KAAA,CAAMZ,IAAI,CAACc,SAAS;EAGtB,OAAOF,KAAA;AACT"}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["renderTab_unstable","Tab","tabClassNames","useTabStyles_unstable","useTab_unstable","renderTabList_unstable","TabList","TabListProvider","tabListClassNames","useTabListContext_unstable","useTabListContextValues_unstable","useTabListStyles_unstable","useTabList_unstable"],"sources":["../src/packages/react-components/react-tabs/src/index.ts"],"sourcesContent":["export type { TabProps, TabSlots, TabState, TabValue } from './Tab';\nexport { renderTab_unstable, Tab, tabClassNames, useTabStyles_unstable, useTab_unstable } from './Tab';\nexport type {\n TabRegisterData,\n RegisterTabEventHandler,\n SelectTabData,\n SelectTabEvent,\n SelectTabEventHandler,\n TabListContextValue,\n TabListContextValues,\n TabListProps,\n TabListSlots,\n TabListState,\n} from './TabList';\nexport {\n renderTabList_unstable,\n TabList,\n TabListProvider,\n tabListClassNames,\n useTabListContext_unstable,\n useTabListContextValues_unstable,\n useTabListStyles_unstable,\n useTabList_unstable,\n} from './TabList';\n"],"mappings":"AACA,SAASA,kBAAkB,EAAEC,GAAG,EAAEC,aAAa,EAAEC,qBAAqB,EAAEC,eAAe,QAAQ,OAAO;AAatG,SACEC,sBAAsB,EACtBC,OAAO,EACPC,eAAe,EACfC,iBAAiB,EACjBC,0BAA0B,EAC1BC,gCAAgC,EAChCC,yBAAyB,EACzBC,mBAAmB,QACd,WAAW"}
1
+ {"version":3,"names":["renderTab_unstable","Tab","tabClassNames","useTabStyles_unstable","useTab_unstable","renderTabList_unstable","TabList","TabListProvider","tabListClassNames","useTabListContext_unstable","useTabListContextValues_unstable","useTabListStyles_unstable","useTabList_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export type { TabProps, TabSlots, TabState, TabValue } from './Tab';\nexport { renderTab_unstable, Tab, tabClassNames, useTabStyles_unstable, useTab_unstable } from './Tab';\nexport type {\n TabRegisterData,\n RegisterTabEventHandler,\n SelectTabData,\n SelectTabEvent,\n SelectTabEventHandler,\n TabListContextValue,\n TabListContextValues,\n TabListProps,\n TabListSlots,\n TabListState,\n} from './TabList';\nexport {\n renderTabList_unstable,\n TabList,\n TabListProvider,\n tabListClassNames,\n useTabListContext_unstable,\n useTabListContextValues_unstable,\n useTabListStyles_unstable,\n useTabList_unstable,\n} from './TabList';\n"],"mappings":"AACA,SAASA,kBAAkB,EAAEC,GAAG,EAAEC,aAAa,EAAEC,qBAAqB,EAAEC,eAAe,QAAQ;AAa/F,SACEC,sBAAsB,EACtBC,OAAO,EACPC,eAAe,EACfC,iBAAiB,EACjBC,0BAA0B,EAC1BC,gCAAgC,EAChCC,yBAAyB,EACzBC,mBAAmB,QACd"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/Tab/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/Tab/index"), exports);
7
+ //# sourceMappingURL=Tab.js.map
8
+
8
9
  //# sourceMappingURL=Tab.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-tabs/src/Tab.ts"],"sourcesContent":["export * from './components/Tab/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,4BAAAC,OAAA"}
1
+ {"version":3,"sources":["../lib/Tab.js"],"sourcesContent":["export * from './components/Tab/index';\n//# sourceMappingURL=Tab.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,+BAA+B"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/TabList/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/TabList/index"), exports);
7
+ //# sourceMappingURL=TabList.js.map
8
+
8
9
  //# sourceMappingURL=TabList.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-tabs/src/TabList.ts"],"sourcesContent":["export * from './components/TabList/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,gCAAAC,OAAA"}
1
+ {"version":3,"sources":["../lib/TabList.js"],"sourcesContent":["export * from './components/TabList/index';\n//# sourceMappingURL=TabList.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
@@ -1,25 +1,24 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "Tab", {
6
+ enumerable: true,
7
+ get: ()=>Tab
5
8
  });
6
- exports.Tab = void 0;
7
- const React = /*#__PURE__*/require("react");
8
- const useTab_1 = /*#__PURE__*/require("./useTab");
9
- const renderTab_1 = /*#__PURE__*/require("./renderTab");
10
- const useTabStyles_1 = /*#__PURE__*/require("./useTabStyles");
11
- const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
12
- /**
13
- * A tab provides a selectable item in a tab list.
14
- */
15
- exports.Tab = /*#__PURE__*/React.forwardRef((props, ref) => {
16
- const state = useTab_1.useTab_unstable(props, ref);
17
- useTabStyles_1.useTabStyles_unstable(state);
18
- const {
19
- useTabStyles_unstable: useCustomStyles
20
- } = react_shared_contexts_1.useCustomStyleHooks_unstable();
21
- useCustomStyles(state);
22
- return renderTab_1.renderTab_unstable(state);
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const _useTab = require("./useTab");
12
+ const _renderTab = require("./renderTab");
13
+ const _useTabStyles = require("./useTabStyles");
14
+ const _reactSharedContexts = require("@fluentui/react-shared-contexts");
15
+ const Tab = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
16
+ const state = (0, _useTab.useTab_unstable)(props, ref);
17
+ (0, _useTabStyles.useTabStyles_unstable)(state);
18
+ const { useTabStyles_unstable: useCustomStyles } = (0, _reactSharedContexts.useCustomStyleHooks_unstable)();
19
+ useCustomStyles(state);
20
+ return (0, _renderTab.renderTab_unstable)(state);
23
21
  });
24
- exports.Tab.displayName = 'Tab';
22
+ Tab.displayName = 'Tab'; //# sourceMappingURL=Tab.js.map
23
+
25
24
  //# sourceMappingURL=Tab.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","useTab_1","renderTab_1","useTabStyles_1","react_shared_contexts_1","exports","Tab","forwardRef","props","ref","state","useTab_unstable","useTabStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderTab_unstable","displayName"],"sources":["../src/packages/react-components/react-tabs/src/components/Tab/Tab.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTab_unstable } from './useTab';\nimport { renderTab_unstable } from './renderTab';\nimport { useTabStyles_unstable } from './useTabStyles';\nimport type { TabProps } from './Tab.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A tab provides a selectable item in a tab list.\n */\nexport const Tab: ForwardRefComponent<TabProps> = React.forwardRef((props, ref) => {\n const state = useTab_unstable(props, ref);\n\n useTabStyles_unstable(state);\n\n const { useTabStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderTab_unstable(state);\n});\n\nTab.displayName = 'Tab';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,QAAA,gBAAAD,OAAA;AACA,MAAAE,WAAA,gBAAAF,OAAA;AACA,MAAAG,cAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,GAAG,gBAAkCP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChF,MAAMC,KAAK,GAAGT,QAAA,CAAAU,eAAe,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEzCN,cAAA,CAAAS,qBAAqB,CAACF,KAAK,CAAC;EAE5B,MAAM;IAAEE,qBAAqB,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACjFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOR,WAAA,CAAAa,kBAAkB,CAACL,KAAK,CAAC;AAClC,CAAC,CAAC;AAEFL,OAAA,CAAAC,GAAG,CAACU,WAAW,GAAG,KAAK"}
1
+ {"version":3,"sources":["../../../lib/components/Tab/Tab.js"],"sourcesContent":["import * as React from 'react';\nimport { useTab_unstable } from './useTab';\nimport { renderTab_unstable } from './renderTab';\nimport { useTabStyles_unstable } from './useTabStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n/**\n * A tab provides a selectable item in a tab list.\n */\nexport const Tab = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useTab_unstable(props, ref);\n useTabStyles_unstable(state);\n const {\n useTabStyles_unstable: useCustomStyles\n } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n return renderTab_unstable(state);\n});\nTab.displayName = 'Tab';\n//# sourceMappingURL=Tab.js.map"],"names":["Tab","React","forwardRef","props","ref","state","useTab_unstable","useTabStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderTab_unstable","displayName"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;wBACS;2BACG;8BACG;qCACO;AAItC,MAAMA,MAAM,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAC/D,MAAMC,QAAQC,IAAAA,uBAAe,EAACH,OAAOC;IACrCG,IAAAA,mCAAqB,EAACF;IACtB,MAAM,EACJE,uBAAuBC,gBAAe,EACvC,GAAGC,IAAAA,iDAA4B;IAChCD,gBAAgBH;IAChB,OAAOK,IAAAA,6BAAkB,EAACL;AAC5B;AACAL,IAAIW,WAAW,GAAG,OAClB,+BAA+B"}
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
5
+ //# sourceMappingURL=Tab.types.js.map
6
+
6
7
  //# sourceMappingURL=Tab.types.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/packages/react-components/react-tabs/src/components/Tab/Tab.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * Any value that identifies a specific tab.\n */\nexport type TabValue = unknown;\n\nexport type TabSlots = {\n /**\n * Root of the component.\n */\n root: Slot<'button'>;\n\n /**\n * Icon that renders before the content.\n */\n icon?: Slot<'span'>;\n\n /**\n * Component children are placed in this slot\n * Avoid using the `children` property in this slot in favour of Component children whenever possible.\n */\n content: NonNullable<Slot<'span'>>;\n};\n\n/**\n * Tab Props\n */\nexport type TabProps = ComponentProps<Partial<TabSlots>> & {\n /**\n * A tab can be set to disable interaction.\n * @default false\n */\n disabled?: boolean;\n /**\n * The value that identifies this tab when selected.\n */\n value: TabValue;\n};\n\n/**\n * State used in rendering Tab\n */\nexport type TabState = ComponentState<TabSlots> &\n Pick<TabProps, 'value'> &\n Required<Pick<TabProps, 'disabled'>> & {\n /**\n * A tab supports 'transparent' and 'subtle' appearance.\n */\n appearance?: 'transparent' | 'subtle';\n /**\n * A tab can have only an icon slot filled and no content.\n */\n iconOnly: boolean;\n /**\n * If this tab is selected\n */\n selected: boolean;\n /**\n * When defined, tab content with selected style is rendered hidden to reserve space.\n * This keeps consistent content size between unselected and selected states.\n */\n contentReservedSpaceClassName?: string;\n /**\n * A tab can be either 'small', 'medium', or 'large' size.\n */\n size: 'small' | 'medium' | 'large';\n /**\n * A tab can arrange its content based on if the tabs in the list are arranged vertically.\n */\n vertical: boolean;\n };\n"],"mappings":""}
1
+ {"version":3,"sources":["../../../lib/components/Tab/Tab.types.js"],"sourcesContent":["export {};\n//# sourceMappingURL=Tab.types.js.map"],"names":[],"mappings":";;;;CACA,qCAAqC"}
@@ -1,13 +1,14 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./Tab"), exports);
8
- tslib_1.__exportStar(require("./Tab.types"), exports);
9
- tslib_1.__exportStar(require("./renderTab"), exports);
10
- tslib_1.__exportStar(require("./useTab"), exports);
11
- tslib_1.__exportStar(require("./useTabStyles"), exports);
12
- tslib_1.__exportStar(require("./useTabAnimatedIndicator"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./Tab"), exports);
7
+ _exportStar(require("./Tab.types"), exports);
8
+ _exportStar(require("./renderTab"), exports);
9
+ _exportStar(require("./useTab"), exports);
10
+ _exportStar(require("./useTabStyles"), exports);
11
+ _exportStar(require("./useTabAnimatedIndicator"), exports);
12
+ //# sourceMappingURL=index.js.map
13
+
13
14
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-tabs/src/components/Tab/index.ts"],"sourcesContent":["export * from './Tab';\nexport * from './Tab.types';\nexport * from './renderTab';\nexport * from './useTab';\nexport * from './useTabStyles';\nexport * from './useTabAnimatedIndicator';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,WAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,iBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,iBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,cAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,oBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,+BAAAC,OAAA"}
1
+ {"version":3,"sources":["../../../lib/components/Tab/index.js"],"sourcesContent":["export * from './Tab';\nexport * from './Tab.types';\nexport * from './renderTab';\nexport * from './useTab';\nexport * from './useTabStyles';\nexport * from './useTabAnimatedIndicator';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
@@ -1,29 +1,20 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "renderTab_unstable", {
6
+ enumerable: true,
7
+ get: ()=>renderTab_unstable
5
8
  });
6
- exports.renderTab_unstable = void 0;
7
- const React = /*#__PURE__*/require("react");
8
- const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
- /**
10
- * Render the final JSX of Tab
11
- */
12
- const renderTab_unstable = state => {
13
- const {
14
- slots,
15
- slotProps
16
- } = react_utilities_1.getSlots(state);
17
- return React.createElement(slots.root, {
18
- ...slotProps.root
19
- }, slots.icon && React.createElement(slots.icon, {
20
- ...slotProps.icon
21
- }), !state.iconOnly && React.createElement(slots.content, {
22
- ...slotProps.content
23
- }), !state.selected && !state.iconOnly && state.contentReservedSpaceClassName !== undefined && React.createElement(slots.content, {
24
- ...slotProps.content,
25
- className: state.contentReservedSpaceClassName
26
- }));
27
- };
28
- exports.renderTab_unstable = renderTab_unstable;
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const _reactUtilities = require("@fluentui/react-utilities");
12
+ const renderTab_unstable = (state)=>{
13
+ const { slots , slotProps } = (0, _reactUtilities.getSlots)(state);
14
+ return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root, slots.icon && /*#__PURE__*/ _react.createElement(slots.icon, slotProps.icon), !state.iconOnly && /*#__PURE__*/ _react.createElement(slots.content, slotProps.content), !state.selected && !state.iconOnly && state.contentReservedSpaceClassName !== undefined && /*#__PURE__*/ _react.createElement(slots.content, {
15
+ ...slotProps.content,
16
+ className: state.contentReservedSpaceClassName
17
+ }));
18
+ }; //# sourceMappingURL=renderTab.js.map
19
+
29
20
  //# sourceMappingURL=renderTab.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","react_utilities_1","renderTab_unstable","state","slots","slotProps","getSlots","createElement","root","icon","iconOnly","content","selected","contentReservedSpaceClassName","undefined","className","exports"],"sources":["../src/packages/react-components/react-tabs/src/components/Tab/renderTab.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { TabState, TabSlots } from './Tab.types';\n\n/**\n * Render the final JSX of Tab\n */\nexport const renderTab_unstable = (state: TabState) => {\n const { slots, slotProps } = getSlots<TabSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.icon && <slots.icon {...slotProps.icon} />}\n {!state.iconOnly && <slots.content {...slotProps.content} />}\n {!state.selected && !state.iconOnly && state.contentReservedSpaceClassName !== undefined && (\n <slots.content {...slotProps.content} className={state.contentReservedSpaceClassName} />\n )}\n </slots.root>\n );\n};\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAGA;;;AAGO,MAAME,kBAAkB,GAAIC,KAAe,IAAI;EACpD,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,iBAAA,CAAAK,QAAQ,CAAWH,KAAK,CAAC;EAEtD,OACEJ,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACI,IAAI;IAAA,GAAKH,SAAS,CAACG;EAAI,GAC3BJ,KAAK,CAACK,IAAI,IAAIV,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,EAChD,CAACN,KAAK,CAACO,QAAQ,IAAIX,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM;EAAO,EAAI,EAC3D,CAACR,KAAK,CAACS,QAAQ,IAAI,CAACT,KAAK,CAACO,QAAQ,IAAIP,KAAK,CAACU,6BAA6B,KAAKC,SAAS,IACtFf,KAAA,CAAAQ,aAAA,CAACH,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM,OAAO;IAAEI,SAAS,EAAEZ,KAAK,CAACU;EAA6B,EACrF,CACU;AAEjB,CAAC;AAZYG,OAAA,CAAAd,kBAAkB,GAAAA,kBAAA"}
1
+ {"version":3,"sources":["../../../lib/components/Tab/renderTab.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Tab\n */\nexport const renderTab_unstable = state => {\n const {\n slots,\n slotProps\n } = getSlots(state);\n return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), !state.iconOnly && /*#__PURE__*/React.createElement(slots.content, slotProps.content), !state.selected && !state.iconOnly && state.contentReservedSpaceClassName !== undefined && /*#__PURE__*/React.createElement(slots.content, {\n ...slotProps.content,\n className: state.contentReservedSpaceClassName\n }));\n};\n//# sourceMappingURL=renderTab.js.map"],"names":["renderTab_unstable","state","slots","slotProps","getSlots","React","createElement","root","icon","iconOnly","content","selected","contentReservedSpaceClassName","undefined","className"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;gCACE;AAIlB,MAAMA,qBAAqBC,CAAAA,QAAS;IACzC,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACH;IACb,OAAO,WAAW,GAAEI,OAAMC,aAAa,CAACJ,MAAMK,IAAI,EAAEJ,UAAUI,IAAI,EAAEL,MAAMM,IAAI,IAAI,WAAW,GAAEH,OAAMC,aAAa,CAACJ,MAAMM,IAAI,EAAEL,UAAUK,IAAI,GAAG,CAACP,MAAMQ,QAAQ,IAAI,WAAW,GAAEJ,OAAMC,aAAa,CAACJ,MAAMQ,OAAO,EAAEP,UAAUO,OAAO,GAAG,CAACT,MAAMU,QAAQ,IAAI,CAACV,MAAMQ,QAAQ,IAAIR,MAAMW,6BAA6B,KAAKC,aAAa,WAAW,GAAER,OAAMC,aAAa,CAACJ,MAAMQ,OAAO,EAAE;QAChX,GAAGP,UAAUO,OAAO;QACpBI,WAAWb,MAAMW,6BAA6B;IAChD;AACF,GACA,qCAAqC"}
@@ -1,89 +1,83 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useTab_unstable", {
6
+ enumerable: true,
7
+ get: ()=>useTab_unstable
5
8
  });
6
- exports.useTab_unstable = void 0;
7
- const React = /*#__PURE__*/require("react");
8
- const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
- const TabListContext_1 = /*#__PURE__*/require("../TabList/TabListContext");
10
- /**
11
- * Create the state required to render Tab.
12
- *
13
- * The returned state can be modified with hooks such as useTabStyles_unstable,
14
- * before being passed to renderTab_unstable.
15
- *
16
- * @param props - props from this instance of Tab
17
- * @param ref - reference to root HTMLElement of Tab
18
- */
19
- const useTab_unstable = (props, ref) => {
20
- const {
21
- content,
22
- disabled: tabDisabled = false,
23
- icon,
24
- value
25
- } = props;
26
- const appearance = TabListContext_1.useTabListContext_unstable(ctx => ctx.appearance);
27
- const reserveSelectedTabSpace = TabListContext_1.useTabListContext_unstable(ctx => ctx.reserveSelectedTabSpace);
28
- const listDisabled = TabListContext_1.useTabListContext_unstable(ctx => ctx.disabled);
29
- const selected = TabListContext_1.useTabListContext_unstable(ctx => ctx.selectedValue === value);
30
- const onRegister = TabListContext_1.useTabListContext_unstable(ctx => ctx.onRegister);
31
- const onUnregister = TabListContext_1.useTabListContext_unstable(ctx => ctx.onUnregister);
32
- const onSelect = TabListContext_1.useTabListContext_unstable(ctx => ctx.onSelect);
33
- const size = TabListContext_1.useTabListContext_unstable(ctx => ctx.size);
34
- const vertical = TabListContext_1.useTabListContext_unstable(ctx => !!ctx.vertical);
35
- const disabled = listDisabled || tabDisabled;
36
- const innerRef = React.useRef(null);
37
- const onClick = react_utilities_1.useEventCallback(event => onSelect(event, {
38
- value
39
- }));
40
- React.useEffect(() => {
41
- onRegister({
42
- value,
43
- ref: innerRef
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const _reactUtilities = require("@fluentui/react-utilities");
12
+ const _tabListContext = require("../TabList/TabListContext");
13
+ const useTab_unstable = (props, ref)=>{
14
+ const { content , disabled: tabDisabled = false , icon , value } = props;
15
+ const appearance = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.appearance);
16
+ const reserveSelectedTabSpace = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.reserveSelectedTabSpace);
17
+ const listDisabled = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.disabled);
18
+ const selected = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.selectedValue === value);
19
+ const onRegister = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.onRegister);
20
+ const onUnregister = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.onUnregister);
21
+ const onSelect = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.onSelect);
22
+ const size = (0, _tabListContext.useTabListContext_unstable)((ctx)=>ctx.size);
23
+ const vertical = (0, _tabListContext.useTabListContext_unstable)((ctx)=>!!ctx.vertical);
24
+ const disabled = listDisabled || tabDisabled;
25
+ const innerRef = _react.useRef(null);
26
+ const onClick = (0, _reactUtilities.useEventCallback)((event)=>onSelect(event, {
27
+ value
28
+ }));
29
+ _react.useEffect(()=>{
30
+ onRegister({
31
+ value,
32
+ ref: innerRef
33
+ });
34
+ return ()=>{
35
+ onUnregister({
36
+ value,
37
+ ref: innerRef
38
+ });
39
+ };
40
+ }, [
41
+ onRegister,
42
+ onUnregister,
43
+ innerRef,
44
+ value
45
+ ]);
46
+ const iconShorthand = (0, _reactUtilities.resolveShorthand)(icon);
47
+ const contentShorthand = (0, _reactUtilities.resolveShorthand)(content, {
48
+ required: true,
49
+ defaultProps: {
50
+ children: props.children
51
+ }
44
52
  });
45
- return () => {
46
- onUnregister({
53
+ return {
54
+ components: {
55
+ root: 'button',
56
+ icon: 'span',
57
+ content: 'span'
58
+ },
59
+ root: (0, _reactUtilities.getNativeElementProps)('button', {
60
+ ref: (0, _reactUtilities.useMergedRefs)(ref, innerRef),
61
+ role: 'tab',
62
+ type: 'button',
63
+ // aria-selected undefined indicates it is not selectable
64
+ // according to https://www.w3.org/TR/wai-aria-1.1/#aria-selected
65
+ 'aria-selected': disabled ? undefined : `${selected}`,
66
+ ...props,
67
+ disabled,
68
+ onClick
69
+ }),
70
+ icon: iconShorthand,
71
+ iconOnly: Boolean((iconShorthand === null || iconShorthand === void 0 ? void 0 : iconShorthand.children) && !contentShorthand.children),
72
+ content: contentShorthand,
73
+ appearance,
74
+ contentReservedSpaceClassName: reserveSelectedTabSpace ? '' : undefined,
75
+ disabled,
76
+ selected,
77
+ size,
47
78
  value,
48
- ref: innerRef
49
- });
79
+ vertical
50
80
  };
51
- }, [onRegister, onUnregister, innerRef, value]);
52
- const iconShorthand = react_utilities_1.resolveShorthand(icon);
53
- const contentShorthand = react_utilities_1.resolveShorthand(content, {
54
- required: true,
55
- defaultProps: {
56
- children: props.children
57
- }
58
- });
59
- return {
60
- components: {
61
- root: 'button',
62
- icon: 'span',
63
- content: 'span'
64
- },
65
- root: react_utilities_1.getNativeElementProps('button', {
66
- ref: react_utilities_1.useMergedRefs(ref, innerRef),
67
- role: 'tab',
68
- type: 'button',
69
- // aria-selected undefined indicates it is not selectable
70
- // according to https://www.w3.org/TR/wai-aria-1.1/#aria-selected
71
- 'aria-selected': disabled ? undefined : `${selected}`,
72
- ...props,
73
- disabled,
74
- onClick
75
- }),
76
- icon: iconShorthand,
77
- iconOnly: Boolean((iconShorthand === null || iconShorthand === void 0 ? void 0 : iconShorthand.children) && !contentShorthand.children),
78
- content: contentShorthand,
79
- appearance,
80
- contentReservedSpaceClassName: reserveSelectedTabSpace ? '' : undefined,
81
- disabled,
82
- selected,
83
- size,
84
- value,
85
- vertical
86
- };
87
- };
88
- exports.useTab_unstable = useTab_unstable;
81
+ }; //# sourceMappingURL=useTab.js.map
82
+
89
83
  //# sourceMappingURL=useTab.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","react_utilities_1","TabListContext_1","useTab_unstable","props","ref","content","disabled","tabDisabled","icon","value","appearance","useTabListContext_unstable","ctx","reserveSelectedTabSpace","listDisabled","selected","selectedValue","onRegister","onUnregister","onSelect","size","vertical","innerRef","useRef","onClick","useEventCallback","event","useEffect","iconShorthand","resolveShorthand","contentShorthand","required","defaultProps","children","components","root","getNativeElementProps","useMergedRefs","role","type","undefined","iconOnly","Boolean","contentReservedSpaceClassName","exports"],"sources":["../src/packages/react-components/react-tabs/src/components/Tab/useTab.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TabProps, TabState } from './Tab.types';\nimport { useTabListContext_unstable } from '../TabList/TabListContext';\nimport { SelectTabEvent } from '../TabList/TabList.types';\n\n/**\n * Create the state required to render Tab.\n *\n * The returned state can be modified with hooks such as useTabStyles_unstable,\n * before being passed to renderTab_unstable.\n *\n * @param props - props from this instance of Tab\n * @param ref - reference to root HTMLElement of Tab\n */\nexport const useTab_unstable = (props: TabProps, ref: React.Ref<HTMLElement>): TabState => {\n const { content, disabled: tabDisabled = false, icon, value } = props;\n\n const appearance = useTabListContext_unstable(ctx => ctx.appearance);\n const reserveSelectedTabSpace = useTabListContext_unstable(ctx => ctx.reserveSelectedTabSpace);\n const listDisabled = useTabListContext_unstable(ctx => ctx.disabled);\n const selected = useTabListContext_unstable(ctx => ctx.selectedValue === value);\n const onRegister = useTabListContext_unstable(ctx => ctx.onRegister);\n const onUnregister = useTabListContext_unstable(ctx => ctx.onUnregister);\n const onSelect = useTabListContext_unstable(ctx => ctx.onSelect);\n const size = useTabListContext_unstable(ctx => ctx.size);\n const vertical = useTabListContext_unstable(ctx => !!ctx.vertical);\n const disabled = listDisabled || tabDisabled;\n\n const innerRef = React.useRef<HTMLElement>(null);\n const onClick = useEventCallback((event: SelectTabEvent) => onSelect(event, { value }));\n\n React.useEffect(() => {\n onRegister({\n value,\n ref: innerRef,\n });\n\n return () => {\n onUnregister({ value, ref: innerRef });\n };\n }, [onRegister, onUnregister, innerRef, value]);\n\n const iconShorthand = resolveShorthand(icon);\n const contentShorthand = resolveShorthand(content, { required: true, defaultProps: { children: props.children } });\n return {\n components: {\n root: 'button',\n icon: 'span',\n content: 'span',\n },\n root: getNativeElementProps('button', {\n ref: useMergedRefs(ref, innerRef),\n role: 'tab',\n type: 'button',\n // aria-selected undefined indicates it is not selectable\n // according to https://www.w3.org/TR/wai-aria-1.1/#aria-selected\n 'aria-selected': disabled ? undefined : `${selected}`,\n ...props,\n disabled,\n onClick,\n }),\n icon: iconShorthand,\n iconOnly: Boolean(iconShorthand?.children && !contentShorthand.children),\n content: contentShorthand,\n appearance,\n contentReservedSpaceClassName: reserveSelectedTabSpace ? '' : undefined,\n disabled,\n selected,\n size,\n value,\n vertical,\n };\n};\n"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../lib/components/Tab/useTab.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useTabListContext_unstable } from '../TabList/TabListContext';\n/**\n * Create the state required to render Tab.\n *\n * The returned state can be modified with hooks such as useTabStyles_unstable,\n * before being passed to renderTab_unstable.\n *\n * @param props - props from this instance of Tab\n * @param ref - reference to root HTMLElement of Tab\n */\nexport const useTab_unstable = (props, ref) => {\n const {\n content,\n disabled: tabDisabled = false,\n icon,\n value\n } = props;\n const appearance = useTabListContext_unstable(ctx => ctx.appearance);\n const reserveSelectedTabSpace = useTabListContext_unstable(ctx => ctx.reserveSelectedTabSpace);\n const listDisabled = useTabListContext_unstable(ctx => ctx.disabled);\n const selected = useTabListContext_unstable(ctx => ctx.selectedValue === value);\n const onRegister = useTabListContext_unstable(ctx => ctx.onRegister);\n const onUnregister = useTabListContext_unstable(ctx => ctx.onUnregister);\n const onSelect = useTabListContext_unstable(ctx => ctx.onSelect);\n const size = useTabListContext_unstable(ctx => ctx.size);\n const vertical = useTabListContext_unstable(ctx => !!ctx.vertical);\n const disabled = listDisabled || tabDisabled;\n const innerRef = React.useRef(null);\n const onClick = useEventCallback(event => onSelect(event, {\n value\n }));\n React.useEffect(() => {\n onRegister({\n value,\n ref: innerRef\n });\n return () => {\n onUnregister({\n value,\n ref: innerRef\n });\n };\n }, [onRegister, onUnregister, innerRef, value]);\n const iconShorthand = resolveShorthand(icon);\n const contentShorthand = resolveShorthand(content, {\n required: true,\n defaultProps: {\n children: props.children\n }\n });\n return {\n components: {\n root: 'button',\n icon: 'span',\n content: 'span'\n },\n root: getNativeElementProps('button', {\n ref: useMergedRefs(ref, innerRef),\n role: 'tab',\n type: 'button',\n // aria-selected undefined indicates it is not selectable\n // according to https://www.w3.org/TR/wai-aria-1.1/#aria-selected\n 'aria-selected': disabled ? undefined : `${selected}`,\n ...props,\n disabled,\n onClick\n }),\n icon: iconShorthand,\n iconOnly: Boolean((iconShorthand === null || iconShorthand === void 0 ? void 0 : iconShorthand.children) && !contentShorthand.children),\n content: contentShorthand,\n appearance,\n contentReservedSpaceClassName: reserveSelectedTabSpace ? '' : undefined,\n disabled,\n selected,\n size,\n value,\n vertical\n };\n};\n//# sourceMappingURL=useTab.js.map"],"names":["useTab_unstable","props","ref","content","disabled","tabDisabled","icon","value","appearance","useTabListContext_unstable","ctx","reserveSelectedTabSpace","listDisabled","selected","selectedValue","onRegister","onUnregister","onSelect","size","vertical","innerRef","React","useRef","onClick","useEventCallback","event","useEffect","iconShorthand","resolveShorthand","contentShorthand","required","defaultProps","children","components","root","getNativeElementProps","useMergedRefs","role","type","undefined","iconOnly","Boolean","contentReservedSpaceClassName"],"mappings":";;;;+BAYaA;;aAAAA;;;6DAZU;gCACkE;gCAC9C;AAUpC,MAAMA,kBAAkB,CAACC,OAAOC,MAAQ;IAC7C,MAAM,EACJC,QAAO,EACPC,UAAUC,cAAc,KAAK,CAAA,EAC7BC,KAAI,EACJC,MAAK,EACN,GAAGN;IACJ,MAAMO,aAAaC,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIF,UAAU;IACnE,MAAMG,0BAA0BF,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIC,uBAAuB;IAC7F,MAAMC,eAAeH,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIN,QAAQ;IACnE,MAAMS,WAAWJ,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAII,aAAa,KAAKP;IACzE,MAAMQ,aAAaN,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIK,UAAU;IACnE,MAAMC,eAAeP,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIM,YAAY;IACvE,MAAMC,WAAWR,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIO,QAAQ;IAC/D,MAAMC,OAAOT,IAAAA,0CAA0B,EAACC,CAAAA,MAAOA,IAAIQ,IAAI;IACvD,MAAMC,WAAWV,IAAAA,0CAA0B,EAACC,CAAAA,MAAO,CAAC,CAACA,IAAIS,QAAQ;IACjE,MAAMf,WAAWQ,gBAAgBP;IACjC,MAAMe,WAAWC,OAAMC,MAAM,CAAC,IAAI;IAClC,MAAMC,UAAUC,IAAAA,gCAAgB,EAACC,CAAAA,QAASR,SAASQ,OAAO;YACxDlB;QACF;IACAc,OAAMK,SAAS,CAAC,IAAM;QACpBX,WAAW;YACTR;YACAL,KAAKkB;QACP;QACA,OAAO,IAAM;YACXJ,aAAa;gBACXT;gBACAL,KAAKkB;YACP;QACF;IACF,GAAG;QAACL;QAAYC;QAAcI;QAAUb;KAAM;IAC9C,MAAMoB,gBAAgBC,IAAAA,gCAAgB,EAACtB;IACvC,MAAMuB,mBAAmBD,IAAAA,gCAAgB,EAACzB,SAAS;QACjD2B,UAAU,IAAI;QACdC,cAAc;YACZC,UAAU/B,MAAM+B,QAAQ;QAC1B;IACF;IACA,OAAO;QACLC,YAAY;YACVC,MAAM;YACN5B,MAAM;YACNH,SAAS;QACX;QACA+B,MAAMC,IAAAA,qCAAqB,EAAC,UAAU;YACpCjC,KAAKkC,IAAAA,6BAAa,EAAClC,KAAKkB;YACxBiB,MAAM;YACNC,MAAM;YACN,yDAAyD;YACzD,iEAAiE;YACjE,iBAAiBlC,WAAWmC,YAAY,CAAC,EAAE1B,SAAS,CAAC;YACrD,GAAGZ,KAAK;YACRG;YACAmB;QACF;QACAjB,MAAMqB;QACNa,UAAUC,QAAQ,AAACd,CAAAA,kBAAkB,IAAI,IAAIA,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcK,QAAQ,AAAD,KAAM,CAACH,iBAAiBG,QAAQ;QACtI7B,SAAS0B;QACTrB;QACAkC,+BAA+B/B,0BAA0B,KAAK4B,SAAS;QACvEnC;QACAS;QACAK;QACAX;QACAY;IACF;AACF,GACA,kCAAkC"}