@fluentui/react-overflow 9.0.30 → 9.0.32
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +67 -1
- package/CHANGELOG.md +26 -2
- package/lib/components/Overflow.js +3 -3
- package/lib/components/Overflow.js.map +1 -1
- package/lib/components/OverflowDivider/OverflowDivider.js +1 -1
- package/lib/components/OverflowDivider/OverflowDivider.js.map +1 -1
- package/lib/components/OverflowItem/OverflowItem.js +1 -1
- package/lib/components/OverflowItem/OverflowItem.js.map +1 -1
- package/lib/overflowContext.js.map +1 -1
- package/lib/useIsOverflowGroupVisible.js.map +1 -1
- package/lib/useIsOverflowItemVisible.js.map +1 -1
- package/lib/useOverflowContainer.js +16 -9
- package/lib/useOverflowContainer.js.map +1 -1
- package/lib/useOverflowCount.js.map +1 -1
- package/lib/useOverflowDivider.js.map +1 -1
- package/lib/useOverflowItem.js.map +1 -1
- package/lib/useOverflowMenu.js.map +1 -1
- package/lib-commonjs/components/Overflow.js +13 -11
- package/lib-commonjs/components/Overflow.js.map +1 -1
- package/lib-commonjs/components/OverflowDivider/OverflowDivider.js +9 -7
- package/lib-commonjs/components/OverflowDivider/OverflowDivider.js.map +1 -1
- package/lib-commonjs/components/OverflowDivider/OverflowDivider.types.js +2 -2
- package/lib-commonjs/components/OverflowDivider/OverflowDivider.types.js.map +1 -1
- package/lib-commonjs/components/OverflowItem/OverflowItem.js +9 -7
- package/lib-commonjs/components/OverflowItem/OverflowItem.js.map +1 -1
- package/lib-commonjs/components/OverflowItem/OverflowItem.types.js +2 -2
- package/lib-commonjs/components/OverflowItem/OverflowItem.types.js.map +1 -1
- package/lib-commonjs/components/OverflowItem/index.js +4 -2
- package/lib-commonjs/components/OverflowItem/index.js.map +1 -1
- package/lib-commonjs/components/useOverflowStyles.styles.js +4 -2
- package/lib-commonjs/components/useOverflowStyles.styles.js.map +1 -1
- package/lib-commonjs/constants.js +12 -4
- package/lib-commonjs/constants.js.map +1 -1
- package/lib-commonjs/index.js +48 -18
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/overflowContext.js +9 -5
- package/lib-commonjs/overflowContext.js.map +1 -1
- package/lib-commonjs/types.js +2 -2
- package/lib-commonjs/types.js.map +1 -1
- package/lib-commonjs/useIsOverflowGroupVisible.js +3 -1
- package/lib-commonjs/useIsOverflowGroupVisible.js.map +1 -1
- package/lib-commonjs/useIsOverflowItemVisible.js +3 -1
- package/lib-commonjs/useIsOverflowItemVisible.js.map +1 -1
- package/lib-commonjs/useOverflowContainer.js +29 -18
- package/lib-commonjs/useOverflowContainer.js.map +1 -1
- package/lib-commonjs/useOverflowCount.js +3 -1
- package/lib-commonjs/useOverflowCount.js.map +1 -1
- package/lib-commonjs/useOverflowDivider.js +7 -5
- package/lib-commonjs/useOverflowDivider.js.map +1 -1
- package/lib-commonjs/useOverflowItem.js +7 -5
- package/lib-commonjs/useOverflowItem.js.map +1 -1
- package/lib-commonjs/useOverflowMenu.js +9 -7
- package/lib-commonjs/useOverflowMenu.js.map +1 -1
- package/package.json +10 -10
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export { OverflowItem } from './OverflowItem';\n"],"names":["OverflowItem"],"mappings":";;;;+BAASA
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export { OverflowItem } from './OverflowItem';\n"],"names":["OverflowItem"],"mappings":";;;;+BAASA;;;eAAAA,0BAAY;;;8BAAQ"}
|
@@ -4,10 +4,12 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useOverflowStyles", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useOverflowStyles;
|
9
|
+
}
|
8
10
|
});
|
9
11
|
const _react = require("@griffel/react");
|
10
|
-
const useOverflowStyles = /*#__PURE__*/ (0, _react
|
12
|
+
const useOverflowStyles = /*#__PURE__*/ (0, _react.__styles)({
|
11
13
|
overflowMenu: {
|
12
14
|
Brvla84: "fyfkpbf"
|
13
15
|
},
|
@@ -1 +1 @@
|
|
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]{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
|
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]{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;;;eAAAA;;;uBAFY;AAElB,MAAMA,oBAAoB,WAAW,GAAEC,IAAAA,eAAQ,EAAC;IACrDC,cAAc;QACZC,SAAS;IACX;IACAC,kBAAkB;QAChBC,QAAQ;IACV;AACF,GAAG;IACDC,GAAG;QAAC;QAAiD;KAA8C;AACrG,IACA,oDAAoD"}
|
@@ -9,10 +9,18 @@ function _export(target, all) {
|
|
9
9
|
});
|
10
10
|
}
|
11
11
|
_export(exports, {
|
12
|
-
DATA_OVERFLOWING: ()
|
13
|
-
|
14
|
-
|
15
|
-
|
12
|
+
DATA_OVERFLOWING: function() {
|
13
|
+
return DATA_OVERFLOWING;
|
14
|
+
},
|
15
|
+
DATA_OVERFLOW_ITEM: function() {
|
16
|
+
return DATA_OVERFLOW_ITEM;
|
17
|
+
},
|
18
|
+
DATA_OVERFLOW_MENU: function() {
|
19
|
+
return DATA_OVERFLOW_MENU;
|
20
|
+
},
|
21
|
+
DATA_OVERFLOW_DIVIDER: function() {
|
22
|
+
return DATA_OVERFLOW_DIVIDER;
|
23
|
+
}
|
16
24
|
});
|
17
25
|
const DATA_OVERFLOWING = 'data-overflowing';
|
18
26
|
const DATA_OVERFLOW_ITEM = 'data-overflow-item';
|
@@ -1 +1 @@
|
|
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
|
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;eAAhBA;;IACAC,kBAAkB;eAAlBA;;IACAC,kBAAkB;eAAlBA;;IACAC,qBAAqB;eAArBA;;;AAHN,MAAMH,mBAAmB;AACzB,MAAMC,qBAAqB;AAC3B,MAAMC,qBAAqB;AAC3B,MAAMC,wBAAwB"}
|
package/lib-commonjs/index.js
CHANGED
@@ -9,23 +9,53 @@ function _export(target, all) {
|
|
9
9
|
});
|
10
10
|
}
|
11
11
|
_export(exports, {
|
12
|
-
Overflow: ()
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
12
|
+
Overflow: function() {
|
13
|
+
return _Overflow.Overflow;
|
14
|
+
},
|
15
|
+
DATA_OVERFLOWING: function() {
|
16
|
+
return _constants.DATA_OVERFLOWING;
|
17
|
+
},
|
18
|
+
DATA_OVERFLOW_ITEM: function() {
|
19
|
+
return _constants.DATA_OVERFLOW_ITEM;
|
20
|
+
},
|
21
|
+
DATA_OVERFLOW_MENU: function() {
|
22
|
+
return _constants.DATA_OVERFLOW_MENU;
|
23
|
+
},
|
24
|
+
DATA_OVERFLOW_DIVIDER: function() {
|
25
|
+
return _constants.DATA_OVERFLOW_DIVIDER;
|
26
|
+
},
|
27
|
+
useIsOverflowGroupVisible: function() {
|
28
|
+
return _useIsOverflowGroupVisible.useIsOverflowGroupVisible;
|
29
|
+
},
|
30
|
+
useIsOverflowItemVisible: function() {
|
31
|
+
return _useIsOverflowItemVisible.useIsOverflowItemVisible;
|
32
|
+
},
|
33
|
+
useOverflowContainer: function() {
|
34
|
+
return _useOverflowContainer.useOverflowContainer;
|
35
|
+
},
|
36
|
+
useOverflowCount: function() {
|
37
|
+
return _useOverflowCount.useOverflowCount;
|
38
|
+
},
|
39
|
+
useOverflowItem: function() {
|
40
|
+
return _useOverflowItem.useOverflowItem;
|
41
|
+
},
|
42
|
+
useOverflowMenu: function() {
|
43
|
+
return _useOverflowMenu.useOverflowMenu;
|
44
|
+
},
|
45
|
+
useOverflowDivider: function() {
|
46
|
+
return _useOverflowDivider.useOverflowDivider;
|
47
|
+
},
|
48
|
+
useOverflowContext: function() {
|
49
|
+
return _overflowContext.useOverflowContext;
|
50
|
+
},
|
51
|
+
OverflowItem: function() {
|
52
|
+
return _OverflowItem.OverflowItem;
|
53
|
+
},
|
54
|
+
OverflowDivider: function() {
|
55
|
+
return _OverflowDivider.OverflowDivider;
|
56
|
+
}
|
27
57
|
});
|
28
|
-
const
|
58
|
+
const _Overflow = require("./components/Overflow");
|
29
59
|
const _constants = require("./constants");
|
30
60
|
const _useIsOverflowGroupVisible = require("./useIsOverflowGroupVisible");
|
31
61
|
const _useIsOverflowItemVisible = require("./useIsOverflowItemVisible");
|
@@ -35,5 +65,5 @@ const _useOverflowItem = require("./useOverflowItem");
|
|
35
65
|
const _useOverflowMenu = require("./useOverflowMenu");
|
36
66
|
const _useOverflowDivider = require("./useOverflowDivider");
|
37
67
|
const _overflowContext = require("./overflowContext");
|
38
|
-
const
|
39
|
-
const
|
68
|
+
const _OverflowItem = require("./components/OverflowItem/OverflowItem");
|
69
|
+
const _OverflowDivider = require("./components/OverflowDivider/OverflowDivider");
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export { Overflow } from './components/Overflow';\nexport { DATA_OVERFLOWING, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU, DATA_OVERFLOW_DIVIDER } from './constants';\nexport { useIsOverflowGroupVisible } from './useIsOverflowGroupVisible';\nexport { useIsOverflowItemVisible } from './useIsOverflowItemVisible';\nexport { useOverflowContainer } from './useOverflowContainer';\nexport { useOverflowCount } from './useOverflowCount';\nexport { useOverflowItem } from './useOverflowItem';\nexport { useOverflowMenu } from './useOverflowMenu';\nexport { useOverflowDivider } from './useOverflowDivider';\nexport { useOverflowContext } from './overflowContext';\nexport { OverflowItem } from './components/OverflowItem/OverflowItem';\nexport { OverflowDivider } from './components/OverflowDivider/OverflowDivider';\n"],"names":["Overflow","DATA_OVERFLOWING","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU","DATA_OVERFLOW_DIVIDER","useIsOverflowGroupVisible","useIsOverflowItemVisible","useOverflowContainer","useOverflowCount","useOverflowItem","useOverflowMenu","useOverflowDivider","useOverflowContext","OverflowItem","OverflowDivider"],"mappings":";;;;;;;;;;;IAASA,QAAQ,
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export { Overflow } from './components/Overflow';\nexport { DATA_OVERFLOWING, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU, DATA_OVERFLOW_DIVIDER } from './constants';\nexport { useIsOverflowGroupVisible } from './useIsOverflowGroupVisible';\nexport { useIsOverflowItemVisible } from './useIsOverflowItemVisible';\nexport { useOverflowContainer } from './useOverflowContainer';\nexport { useOverflowCount } from './useOverflowCount';\nexport { useOverflowItem } from './useOverflowItem';\nexport { useOverflowMenu } from './useOverflowMenu';\nexport { useOverflowDivider } from './useOverflowDivider';\nexport { useOverflowContext } from './overflowContext';\nexport { OverflowItem } from './components/OverflowItem/OverflowItem';\nexport { OverflowDivider } from './components/OverflowDivider/OverflowDivider';\n"],"names":["Overflow","DATA_OVERFLOWING","DATA_OVERFLOW_ITEM","DATA_OVERFLOW_MENU","DATA_OVERFLOW_DIVIDER","useIsOverflowGroupVisible","useIsOverflowItemVisible","useOverflowContainer","useOverflowCount","useOverflowItem","useOverflowMenu","useOverflowDivider","useOverflowContext","OverflowItem","OverflowDivider"],"mappings":";;;;;;;;;;;IAASA,QAAQ;eAARA,kBAAQ;;IACRC,gBAAgB;eAAhBA,2BAAgB;;IAAEC,kBAAkB;eAAlBA,6BAAkB;;IAAEC,kBAAkB;eAAlBA,6BAAkB;;IAAEC,qBAAqB;eAArBA,gCAAqB;;IAC/EC,yBAAyB;eAAzBA,oDAAyB;;IACzBC,wBAAwB;eAAxBA,kDAAwB;;IACxBC,oBAAoB;eAApBA,0CAAoB;;IACpBC,gBAAgB;eAAhBA,kCAAgB;;IAChBC,eAAe;eAAfA,gCAAe;;IACfC,eAAe;eAAfA,gCAAe;;IACfC,kBAAkB;eAAlBA,sCAAkB;;IAClBC,kBAAkB;eAAlBA,mCAAkB;;IAClBC,YAAY;eAAZA,0BAAY;;IACZC,eAAe;eAAfA,gCAAe;;;0BAXC;2BACuE;2CACtD;0CACD;sCACJ;kCACJ;iCACD;iCACA;oCACG;iCACA;8BACN;iCACG"}
|
@@ -9,11 +9,15 @@ function _export(target, all) {
|
|
9
9
|
});
|
10
10
|
}
|
11
11
|
_export(exports, {
|
12
|
-
OverflowContext: ()
|
13
|
-
|
12
|
+
OverflowContext: function() {
|
13
|
+
return OverflowContext;
|
14
|
+
},
|
15
|
+
useOverflowContext: function() {
|
16
|
+
return useOverflowContext;
|
17
|
+
}
|
14
18
|
});
|
15
|
-
const
|
16
|
-
const OverflowContext = (0,
|
19
|
+
const _reactcontextselector = require("@fluentui/react-context-selector");
|
20
|
+
const OverflowContext = (0, _reactcontextselector.createContext)(undefined);
|
17
21
|
const overflowContextDefaultValue = {
|
18
22
|
itemVisibility: {},
|
19
23
|
groupVisibility: {},
|
@@ -23,4 +27,4 @@ const overflowContextDefaultValue = {
|
|
23
27
|
registerOverflowMenu: ()=>()=>null,
|
24
28
|
registerDivider: ()=>()=>null
|
25
29
|
};
|
26
|
-
const useOverflowContext = (selector)=>(0,
|
30
|
+
const useOverflowContext = (selector)=>(0, _reactcontextselector.useContextSelector)(OverflowContext, (ctx = overflowContextDefaultValue)=>selector(ctx));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["overflowContext.js"],"sourcesContent":["import { createContext, useContextSelector } from '@fluentui/react-context-selector';\nexport const OverflowContext = createContext(undefined);\nconst overflowContextDefaultValue = {\n itemVisibility: {},\n groupVisibility: {},\n hasOverflow: false,\n registerItem: ()=>()=>null,\n updateOverflow: ()=>null,\n registerOverflowMenu: ()=>()=>null,\n registerDivider: ()=>()=>null\n};\n/**\n * @internal\n */ export const useOverflowContext = (selector)=>useContextSelector(OverflowContext, (ctx = overflowContextDefaultValue)=>selector(ctx));\n"],"names":["OverflowContext","useOverflowContext","createContext","undefined","overflowContextDefaultValue","itemVisibility","groupVisibility","hasOverflow","registerItem","updateOverflow","registerOverflowMenu","registerDivider","selector","useContextSelector","ctx"],"mappings":";;;;;;;;;;;IACaA,eAAe
|
1
|
+
{"version":3,"sources":["overflowContext.js"],"sourcesContent":["import { createContext, useContextSelector } from '@fluentui/react-context-selector';\nexport const OverflowContext = createContext(undefined);\nconst overflowContextDefaultValue = {\n itemVisibility: {},\n groupVisibility: {},\n hasOverflow: false,\n registerItem: ()=>()=>null,\n updateOverflow: ()=>null,\n registerOverflowMenu: ()=>()=>null,\n registerDivider: ()=>()=>null\n};\n/**\n * @internal\n */ export const useOverflowContext = (selector)=>useContextSelector(OverflowContext, (ctx = overflowContextDefaultValue)=>selector(ctx));\n"],"names":["OverflowContext","useOverflowContext","createContext","undefined","overflowContextDefaultValue","itemVisibility","groupVisibility","hasOverflow","registerItem","updateOverflow","registerOverflowMenu","registerDivider","selector","useContextSelector","ctx"],"mappings":";;;;;;;;;;;IACaA,eAAe;eAAfA;;IAYIC,kBAAkB;eAAlBA;;;sCAbiC;AAC3C,MAAMD,kBAAkBE,IAAAA,mCAAa,EAACC;AAC7C,MAAMC,8BAA8B;IAChCC,gBAAgB,CAAC;IACjBC,iBAAiB,CAAC;IAClBC,aAAa;IACbC,cAAc,IAAI,IAAI;IACtBC,gBAAgB,IAAI;IACpBC,sBAAsB,IAAI,IAAI;IAC9BC,iBAAiB,IAAI,IAAI;AAC7B;AAGW,MAAMV,qBAAqB,CAACW,WAAWC,IAAAA,wCAAkB,EAACb,iBAAiB,CAACc,MAAMV,2BAA2B,GAAGQ,SAASE"}
|
package/lib-commonjs/types.js
CHANGED
@@ -2,5 +2,5 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
const
|
6
|
-
const _react = /*#__PURE__*/
|
5
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
6
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;
|
1
|
+
{"version":3,"sources":["types.js"],"sourcesContent":["import * as React from 'react';\n"],"names":[],"mappings":";;;;;iEAAuB"}
|
@@ -4,7 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useIsOverflowGroupVisible", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useIsOverflowGroupVisible;
|
9
|
+
}
|
8
10
|
});
|
9
11
|
const _overflowContext = require("./overflowContext");
|
10
12
|
function useIsOverflowGroupVisible(id) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useIsOverflowGroupVisible.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @param id - unique identifier for a group of overflow items\n * @returns visibility state of the group\n */ export function useIsOverflowGroupVisible(id) {\n return useOverflowContext((ctx)=>ctx.groupVisibility[id]);\n}\n"],"names":["useIsOverflowGroupVisible","id","useOverflowContext","ctx","groupVisibility"],"mappings":";;;;+BAIoBA
|
1
|
+
{"version":3,"sources":["useIsOverflowGroupVisible.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @param id - unique identifier for a group of overflow items\n * @returns visibility state of the group\n */ export function useIsOverflowGroupVisible(id) {\n return useOverflowContext((ctx)=>ctx.groupVisibility[id]);\n}\n"],"names":["useIsOverflowGroupVisible","id","useOverflowContext","ctx","groupVisibility"],"mappings":";;;;+BAIoBA;;;eAAAA;;;iCAJe;AAIxB,SAASA,0BAA0BC,EAAE;IAC5C,OAAOC,IAAAA,mCAAkB,EAAC,CAACC,MAAMA,IAAIC,eAAe,CAACH,GAAG;AAC5D"}
|
@@ -4,7 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useIsOverflowItemVisible", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useIsOverflowItemVisible;
|
9
|
+
}
|
8
10
|
});
|
9
11
|
const _overflowContext = require("./overflowContext");
|
10
12
|
function useIsOverflowItemVisible(id) {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useIsOverflowItemVisible.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @param id - unique identifier for the item used by the overflow manager\n * @returns visibility state of an overflow item\n */ export function useIsOverflowItemVisible(id) {\n return !!useOverflowContext((ctx)=>ctx.itemVisibility[id]);\n}\n"],"names":["useIsOverflowItemVisible","id","useOverflowContext","ctx","itemVisibility"],"mappings":";;;;+BAIoBA
|
1
|
+
{"version":3,"sources":["useIsOverflowItemVisible.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @param id - unique identifier for the item used by the overflow manager\n * @returns visibility state of an overflow item\n */ export function useIsOverflowItemVisible(id) {\n return !!useOverflowContext((ctx)=>ctx.itemVisibility[id]);\n}\n"],"names":["useIsOverflowItemVisible","id","useOverflowContext","ctx","itemVisibility"],"mappings":";;;;+BAIoBA;;;eAAAA;;;iCAJe;AAIxB,SAASA,yBAAyBC,EAAE;IAC3C,OAAO,CAAC,CAACC,IAAAA,mCAAkB,EAAC,CAACC,MAAMA,IAAIC,cAAc,CAACH,GAAG;AAC7D"}
|
@@ -9,21 +9,25 @@ function _export(target, all) {
|
|
9
9
|
});
|
10
10
|
}
|
11
11
|
_export(exports, {
|
12
|
-
useOverflowContainer: ()
|
13
|
-
|
12
|
+
useOverflowContainer: function() {
|
13
|
+
return useOverflowContainer;
|
14
|
+
},
|
15
|
+
updateVisibilityAttribute: function() {
|
16
|
+
return updateVisibilityAttribute;
|
17
|
+
}
|
14
18
|
});
|
15
|
-
const
|
16
|
-
const _react = /*#__PURE__*/
|
17
|
-
const
|
18
|
-
const
|
19
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
20
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
21
|
+
const _priorityoverflow = require("@fluentui/priority-overflow");
|
22
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
19
23
|
const _constants = require("./constants");
|
20
24
|
const useOverflowContainer = (update, options)=>{
|
21
|
-
const { overflowAxis
|
25
|
+
const { overflowAxis, overflowDirection, padding, minimumVisible, onUpdateItemVisibility } = options;
|
22
26
|
// DOM ref to the overflow container element
|
23
27
|
const containerRef = _react.useRef(null);
|
24
|
-
const updateOverflowItems = (0,
|
25
|
-
const [overflowManager] = _react.useState(()=>(0,
|
26
|
-
(0,
|
28
|
+
const updateOverflowItems = (0, _reactutilities.useEventCallback)(update);
|
29
|
+
const [overflowManager] = _react.useState(()=>(0, _reactutilities.canUseDOM)() ? (0, _priorityoverflow.createOverflowManager)() : null);
|
30
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
27
31
|
if (!containerRef.current) {
|
28
32
|
return;
|
29
33
|
}
|
@@ -50,37 +54,44 @@ const useOverflowContainer = (update, options)=>{
|
|
50
54
|
onUpdateItemVisibility
|
51
55
|
]);
|
52
56
|
const registerItem = _react.useCallback((item)=>{
|
53
|
-
|
57
|
+
var _overflowManager;
|
58
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addItem(item);
|
54
59
|
item.element.setAttribute(_constants.DATA_OVERFLOW_ITEM, '');
|
55
60
|
return ()=>{
|
61
|
+
var _overflowManager;
|
56
62
|
item.element.removeAttribute(_constants.DATA_OVERFLOWING);
|
57
63
|
item.element.removeAttribute(_constants.DATA_OVERFLOW_ITEM);
|
58
|
-
overflowManager === null ||
|
64
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeItem(item.id);
|
59
65
|
};
|
60
66
|
}, [
|
61
67
|
overflowManager
|
62
68
|
]);
|
63
69
|
const registerDivider = _react.useCallback((divider)=>{
|
70
|
+
var _overflowManager;
|
64
71
|
const el = divider.element;
|
65
|
-
overflowManager === null ||
|
72
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addDivider(divider);
|
66
73
|
el && el.setAttribute(_constants.DATA_OVERFLOW_DIVIDER, '');
|
67
74
|
return ()=>{
|
68
|
-
|
75
|
+
var _overflowManager;
|
76
|
+
divider.groupId && ((_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeDivider(divider.groupId));
|
69
77
|
el.removeAttribute(_constants.DATA_OVERFLOW_DIVIDER);
|
70
78
|
};
|
71
79
|
}, [
|
72
80
|
overflowManager
|
73
81
|
]);
|
74
82
|
const updateOverflow = _react.useCallback(()=>{
|
75
|
-
|
83
|
+
var _overflowManager;
|
84
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.update();
|
76
85
|
}, [
|
77
86
|
overflowManager
|
78
87
|
]);
|
79
88
|
const registerOverflowMenu = _react.useCallback((el)=>{
|
80
|
-
|
89
|
+
var _overflowManager;
|
90
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addOverflowMenu(el);
|
81
91
|
el.setAttribute(_constants.DATA_OVERFLOW_MENU, '');
|
82
92
|
return ()=>{
|
83
|
-
|
93
|
+
var _overflowManager;
|
94
|
+
(_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeOverflowMenu();
|
84
95
|
el.removeAttribute(_constants.DATA_OVERFLOW_MENU);
|
85
96
|
};
|
86
97
|
}, [
|
@@ -94,7 +105,7 @@ const useOverflowContainer = (update, options)=>{
|
|
94
105
|
registerDivider
|
95
106
|
};
|
96
107
|
};
|
97
|
-
const updateVisibilityAttribute = ({ item
|
108
|
+
const updateVisibilityAttribute = ({ item, visible })=>{
|
98
109
|
if (visible) {
|
99
110
|
item.element.removeAttribute(_constants.DATA_OVERFLOWING);
|
100
111
|
} else {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useOverflowContainer.js"],"sourcesContent":["import * as React from 'react';\nimport { createOverflowManager } from '@fluentui/priority-overflow';\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_DIVIDER, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';\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 */ export const useOverflowContainer = (update, options)=>{\n const { overflowAxis
|
1
|
+
{"version":3,"sources":["useOverflowContainer.js"],"sourcesContent":["import * as React from 'react';\nimport { createOverflowManager } from '@fluentui/priority-overflow';\nimport { canUseDOM, useEventCallback, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { DATA_OVERFLOWING, DATA_OVERFLOW_DIVIDER, DATA_OVERFLOW_ITEM, DATA_OVERFLOW_MENU } from './constants';\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 */ export const useOverflowContainer = (update, options)=>{\n const { overflowAxis, overflowDirection, padding, minimumVisible, onUpdateItemVisibility } = options;\n // DOM ref to the overflow container element\n const containerRef = React.useRef(null);\n const updateOverflowItems = useEventCallback(update);\n const [overflowManager] = React.useState(()=>canUseDOM() ? createOverflowManager() : null);\n useIsomorphicLayoutEffect(()=>{\n if (!containerRef.current) {\n return;\n }\n if (overflowManager) {\n overflowManager.observe(containerRef.current, {\n overflowDirection: overflowDirection !== null && overflowDirection !== void 0 ? overflowDirection : 'end',\n overflowAxis: overflowAxis !== null && overflowAxis !== void 0 ? overflowAxis : 'horizontal',\n padding: padding !== null && padding !== void 0 ? padding : 10,\n minimumVisible: minimumVisible !== null && minimumVisible !== void 0 ? minimumVisible : 0,\n onUpdateItemVisibility: onUpdateItemVisibility !== null && onUpdateItemVisibility !== void 0 ? onUpdateItemVisibility : ()=>undefined,\n onUpdateOverflow: updateOverflowItems !== null && updateOverflowItems !== void 0 ? updateOverflowItems : ()=>undefined\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 const registerItem = React.useCallback((item)=>{\n var _overflowManager;\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addItem(item);\n item.element.setAttribute(DATA_OVERFLOW_ITEM, '');\n return ()=>{\n var _overflowManager;\n item.element.removeAttribute(DATA_OVERFLOWING);\n item.element.removeAttribute(DATA_OVERFLOW_ITEM);\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeItem(item.id);\n };\n }, [\n overflowManager\n ]);\n const registerDivider = React.useCallback((divider)=>{\n var _overflowManager;\n const el = divider.element;\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addDivider(divider);\n el && el.setAttribute(DATA_OVERFLOW_DIVIDER, '');\n return ()=>{\n var _overflowManager;\n divider.groupId && ((_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeDivider(divider.groupId));\n el.removeAttribute(DATA_OVERFLOW_DIVIDER);\n };\n }, [\n overflowManager\n ]);\n const updateOverflow = React.useCallback(()=>{\n var _overflowManager;\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.update();\n }, [\n overflowManager\n ]);\n const registerOverflowMenu = React.useCallback((el)=>{\n var _overflowManager;\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.addOverflowMenu(el);\n el.setAttribute(DATA_OVERFLOW_MENU, '');\n return ()=>{\n var _overflowManager;\n (_overflowManager = overflowManager) === null || _overflowManager === void 0 ? void 0 : _overflowManager.removeOverflowMenu();\n el.removeAttribute(DATA_OVERFLOW_MENU);\n };\n }, [\n overflowManager\n ]);\n return {\n containerRef,\n registerItem,\n updateOverflow,\n registerOverflowMenu,\n registerDivider\n };\n};\nexport const updateVisibilityAttribute = ({ item, visible })=>{\n if (visible) {\n item.element.removeAttribute(DATA_OVERFLOWING);\n } else {\n item.element.setAttribute(DATA_OVERFLOWING, '');\n }\n};\n"],"names":["useOverflowContainer","updateVisibilityAttribute","update","options","overflowAxis","overflowDirection","padding","minimumVisible","onUpdateItemVisibility","containerRef","React","useRef","updateOverflowItems","useEventCallback","overflowManager","useState","canUseDOM","createOverflowManager","useIsomorphicLayoutEffect","current","observe","undefined","onUpdateOverflow","disconnect","registerItem","useCallback","item","_overflowManager","addItem","element","setAttribute","DATA_OVERFLOW_ITEM","removeAttribute","DATA_OVERFLOWING","removeItem","id","registerDivider","divider","el","addDivider","DATA_OVERFLOW_DIVIDER","groupId","removeDivider","updateOverflow","registerOverflowMenu","addOverflowMenu","DATA_OVERFLOW_MENU","removeOverflowMenu","visible"],"mappings":";;;;;;;;;;;IASiBA,oBAAoB;eAApBA;;IAoFJC,yBAAyB;eAAzBA;;;;iEA7FU;kCACe;gCACiC;2BACyB;AAMrF,MAAMD,uBAAuB,CAACE,QAAQC;IAC7C,MAAM,EAAEC,YAAY,EAAEC,iBAAiB,EAAEC,OAAO,EAAEC,cAAc,EAAEC,sBAAsB,EAAE,GAAGL;IAC7F,4CAA4C;IAC5C,MAAMM,eAAeC,OAAMC,MAAM,CAAC;IAClC,MAAMC,sBAAsBC,IAAAA,gCAAgB,EAACX;IAC7C,MAAM,CAACY,gBAAgB,GAAGJ,OAAMK,QAAQ,CAAC,IAAIC,IAAAA,yBAAS,MAAKC,IAAAA,uCAAqB,MAAK;IACrFC,IAAAA,yCAAyB,EAAC;QACtB,IAAI,CAACT,aAAaU,OAAO,EAAE;YACvB;QACJ;QACA,IAAIL,iBAAiB;YACjBA,gBAAgBM,OAAO,CAACX,aAAaU,OAAO,EAAE;gBAC1Cd,mBAAmBA,sBAAsB,QAAQA,sBAAsB,KAAK,IAAIA,oBAAoB;gBACpGD,cAAcA,iBAAiB,QAAQA,iBAAiB,KAAK,IAAIA,eAAe;gBAChFE,SAASA,YAAY,QAAQA,YAAY,KAAK,IAAIA,UAAU;gBAC5DC,gBAAgBA,mBAAmB,QAAQA,mBAAmB,KAAK,IAAIA,iBAAiB;gBACxFC,wBAAwBA,2BAA2B,QAAQA,2BAA2B,KAAK,IAAIA,yBAAyB,IAAIa;gBAC5HC,kBAAkBV,wBAAwB,QAAQA,wBAAwB,KAAK,IAAIA,sBAAsB,IAAIS;YACjH;YACA,OAAO;gBACHP,gBAAgBS,UAAU;YAC9B;QACJ;IACJ,GAAG;QACCX;QACAE;QACAT;QACAD;QACAE;QACAC;QACAC;KACH;IACD,MAAMgB,eAAed,OAAMe,WAAW,CAAC,CAACC;QACpC,IAAIC;QACHA,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBC,OAAO,CAACF;QACjHA,KAAKG,OAAO,CAACC,YAAY,CAACC,6BAAkB,EAAE;QAC9C,OAAO;YACH,IAAIJ;YACJD,KAAKG,OAAO,CAACG,eAAe,CAACC,2BAAgB;YAC7CP,KAAKG,OAAO,CAACG,eAAe,CAACD,6BAAkB;YAC9CJ,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBO,UAAU,CAACR,KAAKS,EAAE;QAC/H;IACJ,GAAG;QACCrB;KACH;IACD,MAAMsB,kBAAkB1B,OAAMe,WAAW,CAAC,CAACY;QACvC,IAAIV;QACJ,MAAMW,KAAKD,QAAQR,OAAO;QACzBF,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBY,UAAU,CAACF;QACpHC,MAAMA,GAAGR,YAAY,CAACU,gCAAqB,EAAE;QAC7C,OAAO;YACH,IAAIb;YACJU,QAAQI,OAAO,IAAK,CAAA,AAACd,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBe,aAAa,CAACL,QAAQI,OAAO,CAAA;YAC1JH,GAAGN,eAAe,CAACQ,gCAAqB;QAC5C;IACJ,GAAG;QACC1B;KACH;IACD,MAAM6B,iBAAiBjC,OAAMe,WAAW,CAAC;QACrC,IAAIE;QACHA,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBzB,MAAM;IACnH,GAAG;QACCY;KACH;IACD,MAAM8B,uBAAuBlC,OAAMe,WAAW,CAAC,CAACa;QAC5C,IAAIX;QACHA,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBkB,eAAe,CAACP;QACzHA,GAAGR,YAAY,CAACgB,6BAAkB,EAAE;QACpC,OAAO;YACH,IAAInB;YACHA,CAAAA,mBAAmBb,eAAc,MAAO,QAAQa,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBoB,kBAAkB;YAC3HT,GAAGN,eAAe,CAACc,6BAAkB;QACzC;IACJ,GAAG;QACChC;KACH;IACD,OAAO;QACHL;QACAe;QACAmB;QACAC;QACAR;IACJ;AACJ;AACO,MAAMnC,4BAA4B,CAAC,EAAEyB,IAAI,EAAEsB,OAAO,EAAE;IACvD,IAAIA,SAAS;QACTtB,KAAKG,OAAO,CAACG,eAAe,CAACC,2BAAgB;IACjD,OAAO;QACHP,KAAKG,OAAO,CAACC,YAAY,CAACG,2BAAgB,EAAE;IAChD;AACJ"}
|
@@ -4,7 +4,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useOverflowCount", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useOverflowCount;
|
9
|
+
}
|
8
10
|
});
|
9
11
|
const _overflowContext = require("./overflowContext");
|
10
12
|
const useOverflowCount = ()=>(0, _overflowContext.useOverflowContext)((v)=>{
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useOverflowCount.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @returns Number of items that are overflowing\n */ export const useOverflowCount = ()=>useOverflowContext((v)=>{\n return Object.entries(v.itemVisibility).reduce((acc, [id, visible])=>{\n if (!visible) {\n acc++;\n }\n return acc;\n }, 0);\n });\n"],"names":["useOverflowCount","useOverflowContext","v","Object","entries","itemVisibility","reduce","acc","id","visible"],"mappings":";;;;+BAGiBA
|
1
|
+
{"version":3,"sources":["useOverflowCount.js"],"sourcesContent":["import { useOverflowContext } from './overflowContext';\n/**\n * @returns Number of items that are overflowing\n */ export const useOverflowCount = ()=>useOverflowContext((v)=>{\n return Object.entries(v.itemVisibility).reduce((acc, [id, visible])=>{\n if (!visible) {\n acc++;\n }\n return acc;\n }, 0);\n });\n"],"names":["useOverflowCount","useOverflowContext","v","Object","entries","itemVisibility","reduce","acc","id","visible"],"mappings":";;;;+BAGiBA;;;eAAAA;;;iCAHkB;AAGxB,MAAMA,mBAAmB,IAAIC,IAAAA,mCAAkB,EAAC,CAACC;QACpD,OAAOC,OAAOC,OAAO,CAACF,EAAEG,cAAc,EAAEC,MAAM,CAAC,CAACC,KAAK,CAACC,IAAIC,QAAQ;YAC9D,IAAI,CAACA,SAAS;gBACVF;YACJ;YACA,OAAOA;QACX,GAAG;IACP"}
|
@@ -4,16 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useOverflowDivider", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useOverflowDivider;
|
9
|
+
}
|
8
10
|
});
|
9
|
-
const
|
10
|
-
const _react = /*#__PURE__*/
|
11
|
-
const
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
13
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
12
14
|
const _overflowContext = require("./overflowContext");
|
13
15
|
function useOverflowDivider(groupId) {
|
14
16
|
const ref = _react.useRef(null);
|
15
17
|
const registerDivider = (0, _overflowContext.useOverflowContext)((v)=>v.registerDivider);
|
16
|
-
(0,
|
18
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
17
19
|
if (ref.current && groupId) {
|
18
20
|
return registerDivider({
|
19
21
|
element: ref.current,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useOverflowDivider.js"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\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 */ export function useOverflowDivider(groupId) {\n const ref = React.useRef(null);\n const registerDivider = useOverflowContext((v)=>v.registerDivider);\n useIsomorphicLayoutEffect(()=>{\n if (ref.current && groupId) {\n return registerDivider({\n element: ref.current,\n groupId\n });\n }\n }, [\n registerDivider,\n groupId\n ]);\n return ref;\n}\n"],"names":["useOverflowDivider","groupId","ref","React","useRef","registerDivider","useOverflowContext","v","useIsomorphicLayoutEffect","current","element"],"mappings":";;;;+BAQoBA
|
1
|
+
{"version":3,"sources":["useOverflowDivider.js"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\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 */ export function useOverflowDivider(groupId) {\n const ref = React.useRef(null);\n const registerDivider = useOverflowContext((v)=>v.registerDivider);\n useIsomorphicLayoutEffect(()=>{\n if (ref.current && groupId) {\n return registerDivider({\n element: ref.current,\n groupId\n });\n }\n }, [\n registerDivider,\n groupId\n ]);\n return ref;\n}\n"],"names":["useOverflowDivider","groupId","ref","React","useRef","registerDivider","useOverflowContext","v","useIsomorphicLayoutEffect","current","element"],"mappings":";;;;+BAQoBA;;;eAAAA;;;;iEARG;gCACmB;iCACP;AAMxB,SAASA,mBAAmBC,OAAO;IAC1C,MAAMC,MAAMC,OAAMC,MAAM,CAAC;IACzB,MAAMC,kBAAkBC,IAAAA,mCAAkB,EAAC,CAACC,IAAIA,EAAEF,eAAe;IACjEG,IAAAA,yCAAyB,EAAC;QACtB,IAAIN,IAAIO,OAAO,IAAIR,SAAS;YACxB,OAAOI,gBAAgB;gBACnBK,SAASR,IAAIO,OAAO;gBACpBR;YACJ;QACJ;IACJ,GAAG;QACCI;QACAJ;KACH;IACD,OAAOC;AACX"}
|
@@ -4,16 +4,18 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useOverflowItem", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useOverflowItem;
|
9
|
+
}
|
8
10
|
});
|
9
|
-
const
|
10
|
-
const _react = /*#__PURE__*/
|
11
|
-
const
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
13
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
12
14
|
const _overflowContext = require("./overflowContext");
|
13
15
|
function useOverflowItem(id, priority, groupId) {
|
14
16
|
const ref = _react.useRef(null);
|
15
17
|
const registerItem = (0, _overflowContext.useOverflowContext)((v)=>v.registerItem);
|
16
|
-
(0,
|
18
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
17
19
|
if (ref.current) {
|
18
20
|
return registerItem({
|
19
21
|
element: ref.current,
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useOverflowItem.js"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\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 */ export function useOverflowItem(id, priority, groupId) {\n const ref = React.useRef(null);\n const registerItem = useOverflowContext((v)=>v.registerItem);\n useIsomorphicLayoutEffect(()=>{\n if (ref.current) {\n return registerItem({\n element: ref.current,\n id,\n priority: priority !== null && priority !== void 0 ? priority : 0,\n groupId\n });\n }\n }, [\n id,\n priority,\n registerItem,\n groupId\n ]);\n return ref;\n}\n"],"names":["useOverflowItem","id","priority","groupId","ref","React","useRef","registerItem","useOverflowContext","v","useIsomorphicLayoutEffect","current","element"],"mappings":";;;;+BAUoBA
|
1
|
+
{"version":3,"sources":["useOverflowItem.js"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\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 */ export function useOverflowItem(id, priority, groupId) {\n const ref = React.useRef(null);\n const registerItem = useOverflowContext((v)=>v.registerItem);\n useIsomorphicLayoutEffect(()=>{\n if (ref.current) {\n return registerItem({\n element: ref.current,\n id,\n priority: priority !== null && priority !== void 0 ? priority : 0,\n groupId\n });\n }\n }, [\n id,\n priority,\n registerItem,\n groupId\n ]);\n return ref;\n}\n"],"names":["useOverflowItem","id","priority","groupId","ref","React","useRef","registerItem","useOverflowContext","v","useIsomorphicLayoutEffect","current","element"],"mappings":";;;;+BAUoBA;;;eAAAA;;;;iEAVG;gCACmB;iCACP;AAQxB,SAASA,gBAAgBC,EAAE,EAAEC,QAAQ,EAAEC,OAAO;IACrD,MAAMC,MAAMC,OAAMC,MAAM,CAAC;IACzB,MAAMC,eAAeC,IAAAA,mCAAkB,EAAC,CAACC,IAAIA,EAAEF,YAAY;IAC3DG,IAAAA,yCAAyB,EAAC;QACtB,IAAIN,IAAIO,OAAO,EAAE;YACb,OAAOJ,aAAa;gBAChBK,SAASR,IAAIO,OAAO;gBACpBV;gBACAC,UAAUA,aAAa,QAAQA,aAAa,KAAK,IAAIA,WAAW;gBAChEC;YACJ;QACJ;IACJ,GAAG;QACCF;QACAC;QACAK;QACAJ;KACH;IACD,OAAOC;AACX"}
|
@@ -4,21 +4,23 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
});
|
5
5
|
Object.defineProperty(exports, "useOverflowMenu", {
|
6
6
|
enumerable: true,
|
7
|
-
get: ()
|
7
|
+
get: function() {
|
8
|
+
return useOverflowMenu;
|
9
|
+
}
|
8
10
|
});
|
9
|
-
const
|
10
|
-
const _react = /*#__PURE__*/
|
11
|
-
const
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
13
|
+
const _reactutilities = require("@fluentui/react-utilities");
|
12
14
|
const _overflowContext = require("./overflowContext");
|
13
15
|
const _useOverflowCount = require("./useOverflowCount");
|
14
16
|
function useOverflowMenu(id) {
|
15
|
-
const elementId = (0,
|
17
|
+
const elementId = (0, _reactutilities.useId)('overflow-menu', id);
|
16
18
|
const overflowCount = (0, _useOverflowCount.useOverflowCount)();
|
17
19
|
const registerOverflowMenu = (0, _overflowContext.useOverflowContext)((v)=>v.registerOverflowMenu);
|
18
20
|
const updateOverflow = (0, _overflowContext.useOverflowContext)((v)=>v.updateOverflow);
|
19
21
|
const ref = _react.useRef(null);
|
20
22
|
const isOverflowing = overflowCount > 0;
|
21
|
-
(0,
|
23
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
22
24
|
if (ref.current) {
|
23
25
|
return registerOverflowMenu(ref.current);
|
24
26
|
}
|
@@ -27,7 +29,7 @@ function useOverflowMenu(id) {
|
|
27
29
|
isOverflowing,
|
28
30
|
elementId
|
29
31
|
]);
|
30
|
-
(0,
|
32
|
+
(0, _reactutilities.useIsomorphicLayoutEffect)(()=>{
|
31
33
|
if (isOverflowing) {
|
32
34
|
updateOverflow();
|
33
35
|
}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["useOverflowMenu.js"],"sourcesContent":["import * as React from 'react';\nimport { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\nimport { useOverflowCount } from './useOverflowCount';\nexport function useOverflowMenu(id) {\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(null);\n const isOverflowing = overflowCount > 0;\n useIsomorphicLayoutEffect(()=>{\n if (ref.current) {\n return registerOverflowMenu(ref.current);\n }\n }, [\n registerOverflowMenu,\n isOverflowing,\n elementId\n ]);\n useIsomorphicLayoutEffect(()=>{\n if (isOverflowing) {\n updateOverflow();\n }\n }, [\n isOverflowing,\n updateOverflow,\n ref\n ]);\n return {\n ref,\n overflowCount,\n isOverflowing\n };\n}\n"],"names":["useOverflowMenu","id","elementId","useId","overflowCount","useOverflowCount","registerOverflowMenu","useOverflowContext","v","updateOverflow","ref","React","useRef","isOverflowing","useIsomorphicLayoutEffect","current"],"mappings":";;;;+BAIgBA
|
1
|
+
{"version":3,"sources":["useOverflowMenu.js"],"sourcesContent":["import * as React from 'react';\nimport { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useOverflowContext } from './overflowContext';\nimport { useOverflowCount } from './useOverflowCount';\nexport function useOverflowMenu(id) {\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(null);\n const isOverflowing = overflowCount > 0;\n useIsomorphicLayoutEffect(()=>{\n if (ref.current) {\n return registerOverflowMenu(ref.current);\n }\n }, [\n registerOverflowMenu,\n isOverflowing,\n elementId\n ]);\n useIsomorphicLayoutEffect(()=>{\n if (isOverflowing) {\n updateOverflow();\n }\n }, [\n isOverflowing,\n updateOverflow,\n ref\n ]);\n return {\n ref,\n overflowCount,\n isOverflowing\n };\n}\n"],"names":["useOverflowMenu","id","elementId","useId","overflowCount","useOverflowCount","registerOverflowMenu","useOverflowContext","v","updateOverflow","ref","React","useRef","isOverflowing","useIsomorphicLayoutEffect","current"],"mappings":";;;;+BAIgBA;;;eAAAA;;;;iEAJO;gCAC0B;iCACd;kCACF;AAC1B,SAASA,gBAAgBC,EAAE;IAC9B,MAAMC,YAAYC,IAAAA,qBAAK,EAAC,iBAAiBF;IACzC,MAAMG,gBAAgBC,IAAAA,kCAAgB;IACtC,MAAMC,uBAAuBC,IAAAA,mCAAkB,EAAC,CAACC,IAAIA,EAAEF,oBAAoB;IAC3E,MAAMG,iBAAiBF,IAAAA,mCAAkB,EAAC,CAACC,IAAIA,EAAEC,cAAc;IAC/D,MAAMC,MAAMC,OAAMC,MAAM,CAAC;IACzB,MAAMC,gBAAgBT,gBAAgB;IACtCU,IAAAA,yCAAyB,EAAC;QACtB,IAAIJ,IAAIK,OAAO,EAAE;YACb,OAAOT,qBAAqBI,IAAIK,OAAO;QAC3C;IACJ,GAAG;QACCT;QACAO;QACAX;KACH;IACDY,IAAAA,yCAAyB,EAAC;QACtB,IAAID,eAAe;YACfJ;QACJ;IACJ,GAAG;QACCI;QACAJ;QACAC;KACH;IACD,OAAO;QACHA;QACAN;QACAS;IACJ;AACJ"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-overflow",
|
3
|
-
"version": "9.0.
|
3
|
+
"version": "9.0.32",
|
4
4
|
"description": "React bindings for @fluentui/priority-overflow",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -34,18 +34,18 @@
|
|
34
34
|
"@fluentui/scripts-tasks": "*"
|
35
35
|
},
|
36
36
|
"dependencies": {
|
37
|
-
"@fluentui/priority-overflow": "^9.1.
|
38
|
-
"@fluentui/react-context-selector": "^9.1.
|
39
|
-
"@fluentui/react-theme": "^9.1.
|
40
|
-
"@fluentui/react-utilities": "^9.13.
|
37
|
+
"@fluentui/priority-overflow": "^9.1.5",
|
38
|
+
"@fluentui/react-context-selector": "^9.1.33",
|
39
|
+
"@fluentui/react-theme": "^9.1.12",
|
40
|
+
"@fluentui/react-utilities": "^9.13.2",
|
41
41
|
"@griffel/react": "^1.5.14",
|
42
|
-
"@swc/helpers": "^0.
|
42
|
+
"@swc/helpers": "^0.5.1"
|
43
43
|
},
|
44
44
|
"peerDependencies": {
|
45
|
-
"@types/react": ">=16.
|
46
|
-
"@types/react-dom": ">=16.
|
47
|
-
"react": ">=16.
|
48
|
-
"react-dom": ">=16.
|
45
|
+
"@types/react": ">=16.14.0 <19.0.0",
|
46
|
+
"@types/react-dom": ">=16.14.0 <19.0.0",
|
47
|
+
"react": ">=16.14.0 <19.0.0",
|
48
|
+
"react-dom": ">=16.14.0 <19.0.0",
|
49
49
|
"scheduler": "^0.19.0 || ^0.20.0"
|
50
50
|
},
|
51
51
|
"beachball": {
|