@yuzhouu/canvas-kit 0.1.2 → 0.1.3

package/_vendor/canvas-product-react/capabilities/clipboard/systemClipboard.ts

@@ -1,245 +0,0 @@
-import type {
-  ContextMenuContext,
-  EditorClipboardPayload,
-  ToolbarAction,
-  ToolbarContext,
-} from "@land/canvas-core";
-import type { CanvasPluginHostRuntime } from "@land/canvas-react/host";
-import type {
-  CanvasProductRuntimeSetupContext,
-} from "../../runtime/productDefinition";
-import type { ProductServiceRegistry } from "../../runtime/productServices";
-import {
-  canvasClipboardServiceToken,
-  memoryCanvasClipboardService,
-  type CanvasClipboardService,
-} from "./clipboardService";
-
-export const SYSTEM_CLIPBOARD_COPY_ACTION_ID = "system.clipboard.copy";
-export const SYSTEM_CLIPBOARD_CUT_ACTION_ID = "system.clipboard.cut";
-export const SYSTEM_CLIPBOARD_PASTE_ACTION_ID = "system.clipboard.paste";
-export const SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID =
-  "system.clipboard.paste-at-point";
-export const SYSTEM_SELECTION_DUPLICATE_ACTION_ID =
-  "system.selection.duplicate";
-export const SYSTEM_SELECTION_SELECT_ALL_ACTION_ID =
-  "system.selection.select-all";
-
-export function registerSystemClipboardRuntime({
-  pluginHostRuntime,
-  productId,
-  services,
-}: CanvasProductRuntimeSetupContext): void {
-  services.register(memoryCanvasClipboardService(), { productId });
-  registerSystemClipboardActions({
-    pluginHostRuntime,
-    services,
-  });
-}
-
-export function registerSystemClipboardActions({
-  pluginHostRuntime,
-  services,
-}: {
-  pluginHostRuntime: CanvasPluginHostRuntime;
-  services: ProductServiceRegistry;
-}): void {
-  for (const action of createSystemClipboardActions(services)) {
-    pluginHostRuntime.toolbarRegistry.registerHostAction(action);
-  }
-}
-
-export function getCanvasClipboardService(
-  services: ProductServiceRegistry,
-): CanvasClipboardService | null {
-  return services.get(canvasClipboardServiceToken);
-}
-
-function createSystemClipboardActions(
-  services: ProductServiceRegistry,
-): readonly ToolbarAction[] {
-  return [
-    {
-      id: SYSTEM_CLIPBOARD_COPY_ACTION_ID,
-      isVisible(context) {
-        return context.selection.count > 0;
-      },
-      isEnabled(context) {
-        return (
-          context.selection.count > 0 &&
-          !!getCanvasClipboardService(services)
-        );
-      },
-      run({ context }) {
-        void copySelectionToClipboard({
-          context,
-          services,
-        });
-      },
-    },
-    {
-      id: SYSTEM_CLIPBOARD_CUT_ACTION_ID,
-      isVisible(context) {
-        return context.selection.count > 0;
-      },
-      isEnabled(context) {
-        return (
-          context.selection.count > 0 &&
-          !!getCanvasClipboardService(services)
-        );
-      },
-      run({ context }) {
-        void cutSelectionToClipboard({
-          context,
-          services,
-        });
-      },
-    },
-    {
-      id: SYSTEM_CLIPBOARD_PASTE_ACTION_ID,
-      isVisible() {
-        return !!getCanvasClipboardService(services)?.getMemoryPayload();
-      },
-      isEnabled() {
-        return !!getCanvasClipboardService(services)?.getMemoryPayload();
-      },
-      run({ context }) {
-        void pasteFromClipboard({
-          context,
-          services,
-        });
-      },
-    },
-    {
-      id: SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID,
-      isVisible(context) {
-        return (
-          hasContextMenuContext(context) &&
-          !!getCanvasClipboardService(services)?.getMemoryPayload()
-        );
-      },
-      isEnabled(context) {
-        return (
-          hasContextMenuContext(context) &&
-          !!getCanvasClipboardService(services)?.getMemoryPayload()
-        );
-      },
-      run({ context }) {
-        if (!hasContextMenuContext(context)) {
-          return;
-        }
-        void pasteFromClipboard({
-          context,
-          services,
-          atMenuPoint: true,
-        });
-      },
-    },
-    {
-      id: SYSTEM_SELECTION_DUPLICATE_ACTION_ID,
-      isVisible(context) {
-        return context.selection.count > 0;
-      },
-      isEnabled(context) {
-        return context.selection.count > 0;
-      },
-      run({ context }) {
-        context.editor.duplicateSelection({ source: "user" });
-      },
-    },
-    {
-      id: SYSTEM_SELECTION_SELECT_ALL_ACTION_ID,
-      isEnabled(context) {
-        return context.editor.getCurrentPageShapeIds().length > 0;
-      },
-      run({ context }) {
-        context.editor.selectAllCurrentPage("user");
-      },
-    },
-  ];
-}
-
-async function copySelectionToClipboard({
-  context,
-  services,
-}: {
-  context: ToolbarContext;
-  services: ProductServiceRegistry;
-}): Promise<EditorClipboardPayload | null> {
-  const clipboard = getCanvasClipboardService(services);
-  if (!clipboard) {
-    return null;
-  }
-
-  const payload = context.editor.createClipboardPayloadFromSelection();
-  if (!payload) {
-    return null;
-  }
-
-  await clipboard.write(payload);
-  return payload;
-}
-
-async function cutSelectionToClipboard({
-  context,
-  services,
-}: {
-  context: ToolbarContext;
-  services: ProductServiceRegistry;
-}): Promise<void> {
-  const payload = await copySelectionToClipboard({ context, services });
-  if (!payload) {
-    return;
-  }
-  context.editor.deleteSelection("user");
-}
-
-async function pasteFromClipboard({
-  atMenuPoint = false,
-  context,
-  services,
-}: {
-  atMenuPoint?: boolean;
-  context: ToolbarContext;
-  services: ProductServiceRegistry;
-}): Promise<void> {
-  const clipboard = getCanvasClipboardService(services);
-  if (!clipboard) {
-    return;
-  }
-
-  const payload = await clipboard.read();
-  if (!payload) {
-    return;
-  }
-
-  context.editor.pasteClipboardPayload({
-    payload,
-    pagePoint: getPastePagePoint({ atMenuPoint, context }),
-    source: "user",
-  });
-}
-
-function getPastePagePoint({
-  atMenuPoint,
-  context,
-}: {
-  atMenuPoint: boolean;
-  context: ToolbarContext;
-}) {
-  if (atMenuPoint && hasContextMenuContext(context)) {
-    return context.menu.pagePoint;
-  }
-
-  return (
-    context.editor.inputs.state.get().currentPagePoint ??
-    context.editor.viewportPageBoundsSignal.get()?.center ??
-    undefined
-  );
-}
-
-function hasContextMenuContext(
-  context: ToolbarContext,
-): context is ContextMenuContext {
-  return "menu" in context;
-}

package/_vendor/canvas-product-react/capabilities/context-menu/systemContextMenu.ts

@@ -1,396 +0,0 @@
-import {
-  SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-  type ContextMenuContext,
-  type ContextMenuContribution,
-  type ContextMenuContributionTarget,
-  type ContextMenuSection,
-  type ContextMenuTarget,
-  type Editor,
-  type ShapeId,
-  type ToolbarAction,
-  type ToolbarActionValue,
-} from "@land/canvas-core";
-import { type CanvasPluginHostRuntime } from "@land/canvas-react/host";
-import {
-  createToolbarContext,
-  SYSTEM_SELECTION_DELETE_ACTION_ID,
-  SYSTEM_SELECTION_GROUP_ACTION_ID,
-  SYSTEM_SELECTION_UNGROUP_ACTION_ID,
-} from "../toolbar/systemToolbar";
-import {
-  SYSTEM_CLIPBOARD_COPY_ACTION_ID,
-  SYSTEM_CLIPBOARD_CUT_ACTION_ID,
-  SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID,
-  SYSTEM_SELECTION_DUPLICATE_ACTION_ID,
-  SYSTEM_SELECTION_SELECT_ALL_ACTION_ID,
-} from "../clipboard/systemClipboard";
-
-export const SYSTEM_VIEW_ZOOM_IN_ACTION_ID = "system.view.zoom-in";
-export const SYSTEM_VIEW_ZOOM_OUT_ACTION_ID = "system.view.zoom-out";
-export const SYSTEM_VIEW_RESET_ZOOM_ACTION_ID = "system.view.reset-zoom";
-
-const systemContextMenuActions: readonly ToolbarAction[] = [
-  {
-    id: SYSTEM_VIEW_ZOOM_IN_ACTION_ID,
-    run({ context }) {
-      context.editor.zoomAtViewportCenter(-120, "system");
-    },
-  },
-  {
-    id: SYSTEM_VIEW_ZOOM_OUT_ACTION_ID,
-    run({ context }) {
-      context.editor.zoomAtViewportCenter(120, "system");
-    },
-  },
-  {
-    id: SYSTEM_VIEW_RESET_ZOOM_ACTION_ID,
-    run({ context }) {
-      context.editor.resetZoom("user");
-    },
-  },
-];
-
-const systemSelectionContextMenuContribution: ContextMenuContribution = {
-  id: "system.selection-context-menu",
-  target: "selection",
-  order: 1000,
-  actionIds: [
-    SYSTEM_CLIPBOARD_COPY_ACTION_ID,
-    SYSTEM_CLIPBOARD_CUT_ACTION_ID,
-    SYSTEM_SELECTION_DUPLICATE_ACTION_ID,
-    SYSTEM_SELECTION_GROUP_ACTION_ID,
-    SYSTEM_SELECTION_UNGROUP_ACTION_ID,
-    "system.selection.reset-rotation",
-    "system.selection.flip-horizontal",
-    "system.selection.flip-vertical",
-    "system.selection.bring-to-front",
-    "system.selection.bring-forward",
-    "system.selection.send-backward",
-    "system.selection.send-to-back",
-    SYSTEM_SELECTION_DELETE_ACTION_ID,
-  ],
-  getSections(context) {
-    const showGenericOrderActions =
-      context.selection.count > 0 && !isSingleSelectedFrameChild(context);
-    const sections: ContextMenuSection[] = [
-      {
-        id: "system.selection-edit",
-        title: "Edit",
-        order: 10,
-        items: [
-          {
-            kind: "command",
-            id: SYSTEM_CLIPBOARD_COPY_ACTION_ID,
-            actionId: SYSTEM_CLIPBOARD_COPY_ACTION_ID,
-            label: "Copy",
-            icon: "copy",
-            shortcut: "⌘C",
-            dataUi: "context-menu-copy-selection-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_CLIPBOARD_CUT_ACTION_ID,
-            actionId: SYSTEM_CLIPBOARD_CUT_ACTION_ID,
-            label: "Cut",
-            icon: "scissors",
-            shortcut: "⌘X",
-            dataUi: "context-menu-cut-selection-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_SELECTION_DUPLICATE_ACTION_ID,
-            actionId: SYSTEM_SELECTION_DUPLICATE_ACTION_ID,
-            label: "Duplicate",
-            icon: "copy-plus",
-            shortcut: "⌘D",
-            dataUi: "context-menu-duplicate-selection-button",
-          },
-          {
-            kind: "separator",
-            id: "system.selection-clipboard-separator",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_SELECTION_GROUP_ACTION_ID,
-            actionId: SYSTEM_SELECTION_GROUP_ACTION_ID,
-            label: "Group",
-            icon: "group",
-            dataUi: "context-menu-group-selection-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_SELECTION_UNGROUP_ACTION_ID,
-            actionId: SYSTEM_SELECTION_UNGROUP_ACTION_ID,
-            label: "Ungroup",
-            icon: "ungroup",
-            dataUi: "context-menu-ungroup-selection-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_SELECTION_DELETE_ACTION_ID,
-            actionId: SYSTEM_SELECTION_DELETE_ACTION_ID,
-            label: "Delete selection",
-            icon: "trash-2",
-            tone: "destructive",
-            dataUi: "context-menu-delete-selection-button",
-          },
-        ],
-      },
-    ];
-
-    if (context.selection.canResetRotation || context.selection.count > 0) {
-      sections.push({
-        id: "system.selection-transform",
-        title: "Transform",
-        order: 20,
-        items: [
-          {
-            kind: "command",
-            id: "system.selection.reset-rotation",
-            actionId: "system.selection.reset-rotation",
-            label: "Reset rotation",
-            icon: "rotate-ccw",
-            dataUi: "context-menu-reset-rotation-button",
-          },
-          {
-            kind: "command",
-            id: "system.selection.flip-horizontal",
-            actionId: "system.selection.flip-horizontal",
-            label: "Flip horizontal",
-            icon: "flip-horizontal-2",
-            dataUi: "context-menu-flip-horizontal-button",
-          },
-          {
-            kind: "command",
-            id: "system.selection.flip-vertical",
-            actionId: "system.selection.flip-vertical",
-            label: "Flip vertical",
-            icon: "flip-vertical-2",
-            dataUi: "context-menu-flip-vertical-button",
-          },
-        ],
-      });
-    }
-
-    if (showGenericOrderActions) {
-      sections.push({
-        id: "system.selection-arrange",
-        title: "Arrange",
-        order: 30,
-        items: [
-          {
-            kind: "command",
-            id: "system.selection.bring-to-front",
-            actionId: "system.selection.bring-to-front",
-            label: "Bring to front",
-            icon: "chevrons-up",
-            dataUi: "context-menu-bring-to-front-button",
-          },
-          {
-            kind: "command",
-            id: "system.selection.bring-forward",
-            actionId: "system.selection.bring-forward",
-            label: "Bring forward",
-            icon: "move-up",
-            dataUi: "context-menu-bring-forward-button",
-          },
-          {
-            kind: "command",
-            id: "system.selection.send-backward",
-            actionId: "system.selection.send-backward",
-            label: "Send backward",
-            icon: "move-down",
-            dataUi: "context-menu-send-backward-button",
-          },
-          {
-            kind: "command",
-            id: "system.selection.send-to-back",
-            actionId: "system.selection.send-to-back",
-            label: "Send to back",
-            icon: "chevrons-down",
-            dataUi: "context-menu-send-to-back-button",
-          },
-        ],
-      });
-    }
-
-    return sections;
-  },
-};
-
-const systemCanvasContextMenuContribution: ContextMenuContribution = {
-  id: "system.canvas-context-menu",
-  target: "canvas",
-  order: 1000,
-  actionIds: [
-    SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-    SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID,
-    SYSTEM_SELECTION_SELECT_ALL_ACTION_ID,
-    SYSTEM_VIEW_ZOOM_IN_ACTION_ID,
-    SYSTEM_VIEW_ZOOM_OUT_ACTION_ID,
-    SYSTEM_VIEW_RESET_ZOOM_ACTION_ID,
-  ],
-  getSections() {
-    return [
-      {
-        id: "system.canvas-edit",
-        title: "Edit",
-        order: 5,
-        items: [
-          {
-            kind: "command",
-            id: SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID,
-            actionId: SYSTEM_CLIPBOARD_PASTE_AT_POINT_ACTION_ID,
-            label: "Paste here",
-            icon: "clipboard-paste",
-            shortcut: "⌘V",
-            dataUi: "context-menu-paste-here-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_SELECTION_SELECT_ALL_ACTION_ID,
-            actionId: SYSTEM_SELECTION_SELECT_ALL_ACTION_ID,
-            label: "Select all",
-            icon: "scan",
-            shortcut: "⌘A",
-            dataUi: "context-menu-select-all-button",
-          },
-        ],
-      },
-      {
-        id: "system.canvas-view",
-        title: "View",
-        order: 10,
-        items: [
-          {
-            kind: "command",
-            id: SYSTEM_VIEW_ZOOM_IN_ACTION_ID,
-            actionId: SYSTEM_VIEW_ZOOM_IN_ACTION_ID,
-            label: "Zoom in",
-            icon: "plus",
-            dataUi: "context-menu-zoom-in-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_VIEW_ZOOM_OUT_ACTION_ID,
-            actionId: SYSTEM_VIEW_ZOOM_OUT_ACTION_ID,
-            label: "Zoom out",
-            icon: "minus",
-            dataUi: "context-menu-zoom-out-button",
-          },
-          {
-            kind: "command",
-            id: SYSTEM_VIEW_RESET_ZOOM_ACTION_ID,
-            actionId: SYSTEM_VIEW_RESET_ZOOM_ACTION_ID,
-            label: "Reset zoom",
-            icon: "rotate-ccw",
-            dataUi: "context-menu-reset-zoom-button",
-          },
-        ],
-      },
-      {
-        id: "system.canvas-tools",
-        title: "Tools",
-        order: 20,
-        items: [
-          {
-            kind: "command",
-            id: "system.canvas.select-tool",
-            actionId: SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-            value: "select",
-            label: "Select tool",
-            icon: "mouse-pointer-2",
-            shortcut: "V",
-            dataUi: "context-menu-select-tool-button",
-          },
-          {
-            kind: "command",
-            id: "system.canvas.hand-tool",
-            actionId: SET_ACTIVE_TOOL_TOOLBAR_ACTION_ID,
-            value: "hand",
-            label: "Hand tool",
-            icon: "hand",
-            shortcut: "H",
-            dataUi: "context-menu-hand-tool-button",
-          },
-        ],
-      },
-    ];
-  },
-};
-
-export function registerSystemContextMenuContributions(
-  pluginHostRuntime: CanvasPluginHostRuntime,
-): void {
-  for (const action of systemContextMenuActions) {
-    pluginHostRuntime.toolbarRegistry.registerHostAction(action);
-  }
-  pluginHostRuntime.contextMenuRegistry.registerContribution(
-    systemSelectionContextMenuContribution,
-  );
-  pluginHostRuntime.contextMenuRegistry.registerContribution(
-    systemCanvasContextMenuContribution,
-  );
-}
-
-export function createContextMenuContext({
-  editor,
-  menu,
-}: {
-  editor: Editor;
-  menu: ContextMenuContext["menu"];
-}): ContextMenuContext {
-  const toolState = editor.toolStateSignal.get();
-  const selectionState = editor.selectionStateSignal.get();
-  return {
-    ...createToolbarContext({
-      editor,
-      selectionState,
-      toolState,
-    }),
-    menu,
-  };
-}
-
-export function getContextMenuContributionTarget(
-  target: ContextMenuTarget,
-  editor: Editor,
-): ContextMenuContributionTarget {
-  if (target.type === "canvas") {
-    return "canvas";
-  }
-  const selectedShapeIds = editor.getSelectedShapeIds();
-  return selectedShapeIds.length > 0 ? "selection" : "shape";
-}
-
-export function runContextMenuAction({
-  actionId,
-  context,
-  pluginHostRuntime,
-  value,
-}: {
-  actionId: string;
-  context: ContextMenuContext;
-  pluginHostRuntime: CanvasPluginHostRuntime;
-  value?: ToolbarActionValue;
-}): void {
-  const action = pluginHostRuntime.toolbarRegistry.getAction(actionId);
-  if (!action || action.isVisible?.(context) === false) {
-    return;
-  }
-  if (action.isEnabled?.(context) === false) {
-    return;
-  }
-  action.run({
-    context,
-    value: value !== undefined ? value : (action.getValue?.(context) ?? null),
-  });
-}
-
-function isSingleSelectedFrameChild(context: ContextMenuContext): boolean {
-  const [shape] = context.selection.selectedShapes;
-  if (context.selection.count !== 1 || !shape?.parentId.startsWith("shape:")) {
-    return false;
-  }
-  return context.editor.getShape(shape.parentId as ShapeId)?.type === "frame";
-}

package/_vendor/canvas-product-react/capabilities/context-menu/useContextMenuSurface.ts

@@ -1,59 +0,0 @@
-import { useMemo } from "react";
-import { useValue } from "@land/canvas-react";
-import type {
-  ContextMenuContext,
-  ContextMenuOpenSnapshot,
-  ContextMenuSection,
-  Editor,
-} from "@land/canvas-core";
-import type { CanvasPluginHostRuntime } from "@land/canvas-react/host";
-import {
-  createContextMenuContext,
-  getContextMenuContributionTarget,
-} from "./systemContextMenu";
-
-export interface ContextMenuSurface {
-  context: ContextMenuContext | null;
-  openSnapshot: ContextMenuOpenSnapshot | null;
-  sections: readonly ContextMenuSection[];
-}
-
-export function useContextMenuSurface({
-  editor,
-  openSnapshot,
-  pluginHostRuntime,
-}: {
-  editor: Editor;
-  openSnapshot: ContextMenuOpenSnapshot | null;
-  pluginHostRuntime: CanvasPluginHostRuntime;
-}): ContextMenuSurface {
-  useValue(editor.selectionStateSignal);
-  useValue(editor.toolStateSignal);
-
-  return useMemo(() => {
-    if (!openSnapshot) {
-      return {
-        context: null,
-        openSnapshot: null,
-        sections: [],
-      };
-    }
-
-    const context = createContextMenuContext({
-      editor,
-      menu: openSnapshot,
-    });
-    const target = getContextMenuContributionTarget(
-      openSnapshot.target,
-      editor,
-    );
-    return {
-      context,
-      openSnapshot,
-      sections: pluginHostRuntime.contextMenuRegistry.getSections(
-        target,
-        context,
-      ),
-    };
-  }, [editor, openSnapshot, pluginHostRuntime]);
-}