@infinite-table/infinite-react 0.5.1 → 0.5.2

package/src/components/InfiniteTable/utils/getContextMenuForColumn.tsx

@@ -1,72 +0,0 @@
-import * as React from 'react';
-import { useCallback } from 'react';
-import { Menu } from '../../Menu';
-import { MenuState } from '../../Menu/MenuState';
-import { InfiniteTableContextValue } from '../types';
-import { defaultGetColumContextMenuItems } from './defaultGetColumContextMenuItems';
-
-export function getContextMenuForColumn<T>(
-  columnId: string | null,
-  context: InfiniteTableContextValue<T>,
-  onHideIntent?: VoidFunction,
-) {
-  if (columnId == null) {
-    return null;
-  }
-  const {
-    getComputed,
-    getState,
-    imperativeApi,
-    componentActions: actions,
-  } = context;
-
-  const { components, getColumContextMenuItems } = getState();
-
-  const MenuCmp = components?.Menu ?? Menu;
-
-  const column = getComputed().computedColumnsMap.get(columnId);
-
-  if (!column) {
-    return null;
-  }
-
-  const getItems = getColumContextMenuItems || defaultGetColumContextMenuItems;
-
-  const items = getItems({
-    column,
-    api: imperativeApi,
-    getState,
-    getComputed,
-    actions,
-  });
-
-  const onRootMouseDown: EventListener = React.useCallback((event: Event) => {
-    //@ts-ignore
-    event.__insideMenu = true;
-  }, []);
-
-  const onHide = (state: MenuState) => {
-    state.domRef.current?.parentNode?.removeEventListener(
-      'mousedown',
-      onRootMouseDown,
-    );
-  };
-
-  return (
-    <MenuCmp
-      autoFocus
-      items={items}
-      onShow={(state) => {
-        state.domRef.current?.parentNode?.addEventListener(
-          'mousedown',
-          onRootMouseDown,
-        );
-      }}
-      onHide={onHide}
-      onHideIntent={useCallback((state: MenuState) => {
-        onHide(state);
-        onHideIntent?.();
-      }, [])}
-    />
-  );
-}

package/src/components/InfiniteTable/utils/infiniteDOMUtils.ts

@@ -1,189 +0,0 @@
-import { selectParent } from '../../../utils/selectParent';
-import { stripVar } from '../../../utils/stripVar';
-import { ScrollPosition } from '../../types/ScrollPosition';
-import { internalProps } from '../internalProps';
-import { InternalVars, ThemeVars } from '../theme.css';
-import { InfiniteTableComputedColumn } from '../types';
-
-const InfiniteSelector = `.${internalProps.rootClassName}`;
-export function getParentInfiniteNode(node: HTMLElement) {
-  return selectParent(node, InfiniteSelector);
-}
-
-const scrollLeft = stripVar(InternalVars.scrollLeft);
-const scrollTop = stripVar(InternalVars.scrollTop);
-
-const columnWidthAtIndex = stripVar(InternalVars.columnWidthAtIndex);
-const columnOffsetAtIndex = stripVar(InternalVars.columnOffsetAtIndex);
-const columnReorderEffectDurationAtIndex = stripVar(
-  InternalVars.columnReorderEffectDurationAtIndex,
-);
-const columnOffsetAtIndexWhileReordering = stripVar(
-  InternalVars.columnOffsetAtIndexWhileReordering,
-);
-const columnZIndexAtIndex = stripVar(InternalVars.columnZIndexAtIndex);
-
-export function setInfiniteVarOnRoot(
-  varName: keyof typeof InternalVars | string,
-  varValue: string | number,
-  node: HTMLElement | null,
-) {
-  const infinite = node
-    ? getParentInfiniteNode(node)
-    : (document.querySelector(InfiniteSelector) as HTMLElement);
-
-  setInfiniteVarOnNode(varName, varValue, infinite);
-}
-
-export function setInfiniteVarOnNode(
-  varName: keyof typeof InternalVars | string,
-  varValue: string | number,
-  node: HTMLElement | null,
-) {
-  if (node) {
-    const prop = InternalVars[varName as keyof typeof InternalVars]
-      ? stripVar(InternalVars[varName as keyof typeof InternalVars])
-      : varName;
-
-    node.style.setProperty(prop, `${varValue}`);
-  }
-}
-
-export function setInfiniteVarsOnRoot(
-  vars: Partial<Record<keyof typeof InternalVars | string, string | number>>,
-  node: HTMLElement | null,
-) {
-  const infinite = node
-    ? getParentInfiniteNode(node)
-    : (document.querySelector(InfiniteSelector) as HTMLElement);
-
-  setInfiniteVarsOnNode(vars, infinite);
-}
-
-export function setInfiniteVarsOnNode(
-  vars: Partial<Record<keyof typeof InternalVars, string | number>>,
-  node: HTMLElement | null,
-) {
-  if (node) {
-    for (var varName in vars) {
-      node.style.setProperty(
-        InternalVars[varName as keyof typeof InternalVars]
-          ? stripVar(InternalVars[varName as keyof typeof InternalVars])
-          : varName,
-        `${vars[varName as keyof typeof InternalVars]}`,
-      );
-    }
-  }
-}
-
-export function setInfiniteColumnWidth(
-  colIndex: number,
-  colWidth: number | string,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarOnRoot(
-    `${columnWidthAtIndex}-${colIndex}`,
-    typeof colWidth === 'number' ? colWidth + 'px' : colWidth,
-    node,
-  );
-}
-
-export function setInfiniteColumnOffset(
-  colIndex: number,
-  colOffset: number | string,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarOnRoot(
-    `${columnOffsetAtIndex}-${colIndex}`,
-    typeof colOffset === 'number' ? colOffset + 'px' : colOffset,
-    node,
-  );
-}
-
-export function addToInfiniteColumnOffset<T>(
-  column: InfiniteTableComputedColumn<T>,
-  amountToAdd: number,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarOnRoot(
-    `${columnOffsetAtIndex}-${column.computedVisibleIndex}`,
-    !column.computedPinned
-      ? `${column.computedAbsoluteOffset + amountToAdd}px`
-      : `calc( ${
-          column.computedAbsoluteOffset + amountToAdd
-        }px + var(${scrollLeft}))`,
-
-    node,
-  );
-}
-
-export function setInfiniteColumnZIndex(
-  colIndex: number,
-  colZIndex: number | string,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarOnRoot(
-    `${columnZIndexAtIndex}-${colIndex}`,
-    `${colZIndex}`,
-    node,
-  );
-}
-
-export function setInfiniteColumnOffsetWhileReordering(
-  colIndex: number,
-  offset: string | number,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarOnRoot(
-    `${columnOffsetAtIndexWhileReordering}-${colIndex}`,
-    typeof offset === 'number'
-      ? `calc( var(${columnOffsetAtIndex}-${colIndex}) + ${offset}px )`
-      : offset,
-    node,
-  );
-}
-
-export function clearInfiniteColumnReorderDuration(
-  colIndex: number,
-  node: HTMLElement | null,
-  defaultValue?: string,
-) {
-  setInfiniteVarOnRoot(
-    `${columnReorderEffectDurationAtIndex}-${colIndex}`,
-    defaultValue ?? '',
-    node,
-  );
-}
-
-export function restoreInfiniteColumnReorderDuration(
-  colIndex: number,
-  node: HTMLElement | null,
-) {
-  const varName = `${columnReorderEffectDurationAtIndex}-${colIndex}`;
-
-  setInfiniteVarOnRoot(
-    varName,
-    ThemeVars.components.Cell.reorderEffectDuration,
-    node,
-  );
-}
-
-export function getCSSVarNameForColWidth(colIndex: number) {
-  return `${columnWidthAtIndex}-${colIndex}`;
-}
-export function getCSSVarNameForColOffset(colIndex: number) {
-  return `${columnOffsetAtIndex}-${colIndex}`;
-}
-
-export function setInfiniteScrollPosition(
-  scrollPosition: ScrollPosition,
-  node: HTMLElement | null,
-) {
-  setInfiniteVarsOnNode(
-    {
-      [scrollLeft]: `${scrollPosition.scrollLeft}px`,
-      [scrollTop]: `${scrollPosition.scrollTop}px`,
-    },
-    node,
-  );
-}

package/src/components/InfiniteTable/utils/mapToObject.ts

@@ -1,20 +0,0 @@
-export function mapToObject<K extends string, V>(
-  mapOrObject?: Map<K, V> | Record<K, V>,
-): Record<K, V> {
-  if (!mapOrObject) {
-    return {} as Record<K, V>;
-  }
-
-  if (mapOrObject instanceof Map) {
-    const result = {} as Record<K, V>;
-    const entries = [...mapOrObject.entries()] as [K, V][];
-
-    entries.forEach(([key, value]) => {
-      result[key] = value;
-    });
-
-    return result;
-  }
-
-  return mapOrObject;
-}

package/src/components/InfiniteTable/utils/moveXatY.ts

@@ -1,25 +0,0 @@
-export const moveXatY = <T>(
-  arr: T[],
-  dragIndex: number,
-  dropIndex: number,
-): T[] => {
-  arr = [...arr];
-  if (
-    dragIndex === dropIndex ||
-    arr[dragIndex] === undefined ||
-    arr[dropIndex] === undefined
-  ) {
-    return arr;
-  }
-  const dragItem = arr[dragIndex];
-
-  if (dropIndex < dragIndex) {
-    arr.splice(dragIndex, 1);
-    arr.splice(dropIndex, 0, dragItem);
-  } else {
-    arr.splice(dragIndex, 1);
-    arr.splice(dropIndex, 0, dragItem);
-  }
-
-  return arr;
-};

package/src/components/InfiniteTable/utils/objectValuesExcept.ts

@@ -1,9 +0,0 @@
-export function objectValuesExcept(obj: any, exceptList: Record<string, true>) {
-  const result: any[] = [];
-  for (const k in obj)
-    if (obj.hasOwnProperty(k) && !exceptList.hasOwnProperty(k)) {
-      result.push(obj[k]);
-    }
-
-  return result;
-}

package/src/components/InfiniteTable/utils/progressiveSpeedScroller.ts

@@ -1,158 +0,0 @@
-import { cancelRaf, raf } from '../../../utils/raf';
-import { NonUndefined } from '../../types/NonUndefined';
-
-type ProgressiveSpeedScrollerDynamicOptions = {
-  mousePosition: { clientX: number; clientY: number };
-
-  set scrollLeft(value: number);
-  get scrollLeft();
-};
-
-type ProgressiveSpeedScrollerStaticOptions = {
-  scrollOffsetEnd: number;
-  scrollOffsetStart: number;
-  offset?: number;
-  scrollAmountsPerRaf?: number[];
-};
-
-type ProgressiveSpeedScrollerOptions = ProgressiveSpeedScrollerStaticOptions &
-  ProgressiveSpeedScrollerDynamicOptions & {
-    offset: NonUndefined<ProgressiveSpeedScrollerStaticOptions['offset']>;
-  } & {
-    scrollAmountsPerRaf: NonUndefined<
-      ProgressiveSpeedScrollerStaticOptions['scrollAmountsPerRaf']
-    >;
-  };
-
-export const progressiveSpeedScroller = (
-  staticOptions: ProgressiveSpeedScrollerStaticOptions,
-) => {
-  let scrollLeftRafId: number | null = null;
-  let scrollRightRafId: number | null = null;
-
-  return {
-    stop() {
-      if (scrollLeftRafId !== null) {
-        cancelRaf(scrollLeftRafId);
-      }
-      if (scrollRightRafId != null) {
-        cancelRaf(scrollRightRafId);
-      }
-    },
-    scroll(dynamicOptions: ProgressiveSpeedScrollerDynamicOptions) {
-      if (scrollLeftRafId !== null) {
-        cancelRaf(scrollLeftRafId);
-      }
-      if (scrollRightRafId != null) {
-        cancelRaf(scrollRightRafId);
-      }
-
-      const opts: ProgressiveSpeedScrollerOptions = {
-        offset: 100,
-        scrollAmountsPerRaf: [1, 1, 2, 4, 6, 8, 11, 15],
-        ...staticOptions,
-        ...dynamicOptions,
-      };
-
-      const self = this;
-
-      function scrollLeft() {
-        /**
-         * 0 - viewport    scrollOffsetStart
-         *      left
-         * .----------------.----------------. scrollOffsetStart + offset
-         * |                |                |
-         * |                |                |
-         * |                |                |     <- the user goes in this direction with the arrow
-         * |                |                |
-         * |                |     x mouse    |
-         * |                |                |
-         *                        | -------  |  - this is margin distance - the distance the user entered the offset
-         *
-         */
-
-        const marginDistance =
-          opts.scrollOffsetStart + opts.offset - opts.mousePosition.clientX;
-
-        const shouldScrollLeft =
-          marginDistance > 0 && marginDistance <= opts.offset;
-
-        if (!shouldScrollLeft) {
-          return false;
-        }
-
-        const segmentCount = opts.scrollAmountsPerRaf.length;
-        const segmentDistance = Math.round(opts.offset / segmentCount);
-
-        let speed: number = 0;
-        for (let i = 0; i < segmentCount; i++) {
-          if (marginDistance > (i + 1) * segmentDistance) {
-            speed = opts.scrollAmountsPerRaf[i];
-          }
-        }
-
-        dynamicOptions.scrollLeft = dynamicOptions.scrollLeft - speed;
-
-        scrollLeftRafId = raf(() => {
-          self.scroll(dynamicOptions);
-        });
-
-        return true;
-      }
-
-      /**
-       * 0 - viewport    scrollOffsetEnd - offset
-       *      left
-       * .----------------.----------------. scrollOffsetEnd
-       * |                |                |
-       * |                |                |
-       * |                |                |
-       * |                |                |
-       * |                |     x mouse    |
-       * |                |                |
-       *                  |  -----|        |  - this is margin distance - the distance the user entered the offset
-       *
-       * the user goes in this    ->
-       *    direction with the arrow
-       *
-       */
-      function scrollRight() {
-        const marginDistance =
-          opts.mousePosition.clientX - (opts.scrollOffsetEnd - opts.offset);
-
-        const shouldScrollRight =
-          marginDistance > 0 && marginDistance <= opts.offset;
-
-        if (!shouldScrollRight) {
-          return false;
-        }
-
-        const segmentCount = opts.scrollAmountsPerRaf.length;
-        const segmentDistance = Math.round(opts.offset / segmentCount);
-
-        let speed: number = 0;
-        for (let i = 0; i < segmentCount; i++) {
-          if (marginDistance > (i + 1) * segmentDistance) {
-            speed = opts.scrollAmountsPerRaf[i];
-          }
-        }
-
-        dynamicOptions.scrollLeft = dynamicOptions.scrollLeft + speed;
-
-        scrollRightRafId = raf(() => {
-          self.scroll(dynamicOptions);
-        });
-
-        return true;
-      }
-
-      if (scrollLeft()) {
-        return true;
-      }
-      if (scrollRight()) {
-        return true;
-      }
-      return false;
-    },
-  };
-};

package/src/components/InfiniteTable/utils/rafFn.ts

@@ -1,13 +0,0 @@
-export const rafFn = (fn: (...args: any[]) => void) => {
-  let rafId: number = 0;
-
-  return (...args: any[]) => {
-    if (rafId) {
-      cancelAnimationFrame(rafId);
-    }
-    rafId = requestAnimationFrame(() => {
-      rafId = 0;
-      fn(...args);
-    });
-  };
-};

package/src/components/InfiniteTable/utils/toCSSVarName.ts

@@ -1 +0,0 @@
-export const toCSSVarName = (value: string | null) => `--infinite-${value}`;

package/src/components/InfiniteTable/utils/toMap.ts

@@ -1,24 +0,0 @@
-export function toMap<K extends string, V>(
-  mapOrObject?: Map<K, V> | Record<K, V>,
-  weakMapCache?: WeakMap<any, any>,
-): Map<K, V> {
-  if (!mapOrObject) {
-    return new Map<K, V>();
-  }
-
-  if (mapOrObject instanceof Map) {
-    return mapOrObject;
-  }
-
-  if (weakMapCache && weakMapCache.has(mapOrObject)) {
-    return weakMapCache.get(mapOrObject) as Map<K, V>;
-  }
-
-  const result = new Map<K, V>(Object.entries(mapOrObject) as [K, V][]);
-
-  if (weakMapCache) {
-    weakMapCache.set(mapOrObject, result);
-  }
-
-  return result;
-}