@fluentui/priority-overflow
Advanced tools
@fluentui/priority-overflow - npm Package Compare versions
Comparing version 0.0.0-nightly-20221228-0425.1 to 0.0.0-nightly-20221229-0425.1
@@ -5,5 +5,5 @@ { | ||
| { | ||
| "date": "Wed, 28 Dec 2022 04:33:21 GMT", | ||
| "tag": "@fluentui/priority-overflow_v0.0.0-nightly-20221228-0425.1", | ||
| "version": "0.0.0-nightly-20221228-0425.1", | ||
| "date": "Thu, 29 Dec 2022 04:34:31 GMT", | ||
| "tag": "@fluentui/priority-overflow_v0.0.0-nightly-20221229-0425.1", | ||
| "version": "0.0.0-nightly-20221229-0425.1", | ||
| "comments": { | ||
@@ -10,0 +10,0 @@ "prerelease": [ |
| # Change Log - @fluentui/priority-overflow | ||
| This log was last generated on Wed, 28 Dec 2022 04:33:21 GMT and should not be manually modified. | ||
| This log was last generated on Thu, 29 Dec 2022 04:34:31 GMT and should not be manually modified. | ||
| <!-- Start content --> | ||
| ## [0.0.0-nightly-20221228-0425.1](https://github.com/microsoft/fluentui/tree/@fluentui/priority-overflow_v0.0.0-nightly-20221228-0425.1) | ||
| ## [0.0.0-nightly-20221229-0425.1](https://github.com/microsoft/fluentui/tree/@fluentui/priority-overflow_v0.0.0-nightly-20221229-0425.1) | ||
| Wed, 28 Dec 2022 04:33:21 GMT | ||
| [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/priority-overflow_v9.0.0-rc.1..@fluentui/priority-overflow_v0.0.0-nightly-20221228-0425.1) | ||
| Thu, 29 Dec 2022 04:34:31 GMT | ||
| [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/priority-overflow_v9.0.0-rc.1..@fluentui/priority-overflow_v0.0.0-nightly-20221229-0425.1) | ||
@@ -12,0 +12,0 @@ ### Changes |
@@ -13,3 +13,2 @@ "use strict"; | ||
| */ | ||
| function debounce(fn) { | ||
@@ -29,4 +28,3 @@ let pending; | ||
| } | ||
| exports.debounce = debounce; | ||
| //# sourceMappingURL=debounce.js.map |
@@ -7,5 +7,3 @@ "use strict"; | ||
| exports.createOverflowManager = void 0; | ||
| var overflowManager_1 = /*#__PURE__*/require("./overflowManager"); | ||
| Object.defineProperty(exports, "createOverflowManager", { | ||
@@ -12,0 +10,0 @@ enumerable: true, |
@@ -7,5 +7,3 @@ "use strict"; | ||
| exports.createOverflowManager = void 0; | ||
| const debounce_1 = /*#__PURE__*/require("./debounce"); | ||
| const priorityQueue_1 = /*#__PURE__*/require("./priorityQueue"); | ||
@@ -16,4 +14,2 @@ /** | ||
| */ | ||
| function createOverflowManager() { | ||
@@ -37,3 +33,2 @@ let container; | ||
| } | ||
| update(); | ||
@@ -43,13 +38,11 @@ }); | ||
| const itemA = overflowItems[a]; | ||
| const itemB = overflowItems[b]; // Higher priority at the top of the queue | ||
| const itemB = overflowItems[b]; | ||
| // Higher priority at the top of the queue | ||
| const priority = itemB.priority - itemA.priority; | ||
| if (priority !== 0) { | ||
| return priority; | ||
| } | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_FOLLOWING : Node.DOCUMENT_POSITION_PRECEDING; // equal priority, use DOM order | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_FOLLOWING : Node.DOCUMENT_POSITION_PRECEDING; | ||
| // equal priority, use DOM order | ||
| // eslint-disable-next-line no-bitwise | ||
| return itemA.element.compareDocumentPosition(itemB.element) & positionStatusBit ? -1 : 1; | ||
@@ -59,20 +52,16 @@ }); | ||
| const itemA = overflowItems[a]; | ||
| const itemB = overflowItems[b]; // Lower priority at the top of the queue | ||
| const itemB = overflowItems[b]; | ||
| // Lower priority at the top of the queue | ||
| const priority = itemA.priority - itemB.priority; | ||
| if (priority !== 0) { | ||
| return priority; | ||
| } | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING; // equal priority, use DOM order | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING; | ||
| // equal priority, use DOM order | ||
| // eslint-disable-next-line no-bitwise | ||
| return itemA.element.compareDocumentPosition(itemB.element) & positionStatusBit ? -1 : 1; | ||
| }); | ||
| const getOffsetSize = el => { | ||
| return options.overflowAxis === 'horizontal' ? el.offsetWidth : el.offsetHeight; | ||
| }; | ||
| const makeItemVisible = () => { | ||
@@ -86,3 +75,2 @@ const nextVisible = invisibleItemQueue.dequeue(); | ||
| }); | ||
| if (item.groupId) { | ||
@@ -92,6 +80,4 @@ overflowGroups[item.groupId].invisibleItemIds.delete(item.id); | ||
| } | ||
| return getOffsetSize(item.element); | ||
| }; | ||
| const makeItemInvisible = () => { | ||
@@ -106,3 +92,2 @@ const nextInvisible = visibleItemQueue.dequeue(); | ||
| }); | ||
| if (item.groupId) { | ||
@@ -112,6 +97,4 @@ overflowGroups[item.groupId].visibleItemIds.delete(item.id); | ||
| } | ||
| return width; | ||
| }; | ||
| const dispatchOverflowUpdate = () => { | ||
@@ -138,3 +121,2 @@ const visibleItemIds = visibleItemQueue.all(); | ||
| }; | ||
| const processOverflowItems = availableSize => { | ||
@@ -144,5 +126,4 @@ if (!container) { | ||
| } | ||
| const overflowMenuOffset = overflowMenu ? getOffsetSize(overflowMenu) : 0; // Snapshot of the visible/invisible state to compare for updates | ||
| const overflowMenuOffset = overflowMenu ? getOffsetSize(overflowMenu) : 0; | ||
| // Snapshot of the visible/invisible state to compare for updates | ||
| const visibleTop = visibleItemQueue.peek(); | ||
@@ -154,9 +135,8 @@ const invisibleTop = invisibleItemQueue.peek(); | ||
| return sum + getOffsetSize(child); | ||
| }, 0); // Add items until available width is filled | ||
| }, 0); | ||
| // Add items until available width is filled | ||
| while (currentWidth < availableSize && invisibleItemQueue.size() > 0) { | ||
| currentWidth += makeItemVisible(); | ||
| } // Remove items until there's no more overlap | ||
| } | ||
| // Remove items until there's no more overlap | ||
| while (currentWidth > availableSize && visibleItemQueue.size() > 0) { | ||
@@ -166,11 +146,8 @@ if (visibleItemQueue.size() === options.minimumVisible) { | ||
| } | ||
| currentWidth -= makeItemInvisible(); | ||
| } | ||
| if (invisibleItemQueue.size() > 0 && currentWidth + overflowMenuOffset > availableSize) { | ||
| makeItemInvisible(); | ||
| } // only update when the state of visible/invisible items has changed | ||
| } | ||
| // only update when the state of visible/invisible items has changed | ||
| if (visibleItemQueue.peek() !== visibleTop || invisibleItemQueue.peek() !== invisibleTop) { | ||
@@ -180,3 +157,2 @@ dispatchOverflowUpdate(); | ||
| }; | ||
| const forceUpdate = () => { | ||
@@ -186,9 +162,6 @@ if (!container) { | ||
| } | ||
| const availableSize = getOffsetSize(container) - options.padding; | ||
| processOverflowItems(availableSize); | ||
| }; | ||
| const update = debounce_1.debounce(forceUpdate); | ||
| const observe = (observedContainer, userOptions) => { | ||
@@ -201,3 +174,2 @@ Object.assign(options, userOptions); | ||
| }; | ||
| const disconnect = () => { | ||
@@ -207,3 +179,2 @@ observing = false; | ||
| }; | ||
| const addItem = item => { | ||
@@ -213,9 +184,7 @@ if (overflowItems[item.id]) { | ||
| } | ||
| overflowItems[item.id] = item; // some options can affect priority which are only set on `observe` | ||
| overflowItems[item.id] = item; | ||
| // some options can affect priority which are only set on `observe` | ||
| if (observing) { | ||
| visibleItemQueue.enqueue(item.id); | ||
| } | ||
| if (item.groupId) { | ||
@@ -228,17 +197,12 @@ if (!overflowGroups[item.groupId]) { | ||
| } | ||
| overflowGroups[item.groupId].visibleItemIds.add(item.id); | ||
| } | ||
| update(); | ||
| }; | ||
| const addOverflowMenu = el => { | ||
| overflowMenu = el; | ||
| }; | ||
| const removeOverflowMenu = () => { | ||
| overflowMenu = undefined; | ||
| }; | ||
| const removeItem = itemId => { | ||
@@ -248,7 +212,5 @@ if (!overflowItems[itemId]) { | ||
| } | ||
| const item = overflowItems[itemId]; | ||
| visibleItemQueue.remove(itemId); | ||
| invisibleItemQueue.remove(itemId); | ||
| if (item.groupId) { | ||
@@ -258,7 +220,5 @@ overflowGroups[item.groupId].visibleItemIds.delete(item.id); | ||
| } | ||
| delete overflowItems[itemId]; | ||
| update(); | ||
| }; | ||
| return { | ||
@@ -275,4 +235,3 @@ addItem, | ||
| } | ||
| exports.createOverflowManager = createOverflowManager; | ||
| //# sourceMappingURL=overflowManager.js.map |
@@ -11,19 +11,14 @@ "use strict"; | ||
| */ | ||
| function createPriorityQueue(compare) { | ||
| const arr = []; | ||
| let size = 0; | ||
| const left = i => { | ||
| return 2 * i + 1; | ||
| }; | ||
| const right = i => { | ||
| return 2 * i + 2; | ||
| }; | ||
| const parent = i => { | ||
| return Math.floor((i - 1) / 2); | ||
| }; | ||
| const swap = (a, b) => { | ||
@@ -34,3 +29,2 @@ const tmp = arr[a]; | ||
| }; | ||
| const heapify = i => { | ||
@@ -40,11 +34,8 @@ let smallest = i; | ||
| const r = right(i); | ||
| if (l < size && compare(arr[l], arr[smallest]) < 0) { | ||
| smallest = l; | ||
| } | ||
| if (r < size && compare(arr[r], arr[smallest]) < 0) { | ||
| smallest = r; | ||
| } | ||
| if (smallest !== i) { | ||
@@ -55,3 +46,2 @@ swap(smallest, i); | ||
| }; | ||
| const dequeue = () => { | ||
@@ -61,3 +51,2 @@ if (size === 0) { | ||
| } | ||
| const res = arr[0]; | ||
@@ -68,3 +57,2 @@ arr[0] = arr[--size]; | ||
| }; | ||
| const peek = () => { | ||
@@ -74,6 +62,4 @@ if (size === 0) { | ||
| } | ||
| return arr[0]; | ||
| }; | ||
| const enqueue = item => { | ||
@@ -83,3 +69,2 @@ arr[size++] = item; | ||
| let p = parent(i); | ||
| while (i > 0 && compare(arr[p], arr[i]) > 0) { | ||
@@ -91,3 +76,2 @@ swap(p, i); | ||
| }; | ||
| const contains = item => { | ||
@@ -97,22 +81,16 @@ const index = arr.indexOf(item); | ||
| }; | ||
| const remove = item => { | ||
| const i = arr.indexOf(item); | ||
| if (i === -1 || i >= size) { | ||
| return; | ||
| } | ||
| arr[i] = arr[--size]; | ||
| heapify(i); | ||
| }; | ||
| const clear = () => { | ||
| size = 0; | ||
| }; | ||
| const all = () => { | ||
| return arr.slice(0, size); | ||
| }; | ||
| return { | ||
@@ -129,4 +107,3 @@ all, | ||
| } | ||
| exports.createPriorityQueue = createPriorityQueue; | ||
| //# sourceMappingURL=priorityQueue.js.map |
@@ -7,3 +7,2 @@ import { debounce } from './debounce'; | ||
| */ | ||
| export function createOverflowManager() { | ||
@@ -27,3 +26,2 @@ let container; | ||
| } | ||
| update(); | ||
@@ -33,13 +31,11 @@ }); | ||
| const itemA = overflowItems[a]; | ||
| const itemB = overflowItems[b]; // Higher priority at the top of the queue | ||
| const itemB = overflowItems[b]; | ||
| // Higher priority at the top of the queue | ||
| const priority = itemB.priority - itemA.priority; | ||
| if (priority !== 0) { | ||
| return priority; | ||
| } | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_FOLLOWING : Node.DOCUMENT_POSITION_PRECEDING; // equal priority, use DOM order | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_FOLLOWING : Node.DOCUMENT_POSITION_PRECEDING; | ||
| // equal priority, use DOM order | ||
| // eslint-disable-next-line no-bitwise | ||
| return itemA.element.compareDocumentPosition(itemB.element) & positionStatusBit ? -1 : 1; | ||
@@ -49,20 +45,16 @@ }); | ||
| const itemA = overflowItems[a]; | ||
| const itemB = overflowItems[b]; // Lower priority at the top of the queue | ||
| const itemB = overflowItems[b]; | ||
| // Lower priority at the top of the queue | ||
| const priority = itemA.priority - itemB.priority; | ||
| if (priority !== 0) { | ||
| return priority; | ||
| } | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING; // equal priority, use DOM order | ||
| const positionStatusBit = options.overflowDirection === 'end' ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING; | ||
| // equal priority, use DOM order | ||
| // eslint-disable-next-line no-bitwise | ||
| return itemA.element.compareDocumentPosition(itemB.element) & positionStatusBit ? -1 : 1; | ||
| }); | ||
| const getOffsetSize = el => { | ||
| return options.overflowAxis === 'horizontal' ? el.offsetWidth : el.offsetHeight; | ||
| }; | ||
| const makeItemVisible = () => { | ||
@@ -76,3 +68,2 @@ const nextVisible = invisibleItemQueue.dequeue(); | ||
| }); | ||
| if (item.groupId) { | ||
@@ -82,6 +73,4 @@ overflowGroups[item.groupId].invisibleItemIds.delete(item.id); | ||
| } | ||
| return getOffsetSize(item.element); | ||
| }; | ||
| const makeItemInvisible = () => { | ||
@@ -96,3 +85,2 @@ const nextInvisible = visibleItemQueue.dequeue(); | ||
| }); | ||
| if (item.groupId) { | ||
@@ -102,6 +90,4 @@ overflowGroups[item.groupId].visibleItemIds.delete(item.id); | ||
| } | ||
| return width; | ||
| }; | ||
| const dispatchOverflowUpdate = () => { | ||
@@ -128,3 +114,2 @@ const visibleItemIds = visibleItemQueue.all(); | ||
| }; | ||
| const processOverflowItems = availableSize => { | ||
@@ -134,5 +119,4 @@ if (!container) { | ||
| } | ||
| const overflowMenuOffset = overflowMenu ? getOffsetSize(overflowMenu) : 0; // Snapshot of the visible/invisible state to compare for updates | ||
| const overflowMenuOffset = overflowMenu ? getOffsetSize(overflowMenu) : 0; | ||
| // Snapshot of the visible/invisible state to compare for updates | ||
| const visibleTop = visibleItemQueue.peek(); | ||
@@ -144,9 +128,8 @@ const invisibleTop = invisibleItemQueue.peek(); | ||
| return sum + getOffsetSize(child); | ||
| }, 0); // Add items until available width is filled | ||
| }, 0); | ||
| // Add items until available width is filled | ||
| while (currentWidth < availableSize && invisibleItemQueue.size() > 0) { | ||
| currentWidth += makeItemVisible(); | ||
| } // Remove items until there's no more overlap | ||
| } | ||
| // Remove items until there's no more overlap | ||
| while (currentWidth > availableSize && visibleItemQueue.size() > 0) { | ||
@@ -156,11 +139,8 @@ if (visibleItemQueue.size() === options.minimumVisible) { | ||
| } | ||
| currentWidth -= makeItemInvisible(); | ||
| } | ||
| if (invisibleItemQueue.size() > 0 && currentWidth + overflowMenuOffset > availableSize) { | ||
| makeItemInvisible(); | ||
| } // only update when the state of visible/invisible items has changed | ||
| } | ||
| // only update when the state of visible/invisible items has changed | ||
| if (visibleItemQueue.peek() !== visibleTop || invisibleItemQueue.peek() !== invisibleTop) { | ||
@@ -170,3 +150,2 @@ dispatchOverflowUpdate(); | ||
| }; | ||
| const forceUpdate = () => { | ||
@@ -176,9 +155,6 @@ if (!container) { | ||
| } | ||
| const availableSize = getOffsetSize(container) - options.padding; | ||
| processOverflowItems(availableSize); | ||
| }; | ||
| const update = debounce(forceUpdate); | ||
| const observe = (observedContainer, userOptions) => { | ||
@@ -191,3 +167,2 @@ Object.assign(options, userOptions); | ||
| }; | ||
| const disconnect = () => { | ||
@@ -197,3 +172,2 @@ observing = false; | ||
| }; | ||
| const addItem = item => { | ||
@@ -203,9 +177,7 @@ if (overflowItems[item.id]) { | ||
| } | ||
| overflowItems[item.id] = item; // some options can affect priority which are only set on `observe` | ||
| overflowItems[item.id] = item; | ||
| // some options can affect priority which are only set on `observe` | ||
| if (observing) { | ||
| visibleItemQueue.enqueue(item.id); | ||
| } | ||
| if (item.groupId) { | ||
@@ -218,17 +190,12 @@ if (!overflowGroups[item.groupId]) { | ||
| } | ||
| overflowGroups[item.groupId].visibleItemIds.add(item.id); | ||
| } | ||
| update(); | ||
| }; | ||
| const addOverflowMenu = el => { | ||
| overflowMenu = el; | ||
| }; | ||
| const removeOverflowMenu = () => { | ||
| overflowMenu = undefined; | ||
| }; | ||
| const removeItem = itemId => { | ||
@@ -238,7 +205,5 @@ if (!overflowItems[itemId]) { | ||
| } | ||
| const item = overflowItems[itemId]; | ||
| visibleItemQueue.remove(itemId); | ||
| invisibleItemQueue.remove(itemId); | ||
| if (item.groupId) { | ||
@@ -248,7 +213,5 @@ overflowGroups[item.groupId].visibleItemIds.delete(item.id); | ||
| } | ||
| delete overflowItems[itemId]; | ||
| update(); | ||
| }; | ||
| return { | ||
@@ -255,0 +218,0 @@ addItem, |
@@ -8,15 +8,11 @@ /** | ||
| let size = 0; | ||
| const left = i => { | ||
| return 2 * i + 1; | ||
| }; | ||
| const right = i => { | ||
| return 2 * i + 2; | ||
| }; | ||
| const parent = i => { | ||
| return Math.floor((i - 1) / 2); | ||
| }; | ||
| const swap = (a, b) => { | ||
@@ -27,3 +23,2 @@ const tmp = arr[a]; | ||
| }; | ||
| const heapify = i => { | ||
@@ -33,11 +28,8 @@ let smallest = i; | ||
| const r = right(i); | ||
| if (l < size && compare(arr[l], arr[smallest]) < 0) { | ||
| smallest = l; | ||
| } | ||
| if (r < size && compare(arr[r], arr[smallest]) < 0) { | ||
| smallest = r; | ||
| } | ||
| if (smallest !== i) { | ||
@@ -48,3 +40,2 @@ swap(smallest, i); | ||
| }; | ||
| const dequeue = () => { | ||
@@ -54,3 +45,2 @@ if (size === 0) { | ||
| } | ||
| const res = arr[0]; | ||
@@ -61,3 +51,2 @@ arr[0] = arr[--size]; | ||
| }; | ||
| const peek = () => { | ||
@@ -67,6 +56,4 @@ if (size === 0) { | ||
| } | ||
| return arr[0]; | ||
| }; | ||
| const enqueue = item => { | ||
@@ -76,3 +63,2 @@ arr[size++] = item; | ||
| let p = parent(i); | ||
| while (i > 0 && compare(arr[p], arr[i]) > 0) { | ||
@@ -84,3 +70,2 @@ swap(p, i); | ||
| }; | ||
| const contains = item => { | ||
@@ -90,22 +75,16 @@ const index = arr.indexOf(item); | ||
| }; | ||
| const remove = item => { | ||
| const i = arr.indexOf(item); | ||
| if (i === -1 || i >= size) { | ||
| return; | ||
| } | ||
| arr[i] = arr[--size]; | ||
| heapify(i); | ||
| }; | ||
| const clear = () => { | ||
| size = 0; | ||
| }; | ||
| const all = () => { | ||
| return arr.slice(0, size); | ||
| }; | ||
| return { | ||
@@ -112,0 +91,0 @@ all, |
| { | ||
| "name": "@fluentui/priority-overflow", | ||
| "version": "0.0.0-nightly-20221228-0425.1", | ||
| "version": "0.0.0-nightly-20221229-0425.1", | ||
| "description": "Vanilla JS utilities to implement overflow menus", | ||
@@ -5,0 +5,0 @@ "main": "lib-commonjs/index.js", |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by4.43%
82282
- Lines of code
- increased by1.95%
941