@teselagen/ui 0.7.33-beta.5 → 0.7.33

package/getDayjsFormatter.js

@@ -0,0 +1,35 @@
+import dayjs from "dayjs";
+import LocalizedFormat from "dayjs/plugin/localizedFormat";
+import localeData from "dayjs/plugin/localeData";
+
+dayjs.extend(localeData);
+dayjs.extend(LocalizedFormat);
+const userLocale = Intl.DateTimeFormat().resolvedOptions().locale;
+
+if (userLocale) {
+  const requireLocale = (newLocale, skipCall) => {
+    if (dayjs.locale() !== newLocale) {
+      try {
+        require(`dayjs/locale/${newLocale}.js`);
+        dayjs.locale(newLocale);
+      } catch (error) {
+        // error
+        if (!skipCall && newLocale.includes("-")) {
+          requireLocale(newLocale.split("-")[0], true);
+        }
+      }
+    }
+  };
+  const localeToUse = userLocale.toLowerCase();
+  requireLocale(localeToUse);
+}
+
+export default function getDayjsFormatter(format) {
+  return {
+    formatDate: date => dayjs(date).format(format),
+    parseDate: str => dayjs(str, format).toDate(),
+    placeholder: format?.toLowerCase().includes("l")
+      ? dayjs.Ls[dayjs.locale()]?.formats[format.toUpperCase()]
+      : format
+  };
+}

package/getFieldPathToField.js

@@ -0,0 +1,7 @@
+export const getFieldPathToField = schema => {
+  const fieldPathToField = {};
+  schema.fields.forEach(f => {
+    fieldPathToField[f.path] = f;
+  });
+  return fieldPathToField;
+};

package/getIdOrCodeOrIndex.js

@@ -0,0 +1,9 @@
+export const getIdOrCodeOrIndex = (record, rowIndex) => {
+  if (record.id || record.id === 0) {
+    return record.id;
+  } else if (record.code) {
+    return record.code;
+  } else {
+    return rowIndex;
+  }
+};

package/getLastSelectedEntity.js

@@ -0,0 +1,11 @@
+export const getLastSelectedEntity = idMap => {
+  let lastSelectedEnt;
+  let latestTime;
+  Object.values(idMap).forEach(({ time, entity }) => {
+    if (!latestTime || time > latestTime) {
+      lastSelectedEnt = entity;
+      latestTime = time;
+    }
+  });
+  return lastSelectedEnt;
+};

package/getNewEntToSelect.js

@@ -0,0 +1,25 @@
+export const getNewEntToSelect = ({
+  type,
+  lastSelectedIndex,
+  entities,
+  isEntityDisabled
+}) => {
+  let newIndexToSelect;
+  if (type === "up") {
+    newIndexToSelect = lastSelectedIndex - 1;
+  } else {
+    newIndexToSelect = lastSelectedIndex + 1;
+  }
+  const newEntToSelect = entities[newIndexToSelect];
+  if (!newEntToSelect) return;
+  if (isEntityDisabled && isEntityDisabled(newEntToSelect)) {
+    return getNewEntToSelect({
+      type,
+      lastSelectedIndex: newIndexToSelect,
+      entities,
+      isEntityDisabled
+    });
+  } else {
+    return newEntToSelect;
+  }
+};

package/getNewName.js

@@ -0,0 +1,31 @@
+export function getNewName(list, targetName) {
+  const usedNumbers = [];
+
+  for (let i = 0; i < list.length; i++) {
+    const currentName = list[i].name;
+    const baseName = currentName.replace(/\(\d+\)\.csv$/, ".csv");
+
+    if (baseName === targetName) {
+      const match = currentName.match(/\((\d+)\)\.csv$/);
+      if (match) {
+        usedNumbers[parseInt(match[1])] = true;
+      } else {
+        usedNumbers[0] = true;
+      }
+    }
+  }
+
+  let newName = targetName;
+  for (let i = 0; i <= usedNumbers.length; i++) {
+    if (!usedNumbers[i]) {
+      if (i === 0) {
+        newName = targetName;
+      } else {
+        newName = targetName.replace(".csv", `(${i}).csv`);
+      }
+      break;
+    }
+  }
+
+  return newName;
+}

package/getRowCopyText.js

@@ -0,0 +1,28 @@
+import { getCellCopyText } from "./getCellCopyText";
+import { flatMap } from "lodash-es";
+
+export const getRowCopyText = (rowEl, { specificColumn } = {}) => {
+  //takes in a row element
+  if (!rowEl) return [];
+  const textContent = [];
+  const jsonText = [];
+
+  for (const cellEl of rowEl.children) {
+    const cellChild = cellEl.querySelector(`[data-copy-text]`);
+    if (!cellChild) {
+      if (specificColumn) continue; //strip it
+      continue; //just leave it blank
+    }
+    if (
+      specificColumn &&
+      cellChild.getAttribute("data-test") !== specificColumn
+    ) {
+      continue;
+    }
+    const [t, j] = getCellCopyText(cellChild);
+    textContent.push(t);
+    jsonText.push(j);
+  }
+
+  return [flatMap(textContent).join("\t"), jsonText];
+};

package/getTableConfigFromStorage.js

@@ -0,0 +1,5 @@
+export default function getTableConfigFromStorage(formName) {
+  let tableConfig = window.localStorage.getItem(formName);
+  tableConfig = tableConfig && JSON.parse(tableConfig);
+  return tableConfig;
+}

package/getTextFromEl.js

@@ -0,0 +1,28 @@
+import React from "react";
+
+export default function getTextFromEl(el, options = {}) {
+  const { lowerCase } = options;
+  if (React.isValidElement(el)) {
+    return el && el.props && el.props.children
+      ? (el.props.children.reduce
+          ? el.props.children
+          : [el.props.children]
+        ).reduce((acc, child) => {
+          if (child && child.props && child.props.children) {
+            acc += getTextFromEl(child);
+          } else if (typeof child === "string") {
+            if (lowerCase) {
+              acc += child.toLowerCase();
+            } else {
+              acc += child;
+            }
+          } else if (typeof child === "number") {
+            acc += child + "";
+          }
+          return acc;
+        }, "")
+      : "";
+  } else {
+    return el;
+  }
+}

package/getVals.js

@@ -0,0 +1,8 @@
+import { isFunction } from "lodash-es";
+
+export function getVals(values) {
+  if (isFunction(values)) {
+    return values();
+  }
+  return values;
+}

package/handleCopyColumn.js

@@ -0,0 +1,21 @@
+import { getAllRows } from "./getAllRows";
+import { getIdOrCodeOrIndex } from "./getIdOrCodeOrIndex";
+import { handleCopyRows } from "./handleCopyRows";
+
+export const handleCopyColumn = (e, cellWrapper, selectedRecords) => {
+  const specificColumn = cellWrapper.getAttribute("data-test");
+  let rowElsToCopy = getAllRows(e);
+  if (!rowElsToCopy) return;
+  if (selectedRecords) {
+    const ids = selectedRecords.map(e => getIdOrCodeOrIndex(e)?.toString());
+    rowElsToCopy = Array.from(rowElsToCopy).filter(rowEl => {
+      const id = rowEl.closest(".rt-tr-group")?.getAttribute("data-test-id");
+      return id !== undefined && ids.includes(id);
+    });
+  }
+  if (!rowElsToCopy) return;
+  handleCopyRows(rowElsToCopy, {
+    specificColumn,
+    onFinishMsg: "Column Copied"
+  });
+};

package/handleCopyHelper.js

@@ -0,0 +1,15 @@
+import copy from "copy-to-clipboard";
+
+export const handleCopyHelper = (stringToCopy, jsonToCopy, message) => {
+  !window.Cypress &&
+    copy(stringToCopy, {
+      onCopy: clipboardData => {
+        clipboardData.setData("application/json", JSON.stringify(jsonToCopy));
+      },
+      // keep this so that pasting into spreadsheets works.
+      format: "text/plain"
+    });
+  if (message) {
+    window.toastr.success(message);
+  }
+};

package/handleCopyRows.js

@@ -0,0 +1,23 @@
+import download from "downloadjs";
+import { getRowCopyText } from "./getRowCopyText";
+import { handleCopyHelper } from "./handleCopyHelper";
+
+export const handleCopyRows = (
+  rowElsToCopy,
+  { specificColumn, onFinishMsg, isDownload } = {}
+) => {
+  let textToCopy = [];
+  const jsonToCopy = [];
+  rowElsToCopy.forEach(rowEl => {
+    const [t, j] = getRowCopyText(rowEl, { specificColumn });
+    textToCopy.push(t);
+    jsonToCopy.push(j);
+  });
+  textToCopy = textToCopy.filter(text => text).join("\n");
+  if (!textToCopy) return window.toastr.warning("No text to copy");
+  if (isDownload) {
+    download(textToCopy.replaceAll("\t", ","), "tableData.csv", "text/csv");
+  } else {
+    handleCopyHelper(textToCopy, jsonToCopy, onFinishMsg || "Row Copied");
+  }
+};

package/handleCopyTable.js

@@ -0,0 +1,16 @@
+import { getAllRows } from "./getAllRows";
+import { handleCopyRows } from "./handleCopyRows";
+
+export const handleCopyTable = (e, opts) => {
+  try {
+    const allRowEls = getAllRows(e);
+    if (!allRowEls) return;
+    handleCopyRows(allRowEls, {
+      ...opts,
+      onFinishMsg: "Table Copied"
+    });
+  } catch (error) {
+    console.error(`error:`, error);
+    window.toastr.error("Error copying rows.");
+  }
+};

package/handlerHelpers.js

@@ -0,0 +1,24 @@
+export const onEnterHelper = callback => ({
+  onKeyDown: event => {
+    if (event.key === "Enter") {
+      callback(event);
+    }
+  }
+});
+
+export const onBlurHelper = callback => ({
+  onBlur: event => {
+    callback(event);
+  }
+});
+
+export const onEnterOrBlurHelper = callback => ({
+  onKeyDown: function (event) {
+    if (event.key === "Enter") {
+      callback(event);
+    }
+  },
+  onBlur: function (event) {
+    callback(event);
+  }
+});

package/hotkeyUtils.js

@@ -0,0 +1,131 @@
+import React, { useMemo } from "react";
+import { useHotkeys } from "@blueprintjs/core";
+import { startCase } from "lodash-es";
+
+// This has been mostly superseded by blueprint's KeyCombo component, but may
+// still be useful for cases where we need plain text
+export function comboToLabel(def, useSymbols = true) {
+  const combo = typeof def === "string" ? def : def.combo;
+
+  if (useSymbols) {
+    let parts = combo.replace("++", "+plus").split("+");
+    parts = parts.map(p => symbols[p] || startCase(p) || p);
+    return parts.join("");
+  } else {
+    return combo
+      .split("+")
+      .map(p => startCase(p) || p)
+      .join(" + ")
+      .replace("Meta", isMac ? "Cmd" : "Ctrl")
+      .replace("Mod", isMac ? "Cmd" : "Ctrl")
+      .replace("Alt", isMac ? "Option" : "Alt");
+  }
+}
+
+// HOF to get hotkey combos by id
+export const hotkeysById =
+  (hotkeys, mode = "raw") =>
+  id => {
+    const def = getHotkeyProps(hotkeys[id]);
+    return (
+      def &&
+      (mode === "raw" ? def.combo : comboToLabel(def.combo, mode === "symbols"))
+    );
+  };
+
+// Translate shorthand array if needed
+export const getHotkeyProps = (def, id) => {
+  let out;
+  if (typeof def === "string") {
+    out = { combo: def };
+  } else if (def instanceof Array) {
+    out = { combo: def[0], label: def[1], ...(def[2] || {}) };
+  } else {
+    out = def;
+  }
+  out.label = out.label || startCase(id);
+  return out;
+};
+
+/*
+ * HOC to add hotkey support to components. Use this instead of blueprint's one.
+ *
+ * Arguments:
+ * - hotkeySpec: either a named hotkey section previously registered, or an
+ *   object mapping command ids to hotkey definitions, where each hotkey can
+ *   be either:
+ *   - a string consisting in the key combo (e.g. 'ctrl+shift+x')
+ *   - an array holding the combo, label, and an object with any other props
+ *   - an object holding all props
+ * - handlers: an object mapping command ids to handler functions
+ * - options: an object that may specify the follownig options:
+ *   - functional: boolean indicating if the wrapped component will be a
+ *     functional stateless component instead of a class-based one
+ *
+ * Returns a function that can be invoked with a component class, or a
+ * stateless component function (if specified in the options) and returns
+ * the decorated class. It may also be invoked without arguments to generate a
+ * dummy ad-hoc component with no output.
+ *
+ */
+export const withHotkeys = (hotkeys, handlers) => {
+  return ({ children } = {}) => {
+    const memoedHotkeys = useMemo(
+      () =>
+        Object.keys(hotkeys).map(id => {
+          const { ...props } = getHotkeyProps(hotkeys[id], id);
+          return {
+            key: id,
+            global: props.global !== false,
+            onKeyDown: function (e) {
+              return handlers[id](e);
+            },
+            ...props
+          };
+        }),
+      []
+    );
+
+    const { handleKeyDown, handleKeyUp } = useHotkeys(memoedHotkeys);
+    const newProps = {
+      tabIndex: 0,
+      onKeyDown: handleKeyDown,
+      onKeyUp: handleKeyUp
+    };
+    return children ? ( //tnr: if children are passed, we'll clone them with the new props
+      React.cloneElement(children, newProps)
+    ) : (
+      //if not, then we'll return a div that can be used
+      <div className="hotkeyHandler" {...newProps}></div>
+    );
+  };
+};
+
+const isMac = navigator.userAgent.includes("Mac OS X");
+
+// TODO maybe avoid using symbols by default when not on Mac?
+// Anyway, alternative 'Key + Key' description is provided as well
+const symbols = {
+  cmd: "⌘",
+  meta: "⌘",
+  ctrl: "⌃",
+  alt: "⌥",
+  shift: "⇧",
+  esc: "␛", //'⎋',
+  enter: "⏎",
+  backspace: "⌫",
+  plus: "+",
+  tab: "⇥",
+  space: "␣",
+  capslock: "⇪",
+  pageup: "⇞",
+  pagedown: "⇟",
+  home: "↖",
+  end: "↘",
+  left: "←",
+  right: "→",
+  up: "↑",
+  down: "↓"
+};
+
+symbols.mod = symbols[isMac ? "meta" : "ctrl"];