UNPKG

carbon-react

Version:

A library of reusable React components for easily building user interfaces.

2 lines (1 loc) 5.67 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("invariant"),r=require("../action-popover.style.js"),o=require("../../../__internal__/utils/helpers/events/events.js"),u=require("../../../__internal__/utils/helpers/guid/index.js"),i=require("../__internal__/action-popover.context.js"),c=require("../action-popover-menu/action-popover-menu.component.js");function l(e){return e&&e.__esModule?e:{default:e}}var a=l(t),s=l(n);function f(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function p(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},r=Object.keys(n);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),r.forEach((function(t){f(e,t,n[t])}))}return e}function d(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t.push.apply(t,n)}return t}(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))})),e}function m(e){return Boolean(e&&e.current)}const v=n=>{var{children:l,icon:f,disabled:v=!1,onClick:b,submenu:y,focusItem:P,download:h,href:g,currentSubmenuPosition:O,setCurrentSubmenuPosition:j}=n,_=function(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n,r,o={},u=Object.keys(e);for(r=0;r<u.length;r++)n=u[r],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var u=Object.getOwnPropertySymbols(e);for(r=0;r<u.length;r++)n=u[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}(n,["children","icon","disabled","onClick","submenu","focusItem","download","href","currentSubmenuPosition","setCurrentSubmenuPosition"]);s.default(!a.default.isValidElement(y)||y.type===c.default,"ActionPopoverItem only accepts submenu of type `ActionPopoverMenu`");const{setOpenPopover:S,focusButton:x,submenuPosition:I,selectedSubmenuRef:w,setSelectedSubmenuRef:E}=i.useActionPopoverContext(),k=!!g,[D,M]=t.useState(void 0),[C]=t.useState(u.default()),[K,R]=t.useState(!1),[q,A]=t.useState(0),T=t.useRef(null),L=t.useRef(null),W=t.useRef(null),B=t.useRef(null),$=t.useCallback((()=>{const e=function(e,t,n,r){if(!e.current||!t.current)return r||n;const{left:o,right:u}=e.current.getBoundingClientRect(),{offsetWidth:i}=t.current,c=document.body.clientWidth;return"left"===n?o>=i?"left":"right":c>=u+i?"right":"left"}(L,T,I,O);return null==j||j(e),m(L)&&m(T)&&y}),[y,j,I,O]);t.useEffect((()=>{!v&&T.current&&R(w===T.current)}),[v,w]),t.useEffect((()=>{M((()=>{if(!L.current||!T.current)return;const{offsetWidth:e}=T.current,t="left"===O;return{left:t?-e:"auto",right:t?"auto":-e}}))}),[y,O]),t.useEffect((()=>{y&&$()}),[$,y]),t.useEffect((()=>{P&&setTimeout((()=>{var e;null===(e=L.current)||void 0===e||e.focus()}),0)}),[P]),t.useEffect((()=>function(){W.current&&clearTimeout(W.current),B.current&&clearTimeout(B.current)}),[]),t.useEffect((()=>{const e="resize";return window.addEventListener(e,$),function(){window.removeEventListener(e,$)}}),[$]);const V=t.useCallback((e=>{var t;e.stopPropagation(),v?(null===(t=L.current)||void 0===t||t.focus(),e.preventDefault()):(S(!1),x(),b&&b(e))}),[v,x,b,S]),z=t.useCallback((e=>{if(o.default.isSpaceKey(e))e.preventDefault(),e.stopPropagation();else if(v)o.default.isEnterKey(e)&&e.stopPropagation();else if(y){var t;if("left"===O){if(o.default.isLeftKey(e)||o.default.isEnterKey(e))E(T.current),R(!0),A(0),e.stopPropagation();else if(o.default.isRightKey(e)){var n;R(!1),null===(n=L.current)||void 0===n||n.focus(),e.stopPropagation()}}else(o.default.isRightKey(e)||o.default.isEnterKey(e))&&(R(!0),A(0),e.stopPropagation()),o.default.isLeftKey(e)&&(R(!1),null===(t=L.current)||void 0===t||t.focus(),e.stopPropagation());e.preventDefault()}else if(o.default.isEnterKey(e)){var r;k&&h&&(null===(r=L.current)||void 0===r||r.click()),e.preventDefault(),V(e)}}),[v,y,O,E,k,h,V]),F=d(p({},!v&&{onClick:e=>{var t;E(T.current),R(!0),null===(t=L.current)||void 0===t||t.focus(),e.preventDefault(),e.stopPropagation()}}),{"aria-haspopup":"true","aria-controls":`ActionPopoverMenu_${C}`,"aria-expanded":K}),N=p({},!v&&{onMouseEnter:e=>{W.current&&clearTimeout(W.current),A(-1),W.current=setTimeout((()=>{R(!0),E(T.current)}),150),e.stopPropagation()},onMouseLeave:e=>{B.current&&clearTimeout(B.current),B.current=setTimeout((()=>{R(!1)}),150),e.stopPropagation()}});return e.jsxs(r.StyledMenuItemWrapper,d(p({onKeyDown:z},y&&N),{children:[e.jsxs(r.StyledMenuItem,d(p(d(p({},_),{ref:L,onClick:V,type:"button",tabIndex:0,isDisabled:v}),v&&{"aria-disabled":!0},k&&{as:"a",download:h,href:g},y&&F),{children:[y&&m(L)&&e.jsx(r.SubMenuItemIcon,{"aria-hidden":!0,"data-element":"action-popover-menu-item-chevron","data-role":"chevron-icon",type:"left"===O?"chevron_left_thick":"chevron_right_thick"}),f&&e.jsx(r.MenuItemIcon,{"aria-hidden":!0,type:f,"data-element":"action-popover-menu-item-icon","data-role":"item-icon"}),e.jsx(r.StyledMenuItemInnerText,{"data-element":"action-popover-menu-item-inner-text",children:l})]})),a.default.isValidElement(y)?a.default.cloneElement(y,{parentID:`ActionPopoverItem_${C}`,menuID:`ActionPopoverMenu_${C}`,"data-element":"action-popover-submenu",isOpen:K,ref:T,style:D,setOpen:R,setFocusIndex:A,focusIndex:q}):null]}))};v.displayName="ActionPopoverItem",exports.ActionPopoverItem=v,exports.default=v;