Table Dropdown Menu

A menu for table manipulation and formatting.

Installation

npx shadcx@latest add plate/table-dropdown-menu

Examples

Table

Table

Create customizable tables with resizable columns and rows, allowing you to design structured layouts.
Plugin
Element
Inline
Void
Heading


No
Image
Yes
No
Yes
Mention
Yes
Yes
Yes
Files
components/demo.tsx
'use client';

import React from 'react';

import { Plate } from '@udecode/plate/react';

import { editorPlugins } from '@/components/editor/plugins/editor-plugins';
import { useCreateEditor } from '@/components/editor/use-create-editor';
import { Editor, EditorContainer } from '@/components/plate-ui/editor';

import { DEMO_VALUES } from './values/demo-values';

export default function Demo({ id }: { id: string }) {
  const editor = useCreateEditor({
    plugins: [...editorPlugins],
    value: DEMO_VALUES[id],
  });

  return (
    <Plate editor={editor}>
      <EditorContainer variant="demo">
        <Editor />
      </EditorContainer>
    </Plate>
  );
}