@teselagen/ui 0.9.6 → 0.9.7

package/src/DataTable/utils/computePresets.js

@@ -0,0 +1,42 @@
+import { omitBy, isNil } from "lodash-es";
+//we use this to make adding preset prop groups simpler
+export default function computePresets(props = {}) {
+  const { isSimple } = props;
+  let toReturn = omitBy(props, isNil);
+  toReturn.pageSize = toReturn.controlled_pageSize || toReturn.pageSize;
+  if (isSimple) {
+    //isSimplePreset
+    toReturn = {
+      noHeader: true,
+      noFooter: !props.withPaging,
+      noPadding: true,
+      noFullscreenButton: true,
+      hidePageSizeWhenPossible: !props.withPaging,
+      isInfinite: !props.withPaging,
+      hideSelectedCount: true,
+      withTitle: false,
+      withSearch: false,
+      compact: true,
+      withPaging: false,
+      withFilter: false,
+      ...toReturn
+    };
+  } else {
+    toReturn = {
+      // the usual defaults:
+      noFooter: false,
+      noPadding: false,
+      compact: true,
+      noFullscreenButton: false,
+      hidePageSizeWhenPossible: false,
+      isInfinite: false,
+      hideSelectedCount: false,
+      withTitle: true,
+      withSearch: true,
+      withPaging: true,
+      withFilter: true,
+      ...toReturn
+    };
+  }
+  return toReturn || {};
+}

package/src/DataTable/utils/convertSchema.ts

@@ -0,0 +1,79 @@
+import { camelCase } from "lodash-es";
+import { startCase, keyBy, map } from "lodash-es";
+
+type Field = {
+  type?: string;
+  displayName?: string;
+  path?: string;
+  filterDisabled?: boolean;
+  sortDisabled?: boolean;
+};
+
+type Schema = { fields: (Field | string)[] };
+
+type CompleteField = Field & {
+  type: string;
+  displayName: string;
+  path: string;
+};
+
+type CompleteSchema = {
+  fields: CompleteField[];
+};
+
+const convertSchema = (schema: Schema): CompleteSchema => {
+  let schemaToUse = schema;
+  if (!schemaToUse.fields && Array.isArray(schema)) {
+    schemaToUse = {
+      fields: schema
+    };
+  }
+  schemaToUse = {
+    ...schemaToUse
+  };
+  schemaToUse.fields = schemaToUse.fields.map((field, i) => {
+    if (typeof field === "string") {
+      return {
+        displayName: startCase(camelCase(field)),
+        path: field,
+        type: "string"
+      };
+    } else {
+      const fieldToUse = { ...(field as Field) };
+      fieldToUse.type = fieldToUse.type || "string";
+      fieldToUse.displayName =
+        fieldToUse.displayName || startCase(camelCase(fieldToUse.path || ""));
+      // paths are needed for column resizing
+      if (!fieldToUse.path) {
+        fieldToUse.filterDisabled = true;
+        fieldToUse.sortDisabled = true;
+        fieldToUse.path = "fake-path" + i;
+      }
+      return fieldToUse as CompleteField;
+    }
+  });
+  return schemaToUse as CompleteSchema;
+};
+
+export function mergeSchemas(_originalSchema: Schema, _overrideSchema: Schema) {
+  const originalSchema = convertSchema(_originalSchema);
+  const overrideSchema = convertSchema(_overrideSchema);
+
+  const overridesByKey = keyBy(overrideSchema.fields, "path");
+  return {
+    ...originalSchema,
+    ...overrideSchema,
+    fields: originalSchema.fields
+      .map(f => {
+        const override = overridesByKey[f.path];
+        if (override) {
+          delete overridesByKey[f.path];
+          return override;
+        }
+        return f;
+      })
+      .concat(map(overridesByKey))
+  };
+}
+
+export default convertSchema;

package/src/DataTable/utils/formatPasteData.ts

@@ -0,0 +1,34 @@
+import { getFieldPathToField } from "./getFieldPathToField";
+import type { Schema } from "./types/Schema";
+
+type GenericSelectValue = {
+  __strVal: string;
+  __genSelCol: string;
+};
+
+export const formatPasteData = ({
+  schema,
+  newVal,
+  path
+}: {
+  schema: Schema;
+  newVal: GenericSelectValue | string | number | boolean | null | undefined;
+  path: string;
+}) => {
+  const pathToField = getFieldPathToField(schema);
+  const column = pathToField[path];
+  if (column.type === "genericSelect") {
+    const value = newVal as GenericSelectValue;
+    if (value.__genSelCol === path) {
+      newVal = value.__strVal;
+    } else {
+      newVal = undefined;
+    }
+  } else {
+    newVal =
+      typeof newVal === "object" && newVal !== null && "__strVal" in newVal
+        ? newVal.__strVal
+        : newVal;
+  }
+  return newVal;
+};

package/src/DataTable/utils/getAllRows.ts

@@ -0,0 +1,11 @@
+import type { RefObject } from "react";
+
+export const getAllRows = (
+  tableRef: RefObject<{ tableRef: HTMLDivElement }>
+) => {
+  const allRowEls = tableRef.current?.tableRef?.querySelectorAll(".rt-tr");
+  if (!allRowEls || !allRowEls.length) {
+    return;
+  }
+  return allRowEls;
+};

package/src/DataTable/utils/getCellCopyText.ts

@@ -0,0 +1,7 @@
+export const getCellCopyText = (cellWrapper: HTMLElement | null) => {
+  const text = cellWrapper?.getAttribute("data-copy-text");
+  const jsonText = cellWrapper?.getAttribute("data-copy-json");
+
+  const textContent = text || cellWrapper?.textContent || "";
+  return [textContent, jsonText];
+};

package/src/DataTable/utils/getCellInfo.ts

@@ -0,0 +1,46 @@
+import { getIdOrCodeOrIndex } from "./getIdOrCodeOrIndex";
+import { Entity } from "./types/Entity";
+
+export const getCellInfo = <T extends Entity>({
+  columnIndex,
+  columnPath,
+  rowId,
+  schema,
+  entities,
+  rowIndex,
+  isEntityDisabled,
+  entity
+}: {
+  columnIndex: number;
+  columnPath: string;
+  rowId: string | number;
+  schema: { fields: { path: string }[] };
+  entities: T[];
+  rowIndex: number;
+  isEntityDisabled: (entity: T) => boolean;
+  entity: T;
+}) => {
+  const leftpath = schema.fields[columnIndex - 1]?.path;
+  const rightpath = schema.fields[columnIndex + 1]?.path;
+  const cellIdToLeft = leftpath && `${rowId}:${leftpath}`;
+  const cellIdToRight = rightpath && `${rowId}:${rightpath}`;
+  const rowAboveId =
+    entities[rowIndex - 1] &&
+    getIdOrCodeOrIndex(entities[rowIndex - 1], rowIndex - 1);
+  const rowBelowId =
+    entities[rowIndex + 1] &&
+    getIdOrCodeOrIndex(entities[rowIndex + 1], rowIndex + 1);
+  const cellIdAbove = rowAboveId && `${rowAboveId}:${columnPath}`;
+  const cellIdBelow = rowBelowId && `${rowBelowId}:${columnPath}`;
+
+  const cellId = `${rowId}:${columnPath}`;
+  const rowDisabled = isEntityDisabled(entity);
+  return {
+    cellId,
+    cellIdAbove,
+    cellIdToRight,
+    cellIdBelow,
+    cellIdToLeft,
+    rowDisabled
+  };
+};

package/src/DataTable/utils/getFieldPathToField.ts

@@ -0,0 +1,10 @@
+import { Field } from "./types/Field";
+import { Schema } from "./types/Schema";
+
+export const getFieldPathToField = (schema: Schema) => {
+  const fieldPathToField: { [path: string]: Field } = {};
+  schema.fields.forEach(f => {
+    fieldPathToField[f.path] = f;
+  });
+  return fieldPathToField;
+};

package/src/DataTable/utils/getIdOrCodeOrIndex.ts

@@ -0,0 +1,14 @@
+import type { Entity } from "./types/Entity";
+
+export const getIdOrCodeOrIndex = (record: Entity, rowIndex?: number) => {
+  if ("id" in record && (record.id || record.id === 0)) {
+    return record.id;
+  } else if ("code" in record && record.code) {
+    return record.code;
+  } else {
+    if (rowIndex === undefined || rowIndex === null) {
+      throw new Error("id, code, or rowIndex must be provided");
+    }
+    return rowIndex;
+  }
+};

package/src/DataTable/utils/getLastSelectedEntity.ts

@@ -0,0 +1,15 @@
+import { Entity } from "./types/Entity";
+
+export const getLastSelectedEntity = (idMap: {
+  [id: string]: { time: number; entity: Entity };
+}) => {
+  let lastSelectedEnt;
+  let latestTime: number | null = null;
+  Object.values(idMap).forEach(({ time, entity }) => {
+    if (!latestTime || time > latestTime) {
+      lastSelectedEnt = entity;
+      latestTime = time;
+    }
+  });
+  return lastSelectedEnt;
+};

package/src/DataTable/utils/getNewEntToSelect.ts

@@ -0,0 +1,32 @@
+import { Entity } from "./types/Entity";
+
+export const getNewEntToSelect = ({
+  type,
+  lastSelectedIndex,
+  entities,
+  isEntityDisabled
+}: {
+  type: "up" | "down";
+  lastSelectedIndex: number;
+  entities: Entity[];
+  isEntityDisabled?: (entity: Entity) => boolean;
+}): Entity | undefined => {
+  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
+    }) as Entity;
+  } else {
+    return newEntToSelect;
+  }
+};

package/src/DataTable/utils/initializeHasuraWhereAndFilter.ts

@@ -0,0 +1,35 @@
+type Filter = {
+  [key: string]:
+    | { _eq: string | number | boolean }
+    | { _in: (string | number | boolean)[] }
+    | { _gt: number }
+    | { _lt: number }
+    | { _gte: number }
+    | { _lte: number };
+};
+type Where = { _and?: Filter[]; _or?: Filter[] };
+type CurrentParams = object;
+
+export function initializeHasuraWhereAndFilter(
+  additionalFilter:
+    | ((where: Where, currentParams: CurrentParams) => Filter | void)
+    | Filter
+    | undefined
+    | null,
+  where: Where = {},
+  currentParams: CurrentParams
+) {
+  where._and = where._and || [];
+  where._or = where._or || [];
+  if (typeof additionalFilter === "function") {
+    const newWhere = additionalFilter(where, currentParams);
+    if (newWhere) {
+      Object.assign(where, newWhere);
+    }
+  } else if (
+    typeof additionalFilter === "object" &&
+    additionalFilter !== null
+  ) {
+    where._and.push(additionalFilter);
+  }
+}

package/src/DataTable/utils/isBottomRightCornerOfRectangle.ts

@@ -0,0 +1,27 @@
+export const isBottomRightCornerOfRectangle = ({
+  cellId,
+  selectionGrid,
+  lastRowIndex,
+  lastCellIndex,
+  entityMap,
+  pathToIndex
+}: {
+  cellId: string;
+  selectionGrid: (string | undefined)[][];
+  lastRowIndex: number;
+  lastCellIndex: number;
+  entityMap: Record<string, { i: number }>;
+  pathToIndex: Record<string, number>;
+}) => {
+  selectionGrid.forEach(row => {
+    // remove undefineds from start of row
+    while (row[0] === undefined && row.length) row.shift();
+  });
+  const [rowId, cellPath] = cellId.split(":");
+  const ent = entityMap[rowId];
+  if (!ent) return;
+  const { i } = ent;
+  const cellIndex = pathToIndex[cellPath];
+  const isBottomRight = i === lastRowIndex && cellIndex === lastCellIndex;
+  return isBottomRight;
+};

package/src/DataTable/utils/isEntityClean.ts

@@ -0,0 +1,15 @@
+export function isEntityClean(e: { [key: string]: unknown } | null): boolean {
+  if (typeof e !== "object" || e === null) {
+    return true; // or return false depending on what you want for non-object inputs
+  }
+  let isClean = true;
+  for (const [key, val] of Object.entries(e)) {
+    if (key === "id") continue;
+    if (key === "_isClean") continue;
+    if (val) {
+      isClean = false;
+      break;
+    }
+  }
+  return isClean;
+}

package/src/DataTable/utils/primarySelectedValue.ts

@@ -0,0 +1 @@
+export const PRIMARY_SELECTED_VAL = "main_cell";

package/src/DataTable/utils/removeCleanRows.ts

@@ -0,0 +1,26 @@
+import { isEntityClean } from "./isEntityClean";
+import { getIdOrCodeOrIndex } from "./getIdOrCodeOrIndex";
+import { Entity } from "./types/Entity";
+
+export const removeCleanRows = (
+  entities: Entity[],
+  cellValidation: Record<string, unknown>
+) => {
+  const toFilterOut: Record<string, boolean> = {};
+  const entsToUse = (entities || []).filter(e => {
+    if (!(e._isClean || isEntityClean(e))) return true;
+    else {
+      toFilterOut[getIdOrCodeOrIndex(e)] = true;
+      return false;
+    }
+  });
+
+  const validationToUse: Record<string, unknown> = {};
+  Object.entries(cellValidation || {}).forEach(([k, v]) => {
+    const [rowId] = k.split(":");
+    if (!toFilterOut[rowId]) {
+      validationToUse[k] = v;
+    }
+  });
+  return { entsToUse, validationToUse };
+};

package/src/DataTable/utils/selection.ts

@@ -0,0 +1,11 @@
+import { getIdOrCodeOrIndex } from "./getIdOrCodeOrIndex";
+
+export const getSelectedRowsFromEntities = (
+  entities: { [key: string]: unknown }[],
+  idMap: Record<string, boolean>
+) => {
+  if (!idMap) return [];
+  return entities.reduce((acc: number[], entity, i) => {
+    return idMap[getIdOrCodeOrIndex(entity, i)] ? acc.concat([i]) : acc;
+  }, []);
+};

package/src/DataTable/utils/types/Entity.ts

@@ -0,0 +1,13 @@
+type SharedFields = {
+  _isClean?: boolean;
+};
+
+export type Entity = (
+  | {
+      id?: string | number;
+    }
+  | {
+      code?: string;
+    }
+) &
+  SharedFields;

package/src/DataTable/utils/types/Field.ts

@@ -0,0 +1,4 @@
+export type Field = {
+  path: string;
+  type: "genericSelect" | string;
+};

package/src/DataTable/utils/types/OrderBy.ts

@@ -0,0 +1,15 @@
+type OrderByClause<T = { id: string }> = {
+  path?: string;
+  direction?: "asc" | "desc";
+  type?: string;
+  sortFn?:
+    | ((record: T) => unknown)
+    | string
+    | Array<((record: T) => unknown) | string>;
+  getValueToFilterOn?: (record: T) => unknown;
+};
+
+export type OrderBy =
+  | OrderByClause
+  | OrderByClause[]
+  | Record<string, "asc" | "desc">;

package/src/DataTable/utils/types/Schema.ts

@@ -0,0 +1,5 @@
+import { Field } from "./Field";
+
+export type Schema = {
+  fields: Field[];
+};

package/src/DataTable/utils/useDeepEqualMemo.js

@@ -0,0 +1,10 @@
+import { isEqual } from "lodash-es";
+import { useRef } from "react";
+
+export const useDeepEqualMemo = value => {
+  const ref = useRef();
+  if (!isEqual(value, ref.current)) {
+    ref.current = value;
+  }
+  return ref.current;
+};