carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 5.95 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("invariant"),n=require("../../__internal__/utils/helpers/tags/tags.js"),o=require("./action-popover.style.js"),a=require("../../__internal__/utils/helpers/events/events.js"),i=require("../../__internal__/popover/popover.component.js"),l=require("../../__internal__/utils/helpers/guid/index.js"),u=require("../../hooks/__internal__/useLocale/useLocale.js"),s=require("./action-popover-menu/action-popover-menu.component.js"),c=require("./action-popover-item/action-popover-item.component.js");require("./action-popover-divider/action-popover-divider.component.js");var p=require("./__internal__/action-popover.context.js"),d=require("../../hooks/__internal__/useModalManager/useModalManager.js"),b=require("../../hooks/__internal__/useAdaptiveSidebarModalFocus/useAdaptiveSidebarModalFocus.js"),f=require("./__internal__/action-popover.utils.js"),v=require("../flat-table/__internal__/flat-table.context.js");function m(e){return e&&e.__esModule?e:{default:e}}var y=m(t),_=m(r);function j(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}const O=()=>{},g=()=>{},P=t.forwardRef(((r,m)=>{var{children:P,id:h,onOpen:x=O,onClose:I=g,rightAlignMenu:S,renderButton:q,placement:M="bottom",horizontalAlignment:A="left",submenuPosition:k="left","aria-label":w,"aria-labelledby":D,"aria-describedby":C}=r,B=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},a=Object.keys(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(n=0;n<a.length;n++)r=a[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(r,["children","id","onOpen","onClose","rightAlignMenu","renderButton","placement","horizontalAlignment","submenuPosition","aria-label","aria-labelledby","aria-describedby"]);const E=u.default(),[F,L]=t.useState(!1),[K,R]=t.useState(0),[$]=t.useState(l.default()),z=t.useRef(null),N=t.useRef(null),{isInFlatTable:U}=t.useContext(v.default),[H,T]=t.useState(null),V=t.useMemo((()=>!y.default.Children.toArray(P).find((e=>!y.default.isValidElement(e)||e.type!==c.ActionPopoverItem&&e.type!==o.MenuItemDivider))),[P]),G=t.useMemo((()=>f.getItems(P)),[P]),J=f.findFirstFocusableItem(G),Q=f.findLastFocusableItem(G);_.default(V,`ActionPopover only accepts children of type \`${c.ActionPopoverItem.displayName}\` and \`${o.MenuItemDivider.displayName}\`.`);const W=t.useMemo((()=>"top"!==M||S?"top"===M&&S?"top-start":"bottom"===M&&S?"bottom-start":"bottom-end":"top-end"),[M,S]),X=t.useCallback((e=>{e&&!F&&x(),!e&&F&&I(),L(e)}),[F,x,I]),Y=t.useCallback((()=>{var e;const t=null===(e=z.current)||void 0===e?void 0:e.querySelector("[data-element='action-popover-button']");null==t||t.focus()}),[]);t.useImperativeHandle(m,(()=>({focusButton(){Y()}})),[Y]);const Z=t.useCallback((e=>{e.stopPropagation();const t=!F;R(J),X(t),t||Y()}),[F,J,X,Y]),ee=t.useCallback((e=>{a.default.isSpaceKey(e)||a.default.isDownKey(e)||a.default.isEnterKey(e)?(e.preventDefault(),e.stopPropagation(),R(J),X(!0)):a.default.isUpKey(e)&&(e.preventDefault(),e.stopPropagation(),R(Q),X(!0))}),[J,Q,X]),te=t.useCallback((e=>{a.default.isEscKey(e)&&(X(!1),Y())}),[X,Y]);d.default({open:F,closeModal:te,modalRef:z}),t.useEffect((()=>{const e=({target:e})=>{var t,r;const n=null==N||null===(t=N.current)||void 0===t?void 0:t.contains(e),o=null==z||null===(r=z.current)||void 0===r?void 0:r.contains(e);n||o||X(!1)},t="click";return document.addEventListener(t,e,{capture:!0}),function(){document.removeEventListener(t,e,{capture:!0})}}),[X]),b.default((()=>L(!1)));const re=h||`ActionPopoverButton_${$}`,ne=`ActionPopoverMenu_${$}`;return e.jsxs(o.MenuButton,(oe=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){j(e,t,r[t])}))}return e}({id:re,onKeyDown:ee,onClick:Z,isOpen:F,ref:z},B,n.default("action-popover-wrapper",B)),ae=null!=(ae={children:[(t=>{if(q){const e=q({tabIndex:F?-1:0,"data-element":"action-popover-button",ariaAttributes:{"aria-haspopup":"true","aria-label":w||E.actionPopover.ariaLabel(),"aria-labelledby":D,"aria-describedby":C,"aria-controls":t,"aria-expanded":`${F}`}}),r=f.checkChildrenForString(e);return q({tabIndex:F?-1:0,"data-element":"action-popover-button",ariaAttributes:{"aria-haspopup":"true","aria-label":r?void 0:w||E.actionPopover.ariaLabel(),"aria-labelledby":D,"aria-describedby":C,"aria-controls":t,"aria-expanded":`${F}`}})}return e.jsx(o.StyledButtonIcon,{role:"button","aria-haspopup":"true","aria-label":w||E.actionPopover.ariaLabel(),"aria-labelledby":D,"aria-describedby":C,"aria-controls":t,"aria-expanded":F,tabIndex:F?-1:0,"data-element":"action-popover-button",children:e.jsx(o.ButtonIcon,{type:"ellipsis_vertical"})})})(ne),e.jsx(p.ActionPopoverProvider,{value:{setOpenPopover:X,focusButton:Y,submenuPosition:k,horizontalAlignment:A,selectedSubmenuRef:H,setSelectedSubmenuRef:T},children:F&&e.jsx(i.default,{placement:W,reference:z,disableBackgroundUI:U,children:e.jsx(s.default,{"data-component":"action-popover",ref:N,parentID:re,menuID:ne,focusIndex:K,setFocusIndex:R,isOpen:F,setOpen:X,placement:M,children:P})})})]})?ae:{},Object.getOwnPropertyDescriptors?Object.defineProperties(oe,Object.getOwnPropertyDescriptors(ae)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(ae)).forEach((function(e){Object.defineProperty(oe,e,Object.getOwnPropertyDescriptor(ae,e))})),oe));var oe,ae}));exports.ActionPopover=P,exports.default=P;