Sfoglia il codice sorgente

build: 添加QASimpleEditor、修正PriceInput部分逻辑

Roxas 4 anni fa
parent
commit
52715fe57b

+ 7
- 7
eslib/BraftEditor/index.d.ts Vedi File

@@ -1,10 +1,10 @@
1 1
 /// <reference types="react" />
2 2
 import { ControlType, EditorState } from "braft-editor";
3
-declare const BarftEditorPage: ({ initValue, value, onChange, controls, FloatControls }: {
4
-    initValue?: string | undefined;
5
-    value?: EditorState | undefined;
6
-    onChange?: ((editorState: EditorState) => void) | undefined;
7
-    controls?: ControlType[] | undefined;
3
+interface BaseEditorProps {
4
+    value: EditorState;
5
+    onChange: (editorState: EditorState) => void;
6
+    controls?: ControlType[];
8 7
     FloatControls?: any;
9
-}) => JSX.Element;
10
-export { BarftEditorPage as default, BarftEditorPage };
8
+}
9
+declare const BarftEditorPage: ({ value, onChange, controls, FloatControls }: BaseEditorProps) => JSX.Element;
10
+export { BarftEditorPage as default, BarftEditorPage, BaseEditorProps };

+ 8
- 26
eslib/BraftEditor/index.js Vedi File

@@ -46678,45 +46678,27 @@ BraftEditor.use(Emoticon(emotionOptions));
46678 46678
 var BarftEditorPage = function BarftEditorPage(_ref) {
46679 46679
   var _classnames2;
46680 46680
 
46681
-  var initValue = _ref.initValue,
46682
-      value = _ref.value,
46681
+  var value = _ref.value,
46683 46682
       onChange = _ref.onChange,
46684 46683
       controls = _ref.controls,
46685 46684
       FloatControls = _ref.FloatControls;
46686 46685
   var optionsControls = controls ? controls : ["bold", "italic", "underline", "separator", "link", "emoji", "separator", "media"];
46687 46686
   var options = {
46688 46687
     controls: optionsControls,
46689
-    uncontrolled: !value && !onChange,
46690 46688
     showControlsBar: optionsControls && optionsControls.length > 0 && !FloatControls,
46691 46689
     showFloatControls: FloatControls
46692 46690
   };
46693 46691
 
46694
-  var _useState = useState(BraftEditor.createEditorState(initValue || "<p>Hello <b>World!</b></p>")),
46692
+  var _useState = useState(false),
46695 46693
       _useState2 = _slicedToArray(_useState, 2),
46696
-      insideValue = _useState2[0],
46697
-      setInsideValue = _useState2[1];
46698
-
46699
-  var _useState3 = useState(false),
46700
-      _useState4 = _slicedToArray(_useState3, 2),
46701
-      focusState = _useState4[0],
46702
-      setFocusState = _useState4[1];
46703
-
46704
-  var resultValue;
46705
-  var resultAction;
46706
-
46707
-  if (options.uncontrolled) {
46708
-    resultValue = insideValue;
46709
-    resultAction = setInsideValue;
46710
-  } else {
46711
-    resultValue = value;
46712
-    resultAction = onChange;
46713
-  }
46694
+      focusState = _useState2[0],
46695
+      setFocusState = _useState2[1];
46714 46696
 
46715 46697
   return React.createElement("div", {
46716 46698
     className: styles.baseWrapper
46717 46699
   }, React.createElement(BraftEditor, {
46718
-    value: resultValue,
46719
-    onChange: resultAction,
46700
+    value: value,
46701
+    onChange: onChange,
46720 46702
     controls: options.controls,
46721 46703
     controlBarClassName: classnames(styles.controlBar, _defineProperty$1({}, styles.focus, focusState)),
46722 46704
     controlBarStyle: options.showControlsBar ? {} : {
@@ -46744,8 +46726,8 @@ var BarftEditorPage = function BarftEditorPage(_ref) {
46744 46726
   }), options.showFloatControls ? React.createElement("div", {
46745 46727
     className: classnames(styles.floatControls)
46746 46728
   }, React.createElement(FloatControls, {
46747
-    editorState: resultValue,
46748
-    setEditorState: resultAction
46729
+    editorState: value,
46730
+    setEditorState: onChange
46749 46731
   })) : null);
46750 46732
 };
46751 46733
 

+ 1
- 1
eslib/BraftEditor/index.js.map
File diff suppressed because it is too large
Vedi File


+ 20
- 0
eslib/Editor/index.d.ts Vedi File

@@ -1 +1,21 @@
1
+/// <reference types="react" />
2
+import { BaseEditorProps } from "../BraftEditor/index";
3
+import React from "react";
4
+interface ToolListItem {
5
+    key: any;
6
+    color: string;
7
+    iconClass: string;
8
+    onClick: any;
9
+    text?: string;
10
+    render?: (i: ToolListItem, innerIcon: any, innerText: any, divWrapStyle: React.CSSProperties | undefined) => any;
11
+}
12
+interface QASimpleEditorProps extends BaseEditorProps {
13
+    toolAlign?: "inner" | "bottom";
14
+    toolList?: Array<ToolListItem>;
15
+    injectControlsToolBar?: any;
16
+    toolBarContainerStyle?: any;
17
+    appendToolBtn?: any;
18
+}
19
+declare const QASimpleEditor: (props: QASimpleEditorProps) => JSX.Element;
1 20
 export { default as BraftEditor } from "../BraftEditor/index";
21
+export { QASimpleEditor };

+ 150
- 3
eslib/Editor/index.js Vedi File

@@ -1,9 +1,156 @@
1
-import 'react';
1
+import React from 'react';
2 2
 import 'react-dom';
3
-import '../style-inject.es-1f59c1d0.js';
4
-import '../defineProperty-18999f8e.js';
3
+import { s as styleInject } from '../style-inject.es-1f59c1d0.js';
4
+import { _ as _defineProperty } from '../defineProperty-18999f8e.js';
5 5
 import '../index-b8d80d39.js';
6 6
 import '../slicedToArray-4cd9e6d3.js';
7
+import { BarftEditorPage } from '../BraftEditor/index.js';
7 8
 export { default as BraftEditor } from '../BraftEditor/index.js';
8 9
 import 'react-dom/server';
10
+
11
+function ownKeys(object, enumerableOnly) {
12
+  var keys = Object.keys(object);
13
+
14
+  if (Object.getOwnPropertySymbols) {
15
+    var symbols = Object.getOwnPropertySymbols(object);
16
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
17
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
18
+    });
19
+    keys.push.apply(keys, symbols);
20
+  }
21
+
22
+  return keys;
23
+}
24
+
25
+function _objectSpread(target) {
26
+  for (var i = 1; i < arguments.length; i++) {
27
+    var source = arguments[i] != null ? arguments[i] : {};
28
+
29
+    if (i % 2) {
30
+      ownKeys(Object(source), true).forEach(function (key) {
31
+        _defineProperty(target, key, source[key]);
32
+      });
33
+    } else if (Object.getOwnPropertyDescriptors) {
34
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
35
+    } else {
36
+      ownKeys(Object(source)).forEach(function (key) {
37
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
38
+      });
39
+    }
40
+  }
41
+
42
+  return target;
43
+}
44
+var ControlsToolBar = function ControlsToolBar(props) {
45
+  var editorState = props.editorState,
46
+      setEditorState = props.setEditorState,
47
+      _props$toolList = props.toolList,
48
+      toolList = _props$toolList === void 0 ? [] : _props$toolList,
49
+      _props$injectIconWrap = props.injectIconWrapStyle,
50
+      injectIconWrapStyle = _props$injectIconWrap === void 0 ? {} : _props$injectIconWrap,
51
+      _props$injectIconStyl = props.injectIconStyle,
52
+      injectIconStyle = _props$injectIconStyl === void 0 ? {} : _props$injectIconStyl,
53
+      _props$injectIconText = props.injectIconTextStyle,
54
+      injectIconTextStyle = _props$injectIconText === void 0 ? {} : _props$injectIconText;
55
+
56
+  var IconWrapStyle = _objectSpread({
57
+    display: 'flex',
58
+    alignItems: 'center',
59
+    cursor: "pointer",
60
+    textAlign: "center",
61
+    minWidth: "42px"
62
+  }, injectIconWrapStyle);
63
+
64
+  var IconStyle = _objectSpread({
65
+    fontSize: "21px"
66
+  }, injectIconStyle);
67
+
68
+  var IconTextStyle = _objectSpread({
69
+    margin: "0 4px"
70
+  }, injectIconTextStyle);
71
+
72
+  if (toolList.length < 1) {
73
+    return null;
74
+  }
75
+
76
+  return React.createElement(React.Fragment, null, toolList.map(function (i) {
77
+    var innerIcon = React.createElement("i", {
78
+      className: i.iconClass,
79
+      style: IconStyle
80
+    });
81
+    var innerText = i.text ? React.createElement("span", {
82
+      style: IconTextStyle
83
+    }, i.text) : null;
84
+
85
+    var divWrapStyle = _objectSpread({
86
+      color: i.color
87
+    }, IconWrapStyle);
88
+
89
+    var wrapperDom = React.createElement("div", {
90
+      key: "toolList_".concat(i.key),
91
+      style: divWrapStyle,
92
+      onClick: i.onClick
93
+    }, innerIcon, innerText);
94
+
95
+    if (i.render) {
96
+      return i.render(i, innerIcon, innerText, divWrapStyle);
97
+    }
98
+
99
+    return wrapperDom;
100
+  }));
101
+};
102
+
103
+var css = ".index_bottomToolBarWrapper__3mYXO {\n  display: flex;\n}\n";
104
+var styles = {
105
+  "bottomToolBarWrapper": "index_bottomToolBarWrapper__3mYXO"
106
+};
107
+styleInject(css);
108
+
109
+var QASimpleEditor = function QASimpleEditor(props) {
110
+  var value = props.value,
111
+      onChange = props.onChange,
112
+      _props$toolAlign = props.toolAlign,
113
+      toolAlign = _props$toolAlign === void 0 ? 'inner' : _props$toolAlign,
114
+      _props$toolList = props.toolList,
115
+      toolList = _props$toolList === void 0 ? [] : _props$toolList,
116
+      _props$injectControls = props.injectControlsToolBar,
117
+      injectControlsToolBar = _props$injectControls === void 0 ? {} : _props$injectControls,
118
+      _props$toolBarContain = props.toolBarContainerStyle,
119
+      toolBarContainerStyle = _props$toolBarContain === void 0 ? {} : _props$toolBarContain,
120
+      _props$appendToolBtn = props.appendToolBtn,
121
+      appendToolBtn = _props$appendToolBtn === void 0 ? null : _props$appendToolBtn;
122
+
123
+  if (toolAlign === 'inner') {
124
+    return React.createElement(BarftEditorPage, {
125
+      value: value,
126
+      onChange: onChange,
127
+      controls: [],
128
+      FloatControls: function FloatControls(_ref) {
129
+        var editorState = _ref.editorState,
130
+            setEditorState = _ref.setEditorState;
131
+        return React.createElement(ControlsToolBar, {
132
+          editorState: editorState,
133
+          setEditorState: setEditorState,
134
+          toolList: toolList
135
+        });
136
+      }
137
+    });
138
+  }
139
+
140
+  return React.createElement("div", null, React.createElement(BarftEditorPage, {
141
+    value: value,
142
+    onChange: onChange,
143
+    controls: []
144
+  }), React.createElement("div", {
145
+    style: toolBarContainerStyle
146
+  }, React.createElement("div", {
147
+    className: styles.bottomToolBarWrapper
148
+  }, React.createElement(ControlsToolBar, Object.assign({
149
+    editorState: value,
150
+    setEditorState: onChange,
151
+    toolList: toolList
152
+  }, injectControlsToolBar))), appendToolBtn));
153
+};
154
+
155
+export { QASimpleEditor };
9 156
 //# sourceMappingURL=index.js.map

+ 1
- 1
eslib/Editor/index.js.map
File diff suppressed because it is too large
Vedi File


+ 2
- 1
eslib/PriceOptions/index.js Vedi File

@@ -111,8 +111,9 @@ var PriceOptions = function PriceOptions(_ref) {
111 111
   }, defaultOptions.map(function (item) {
112 112
     var _objectSpread3;
113 113
 
114
+    var isActive = price === item && !inputStatus;
114 115
     return React.createElement("span", {
115
-      className: classnames(_objectSpread((_objectSpread3 = {}, _defineProperty(_objectSpread3, styles.priceItem, true), _defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass(price === item && !inputStatus))),
116
+      className: classnames(_objectSpread((_objectSpread3 = {}, _defineProperty(_objectSpread3, styles.priceItem, true), _defineProperty(_objectSpread3, styles.active, !injectOptions.priceBtnClass(isActive) && isActive), _objectSpread3), injectOptions.priceBtnClass(isActive))),
116 117
       key: item,
117 118
       onClick: function onClick() {
118 119
         onPriceChange(item);

+ 1
- 1
eslib/PriceOptions/index.js.map
File diff suppressed because it is too large
Vedi File


+ 7
- 7
lib/BraftEditor/index.d.ts Vedi File

@@ -1,10 +1,10 @@
1 1
 /// <reference types="react" />
2 2
 import { ControlType, EditorState } from "braft-editor";
3
-declare const BarftEditorPage: ({ initValue, value, onChange, controls, FloatControls }: {
4
-    initValue?: string | undefined;
5
-    value?: EditorState | undefined;
6
-    onChange?: ((editorState: EditorState) => void) | undefined;
7
-    controls?: ControlType[] | undefined;
3
+interface BaseEditorProps {
4
+    value: EditorState;
5
+    onChange: (editorState: EditorState) => void;
6
+    controls?: ControlType[];
8 7
     FloatControls?: any;
9
-}) => JSX.Element;
10
-export { BarftEditorPage as default, BarftEditorPage };
8
+}
9
+declare const BarftEditorPage: ({ value, onChange, controls, FloatControls }: BaseEditorProps) => JSX.Element;
10
+export { BarftEditorPage as default, BarftEditorPage, BaseEditorProps };

+ 8
- 26
lib/BraftEditor/index.js Vedi File

@@ -46686,45 +46686,27 @@ BraftEditor.use(Emoticon(emotionOptions));
46686 46686
 var BarftEditorPage = function BarftEditorPage(_ref) {
46687 46687
   var _classnames2;
46688 46688
 
46689
-  var initValue = _ref.initValue,
46690
-      value = _ref.value,
46689
+  var value = _ref.value,
46691 46690
       onChange = _ref.onChange,
46692 46691
       controls = _ref.controls,
46693 46692
       FloatControls = _ref.FloatControls;
46694 46693
   var optionsControls = controls ? controls : ["bold", "italic", "underline", "separator", "link", "emoji", "separator", "media"];
46695 46694
   var options = {
46696 46695
     controls: optionsControls,
46697
-    uncontrolled: !value && !onChange,
46698 46696
     showControlsBar: optionsControls && optionsControls.length > 0 && !FloatControls,
46699 46697
     showFloatControls: FloatControls
46700 46698
   };
46701 46699
 
46702
-  var _useState = React.useState(BraftEditor.createEditorState(initValue || "<p>Hello <b>World!</b></p>")),
46700
+  var _useState = React.useState(false),
46703 46701
       _useState2 = slicedToArray._slicedToArray(_useState, 2),
46704
-      insideValue = _useState2[0],
46705
-      setInsideValue = _useState2[1];
46706
-
46707
-  var _useState3 = React.useState(false),
46708
-      _useState4 = slicedToArray._slicedToArray(_useState3, 2),
46709
-      focusState = _useState4[0],
46710
-      setFocusState = _useState4[1];
46711
-
46712
-  var resultValue;
46713
-  var resultAction;
46714
-
46715
-  if (options.uncontrolled) {
46716
-    resultValue = insideValue;
46717
-    resultAction = setInsideValue;
46718
-  } else {
46719
-    resultValue = value;
46720
-    resultAction = onChange;
46721
-  }
46702
+      focusState = _useState2[0],
46703
+      setFocusState = _useState2[1];
46722 46704
 
46723 46705
   return React__default.createElement("div", {
46724 46706
     className: styles.baseWrapper
46725 46707
   }, React__default.createElement(BraftEditor, {
46726
-    value: resultValue,
46727
-    onChange: resultAction,
46708
+    value: value,
46709
+    onChange: onChange,
46728 46710
     controls: options.controls,
46729 46711
     controlBarClassName: index.classnames(styles.controlBar, defineProperty._defineProperty({}, styles.focus, focusState)),
46730 46712
     controlBarStyle: options.showControlsBar ? {} : {
@@ -46752,8 +46734,8 @@ var BarftEditorPage = function BarftEditorPage(_ref) {
46752 46734
   }), options.showFloatControls ? React__default.createElement("div", {
46753 46735
     className: index.classnames(styles.floatControls)
46754 46736
   }, React__default.createElement(FloatControls, {
46755
-    editorState: resultValue,
46756
-    setEditorState: resultAction
46737
+    editorState: value,
46738
+    setEditorState: onChange
46757 46739
   })) : null);
46758 46740
 };
46759 46741
 

+ 1
- 1
lib/BraftEditor/index.js.map
File diff suppressed because it is too large
Vedi File


+ 20
- 0
lib/Editor/index.d.ts Vedi File

@@ -1 +1,21 @@
1
+/// <reference types="react" />
2
+import { BaseEditorProps } from "../BraftEditor/index";
3
+import React from "react";
4
+interface ToolListItem {
5
+    key: any;
6
+    color: string;
7
+    iconClass: string;
8
+    onClick: any;
9
+    text?: string;
10
+    render?: (i: ToolListItem, innerIcon: any, innerText: any, divWrapStyle: React.CSSProperties | undefined) => any;
11
+}
12
+interface QASimpleEditorProps extends BaseEditorProps {
13
+    toolAlign?: "inner" | "bottom";
14
+    toolList?: Array<ToolListItem>;
15
+    injectControlsToolBar?: any;
16
+    toolBarContainerStyle?: any;
17
+    appendToolBtn?: any;
18
+}
19
+declare const QASimpleEditor: (props: QASimpleEditorProps) => JSX.Element;
1 20
 export { default as BraftEditor } from "../BraftEditor/index";
21
+export { QASimpleEditor };

+ 149
- 3
lib/Editor/index.js Vedi File

@@ -2,16 +2,162 @@
2 2
 
3 3
 Object.defineProperty(exports, '__esModule', { value: true });
4 4
 
5
-require('react');
5
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
6
+
7
+var React = require('react');
8
+var React__default = _interopDefault(React);
6 9
 require('react-dom');
7
-require('../style-inject.es-dcee06b6.js');
8
-require('../defineProperty-ba7cd53d.js');
10
+var styleInject_es = require('../style-inject.es-dcee06b6.js');
11
+var defineProperty = require('../defineProperty-ba7cd53d.js');
9 12
 require('../index-1143667e.js');
10 13
 require('../slicedToArray-172f4624.js');
11 14
 var BraftEditor = require('../BraftEditor/index.js');
12 15
 require('react-dom/server');
13 16
 
17
+function ownKeys(object, enumerableOnly) {
18
+  var keys = Object.keys(object);
19
+
20
+  if (Object.getOwnPropertySymbols) {
21
+    var symbols = Object.getOwnPropertySymbols(object);
22
+    if (enumerableOnly) symbols = symbols.filter(function (sym) {
23
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
24
+    });
25
+    keys.push.apply(keys, symbols);
26
+  }
27
+
28
+  return keys;
29
+}
30
+
31
+function _objectSpread(target) {
32
+  for (var i = 1; i < arguments.length; i++) {
33
+    var source = arguments[i] != null ? arguments[i] : {};
34
+
35
+    if (i % 2) {
36
+      ownKeys(Object(source), true).forEach(function (key) {
37
+        defineProperty._defineProperty(target, key, source[key]);
38
+      });
39
+    } else if (Object.getOwnPropertyDescriptors) {
40
+      Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
41
+    } else {
42
+      ownKeys(Object(source)).forEach(function (key) {
43
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
44
+      });
45
+    }
46
+  }
47
+
48
+  return target;
49
+}
50
+var ControlsToolBar = function ControlsToolBar(props) {
51
+  var editorState = props.editorState,
52
+      setEditorState = props.setEditorState,
53
+      _props$toolList = props.toolList,
54
+      toolList = _props$toolList === void 0 ? [] : _props$toolList,
55
+      _props$injectIconWrap = props.injectIconWrapStyle,
56
+      injectIconWrapStyle = _props$injectIconWrap === void 0 ? {} : _props$injectIconWrap,
57
+      _props$injectIconStyl = props.injectIconStyle,
58
+      injectIconStyle = _props$injectIconStyl === void 0 ? {} : _props$injectIconStyl,
59
+      _props$injectIconText = props.injectIconTextStyle,
60
+      injectIconTextStyle = _props$injectIconText === void 0 ? {} : _props$injectIconText;
61
+
62
+  var IconWrapStyle = _objectSpread({
63
+    display: 'flex',
64
+    alignItems: 'center',
65
+    cursor: "pointer",
66
+    textAlign: "center",
67
+    minWidth: "42px"
68
+  }, injectIconWrapStyle);
69
+
70
+  var IconStyle = _objectSpread({
71
+    fontSize: "21px"
72
+  }, injectIconStyle);
73
+
74
+  var IconTextStyle = _objectSpread({
75
+    margin: "0 4px"
76
+  }, injectIconTextStyle);
77
+
78
+  if (toolList.length < 1) {
79
+    return null;
80
+  }
81
+
82
+  return React__default.createElement(React__default.Fragment, null, toolList.map(function (i) {
83
+    var innerIcon = React__default.createElement("i", {
84
+      className: i.iconClass,
85
+      style: IconStyle
86
+    });
87
+    var innerText = i.text ? React__default.createElement("span", {
88
+      style: IconTextStyle
89
+    }, i.text) : null;
90
+
91
+    var divWrapStyle = _objectSpread({
92
+      color: i.color
93
+    }, IconWrapStyle);
94
+
95
+    var wrapperDom = React__default.createElement("div", {
96
+      key: "toolList_".concat(i.key),
97
+      style: divWrapStyle,
98
+      onClick: i.onClick
99
+    }, innerIcon, innerText);
100
+
101
+    if (i.render) {
102
+      return i.render(i, innerIcon, innerText, divWrapStyle);
103
+    }
104
+
105
+    return wrapperDom;
106
+  }));
107
+};
108
+
109
+var css = ".index_bottomToolBarWrapper__3mYXO {\n  display: flex;\n}\n";
110
+var styles = {
111
+  "bottomToolBarWrapper": "index_bottomToolBarWrapper__3mYXO"
112
+};
113
+styleInject_es.styleInject(css);
114
+
115
+var QASimpleEditor = function QASimpleEditor(props) {
116
+  var value = props.value,
117
+      onChange = props.onChange,
118
+      _props$toolAlign = props.toolAlign,
119
+      toolAlign = _props$toolAlign === void 0 ? 'inner' : _props$toolAlign,
120
+      _props$toolList = props.toolList,
121
+      toolList = _props$toolList === void 0 ? [] : _props$toolList,
122
+      _props$injectControls = props.injectControlsToolBar,
123
+      injectControlsToolBar = _props$injectControls === void 0 ? {} : _props$injectControls,
124
+      _props$toolBarContain = props.toolBarContainerStyle,
125
+      toolBarContainerStyle = _props$toolBarContain === void 0 ? {} : _props$toolBarContain,
126
+      _props$appendToolBtn = props.appendToolBtn,
127
+      appendToolBtn = _props$appendToolBtn === void 0 ? null : _props$appendToolBtn;
128
+
129
+  if (toolAlign === 'inner') {
130
+    return React__default.createElement(BraftEditor.BarftEditorPage, {
131
+      value: value,
132
+      onChange: onChange,
133
+      controls: [],
134
+      FloatControls: function FloatControls(_ref) {
135
+        var editorState = _ref.editorState,
136
+            setEditorState = _ref.setEditorState;
137
+        return React__default.createElement(ControlsToolBar, {
138
+          editorState: editorState,
139
+          setEditorState: setEditorState,
140
+          toolList: toolList
141
+        });
142
+      }
143
+    });
144
+  }
14 145
 
146
+  return React__default.createElement("div", null, React__default.createElement(BraftEditor.BarftEditorPage, {
147
+    value: value,
148
+    onChange: onChange,
149
+    controls: []
150
+  }), React__default.createElement("div", {
151
+    style: toolBarContainerStyle
152
+  }, React__default.createElement("div", {
153
+    className: styles.bottomToolBarWrapper
154
+  }, React__default.createElement(ControlsToolBar, Object.assign({
155
+    editorState: value,
156
+    setEditorState: onChange,
157
+    toolList: toolList
158
+  }, injectControlsToolBar))), appendToolBtn));
159
+};
15 160
 
16 161
 exports.BraftEditor = BraftEditor.default;
162
+exports.QASimpleEditor = QASimpleEditor;
17 163
 //# sourceMappingURL=index.js.map

+ 1
- 1
lib/Editor/index.js.map
File diff suppressed because it is too large
Vedi File


+ 2
- 1
lib/PriceOptions/index.js Vedi File

@@ -118,8 +118,9 @@ var PriceOptions = function PriceOptions(_ref) {
118 118
   }, defaultOptions.map(function (item) {
119 119
     var _objectSpread3;
120 120
 
121
+    var isActive = price === item && !inputStatus;
121 122
     return React__default.createElement("span", {
122
-      className: index.classnames(_objectSpread((_objectSpread3 = {}, defineProperty._defineProperty(_objectSpread3, styles.priceItem, true), defineProperty._defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass(price === item && !inputStatus))),
123
+      className: index.classnames(_objectSpread((_objectSpread3 = {}, defineProperty._defineProperty(_objectSpread3, styles.priceItem, true), defineProperty._defineProperty(_objectSpread3, styles.active, !injectOptions.priceBtnClass(isActive) && isActive), _objectSpread3), injectOptions.priceBtnClass(isActive))),
123 124
       key: item,
124 125
       onClick: function onClick() {
125 126
         onPriceChange(item);

+ 1
- 1
lib/PriceOptions/index.js.map
File diff suppressed because it is too large
Vedi File


+ 23
- 12
src/components/Editor/CommonTool/ControlsToolBar.tsx Vedi File

@@ -1,5 +1,6 @@
1 1
 import React from "react";
2 2
 import { EditorState } from "braft-editor";
3
+import { render } from '@testing-library/react';
3 4
 
4 5
 export interface ToolListItem {
5 6
   key: any;
@@ -7,6 +8,7 @@ export interface ToolListItem {
7 8
   iconClass: string;
8 9
   onClick: any;
9 10
   text?: string;
11
+  render?: (i: ToolListItem, innerIcon: any, innerText: any, divWrapStyle: React.CSSProperties | undefined) => any;
10 12
 };
11 13
 interface ControlsToolBarProps {
12 14
   editorState: EditorState;
@@ -44,18 +46,27 @@ export const ControlsToolBar = (props: ControlsToolBarProps) => {
44 46
   return (
45 47
     <>
46 48
     {
47
-      toolList.map(i => (
48
-        <div
49
-          key={`toolList_${i.key}`}
50
-          style={{ color: i.color, ...IconWrapStyle }}
51
-          onClick={i.onClick}
52
-        >
53
-          <i className={i.iconClass} style={IconStyle} />
54
-          {
55
-            i.text ? <span style={IconTextStyle}>{i.text}</span> : null
56
-          }
57
-        </div>
58
-      ))
49
+      toolList.map(i => {
50
+        const innerIcon = <i className={i.iconClass} style={IconStyle} />;
51
+        const innerText = i.text ? <span style={IconTextStyle}>{i.text}</span> : null;
52
+        const divWrapStyle = { color: i.color, ...IconWrapStyle };
53
+        const wrapperDom = (
54
+          <div
55
+            key={`toolList_${i.key}`}
56
+            style={divWrapStyle}
57
+            onClick={i.onClick}
58
+          >
59
+            {innerIcon}
60
+            {innerText}
61
+          </div>
62
+        );
63
+
64
+        if (i.render) {
65
+          return i.render(i, innerIcon, innerText, divWrapStyle);
66
+        }
67
+
68
+        return wrapperDom;
69
+      })
59 70
     }
60 71
     </>
61 72
   );

+ 9
- 0
src/components/Editor/CommonTool/TopicPop.tsx Vedi File

@@ -0,0 +1,9 @@
1
+import React from 'react';
2
+
3
+interface TopicPopProps {
4
+
5
+}
6
+
7
+const TopicPop = (props: TopicPopProps) => {
8
+  
9
+}

+ 2
- 1
src/components/Editor/index.ts Vedi File

@@ -1 +1,2 @@
1
-export { default as BraftEditor } from './BraftEditor';
1
+export { default as BraftEditor } from './BraftEditor';
2
+export { default as QASimpleEditor } from './QAEditor/SimpleEditor';

+ 19
- 16
src/components/Payment/PriceOptions/index.tsx Vedi File

@@ -73,22 +73,25 @@ const PriceOptions = ({
73 73
       {withTitle ? (titleText || null) : null}
74 74
       <div className={styles.infoItem}>
75 75
         <span className={styles.priceBtn}>
76
-          {defaultOptions.map(item => (
77
-            <span
78
-              className={classnames({
79
-                [styles.priceItem]: true,
80
-                [styles.active]: price === item && !inputStatus,
81
-                ...injectOptions.priceBtnClass(price === item && !inputStatus),
82
-              })}
83
-              key={item}
84
-              onClick={() => {
85
-                onPriceChange(item);
86
-                setInputStatus(false);
87
-              }}
88
-            >
89
-              {priceRender(item)}
90
-            </span>
91
-          ))}
76
+          {defaultOptions.map(item => {
77
+            const isActive = price === item && !inputStatus;
78
+            return (
79
+              <span
80
+                className={classnames({
81
+                  [styles.priceItem]: true,
82
+                  [styles.active]: !injectOptions.priceBtnClass(isActive) && isActive,
83
+                  ...injectOptions.priceBtnClass(isActive),
84
+                })}
85
+                key={item}
86
+                onClick={() => {
87
+                  onPriceChange(item);
88
+                  setInputStatus(false);
89
+                }}
90
+              >
91
+                {priceRender(item)}
92
+              </span>
93
+              );
94
+          })}
92 95
         </span>
93 96
         <Input
94 97
           ref={inputRef}

+ 1
- 1
stats.html
File diff suppressed because it is too large
Vedi File


+ 15
- 2
stories/Editor.stories.tsx Vedi File

@@ -131,7 +131,7 @@ stories.add(
131 131
                 setEditorState(
132 132
                   ContentUtils.insertText(editorState, "Hello World")
133 133
                 );
134
-              }
134
+              },
135 135
             },
136 136
             {
137 137
               key: 2,
@@ -153,7 +153,20 @@ stories.add(
153 153
                 setEditorState(
154 154
                   ContentUtils.insertText(editorState, "Hello World")
155 155
                 );
156
-              }
156
+              },
157
+              render: (i, icon, text, style) => {
158
+                return (
159
+                  <Popover
160
+                    trigger="click"
161
+                    content="123"
162
+                  >
163
+                    <div style={style}>
164
+                      {icon}
165
+                      {text}
166
+                    </div>
167
+                  </Popover>
168
+                )
169
+              },
157 170
             },
158 171
             {
159 172
               key: 4,