@modusoperandi/licit 0.13.1 → 0.13.2

package/src/ui/EditorToolbarConfig.js

@@ -1,172 +1,172 @@
-// @flow
-
-// eslint-disable-next-line no-unused-vars
-import * as React from 'react';
-
-import * as EditorCommands from '../EditorCommands';
-import FontSizeCommandMenuButton from './FontSizeCommandMenuButton';
-import FontTypeCommandMenuButton from './FontTypeCommandMenuButton';
-import ListTypeCommandButton from './ListTypeCommandButton';
-import Icon from './Icon';
-
-const ICON_LABEL_PATTERN = /\[([A-Za-z_\d]+)\](.*)/;
-
-export function parseLabel(input: string): Object {
-  const matched = input.match(ICON_LABEL_PATTERN);
-  if (matched) {
-    const [
-      // eslint-disable-next-line no-unused-vars
-      all,
-      icon,
-      label,
-    ] = matched;
-    return {
-      icon: icon ? Icon.get(icon) : null,
-      title: label || null,
-    };
-  }
-  return {
-    icon: null,
-    title: input || null,
-  };
-}
-
-const {
-  // [FS][07-MAY-2020][IRAD-956]
-  // BLOCKQUOTE_TOGGLE,
-  CLEAR_FORMAT,
-  DOC_LAYOUT,
-  EM,
-  HISTORY_REDO,
-  HISTORY_UNDO,
-  HR,
-  IMAGE_FROM_URL,
-  IMAGE_UPLOAD,
-  INDENT_LESS,
-  INDENT_MORE,
-  LINK_SET_URL,
-  MATH_EDIT,
-  STRIKE,
-  STRONG,
-  SUPER,
-  SUB,
-  TABLE_ADD_COLUMN_AFTER,
-  TABLE_ADD_COLUMN_BEFORE,
-  TABLE_ADD_ROW_AFTER,
-  TABLE_ADD_ROW_BEFORE,
-  TABLE_BORDER_COLOR,
-  TABLE_BACKGROUND_COLOR,
-  TABLE_DELETE_COLUMN,
-  TABLE_DELETE_ROW,
-  TABLE_DELETE_TABLE,
-  TABLE_INSERT_TABLE,
-  TABLE_MERGE_CELLS,
-  TABLE_SPLIT_ROW,
-  TABLE_TOGGLE_HEADER_CELL,
-  TABLE_TOGGLE_HEADER_COLUMN,
-  TABLE_TOGGLE_HEADER_ROW,
-  TEXT_ALIGN_CENTER,
-  TEXT_ALIGN_JUSTIFY,
-  TEXT_ALIGN_LEFT,
-  TEXT_ALIGN_RIGHT,
-  TEXT_COLOR,
-  TEXT_HIGHLIGHT,
-  TEXT_LINE_SPACINGS,
-  UL,
-  UNDERLINE,
-} = EditorCommands;
-
-export const TABLE_COMMANDS_GROUP = [
-  {
-    'Insert Table...': TABLE_INSERT_TABLE,
-  },
-  {
-    'Fill Color...': TABLE_BACKGROUND_COLOR,
-    'Border Color....': TABLE_BORDER_COLOR,
-  },
-  {
-    'Insert Column Before': TABLE_ADD_COLUMN_BEFORE,
-    'Insert Column After': TABLE_ADD_COLUMN_AFTER,
-    'Delete Column': TABLE_DELETE_COLUMN,
-  },
-  {
-    'Insert Row Before': TABLE_ADD_ROW_BEFORE,
-    'Insert Row After': TABLE_ADD_ROW_AFTER,
-    'Delete Row': TABLE_DELETE_ROW,
-  },
-  {
-    'Merge Cells': TABLE_MERGE_CELLS,
-    'Split Row': TABLE_SPLIT_ROW,
-  },
-  // Disable these commands cause user rarely use them.
-  {
-    'Toggle Header Column': TABLE_TOGGLE_HEADER_COLUMN,
-    'Toggle Header Row': TABLE_TOGGLE_HEADER_ROW,
-    'Toggle Header Cells': TABLE_TOGGLE_HEADER_CELL,
-  },
-  {
-    'Delete Table': TABLE_DELETE_TABLE,
-  },
-];
-
-// [FS] IRAD-1012 2020-07-14
-// Fix: Toolbar is poorly organized.
-
-export const COMMAND_GROUPS = [
-  {
-    '[font_download] Font Type': FontTypeCommandMenuButton,
-  },
-  {
-    '[format_size] Text Size': FontSizeCommandMenuButton,
-  },
-  {
-    '[format_bold] Bold': STRONG,
-    '[format_italic] Italic': EM,
-    '[format_underline] Underline': UNDERLINE,
-    '[format_strikethrough] Strike through': STRIKE,
-    '[superscript] Superscript': SUPER,
-    '[subscript] Subscript': SUB,
-    '[format_color_text] Text color': TEXT_COLOR,
-    '[border_color] Highlight color': TEXT_HIGHLIGHT,
-    '[format_clear] Clear formats': CLEAR_FORMAT,
-  },
-  {
-    '[format_align_left] Left align': TEXT_ALIGN_LEFT,
-    '[format_align_center] Center Align': TEXT_ALIGN_CENTER,
-    '[format_align_right] Right Align': TEXT_ALIGN_RIGHT,
-    '[format_align_justify] Justify': TEXT_ALIGN_JUSTIFY,
-  },
-  {
-    '[format_indent_increase] Indent more': INDENT_MORE,
-    '[format_indent_decrease] Indent less': INDENT_LESS,
-    '[format_line_spacing] Line spacing': TEXT_LINE_SPACINGS,
-  },
-  {
-    // [FS] IRAD-1039 2020-09-23
-    // Added new command button that brings a popup
-    '[format_list_numbered] Ordered list': ListTypeCommandButton,
-    '[format_list_bulleted] Bulleted list': UL,
-  },
-  {
-    '[link] Apply link': LINK_SET_URL,
-    '[image] Insert image': [
-      {
-        'Insert image by URL': IMAGE_FROM_URL,
-        'Upload image from computer': IMAGE_UPLOAD,
-      },
-    ],
-    '[grid_on] Table...': TABLE_COMMANDS_GROUP,
-    '[hr] Horizontal line': HR,
-    '[functions] Math': MATH_EDIT,
-
-    // [FS][07-MAY-2020][IRAD-956]
-    // '[format_quote] Block quote': BLOCKQUOTE_TOGGLE,
-  },
-  {
-    '[settings_overscan] Page layout': DOC_LAYOUT,
-  },
-  {
-    '[undo] Undo': HISTORY_UNDO,
-    '[redo] Redo': HISTORY_REDO,
-  },
-];
+// @flow
+
+// eslint-disable-next-line no-unused-vars
+import * as React from 'react';
+
+import * as EditorCommands from '../EditorCommands';
+import FontSizeCommandMenuButton from './FontSizeCommandMenuButton';
+import FontTypeCommandMenuButton from './FontTypeCommandMenuButton';
+import ListTypeCommandButton from './ListTypeCommandButton';
+import Icon from './Icon';
+
+const ICON_LABEL_PATTERN = /\[([A-Za-z_\d]+)\](.*)/;
+
+export function parseLabel(input: string): Object {
+  const matched = input.match(ICON_LABEL_PATTERN);
+  if (matched) {
+    const [
+      // eslint-disable-next-line no-unused-vars
+      all,
+      icon,
+      label,
+    ] = matched;
+    return {
+      icon: icon ? Icon.get(icon) : null,
+      title: label || null,
+    };
+  }
+  return {
+    icon: null,
+    title: input || null,
+  };
+}
+
+const {
+  // [FS][07-MAY-2020][IRAD-956]
+  // BLOCKQUOTE_TOGGLE,
+  CLEAR_FORMAT,
+  DOC_LAYOUT,
+  EM,
+  HISTORY_REDO,
+  HISTORY_UNDO,
+  HR,
+  IMAGE_FROM_URL,
+  IMAGE_UPLOAD,
+  INDENT_LESS,
+  INDENT_MORE,
+  LINK_SET_URL,
+  MATH_EDIT,
+  STRIKE,
+  STRONG,
+  SUPER,
+  SUB,
+  TABLE_ADD_COLUMN_AFTER,
+  TABLE_ADD_COLUMN_BEFORE,
+  TABLE_ADD_ROW_AFTER,
+  TABLE_ADD_ROW_BEFORE,
+  TABLE_BORDER_COLOR,
+  TABLE_BACKGROUND_COLOR,
+  TABLE_DELETE_COLUMN,
+  TABLE_DELETE_ROW,
+  TABLE_DELETE_TABLE,
+  TABLE_INSERT_TABLE,
+  TABLE_MERGE_CELLS,
+  TABLE_SPLIT_ROW,
+  TABLE_TOGGLE_HEADER_CELL,
+  TABLE_TOGGLE_HEADER_COLUMN,
+  TABLE_TOGGLE_HEADER_ROW,
+  TEXT_ALIGN_CENTER,
+  TEXT_ALIGN_JUSTIFY,
+  TEXT_ALIGN_LEFT,
+  TEXT_ALIGN_RIGHT,
+  TEXT_COLOR,
+  TEXT_HIGHLIGHT,
+  TEXT_LINE_SPACINGS,
+  UL,
+  UNDERLINE,
+} = EditorCommands;
+
+export const TABLE_COMMANDS_GROUP = [
+  {
+    'Insert Table...': TABLE_INSERT_TABLE,
+  },
+  {
+    'Fill Color...': TABLE_BACKGROUND_COLOR,
+    'Border Color....': TABLE_BORDER_COLOR,
+  },
+  {
+    'Insert Column Before': TABLE_ADD_COLUMN_BEFORE,
+    'Insert Column After': TABLE_ADD_COLUMN_AFTER,
+    'Delete Column': TABLE_DELETE_COLUMN,
+  },
+  {
+    'Insert Row Before': TABLE_ADD_ROW_BEFORE,
+    'Insert Row After': TABLE_ADD_ROW_AFTER,
+    'Delete Row': TABLE_DELETE_ROW,
+  },
+  {
+    'Merge Cells': TABLE_MERGE_CELLS,
+    'Split Row': TABLE_SPLIT_ROW,
+  },
+  // Disable these commands cause user rarely use them.
+  {
+    'Toggle Header Column': TABLE_TOGGLE_HEADER_COLUMN,
+    'Toggle Header Row': TABLE_TOGGLE_HEADER_ROW,
+    'Toggle Header Cells': TABLE_TOGGLE_HEADER_CELL,
+  },
+  {
+    'Delete Table': TABLE_DELETE_TABLE,
+  },
+];
+
+// [FS] IRAD-1012 2020-07-14
+// Fix: Toolbar is poorly organized.
+
+export const COMMAND_GROUPS = [
+  {
+    '[font_download] Font Type': FontTypeCommandMenuButton,
+  },
+  {
+    '[format_size] Text Size': FontSizeCommandMenuButton,
+  },
+  {
+    '[format_bold] Bold': STRONG,
+    '[format_italic] Italic': EM,
+    '[format_underline] Underline': UNDERLINE,
+    '[format_strikethrough] Strike through': STRIKE,
+    '[superscript] Superscript': SUPER,
+    '[subscript] Subscript': SUB,
+    '[format_color_text] Text color': TEXT_COLOR,
+    '[border_color] Highlight color': TEXT_HIGHLIGHT,
+    '[format_clear] Clear formats': CLEAR_FORMAT,
+  },
+  {
+    '[format_align_left] Left align': TEXT_ALIGN_LEFT,
+    '[format_align_center] Center Align': TEXT_ALIGN_CENTER,
+    '[format_align_right] Right Align': TEXT_ALIGN_RIGHT,
+    '[format_align_justify] Justify': TEXT_ALIGN_JUSTIFY,
+  },
+  {
+    '[format_indent_increase] Indent more': INDENT_MORE,
+    '[format_indent_decrease] Indent less': INDENT_LESS,
+    '[format_line_spacing] Line spacing': TEXT_LINE_SPACINGS,
+  },
+  {
+    // [FS] IRAD-1039 2020-09-23
+    // Added new command button that brings a popup
+    '[format_list_numbered] Ordered list': ListTypeCommandButton,
+    '[format_list_bulleted] Bulleted list': UL,
+  },
+  {
+    '[link] Apply link': LINK_SET_URL,
+    '[image] Insert image': [
+      {
+        'Insert image by URL': IMAGE_FROM_URL,
+        'Upload image from computer': IMAGE_UPLOAD,
+      },
+    ],
+    '[grid_on] Table...': TABLE_COMMANDS_GROUP,
+    '[hr] Horizontal line': HR,
+    '[functions] Math': MATH_EDIT,
+
+    // [FS][07-MAY-2020][IRAD-956]
+    // '[format_quote] Block quote': BLOCKQUOTE_TOGGLE,
+  },
+  {
+    '[settings_overscan] Page layout': DOC_LAYOUT,
+  },
+  {
+    '[undo] Undo': HISTORY_UNDO,
+    '[redo] Redo': HISTORY_REDO,
+  },
+];

package/src/ui/FontSizeCommandMenuButton.js

@@ -1,66 +1,66 @@
-// @flow
-
-import { EditorState } from 'prosemirror-state';
-import { Transform } from 'prosemirror-transform';
-import { EditorView } from 'prosemirror-view';
-import * as React from 'react';
-
-import FontSizeCommand from '../FontSizeCommand';
-import CommandMenuButton from './CommandMenuButton';
-import findActiveFontSize from './findActiveFontSize';
-
-export const FONT_PT_SIZES = [
-  8,
-  9,
-  10,
-  11,
-  12,
-  14,
-  18,
-  24,
-  30,
-  36,
-  48,
-  60,
-  72,
-  90,
-];
-
-const FONT_PT_SIZE_COMMANDS = FONT_PT_SIZES.reduce((memo, size) => {
-  memo[` ${size} `] = new FontSizeCommand(size);
-  return memo;
-}, {});
-
-const COMMAND_GROUPS = [
-  { Default: new FontSizeCommand(0) },
-  FONT_PT_SIZE_COMMANDS,
-];
-
-class FontSizeCommandMenuButton extends React.PureComponent<any, any> {
-  props: {
-    dispatch: (tr: Transform) => void,
-    editorState: EditorState,
-    editorView: ?EditorView,
-  };
-
-  render(): React.Element<any> {
-    const { dispatch, editorState, editorView } = this.props;
-    const fontSize = findActiveFontSize(editorState);
-    const className = String(fontSize).length <= 2 ? 'width-30' : 'width-60';
-    return (
-      <CommandMenuButton
-        className={className}
-        // [FS] IRAD-1008 2020-07-16
-        // Disable font size menu on editor disable state
-        commandGroups={COMMAND_GROUPS}
-        disabled={editorView && editorView.disabled ? true : false}
-        dispatch={dispatch}
-        editorState={editorState}
-        editorView={editorView}
-        label={fontSize}
-      />
-    );
-  }
-}
-
-export default FontSizeCommandMenuButton;
+// @flow
+
+import { EditorState } from 'prosemirror-state';
+import { Transform } from 'prosemirror-transform';
+import { EditorView } from 'prosemirror-view';
+import * as React from 'react';
+
+import {FontSizeCommand} from '@modusoperandi/licit-ui-commands';
+import CommandMenuButton from './CommandMenuButton';
+import findActiveFontSize from './findActiveFontSize';
+
+export const FONT_PT_SIZES = [
+  8,
+  9,
+  10,
+  11,
+  12,
+  14,
+  18,
+  24,
+  30,
+  36,
+  48,
+  60,
+  72,
+  90,
+];
+
+const FONT_PT_SIZE_COMMANDS = FONT_PT_SIZES.reduce((memo, size) => {
+  memo[` ${size} `] = new FontSizeCommand(size);
+  return memo;
+}, {});
+
+const COMMAND_GROUPS = [
+  { Default: new FontSizeCommand(0) },
+  FONT_PT_SIZE_COMMANDS,
+];
+
+class FontSizeCommandMenuButton extends React.PureComponent<any, any> {
+  props: {
+    dispatch: (tr: Transform) => void,
+    editorState: EditorState,
+    editorView: ?EditorView,
+  };
+
+  render(): React.Element<any> {
+    const { dispatch, editorState, editorView } = this.props;
+    const fontSize = findActiveFontSize(editorState);
+    const className = String(fontSize).length <= 2 ? 'width-30' : 'width-60';
+    return (
+      <CommandMenuButton
+        className={className}
+        // [FS] IRAD-1008 2020-07-16
+        // Disable font size menu on editor disable state
+        commandGroups={COMMAND_GROUPS}
+        disabled={editorView && editorView.disabled ? true : false}
+        dispatch={dispatch}
+        editorState={editorState}
+        editorView={editorView}
+        label={fontSize}
+      />
+    );
+  }
+}
+
+export default FontSizeCommandMenuButton;

package/src/ui/FontTypeCommandMenuButton.js

@@ -1,49 +1,49 @@
-// @flow
-
-import CommandMenuButton from './CommandMenuButton';
-import FontTypeCommand from '../FontTypeCommand';
-import * as React from 'react';
-import findActiveFontType from './findActiveFontType';
-import { EditorState } from 'prosemirror-state';
-import { EditorView } from 'prosemirror-view';
-import { FONT_TYPE_NAMES } from '../FontTypeMarkSpec';
-import { FONT_TYPE_NAME_DEFAULT } from './findActiveFontType';
-import { Transform } from 'prosemirror-transform';
-
-const FONT_TYPE_COMMANDS: Object = {
-  [FONT_TYPE_NAME_DEFAULT]: new FontTypeCommand(''),
-};
-
-FONT_TYPE_NAMES.forEach((name) => {
-  FONT_TYPE_COMMANDS[name] = new FontTypeCommand(name);
-});
-
-const COMMAND_GROUPS = [FONT_TYPE_COMMANDS];
-
-class FontTypeCommandMenuButton extends React.PureComponent<any, any> {
-  props: {
-    dispatch: (tr: Transform) => void,
-    editorState: EditorState,
-    editorView: ?EditorView,
-  };
-
-  render(): React.Element<any> {
-    const { dispatch, editorState, editorView } = this.props;
-    const fontType = findActiveFontType(editorState);
-    return (
-      <CommandMenuButton
-        className="width-100"
-        // [FS] IRAD-1008 2020-07-16
-        // Disable font type menu on editor disable state
-        commandGroups={COMMAND_GROUPS}
-        disabled={editorView && editorView.disabled ? true : false}
-        dispatch={dispatch}
-        editorState={editorState}
-        editorView={editorView}
-        label={fontType}
-      />
-    );
-  }
-}
-
-export default FontTypeCommandMenuButton;
+// @flow
+
+import CommandMenuButton from './CommandMenuButton';
+import {FontTypeCommand} from '@modusoperandi/licit-ui-commands';
+import * as React from 'react';
+import findActiveFontType from './findActiveFontType';
+import { EditorState } from 'prosemirror-state';
+import { EditorView } from 'prosemirror-view';
+import { FONT_TYPE_NAMES } from '../FontTypeMarkSpec';
+import { FONT_TYPE_NAME_DEFAULT } from './findActiveFontType';
+import { Transform } from 'prosemirror-transform';
+
+const FONT_TYPE_COMMANDS: Object = {
+  [FONT_TYPE_NAME_DEFAULT]: new FontTypeCommand(''),
+};
+
+FONT_TYPE_NAMES.forEach((name) => {
+  FONT_TYPE_COMMANDS[name] = new FontTypeCommand(name);
+});
+
+const COMMAND_GROUPS = [FONT_TYPE_COMMANDS];
+
+class FontTypeCommandMenuButton extends React.PureComponent<any, any> {
+  props: {
+    dispatch: (tr: Transform) => void,
+    editorState: EditorState,
+    editorView: ?EditorView,
+  };
+
+  render(): React.Element<any> {
+    const { dispatch, editorState, editorView } = this.props;
+    const fontType = findActiveFontType(editorState);
+    return (
+      <CommandMenuButton
+        className="width-100"
+        // [FS] IRAD-1008 2020-07-16
+        // Disable font type menu on editor disable state
+        commandGroups={COMMAND_GROUPS}
+        disabled={editorView && editorView.disabled ? true : false}
+        dispatch={dispatch}
+        editorState={editorState}
+        editorView={editorView}
+        label={fontType}
+      />
+    );
+  }
+}
+
+export default FontTypeCommandMenuButton;

package/src/ui/Frag.js

@@ -1,13 +1,13 @@
-// @flow
-
-import * as React from 'react';
-
-import './czi-frag.css';
-
-class Frag extends React.PureComponent<any, any> {
-  render(): React.Element<any> {
-    return <div className="czi-frag">{this.props.children}</div>;
-  }
-}
-
-export default Frag;
+// @flow
+
+import * as React from 'react';
+
+import './czi-frag.css';
+
+class Frag extends React.PureComponent<any, any> {
+  render(): React.Element<any> {
+    return <div className="czi-frag">{this.props.children}</div>;
+  }
+}
+
+export default Frag;