@fluentui/react-overflow 9.0.18 → 9.0.20

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 (75) hide show
  1. package/CHANGELOG.json +75 -1
  2. package/CHANGELOG.md +26 -2
  3. package/dist/index.d.ts +33 -1
  4. package/lib/components/Overflow.js +45 -59
  5. package/lib/components/Overflow.js.map +1 -1
  6. package/lib/components/OverflowDivider/OverflowDivider.js +13 -0
  7. package/lib/components/OverflowDivider/OverflowDivider.js.map +1 -0
  8. package/lib/components/OverflowDivider/OverflowDivider.types.js +1 -0
  9. package/lib/components/OverflowDivider/OverflowDivider.types.js.map +1 -0
  10. package/lib/components/OverflowItem/OverflowItem.js +6 -13
  11. package/lib/components/OverflowItem/OverflowItem.js.map +1 -1
  12. package/lib/components/OverflowItem/OverflowItem.types.js +0 -1
  13. package/lib/components/OverflowItem/OverflowItem.types.js.map +1 -1
  14. package/lib/components/OverflowItem/index.js +0 -1
  15. package/lib/components/OverflowItem/index.js.map +1 -1
  16. package/lib/components/useOverflowStyles.styles.js.map +1 -1
  17. package/lib/constants.js +1 -1
  18. package/lib/constants.js.map +1 -1
  19. package/lib/index.js +3 -2
  20. package/lib/index.js.map +1 -1
  21. package/lib/overflowContext.js +9 -10
  22. package/lib/overflowContext.js.map +1 -1
  23. package/lib/types.js +0 -1
  24. package/lib/types.js.map +1 -1
  25. package/lib/useIsOverflowGroupVisible.js +2 -4
  26. package/lib/useIsOverflowGroupVisible.js.map +1 -1
  27. package/lib/useIsOverflowItemVisible.js +2 -4
  28. package/lib/useIsOverflowItemVisible.js.map +1 -1
  29. package/lib/useOverflowContainer.js +82 -67
  30. package/lib/useOverflowContainer.js.map +1 -1
  31. package/lib/useOverflowCount.js +8 -10
  32. package/lib/useOverflowCount.js.map +1 -1
  33. package/lib/useOverflowDivider.js +24 -0
  34. package/lib/useOverflowDivider.js.map +1 -0
  35. package/lib/useOverflowItem.js +17 -14
  36. package/lib/useOverflowItem.js.map +1 -1
  37. package/lib/useOverflowMenu.js +29 -22
  38. package/lib/useOverflowMenu.js.map +1 -1
  39. package/lib-commonjs/components/Overflow.js +7 -6
  40. package/lib-commonjs/components/Overflow.js.map +1 -1
  41. package/lib-commonjs/components/OverflowDivider/OverflowDivider.js +19 -0
  42. package/lib-commonjs/components/OverflowDivider/OverflowDivider.js.map +1 -0
  43. package/lib-commonjs/components/OverflowDivider/OverflowDivider.types.js +6 -0
  44. package/lib-commonjs/components/OverflowDivider/OverflowDivider.types.js.map +1 -0
  45. package/lib-commonjs/components/OverflowItem/OverflowItem.js +1 -3
  46. package/lib-commonjs/components/OverflowItem/OverflowItem.js.map +1 -1
  47. package/lib-commonjs/components/OverflowItem/OverflowItem.types.js +0 -3
  48. package/lib-commonjs/components/OverflowItem/OverflowItem.types.js.map +1 -1
  49. package/lib-commonjs/components/OverflowItem/index.js +0 -3
  50. package/lib-commonjs/components/OverflowItem/index.js.map +1 -1
  51. package/lib-commonjs/components/useOverflowStyles.styles.js +0 -2
  52. package/lib-commonjs/components/useOverflowStyles.styles.js.map +1 -1
  53. package/lib-commonjs/constants.js +4 -4
  54. package/lib-commonjs/constants.js.map +1 -1
  55. package/lib-commonjs/index.js +6 -4
  56. package/lib-commonjs/index.js.map +1 -1
  57. package/lib-commonjs/overflowContext.js +4 -5
  58. package/lib-commonjs/overflowContext.js.map +1 -1
  59. package/lib-commonjs/types.js +0 -3
  60. package/lib-commonjs/types.js.map +1 -1
  61. package/lib-commonjs/useIsOverflowGroupVisible.js +1 -3
  62. package/lib-commonjs/useIsOverflowGroupVisible.js.map +1 -1
  63. package/lib-commonjs/useIsOverflowItemVisible.js +1 -3
  64. package/lib-commonjs/useIsOverflowItemVisible.js.map +1 -1
  65. package/lib-commonjs/useOverflowContainer.js +14 -4
  66. package/lib-commonjs/useOverflowContainer.js.map +1 -1
  67. package/lib-commonjs/useOverflowCount.js +1 -3
  68. package/lib-commonjs/useOverflowCount.js.map +1 -1
  69. package/lib-commonjs/useOverflowDivider.js +28 -0
  70. package/lib-commonjs/useOverflowDivider.js.map +1 -0
  71. package/lib-commonjs/useOverflowItem.js +1 -3
  72. package/lib-commonjs/useOverflowItem.js.map +1 -1
  73. package/lib-commonjs/useOverflowMenu.js +1 -3
  74. package/lib-commonjs/useOverflowMenu.js.map +1 -1
  75. package/package.json +6 -6
@@ -1,78 +1,93 @@
1
1
  import * as React from 'react';
2
2
  import { createOverflowManager } from '@fluentui/priority-overflow';
3
3
  import { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
4
- import { DATA_OVERFLOWING, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';
4
+ import { DATA_OVERFLOWING, DATA_OVERFLOW_DIVIDER, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';
5
5
  /**
6
6
  * @internal
7
7
  * @param update - Callback when overflow state changes
8
8
  * @param options - Options to configure the overflow container
9
9
  * @returns - ref to attach to an intrinsic HTML element and imperative functions
10
- */
11
- export const useOverflowContainer = (update, options) => {
12
- const {
13
- overflowAxis,
14
- overflowDirection,
15
- padding,
16
- minimumVisible,
17
- onUpdateItemVisibility
18
- } = options;
19
- // DOM ref to the overflow container element
20
- const containerRef = React.useRef(null);
21
- const updateOverflowItems = useEventCallback(update);
22
- const [overflowManager] = React.useState(() => canUseDOM() ? createOverflowManager() : null);
23
- useIsomorphicLayoutEffect(() => {
24
- if (!containerRef.current) {
25
- return;
26
- }
27
- if (overflowManager) {
28
- overflowManager.observe(containerRef.current, {
29
- overflowDirection: overflowDirection !== null && overflowDirection !== void 0 ? overflowDirection : 'end',
30
- overflowAxis: overflowAxis !== null && overflowAxis !== void 0 ? overflowAxis : 'horizontal',
31
- padding: padding !== null && padding !== void 0 ? padding : 10,
32
- minimumVisible: minimumVisible !== null && minimumVisible !== void 0 ? minimumVisible : 0,
33
- onUpdateItemVisibility: onUpdateItemVisibility !== null && onUpdateItemVisibility !== void 0 ? onUpdateItemVisibility : () => undefined,
34
- onUpdateOverflow: updateOverflowItems !== null && updateOverflowItems !== void 0 ? updateOverflowItems : () => undefined
35
- });
36
- return () => {
37
- overflowManager.disconnect();
38
- };
39
- }
40
- }, [updateOverflowItems, overflowManager, overflowDirection, overflowAxis, padding, minimumVisible, onUpdateItemVisibility]);
41
- const registerItem = React.useCallback(item => {
42
- overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.addItem(item);
43
- item.element.setAttribute(DATA_OVERFLOW_ITEM, '');
44
- return () => {
45
- item.element.removeAttribute(DATA_OVERFLOWING);
46
- item.element.removeAttribute(DATA_OVERFLOW_ITEM);
47
- overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.removeItem(item.id);
10
+ */ export const useOverflowContainer = (update, options)=>{
11
+ const { overflowAxis , overflowDirection , padding , minimumVisible , onUpdateItemVisibility } = options;
12
+ // DOM ref to the overflow container element
13
+ const containerRef = React.useRef(null);
14
+ const updateOverflowItems = useEventCallback(update);
15
+ const [overflowManager] = React.useState(()=>canUseDOM() ? createOverflowManager() : null);
16
+ useIsomorphicLayoutEffect(()=>{
17
+ if (!containerRef.current) {
18
+ return;
19
+ }
20
+ if (overflowManager) {
21
+ overflowManager.observe(containerRef.current, {
22
+ overflowDirection: overflowDirection !== null && overflowDirection !== void 0 ? overflowDirection : 'end',
23
+ overflowAxis: overflowAxis !== null && overflowAxis !== void 0 ? overflowAxis : 'horizontal',
24
+ padding: padding !== null && padding !== void 0 ? padding : 10,
25
+ minimumVisible: minimumVisible !== null && minimumVisible !== void 0 ? minimumVisible : 0,
26
+ onUpdateItemVisibility: onUpdateItemVisibility !== null && onUpdateItemVisibility !== void 0 ? onUpdateItemVisibility : ()=>undefined,
27
+ onUpdateOverflow: updateOverflowItems !== null && updateOverflowItems !== void 0 ? updateOverflowItems : ()=>undefined
28
+ });
29
+ return ()=>{
30
+ overflowManager.disconnect();
31
+ };
32
+ }
33
+ }, [
34
+ updateOverflowItems,
35
+ overflowManager,
36
+ overflowDirection,
37
+ overflowAxis,
38
+ padding,
39
+ minimumVisible,
40
+ onUpdateItemVisibility
41
+ ]);
42
+ const registerItem = React.useCallback((item)=>{
43
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.addItem(item);
44
+ item.element.setAttribute(DATA_OVERFLOW_ITEM, '');
45
+ return ()=>{
46
+ item.element.removeAttribute(DATA_OVERFLOWING);
47
+ item.element.removeAttribute(DATA_OVERFLOW_ITEM);
48
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.removeItem(item.id);
49
+ };
50
+ }, [
51
+ overflowManager
52
+ ]);
53
+ const registerDivider = React.useCallback((divider)=>{
54
+ const el = divider.element;
55
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.addDivider(divider);
56
+ el && el.setAttribute(DATA_OVERFLOW_DIVIDER, '');
57
+ return ()=>{
58
+ divider.groupId && (overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.removeDivider(divider.groupId));
59
+ el.removeAttribute(DATA_OVERFLOW_DIVIDER);
60
+ };
61
+ }, [
62
+ overflowManager
63
+ ]);
64
+ const updateOverflow = React.useCallback(()=>{
65
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.update();
66
+ }, [
67
+ overflowManager
68
+ ]);
69
+ const registerOverflowMenu = React.useCallback((el)=>{
70
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.addOverflowMenu(el);
71
+ el.setAttribute(DATA_OVERFLOW_MENU, '');
72
+ return ()=>{
73
+ overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.removeOverflowMenu();
74
+ el.removeAttribute(DATA_OVERFLOW_MENU);
75
+ };
76
+ }, [
77
+ overflowManager
78
+ ]);
79
+ return {
80
+ containerRef,
81
+ registerItem,
82
+ updateOverflow,
83
+ registerOverflowMenu,
84
+ registerDivider
48
85
  };
49
- }, [overflowManager]);
50
- const updateOverflow = React.useCallback(() => {
51
- overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.update();
52
- }, [overflowManager]);
53
- const registerOverflowMenu = React.useCallback(el => {
54
- overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.addOverflowMenu(el);
55
- el.setAttribute(DATA_OVERFLOW_MENU, '');
56
- return () => {
57
- overflowManager === null || overflowManager === void 0 ? void 0 : overflowManager.removeOverflowMenu();
58
- el.removeAttribute(DATA_OVERFLOW_MENU);
59
- };
60
- }, [overflowManager]);
61
- return {
62
- containerRef,
63
- registerItem,
64
- updateOverflow,
65
- registerOverflowMenu
66
- };
67
86
  };
68
- export const updateVisibilityAttribute = ({
69
- item,
70
- visible
71
- }) => {
72
- if (visible) {
73
- item.element.removeAttribute(DATA_OVERFLOWING);
74
- } else {
75
- item.element.setAttribute(DATA_OVERFLOWING, '');
76
- }
87
+ export const updateVisibilityAttribute = ({ item , visible })=>{
88
+ if (visible) {
89
+ item.element.removeAttribute(DATA_OVERFLOWING);
90
+ } else {
91
+ item.element.setAttribute(DATA_OVERFLOWING, '');
92
+ }
77
93
  };
78
- //# sourceMappingURL=useOverflowContainer.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","createOverflowManager","canUseDOM","useEventCallback","useIsomorphicLayoutEffect","DATA_OVERFLOWING","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU","useOverflowContainer","update","options","overflowAxis","overflowDirection","padding","minimumVisible","onUpdateItemVisibility","containerRef","useRef","updateOverflowItems","overflowManager","useState","current","observe","undefined","onUpdateOverflow","disconnect","registerItem","useCallback","item","addItem","element","setAttribute","removeAttribute","removeItem","id","updateOverflow","registerOverflowMenu","el","addOverflowMenu","removeOverflowMenu","updateVisibilityAttribute","visible"],"sources":["../src/useOverflowContainer.ts"],"sourcesContent":["import * as React from 'react';\nimport { createOverflowManager } from '@fluentui/priority-overflow';\n\n/**\n * @internal\n */\nimport type {\n OnUpdateItemVisibility,\n OnUpdateOverflow,\n OverflowItemEntry,\n OverflowManager,\n ObserveOptions,\n} from '@fluentui/priority-overflow';\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { UseOverflowContainerReturn } from './types';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';\n\n/**\n * @internal\n * @param update - Callback when overflow state changes\n * @param options - Options to configure the overflow container\n * @returns - ref to attach to an intrinsic HTML element and imperative functions\n */\nexport const useOverflowContainer = <TElement extends HTMLElement>(\n update: OnUpdateOverflow,\n options: Omit<ObserveOptions, 'onUpdateOverflow'>,\n): UseOverflowContainerReturn<TElement> => {\n const { overflowAxis, overflowDirection, padding, minimumVisible, onUpdateItemVisibility } = options;\n\n // DOM ref to the overflow container element\n const containerRef = React.useRef<TElement>(null);\n const updateOverflowItems = useEventCallback(update);\n\n const [overflowManager] = React.useState<OverflowManager | null>(() =>\n canUseDOM() ? createOverflowManager() : null,\n );\n\n useIsomorphicLayoutEffect(() => {\n if (!containerRef.current) {\n return;\n }\n\n if (overflowManager) {\n overflowManager.observe(containerRef.current, {\n overflowDirection: overflowDirection ?? 'end',\n overflowAxis: overflowAxis ?? 'horizontal',\n padding: padding ?? 10,\n minimumVisible: minimumVisible ?? 0,\n onUpdateItemVisibility: onUpdateItemVisibility ?? (() => undefined),\n onUpdateOverflow: updateOverflowItems ?? (() => undefined),\n });\n\n return () => {\n overflowManager.disconnect();\n };\n }\n }, [\n updateOverflowItems,\n overflowManager,\n overflowDirection,\n overflowAxis,\n padding,\n minimumVisible,\n onUpdateItemVisibility,\n ]);\n\n const registerItem = React.useCallback(\n (item: OverflowItemEntry) => {\n overflowManager?.addItem(item);\n item.element.setAttribute(DATA_OVERFLOW_ITEM, '');\n\n return () => {\n item.element.removeAttribute(DATA_OVERFLOWING);\n item.element.removeAttribute(DATA_OVERFLOW_ITEM);\n overflowManager?.removeItem(item.id);\n };\n },\n [overflowManager],\n );\n\n const updateOverflow = React.useCallback(() => {\n overflowManager?.update();\n }, [overflowManager]);\n\n const registerOverflowMenu = React.useCallback(\n (el: HTMLElement) => {\n overflowManager?.addOverflowMenu(el);\n el.setAttribute(DATA_OVERFLOW_MENU, '');\n\n return () => {\n overflowManager?.removeOverflowMenu();\n el.removeAttribute(DATA_OVERFLOW_MENU);\n };\n },\n [overflowManager],\n );\n\n return {\n containerRef,\n registerItem,\n updateOverflow,\n registerOverflowMenu,\n };\n};\n\nexport const updateVisibilityAttribute: OnUpdateItemVisibility = ({ item, visible }) => {\n if (visible) {\n item.element.removeAttribute(DATA_OVERFLOWING);\n } else {\n item.element.setAttribute(DATA_OVERFLOWING, '');\n }\n};\n"],"mappings":"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"}
1
+ {"version":3,"sources":["useOverflowContainer.ts"],"sourcesContent":["import * as React from 'react';\nimport { createOverflowManager } from '@fluentui/priority-overflow';\n\n/**\n * @internal\n */\nimport type {\n OnUpdateItemVisibility,\n OnUpdateOverflow,\n OverflowItemEntry,\n OverflowDividerEntry,\n OverflowManager,\n ObserveOptions,\n} from '@fluentui/priority-overflow';\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { UseOverflowContainerReturn } from './types';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_DIVIDER, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';\n\n/**\n * @internal\n * @param update - Callback when overflow state changes\n * @param options - Options to configure the overflow container\n * @returns - ref to attach to an intrinsic HTML element and imperative functions\n */\nexport const useOverflowContainer = <TElement extends HTMLElement>(\n update: OnUpdateOverflow,\n options: Omit<ObserveOptions, 'onUpdateOverflow'>,\n): UseOverflowContainerReturn<TElement> => {\n const { overflowAxis, overflowDirection, padding, minimumVisible, onUpdateItemVisibility } = options;\n\n // DOM ref to the overflow container element\n const containerRef = React.useRef<TElement>(null);\n const updateOverflowItems = useEventCallback(update);\n\n const [overflowManager] = React.useState<OverflowManager | null>(() =>\n canUseDOM() ? createOverflowManager() : null,\n );\n\n useIsomorphicLayoutEffect(() => {\n if (!containerRef.current) {\n return;\n }\n\n if (overflowManager) {\n overflowManager.observe(containerRef.current, {\n overflowDirection: overflowDirection ?? 'end',\n overflowAxis: overflowAxis ?? 'horizontal',\n padding: padding ?? 10,\n minimumVisible: minimumVisible ?? 0,\n onUpdateItemVisibility: onUpdateItemVisibility ?? (() => undefined),\n onUpdateOverflow: updateOverflowItems ?? (() => undefined),\n });\n\n return () => {\n overflowManager.disconnect();\n };\n }\n }, [\n updateOverflowItems,\n overflowManager,\n overflowDirection,\n overflowAxis,\n padding,\n minimumVisible,\n onUpdateItemVisibility,\n ]);\n\n const registerItem = React.useCallback(\n (item: OverflowItemEntry) => {\n overflowManager?.addItem(item);\n item.element.setAttribute(DATA_OVERFLOW_ITEM, '');\n\n return () => {\n item.element.removeAttribute(DATA_OVERFLOWING);\n item.element.removeAttribute(DATA_OVERFLOW_ITEM);\n overflowManager?.removeItem(item.id);\n };\n },\n [overflowManager],\n );\n\n const registerDivider = React.useCallback(\n (divider: OverflowDividerEntry) => {\n const el = divider.element;\n overflowManager?.addDivider(divider);\n el && el.setAttribute(DATA_OVERFLOW_DIVIDER, '');\n\n return () => {\n divider.groupId && overflowManager?.removeDivider(divider.groupId);\n el.removeAttribute(DATA_OVERFLOW_DIVIDER);\n };\n },\n [overflowManager],\n );\n\n const updateOverflow = React.useCallback(() => {\n overflowManager?.update();\n }, [overflowManager]);\n\n const registerOverflowMenu = React.useCallback(\n (el: HTMLElement) => {\n overflowManager?.addOverflowMenu(el);\n el.setAttribute(DATA_OVERFLOW_MENU, '');\n\n return () => {\n overflowManager?.removeOverflowMenu();\n el.removeAttribute(DATA_OVERFLOW_MENU);\n };\n },\n [overflowManager],\n );\n\n return {\n containerRef,\n registerItem,\n updateOverflow,\n registerOverflowMenu,\n registerDivider,\n };\n};\n\nexport const updateVisibilityAttribute: OnUpdateItemVisibility = ({ item, visible }) => {\n if (visible) {\n item.element.removeAttribute(DATA_OVERFLOWING);\n } else {\n item.element.setAttribute(DATA_OVERFLOWING, '');\n }\n};\n"],"names":["React","createOverflowManager","canUseDOM","useEventCallback","useIsomorphicLayoutEffect","DATA_OVERFLOWING","DATA_OVERFLOW_DIVIDER","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU","useOverflowContainer","update","options","overflowAxis","overflowDirection","padding","minimumVisible","onUpdateItemVisibility","containerRef","useRef","updateOverflowItems","overflowManager","useState","current","observe","undefined","onUpdateOverflow","disconnect","registerItem","useCallback","item","addItem","element","setAttribute","removeAttribute","removeItem","id","registerDivider","divider","el","addDivider","groupId","removeDivider","updateOverflow","registerOverflowMenu","addOverflowMenu","removeOverflowMenu","updateVisibilityAttribute","visible"],"mappings":"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"}
@@ -1,13 +1,11 @@
1
1
  import { useOverflowContext } from './overflowContext';
2
2
  /**
3
3
  * @returns Number of items that are overflowing
4
- */
5
- export const useOverflowCount = () => useOverflowContext(v => {
6
- return Object.entries(v.itemVisibility).reduce((acc, [id, visible]) => {
7
- if (!visible) {
8
- acc++;
9
- }
10
- return acc;
11
- }, 0);
12
- });
13
- //# sourceMappingURL=useOverflowCount.js.map
4
+ */ export const useOverflowCount = ()=>useOverflowContext((v)=>{
5
+ return Object.entries(v.itemVisibility).reduce((acc, [id, visible])=>{
6
+ if (!visible) {
7
+ acc++;
8
+ }
9
+ return acc;
10
+ }, 0);
11
+ });
@@ -1 +1 @@
1
- {"version":3,"names":["useOverflowContext","useOverflowCount","v","Object","entries","itemVisibility","reduce","acc","id","visible"],"sources":["../src/useOverflowCount.ts"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n\n/**\n * @returns Number of items that are overflowing\n */\nexport const useOverflowCount = () =>\n useOverflowContext(v => {\n return Object.entries(v.itemVisibility).reduce((acc, [id, visible]) => {\n if (!visible) {\n acc++;\n }\n\n return acc;\n }, 0);\n });\n"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ;AAEnC;;;AAGA,OAAO,MAAMC,gBAAA,GAAmBA,CAAA,KAC9BD,kBAAA,CAAmBE,CAAA,IAAK;EACtB,OAAOC,MAAA,CAAOC,OAAO,CAACF,CAAA,CAAEG,cAAc,EAAEC,MAAM,CAAC,CAACC,GAAA,EAAK,CAACC,EAAA,EAAIC,OAAA,CAAQ,KAAK;IACrE,IAAI,CAACA,OAAA,EAAS;MACZF,GAAA;IACF;IAEA,OAAOA,GAAA;EACT,GAAG;AACL"}
1
+ {"version":3,"sources":["useOverflowCount.ts"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n\n/**\n * @returns Number of items that are overflowing\n */\nexport const useOverflowCount = () =>\n useOverflowContext(v => {\n return Object.entries(v.itemVisibility).reduce((acc, [id, visible]) => {\n if (!visible) {\n acc++;\n }\n\n return acc;\n }, 0);\n });\n"],"names":["useOverflowContext","useOverflowCount","v","Object","entries","itemVisibility","reduce","acc","id","visible"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,oBAAoB;AAEvD;;CAEC,GACD,OAAO,MAAMC,mBAAmB,IAC9BD,mBAAmBE,CAAAA,IAAK;QACtB,OAAOC,OAAOC,OAAO,CAACF,EAAEG,cAAc,EAAEC,MAAM,CAAC,CAACC,KAAK,CAACC,IAAIC,QAAQ,GAAK;YACrE,IAAI,CAACA,SAAS;gBACZF;YACF,CAAC;YAED,OAAOA;QACT,GAAG;IACL,GAAG"}
@@ -0,0 +1,24 @@
1
+ import * as React from 'react';
2
+ import { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
3
+ import { useOverflowContext } from './overflowContext';
4
+ /**
5
+ * @internal
6
+ * Registers an overflow item
7
+ * @param groupId - assigns the item to a group, group visibility can be watched
8
+ * @returns ref to assign to an intrinsic HTML element
9
+ */ export function useOverflowDivider(groupId) {
10
+ const ref = React.useRef(null);
11
+ const registerDivider = useOverflowContext((v)=>v.registerDivider);
12
+ useIsomorphicLayoutEffect(()=>{
13
+ if (ref.current && groupId) {
14
+ return registerDivider({
15
+ element: ref.current,
16
+ groupId
17
+ });
18
+ }
19
+ }, [
20
+ registerDivider,
21
+ groupId
22
+ ]);
23
+ return ref;
24
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["useOverflowDivider.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\n\n/**\n * @internal\n * Registers an overflow item\n * @param groupId - assigns the item to a group, group visibility can be watched\n * @returns ref to assign to an intrinsic HTML element\n */\nexport function useOverflowDivider<TElement extends HTMLElement>(groupId?: string) {\n const ref = React.useRef<TElement>(null);\n const registerDivider = useOverflowContext(v => v.registerDivider);\n\n useIsomorphicLayoutEffect(() => {\n if (ref.current && groupId) {\n return registerDivider({\n element: ref.current,\n groupId,\n });\n }\n }, [registerDivider, groupId]);\n\n return ref;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useOverflowContext","useOverflowDivider","groupId","ref","useRef","registerDivider","v","current","element"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,4BAA4B;AACtE,SAASC,kBAAkB,QAAQ,oBAAoB;AAEvD;;;;;CAKC,GACD,OAAO,SAASC,mBAAiDC,OAAgB,EAAE;IACjF,MAAMC,MAAML,MAAMM,MAAM,CAAW,IAAI;IACvC,MAAMC,kBAAkBL,mBAAmBM,CAAAA,IAAKA,EAAED,eAAe;IAEjEN,0BAA0B,IAAM;QAC9B,IAAII,IAAII,OAAO,IAAIL,SAAS;YAC1B,OAAOG,gBAAgB;gBACrBG,SAASL,IAAII,OAAO;gBACpBL;YACF;QACF,CAAC;IACH,GAAG;QAACG;QAAiBH;KAAQ;IAE7B,OAAOC;AACT,CAAC"}
@@ -8,20 +8,23 @@ import { useOverflowContext } from './overflowContext';
8
8
  * @param priority - higher priority means the item overflows later
9
9
  * @param groupId - assigns the item to a group, group visibility can be watched
10
10
  * @returns ref to assign to an intrinsic HTML element
11
- */
12
- export function useOverflowItem(id, priority, groupId) {
13
- const ref = React.useRef(null);
14
- const registerItem = useOverflowContext(v => v.registerItem);
15
- useIsomorphicLayoutEffect(() => {
16
- if (ref.current) {
17
- return registerItem({
18
- element: ref.current,
11
+ */ export function useOverflowItem(id, priority, groupId) {
12
+ const ref = React.useRef(null);
13
+ const registerItem = useOverflowContext((v)=>v.registerItem);
14
+ useIsomorphicLayoutEffect(()=>{
15
+ if (ref.current) {
16
+ return registerItem({
17
+ element: ref.current,
18
+ id,
19
+ priority: priority !== null && priority !== void 0 ? priority : 0,
20
+ groupId
21
+ });
22
+ }
23
+ }, [
19
24
  id,
20
- priority: priority !== null && priority !== void 0 ? priority : 0,
25
+ priority,
26
+ registerItem,
21
27
  groupId
22
- });
23
- }
24
- }, [id, priority, registerItem, groupId]);
25
- return ref;
28
+ ]);
29
+ return ref;
26
30
  }
27
- //# sourceMappingURL=useOverflowItem.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useIsomorphicLayoutEffect","useOverflowContext","useOverflowItem","id","priority","groupId","ref","useRef","registerItem","v","current","element"],"sources":["../src/useOverflowItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\n\n/**\n * @internal\n * Registers an overflow item\n * @param id - unique identifier for the item used by the overflow manager\n * @param priority - higher priority means the item overflows later\n * @param groupId - assigns the item to a group, group visibility can be watched\n * @returns ref to assign to an intrinsic HTML element\n */\nexport function useOverflowItem<TElement extends HTMLElement>(id: string, priority?: number, groupId?: string) {\n const ref = React.useRef<TElement>(null);\n const registerItem = useOverflowContext(v => v.registerItem);\n\n useIsomorphicLayoutEffect(() => {\n if (ref.current) {\n return registerItem({\n element: ref.current,\n id,\n priority: priority ?? 0,\n groupId,\n });\n }\n }, [id, priority, registerItem, groupId]);\n\n return ref;\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,kBAAkB,QAAQ;AAEnC;;;;;;;;AAQA,OAAO,SAASC,gBAA8CC,EAAU,EAAEC,QAAiB,EAAEC,OAAgB,EAAE;EAC7G,MAAMC,GAAA,GAAMP,KAAA,CAAMQ,MAAM,CAAW,IAAI;EACvC,MAAMC,YAAA,GAAeP,kBAAA,CAAmBQ,CAAA,IAAKA,CAAA,CAAED,YAAY;EAE3DR,yBAAA,CAA0B,MAAM;IAC9B,IAAIM,GAAA,CAAII,OAAO,EAAE;MACf,OAAOF,YAAA,CAAa;QAClBG,OAAA,EAASL,GAAA,CAAII,OAAO;QACpBP,EAAA;QACAC,QAAA,EAAUA,QAAA,aAAAA,QAAA,cAAAA,QAAA,GAAY,CAAC;QACvBC;MACF;IACF;EACF,GAAG,CAACF,EAAA,EAAIC,QAAA,EAAUI,YAAA,EAAcH,OAAA,CAAQ;EAExC,OAAOC,GAAA;AACT"}
1
+ {"version":3,"sources":["useOverflowItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\n\n/**\n * @internal\n * Registers an overflow item\n * @param id - unique identifier for the item used by the overflow manager\n * @param priority - higher priority means the item overflows later\n * @param groupId - assigns the item to a group, group visibility can be watched\n * @returns ref to assign to an intrinsic HTML element\n */\nexport function useOverflowItem<TElement extends HTMLElement>(id: string, priority?: number, groupId?: string) {\n const ref = React.useRef<TElement>(null);\n const registerItem = useOverflowContext(v => v.registerItem);\n\n useIsomorphicLayoutEffect(() => {\n if (ref.current) {\n return registerItem({\n element: ref.current,\n id,\n priority: priority ?? 0,\n groupId,\n });\n }\n }, [id, priority, registerItem, groupId]);\n\n return ref;\n}\n"],"names":["React","useIsomorphicLayoutEffect","useOverflowContext","useOverflowItem","id","priority","groupId","ref","useRef","registerItem","v","current","element"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,4BAA4B;AACtE,SAASC,kBAAkB,QAAQ,oBAAoB;AAEvD;;;;;;;CAOC,GACD,OAAO,SAASC,gBAA8CC,EAAU,EAAEC,QAAiB,EAAEC,OAAgB,EAAE;IAC7G,MAAMC,MAAMP,MAAMQ,MAAM,CAAW,IAAI;IACvC,MAAMC,eAAeP,mBAAmBQ,CAAAA,IAAKA,EAAED,YAAY;IAE3DR,0BAA0B,IAAM;QAC9B,IAAIM,IAAII,OAAO,EAAE;YACf,OAAOF,aAAa;gBAClBG,SAASL,IAAII,OAAO;gBACpBP;gBACAC,UAAUA,qBAAAA,sBAAAA,WAAY,CAAC;gBACvBC;YACF;QACF,CAAC;IACH,GAAG;QAACF;QAAIC;QAAUI;QAAcH;KAAQ;IAExC,OAAOC;AACT,CAAC"}
@@ -3,26 +3,33 @@ import { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';
3
3
  import { useOverflowContext } from './overflowContext';
4
4
  import { useOverflowCount } from './useOverflowCount';
5
5
  export function useOverflowMenu(id) {
6
- const elementId = useId('overflow-menu', id);
7
- const overflowCount = useOverflowCount();
8
- const registerOverflowMenu = useOverflowContext(v => v.registerOverflowMenu);
9
- const updateOverflow = useOverflowContext(v => v.updateOverflow);
10
- const ref = React.useRef(null);
11
- const isOverflowing = overflowCount > 0;
12
- useIsomorphicLayoutEffect(() => {
13
- if (ref.current) {
14
- return registerOverflowMenu(ref.current);
15
- }
16
- }, [registerOverflowMenu, isOverflowing, elementId]);
17
- useIsomorphicLayoutEffect(() => {
18
- if (isOverflowing) {
19
- updateOverflow();
20
- }
21
- }, [isOverflowing, updateOverflow, ref]);
22
- return {
23
- ref,
24
- overflowCount,
25
- isOverflowing
26
- };
6
+ const elementId = useId('overflow-menu', id);
7
+ const overflowCount = useOverflowCount();
8
+ const registerOverflowMenu = useOverflowContext((v)=>v.registerOverflowMenu);
9
+ const updateOverflow = useOverflowContext((v)=>v.updateOverflow);
10
+ const ref = React.useRef(null);
11
+ const isOverflowing = overflowCount > 0;
12
+ useIsomorphicLayoutEffect(()=>{
13
+ if (ref.current) {
14
+ return registerOverflowMenu(ref.current);
15
+ }
16
+ }, [
17
+ registerOverflowMenu,
18
+ isOverflowing,
19
+ elementId
20
+ ]);
21
+ useIsomorphicLayoutEffect(()=>{
22
+ if (isOverflowing) {
23
+ updateOverflow();
24
+ }
25
+ }, [
26
+ isOverflowing,
27
+ updateOverflow,
28
+ ref
29
+ ]);
30
+ return {
31
+ ref,
32
+ overflowCount,
33
+ isOverflowing
34
+ };
27
35
  }
28
- //# sourceMappingURL=useOverflowMenu.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","useId","useIsomorphicLayoutEffect","useOverflowContext","useOverflowCount","useOverflowMenu","id","elementId","overflowCount","registerOverflowMenu","v","updateOverflow","ref","useRef","isOverflowing","current"],"sources":["../src/useOverflowMenu.ts"],"sourcesContent":["import * as React from 'react';\nimport { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\nimport { useOverflowCount } from './useOverflowCount';\n\nexport function useOverflowMenu<TElement extends HTMLElement>(id?: string) {\n const elementId = useId('overflow-menu', id);\n const overflowCount = useOverflowCount();\n const registerOverflowMenu = useOverflowContext(v => v.registerOverflowMenu);\n const updateOverflow = useOverflowContext(v => v.updateOverflow);\n const ref = React.useRef<TElement>(null);\n const isOverflowing = overflowCount > 0;\n\n useIsomorphicLayoutEffect(() => {\n if (ref.current) {\n return registerOverflowMenu(ref.current);\n }\n }, [registerOverflowMenu, isOverflowing, elementId]);\n\n useIsomorphicLayoutEffect(() => {\n if (isOverflowing) {\n updateOverflow();\n }\n }, [isOverflowing, updateOverflow, ref]);\n\n return { ref, overflowCount, isOverflowing };\n}\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,KAAK,EAAEC,yBAAyB,QAAQ;AACjD,SAASC,kBAAkB,QAAQ;AACnC,SAASC,gBAAgB,QAAQ;AAEjC,OAAO,SAASC,gBAA8CC,EAAW,EAAE;EACzE,MAAMC,SAAA,GAAYN,KAAA,CAAM,iBAAiBK,EAAA;EACzC,MAAME,aAAA,GAAgBJ,gBAAA;EACtB,MAAMK,oBAAA,GAAuBN,kBAAA,CAAmBO,CAAA,IAAKA,CAAA,CAAED,oBAAoB;EAC3E,MAAME,cAAA,GAAiBR,kBAAA,CAAmBO,CAAA,IAAKA,CAAA,CAAEC,cAAc;EAC/D,MAAMC,GAAA,GAAMZ,KAAA,CAAMa,MAAM,CAAW,IAAI;EACvC,MAAMC,aAAA,GAAgBN,aAAA,GAAgB;EAEtCN,yBAAA,CAA0B,MAAM;IAC9B,IAAIU,GAAA,CAAIG,OAAO,EAAE;MACf,OAAON,oBAAA,CAAqBG,GAAA,CAAIG,OAAO;IACzC;EACF,GAAG,CAACN,oBAAA,EAAsBK,aAAA,EAAeP,SAAA,CAAU;EAEnDL,yBAAA,CAA0B,MAAM;IAC9B,IAAIY,aAAA,EAAe;MACjBH,cAAA;IACF;EACF,GAAG,CAACG,aAAA,EAAeH,cAAA,EAAgBC,GAAA,CAAI;EAEvC,OAAO;IAAEA,GAAA;IAAKJ,aAAA;IAAeM;EAAc;AAC7C"}
1
+ {"version":3,"sources":["useOverflowMenu.ts"],"sourcesContent":["import * as React from 'react';\nimport { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\nimport { useOverflowCount } from './useOverflowCount';\n\nexport function useOverflowMenu<TElement extends HTMLElement>(id?: string) {\n const elementId = useId('overflow-menu', id);\n const overflowCount = useOverflowCount();\n const registerOverflowMenu = useOverflowContext(v => v.registerOverflowMenu);\n const updateOverflow = useOverflowContext(v => v.updateOverflow);\n const ref = React.useRef<TElement>(null);\n const isOverflowing = overflowCount > 0;\n\n useIsomorphicLayoutEffect(() => {\n if (ref.current) {\n return registerOverflowMenu(ref.current);\n }\n }, [registerOverflowMenu, isOverflowing, elementId]);\n\n useIsomorphicLayoutEffect(() => {\n if (isOverflowing) {\n updateOverflow();\n }\n }, [isOverflowing, updateOverflow, ref]);\n\n return { ref, overflowCount, isOverflowing };\n}\n"],"names":["React","useId","useIsomorphicLayoutEffect","useOverflowContext","useOverflowCount","useOverflowMenu","id","elementId","overflowCount","registerOverflowMenu","v","updateOverflow","ref","useRef","isOverflowing","current"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,EAAEC,yBAAyB,QAAQ,4BAA4B;AAC7E,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,gBAAgB,QAAQ,qBAAqB;AAEtD,OAAO,SAASC,gBAA8CC,EAAW,EAAE;IACzE,MAAMC,YAAYN,MAAM,iBAAiBK;IACzC,MAAME,gBAAgBJ;IACtB,MAAMK,uBAAuBN,mBAAmBO,CAAAA,IAAKA,EAAED,oBAAoB;IAC3E,MAAME,iBAAiBR,mBAAmBO,CAAAA,IAAKA,EAAEC,cAAc;IAC/D,MAAMC,MAAMZ,MAAMa,MAAM,CAAW,IAAI;IACvC,MAAMC,gBAAgBN,gBAAgB;IAEtCN,0BAA0B,IAAM;QAC9B,IAAIU,IAAIG,OAAO,EAAE;YACf,OAAON,qBAAqBG,IAAIG,OAAO;QACzC,CAAC;IACH,GAAG;QAACN;QAAsBK;QAAeP;KAAU;IAEnDL,0BAA0B,IAAM;QAC9B,IAAIY,eAAe;YACjBH;QACF,CAAC;IACH,GAAG;QAACG;QAAeH;QAAgBC;KAAI;IAEvC,OAAO;QAAEA;QAAKJ;QAAeM;IAAc;AAC7C,CAAC"}
@@ -25,7 +25,9 @@ const Overflow = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
25
25
  const update = (data)=>{
26
26
  const { visibleItems , invisibleItems , groupVisibility } = data;
27
27
  const itemVisibility = {};
28
- visibleItems.forEach((x)=>itemVisibility[x.id] = true);
28
+ visibleItems.forEach((item)=>{
29
+ itemVisibility[item.id] = true;
30
+ });
29
31
  invisibleItems.forEach((x)=>itemVisibility[x.id] = false);
30
32
  setOverflowState(()=>{
31
33
  return {
@@ -35,7 +37,7 @@ const Overflow = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
35
37
  };
36
38
  });
37
39
  };
38
- const { containerRef , registerItem , updateOverflow , registerOverflowMenu } = (0, _useOverflowContainer.useOverflowContainer)(update, {
40
+ const { containerRef , registerItem , updateOverflow , registerOverflowMenu , registerDivider } = (0, _useOverflowContainer.useOverflowContainer)(update, {
39
41
  overflowDirection,
40
42
  overflowAxis,
41
43
  padding,
@@ -53,9 +55,8 @@ const Overflow = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
53
55
  hasOverflow: overflowState.hasOverflow,
54
56
  registerItem,
55
57
  updateOverflow,
56
- registerOverflowMenu
58
+ registerOverflowMenu,
59
+ registerDivider
57
60
  }
58
61
  }, clonedChild);
59
- }); //# sourceMappingURL=Overflow.js.map
60
-
61
- //# sourceMappingURL=Overflow.js.map
62
+ });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../lib/components/Overflow.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeClasses } from '@griffel/react';\nimport { applyTriggerPropsToChildren, useMergedRefs } from '@fluentui/react-utilities';\nimport { OverflowContext } from '../overflowContext';\nimport { updateVisibilityAttribute, useOverflowContainer } from '../useOverflowContainer';\nimport { useOverflowStyles } from './useOverflowStyles.styles';\n/**\n * Provides an OverflowContext for OverflowItem descendants.\n */\nexport const Overflow = /*#__PURE__*/React.forwardRef((props, ref) => {\n const styles = useOverflowStyles();\n const {\n children,\n minimumVisible,\n overflowAxis = 'horizontal',\n overflowDirection,\n padding\n } = props;\n const [overflowState, setOverflowState] = React.useState({\n hasOverflow: false,\n itemVisibility: {},\n groupVisibility: {}\n });\n // useOverflowContainer wraps this method in a useEventCallback.\n const update = data => {\n const {\n visibleItems,\n invisibleItems,\n groupVisibility\n } = data;\n const itemVisibility = {};\n visibleItems.forEach(x => itemVisibility[x.id] = true);\n invisibleItems.forEach(x => itemVisibility[x.id] = false);\n setOverflowState(() => {\n return {\n hasOverflow: data.invisibleItems.length > 0,\n itemVisibility,\n groupVisibility\n };\n });\n };\n const {\n containerRef,\n registerItem,\n updateOverflow,\n registerOverflowMenu\n } = useOverflowContainer(update, {\n overflowDirection,\n overflowAxis,\n padding,\n minimumVisible,\n onUpdateItemVisibility: updateVisibilityAttribute\n });\n const clonedChild = applyTriggerPropsToChildren(children, {\n ref: useMergedRefs(containerRef, ref),\n className: mergeClasses(styles.overflowMenu, styles.overflowingItems, children.props.className)\n });\n return /*#__PURE__*/React.createElement(OverflowContext.Provider, {\n value: {\n itemVisibility: overflowState.itemVisibility,\n groupVisibility: overflowState.groupVisibility,\n hasOverflow: overflowState.hasOverflow,\n registerItem,\n updateOverflow,\n registerOverflowMenu\n }\n }, clonedChild);\n});\n//# sourceMappingURL=Overflow.js.map"],"names":["Overflow","React","forwardRef","props","ref","styles","useOverflowStyles","children","minimumVisible","overflowAxis","overflowDirection","padding","overflowState","setOverflowState","useState","hasOverflow","itemVisibility","groupVisibility","update","data","visibleItems","invisibleItems","forEach","x","id","length","containerRef","registerItem","updateOverflow","registerOverflowMenu","useOverflowContainer","onUpdateItemVisibility","updateVisibilityAttribute","clonedChild","applyTriggerPropsToChildren","useMergedRefs","className","mergeClasses","overflowMenu","overflowingItems","createElement","OverflowContext","Provider","value"],"mappings":";;;;+BASaA;;aAAAA;;;6DATU;wBACM;gCAC8B;iCAC3B;sCACgC;yCAC9B;AAI3B,MAAMA,WAAW,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACpE,MAAMC,SAASC,IAAAA,0CAAiB;IAChC,MAAM,EACJC,SAAQ,EACRC,eAAc,EACdC,cAAe,aAAY,EAC3BC,kBAAiB,EACjBC,QAAO,EACR,GAAGR;IACJ,MAAM,CAACS,eAAeC,iBAAiB,GAAGZ,OAAMa,QAAQ,CAAC;QACvDC,aAAa,KAAK;QAClBC,gBAAgB,CAAC;QACjBC,iBAAiB,CAAC;IACpB;IACA,gEAAgE;IAChE,MAAMC,SAASC,CAAAA,OAAQ;QACrB,MAAM,EACJC,aAAY,EACZC,eAAc,EACdJ,gBAAe,EAChB,GAAGE;QACJ,MAAMH,iBAAiB,CAAC;QACxBI,aAAaE,OAAO,CAACC,CAAAA,IAAKP,cAAc,CAACO,EAAEC,EAAE,CAAC,GAAG,IAAI;QACrDH,eAAeC,OAAO,CAACC,CAAAA,IAAKP,cAAc,CAACO,EAAEC,EAAE,CAAC,GAAG,KAAK;QACxDX,iBAAiB,IAAM;YACrB,OAAO;gBACLE,aAAaI,KAAKE,cAAc,CAACI,MAAM,GAAG;gBAC1CT;gBACAC;YACF;QACF;IACF;IACA,MAAM,EACJS,aAAY,EACZC,aAAY,EACZC,eAAc,EACdC,qBAAoB,EACrB,GAAGC,IAAAA,0CAAoB,EAACZ,QAAQ;QAC/BR;QACAD;QACAE;QACAH;QACAuB,wBAAwBC,+CAAyB;IACnD;IACA,MAAMC,cAAcC,IAAAA,2CAA2B,EAAC3B,UAAU;QACxDH,KAAK+B,IAAAA,6BAAa,EAACT,cAActB;QACjCgC,WAAWC,IAAAA,oBAAY,EAAChC,OAAOiC,YAAY,EAAEjC,OAAOkC,gBAAgB,EAAEhC,SAASJ,KAAK,CAACiC,SAAS;IAChG;IACA,OAAO,WAAW,GAAEnC,OAAMuC,aAAa,CAACC,gCAAe,CAACC,QAAQ,EAAE;QAChEC,OAAO;YACL3B,gBAAgBJ,cAAcI,cAAc;YAC5CC,iBAAiBL,cAAcK,eAAe;YAC9CF,aAAaH,cAAcG,WAAW;YACtCY;YACAC;YACAC;QACF;IACF,GAAGI;AACL,IACA,oCAAoC"}
1
+ {"version":3,"sources":["Overflow.js"],"sourcesContent":["import * as React from 'react';\nimport { mergeClasses } from '@griffel/react';\nimport { applyTriggerPropsToChildren, useMergedRefs } from '@fluentui/react-utilities';\nimport { OverflowContext } from '../overflowContext';\nimport { updateVisibilityAttribute, useOverflowContainer } from '../useOverflowContainer';\nimport { useOverflowStyles } from './useOverflowStyles.styles';\n/**\n * Provides an OverflowContext for OverflowItem descendants.\n */ export const Overflow = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const styles = useOverflowStyles();\n const { children , minimumVisible , overflowAxis ='horizontal' , overflowDirection , padding } = props;\n const [overflowState, setOverflowState] = React.useState({\n hasOverflow: false,\n itemVisibility: {},\n groupVisibility: {}\n });\n // useOverflowContainer wraps this method in a useEventCallback.\n const update = (data)=>{\n const { visibleItems , invisibleItems , groupVisibility } = data;\n const itemVisibility = {};\n visibleItems.forEach((item)=>{\n itemVisibility[item.id] = true;\n });\n invisibleItems.forEach((x)=>itemVisibility[x.id] = false);\n setOverflowState(()=>{\n return {\n hasOverflow: data.invisibleItems.length > 0,\n itemVisibility,\n groupVisibility\n };\n });\n };\n const { containerRef , registerItem , updateOverflow , registerOverflowMenu , registerDivider } = useOverflowContainer(update, {\n overflowDirection,\n overflowAxis,\n padding,\n minimumVisible,\n onUpdateItemVisibility: updateVisibilityAttribute\n });\n const clonedChild = applyTriggerPropsToChildren(children, {\n ref: useMergedRefs(containerRef, ref),\n className: mergeClasses(styles.overflowMenu, styles.overflowingItems, children.props.className)\n });\n return /*#__PURE__*/ React.createElement(OverflowContext.Provider, {\n value: {\n itemVisibility: overflowState.itemVisibility,\n groupVisibility: overflowState.groupVisibility,\n hasOverflow: overflowState.hasOverflow,\n registerItem,\n updateOverflow,\n registerOverflowMenu,\n registerDivider\n }\n }, clonedChild);\n});\n"],"names":["Overflow","React","forwardRef","props","ref","styles","useOverflowStyles","children","minimumVisible","overflowAxis","overflowDirection","padding","overflowState","setOverflowState","useState","hasOverflow","itemVisibility","groupVisibility","update","data","visibleItems","invisibleItems","forEach","item","id","x","length","containerRef","registerItem","updateOverflow","registerOverflowMenu","registerDivider","useOverflowContainer","onUpdateItemVisibility","updateVisibilityAttribute","clonedChild","applyTriggerPropsToChildren","useMergedRefs","className","mergeClasses","overflowMenu","overflowingItems","createElement","OverflowContext","Provider","value"],"mappings":";;;;+BAQiBA;;aAAAA;;;6DARM;wBACM;gCAC8B;iCAC3B;sCACgC;yCAC9B;AAGvB,MAAMA,WAAW,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACrE,MAAMC,SAASC,IAAAA,0CAAiB;IAChC,MAAM,EAAEC,SAAQ,EAAGC,eAAc,EAAGC,cAAc,aAAY,EAAGC,kBAAiB,EAAGC,QAAO,EAAG,GAAGR;IAClG,MAAM,CAACS,eAAeC,iBAAiB,GAAGZ,OAAMa,QAAQ,CAAC;QACrDC,aAAa,KAAK;QAClBC,gBAAgB,CAAC;QACjBC,iBAAiB,CAAC;IACtB;IACA,gEAAgE;IAChE,MAAMC,SAAS,CAACC,OAAO;QACnB,MAAM,EAAEC,aAAY,EAAGC,eAAc,EAAGJ,gBAAe,EAAG,GAAGE;QAC7D,MAAMH,iBAAiB,CAAC;QACxBI,aAAaE,OAAO,CAAC,CAACC,OAAO;YACzBP,cAAc,CAACO,KAAKC,EAAE,CAAC,GAAG,IAAI;QAClC;QACAH,eAAeC,OAAO,CAAC,CAACG,IAAIT,cAAc,CAACS,EAAED,EAAE,CAAC,GAAG,KAAK;QACxDX,iBAAiB,IAAI;YACjB,OAAO;gBACHE,aAAaI,KAAKE,cAAc,CAACK,MAAM,GAAG;gBAC1CV;gBACAC;YACJ;QACJ;IACJ;IACA,MAAM,EAAEU,aAAY,EAAGC,aAAY,EAAGC,eAAc,EAAGC,qBAAoB,EAAGC,gBAAe,EAAG,GAAGC,IAAAA,0CAAoB,EAACd,QAAQ;QAC5HR;QACAD;QACAE;QACAH;QACAyB,wBAAwBC,+CAAyB;IACrD;IACA,MAAMC,cAAcC,IAAAA,2CAA2B,EAAC7B,UAAU;QACtDH,KAAKiC,IAAAA,6BAAa,EAACV,cAAcvB;QACjCkC,WAAWC,IAAAA,oBAAY,EAAClC,OAAOmC,YAAY,EAAEnC,OAAOoC,gBAAgB,EAAElC,SAASJ,KAAK,CAACmC,SAAS;IAClG;IACA,OAAO,WAAW,GAAGrC,OAAMyC,aAAa,CAACC,gCAAe,CAACC,QAAQ,EAAE;QAC/DC,OAAO;YACH7B,gBAAgBJ,cAAcI,cAAc;YAC5CC,iBAAiBL,cAAcK,eAAe;YAC9CF,aAAaH,cAAcG,WAAW;YACtCa;YACAC;YACAC;YACAC;QACJ;IACJ,GAAGI;AACP"}
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "OverflowDivider", {
6
+ enumerable: true,
7
+ get: ()=>OverflowDivider
8
+ });
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 _useOverflowDivider = require("../../useOverflowDivider");
13
+ const OverflowDivider = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
14
+ const { groupId , children } = props;
15
+ const containerRef = (0, _useOverflowDivider.useOverflowDivider)(groupId);
16
+ return (0, _reactUtilities.applyTriggerPropsToChildren)(children, {
17
+ ref: (0, _reactUtilities.useMergedRefs)(containerRef, ref)
18
+ });
19
+ });
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["OverflowDivider.js"],"sourcesContent":["import * as React from 'react';\nimport { applyTriggerPropsToChildren, useMergedRefs } from '@fluentui/react-utilities';\nimport { useOverflowDivider } from '../../useOverflowDivider';\n/**\n * Attaches overflow item behavior to its child registered with the OverflowContext.\n * It does not render an element of its own.\n */ export const OverflowDivider = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const { groupId , children } = props;\n const containerRef = useOverflowDivider(groupId);\n return applyTriggerPropsToChildren(children, {\n ref: useMergedRefs(containerRef, ref)\n });\n});\n"],"names":["OverflowDivider","React","forwardRef","props","ref","groupId","children","containerRef","useOverflowDivider","applyTriggerPropsToChildren","useMergedRefs"],"mappings":";;;;+BAMiBA;;aAAAA;;;6DANM;gCACoC;oCACxB;AAIxB,MAAMA,kBAAkB,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IAC5E,MAAM,EAAEC,QAAO,EAAGC,SAAQ,EAAG,GAAGH;IAChC,MAAMI,eAAeC,IAAAA,sCAAkB,EAACH;IACxC,OAAOI,IAAAA,2CAA2B,EAACH,UAAU;QACzCF,KAAKM,IAAAA,6BAAa,EAACH,cAAcH;IACrC;AACJ"}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
6
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["OverflowDivider.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
@@ -16,6 +16,4 @@ const OverflowItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
16
16
  return (0, _reactUtilities.applyTriggerPropsToChildren)(children, {
17
17
  ref: (0, _reactUtilities.useMergedRefs)(containerRef, ref)
18
18
  });
19
- }); //# sourceMappingURL=OverflowItem.js.map
20
-
21
- //# sourceMappingURL=OverflowItem.js.map
19
+ });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/OverflowItem/OverflowItem.js"],"sourcesContent":["import * as React from 'react';\nimport { applyTriggerPropsToChildren, useMergedRefs } from '@fluentui/react-utilities';\nimport { useOverflowItem } from '../../useOverflowItem';\n/**\n * Attaches overflow item behavior to its child registered with the OverflowContext.\n * It does not render an element of its own.\n */\nexport const OverflowItem = /*#__PURE__*/React.forwardRef((props, ref) => {\n const {\n id,\n groupId,\n priority,\n children\n } = props;\n const containerRef = useOverflowItem(id, priority, groupId);\n return applyTriggerPropsToChildren(children, {\n ref: useMergedRefs(containerRef, ref)\n });\n});\n//# sourceMappingURL=OverflowItem.js.map"],"names":["OverflowItem","React","forwardRef","props","ref","id","groupId","priority","children","containerRef","useOverflowItem","applyTriggerPropsToChildren","useMergedRefs"],"mappings":";;;;+BAOaA;;aAAAA;;;6DAPU;gCACoC;iCAC3B;AAKzB,MAAMA,eAAe,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACxE,MAAM,EACJC,GAAE,EACFC,QAAO,EACPC,SAAQ,EACRC,SAAQ,EACT,GAAGL;IACJ,MAAMM,eAAeC,IAAAA,gCAAe,EAACL,IAAIE,UAAUD;IACnD,OAAOK,IAAAA,2CAA2B,EAACH,UAAU;QAC3CJ,KAAKQ,IAAAA,6BAAa,EAACH,cAAcL;IACnC;AACF,IACA,wCAAwC"}
1
+ {"version":3,"sources":["OverflowItem.js"],"sourcesContent":["import * as React from 'react';\nimport { applyTriggerPropsToChildren, useMergedRefs } from '@fluentui/react-utilities';\nimport { useOverflowItem } from '../../useOverflowItem';\n/**\n * Attaches overflow item behavior to its child registered with the OverflowContext.\n * It does not render an element of its own.\n */ export const OverflowItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const { id , groupId , priority , children } = props;\n const containerRef = useOverflowItem(id, priority, groupId);\n return applyTriggerPropsToChildren(children, {\n ref: useMergedRefs(containerRef, ref)\n });\n});\n"],"names":["OverflowItem","React","forwardRef","props","ref","id","groupId","priority","children","containerRef","useOverflowItem","applyTriggerPropsToChildren","useMergedRefs"],"mappings":";;;;+BAMiBA;;aAAAA;;;6DANM;gCACoC;iCAC3B;AAIrB,MAAMA,eAAe,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACzE,MAAM,EAAEC,GAAE,EAAGC,QAAO,EAAGC,SAAQ,EAAGC,SAAQ,EAAG,GAAGL;IAChD,MAAMM,eAAeC,IAAAA,gCAAe,EAACL,IAAIE,UAAUD;IACnD,OAAOK,IAAAA,2CAA2B,EAACH,UAAU;QACzCJ,KAAKQ,IAAAA,6BAAa,EAACH,cAAcL;IACrC;AACJ"}
@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
4
4
  });
5
5
  const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
6
6
  const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
7
- //# sourceMappingURL=OverflowItem.types.js.map
8
-
9
- //# sourceMappingURL=OverflowItem.types.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/OverflowItem/OverflowItem.types.js"],"sourcesContent":["import * as React from 'react';\n//# sourceMappingURL=OverflowItem.types.js.map"],"names":[],"mappings":";;;;;6DAAuB;CACvB,8CAA8C"}
1
+ {"version":3,"sources":["OverflowItem.types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;6DAAuB"}
@@ -7,6 +7,3 @@ Object.defineProperty(exports, "OverflowItem", {
7
7
  get: ()=>_overflowItem.OverflowItem
8
8
  });
9
9
  const _overflowItem = require("./OverflowItem");
10
- //# sourceMappingURL=index.js.map
11
-
12
- //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/OverflowItem/index.js"],"sourcesContent":["export { OverflowItem } from './OverflowItem';\n//# sourceMappingURL=index.js.map"],"names":["OverflowItem"],"mappings":";;;;+BAASA;;aAAAA,0BAAY;;8BAAQ;CAC7B,iCAAiC"}
1
+ {"version":3,"sources":["index.js"],"sourcesContent":["export { OverflowItem } from './OverflowItem';\n"],"names":["OverflowItem"],"mappings":";;;;+BAASA;;aAAAA,0BAAY;;8BAAQ"}
@@ -20,5 +20,3 @@ const useOverflowStyles = /*#__PURE__*/ (0, _react["__styles"])({
20
20
  ".f10570jf [data-overflowing]{display:none;}"
21
21
  ]
22
22
  }); //# sourceMappingURL=useOverflowStyles.styles.js.map
23
-
24
- //# sourceMappingURL=useOverflowStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../lib/components/useOverflowStyles.styles.js"],"sourcesContent":["import { __styles } from '@griffel/react';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_MENU } from '../constants';\nexport const useOverflowStyles = /*#__PURE__*/__styles({\n overflowMenu: {\n Brvla84: \"fyfkpbf\"\n },\n overflowingItems: {\n zb22lx: \"f10570jf\"\n }\n}, {\n d: [\".fyfkpbf [data-overflow-menu]{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}\", \".f10570jf [data-overflowing]{display:none;}\"]\n});\n//# sourceMappingURL=useOverflowStyles.styles.js.map"],"names":["useOverflowStyles","__styles","overflowMenu","Brvla84","overflowingItems","zb22lx","d"],"mappings":";;;;+BAEaA;;aAAAA;;uBAFY;AAElB,MAAMA,oBAAoB,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACrDC,cAAc;QACZC,SAAS;IACX;IACAC,kBAAkB;QAChBC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA2F;KAA8C;AAC/I,IACA,oDAAoD"}
1
+ {"version":3,"sources":["useOverflowStyles.styles.js"],"sourcesContent":["import { __styles } from '@griffel/react';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_MENU } from '../constants';\nexport const useOverflowStyles = /*#__PURE__*/__styles({\n overflowMenu: {\n Brvla84: \"fyfkpbf\"\n },\n overflowingItems: {\n zb22lx: \"f10570jf\"\n }\n}, {\n d: [\".fyfkpbf [data-overflow-menu]{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}\", \".f10570jf [data-overflowing]{display:none;}\"]\n});\n//# sourceMappingURL=useOverflowStyles.styles.js.map"],"names":["useOverflowStyles","__styles","overflowMenu","Brvla84","overflowingItems","zb22lx","d"],"mappings":";;;;+BAEaA;;aAAAA;;uBAFY;AAElB,MAAMA,oBAAoB,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACrDC,cAAc;QACZC,SAAS;IACX;IACAC,kBAAkB;QAChBC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAA2F;KAA8C;AAC/I,IACA,oDAAoD"}
@@ -11,10 +11,10 @@ function _export(target, all) {
11
11
  _export(exports, {
12
12
  DATA_OVERFLOWING: ()=>DATA_OVERFLOWING,
13
13
  DATA_OVERFLOW_ITEM: ()=>DATA_OVERFLOW_ITEM,
14
- DATA_OVERFLOW_MENU: ()=>DATA_OVERFLOW_MENU
14
+ DATA_OVERFLOW_MENU: ()=>DATA_OVERFLOW_MENU,
15
+ DATA_OVERFLOW_DIVIDER: ()=>DATA_OVERFLOW_DIVIDER
15
16
  });
16
17
  const DATA_OVERFLOWING = 'data-overflowing';
17
18
  const DATA_OVERFLOW_ITEM = 'data-overflow-item';
18
- const DATA_OVERFLOW_MENU = 'data-overflow-menu'; //# sourceMappingURL=constants.js.map
19
-
20
- //# sourceMappingURL=constants.js.map
19
+ const DATA_OVERFLOW_MENU = 'data-overflow-menu';
20
+ const DATA_OVERFLOW_DIVIDER = 'data-overflow-divider';
@@ -1 +1 @@
1
- {"version":3,"sources":["../lib/constants.js"],"sourcesContent":["export const DATA_OVERFLOWING = 'data-overflowing';\nexport const DATA_OVERFLOW_ITEM = 'data-overflow-item';\nexport const DATA_OVERFLOW_MENU = 'data-overflow-menu';\n//# sourceMappingURL=constants.js.map"],"names":["DATA_OVERFLOWING","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU"],"mappings":";;;;;;;;;;;IAAaA,gBAAgB,MAAhBA;IACAC,kBAAkB,MAAlBA;IACAC,kBAAkB,MAAlBA;;AAFN,MAAMF,mBAAmB;AACzB,MAAMC,qBAAqB;AAC3B,MAAMC,qBAAqB,sBAClC,qCAAqC"}
1
+ {"version":3,"sources":["constants.js"],"sourcesContent":["export const DATA_OVERFLOWING = 'data-overflowing';\nexport const DATA_OVERFLOW_ITEM = 'data-overflow-item';\nexport const DATA_OVERFLOW_MENU = 'data-overflow-menu';\nexport const DATA_OVERFLOW_DIVIDER = 'data-overflow-divider';\n"],"names":["DATA_OVERFLOWING","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU","DATA_OVERFLOW_DIVIDER"],"mappings":";;;;;;;;;;;IAAaA,gBAAgB,MAAhBA;IACAC,kBAAkB,MAAlBA;IACAC,kBAAkB,MAAlBA;IACAC,qBAAqB,MAArBA;;AAHN,MAAMH,mBAAmB;AACzB,MAAMC,qBAAqB;AAC3B,MAAMC,qBAAqB;AAC3B,MAAMC,wBAAwB"}