@pie-element/ebsr 6.6.3-next.1131 → 6.6.3-next.1199

package/configure/node_modules/@pie-lib/editable-html/src/plugins/respArea/inline-dropdown/index.jsx

@@ -1,63 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Chevron } from '../icons';
-
-const InlineDropdown = ({ attributes, selectedItem }) => {
-  // TODO: Investigate
-  // Needed because items with values inside have different positioning for some reason
-  const html = selectedItem || '<div>&nbsp</div>';
-
-  return (
-    <span
-      {...attributes}
-      style={{
-        display: 'inline-flex',
-        height: '50px',
-        margin: '0 5px',
-        cursor: 'pointer'
-      }}
-    >
-      <div
-        style={{
-          display: 'inline-flex',
-          minWidth: '178px',
-          height: '36px',
-          background: '#FFF',
-          border: '1px solid #C0C3CF',
-          boxSizing: 'border-box',
-          borderRadius: '3px',
-          position: 'relative'
-        }}
-      >
-        <div
-          style={{
-            flex: 1,
-            overflow: 'hidden',
-            padding: '0 25px 0 8px',
-            whiteSpace: 'nowrap',
-            textOverflow: 'ellipsis',
-            lineHeight: '35px'
-          }}
-          dangerouslySetInnerHTML={{
-            __html: html
-          }}
-        />
-        <Chevron
-          direction="down"
-          style={{
-            position: 'absolute',
-            top: '5px',
-            right: '5px'
-          }}
-        />
-      </div>
-    </span>
-  );
-};
-
-InlineDropdown.propTypes = {
-  attributes: PropTypes.object,
-  selectedItem: PropTypes.oneOfType([PropTypes.string, PropTypes.object])
-};
-
-export default InlineDropdown;

package/configure/node_modules/@pie-lib/editable-html/src/plugins/respArea/utils.jsx

@@ -1,77 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { Inline } from 'slate';
-import Snackbar from '@material-ui/core/Snackbar';
-
-export const isNumber = val => !isNaN(parseFloat(val)) && isFinite(val);
-
-export const insertSnackBar = message => {
-  const prevSnacks = document.querySelectorAll('.response-area-alert');
-
-  prevSnacks.forEach(s => s.remove());
-
-  const newEl = document.createElement('div');
-
-  newEl.className = 'response-area-alert';
-
-  const el = (
-    <Snackbar
-      anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
-      open={true}
-      ContentProps={{
-        'aria-describedby': 'message-id'
-      }}
-      message={<span id="message-id">{message}</span>}
-    />
-  );
-
-  ReactDOM.render(el, newEl);
-
-  document.body.appendChild(newEl);
-
-  setTimeout(() => {
-    newEl.remove();
-  }, 2000);
-};
-
-export const defaultECR = index =>
-  Inline.create({
-    type: 'explicit_constructed_response',
-    isVoid: true,
-    data: {
-      index
-    }
-  });
-
-export const defaultDIB = (opts, index) =>
-  Inline.create({
-    type: 'drag_in_the_blank',
-    isVoid: true,
-    data: {
-      index,
-      duplicates: opts.options.duplicates,
-      value: null
-    }
-  });
-
-export const defaultIDD = index =>
-  Inline.create({
-    object: 'inline',
-    type: 'inline_dropdown',
-    isVoid: true,
-    data: {
-      index
-    }
-  });
-
-export const getDefaultElement = (opts, index) => {
-  switch (opts.type) {
-    case 'explicit-constructed-response':
-      return defaultECR(index);
-    case 'drag-in-the-blank':
-      return defaultDIB(opts, index);
-    default:
-      // inline-dropdown
-      return defaultIDD(index);
-  }
-};

package/configure/node_modules/@pie-lib/editable-html/src/plugins/table/icons/index.jsx

@@ -1,59 +0,0 @@
-import React from 'react';
-import { withStyles } from '@material-ui/core/styles';
-
-const styles = {
-  icon: {
-    fill: 'grey',
-    '&:hover': {
-      fill: 'black'
-    }
-  }
-};
-
-const SvgIcon = Component => {
-  return withStyles(styles)(props => (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      version="1.1"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-    >
-      <Component className={props.classes.icon} />
-    </svg>
-  ));
-};
-export const AddRow = SvgIcon(props => (
-  <path
-    {...props}
-    d="M22,10A2,2 0 0,1 20,12H4A2,2 0 0,1 2,10V3H4V5H8V3H10V5H14V3H16V5H20V3H22V10M4,10H8V7H4V10M10,10H14V7H10V10M20,10V7H16V10H20M11,14H13V17H16V19H13V22H11V19H8V17H11V14Z"
-  />
-));
-
-export const RemoveRow = SvgIcon(props => (
-  <path
-    {...props}
-    d="M9.41,13L12,15.59L14.59,13L16,14.41L13.41,17L16,19.59L14.59,21L12,18.41L9.41,21L8,19.59L10.59,17L8,14.41L9.41,13M22,9A2,2 0 0,1 20,11H4A2,2 0 0,1 2,9V6A2,2 0 0,1 4,4H20A2,2 0 0,1 22,6V9M4,9H8V6H4V9M10,9H14V6H10V9M16,9H20V6H16V9Z"
-  />
-));
-
-export const AddColumn = SvgIcon(props => (
-  <path
-    {...props}
-    d="M11,2A2,2 0 0,1 13,4V20A2,2 0 0,1 11,22H2V2H11M4,10V14H11V10H4M4,16V20H11V16H4M4,4V8H11V4H4M15,11H18V8H20V11H23V13H20V16H18V13H15V11Z"
-  />
-));
-
-export const RemoveColumn = SvgIcon(props => (
-  <path
-    {...props}
-    d="M4,2H11A2,2 0 0,1 13,4V20A2,2 0 0,1 11,22H4A2,2 0 0,1 2,20V4A2,2 0 0,1 4,2M4,10V14H11V10H4M4,16V20H11V16H4M4,4V8H11V4H4M17.59,12L15,9.41L16.41,8L19,10.59L21.59,8L23,9.41L20.41,12L23,14.59L21.59,16L19,13.41L16.41,16L15,14.59L17.59,12Z"
-  />
-));
-
-export const RemoveTable = SvgIcon(props => (
-  <path
-    {...props}
-    d="M15.46,15.88L16.88,14.46L19,16.59L21.12,14.46L22.54,15.88L20.41,18L22.54,20.12L21.12,21.54L19,19.41L16.88,21.54L15.46,20.12L17.59,18L15.46,15.88M4,3H18A2,2 0 0,1 20,5V12.08C18.45,11.82 16.92,12.18 15.68,13H12V17H13.08C12.97,17.68 12.97,18.35 13.08,19H4A2,2 0 0,1 2,17V5A2,2 0 0,1 4,3M4,7V11H10V7H4M12,7V11H18V7H12M4,13V17H10V13H4Z"
-  />
-));

package/configure/node_modules/@pie-lib/editable-html/src/plugins/table/index.jsx

@@ -1,439 +0,0 @@
-import React from 'react';
-import EditTable from 'slate-edit-table';
-import { Block } from 'slate';
-import debug from 'debug';
-import GridOn from '@material-ui/icons/GridOn';
-import TableToolbar from './table-toolbar';
-import PropTypes from 'prop-types';
-import SlatePropTypes from 'slate-prop-types';
-import { withStyles } from '@material-ui/core/styles';
-import convert from 'react-attr-converter';
-import { object as toStyleObject } from 'to-style';
-
-const log = debug('@pie-lib:editable-html:plugins:table');
-
-const Table = withStyles(() => ({
-  table: {}
-}))(props => {
-  const nodeAttributes = dataToAttributes(props.node.data);
-
-  return (
-    <table
-      className={props.classes.table}
-      {...props.attributes}
-      {...nodeAttributes}
-      onFocus={props.onFocus}
-      onBlur={props.onBlur}
-    >
-      <tbody>{props.children}</tbody>
-    </table>
-  );
-});
-
-Table.propTypes = {
-  attributes: PropTypes.object,
-  onFocus: PropTypes.func,
-  onBlur: PropTypes.func,
-  node: SlatePropTypes.node,
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
-};
-
-const TableRow = props => <tr {...props.attributes}>{props.children}</tr>;
-
-TableRow.propTypes = {
-  attributes: PropTypes.object,
-  onFocus: PropTypes.func,
-  onBlur: PropTypes.func,
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
-};
-
-const TableCell = withStyles(() => ({
-  td: {
-    minWidth: '25px'
-  }
-}))(props => {
-  const Tag = props.node.data.get('header') ? 'th' : 'td';
-
-  const nodeAttributes = dataToAttributes(props.node.data);
-  delete nodeAttributes.header;
-
-  return (
-    <Tag
-      {...props.attributes}
-      {...nodeAttributes}
-      colSpan={props.node.data.get('colspan')}
-      className={props.classes[Tag]}
-      onFocus={props.onFocus}
-      onBlur={props.onBlur}
-    >
-      {props.children}
-    </Tag>
-  );
-});
-
-TableCell.propTypes = {
-  attributes: PropTypes.object,
-  onFocus: PropTypes.func,
-  onBlur: PropTypes.func,
-  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired
-};
-
-export const moveFocusToBeginningOfTable = change => {
-  const addedTable = change.value.document.findDescendant(
-    d => !!d.data && !!d.data.get('newTable')
-  );
-
-  if (!addedTable) {
-    return;
-  }
-
-  change.collapseToStartOf(addedTable);
-
-  const update = addedTable.data.remove('newTable');
-
-  change.setNodeByKey(addedTable.key, { data: update });
-};
-
-export default (opts, toolbarPlugins /* :  {toolbar: {}}[] */) => {
-  const core = EditTable({
-    typeContent: 'div'
-  });
-
-  // fix outdated schema
-
-  if (core.schema && core.schema.blocks) {
-    Object.keys(core.schema.blocks).forEach(key => {
-      const block = core.schema.blocks[key];
-
-      if (block.parent) {
-        if (block.nodes[0].types) {
-          block.nodes[0] = {
-            type: block.nodes[0].types[0]
-          };
-        }
-
-        if (block.nodes[0].objects) {
-          block.nodes[0] = {
-            object: block.nodes[0].objects[0]
-          };
-        }
-
-        block.parent = {
-          type: block.parent.types[0]
-        };
-      } else {
-        block.nodes[0] = { type: block.nodes[0].types[0] };
-      }
-    });
-  }
-
-  core.utils.getTableBlock = (containerNode, key) => {
-    const node = containerNode.getDescendant(key);
-    const ancestors = containerNode.getAncestors(key).push(node);
-    return ancestors.findLast(p => p.type === 'table');
-  };
-
-  core.utils.createTableWithOptions = (row, columns, extra) => {
-    const createdTable = core.utils.createTable(row, columns);
-    const newTable = Block.create({
-      ...createdTable.toJSON(),
-      ...extra
-    });
-
-    return newTable;
-  };
-
-  core.toolbar = {
-    icon: <GridOn />,
-    onClick: (value, onChange) => {
-      log('insert table');
-      const change = value.change();
-      const newTable = core.utils.createTableWithOptions(2, 2, {
-        data: {
-          border: '1',
-          newTable: true
-        }
-      });
-
-      change.insertBlock(newTable);
-
-      moveFocusToBeginningOfTable(change);
-      onChange(change);
-    },
-    supports: (node, value) =>
-      node && node.object === 'block' && core.utils.isSelectionInTable(value),
-    /**
-     * Note - the node may not be a table node - it may be a node inside a table.
-     */
-    customToolbar: (node, value, onToolbarDone) => {
-      log('[customToolbar] node.data: ', node.data);
-
-      const tableBlock = core.utils.getTableBlock(value.document, node?.key);
-      log('[customToolbar] tableBlock: ', tableBlock);
-
-      const hasBorder = () =>
-        tableBlock.data.get('border') && tableBlock.data.get('border') !== '0';
-      const addRow = () => {
-        const change = core.changes.insertRow(value.change());
-        onToolbarDone(change, false);
-      };
-
-      const addColumn = () => {
-        const change = core.changes.insertColumn(value.change());
-        onToolbarDone(change, false);
-      };
-
-      const removeRow = () => {
-        const change = core.changes.removeRow(value.change());
-        onToolbarDone(change, false);
-      };
-
-      const removeColumn = () => {
-        const change = core.changes.removeColumn(value.change());
-        onToolbarDone(change, false);
-      };
-
-      const removeTable = () => {
-        const change = core.changes.removeTable(value.change());
-        onToolbarDone(change, false);
-      };
-
-      const toggleBorder = () => {
-        const { data } = tableBlock;
-        const update = data.set('border', hasBorder() ? '0' : '1');
-        log('[toggleBorder] update: ', update);
-        const change = value.change().setNodeByKey(tableBlock.key, { data: update });
-        onToolbarDone(change, false);
-      };
-
-      const onDone = () => {
-        log('[onDone] call onToolbarDone...');
-        onToolbarDone(null, true);
-      };
-
-      const Tb = () => (
-        <TableToolbar
-          plugins={toolbarPlugins}
-          onChange={c => onToolbarDone(c, false)}
-          value={value}
-          onAddRow={addRow}
-          onRemoveRow={removeRow}
-          onAddColumn={addColumn}
-          onRemoveColumn={removeColumn}
-          onRemoveTable={removeTable}
-          hasBorder={hasBorder()}
-          onToggleBorder={toggleBorder}
-          onDone={onDone}
-        />
-      );
-      return Tb;
-    }
-  };
-
-  const Node = props => {
-    switch (props.node.type) {
-      case 'table':
-        return <Table {...props} onFocus={opts.onFocus} onBlur={opts.onBlur} />;
-      case 'table_row':
-        return <TableRow {...props} />;
-      case 'table_cell':
-        return <TableCell {...props} onFocus={opts.onFocus} onBlur={opts.onBlur} />;
-      default:
-        return null;
-    }
-  };
-  Node.propTypes = {
-    node: PropTypes.object
-  };
-
-  core.normalizeNode = node => {
-    if (node.object !== 'document') {
-      return;
-    }
-
-    const tableAdded = node.findDescendant(d => d.data && d.data.get('newTable'));
-
-    if (!tableAdded) {
-      return;
-    }
-
-    const nodeToSearch = node.getParent(tableAdded.key) || node;
-    let shouldAddTextAfterNode = false;
-    const indexToNotHaveTableOn = nodeToSearch.nodes.size - 1;
-    const indexOfLastTable = nodeToSearch.nodes.findLastIndex(d => d.type === 'table');
-
-    // if the last table in the document is of type table, we need to do the change
-    if (indexOfLastTable === indexToNotHaveTableOn) {
-      shouldAddTextAfterNode = true;
-    }
-
-    if (!shouldAddTextAfterNode) {
-      return;
-    }
-
-    return change => {
-      if (shouldAddTextAfterNode) {
-        const tableJSON = tableAdded.toJSON();
-
-        // we remove the table node because otherwise we can't add the empty block after it
-        // we need a block that contains text in order to do it
-        change.removeNodeByKey(tableAdded.key);
-
-        const newBlock = Block.create({
-          object: 'block',
-          type: 'div'
-        });
-
-        // we add an empty block but that it's going to be normalized
-        // because it will add the empty text to it like it should
-        change.insertBlock(newBlock);
-
-        change.withoutNormalization(() => {
-          // we do these changes without normalization
-
-          // we get the text previous to the new block added
-          const prevText = change.value.document.getPreviousText(newBlock.key);
-
-          if (prevText) {
-            // we move focus to the previous text
-            change
-              .moveFocusTo(prevText.key, prevText.text?.length)
-              .moveAnchorTo(prevText.key, prevText.text?.length);
-          }
-
-          // we insert the table block between the first block with text and the last block with text
-          change.insertBlock({
-            ...tableJSON,
-            data: {
-              ...tableJSON.data,
-              newTable: true
-            }
-          });
-
-          moveFocusToBeginningOfTable(change);
-        });
-      }
-    };
-  };
-
-  core.renderNode = Node;
-
-  return core;
-};
-
-export const parseStyleString = s => {
-  const regex = /([\w-]*)\s*:\s*([^;]*)/g;
-  let match;
-  const result = {};
-  while ((match = regex.exec(s))) {
-    result[match[1]] = match[2].trim();
-  }
-  return result;
-};
-
-export const reactAttributes = o => toStyleObject(o, { camelize: true, addUnits: false });
-
-const attributesToMap = el => (acc, attribute) => {
-  const value = el.getAttribute(attribute);
-  if (value) {
-    if (attribute === 'style') {
-      const styleString = el.getAttribute(attribute);
-      const reactStyleObject = reactAttributes(parseStyleString(styleString));
-      acc['style'] = reactStyleObject;
-    } else {
-      acc[attribute] = el.getAttribute(attribute);
-    }
-  }
-  return acc;
-};
-
-const dataToAttributes = data => {
-  if (!data || !data.get) {
-    return {};
-  }
-
-  return data.reduce((acc, v, name) => {
-    if (v) {
-      acc[convert(name)] = v;
-    }
-    return acc;
-  }, {});
-};
-
-const attributes = ['border', 'cellpadding', 'cellspacing', 'class', 'style'];
-
-const cellAttributes = ['colspan', 'rowspan', 'class', 'style'];
-
-export const serialization = {
-  deserialize(el, next) {
-    const tag = el.tagName.toLowerCase();
-
-    switch (tag) {
-      case 'table': {
-        const children =
-          el.children.length === 1 && el.children[0].tagName.toLowerCase() === 'tbody'
-            ? el.children[0].children
-            : el.children;
-        const c = Array.from(children);
-
-        return {
-          object: 'block',
-          type: 'table',
-          nodes: next(c),
-          data: attributes.reduce(attributesToMap(el), {})
-        };
-      }
-      case 'th': {
-        return {
-          object: 'block',
-          type: 'table_cell',
-          nodes: next(el.childNodes),
-          data: cellAttributes.reduce(attributesToMap(el), { header: true })
-        };
-      }
-      case 'tr': {
-        return {
-          object: 'block',
-          type: 'table_row',
-          nodes: next(Array.from(el.children))
-        };
-      }
-      case 'td': {
-        return {
-          object: 'block',
-          type: 'table_cell',
-          nodes: next(Array.from(el.childNodes)),
-          data: cellAttributes.reduce(attributesToMap(el), { header: false })
-        };
-      }
-    }
-  },
-  serialize(object, children) {
-    if (object.object !== 'block') {
-      return;
-    }
-
-    switch (object.type) {
-      case 'table': {
-        const attributes = dataToAttributes(object.data);
-        return (
-          <table {...attributes}>
-            <tbody>{children}</tbody>
-          </table>
-        );
-      }
-      case 'table_row': {
-        return <tr>{children}</tr>;
-      }
-      case 'table_cell': {
-        const attributes = dataToAttributes(object.data);
-        delete attributes.header;
-        if (object.data.get('header')) {
-          return <th {...attributes}>{children}</th>;
-        } else {
-          return <td {...attributes}>{children}</td>;
-        }
-      }
-    }
-  }
-};