castle-web-cli 0.4.128 → 0.4.130

package/kits/basic-2d/editors/BlueprintLibrary.jsx

@@ -1,270 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { renderSpriteFrame } from '../engine/pxart';
-import { screenToCard } from '../engine/scene';
-import { countBlueprintInstances, isImportedPath, listBlueprints } from '../engine/blueprint';
-import { ConfirmDialog, ContextMenu, cx, Icon, styles } from '../engine/ui';
-
-const DRAG_THRESHOLD = 4;
-
-// Deck-level blueprint library / hotbar: lists `blueprints/*.scene` (replacing
-// the old scene-local stamp system). Mirrors castle-client's belt: TAP a slot
-// to select the blueprint for editing in the sidebar; DRAG a slot onto the
-// canvas to place a new instance; right-click for a delete option.
-export function BlueprintLibrary({
-  files,
-  sprites,
-  canvasRef,
-  editCameraRef,
-  isPlaying,
-  selectedBlueprintPath,
-  instanceBlueprintPath,
-  onSelectBlueprint,
-  onAddActor,
-  dragPlace,
-  onDeleteBlueprint,
-}) {
-  const blueprints = listBlueprints(files);
-  const dragRef = useRef(null);
-  const hotbarRef = useRef(null);
-  const suppressClickRef = useRef(false);
-  const [dragPreview, setDragPreview] = useState(null);
-  const [contextMenu, setContextMenu] = useState(null);
-  const [confirmDelete, setConfirmDelete] = useState(null);
-
-  // Map a vertical mouse wheel gesture onto horizontal scroll so plain-mouse
-  // users (no trackpad/touch) can pan the hotbar. Bound natively rather than via
-  // React's onWheel so the listener is non-passive and can preventDefault.
-  useEffect(() => {
-    const bar = hotbarRef.current;
-    if (!bar) return undefined;
-    const onWheel = (event) => {
-      if (event.deltaY !== 0 && Math.abs(event.deltaY) > Math.abs(event.deltaX)) {
-        bar.scrollLeft += event.deltaY;
-        event.preventDefault();
-      }
-    };
-    bar.addEventListener('wheel', onWheel, { passive: false });
-    return () => bar.removeEventListener('wheel', onWheel);
-  }, []);
-
-  const onSlotContextMenu = (event, blueprint) => {
-    if (isPlaying) return;
-    event.preventDefault();
-    event.stopPropagation();
-    setContextMenu({ blueprint, x: event.clientX, y: event.clientY });
-  };
-
-  const onSlotPointerDown = (event, blueprint) => {
-    if (isPlaying || event.button !== 0) return;
-    event.preventDefault();
-    const drag = {
-      blueprint,
-      pointerId: event.pointerId,
-      startX: event.clientX,
-      startY: event.clientY,
-      moved: false,
-      onStage: false,
-    };
-    dragRef.current = drag;
-    try {
-      event.currentTarget.setPointerCapture(event.pointerId);
-    } catch {
-      // Window listeners still finish the drag if capture is unavailable.
-    }
-    const onMove = (moveEvent) => {
-      if (moveEvent.pointerId !== drag.pointerId) return;
-      if (!drag.moved && Math.hypot(moveEvent.clientX - drag.startX, moveEvent.clientY - drag.startY) > DRAG_THRESHOLD) {
-        drag.moved = true;
-      }
-      if (!drag.moved) return;
-      const position = eventToStagePoint(moveEvent, canvasRef, editCameraRef);
-      if (position) {
-        // Over the stage: the drag becomes a REAL placed instance immediately,
-        // so it grid-snaps and renders exactly like the actor it is. The
-        // floating thumbnail only exists off-stage.
-        if (drag.onStage) {
-          dragPlace.move(position);
-        } else {
-          drag.onStage = true;
-          setDragPreview(null);
-          dragPlace.enter(blueprint.path, position);
-        }
-      } else {
-        if (drag.onStage) {
-          drag.onStage = false;
-          dragPlace.leave();
-        }
-        setDragPreview({ blueprint, x: moveEvent.clientX, y: moveEvent.clientY, overStage: false });
-      }
-    };
-    const onUp = (upEvent) => {
-      if (upEvent.pointerId !== drag.pointerId) return;
-      window.removeEventListener('pointermove', onMove);
-      window.removeEventListener('pointerup', onUp);
-      window.removeEventListener('pointercancel', onUp);
-      dragRef.current = null;
-      setDragPreview(null);
-      if (!drag.moved) return;
-      suppressClickRef.current = true;
-      // Cancelled drags (pointercancel) count as a release off-stage.
-      if (drag.onStage && upEvent.type !== 'pointercancel') dragPlace.drop();
-      else if (drag.onStage) dragPlace.leave();
-    };
-    window.addEventListener('pointermove', onMove);
-    window.addEventListener('pointerup', onUp);
-    window.addEventListener('pointercancel', onUp);
-  };
-
-  return (
-    <div ref={hotbarRef} className={styles.bpHotbar} aria-label="Blueprints">
-      <button
-        type="button"
-        className={styles.bpActionSlot}
-        aria-label="Add actor"
-        title="New blueprint"
-        onClick={onAddActor}
-        disabled={isPlaying}>
-        <Icon name="plus" />
-      </button>
-      {blueprints.map((blueprint) => (
-        <button
-          key={blueprint.path}
-          type="button"
-          className={cx(
-            styles.bpSlot,
-            selectedBlueprintPath === blueprint.path && styles.bpSlotSelected,
-            selectedBlueprintPath !== blueprint.path &&
-              instanceBlueprintPath === blueprint.path &&
-              styles.bpSlotInstance
-          )}
-          title={`${blueprint.name} -- click to edit, drag to place`}
-          disabled={isPlaying}
-          onPointerDown={(event) => onSlotPointerDown(event, blueprint)}
-          onContextMenu={(event) => onSlotContextMenu(event, blueprint)}
-          onClick={() => {
-            if (suppressClickRef.current) {
-              suppressClickRef.current = false;
-              return;
-            }
-            onSelectBlueprint(blueprint.path);
-          }}>
-          <BlueprintThumbnail blueprint={blueprint} sprites={sprites} />
-        </button>
-      ))}
-      {dragPreview ? <BlueprintDragPreview preview={dragPreview} sprites={sprites} /> : null}
-      {contextMenu ? (
-        <ContextMenu
-          x={contextMenu.x}
-          y={contextMenu.y}
-          onClose={() => setContextMenu(null)}
-          items={
-            // An imported blueprint belongs to the deck it came from: placeable
-            // here, but there is nothing this deck can delete.
-            isImportedPath(contextMenu.blueprint.path)
-              ? [{ key: 'imported', label: 'From an import (read-only)', disabled: true }]
-              : [
-                  {
-                    key: 'delete',
-                    label: `Delete ${contextMenu.blueprint.name}...`,
-                    onClick: () => setConfirmDelete(contextMenu.blueprint),
-                  },
-                ]
-          }
-        />
-      ) : null}
-      {confirmDelete ? (
-        <DeleteBlueprintConfirm
-          files={files}
-          blueprint={confirmDelete}
-          onCancel={() => setConfirmDelete(null)}
-          onConfirm={() => {
-            onDeleteBlueprint(confirmDelete.path);
-            setConfirmDelete(null);
-          }}
-        />
-      ) : null}
-    </div>
-  );
-}
-
-function DeleteBlueprintConfirm({ files, blueprint, onCancel, onConfirm }) {
-  const count = countBlueprintInstances(files, blueprint.path);
-  const instanceText = count === 1 ? '1 placed actor' : `${count} placed actors`;
-  return (
-    <ConfirmDialog
-      title={`Delete ${blueprint.name}?`}
-      message={
-        count > 0
-          ? `This removes ${blueprint.name} and ${instanceText} across every scene in the deck. This can't be undone.`
-          : `${blueprint.name} has no placed actors. This can't be undone.`
-      }
-      confirmLabel="Delete"
-      onCancel={onCancel}
-      onConfirm={onConfirm}
-    />
-  );
-}
-
-function BlueprintDragPreview({ preview, sprites }) {
-  const layout = preview.blueprint.components?.Layout;
-  const width = Math.max(24, Math.min(80, layout?.width ?? 48));
-  const height = Math.max(24, Math.min(80, layout?.height ?? 48));
-  return (
-    <div
-      className={cx(styles.bpDragPreview, preview.overStage && styles.bpDragPreviewOverStage)}
-      style={{
-        left: preview.x,
-        top: preview.y,
-        width,
-        height,
-        transform: `translate(-50%, -50%) rotate(${layout?.rotation ?? 0}deg)`,
-      }}>
-      <BlueprintThumbnail blueprint={preview.blueprint} sprites={sprites} preview />
-    </div>
-  );
-}
-
-export function BlueprintThumbnail({ blueprint, sprites, preview = false }) {
-  const canvasRef = useRef(null);
-  const spritePath = blueprint.components?.Sprite?.file;
-  const sprite = spritePath ? sprites?.[spritePath] : null;
-  useEffect(() => {
-    const canvas = canvasRef.current;
-    if (!canvas || !sprite) return;
-    renderSpriteFrame(sprite, 0, canvas);
-  }, [sprite]);
-  if (!sprite) {
-    return (
-      <span className={styles.bpSlotFallback}>
-        <Icon name="clone" />
-      </span>
-    );
-  }
-  return (
-    <canvas
-      ref={canvasRef}
-      className={cx(styles.bpSlotThumb, preview && styles.bpPreviewThumb)}
-      aria-hidden="true"
-    />
-  );
-}
-
-function eventToStagePoint(event, canvasRef, editCameraRef) {
-  const canvas = canvasRef.current;
-  if (!canvas) return null;
-  const rect = canvas.getBoundingClientRect();
-  if (
-    event.clientX < rect.left ||
-    event.clientX > rect.right ||
-    event.clientY < rect.top ||
-    event.clientY > rect.bottom
-  ) {
-    return null;
-  }
-  const raw = screenToCard(canvas, event.clientX, event.clientY);
-  const camera = editCameraRef.current ?? { x: 0, y: 0 };
-  return {
-    x: raw.x + camera.x,
-    y: raw.y + camera.y,
-  };
-}

package/kits/basic-2d/editors/ErrorBoundary.jsx

@@ -1,59 +0,0 @@
-// Deck-side error boundary for the panel routes. A throwing editor (these are
-// agent-edited deck files -- they will throw) shows a small muted message inside
-// its panel iframe instead of a blank / loud crash. Inline styles so it doesn't
-// depend on whatever module may have failed.
-
-import React from 'react';
-
-export class ErrorBoundary extends React.Component {
-  state = { error: null };
-  static getDerivedStateFromError(error) {
-    return { error };
-  }
-  componentDidCatch(error) {
-    console.error('[deck panel error]', error);
-  }
-  render() {
-    if (!this.state.error) return this.props.children;
-    return (
-      <div
-        style={{
-          height: '100vh',
-          padding: '14px 16px',
-          overflow: 'auto',
-          color: '#6e7781',
-          font: '13px ui-sans-serif, system-ui, -apple-system, sans-serif',
-          background: '#ffffff',
-        }}>
-        <div style={{ color: '#57606a' }}>this panel hit an error</div>
-        <pre
-          style={{
-            margin: '8px 0 0',
-            whiteSpace: 'pre-wrap',
-            wordBreak: 'break-word',
-            fontFamily: 'ui-monospace, SFMono-Regular, Menlo, monospace',
-            fontSize: 12,
-            color: '#8c959f',
-          }}>
-          {String((this.state.error && this.state.error.message) || this.state.error)}
-        </pre>
-        <button
-          type="button"
-          onClick={() => this.setState({ error: null })}
-          style={{
-            marginTop: 8,
-            font: 'inherit',
-            fontSize: 12,
-            padding: '3px 10px',
-            border: '1px solid #cccccc',
-            borderRadius: 4,
-            background: '#ffffff',
-            color: '#57606a',
-            cursor: 'pointer',
-          }}>
-          retry
-        </button>
-      </div>
-    );
-  }
-}

package/kits/basic-2d/editors/PlayOnly.jsx

@@ -1,31 +0,0 @@
-import React from 'react';
-import { Lifecycle } from 'castle-web-sdk';
-import { parseJsonFile } from '../engine/files';
-import { useLiveDeckFiles } from '../engine/liveReload';
-import { collectAssets } from '../engine/assets';
-import { ScenePlayer } from '../engine/ScenePlayer';
-import { behaviorClasses } from './behaviorRegistry';
-// Play-mode entry point. Plays the scene named by `?scene=<path>` (the shell's
-// Play panel sets this), defaulting to `scenes/main.scene`. It renders ONLY the
-// game — the scene picker lives in the Play panel chrome (the shell), not here,
-// so nothing floats over the game surface and steals input. Files are live:
-// scene/drawing edits re-key the player against fresh data.
-const DEFAULT_SCENE = 'scenes/main.scene';
-
-export function PlayOnly({ initialScene } = {}) {
-  const { files, dataVersion } = useLiveDeckFiles();
-  const scenePath = initialScene && files[initialScene] !== undefined ? initialScene : DEFAULT_SCENE;
-  const { value: sceneData } = parseJsonFile(scenePath, files[scenePath] ?? '');
-  if (!sceneData) return null;
-  const { sprites } = collectAssets(files);
-  return (
-    <ScenePlayer
-      key={`${scenePath}:${dataVersion}`}
-      sceneData={sceneData}
-      sprites={sprites}
-      files={files}
-      behaviorClasses={behaviorClasses}
-      onFirstFrame={Lifecycle.ready}
-    />
-  );
-}