@elyra/canvas 13.44.0 → 13.45.1

package/dist/{context-menu-wrapper-39831e91.js → context-menu-wrapper-0fdb9b4c.js}

@@ -1,2 +1,2 @@
-"use strict";var e=require("./createClass-df7b07d6.js"),t=require("./inherits-74e481d1.js"),n=require("react"),o=require("./defineProperty-d68f985b.js"),s=require("./ChevronRight-362f2dfd.js"),i=require("./keyboard-utils-b5a20c84.js"),r=require("./canvas-logger-8c01664d.js"),l=require("./common-canvas-utils-272fb8c4.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=u(n),c=["#FFF1F1","#FCEBD6","#FDF4D6","#DEFBE6","#D9FBFB","#E5F6FF","#F6F2FF","#FFFFFF","#FFD7D9","#FFD9BD","#FFFFC7","#E2FEC7","#9EF0F0","#CDE1FD","#D4BBFF","#F4F4F4","#FFB3B8","#FF832B","#FFFF00","#A7F0BA","#3DDBD9","#BAE6FF","#8080C0","#E0E0E0","#FF8389","#FC7B1D","#FDDC69","#6FDC8C","#08BDBA","#82CFFF","#8080FF","#C6C6C6","#FA4D56","#EB6200","#F1C21B","#42BE65","#009D9A","#33B1FF","#8000FF","#A8A8A8","#EA3325","#BA4E00","#D2A106","#24A148","#007D79","#78A9FF","#6929C4","#8D8D8D","#DA1E28","#804040","#B28600","#198038","#005D5D","#1192E8","#491D8B","#000000","#A2191F","#5C2800","#8E6A01","#0E6027","#004144","#0072C3","#400080","transparent"];function d(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(d=function(){return!!e})()}var f=function(n){function o(n){var s,i,u,f;e._classCallCheck(this,o),i=this,u=o,f=[n],u=t._getPrototypeOf(u),(s=t._possibleConstructorReturn(i,d()?Reflect.construct(u,f||[],t._getPrototypeOf(i).constructor):u.apply(i,f))).logger=new r.Logger("CC-Color-Picker"),s.colorIndex=0,s.colorsPerRow=n.subPanelData.type===l.WYSIWYG?8:6,s.totalColors=n.subPanelData.type===l.WYSIWYG?c.length:12,s.refss=[];for(var h=0;h<s.totalColors;h++)s.refss.push(a.default.createRef());return s.onClick=s.onClick.bind(s),s.onKeyDown=s.onKeyDown.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){this.setFocus(this.colorIndex)}},{key:"onClick",value:function(e){e.stopPropagation(),this.selectColor(e)}},{key:"onKeyDown",value:function(e){if(i.KeyboardUtils.nextColor(e))e.stopPropagation(),this.colorIndex++,this.colorIndex>this.totalColors-1&&(this.colorIndex=0),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.previousColor(e)){if(e.stopPropagation(),this.colorIndex--,this.colorIndex<0)return void this.props.closeSubPanel();this.setFocus(this.colorIndex)}else if(i.KeyboardUtils.aboveColor(e))e.stopPropagation(),this.colorIndex-=this.colorsPerRow,this.colorIndex<0&&(this.colorIndex+=this.colorsPerRow),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.belowColor(e))e.stopPropagation(),this.colorIndex+=this.colorsPerRow,this.colorIndex>this.totalColors-1&&(this.colorIndex-=this.colorsPerRow),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.selectColor(e))e.stopPropagation(),e.preventDefault(),this.selectColor(e);else if(i.KeyboardUtils.tabKey(e))return e.stopPropagation(),void e.preventDefault()}},{key:"setFocus",value:function(e){this.refss[e].current.focus()}},{key:"selectColor",value:function(e){var t=e.target.dataset.color;this.props.subPanelData.clickActionHandler(t,e),this.props.closeSubPanel()}},{key:"render",value:function(){var e=this;if(this.logger.log("render"),this.props.subPanelData.type===l.WYSIWYG){var t=c.map(function(t,n){var o="color-picker-item"+("transparent"===t?" color-transparent":"");return o+=e.props.subPanelData.selectedColor===t?" selected":"",a.default.createElement("div",{key:"key"+n,ref:e.refss[n],tabIndex:"-1","data-color":t,style:{backgroundColor:t},className:o})}),n=Math.ceil(this.totalColors/this.colorsPerRow),o={width:25*this.colorsPerRow+5,height:25*n+5,paddingBottom:"4px"};return a.default.createElement("div",{className:"color-picker",style:o,tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},t)}return a.default.createElement("div",{className:"color-picker",tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},a.default.createElement("div",{ref:this.refss[0],tabIndex:"-1","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),a.default.createElement("div",{ref:this.refss[1],tabIndex:"-1","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),a.default.createElement("div",{ref:this.refss[2],tabIndex:"-1","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),a.default.createElement("div",{ref:this.refss[3],tabIndex:"-1","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),a.default.createElement("div",{ref:this.refss[4],tabIndex:"-1","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),a.default.createElement("div",{ref:this.refss[5],tabIndex:"-1","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),a.default.createElement("div",{ref:this.refss[6],tabIndex:"-1","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),a.default.createElement("div",{ref:this.refss[7],tabIndex:"-1","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),a.default.createElement("div",{ref:this.refss[8],tabIndex:"-1","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),a.default.createElement("div",{ref:this.refss[9],tabIndex:"-1","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),a.default.createElement("div",{ref:this.refss[10],tabIndex:"-1","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),a.default.createElement("div",{ref:this.refss[11],tabIndex:"-1","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}])}(a.default.Component);function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,o)}return n}function p(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?h(Object(n),!0).forEach(function(t){o._defineProperty(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function b(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(b=function(){return!!e})()}var m=function(n){function o(n){var s,i,r,l;return e._classCallCheck(this,o),i=this,r=o,l=[n],r=t._getPrototypeOf(r),(s=t._possibleConstructorReturn(i,b()?Reflect.construct(r,l||[],t._getPrototypeOf(i).constructor):r.apply(i,l))).state={displaySubMenuAction:""},s.menuRefs=[],s.subMenuRefs=[],s.focusIndex=null,s.subMenuFocusIndex=0,s.onKeyDown=s.onKeyDown.bind(s),s.itemSelected=s.itemSelected.bind(s),s.colorClicked=s.colorClicked.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus()}},{key:"componentDidUpdate",value:function(){this.state.displaySubMenuAction?(this.subMenuFocusIndex=0,"colorBackground"!==this.state.displaySubMenuAction&&this.subMenuRefs[this.state.displaySubMenuAction][this.subMenuFocusIndex].current.focus()):(this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus())}},{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"onKeyDown",value:function(e){if(e.stopPropagation(),e.preventDefault(),i.KeyboardUtils.nextContextMenuOption(e))if(this.state.displaySubMenuAction){var t=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=this.subMenuFocusIndex===t.length-1?0:this.subMenuFocusIndex+1,t[this.subMenuFocusIndex].current.focus()}else this.focusIndex=this.focusIndex===this.menuRefs.length-1?0:this.focusIndex+1,this.menuRefs[this.focusIndex].current.focus();else if(i.KeyboardUtils.previousContextMenuOption(e))if(this.state.displaySubMenuAction){var n=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=0===this.subMenuFocusIndex?n.length-1:this.subMenuFocusIndex-1,n[this.subMenuFocusIndex].current.focus()}else this.focusIndex=0===this.focusIndex?this.menuRefs.length-1:this.focusIndex-1,this.menuRefs[this.focusIndex].current.focus();else if(i.KeyboardUtils.openContextMenuSubMenu(e)){var o=e.target.dataset.action;this.subMenuRefs[o]&&this.subMenuOpen(o)}else if(i.KeyboardUtils.closeContextMenuSubMenu(e)&&this.state.displaySubMenuAction)this.subMenuClose();else if(i.KeyboardUtils.closeContextMenu(e)&&!this.state.displaySubMenuAction)this.props.closeContextMenu();else if(i.KeyboardUtils.activateContextMenuOption(e)){var s=e.target.dataset.action;this.subMenuRefs[s]?this.subMenuOpen(s):this.itemSelected(s)}}},{key:"itemSelected",value:function(e){this.props.contextHandler(e)}},{key:"colorClicked",value:function(e,t){this.props.contextHandler("colorSelectedObjects",t,{color:e})}},{key:"calculateMenuSize",value:function(e){for(var t=0,n=0;n<e.length;++n){e[n].divider&&t++}return{height:30*(e.length-t)+1*t,width:160}}},{key:"calculateMenuPos",value:function(e,t,n){var o={x:e.x,y:e.y};return e.y+t.height>n.height&&(o.y=n.height-t.height-5,o.y<0&&(o.y=0)),e.x+t.width>n.width&&(o.x-=t.width),o.x+=2,o.y+=2,o}},{key:"areAllItemsDisabled",value:function(e){for(var t=!1,n=0;n<e.length;n++)e[n].divider||(e[n].submenu?this.areAllItemsDisabled(e[n].menu)||(t=!0):this.isItemEnabled(e[n])&&(t=!0));return!t}},{key:"isItemEnabled",value:function(e){return void 0===e.enable||!0===e.enable}},{key:"buildMenu",value:function(e,t,n,o){for(var s=[],i=[],r=0,l=!1,u=this.areAllItemsDisabled(e),c=0;c<e.length;++c){var d=void 0;if(e[c].divider)l||(d=a.default.createElement("div",{key:c,className:"context-menu-divider"}),r+=1,l=!0);else{if(l=!1,0===c&&u){var f=a.default.createRef();i.push(f),d=a.default.createElement("div",{key:c,ref:f,tabIndex:0,className:"context-menu-item disabled",onKeyDown:this.onKeyDown,role:"menuitem"},e[c].label)}else if("colorBackground"===e[c].action){var h=!this.isItemEnabled(e[c]),p={width:160,height:50},b=this.buildColorPickerPanel(),m=b.menuItems;this.subMenuRefs[e[c].action]=b.menuRefs,d=this.buildSubMenu(e,c,i,m,r,n,t,p,o,h)}else if(e[c].submenu){var y=this.areAllItemsDisabled(e[c].menu),v=this.calculateMenuSize(e[c].menu),x=this.buildMenu(e[c].menu,t,n,o,100),k=x.menuItems;this.subMenuRefs[e[c].action]=x.menuRefs,d=this.buildSubMenu(e,c,i,k,r,n,t,v,o,y)}else if(!1===e[c].enable)d=a.default.createElement("div",{key:c,className:"context-menu-item disabled",role:"menuitem"},e[c].label);else{var C=this.itemSelected.bind(null,e[c].action),g=a.default.createRef();i.push(g),d=a.default.createElement("div",{key:c,ref:g,tabIndex:-1,"data-action":e[c].action,className:"context-menu-item",onClick:C,onKeyDown:this.onKeyDown,role:"menuitem"},e[c].label)}r+=30}s.push(d)}return{menuItems:s,menuRefs:i}}},{key:"buildColorPickerPanel",value:function(){var e=this,t={clickActionHandler:function(t,n){return e.colorClicked(t,n)},closeSubPanel:function(){return e.subMenuClose()}},n="colorBackground"===this.state.displaySubMenuAction?a.default.createElement(f,{ref:o,subPanelData:t,closeSubPanel:function(){return e.subMenuClose()}}):null,o=a.default.createRef();return{menuItems:[a.default.createElement("div",{key:"color-picker",ref:o,tabIndex:-1},n)],menuRefs:[o]}}},{key:"subMenuOpen",value:function(e){this.setState({displaySubMenuAction:e})}},{key:"subMenuClose",value:function(e){this.setState({displaySubMenuAction:""})}},{key:"buildSubMenu",value:function(e,t,n,o,i,r,l,u,c,d){var f=this.buildRtlState(r,l,u,c),h=this.buildSubMenuPosStyle(i,r,u,c,f),p=e[t],b=a.default.createElement(s.ChevronRight,null),m=a.default.createElement("div",null,p.label,b," "),y="context-menu-item "+(d?" disabled":""),v="context-menu-popover context-menu-submenu"+(this.state.displaySubMenuAction===p.action?" context-menu--visible":""),x=d?null:this.subMenuOpen.bind(this,p.action),k=d?null:this.subMenuClose.bind(this),C=d?null:a.default.createRef();return d||n.push(C),a.default.createElement("div",{key:t,ref:C,className:y,"aria-haspopup":!0,tabIndex:-1,"data-action":p.action,role:"menuitem",onMouseEnter:x,onMouseLeave:k,onKeyDown:this.onKeyDown},m,a.default.createElement("div",{style:h,className:v},o))}},{key:"buildRtlState",value:function(e,t,n,o){return e.x+t.width+n.width>o.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,o,s){var i=o.bottom-(t.y+e+n.height),r={top:(i>0?0:i-5)+"px"};return s&&(r.left="-160px"),r}},{key:"ensureAllSubMenuItemsHaveAction",value:function(e){return e.map(function(e,t){return e.submenu&&void 0===e.action?p(p({},e),{},{action:"submenu_"+t}):e})}},{key:"render",value:function(){var e=this.calculateMenuSize(this.props.menuDefinition),t=this.calculateMenuPos(this.props.mousePos,e,this.props.canvasRect),n={left:t.x+"px",top:t.y+"px"};this.menuRefs=[];var o=this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition),s=this.buildMenu(o,e,t,this.props.canvasRect);return this.menuRefs=s.menuRefs,a.default.createElement("div",{id:"context-menu-popover",role:"menu",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},s.menuItems)}}])}(a.default.Component);function y(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(y=function(){return!!e})()}var v=function(n){function o(n){var s,i,r,l;return e._classCallCheck(this,o),i=this,r=o,l=[n],r=t._getPrototypeOf(r),(s=t._possibleConstructorReturn(i,y()?Reflect.construct(r,l||[],t._getPrototypeOf(i).constructor):r.apply(i,l))).state={},s.contextMenuClicked=s.contextMenuClicked.bind(s),s.handleClickOutside=s.handleClickOutside.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){document.addEventListener("click",this.handleClickOutside,!0)}},{key:"componentWillUnmount",value:function(){document.removeEventListener("click",this.handleClickOutside,!0)}},{key:"getCanvasRect",value:function(){var e=document.getElementById(this.props.containingDivId);if(e){var t=e.getBoundingClientRect();return{top:0,bottom:t.bottom-t.top,left:0,right:t.right-t.left,height:t.height,width:t.width}}return{top:0,bottom:200,left:0,right:50,height:200,width:50}}},{key:"handleClickOutside",value:function(e){e.ctrlKey?e.stopPropagation():this.isOverContextMenu(e)||this.isOverEllipsisButton(e)||(this.props.stopPropagation&&e.stopPropagation(),this.props.closeContextMenu())}},{key:"isOverContextMenu",value:function(e){var t=document.getElementById("context-menu-popover");return!t||t.contains(e.target)}},{key:"isOverEllipsisButton",value:function(e){for(var t=document.getElementsByClassName("d3-node-ellipsis-group"),n=!1,o=0;o<t.length;o++)!1===n&&t[o].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t,n){this.props.contextMenuActionHandler(e,t,n)}},{key:"render",value:function(){return a.default.createElement(m,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos,closeContextMenu:this.props.closeContextMenu})}}])}(a.default.Component);exports.ColorPicker=f,exports.ContextMenuWrapper=v;
-//# sourceMappingURL=context-menu-wrapper-39831e91.js.map
+"use strict";var e=require("./createClass-df7b07d6.js"),t=require("./inherits-74e481d1.js"),n=require("react"),o=require("./defineProperty-d68f985b.js"),s=require("./ChevronRight-3d8ca494.js"),i=require("./keyboard-utils-81dcfd3f.js"),r=require("./canvas-logger-8c01664d.js"),l=require("./common-canvas-utils-272fb8c4.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=u(n),c=["#FFF1F1","#FCEBD6","#FDF4D6","#DEFBE6","#D9FBFB","#E5F6FF","#F6F2FF","#FFFFFF","#FFD7D9","#FFD9BD","#FFFFC7","#E2FEC7","#9EF0F0","#CDE1FD","#D4BBFF","#F4F4F4","#FFB3B8","#FF832B","#FFFF00","#A7F0BA","#3DDBD9","#BAE6FF","#8080C0","#E0E0E0","#FF8389","#FC7B1D","#FDDC69","#6FDC8C","#08BDBA","#82CFFF","#8080FF","#C6C6C6","#FA4D56","#EB6200","#F1C21B","#42BE65","#009D9A","#33B1FF","#8000FF","#A8A8A8","#EA3325","#BA4E00","#D2A106","#24A148","#007D79","#78A9FF","#6929C4","#8D8D8D","#DA1E28","#804040","#B28600","#198038","#005D5D","#1192E8","#491D8B","#000000","#A2191F","#5C2800","#8E6A01","#0E6027","#004144","#0072C3","#400080","transparent"];function d(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(d=function(){return!!e})()}var f=function(n){function o(n){var s,i,u,f;e._classCallCheck(this,o),i=this,u=o,f=[n],u=t._getPrototypeOf(u),(s=t._possibleConstructorReturn(i,d()?Reflect.construct(u,f||[],t._getPrototypeOf(i).constructor):u.apply(i,f))).logger=new r.Logger("CC-Color-Picker"),s.colorIndex=0,s.colorsPerRow=n.subPanelData.type===l.WYSIWYG?8:6,s.totalColors=n.subPanelData.type===l.WYSIWYG?c.length:12,s.refss=[];for(var h=0;h<s.totalColors;h++)s.refss.push(a.default.createRef());return s.onClick=s.onClick.bind(s),s.onKeyDown=s.onKeyDown.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){this.setFocus(this.colorIndex)}},{key:"onClick",value:function(e){e.stopPropagation(),this.selectColor(e)}},{key:"onKeyDown",value:function(e){if(i.KeyboardUtils.nextColor(e))e.stopPropagation(),this.colorIndex++,this.colorIndex>this.totalColors-1&&(this.colorIndex=0),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.previousColor(e)){if(e.stopPropagation(),this.colorIndex--,this.colorIndex<0)return void this.props.closeSubPanel();this.setFocus(this.colorIndex)}else if(i.KeyboardUtils.aboveColor(e))e.stopPropagation(),this.colorIndex-=this.colorsPerRow,this.colorIndex<0&&(this.colorIndex+=this.colorsPerRow),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.belowColor(e))e.stopPropagation(),this.colorIndex+=this.colorsPerRow,this.colorIndex>this.totalColors-1&&(this.colorIndex-=this.colorsPerRow),this.setFocus(this.colorIndex);else if(i.KeyboardUtils.selectColor(e))e.stopPropagation(),e.preventDefault(),this.selectColor(e);else if(i.KeyboardUtils.tabKey(e))return e.stopPropagation(),void e.preventDefault()}},{key:"setFocus",value:function(e){this.refss[e].current.focus()}},{key:"selectColor",value:function(e){var t=e.target.dataset.color;this.props.subPanelData.clickActionHandler(t,e),this.props.closeSubPanel()}},{key:"render",value:function(){var e=this;if(this.logger.log("render"),this.props.subPanelData.type===l.WYSIWYG){var t=c.map(function(t,n){var o="color-picker-item"+("transparent"===t?" color-transparent":"");return o+=e.props.subPanelData.selectedColor===t?" selected":"",a.default.createElement("div",{key:"key"+n,ref:e.refss[n],tabIndex:"-1","data-color":t,style:{backgroundColor:t},className:o})}),n=Math.ceil(this.totalColors/this.colorsPerRow),o={width:25*this.colorsPerRow+5,height:25*n+5,paddingBottom:"4px"};return a.default.createElement("div",{className:"color-picker",style:o,tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},t)}return a.default.createElement("div",{className:"color-picker",tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},a.default.createElement("div",{ref:this.refss[0],tabIndex:"-1","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),a.default.createElement("div",{ref:this.refss[1],tabIndex:"-1","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),a.default.createElement("div",{ref:this.refss[2],tabIndex:"-1","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),a.default.createElement("div",{ref:this.refss[3],tabIndex:"-1","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),a.default.createElement("div",{ref:this.refss[4],tabIndex:"-1","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),a.default.createElement("div",{ref:this.refss[5],tabIndex:"-1","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),a.default.createElement("div",{ref:this.refss[6],tabIndex:"-1","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),a.default.createElement("div",{ref:this.refss[7],tabIndex:"-1","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),a.default.createElement("div",{ref:this.refss[8],tabIndex:"-1","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),a.default.createElement("div",{ref:this.refss[9],tabIndex:"-1","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),a.default.createElement("div",{ref:this.refss[10],tabIndex:"-1","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),a.default.createElement("div",{ref:this.refss[11],tabIndex:"-1","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}])}(a.default.Component);function h(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,o)}return n}function p(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?h(Object(n),!0).forEach(function(t){o._defineProperty(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):h(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function b(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(b=function(){return!!e})()}var m=function(n){function o(n){var s,i,r,l;return e._classCallCheck(this,o),i=this,r=o,l=[n],r=t._getPrototypeOf(r),(s=t._possibleConstructorReturn(i,b()?Reflect.construct(r,l||[],t._getPrototypeOf(i).constructor):r.apply(i,l))).state={displaySubMenuAction:""},s.menuRefs=[],s.subMenuRefs=[],s.focusIndex=null,s.subMenuFocusIndex=0,s.onKeyDown=s.onKeyDown.bind(s),s.itemSelected=s.itemSelected.bind(s),s.colorClicked=s.colorClicked.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus()}},{key:"componentDidUpdate",value:function(){this.state.displaySubMenuAction?(this.subMenuFocusIndex=0,"colorBackground"!==this.state.displaySubMenuAction&&this.subMenuRefs[this.state.displaySubMenuAction][this.subMenuFocusIndex].current.focus()):(this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus())}},{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"onKeyDown",value:function(e){if(e.stopPropagation(),e.preventDefault(),i.KeyboardUtils.nextContextMenuOption(e))if(this.state.displaySubMenuAction){var t=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=this.subMenuFocusIndex===t.length-1?0:this.subMenuFocusIndex+1,t[this.subMenuFocusIndex].current.focus()}else this.focusIndex=this.focusIndex===this.menuRefs.length-1?0:this.focusIndex+1,this.menuRefs[this.focusIndex].current.focus();else if(i.KeyboardUtils.previousContextMenuOption(e))if(this.state.displaySubMenuAction){var n=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=0===this.subMenuFocusIndex?n.length-1:this.subMenuFocusIndex-1,n[this.subMenuFocusIndex].current.focus()}else this.focusIndex=0===this.focusIndex?this.menuRefs.length-1:this.focusIndex-1,this.menuRefs[this.focusIndex].current.focus();else if(i.KeyboardUtils.openContextMenuSubMenu(e)){var o=e.target.dataset.action;this.subMenuRefs[o]&&this.subMenuOpen(o)}else if(i.KeyboardUtils.closeContextMenuSubMenu(e)&&this.state.displaySubMenuAction)this.subMenuClose();else if(i.KeyboardUtils.closeContextMenu(e)&&!this.state.displaySubMenuAction)this.props.closeContextMenu();else if(i.KeyboardUtils.activateContextMenuOption(e)){var s=e.target.dataset.action;this.subMenuRefs[s]?this.subMenuOpen(s):this.itemSelected(s)}}},{key:"itemSelected",value:function(e){this.props.contextHandler(e)}},{key:"colorClicked",value:function(e,t){this.props.contextHandler("colorSelectedObjects",t,{color:e})}},{key:"calculateMenuSize",value:function(e){for(var t=0,n=0;n<e.length;++n){e[n].divider&&t++}return{height:30*(e.length-t)+1*t,width:160}}},{key:"calculateMenuPos",value:function(e,t,n){var o={x:e.x,y:e.y};return e.y+t.height>n.height&&(o.y=n.height-t.height-5,o.y<0&&(o.y=0)),e.x+t.width>n.width&&(o.x-=t.width),o.x+=2,o.y+=2,o}},{key:"areAllItemsDisabled",value:function(e){for(var t=!1,n=0;n<e.length;n++)e[n].divider||(e[n].submenu?this.areAllItemsDisabled(e[n].menu)||(t=!0):this.isItemEnabled(e[n])&&(t=!0));return!t}},{key:"isItemEnabled",value:function(e){return void 0===e.enable||!0===e.enable}},{key:"buildMenu",value:function(e,t,n,o){for(var s=[],i=[],r=0,l=!1,u=this.areAllItemsDisabled(e),c=0;c<e.length;++c){var d=void 0;if(e[c].divider)l||(d=a.default.createElement("div",{key:c,className:"context-menu-divider"}),r+=1,l=!0);else{if(l=!1,0===c&&u){var f=a.default.createRef();i.push(f),d=a.default.createElement("div",{key:c,ref:f,tabIndex:0,className:"context-menu-item disabled",onKeyDown:this.onKeyDown,role:"menuitem"},e[c].label)}else if("colorBackground"===e[c].action){var h=!this.isItemEnabled(e[c]),p={width:160,height:50},b=this.buildColorPickerPanel(),m=b.menuItems;this.subMenuRefs[e[c].action]=b.menuRefs,d=this.buildSubMenu(e,c,i,m,r,n,t,p,o,h)}else if(e[c].submenu){var y=this.areAllItemsDisabled(e[c].menu),v=this.calculateMenuSize(e[c].menu),x=this.buildMenu(e[c].menu,t,n,o,100),k=x.menuItems;this.subMenuRefs[e[c].action]=x.menuRefs,d=this.buildSubMenu(e,c,i,k,r,n,t,v,o,y)}else if(!1===e[c].enable)d=a.default.createElement("div",{key:c,className:"context-menu-item disabled",role:"menuitem"},e[c].label);else{var C=this.itemSelected.bind(null,e[c].action),g=a.default.createRef();i.push(g),d=a.default.createElement("div",{key:c,ref:g,tabIndex:-1,"data-action":e[c].action,className:"context-menu-item",onClick:C,onKeyDown:this.onKeyDown,role:"menuitem"},e[c].label)}r+=30}s.push(d)}return{menuItems:s,menuRefs:i}}},{key:"buildColorPickerPanel",value:function(){var e=this,t={clickActionHandler:function(t,n){return e.colorClicked(t,n)},closeSubPanel:function(){return e.subMenuClose()}},n="colorBackground"===this.state.displaySubMenuAction?a.default.createElement(f,{ref:o,subPanelData:t,closeSubPanel:function(){return e.subMenuClose()}}):null,o=a.default.createRef();return{menuItems:[a.default.createElement("div",{key:"color-picker",ref:o,tabIndex:-1},n)],menuRefs:[o]}}},{key:"subMenuOpen",value:function(e){this.setState({displaySubMenuAction:e})}},{key:"subMenuClose",value:function(e){this.setState({displaySubMenuAction:""})}},{key:"buildSubMenu",value:function(e,t,n,o,i,r,l,u,c,d){var f=this.buildRtlState(r,l,u,c),h=this.buildSubMenuPosStyle(i,r,u,c,f),p=e[t],b=a.default.createElement(s.ChevronRight,null),m=a.default.createElement("div",null,p.label,b," "),y="context-menu-item "+(d?" disabled":""),v="context-menu-popover context-menu-submenu"+(this.state.displaySubMenuAction===p.action?" context-menu--visible":""),x=d?null:this.subMenuOpen.bind(this,p.action),k=d?null:this.subMenuClose.bind(this),C=d?null:a.default.createRef();return d||n.push(C),a.default.createElement("div",{key:t,ref:C,className:y,"aria-haspopup":!0,tabIndex:-1,"data-action":p.action,role:"menuitem",onMouseEnter:x,onMouseLeave:k,onKeyDown:this.onKeyDown},m,a.default.createElement("div",{style:h,className:v},o))}},{key:"buildRtlState",value:function(e,t,n,o){return e.x+t.width+n.width>o.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,o,s){var i=o.bottom-(t.y+e+n.height),r={top:(i>0?0:i-5)+"px"};return s&&(r.left="-160px"),r}},{key:"ensureAllSubMenuItemsHaveAction",value:function(e){return e.map(function(e,t){return e.submenu&&void 0===e.action?p(p({},e),{},{action:"submenu_"+t}):e})}},{key:"render",value:function(){var e=this.calculateMenuSize(this.props.menuDefinition),t=this.calculateMenuPos(this.props.mousePos,e,this.props.canvasRect),n={left:t.x+"px",top:t.y+"px"};this.menuRefs=[];var o=this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition),s=this.buildMenu(o,e,t,this.props.canvasRect);return this.menuRefs=s.menuRefs,a.default.createElement("div",{id:"context-menu-popover",role:"menu",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},s.menuItems)}}])}(a.default.Component);function y(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(y=function(){return!!e})()}var v=function(n){function o(n){var s,i,r,l;return e._classCallCheck(this,o),i=this,r=o,l=[n],r=t._getPrototypeOf(r),(s=t._possibleConstructorReturn(i,y()?Reflect.construct(r,l||[],t._getPrototypeOf(i).constructor):r.apply(i,l))).state={},s.contextMenuClicked=s.contextMenuClicked.bind(s),s.handleClickOutside=s.handleClickOutside.bind(s),s}return t._inherits(o,n),e._createClass(o,[{key:"componentDidMount",value:function(){document.addEventListener("click",this.handleClickOutside,!0)}},{key:"componentWillUnmount",value:function(){document.removeEventListener("click",this.handleClickOutside,!0)}},{key:"getCanvasRect",value:function(){var e=document.getElementById(this.props.containingDivId);if(e){var t=e.getBoundingClientRect();return{top:0,bottom:t.bottom-t.top,left:0,right:t.right-t.left,height:t.height,width:t.width}}return{top:0,bottom:200,left:0,right:50,height:200,width:50}}},{key:"handleClickOutside",value:function(e){e.ctrlKey?e.stopPropagation():this.isOverContextMenu(e)||this.isOverEllipsisButton(e)||(this.props.stopPropagation&&e.stopPropagation(),this.props.closeContextMenu())}},{key:"isOverContextMenu",value:function(e){var t=document.getElementById("context-menu-popover");return!t||t.contains(e.target)}},{key:"isOverEllipsisButton",value:function(e){for(var t=document.getElementsByClassName("d3-node-ellipsis-group"),n=!1,o=0;o<t.length;o++)!1===n&&t[o].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t,n){this.props.contextMenuActionHandler(e,t,n)}},{key:"render",value:function(){return a.default.createElement(m,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos,closeContextMenu:this.props.closeContextMenu})}}])}(a.default.Component);exports.ColorPicker=f,exports.ContextMenuWrapper=v;
+//# sourceMappingURL=context-menu-wrapper-0fdb9b4c.js.map

package/dist/{context-menu-wrapper-39831e91.js.map → context-menu-wrapper-0fdb9b4c.js.map}

@@ -1 +1 @@
-{"version":3,"file":"context-menu-wrapper-39831e91.js","sources":["../src/color-picker/color-set.js","../src/color-picker/color-picker.jsx","../src/context-menu/common-context-menu.jsx","../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2024 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// This is the set of colors for the WYSIWYG comments color palette used for\n// both text coloring and background coloring.\n\nconst colorArray = [\n\t\"#FFF1F1\", // Red\n\t\"#FCEBD6\", // Orange\n\t\"#FDF4D6\", // Yellow\n\t\"#DEFBE6\", // Green\n\t\"#D9FBFB\", // Teal\n\t\"#E5F6FF\", // Blue\n\t\"#F6F2FF\", // Purple\n\t\"#FFFFFF\", // Gray\n\n\t\"#FFD7D9\", // Red\n\t\"#FFD9BD\", // Orange\n\t\"#FFFFC7\", // Yellow\n\t\"#E2FEC7\", // Green\n\t\"#9EF0F0\", // Teal\n\t\"#CDE1FD\", // Blue\n\t\"#D4BBFF\", // Purple\n\t\"#F4F4F4\", // Gray\n\n\t\"#FFB3B8\", // Red\n\t\"#FF832B\", // Orange\n\t\"#FFFF00\", // Yellow\n\t\"#A7F0BA\", // Green\n\t\"#3DDBD9\", // Teal\n\t\"#BAE6FF\", // Blue\n\t\"#8080C0\", // Purple\n\t\"#E0E0E0\", // Gray\n\n\t\"#FF8389\", // Red\n\t\"#FC7B1D\", // Orange\n\t\"#FDDC69\", // Yellow\n\t\"#6FDC8C\", // Green\n\t\"#08BDBA\", // Teal\n\t\"#82CFFF\", // Blue\n\t\"#8080FF\", // Purple\n\t\"#C6C6C6\", // Gray\n\n\t\"#FA4D56\", // Red\n\t\"#EB6200\", // Orange\n\t\"#F1C21B\", // Yellow\n\t\"#42BE65\", // Green\n\t\"#009D9A\", // Teal\n\t\"#33B1FF\", // Blue\n\t\"#8000FF\", // Purple\n\t\"#A8A8A8\", // Gray\n\n\t\"#EA3325\", // Red\n\t\"#BA4E00\", // Orange\n\t\"#D2A106\", // Yellow\n\t\"#24A148\", // Green\n\t\"#007D79\", // Teal\n\t\"#78A9FF\", // Blue\n\t\"#6929C4\", // Purple\n\t\"#8D8D8D\", // Gray\n\n\t\"#DA1E28\", // Red\n\t\"#804040\", // Orange\n\t\"#B28600\", // Yellow\n\t\"#198038\", // Green\n\t\"#005D5D\", // Teal\n\t\"#1192E8\", // Blue\n\t\"#491D8B\", // Purple\n\t\"#000000\", // Gray\n\n\t\"#A2191F\", // Red\n\t\"#5C2800\", // Orange\n\t\"#8E6A01\", // Yellow\n\t\"#0E6027\", // Green\n\t\"#004144\", // Teal\n\t\"#0072C3\", // Blue\n\t\"#400080\", // Purple\n\t\"transparent\" // Gray\n];\nexport default colorArray;\n","/*\n * Copyright 2017-2024 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport KeyboardUtils from \"../common-canvas/keyboard-utils.js\";\nimport Logger from \"../logging/canvas-logger.js\";\nimport colorSetArray from \"./color-set.js\";\nimport { WYSIWYG } from \"../common-canvas/constants/canvas-constants.js\";\n\n// These dimensions should match the values in color-picker.scss\nconst COLOR_DIMENSION = 20;\nconst COLOR_PADDING = 5;\nconst COLOR_DIM_PLUS_PAD = COLOR_DIMENSION + COLOR_PADDING;\n\n\n// These values must reflect the layout of the color picker panel\n// described by the SCSS/CSS.\n\nclass ColorPicker extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-Color-Picker\");\n\n\t\tthis.colorIndex = 0;\n\n\t\tthis.colorsPerRow = props.subPanelData.type === WYSIWYG ? 8 : 6;\n\t\tthis.totalColors = props.subPanelData.type === WYSIWYG ? colorSetArray.length : 12;\n\n\t\tthis.refss = [];\n\t\tfor (let i = 0; i < this.totalColors; i++) {\n\t\t\tthis.refss.push(React.createRef());\n\t\t}\n\t\tthis.onClick = this.onClick.bind(this);\n\t\tthis.onKeyDown = this.onKeyDown.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.setFocus(this.colorIndex);\n\t}\n\n\tonClick(evt) {\n\t\tevt.stopPropagation();\n\t\tthis.selectColor(evt);\n\t}\n\n\tonKeyDown(evt) {\n\t\tif (KeyboardUtils.nextColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex++;\n\t\t\tif (this.colorIndex > this.totalColors - 1) {\n\t\t\t\tthis.colorIndex = 0;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.previousColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex--;\n\t\t\tif (this.colorIndex < 0) {\n\t\t\t\tthis.props.closeSubPanel();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.aboveColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex -= this.colorsPerRow;\n\t\t\tif (this.colorIndex < 0) {\n\t\t\t\tthis.colorIndex += this.colorsPerRow;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.belowColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex += this.colorsPerRow;\n\t\t\tif (this.colorIndex > this.totalColors - 1) {\n\t\t\t\tthis.colorIndex -= this.colorsPerRow;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.selectColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tevt.preventDefault();\n\t\t\tthis.selectColor(evt);\n\n\t\t} else if (KeyboardUtils.tabKey(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tevt.preventDefault();\n\t\t\treturn;\n\t\t}\n\t}\n\n\tsetFocus(index) {\n\t\tthis.refss[index].current.focus();\n\t}\n\n\tselectColor(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.subPanelData.clickActionHandler(color, evt);\n\t\tthis.props.closeSubPanel();\n\t}\n\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\tif (this.props.subPanelData.type === WYSIWYG) {\n\n\t\t\tconst colorDivs = colorSetArray.map((c, i) => {\n\t\t\t\tlet className = \"color-picker-item\" + (c === \"transparent\" ? \" color-transparent\" : \"\");\n\t\t\t\tclassName += this.props.subPanelData.selectedColor === c ? \" selected\" : \"\";\n\n\t\t\t\treturn (<div key={\"key\" + i} ref={this.refss[i]} tabIndex={\"-1\"}\n\t\t\t\t\tdata-color={c}\n\t\t\t\t\tstyle={{ backgroundColor: c }}\n\t\t\t\t\tclassName={className}\n\t\t\t\t/>);\n\t\t\t});\n\n\t\t\tconst rowCount = Math.ceil(this.totalColors / this.colorsPerRow);\n\n\t\t\tconst style = {\n\t\t\t\twidth: (this.colorsPerRow * COLOR_DIM_PLUS_PAD) + COLOR_PADDING,\n\t\t\t\theight: (rowCount * COLOR_DIM_PLUS_PAD) + COLOR_PADDING,\n\t\t\t\tpaddingBottom: \"4px\"\n\t\t\t};\n\n\t\t\treturn (\n\t\t\t\t<div className=\"color-picker\" style={style} tabIndex={\"-1\"} onClick={this.onClick} onKeyDown={this.onKeyDown}>\n\t\t\t\t\t{colorDivs}\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<div className=\"color-picker\" tabIndex={\"-1\"} onClick={this.onClick} onKeyDown={this.onKeyDown}>\n\t\t\t\t<div ref={this.refss[0]} tabIndex={\"-1\"} data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div ref={this.refss[1]} tabIndex={\"-1\"} data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div ref={this.refss[2]} tabIndex={\"-1\"} data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div ref={this.refss[3]} tabIndex={\"-1\"} data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div ref={this.refss[4]} tabIndex={\"-1\"} data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div ref={this.refss[5]} tabIndex={\"-1\"} data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div ref={this.refss[6]} tabIndex={\"-1\"} data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div ref={this.refss[7]} tabIndex={\"-1\"} data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div ref={this.refss[8]} tabIndex={\"-1\"} data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div ref={this.refss[9]} tabIndex={\"-1\"} data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div ref={this.refss[10]} tabIndex={\"-1\"} data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div ref={this.refss[11]} tabIndex={\"-1\"} data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nColorPicker.propTypes = {\n\tcloseSubPanel: PropTypes.func,\n\tsubPanelData: PropTypes.object\n};\n\nexport default ColorPicker;\n","/*\n * Copyright 2017-2026 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/* eslint no-empty-function: [\"error\", { \"allow\": [\"arrowFunctions\"] }] */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\n// Carbon icons - direct imports for tree-shaking optimization\nimport ChevronRight from \"@carbon/icons-react/lib/ChevronRight\";\nimport ColorPicker from \"../color-picker\";\nimport KeyboardUtils from \"../common-canvas/keyboard-utils\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // See context-menu.scss\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // See context-menu.scss\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // See context-menu.scss\nconst EXTRA_OFFSET = 5; // Extra offset for vertical menu positioning\n\n\nclass CommonContextMenu extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tdisplaySubMenuAction: \"\"\n\t\t};\n\t\tthis.menuRefs = [];\n\t\tthis.subMenuRefs = [];\n\n\t\tthis.focusIndex = null; // Set to null so we know when it is not initialized.\n\t\tthis.subMenuFocusIndex = 0;\n\n\t\tthis.onKeyDown = this.onKeyDown.bind(this);\n\t\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.focusIndex = this.focusIndex === null ? 0 : this.focusIndex;\n\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t}\n\n\tcomponentDidUpdate() {\n\t\tif (this.state.displaySubMenuAction) {\n\t\t\tthis.subMenuFocusIndex = 0;\n\t\t\tif (this.state.displaySubMenuAction !== \"colorBackground\") {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\t\t\t}\n\n\t\t} else {\n\t\t\tthis.focusIndex = this.focusIndex === null ? 0 : this.focusIndex;\n\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t}\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\tonKeyDown(evt) {\n\t\t// Don't let keyboard event go through to other objects.\n\t\tevt.stopPropagation();\n\t\tevt.preventDefault();\n\n\t\tif (KeyboardUtils.nextContextMenuOption(evt)) {\n\t\t\tif (this.state.displaySubMenuAction) {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tthis.subMenuFocusIndex = this.subMenuFocusIndex === subMenuRefs.length - 1 ? 0 : this.subMenuFocusIndex + 1;\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\n\t\t\t} else {\n\t\t\t\tthis.focusIndex = this.focusIndex === this.menuRefs.length - 1 ? 0 : this.focusIndex + 1;\n\t\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.previousContextMenuOption(evt)) {\n\t\t\tif (this.state.displaySubMenuAction) {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tthis.subMenuFocusIndex = this.subMenuFocusIndex === 0 ? subMenuRefs.length - 1 : this.subMenuFocusIndex - 1;\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\n\t\t\t} else {\n\t\t\t\tthis.focusIndex = this.focusIndex === 0 ? this.menuRefs.length - 1 : this.focusIndex - 1;\n\t\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.openContextMenuSubMenu(evt)) {\n\t\t\tconst action = evt.target.dataset.action;\n\t\t\tif (this.subMenuRefs[action]) {\n\t\t\t\tthis.subMenuOpen(action);\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.closeContextMenuSubMenu(evt) &&\n\t\t\t\t\tthis.state.displaySubMenuAction) {\n\t\t\tthis.subMenuClose();\n\n\t\t} else if (KeyboardUtils.closeContextMenu(evt) &&\n\t\t\t\t\t!this.state.displaySubMenuAction) {\n\t\t\tthis.props.closeContextMenu();\n\n\t\t} else if (KeyboardUtils.activateContextMenuOption(evt)) {\n\t\t\tconst action = evt.target.dataset.action;\n\t\t\tif (this.subMenuRefs[action]) {\n\t\t\t\tthis.subMenuOpen(action);\n\n\t\t\t} else {\n\t\t\t\tthis.itemSelected(action);\n\t\t\t}\n\t\t}\n\t}\n\n\titemSelected(data) {\n\t\tthis.props.contextHandler(data);\n\t}\n\n\tcolorClicked(color, evt) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", evt, { color });\n\t}\n\n\t// Returns the size of the menu passed in.\n\tcalculateMenuSize(menu) {\n\t\tvar numDividers = 0;\n\t\tfor (let i = 0; i < menu.length; ++i) {\n\t\t\tconst divider = menu[i].divider;\n\t\t\tif (divider) {\n\t\t\t\tnumDividers++;\n\t\t\t}\n\t\t}\n\n\t\tvar menuSize = {\n\t\t\theight: ((menu.length - numDividers) * CONTEXT_MENU_LINK_HEIGHT) + (numDividers * CONTEXT_MENU_DIVIDER_HEIGHT),\n\t\t\twidth: CONTEXT_MENU_WIDTH\n\t\t};\n\n\t\treturn menuSize;\n\t}\n\n\t// Returns a new position and the canvas rectangle for the context menu based on the current\n\t// mouse position and whether the menu would appear outside the edges of the page.\n\tcalculateMenuPos(mousePos, menuSize, canvasRect) {\n\t\tconst menuPos = { x: mousePos.x, y: mousePos.y };\n\n\t\t// Reposition contextMenu if it will show off the bottom of the page\n\t\tif (mousePos.y + menuSize.height > canvasRect.height) {\n\t\t\tmenuPos.y = canvasRect.height - menuSize.height - EXTRA_OFFSET; // Move up by extra offset so it looks nice\n\n\t\t\t// If repositioning the menu would push it off the top of the page\n\t\t\t// (in very short browser windows) position it at the top.\n\t\t\tif (menuPos.y < 0) {\n\t\t\t\tmenuPos.y = 0;\n\t\t\t}\n\t\t}\n\n\t\t// Reposition contextMenu if it will show off the right of the page\n\t\tif (mousePos.x + menuSize.width > canvasRect.width) {\n\t\t\tmenuPos.x -= menuSize.width;\n\t\t}\n\n\t\t// Add two pixels to x and y because on Chrome without this the context menu\n\t\t// appears with  the top corner of the first menu item under the mouse\n\t\t// cursor. This highlights the first menu item (which looks weird) and, if\n\t\t// the first item is a cascade menu, automatically opens the sub-menu.\n\t\tmenuPos.x += 2;\n\t\tmenuPos.y += 2;\n\n\t\treturn menuPos;\n\t}\n\n\t// Returns true if all the items in a menu (or sub-menu) are disabled.\n\tareAllItemsDisabled(menuItems) {\n\t\tlet isEnabled = false;\n\n\t\tfor (let i = 0; i < menuItems.length; i++) {\n\t\t\tif (!menuItems[i].divider) {\n\t\t\t\tif (menuItems[i].submenu) {\n\t\t\t\t\tif (!this.areAllItemsDisabled(menuItems[i].menu)) {\n\t\t\t\t\t\tisEnabled = true;\n\t\t\t\t\t}\n\n\t\t\t\t} else if (this.isItemEnabled(menuItems[i])) {\n\t\t\t\t\tisEnabled = true;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn !isEnabled;\n\t}\n\n\t// Returns true if the menu item passed is enabled. The absence of the\n\t// 'enable' property default to true.\n\tisItemEnabled(item) {\n\t\treturn (typeof item.enable === \"undefined\" || item.enable === true);\n\t}\n\n\t// Builds a new menu based on the menu definition passed in.\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst menuItems = [];\n\t\tconst menuRefs = [];\n\n\t\tlet runningYPos = 0;\n\n\t\t// Records if we have just displayed a divider. This is useful because we\n\t\t// only want to display one divider if there is a divider element\n\t\t// immediately after another divider element in the menuDefinition array.\n\t\tlet previousDivider = false;\n\n\t\tconst allItemsDisabled = this.areAllItemsDisabled(menuDefinition);\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tlet menuItem;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItem = <div key={i} className={\"context-menu-divider\"} />;\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\n\t\t\t\t// Special case, when all menu items are disabled, it allows the topmost\n\t\t\t\t// disabled item to receive focus, even though it is disabled, so the\n\t\t\t\t// keyboard user can close the menu using ESC.\n\t\t\t\tif (i === 0 && allItemsDisabled) {\n\t\t\t\t\tconst ref = React.createRef();\n\t\t\t\t\tmenuRefs.push(ref);\n\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} ref={ref} tabIndex={0} className={\"context-menu-item disabled\"} onKeyDown={this.onKeyDown} role=\"menuitem\">\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\n\t\t\t\t} else if (menuDefinition[i].action === \"colorBackground\") {\n\t\t\t\t\tconst disabled = !this.isItemEnabled(menuDefinition[i]);\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuInfo = this.buildColorPickerPanel();\n\t\t\t\t\tconst subMenuContent = subMenuInfo.menuItems;\n\t\t\t\t\tthis.subMenuRefs[menuDefinition[i].action] = subMenuInfo.menuRefs;\n\n\t\t\t\t\tmenuItem = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, menuRefs, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\n\n\t\t\t\t} else if (menuDefinition[i].submenu) {\n\t\t\t\t\tconst disabled = this.areAllItemsDisabled(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuInfo = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect, 100);\n\t\t\t\t\tconst subMenuContent = subMenuInfo.menuItems;\n\t\t\t\t\tthis.subMenuRefs[menuDefinition[i].action] = subMenuInfo.menuRefs;\n\n\t\t\t\t\tmenuItem = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, menuRefs, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\n\t\t\t\t} else if (menuDefinition[i].enable === false) {\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} className={\"context-menu-item disabled\"} role=\"menuitem\">\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\n\t\t\t\t} else {\n\t\t\t\t\tconst onClickFunction = this.itemSelected.bind(null, menuDefinition[i].action);\n\t\t\t\t\tconst ref = React.createRef();\n\t\t\t\t\tmenuRefs.push(ref);\n\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} ref={ref} tabIndex={-1} data-action={menuDefinition[i].action}\n\t\t\t\t\t\t\tclassName={\"context-menu-item\"} onClick={onClickFunction} onKeyDown={this.onKeyDown} role=\"menuitem\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t\tmenuItems.push(menuItem);\n\t\t}\n\t\treturn { menuItems, menuRefs };\n\t}\n\n\tbuildColorPickerPanel() {\n\t\tconst subPanelData = {\n\t\t\tclickActionHandler: (c, evt) => this.colorClicked(c, evt),\n\t\t\tcloseSubPanel: () => this.subMenuClose()\n\t\t};\n\t\t// Only create the color picker when we are actually displaying it in the sub-menu.\n\t\t// That way the color picker will set focus on itself when it is opened.\n\t\tconst colorPicker = this.state.displaySubMenuAction === \"colorBackground\"\n\t\t\t? <ColorPicker ref={ref} subPanelData={subPanelData} closeSubPanel={() => this.subMenuClose()} />\n\t\t\t: null;\n\n\t\tconst ref = React.createRef();\n\n\t\tconst content = (\n\t\t\t<div key={\"color-picker\"} ref={ref} tabIndex={-1}>\n\t\t\t\t{colorPicker}\n\t\t\t</div>\n\t\t);\n\n\t\treturn { menuItems: [content], menuRefs: [ref] };\n\t}\n\n\tsubMenuOpen(action) {\n\t\tthis.setState({ displaySubMenuAction: action });\n\t}\n\n\tsubMenuClose(action) {\n\t\tthis.setState({ displaySubMenuAction: \"\" });\n\t}\n\n\t// Builds a sub-menu for the menuitem identified by the index into the menu definition.\n\tbuildSubMenu(menuDefinition, index, menuRefs, subMenuContent, runningYPos, menuPos,\n\t\tmenuSize, subMenuSize, canvasRect, disabled) {\n\t\tconst rtl = this.buildRtlState(menuPos, menuSize, subMenuSize, canvasRect);\n\t\tconst subMenuPosStyle = this.buildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect, rtl);\n\t\tconst menuItem = menuDefinition[index];\n\n\t\tconst icon = (<ChevronRight />);\n\t\tconst menuItemContent = <div>{menuItem.label}{icon} </div>;\n\t\tconst menuItemClass = \"context-menu-item \" + (disabled ? \" disabled\" : \"\");\n\t\tconst subMenuClass = \"context-menu-popover context-menu-submenu\" +\n\t\t\t(this.state.displaySubMenuAction === menuItem.action ? \" context-menu--visible\" : \"\");\n\t\tconst onMouseEnter = (disabled ? null : this.subMenuOpen.bind(this, menuItem.action));\n\t\tconst onMouseLeave = (disabled ? null : this.subMenuClose.bind(this));\n\n\t\tconst ref = disabled ? null : React.createRef();\n\t\tif (!disabled) {\n\t\t\tmenuRefs.push(ref);\n\t\t}\n\n\t\treturn (\n\t\t\t<div key={index} ref={ref} className={menuItemClass} aria-haspopup tabIndex={-1} data-action={menuItem.action} role=\"menuitem\"\n\t\t\t\tonMouseEnter={onMouseEnter}\n\t\t\t\tonMouseLeave={onMouseLeave}\n\t\t\t\tonKeyDown={this.onKeyDown}\n\t\t\t>\n\t\t\t\t{menuItemContent}\n\t\t\t\t<div style={subMenuPosStyle} className={subMenuClass}>\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Returns a boolean to indicate whether the submenu should appear on the\n\t// right of the context menu (rtl === false) or on the left of the context\n\t// menu (rtl === true).\n\tbuildRtlState(menuPos, menuSize, subMenuSize, canvasRect) {\n\t\t// Ensure that the combined menu position, plus the menu width,\n\t\t//  plus the submenu width, does not exceed the viewport bounds.\n\t\treturn (menuPos.x + menuSize.width + subMenuSize.width > canvasRect.right);\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust its:\n\t// * vertical (y) position: If the submenu is tall enough that it would be\n\t// displayed off the bottom of the canvas area.\n\t// * horizontal (x) position: If the sub-menu needs to appear on the left\n\t// side of the main menu (rtl === true).\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect, rtl) {\n\t\t// Does the submenu go below the bottom of the viewport?\n\t\tconst y = canvasRect.bottom - (menuPos.y + runningYPos + subMenuSize.height);\n\n\t\t// If submenu is not below the viewport bottom set offset to 0 so the\n\t\t// submenu will not be moved. Otherwise, y will be used to move the\n\t\t// submenu up fully into the view port.\n\t\tconst offset = (y > 0) ? 0 : y - EXTRA_OFFSET;\n\n\t\tconst subMenuPosStyle = {\n\t\t\ttop: offset + \"px\" // Use negative to push the menu up\n\t\t};\n\n\t\tif (rtl) {\n\t\t\tsubMenuPosStyle.left = -CONTEXT_MENU_WIDTH + \"px\";\n\t\t}\n\n\t\treturn subMenuPosStyle;\n\t}\n\n\t// Returns the menu definition array passed in making sure any\n\t// submenu items have an action. Note: some applications forget\n\t// to provide an action because, for the submenu, it is only\n\t// used by the context menu code.\n\tensureAllSubMenuItemsHaveAction(menuDef) {\n\t\treturn menuDef.map((item, index) => {\n\t\t\tif (item.submenu && typeof item.action === \"undefined\") {\n\t\t\t\treturn { ...item, action: \"submenu_\" + index };\n\t\t\t}\n\t\t\treturn item;\n\t\t});\n\t}\n\n\trender() {\n\t\t// Reposition contextMenu so that it does not show off the screen\n\t\tconst menuSize = this.calculateMenuSize(this.props.menuDefinition);\n\t\tconst menuPos = this.calculateMenuPos(this.props.mousePos, menuSize, this.props.canvasRect);\n\t\tconst posStyle = {\n\t\t\tleft: menuPos.x + \"px\",\n\t\t\ttop: menuPos.y + \"px\"\n\t\t};\n\n\t\tthis.menuRefs = [];\n\t\tconst menuDefinition = this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition);\n\t\tconst menuInfo = this.buildMenu(menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\t\tthis.menuRefs = menuInfo.menuRefs;\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" role=\"menu\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuInfo.menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: PropTypes.func.isRequired,\n\tcloseContextMenu: PropTypes.func.isRequired,\n\tmenuDefinition: PropTypes.array.isRequired,\n\tcanvasRect: PropTypes.object.isRequired,\n\tmousePos: PropTypes.object.isRequired\n};\n\nexport default CommonContextMenu;\n","/*\n * Copyright 2017-2023 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport CommonContextMenu from \"./common-context-menu.jsx\";\n\nexport default class ContextMenuWrapper extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {};\n\n\t\tthis.contextMenuClicked = this.contextMenuClicked.bind(this);\n\t\tthis.handleClickOutside = this.handleClickOutside.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tdocument.addEventListener(\"click\", this.handleClickOutside, true);\n\t}\n\n\tcomponentWillUnmount() {\n\t\tdocument.removeEventListener(\"click\", this.handleClickOutside, true);\n\t}\n\n\t// Returns an object that describes the dimensions of a rectangle for the\n\t// canvas div with coordinates based on the top left corner of the div. This\n\t// will match the coordinates for the mouse position where the user clicked,\n\t// which is specified in this.props.contextMenuPos object.\n\tgetCanvasRect() {\n\t\tconst containingDiv = document.getElementById(this.props.containingDivId);\n\t\tif (containingDiv) {\n\t\t\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\t\treturn {\n\t\t\t\ttop: 0,\n\t\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\t\tleft: 0,\n\t\t\t\tright: clientRect.right - clientRect.left,\n\t\t\t\theight: clientRect.height,\n\t\t\t\twidth: clientRect.width\n\t\t\t};\n\t\t}\n\t\t// Assist Jests tests to run when containingDiv is not available.\n\t\treturn { top: 0, bottom: 200, left: 0, right: 50, height: 200, width: 50 };\n\t}\n\n\thandleClickOutside(e) {\n\t\t// On Safari, when a user is displaying the context menu with a ctrl-click\n\t\t// (which is a supported context menu gesture on the Mac) a secondary click\n\t\t// event is emitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwise, if we continue, the context menu will\n\t\t// be closed.\n\t\tif (e.ctrlKey) {\n\t\t\te.stopPropagation();\n\t\t\treturn;\n\t\t}\n\n\t\t// If the click was anywhere outside the context menu and\n\t\t// the ellipsis button we just close the menu.\n\t\tif (!this.isOverContextMenu(e) && !this.isOverEllipsisButton(e)) {\n\t\t\t// This stop propagation is needed in common canvas so that selected nodes will\n\t\t\t// remain selected even after clicking outside the context menu to close the menu.\n\t\t\tif (this.props.stopPropagation) {\n\t\t\t\te.stopPropagation();\n\t\t\t}\n\t\t\tthis.props.closeContextMenu();\n\t\t}\n\t}\n\n\t// Returns true if the event occurred over the context menu.\n\tisOverContextMenu(e) {\n\t\tconst domNode = document.getElementById(\"context-menu-popover\");\n\t\treturn !domNode || domNode.contains(e.target);\n\t}\n\n\t// Returns true if the event occurred over the ellipsis button. Typically\n\t// there will be only one ellipsis button on the canvas, since they are only\n\t// displayed on hover, but in some test circumstances there might be more\n\t// than one.\n\tisOverEllipsisButton(e) {\n\t\tconst ellipsisNodes = document.getElementsByClassName(\"d3-node-ellipsis-group\");\n\t\tlet state = false;\n\t\tfor (let i = 0; i < ellipsisNodes.length; i++) {\n\t\t\tif (state === false && ellipsisNodes[i].contains(e.target)) {\n\t\t\t\tstate = true;\n\t\t\t}\n\t\t}\n\t\treturn state;\n\t}\n\n\tcontextMenuClicked(action, evt, param) {\n\t\tthis.props.contextMenuActionHandler(action, evt, param);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<CommonContextMenu\n\t\t\t\tcontextHandler={this.contextMenuClicked}\n\t\t\t\tmenuDefinition={this.props.contextMenuDef}\n\t\t\t\tcanvasRect={this.getCanvasRect()}\n\t\t\t\tmousePos={this.props.contextMenuPos}\n\t\t\t\tcloseContextMenu={this.props.closeContextMenu}\n\t\t\t/>\n\t\t);\n\t}\n}\n\nContextMenuWrapper.propTypes = {\n\tcontextMenuDef: PropTypes.array.isRequired,\n\tcontainingDivId: PropTypes.string.isRequired,\n\tcontextMenuPos: PropTypes.object.isRequired,\n\tcontextMenuActionHandler: PropTypes.func.isRequired,\n\tcloseContextMenu: PropTypes.func.isRequired,\n\tstopPropagation: PropTypes.bool\n};\n"],"names":["colorSetArray","ColorPicker$1","_React$Component","ColorPicker","props","_this","_classCallCheck","logger","Logger","colorIndex","colorsPerRow","subPanelData","type","WYSIWYG","totalColors","length","refss","i","push","React","createRef","onClick","bind","onKeyDown","_inherits","_createClass","key","value","this","setFocus","evt","stopPropagation","selectColor","KeyboardUtils","nextColor","previousColor","closeSubPanel","aboveColor","belowColor","preventDefault","tabKey","index","current","focus","color","target","dataset","clickActionHandler","_this2","log","colorDivs","map","c","className","selectedColor","createElement","ref","tabIndex","style","backgroundColor","rowCount","Math","ceil","width","COLOR_DIMENSION","height","paddingBottom","Component","CommonContextMenu$1","CommonContextMenu","state","displaySubMenuAction","menuRefs","subMenuRefs","focusIndex","subMenuFocusIndex","itemSelected","colorClicked","e","nextContextMenuOption","previousContextMenuOption","openContextMenuSubMenu","action","subMenuOpen","closeContextMenuSubMenu","subMenuClose","closeContextMenu","activateContextMenuOption","data","contextHandler","menu","numDividers","divider","mousePos","menuSize","canvasRect","menuPos","x","y","menuItems","isEnabled","submenu","areAllItemsDisabled","isItemEnabled","item","enable","menuDefinition","runningYPos","previousDivider","allItemsDisabled","menuItem","role","label","disabled","subMenuSize","subMenuInfo","buildColorPickerPanel","subMenuContent","buildSubMenu","calculateMenuSize","buildMenu","onClickFunction","colorPicker","setState","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","ChevronRight","menuItemContent","menuItemClass","subMenuClass","onMouseEnter","onMouseLeave","right","bottom","top","left","menuDef","_objectSpread","calculateMenuPos","posStyle","ensureAllSubMenuItemsHaveAction","menuInfo","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","containingDiv","getElementById","containingDivId","clientRect","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}
+{"version":3,"file":"context-menu-wrapper-0fdb9b4c.js","sources":["../src/color-picker/color-set.js","../src/color-picker/color-picker.jsx","../src/context-menu/common-context-menu.jsx","../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2024 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n// This is the set of colors for the WYSIWYG comments color palette used for\n// both text coloring and background coloring.\n\nconst colorArray = [\n\t\"#FFF1F1\", // Red\n\t\"#FCEBD6\", // Orange\n\t\"#FDF4D6\", // Yellow\n\t\"#DEFBE6\", // Green\n\t\"#D9FBFB\", // Teal\n\t\"#E5F6FF\", // Blue\n\t\"#F6F2FF\", // Purple\n\t\"#FFFFFF\", // Gray\n\n\t\"#FFD7D9\", // Red\n\t\"#FFD9BD\", // Orange\n\t\"#FFFFC7\", // Yellow\n\t\"#E2FEC7\", // Green\n\t\"#9EF0F0\", // Teal\n\t\"#CDE1FD\", // Blue\n\t\"#D4BBFF\", // Purple\n\t\"#F4F4F4\", // Gray\n\n\t\"#FFB3B8\", // Red\n\t\"#FF832B\", // Orange\n\t\"#FFFF00\", // Yellow\n\t\"#A7F0BA\", // Green\n\t\"#3DDBD9\", // Teal\n\t\"#BAE6FF\", // Blue\n\t\"#8080C0\", // Purple\n\t\"#E0E0E0\", // Gray\n\n\t\"#FF8389\", // Red\n\t\"#FC7B1D\", // Orange\n\t\"#FDDC69\", // Yellow\n\t\"#6FDC8C\", // Green\n\t\"#08BDBA\", // Teal\n\t\"#82CFFF\", // Blue\n\t\"#8080FF\", // Purple\n\t\"#C6C6C6\", // Gray\n\n\t\"#FA4D56\", // Red\n\t\"#EB6200\", // Orange\n\t\"#F1C21B\", // Yellow\n\t\"#42BE65\", // Green\n\t\"#009D9A\", // Teal\n\t\"#33B1FF\", // Blue\n\t\"#8000FF\", // Purple\n\t\"#A8A8A8\", // Gray\n\n\t\"#EA3325\", // Red\n\t\"#BA4E00\", // Orange\n\t\"#D2A106\", // Yellow\n\t\"#24A148\", // Green\n\t\"#007D79\", // Teal\n\t\"#78A9FF\", // Blue\n\t\"#6929C4\", // Purple\n\t\"#8D8D8D\", // Gray\n\n\t\"#DA1E28\", // Red\n\t\"#804040\", // Orange\n\t\"#B28600\", // Yellow\n\t\"#198038\", // Green\n\t\"#005D5D\", // Teal\n\t\"#1192E8\", // Blue\n\t\"#491D8B\", // Purple\n\t\"#000000\", // Gray\n\n\t\"#A2191F\", // Red\n\t\"#5C2800\", // Orange\n\t\"#8E6A01\", // Yellow\n\t\"#0E6027\", // Green\n\t\"#004144\", // Teal\n\t\"#0072C3\", // Blue\n\t\"#400080\", // Purple\n\t\"transparent\" // Gray\n];\nexport default colorArray;\n","/*\n * Copyright 2017-2024 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport KeyboardUtils from \"../common-canvas/keyboard-utils.js\";\nimport Logger from \"../logging/canvas-logger.js\";\nimport colorSetArray from \"./color-set.js\";\nimport { WYSIWYG } from \"../common-canvas/constants/canvas-constants.js\";\n\n// These dimensions should match the values in color-picker.scss\nconst COLOR_DIMENSION = 20;\nconst COLOR_PADDING = 5;\nconst COLOR_DIM_PLUS_PAD = COLOR_DIMENSION + COLOR_PADDING;\n\n\n// These values must reflect the layout of the color picker panel\n// described by the SCSS/CSS.\n\nclass ColorPicker extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-Color-Picker\");\n\n\t\tthis.colorIndex = 0;\n\n\t\tthis.colorsPerRow = props.subPanelData.type === WYSIWYG ? 8 : 6;\n\t\tthis.totalColors = props.subPanelData.type === WYSIWYG ? colorSetArray.length : 12;\n\n\t\tthis.refss = [];\n\t\tfor (let i = 0; i < this.totalColors; i++) {\n\t\t\tthis.refss.push(React.createRef());\n\t\t}\n\t\tthis.onClick = this.onClick.bind(this);\n\t\tthis.onKeyDown = this.onKeyDown.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.setFocus(this.colorIndex);\n\t}\n\n\tonClick(evt) {\n\t\tevt.stopPropagation();\n\t\tthis.selectColor(evt);\n\t}\n\n\tonKeyDown(evt) {\n\t\tif (KeyboardUtils.nextColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex++;\n\t\t\tif (this.colorIndex > this.totalColors - 1) {\n\t\t\t\tthis.colorIndex = 0;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.previousColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex--;\n\t\t\tif (this.colorIndex < 0) {\n\t\t\t\tthis.props.closeSubPanel();\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.aboveColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex -= this.colorsPerRow;\n\t\t\tif (this.colorIndex < 0) {\n\t\t\t\tthis.colorIndex += this.colorsPerRow;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.belowColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tthis.colorIndex += this.colorsPerRow;\n\t\t\tif (this.colorIndex > this.totalColors - 1) {\n\t\t\t\tthis.colorIndex -= this.colorsPerRow;\n\t\t\t}\n\t\t\tthis.setFocus(this.colorIndex);\n\n\t\t} else if (KeyboardUtils.selectColor(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tevt.preventDefault();\n\t\t\tthis.selectColor(evt);\n\n\t\t} else if (KeyboardUtils.tabKey(evt)) {\n\t\t\tevt.stopPropagation();\n\t\t\tevt.preventDefault();\n\t\t\treturn;\n\t\t}\n\t}\n\n\tsetFocus(index) {\n\t\tthis.refss[index].current.focus();\n\t}\n\n\tselectColor(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.subPanelData.clickActionHandler(color, evt);\n\t\tthis.props.closeSubPanel();\n\t}\n\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\tif (this.props.subPanelData.type === WYSIWYG) {\n\n\t\t\tconst colorDivs = colorSetArray.map((c, i) => {\n\t\t\t\tlet className = \"color-picker-item\" + (c === \"transparent\" ? \" color-transparent\" : \"\");\n\t\t\t\tclassName += this.props.subPanelData.selectedColor === c ? \" selected\" : \"\";\n\n\t\t\t\treturn (<div key={\"key\" + i} ref={this.refss[i]} tabIndex={\"-1\"}\n\t\t\t\t\tdata-color={c}\n\t\t\t\t\tstyle={{ backgroundColor: c }}\n\t\t\t\t\tclassName={className}\n\t\t\t\t/>);\n\t\t\t});\n\n\t\t\tconst rowCount = Math.ceil(this.totalColors / this.colorsPerRow);\n\n\t\t\tconst style = {\n\t\t\t\twidth: (this.colorsPerRow * COLOR_DIM_PLUS_PAD) + COLOR_PADDING,\n\t\t\t\theight: (rowCount * COLOR_DIM_PLUS_PAD) + COLOR_PADDING,\n\t\t\t\tpaddingBottom: \"4px\"\n\t\t\t};\n\n\t\t\treturn (\n\t\t\t\t<div className=\"color-picker\" style={style} tabIndex={\"-1\"} onClick={this.onClick} onKeyDown={this.onKeyDown}>\n\t\t\t\t\t{colorDivs}\n\t\t\t\t</div>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<div className=\"color-picker\" tabIndex={\"-1\"} onClick={this.onClick} onKeyDown={this.onKeyDown}>\n\t\t\t\t<div ref={this.refss[0]} tabIndex={\"-1\"} data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div ref={this.refss[1]} tabIndex={\"-1\"} data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div ref={this.refss[2]} tabIndex={\"-1\"} data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div ref={this.refss[3]} tabIndex={\"-1\"} data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div ref={this.refss[4]} tabIndex={\"-1\"} data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div ref={this.refss[5]} tabIndex={\"-1\"} data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div ref={this.refss[6]} tabIndex={\"-1\"} data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div ref={this.refss[7]} tabIndex={\"-1\"} data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div ref={this.refss[8]} tabIndex={\"-1\"} data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div ref={this.refss[9]} tabIndex={\"-1\"} data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div ref={this.refss[10]} tabIndex={\"-1\"} data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div ref={this.refss[11]} tabIndex={\"-1\"} data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nColorPicker.propTypes = {\n\tcloseSubPanel: PropTypes.func,\n\tsubPanelData: PropTypes.object\n};\n\nexport default ColorPicker;\n","/*\n * Copyright 2017-2026 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n/* eslint no-empty-function: [\"error\", { \"allow\": [\"arrowFunctions\"] }] */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\n// Carbon icons - direct imports for tree-shaking optimization\nimport ChevronRight from \"@carbon/icons-react/lib/ChevronRight\";\nimport ColorPicker from \"../color-picker\";\nimport KeyboardUtils from \"../common-canvas/keyboard-utils\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // See context-menu.scss\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // See context-menu.scss\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // See context-menu.scss\nconst EXTRA_OFFSET = 5; // Extra offset for vertical menu positioning\n\n\nclass CommonContextMenu extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tdisplaySubMenuAction: \"\"\n\t\t};\n\t\tthis.menuRefs = [];\n\t\tthis.subMenuRefs = [];\n\n\t\tthis.focusIndex = null; // Set to null so we know when it is not initialized.\n\t\tthis.subMenuFocusIndex = 0;\n\n\t\tthis.onKeyDown = this.onKeyDown.bind(this);\n\t\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.focusIndex = this.focusIndex === null ? 0 : this.focusIndex;\n\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t}\n\n\tcomponentDidUpdate() {\n\t\tif (this.state.displaySubMenuAction) {\n\t\t\tthis.subMenuFocusIndex = 0;\n\t\t\tif (this.state.displaySubMenuAction !== \"colorBackground\") {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\t\t\t}\n\n\t\t} else {\n\t\t\tthis.focusIndex = this.focusIndex === null ? 0 : this.focusIndex;\n\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t}\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\tonKeyDown(evt) {\n\t\t// Don't let keyboard event go through to other objects.\n\t\tevt.stopPropagation();\n\t\tevt.preventDefault();\n\n\t\tif (KeyboardUtils.nextContextMenuOption(evt)) {\n\t\t\tif (this.state.displaySubMenuAction) {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tthis.subMenuFocusIndex = this.subMenuFocusIndex === subMenuRefs.length - 1 ? 0 : this.subMenuFocusIndex + 1;\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\n\t\t\t} else {\n\t\t\t\tthis.focusIndex = this.focusIndex === this.menuRefs.length - 1 ? 0 : this.focusIndex + 1;\n\t\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.previousContextMenuOption(evt)) {\n\t\t\tif (this.state.displaySubMenuAction) {\n\t\t\t\tconst subMenuRefs = this.subMenuRefs[this.state.displaySubMenuAction];\n\t\t\t\tthis.subMenuFocusIndex = this.subMenuFocusIndex === 0 ? subMenuRefs.length - 1 : this.subMenuFocusIndex - 1;\n\t\t\t\tsubMenuRefs[this.subMenuFocusIndex].current.focus();\n\n\t\t\t} else {\n\t\t\t\tthis.focusIndex = this.focusIndex === 0 ? this.menuRefs.length - 1 : this.focusIndex - 1;\n\t\t\t\tthis.menuRefs[this.focusIndex].current.focus();\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.openContextMenuSubMenu(evt)) {\n\t\t\tconst action = evt.target.dataset.action;\n\t\t\tif (this.subMenuRefs[action]) {\n\t\t\t\tthis.subMenuOpen(action);\n\t\t\t}\n\n\t\t} else if (KeyboardUtils.closeContextMenuSubMenu(evt) &&\n\t\t\t\t\tthis.state.displaySubMenuAction) {\n\t\t\tthis.subMenuClose();\n\n\t\t} else if (KeyboardUtils.closeContextMenu(evt) &&\n\t\t\t\t\t!this.state.displaySubMenuAction) {\n\t\t\tthis.props.closeContextMenu();\n\n\t\t} else if (KeyboardUtils.activateContextMenuOption(evt)) {\n\t\t\tconst action = evt.target.dataset.action;\n\t\t\tif (this.subMenuRefs[action]) {\n\t\t\t\tthis.subMenuOpen(action);\n\n\t\t\t} else {\n\t\t\t\tthis.itemSelected(action);\n\t\t\t}\n\t\t}\n\t}\n\n\titemSelected(data) {\n\t\tthis.props.contextHandler(data);\n\t}\n\n\tcolorClicked(color, evt) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", evt, { color });\n\t}\n\n\t// Returns the size of the menu passed in.\n\tcalculateMenuSize(menu) {\n\t\tvar numDividers = 0;\n\t\tfor (let i = 0; i < menu.length; ++i) {\n\t\t\tconst divider = menu[i].divider;\n\t\t\tif (divider) {\n\t\t\t\tnumDividers++;\n\t\t\t}\n\t\t}\n\n\t\tvar menuSize = {\n\t\t\theight: ((menu.length - numDividers) * CONTEXT_MENU_LINK_HEIGHT) + (numDividers * CONTEXT_MENU_DIVIDER_HEIGHT),\n\t\t\twidth: CONTEXT_MENU_WIDTH\n\t\t};\n\n\t\treturn menuSize;\n\t}\n\n\t// Returns a new position and the canvas rectangle for the context menu based on the current\n\t// mouse position and whether the menu would appear outside the edges of the page.\n\tcalculateMenuPos(mousePos, menuSize, canvasRect) {\n\t\tconst menuPos = { x: mousePos.x, y: mousePos.y };\n\n\t\t// Reposition contextMenu if it will show off the bottom of the page\n\t\tif (mousePos.y + menuSize.height > canvasRect.height) {\n\t\t\tmenuPos.y = canvasRect.height - menuSize.height - EXTRA_OFFSET; // Move up by extra offset so it looks nice\n\n\t\t\t// If repositioning the menu would push it off the top of the page\n\t\t\t// (in very short browser windows) position it at the top.\n\t\t\tif (menuPos.y < 0) {\n\t\t\t\tmenuPos.y = 0;\n\t\t\t}\n\t\t}\n\n\t\t// Reposition contextMenu if it will show off the right of the page\n\t\tif (mousePos.x + menuSize.width > canvasRect.width) {\n\t\t\tmenuPos.x -= menuSize.width;\n\t\t}\n\n\t\t// Add two pixels to x and y because on Chrome without this the context menu\n\t\t// appears with  the top corner of the first menu item under the mouse\n\t\t// cursor. This highlights the first menu item (which looks weird) and, if\n\t\t// the first item is a cascade menu, automatically opens the sub-menu.\n\t\tmenuPos.x += 2;\n\t\tmenuPos.y += 2;\n\n\t\treturn menuPos;\n\t}\n\n\t// Returns true if all the items in a menu (or sub-menu) are disabled.\n\tareAllItemsDisabled(menuItems) {\n\t\tlet isEnabled = false;\n\n\t\tfor (let i = 0; i < menuItems.length; i++) {\n\t\t\tif (!menuItems[i].divider) {\n\t\t\t\tif (menuItems[i].submenu) {\n\t\t\t\t\tif (!this.areAllItemsDisabled(menuItems[i].menu)) {\n\t\t\t\t\t\tisEnabled = true;\n\t\t\t\t\t}\n\n\t\t\t\t} else if (this.isItemEnabled(menuItems[i])) {\n\t\t\t\t\tisEnabled = true;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn !isEnabled;\n\t}\n\n\t// Returns true if the menu item passed is enabled. The absence of the\n\t// 'enable' property default to true.\n\tisItemEnabled(item) {\n\t\treturn (typeof item.enable === \"undefined\" || item.enable === true);\n\t}\n\n\t// Builds a new menu based on the menu definition passed in.\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst menuItems = [];\n\t\tconst menuRefs = [];\n\n\t\tlet runningYPos = 0;\n\n\t\t// Records if we have just displayed a divider. This is useful because we\n\t\t// only want to display one divider if there is a divider element\n\t\t// immediately after another divider element in the menuDefinition array.\n\t\tlet previousDivider = false;\n\n\t\tconst allItemsDisabled = this.areAllItemsDisabled(menuDefinition);\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tlet menuItem;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItem = <div key={i} className={\"context-menu-divider\"} />;\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\n\t\t\t\t// Special case, when all menu items are disabled, it allows the topmost\n\t\t\t\t// disabled item to receive focus, even though it is disabled, so the\n\t\t\t\t// keyboard user can close the menu using ESC.\n\t\t\t\tif (i === 0 && allItemsDisabled) {\n\t\t\t\t\tconst ref = React.createRef();\n\t\t\t\t\tmenuRefs.push(ref);\n\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} ref={ref} tabIndex={0} className={\"context-menu-item disabled\"} onKeyDown={this.onKeyDown} role=\"menuitem\">\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\n\t\t\t\t} else if (menuDefinition[i].action === \"colorBackground\") {\n\t\t\t\t\tconst disabled = !this.isItemEnabled(menuDefinition[i]);\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuInfo = this.buildColorPickerPanel();\n\t\t\t\t\tconst subMenuContent = subMenuInfo.menuItems;\n\t\t\t\t\tthis.subMenuRefs[menuDefinition[i].action] = subMenuInfo.menuRefs;\n\n\t\t\t\t\tmenuItem = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, menuRefs, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\n\n\t\t\t\t} else if (menuDefinition[i].submenu) {\n\t\t\t\t\tconst disabled = this.areAllItemsDisabled(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuInfo = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect, 100);\n\t\t\t\t\tconst subMenuContent = subMenuInfo.menuItems;\n\t\t\t\t\tthis.subMenuRefs[menuDefinition[i].action] = subMenuInfo.menuRefs;\n\n\t\t\t\t\tmenuItem = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, menuRefs, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\n\t\t\t\t} else if (menuDefinition[i].enable === false) {\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} className={\"context-menu-item disabled\"} role=\"menuitem\">\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\n\t\t\t\t} else {\n\t\t\t\t\tconst onClickFunction = this.itemSelected.bind(null, menuDefinition[i].action);\n\t\t\t\t\tconst ref = React.createRef();\n\t\t\t\t\tmenuRefs.push(ref);\n\n\t\t\t\t\tmenuItem = (\n\t\t\t\t\t\t<div key={i} ref={ref} tabIndex={-1} data-action={menuDefinition[i].action}\n\t\t\t\t\t\t\tclassName={\"context-menu-item\"} onClick={onClickFunction} onKeyDown={this.onKeyDown} role=\"menuitem\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t\tmenuItems.push(menuItem);\n\t\t}\n\t\treturn { menuItems, menuRefs };\n\t}\n\n\tbuildColorPickerPanel() {\n\t\tconst subPanelData = {\n\t\t\tclickActionHandler: (c, evt) => this.colorClicked(c, evt),\n\t\t\tcloseSubPanel: () => this.subMenuClose()\n\t\t};\n\t\t// Only create the color picker when we are actually displaying it in the sub-menu.\n\t\t// That way the color picker will set focus on itself when it is opened.\n\t\tconst colorPicker = this.state.displaySubMenuAction === \"colorBackground\"\n\t\t\t? <ColorPicker ref={ref} subPanelData={subPanelData} closeSubPanel={() => this.subMenuClose()} />\n\t\t\t: null;\n\n\t\tconst ref = React.createRef();\n\n\t\tconst content = (\n\t\t\t<div key={\"color-picker\"} ref={ref} tabIndex={-1}>\n\t\t\t\t{colorPicker}\n\t\t\t</div>\n\t\t);\n\n\t\treturn { menuItems: [content], menuRefs: [ref] };\n\t}\n\n\tsubMenuOpen(action) {\n\t\tthis.setState({ displaySubMenuAction: action });\n\t}\n\n\tsubMenuClose(action) {\n\t\tthis.setState({ displaySubMenuAction: \"\" });\n\t}\n\n\t// Builds a sub-menu for the menuitem identified by the index into the menu definition.\n\tbuildSubMenu(menuDefinition, index, menuRefs, subMenuContent, runningYPos, menuPos,\n\t\tmenuSize, subMenuSize, canvasRect, disabled) {\n\t\tconst rtl = this.buildRtlState(menuPos, menuSize, subMenuSize, canvasRect);\n\t\tconst subMenuPosStyle = this.buildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect, rtl);\n\t\tconst menuItem = menuDefinition[index];\n\n\t\tconst icon = (<ChevronRight />);\n\t\tconst menuItemContent = <div>{menuItem.label}{icon} </div>;\n\t\tconst menuItemClass = \"context-menu-item \" + (disabled ? \" disabled\" : \"\");\n\t\tconst subMenuClass = \"context-menu-popover context-menu-submenu\" +\n\t\t\t(this.state.displaySubMenuAction === menuItem.action ? \" context-menu--visible\" : \"\");\n\t\tconst onMouseEnter = (disabled ? null : this.subMenuOpen.bind(this, menuItem.action));\n\t\tconst onMouseLeave = (disabled ? null : this.subMenuClose.bind(this));\n\n\t\tconst ref = disabled ? null : React.createRef();\n\t\tif (!disabled) {\n\t\t\tmenuRefs.push(ref);\n\t\t}\n\n\t\treturn (\n\t\t\t<div key={index} ref={ref} className={menuItemClass} aria-haspopup tabIndex={-1} data-action={menuItem.action} role=\"menuitem\"\n\t\t\t\tonMouseEnter={onMouseEnter}\n\t\t\t\tonMouseLeave={onMouseLeave}\n\t\t\t\tonKeyDown={this.onKeyDown}\n\t\t\t>\n\t\t\t\t{menuItemContent}\n\t\t\t\t<div style={subMenuPosStyle} className={subMenuClass}>\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Returns a boolean to indicate whether the submenu should appear on the\n\t// right of the context menu (rtl === false) or on the left of the context\n\t// menu (rtl === true).\n\tbuildRtlState(menuPos, menuSize, subMenuSize, canvasRect) {\n\t\t// Ensure that the combined menu position, plus the menu width,\n\t\t//  plus the submenu width, does not exceed the viewport bounds.\n\t\treturn (menuPos.x + menuSize.width + subMenuSize.width > canvasRect.right);\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust its:\n\t// * vertical (y) position: If the submenu is tall enough that it would be\n\t// displayed off the bottom of the canvas area.\n\t// * horizontal (x) position: If the sub-menu needs to appear on the left\n\t// side of the main menu (rtl === true).\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect, rtl) {\n\t\t// Does the submenu go below the bottom of the viewport?\n\t\tconst y = canvasRect.bottom - (menuPos.y + runningYPos + subMenuSize.height);\n\n\t\t// If submenu is not below the viewport bottom set offset to 0 so the\n\t\t// submenu will not be moved. Otherwise, y will be used to move the\n\t\t// submenu up fully into the view port.\n\t\tconst offset = (y > 0) ? 0 : y - EXTRA_OFFSET;\n\n\t\tconst subMenuPosStyle = {\n\t\t\ttop: offset + \"px\" // Use negative to push the menu up\n\t\t};\n\n\t\tif (rtl) {\n\t\t\tsubMenuPosStyle.left = -CONTEXT_MENU_WIDTH + \"px\";\n\t\t}\n\n\t\treturn subMenuPosStyle;\n\t}\n\n\t// Returns the menu definition array passed in making sure any\n\t// submenu items have an action. Note: some applications forget\n\t// to provide an action because, for the submenu, it is only\n\t// used by the context menu code.\n\tensureAllSubMenuItemsHaveAction(menuDef) {\n\t\treturn menuDef.map((item, index) => {\n\t\t\tif (item.submenu && typeof item.action === \"undefined\") {\n\t\t\t\treturn { ...item, action: \"submenu_\" + index };\n\t\t\t}\n\t\t\treturn item;\n\t\t});\n\t}\n\n\trender() {\n\t\t// Reposition contextMenu so that it does not show off the screen\n\t\tconst menuSize = this.calculateMenuSize(this.props.menuDefinition);\n\t\tconst menuPos = this.calculateMenuPos(this.props.mousePos, menuSize, this.props.canvasRect);\n\t\tconst posStyle = {\n\t\t\tleft: menuPos.x + \"px\",\n\t\t\ttop: menuPos.y + \"px\"\n\t\t};\n\n\t\tthis.menuRefs = [];\n\t\tconst menuDefinition = this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition);\n\t\tconst menuInfo = this.buildMenu(menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\t\tthis.menuRefs = menuInfo.menuRefs;\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" role=\"menu\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuInfo.menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: PropTypes.func.isRequired,\n\tcloseContextMenu: PropTypes.func.isRequired,\n\tmenuDefinition: PropTypes.array.isRequired,\n\tcanvasRect: PropTypes.object.isRequired,\n\tmousePos: PropTypes.object.isRequired\n};\n\nexport default CommonContextMenu;\n","/*\n * Copyright 2017-2023 Elyra Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport CommonContextMenu from \"./common-context-menu.jsx\";\n\nexport default class ContextMenuWrapper extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {};\n\n\t\tthis.contextMenuClicked = this.contextMenuClicked.bind(this);\n\t\tthis.handleClickOutside = this.handleClickOutside.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\tdocument.addEventListener(\"click\", this.handleClickOutside, true);\n\t}\n\n\tcomponentWillUnmount() {\n\t\tdocument.removeEventListener(\"click\", this.handleClickOutside, true);\n\t}\n\n\t// Returns an object that describes the dimensions of a rectangle for the\n\t// canvas div with coordinates based on the top left corner of the div. This\n\t// will match the coordinates for the mouse position where the user clicked,\n\t// which is specified in this.props.contextMenuPos object.\n\tgetCanvasRect() {\n\t\tconst containingDiv = document.getElementById(this.props.containingDivId);\n\t\tif (containingDiv) {\n\t\t\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\t\treturn {\n\t\t\t\ttop: 0,\n\t\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\t\tleft: 0,\n\t\t\t\tright: clientRect.right - clientRect.left,\n\t\t\t\theight: clientRect.height,\n\t\t\t\twidth: clientRect.width\n\t\t\t};\n\t\t}\n\t\t// Assist Jests tests to run when containingDiv is not available.\n\t\treturn { top: 0, bottom: 200, left: 0, right: 50, height: 200, width: 50 };\n\t}\n\n\thandleClickOutside(e) {\n\t\t// On Safari, when a user is displaying the context menu with a ctrl-click\n\t\t// (which is a supported context menu gesture on the Mac) a secondary click\n\t\t// event is emitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwise, if we continue, the context menu will\n\t\t// be closed.\n\t\tif (e.ctrlKey) {\n\t\t\te.stopPropagation();\n\t\t\treturn;\n\t\t}\n\n\t\t// If the click was anywhere outside the context menu and\n\t\t// the ellipsis button we just close the menu.\n\t\tif (!this.isOverContextMenu(e) && !this.isOverEllipsisButton(e)) {\n\t\t\t// This stop propagation is needed in common canvas so that selected nodes will\n\t\t\t// remain selected even after clicking outside the context menu to close the menu.\n\t\t\tif (this.props.stopPropagation) {\n\t\t\t\te.stopPropagation();\n\t\t\t}\n\t\t\tthis.props.closeContextMenu();\n\t\t}\n\t}\n\n\t// Returns true if the event occurred over the context menu.\n\tisOverContextMenu(e) {\n\t\tconst domNode = document.getElementById(\"context-menu-popover\");\n\t\treturn !domNode || domNode.contains(e.target);\n\t}\n\n\t// Returns true if the event occurred over the ellipsis button. Typically\n\t// there will be only one ellipsis button on the canvas, since they are only\n\t// displayed on hover, but in some test circumstances there might be more\n\t// than one.\n\tisOverEllipsisButton(e) {\n\t\tconst ellipsisNodes = document.getElementsByClassName(\"d3-node-ellipsis-group\");\n\t\tlet state = false;\n\t\tfor (let i = 0; i < ellipsisNodes.length; i++) {\n\t\t\tif (state === false && ellipsisNodes[i].contains(e.target)) {\n\t\t\t\tstate = true;\n\t\t\t}\n\t\t}\n\t\treturn state;\n\t}\n\n\tcontextMenuClicked(action, evt, param) {\n\t\tthis.props.contextMenuActionHandler(action, evt, param);\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<CommonContextMenu\n\t\t\t\tcontextHandler={this.contextMenuClicked}\n\t\t\t\tmenuDefinition={this.props.contextMenuDef}\n\t\t\t\tcanvasRect={this.getCanvasRect()}\n\t\t\t\tmousePos={this.props.contextMenuPos}\n\t\t\t\tcloseContextMenu={this.props.closeContextMenu}\n\t\t\t/>\n\t\t);\n\t}\n}\n\nContextMenuWrapper.propTypes = {\n\tcontextMenuDef: PropTypes.array.isRequired,\n\tcontainingDivId: PropTypes.string.isRequired,\n\tcontextMenuPos: PropTypes.object.isRequired,\n\tcontextMenuActionHandler: PropTypes.func.isRequired,\n\tcloseContextMenu: PropTypes.func.isRequired,\n\tstopPropagation: PropTypes.bool\n};\n"],"names":["colorSetArray","ColorPicker$1","_React$Component","ColorPicker","props","_this","_classCallCheck","logger","Logger","colorIndex","colorsPerRow","subPanelData","type","WYSIWYG","totalColors","length","refss","i","push","React","createRef","onClick","bind","onKeyDown","_inherits","_createClass","key","value","this","setFocus","evt","stopPropagation","selectColor","KeyboardUtils","nextColor","previousColor","closeSubPanel","aboveColor","belowColor","preventDefault","tabKey","index","current","focus","color","target","dataset","clickActionHandler","_this2","log","colorDivs","map","c","className","selectedColor","createElement","ref","tabIndex","style","backgroundColor","rowCount","Math","ceil","width","COLOR_DIMENSION","height","paddingBottom","Component","CommonContextMenu$1","CommonContextMenu","state","displaySubMenuAction","menuRefs","subMenuRefs","focusIndex","subMenuFocusIndex","itemSelected","colorClicked","e","nextContextMenuOption","previousContextMenuOption","openContextMenuSubMenu","action","subMenuOpen","closeContextMenuSubMenu","subMenuClose","closeContextMenu","activateContextMenuOption","data","contextHandler","menu","numDividers","divider","mousePos","menuSize","canvasRect","menuPos","x","y","menuItems","isEnabled","submenu","areAllItemsDisabled","isItemEnabled","item","enable","menuDefinition","runningYPos","previousDivider","allItemsDisabled","menuItem","role","label","disabled","subMenuSize","subMenuInfo","buildColorPickerPanel","subMenuContent","buildSubMenu","calculateMenuSize","buildMenu","onClickFunction","colorPicker","setState","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","ChevronRight","menuItemContent","menuItemClass","subMenuClass","onMouseEnter","onMouseLeave","right","bottom","top","left","menuDef","_objectSpread","calculateMenuPos","posStyle","ensureAllSubMenuItemsHaveAction","menuInfo","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","containingDiv","getElementById","containingDivId","clientRect","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}

package/dist/{context-menu-wrapper-9f1b71a8.js → context-menu-wrapper-8933071e.js}

@@ -1,2 +1,2 @@
-import{_ as e,a as t}from"./createClass-a140e270.js";import{_ as n,a as o,b as s}from"./inherits-860188e5.js";import i from"react";import{_ as r}from"./defineProperty-f3298a15.js";import{C as c}from"./ChevronRight-f4724ce3.js";import{K as u}from"./keyboard-utils-a23c5d52.js";import{L as l}from"./canvas-logger-3584cb6d.js";import{ac as a}from"./common-canvas-utils-7ef1d091.js";var d=["#FFF1F1","#FCEBD6","#FDF4D6","#DEFBE6","#D9FBFB","#E5F6FF","#F6F2FF","#FFFFFF","#FFD7D9","#FFD9BD","#FFFFC7","#E2FEC7","#9EF0F0","#CDE1FD","#D4BBFF","#F4F4F4","#FFB3B8","#FF832B","#FFFF00","#A7F0BA","#3DDBD9","#BAE6FF","#8080C0","#E0E0E0","#FF8389","#FC7B1D","#FDDC69","#6FDC8C","#08BDBA","#82CFFF","#8080FF","#C6C6C6","#FA4D56","#EB6200","#F1C21B","#42BE65","#009D9A","#33B1FF","#8000FF","#A8A8A8","#EA3325","#BA4E00","#D2A106","#24A148","#007D79","#78A9FF","#6929C4","#8D8D8D","#DA1E28","#804040","#B28600","#198038","#005D5D","#1192E8","#491D8B","#000000","#A2191F","#5C2800","#8E6A01","#0E6027","#004144","#0072C3","#400080","transparent"];function h(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(h=function(){return!!e})()}var f=function(r){function c(e){var n,r,u,f;t(this,c),r=this,f=[e],u=o(u=c),(n=s(r,h()?Reflect.construct(u,f||[],o(r).constructor):u.apply(r,f))).logger=new l("CC-Color-Picker"),n.colorIndex=0,n.colorsPerRow=e.subPanelData.type===a?8:6,n.totalColors=e.subPanelData.type===a?d.length:12,n.refss=[];for(var p=0;p<n.totalColors;p++)n.refss.push(i.createRef());return n.onClick=n.onClick.bind(n),n.onKeyDown=n.onKeyDown.bind(n),n}return n(c,r),e(c,[{key:"componentDidMount",value:function(){this.setFocus(this.colorIndex)}},{key:"onClick",value:function(e){e.stopPropagation(),this.selectColor(e)}},{key:"onKeyDown",value:function(e){if(u.nextColor(e))e.stopPropagation(),this.colorIndex++,this.colorIndex>this.totalColors-1&&(this.colorIndex=0),this.setFocus(this.colorIndex);else if(u.previousColor(e)){if(e.stopPropagation(),this.colorIndex--,this.colorIndex<0)return void this.props.closeSubPanel();this.setFocus(this.colorIndex)}else if(u.aboveColor(e))e.stopPropagation(),this.colorIndex-=this.colorsPerRow,this.colorIndex<0&&(this.colorIndex+=this.colorsPerRow),this.setFocus(this.colorIndex);else if(u.belowColor(e))e.stopPropagation(),this.colorIndex+=this.colorsPerRow,this.colorIndex>this.totalColors-1&&(this.colorIndex-=this.colorsPerRow),this.setFocus(this.colorIndex);else if(u.selectColor(e))e.stopPropagation(),e.preventDefault(),this.selectColor(e);else if(u.tabKey(e))return e.stopPropagation(),void e.preventDefault()}},{key:"setFocus",value:function(e){this.refss[e].current.focus()}},{key:"selectColor",value:function(e){var t=e.target.dataset.color;this.props.subPanelData.clickActionHandler(t,e),this.props.closeSubPanel()}},{key:"render",value:function(){var e=this;if(this.logger.log("render"),this.props.subPanelData.type===a){var t=d.map(function(t,n){var o="color-picker-item"+("transparent"===t?" color-transparent":"");return o+=e.props.subPanelData.selectedColor===t?" selected":"",i.createElement("div",{key:"key"+n,ref:e.refss[n],tabIndex:"-1","data-color":t,style:{backgroundColor:t},className:o})}),n=Math.ceil(this.totalColors/this.colorsPerRow),o={width:25*this.colorsPerRow+5,height:25*n+5,paddingBottom:"4px"};return i.createElement("div",{className:"color-picker",style:o,tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},t)}return i.createElement("div",{className:"color-picker",tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},i.createElement("div",{ref:this.refss[0],tabIndex:"-1","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),i.createElement("div",{ref:this.refss[1],tabIndex:"-1","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),i.createElement("div",{ref:this.refss[2],tabIndex:"-1","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),i.createElement("div",{ref:this.refss[3],tabIndex:"-1","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),i.createElement("div",{ref:this.refss[4],tabIndex:"-1","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),i.createElement("div",{ref:this.refss[5],tabIndex:"-1","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),i.createElement("div",{ref:this.refss[6],tabIndex:"-1","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),i.createElement("div",{ref:this.refss[7],tabIndex:"-1","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),i.createElement("div",{ref:this.refss[8],tabIndex:"-1","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),i.createElement("div",{ref:this.refss[9],tabIndex:"-1","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),i.createElement("div",{ref:this.refss[10],tabIndex:"-1","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),i.createElement("div",{ref:this.refss[11],tabIndex:"-1","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}])}(i.Component);function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,o)}return n}function m(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?p(Object(n),!0).forEach(function(t){r(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):p(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function b(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(b=function(){return!!e})()}var v=function(r){function l(e){var n,i,r,c;return t(this,l),i=this,c=[e],r=o(r=l),(n=s(i,b()?Reflect.construct(r,c||[],o(i).constructor):r.apply(i,c))).state={displaySubMenuAction:""},n.menuRefs=[],n.subMenuRefs=[],n.focusIndex=null,n.subMenuFocusIndex=0,n.onKeyDown=n.onKeyDown.bind(n),n.itemSelected=n.itemSelected.bind(n),n.colorClicked=n.colorClicked.bind(n),n}return n(l,r),e(l,[{key:"componentDidMount",value:function(){this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus()}},{key:"componentDidUpdate",value:function(){this.state.displaySubMenuAction?(this.subMenuFocusIndex=0,"colorBackground"!==this.state.displaySubMenuAction&&this.subMenuRefs[this.state.displaySubMenuAction][this.subMenuFocusIndex].current.focus()):(this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus())}},{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"onKeyDown",value:function(e){if(e.stopPropagation(),e.preventDefault(),u.nextContextMenuOption(e))if(this.state.displaySubMenuAction){var t=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=this.subMenuFocusIndex===t.length-1?0:this.subMenuFocusIndex+1,t[this.subMenuFocusIndex].current.focus()}else this.focusIndex=this.focusIndex===this.menuRefs.length-1?0:this.focusIndex+1,this.menuRefs[this.focusIndex].current.focus();else if(u.previousContextMenuOption(e))if(this.state.displaySubMenuAction){var n=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=0===this.subMenuFocusIndex?n.length-1:this.subMenuFocusIndex-1,n[this.subMenuFocusIndex].current.focus()}else this.focusIndex=0===this.focusIndex?this.menuRefs.length-1:this.focusIndex-1,this.menuRefs[this.focusIndex].current.focus();else if(u.openContextMenuSubMenu(e)){var o=e.target.dataset.action;this.subMenuRefs[o]&&this.subMenuOpen(o)}else if(u.closeContextMenuSubMenu(e)&&this.state.displaySubMenuAction)this.subMenuClose();else if(u.closeContextMenu(e)&&!this.state.displaySubMenuAction)this.props.closeContextMenu();else if(u.activateContextMenuOption(e)){var s=e.target.dataset.action;this.subMenuRefs[s]?this.subMenuOpen(s):this.itemSelected(s)}}},{key:"itemSelected",value:function(e){this.props.contextHandler(e)}},{key:"colorClicked",value:function(e,t){this.props.contextHandler("colorSelectedObjects",t,{color:e})}},{key:"calculateMenuSize",value:function(e){for(var t=0,n=0;n<e.length;++n){e[n].divider&&t++}return{height:30*(e.length-t)+1*t,width:160}}},{key:"calculateMenuPos",value:function(e,t,n){var o={x:e.x,y:e.y};return e.y+t.height>n.height&&(o.y=n.height-t.height-5,o.y<0&&(o.y=0)),e.x+t.width>n.width&&(o.x-=t.width),o.x+=2,o.y+=2,o}},{key:"areAllItemsDisabled",value:function(e){for(var t=!1,n=0;n<e.length;n++)e[n].divider||(e[n].submenu?this.areAllItemsDisabled(e[n].menu)||(t=!0):this.isItemEnabled(e[n])&&(t=!0));return!t}},{key:"isItemEnabled",value:function(e){return void 0===e.enable||!0===e.enable}},{key:"buildMenu",value:function(e,t,n,o){for(var s=[],r=[],c=0,u=!1,l=this.areAllItemsDisabled(e),a=0;a<e.length;++a){var d=void 0;if(e[a].divider)u||(d=i.createElement("div",{key:a,className:"context-menu-divider"}),c+=1,u=!0);else{if(u=!1,0===a&&l){var h=i.createRef();r.push(h),d=i.createElement("div",{key:a,ref:h,tabIndex:0,className:"context-menu-item disabled",onKeyDown:this.onKeyDown,role:"menuitem"},e[a].label)}else if("colorBackground"===e[a].action){var f=!this.isItemEnabled(e[a]),p={width:160,height:50},m=this.buildColorPickerPanel(),b=m.menuItems;this.subMenuRefs[e[a].action]=m.menuRefs,d=this.buildSubMenu(e,a,r,b,c,n,t,p,o,f)}else if(e[a].submenu){var v=this.areAllItemsDisabled(e[a].menu),y=this.calculateMenuSize(e[a].menu),x=this.buildMenu(e[a].menu,t,n,o,100),k=x.menuItems;this.subMenuRefs[e[a].action]=x.menuRefs,d=this.buildSubMenu(e,a,r,k,c,n,t,y,o,v)}else if(!1===e[a].enable)d=i.createElement("div",{key:a,className:"context-menu-item disabled",role:"menuitem"},e[a].label);else{var g=this.itemSelected.bind(null,e[a].action),C=i.createRef();r.push(C),d=i.createElement("div",{key:a,ref:C,tabIndex:-1,"data-action":e[a].action,className:"context-menu-item",onClick:g,onKeyDown:this.onKeyDown,role:"menuitem"},e[a].label)}c+=30}s.push(d)}return{menuItems:s,menuRefs:r}}},{key:"buildColorPickerPanel",value:function(){var e=this,t={clickActionHandler:function(t,n){return e.colorClicked(t,n)},closeSubPanel:function(){return e.subMenuClose()}},n="colorBackground"===this.state.displaySubMenuAction?i.createElement(f,{ref:o,subPanelData:t,closeSubPanel:function(){return e.subMenuClose()}}):null,o=i.createRef();return{menuItems:[i.createElement("div",{key:"color-picker",ref:o,tabIndex:-1},n)],menuRefs:[o]}}},{key:"subMenuOpen",value:function(e){this.setState({displaySubMenuAction:e})}},{key:"subMenuClose",value:function(e){this.setState({displaySubMenuAction:""})}},{key:"buildSubMenu",value:function(e,t,n,o,s,r,u,l,a,d){var h=this.buildRtlState(r,u,l,a),f=this.buildSubMenuPosStyle(s,r,l,a,h),p=e[t],m=i.createElement(c,null),b=i.createElement("div",null,p.label,m," "),v="context-menu-item "+(d?" disabled":""),y="context-menu-popover context-menu-submenu"+(this.state.displaySubMenuAction===p.action?" context-menu--visible":""),x=d?null:this.subMenuOpen.bind(this,p.action),k=d?null:this.subMenuClose.bind(this),g=d?null:i.createRef();return d||n.push(g),i.createElement("div",{key:t,ref:g,className:v,"aria-haspopup":!0,tabIndex:-1,"data-action":p.action,role:"menuitem",onMouseEnter:x,onMouseLeave:k,onKeyDown:this.onKeyDown},b,i.createElement("div",{style:f,className:y},o))}},{key:"buildRtlState",value:function(e,t,n,o){return e.x+t.width+n.width>o.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,o,s){var i=o.bottom-(t.y+e+n.height),r={top:(i>0?0:i-5)+"px"};return s&&(r.left="-160px"),r}},{key:"ensureAllSubMenuItemsHaveAction",value:function(e){return e.map(function(e,t){return e.submenu&&void 0===e.action?m(m({},e),{},{action:"submenu_"+t}):e})}},{key:"render",value:function(){var e=this.calculateMenuSize(this.props.menuDefinition),t=this.calculateMenuPos(this.props.mousePos,e,this.props.canvasRect),n={left:t.x+"px",top:t.y+"px"};this.menuRefs=[];var o=this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition),s=this.buildMenu(o,e,t,this.props.canvasRect);return this.menuRefs=s.menuRefs,i.createElement("div",{id:"context-menu-popover",role:"menu",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},s.menuItems)}}])}(i.Component);function y(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(y=function(){return!!e})()}var x=function(r){function c(e){var n,i,r,u;return t(this,c),i=this,u=[e],r=o(r=c),(n=s(i,y()?Reflect.construct(r,u||[],o(i).constructor):r.apply(i,u))).state={},n.contextMenuClicked=n.contextMenuClicked.bind(n),n.handleClickOutside=n.handleClickOutside.bind(n),n}return n(c,r),e(c,[{key:"componentDidMount",value:function(){document.addEventListener("click",this.handleClickOutside,!0)}},{key:"componentWillUnmount",value:function(){document.removeEventListener("click",this.handleClickOutside,!0)}},{key:"getCanvasRect",value:function(){var e=document.getElementById(this.props.containingDivId);if(e){var t=e.getBoundingClientRect();return{top:0,bottom:t.bottom-t.top,left:0,right:t.right-t.left,height:t.height,width:t.width}}return{top:0,bottom:200,left:0,right:50,height:200,width:50}}},{key:"handleClickOutside",value:function(e){e.ctrlKey?e.stopPropagation():this.isOverContextMenu(e)||this.isOverEllipsisButton(e)||(this.props.stopPropagation&&e.stopPropagation(),this.props.closeContextMenu())}},{key:"isOverContextMenu",value:function(e){var t=document.getElementById("context-menu-popover");return!t||t.contains(e.target)}},{key:"isOverEllipsisButton",value:function(e){for(var t=document.getElementsByClassName("d3-node-ellipsis-group"),n=!1,o=0;o<t.length;o++)!1===n&&t[o].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t,n){this.props.contextMenuActionHandler(e,t,n)}},{key:"render",value:function(){return i.createElement(v,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos,closeContextMenu:this.props.closeContextMenu})}}])}(i.Component);export{x as C,f as a};
-//# sourceMappingURL=context-menu-wrapper-9f1b71a8.js.map
+import{_ as e,a as t}from"./createClass-a140e270.js";import{_ as n,a as o,b as s}from"./inherits-860188e5.js";import i from"react";import{_ as r}from"./defineProperty-f3298a15.js";import{C as c}from"./ChevronRight-42b5629a.js";import{K as u}from"./keyboard-utils-d9b6ba48.js";import{L as l}from"./canvas-logger-3584cb6d.js";import{ac as a}from"./common-canvas-utils-7ef1d091.js";var d=["#FFF1F1","#FCEBD6","#FDF4D6","#DEFBE6","#D9FBFB","#E5F6FF","#F6F2FF","#FFFFFF","#FFD7D9","#FFD9BD","#FFFFC7","#E2FEC7","#9EF0F0","#CDE1FD","#D4BBFF","#F4F4F4","#FFB3B8","#FF832B","#FFFF00","#A7F0BA","#3DDBD9","#BAE6FF","#8080C0","#E0E0E0","#FF8389","#FC7B1D","#FDDC69","#6FDC8C","#08BDBA","#82CFFF","#8080FF","#C6C6C6","#FA4D56","#EB6200","#F1C21B","#42BE65","#009D9A","#33B1FF","#8000FF","#A8A8A8","#EA3325","#BA4E00","#D2A106","#24A148","#007D79","#78A9FF","#6929C4","#8D8D8D","#DA1E28","#804040","#B28600","#198038","#005D5D","#1192E8","#491D8B","#000000","#A2191F","#5C2800","#8E6A01","#0E6027","#004144","#0072C3","#400080","transparent"];function h(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(h=function(){return!!e})()}var f=function(r){function c(e){var n,r,u,f;t(this,c),r=this,f=[e],u=o(u=c),(n=s(r,h()?Reflect.construct(u,f||[],o(r).constructor):u.apply(r,f))).logger=new l("CC-Color-Picker"),n.colorIndex=0,n.colorsPerRow=e.subPanelData.type===a?8:6,n.totalColors=e.subPanelData.type===a?d.length:12,n.refss=[];for(var p=0;p<n.totalColors;p++)n.refss.push(i.createRef());return n.onClick=n.onClick.bind(n),n.onKeyDown=n.onKeyDown.bind(n),n}return n(c,r),e(c,[{key:"componentDidMount",value:function(){this.setFocus(this.colorIndex)}},{key:"onClick",value:function(e){e.stopPropagation(),this.selectColor(e)}},{key:"onKeyDown",value:function(e){if(u.nextColor(e))e.stopPropagation(),this.colorIndex++,this.colorIndex>this.totalColors-1&&(this.colorIndex=0),this.setFocus(this.colorIndex);else if(u.previousColor(e)){if(e.stopPropagation(),this.colorIndex--,this.colorIndex<0)return void this.props.closeSubPanel();this.setFocus(this.colorIndex)}else if(u.aboveColor(e))e.stopPropagation(),this.colorIndex-=this.colorsPerRow,this.colorIndex<0&&(this.colorIndex+=this.colorsPerRow),this.setFocus(this.colorIndex);else if(u.belowColor(e))e.stopPropagation(),this.colorIndex+=this.colorsPerRow,this.colorIndex>this.totalColors-1&&(this.colorIndex-=this.colorsPerRow),this.setFocus(this.colorIndex);else if(u.selectColor(e))e.stopPropagation(),e.preventDefault(),this.selectColor(e);else if(u.tabKey(e))return e.stopPropagation(),void e.preventDefault()}},{key:"setFocus",value:function(e){this.refss[e].current.focus()}},{key:"selectColor",value:function(e){var t=e.target.dataset.color;this.props.subPanelData.clickActionHandler(t,e),this.props.closeSubPanel()}},{key:"render",value:function(){var e=this;if(this.logger.log("render"),this.props.subPanelData.type===a){var t=d.map(function(t,n){var o="color-picker-item"+("transparent"===t?" color-transparent":"");return o+=e.props.subPanelData.selectedColor===t?" selected":"",i.createElement("div",{key:"key"+n,ref:e.refss[n],tabIndex:"-1","data-color":t,style:{backgroundColor:t},className:o})}),n=Math.ceil(this.totalColors/this.colorsPerRow),o={width:25*this.colorsPerRow+5,height:25*n+5,paddingBottom:"4px"};return i.createElement("div",{className:"color-picker",style:o,tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},t)}return i.createElement("div",{className:"color-picker",tabIndex:"-1",onClick:this.onClick,onKeyDown:this.onKeyDown},i.createElement("div",{ref:this.refss[0],tabIndex:"-1","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),i.createElement("div",{ref:this.refss[1],tabIndex:"-1","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),i.createElement("div",{ref:this.refss[2],tabIndex:"-1","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),i.createElement("div",{ref:this.refss[3],tabIndex:"-1","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),i.createElement("div",{ref:this.refss[4],tabIndex:"-1","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),i.createElement("div",{ref:this.refss[5],tabIndex:"-1","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),i.createElement("div",{ref:this.refss[6],tabIndex:"-1","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),i.createElement("div",{ref:this.refss[7],tabIndex:"-1","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),i.createElement("div",{ref:this.refss[8],tabIndex:"-1","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),i.createElement("div",{ref:this.refss[9],tabIndex:"-1","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),i.createElement("div",{ref:this.refss[10],tabIndex:"-1","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),i.createElement("div",{ref:this.refss[11],tabIndex:"-1","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}])}(i.Component);function p(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),n.push.apply(n,o)}return n}function m(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?p(Object(n),!0).forEach(function(t){r(e,t,n[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):p(Object(n)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))})}return e}function b(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(b=function(){return!!e})()}var v=function(r){function l(e){var n,i,r,c;return t(this,l),i=this,c=[e],r=o(r=l),(n=s(i,b()?Reflect.construct(r,c||[],o(i).constructor):r.apply(i,c))).state={displaySubMenuAction:""},n.menuRefs=[],n.subMenuRefs=[],n.focusIndex=null,n.subMenuFocusIndex=0,n.onKeyDown=n.onKeyDown.bind(n),n.itemSelected=n.itemSelected.bind(n),n.colorClicked=n.colorClicked.bind(n),n}return n(l,r),e(l,[{key:"componentDidMount",value:function(){this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus()}},{key:"componentDidUpdate",value:function(){this.state.displaySubMenuAction?(this.subMenuFocusIndex=0,"colorBackground"!==this.state.displaySubMenuAction&&this.subMenuRefs[this.state.displaySubMenuAction][this.subMenuFocusIndex].current.focus()):(this.focusIndex=null===this.focusIndex?0:this.focusIndex,this.menuRefs[this.focusIndex].current.focus())}},{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"onKeyDown",value:function(e){if(e.stopPropagation(),e.preventDefault(),u.nextContextMenuOption(e))if(this.state.displaySubMenuAction){var t=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=this.subMenuFocusIndex===t.length-1?0:this.subMenuFocusIndex+1,t[this.subMenuFocusIndex].current.focus()}else this.focusIndex=this.focusIndex===this.menuRefs.length-1?0:this.focusIndex+1,this.menuRefs[this.focusIndex].current.focus();else if(u.previousContextMenuOption(e))if(this.state.displaySubMenuAction){var n=this.subMenuRefs[this.state.displaySubMenuAction];this.subMenuFocusIndex=0===this.subMenuFocusIndex?n.length-1:this.subMenuFocusIndex-1,n[this.subMenuFocusIndex].current.focus()}else this.focusIndex=0===this.focusIndex?this.menuRefs.length-1:this.focusIndex-1,this.menuRefs[this.focusIndex].current.focus();else if(u.openContextMenuSubMenu(e)){var o=e.target.dataset.action;this.subMenuRefs[o]&&this.subMenuOpen(o)}else if(u.closeContextMenuSubMenu(e)&&this.state.displaySubMenuAction)this.subMenuClose();else if(u.closeContextMenu(e)&&!this.state.displaySubMenuAction)this.props.closeContextMenu();else if(u.activateContextMenuOption(e)){var s=e.target.dataset.action;this.subMenuRefs[s]?this.subMenuOpen(s):this.itemSelected(s)}}},{key:"itemSelected",value:function(e){this.props.contextHandler(e)}},{key:"colorClicked",value:function(e,t){this.props.contextHandler("colorSelectedObjects",t,{color:e})}},{key:"calculateMenuSize",value:function(e){for(var t=0,n=0;n<e.length;++n){e[n].divider&&t++}return{height:30*(e.length-t)+1*t,width:160}}},{key:"calculateMenuPos",value:function(e,t,n){var o={x:e.x,y:e.y};return e.y+t.height>n.height&&(o.y=n.height-t.height-5,o.y<0&&(o.y=0)),e.x+t.width>n.width&&(o.x-=t.width),o.x+=2,o.y+=2,o}},{key:"areAllItemsDisabled",value:function(e){for(var t=!1,n=0;n<e.length;n++)e[n].divider||(e[n].submenu?this.areAllItemsDisabled(e[n].menu)||(t=!0):this.isItemEnabled(e[n])&&(t=!0));return!t}},{key:"isItemEnabled",value:function(e){return void 0===e.enable||!0===e.enable}},{key:"buildMenu",value:function(e,t,n,o){for(var s=[],r=[],c=0,u=!1,l=this.areAllItemsDisabled(e),a=0;a<e.length;++a){var d=void 0;if(e[a].divider)u||(d=i.createElement("div",{key:a,className:"context-menu-divider"}),c+=1,u=!0);else{if(u=!1,0===a&&l){var h=i.createRef();r.push(h),d=i.createElement("div",{key:a,ref:h,tabIndex:0,className:"context-menu-item disabled",onKeyDown:this.onKeyDown,role:"menuitem"},e[a].label)}else if("colorBackground"===e[a].action){var f=!this.isItemEnabled(e[a]),p={width:160,height:50},m=this.buildColorPickerPanel(),b=m.menuItems;this.subMenuRefs[e[a].action]=m.menuRefs,d=this.buildSubMenu(e,a,r,b,c,n,t,p,o,f)}else if(e[a].submenu){var v=this.areAllItemsDisabled(e[a].menu),y=this.calculateMenuSize(e[a].menu),x=this.buildMenu(e[a].menu,t,n,o,100),k=x.menuItems;this.subMenuRefs[e[a].action]=x.menuRefs,d=this.buildSubMenu(e,a,r,k,c,n,t,y,o,v)}else if(!1===e[a].enable)d=i.createElement("div",{key:a,className:"context-menu-item disabled",role:"menuitem"},e[a].label);else{var g=this.itemSelected.bind(null,e[a].action),C=i.createRef();r.push(C),d=i.createElement("div",{key:a,ref:C,tabIndex:-1,"data-action":e[a].action,className:"context-menu-item",onClick:g,onKeyDown:this.onKeyDown,role:"menuitem"},e[a].label)}c+=30}s.push(d)}return{menuItems:s,menuRefs:r}}},{key:"buildColorPickerPanel",value:function(){var e=this,t={clickActionHandler:function(t,n){return e.colorClicked(t,n)},closeSubPanel:function(){return e.subMenuClose()}},n="colorBackground"===this.state.displaySubMenuAction?i.createElement(f,{ref:o,subPanelData:t,closeSubPanel:function(){return e.subMenuClose()}}):null,o=i.createRef();return{menuItems:[i.createElement("div",{key:"color-picker",ref:o,tabIndex:-1},n)],menuRefs:[o]}}},{key:"subMenuOpen",value:function(e){this.setState({displaySubMenuAction:e})}},{key:"subMenuClose",value:function(e){this.setState({displaySubMenuAction:""})}},{key:"buildSubMenu",value:function(e,t,n,o,s,r,u,l,a,d){var h=this.buildRtlState(r,u,l,a),f=this.buildSubMenuPosStyle(s,r,l,a,h),p=e[t],m=i.createElement(c,null),b=i.createElement("div",null,p.label,m," "),v="context-menu-item "+(d?" disabled":""),y="context-menu-popover context-menu-submenu"+(this.state.displaySubMenuAction===p.action?" context-menu--visible":""),x=d?null:this.subMenuOpen.bind(this,p.action),k=d?null:this.subMenuClose.bind(this),g=d?null:i.createRef();return d||n.push(g),i.createElement("div",{key:t,ref:g,className:v,"aria-haspopup":!0,tabIndex:-1,"data-action":p.action,role:"menuitem",onMouseEnter:x,onMouseLeave:k,onKeyDown:this.onKeyDown},b,i.createElement("div",{style:f,className:y},o))}},{key:"buildRtlState",value:function(e,t,n,o){return e.x+t.width+n.width>o.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,o,s){var i=o.bottom-(t.y+e+n.height),r={top:(i>0?0:i-5)+"px"};return s&&(r.left="-160px"),r}},{key:"ensureAllSubMenuItemsHaveAction",value:function(e){return e.map(function(e,t){return e.submenu&&void 0===e.action?m(m({},e),{},{action:"submenu_"+t}):e})}},{key:"render",value:function(){var e=this.calculateMenuSize(this.props.menuDefinition),t=this.calculateMenuPos(this.props.mousePos,e,this.props.canvasRect),n={left:t.x+"px",top:t.y+"px"};this.menuRefs=[];var o=this.ensureAllSubMenuItemsHaveAction(this.props.menuDefinition),s=this.buildMenu(o,e,t,this.props.canvasRect);return this.menuRefs=s.menuRefs,i.createElement("div",{id:"context-menu-popover",role:"menu",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},s.menuItems)}}])}(i.Component);function y(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}))}catch(e){}return(y=function(){return!!e})()}var x=function(r){function c(e){var n,i,r,u;return t(this,c),i=this,u=[e],r=o(r=c),(n=s(i,y()?Reflect.construct(r,u||[],o(i).constructor):r.apply(i,u))).state={},n.contextMenuClicked=n.contextMenuClicked.bind(n),n.handleClickOutside=n.handleClickOutside.bind(n),n}return n(c,r),e(c,[{key:"componentDidMount",value:function(){document.addEventListener("click",this.handleClickOutside,!0)}},{key:"componentWillUnmount",value:function(){document.removeEventListener("click",this.handleClickOutside,!0)}},{key:"getCanvasRect",value:function(){var e=document.getElementById(this.props.containingDivId);if(e){var t=e.getBoundingClientRect();return{top:0,bottom:t.bottom-t.top,left:0,right:t.right-t.left,height:t.height,width:t.width}}return{top:0,bottom:200,left:0,right:50,height:200,width:50}}},{key:"handleClickOutside",value:function(e){e.ctrlKey?e.stopPropagation():this.isOverContextMenu(e)||this.isOverEllipsisButton(e)||(this.props.stopPropagation&&e.stopPropagation(),this.props.closeContextMenu())}},{key:"isOverContextMenu",value:function(e){var t=document.getElementById("context-menu-popover");return!t||t.contains(e.target)}},{key:"isOverEllipsisButton",value:function(e){for(var t=document.getElementsByClassName("d3-node-ellipsis-group"),n=!1,o=0;o<t.length;o++)!1===n&&t[o].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t,n){this.props.contextMenuActionHandler(e,t,n)}},{key:"render",value:function(){return i.createElement(v,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos,closeContextMenu:this.props.closeContextMenu})}}])}(i.Component);export{x as C,f as a};
+//# sourceMappingURL=context-menu-wrapper-8933071e.js.map