From 6bc95a630804e9de47f820adb7f9d5f0a7371529 Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Tue, 26 Apr 2022 11:26:16 +0300
Subject: [PATCH] multiple drop down component

---
 .../CreateDropDownService.js                  | 16 ++++++++++
 .../MultipleDropDownNodeView.js               | 32 +++++++++++++++++++
 .../MultipleDropDownService.js                |  5 ---
 .../components/MultipleDropDownComponent.js   | 21 ++++++++++++
 4 files changed, 69 insertions(+), 5 deletions(-)
 create mode 100644 wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/MultipleDropDownNodeView.js
 create mode 100644 wax-prosemirror-services/src/MultipleDropDownService/components/MultipleDropDownComponent.js

diff --git a/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/CreateDropDownService.js b/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/CreateDropDownService.js
index bd98f2389..bbb0fcd2f 100644
--- a/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/CreateDropDownService.js
+++ b/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/CreateDropDownService.js
@@ -1,9 +1,25 @@
 import Service from '../../Service';
 import CreateDropDown from './CreateDropDown';
+import multipleDropDownOptionNode from '../schema/multipleDropDownOptionNode';
+import MultipleDropDownNodeView from './MultipleDropDownNodeView';
+import MultipleDropDownComponent from '../components/MultipleDropDownComponent';
 
 class CreateDropDownService extends Service {
   register() {
+    const createNode = this.container.get('CreateNode');
+    const addPortal = this.container.get('AddPortal');
+
     this.container.bind('CreateDropDown').to(CreateDropDown);
+
+    createNode({
+      multiple_drop_down_option: multipleDropDownOptionNode,
+    });
+
+    addPortal({
+      nodeView: MultipleDropDownNodeView,
+      component: MultipleDropDownComponent,
+      context: this.app,
+    });
   }
 }
 
diff --git a/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/MultipleDropDownNodeView.js b/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/MultipleDropDownNodeView.js
new file mode 100644
index 000000000..aa8ac0a39
--- /dev/null
+++ b/wax-prosemirror-services/src/MultipleDropDownService/CreateDropDownService/MultipleDropDownNodeView.js
@@ -0,0 +1,32 @@
+import QuestionsNodeView from '../../lib/helpers/QuestionsNodeView';
+
+export default class MultipleDropDownNodeView extends QuestionsNodeView {
+  constructor(
+    node,
+    view,
+    getPos,
+    decorations,
+    createPortal,
+    Component,
+    context,
+  ) {
+    super(node, view, getPos, decorations, createPortal, Component, context);
+
+    this.node = node;
+    this.outerView = view;
+    this.getPos = getPos;
+    this.context = context;
+  }
+
+  static name() {
+    return 'multiple_drop_down_option';
+  }
+
+  stopEvent(event) {
+    if (event.target.type === 'text') {
+      return true;
+    }
+    const innerView = this.context.pmViews[this.node.attrs.id];
+    return innerView && innerView.dom.contains(event.target);
+  }
+}
diff --git a/wax-prosemirror-services/src/MultipleDropDownService/MultipleDropDownService.js b/wax-prosemirror-services/src/MultipleDropDownService/MultipleDropDownService.js
index c17f8a530..f2931d459 100644
--- a/wax-prosemirror-services/src/MultipleDropDownService/MultipleDropDownService.js
+++ b/wax-prosemirror-services/src/MultipleDropDownService/MultipleDropDownService.js
@@ -2,7 +2,6 @@ import Service from '../Service';
 import MultipleDropDownQuestion from './MultipleDropDownQuestion';
 import MultipleDropDownContainerNodeView from './MultipleDropDownContainerNodeView';
 import multipleDropDownContainerNode from './schema/multipleDropDownContainerNode';
-import multipleDropDownOptionNode from './schema/multipleDropDownOptionNode';
 import CreateDropDownService from './CreateDropDownService/CreateDropDownService';
 import MultipleDropDownContainerComponent from './components/MultipleDropDownContainerComponent';
 
@@ -20,10 +19,6 @@ class MultipleDropDownService extends Service {
       multiple_drop_down_container: multipleDropDownContainerNode,
     });
 
-    createNode({
-      multiple_drop_down_option: multipleDropDownOptionNode,
-    });
-
     addPortal({
       nodeView: MultipleDropDownContainerNodeView,
       component: MultipleDropDownContainerComponent,
diff --git a/wax-prosemirror-services/src/MultipleDropDownService/components/MultipleDropDownComponent.js b/wax-prosemirror-services/src/MultipleDropDownService/components/MultipleDropDownComponent.js
new file mode 100644
index 000000000..2142887f6
--- /dev/null
+++ b/wax-prosemirror-services/src/MultipleDropDownService/components/MultipleDropDownComponent.js
@@ -0,0 +1,21 @@
+/* eslint-disable react/prop-types */
+import React, { useContext } from 'react';
+import { WaxContext } from 'wax-prosemirror-core';
+import styled from 'styled-components';
+
+export default ({ node, view, getPos }) => {
+  const context = useContext(WaxContext);
+  const {
+    pmViews: { main },
+  } = context;
+
+  const customProps = main.props.customValues;
+
+  const isEditable = main.props.editable(editable => {
+    return editable;
+  });
+
+  const readOnly = !isEditable;
+
+  return <span>DropDown</span>;
+};
-- 
GitLab