definePlugin

import { definePlugin } from "@izumisy/seizen-table/plugin";

function definePlugin<TData, TSchema extends z.ZodType>(
  options: DefinePluginOptions<TData, TSchema>
): {
  configure: (config: z.input<TSchema>) => SeizenTablePlugin<TData>
}

import { z } from "zod";
import { definePlugin, usePluginContext, usePluginArgs } from "@izumisy/seizen-table/plugin";

// Define configuration schema
const BulkActionsSchema = z.object({
  enableDelete: z.boolean().default(true),
  enableExport: z.boolean().default(true),
});

type BulkActionsConfig = z.infer<typeof BulkActionsSchema>;

// Create panel component
function BulkActionsPanel() {
  const args = usePluginArgs<BulkActionsConfig>();
  const { selectedRows } = usePluginContext();

  if (selectedRows.length === 0) {
    return <div>No rows selected</div>;
  }

  return (
    <div className="bulk-actions">
      <span>{selectedRows.length} selected</span>
      {args.enableDelete && <button>Delete</button>}
      {args.enableExport && <button>Export</button>}
    </div>
  );
}

// Define plugin
export const BulkActionsPlugin = definePlugin({
  id: "bulk-actions",
  name: "Bulk Actions",
  args: BulkActionsSchema,
  slots: {
    sidePanel: {
      position: "right-sider",
      header: "Bulk Actions",
      render: BulkActionsPanel,
    },
  },
});

// Usage
<SeizenTable
  plugins={[
    BulkActionsPlugin.configure({
      enableDelete: true,
      enableExport: false,
    })
  ]}
/>

import { definePlugin, cellContextMenuItem } from "@izumisy/seizen-table/plugin";
import { z } from "zod";

const FilterSchema = z.object({
  width: z.number().default(320),
});

export const FilterPlugin = definePlugin({
  id: "filter",
  name: "Filter",
  args: FilterSchema,
  slots: {
    sidePanel: {
      position: "right-sider",
      header: "Filters",
      render: FilterPanel,
    },
  },
  contextMenuItems: {
    cell: [
      cellContextMenuItem("filter-by-value", (ctx) => ({
        label: `Filter by "${ctx.value}"`,
        onClick: () => {
          ctx.column.setFilterValue(ctx.value);
        },
        visible: ctx.value != null,
      })),
    ],
  },
});

import { definePlugin } from "@izumisy/seizen-table/plugin";
import { z } from "zod";

const SearchSchema = z.object({
  placeholder: z.string().default("Search..."),
});

function SearchHeader() {
  const args = usePluginArgs<z.infer<typeof SearchSchema>>();
  const { table } = usePluginContext();

  return (
    <input
      type="text"
      placeholder={args.placeholder}
      onChange={(e) => table.setGlobalFilter(e.target.value)}
    />
  );
}

export const GlobalSearchPlugin = definePlugin({
  id: "global-search",
  name: "Global Search",
  args: SearchSchema,
  slots: {
    header: {
      render: SearchHeader,
    },
  },
});