ExpandToggle-1f6d84ba.js 3.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  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 { f as forceUpdate, h } from './index-8ece2564.js';
  7. import { a as getElementDir } from './dom-da697a3f.js';
  8. import { S as SLOTS } from './resources-3c30f589.js';
  9. import { S as SLOTS$1 } from './resources-e8f918f0.js';
  10. const overflowActionsDebounceInMs = 150;
  11. const groupBufferHeight = 2;
  12. const getMaxActionCount = ({ height, actionHeight, groupCount }) => {
  13. return Math.floor((height - groupCount * groupBufferHeight) / actionHeight);
  14. };
  15. const getOverflowCount = ({ actionCount, actionHeight, height, groupCount }) => {
  16. return Math.max(actionCount - getMaxActionCount({ height, actionHeight, groupCount }), 0);
  17. };
  18. const queryActions = (el) => {
  19. return Array.from(el.querySelectorAll("calcite-action")).filter((action) => action.closest("calcite-action-menu") ? action.slot === SLOTS.trigger : true);
  20. };
  21. const overflowActions = ({ actionGroups, expanded, overflowCount }) => {
  22. let needToSlotCount = overflowCount;
  23. actionGroups.reverse().forEach((group) => {
  24. let slottedWithinGroupCount = 0;
  25. const groupActions = queryActions(group).reverse();
  26. groupActions.forEach((groupAction) => {
  27. if (groupAction.slot === SLOTS$1.menuActions) {
  28. groupAction.removeAttribute("slot");
  29. groupAction.textEnabled = expanded;
  30. }
  31. });
  32. if (needToSlotCount > 0) {
  33. groupActions.some((groupAction) => {
  34. const unslottedActions = groupActions.filter((action) => !action.slot);
  35. if (unslottedActions.length > 1 && groupActions.length > 2 && !groupAction.closest("calcite-action-menu")) {
  36. groupAction.textEnabled = true;
  37. groupAction.setAttribute("slot", SLOTS$1.menuActions);
  38. slottedWithinGroupCount++;
  39. if (slottedWithinGroupCount > 1) {
  40. needToSlotCount--;
  41. }
  42. }
  43. return needToSlotCount < 1;
  44. });
  45. }
  46. forceUpdate(group);
  47. });
  48. };
  49. const ICONS = {
  50. chevronsLeft: "chevrons-left",
  51. chevronsRight: "chevrons-right"
  52. };
  53. function getCalcitePosition(position, el) {
  54. var _a;
  55. return position || ((_a = el.closest("calcite-shell-panel")) === null || _a === void 0 ? void 0 : _a.position) || "start";
  56. }
  57. function toggleChildActionText({ parent, expanded }) {
  58. queryActions(parent)
  59. .filter((el) => el.slot !== SLOTS$1.menuActions)
  60. .forEach((action) => (action.textEnabled = expanded));
  61. parent.querySelectorAll("calcite-action-group").forEach((group) => (group.expanded = expanded));
  62. }
  63. const setTooltipReference = ({ tooltip, referenceElement, expanded, ref }) => {
  64. if (tooltip) {
  65. tooltip.referenceElement = !expanded && referenceElement ? referenceElement : null;
  66. }
  67. if (ref) {
  68. ref(referenceElement);
  69. }
  70. return referenceElement;
  71. };
  72. const ExpandToggle = ({ expanded, intlExpand, intlCollapse, toggle, el, position, tooltip, ref, scale }) => {
  73. const rtl = getElementDir(el) === "rtl";
  74. const expandText = expanded ? intlCollapse : intlExpand;
  75. const icons = [ICONS.chevronsLeft, ICONS.chevronsRight];
  76. if (rtl) {
  77. icons.reverse();
  78. }
  79. const end = getCalcitePosition(position, el) === "end";
  80. const expandIcon = end ? icons[1] : icons[0];
  81. const collapseIcon = end ? icons[0] : icons[1];
  82. const actionNode = (h("calcite-action", { icon: expanded ? expandIcon : collapseIcon, onClick: toggle, ref: (referenceElement) => setTooltipReference({ tooltip, referenceElement, expanded, ref }), scale: scale, text: expandText, textEnabled: expanded }));
  83. return actionNode;
  84. };
  85. export { ExpandToggle as E, overflowActions as a, getOverflowCount as g, overflowActionsDebounceInMs as o, queryActions as q, toggleChildActionText as t };