@elyra/canvas 12.26.0 → 12.27.1

package/dist/lib/context-menu.es.js

@@ -1,2 +1,2 @@
-import{_ as e,a as t}from"../createClass-be661622.js";import{_ as n,a as o,b as r,c}from"../getPrototypeOf-3751add9.js";import i from"react";import{_ as a,C as l}from"../canvas-constants-ba465147.js";import{_ as u}from"../extends-a9c1b4cd.js";import{MenuItem as s,SubMenu as d}from"react-contextmenu";import{I as m}from"../icon-4a6f3dad.js";import{L as f}from"../canvas-logger-27d3180d.js";import"react-inlinesvg";import"@carbon/icons-react";function p(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var h=function(o){n(a,o);var r=p(a);function a(t){var n;return e(this,a),(n=r.call(this,t)).logger=new f("CC-ContextMenu"),n.onClick=n.onClick.bind(c(n)),n}return t(a,[{key:"onClick",value:function(e){var t=e.target.dataset.color;this.props.clickActionHandler(t)}},{key:"render",value:function(){return this.logger.log("render"),i.createElement("div",{className:"color-picker-panel",onClick:this.onClick},i.createElement("div",{tabIndex:"0","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}]),a}(i.Component);function v(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var k=function(o){n(f,o);var r=v(f);function f(t){var n;return e(this,f),(n=r.call(this,t)).state={},n.itemSelected=n.itemSelected.bind(c(n)),n.colorClicked=n.colorClicked.bind(c(n)),n}return t(f,[{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"itemSelected",value:function(e,t){this.props.contextHandler(e),t&&t.stopPropagation()}},{key:"colorClicked",value:function(e){this.props.contextHandler("colorSelectedObjects",{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+=1,o.y+=1,o}},{key:"areAllSubmenuItemsDisabled",value:function(e){var t=0,n=0;return e.forEach((function(e){e.divider||t++,!1===e.enable&&n++})),n===t}},{key:"buildMenu",value:function(e,t,n,o){for(var r={className:"contextmenu-divider"},c=[],a=0,l=!1,d=0;d<e.length;++d){var m=e[d].divider,f=e[d].submenu;if(m)l||(c.push(i.createElement(s,{attributes:r,key:d+1,onClick:function(){},divider:!0})),a+=1,l=!0);else if(f)if(l=!1,"colorPicker"===e[d].menu){var p={width:160,height:50},h=this.buildColorPickerPanel(),v=this.buildSubMenu(e,d,h,a,n,t,p,o,!1);c.push(v),a+=30}else{var k={disabled:this.areAllSubmenuItemsDisabled(e[d].menu)},y=this.calculateMenuSize(e[d].menu),b=this.buildMenu(e[d].menu,t,n,o),g=this.buildSubMenu(e,d,b,a,n,t,y,o,k);c.push(g),a+=30}else{l=!1;var x={disabled:!1===e[d].enable};c.push(i.createElement(s,u({onClick:this.itemSelected.bind(null,e[d].action),key:d+1},x),e[d].label)),a+=30}}return c}},{key:"buildColorPickerPanel",value:function(){return i.createElement(h,a({clickActionHandler:this.colorPickHandler},"clickActionHandler",this.colorClicked))}},{key:"buildSubMenu",value:function(e,t,n,o,r,c,a,s,f){var p=this.buildRtlState(r,c,a,s),h=this.buildSubMenuPosStyle(o,r,a,s),v=i.createElement(m,{type:l.CHEVRONARROWS.RIGHT,disabled:!1,className:"react-contextmenu-submenu-icon"}),k=i.createElement("div",null,e[t].label,v," ");return i.createElement(d,u({title:k,key:t+1,className:"contextmenu-submenu",rtl:p},f),i.createElement("div",{key:t+1,style:h,className:"context-menu-popover"},n))}},{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){var r=o.bottom-(t.y+e+n.height);return{top:(r>0?0:r-5)+"px"}}},{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"},o=this.buildMenu(this.props.menuDefinition,e,t,this.props.canvasRect);return i.createElement("div",{id:"context-menu-popover",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},o)}}]),f}(i.Component);function y(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var b=function(o){n(a,o);var r=y(a);function a(t){var n;return e(this,a),(n=r.call(this,t)).state={},n.contextMenuClicked=n.contextMenuClicked.bind(c(n)),n.handleClickOutside=n.handleClickOutside.bind(c(n)),n}return t(a,[{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).getBoundingClientRect();return{top:0,bottom:e.bottom-e.top,left:0,right:e.right-e.left,height:e.height,width:e.width}}},{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){this.props.contextMenuActionHandler(e,t)}},{key:"render",value:function(){return i.createElement(k,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos})}}]),a}(i.Component);export{b as default};
+import{_ as e,a as t}from"../createClass-be661622.js";import{_ as n,a as o,b as r,c}from"../getPrototypeOf-3751add9.js";import i from"react";import{_ as a,C as l}from"../canvas-constants-ba465147.js";import{_ as u}from"../extends-de3127ea.js";import{MenuItem as s,SubMenu as d}from"react-contextmenu";import{I as m}from"../icon-94bf4b86.js";import{L as f}from"../canvas-logger-27d3180d.js";import"react-inlinesvg";import"@carbon/icons-react";function p(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var h=function(o){n(a,o);var r=p(a);function a(t){var n;return e(this,a),(n=r.call(this,t)).logger=new f("CC-ContextMenu"),n.onClick=n.onClick.bind(c(n)),n}return t(a,[{key:"onClick",value:function(e){var t=e.target.dataset.color;this.props.clickActionHandler(t)}},{key:"render",value:function(){return this.logger.log("render"),i.createElement("div",{className:"color-picker-panel",onClick:this.onClick},i.createElement("div",{tabIndex:"0","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),i.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}]),a}(i.Component);function v(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var k=function(o){n(f,o);var r=v(f);function f(t){var n;return e(this,f),(n=r.call(this,t)).state={},n.itemSelected=n.itemSelected.bind(c(n)),n.colorClicked=n.colorClicked.bind(c(n)),n}return t(f,[{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"itemSelected",value:function(e,t){this.props.contextHandler(e),t&&t.stopPropagation()}},{key:"colorClicked",value:function(e){this.props.contextHandler("colorSelectedObjects",{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+=1,o.y+=1,o}},{key:"areAllSubmenuItemsDisabled",value:function(e){var t=0,n=0;return e.forEach((function(e){e.divider||t++,!1===e.enable&&n++})),n===t}},{key:"buildMenu",value:function(e,t,n,o){for(var r={className:"contextmenu-divider"},c=[],a=0,l=!1,d=0;d<e.length;++d){var m=e[d].divider,f=e[d].submenu;if(m)l||(c.push(i.createElement(s,{attributes:r,key:d+1,onClick:function(){},divider:!0})),a+=1,l=!0);else if(f)if(l=!1,"colorPicker"===e[d].menu){var p={width:160,height:50},h=this.buildColorPickerPanel(),v=this.buildSubMenu(e,d,h,a,n,t,p,o,!1);c.push(v),a+=30}else{var k={disabled:this.areAllSubmenuItemsDisabled(e[d].menu)},y=this.calculateMenuSize(e[d].menu),b=this.buildMenu(e[d].menu,t,n,o),g=this.buildSubMenu(e,d,b,a,n,t,y,o,k);c.push(g),a+=30}else{l=!1;var x={disabled:!1===e[d].enable};c.push(i.createElement(s,u({onClick:this.itemSelected.bind(null,e[d].action),key:d+1},x),e[d].label)),a+=30}}return c}},{key:"buildColorPickerPanel",value:function(){return i.createElement(h,a({clickActionHandler:this.colorPickHandler},"clickActionHandler",this.colorClicked))}},{key:"buildSubMenu",value:function(e,t,n,o,r,c,a,s,f){var p=this.buildRtlState(r,c,a,s),h=this.buildSubMenuPosStyle(o,r,a,s),v=i.createElement(m,{type:l.CHEVRONARROWS.RIGHT,disabled:!1,className:"react-contextmenu-submenu-icon"}),k=i.createElement("div",null,e[t].label,v," ");return i.createElement(d,u({title:k,key:t+1,className:"contextmenu-submenu",rtl:p},f),i.createElement("div",{key:t+1,style:h,className:"context-menu-popover"},n))}},{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){var r=o.bottom-(t.y+e+n.height);return{top:(r>0?0:r-5)+"px"}}},{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"},o=this.buildMenu(this.props.menuDefinition,e,t,this.props.canvasRect);return i.createElement("div",{id:"context-menu-popover",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},o)}}]),f}(i.Component);function y(e){var t=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var n,c=o(e);if(t){var i=o(this).constructor;n=Reflect.construct(c,arguments,i)}else n=c.apply(this,arguments);return r(this,n)}}var b=function(o){n(a,o);var r=y(a);function a(t){var n;return e(this,a),(n=r.call(this,t)).state={},n.contextMenuClicked=n.contextMenuClicked.bind(c(n)),n.handleClickOutside=n.handleClickOutside.bind(c(n)),n}return t(a,[{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).getBoundingClientRect();return{top:0,bottom:e.bottom-e.top,left:0,right:e.right-e.left,height:e.height,width:e.width}}},{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){this.props.contextMenuActionHandler(e,t)}},{key:"render",value:function(){return i.createElement(k,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos})}}]),a}(i.Component);export{b as default};
 //# sourceMappingURL=context-menu.es.js.map

package/dist/lib/context-menu.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"context-menu.es.js","sources":["../../src/color-picker/color-picker-panel.jsx","../../src/context-menu/common-context-menu.jsx","../../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2022 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 Logger from \"../logging/canvas-logger.js\";\n\n\nclass ColorPickerPanel extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-ContextMenu\");\n\n\t\tthis.onClick = this.onClick.bind(this);\n\t}\n\n\tonClick(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.clickActionHandler(color);\n\t}\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\treturn (\n\t\t\t<div className=\"color-picker-panel\" onClick={this.onClick}>\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>);\n\t}\n}\n\nColorPickerPanel.propTypes = {\n\tclickActionHandler: PropTypes.func.isRequired,\n\tcloseMenu: PropTypes.func\n};\n\nexport default ColorPickerPanel;\n","/*\n * Copyright 2017-2022 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\";\nimport { MenuItem, SubMenu } from \"react-contextmenu\";\nimport Icon from \"../icons/icon.jsx\";\nimport { CONTEXT_MENU_CARBON_ICONS } from \"../common-canvas/constants/canvas-constants\";\nimport ColorPickerPanel from \"../color-picker/color-picker-panel.jsx\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // see context-menu.css .react-context-menu margin\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // see context-menu.css .react-context-menu-item height\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // see context-menu.css .react-context-menu-item height\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\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\titemSelected(data, selectedEvent) {\n\t\tthis.props.contextHandler(data);\n\t\t// This stops the canvasClicked function from being fired which would\n\t\t// clear any current selections.\n\t\tif (selectedEvent) {\n\t\t\tselectedEvent.stopPropagation();\n\t\t}\n\t}\n\n\tcolorClicked(color) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", { color });\n\t}\n\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 a pixel 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 += 1;\n\t\tmenuPos.y += 1;\n\n\t\treturn menuPos;\n\t}\n\n\tareAllSubmenuItemsDisabled(submenuItems) {\n\t\tlet itemCount = 0;\n\t\tlet disabledCount = 0;\n\t\tsubmenuItems.forEach(function(submenuItem) {\n\t\t\tif (!submenuItem.divider) {\n\t\t\t\titemCount++;\n\t\t\t}\n\t\t\tif (submenuItem.enable === false) {\n\t\t\t\tdisabledCount++;\n\t\t\t}\n\t\t});\n\t\treturn disabledCount === itemCount;\n\t}\n\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst customDivider = {\n\t\t\tclassName: \"contextmenu-divider\"\n\t\t};\n\n\t\tconst menuItems = [];\n\n\t\tlet runningYPos = 0;\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 menuDefintion array.\n\t\tlet previousDivider = false;\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tconst submenu = menuDefinition[i].submenu;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItems.push(<MenuItem attributes={customDivider} key={i + 1} onClick={() => {}} divider />);\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\n\t\t\t} else if (submenu) {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tif (menuDefinition[i].menu === \"colorPicker\") {\n\t\t\t\t\tconst disabled = false;\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuContent = this.buildColorPickerPanel();\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\n\t\t\t\t} else {\n\t\t\t\t\tconst disabled = { disabled: this.areAllSubmenuItemsDisabled(menuDefinition[i].menu) };\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuContent = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect);\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t\t}\n\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tconst disabled = { disabled: menuDefinition[i].enable === false };\n\t\t\t\tmenuItems.push(\n\t\t\t\t\t<MenuItem onClick={this.itemSelected.bind(null, menuDefinition[i].action)} key={i + 1} {...disabled}>\n\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t}\n\t\treturn menuItems;\n\t}\n\n\tbuildColorPickerPanel() {\n\t\treturn (\n\t\t\t<ColorPickerPanel clickActionHandler={this.colorPickHandler} clickActionHandler={this.colorClicked} />\n\t\t);\n\t}\n\n\tbuildSubMenu(menuDefinition, index, 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);\n\n\t\tconst icon = <Icon type={CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT} disabled={false} className={\"react-contextmenu-submenu-icon\"} />;\n\t\tconst menuItem = <div>{menuDefinition[index].label}{icon} </div>;\n\n\t\treturn (\n\t\t\t<SubMenu title={menuItem} key={index + 1} className=\"contextmenu-submenu\" rtl={rtl} {...disabled}>\n\t\t\t\t<div key={index + 1} style={subMenuPosStyle} className=\"context-menu-popover\">\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</SubMenu>\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\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust\n\t// its vertical (y) position. This may be necessary if the submenu is tall\n\t// enough that it would be displayed off the bottom of the canvas area.\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect) {\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\t\treturn subMenuPosStyle;\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\tconst menuItems = this.buildMenu(this.props.menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: 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-2022 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\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\tconst canvasRect = {\n\t\t\ttop: 0,\n\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\tleft: 0,\n\t\t\tright: clientRect.right - clientRect.left,\n\t\t\theight: clientRect.height,\n\t\t\twidth: clientRect.width\n\t\t};\n\n\t\treturn canvasRect;\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 emmitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwse, 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// Retruns 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 cicumstances 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, param) {\n\t\tthis.props.contextMenuActionHandler(action, 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/>\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":["_inherits","props","_classCallCheck","_this","logger","Logger","onClick","bind","_createClass","key","value","evt","color","target","dataset","this","clickActionHandler","log","React","className","tabIndex","Component","state","itemSelected","colorClicked","e","preventDefault","data","selectedEvent","contextHandler","stopPropagation","menu","numDividers","i","length","divider","height","width","mousePos","menuSize","canvasRect","menuPos","x","y","submenuItems","itemCount","disabledCount","forEach","submenuItem","enable","menuDefinition","customDivider","menuItems","runningYPos","previousDivider","submenu","push","MenuItem","attributes","subMenuSize","subMenuContent","buildColorPickerPanel","subMenu","buildSubMenu","disabled","areAllSubmenuItemsDisabled","calculateMenuSize","buildMenu","action","label","ColorPickerPanel","colorPickHandler","index","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","Icon","type","CONTEXT_MENU_CARBON_ICONS","CHEVRONARROWS","RIGHT","menuItem","SubMenu","title","style","right","bottom","top","calculateMenuPos","posStyle","left","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","clientRect","getElementById","containingDivId","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","closeContextMenu","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","CommonContextMenu","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}
+{"version":3,"file":"context-menu.es.js","sources":["../../src/color-picker/color-picker-panel.jsx","../../src/context-menu/common-context-menu.jsx","../../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2022 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 Logger from \"../logging/canvas-logger.js\";\n\n\nclass ColorPickerPanel extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-ContextMenu\");\n\n\t\tthis.onClick = this.onClick.bind(this);\n\t}\n\n\tonClick(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.clickActionHandler(color);\n\t}\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\treturn (\n\t\t\t<div className=\"color-picker-panel\" onClick={this.onClick}>\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>);\n\t}\n}\n\nColorPickerPanel.propTypes = {\n\tclickActionHandler: PropTypes.func.isRequired,\n\tcloseMenu: PropTypes.func\n};\n\nexport default ColorPickerPanel;\n","/*\n * Copyright 2017-2022 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\";\nimport { MenuItem, SubMenu } from \"react-contextmenu\";\nimport Icon from \"../icons/icon.jsx\";\nimport { CONTEXT_MENU_CARBON_ICONS } from \"../common-canvas/constants/canvas-constants\";\nimport ColorPickerPanel from \"../color-picker/color-picker-panel.jsx\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // see context-menu.css .react-context-menu margin\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // see context-menu.css .react-context-menu-item height\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // see context-menu.css .react-context-menu-item height\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\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\titemSelected(data, selectedEvent) {\n\t\tthis.props.contextHandler(data);\n\t\t// This stops the canvasClicked function from being fired which would\n\t\t// clear any current selections.\n\t\tif (selectedEvent) {\n\t\t\tselectedEvent.stopPropagation();\n\t\t}\n\t}\n\n\tcolorClicked(color) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", { color });\n\t}\n\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 a pixel 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 += 1;\n\t\tmenuPos.y += 1;\n\n\t\treturn menuPos;\n\t}\n\n\tareAllSubmenuItemsDisabled(submenuItems) {\n\t\tlet itemCount = 0;\n\t\tlet disabledCount = 0;\n\t\tsubmenuItems.forEach(function(submenuItem) {\n\t\t\tif (!submenuItem.divider) {\n\t\t\t\titemCount++;\n\t\t\t}\n\t\t\tif (submenuItem.enable === false) {\n\t\t\t\tdisabledCount++;\n\t\t\t}\n\t\t});\n\t\treturn disabledCount === itemCount;\n\t}\n\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst customDivider = {\n\t\t\tclassName: \"contextmenu-divider\"\n\t\t};\n\n\t\tconst menuItems = [];\n\n\t\tlet runningYPos = 0;\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 menuDefintion array.\n\t\tlet previousDivider = false;\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tconst submenu = menuDefinition[i].submenu;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItems.push(<MenuItem attributes={customDivider} key={i + 1} onClick={() => {}} divider />);\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\n\t\t\t} else if (submenu) {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tif (menuDefinition[i].menu === \"colorPicker\") {\n\t\t\t\t\tconst disabled = false;\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuContent = this.buildColorPickerPanel();\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\n\t\t\t\t} else {\n\t\t\t\t\tconst disabled = { disabled: this.areAllSubmenuItemsDisabled(menuDefinition[i].menu) };\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuContent = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect);\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t\t}\n\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tconst disabled = { disabled: menuDefinition[i].enable === false };\n\t\t\t\tmenuItems.push(\n\t\t\t\t\t<MenuItem onClick={this.itemSelected.bind(null, menuDefinition[i].action)} key={i + 1} {...disabled}>\n\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t}\n\t\treturn menuItems;\n\t}\n\n\tbuildColorPickerPanel() {\n\t\treturn (\n\t\t\t<ColorPickerPanel clickActionHandler={this.colorPickHandler} clickActionHandler={this.colorClicked} />\n\t\t);\n\t}\n\n\tbuildSubMenu(menuDefinition, index, 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);\n\n\t\tconst icon = <Icon type={CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT} disabled={false} className={\"react-contextmenu-submenu-icon\"} />;\n\t\tconst menuItem = <div>{menuDefinition[index].label}{icon} </div>;\n\n\t\treturn (\n\t\t\t<SubMenu title={menuItem} key={index + 1} className=\"contextmenu-submenu\" rtl={rtl} {...disabled}>\n\t\t\t\t<div key={index + 1} style={subMenuPosStyle} className=\"context-menu-popover\">\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</SubMenu>\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\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust\n\t// its vertical (y) position. This may be necessary if the submenu is tall\n\t// enough that it would be displayed off the bottom of the canvas area.\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect) {\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\t\treturn subMenuPosStyle;\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\tconst menuItems = this.buildMenu(this.props.menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: 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-2022 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\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\tconst canvasRect = {\n\t\t\ttop: 0,\n\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\tleft: 0,\n\t\t\tright: clientRect.right - clientRect.left,\n\t\t\theight: clientRect.height,\n\t\t\twidth: clientRect.width\n\t\t};\n\n\t\treturn canvasRect;\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 emmitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwse, 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// Retruns 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 cicumstances 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, param) {\n\t\tthis.props.contextMenuActionHandler(action, 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/>\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":["_React$Component","_inherits","ColorPickerPanel","_super","_createSuper","props","_this","_classCallCheck","call","logger","Logger","onClick","bind","_assertThisInitialized","_createClass","key","value","evt","color","target","dataset","this","clickActionHandler","log","React","createElement","className","tabIndex","Component","CommonContextMenu","state","itemSelected","colorClicked","e","preventDefault","data","selectedEvent","contextHandler","stopPropagation","menu","numDividers","i","length","divider","height","width","mousePos","menuSize","canvasRect","menuPos","x","y","submenuItems","itemCount","disabledCount","forEach","submenuItem","enable","menuDefinition","customDivider","menuItems","runningYPos","previousDivider","submenu","push","MenuItem","attributes","subMenuSize","subMenuContent","buildColorPickerPanel","subMenu","buildSubMenu","disabled","areAllSubmenuItemsDisabled","calculateMenuSize","buildMenu","_extends","action","label","_defineProperty","colorPickHandler","index","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","Icon","type","CONTEXT_MENU_CARBON_ICONS","CHEVRONARROWS","RIGHT","menuItem","SubMenu","title","style","right","bottom","top","calculateMenuPos","posStyle","left","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","clientRect","getElementById","containingDivId","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","closeContextMenu","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}

package/dist/lib/context-menu.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../createClass-826941b3.js"),t=require("../getPrototypeOf-1e698126.js"),n=require("react"),r=require("../canvas-constants-07dbe4b7.js"),o=require("../extends-841b39ac.js"),i=require("react-contextmenu"),l=require("../icon-f6f2bffc.js"),c=require("../canvas-logger-bb537fb3.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-inlinesvg"),require("@carbon/icons-react");var u=a(n);function s(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var d=function(n){t._inherits(o,n);var r=s(o);function o(n){var i;return e._classCallCheck(this,o),(i=r.call(this,n)).logger=new c.Logger("CC-ContextMenu"),i.onClick=i.onClick.bind(t._assertThisInitialized(i)),i}return e._createClass(o,[{key:"onClick",value:function(e){var t=e.target.dataset.color;this.props.clickActionHandler(t)}},{key:"render",value:function(){return this.logger.log("render"),u.default.createElement("div",{className:"color-picker-panel",onClick:this.onClick},u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}]),o}(u.default.Component);function f(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var h=function(n){t._inherits(a,n);var c=f(a);function a(n){var r;return e._classCallCheck(this,a),(r=c.call(this,n)).state={},r.itemSelected=r.itemSelected.bind(t._assertThisInitialized(r)),r.colorClicked=r.colorClicked.bind(t._assertThisInitialized(r)),r}return e._createClass(a,[{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"itemSelected",value:function(e,t){this.props.contextHandler(e),t&&t.stopPropagation()}},{key:"colorClicked",value:function(e){this.props.contextHandler("colorSelectedObjects",{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 r={x:e.x,y:e.y};return e.y+t.height>n.height&&(r.y=n.height-t.height-5,r.y<0&&(r.y=0)),e.x+t.width>n.width&&(r.x-=t.width),r.x+=1,r.y+=1,r}},{key:"areAllSubmenuItemsDisabled",value:function(e){var t=0,n=0;return e.forEach((function(e){e.divider||t++,!1===e.enable&&n++})),n===t}},{key:"buildMenu",value:function(e,t,n,r){for(var l={className:"contextmenu-divider"},c=[],a=0,s=!1,d=0;d<e.length;++d){var f=e[d].divider,h=e[d].submenu;if(f)s||(c.push(u.default.createElement(i.MenuItem,{attributes:l,key:d+1,onClick:function(){},divider:!0})),a+=1,s=!0);else if(h)if(s=!1,"colorPicker"===e[d].menu){var p={width:160,height:50},m=this.buildColorPickerPanel(),v=this.buildSubMenu(e,d,m,a,n,t,p,r,!1);c.push(v),a+=30}else{var k={disabled:this.areAllSubmenuItemsDisabled(e[d].menu)},y=this.calculateMenuSize(e[d].menu),b=this.buildMenu(e[d].menu,t,n,r),g=this.buildSubMenu(e,d,b,a,n,t,y,r,k);c.push(g),a+=30}else{s=!1;var C={disabled:!1===e[d].enable};c.push(u.default.createElement(i.MenuItem,o._extends({onClick:this.itemSelected.bind(null,e[d].action),key:d+1},C),e[d].label)),a+=30}}return c}},{key:"buildColorPickerPanel",value:function(){return u.default.createElement(d,r._defineProperty({clickActionHandler:this.colorPickHandler},"clickActionHandler",this.colorClicked))}},{key:"buildSubMenu",value:function(e,t,n,c,a,s,d,f,h){var p=this.buildRtlState(a,s,d,f),m=this.buildSubMenuPosStyle(c,a,d,f),v=u.default.createElement(l.Icon,{type:r.CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT,disabled:!1,className:"react-contextmenu-submenu-icon"}),k=u.default.createElement("div",null,e[t].label,v," ");return u.default.createElement(i.SubMenu,o._extends({title:k,key:t+1,className:"contextmenu-submenu",rtl:p},h),u.default.createElement("div",{key:t+1,style:m,className:"context-menu-popover"},n))}},{key:"buildRtlState",value:function(e,t,n,r){return e.x+t.width+n.width>r.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,r){var o=r.bottom-(t.y+e+n.height);return{top:(o>0?0:o-5)+"px"}}},{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"},r=this.buildMenu(this.props.menuDefinition,e,t,this.props.canvasRect);return u.default.createElement("div",{id:"context-menu-popover",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},r)}}]),a}(u.default.Component);function p(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var m=function(n){t._inherits(o,n);var r=p(o);function o(n){var i;return e._classCallCheck(this,o),(i=r.call(this,n)).state={},i.contextMenuClicked=i.contextMenuClicked.bind(t._assertThisInitialized(i)),i.handleClickOutside=i.handleClickOutside.bind(t._assertThisInitialized(i)),i}return 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).getBoundingClientRect();return{top:0,bottom:e.bottom-e.top,left:0,right:e.right-e.left,height:e.height,width:e.width}}},{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,r=0;r<t.length;r++)!1===n&&t[r].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t){this.props.contextMenuActionHandler(e,t)}},{key:"render",value:function(){return u.default.createElement(h,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos})}}]),o}(u.default.Component);module.exports=m;
+"use strict";var e=require("../createClass-826941b3.js"),t=require("../getPrototypeOf-1e698126.js"),n=require("react"),r=require("../canvas-constants-07dbe4b7.js"),o=require("../extends-86f8d713.js"),i=require("react-contextmenu"),l=require("../icon-63afae46.js"),c=require("../canvas-logger-bb537fb3.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}require("react-inlinesvg"),require("@carbon/icons-react");var u=a(n);function s(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var d=function(n){t._inherits(o,n);var r=s(o);function o(n){var i;return e._classCallCheck(this,o),(i=r.call(this,n)).logger=new c.Logger("CC-ContextMenu"),i.onClick=i.onClick.bind(t._assertThisInitialized(i)),i}return e._createClass(o,[{key:"onClick",value:function(e){var t=e.target.dataset.color;this.props.clickActionHandler(t)}},{key:"render",value:function(){return this.logger.log("render"),u.default.createElement("div",{className:"color-picker-panel",onClick:this.onClick},u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-white-0",className:"color-picker-item white-0"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-yellow-20",className:"color-picker-item yellow-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-20",className:"color-picker-item gray-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-20",className:"color-picker-item green-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-20",className:"color-picker-item teal-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-20",className:"color-picker-item cyan-20"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-red-50",className:"color-picker-item red-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-orange-40",className:"color-picker-item orange-40"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-gray-50",className:"color-picker-item gray-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-green-50",className:"color-picker-item green-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-teal-50",className:"color-picker-item teal-50"}),u.default.createElement("div",{tabIndex:"0","data-color":"bkg-col-cyan-50",className:"color-picker-item cyan-50"}))}}]),o}(u.default.Component);function f(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var h=function(n){t._inherits(a,n);var c=f(a);function a(n){var r;return e._classCallCheck(this,a),(r=c.call(this,n)).state={},r.itemSelected=r.itemSelected.bind(t._assertThisInitialized(r)),r.colorClicked=r.colorClicked.bind(t._assertThisInitialized(r)),r}return e._createClass(a,[{key:"onContextMenu",value:function(e){e.preventDefault()}},{key:"itemSelected",value:function(e,t){this.props.contextHandler(e),t&&t.stopPropagation()}},{key:"colorClicked",value:function(e){this.props.contextHandler("colorSelectedObjects",{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 r={x:e.x,y:e.y};return e.y+t.height>n.height&&(r.y=n.height-t.height-5,r.y<0&&(r.y=0)),e.x+t.width>n.width&&(r.x-=t.width),r.x+=1,r.y+=1,r}},{key:"areAllSubmenuItemsDisabled",value:function(e){var t=0,n=0;return e.forEach((function(e){e.divider||t++,!1===e.enable&&n++})),n===t}},{key:"buildMenu",value:function(e,t,n,r){for(var l={className:"contextmenu-divider"},c=[],a=0,s=!1,d=0;d<e.length;++d){var f=e[d].divider,h=e[d].submenu;if(f)s||(c.push(u.default.createElement(i.MenuItem,{attributes:l,key:d+1,onClick:function(){},divider:!0})),a+=1,s=!0);else if(h)if(s=!1,"colorPicker"===e[d].menu){var p={width:160,height:50},m=this.buildColorPickerPanel(),v=this.buildSubMenu(e,d,m,a,n,t,p,r,!1);c.push(v),a+=30}else{var k={disabled:this.areAllSubmenuItemsDisabled(e[d].menu)},y=this.calculateMenuSize(e[d].menu),b=this.buildMenu(e[d].menu,t,n,r),g=this.buildSubMenu(e,d,b,a,n,t,y,r,k);c.push(g),a+=30}else{s=!1;var C={disabled:!1===e[d].enable};c.push(u.default.createElement(i.MenuItem,o._extends({onClick:this.itemSelected.bind(null,e[d].action),key:d+1},C),e[d].label)),a+=30}}return c}},{key:"buildColorPickerPanel",value:function(){return u.default.createElement(d,r._defineProperty({clickActionHandler:this.colorPickHandler},"clickActionHandler",this.colorClicked))}},{key:"buildSubMenu",value:function(e,t,n,c,a,s,d,f,h){var p=this.buildRtlState(a,s,d,f),m=this.buildSubMenuPosStyle(c,a,d,f),v=u.default.createElement(l.Icon,{type:r.CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT,disabled:!1,className:"react-contextmenu-submenu-icon"}),k=u.default.createElement("div",null,e[t].label,v," ");return u.default.createElement(i.SubMenu,o._extends({title:k,key:t+1,className:"contextmenu-submenu",rtl:p},h),u.default.createElement("div",{key:t+1,style:m,className:"context-menu-popover"},n))}},{key:"buildRtlState",value:function(e,t,n,r){return e.x+t.width+n.width>r.right}},{key:"buildSubMenuPosStyle",value:function(e,t,n,r){var o=r.bottom-(t.y+e+n.height);return{top:(o>0?0:o-5)+"px"}}},{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"},r=this.buildMenu(this.props.menuDefinition,e,t,this.props.canvasRect);return u.default.createElement("div",{id:"context-menu-popover",className:"context-menu-popover",style:n,onContextMenu:this.onContextMenu},r)}}]),a}(u.default.Component);function p(e){var n=function(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}();return function(){var r,o=t._getPrototypeOf(e);if(n){var i=t._getPrototypeOf(this).constructor;r=Reflect.construct(o,arguments,i)}else r=o.apply(this,arguments);return t._possibleConstructorReturn(this,r)}}var m=function(n){t._inherits(o,n);var r=p(o);function o(n){var i;return e._classCallCheck(this,o),(i=r.call(this,n)).state={},i.contextMenuClicked=i.contextMenuClicked.bind(t._assertThisInitialized(i)),i.handleClickOutside=i.handleClickOutside.bind(t._assertThisInitialized(i)),i}return 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).getBoundingClientRect();return{top:0,bottom:e.bottom-e.top,left:0,right:e.right-e.left,height:e.height,width:e.width}}},{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,r=0;r<t.length;r++)!1===n&&t[r].contains(e.target)&&(n=!0);return n}},{key:"contextMenuClicked",value:function(e,t){this.props.contextMenuActionHandler(e,t)}},{key:"render",value:function(){return u.default.createElement(h,{contextHandler:this.contextMenuClicked,menuDefinition:this.props.contextMenuDef,canvasRect:this.getCanvasRect(),mousePos:this.props.contextMenuPos})}}]),o}(u.default.Component);module.exports=m;
 //# sourceMappingURL=context-menu.js.map

package/dist/lib/context-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"context-menu.js","sources":["../../src/color-picker/color-picker-panel.jsx","../../src/context-menu/common-context-menu.jsx","../../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2022 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 Logger from \"../logging/canvas-logger.js\";\n\n\nclass ColorPickerPanel extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-ContextMenu\");\n\n\t\tthis.onClick = this.onClick.bind(this);\n\t}\n\n\tonClick(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.clickActionHandler(color);\n\t}\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\treturn (\n\t\t\t<div className=\"color-picker-panel\" onClick={this.onClick}>\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>);\n\t}\n}\n\nColorPickerPanel.propTypes = {\n\tclickActionHandler: PropTypes.func.isRequired,\n\tcloseMenu: PropTypes.func\n};\n\nexport default ColorPickerPanel;\n","/*\n * Copyright 2017-2022 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\";\nimport { MenuItem, SubMenu } from \"react-contextmenu\";\nimport Icon from \"../icons/icon.jsx\";\nimport { CONTEXT_MENU_CARBON_ICONS } from \"../common-canvas/constants/canvas-constants\";\nimport ColorPickerPanel from \"../color-picker/color-picker-panel.jsx\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // see context-menu.css .react-context-menu margin\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // see context-menu.css .react-context-menu-item height\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // see context-menu.css .react-context-menu-item height\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\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\titemSelected(data, selectedEvent) {\n\t\tthis.props.contextHandler(data);\n\t\t// This stops the canvasClicked function from being fired which would\n\t\t// clear any current selections.\n\t\tif (selectedEvent) {\n\t\t\tselectedEvent.stopPropagation();\n\t\t}\n\t}\n\n\tcolorClicked(color) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", { color });\n\t}\n\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 a pixel 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 += 1;\n\t\tmenuPos.y += 1;\n\n\t\treturn menuPos;\n\t}\n\n\tareAllSubmenuItemsDisabled(submenuItems) {\n\t\tlet itemCount = 0;\n\t\tlet disabledCount = 0;\n\t\tsubmenuItems.forEach(function(submenuItem) {\n\t\t\tif (!submenuItem.divider) {\n\t\t\t\titemCount++;\n\t\t\t}\n\t\t\tif (submenuItem.enable === false) {\n\t\t\t\tdisabledCount++;\n\t\t\t}\n\t\t});\n\t\treturn disabledCount === itemCount;\n\t}\n\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst customDivider = {\n\t\t\tclassName: \"contextmenu-divider\"\n\t\t};\n\n\t\tconst menuItems = [];\n\n\t\tlet runningYPos = 0;\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 menuDefintion array.\n\t\tlet previousDivider = false;\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tconst submenu = menuDefinition[i].submenu;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItems.push(<MenuItem attributes={customDivider} key={i + 1} onClick={() => {}} divider />);\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\n\t\t\t} else if (submenu) {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tif (menuDefinition[i].menu === \"colorPicker\") {\n\t\t\t\t\tconst disabled = false;\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuContent = this.buildColorPickerPanel();\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\n\t\t\t\t} else {\n\t\t\t\t\tconst disabled = { disabled: this.areAllSubmenuItemsDisabled(menuDefinition[i].menu) };\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuContent = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect);\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t\t}\n\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tconst disabled = { disabled: menuDefinition[i].enable === false };\n\t\t\t\tmenuItems.push(\n\t\t\t\t\t<MenuItem onClick={this.itemSelected.bind(null, menuDefinition[i].action)} key={i + 1} {...disabled}>\n\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t}\n\t\treturn menuItems;\n\t}\n\n\tbuildColorPickerPanel() {\n\t\treturn (\n\t\t\t<ColorPickerPanel clickActionHandler={this.colorPickHandler} clickActionHandler={this.colorClicked} />\n\t\t);\n\t}\n\n\tbuildSubMenu(menuDefinition, index, 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);\n\n\t\tconst icon = <Icon type={CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT} disabled={false} className={\"react-contextmenu-submenu-icon\"} />;\n\t\tconst menuItem = <div>{menuDefinition[index].label}{icon} </div>;\n\n\t\treturn (\n\t\t\t<SubMenu title={menuItem} key={index + 1} className=\"contextmenu-submenu\" rtl={rtl} {...disabled}>\n\t\t\t\t<div key={index + 1} style={subMenuPosStyle} className=\"context-menu-popover\">\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</SubMenu>\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\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust\n\t// its vertical (y) position. This may be necessary if the submenu is tall\n\t// enough that it would be displayed off the bottom of the canvas area.\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect) {\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\t\treturn subMenuPosStyle;\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\tconst menuItems = this.buildMenu(this.props.menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: 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-2022 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\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\tconst canvasRect = {\n\t\t\ttop: 0,\n\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\tleft: 0,\n\t\t\tright: clientRect.right - clientRect.left,\n\t\t\theight: clientRect.height,\n\t\t\twidth: clientRect.width\n\t\t};\n\n\t\treturn canvasRect;\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 emmitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwse, 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// Retruns 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 cicumstances 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, param) {\n\t\tthis.props.contextMenuActionHandler(action, 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/>\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":["_inherits","props","_classCallCheck","_this","logger","Logger","onClick","bind","_createClass","key","value","evt","color","target","dataset","this","clickActionHandler","log","React","className","tabIndex","Component","state","itemSelected","colorClicked","e","preventDefault","data","selectedEvent","contextHandler","stopPropagation","menu","numDividers","i","length","divider","height","width","mousePos","menuSize","canvasRect","menuPos","x","y","submenuItems","itemCount","disabledCount","forEach","submenuItem","enable","menuDefinition","customDivider","menuItems","runningYPos","previousDivider","submenu","push","MenuItem","attributes","subMenuSize","subMenuContent","buildColorPickerPanel","subMenu","buildSubMenu","disabled","areAllSubmenuItemsDisabled","calculateMenuSize","buildMenu","action","label","ColorPickerPanel","colorPickHandler","index","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","Icon","type","CONTEXT_MENU_CARBON_ICONS","CHEVRONARROWS","RIGHT","menuItem","SubMenu","title","style","right","bottom","top","calculateMenuPos","posStyle","left","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","clientRect","getElementById","containingDivId","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","closeContextMenu","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","CommonContextMenu","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}
+{"version":3,"file":"context-menu.js","sources":["../../src/color-picker/color-picker-panel.jsx","../../src/context-menu/common-context-menu.jsx","../../src/context-menu/context-menu-wrapper.jsx"],"sourcesContent":["/*\n * Copyright 2022 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 Logger from \"../logging/canvas-logger.js\";\n\n\nclass ColorPickerPanel extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.logger = new Logger(\"CC-ContextMenu\");\n\n\t\tthis.onClick = this.onClick.bind(this);\n\t}\n\n\tonClick(evt) {\n\t\tconst color = evt.target.dataset.color;\n\t\tthis.props.clickActionHandler(color);\n\t}\n\n\trender() {\n\t\tthis.logger.log(\"render\");\n\t\treturn (\n\t\t\t<div className=\"color-picker-panel\" onClick={this.onClick}>\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-white-0\"} className=\"color-picker-item white-0\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-yellow-20\"} className=\"color-picker-item yellow-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-20\"} className=\"color-picker-item gray-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-20\"} className=\"color-picker-item green-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-20\"} className=\"color-picker-item teal-20\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-20\"} className=\"color-picker-item cyan-20\" />\n\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-red-50\"} className=\"color-picker-item red-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-orange-40\"} className=\"color-picker-item orange-40\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-gray-50\"} className=\"color-picker-item gray-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-green-50\"} className=\"color-picker-item green-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-teal-50\"} className=\"color-picker-item teal-50\" />\n\t\t\t\t<div tabIndex=\"0\" data-color={\"bkg-col-cyan-50\"} className=\"color-picker-item cyan-50\" />\n\t\t\t</div>);\n\t}\n}\n\nColorPickerPanel.propTypes = {\n\tclickActionHandler: PropTypes.func.isRequired,\n\tcloseMenu: PropTypes.func\n};\n\nexport default ColorPickerPanel;\n","/*\n * Copyright 2017-2022 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\";\nimport { MenuItem, SubMenu } from \"react-contextmenu\";\nimport Icon from \"../icons/icon.jsx\";\nimport { CONTEXT_MENU_CARBON_ICONS } from \"../common-canvas/constants/canvas-constants\";\nimport ColorPickerPanel from \"../color-picker/color-picker-panel.jsx\";\n\n// context-menu sizing\nconst CONTEXT_MENU_WIDTH = 160; // see context-menu.css .react-context-menu margin\nconst CONTEXT_MENU_LINK_HEIGHT = 30; // see context-menu.css .react-context-menu-item height\nconst CONTEXT_MENU_DIVIDER_HEIGHT = 1; // see context-menu.css .react-context-menu-item height\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\tthis.itemSelected = this.itemSelected.bind(this);\n\t\tthis.colorClicked = this.colorClicked.bind(this);\n\t}\n\n\tonContextMenu(e) {\n\t\te.preventDefault();\n\t}\n\n\titemSelected(data, selectedEvent) {\n\t\tthis.props.contextHandler(data);\n\t\t// This stops the canvasClicked function from being fired which would\n\t\t// clear any current selections.\n\t\tif (selectedEvent) {\n\t\t\tselectedEvent.stopPropagation();\n\t\t}\n\t}\n\n\tcolorClicked(color) {\n\t\tthis.props.contextHandler(\"colorSelectedObjects\", { color });\n\t}\n\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 a pixel 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 += 1;\n\t\tmenuPos.y += 1;\n\n\t\treturn menuPos;\n\t}\n\n\tareAllSubmenuItemsDisabled(submenuItems) {\n\t\tlet itemCount = 0;\n\t\tlet disabledCount = 0;\n\t\tsubmenuItems.forEach(function(submenuItem) {\n\t\t\tif (!submenuItem.divider) {\n\t\t\t\titemCount++;\n\t\t\t}\n\t\t\tif (submenuItem.enable === false) {\n\t\t\t\tdisabledCount++;\n\t\t\t}\n\t\t});\n\t\treturn disabledCount === itemCount;\n\t}\n\n\tbuildMenu(menuDefinition, menuSize, menuPos, canvasRect) {\n\t\tconst customDivider = {\n\t\t\tclassName: \"contextmenu-divider\"\n\t\t};\n\n\t\tconst menuItems = [];\n\n\t\tlet runningYPos = 0;\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 menuDefintion array.\n\t\tlet previousDivider = false;\n\n\t\tfor (let i = 0; i < menuDefinition.length; ++i) {\n\t\t\tconst divider = menuDefinition[i].divider;\n\t\t\tconst submenu = menuDefinition[i].submenu;\n\n\t\t\tif (divider) {\n\t\t\t\tif (!previousDivider) {\n\t\t\t\t\tmenuItems.push(<MenuItem attributes={customDivider} key={i + 1} onClick={() => {}} divider />);\n\t\t\t\t\trunningYPos += CONTEXT_MENU_DIVIDER_HEIGHT;\n\t\t\t\t\tpreviousDivider = true;\n\t\t\t\t}\n\n\t\t\t} else if (submenu) {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tif (menuDefinition[i].menu === \"colorPicker\") {\n\t\t\t\t\tconst disabled = false;\n\t\t\t\t\tconst subMenuSize = { width: CONTEXT_MENU_WIDTH, height: 50 };\n\t\t\t\t\tconst subMenuContent = this.buildColorPickerPanel();\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\n\t\t\t\t} else {\n\t\t\t\t\tconst disabled = { disabled: this.areAllSubmenuItemsDisabled(menuDefinition[i].menu) };\n\t\t\t\t\tconst subMenuSize = this.calculateMenuSize(menuDefinition[i].menu);\n\t\t\t\t\tconst subMenuContent = this.buildMenu(menuDefinition[i].menu, menuSize, menuPos, canvasRect);\n\n\t\t\t\t\tconst subMenu = this.buildSubMenu(\n\t\t\t\t\t\tmenuDefinition, i, subMenuContent, runningYPos, menuPos, menuSize, subMenuSize, canvasRect, disabled);\n\t\t\t\t\tmenuItems.push(subMenu);\n\n\t\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t\t}\n\n\t\t\t} else {\n\t\t\t\tpreviousDivider = false;\n\t\t\t\tconst disabled = { disabled: menuDefinition[i].enable === false };\n\t\t\t\tmenuItems.push(\n\t\t\t\t\t<MenuItem onClick={this.itemSelected.bind(null, menuDefinition[i].action)} key={i + 1} {...disabled}>\n\t\t\t\t\t\t{menuDefinition[i].label}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t\trunningYPos += CONTEXT_MENU_LINK_HEIGHT;\n\t\t\t}\n\t\t}\n\t\treturn menuItems;\n\t}\n\n\tbuildColorPickerPanel() {\n\t\treturn (\n\t\t\t<ColorPickerPanel clickActionHandler={this.colorPickHandler} clickActionHandler={this.colorClicked} />\n\t\t);\n\t}\n\n\tbuildSubMenu(menuDefinition, index, 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);\n\n\t\tconst icon = <Icon type={CONTEXT_MENU_CARBON_ICONS.CHEVRONARROWS.RIGHT} disabled={false} className={\"react-contextmenu-submenu-icon\"} />;\n\t\tconst menuItem = <div>{menuDefinition[index].label}{icon} </div>;\n\n\t\treturn (\n\t\t\t<SubMenu title={menuItem} key={index + 1} className=\"contextmenu-submenu\" rtl={rtl} {...disabled}>\n\t\t\t\t<div key={index + 1} style={subMenuPosStyle} className=\"context-menu-popover\">\n\t\t\t\t\t{subMenuContent}\n\t\t\t\t</div>\n\t\t\t</SubMenu>\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\n\t}\n\n\t// Returns a style object that can be applied to the sub-menu to adjust\n\t// its vertical (y) position. This may be necessary if the submenu is tall\n\t// enough that it would be displayed off the bottom of the canvas area.\n\tbuildSubMenuPosStyle(runningYPos, menuPos, subMenuSize, canvasRect) {\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\t\treturn subMenuPosStyle;\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\tconst menuItems = this.buildMenu(this.props.menuDefinition, menuSize, menuPos, this.props.canvasRect);\n\n\t\treturn (\n\t\t\t<div id=\"context-menu-popover\" className=\"context-menu-popover\" style={posStyle} onContextMenu={this.onContextMenu}>\n\t\t\t\t{menuItems}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nCommonContextMenu.propTypes = {\n\tcontextHandler: 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-2022 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\tconst clientRect = containingDiv.getBoundingClientRect();\n\t\tconst canvasRect = {\n\t\t\ttop: 0,\n\t\t\tbottom: clientRect.bottom - clientRect.top,\n\t\t\tleft: 0,\n\t\t\tright: clientRect.right - clientRect.left,\n\t\t\theight: clientRect.height,\n\t\t\twidth: clientRect.width\n\t\t};\n\n\t\treturn canvasRect;\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 emmitted which is received here with the ctrlKey field enabled.\n\t\t// So we ignore that event otherwse, 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// Retruns 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 cicumstances 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, param) {\n\t\tthis.props.contextMenuActionHandler(action, 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/>\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":["_React$Component","_inherits","ColorPickerPanel","_super","_createSuper","props","_this","_classCallCheck","call","logger","Logger","onClick","bind","_assertThisInitialized","_createClass","key","value","evt","color","target","dataset","this","clickActionHandler","log","React","createElement","className","tabIndex","Component","CommonContextMenu","state","itemSelected","colorClicked","e","preventDefault","data","selectedEvent","contextHandler","stopPropagation","menu","numDividers","i","length","divider","height","width","mousePos","menuSize","canvasRect","menuPos","x","y","submenuItems","itemCount","disabledCount","forEach","submenuItem","enable","menuDefinition","customDivider","menuItems","runningYPos","previousDivider","submenu","push","MenuItem","attributes","subMenuSize","subMenuContent","buildColorPickerPanel","subMenu","buildSubMenu","disabled","areAllSubmenuItemsDisabled","calculateMenuSize","buildMenu","_extends","action","label","_defineProperty","colorPickHandler","index","rtl","buildRtlState","subMenuPosStyle","buildSubMenuPosStyle","icon","Icon","type","CONTEXT_MENU_CARBON_ICONS","CHEVRONARROWS","RIGHT","menuItem","SubMenu","title","style","right","bottom","top","calculateMenuPos","posStyle","left","id","onContextMenu","ContextMenuWrapper","contextMenuClicked","handleClickOutside","document","addEventListener","removeEventListener","clientRect","getElementById","containingDivId","getBoundingClientRect","ctrlKey","isOverContextMenu","isOverEllipsisButton","closeContextMenu","domNode","contains","ellipsisNodes","getElementsByClassName","param","contextMenuActionHandler","contextMenuDef","getCanvasRect","contextMenuPos"],"mappings":"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"}

package/dist/lib/properties/field-picker.es.js

@@ -1,2 +1,2 @@
-export{F as default}from"../../index-5d62eee8.js";import"../../createClass-be661622.js";import"../../getPrototypeOf-3751add9.js";import"../../isArrayLikeObject-a9c7973b.js";import"../../flexible-table-d4bd5c25.js";import"../../extends-a9c1b4cd.js";import"react";import"react-intl";import"react-dom";import"carbon-components-react";import"../../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";import"@carbon/icons-react";import"../tooltip.es.js";import"react-portal";import"uuid";import"react-resize-detector";import"../../canvas-constants-ba465147.js";import"../../en-7201b548.js";import"../../icon-4a6f3dad.js";import"react-inlinesvg";
+export{F as default}from"../../index-5c0ad9bb.js";import"../../createClass-be661622.js";import"../../getPrototypeOf-3751add9.js";import"../../isArrayLikeObject-a9c7973b.js";import"../../flexible-table-d68c24c6.js";import"../../extends-de3127ea.js";import"react";import"react-intl";import"react-dom";import"carbon-components-react";import"../../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";import"@carbon/icons-react";import"../tooltip.es.js";import"react-portal";import"uuid";import"react-resize-detector";import"../../canvas-constants-ba465147.js";import"../../en-7201b548.js";import"../../icon-94bf4b86.js";import"react-inlinesvg";
 //# sourceMappingURL=field-picker.es.js.map

package/dist/lib/properties/field-picker.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../index-c8a96051.js");require("../../createClass-826941b3.js"),require("../../getPrototypeOf-1e698126.js"),require("../../isArrayLikeObject-f3b27f64.js"),require("../../flexible-table-f7b58f99.js"),require("../../extends-841b39ac.js"),require("react"),require("react-intl"),require("react-dom"),require("carbon-components-react"),require("../../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),require("@carbon/icons-react"),require("../tooltip.js"),require("react-portal"),require("uuid"),require("react-resize-detector"),require("../../canvas-constants-07dbe4b7.js"),require("../../en-a08356c8.js"),require("../../icon-f6f2bffc.js"),require("react-inlinesvg"),module.exports=e.FieldPicker;
+"use strict";var e=require("../../index-fc1b32b4.js");require("../../createClass-826941b3.js"),require("../../getPrototypeOf-1e698126.js"),require("../../isArrayLikeObject-f3b27f64.js"),require("../../flexible-table-f14863ac.js"),require("../../extends-86f8d713.js"),require("react"),require("react-intl"),require("react-dom"),require("carbon-components-react"),require("../../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),require("@carbon/icons-react"),require("../tooltip.js"),require("react-portal"),require("uuid"),require("react-resize-detector"),require("../../canvas-constants-07dbe4b7.js"),require("../../en-a08356c8.js"),require("../../icon-63afae46.js"),require("react-inlinesvg"),module.exports=e.FieldPicker;
 //# sourceMappingURL=field-picker.js.map

package/dist/lib/properties/flexible-table.es.js

@@ -1,2 +1,2 @@
-import{F as t}from"../../flexible-table-d4bd5c25.js";export{F as default}from"../../flexible-table-d4bd5c25.js";import"../../extends-a9c1b4cd.js";import"../../createClass-be661622.js";import"../../getPrototypeOf-3751add9.js";import"../../isArrayLikeObject-a9c7973b.js";import"react";import"react-intl";import"react-dom";import"carbon-components-react";import"../../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";import"@carbon/icons-react";import"../tooltip.es.js";import"react-portal";import"uuid";import"react-resize-detector";
+import{F as t}from"../../flexible-table-d68c24c6.js";export{F as default}from"../../flexible-table-d68c24c6.js";import"../../extends-de3127ea.js";import"../../createClass-be661622.js";import"../../getPrototypeOf-3751add9.js";import"../../isArrayLikeObject-a9c7973b.js";import"react";import"react-intl";import"react-dom";import"carbon-components-react";import"../../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";import"@carbon/icons-react";import"../tooltip.es.js";import"react-portal";import"uuid";import"react-resize-detector";
 //# sourceMappingURL=flexible-table.es.js.map

package/dist/lib/properties/flexible-table.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../../flexible-table-f7b58f99.js");require("../../extends-841b39ac.js"),require("../../createClass-826941b3.js"),require("../../getPrototypeOf-1e698126.js"),require("../../isArrayLikeObject-f3b27f64.js"),require("react"),require("react-intl"),require("react-dom"),require("carbon-components-react"),require("../../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),require("@carbon/icons-react"),require("../tooltip.js"),require("react-portal"),require("uuid"),require("react-resize-detector"),module.exports=e.FlexibleTable;
+"use strict";var e=require("../../flexible-table-f14863ac.js");require("../../extends-86f8d713.js"),require("../../createClass-826941b3.js"),require("../../getPrototypeOf-1e698126.js"),require("../../isArrayLikeObject-f3b27f64.js"),require("react"),require("react-intl"),require("react-dom"),require("carbon-components-react"),require("../../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),require("@carbon/icons-react"),require("../tooltip.js"),require("react-portal"),require("uuid"),require("react-resize-detector"),module.exports=e.FlexibleTable;
 //# sourceMappingURL=flexible-table.js.map

package/dist/lib/properties.es.js

@@ -1,2 +1,2 @@
-export{c as CommonProperties,P as PropertiesController}from"../common-properties-f596260f.js";export{F as FlexibleTable}from"../flexible-table-d4bd5c25.js";export{F as FieldPicker}from"../index-5d62eee8.js";import"../createClass-be661622.js";import"../getPrototypeOf-3751add9.js";import"react";import"../en-7201b548.js";import"../isArrayLikeObject-a9c7973b.js";import"../datarecord-metadata-v3-schema-ba1f2849.js";import"carbon-components-react";import"../extends-a9c1b4cd.js";import"react-portal";import"react-redux";import"@carbon/icons-react";import"react-dom";import"../icon-4a6f3dad.js";import"react-inlinesvg";import"../canvas-constants-ba465147.js";import"uuid";import"./tooltip.es.js";import"redux";import"seedrandom";import"./command-stack.es.js";import"immutable";import"react-intl";import"date-fns";import"prop-types";import"../toolbar-c8779b93.js";import"react-resize-detector";import"react-codemirror2";import"jsonschema";import"../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";
+export{c as CommonProperties,P as PropertiesController}from"../common-properties-9a5037f4.js";export{F as FlexibleTable}from"../flexible-table-d68c24c6.js";export{F as FieldPicker}from"../index-5c0ad9bb.js";import"../createClass-be661622.js";import"../getPrototypeOf-3751add9.js";import"react";import"../en-7201b548.js";import"../isArrayLikeObject-a9c7973b.js";import"../datarecord-metadata-v3-schema-ba1f2849.js";import"carbon-components-react";import"../extends-de3127ea.js";import"react-portal";import"react-redux";import"@carbon/icons-react";import"react-dom";import"../icon-94bf4b86.js";import"react-inlinesvg";import"../canvas-constants-ba465147.js";import"uuid";import"./tooltip.es.js";import"redux";import"seedrandom";import"./command-stack.es.js";import"immutable";import"react-intl";import"date-fns";import"prop-types";import"../toolbar-91001066.js";import"react-resize-detector";import"react-codemirror2";import"jsonschema";import"../_baseForOwn-d38b560e.js";import"react-virtualized";import"react-draggable";
 //# sourceMappingURL=properties.es.js.map

package/dist/lib/properties.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-properties-97261017.js"),r=require("../flexible-table-f7b58f99.js"),i=require("../index-c8a96051.js");require("../createClass-826941b3.js"),require("../getPrototypeOf-1e698126.js"),require("react"),require("../en-a08356c8.js"),require("../isArrayLikeObject-f3b27f64.js"),require("../datarecord-metadata-v3-schema-6a3754ce.js"),require("carbon-components-react"),require("../extends-841b39ac.js"),require("react-portal"),require("react-redux"),require("@carbon/icons-react"),require("react-dom"),require("../icon-f6f2bffc.js"),require("react-inlinesvg"),require("../canvas-constants-07dbe4b7.js"),require("uuid"),require("./tooltip.js"),require("redux"),require("seedrandom"),require("./command-stack.js"),require("immutable"),require("react-intl"),require("date-fns"),require("prop-types"),require("../toolbar-96922752.js"),require("react-resize-detector"),require("react-codemirror2"),require("jsonschema"),require("../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),exports.CommonProperties=e.commonProperties,exports.PropertiesController=e.PropertiesController,exports.FlexibleTable=r.FlexibleTable,exports.FieldPicker=i.FieldPicker;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../common-properties-cae41b08.js"),r=require("../flexible-table-f14863ac.js"),i=require("../index-fc1b32b4.js");require("../createClass-826941b3.js"),require("../getPrototypeOf-1e698126.js"),require("react"),require("../en-a08356c8.js"),require("../isArrayLikeObject-f3b27f64.js"),require("../datarecord-metadata-v3-schema-6a3754ce.js"),require("carbon-components-react"),require("../extends-86f8d713.js"),require("react-portal"),require("react-redux"),require("@carbon/icons-react"),require("react-dom"),require("../icon-63afae46.js"),require("react-inlinesvg"),require("../canvas-constants-07dbe4b7.js"),require("uuid"),require("./tooltip.js"),require("redux"),require("seedrandom"),require("./command-stack.js"),require("immutable"),require("react-intl"),require("date-fns"),require("prop-types"),require("../toolbar-393d299e.js"),require("react-resize-detector"),require("react-codemirror2"),require("jsonschema"),require("../_baseForOwn-7d4e8506.js"),require("react-virtualized"),require("react-draggable"),exports.CommonProperties=e.commonProperties,exports.PropertiesController=e.PropertiesController,exports.FlexibleTable=r.FlexibleTable,exports.FieldPicker=i.FieldPicker;
 //# sourceMappingURL=properties.js.map

package/dist/lib/tooltip.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.es.js","sources":["../../src/tooltip/tooltip.jsx"],"sourcesContent":["/*\n * Copyright 2017-2022 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\tThis code is a modified version from portal-common-api for the Elyra canvas tooltips\n*/\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Portal } from \"react-portal\";\nimport { Link } from \"carbon-components-react\";\n\nclass ToolTip extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tisTooltipVisible: false\n\t\t};\n\n\t\tthis.pendingTooltip = null;\n\t\tthis.hideTooltipOnScrollAndResize = this.hideTooltipOnScrollAndResize.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\twindow.addEventListener(\"scroll\", this.hideTooltipOnScrollAndResize, true);\n\t\twindow.addEventListener(\"resize\", this.hideTooltipOnScrollAndResize, true);\n\t\tif (this.props.targetObj) {\n\t\t\tthis.setTooltipVisible(true);\n\t\t}\n\t}\n\n\tcomponentWillUnmount() {\n\t\twindow.removeEventListener(\"scroll\", this.hideTooltipOnScrollAndResize, true);\n\t\twindow.removeEventListener(\"resize\", this.hideTooltipOnScrollAndResize, true);\n\t\tif (this.pendingTooltip) {\n\t\t\tclearTimeout(this.pendingTooltip);\n\t\t}\n\t}\n\n\tsetTooltipVisible(visible) {\n\t\t// clear the display timer if set\n\t\tif (!this.showTooltip() || (!visible && this.pendingTooltip)) {\n\t\t\tclearTimeout(this.pendingTooltip);\n\t\t\tthis.pendingTooltip = null;\n\t\t\tthis.setState({\n\t\t\t\tisTooltipVisible: false\n\t\t\t});\n\t\t}\n\n\n\t\tif (this.showTooltip()) {\n\t\t\tconst tooltip = document.querySelector(\"[data-id='\" + this.props.id + \"']\");\n\t\t\tthis.pendingTooltip = null;\n\t\t\tthis.setState({\n\t\t\t\tisTooltipVisible: visible\n\t\t\t});\n\t\t\t// updates the tooltip display\n\t\t\tif (visible) {\n\t\t\t\tlet tooltipTrigger = null;\n\t\t\t\tif (this.props.targetObj) {\n\t\t\t\t\ttooltipTrigger = this.props.targetObj;\n\t\t\t\t} else {\n\t\t\t\t\ttooltipTrigger = document.querySelector(\"[data-id='\" + this.props.id + \"-trigger']\");\n\t\t\t\t}\n\t\t\t\tif (tooltipTrigger && tooltip) {\n\t\t\t\t\tthis.updateTooltipLayout(tooltip, tooltipTrigger, tooltip.getAttribute(\"direction\"));\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tgetStyleValue(value) {\n\t\treturn value + \"px\";\n\t}\n\n\tgetNewDirection(currentDirection) {\n\t\tlet newDirection;\n\t\tswitch (currentDirection) {\n\t\tcase \"top\":\n\t\t\tnewDirection = \"bottom\";\n\t\t\tbreak;\n\t\tcase \"bottom\":\n\t\t\tnewDirection = \"top\";\n\t\t\tbreak;\n\t\tcase \"left\":\n\t\t\tnewDirection = \"right\";\n\t\t\tbreak;\n\t\tdefault:\n\t\t\tnewDirection = \"left\";\n\t\t}\n\t\treturn newDirection;\n\t}\n\n\tshowTooltip() {\n\t\tconst canDisplayFullText = this.canDisplayFullText(this.triggerRef);\n\t\tconst showToolTip = (\n\t\t\t// show tooltip if not disabled and showToolTipIfTruncated is false\n\t\t\t(!this.props.disable && !this.props.showToolTipIfTruncated) ||\n\t\t\t// show tooltip if not disabled and showToolTipIfTruncated is true and string is truncated\n\t\t\t(!this.props.disable && this.props.showToolTipIfTruncated && !canDisplayFullText));\n\t\treturn showToolTip;\n\t}\n\n\t// Return true if the string can be displayed in the available space\n\t// Return false if the string is truncated and ellipsis is shown on the UI\n\t// (offsetWidth) is a measurement in pixels of the element's CSS width, including any borders, padding, and vertical scrollbars\n\t// (scrollWidth) value is equal to the minimum width the element would require\n\t//  in order to fit all the content in the viewport without using a horizontal scrollbar\n\tcanDisplayFullText(elem) {\n\t\tif (elem) {\n\t\t\tconst firstChildWidth = elem.firstChild && elem.firstChild.scrollWidth ? elem.firstChild.scrollWidth : 0;\n\t\t\tconst displayWidth = elem.offsetWidth;\n\t\t\tlet fullWidth = firstChildWidth;\n\t\t\tif (firstChildWidth === 0) {\n\t\t\t\tfullWidth = elem.scrollWidth;\n\t\t\t}\n\t\t\tconst canDisplayFullText = fullWidth <= displayWidth;\n\t\t\treturn canDisplayFullText;\n\t\t}\n\t\treturn false; // Show tooltip if we cannot read the width (Canvas objects)\n\t}\n\n\tshowTooltipWithDelay() {\n\n\t\t// set a delay on displaying the tooltip\n\t\tif (!this.pendingTooltip && this.showTooltip()) {\n\t\t\tconst that = this;\n\t\t\tthis.pendingTooltip = setTimeout(function() {\n\t\t\t\tthat.setTooltipVisible(true);\n\t\t\t}, this.props.delay);\n\t\t}\n\n\t}\n\n\tupdateTooltipLayout(tooltip, tooltipTrigger, direction) {\n\t\tconst tooltipDirection = direction;\n\t\tconst viewPortWidth = document.documentElement.clientWidth;\n\t\tconst viewPortHeight = document.documentElement.clientHeight;\n\t\tconst triggerLayout = tooltipTrigger.getBoundingClientRect();\n\t\tconst pointer = tooltip.querySelector(\"svg\");\n\t\tconst pointerLayout = pointer.getBoundingClientRect();\n\t\tconst pointerCorrection = 1;\n\n\t\t// always initialize tooltip location so it's all visible to ensure adjustments are done on the right size\n\t\ttooltip.style.left = this.getStyleValue(triggerLayout.left);\n\t\ttooltip.style.top = this.getStyleValue(triggerLayout.top);\n\n\t\tif (this.props.mousePos) {\n\t\t\tthis.updateLocationBasedOnMousePos(tooltip, this.props.mousePos, direction);\n\t\t} else { // tooltip relativ to element\n\t\t\t// tooltip - left correction\n\t\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\t\tlet tooltipLeft = triggerLayout.left;\n\t\t\t\tif (tooltip.offsetWidth > triggerLayout.width) {\n\t\t\t\t\ttooltipLeft -= (tooltip.offsetWidth - triggerLayout.width) / 2; // distribute overlap evenly left and right\n\t\t\t\t\tif (tooltipLeft < 0) {\n\t\t\t\t\t\ttooltipLeft = 2; // hitting left border\n\t\t\t\t\t}\n\t\t\t\t} else if (tooltip.offsetWidth < triggerLayout.width) {\n\t\t\t\t\ttooltipLeft += (triggerLayout.width - tooltip.offsetWidth) / 2; // center tip within triggerLayout\n\t\t\t\t}\n\t\t\t\ttooltip.style.left = this.getStyleValue(tooltipLeft);\n\t\t\t\tif ((tooltipLeft + tooltip.offsetWidth) > viewPortWidth) {\n\t\t\t\t\ttooltip.style.left = this.getStyleValue(viewPortWidth - tooltip.offsetWidth); // hitting right border\n\t\t\t\t}\n\t\t\t} else if (tooltipDirection === \"left\") {\n\t\t\t\t// For long tooltips, tooltip.offsetWidth is updated after setting tooltip.style.left. Ensure tooltip doesn't overlap tooltipTrigger element.\n\t\t\t\twhile ((tooltip.offsetLeft + tooltip.offsetWidth + pointerLayout.width) > Math.round(triggerLayout.left)) {\n\t\t\t\t\ttooltip.style.left = this.getStyleValue(triggerLayout.left - tooltip.offsetWidth - pointerLayout.width);\n\t\t\t\t}\n\t\t\t} else if (tooltipDirection === \"right\") {\n\t\t\t\ttooltip.style.left = this.getStyleValue(triggerLayout.right + pointerLayout.width);\n\t\t\t}\n\n\t\t\t// tooltip - top correction\n\t\t\tif (tooltipDirection === \"top\") {\n\t\t\t\ttooltip.style.top = this.getStyleValue(triggerLayout.top - pointerLayout.height - tooltip.offsetHeight);\n\t\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\t\ttooltip.style.top = this.getStyleValue(triggerLayout.bottom + pointerLayout.height);\n\t\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\t\tlet tooltipTop = triggerLayout.top;\n\t\t\t\tif (tooltip.offsetHeight > triggerLayout.height) {\n\t\t\t\t\ttooltipTop -= (tooltip.offsetHeight - triggerLayout.height) / 2; // distribute overlap evenly top and bottom\n\t\t\t\t\tif (tooltipTop < 0) {\n\t\t\t\t\t\ttooltipTop = triggerLayout.top; // hitting top border\n\t\t\t\t\t}\n\t\t\t\t} else if (tooltip.offsetHeight < triggerLayout.height) {\n\t\t\t\t\ttooltipTop += (triggerLayout.height - tooltip.offsetHeight) / 2; // center tip within triggerLayout\n\t\t\t\t}\n\t\t\t\ttooltip.style.top = this.getStyleValue(tooltipTop + pointerCorrection);\n\t\t\t\tif ((viewPortHeight - tooltip.offsetHeight) < triggerLayout.top) {\n\t\t\t\t\ttooltip.style.top = this.getStyleValue(viewPortHeight - tooltip.offsetHeight); // hitting bottom border\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// pointer - left correction\n\t\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(triggerLayout.left - tooltip.getBoundingClientRect().left +\n\t\t\t\t\ttooltipTrigger.getBoundingClientRect().width / 2 - pointerLayout.width / 2\t + pointerCorrection);\n\t\t\t} else if (tooltipDirection === \"left\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(tooltip.offsetWidth - 3);\n\t\t\t} else if (tooltipDirection === \"right\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(-pointerLayout.width + 2);\n\t\t\t}\n\n\t\t\t// pointer - top correction\n\t\t\tif (tooltipDirection === \"top\") {\n\t\t\t\tpointer.style.top = this.getStyleValue(tooltip.offsetHeight - 5);\n\t\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\t\tpointer.style.top = \"-11px\";\n\t\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\t\tpointer.style.top = this.getStyleValue(triggerLayout.top - tooltip.getBoundingClientRect().top +\n\t\t\t\t\ttooltipTrigger.offsetHeight / 2 - pointerLayout.height / 2);\n\t\t\t}\n\t\t}\n\n\t\t// check if out-of-bounds at the end and if so, trigger new layout on opposite site if not already re-rendered already\n\t\tif (this.isOutOfBounds(tooltip) && tooltip.getAttribute(\"direction\") === tooltipDirection) {\n\t\t\tconst newDirection = this.getNewDirection(tooltipDirection);\n\t\t\tthis.updateTooltipLayout(tooltip, tooltipTrigger, newDirection);\n\t\t\t// update class name directly, otherwise setState triggers re-render loop in canvas\n\t\t\t// also call after updateTooltipLayout, otherwise the newDirection and class of trigger are the same\n\t\t\ttooltip.setAttribute(\"direction\", newDirection);\n\t\t\treturn;\n\t\t}\n\t}\n\n\tupdateLocationBasedOnMousePos(tooltip, mousePos, direction) {\n\t\tconst tooltipDirection = direction;\n\t\tconst viewPortWidth = document.documentElement.clientWidth;\n\t\tconst viewPortHeight = document.documentElement.clientHeight;\n\t\tconst pointer = tooltip.querySelector(\"svg\");\n\t\tconst pointerLayout = pointer.getBoundingClientRect();\n\t\tconst pointerCorrection = 1;\n\n\t\tconst mouseX = this.props.mousePos.x;\n\t\tconst mouseY = this.props.mousePos.y;\n\t\t// if mouse position is passed in, use the cursor as reference point\n\n\t\t// tooltip - left correction\n\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\tlet tooltipLeft = mouseX - tooltip.offsetWidth / 2;\n\t\t\tif ((viewPortWidth - tooltip.offsetWidth) < tooltipLeft) {\n\t\t\t\ttooltipLeft = viewPortWidth - tooltip.offsetWidth; // hitting right border\n\t\t\t} else if (tooltipLeft < 0) {\n\t\t\t\ttooltipLeft = 2; // hitting left border\n\t\t\t}\n\t\t\ttooltip.style.left = this.getStyleValue(tooltipLeft);\n\t\t} else if (tooltipDirection === \"left\") {\n\t\t\ttooltip.style.left = this.getStyleValue(mouseX - tooltip.offsetWidth - pointerLayout.width - 5);\n\t\t} else if (tooltipDirection === \"right\") {\n\t\t\ttooltip.style.left = this.getStyleValue(mouseX + pointerLayout.width + 5);\n\t\t}\n\n\t\t// tooltip - top correction\n\t\tif (tooltipDirection === \"top\") {\n\t\t\ttooltip.style.top = this.getStyleValue(mouseY - pointerLayout.height - tooltip.offsetHeight);\n\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\ttooltip.style.top = this.getStyleValue(mouseY + 2 * pointerLayout.height);\n\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\tlet tooltipTop = mouseY - tooltip.offsetHeight / 2;\n\t\t\tif ((viewPortHeight - tooltip.offsetHeight) < tooltipTop) {\n\t\t\t\ttooltipTop = viewPortHeight - tooltip.offsetHeight; // hitting bottom border\n\t\t\t} else if (tooltipTop < 0) {\n\t\t\t\ttooltipTop = 2; // hitting top border\n\t\t\t}\n\t\t\ttooltip.style.top = this.getStyleValue(tooltipTop + pointerCorrection);\n\t\t}\n\n\t\t// pointer - left correction\n\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\tpointer.style.left = this.getStyleValue(mouseX - tooltip.getBoundingClientRect().left - pointerLayout.width / 2);\n\t\t} else if (tooltipDirection === \"left\") {\n\t\t\tpointer.style.left = this.getStyleValue(tooltip.offsetWidth - 3);\n\t\t} else if (tooltipDirection === \"right\") {\n\t\t\tpointer.style.left = this.getStyleValue(-pointerLayout.width + 2);\n\t\t}\n\n\t\t// pointer - top correction\n\t\tif (tooltipDirection === \"top\") {\n\t\t\tpointer.style.top = this.getStyleValue(tooltip.offsetHeight - 5);\n\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\tpointer.style.top = \"-11px\";\n\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\tpointer.style.top = this.getStyleValue(mouseY - tooltip.getBoundingClientRect().top - pointerLayout.height / 2);\n\t\t}\n\t}\n\n\tisOutOfBounds(tooltip) {\n\t\tconst tooltipLeft = parseFloat(tooltip.style.left);\n\t\tconst tooltipTop = parseFloat(tooltip.style.top);\n\t\treturn (((tooltipLeft + tooltip.offsetWidth) > document.documentElement.clientWidth) || // to the right\n\t\t\t\t(tooltipLeft < 0) || // to the left\n\t\t\t\t(tooltipTop < 0) || // to the top\n\t\t\t\t((tooltipTop + tooltip.offsetHeight) > document.documentElement.clientHeight)); // to the bottom\n\t}\n\n\ttoggleTooltipOnClick(evt) {\n\t\t// 'blur' event occurs before 'click' event. Because of this, onBlur function is called which hides the tooltip.\n\t\t// To prevent this default behavior, stopPropagation and preventDefault is used.\n\t\tevt.stopPropagation();\n\t\tevt.preventDefault();\n\t\tif (this.state.isTooltipVisible) {\n\t\t\t// Tooltip is visible and user clicks on trigger element again, hide tooltip\n\t\t\tthis.setTooltipVisible(false);\n\t\t} else {\n\t\t\tthis.setTooltipVisible(true);\n\t\t}\n\t}\n\n\thideTooltipOnScrollAndResize(evt) {\n\t\tif (this.state.isTooltipVisible) {\n\t\t\tthis.setTooltipVisible(false);\n\t\t}\n\t}\n\n\ttooltipLinkOnClick(url) {\n\t\twindow.open(url, \"_blank\", \"noopener\");\n\t}\n\n\trender() {\n\t\tlet tooltipContent = null;\n\t\tlet triggerContent = null;\n\t\tif (this.props.children) {\n\t\t\t// when children are passed in, tooltip will handle show/hide, otherwise consumer has to hide show/hide tooltip\n\t\t\tconst mouseover = () => this.setTooltipVisible(true);\n\t\t\tconst mouseleave = () => this.setTooltipVisible(false);\n\t\t\tconst mousedown = () => this.setTooltipVisible(false);\n\t\t\t// `focus` event occurs before `click`. Adding timeout in onFocus function to ensure click is executed first.\n\t\t\t// Ref - https://stackoverflow.com/a/49512400\n\t\t\tconst onFocus = () => this.showTooltipWithDelay();\n\t\t\tconst onBlur = (evt) => {\n\t\t\t\t// Keep tooltip visible when clicked on a link.\n\t\t\t\t// Since link is an anchor tag without \"href\" attribute, it has relatedTarget=null\n\t\t\t\tif (evt.relatedTarget !== null) {\n\t\t\t\t\tthis.setTooltipVisible(false);\n\t\t\t\t}\n\t\t\t};\n\t\t\tconst click = (evt) => this.toggleTooltipOnClick(evt);\n\n\t\t\ttriggerContent = (<div\n\t\t\t\tdata-id={this.props.id + \"-trigger\"}\n\t\t\t\tclassName=\"tooltip-trigger\"\n\t\t\t\tonMouseOver={!this.props.showToolTipOnClick ? mouseover : null}\n\t\t\t\tonMouseLeave={!this.props.showToolTipOnClick ? mouseleave : null}\n\t\t\t\tonMouseDown={!this.props.showToolTipOnClick ? mousedown : null}\n\t\t\t\tonClick={this.props.showToolTipOnClick ? click : null}\n\t\t\t\tonFocus={this.props.showToolTipOnClick ? onFocus : null} // When focused using keyboard\n\t\t\t\tonBlur={this.props.showToolTipOnClick ? onBlur : null}\n\t\t\t\ttabIndex={this.props.showToolTipOnClick ? 0 : null}\n\t\t\t\tref={(ref) => (this.triggerRef = ref)}\n\t\t\t>\n\t\t\t\t{this.props.children}\n\t\t\t</div>);\n\t\t}\n\n\t\tif ((typeof this.props.tip) === \"string\") {\n\t\t\ttooltipContent = (\n\t\t\t\t<span id=\"tooltipContainer\">\n\t\t\t\t\t{this.props.tip}\n\t\t\t\t</span>\n\t\t\t);\n\t\t} else if ((typeof this.props.tip) === \"object\") {\n\t\t\ttooltipContent = (\n\t\t\t\t<div id=\"tooltipContainer\">\n\t\t\t\t\t{this.props.tip}\n\t\t\t\t</div>\n\t\t\t);\n\t\t} else if ((typeof this.props.tip) === \"function\") {\n\t\t\ttooltipContent = this.props.tip();\n\t\t}\n\n\t\tlet tipClass = \"common-canvas-tooltip\";\n\t\tif (this.props.className) {\n\t\t\ttipClass += \" \" + this.props.className;\n\t\t}\n\n\t\tlet link = null;\n\t\tif (this.state.isTooltipVisible && this.props.tooltipLinkHandler && this.props.link) {\n\t\t\tconst linkInformation = this.props.tooltipLinkHandler(this.props.link);\n\t\t\t// Verify tooltipLinkHandler returns object in correct format\n\t\t\tif (typeof linkInformation === \"object\" && linkInformation.label && linkInformation.url) {\n\t\t\t\tlink = (<Link\n\t\t\t\t\tclassName=\"tooltip-link\"\n\t\t\t\t\tid={this.props.link.id}\n\t\t\t\t\tonClick={this.tooltipLinkOnClick.bind(this, linkInformation.url)}\n\t\t\t\t>\n\t\t\t\t\t{linkInformation.label}\n\t\t\t\t</Link>);\n\t\t\t}\n\t\t}\n\n\t\tlet tooltip = null;\n\t\tif (tooltipContent || link) {\n\t\t\ttooltip = (\n\t\t\t\t<Portal>\n\t\t\t\t\t<div data-id={this.props.id} className={tipClass} aria-hidden={!this.state.isTooltipVisible} direction={this.props.direction}>\n\t\t\t\t\t\t<svg id=\"tipArrow\" x=\"0px\" y=\"0px\" viewBox=\"0 0 9.1 16.1\">\n\t\t\t\t\t\t\t<polyline points=\"9.1,15.7 1.4,8.1 9.1,0.5\" />\n\t\t\t\t\t\t\t<polygon points=\"8.1,16.1 0,8.1 8.1,0 8.1,1.4 1.4,8.1 8.1,14.7\" />\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t{tooltipContent}\n\t\t\t\t\t\t{link}\n\t\t\t\t\t</div>\n\t\t\t\t</Portal>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<div className=\"tooltip-container\">\n\t\t\t\t{triggerContent}\n\t\t\t\t{tooltip}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nToolTip.propTypes = {\n\ttip: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.func]).isRequired,\n\tlink: PropTypes.object,\n\ttooltipLinkHandler: PropTypes.func,\n\tdirection: PropTypes.oneOf([\"left\", \"right\", \"top\", \"bottom\"]),\n\tchildren: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n\ttargetObj: PropTypes.object,\n\tid: PropTypes.string.isRequired,\n\tclassName: PropTypes.string,\n\tmousePos: PropTypes.object,\n\tdisable: PropTypes.bool, // Tooltip will not show if disabled\n\tshowToolTipIfTruncated: PropTypes.bool, // Set to true to only display tooltip if full text does not fit in displayable width\n\tdelay: PropTypes.number,\n\tshowToolTipOnClick: PropTypes.bool\n};\n\nToolTip.defaultProps = {\n\tdelay: 200,\n\tdirection: \"bottom\",\n\tshowToolTipIfTruncated: false, // False will always show Tooltip even when whole word can be displayed\n\tshowToolTipOnClick: false\n};\n\nexport default ToolTip;\n"],"names":["ToolTip","_inherits","props","_classCallCheck","_this","state","isTooltipVisible","pendingTooltip","hideTooltipOnScrollAndResize","bind","_createClass","key","value","window","addEventListener","this","targetObj","setTooltipVisible","removeEventListener","clearTimeout","visible","showTooltip","setState","tooltip","document","querySelector","id","tooltipTrigger","updateTooltipLayout","getAttribute","currentDirection","newDirection","canDisplayFullText","triggerRef","disable","showToolTipIfTruncated","elem","firstChildWidth","firstChild","scrollWidth","displayWidth","offsetWidth","fullWidth","that","setTimeout","delay","direction","tooltipDirection","viewPortWidth","documentElement","clientWidth","viewPortHeight","clientHeight","triggerLayout","getBoundingClientRect","pointer","pointerLayout","style","left","getStyleValue","top","mousePos","updateLocationBasedOnMousePos","tooltipLeft","width","offsetLeft","Math","round","right","height","offsetHeight","bottom","tooltipTop","isOutOfBounds","getNewDirection","setAttribute","mouseX","x","mouseY","y","parseFloat","evt","stopPropagation","preventDefault","url","open","tooltipContent","triggerContent","children","React","className","onMouseOver","showToolTipOnClick","_this2","onMouseLeave","onMouseDown","onClick","toggleTooltipOnClick","onFocus","showTooltipWithDelay","onBlur","relatedTarget","tabIndex","ref","tip","_typeof","tipClass","link","tooltipLinkHandler","linkInformation","label","Link","tooltipLinkOnClick","Portal","viewBox","points","Component","defaultProps"],"mappings":"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"}
+{"version":3,"file":"tooltip.es.js","sources":["../../src/tooltip/tooltip.jsx"],"sourcesContent":["/*\n * Copyright 2017-2022 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\tThis code is a modified version from portal-common-api for the Elyra canvas tooltips\n*/\n\nimport React from \"react\";\nimport PropTypes from \"prop-types\";\nimport { Portal } from \"react-portal\";\nimport { Link } from \"carbon-components-react\";\n\nclass ToolTip extends React.Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tisTooltipVisible: false\n\t\t};\n\n\t\tthis.pendingTooltip = null;\n\t\tthis.hideTooltipOnScrollAndResize = this.hideTooltipOnScrollAndResize.bind(this);\n\t}\n\n\tcomponentDidMount() {\n\t\twindow.addEventListener(\"scroll\", this.hideTooltipOnScrollAndResize, true);\n\t\twindow.addEventListener(\"resize\", this.hideTooltipOnScrollAndResize, true);\n\t\tif (this.props.targetObj) {\n\t\t\tthis.setTooltipVisible(true);\n\t\t}\n\t}\n\n\tcomponentWillUnmount() {\n\t\twindow.removeEventListener(\"scroll\", this.hideTooltipOnScrollAndResize, true);\n\t\twindow.removeEventListener(\"resize\", this.hideTooltipOnScrollAndResize, true);\n\t\tif (this.pendingTooltip) {\n\t\t\tclearTimeout(this.pendingTooltip);\n\t\t}\n\t}\n\n\tsetTooltipVisible(visible) {\n\t\t// clear the display timer if set\n\t\tif (!this.showTooltip() || (!visible && this.pendingTooltip)) {\n\t\t\tclearTimeout(this.pendingTooltip);\n\t\t\tthis.pendingTooltip = null;\n\t\t\tthis.setState({\n\t\t\t\tisTooltipVisible: false\n\t\t\t});\n\t\t}\n\n\n\t\tif (this.showTooltip()) {\n\t\t\tconst tooltip = document.querySelector(\"[data-id='\" + this.props.id + \"']\");\n\t\t\tthis.pendingTooltip = null;\n\t\t\tthis.setState({\n\t\t\t\tisTooltipVisible: visible\n\t\t\t});\n\t\t\t// updates the tooltip display\n\t\t\tif (visible) {\n\t\t\t\tlet tooltipTrigger = null;\n\t\t\t\tif (this.props.targetObj) {\n\t\t\t\t\ttooltipTrigger = this.props.targetObj;\n\t\t\t\t} else {\n\t\t\t\t\ttooltipTrigger = document.querySelector(\"[data-id='\" + this.props.id + \"-trigger']\");\n\t\t\t\t}\n\t\t\t\tif (tooltipTrigger && tooltip) {\n\t\t\t\t\tthis.updateTooltipLayout(tooltip, tooltipTrigger, tooltip.getAttribute(\"direction\"));\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tgetStyleValue(value) {\n\t\treturn value + \"px\";\n\t}\n\n\tgetNewDirection(currentDirection) {\n\t\tlet newDirection;\n\t\tswitch (currentDirection) {\n\t\tcase \"top\":\n\t\t\tnewDirection = \"bottom\";\n\t\t\tbreak;\n\t\tcase \"bottom\":\n\t\t\tnewDirection = \"top\";\n\t\t\tbreak;\n\t\tcase \"left\":\n\t\t\tnewDirection = \"right\";\n\t\t\tbreak;\n\t\tdefault:\n\t\t\tnewDirection = \"left\";\n\t\t}\n\t\treturn newDirection;\n\t}\n\n\tshowTooltip() {\n\t\tconst canDisplayFullText = this.canDisplayFullText(this.triggerRef);\n\t\tconst showToolTip = (\n\t\t\t// show tooltip if not disabled and showToolTipIfTruncated is false\n\t\t\t(!this.props.disable && !this.props.showToolTipIfTruncated) ||\n\t\t\t// show tooltip if not disabled and showToolTipIfTruncated is true and string is truncated\n\t\t\t(!this.props.disable && this.props.showToolTipIfTruncated && !canDisplayFullText));\n\t\treturn showToolTip;\n\t}\n\n\t// Return true if the string can be displayed in the available space\n\t// Return false if the string is truncated and ellipsis is shown on the UI\n\t// (offsetWidth) is a measurement in pixels of the element's CSS width, including any borders, padding, and vertical scrollbars\n\t// (scrollWidth) value is equal to the minimum width the element would require\n\t//  in order to fit all the content in the viewport without using a horizontal scrollbar\n\tcanDisplayFullText(elem) {\n\t\tif (elem) {\n\t\t\tconst firstChildWidth = elem.firstChild && elem.firstChild.scrollWidth ? elem.firstChild.scrollWidth : 0;\n\t\t\tconst displayWidth = elem.offsetWidth;\n\t\t\tlet fullWidth = firstChildWidth;\n\t\t\tif (firstChildWidth === 0) {\n\t\t\t\tfullWidth = elem.scrollWidth;\n\t\t\t}\n\t\t\tconst canDisplayFullText = fullWidth <= displayWidth;\n\t\t\treturn canDisplayFullText;\n\t\t}\n\t\treturn false; // Show tooltip if we cannot read the width (Canvas objects)\n\t}\n\n\tshowTooltipWithDelay() {\n\n\t\t// set a delay on displaying the tooltip\n\t\tif (!this.pendingTooltip && this.showTooltip()) {\n\t\t\tconst that = this;\n\t\t\tthis.pendingTooltip = setTimeout(function() {\n\t\t\t\tthat.setTooltipVisible(true);\n\t\t\t}, this.props.delay);\n\t\t}\n\n\t}\n\n\tupdateTooltipLayout(tooltip, tooltipTrigger, direction) {\n\t\tconst tooltipDirection = direction;\n\t\tconst viewPortWidth = document.documentElement.clientWidth;\n\t\tconst viewPortHeight = document.documentElement.clientHeight;\n\t\tconst triggerLayout = tooltipTrigger.getBoundingClientRect();\n\t\tconst pointer = tooltip.querySelector(\"svg\");\n\t\tconst pointerLayout = pointer.getBoundingClientRect();\n\t\tconst pointerCorrection = 1;\n\n\t\t// always initialize tooltip location so it's all visible to ensure adjustments are done on the right size\n\t\ttooltip.style.left = this.getStyleValue(triggerLayout.left);\n\t\ttooltip.style.top = this.getStyleValue(triggerLayout.top);\n\n\t\tif (this.props.mousePos) {\n\t\t\tthis.updateLocationBasedOnMousePos(tooltip, this.props.mousePos, direction);\n\t\t} else { // tooltip relativ to element\n\t\t\t// tooltip - left correction\n\t\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\t\tlet tooltipLeft = triggerLayout.left;\n\t\t\t\tif (tooltip.offsetWidth > triggerLayout.width) {\n\t\t\t\t\ttooltipLeft -= (tooltip.offsetWidth - triggerLayout.width) / 2; // distribute overlap evenly left and right\n\t\t\t\t\tif (tooltipLeft < 0) {\n\t\t\t\t\t\ttooltipLeft = 2; // hitting left border\n\t\t\t\t\t}\n\t\t\t\t} else if (tooltip.offsetWidth < triggerLayout.width) {\n\t\t\t\t\ttooltipLeft += (triggerLayout.width - tooltip.offsetWidth) / 2; // center tip within triggerLayout\n\t\t\t\t}\n\t\t\t\ttooltip.style.left = this.getStyleValue(tooltipLeft);\n\t\t\t\tif ((tooltipLeft + tooltip.offsetWidth) > viewPortWidth) {\n\t\t\t\t\ttooltip.style.left = this.getStyleValue(viewPortWidth - tooltip.offsetWidth); // hitting right border\n\t\t\t\t}\n\t\t\t} else if (tooltipDirection === \"left\") {\n\t\t\t\t// For long tooltips, tooltip.offsetWidth is updated after setting tooltip.style.left. Ensure tooltip doesn't overlap tooltipTrigger element.\n\t\t\t\twhile ((tooltip.offsetLeft + tooltip.offsetWidth + pointerLayout.width) > Math.round(triggerLayout.left)) {\n\t\t\t\t\ttooltip.style.left = this.getStyleValue(triggerLayout.left - tooltip.offsetWidth - pointerLayout.width);\n\t\t\t\t}\n\t\t\t} else if (tooltipDirection === \"right\") {\n\t\t\t\ttooltip.style.left = this.getStyleValue(triggerLayout.right + pointerLayout.width);\n\t\t\t}\n\n\t\t\t// tooltip - top correction\n\t\t\tif (tooltipDirection === \"top\") {\n\t\t\t\ttooltip.style.top = this.getStyleValue(triggerLayout.top - pointerLayout.height - tooltip.offsetHeight);\n\t\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\t\ttooltip.style.top = this.getStyleValue(triggerLayout.bottom + pointerLayout.height);\n\t\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\t\tlet tooltipTop = triggerLayout.top;\n\t\t\t\tif (tooltip.offsetHeight > triggerLayout.height) {\n\t\t\t\t\ttooltipTop -= (tooltip.offsetHeight - triggerLayout.height) / 2; // distribute overlap evenly top and bottom\n\t\t\t\t\tif (tooltipTop < 0) {\n\t\t\t\t\t\ttooltipTop = triggerLayout.top; // hitting top border\n\t\t\t\t\t}\n\t\t\t\t} else if (tooltip.offsetHeight < triggerLayout.height) {\n\t\t\t\t\ttooltipTop += (triggerLayout.height - tooltip.offsetHeight) / 2; // center tip within triggerLayout\n\t\t\t\t}\n\t\t\t\ttooltip.style.top = this.getStyleValue(tooltipTop + pointerCorrection);\n\t\t\t\tif ((viewPortHeight - tooltip.offsetHeight) < triggerLayout.top) {\n\t\t\t\t\ttooltip.style.top = this.getStyleValue(viewPortHeight - tooltip.offsetHeight); // hitting bottom border\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// pointer - left correction\n\t\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(triggerLayout.left - tooltip.getBoundingClientRect().left +\n\t\t\t\t\ttooltipTrigger.getBoundingClientRect().width / 2 - pointerLayout.width / 2\t + pointerCorrection);\n\t\t\t} else if (tooltipDirection === \"left\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(tooltip.offsetWidth - 3);\n\t\t\t} else if (tooltipDirection === \"right\") {\n\t\t\t\tpointer.style.left = this.getStyleValue(-pointerLayout.width + 2);\n\t\t\t}\n\n\t\t\t// pointer - top correction\n\t\t\tif (tooltipDirection === \"top\") {\n\t\t\t\tpointer.style.top = this.getStyleValue(tooltip.offsetHeight - 5);\n\t\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\t\tpointer.style.top = \"-11px\";\n\t\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\t\tpointer.style.top = this.getStyleValue(triggerLayout.top - tooltip.getBoundingClientRect().top +\n\t\t\t\t\ttooltipTrigger.offsetHeight / 2 - pointerLayout.height / 2);\n\t\t\t}\n\t\t}\n\n\t\t// check if out-of-bounds at the end and if so, trigger new layout on opposite site if not already re-rendered already\n\t\tif (this.isOutOfBounds(tooltip) && tooltip.getAttribute(\"direction\") === tooltipDirection) {\n\t\t\tconst newDirection = this.getNewDirection(tooltipDirection);\n\t\t\tthis.updateTooltipLayout(tooltip, tooltipTrigger, newDirection);\n\t\t\t// update class name directly, otherwise setState triggers re-render loop in canvas\n\t\t\t// also call after updateTooltipLayout, otherwise the newDirection and class of trigger are the same\n\t\t\ttooltip.setAttribute(\"direction\", newDirection);\n\t\t\treturn;\n\t\t}\n\t}\n\n\tupdateLocationBasedOnMousePos(tooltip, mousePos, direction) {\n\t\tconst tooltipDirection = direction;\n\t\tconst viewPortWidth = document.documentElement.clientWidth;\n\t\tconst viewPortHeight = document.documentElement.clientHeight;\n\t\tconst pointer = tooltip.querySelector(\"svg\");\n\t\tconst pointerLayout = pointer.getBoundingClientRect();\n\t\tconst pointerCorrection = 1;\n\n\t\tconst mouseX = this.props.mousePos.x;\n\t\tconst mouseY = this.props.mousePos.y;\n\t\t// if mouse position is passed in, use the cursor as reference point\n\n\t\t// tooltip - left correction\n\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\tlet tooltipLeft = mouseX - tooltip.offsetWidth / 2;\n\t\t\tif ((viewPortWidth - tooltip.offsetWidth) < tooltipLeft) {\n\t\t\t\ttooltipLeft = viewPortWidth - tooltip.offsetWidth; // hitting right border\n\t\t\t} else if (tooltipLeft < 0) {\n\t\t\t\ttooltipLeft = 2; // hitting left border\n\t\t\t}\n\t\t\ttooltip.style.left = this.getStyleValue(tooltipLeft);\n\t\t} else if (tooltipDirection === \"left\") {\n\t\t\ttooltip.style.left = this.getStyleValue(mouseX - tooltip.offsetWidth - pointerLayout.width - 5);\n\t\t} else if (tooltipDirection === \"right\") {\n\t\t\ttooltip.style.left = this.getStyleValue(mouseX + pointerLayout.width + 5);\n\t\t}\n\n\t\t// tooltip - top correction\n\t\tif (tooltipDirection === \"top\") {\n\t\t\ttooltip.style.top = this.getStyleValue(mouseY - pointerLayout.height - tooltip.offsetHeight);\n\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\ttooltip.style.top = this.getStyleValue(mouseY + 2 * pointerLayout.height);\n\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\tlet tooltipTop = mouseY - tooltip.offsetHeight / 2;\n\t\t\tif ((viewPortHeight - tooltip.offsetHeight) < tooltipTop) {\n\t\t\t\ttooltipTop = viewPortHeight - tooltip.offsetHeight; // hitting bottom border\n\t\t\t} else if (tooltipTop < 0) {\n\t\t\t\ttooltipTop = 2; // hitting top border\n\t\t\t}\n\t\t\ttooltip.style.top = this.getStyleValue(tooltipTop + pointerCorrection);\n\t\t}\n\n\t\t// pointer - left correction\n\t\tif (tooltipDirection === \"top\" || tooltipDirection === \"bottom\") {\n\t\t\tpointer.style.left = this.getStyleValue(mouseX - tooltip.getBoundingClientRect().left - pointerLayout.width / 2);\n\t\t} else if (tooltipDirection === \"left\") {\n\t\t\tpointer.style.left = this.getStyleValue(tooltip.offsetWidth - 3);\n\t\t} else if (tooltipDirection === \"right\") {\n\t\t\tpointer.style.left = this.getStyleValue(-pointerLayout.width + 2);\n\t\t}\n\n\t\t// pointer - top correction\n\t\tif (tooltipDirection === \"top\") {\n\t\t\tpointer.style.top = this.getStyleValue(tooltip.offsetHeight - 5);\n\t\t} else if (tooltipDirection === \"bottom\") {\n\t\t\tpointer.style.top = \"-11px\";\n\t\t} else if (tooltipDirection === \"left\" || tooltipDirection === \"right\") {\n\t\t\tpointer.style.top = this.getStyleValue(mouseY - tooltip.getBoundingClientRect().top - pointerLayout.height / 2);\n\t\t}\n\t}\n\n\tisOutOfBounds(tooltip) {\n\t\tconst tooltipLeft = parseFloat(tooltip.style.left);\n\t\tconst tooltipTop = parseFloat(tooltip.style.top);\n\t\treturn (((tooltipLeft + tooltip.offsetWidth) > document.documentElement.clientWidth) || // to the right\n\t\t\t\t(tooltipLeft < 0) || // to the left\n\t\t\t\t(tooltipTop < 0) || // to the top\n\t\t\t\t((tooltipTop + tooltip.offsetHeight) > document.documentElement.clientHeight)); // to the bottom\n\t}\n\n\ttoggleTooltipOnClick(evt) {\n\t\t// 'blur' event occurs before 'click' event. Because of this, onBlur function is called which hides the tooltip.\n\t\t// To prevent this default behavior, stopPropagation and preventDefault is used.\n\t\tevt.stopPropagation();\n\t\tevt.preventDefault();\n\t\tif (this.state.isTooltipVisible) {\n\t\t\t// Tooltip is visible and user clicks on trigger element again, hide tooltip\n\t\t\tthis.setTooltipVisible(false);\n\t\t} else {\n\t\t\tthis.setTooltipVisible(true);\n\t\t}\n\t}\n\n\thideTooltipOnScrollAndResize(evt) {\n\t\tif (this.state.isTooltipVisible) {\n\t\t\tthis.setTooltipVisible(false);\n\t\t}\n\t}\n\n\ttooltipLinkOnClick(url) {\n\t\twindow.open(url, \"_blank\", \"noopener\");\n\t}\n\n\trender() {\n\t\tlet tooltipContent = null;\n\t\tlet triggerContent = null;\n\t\tif (this.props.children) {\n\t\t\t// when children are passed in, tooltip will handle show/hide, otherwise consumer has to hide show/hide tooltip\n\t\t\tconst mouseover = () => this.setTooltipVisible(true);\n\t\t\tconst mouseleave = () => this.setTooltipVisible(false);\n\t\t\tconst mousedown = () => this.setTooltipVisible(false);\n\t\t\t// `focus` event occurs before `click`. Adding timeout in onFocus function to ensure click is executed first.\n\t\t\t// Ref - https://stackoverflow.com/a/49512400\n\t\t\tconst onFocus = () => this.showTooltipWithDelay();\n\t\t\tconst onBlur = (evt) => {\n\t\t\t\t// Keep tooltip visible when clicked on a link.\n\t\t\t\t// Since link is an anchor tag without \"href\" attribute, it has relatedTarget=null\n\t\t\t\tif (evt.relatedTarget !== null) {\n\t\t\t\t\tthis.setTooltipVisible(false);\n\t\t\t\t}\n\t\t\t};\n\t\t\tconst click = (evt) => this.toggleTooltipOnClick(evt);\n\n\t\t\ttriggerContent = (<div\n\t\t\t\tdata-id={this.props.id + \"-trigger\"}\n\t\t\t\tclassName=\"tooltip-trigger\"\n\t\t\t\tonMouseOver={!this.props.showToolTipOnClick ? mouseover : null}\n\t\t\t\tonMouseLeave={!this.props.showToolTipOnClick ? mouseleave : null}\n\t\t\t\tonMouseDown={!this.props.showToolTipOnClick ? mousedown : null}\n\t\t\t\tonClick={this.props.showToolTipOnClick ? click : null}\n\t\t\t\tonFocus={this.props.showToolTipOnClick ? onFocus : null} // When focused using keyboard\n\t\t\t\tonBlur={this.props.showToolTipOnClick ? onBlur : null}\n\t\t\t\ttabIndex={this.props.showToolTipOnClick ? 0 : null}\n\t\t\t\tref={(ref) => (this.triggerRef = ref)}\n\t\t\t>\n\t\t\t\t{this.props.children}\n\t\t\t</div>);\n\t\t}\n\n\t\tif ((typeof this.props.tip) === \"string\") {\n\t\t\ttooltipContent = (\n\t\t\t\t<span id=\"tooltipContainer\">\n\t\t\t\t\t{this.props.tip}\n\t\t\t\t</span>\n\t\t\t);\n\t\t} else if ((typeof this.props.tip) === \"object\") {\n\t\t\ttooltipContent = (\n\t\t\t\t<div id=\"tooltipContainer\">\n\t\t\t\t\t{this.props.tip}\n\t\t\t\t</div>\n\t\t\t);\n\t\t} else if ((typeof this.props.tip) === \"function\") {\n\t\t\ttooltipContent = this.props.tip();\n\t\t}\n\n\t\tlet tipClass = \"common-canvas-tooltip\";\n\t\tif (this.props.className) {\n\t\t\ttipClass += \" \" + this.props.className;\n\t\t}\n\n\t\tlet link = null;\n\t\tif (this.state.isTooltipVisible && this.props.tooltipLinkHandler && this.props.link) {\n\t\t\tconst linkInformation = this.props.tooltipLinkHandler(this.props.link);\n\t\t\t// Verify tooltipLinkHandler returns object in correct format\n\t\t\tif (typeof linkInformation === \"object\" && linkInformation.label && linkInformation.url) {\n\t\t\t\tlink = (<Link\n\t\t\t\t\tclassName=\"tooltip-link\"\n\t\t\t\t\tid={this.props.link.id}\n\t\t\t\t\tonClick={this.tooltipLinkOnClick.bind(this, linkInformation.url)}\n\t\t\t\t>\n\t\t\t\t\t{linkInformation.label}\n\t\t\t\t</Link>);\n\t\t\t}\n\t\t}\n\n\t\tlet tooltip = null;\n\t\tif (tooltipContent || link) {\n\t\t\ttooltip = (\n\t\t\t\t<Portal>\n\t\t\t\t\t<div data-id={this.props.id} className={tipClass} aria-hidden={!this.state.isTooltipVisible} direction={this.props.direction}>\n\t\t\t\t\t\t<svg id=\"tipArrow\" x=\"0px\" y=\"0px\" viewBox=\"0 0 9.1 16.1\">\n\t\t\t\t\t\t\t<polyline points=\"9.1,15.7 1.4,8.1 9.1,0.5\" />\n\t\t\t\t\t\t\t<polygon points=\"8.1,16.1 0,8.1 8.1,0 8.1,1.4 1.4,8.1 8.1,14.7\" />\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t{tooltipContent}\n\t\t\t\t\t\t{link}\n\t\t\t\t\t</div>\n\t\t\t\t</Portal>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<div className=\"tooltip-container\">\n\t\t\t\t{triggerContent}\n\t\t\t\t{tooltip}\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nToolTip.propTypes = {\n\ttip: PropTypes.oneOfType([PropTypes.string, PropTypes.element, PropTypes.func]).isRequired,\n\tlink: PropTypes.object,\n\ttooltipLinkHandler: PropTypes.func,\n\tdirection: PropTypes.oneOf([\"left\", \"right\", \"top\", \"bottom\"]),\n\tchildren: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n\ttargetObj: PropTypes.object,\n\tid: PropTypes.string.isRequired,\n\tclassName: PropTypes.string,\n\tmousePos: PropTypes.object,\n\tdisable: PropTypes.bool, // Tooltip will not show if disabled\n\tshowToolTipIfTruncated: PropTypes.bool, // Set to true to only display tooltip if full text does not fit in displayable width\n\tdelay: PropTypes.number,\n\tshowToolTipOnClick: PropTypes.bool\n};\n\nToolTip.defaultProps = {\n\tdelay: 200,\n\tdirection: \"bottom\",\n\tshowToolTipIfTruncated: false, // False will always show Tooltip even when whole word can be displayed\n\tshowToolTipOnClick: false\n};\n\nexport default ToolTip;\n"],"names":["ToolTip","_React$Component","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","state","isTooltipVisible","pendingTooltip","hideTooltipOnScrollAndResize","bind","_assertThisInitialized","_createClass","key","value","window","addEventListener","this","targetObj","setTooltipVisible","removeEventListener","clearTimeout","visible","showTooltip","setState","tooltip","document","querySelector","id","tooltipTrigger","updateTooltipLayout","getAttribute","currentDirection","newDirection","canDisplayFullText","triggerRef","disable","showToolTipIfTruncated","elem","firstChildWidth","firstChild","scrollWidth","displayWidth","offsetWidth","fullWidth","that","setTimeout","delay","direction","tooltipDirection","viewPortWidth","documentElement","clientWidth","viewPortHeight","clientHeight","triggerLayout","getBoundingClientRect","pointer","pointerLayout","style","left","getStyleValue","top","mousePos","updateLocationBasedOnMousePos","tooltipLeft","width","offsetLeft","Math","round","right","height","offsetHeight","bottom","tooltipTop","isOutOfBounds","getNewDirection","setAttribute","mouseX","x","mouseY","y","parseFloat","evt","stopPropagation","preventDefault","url","open","_this2","tooltipContent","triggerContent","children","React","createElement","className","onMouseOver","showToolTipOnClick","onMouseLeave","onMouseDown","onClick","toggleTooltipOnClick","onFocus","showTooltipWithDelay","onBlur","relatedTarget","tabIndex","ref","tip","_typeof","tipClass","link","tooltipLinkHandler","linkInformation","label","Link","tooltipLinkOnClick","Portal","viewBox","points","Component","defaultProps"],"mappings":"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"}