@modusoperandi/licit 0.1.10 → 0.13.3

package/src/ui/mathquill-editor/MathQuillEditorSymbolsPanel.js

@@ -1,48 +1,48 @@
-// @flow
-
-import renderLaTeXAsHTML from '../renderLaTeXAsHTML';
-import './czi-mathquill-editor-symbols-panel.css';
-import CustomButton from '../CustomButton';
-import * as React from 'react';
-
-import type { MathQuillEditorSymbol } from './MathQuillEditorSymbols';
-
-class MathQuillEditorSymbolsPanel extends React.PureComponent<any, any> {
-  props: {
-    onSelect: (symbol: MathQuillEditorSymbol) => void,
-    symbols: {
-      title: string,
-      symbols: Array<MathQuillEditorSymbol>,
-    },
-    title: string,
-  };
-
-  render(): React.Element<any> {
-    const { title, symbols } = this.props.symbols;
-    const buttons = symbols.map(this._renderButton);
-    return (
-      <div className="czi-mathquill-editor-symbols-panel">
-        <div className="czi-mathquill-editor-symbols-panel-title">{title}</div>
-        <div className="czi-mathquill-editor-symbols-panel-body">{buttons}</div>
-      </div>
-    );
-  }
-
-  _renderButton = (symbol: MathQuillEditorSymbol): React.Element<any> => {
-    const { label, latex, description } = symbol;
-    const html = renderLaTeXAsHTML(label);
-    const icon = <span dangerouslySetInnerHTML={{ __html: html }} />;
-    return (
-      <CustomButton
-        className="czi-mathquill-editor-symbols-panel-button"
-        icon={icon}
-        key={label + latex}
-        onClick={this.props.onSelect}
-        title={description}
-        value={symbol}
-      />
-    );
-  };
-}
-
-export default MathQuillEditorSymbolsPanel;
+// @flow
+
+import renderLaTeXAsHTML from '../renderLaTeXAsHTML';
+import './czi-mathquill-editor-symbols-panel.css';
+import { CustomButton } from '@modusoperandi/licit-ui-commands';
+import * as React from 'react';
+
+import type { MathQuillEditorSymbol } from './MathQuillEditorSymbols';
+
+class MathQuillEditorSymbolsPanel extends React.PureComponent<any, any> {
+  props: {
+    onSelect: (symbol: MathQuillEditorSymbol) => void,
+    symbols: {
+      title: string,
+      symbols: Array<MathQuillEditorSymbol>,
+    },
+    title: string,
+  };
+
+  render(): React.Element<any> {
+    const { title, symbols } = this.props.symbols;
+    const buttons = symbols.map(this._renderButton);
+    return (
+      <div className="czi-mathquill-editor-symbols-panel">
+        <div className="czi-mathquill-editor-symbols-panel-title">{title}</div>
+        <div className="czi-mathquill-editor-symbols-panel-body">{buttons}</div>
+      </div>
+    );
+  }
+
+  _renderButton = (symbol: MathQuillEditorSymbol): React.Element<any> => {
+    const { label, latex, description } = symbol;
+    const html = renderLaTeXAsHTML(label);
+    const icon = <span dangerouslySetInnerHTML={{ __html: html }} />;
+    return (
+      <CustomButton
+        className="czi-mathquill-editor-symbols-panel-button"
+        icon={icon}
+        key={label + latex}
+        onClick={this.props.onSelect}
+        title={description}
+        value={symbol}
+      />
+    );
+  };
+}
+
+export default MathQuillEditorSymbolsPanel;

package/src/ui/mathquill-editor/czi-mathquill-editor-symbols-panel.css

@@ -1,39 +1,39 @@
-.czi-mathquill-editor-symbols-panel {
-  margin: 0 0 10px;
-}
-
-.czi-mathquill-editor-symbols-panel-title {
-  background: #fafafa;
-  box-shadow: 0 1px 0.3px rgba(0, 0, 0, 0.15);
-  color: var(--czi-color-grey-200);
-  font-weight: bold;
-  padding: 10px;
-  position: sticky;
-  top: 0;
-  z-index: 2;
-}
-
-.czi-mathquill-editor-symbols-panel-body {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  overflow: auto;
-  padding: 10px;
-  position: relative;
-  z-index: 1;
-}
-
-.czi-custom-button.czi-mathquill-editor-symbols-panel-button {
-  background: #fff;
-  border: solid 1px #ccc;
-  font-size: 13px;
-  margin: 0 4px 4px 0;
-  min-width: 36px;
-  padding: 6px;
-  text-align: center;
-}
-
-.czi-custom-button.czi-mathquill-editor-symbols-panel-button:hover {
-  background-color: #f0f0f0;
-  border-color: #555;
-}
+.czi-mathquill-editor-symbols-panel {
+  margin: 0 0 10px;
+}
+
+.czi-mathquill-editor-symbols-panel-title {
+  background: #fafafa;
+  box-shadow: 0 1px 0.3px rgba(0, 0, 0, 0.15);
+  color: var(--czi-color-grey-200);
+  font-weight: bold;
+  padding: 10px;
+  position: sticky;
+  top: 0;
+  z-index: 2;
+}
+
+.czi-mathquill-editor-symbols-panel-body {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  overflow: auto;
+  padding: 10px;
+  position: relative;
+  z-index: 1;
+}
+
+.czi-custom-button.czi-mathquill-editor-symbols-panel-button {
+  background: #fff;
+  border: solid 1px #ccc;
+  font-size: 13px;
+  margin: 0 4px 4px 0;
+  min-width: 36px;
+  padding: 6px;
+  text-align: center;
+}
+
+.czi-custom-button.czi-mathquill-editor-symbols-panel-button:hover {
+  background-color: #f0f0f0;
+  border-color: #555;
+}

package/src/ui/mathquill-editor/czi-mathquill-editor.css

@@ -1,50 +1,50 @@
-@import '../czi-vars.css';
-
-.czi-mathquill-editor {
-  display: flex;
-  flex-direction: row;
-  margin: 0 0 20px 0;
-  width: 700px;
-}
-
-.czi-mathquill-editor-main {
-  padding: 0 10px 0 0;
-  width: 400px;
-}
-
-.czi-mathquill-editor-side {
-  background: #f0f0f0;
-  border: var(--czi-border-grey);
-  box-sizing: border-box;
-  flex: 1;
-  height: 400px;
-  overflow: auto;
-}
-
-.czi-mathquill-editor-element {
-  border: var(--czi-border-grey);
-  box-sizing: border-box;
-  display: block;
-  font-size: 24px;
-  height: 400px;
-  min-height: 29px;
-  overflow: auto;
-  padding: 8px;
-  position: relative;
-  width: 100%;
-}
-
-.czi-mathquill-editor.empty .czi-mathquill-editor-element::before {
-  color: var(--czi-placeholder-text-color);
-  content: 'Type Something...';
-  font-family: var(--czi-content-font-family);
-  font-size: var(--czi-content-font-size);
-  left: 8px;
-  line-height: var(--czi-content-line-height);
-  position: absolute;
-  top: 8px;
-}
-
-.czi-mathquill-editor.empty .czi-mathquill-editor-element.mq-focused::before {
-  display: none;
-}
+@import '../czi-vars.css';
+
+.czi-mathquill-editor {
+  display: flex;
+  flex-direction: row;
+  margin: 0 0 20px 0;
+  width: 700px;
+}
+
+.czi-mathquill-editor-main {
+  padding: 0 10px 0 0;
+  width: 400px;
+}
+
+.czi-mathquill-editor-side {
+  background: #f0f0f0;
+  border: var(--czi-border-grey);
+  box-sizing: border-box;
+  flex: 1;
+  height: 400px;
+  overflow: auto;
+}
+
+.czi-mathquill-editor-element {
+  border: var(--czi-border-grey);
+  box-sizing: border-box;
+  display: block;
+  font-size: 24px;
+  height: 400px;
+  min-height: 29px;
+  overflow: auto;
+  padding: 8px;
+  position: relative;
+  width: 100%;
+}
+
+.czi-mathquill-editor.empty .czi-mathquill-editor-element::before {
+  color: var(--czi-placeholder-text-color);
+  content: 'Type Something...';
+  font-family: var(--czi-content-font-family);
+  font-size: var(--czi-content-font-size);
+  left: 8px;
+  line-height: var(--czi-content-line-height);
+  position: absolute;
+  top: 8px;
+}
+
+.czi-mathquill-editor.empty .czi-mathquill-editor-element.mq-focused::before {
+  display: none;
+}

package/src/ui/mathquill-editor/mathquill-import-kludge.js

@@ -1,24 +1,24 @@
-// Moved these files here because exports-loader is only valid when built
-// using webpack, but this project is being built using babel.
-
-// The MathQuill IIFE explicitly looks for jQuery at window.jQuery.
-// This means that
-//    A) window must exist (browser env only)
-//    B) jQuery is being loaded via <script src=".../jquery">
-//
-import jquery from 'jquery';
-window.jQuery = window.jQuery || jquery;
-
-import mathquill from 'node-mathquill/build/mathquill';
-window.MathQuill = window.MathQuill || mathquill;
-
-import 'node-mathquill/build/mathquill.css';
-
-export const MathQuill = window.MathQuill || mathquill;
-
-// // [FS] IRAD-1010 2020-07-24
-// // With the latest to generate export default MathQuill these options need to
-// // be passed into exports loader.  Moved this from webpack config to here, so
-// // that package could load fine with other application.
-// const MQLoader = require('exports-loader?exports=default|MathQuill&type=module!node-mathquill/build/mathquill.js');
-// export const MathQuill = MQLoader.default;
+// Moved these files here because exports-loader is only valid when built
+// using webpack, but this project is being built using babel.
+
+// The MathQuill IIFE explicitly looks for jQuery at window.jQuery.
+// This means that
+//    A) window must exist (browser env only)
+//    B) jQuery is being loaded via <script src=".../jquery">
+//
+import jquery from 'jquery';
+window.jQuery = window.jQuery || jquery;
+
+import mathquill from 'node-mathquill/build/mathquill';
+window.MathQuill = window.MathQuill || mathquill;
+
+import 'node-mathquill/build/mathquill.css';
+
+export const MathQuill = window.MathQuill || mathquill;
+
+// // [FS] IRAD-1010 2020-07-24
+// // With the latest to generate export default MathQuill these options need to
+// // be passed into exports loader.  Moved this from webpack config to here, so
+// // that package could load fine with other application.
+// const MQLoader = require('exports-loader?exports=default|MathQuill&type=module!node-mathquill/build/mathquill.js');
+// export const MathQuill = MQLoader.default;

package/src/ui/renderLaTeXAsHTML.js

@@ -1,46 +1,46 @@
-// @flow
-
-import canUseCSSFont from './canUseCSSFont';
-import katex from 'katex';
-
-// [FS] IRAD-1061 2020-09-19
-// Now loaded locally, so that it work in closed network as well.
-import 'katex/dist/katex.min.css';
-
-const latexEl: any = document.createElement('div');
-const cached: Object = {};
-
-const CSS_FONT = 'KaTeX_Main';
-
-(async function () {
-  const fontSupported = await canUseCSSFont(CSS_FONT);
-  if (!fontSupported) {
-    // [FS] IRAD-1061 2020-09-19
-    // Now loaded locally, so that it work in closed network as well.
-    //console.info('Add CSS from ', CSS_CDN_URL);
-    //injectStyleSheet(CSS_CDN_URL);
-  }
-})();
-
-export default function renderLaTeXAsHTML(latex: ?string): string {
-  if (cached.hasOwnProperty(latex)) {
-    return cached[latex];
-  }
-
-  const latexText = latex || '';
-  latexEl.innerHTML = '';
-  if (!latexText) {
-    return latexText;
-  }
-  try {
-    katex.render(latex, latexEl);
-  } catch (ex) {
-    console.warn(ex.message, latex);
-    latexEl.innerHTML = '';
-    latexEl.appendChild(document.createTextNode(latexText));
-  }
-  const html = latexEl.innerHTML;
-  latexEl.innerHTML = '';
-  cached[latex] = html;
-  return html;
-}
+// @flow
+
+import canUseCSSFont from './canUseCSSFont';
+import katex from 'katex';
+
+// [FS] IRAD-1061 2020-09-19
+// Now loaded locally, so that it work in closed network as well.
+import 'katex/dist/katex.min.css';
+
+const latexEl: any = document.createElement('div');
+const cached: Object = {};
+
+const CSS_FONT = 'KaTeX_Main';
+
+(async function () {
+  const fontSupported = await canUseCSSFont(CSS_FONT);
+  if (!fontSupported) {
+    // [FS] IRAD-1061 2020-09-19
+    // Now loaded locally, so that it work in closed network as well.
+    //console.info('Add CSS from ', CSS_CDN_URL);
+    //injectStyleSheet(CSS_CDN_URL);
+  }
+})();
+
+export default function renderLaTeXAsHTML(latex: ?string): string {
+  if (cached.hasOwnProperty(latex)) {
+    return cached[latex];
+  }
+
+  const latexText = latex || '';
+  latexEl.innerHTML = '';
+  if (!latexText) {
+    return latexText;
+  }
+  try {
+    katex.render(latex, latexEl);
+  } catch (ex) {
+    console.warn(ex.message, latex);
+    latexEl.innerHTML = '';
+    latexEl.appendChild(document.createTextNode(latexText));
+  }
+  const html = latexEl.innerHTML;
+  latexEl.innerHTML = '';
+  cached[latex] = html;
+  return html;
+}

package/src/ui/resolveImage.js

@@ -1,123 +1,123 @@
-// @flow
-
-import url from 'url';
-
-import isOffline from './isOffline';
-
-export type ImageResult = {
-  complete: boolean,
-  height: number,
-  naturalHeight: number,
-  naturalWidth: number,
-  src: string,
-  width: number,
-};
-
-const cache = {};
-const queue = [];
-
-export default function resolveImage(src: ?string): Promise<ImageResult> {
-  return new Promise((resolve, reject) => {
-    const bag = { src, resolve, reject };
-    queue.push(bag);
-    processQueue();
-  });
-}
-
-function processQueue() {
-  const bag = queue.shift();
-  if (bag) {
-    processPromise(bag.src, bag.resolve, bag.reject);
-  }
-}
-
-function processPromise(
-  src: ?string,
-  resolve: Function,
-  reject: Function
-): void {
-  const result: ImageResult = {
-    complete: false,
-    height: 0,
-    naturalHeight: 0,
-    naturalWidth: 0,
-    src: src || '',
-    width: 0,
-  };
-
-  if (isOffline()) {
-    resolve(result);
-    return;
-  }
-
-  const srcStr = src || '';
-  if (!srcStr) {
-    resolve(result);
-    return;
-  } else if (cache[srcStr]) {
-    const cachedResult = Object.assign({}, cache[srcStr]);
-    resolve(cachedResult);
-    return;
-  }
-
-  const parsedURL = url.parse(srcStr);
-  // [FS] IRAD-1007 2020-07-13
-  // Removed the port validation from here
-  const { protocol } = parsedURL;
-  if (!/(http:|https:|data:)/.test(protocol || window.location.protocol)) {
-    resolve(result);
-    return;
-  }
-
-  let img;
-
-  const dispose = () => {
-    if (img) {
-      if (img instanceof HTMLElement) {
-        const pe = img.parentNode;
-        pe && pe.removeChild(img);
-      }
-      img.onload = null;
-      img.onerror = null;
-      img = null;
-    }
-    processQueue();
-  };
-
-  const onLoad = () => {
-    if (img) {
-      result.width = img.width;
-      result.height = img.height;
-      result.naturalWidth = img.width;
-      result.naturalHeight = img.height;
-      result.complete = true;
-    }
-    resolve(result);
-    dispose();
-    // [FS] IRAD-1006 2020-07-17
-    // Fix: Inconsistent behavior on image load
-    // Avoid image caching remove the below line
-    cache[srcStr] = { ...result };
-  };
-
-  const onError = () => {
-    resolve(result);
-    dispose();
-  };
-
-  const { body } = document;
-  if (body) {
-    img = document.createElement('img');
-    img.style.cssText =
-      'position:fixed;left:-10000000000px;width:auto;height:auto;';
-    img.onload = onLoad;
-    img.onerror = onError;
-    img.src = srcStr;
-    body.appendChild(img);
-  } else {
-    img = new Image();
-    img.onload = onLoad;
-    img.onerror = onError;
-    img.src = srcStr;
-  }
-}
+// @flow
+
+import url from 'url';
+
+import isOffline from './isOffline';
+
+export type ImageResult = {
+  complete: boolean,
+  height: number,
+  naturalHeight: number,
+  naturalWidth: number,
+  src: string,
+  width: number,
+};
+
+const cache = {};
+const queue = [];
+
+export default function resolveImage(src: ?string): Promise<ImageResult> {
+  return new Promise((resolve, reject) => {
+    const bag = { src, resolve, reject };
+    queue.push(bag);
+    processQueue();
+  });
+}
+
+function processQueue() {
+  const bag = queue.shift();
+  if (bag) {
+    processPromise(bag.src, bag.resolve, bag.reject);
+  }
+}
+
+function processPromise(
+  src: ?string,
+  resolve: Function,
+  reject: Function
+): void {
+  const result: ImageResult = {
+    complete: false,
+    height: 0,
+    naturalHeight: 0,
+    naturalWidth: 0,
+    src: src || '',
+    width: 0,
+  };
+
+  if (isOffline()) {
+    resolve(result);
+    return;
+  }
+
+  const srcStr = src || '';
+  if (!srcStr) {
+    resolve(result);
+    return;
+  } else if (cache[srcStr]) {
+    const cachedResult = Object.assign({}, cache[srcStr]);
+    resolve(cachedResult);
+    return;
+  }
+
+  const parsedURL = url.parse(srcStr);
+  // [FS] IRAD-1007 2020-07-13
+  // Removed the port validation from here
+  const { protocol } = parsedURL;
+  if (!/(http:|https:|data:)/.test(protocol || window.location.protocol)) {
+    resolve(result);
+    return;
+  }
+
+  let img;
+
+  const dispose = () => {
+    if (img) {
+      if (img instanceof HTMLElement) {
+        const pe = img.parentNode;
+        pe && pe.removeChild(img);
+      }
+      img.onload = null;
+      img.onerror = null;
+      img = null;
+    }
+    processQueue();
+  };
+
+  const onLoad = () => {
+    if (img) {
+      result.width = img.width;
+      result.height = img.height;
+      result.naturalWidth = img.width;
+      result.naturalHeight = img.height;
+      result.complete = true;
+    }
+    resolve(result);
+    dispose();
+    // [FS] IRAD-1006 2020-07-17
+    // Fix: Inconsistent behavior on image load
+    // Avoid image caching remove the below line
+    cache[srcStr] = { ...result };
+  };
+
+  const onError = () => {
+    resolve(result);
+    dispose();
+  };
+
+  const { body } = document;
+  if (body) {
+    img = document.createElement('img');
+    img.style.cssText =
+      'position:fixed;left:-10000000000px;width:auto;height:auto;';
+    img.onload = onLoad;
+    img.onerror = onError;
+    img.src = srcStr;
+    body.appendChild(img);
+  } else {
+    img = new Image();
+    img.onload = onLoad;
+    img.onerror = onError;
+    img.src = srcStr;
+  }
+}