@svgsketch/plugin-sdk

TypeScript types and interfaces for building SVGSketch editor plugins.

Installation

npm install --save-dev @svgsketch/plugin-sdk

Quick Start

import type { SVGSketchPlugin, PluginContext } from '@svgsketch/plugin-sdk';

export function createMyPlugin(): SVGSketchPlugin {
  let ctx: PluginContext | null = null;

  return {
    id: 'my-plugin',
    name: 'My Plugin',
    version: '1.0.0',

    contributions: {
      commands: [
        {
          id: 'my-plugin.hello',
          label: 'Say Hello',
          category: 'My Plugin',
          onExecute: () => ctx?.showToast('Hello from my plugin!'),
        },
      ],
    },

    activate(pluginCtx) {
      ctx = pluginCtx;

      // Listen for selection changes
      const dispose = ctx.onSelectionChanged((shapes) => {
        console.log(`${shapes.length} shapes selected`);
      });
    },

    deactivate() {
      ctx = null;
    },
  };
}

What's Included

This package provides TypeScript type definitions for the entire SVGSketch plugin API:

• SVGSketchPlugin - The top-level interface every plugin implements
• PluginContext - The API facade plugins receive on activation (shape read/write, events, viewport, UI, connection points, i18n, contextual help)
• ShapeState - The complete shape property set, re-exported from @svgsketch/core where it is derived from the scene-model prop registry
• Contributions - ToolContribution, PanelContribution, CommandContribution, MenuItemContribution, StatusBarContribution, SettingsContribution, FooterTabContribution, ContextHelpNode
• Events - PluginEventMap with 20+ event types, InterceptableEvent, InterceptResult
• Middleware - CanvasMiddlewareRegistration, CanvasPointerEventInfo
• UI Fields - 17 declarative field types for building popout and panel UIs
• Tool interactions - ToolHandler, ToolEventContext, and host-materialized drag-to-create contributions

The document model comes from @svgsketch/core

ShapeState, ShapeFilter, ShapeMetadata, ConnectionPoint, PathPoint, Point, Viewbox, the rich-text types and the affine transform kernel are re-exported from @svgsketch/core, not re-declared here. Core derives the shape state from the scene-model prop interfaces and compile-gates the key list, so what this package publishes is exactly what the editor persists - the parallel declaration that used to live here is gone, along with the drift it carried.

Narrower per-shape-type views (TextNodeProps, PathNodeProps, RectangleNodeProps, …) are available from @svgsketch/core and replace the hand-written GeometryProps / TextProps / StrokeProps groups this package exported before v0.2.

The editor imports this package directly and keeps only a thin compatibility re-export at apps/editor/src/interfaces/plugin.ts. The built-in compile gate resolves the published declaration artifact and rejects editor-internal dependency edges, so the compiler enforces one plugin contract instead of comparing two copies after they drift.

Documentation

• Plugin Development Guide — tutorials and getting started
• API Reference — complete PluginContext reference
• Contributions — tools, panels, commands, menus
• Events & Middleware — event system and pointer middleware

License

MIT