x-star-editor 0.0.9 → 0.1.0

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.
Files changed (46) hide show
  1. package/dist/components/Fade.d.ts +9 -0
  2. package/dist/components/Fade.js +38 -0
  3. package/dist/components/FileInput.js +11 -8
  4. package/dist/components/Toolbar.d.ts +9 -5
  5. package/dist/components/Toolbar.js +154 -97
  6. package/dist/index.d.ts +7 -7
  7. package/dist/index.js +4 -4
  8. package/dist/locales/en_US.d.ts +27 -0
  9. package/dist/locales/en_US.js +26 -0
  10. package/dist/locales/index.d.ts +115 -0
  11. package/dist/locales/index.js +41 -0
  12. package/dist/locales/zh_CN.d.ts +27 -0
  13. package/dist/locales/zh_CN.js +26 -0
  14. package/dist/styles/icons/blockquote.svg +18 -0
  15. package/dist/styles/icons/code.svg +18 -1
  16. package/dist/styles/icons/delete.svg +18 -0
  17. package/dist/styles/icons/emphasis.svg +18 -0
  18. package/dist/styles/icons/heading.svg +16 -0
  19. package/dist/styles/icons/image.svg +18 -1
  20. package/dist/styles/icons/inline-code.svg +19 -0
  21. package/dist/styles/icons/inline-math.svg +20 -0
  22. package/dist/styles/icons/link.svg +18 -1
  23. package/dist/styles/icons/math.svg +17 -0
  24. package/dist/styles/icons/redo.svg +18 -0
  25. package/dist/styles/icons/strong.svg +18 -0
  26. package/dist/styles/icons/thematic-break.svg +18 -0
  27. package/dist/styles/icons/undo.svg +18 -0
  28. package/dist/styles/index.css +353 -389
  29. package/dist/utils/container.js +23 -1
  30. package/dist/utils/global.d.ts +1 -1
  31. package/dist/utils/global.js +1 -1
  32. package/dist/utils/history.d.ts +18 -5
  33. package/dist/utils/history.js +80 -68
  34. package/dist/utils/markdown.d.ts +7 -0
  35. package/dist/utils/markdown.js +25 -25
  36. package/dist/{XStarEditor → x-star-editor}/index.d.ts +22 -3
  37. package/dist/{XStarEditor → x-star-editor}/index.js +30 -20
  38. package/dist/{XStarMdEditor → x-star-md-editor}/index.d.ts +31 -3
  39. package/dist/{XStarMdEditor → x-star-md-editor}/index.js +23 -14
  40. package/dist/{XStarMdViewer → x-star-md-viewer}/index.d.ts +12 -0
  41. package/dist/{XStarMdViewer → x-star-md-viewer}/index.js +3 -1
  42. package/package.json +6 -4
  43. package/dist/styles/icons/bold.svg +0 -1
  44. package/dist/styles/icons/code-library.svg +0 -1
  45. package/dist/styles/icons/italic.svg +0 -1
  46. package/dist/styles/icons/strikethrough.svg +0 -1
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ interface FadeProps {
3
+ children: React.ReactNode;
4
+ nodeRef: React.RefObject<HTMLDivElement>;
5
+ appear: boolean;
6
+ timeout: number;
7
+ }
8
+ declare const Fade: ({ children, nodeRef, appear, timeout }: FadeProps) => React.JSX.Element;
9
+ export default Fade;
@@ -0,0 +1,38 @@
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
3
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
4
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
5
+ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
6
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7
+ import React, { useEffect, useState } from 'react';
8
+ var Fade = function Fade(_ref) {
9
+ var children = _ref.children,
10
+ nodeRef = _ref.nodeRef,
11
+ appear = _ref.appear,
12
+ timeout = _ref.timeout;
13
+ var _useState = useState(appear),
14
+ _useState2 = _slicedToArray(_useState, 2),
15
+ mount = _useState2[0],
16
+ setMount = _useState2[1];
17
+ useEffect(function () {
18
+ if (appear) {
19
+ if (nodeRef.current) {
20
+ nodeRef.current.getBoundingClientRect();
21
+ nodeRef.current.style.opacity = '1';
22
+ }
23
+ setMount(true);
24
+ } else {
25
+ if (nodeRef.current) {
26
+ nodeRef.current.style.opacity = '0';
27
+ }
28
+ var timer = window.setTimeout(function () {
29
+ return setMount(false);
30
+ }, timeout);
31
+ return function () {
32
+ return window.clearTimeout(timer);
33
+ };
34
+ }
35
+ }, [appear, timeout]);
36
+ return /*#__PURE__*/React.createElement(React.Fragment, null, (appear || mount) && children);
37
+ };
38
+ export default Fade;
@@ -10,6 +10,7 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
11
  import classNames from 'classnames';
12
12
  import React, { useState } from 'react';
13
+ import { useLocale } from "../locales";
13
14
  import { prefix } from "../utils/global";
14
15
  var FileInput = function FileInput(_ref) {
15
16
  var _file$name;
@@ -31,6 +32,8 @@ var FileInput = function FileInput(_ref) {
31
32
  _useState8 = _slicedToArray(_useState7, 2),
32
33
  description = _useState8[0],
33
34
  setDescription = _useState8[1];
35
+ var _useLocale = useLocale('fileInput'),
36
+ t = _useLocale.format;
34
37
  return /*#__PURE__*/React.createElement("div", {
35
38
  className: classNames("".concat(prefix, "file-input"))
36
39
  }, /*#__PURE__*/React.createElement("div", {
@@ -40,14 +43,14 @@ var FileInput = function FileInput(_ref) {
40
43
  onClick: function onClick() {
41
44
  return setType('file');
42
45
  }
43
- }, "\u6587\u4EF6"), /*#__PURE__*/React.createElement("div", {
46
+ }, t('file')), /*#__PURE__*/React.createElement("div", {
44
47
  className: classNames("".concat(prefix, "tab"), _defineProperty({}, "".concat(prefix, "active"), type === 'url')),
45
48
  onClick: function onClick() {
46
49
  return setType('url');
47
50
  }
48
- }, "\u7F51\u5740")), type === 'file' ? /*#__PURE__*/React.createElement("label", {
51
+ }, t('url'))), type === 'file' ? /*#__PURE__*/React.createElement("label", {
49
52
  className: classNames("".concat(prefix, "field"))
50
- }, "\u6587\u4EF6", /*#__PURE__*/React.createElement("div", {
53
+ }, t('file'), /*#__PURE__*/React.createElement("div", {
51
54
  className: classNames("".concat(prefix, "file-container"))
52
55
  }, /*#__PURE__*/React.createElement("input", {
53
56
  className: classNames("".concat(prefix, "hidden")),
@@ -63,16 +66,16 @@ var FileInput = function FileInput(_ref) {
63
66
  }), /*#__PURE__*/React.createElement("button", {
64
67
  className: classNames("".concat(prefix, "button")),
65
68
  type: "button"
66
- }, "\u9009\u62E9\u6587\u4EF6"))) : /*#__PURE__*/React.createElement("label", {
69
+ }, t('chooseFile')))) : /*#__PURE__*/React.createElement("label", {
67
70
  className: classNames("".concat(prefix, "field"))
68
- }, "\u7F51\u5740", /*#__PURE__*/React.createElement("input", {
71
+ }, t('url'), /*#__PURE__*/React.createElement("input", {
69
72
  className: classNames("".concat(prefix, "input")),
70
73
  onChange: function onChange(e) {
71
74
  return setUrl(e.target.value);
72
75
  }
73
76
  })), /*#__PURE__*/React.createElement("label", {
74
77
  className: classNames("".concat(prefix, "field"))
75
- }, "\u63CF\u8FF0", /*#__PURE__*/React.createElement("input", {
78
+ }, t('description'), /*#__PURE__*/React.createElement("input", {
76
79
  className: classNames("".concat(prefix, "input")),
77
80
  onChange: function onChange(e) {
78
81
  return setDescription(e.target.value);
@@ -97,10 +100,10 @@ var FileInput = function FileInput(_ref) {
97
100
  });
98
101
  }
99
102
  }
100
- }, "\u786E\u5B9A"), /*#__PURE__*/React.createElement("button", {
103
+ }, t('confirm')), /*#__PURE__*/React.createElement("button", {
101
104
  className: classNames("".concat(prefix, "button")),
102
105
  type: "button",
103
106
  onClick: onCancel
104
- }, "\u53D6\u6D88")));
107
+ }, t('cancel'))));
105
108
  };
106
109
  export default FileInput;
@@ -1,16 +1,20 @@
1
1
  import React from 'react';
2
- import type { Executor } from '../utils/handler';
3
- export interface ToolbarItem {
2
+ import type { Executor, Handler } from '../utils/handler';
3
+ interface ToolbarItemProps {
4
4
  children: React.ReactNode;
5
+ disabled?: boolean;
5
6
  tooltip?: React.ReactNode;
6
7
  popoverRender?: (exec: Executor, close: () => void) => React.ReactNode;
7
8
  onClick?: (exec: Executor) => void;
8
9
  }
9
- export declare const getDefaultToolbarItemMap: (onInsertFile?: ((file: File, options: {
10
+ type ToolbarItem = ToolbarItemProps | Handler<ToolbarItemProps>;
11
+ export type ToolbarItemMap = Partial<Record<string, ToolbarItem>>;
12
+ export declare const getDefaultToolbarItemMap: (locale?: string, onInsertFile?: ((file: File, options: {
10
13
  description: string;
11
14
  image: boolean;
12
- }) => void) | undefined) => Partial<Record<string, ToolbarItem>>;
13
- export declare const getDefaultToolbarItems: () => (string | ToolbarItem)[][];
15
+ }) => void) | undefined) => ToolbarItemMap;
16
+ export type ToolbarItems = (string | ToolbarItem)[][];
17
+ export declare const getDefaultToolbarItems: () => ToolbarItems;
14
18
  interface ToolbarProps {
15
19
  className?: string;
16
20
  style?: React.CSSProperties;
@@ -10,12 +10,16 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
11
  import classNames from 'classnames';
12
12
  import React, { useEffect, useRef, useState } from 'react';
13
+ import { getFormat } from "../locales";
13
14
  import { prefix } from "../utils/global";
14
- import { toggleHandler } from "../utils/handler";
15
+ import { redoHandler, toggleHandler, undoHandler } from "../utils/handler";
16
+ import Fade from "./Fade";
15
17
  import FileInput from "./FileInput";
16
18
  var Button = function Button(_ref) {
17
- var toolbarRef = _ref.toolbarRef,
18
- children = _ref.children,
19
+ var _classNames;
20
+ var children = _ref.children,
21
+ toolbarRef = _ref.toolbarRef,
22
+ disabled = _ref.disabled,
19
23
  tooltip = _ref.tooltip,
20
24
  popoverRender = _ref.popoverRender,
21
25
  _onClick = _ref.onClick;
@@ -32,13 +36,13 @@ var Button = function Button(_ref) {
32
36
  });
33
37
  var popoverMount = !!popover && popoverOpen;
34
38
  var tooltipMount = !popoverMount && !!tooltip && tooltipOpen;
39
+ var tooltipRef = useRef(null);
35
40
  var popoverRef = useRef(null);
36
41
  useEffect(function () {
37
42
  if (popoverMount) {
38
43
  if (toolbarRef.current && popoverRef.current) {
39
44
  var left = toolbarRef.current.getBoundingClientRect().right - popoverRef.current.getBoundingClientRect().right;
40
45
  popoverRef.current.style.left = "".concat(left < 0 ? left : 0, "px");
41
- popoverRef.current.style.opacity = '1';
42
46
  }
43
47
  var listener = function listener(e) {
44
48
  var _popoverRef$current;
@@ -60,13 +64,12 @@ var Button = function Button(_ref) {
60
64
  return /*#__PURE__*/React.createElement("div", {
61
65
  className: classNames("".concat(prefix, "button-container"))
62
66
  }, /*#__PURE__*/React.createElement("div", {
63
- className: classNames("".concat(prefix, "button"), _defineProperty({}, "".concat(prefix, "active"), tooltipOpen || popoverMount)),
67
+ className: classNames("".concat(prefix, "button"), (_classNames = {}, _defineProperty(_classNames, "".concat(prefix, "disabled"), disabled), _defineProperty(_classNames, "".concat(prefix, "active"), tooltipOpen || popoverMount), _classNames)),
64
68
  onClick: function onClick() {
65
- setPopoverOpen(true);
66
- _onClick === null || _onClick === void 0 ? void 0 : _onClick();
67
- },
68
- onMouseDown: function onMouseDown(e) {
69
- return e.preventDefault();
69
+ if (!disabled) {
70
+ setPopoverOpen(true);
71
+ _onClick === null || _onClick === void 0 ? void 0 : _onClick();
72
+ }
70
73
  },
71
74
  onMouseEnter: function onMouseEnter() {
72
75
  return setTooltipOpen(true);
@@ -74,49 +77,32 @@ var Button = function Button(_ref) {
74
77
  onMouseLeave: function onMouseLeave() {
75
78
  return setTooltipOpen(false);
76
79
  }
77
- }, children, tooltipMount && /*#__PURE__*/React.createElement("div", {
80
+ }, children), /*#__PURE__*/React.createElement(Fade, {
81
+ nodeRef: tooltipRef,
82
+ appear: tooltipMount,
83
+ timeout: 300
84
+ }, /*#__PURE__*/React.createElement("div", {
85
+ ref: tooltipRef,
78
86
  className: classNames("".concat(prefix, "tooltip"))
79
- }, tooltip)), popoverMount && /*#__PURE__*/React.createElement("div", {
87
+ }, tooltip)), /*#__PURE__*/React.createElement(Fade, {
88
+ nodeRef: popoverRef,
89
+ appear: popoverMount,
90
+ timeout: 300
91
+ }, /*#__PURE__*/React.createElement("div", {
80
92
  ref: popoverRef,
81
93
  className: classNames("".concat(prefix, "popover"))
82
- }, popover));
94
+ }, popover)));
83
95
  };
84
- export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsertFile) {
96
+ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap() {
97
+ var locale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
98
+ var onInsertFile = arguments.length > 1 ? arguments[1] : undefined;
99
+ var t = getFormat(locale, 'toolbarItem');
85
100
  return {
86
- heading: {
87
- children: 'H',
88
- tooltip: '标题',
89
- popoverRender: function popoverRender(exec, close) {
90
- var optionRender = function optionRender(depth, fontSize) {
91
- return /*#__PURE__*/React.createElement("div", {
92
- className: classNames("".concat(prefix, "option")),
93
- style: {
94
- fontSize: fontSize
95
- },
96
- onClick: function onClick() {
97
- exec(toggleHandler({
98
- type: 'heading',
99
- depth: depth
100
- }));
101
- close();
102
- }
103
- }, "\u6807\u9898 ", depth);
104
- };
105
- return /*#__PURE__*/React.createElement(React.Fragment, null, optionRender(1, '1.6em'), optionRender(2, '1.3em'), optionRender(3, '1.2em'), optionRender(4, '1.1em'), optionRender(5, '1.0em'), optionRender(6, '0.9em'));
106
- }
107
- },
108
- thematicBreak: {
109
- children: '—',
110
- tooltip: '分隔线',
111
- onClick: function onClick(exec) {
112
- return exec(toggleHandler({
113
- type: 'thematicBreak'
114
- }));
115
- }
116
- },
117
101
  blockquote: {
118
- children: '『』',
119
- tooltip: '引用',
102
+ children: /*#__PURE__*/React.createElement("div", {
103
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "blockquote"))
104
+ }),
105
+ tooltip: t('blockquote'),
120
106
  onClick: function onClick(exec) {
121
107
  return exec(toggleHandler({
122
108
  type: 'blockquote'
@@ -125,9 +111,9 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
125
111
  },
126
112
  code: {
127
113
  children: /*#__PURE__*/React.createElement("div", {
128
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "code-library"))
114
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "code"))
129
115
  }),
130
- tooltip: '代码块',
116
+ tooltip: t('code'),
131
117
  popoverRender: function popoverRender(exec, close) {
132
118
  var optionRender = function optionRender(label, language) {
133
119
  return /*#__PURE__*/React.createElement("div", {
@@ -144,44 +130,57 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
144
130
  return /*#__PURE__*/React.createElement(React.Fragment, null, optionRender('C++', 'cpp'), optionRender('Java', 'java'), optionRender('Python', 'py'), optionRender('Text', 'txt'));
145
131
  }
146
132
  },
147
- emphasis: {
133
+ delete: {
148
134
  children: /*#__PURE__*/React.createElement("div", {
149
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "italic"))
135
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "delete"))
150
136
  }),
151
- tooltip: '斜体',
137
+ tooltip: t('delete'),
152
138
  onClick: function onClick(exec) {
153
139
  return exec(toggleHandler({
154
- type: 'emphasis'
140
+ type: 'delete'
155
141
  }));
156
142
  }
157
143
  },
158
- strong: {
144
+ emphasis: {
159
145
  children: /*#__PURE__*/React.createElement("div", {
160
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "bold"))
146
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "emphasis"))
161
147
  }),
162
- tooltip: '粗体',
148
+ tooltip: t('emphasis'),
163
149
  onClick: function onClick(exec) {
164
150
  return exec(toggleHandler({
165
- type: 'strong'
151
+ type: 'emphasis'
166
152
  }));
167
153
  }
168
154
  },
169
- inlineCode: {
155
+ heading: {
170
156
  children: /*#__PURE__*/React.createElement("div", {
171
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "code"))
157
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "heading"))
172
158
  }),
173
- tooltip: '行内代码',
174
- onClick: function onClick(exec) {
175
- return exec(toggleHandler({
176
- type: 'inlineCode'
177
- }));
159
+ tooltip: t('heading'),
160
+ popoverRender: function popoverRender(exec, close) {
161
+ var optionRender = function optionRender(depth, fontSize) {
162
+ return /*#__PURE__*/React.createElement("div", {
163
+ className: classNames("".concat(prefix, "option")),
164
+ style: {
165
+ fontSize: fontSize
166
+ },
167
+ onClick: function onClick() {
168
+ exec(toggleHandler({
169
+ type: 'heading',
170
+ depth: depth
171
+ }));
172
+ close();
173
+ }
174
+ }, "H", depth, " ", t('heading'), " ", depth);
175
+ };
176
+ return /*#__PURE__*/React.createElement(React.Fragment, null, optionRender(1, '1.6em'), optionRender(2, '1.3em'), optionRender(3, '1.2em'), optionRender(4, '1.1em'), optionRender(5, '1em'), optionRender(6, '0.9em'));
178
177
  }
179
178
  },
180
- link: {
179
+ image: {
181
180
  children: /*#__PURE__*/React.createElement("div", {
182
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "link"))
181
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "image"))
183
182
  }),
184
- tooltip: '链接',
183
+ tooltip: t('image'),
185
184
  popoverRender: function popoverRender(exec, close) {
186
185
  return /*#__PURE__*/React.createElement(FileInput, {
187
186
  onCancel: close,
@@ -189,11 +188,11 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
189
188
  if (data.type === 'file') {
190
189
  onInsertFile === null || onInsertFile === void 0 ? void 0 : onInsertFile(data.file, {
191
190
  description: data.description,
192
- image: false
191
+ image: true
193
192
  });
194
193
  } else {
195
194
  exec(toggleHandler({
196
- type: 'link',
195
+ type: 'image',
197
196
  url: data.url,
198
197
  description: data.description
199
198
  }));
@@ -203,11 +202,33 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
203
202
  });
204
203
  }
205
204
  },
206
- image: {
205
+ inlineCode: {
207
206
  children: /*#__PURE__*/React.createElement("div", {
208
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "image"))
207
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "inline-code"))
208
+ }),
209
+ tooltip: t('inlineCode'),
210
+ onClick: function onClick(exec) {
211
+ return exec(toggleHandler({
212
+ type: 'inlineCode'
213
+ }));
214
+ }
215
+ },
216
+ inlineMath: {
217
+ children: /*#__PURE__*/React.createElement("div", {
218
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "inline-math"))
209
219
  }),
210
- tooltip: '图片',
220
+ tooltip: t('inlineMath'),
221
+ onClick: function onClick(exec) {
222
+ return exec(toggleHandler({
223
+ type: 'inlineMath'
224
+ }));
225
+ }
226
+ },
227
+ link: {
228
+ children: /*#__PURE__*/React.createElement("div", {
229
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "link"))
230
+ }),
231
+ tooltip: t('link'),
211
232
  popoverRender: function popoverRender(exec, close) {
212
233
  return /*#__PURE__*/React.createElement(FileInput, {
213
234
  onCancel: close,
@@ -215,11 +236,11 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
215
236
  if (data.type === 'file') {
216
237
  onInsertFile === null || onInsertFile === void 0 ? void 0 : onInsertFile(data.file, {
217
238
  description: data.description,
218
- image: true
239
+ image: false
219
240
  });
220
241
  } else {
221
242
  exec(toggleHandler({
222
- type: 'image',
243
+ type: 'link',
223
244
  url: data.url,
224
245
  description: data.description
225
246
  }));
@@ -229,47 +250,80 @@ export var getDefaultToolbarItemMap = function getDefaultToolbarItemMap(onInsert
229
250
  });
230
251
  }
231
252
  },
232
- delete: {
253
+ math: {
233
254
  children: /*#__PURE__*/React.createElement("div", {
234
- className: classNames("".concat(prefix, "icon"), "".concat(prefix, "strikethrough"))
255
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "math"))
235
256
  }),
236
- tooltip: '删除线',
257
+ tooltip: t('math'),
237
258
  onClick: function onClick(exec) {
238
259
  return exec(toggleHandler({
239
- type: 'delete'
260
+ type: 'math'
240
261
  }));
241
262
  }
242
263
  },
243
- math: {
244
- children: 'π',
245
- tooltip: '公式块',
264
+ redo: function redo(_ref2) {
265
+ var history = _ref2.history;
266
+ return {
267
+ children: /*#__PURE__*/React.createElement("div", {
268
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "redo"))
269
+ }),
270
+ disabled: history.index === history.states.length - 1,
271
+ tooltip: t('redo'),
272
+ onClick: function onClick(exec) {
273
+ return exec(redoHandler());
274
+ }
275
+ };
276
+ },
277
+ strong: {
278
+ children: /*#__PURE__*/React.createElement("div", {
279
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "strong"))
280
+ }),
281
+ tooltip: t('strong'),
246
282
  onClick: function onClick(exec) {
247
283
  return exec(toggleHandler({
248
- type: 'math'
284
+ type: 'strong'
249
285
  }));
250
286
  }
251
287
  },
252
- inlineMath: {
253
- children: '𝑥',
254
- tooltip: '行内公式',
288
+ thematicBreak: {
289
+ children: /*#__PURE__*/React.createElement("div", {
290
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "thematic-break"))
291
+ }),
292
+ tooltip: t('thematicBreak'),
255
293
  onClick: function onClick(exec) {
256
294
  return exec(toggleHandler({
257
- type: 'inlineMath'
295
+ type: 'thematicBreak'
258
296
  }));
259
297
  }
298
+ },
299
+ undo: function undo(_ref3) {
300
+ var history = _ref3.history;
301
+ return {
302
+ children: /*#__PURE__*/React.createElement("div", {
303
+ className: classNames("".concat(prefix, "icon"), "".concat(prefix, "undo"))
304
+ }),
305
+ disabled: !history.index,
306
+ tooltip: t('undo'),
307
+ onClick: function onClick(exec) {
308
+ return exec(undoHandler());
309
+ }
310
+ };
260
311
  }
261
312
  };
262
313
  };
263
314
  export var getDefaultToolbarItems = function getDefaultToolbarItems() {
264
- return [['heading', 'strong', 'emphasis', 'delete'], ['thematicBreak', 'blockquote'], ['link', 'image'], ['inlineCode', 'code', 'inlineMath', 'math']];
315
+ return [['heading', 'strong', 'emphasis', 'delete'], ['thematicBreak', 'blockquote'], ['link', 'image'], ['inlineCode', 'code', 'inlineMath', 'math'], ['undo', 'redo']];
265
316
  };
266
- var Toolbar = function Toolbar(_ref2) {
267
- var className = _ref2.className,
268
- style = _ref2.style,
269
- itemMap = _ref2.itemMap,
270
- items = _ref2.items,
271
- exec = _ref2.exec;
317
+ var Toolbar = function Toolbar(_ref4) {
318
+ var className = _ref4.className,
319
+ style = _ref4.style,
320
+ itemMap = _ref4.itemMap,
321
+ items = _ref4.items,
322
+ exec = _ref4.exec;
272
323
  var toolbarRef = useRef(null);
324
+ var ctx = exec(function (ctx) {
325
+ return ctx;
326
+ });
273
327
  return /*#__PURE__*/React.createElement("div", {
274
328
  ref: toolbarRef,
275
329
  className: classNames("".concat(prefix, "toolbar"), className),
@@ -284,13 +338,16 @@ var Toolbar = function Toolbar(_ref2) {
284
338
  if (!toolbarItem) {
285
339
  return undefined;
286
340
  }
287
- var children = toolbarItem.children,
288
- tooltip = toolbarItem.tooltip,
289
- _popoverRender = toolbarItem.popoverRender,
290
- _onClick2 = toolbarItem.onClick;
341
+ var _ref5 = typeof toolbarItem === 'function' ? toolbarItem(ctx) : toolbarItem,
342
+ children = _ref5.children,
343
+ disabled = _ref5.disabled,
344
+ tooltip = _ref5.tooltip,
345
+ _popoverRender = _ref5.popoverRender,
346
+ _onClick2 = _ref5.onClick;
291
347
  return /*#__PURE__*/React.createElement(Button, {
292
348
  key: index,
293
349
  toolbarRef: toolbarRef,
350
+ disabled: disabled,
294
351
  tooltip: tooltip,
295
352
  popoverRender: function popoverRender(close) {
296
353
  return _popoverRender === null || _popoverRender === void 0 ? void 0 : _popoverRender(exec, close);
package/dist/index.d.ts CHANGED
@@ -1,10 +1,10 @@
1
- export { default as XStarEditor, useEditorRef } from './XStarEditor';
2
- export type { XStarEditorHandle, XStarEditorProps } from './XStarEditor';
3
- export { default as XStarMdEditor, useMdEditorRef } from './XStarMdEditor';
4
- export type { XStarMdEditorHandle, XStarMdEditorPlugin, XStarMdEditorProps, } from './XStarMdEditor';
5
- export { default as XStarMdViewer, useMdViewerRef } from './XStarMdViewer';
6
- export type { XStarMdViewerHandle, XStarMdViewerPlugin, XStarMdViewerProps, } from './XStarMdViewer';
7
1
  export { createSelection, getRange } from './utils/container';
8
2
  export { deleteHandler, insertHandler, redoHandler, selectHandler, setHandler, toggleHandler, undoHandler, } from './utils/handler';
9
3
  export type { Handler } from './utils/handler';
10
- export { toHTML, toMarkdown } from './utils/markdown';
4
+ export { toHTML, toMarkdown, toText } from './utils/markdown';
5
+ export { default as XStarEditor, useEditorRef } from './x-star-editor';
6
+ export type { XStarEditorHandle, XStarEditorProps } from './x-star-editor';
7
+ export { default as XStarMdEditor, useMdEditorRef } from './x-star-md-editor';
8
+ export type { XStarMdEditorHandle, XStarMdEditorPlugin, XStarMdEditorProps, } from './x-star-md-editor';
9
+ export { default as XStarMdViewer, useMdViewerRef } from './x-star-md-viewer';
10
+ export type { XStarMdViewerHandle, XStarMdViewerPlugin, XStarMdViewerProps, } from './x-star-md-viewer';
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
- export { default as XStarEditor, useEditorRef } from "./XStarEditor";
2
- export { default as XStarMdEditor, useMdEditorRef } from "./XStarMdEditor";
3
- export { default as XStarMdViewer, useMdViewerRef } from "./XStarMdViewer";
4
1
  export { createSelection, getRange } from "./utils/container";
5
2
  export { deleteHandler, insertHandler, redoHandler, selectHandler, setHandler, toggleHandler, undoHandler } from "./utils/handler";
6
- export { toHTML, toMarkdown } from "./utils/markdown";
3
+ export { toHTML, toMarkdown, toText } from "./utils/markdown";
4
+ export { default as XStarEditor, useEditorRef } from "./x-star-editor";
5
+ export { default as XStarMdEditor, useMdEditorRef } from "./x-star-md-editor";
6
+ export { default as XStarMdViewer, useMdViewerRef } from "./x-star-md-viewer";
@@ -0,0 +1,27 @@
1
+ declare const _default: {
2
+ readonly fileInput: {
3
+ readonly cancel: "Cancel";
4
+ readonly chooseFile: "Choose File";
5
+ readonly confirm: "Confirm";
6
+ readonly description: "Description";
7
+ readonly file: "File";
8
+ readonly url: "URL";
9
+ };
10
+ readonly toolbarItem: {
11
+ readonly blockquote: "Blockquote";
12
+ readonly code: "Code Block";
13
+ readonly delete: "Strikethrough";
14
+ readonly emphasis: "Italic";
15
+ readonly heading: "Heading";
16
+ readonly image: "Image";
17
+ readonly inlineCode: "Inline Code";
18
+ readonly inlineMath: "Inline Formula";
19
+ readonly link: "Link";
20
+ readonly math: "Formula Block";
21
+ readonly redo: "Redo";
22
+ readonly strong: "Bold";
23
+ readonly thematicBreak: "Thematic Break";
24
+ readonly undo: "Undo";
25
+ };
26
+ };
27
+ export default _default;
@@ -0,0 +1,26 @@
1
+ export default {
2
+ fileInput: {
3
+ cancel: 'Cancel',
4
+ chooseFile: 'Choose File',
5
+ confirm: 'Confirm',
6
+ description: 'Description',
7
+ file: 'File',
8
+ url: 'URL'
9
+ },
10
+ toolbarItem: {
11
+ blockquote: 'Blockquote',
12
+ code: 'Code Block',
13
+ delete: 'Strikethrough',
14
+ emphasis: 'Italic',
15
+ heading: 'Heading',
16
+ image: 'Image',
17
+ inlineCode: 'Inline Code',
18
+ inlineMath: 'Inline Formula',
19
+ link: 'Link',
20
+ math: 'Formula Block',
21
+ redo: 'Redo',
22
+ strong: 'Bold',
23
+ thematicBreak: 'Thematic Break',
24
+ undo: 'Undo'
25
+ }
26
+ };