ketcher-react 2.5.2 → 2.6.0-rc.1
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/constants.d.ts +16 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/useSubscribtionOnEvents.d.ts +16 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +89 -28
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +91 -31
- package/dist/index.modern.js.map +1 -1
- package/dist/script/editor/Editor.d.ts +2 -0
- package/dist/script/editor/tool/bond.d.ts +3 -1
- package/package.json +2 -2
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/****************************************************************************
|
|
2
|
+
* Copyright 2021 EPAM Systems
|
|
3
|
+
*
|
|
4
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
+
* you may not use this file except in compliance with the License.
|
|
6
|
+
* You may obtain a copy of the License at
|
|
7
|
+
*
|
|
8
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
+
*
|
|
10
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
+
* See the License for the specific language governing permissions and
|
|
14
|
+
* limitations under the License.
|
|
15
|
+
***************************************************************************/
|
|
16
|
+
export declare const KETCHER_INIT_EVENT_NAME = "ketcher-init";
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/****************************************************************************
|
|
2
|
+
* Copyright 2021 EPAM Systems
|
|
3
|
+
*
|
|
4
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
5
|
+
* you may not use this file except in compliance with the License.
|
|
6
|
+
* You may obtain a copy of the License at
|
|
7
|
+
*
|
|
8
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
+
*
|
|
10
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
11
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
12
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
13
|
+
* See the License for the specific language governing permissions and
|
|
14
|
+
* limitations under the License.
|
|
15
|
+
***************************************************************************/
|
|
16
|
+
export declare const useSubscriptionOnEvents: () => void;
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -2899,7 +2899,7 @@ var zoom = {
|
|
|
2899
2899
|
|
|
2900
2900
|
var openHelpLink = function openHelpLink() {
|
|
2901
2901
|
var _window$open;
|
|
2902
|
-
return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.
|
|
2902
|
+
return (_window$open = window.open("https://github.com/epam/ketcher/blob/".concat("v2.6.0-rc.1\n", "/documentation/help.md#ketcher-overview"))) === null || _window$open === void 0 ? void 0 : _window$open.focus();
|
|
2903
2903
|
};
|
|
2904
2904
|
var help = {
|
|
2905
2905
|
help: {
|
|
@@ -8085,6 +8085,45 @@ var useInterval = function useInterval(callback, delay) {
|
|
|
8085
8085
|
}, [delay]);
|
|
8086
8086
|
};
|
|
8087
8087
|
|
|
8088
|
+
var KETCHER_INIT_EVENT_NAME = 'ketcher-init';
|
|
8089
|
+
|
|
8090
|
+
var useSubscriptionOnEvents = function useSubscriptionOnEvents() {
|
|
8091
|
+
var dispatch = reactRedux.useDispatch();
|
|
8092
|
+
var _useAppContext = useAppContext(),
|
|
8093
|
+
getKetcherInstance = _useAppContext.getKetcherInstance;
|
|
8094
|
+
var loadingHandler = function loadingHandler() {
|
|
8095
|
+
dispatch(indigoVerification(true));
|
|
8096
|
+
};
|
|
8097
|
+
var actionResultHandler = function actionResultHandler() {
|
|
8098
|
+
dispatch(indigoVerification(false));
|
|
8099
|
+
};
|
|
8100
|
+
var subscribe = function subscribe(ketcher) {
|
|
8101
|
+
ketcher.eventBus.addListener(ketcherCore.KetcherAsyncEvents.LOADING, loadingHandler);
|
|
8102
|
+
ketcher.eventBus.addListener(ketcherCore.KetcherAsyncEvents.SUCCESS, actionResultHandler);
|
|
8103
|
+
ketcher.eventBus.addListener(ketcherCore.KetcherAsyncEvents.FAILURE, actionResultHandler);
|
|
8104
|
+
};
|
|
8105
|
+
var unsubscribe = function unsubscribe(ketcher) {
|
|
8106
|
+
ketcher.eventBus.removeListener(ketcherCore.KetcherAsyncEvents.LOADING, loadingHandler);
|
|
8107
|
+
ketcher.eventBus.removeListener(ketcherCore.KetcherAsyncEvents.SUCCESS, actionResultHandler);
|
|
8108
|
+
ketcher.eventBus.removeListener(ketcherCore.KetcherAsyncEvents.FAILURE, actionResultHandler);
|
|
8109
|
+
};
|
|
8110
|
+
React.useEffect(function () {
|
|
8111
|
+
var subscribeOnInit = function subscribeOnInit() {
|
|
8112
|
+
subscribe(getKetcherInstance());
|
|
8113
|
+
};
|
|
8114
|
+
var unsubscribeOnUnMount = function unsubscribeOnUnMount() {
|
|
8115
|
+
unsubscribe(getKetcherInstance());
|
|
8116
|
+
};
|
|
8117
|
+
window.addEventListener(KETCHER_INIT_EVENT_NAME, function () {
|
|
8118
|
+
subscribeOnInit();
|
|
8119
|
+
});
|
|
8120
|
+
return function () {
|
|
8121
|
+
unsubscribeOnUnMount();
|
|
8122
|
+
window.removeEventListener(KETCHER_INIT_EVENT_NAME, subscribeOnInit);
|
|
8123
|
+
};
|
|
8124
|
+
}, []);
|
|
8125
|
+
};
|
|
8126
|
+
|
|
8088
8127
|
var ArrowScroll = function ArrowScroll(_ref) {
|
|
8089
8128
|
var startInView = _ref.startInView,
|
|
8090
8129
|
endInView = _ref.endInView,
|
|
@@ -10560,10 +10599,10 @@ var APointTool = function () {
|
|
|
10560
10599
|
key: "mousemove",
|
|
10561
10600
|
value: function mousemove(event) {
|
|
10562
10601
|
var struct = this.editor.render.ctab.molecule;
|
|
10563
|
-
var
|
|
10564
|
-
if (
|
|
10565
|
-
var atom = struct.atoms.get(
|
|
10566
|
-
if ((atom === null || atom === void 0 ? void 0 : atom.label) !== 'R#' && (atom === null || atom === void 0 ? void 0 : atom.rglabel) === null) this.editor.hover(
|
|
10602
|
+
var closestItem = this.editor.findItem(event, ['atoms']);
|
|
10603
|
+
if (closestItem) {
|
|
10604
|
+
var atom = struct.atoms.get(closestItem.id);
|
|
10605
|
+
if ((atom === null || atom === void 0 ? void 0 : atom.label) !== 'R#' && (atom === null || atom === void 0 ? void 0 : atom.rglabel) === null) this.editor.hover(closestItem);
|
|
10567
10606
|
} else {
|
|
10568
10607
|
this.editor.hover(null);
|
|
10569
10608
|
}
|
|
@@ -14500,12 +14539,12 @@ var TextTool = function () {
|
|
|
14500
14539
|
key: "mousedown",
|
|
14501
14540
|
value: function mousedown(event) {
|
|
14502
14541
|
var render = this.editor.render;
|
|
14503
|
-
var
|
|
14542
|
+
var closestItem = this.editor.findItem(event, ['texts']);
|
|
14504
14543
|
this.editor.selection(null);
|
|
14505
|
-
if (
|
|
14544
|
+
if (closestItem && closestItem.map === 'texts') {
|
|
14506
14545
|
this.editor.hover(null);
|
|
14507
14546
|
this.editor.selection({
|
|
14508
|
-
texts: [
|
|
14547
|
+
texts: [closestItem.id]
|
|
14509
14548
|
});
|
|
14510
14549
|
this.dragCtx = {
|
|
14511
14550
|
xy0: render.page2obj(event),
|
|
@@ -14540,27 +14579,27 @@ var TextTool = function () {
|
|
|
14540
14579
|
key: "click",
|
|
14541
14580
|
value: function click(event) {
|
|
14542
14581
|
var render = this.editor.render;
|
|
14543
|
-
var
|
|
14582
|
+
var closestItem = this.editor.findItem(event, ['texts']);
|
|
14544
14583
|
this.editor.hover(null);
|
|
14545
|
-
if (!
|
|
14546
|
-
propsDialog(this.editor, null, render.page2obj(event));
|
|
14584
|
+
if (!closestItem) {
|
|
14585
|
+
propsDialog(this.editor, null, render.page2obj(event), []);
|
|
14547
14586
|
}
|
|
14548
14587
|
return true;
|
|
14549
14588
|
}
|
|
14550
14589
|
}, {
|
|
14551
14590
|
key: "dblclick",
|
|
14552
14591
|
value: function dblclick(event) {
|
|
14553
|
-
var
|
|
14592
|
+
var closestItem = this.editor.findItem(event, ['texts']);
|
|
14554
14593
|
this.editor.hover(null);
|
|
14555
|
-
if (
|
|
14556
|
-
propsDialog(this.editor,
|
|
14594
|
+
if (closestItem.map === 'texts') {
|
|
14595
|
+
propsDialog(this.editor, closestItem.id, closestItem.position, closestItem.pos);
|
|
14557
14596
|
}
|
|
14558
14597
|
return true;
|
|
14559
14598
|
}
|
|
14560
14599
|
}]);
|
|
14561
14600
|
return TextTool;
|
|
14562
14601
|
}();
|
|
14563
|
-
function propsDialog(editor, id, position) {
|
|
14602
|
+
function propsDialog(editor, id, position, pos) {
|
|
14564
14603
|
var struct = editor.render.ctab.molecule;
|
|
14565
14604
|
var text = id || id === 0 ? struct.texts.get(id) : null;
|
|
14566
14605
|
var origilContent = text ? text.content : '';
|
|
@@ -14568,12 +14607,13 @@ function propsDialog(editor, id, position) {
|
|
|
14568
14607
|
content: origilContent,
|
|
14569
14608
|
id: id,
|
|
14570
14609
|
position: position,
|
|
14610
|
+
pos: pos,
|
|
14571
14611
|
type: 'text'
|
|
14572
14612
|
});
|
|
14573
14613
|
res.then(function (_ref) {
|
|
14574
14614
|
var content = _ref.content;
|
|
14575
14615
|
if (!id && id !== 0 && content) {
|
|
14576
|
-
editor.update(ketcherCore.fromTextCreation(editor.render.ctab, content, position));
|
|
14616
|
+
editor.update(ketcherCore.fromTextCreation(editor.render.ctab, content, position, pos));
|
|
14577
14617
|
} else if (!content) {
|
|
14578
14618
|
editor.update(ketcherCore.fromTextDeletion(editor.render.ctab, id));
|
|
14579
14619
|
} else if (content !== origilContent) {
|
|
@@ -14735,6 +14775,7 @@ var Editor$3 = function () {
|
|
|
14735
14775
|
this.historyPtr = 0;
|
|
14736
14776
|
this.errorHandler = null;
|
|
14737
14777
|
this.highlights = new Highlighter(this);
|
|
14778
|
+
this.renderAndRecoordinateStruct = this.renderAndRecoordinateStruct.bind(this);
|
|
14738
14779
|
this.event = {
|
|
14739
14780
|
message: new subscription.Subscription(),
|
|
14740
14781
|
elementEdit: new subscription.PipelineSubscription(),
|
|
@@ -14792,6 +14833,15 @@ var Editor$3 = function () {
|
|
|
14792
14833
|
value: function clear() {
|
|
14793
14834
|
this.struct(undefined);
|
|
14794
14835
|
}
|
|
14836
|
+
}, {
|
|
14837
|
+
key: "renderAndRecoordinateStruct",
|
|
14838
|
+
value: function renderAndRecoordinateStruct(struct) {
|
|
14839
|
+
var action = ketcherCore.fromNewCanvas(this.render.ctab, struct);
|
|
14840
|
+
this.update(action);
|
|
14841
|
+
getStructCenter(this.render.ctab);
|
|
14842
|
+
recoordinate(this);
|
|
14843
|
+
return this.render.ctab.molecule;
|
|
14844
|
+
}
|
|
14795
14845
|
}, {
|
|
14796
14846
|
key: "struct",
|
|
14797
14847
|
value: function struct(value) {
|
|
@@ -14800,11 +14850,13 @@ var Editor$3 = function () {
|
|
|
14800
14850
|
}
|
|
14801
14851
|
this.selection(null);
|
|
14802
14852
|
var struct = value || new ketcherCore.Struct();
|
|
14803
|
-
|
|
14804
|
-
|
|
14805
|
-
|
|
14806
|
-
|
|
14807
|
-
|
|
14853
|
+
return this.renderAndRecoordinateStruct(struct);
|
|
14854
|
+
}
|
|
14855
|
+
}, {
|
|
14856
|
+
key: "structToAddFragment",
|
|
14857
|
+
value: function structToAddFragment(value) {
|
|
14858
|
+
var superStruct = value.mergeInto(this.render.ctab.molecule);
|
|
14859
|
+
return this.renderAndRecoordinateStruct(superStruct);
|
|
14808
14860
|
}
|
|
14809
14861
|
}, {
|
|
14810
14862
|
key: "options",
|
|
@@ -15319,8 +15371,12 @@ function setupEditor(editor, props) {
|
|
|
15319
15371
|
Object.keys(editor.event).forEach(function (name) {
|
|
15320
15372
|
var eventName = "on".concat(fp.upperFirst(name));
|
|
15321
15373
|
if (props[eventName] !== oldProps[eventName]) {
|
|
15322
|
-
if (oldProps[eventName])
|
|
15323
|
-
|
|
15374
|
+
if (oldProps[eventName]) {
|
|
15375
|
+
editor.event[name].remove(oldProps[eventName]);
|
|
15376
|
+
}
|
|
15377
|
+
if (props[eventName]) {
|
|
15378
|
+
editor.event[name].add(props[eventName]);
|
|
15379
|
+
}
|
|
15324
15380
|
}
|
|
15325
15381
|
});
|
|
15326
15382
|
}
|
|
@@ -19048,7 +19104,8 @@ var SaveDialog = function (_Component) {
|
|
|
19048
19104
|
}) : _this.isImageFormat(format) ? jsxRuntime.jsx("div", {
|
|
19049
19105
|
className: classes$j.imageContainer,
|
|
19050
19106
|
children: !isCleanStruct && jsxRuntime.jsx("img", {
|
|
19051
|
-
src: "data:image/".concat(format, "+xml;base64,").concat(imageSrc)
|
|
19107
|
+
src: "data:image/".concat(format, "+xml;base64,").concat(imageSrc),
|
|
19108
|
+
alt: "".concat(format, " preview")
|
|
19052
19109
|
})
|
|
19053
19110
|
}) : jsxRuntime.jsx("div", {
|
|
19054
19111
|
className: classes$j.previewBackground,
|
|
@@ -19143,7 +19200,7 @@ var SaveDialog = function (_Component) {
|
|
|
19143
19200
|
_this.isRxn = _this.props.struct.hasRxnArrow();
|
|
19144
19201
|
_this.textAreaRef = React.createRef();
|
|
19145
19202
|
var formats = [_this.isRxn ? 'rxn' : 'mol', 'smiles', 'ket'];
|
|
19146
|
-
if (_this.props.server) formats.push(_this.isRxn ? 'rxnV3000' : 'molV3000', 'smilesExt', 'smarts', 'inChI', 'inChIAuxInfo', 'cml', 'svg', 'png');
|
|
19203
|
+
if (_this.props.server) formats.push(_this.isRxn ? 'rxnV3000' : 'molV3000', 'smilesExt', 'smarts', 'inChI', 'inChIAuxInfo', 'cml', 'svg', 'png', 'cdxml');
|
|
19147
19204
|
_this.saveSchema = saveSchema;
|
|
19148
19205
|
_this.saveSchema.properties.format = Object.assign(_this.saveSchema.properties.format, {
|
|
19149
19206
|
"enum": formats,
|
|
@@ -21202,7 +21259,7 @@ var Text = function Text(props) {
|
|
|
21202
21259
|
};
|
|
21203
21260
|
};
|
|
21204
21261
|
var keyBindingFn = function keyBindingFn(e) {
|
|
21205
|
-
if (e.
|
|
21262
|
+
if (e.key === 'Enter') {
|
|
21206
21263
|
e.stopPropagation();
|
|
21207
21264
|
}
|
|
21208
21265
|
return draftJs.getDefaultKeyBinding(e);
|
|
@@ -21620,6 +21677,7 @@ var App = function App(props) {
|
|
|
21620
21677
|
var checkServer = props.checkServer;
|
|
21621
21678
|
var _useSettingsContext = useSettingsContext(),
|
|
21622
21679
|
staticResourcesUrl = _useSettingsContext.staticResourcesUrl;
|
|
21680
|
+
useSubscriptionOnEvents();
|
|
21623
21681
|
React.useEffect(function () {
|
|
21624
21682
|
checkServer();
|
|
21625
21683
|
dispatch(initFGTemplates(staticResourcesUrl));
|
|
@@ -21730,8 +21788,8 @@ var KetcherBuilder = function () {
|
|
|
21730
21788
|
initApp(element, staticResourcesUrl, {
|
|
21731
21789
|
buttons: buttons || {},
|
|
21732
21790
|
errorHandler: errorHandler || null,
|
|
21733
|
-
version: "2.
|
|
21734
|
-
buildDate: "2022-
|
|
21791
|
+
version: "2.6.0-rc.1" ,
|
|
21792
|
+
buildDate: "2022-10-14T12:12:12" ,
|
|
21735
21793
|
buildNumber: ''
|
|
21736
21794
|
}, structService, resolve);
|
|
21737
21795
|
});
|
|
@@ -21824,12 +21882,14 @@ function Editor(props) {
|
|
|
21824
21882
|
}),
|
|
21825
21883
|
height = _useResizeObserver.height,
|
|
21826
21884
|
width = _useResizeObserver.width;
|
|
21885
|
+
var ketcherInitEvent = new Event(KETCHER_INIT_EVENT_NAME);
|
|
21827
21886
|
React.useEffect(function () {
|
|
21828
21887
|
buildKetcherAsync(_objectSpread(_objectSpread({}, props), {}, {
|
|
21829
21888
|
element: rootElRef.current
|
|
21830
21889
|
})).then(function (ketcher) {
|
|
21831
21890
|
if (typeof onInit === 'function') {
|
|
21832
21891
|
onInit(ketcher);
|
|
21892
|
+
window.dispatchEvent(ketcherInitEvent);
|
|
21833
21893
|
}
|
|
21834
21894
|
});
|
|
21835
21895
|
}, []);
|
|
@@ -21840,4 +21900,5 @@ function Editor(props) {
|
|
|
21840
21900
|
}
|
|
21841
21901
|
|
|
21842
21902
|
exports.Editor = Editor;
|
|
21903
|
+
exports.KETCHER_INIT_EVENT_NAME = KETCHER_INIT_EVENT_NAME;
|
|
21843
21904
|
//# sourceMappingURL=index.js.map
|