utils.js 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. /*!
  2. * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  3. * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
  4. * v1.0.0-beta.82
  5. */
  6. import { forceUpdate } from "@stencil/core";
  7. import { SLOTS as ACTION_MENU_SLOTS } from "../action-menu/resources";
  8. import { SLOTS as ACTION_GROUP_SLOTS } from "../action-group/resources";
  9. export const overflowActionsDebounceInMs = 150;
  10. const groupBufferHeight = 2;
  11. const getMaxActionCount = ({ height, actionHeight, groupCount }) => {
  12. return Math.floor((height - groupCount * groupBufferHeight) / actionHeight);
  13. };
  14. export const getOverflowCount = ({ actionCount, actionHeight, height, groupCount }) => {
  15. return Math.max(actionCount - getMaxActionCount({ height, actionHeight, groupCount }), 0);
  16. };
  17. export const queryActions = (el) => {
  18. return Array.from(el.querySelectorAll("calcite-action")).filter((action) => action.closest("calcite-action-menu") ? action.slot === ACTION_MENU_SLOTS.trigger : true);
  19. };
  20. export const overflowActions = ({ actionGroups, expanded, overflowCount }) => {
  21. let needToSlotCount = overflowCount;
  22. actionGroups.reverse().forEach((group) => {
  23. let slottedWithinGroupCount = 0;
  24. const groupActions = queryActions(group).reverse();
  25. groupActions.forEach((groupAction) => {
  26. if (groupAction.slot === ACTION_GROUP_SLOTS.menuActions) {
  27. groupAction.removeAttribute("slot");
  28. groupAction.textEnabled = expanded;
  29. }
  30. });
  31. if (needToSlotCount > 0) {
  32. groupActions.some((groupAction) => {
  33. const unslottedActions = groupActions.filter((action) => !action.slot);
  34. if (unslottedActions.length > 1 && groupActions.length > 2 && !groupAction.closest("calcite-action-menu")) {
  35. groupAction.textEnabled = true;
  36. groupAction.setAttribute("slot", ACTION_GROUP_SLOTS.menuActions);
  37. slottedWithinGroupCount++;
  38. if (slottedWithinGroupCount > 1) {
  39. needToSlotCount--;
  40. }
  41. }
  42. return needToSlotCount < 1;
  43. });
  44. }
  45. forceUpdate(group);
  46. });
  47. };