ketcher-react 2.26.0-rc.9 → 2.27.0-rc.2

package/dist/index.modern.js

@@ -3733,7 +3733,7 @@ var zoom = {
 
 var openHelpLink = function openHelpLink() {
   var _window$open;
-  return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.26.0-rc.9\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
+  return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.27.0-rc.2\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
 };
 var help = {
   help: {
@@ -8250,11 +8250,6 @@ var DetailsContainer = styled.div({
   overflowX: 'hidden',
   overflowY: 'auto',
   transition: 'all .3s'
-}, function (_ref) {
-  var expanded = _ref.expanded;
-  return {
-    maxHeight: expanded ? '9999px' : '0'
-  };
 });
 
 var Accordion$1 = function Accordion(_ref) {
@@ -8269,7 +8264,7 @@ var Accordion$1 = function Accordion(_ref) {
     children: [jsx(SummaryContainer, {
       onClick: onSummaryClick,
       children: summary
-    }), jsx(DetailsContainer, {
+    }), expanded && jsx(DetailsContainer, {
       "data-testid": dataTestIdDetails,
       expanded: expanded,
       children: details
@@ -8436,7 +8431,8 @@ var MonomerName = styled.div(_templateObject6$2 || (_templateObject6$2 = _tagged
 
 var AmbiguousMonomerPreview = function AmbiguousMonomerPreview(_ref) {
   var className = _ref.className,
-    preview = _ref.preview;
+    preview = _ref.preview,
+    style = _ref.style;
   var monomer = preview.monomer,
     presetMonomers = preview.presetMonomers;
   var isAlternatives = monomer.subtype === 'alternatives';
@@ -8494,6 +8490,7 @@ var AmbiguousMonomerPreview = function AmbiguousMonomerPreview(_ref) {
     return sortedData.slice(0, 5);
   }, [previewData, isAlternatives]);
   return jsxs(Container, {
+    style: style,
     className: className,
     "data-testid": "polymer-library-preview",
     children: [jsx(Header$1, {
@@ -14560,7 +14557,7 @@ var groupDescriptors = groups.reduce(function (accum, group, index) {
 var rGroupOptions = makeItems(['rgroup-label', 'rgroup-fragment', 'rgroup-attpoints']);
 var shapeOptions = makeItems(['shape-ellipse', 'shape-rectangle', 'shape-line']);
 var selectOptions$2 = makeItems(['select-rectangle', 'select-lasso', 'select-fragment']);
-var arrowsOptions = makeItems(['reaction-arrow-open-angle', 'reaction-arrow-filled-triangle', 'reaction-arrow-filled-bow', 'reaction-arrow-dashed-open-angle', 'reaction-arrow-failed', 'reaction-arrow-retrosynthetic', 'reaction-arrow-both-ends-filled-triangle', 'reaction-arrow-equilibrium-filled-half-bow', 'reaction-arrow-equilibrium-filled-triangle', 'reaction-arrow-equilibrium-open-angle', 'reaction-arrow-unbalanced-equilibrium-filled-half-bow', 'reaction-arrow-unbalanced-equilibrium-open-half-angle', 'reaction-arrow-unbalanced-equilibrium-large-filled-half-bow', 'reaction-arrow-unbalanced-equilibrium-filled-half-triangle', 'reaction-arrow-elliptical-arc-arrow-open-angle', 'reaction-arrow-elliptical-arc-arrow-filled-triangle', 'reaction-arrow-elliptical-arc-arrow-filled-bow', 'reaction-arrow-elliptical-arc-arrow-open-half-angle', MULTITAIL_ARROW_TOOL_NAME]);
+var arrowsOptions = makeItems(['reaction-arrow-open-angle', 'reaction-arrow-filled-triangle', 'reaction-arrow-filled-bow', 'reaction-arrow-dashed-open-angle', 'reaction-arrow-failed', 'reaction-arrow-retrosynthetic', 'reaction-arrow-both-ends-filled-triangle', 'reaction-arrow-equilibrium-filled-half-bow', 'reaction-arrow-equilibrium-filled-triangle', 'reaction-arrow-equilibrium-open-angle', 'reaction-arrow-unbalanced-equilibrium-filled-half-bow', 'reaction-arrow-unbalanced-equilibrium-open-half-angle', 'reaction-arrow-unbalanced-equilibrium-large-filled-half-bow', 'reaction-arrow-unbalanced-equilibrium-filled-half-triangle', 'reaction-arrow-elliptical-arc-arrow-filled-bow', 'reaction-arrow-elliptical-arc-arrow-filled-triangle', 'reaction-arrow-elliptical-arc-arrow-open-angle', 'reaction-arrow-elliptical-arc-arrow-open-half-angle', MULTITAIL_ARROW_TOOL_NAME]);
 var mappingOptions = makeItems(['reaction-map', 'reaction-unmap', 'reaction-automap']);
 
 var classes$M = {"scroll":"ArrowScroll-module_scroll__h9kCx","button":"ArrowScroll-module_button__ygMgL","down":"ArrowScroll-module_down__yDzZX","up":"ArrowScroll-module_up__Q1ubd"};
@@ -15345,14 +15342,16 @@ var UndoRedo = function UndoRedo(_ref) {
       iconName: "undo",
       disabled: disabledButtons.includes('undo'),
       isHidden: hiddenButtons.includes('undo'),
-      shortcut: shortcuts.undo
+      shortcut: shortcuts.undo,
+      testId: "undo"
     }), jsx(TopToolbarIconButton, {
       title: "Redo",
       onClick: onRedo,
       iconName: "redo",
       disabled: disabledButtons.includes('redo'),
       isHidden: hiddenButtons.includes('redo'),
-      shortcut: shortcuts.redo
+      shortcut: shortcuts.redo,
+      testId: "redo"
     }), jsx(Divider$1, {})]
   });
 };
@@ -21486,7 +21485,12 @@ var EnhancedStereoTool = function () {
         }
         var action = stereoAtoms.reduce(function (acc, stereoAtom) {
           var _struct$atoms$get;
-          return acc.mergeWith(fromStereoFlagUpdate(restruct, (_struct$atoms$get = struct.atoms.get(stereoAtom)) === null || _struct$atoms$get === void 0 ? void 0 : _struct$atoms$get.fragment));
+          var frid = (_struct$atoms$get = struct.atoms.get(stereoAtom)) === null || _struct$atoms$get === void 0 ? void 0 : _struct$atoms$get.fragment;
+          var frag = frid !== undefined ? restruct.molecule.frags.get(frid) : null;
+          if (frag && frag.stereoAtoms) {
+            return acc.mergeWith(fromStereoFlagUpdate(restruct, frid));
+          }
+          return acc;
         }, fromAtomsAttrs(restruct, stereoAtoms, {
           stereoLabel: stereoLabel
         }, false));
@@ -23522,23 +23526,26 @@ var Highlighter = function () {
       args.forEach(function (arg) {
         var atoms = arg.atoms,
           bonds = arg.bonds,
+          rgroupAttachmentPoints = arg.rgroupAttachmentPoints,
           color = arg.color;
         if (typeof color !== 'string') {
           return;
         }
-        if (!atoms && !bonds) {
+        if (!atoms && !bonds && !rgroupAttachmentPoints) {
           return;
         }
         var restruct = _this.editor.render.ctab;
-        var _getValidInputOnly = getValidInputOnly(restruct.molecule, atoms, bonds),
+        var _getValidInputOnly = getValidInputOnly(restruct.molecule, atoms, bonds, rgroupAttachmentPoints),
           validAtoms = _getValidInputOnly.validAtoms,
-          validBonds = _getValidInputOnly.validBonds;
-        if (validAtoms.length === 0 && validBonds.length === 0) {
+          validBonds = _getValidInputOnly.validBonds,
+          validRgroupAttachmentPoints = _getValidInputOnly.validRgroupAttachmentPoints;
+        if (validAtoms.length === 0 && validBonds.length === 0 && validRgroupAttachmentPoints.length === 0) {
           return;
         }
         createdHighlights.push({
           atoms: validAtoms,
           bonds: validBonds,
+          rgroupAttachmentPoints: validRgroupAttachmentPoints,
           color: color
         });
       });
@@ -23554,15 +23561,19 @@ var Highlighter = function () {
   }]);
   return Highlighter;
 }();
-function getValidInputOnly(struct, atoms, bonds) {
+function getValidInputOnly(struct, atoms, bonds, rgroupAttachmentPoints) {
   if (!Array.isArray(atoms)) {
     atoms = [];
   }
   if (!Array.isArray(bonds)) {
     bonds = [];
   }
+  if (!Array.isArray(rgroupAttachmentPoints)) {
+    rgroupAttachmentPoints = [];
+  }
   var structAtoms = struct.atoms,
-    structBonds = struct.bonds;
+    structBonds = struct.bonds,
+    structRgroupAttachmentPoints = struct.rgroupAttachmentPoints;
   if (atoms.length > 0) {
     atoms = atoms.filter(function (aid) {
       return structAtoms.has(aid);
@@ -23573,9 +23584,15 @@ function getValidInputOnly(struct, atoms, bonds) {
       return structBonds.has(bid);
     });
   }
+  if (rgroupAttachmentPoints.length > 0) {
+    rgroupAttachmentPoints = rgroupAttachmentPoints.filter(function (rgroupAPId) {
+      return structRgroupAttachmentPoints.has(rgroupAPId);
+    });
+  }
   return {
     validAtoms: atoms,
-    validBonds: bonds
+    validBonds: bonds,
+    validRgroupAttachmentPoints: rgroupAttachmentPoints
   };
 }
 
@@ -24361,7 +24378,7 @@ function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedec
 function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
 var SCALE = provideEditorSettings().microModeScale;
 var HISTORY_SIZE = 32;
-var structObjects = ['atoms', 'bonds', 'frags', 'sgroups', 'sgroupData', 'rgroups', 'rxnArrows', 'rxnPluses', 'enhancedFlags', 'simpleObjects', 'texts', IMAGE_KEY, MULTITAIL_ARROW_KEY];
+var structObjects = ['atoms', 'bonds', 'frags', 'sgroups', 'sgroupData', 'rgroups', 'rxnArrows', 'rxnPluses', 'enhancedFlags', 'simpleObjects', 'texts', 'rgroupAttachmentPoints', IMAGE_KEY, MULTITAIL_ARROW_KEY];
 var highlightTargets = ['atoms', 'bonds', 'rxnArrows', 'rxnPluses', 'functionalGroups', 'frags', 'merge', 'rgroups', 'rgroupAttachmentPoints', 'sgroups', 'sgroupData', 'enhancedFlags', 'simpleObjects', 'texts', IMAGE_KEY, MULTITAIL_ARROW_KEY];
 function selectStereoFlagsIfNecessary(atoms, expAtoms) {
   var atomsOfFragments = {};
@@ -25534,15 +25551,20 @@ var AtomMenuItems = function AtomMenuItems(props) {
     var atomIds = ((_props$propsFromTrigg6 = props.propsFromTrigger) === null || _props$propsFromTrigg6 === void 0 ? void 0 : _props$propsFromTrigg6.atomIds) || [];
     editor.highlights.create({
       atoms: atomIds,
+      rgroupAttachmentPoints: [],
       bonds: [],
       color: color === '' ? 'transparent' : color
     });
   };
   if (isAtomSuperatomLeavingGroup && onlyOneAtomSelected) {
-    return jsx(Item, _objectSpread$O(_objectSpread$O({}, props), {}, {
-      onClick: handleDelete,
-      children: "Delete"
-    }));
+    return jsxs(Fragment, {
+      children: [jsx(HighlightMenu, {
+        onHighlight: highlightAtomWithColor
+      }), jsx(Item, _objectSpread$O(_objectSpread$O({}, props), {}, {
+        onClick: handleDelete,
+        children: "Delete"
+      }))]
+    });
   }
   return jsxs(Fragment, {
     children: [jsx(Item, _objectSpread$O(_objectSpread$O({}, props), {}, {
@@ -25656,6 +25678,7 @@ var useBondSGroupAttach = function useBondSGroupAttach() {
     SGroupTool.sgroupDialog(editor, null);
   }, [getKetcherInstance]);
   var hidden = useCallback(function (_ref2) {
+    var _struct$sgroups$get;
     var props = _ref2.props;
     var editor = getKetcherInstance().editor;
     var struct = editor.render.ctab;
@@ -25665,6 +25688,12 @@ var useBondSGroupAttach = function useBondSGroupAttach() {
     }
     var bond = struct.bonds.get(bondIds[0]);
     var attachedSGroups = bond.b.getAttachedSGroups(struct.molecule);
+    var _attachedSGroups = _slicedToArray$1(attachedSGroups, 1),
+      sgGroupId = _attachedSGroups[0];
+    var sgroup = (_struct$sgroups$get = struct.sgroups.get(sgGroupId)) === null || _struct$sgroups$get === void 0 ? void 0 : _struct$sgroups$get.item;
+    if (sgroup !== null && sgroup !== void 0 && sgroup.isSuperatomWithoutLabel) {
+      return false;
+    }
     return attachedSGroups.size > 0;
   }, [getKetcherInstance]);
   return [handler, hidden];
@@ -25692,8 +25721,17 @@ var useBondSGroupEdit = function useBondSGroupEdit() {
     return sGroupsRef.current.size > 1;
   }, [getKetcherInstance]);
   var hidden = useCallback(function () {
+    var _struct$sgroups$get;
+    var editor = getKetcherInstance().editor;
+    var struct = editor.render.ctab;
+    var _sGroupsRef$current = _slicedToArray$1(sGroupsRef.current, 1),
+      sgGroupId = _sGroupsRef$current[0];
+    var sgroup = (_struct$sgroups$get = struct.sgroups.get(sgGroupId)) === null || _struct$sgroups$get === void 0 ? void 0 : _struct$sgroups$get.item;
+    if (sgroup !== null && sgroup !== void 0 && sgroup.isSuperatomWithoutLabel) {
+      return true;
+    }
     return sGroupsRef.current.size === 0;
-  }, []);
+  }, [getKetcherInstance]);
   return [handler, disabled, hidden];
 };
 
@@ -25809,6 +25847,7 @@ var BondMenuItems = function BondMenuItems(props) {
     editor.highlights.create({
       atoms: [],
       bonds: bondIds,
+      rgroupAttachmentPoints: [],
       color: color === '' ? 'transparent' : color
     });
   };
@@ -25999,12 +26038,14 @@ var SelectionMenuItems = function SelectionMenuItems(props) {
     atomStereoDisabled = _useAtomStereo2[1];
   var handleDelete = useDelete$1();
   var highlightBondWithColor = function highlightBondWithColor(color) {
-    var _props$propsFromTrigg, _props$propsFromTrigg2;
+    var _props$propsFromTrigg, _props$propsFromTrigg2, _props$propsFromTrigg3;
     var bondIds = ((_props$propsFromTrigg = props.propsFromTrigger) === null || _props$propsFromTrigg === void 0 ? void 0 : _props$propsFromTrigg.bondIds) || [];
     var atomIds = ((_props$propsFromTrigg2 = props.propsFromTrigger) === null || _props$propsFromTrigg2 === void 0 ? void 0 : _props$propsFromTrigg2.atomIds) || [];
+    var rgroupAttachmentPoints = ((_props$propsFromTrigg3 = props.propsFromTrigger) === null || _props$propsFromTrigg3 === void 0 ? void 0 : _props$propsFromTrigg3.rgroupAttachmentPoints) || [];
     editor.highlights.create({
       atoms: atomIds,
       bonds: bondIds,
+      rgroupAttachmentPoints: rgroupAttachmentPoints,
       color: color === '' ? 'transparent' : color
     });
   };
@@ -26126,19 +26167,34 @@ var useRGroupAttachmentPointEdit = function useRGroupAttachmentPointEdit() {
 function ownKeys$K(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$K(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$K(Object(t), !0).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$K(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var RGroupAttachmentPointMenuItems = function RGroupAttachmentPointMenuItems(props) {
+  var _useAppContext = useAppContext(),
+    getKetcherInstance = _useAppContext.getKetcherInstance;
   var handleRemove = useDelete();
   var _useRGroupAttachmentP = useRGroupAttachmentPointEdit(),
     _useRGroupAttachmentP2 = _slicedToArray$1(_useRGroupAttachmentP, 3),
     handleEditRGroupAttachmentPoint = _useRGroupAttachmentP2[0],
     rgroupAttachmentPointDisabled = _useRGroupAttachmentP2[1],
     rgroupAttachmentPointHidden = _useRGroupAttachmentP2[2];
+  var editor = getKetcherInstance().editor;
+  var highlight = function highlight(color) {
+    var _props$propsFromTrigg;
+    var rgroupAttachmentPoints = ((_props$propsFromTrigg = props.propsFromTrigger) === null || _props$propsFromTrigg === void 0 ? void 0 : _props$propsFromTrigg.rgroupAttachmentPoints) || [];
+    editor.highlights.create({
+      rgroupAttachmentPoints: rgroupAttachmentPoints,
+      atoms: [],
+      bonds: [],
+      color: color === '' ? 'transparent' : color
+    });
+  };
   return jsxs(Fragment, {
     children: [jsx(Item, _objectSpread$K(_objectSpread$K({}, props), {}, {
       disabled: rgroupAttachmentPointDisabled,
       hidden: rgroupAttachmentPointHidden,
       onClick: handleEditRGroupAttachmentPoint,
       children: "Edit..."
-    })), jsx(Item, _objectSpread$K(_objectSpread$K({}, props), {}, {
+    })), jsx(HighlightMenu, {
+      onHighlight: highlight
+    }), jsx(Item, _objectSpread$K(_objectSpread$K({}, props), {}, {
       onClick: handleRemove,
       children: "Remove"
     }))]
@@ -26242,10 +26298,14 @@ var useMonomerExpansionHandlers = function useMonomerExpansionHandlers() {
 function ownKeys$I(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$I(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$I(Object(t), !0).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$I(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MacromoleculeMenuItems = function MacromoleculeMenuItems(props) {
+  var _props$propsFromTrigg;
   var _useMonomerExpansionH = useMonomerExpansionHandlers(),
     _useMonomerExpansionH2 = _slicedToArray$1(_useMonomerExpansionH, 2),
     action = _useMonomerExpansionH2[0],
     _hidden = _useMonomerExpansionH2[1];
+  var multipleMonomersSelected = (props === null || props === void 0 || (_props$propsFromTrigg = props.propsFromTrigger) === null || _props$propsFromTrigg === void 0 ? void 0 : _props$propsFromTrigg.functionalGroups) && props.propsFromTrigger.functionalGroups.length > 1;
+  var expandText = multipleMonomersSelected ? 'Expand monomers' : 'Expand monomer';
+  var collapseText = multipleMonomersSelected ? 'Collapse monomers' : 'Collapse monomer';
   return jsxs(Fragment, {
     children: [jsx(Item, _objectSpread$I(_objectSpread$I({}, props), {}, {
       hidden: function hidden(params) {
@@ -26254,7 +26314,7 @@ var MacromoleculeMenuItems = function MacromoleculeMenuItems(props) {
       onClick: function onClick(params) {
         return action(params, true);
       },
-      children: "Expand monomer"
+      children: expandText
     })), jsx(Item, _objectSpread$I(_objectSpread$I({}, props), {}, {
       hidden: function hidden(params) {
         return _hidden(params, false);
@@ -26262,7 +26322,7 @@ var MacromoleculeMenuItems = function MacromoleculeMenuItems(props) {
       onClick: function onClick(params) {
         return action(params, false);
       },
-      children: "Collapse monomer"
+      children: collapseText
     }))]
   });
 };
@@ -26545,7 +26605,8 @@ function getMenuPropsForSelection(selection, selectedFunctionalGroups) {
     return {
       id: CONTEXT_MENU_ID.FOR_SELECTION,
       bondIds: bonds,
-      atomIds: atoms
+      atomIds: atoms,
+      rgroupAttachmentPoints: rgroupAttachmentPoints
     };
   }
 }
@@ -26846,16 +26907,17 @@ var InfoPanel = function InfoPanel(props) {
   return isAmbiguousMonomer ? jsx(AmbiguousMonomerPreview, {
     preview: {
       type: PreviewType.AmbiguousMonomer,
-      monomer: sGroup.monomer.variantMonomerItem,
-      style: {
-        left: "".concat(clientX - 50, "px"),
-        top: calculateAmbiguousMonomerPreviewTop(sGroup.monomer.variantMonomerItem)({
-          left: clientX - 50,
-          top: clientY - 65,
-          bottom: clientY - 25
-        }),
-        transform: 'translate(-50%, 0)'
-      }
+      monomer: sGroup.monomer.variantMonomerItem
+    },
+    style: {
+      position: 'absolute',
+      left: "".concat(clientX - 50, "px"),
+      top: calculateAmbiguousMonomerPreviewTop(sGroup.monomer.variantMonomerItem)({
+        left: clientX - 50,
+        top: clientY - 65,
+        bottom: clientY - 25
+      }),
+      transform: 'translate(-50%, 0)'
     }
   }) : showMolecule ? jsx("div", {
     style: {
@@ -34822,8 +34884,8 @@ var KetcherBuilder = function () {
                 cleanup = initApp(element, appRoot, staticResourcesUrl, {
                   buttons: buttons || {},
                   errorHandler: errorHandler || null,
-                  version: "2.26.0-rc.9" ,
-                  buildDate: "2024-11-11T12:08:18" ,
+                  version: "2.27.0-rc.2" ,
+                  buildDate: "2024-11-12T19:33:40" ,
                   buildNumber: '',
                   customButtons: customButtons || []
                 }, structService, resolve, togglerComponent);