返回 presentation-ai
staircase-plugin.tsx
根目录 / src / components / notebook / presentation / editor / plugins / staircase-plugin.tsx
1 import { type TElement } from "platejs";
2 import { createTPlatePlugin } from "platejs/react";
3
4 import Staircase from "../custom-elements/staircase";
5 import { StairItem } from "../custom-elements/staircase-item";
6 import { STAIR_ITEM, STAIRCASE_GROUP } from "../lib";
7
8 // Create plugin for staircase group (container)
9 export const StaircaseGroupPlugin = createTPlatePlugin({
10 key: STAIRCASE_GROUP,
11 node: {
12 isElement: true,
13 type: STAIRCASE_GROUP,
14 component: Staircase,
15 },
16 options: {
17 totalChildren: 0,
18 },
19 });
20
21 // Create plugin for stair item
22 export const StairItemPlugin = createTPlatePlugin({
23 key: STAIR_ITEM,
24 node: {
25 isElement: true,
26 isStrictSiblings: true,
27 type: STAIR_ITEM,
28 component: StairItem,
29 },
30 });
31
32 // Type definitions
33 export interface TStairGroupElement extends TElement {
34 type: typeof STAIRCASE_GROUP;
35 totalChildren?: number; // Store the count on the staircase element
36 alignment?: "left" | "center" | "right";
37 variant?: "default" | "inside";
38 }
39
40 export interface TStairItemElement extends TElement {
41 type: typeof STAIR_ITEM;
42 alignment?: "left" | "center" | "right";
43 variant?: "default" | "inside";
44 icon?: string;
45 }
46
46 lines Plain Text