@fluentui/react-overflow 9.0.18 → 9.0.20

Sign up to get free protection for your applications and to get access to all the features.
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"}