@atlaskit/renderer/dist/types/react/nodes/tableNew.d.ts

Renderer component

import React from 'react';
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
import type { TableLayout } from '@atlaskit/adf-schema';
import type { OverflowShadowProps } from '@atlaskit/editor-common/ui';
import { SortOrder } from '@atlaskit/editor-common/types';
import type { RendererAppearance, StickyHeaderConfig } from '../../ui/Renderer/types';
import type { WithSmartCardStorageProps } from '../../ui/SmartCardStorage';
import type { StickyMode } from './table/sticky';
import { OverflowParent } from './table/sticky';
import type { SharedTableProps } from './table/types';
import { TableStickyScrollbar } from './TableStickyScrollbar';
export type TableArrayMapped = {
    rowNodes: Array<PMNode | null>;
    rowReact: React.ReactElement;
};
export declare const isTableResizingEnabled: (appearance: RendererAppearance) => boolean;
export declare const isStickyScrollbarEnabled: (appearance: RendererAppearance) => boolean;
export declare const orderChildren: (children: React.ReactElement[], tableNode: PMNode, smartCardStorage: WithSmartCardStorageProps["smartCardStorage"], tableOrderStatus?: TableOrderStatus) => React.ReactElement[];
export declare const hasRowspan: (row: PMNode) => boolean;
export declare const getRefTop: (refElement: HTMLElement) => number;
export declare const shouldHeaderStick: (scrollTop: number, tableTop: number, tableBottom: number, rowHeight: number) => boolean;
export declare const shouldHeaderPinBottom: (scrollTop: number, tableBottom: number, rowHeight: number) => boolean;
export declare const addSortableColumn: (rows: React.ReactElement<any>[], tableOrderStatus: TableOrderStatus | undefined, onSorting: (columnIndex: number, sortOrder: SortOrder) => void) => React.ReactElement<any, string | React.JSXElementConstructor<any>>[];
export type TableProps = SharedTableProps & {
    allowColumnSorting?: boolean;
    allowTableAlignment?: boolean;
    allowTableResizing?: boolean;
    children: React.ReactElement<any> | Array<React.ReactElement<any>>;
    isPresentational?: boolean;
    rendererAppearance?: RendererAppearance;
    stickyHeaders?: StickyHeaderConfig;
    tableNode?: PMNode;
};
export declare const isHeaderRowEnabled: (rows: (React.ReactChild | React.ReactFragment | React.ReactPortal)[]) => any;
export declare const tableCanBeSticky: (node: PMNode | undefined, children: (React.ReactChild | React.ReactFragment | React.ReactPortal)[]) => any;
export interface TableOrderStatus {
    columnIndex: number;
    order: SortOrder;
}
export interface TableState {
    headerRowHeight: number;
    stickyMode: StickyMode;
    wrapperWidth: number;
}
/**
 * Reads `nestedRendererType` from RendererContext and renders the fake left/right
 * borders only when the current renderer is the nested renderer for a reference
 * synced block.
 */
export declare const RefSyncBlockFakeBorders: ({ isNumberColumnEnabled, }: {
    isNumberColumnEnabled: boolean;
}) => React.JSX.Element | null;
/**
 * TableContainer renders tables using only CSS-based rules
 */
/**
 *
 */
export declare class TableContainer extends React.Component<TableProps & OverflowShadowProps & WithSmartCardStorageProps, TableState> {
    state: TableState;
    tableRef: React.RefObject<HTMLTableElement>;
    stickyHeaderRef: React.RefObject<HTMLElement>;
    stickyScrollbarRef: React.RefObject<HTMLDivElement>;
    stickyWrapperRef: React.RefObject<HTMLDivElement>;
    wrapperRef: React.RefObject<HTMLDivElement>;
    stickyScrollbar?: TableStickyScrollbar;
    nextFrame: number | undefined;
    overflowParent: OverflowParent | null;
    updatedLayout: TableLayout | 'custom';
    private containerRef;
    private _isInsideNestedRenderer;
    private lastComputedStyle;
    private resizeObserver;
    private applyResizerChange;
    /**
     * Checks if this table is inside a nested renderer (e.g. Include Page macro)
     * by looking for multiple .ak-renderer-document ancestors in the DOM.
     * The result is cached since a table's position in the DOM tree is stable after mount.
     */
    private isInsideNestedRenderer;
    /**
     * For tables inside nested renderers (e.g. Include Page macro), the parent
     * renderer's CSS override forces width:100%!important and left:0!important
     * which overrides the inline styles set by this component. Using
     * style.setProperty with 'important' priority on inline styles beats
     * stylesheet !important rules per the CSS cascade.
     *
     * Uses lastComputedStyle (populated during render) rather than reading from
     * element.style, because React may remove properties from the DOM when their
     * values transition to undefined between renders.
     */
    private applyNestedRendererTableFix;
    /**
     * Callback ref that captures the container DOM element and also forwards
     * to the handleRef prop from the overflow shadow HOC.
     */
    private setContainerRef;
    /**
     * Starts observing table dimensions and wires sticky header/scrollbar behavior after mount.
     *
     * @example
     */
    componentDidMount(): void;
    /**
     * Updates sticky header wiring and scroll synchronization after prop or state changes.
     *
     * @param prevProps
     * @param prevState
     * @example
     */
    componentDidUpdate(prevProps: TableProps, prevState: TableState): void;
    componentWillUnmount: () => void;
    getScrollTop: () => number;
    updateSticky: () => void;
    onScroll: () => void;
    onWrapperScrolled: () => void;
    /**
     * Calculates the top offset used when the sticky header is pinned to the table bottom.
     */
    get pinTop(): number | undefined;
    /**
     * Determines whether sticky header positioning should include the default scroll root offset.
     */
    get shouldAddOverflowParentOffsetTop_DO_NOT_USE(): boolean | null | undefined;
    /**
     * Resolves the top position for the sticky header based on the current sticky mode.
     */
    get stickyTop(): number | undefined;
    /**
     * Renders the table container, sticky header, table content, sticky scrollbar, and synced block borders.
     *
     * @example
     */
    render(): React.JSX.Element;
    private grabFirstRowRef;
}
type TableProcessorState = {
    tableOrderStatus?: TableOrderStatus;
};
/**
 * Processes table children before passing them to the styled table container.
 */
export declare class TableProcessorWithContainerStyles extends React.Component<TableProps & OverflowShadowProps & WithSmartCardStorageProps, TableProcessorState> {
    state: {
        tableOrderStatus: undefined;
    };
    /**
     * Renders processed table children inside the table container.
     *
     * @example
     */
    render(): React.JSX.Element | null;
    private addSortableColumn;
    private changeSortOrder;
    private addNumberColumnIndexes;
}
export {};