ketcher-react 3.8.0-rc.2 → 3.8.0-rc.4

package/dist/cjs/script/editor/Editor.d.ts

@@ -107,10 +107,13 @@ declare class Editor implements KetcherEditor {
     openMonomerCreationWizard(): void;
     assignLeavingGroupAtom(atomId: number): void;
     closeMonomerCreationWizard(): void;
+    private cleanupAttachmentPoint;
     saveNewMonomer(data: any): void;
     reassignAttachmentPointAtom(atomId: number, atomLabel: string): void;
     reassignAttachmentPoint(currentName: AttachmentPointName, newName: AttachmentPointName): void;
     removeAttachmentPoint(name: AttachmentPointName): void;
+    cleanupCloseAttachmentPointEditPopup(): void;
+    setProblematicAttachmentPoints(problematicPoints: Set<AttachmentPointName>): void;
     selection(ci?: any): Selection | null;
     hover(ci: {
         id: number;

package/dist/cjs/script/ui/views/components/MonomerCreationWizard/components/AttachmentPoint/AttachmentPoint.d.ts

@@ -2,6 +2,7 @@ import { AttachmentPointName } from 'ketcher-core';
 declare type Props = {
     name: AttachmentPointName;
     atomLabel: string;
+    implicitH: number;
 };
-declare const AttachmentPoint: ({ name, atomLabel }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const AttachmentPoint: ({ name, atomLabel, implicitH }: Props) => import("react/jsx-runtime").JSX.Element;
 export default AttachmentPoint;

package/dist/index.js

@@ -27,7 +27,7 @@ import 'url-search-params-polyfill';
 import 'whatwg-fetch';
 import _classCallCheck$2 from '@babel/runtime/helpers/classCallCheck';
 import _createClass$2 from '@babel/runtime/helpers/createClass';
-import { KetSerializer, MolSerializer, KetcherLogger, ketcherProvider, defaultBondThickness, isClipboardAPIAvailable, notifyCopyCut, notifyRequestCompleted, isControlKey, StereLabelStyleType, StereoColoringType, ShowHydrogenLabels, ShowHydrogenLabelNames, SettingsManager, SdfSerializer, KETCHER_SAVED_OPTIONS_KEY, SUPERATOM_CLASS, Bond as Bond$2, Elements, AtomList, getAtomType, StereoLabel, isAttachmentBond, Atom as Atom$2, findStereoAtoms, RxnArrowMode, MULTITAIL_ARROW_TOOL_NAME, CREATE_MONOMER_TOOL_NAME, SimpleObjectMode, IMAGE_KEY, SGroup as SGroup$1, identifyStructFormat, SupportedFormat, FormatterFactory, MULTITAIL_ARROW_KEY, ChemicalMimeType, RenderStruct, Struct, ZoomTool, KETCHER_MACROMOLECULES_ROOT_NODE_SELECTOR, shortcutStr, MonomerMicromolecule, UnresolvedMonomer, FunctionalGroupsProvider, SaltsAndSolventsProvider, KetcherAsyncEvents, ElementColor, generateMenuShortcuts, Vec2, Scale, fromMultipleMove, FunctionalGroup, mergeMapOfItemsToSet, fromSgroupDeletion, fromFragmentDeletion, vectorUtils, fromBondAddition, Action, fromAtomAddition, fromAtomsAttrs, checkOverlapping, fromSeveralSgroupAddition, expandSGroupWithMultipleAttachmentPoint, SgContexts, Pile, fromSgroupAction, fromItemsFuse, ReBond, setExpandSGroup, fromBondsAttrs, OperationType, ReStruct, imageReferencePositionToCursor, multitailArrowReferenceLinesToCursor, multitailReferencePositionToCursor, CoordinateTransformation, MultitailArrowRefName, fromMultitailArrowHeadTailMove, fromMultitailArrowHeadTailsResize, fromMultitailArrowMove, fromArrowResizing, fromPaste, fromImageResize, fromSimpleObjectResizing, getItemsToFuse, getHoverToFuse, fromTextDeletion, fromTextUpdating, fromTemplateOnCanvas, fromTemplateOnBondAction, fromTemplateOnAtom, BondAttr, AtomAttr, formatProperties, runAsyncAction, getStructStringFromClipboardData, getStructure, initHotKeys, keyNorm, Fragment as Fragment$1, fromRGroupAttachmentPointUpdate, fromOneBondDeletion, bondChangingAction, fromChain, removeInfoLabelFromAtoms, fromStereoFlagUpdate, fromOneAtomDeletion, fromArrowDeletion, fromPlusDeletion, fromSimpleObjectDeletion, fromRGroupAttachmentPointDeletion, fromImageDeletion, fromMultitailArrowDeletion, notifyItemsToMergeInitializationComplete, RGroup as RGroup$2, fromRGroupFragment, fromUpdateIfThen, fromRGroupAttrs, fromArrowAddition, fromMultitailArrowCreation, fromPlusAddition, getRelSGroupsBySelection, RotateMonomerOperation, fromRotate, fromFlip, fromSimpleObjectAddition, fromTextCreation, fromImageMove, fromImageCreation, fromHighlightCreate, fromHighlightClear, getOptionsWithConvertedUnits, provideEditorSettings, fromNewCanvas, Render, Coordinates, genericsList, getAttachmentPointLabel, getNextFreeAttachmentPoint, AttachmentPointName, setMonomerTemplatePrefix, getHELMClassByKetMonomerClass, fillNaturalAnalogueForPhosphateAndSugar, KetTemplateType, normalizeMonomerAtomsPositions, monomerFactory, MacromoleculesConverter, fromSgroupAddition, fromDescriptorsAlign, MonomerCreationAttachmentPointClickEvent, atomGetAttr, fromBondFlipping, setExpandMonomerSGroup, fromMultitailArrowTailAdd, MultitailArrow, fromMultitailArrowTailRemove, AmbiguousMonomer, KetMonomerClass, AtomLabel, CoreEditor, getAttachmentPointNumberFromLabel, getAtomCustomQuery, getFormatMimeTypeByFileName, getPropertiesByFormat, StereoFlag, getPropertiesByImgFormat, legacyCopy as legacyCopy$1, b64toBlob, Generics, TextCommand, Ketcher, DefaultStructServiceOptions } from 'ketcher-core';
+import { KetSerializer, MolSerializer, KetcherLogger, ketcherProvider, defaultBondThickness, isClipboardAPIAvailable, notifyCopyCut, notifyRequestCompleted, isControlKey, StereLabelStyleType, StereoColoringType, ShowHydrogenLabels, ShowHydrogenLabelNames, SettingsManager, SdfSerializer, KETCHER_SAVED_OPTIONS_KEY, SUPERATOM_CLASS, Bond as Bond$2, Elements, AtomList, getAtomType, StereoLabel, isAttachmentBond, Atom as Atom$2, findStereoAtoms, RxnArrowMode, MULTITAIL_ARROW_TOOL_NAME, CREATE_MONOMER_TOOL_NAME, SimpleObjectMode, IMAGE_KEY, SGroup as SGroup$1, identifyStructFormat, SupportedFormat, FormatterFactory, MULTITAIL_ARROW_KEY, ChemicalMimeType, RenderStruct, Struct, ZoomTool, KETCHER_MACROMOLECULES_ROOT_NODE_SELECTOR, shortcutStr, MonomerMicromolecule, UnresolvedMonomer, FunctionalGroupsProvider, SaltsAndSolventsProvider, KetcherAsyncEvents, ElementColor, generateMenuShortcuts, Vec2, Scale, fromMultipleMove, FunctionalGroup, mergeMapOfItemsToSet, fromSgroupDeletion, fromFragmentDeletion, vectorUtils, fromBondAddition, Action, fromAtomAddition, fromAtomsAttrs, checkOverlapping, fromSeveralSgroupAddition, expandSGroupWithMultipleAttachmentPoint, SgContexts, Pile, fromSgroupAction, fromItemsFuse, ReBond, setExpandSGroup, fromBondsAttrs, OperationType, ReStruct, imageReferencePositionToCursor, multitailArrowReferenceLinesToCursor, multitailReferencePositionToCursor, CoordinateTransformation, MultitailArrowRefName, fromMultitailArrowHeadTailMove, fromMultitailArrowHeadTailsResize, fromMultitailArrowMove, fromArrowResizing, fromPaste, fromImageResize, fromSimpleObjectResizing, getItemsToFuse, getHoverToFuse, fromTextDeletion, fromTextUpdating, fromTemplateOnCanvas, fromTemplateOnBondAction, fromTemplateOnAtom, BondAttr, AtomAttr, formatProperties, runAsyncAction, getStructStringFromClipboardData, getStructure, initHotKeys, keyNorm, Fragment as Fragment$1, fromRGroupAttachmentPointUpdate, fromOneBondDeletion, bondChangingAction, fromChain, removeInfoLabelFromAtoms, fromStereoFlagUpdate, fromOneAtomDeletion, fromArrowDeletion, fromPlusDeletion, fromSimpleObjectDeletion, fromRGroupAttachmentPointDeletion, fromImageDeletion, fromMultitailArrowDeletion, notifyItemsToMergeInitializationComplete, RGroup as RGroup$2, fromRGroupFragment, fromUpdateIfThen, fromRGroupAttrs, fromArrowAddition, fromMultitailArrowCreation, fromPlusAddition, getRelSGroupsBySelection, RotateMonomerOperation, fromRotate, fromFlip, fromSimpleObjectAddition, fromTextCreation, fromImageMove, fromImageCreation, fromHighlightCreate, fromHighlightClear, getOptionsWithConvertedUnits, provideEditorSettings, fromNewCanvas, Render, Coordinates, isSingleRGroupAttachmentPoint, genericsList, getAttachmentPointLabelWithBinaryShift, AttachmentPointName, getAttachmentPointLabel, getAttachmentPointNumberFromLabel, getNextFreeAttachmentPoint, AtomLabel, setMonomerTemplatePrefix, getHELMClassByKetMonomerClass, fillNaturalAnalogueForPhosphateAndSugar, KetTemplateType, normalizeMonomerAtomsPositions, monomerFactory, MacromoleculesConverter, fromSgroupAddition, fromDescriptorsAlign, MonomerCreationAttachmentPointClickEvent, atomGetAttr, fromBondFlipping, setExpandMonomerSGroup, fromMultitailArrowTailAdd, MultitailArrow, fromMultitailArrowTailRemove, AmbiguousMonomer, KetMonomerClass, CoreEditor, getAtomCustomQuery, getFormatMimeTypeByFileName, getPropertiesByFormat, StereoFlag, getPropertiesByImgFormat, legacyCopy as legacyCopy$1, b64toBlob, Generics, TextCommand, Ketcher, DefaultStructServiceOptions } from 'ketcher-core';
 export { EditorClassName, KETCHER_MACROMOLECULES_ROOT_NODE_SELECTOR } from 'ketcher-core';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _possibleConstructorReturn$2 from '@babel/runtime/helpers/possibleConstructorReturn';
@@ -3787,7 +3787,7 @@ var zoom = {
 
 var openHelpLink = function openHelpLink() {
   var _window$open;
-  return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v3.8.0-rc.2\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("v3.8.0-rc.4\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
 };
 var help = {
   help: {
@@ -24268,8 +24268,9 @@ var HoverIcon = function () {
   }, {
     key: "isOverLoader",
     value: function isOverLoader(event) {
+      var _target$classList;
       var target = (event === null || event === void 0 ? void 0 : event.relatedTarget) || event.target;
-      return target === null || target === void 0 ? void 0 : target.classList.contains('loading-spinner');
+      return target === null || target === void 0 || (_target$classList = target.classList) === null || _target$classList === void 0 ? void 0 : _target$classList.contains('loading-spinner');
     }
   }, {
     key: "onMouseMove",
@@ -25342,10 +25343,23 @@ var Editor$3 = function () {
         var currentStruct = this.render.ctab.molecule;
         var selectionInvalid = selection.atoms.some(function (atomId) {
           var atom = _this.render.ctab.molecule.atoms.get(atomId);
-          assert_1(atom);
-          return atom.sgs.size > 0 || atom.attachmentPoints !== null || atom.rglabel !== null && atom.neighbors.length > 1 || _this.render.ctab.molecule.rgroups.some(function (rgroup) {
+          if (!atom) {
+            return true;
+          }
+          var sgs = atom.sgs,
+            attachmentPoints = atom.attachmentPoints,
+            rglabel = atom.rglabel,
+            neighbors = atom.neighbors,
+            label = atom.label;
+          var belongsToSGroup = sgs.size > 0;
+          var isAttachmentPoint = attachmentPoints !== null;
+          var isNonTerminalRGroupLabel = rglabel !== null && neighbors.length > 1;
+          var hasMultipleRGroupLabel = rglabel !== null && !isSingleRGroupAttachmentPoint(Number(rglabel));
+          var belongsToRGroup = _this.render.ctab.molecule.rgroups.some(function (rgroup) {
             return rgroup.frags.has(atom.fragment);
-          }) || genericsList.includes(atom.label);
+          });
+          var isExtendedTableAtom = genericsList.includes(label);
+          return belongsToSGroup || isAttachmentPoint || isNonTerminalRGroupLabel || hasMultipleRGroupLabel || belongsToRGroup || isExtendedTableAtom;
         });
         if (selectionInvalid) {
           return false;
@@ -25356,7 +25370,9 @@ var Editor$3 = function () {
         }
         var terminalRGroupAtoms = selection.atoms.filter(function (atomId) {
           var atom = currentStruct.atoms.get(atomId);
-          assert_1(atom);
+          if (!atom) {
+            return false;
+          }
           return atom.rglabel !== null && atom.neighbors.length === 1;
         });
         var selectionAtoms = new Set(selection.atoms);
@@ -25374,11 +25390,24 @@ var Editor$3 = function () {
             potentialLeavingAtoms.push(bond.begin);
           }
         });
+        selectionAtoms.forEach(function (selectionAtomId) {
+          var selectionAtom = currentStruct.atoms.get(selectionAtomId);
+          assert_1(selectionAtom);
+          if (selectionAtom.neighbors.length === 1 && !isNumber(selectionAtom.rglabel)) {
+            potentialLeavingAtoms.push(selectionAtomId);
+          }
+        });
         var totalPotentialLeavingAtoms = terminalRGroupAtoms.length + potentialLeavingAtoms.length;
         if (totalPotentialLeavingAtoms > 8) {
           return false;
         }
-        this.terminalRGroupAtoms = terminalRGroupAtoms;
+        this.terminalRGroupAtoms = terminalRGroupAtoms.map(function (atomId) {
+          var atom = currentStruct.atoms.get(atomId);
+          assert_1(atom);
+          assert_1(atom.rglabel);
+          var attachmentPointLabel = getAttachmentPointLabelWithBinaryShift(Number(atom.rglabel));
+          return [atomId, attachmentPointLabel];
+        });
         this.potentialLeavingAtoms = potentialLeavingAtoms;
         return terminalRGroupAtoms.length > 0 || potentialLeavingAtoms.length > 0;
       }
@@ -25403,21 +25432,54 @@ var Editor$3 = function () {
         _this2.selectedToOriginalAtomsIdMap.set(i, atomId);
       });
       var assignedAttachmentPoints = new Map();
-      this.terminalRGroupAtoms.forEach(function (atomId, i) {
+      var sideTerminalSGroupAtoms = this.terminalRGroupAtoms.filter(function (_ref) {
+        var _ref2 = _slicedToArray$1(_ref, 2),
+          attachmentPointLabel = _ref2[1];
+        return attachmentPointLabel !== AttachmentPointName.R1 && attachmentPointLabel !== AttachmentPointName.R2;
+      });
+      var sideAttachmentPointsNames = [];
+      for (var i = 0; i < sideTerminalSGroupAtoms.length; i++) {
+        var attachmentPointNumber = i + 3;
+        if (attachmentPointNumber > 8) {
+          break;
+        }
+        sideAttachmentPointsNames = sideAttachmentPointsNames.concat(getAttachmentPointLabel(attachmentPointNumber));
+      }
+      var terminalRGroupAtomsSortedByLabel = _toConsumableArray(this.terminalRGroupAtoms).sort(function (_ref3, _ref4) {
+        var _ref5 = _slicedToArray$1(_ref3, 2),
+          labelA = _ref5[1];
+        var _ref6 = _slicedToArray$1(_ref4, 2),
+          labelB = _ref6[1];
+        var labelANumber = getAttachmentPointNumberFromLabel(labelA);
+        var labelBNumber = getAttachmentPointNumberFromLabel(labelB);
+        return labelANumber - labelBNumber;
+      });
+      terminalRGroupAtomsSortedByLabel.forEach(function (_ref7) {
         var _selectedStruct$halfB;
+        var _ref8 = _slicedToArray$1(_ref7, 2),
+          atomId = _ref8[0],
+          attachmentPointLabel = _ref8[1];
         var selectedStructLeavingAtomId = originalToSelectedAtomsIdMap.get(atomId);
         assert_1(selectedStructLeavingAtomId !== undefined);
         var selectedStructLeavingAtom = selectedStruct.atoms.get(selectedStructLeavingAtomId);
         assert_1(selectedStructLeavingAtom);
+        assert_1(selectedStructLeavingAtom.rglabel);
+        var attachmentPointName;
+        if (attachmentPointLabel === AttachmentPointName.R1 || attachmentPointLabel === AttachmentPointName.R2 || sideAttachmentPointsNames.includes(attachmentPointLabel)) {
+          attachmentPointName = attachmentPointLabel;
+        } else {
+          var assignedAttachmentPointNames = Array.from(assignedAttachmentPoints.keys());
+          attachmentPointName = getNextFreeAttachmentPoint(assignedAttachmentPointNames, assignedAttachmentPointNames.length < sideAttachmentPointsNames.length);
+        }
         selectedStructLeavingAtom.rglabel = null;
-        selectedStructLeavingAtom.label = 'H';
+        selectedStructLeavingAtom.label = AtomLabel.H;
         var neighborHalfBondId = selectedStructLeavingAtom.neighbors[0];
         var selectedStructAttachmentAtomId = (_selectedStruct$halfB = selectedStruct.halfBonds.get(neighborHalfBondId)) === null || _selectedStruct$halfB === void 0 ? void 0 : _selectedStruct$halfB.end;
-        var attachmentPointName = getAttachmentPointLabel(i + 1);
         assert_1(selectedStructAttachmentAtomId !== undefined);
         assignedAttachmentPoints.set(attachmentPointName, [selectedStructAttachmentAtomId, selectedStructLeavingAtomId]);
       });
-      this.potentialLeavingAtoms.forEach(function (atomId, i) {
+      var selectedPotentialLeavingAtoms = new Map();
+      this.potentialLeavingAtoms.forEach(function (atomId) {
         var _selectedStruct$atoms, _selectedStruct$atoms2;
         var leavingAtom = currentStruct.atoms.get(atomId);
         assert_1(leavingAtom);
@@ -25433,7 +25495,20 @@ var Editor$3 = function () {
         if (attachmentAtomId === -1) {
           return;
         }
-        var selectedStructLeavingAtom = leavingAtom.clone();
+        var originalLeavingAtomId = originalToSelectedAtomsIdMap.get(atomId);
+        var isLeavingAtomSelected = isNumber(originalLeavingAtomId);
+        if (isLeavingAtomSelected) {
+          var originalAttachmentAtomId = originalToSelectedAtomsIdMap.get(attachmentAtomId);
+          if (!isNumber(originalAttachmentAtomId)) {
+            return;
+          }
+          selectedPotentialLeavingAtoms.set(originalAttachmentAtomId, originalLeavingAtomId);
+          return;
+        }
+        var selectedStructLeavingAtom = new Atom$2({
+          label: AtomLabel.H,
+          pp: leavingAtom.pp
+        });
         selectedStructLeavingAtom.fragment = (_selectedStruct$atoms = (_selectedStruct$atoms2 = selectedStruct.atoms.get(0)) === null || _selectedStruct$atoms2 === void 0 ? void 0 : _selectedStruct$atoms2.fragment) !== null && _selectedStruct$atoms !== void 0 ? _selectedStruct$atoms : 0;
         var selectedStructLeavingAtomId = selectedStruct.atoms.add(selectedStructLeavingAtom);
         _this2.selectedToOriginalAtomsIdMap.set(selectedStructLeavingAtomId, atomId);
@@ -25446,12 +25521,14 @@ var Editor$3 = function () {
           end: selectedStructLeavingAtomId
         });
         selectedStruct.bonds.add(newBond);
-        var attachmentPointName = getAttachmentPointLabel(_this2.terminalRGroupAtoms.length + i + 1);
+        var assignedAttachmentPointNames = Array.from(assignedAttachmentPoints.keys());
+        var attachmentPointName = getNextFreeAttachmentPoint(assignedAttachmentPointNames, assignedAttachmentPointNames.length < sideAttachmentPointsNames.length);
         assignedAttachmentPoints.set(attachmentPointName, [selectedStructAttachmentAtomId, selectedStructLeavingAtomId]);
       });
       this.monomerCreationState = {
         assignedAttachmentPoints: assignedAttachmentPoints,
-        potentialAttachmentPoints: new Map()
+        potentialAttachmentPoints: selectedPotentialLeavingAtoms,
+        problematicAttachmentPoints: new Set()
       };
       this.originalStruct = currentStruct;
       this.struct(selectedStruct);
@@ -25504,6 +25581,19 @@ var Editor$3 = function () {
       this.struct(this.originalStruct, false);
       this.tool('select');
     }
+  }, {
+    key: "cleanupAttachmentPoint",
+    value: function cleanupAttachmentPoint(leavingAtomId) {
+      var leavingAtom = this.struct().atoms.get(leavingAtomId);
+      assert_1(leavingAtom);
+      var originalLeavingAtomId = this.selectedToOriginalAtomsIdMap.get(leavingAtomId);
+      assert_1(isNumber(originalLeavingAtomId));
+      var originalLeavingAtom = this.originalStruct.atoms.get(originalLeavingAtomId);
+      assert_1(originalLeavingAtom);
+      originalLeavingAtom.rglabel = null;
+      originalLeavingAtom.label = leavingAtom.label;
+      this.originalStruct.calcImplicitHydrogen(originalLeavingAtomId);
+    }
   }, {
     key: "saveNewMonomer",
     value: function saveNewMonomer(data) {
@@ -25519,10 +25609,10 @@ var Editor$3 = function () {
         type = data.type,
         naturalAnalogue = data.naturalAnalogue;
       var attachmentPoints = [];
-      this.monomerCreationState.assignedAttachmentPoints.forEach(function (_ref, attachmentPointName) {
-        var _ref2 = _slicedToArray$1(_ref, 2),
-          attachmentAtomId = _ref2[0],
-          leavingAtomId = _ref2[1];
+      this.monomerCreationState.assignedAttachmentPoints.forEach(function (_ref9, attachmentPointName) {
+        var _ref10 = _slicedToArray$1(_ref9, 2),
+          attachmentAtomId = _ref10[0],
+          leavingAtomId = _ref10[1];
         var attachmentPoint = {
           attachmentAtom: attachmentAtomId,
           leavingGroup: {
@@ -25561,19 +25651,13 @@ var Editor$3 = function () {
         Monomer = _monomerFactory2[0];
       var monomerPosition = new Vec2((this.selectionBBox.min.x + this.selectionBBox.max.x) / 2, (this.selectionBBox.min.y + this.selectionBBox.max.y) / 2);
       var monomer = new Monomer(monomerItem, monomerPosition);
-      var finalAttachmentPoints = this.monomerCreationState.assignedAttachmentPoints;
-      finalAttachmentPoints.forEach(function (atomPair) {
-        var _atomPair2 = _slicedToArray$1(atomPair, 2),
-          leavingAtomId = _atomPair2[1];
-        var leavingAtom = _this3.struct().atoms.get(leavingAtomId);
-        assert_1(leavingAtom);
-        var originalLeavingAtomId = _this3.selectedToOriginalAtomsIdMap.get(leavingAtomId);
-        assert_1(originalLeavingAtomId);
-        var originalLeavingAtom = _this3.originalStruct.atoms.get(originalLeavingAtomId);
-        assert_1(originalLeavingAtom);
-        originalLeavingAtom.rglabel = null;
-        originalLeavingAtom.label = leavingAtom.label;
-        _this3.originalStruct.calcImplicitHydrogen(originalLeavingAtomId);
+      this.monomerCreationState.assignedAttachmentPoints.forEach(function (_ref11) {
+        var _ref12 = _slicedToArray$1(_ref11, 2),
+          leavingAtomId = _ref12[1];
+        return _this3.cleanupAttachmentPoint(leavingAtomId);
+      });
+      this.monomerCreationState.potentialAttachmentPoints.forEach(function (leavingAtomId) {
+        return _this3.cleanupAttachmentPoint(leavingAtomId);
       });
       this.closeMonomerCreationWizard();
       (_this$originalSelecti = this.originalSelection.atoms) === null || _this$originalSelecti === void 0 || _this$originalSelecti.forEach(function (atomId) {
@@ -25583,9 +25667,19 @@ var Editor$3 = function () {
         }
       });
       var sGroupAttachmentPoints = MacromoleculesConverter.convertMonomerAttachmentPointsToSGroupAttachmentPoints(monomer, this.selectedToOriginalAtomsIdMap);
+      sGroupAttachmentPoints.forEach(function (ap) {
+        _this3.render.ctab.molecule.bonds.forEach(function (bond) {
+          var _this3$originalSelect, _this3$originalSelect2;
+          if ((bond.begin === ap.atomId || bond.end === ap.atomId) && (!((_this3$originalSelect = _this3.originalSelection.atoms) !== null && _this3$originalSelect !== void 0 && _this3$originalSelect.includes(bond.begin)) || !((_this3$originalSelect2 = _this3.originalSelection.atoms) !== null && _this3$originalSelect2 !== void 0 && _this3$originalSelect2.includes(bond.end)))) {
+            bond.beginSuperatomAttachmentPointNumber = ap.attachmentPointNumber;
+          }
+        });
+      });
       var action = fromSgroupAddition(this.render.ctab, SGroup$1.TYPES.SUP, this.originalSelection.atoms, {
         expanded: true
       }, this.render.ctab.molecule.sgroups.newId(), sGroupAttachmentPoints, monomer.position, true, monomer.monomerItem.props.MonomerName, null, monomer);
+      this.render.ctab.molecule.clearFragments();
+      this.render.ctab.molecule.markFragments();
       this.update(action);
       var templateRoot = monomerTemplate.root,
         templateData = _objectWithoutProperties(monomerTemplate, _excluded$p);
@@ -25610,6 +25704,7 @@ var Editor$3 = function () {
     key: "reassignAttachmentPoint",
     value: function reassignAttachmentPoint(currentName, newName) {
       assert_1(this.monomerCreationState);
+      this.monomerCreationState.problematicAttachmentPoints["delete"](currentName);
       var atomPair = this.monomerCreationState.assignedAttachmentPoints.get(currentName);
       assert_1(atomPair);
       if (this.monomerCreationState.assignedAttachmentPoints.has(newName)) {
@@ -25634,6 +25729,21 @@ var Editor$3 = function () {
       this.monomerCreationState = Object.assign({}, this.monomerCreationState);
       this.render.update(true);
     }
+  }, {
+    key: "cleanupCloseAttachmentPointEditPopup",
+    value: function cleanupCloseAttachmentPointEditPopup() {
+      assert_1(this.monomerCreationState);
+      this.monomerCreationState.clickedAttachmentPoint = null;
+      this.render.update(true);
+    }
+  }, {
+    key: "setProblematicAttachmentPoints",
+    value: function setProblematicAttachmentPoints(problematicPoints) {
+      assert_1(this.monomerCreationState);
+      this.monomerCreationState.problematicAttachmentPoints = problematicPoints;
+      this.monomerCreationState = Object.assign({}, this.monomerCreationState);
+      this.render.update(true);
+    }
   }, {
     key: "selection",
     value: function selection(ci) {
@@ -26053,10 +26163,10 @@ function domEventSetup(editor, clientArea) {
     eventName: 'mouseover',
     toolEventHandler: 'mouseover'
   }];
-  trackedDomEvents.forEach(function (_ref3) {
-    var target = _ref3.target,
-      eventName = _ref3.eventName,
-      toolEventHandler = _ref3.toolEventHandler;
+  trackedDomEvents.forEach(function (_ref13) {
+    var target = _ref13.target,
+      eventName = _ref13.eventName,
+      toolEventHandler = _ref13.toolEventHandler;
     editor.event[eventName] = new DOMSubscription();
     var subs = editor.event[eventName];
     target.addEventListener(eventName, function () {
@@ -26430,7 +26540,7 @@ var useMakeLeavingGroupAtomMenuItem = function useMakeLeavingGroupAtomMenuItem(_
   var attachmentPointName = Array.from(assignedAttachmentPoints.keys()).find(function (key) {
     var atomsPair = assignedAttachmentPoints.get(key);
     assert_1(atomsPair);
-    return atomsPair.includes(selectedAtomId);
+    return atomsPair[1] === selectedAtomId;
   });
   var isAtomAssignedAttachmentPoint = Boolean(attachmentPointName);
   if (!isAtomPotentialAttachmentPoint && !isAtomAssignedAttachmentPoint) {
@@ -28591,6 +28701,9 @@ var attachmentPointAtomOptions = [{
 }, {
   value: AtomLabel.F,
   label: 'F'
+}, {
+  value: AtomLabel.C,
+  label: 'CH3'
 }];
 var AttachmentPointEditPopup = function AttachmentPointEditPopup(_ref) {
   var data = _ref.data,
@@ -28682,7 +28795,8 @@ var styles$f = {"attachmentPoint":"AttachmentPoint-module_attachmentPoint__6KD5K
 
 var AttachmentPoint = function AttachmentPoint(_ref) {
   var name = _ref.name,
-    atomLabel = _ref.atomLabel;
+    atomLabel = _ref.atomLabel,
+    implicitH = _ref.implicitH;
   return jsx("div", {
     className: styles$f.attachmentPoint,
     children: jsxs("p", {
@@ -28690,7 +28804,13 @@ var AttachmentPoint = function AttachmentPoint(_ref) {
       children: [jsx("span", {
         className: styles$f.attachmentPointIndex,
         children: name
-      }), "\xA0(", atomLabel, ")"]
+      }), "\xA0", jsxs("span", {
+        children: ["(", implicitH > 1 && jsxs(Fragment, {
+          children: ["H", jsx("sub", {
+            children: implicitH
+          })]
+        }), atomLabel, ")"]
+      })]
     })
   });
 };
@@ -28817,31 +28937,50 @@ var validateInputs = function validateInputs(values) {
 };
 var validateAttachmentPoints = function validateAttachmentPoints(attachmentPoints) {
   var notifications = new Map();
+  var problematicAttachmentPoints = new Set();
   if (attachmentPoints.length === 0) {
     notifications.set('noAttachmentPoints', {
       type: 'error',
       message: NotificationMessages.noAttachmentPoints
     });
-    return notifications;
+    return {
+      notifications: notifications,
+      problematicAttachmentPoints: problematicAttachmentPoints
+    };
   }
-  var attachmentPointNumbers = attachmentPoints.map(getAttachmentPointNumberFromLabel);
-  attachmentPointNumbers.sort(function (a, b) {
-    return a - b;
+  var sideAttachmentPoints = attachmentPoints.filter(function (attachmentPointName) {
+    var pointNumber = getAttachmentPointNumberFromLabel(attachmentPointName);
+    return pointNumber > 2;
   });
-  var startingIndex = 0;
-  while (attachmentPointNumbers[startingIndex] <= 2) {
-    startingIndex++;
+  if (sideAttachmentPoints.length === 0) {
+    return {
+      notifications: notifications,
+      problematicAttachmentPoints: problematicAttachmentPoints
+    };
   }
-  for (var i = startingIndex; i < attachmentPointNumbers.length; i++) {
-    if (attachmentPointNumbers[i] - attachmentPointNumbers[i - 1] > 1) {
-      notifications.set('incorrectAttachmentPointsOrder', {
-        type: 'error',
-        message: NotificationMessages.incorrectAttachmentPointsOrder
-      });
-      break;
+  var expectedSequence = [];
+  for (var i = 3; i < 3 + sideAttachmentPoints.length; i++) {
+    expectedSequence.push(i);
+  }
+  var actualNumbers = sideAttachmentPoints.map(getAttachmentPointNumberFromLabel).sort(function (a, b) {
+    return a - b;
+  });
+  actualNumbers.forEach(function (actualNumber) {
+    if (!expectedSequence.includes(actualNumber)) {
+      var problematicPointName = getAttachmentPointLabel(actualNumber);
+      problematicAttachmentPoints.add(problematicPointName);
     }
+  });
+  if (problematicAttachmentPoints.size > 0) {
+    notifications.set('incorrectAttachmentPointsOrder', {
+      type: 'error',
+      message: NotificationMessages.incorrectAttachmentPointsOrder
+    });
   }
-  return notifications;
+  return {
+    notifications: notifications,
+    problematicAttachmentPoints: problematicAttachmentPoints
+  };
 };
 var MonomerCreationWizard = function MonomerCreationWizard() {
   var _useAppContext = useAppContext(),
@@ -28938,6 +29077,7 @@ var MonomerCreationWizard = function MonomerCreationWizard() {
   };
   var handleAttachmentPointEditPopupClose = function handleAttachmentPointEditPopupClose() {
     setAttachmentPointEditPopupData(null);
+    editor.cleanupCloseAttachmentPointEditPopup();
   };
   var handleDiscard = function handleDiscard() {
     editor.closeMonomerCreationWizard();
@@ -28947,6 +29087,7 @@ var MonomerCreationWizard = function MonomerCreationWizard() {
     wizardStateDispatch({
       type: 'ResetErrors'
     });
+    editor.setProblematicAttachmentPoints(new Set());
     var _validateInputs = validateInputs(values),
       inputsErrors = _validateInputs.errors,
       inputsNotifications = _validateInputs.notifications;
@@ -28962,12 +29103,15 @@ var MonomerCreationWizard = function MonomerCreationWizard() {
       return;
     }
     assert_1(editor.monomerCreationState);
-    var attachmentPointsNotifications = validateAttachmentPoints(Array.from(editor.monomerCreationState.assignedAttachmentPoints.keys()));
+    var _validateAttachmentPo = validateAttachmentPoints(Array.from(editor.monomerCreationState.assignedAttachmentPoints.keys())),
+      attachmentPointsNotifications = _validateAttachmentPo.notifications,
+      problematicAttachmentPoints = _validateAttachmentPo.problematicAttachmentPoints;
     if (attachmentPointsNotifications.size > 0) {
       wizardStateDispatch({
         type: 'SetNotifications',
         notifications: attachmentPointsNotifications
       });
+      editor.setProblematicAttachmentPoints(problematicAttachmentPoints);
       return;
     }
     editor.saveNewMonomer({
@@ -28992,12 +29136,14 @@ var MonomerCreationWizard = function MonomerCreationWizard() {
     if (!atom) {
       return {
         name: attachmentPointName,
-        atomLabel: 'H'
+        atomLabel: 'H',
+        implicitH: 0
       };
     }
     return {
       name: attachmentPointName,
-      atomLabel: atom.label
+      atomLabel: atom.label,
+      implicitH: atom.implicitH
     };
   });
   var ketcherEditorRootElement = document.querySelector(KETCHER_ROOT_NODE_CSS_SELECTOR);
@@ -29097,10 +29243,12 @@ var MonomerCreationWizard = function MonomerCreationWizard() {
               className: styles$l.attachmentPoints,
               children: attachmentPointsData.map(function (_ref5) {
                 var name = _ref5.name,
-                  atomLabel = _ref5.atomLabel;
+                  atomLabel = _ref5.atomLabel,
+                  implicitH = _ref5.implicitH;
                 return jsx(AttachmentPoint, {
                   name: name,
-                  atomLabel: atomLabel
+                  atomLabel: atomLabel,
+                  implicitH: implicitH
                 }, name);
               })
             })]
@@ -37111,8 +37259,8 @@ var KetcherBuilder = function () {
                 cleanup = initApp(prevKetcherId, ketcherId, element, appRoot, staticResourcesUrl, {
                   buttons: buttons || {},
                   errorHandler: errorHandler || null,
-                  version: "3.8.0-rc.2" ,
-                  buildDate: "2025-09-05T18:59:48" ,
+                  version: "3.8.0-rc.4" ,
+                  buildDate: "2025-09-17T17:13:08" ,
                   buildNumber: '',
                   customButtons: customButtons || []
                 }, structService, resolve, togglerComponent);
@@ -37407,7 +37555,7 @@ var ModeControl = function ModeControl(_ref3) {
 function ownKeys(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(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty$1(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var MacromoleculesEditorComponent = lazy(function () {
-  return import('./index.modern-7694d091.js');
+  return import('./index.modern-eb9aa0eb.js');
 });
 var Editor = function Editor(props) {
   var _useState = useState(false),