@infinite-table/infinite-react 0.5.1 → 0.5.2

package/src/components/InfiniteTable/components/InfiniteTableLicenseFooter/index.tsx

@@ -1,110 +0,0 @@
-import * as React from 'react';
-import { Ref, useEffect } from 'react';
-
-import { useInternalProps } from '../../hooks/useInternalProps';
-import { join } from '../../../../utils/join';
-
-import { decamelize } from '../../../utils/decamelize';
-import { ThemeVars } from '../../theme.css';
-import { FooterCls } from '../../InfiniteCls.css';
-import { raf } from '../../../../utils/raf';
-
-const defaultStyle: React.CSSProperties = {
-  padding: ThemeVars.spacing[2],
-  textAlign: 'end',
-  opacity: '1',
-  visibility: 'visible',
-  display: 'block',
-  fontSize: '0.85rem',
-  background: 'white',
-  color: 'black',
-};
-
-const anchorStyle: React.CSSProperties = {
-  opacity: 1,
-  visibility: 'visible',
-  display: 'inline-block',
-  pointerEvents: 'all',
-  color: 'black',
-  textDecoration: 'underline',
-};
-
-const enforceStyle = (node: HTMLElement | null, style: React.CSSProperties) => {
-  if (!node) {
-    // TODO protect against Footer node removal
-    return;
-  }
-  for (const [propertyName, propertyValue] of Object.entries(style)) {
-    node.style.setProperty(
-      decamelize(propertyName),
-      propertyValue,
-      'important',
-    );
-  }
-};
-
-export const InfiniteTableLicenseFooter = React.forwardRef(
-  function InfiniteTableLicenseFooter(
-    props: React.HTMLAttributes<HTMLDivElement>,
-    ref: Ref<HTMLDivElement>,
-  ) {
-    const { rootClassName } = useInternalProps();
-
-    const domRef = React.useRef<HTMLDivElement | null>(null);
-    const domCallback = React.useCallback((node: HTMLDivElement | null) => {
-      domRef.current = node;
-      if (!ref) {
-        return;
-      }
-      if (typeof ref === 'function') {
-        ref(node);
-      } else {
-        (ref as React.MutableRefObject<HTMLDivElement | null>).current = node;
-      }
-    }, []);
-
-    useEffect(() => {
-      const forceStyle = () => {
-        raf(() => {
-          enforceStyle(domRef.current, defaultStyle);
-          enforceStyle(
-            domRef.current?.firstElementChild as HTMLElement | null,
-            anchorStyle,
-          );
-        });
-      };
-
-      forceStyle();
-
-      const intervalId = setInterval(forceStyle, 1000);
-
-      return () => {
-        clearInterval(intervalId);
-      };
-    }, []);
-
-    return (
-      <div
-        ref={domCallback}
-        {...props}
-        className={join(
-          `${rootClassName}-Footer`,
-          FooterCls,
-
-          props.className,
-        )}
-        style={defaultStyle}
-      >
-        Powered by{' '}
-        <a
-          href="https://infinite-table.com"
-          rel="noopener noreferrer"
-          role="link"
-          target="_blank"
-        >
-          Infinite Table
-        </a>
-      </div>
-    );
-  },
-);

package/src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableCell.tsx

@@ -1,120 +0,0 @@
-import * as React from 'react';
-
-import { join } from '../../../../utils/join';
-import { stripVar } from '../../../../utils/stripVar';
-
-import { internalProps } from '../../internalProps';
-import { InternalVars } from '../../theme.css';
-import {
-  cssEllipsisClassName,
-  justifyContent,
-  overflow,
-} from '../../utilities.css';
-import { ColumnCellCls } from '../cell.css';
-
-import { InfiniteTableCellProps } from './InfiniteTableCellTypes';
-
-const { rootClassName } = internalProps;
-
-export const InfiniteTableCellClassName = `${rootClassName}Cell`;
-export const InfiniteTableCellContentClassName = `${rootClassName}Cell_content`;
-
-const columnWidthAtIndex = stripVar(InternalVars.columnWidthAtIndex);
-const columnReorderEffectDurationAtIndex = stripVar(
-  InternalVars.columnReorderEffectDurationAtIndex,
-);
-
-function InfiniteTableCellFn<T>(
-  props: InfiniteTableCellProps<T> & React.HTMLAttributes<HTMLElement>,
-) {
-  const {
-    cssEllipsis = true,
-    virtualized = true,
-    skipColumnShifting = false,
-
-    contentStyle,
-    column,
-    domRef,
-    width,
-
-    contentClassName,
-
-    rowId,
-
-    afterChildren,
-    beforeChildren,
-
-    cellType,
-    cssPosition: _cssPosition,
-    renderChildren,
-    ...domProps
-  } = props;
-
-  const children = renderChildren();
-
-  // TODO very important - dont access any context here,
-  // otherwise we'll be re-rendering all cells every time
-  // something changes, and this could be very costly for performance
-  // so remove the call to useInfiniteTableState
-  const style = {
-    width: `var(${columnWidthAtIndex}-${column.computedVisibleIndex})`,
-    transition: `transform var(${columnReorderEffectDurationAtIndex}-${column.computedVisibleIndex}, 0s)`,
-    ...domProps.style,
-  } as React.CSSProperties;
-
-  const finalDOMProps = {
-    ...domProps,
-    style,
-
-    // do not remove this from here, as it's being used by auto sizing - the `useAutoSizeColumns` fn hook
-    'data-column-id': column.id,
-    'data-z-index': style.zIndex,
-    className: join(
-      domProps.className,
-
-      justifyContent[column.align ?? 'start'],
-      InfiniteTableCellClassName,
-      ColumnCellCls,
-      // shifting
-      //   ? `${InfiniteTableCellClassName}--shifting ${CellClsVariants.shifting}`
-      //   : '',
-    ),
-    children: (
-      <>
-        {beforeChildren}
-        {
-          <div
-            className={join(
-              InfiniteTableCellContentClassName,
-              cssEllipsis ? cssEllipsisClassName : overflow.hidden,
-              contentClassName,
-            )}
-            style={contentStyle}
-          >
-            {children}
-          </div>
-        }
-        {afterChildren}
-      </>
-    ),
-  };
-
-  if (rowId != null) {
-    //@ts-ignore
-    finalDOMProps['data-row-id'] = `${rowId}`;
-  }
-
-  const RenderComponent =
-    cellType === 'body'
-      ? column.components?.ColumnCell
-      : column.components?.HeaderCell;
-  if (RenderComponent) {
-    return <RenderComponent {...finalDOMProps} />;
-  }
-  return <div {...finalDOMProps} ref={domRef} />;
-}
-
-export const InfiniteTableCell = React.memo(
-  InfiniteTableCellFn,
-) as typeof InfiniteTableCellFn;
-// export const TableCell = TableCellFn;

package/src/components/InfiniteTable/components/InfiniteTableRow/InfiniteTableCellTypes.ts

@@ -1,74 +0,0 @@
-import { CSSProperties } from 'react';
-
-import { InfiniteTableComputedColumn } from '../..';
-import { Renderable } from '../../../types/Renderable';
-import { OnResizeFn } from '../../../types/Size';
-import {
-  InfiniteTableRowInfo,
-  InfiniteTablePropGroupRenderStrategy,
-  InfiniteTablePropRowStyle,
-  InfiniteTablePropRowClassName,
-  InfiniteTablePropHeaderOptions,
-} from '../../types';
-import { InfiniteTableToggleGroupRowFn } from '../../types/InfiniteTableColumn';
-
-export type InfiniteTableBaseCellProps<T> = {
-  column: InfiniteTableComputedColumn<T>;
-
-  rowId?: any;
-
-  renderChildren: () => Renderable;
-  width: number;
-  cssEllipsis?: boolean;
-  // children: Renderable;
-  contentStyle?: CSSProperties;
-  contentClassName?: string;
-  virtualized?: boolean;
-  skipColumnShifting?: boolean;
-
-  beforeChildren?: Renderable;
-  afterChildren?: Renderable;
-
-  cssPosition?: CSSProperties['position'];
-  domRef?: React.RefCallback<HTMLElement>;
-};
-export type InfiniteTableCellProps<T> =
-  | ({
-      cellType: 'header';
-    } & InfiniteTableBaseCellProps<T>)
-  | ({
-      cellType: 'body';
-    } & InfiniteTableBaseCellProps<T>);
-
-export interface InfiniteTableColumnCellProps<T>
-  extends Omit<
-    InfiniteTableCellProps<T>,
-    'children' | 'cellType' | 'renderChildren'
-  > {
-  columnsMap: Map<string, InfiniteTableComputedColumn<T>>;
-  fieldsToColumn: Map<keyof T, InfiniteTableComputedColumn<T>>;
-  onMouseEnter?: VoidFunction;
-  onMouseLeave?: VoidFunction;
-  showZebraRows: boolean;
-  virtualized: boolean;
-  hidden: boolean;
-  rowInfo: InfiniteTableRowInfo<T>;
-  groupRenderStrategy: InfiniteTablePropGroupRenderStrategy;
-  getData: () => InfiniteTableRowInfo<T>[];
-  toggleGroupRow: InfiniteTableToggleGroupRowFn;
-  rowIndex: number;
-  rowHeight: number;
-  rowStyle?: InfiniteTablePropRowStyle<T>;
-  rowClassName?: InfiniteTablePropRowClassName<T>;
-}
-
-export interface InfiniteTableHeaderCellProps<T>
-  extends Omit<
-    InfiniteTableCellProps<T>,
-    'children' | 'cellType' | 'renderChildren'
-  > {
-  columnsMap: Map<string, InfiniteTableComputedColumn<T>>;
-  height: number;
-  headerOptions: InfiniteTablePropHeaderOptions;
-  onResize?: OnResizeFn;
-}