mcTable documentation

About

mcTable is a versatile HTML5/Canvas-based table editor designed for high performance and flexibility. It’s built to keep rendering smooth even at very large scales (up to ~1M records) while supporting editing, validation, and change tracking.

The editor supports cell editing, row insertion, deletion, and robust change tracking. Classic table capabilities (paging, resizing, column types) and Excel-like workflows (fill handle, keyboard navigation, copy/paste) are designed for operators who live in tabular UIs.

mcTable is highly configurable and supports runtime setting changes without data loss, making it suitable for web apps, Node.js/TypeScript environments, and Power BI-style embedding patterns.

Primary class

McTable

export declare class McTable {
  get api(): MctApi,
  constructor(ctorParam?: McTableCtor)
}

The entry point. After instantiation, use mcTable.api to call methods and query state (modified, invalid, inserted, deleted records, etc.).

Constructor

McTableCtor

export type McTableCtor = {
  records?: any[],
  columns?: MctColumn[],
  container?: HTMLElement,
  settings?: MctInitSettings,
  license?: MctLicense,
  onTableCreated?: (mcTable: McTable) => void
};

• records: array of your data objects.
• columns: column definitions (name/title/type + optional width).
• container: explicit mount element (recommended).
• settings: initial settings; can be changed dynamically at runtime.
• license: non-commercial or commercial key.

Columns

export type MctColumn = {
  name: string;
  title: string;
  type: MctColumnType;
  initialWidth?: number;
};

export type MctColumnType = "text" | "number" | "date" | "boolean";

Column name is the key used in your record objects.

Settings

mcTable exposes a large configuration surface (dimensions, handles, style, scroll, paging, events, validation). Most settings can be updated on-the-fly.