ketcher-react 2.9.0-rc.3 → 2.9.0-rc.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -3019,7 +3019,7 @@ var templates = templates$1.reduce(function (res, struct, i) {
3019
3019
  var zoomList = [0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1, 1.1, 1.2, 1.3, 1.4, 1.5, 1.7, 2, 2.5, 3, 3.5, 4];
3020
3020
  var zoom = {
3021
3021
  zoom: {
3022
- shortcut: ['Ctrl+Shift+0'],
3022
+ shortcut: ['Mod+Shift+0'],
3023
3023
  selected: function selected(editor) {
3024
3024
  return editor.zoom();
3025
3025
  },
@@ -3073,7 +3073,7 @@ var zoom = {
3073
3073
 
3074
3074
  var openHelpLink = function openHelpLink() {
3075
3075
  var _window$open;
3076
- return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.9.0-rc.3\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
3076
+ return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.9.0-rc.5\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
3077
3077
  };
3078
3078
  var help = {
3079
3079
  help: {
@@ -10415,6 +10415,7 @@ function _checkPrivateRedeclaration$2(obj, privateCollection) { if (privateColle
10415
10415
  var _bondProps = new WeakMap();
10416
10416
  var AtomTool = function () {
10417
10417
  function AtomTool(editor, atomProps) {
10418
+ var _ElementColor$atomPro;
10418
10419
  _classCallCheck__default["default"](this, AtomTool);
10419
10420
  _classPrivateFieldInitSpec$2(this, _bondProps, {
10420
10421
  writable: true,
@@ -10426,8 +10427,10 @@ var AtomTool = function () {
10426
10427
  type: 1,
10427
10428
  stereo: ketcherCore.Bond.PATTERN.STEREO.NONE
10428
10429
  });
10429
- this.editor.hoverIcon.show().attr('text', "".concat(atomProps.label)).attr('fill', "".concat(ketcherCore.ElementColor[atomProps.label]));
10430
- this.editor.updateHoverIconPosition();
10430
+ this.editor.hoverIcon.show();
10431
+ this.editor.hoverIcon.label = atomProps.label;
10432
+ this.editor.hoverIcon.fill = (_ElementColor$atomPro = ketcherCore.ElementColor[atomProps.label]) !== null && _ElementColor$atomPro !== void 0 ? _ElementColor$atomPro : '#000000';
10433
+ this.editor.hoverIcon.updatePosition();
10431
10434
  if (editor.selection()) {
10432
10435
  var _editor$selection;
10433
10436
  if ((_editor$selection = editor.selection()) !== null && _editor$selection !== void 0 && _editor$selection.atoms) {
@@ -10511,32 +10514,13 @@ var AtomTool = function () {
10511
10514
  };
10512
10515
  }
10513
10516
  }
10514
- }, {
10515
- key: "mouseleave",
10516
- value: function mouseleave() {
10517
- this.editor.hoverIcon.hide();
10518
- }
10519
- }, {
10520
- key: "mouseover",
10521
- value: function mouseover() {
10522
- this.editor.hoverIcon.show();
10523
- this.editor.updateHoverIconPosition();
10524
- }
10525
10517
  }, {
10526
10518
  key: "mousemove",
10527
10519
  value: function mousemove(event) {
10528
10520
  this.editor.hoverIcon.show();
10529
10521
  var rnd = this.editor.render;
10530
- var layerX = event.layerX,
10531
- layerY = event.layerY;
10532
10522
  if (!this.dragCtx || !this.dragCtx.item) {
10533
- var _this$editor$hoverIco = this.editor.hoverIcon.getBBox(),
10534
- height = _this$editor$hoverIco.height,
10535
- width = _this$editor$hoverIco.width;
10536
- this.editor.hoverIcon.attr({
10537
- x: layerX - width / 2,
10538
- y: layerY - height / 2
10539
- });
10523
+ this.editor.hoverIcon.updatePosition();
10540
10524
  this.editor.hover(this.editor.findItem(event, ['atoms', 'functionalGroups']), null, event);
10541
10525
  return;
10542
10526
  }
@@ -12286,16 +12270,15 @@ function updateOnlyChangedProperties(atomId, userChangedAtom, molecule) {
12286
12270
  }, {});
12287
12271
  }
12288
12272
  function updateSelectedAtoms(_ref) {
12289
- var selection = _ref.selection,
12273
+ var atoms = _ref.atoms,
12290
12274
  changeAtomPromise = _ref.changeAtomPromise,
12291
12275
  editor = _ref.editor;
12292
12276
  var action = new ketcherCore.Action();
12293
12277
  var struct = editor.render.ctab;
12294
12278
  var molecule = struct.molecule;
12295
- if (selection !== null && selection !== void 0 && selection.atoms) {
12296
- var selectionAtoms = selection.atoms;
12279
+ if (atoms) {
12297
12280
  Promise.resolve(changeAtomPromise).then(function (userChangedAtom) {
12298
- selectionAtoms.forEach(function (atomId) {
12281
+ atoms.forEach(function (atomId) {
12299
12282
  var atomWithChangedProperties = updateOnlyChangedProperties(atomId, userChangedAtom, molecule);
12300
12283
  action.mergeWith(ketcherCore.fromAtomsAttrs(struct, atomId, atomWithChangedProperties, false));
12301
12284
  });
@@ -12627,7 +12610,7 @@ var SelectTool = function () {
12627
12610
  var atoms = getSelectedAtoms(selection, molecule);
12628
12611
  var changeAtomPromise = editor.event.elementEdit.dispatch(atoms);
12629
12612
  updateSelectedAtoms({
12630
- selection: selection,
12613
+ atoms: (selection === null || selection === void 0 ? void 0 : selection.atoms) || [],
12631
12614
  editor: editor,
12632
12615
  changeAtomPromise: changeAtomPromise
12633
12616
  });
@@ -13205,11 +13188,12 @@ function ownKeys$O(object, enumerableOnly) { var keys = Object.keys(object); if
13205
13188
  function _objectSpread$O(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$O(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$O(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
13206
13189
  var PasteTool = function () {
13207
13190
  function PasteTool(editor, struct) {
13191
+ var _struct$functionalGro;
13208
13192
  _classCallCheck__default["default"](this, PasteTool);
13209
13193
  this.editor = editor;
13210
13194
  this.editor.selection(null);
13211
13195
  this.struct = struct;
13212
- this.isSingleContractedGroup = struct.isSingleGroup() && !struct.functionalGroups.get(0).isExpanded;
13196
+ this.isSingleContractedGroup = struct.isSingleGroup() && !((_struct$functionalGro = struct.functionalGroups.get(0)) !== null && _struct$functionalGro !== void 0 && _struct$functionalGro.isExpanded);
13213
13197
  var rnd = this.editor.render;
13214
13198
  var _rnd$clientArea = rnd.clientArea,
13215
13199
  clientHeight = _rnd$clientArea.clientHeight,
@@ -13240,7 +13224,7 @@ var PasteTool = function () {
13240
13224
  (_this$action = this.action) === null || _this$action === void 0 ? void 0 : _this$action.perform(this.editor.render.ctab);
13241
13225
  }
13242
13226
  var closestGroupItem = this.editor.findItem(event, ['functionalGroups']);
13243
- var closestGroup = this.editor.struct().sgroups.get(closestGroupItem.id);
13227
+ var closestGroup = this.editor.struct().sgroups.get(closestGroupItem === null || closestGroupItem === void 0 ? void 0 : closestGroupItem.id);
13244
13228
  if (!closestGroupItem || ketcherCore.SGroup.isSaltOrSolvent(closestGroup === null || closestGroup === void 0 ? void 0 : closestGroup.data.name)) {
13245
13229
  var _fromPaste3 = ketcherCore.fromPaste(this.editor.render.ctab, this.struct, this.editor.render.page2obj(event)),
13246
13230
  _fromPaste4 = _slicedToArray__default["default"](_fromPaste3, 1),
@@ -13292,7 +13276,9 @@ var PasteTool = function () {
13292
13276
  _action = _fromPaste6[0],
13293
13277
  pasteItems = _fromPaste6[1];
13294
13278
  this.action = _action;
13295
- this.editor.update(this.action, true);
13279
+ this.editor.update(this.action, true, {
13280
+ extendCanvas: false
13281
+ });
13296
13282
  this.mergeItems = getMergeItems(this.editor, pasteItems);
13297
13283
  this.editor.hover(ketcherCore.getHoverToFuse(this.mergeItems));
13298
13284
  }
@@ -14180,14 +14166,14 @@ var TemplateTool = function () {
14180
14166
  if (sgroup) {
14181
14167
  this.findItems.push('functionalGroups');
14182
14168
  }
14169
+ editor.hoverIcon.label = tmpl.struct.name;
14170
+ editor.hoverIcon.fill = '#000000';
14171
+ editor.hoverIcon.show();
14172
+ editor.hoverIcon.updatePosition();
14183
14173
  }
14184
14174
  _createClass__default["default"](TemplateTool, [{
14185
14175
  key: "mousedown",
14186
14176
  value: function mousedown(event) {
14187
- if (this.followAction) {
14188
- this.followAction.perform(this.editor.render.ctab);
14189
- delete this.followAction;
14190
- }
14191
14177
  var closestItem = this.editor.findItem(event, ['atoms', 'bonds', 'sgroups', 'functionalGroups']);
14192
14178
  var ctab = this.editor.render.ctab;
14193
14179
  var struct = ctab.molecule;
@@ -14202,10 +14188,9 @@ var TemplateTool = function () {
14202
14188
  }
14203
14189
  }
14204
14190
  this.editor.hover(null);
14205
- var dragCtxItem = getDragCtxItem(this.editor, event, this.mode, this.mergeItems, this.findItems);
14206
14191
  this.dragCtx = {
14207
14192
  xy0: this.editor.render.page2obj(event),
14208
- item: dragCtxItem
14193
+ item: this.editor.findItem(event, this.findItems)
14209
14194
  };
14210
14195
  var dragCtx = this.dragCtx;
14211
14196
  var ci = dragCtx.item;
@@ -14258,24 +14243,10 @@ var TemplateTool = function () {
14258
14243
  key: "mousemove",
14259
14244
  value: function mousemove(event) {
14260
14245
  if (!this.dragCtx) {
14261
- if (this.followAction) {
14262
- this.followAction.perform(this.editor.render.ctab);
14263
- }
14264
- var _fromPaste = ketcherCore.fromPaste(this.editor.render.ctab, this.template.molecule, this.editor.render.page2obj(event)),
14265
- _fromPaste2 = _slicedToArray__default["default"](_fromPaste, 2),
14266
- followAction = _fromPaste2[0],
14267
- _pasteItems = _fromPaste2[1];
14268
- this.followAction = followAction;
14269
- this.editor.update(followAction, true);
14270
- if (this.mode === 'fg') {
14271
- var skip = getIgnoredGroupItem(this.editor.struct(), _pasteItems);
14272
- var _ci = this.editor.findItem(event, this.findItems, skip);
14273
- this.editor.hover(_ci !== null && _ci !== void 0 ? _ci : null, null, event);
14274
- } else {
14275
- this.mergeItems = getMergeItems(this.editor, _pasteItems);
14276
- this.editor.hover(ketcherCore.getHoverToFuse(this.mergeItems));
14277
- }
14278
- return;
14246
+ this.editor.hoverIcon.show();
14247
+ this.editor.hoverIcon.updatePosition();
14248
+ this.editor.hover(this.editor.findItem(event, this.findItems), null, event);
14249
+ return true;
14279
14250
  }
14280
14251
  var dragCtx = this.dragCtx;
14281
14252
  var ci = dragCtx.item;
@@ -14296,10 +14267,10 @@ var TemplateTool = function () {
14296
14267
  var _fromTemplateOnBondAc = ketcherCore.fromTemplateOnBondAction(this.editor.render.ctab, this.template, ci.id, this.editor.event, dragCtx.sign1 * dragCtx.sign2 > 0, false),
14297
14268
  _fromTemplateOnBondAc2 = _slicedToArray__default["default"](_fromTemplateOnBondAc, 2),
14298
14269
  _action = _fromTemplateOnBondAc2[0],
14299
- _pasteItems2 = _fromTemplateOnBondAc2[1];
14270
+ _pasteItems = _fromTemplateOnBondAc2[1];
14300
14271
  dragCtx.action = _action;
14301
14272
  this.editor.update(dragCtx.action, true);
14302
- dragCtx.mergeItems = ketcherCore.getItemsToFuse(this.editor, _pasteItems2);
14273
+ dragCtx.mergeItems = ketcherCore.getItemsToFuse(this.editor, _pasteItems);
14303
14274
  this.editor.hover(ketcherCore.getHoverToFuse(dragCtx.mergeItems));
14304
14275
  }
14305
14276
  return true;
@@ -14370,7 +14341,7 @@ var TemplateTool = function () {
14370
14341
  key: "mouseup",
14371
14342
  value: function mouseup(event) {
14372
14343
  var _this = this,
14373
- _ci2;
14344
+ _ci;
14374
14345
  var dragCtx = this.dragCtx;
14375
14346
  if (this.targetGroupsIds.length && this.mode !== 'fg') {
14376
14347
  this.editor.event.removeFG.dispatch({
@@ -14404,7 +14375,7 @@ var TemplateTool = function () {
14404
14375
  if (this.isSaltOrSolvent) {
14405
14376
  addSaltsAndSolventsOnCanvasWithoutMerge(restruct, this.template, dragCtx, this.editor);
14406
14377
  return true;
14407
- } else if (((_ci2 = ci) === null || _ci2 === void 0 ? void 0 : _ci2.map) === 'functionalGroups' && ketcherCore.FunctionalGroup.isContractedFunctionalGroup(ci.id, functionalGroups) && this.mode === 'fg' && this.targetGroupsIds.length) {
14378
+ } else if (((_ci = ci) === null || _ci === void 0 ? void 0 : _ci.map) === 'functionalGroups' && ketcherCore.FunctionalGroup.isContractedFunctionalGroup(ci.id, functionalGroups) && this.mode === 'fg' && this.targetGroupsIds.length) {
14408
14379
  functionalGroupRemoveAction = new ketcherCore.Action();
14409
14380
  var _struct = this.editor.struct();
14410
14381
  var _restruct = this.editor.render.ctab;
@@ -14444,7 +14415,7 @@ var TemplateTool = function () {
14444
14415
  } else {
14445
14416
  angle = 0;
14446
14417
  }
14447
- var _fromTemplateOnAtom3 = ketcherCore.fromTemplateOnAtom(restruct, this.template, ci.id, angle, this.mode === 'fg');
14418
+ var _fromTemplateOnAtom3 = ketcherCore.fromTemplateOnAtom(restruct, this.template, ci.id, angle, false);
14448
14419
  var _fromTemplateOnAtom4 = _slicedToArray__default["default"](_fromTemplateOnAtom3, 2);
14449
14420
  action = _fromTemplateOnAtom4[0];
14450
14421
  pasteItems = _fromTemplateOnAtom4[1];
@@ -14486,10 +14457,6 @@ var TemplateTool = function () {
14486
14457
  }, {
14487
14458
  key: "cancel",
14488
14459
  value: function cancel(e) {
14489
- if (this.followAction) {
14490
- this.followAction.perform(this.editor.render.ctab);
14491
- delete this.followAction;
14492
- }
14493
14460
  this.mouseup(e);
14494
14461
  }
14495
14462
  }, {
@@ -14538,23 +14505,6 @@ function getTargetAtomId(struct, ci) {
14538
14505
  return group === null || group === void 0 ? void 0 : group.getAttAtomId(struct);
14539
14506
  }
14540
14507
  }
14541
- function getIgnoredGroupItem(struct, pasteItems) {
14542
- var groupId = struct.getGroupIdFromAtomId(pasteItems.atoms[0]);
14543
- return {
14544
- map: 'functionalGroups',
14545
- id: groupId
14546
- };
14547
- }
14548
- function getDragCtxItem(editor, event, mode, mergeItems, findItems) {
14549
- if (mode === 'fg') return editor.findItem(event, findItems);
14550
- if ((mergeItems === null || mergeItems === void 0 ? void 0 : mergeItems.atoms.size) === 1 && mergeItems.bonds.size === 0) {
14551
- return {
14552
- map: 'atoms',
14553
- id: mergeItems.atoms.values().next().value
14554
- };
14555
- }
14556
- return null;
14557
- }
14558
14508
 
14559
14509
  var TextTool = function () {
14560
14510
  function TextTool(editor) {
@@ -14739,7 +14689,7 @@ function handleAtomPropsDialog(_ref3) {
14739
14689
  var atoms = getSelectedAtoms(selection, restruct.molecule);
14740
14690
  var changeAtomPromise = editor.event.elementEdit.dispatch(atoms);
14741
14691
  updateSelectedAtoms({
14742
- selection: selection,
14692
+ atoms: selection.atoms || [],
14743
14693
  editor: editor,
14744
14694
  changeAtomPromise: changeAtomPromise
14745
14695
  });
@@ -15996,13 +15946,126 @@ function getValidInputOnly(struct, atoms, bonds) {
15996
15946
  };
15997
15947
  }
15998
15948
 
15949
+ var HOVER_ICON_OPACITY = 0.7;
15950
+ var HoverIcon = function () {
15951
+ function HoverIcon(editor) {
15952
+ _classCallCheck__default["default"](this, HoverIcon);
15953
+ this.editor = editor;
15954
+ var icon = this.initialize();
15955
+ this.element = icon.element;
15956
+ this._fill = icon.fill;
15957
+ this._label = icon.label;
15958
+ this.isShown = true;
15959
+ this.shouldBeShownWhenMouseBack = false;
15960
+ this.updatePosition();
15961
+ var clientArea = this.editor.render.clientArea;
15962
+ this.onMouseMove = this.onMouseMove.bind(this);
15963
+ this.onMouseLeave = this.onMouseLeave.bind(this);
15964
+ document.addEventListener('mousemove', this.onMouseMove);
15965
+ clientArea.addEventListener('mouseover', this.onMouseMove);
15966
+ clientArea.addEventListener('mouseleave', this.onMouseLeave);
15967
+ }
15968
+ _createClass__default["default"](HoverIcon, [{
15969
+ key: "fill",
15970
+ get: function get() {
15971
+ return this._fill;
15972
+ },
15973
+ set: function set(fillColor) {
15974
+ this._fill = fillColor;
15975
+ this.element.attr('fill', fillColor);
15976
+ }
15977
+ }, {
15978
+ key: "label",
15979
+ get: function get() {
15980
+ return this._label;
15981
+ },
15982
+ set: function set(label) {
15983
+ this._label = label;
15984
+ this.element.attr('text', label);
15985
+ }
15986
+ }, {
15987
+ key: "isOverLoader",
15988
+ value: function isOverLoader(event) {
15989
+ var target = (event === null || event === void 0 ? void 0 : event.relatedTarget) || event.target;
15990
+ return target === null || target === void 0 ? void 0 : target.classList.contains('loading-spinner');
15991
+ }
15992
+ }, {
15993
+ key: "onMouseMove",
15994
+ value: function onMouseMove(event) {
15995
+ if (this.isShown || this.isOverLoader(event) && this.shouldBeShownWhenMouseBack) {
15996
+ this.show();
15997
+ this.updatePosition();
15998
+ }
15999
+ }
16000
+ }, {
16001
+ key: "onMouseLeave",
16002
+ value: function onMouseLeave(event) {
16003
+ if (!this.isOverLoader(event)) {
16004
+ this.shouldBeShownWhenMouseBack = true;
16005
+ this.hide();
16006
+ }
16007
+ }
16008
+ }, {
16009
+ key: "updatePosition",
16010
+ value: function updatePosition() {
16011
+ var _this$editor$lastCurs = this.editor.lastCursorPosition,
16012
+ x = _this$editor$lastCurs.x,
16013
+ y = _this$editor$lastCurs.y;
16014
+ this.element.attr({
16015
+ x: x,
16016
+ y: y
16017
+ });
16018
+ }
16019
+ }, {
16020
+ key: "show",
16021
+ value: function show() {
16022
+ this.element.show();
16023
+ this.isShown = true;
16024
+ this.shouldBeShownWhenMouseBack = false;
16025
+ }
16026
+ }, {
16027
+ key: "hide",
16028
+ value: function hide() {
16029
+ this.element.hide();
16030
+ this.isShown = false;
16031
+ }
16032
+ }, {
16033
+ key: "initialize",
16034
+ value: function initialize() {
16035
+ var _this$fill;
16036
+ var render = this.editor.render;
16037
+ var fillColor = (_this$fill = this.fill) !== null && _this$fill !== void 0 ? _this$fill : '#000000';
16038
+ var element = render.paper.text(0, 0, this.label || '');
16039
+ element.attr('fill', fillColor);
16040
+ element.attr('font-size', this.editor.options().fontsz);
16041
+ element.attr('opacity', HOVER_ICON_OPACITY);
16042
+ return {
16043
+ element: element,
16044
+ fill: fillColor,
16045
+ label: (this === null || this === void 0 ? void 0 : this.label) || ''
16046
+ };
16047
+ }
16048
+ }, {
16049
+ key: "create",
16050
+ value: function create() {
16051
+ var icon = this.initialize();
16052
+ this.element = icon.element;
16053
+ this._fill = icon.fill;
16054
+ this._label = icon.label;
16055
+ this.isShown = true;
16056
+ this.shouldBeShownWhenMouseBack = false;
16057
+ this.updatePosition();
16058
+ }
16059
+ }]);
16060
+ return HoverIcon;
16061
+ }();
16062
+
15999
16063
  function ownKeys$J(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
16000
16064
  function _objectSpread$J(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$J(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$J(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
16001
16065
  function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
16002
16066
  function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
16003
16067
  var SCALE = 40;
16004
16068
  var HISTORY_SIZE = 32;
16005
- var HOVER_ICON_OPACITY = 0.7;
16006
16069
  var structObjects = ['atoms', 'bonds', 'frags', 'sgroups', 'sgroupData', 'rgroups', 'rxnArrows', 'rxnPluses', 'enhancedFlags', 'simpleObjects', 'texts'];
16007
16070
  var highlightTargets = ['atoms', 'bonds', 'rxnArrows', 'rxnPluses', 'functionalGroups', 'frags', 'merge', 'rgroups', 'sgroups', 'sgroupData', 'enhancedFlags', 'simpleObjects', 'texts'];
16008
16071
  function selectStereoFlagsIfNecessary(atoms, expAtoms) {
@@ -16043,7 +16106,8 @@ var Editor$3 = function () {
16043
16106
  x: 0,
16044
16107
  y: 0
16045
16108
  };
16046
- this.createHoverIcon();
16109
+ this.hoverIcon = new HoverIcon(this);
16110
+ this.hoverIcon.updatePosition();
16047
16111
  this.contextMenu = {};
16048
16112
  this.event = {
16049
16113
  message: new subscription.Subscription(),
@@ -16103,26 +16167,6 @@ var Editor$3 = function () {
16103
16167
  this._tool = tool;
16104
16168
  return this._tool;
16105
16169
  }
16106
- }, {
16107
- key: "updateHoverIconPosition",
16108
- value: function updateHoverIconPosition() {
16109
- var _this$lastCursorPosit = this.lastCursorPosition,
16110
- x = _this$lastCursorPosit.x,
16111
- y = _this$lastCursorPosit.y;
16112
- var _this$hoverIcon$getBB = this.hoverIcon.getBBox(),
16113
- height = _this$hoverIcon$getBB.height,
16114
- width = _this$hoverIcon$getBB.width;
16115
- this.hoverIcon.attr({
16116
- x: x - width / 2,
16117
- y: y - height / 2
16118
- });
16119
- }
16120
- }, {
16121
- key: "createHoverIcon",
16122
- value: function createHoverIcon() {
16123
- this.hoverIcon = this.render.paper.text(0, 0, '').attr('font-size', this.options().fontsz).attr('opacity', HOVER_ICON_OPACITY);
16124
- this.updateHoverIconPosition();
16125
- }
16126
16170
  }, {
16127
16171
  key: "clear",
16128
16172
  value: function clear() {
@@ -16146,7 +16190,7 @@ var Editor$3 = function () {
16146
16190
  this.selection(null);
16147
16191
  var struct = value || new ketcherCore.Struct();
16148
16192
  var molecule = this.renderAndRecoordinateStruct(struct);
16149
- this.createHoverIcon();
16193
+ this.hoverIcon.create();
16150
16194
  return molecule;
16151
16195
  }
16152
16196
  }, {
@@ -16246,8 +16290,11 @@ var Editor$3 = function () {
16246
16290
  }, {
16247
16291
  key: "update",
16248
16292
  value: function update(action, ignoreHistory) {
16293
+ var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
16294
+ extendCanvas: true
16295
+ };
16249
16296
  if (action === true) {
16250
- this.render.update(true);
16297
+ this.render.update(true, null, options);
16251
16298
  } else {
16252
16299
  if (!ignoreHistory && !action.isDummy()) {
16253
16300
  this.historyStack.splice(this.historyPtr, HISTORY_SIZE + 1, action);
@@ -16257,7 +16304,7 @@ var Editor$3 = function () {
16257
16304
  this.historyPtr = this.historyStack.length;
16258
16305
  this.event.change.dispatch(action);
16259
16306
  }
16260
- this.render.update();
16307
+ this.render.update(false, null, options);
16261
16308
  }
16262
16309
  }
16263
16310
  }, {
@@ -16635,9 +16682,7 @@ var useAtomEdit = function useAtomEdit() {
16635
16682
  atoms = mapAtomIdsToAtoms(atomIds, molecule);
16636
16683
  newAtom = editor.event.elementEdit.dispatch(atoms);
16637
16684
  updateSelectedAtoms({
16638
- selection: {
16639
- atoms: atoms
16640
- },
16685
+ atoms: atomIds,
16641
16686
  changeAtomPromise: newAtom,
16642
16687
  editor: editor
16643
16688
  });
@@ -17201,6 +17246,9 @@ var ContextMenuTrigger = function ContextMenuTrigger(_ref) {
17201
17246
  var selection = editor.selection();
17202
17247
  var functionalGroupsInSelection = getSelectedFunctionalGroups();
17203
17248
  var showProps = null;
17249
+ if (selection && !selection.bonds && !selection.atoms) {
17250
+ return;
17251
+ }
17204
17252
  if (selection) {
17205
17253
  if (functionalGroupsInSelection.size > 0) {
17206
17254
  var functionalGroups = Array.from(functionalGroupsInSelection.values());
@@ -17395,6 +17443,9 @@ function getPanelPositionRelativeToRect(clientX, clientY, sGroup, render, width,
17395
17443
  var viewportLeftLimit = BAR_PANEL_SIZE * LEFT_PADDING_MULTIPLIER + width;
17396
17444
  var viewportBottomLimit = (render === null || render === void 0 ? void 0 : (_render$clientArea = render.clientArea) === null || _render$clientArea === void 0 ? void 0 : _render$clientArea.clientHeight) - BAR_PANEL_SIZE - height;
17397
17445
  var viewportRightLimit = (render === null || render === void 0 ? void 0 : (_render$clientArea2 = render.clientArea) === null || _render$clientArea2 === void 0 ? void 0 : _render$clientArea2.clientWidth) - BAR_PANEL_SIZE - width;
17446
+ if (!sGroup.hovering) {
17447
+ return null;
17448
+ }
17398
17449
  var rectCoords = (_sGroup$hovering$attr = sGroup.hovering.attrs) === null || _sGroup$hovering$attr === void 0 ? void 0 : (_sGroup$hovering$attr2 = _sGroup$hovering$attr.path) === null || _sGroup$hovering$attr2 === void 0 ? void 0 : _sGroup$hovering$attr2.map(function (line) {
17399
17450
  return line.slice(1);
17400
17451
  });
@@ -17787,7 +17838,7 @@ var StructEditor = function (_Component) {
17787
17838
  className: classes$D.measureLog,
17788
17839
  ref: this.logRef
17789
17840
  }), indigoVerification && jsxRuntime.jsx("div", {
17790
- className: classes$D.spinnerOverlay,
17841
+ className: "".concat(classes$D.spinnerOverlay, " loading-spinner"),
17791
17842
  children: jsxRuntime.jsx(LoadingCircles, {})
17792
17843
  }), jsxRuntime.jsx(InfoPanel$1, {
17793
17844
  clientX: clientX,
@@ -24067,8 +24118,8 @@ var KetcherBuilder = function () {
24067
24118
  initApp(element, staticResourcesUrl, {
24068
24119
  buttons: buttons || {},
24069
24120
  errorHandler: errorHandler || null,
24070
- version: "2.9.0-rc.3" ,
24071
- buildDate: "2023-03-11T13:55:42" ,
24121
+ version: "2.9.0-rc.5" ,
24122
+ buildDate: "2023-03-27T12:30:17" ,
24072
24123
  buildNumber: ''
24073
24124
  }, structService, resolve);
24074
24125
  });