@editframe/elements 0.47.2 → 0.48.0

package/dist/gui/EFTimelineRuler.js

@@ -1,12 +1,11 @@
 import { durationContext } from "./durationContext.js";
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
-import { DEFAULT_PIXELS_PER_MS, timelineStateContext } from "./timeline/timelineStateContext.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { timelineStateContext } from "./timeline/timelineStateContext.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { styleMap } from "lit/directives/style-map.js";
 import { createRef, ref } from "lit/directives/ref.js";
-
 //#region src/gui/EFTimelineRuler.ts
 const MIN_LABEL_SPACING_PX = 80;
 const MIN_FRAME_SPACING_PX = 5;
@@ -46,7 +45,7 @@ function calculatePixelsPerFrame(frameIntervalMs, pixelsPerMs) {
 function shouldShowFrameMarkers(pixelsPerFrame, minSpacing = MIN_FRAME_SPACING_PX) {
 	return pixelsPerFrame >= minSpacing;
 }
-let EFTimelineRuler = class EFTimelineRuler$1 extends LitElement {
+let EFTimelineRuler = class EFTimelineRuler extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.durationMs = 0;
@@ -108,7 +107,7 @@ let EFTimelineRuler = class EFTimelineRuler$1 extends LitElement {
 		return this.durationMs || this.contextDurationMs || 0;
 	}
 	get pixelsPerMs() {
-		return this.timelineState?.pixelsPerMs ?? DEFAULT_PIXELS_PER_MS;
+		return this.timelineState?.pixelsPerMs ?? .1;
 	}
 	get scrollLeft() {
 		return this.timelineState?.viewportScrollLeft ?? 0;
@@ -314,7 +313,7 @@ __decorate([state()], EFTimelineRuler.prototype, "viewportWidth", void 0);
 __decorate([state()], EFTimelineRuler.prototype, "_canvasViewportLeft", void 0);
 __decorate([state()], EFTimelineRuler.prototype, "_canvasViewportWidth", void 0);
 EFTimelineRuler = __decorate([customElement("ef-timeline-ruler")], EFTimelineRuler);
-
 //#endregion
 export { EFTimelineRuler, calculateFrameIntervalMs, calculatePixelsPerFrame, quantizeToFrameTimeMs, shouldShowFrameMarkers };
+
 //# sourceMappingURL=EFTimelineRuler.js.map

package/dist/gui/EFTimelineRuler.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTimelineRuler.js","names":["EFTimelineRuler","labels: VisibleLabel[]"],"sources":["../../src/gui/EFTimelineRuler.ts"],"sourcesContent":["import { consume } from \"@lit/context\";\nimport { css, html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { createRef, ref } from \"lit/directives/ref.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { durationContext } from \"./durationContext.js\";\nimport {\n  timelineStateContext,\n  type TimelineState,\n  DEFAULT_PIXELS_PER_MS,\n} from \"./timeline/timelineStateContext.js\";\n\nconst MIN_LABEL_SPACING_PX = 80;\nconst MIN_FRAME_SPACING_PX = 5;\n\n/** Maximum canvas width for ruler virtualization */\nconst MAX_RULER_CANVAS_WIDTH = 2000;\n\n/** Buffer pixels on each side of viewport for smooth scrolling */\nconst RULER_CANVAS_BUFFER = 200;\n\n/**\n * Quantize a time value to the nearest frame boundary.\n * This ensures frame markers align perfectly with playhead position.\n */\nexport function quantizeToFrameTimeMs(timeMs: number, fps: number): number {\n  if (!fps || fps <= 0) return timeMs;\n  const frameDurationS = 1 / fps;\n  const timeSeconds = timeMs / 1000;\n  const quantizedSeconds = Math.round(timeSeconds / frameDurationS) * frameDurationS;\n  return quantizedSeconds * 1000;\n}\n\n/**\n * Calculate the duration of a single frame in milliseconds.\n */\nexport function calculateFrameIntervalMs(fps: number): number {\n  if (fps <= 0) return 1000 / 30; // fallback to 30fps\n  return 1000 / fps;\n}\n\n/**\n * Calculate pixels per frame given frame interval and zoom scale.\n * @param frameIntervalMs Duration of one frame in ms\n * @param pixelsPerMs Current zoom level (pixels per millisecond)\n */\nexport function calculatePixelsPerFrame(frameIntervalMs: number, pixelsPerMs: number): number {\n  return frameIntervalMs * pixelsPerMs;\n}\n\n/**\n * Determine if frame markers should be visible at the current zoom level.\n * Frame markers appear when each frame is at least MIN_FRAME_SPACING_PX wide.\n */\nexport function shouldShowFrameMarkers(\n  pixelsPerFrame: number,\n  minSpacing: number = MIN_FRAME_SPACING_PX,\n): boolean {\n  return pixelsPerFrame >= minSpacing;\n}\n\ninterface VisibleLabel {\n  timeMs: number;\n  viewportX: number;\n  text: string;\n}\n\n@customElement(\"ef-timeline-ruler\")\nexport class EFTimelineRuler extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: block;\n        position: relative;\n        height: 100%;\n        pointer-events: none;\n      }\n      \n      .ruler-container {\n        position: relative;\n        width: 100%;\n        height: 100%;\n        overflow: hidden;\n      }\n      \n      .canvas-viewport {\n        position: absolute;\n        top: 0;\n        height: 100%;\n        /* left and width set via inline styles for virtualization */\n      }\n      \n      canvas {\n        display: block;\n        position: absolute;\n        top: 0;\n        left: 0;\n        pointer-events: none;\n      }\n      \n      .label {\n        position: absolute;\n        top: 50%;\n        font-size: 10px;\n        color: var(--ef-color-text-muted);\n        font-family: ui-monospace, monospace;\n        white-space: nowrap;\n        pointer-events: none;\n        user-select: none;\n      }\n    `,\n  ];\n\n  @property({ type: Number, attribute: \"duration-ms\" })\n  durationMs = 0;\n\n  @consume({ context: durationContext, subscribe: true })\n  contextDurationMs = 0;\n\n  @consume({ context: timelineStateContext, subscribe: true })\n  timelineState?: TimelineState;\n\n  @property({ type: Number, attribute: \"fps\" })\n  fps = 30;\n\n  /** Full content width in pixels (for virtualization) */\n  @property({ type: Number, attribute: \"content-width\" })\n  contentWidth = 0;\n\n  private containerRef = createRef<HTMLDivElement>();\n  private canvasRef = createRef<HTMLCanvasElement>();\n  private resizeObserver?: ResizeObserver;\n\n  @state()\n  private viewportWidth = 0;\n\n  /** Canvas viewport left position for virtualization */\n  @state()\n  private _canvasViewportLeft = 0;\n\n  /** Canvas viewport width for virtualization */\n  @state()\n  private _canvasViewportWidth = 0;\n\n  /** Last rendered scroll position - for detecting scroll changes */\n  private _lastRenderedScrollLeft = -1;\n\n  /** Last rendered viewport width - for detecting viewport changes */\n  private _lastRenderedViewportWidth = 0;\n\n  get effectiveDurationMs(): number {\n    return this.durationMs || this.contextDurationMs || 0;\n  }\n\n  get pixelsPerMs(): number {\n    return this.timelineState?.pixelsPerMs ?? DEFAULT_PIXELS_PER_MS;\n  }\n\n  get scrollLeft(): number {\n    return this.timelineState?.viewportScrollLeft ?? 0;\n  }\n\n  /**\n   * Calculate canvas viewport bounds for virtualization.\n   * Returns the left position and width of the canvas viewport.\n   */\n  private calculateCanvasViewport(): { left: number; width: number } {\n    const totalWidth = this.contentWidth || this.viewportWidth;\n\n    // If content is small enough, no virtualization needed\n    if (totalWidth <= MAX_RULER_CANVAS_WIDTH) {\n      return { left: 0, width: totalWidth };\n    }\n\n    // Get visible region from scroll position\n    const viewportScrollLeft = this.scrollLeft;\n    const viewportWidth = this.timelineState?.viewportWidth ?? this.viewportWidth;\n\n    // Calculate canvas viewport with buffer for smooth scrolling\n    const canvasLeft = Math.max(0, viewportScrollLeft - RULER_CANVAS_BUFFER);\n    const canvasRight = Math.min(\n      totalWidth,\n      viewportScrollLeft + viewportWidth + RULER_CANVAS_BUFFER,\n    );\n\n    // Cap canvas width at maximum\n    let canvasWidth = canvasRight - canvasLeft;\n    if (canvasWidth > MAX_RULER_CANVAS_WIDTH) {\n      canvasWidth = MAX_RULER_CANVAS_WIDTH;\n    }\n\n    return { left: canvasLeft, width: canvasWidth };\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  protected firstUpdated(): void {\n    const container = this.containerRef.value;\n    if (container) {\n      this.resizeObserver = new ResizeObserver((entries) => {\n        const entry = entries[0];\n        if (entry) {\n          const width = entry.contentRect.width;\n          if (width !== this.viewportWidth) {\n            this.viewportWidth = width;\n          }\n        }\n      });\n      this.resizeObserver.observe(container);\n      this.viewportWidth = container.clientWidth;\n    }\n  }\n\n  protected updated(changedProperties: Map<string | number | symbol, unknown>): void {\n    // Check if scroll position or viewport changed from context\n    const currentScrollLeft = this.scrollLeft;\n    const currentViewportWidth = this.timelineState?.viewportWidth ?? this.viewportWidth;\n\n    // Check if scroll changed, viewport changed, or other relevant properties changed\n    const scrollChanged = currentScrollLeft !== this._lastRenderedScrollLeft;\n    const viewportChanged = currentViewportWidth !== this._lastRenderedViewportWidth;\n    const pixelsPerMsChanged =\n      changedProperties.has(\"timelineState\") || changedProperties.has(\"pixelsPerMs\");\n    const contentWidthChanged = changedProperties.has(\"contentWidth\");\n    const durationChanged =\n      changedProperties.has(\"durationMs\") || changedProperties.has(\"contextDurationMs\");\n\n    // Only render if something actually changed\n    if (\n      scrollChanged ||\n      viewportChanged ||\n      pixelsPerMsChanged ||\n      contentWidthChanged ||\n      durationChanged ||\n      this._lastRenderedScrollLeft < 0\n    ) {\n      this.renderCanvas();\n      this._lastRenderedScrollLeft = currentScrollLeft;\n      this._lastRenderedViewportWidth = currentViewportWidth;\n    }\n  }\n\n  private calculateLabelInterval(): number {\n    const pixelsPerMs = this.pixelsPerMs;\n    const pixelsPerSecond = pixelsPerMs * 1000;\n\n    const intervals = [0.1, 0.25, 0.5, 1, 2, 5, 10, 30, 60];\n\n    for (const intervalS of intervals) {\n      const pixelsPerInterval = intervalS * pixelsPerSecond;\n      if (pixelsPerInterval >= MIN_LABEL_SPACING_PX) {\n        return intervalS * 1000;\n      }\n    }\n\n    return 60000;\n  }\n\n  private getVisibleLabels(): VisibleLabel[] {\n    const canvasWidth = this._canvasViewportWidth;\n    if (canvasWidth <= 0) return [];\n\n    const pixelsPerMs = this.pixelsPerMs;\n    const canvasLeft = this._canvasViewportLeft;\n\n    const intervalMs = this.calculateLabelInterval();\n\n    // Generate labels for the canvas viewport range\n    const visibleStartTimeMs = Math.max(0, canvasLeft / pixelsPerMs - intervalMs);\n    const visibleEndTimeMs = (canvasLeft + canvasWidth) / pixelsPerMs + intervalMs;\n\n    const firstLabelIndex = Math.floor(visibleStartTimeMs / intervalMs);\n    const lastLabelIndex = Math.ceil(visibleEndTimeMs / intervalMs);\n\n    const labels: VisibleLabel[] = [];\n\n    for (let i = firstLabelIndex; i <= lastLabelIndex; i++) {\n      const timeMs = i * intervalMs;\n      if (timeMs < 0) continue;\n\n      const absoluteX = timeMs * pixelsPerMs;\n      // Position relative to canvas viewport (canvas is positioned at canvasLeft)\n      const viewportX = absoluteX - canvasLeft;\n\n      if (viewportX >= -50 && viewportX <= canvasWidth + 50) {\n        const timeSeconds = timeMs / 1000;\n        const text = timeSeconds % 1 === 0 ? `${timeSeconds}s` : `${timeSeconds.toFixed(1)}s`;\n\n        labels.push({ timeMs, viewportX, text });\n      }\n    }\n\n    return labels;\n  }\n\n  private renderCanvas(): void {\n    const canvas = this.canvasRef.value;\n    const container = this.containerRef.value;\n    if (!canvas || !container) return;\n\n    // Calculate virtualized canvas viewport\n    const viewport = this.calculateCanvasViewport();\n    this._canvasViewportLeft = viewport.left;\n    this._canvasViewportWidth = viewport.width;\n\n    const width = viewport.width;\n    const height = container.getBoundingClientRect().height;\n\n    if (width <= 0 || height <= 0) return;\n\n    const dpr = window.devicePixelRatio || 1;\n    canvas.width = width * dpr;\n    canvas.height = height * dpr;\n    canvas.style.width = `${width}px`;\n    canvas.style.height = `${height}px`;\n\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return;\n\n    ctx.scale(dpr, dpr);\n    ctx.clearRect(0, 0, width, height);\n\n    const pixelsPerMs = this.pixelsPerMs;\n    const canvasLeft = viewport.left;\n\n    // Time label ticks - more prominent\n    ctx.strokeStyle =\n      getComputedStyle(this).getPropertyValue(\"--ef-color-text-muted\").trim() ||\n      \"rgb(156, 163, 175)\";\n    ctx.lineWidth = 1;\n\n    const labelIntervalMs = this.calculateLabelInterval();\n    // Fill the canvas viewport with ticks\n    const visibleStartTimeMs = Math.max(0, canvasLeft / pixelsPerMs - labelIntervalMs);\n    const visibleEndTimeMs = (canvasLeft + width) / pixelsPerMs + labelIntervalMs;\n\n    const firstTickIndex = Math.floor(visibleStartTimeMs / labelIntervalMs);\n    const lastTickIndex = Math.ceil(visibleEndTimeMs / labelIntervalMs);\n\n    for (let i = firstTickIndex; i <= lastTickIndex; i++) {\n      const timeMs = i * labelIntervalMs;\n      if (timeMs < 0) continue;\n\n      const absoluteX = timeMs * pixelsPerMs;\n      // Position relative to canvas viewport\n      const canvasX = absoluteX - canvasLeft;\n\n      if (canvasX >= -1 && canvasX <= width + 1) {\n        ctx.beginPath();\n        ctx.moveTo(canvasX, 0);\n        ctx.lineTo(canvasX, height * 0.4);\n        ctx.stroke();\n      }\n    }\n\n    const frameIntervalMs = 1000 / this.fps;\n    const pixelsPerFrame = frameIntervalMs * pixelsPerMs;\n\n    if (pixelsPerFrame >= MIN_FRAME_SPACING_PX) {\n      // Frame markers should be lighter than background to be visible\n      ctx.strokeStyle =\n        getComputedStyle(this).getPropertyValue(\"--ef-color-border-subtle\").trim() ||\n        \"rgb(107, 114, 128)\";\n      ctx.lineWidth = 1;\n\n      const firstFrameIndex = Math.floor(visibleStartTimeMs / frameIntervalMs);\n      const lastFrameIndex = Math.ceil(visibleEndTimeMs / frameIntervalMs);\n\n      for (let i = firstFrameIndex; i <= lastFrameIndex; i++) {\n        const timeMs = i * frameIntervalMs;\n        if (timeMs < 0) continue;\n\n        if (timeMs % labelIntervalMs === 0) continue;\n\n        const absoluteX = timeMs * pixelsPerMs;\n        // Position relative to canvas viewport\n        const canvasX = absoluteX - canvasLeft;\n\n        if (canvasX >= -1 && canvasX <= width + 1) {\n          ctx.beginPath();\n          ctx.moveTo(canvasX, 0);\n          ctx.lineTo(canvasX, height * 0.25);\n          ctx.stroke();\n        }\n      }\n    }\n  }\n\n  render() {\n    const visibleLabels = this.getVisibleLabels();\n\n    const canvasViewportStyles = styleMap({\n      left: `${this._canvasViewportLeft}px`,\n      width: `${this._canvasViewportWidth}px`,\n    });\n\n    return html`\n      <div ${ref(this.containerRef)} class=\"ruler-container\">\n        <div class=\"canvas-viewport\" style=${canvasViewportStyles}>\n          <canvas ${ref(this.canvasRef)}></canvas>\n          ${visibleLabels.map(\n            ({ viewportX, text }) => html`\n            <span \n              class=\"label\" \n              style=\"transform: translateX(${viewportX}px)\"\n            >${text}</span>\n          `,\n          )}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-timeline-ruler\": EFTimelineRuler;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"EFTimelineRuler.js","names":[],"sources":["../../src/gui/EFTimelineRuler.ts"],"mappings":"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"}

package/dist/gui/EFToggleLoop.d.ts

@@ -1,7 +1,7 @@
+import { TemplateResult as TemplateResult$1 } from "../node_modules/lit-html/development/lit-html.js";
 import { ControllableInterface } from "./Controllable.js";
-import * as lit18 from "lit";
+import * as _$lit from "lit";
 import { LitElement } from "lit";
-import * as lit_html17 from "lit-html";
 
 //#region src/gui/EFToggleLoop.d.ts
 declare const EFToggleLoop_base: (new (...args: any[]) => {
@@ -10,9 +10,9 @@ declare const EFToggleLoop_base: (new (...args: any[]) => {
   effectiveContext: ControllableInterface | null;
 }) & typeof LitElement;
 declare class EFToggleLoop extends EFToggleLoop_base {
-  static styles: lit18.CSSResult[];
+  static styles: _$lit.CSSResult[];
   get context(): ControllableInterface | null;
-  render(): lit_html17.TemplateResult<1>;
+  render(): TemplateResult$1<1>;
 }
 declare global {
   interface HTMLElementTagNameMap {

package/dist/gui/EFToggleLoop.js

@@ -1,11 +1,10 @@
 import { efContext } from "./efContext.js";
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { TargetOrContextMixin } from "./TargetOrContextMixin.js";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-
 //#region src/gui/EFToggleLoop.ts
-let EFToggleLoop = class EFToggleLoop$1 extends TargetOrContextMixin(LitElement, efContext) {
+let EFToggleLoop = class EFToggleLoop extends TargetOrContextMixin(LitElement, efContext) {
 	static {
 		this.styles = [css`
       :host {}
@@ -23,7 +22,7 @@ let EFToggleLoop = class EFToggleLoop$1 extends TargetOrContextMixin(LitElement,
 	}
 };
 EFToggleLoop = __decorate([customElement("ef-toggle-loop")], EFToggleLoop);
-
 //#endregion
 export { EFToggleLoop };
+
 //# sourceMappingURL=EFToggleLoop.js.map

package/dist/gui/EFToggleLoop.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFToggleLoop.js","names":["EFToggleLoop"],"sources":["../../src/gui/EFToggleLoop.ts"],"sourcesContent":["import { css, html, LitElement } from \"lit\";\nimport { customElement } from \"lit/decorators.js\";\n\nimport type { ControllableInterface } from \"./Controllable.js\";\nimport { efContext } from \"./efContext.js\";\nimport { TargetOrContextMixin } from \"./TargetOrContextMixin.js\";\n\n@customElement(\"ef-toggle-loop\")\nexport class EFToggleLoop extends TargetOrContextMixin(LitElement, efContext) {\n  static styles = [\n    css`\n      :host {}\n    `,\n  ];\n\n  get context(): ControllableInterface | null {\n    return this.effectiveContext;\n  }\n\n  render() {\n    return html`\n      <slot @click=${() => {\n        if (this.context) {\n          this.context.loop = !this.context.loop;\n        }\n      }}></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-toggle-loop\": EFToggleLoop;\n  }\n}\n"],"mappings":";;;;;;;AAQO,yBAAMA,uBAAqB,qBAAqB,YAAY,UAAU,CAAC;;gBAC5D,CACd,GAAG;;MAGJ;;CAED,IAAI,UAAwC;AAC1C,SAAO,KAAK;;CAGd,SAAS;AACP,SAAO,IAAI;2BACY;AACnB,OAAI,KAAK,QACP,MAAK,QAAQ,OAAO,CAAC,KAAK,QAAQ;IAEpC;;;;2BAlBP,cAAc,iBAAiB"}
+{"version":3,"file":"EFToggleLoop.js","names":[],"sources":["../../src/gui/EFToggleLoop.ts"],"mappings":";;;;;;AAQO,IAAA,eAAA,MAAM,qBAAqB,qBAAqB,YAAY,UAAU,CAAC;;gBAC5D,CACd,GAAG;;MAGJ;;CAED,IAAI,UAAwC;AAC1C,SAAO,KAAK;;CAGd,SAAS;AACP,SAAO,IAAI;2BACY;AACnB,OAAI,KAAK,QACP,MAAK,QAAQ,OAAO,CAAC,KAAK,QAAQ;IAEpC;;;;2BAlBP,cAAc,iBAAiB,CAAA,EAAA,aAAA"}

package/dist/gui/EFTogglePlay.d.ts

@@ -1,7 +1,7 @@
+import { TemplateResult as TemplateResult$1 } from "../node_modules/lit-html/development/lit-html.js";
 import { ControllableInterface } from "./Controllable.js";
-import * as lit15 from "lit";
+import * as _$lit from "lit";
 import { LitElement } from "lit";
-import * as lit_html14 from "lit-html";
 
 //#region src/gui/EFTogglePlay.d.ts
 declare const EFTogglePlay_base: (new (...args: any[]) => {
@@ -10,12 +10,12 @@ declare const EFTogglePlay_base: (new (...args: any[]) => {
   effectiveContext: ControllableInterface | null;
 }) & typeof LitElement;
 declare class EFTogglePlay extends EFTogglePlay_base {
-  static styles: lit15.CSSResult[];
+  static styles: _$lit.CSSResult[];
   playing: boolean;
   get efContext(): ControllableInterface | null;
   connectedCallback(): void;
   disconnectedCallback(): void;
-  render(): lit_html14.TemplateResult<1>;
+  render(): TemplateResult$1<1>;
   togglePlay: () => void;
   private getPlaybackController;
 }

package/dist/gui/EFTogglePlay.js

@@ -1,16 +1,15 @@
 import { efContext } from "./efContext.js";
 import { playingContext } from "./playingContext.js";
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { isEFTemporal } from "../elements/EFTemporal.js";
 import { attachContextRoot } from "../attachContextRoot.js";
 import { TargetOrContextMixin } from "./TargetOrContextMixin.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
-
 //#region src/gui/EFTogglePlay.ts
 attachContextRoot();
-let EFTogglePlay = class EFTogglePlay$1 extends TargetOrContextMixin(LitElement, efContext) {
+let EFTogglePlay = class EFTogglePlay extends TargetOrContextMixin(LitElement, efContext) {
 	constructor(..._args) {
 		super(..._args);
 		this.playing = false;
@@ -67,7 +66,7 @@ __decorate([consume({
 	subscribe: true
 }), state()], EFTogglePlay.prototype, "playing", void 0);
 EFTogglePlay = __decorate([customElement("ef-toggle-play")], EFTogglePlay);
-
 //#endregion
 export { EFTogglePlay };
+
 //# sourceMappingURL=EFTogglePlay.js.map

package/dist/gui/EFTogglePlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTogglePlay.js","names":["EFTogglePlay"],"sources":["../../src/gui/EFTogglePlay.ts"],"sourcesContent":["import { consume } from \"@lit/context\";\nimport { css, html, LitElement } from \"lit\";\nimport { customElement, state } from \"lit/decorators.js\";\nimport { attachContextRoot } from \"../attachContextRoot.js\";\nimport { isEFTemporal } from \"../elements/EFTemporal.js\";\nimport type { ControllableInterface } from \"./Controllable.js\";\nimport { efContext } from \"./efContext.js\";\nimport { playingContext } from \"./playingContext.js\";\nimport type { PlaybackController } from \"./PlaybackController.js\";\nimport { TargetOrContextMixin } from \"./TargetOrContextMixin.js\";\n\nattachContextRoot();\n\n@customElement(\"ef-toggle-play\")\nexport class EFTogglePlay extends TargetOrContextMixin(LitElement, efContext) {\n  static styles = [\n    css`\n      :host {}\n      div {\n        all: inherit;\n      }\n    `,\n  ];\n\n  @consume({ context: playingContext, subscribe: true })\n  @state()\n  playing = false;\n\n  get efContext(): ControllableInterface | null {\n    return this.effectiveContext;\n  }\n\n  // Attach click listener to host\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener(\"click\", this.togglePlay);\n  }\n\n  // Detach click listener from host\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"click\", this.togglePlay);\n  }\n\n  render() {\n    return html`\n      <div>\n        ${this.playing ? html`<slot name=\"pause\"></slot>` : html`<slot name=\"play\"></slot>`}\n      </div>\n    `;\n  }\n\n  togglePlay = () => {\n    if (this.efContext) {\n      if (this.playing) {\n        this.efContext.pause();\n      } else {\n        // Create and resume AudioContext synchronously within user interaction handler\n        // This is required on mobile devices where AudioContext.resume() must be called\n        // synchronously within a user interaction event handler\n        const playbackController = this.getPlaybackController();\n        if (playbackController) {\n          try {\n            const audioContext = new AudioContext({\n              latencyHint: \"playback\",\n            });\n            // Resume synchronously (doesn't await, but initiates resume)\n            // Once resumed via user interaction, the context stays \"unlocked\"\n            audioContext.resume();\n            playbackController.setPendingAudioContext(audioContext);\n          } catch (error) {\n            // If context creation/resume fails, continue with normal async flow\n            // The fallback in startPlayback() will attempt resume (may not work on mobile)\n            console.warn(\"Failed to create/resume AudioContext synchronously:\", error);\n          }\n        }\n        this.efContext.play();\n      }\n    }\n  };\n\n  private getPlaybackController(): PlaybackController | null {\n    const context = this.efContext;\n    if (!context) {\n      return null;\n    }\n\n    // Check if context is a temporal element with playbackController\n    if (isEFTemporal(context) && context.playbackController) {\n      return context.playbackController;\n    }\n\n    return null;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-toggle-play\": EFTogglePlay;\n  }\n}\n"],"mappings":";;;;;;;;;;;AAWA,mBAAmB;AAGZ,yBAAMA,uBAAqB,qBAAqB,YAAY,UAAU,CAAC;;;iBAYlE;0BA0BS;AACjB,OAAI,KAAK,UACP,KAAI,KAAK,QACP,MAAK,UAAU,OAAO;QACjB;IAIL,MAAM,qBAAqB,KAAK,uBAAuB;AACvD,QAAI,mBACF,KAAI;KACF,MAAM,eAAe,IAAI,aAAa,EACpC,aAAa,YACd,CAAC;AAGF,kBAAa,QAAQ;AACrB,wBAAmB,uBAAuB,aAAa;aAChD,OAAO;AAGd,aAAQ,KAAK,uDAAuD,MAAM;;AAG9E,SAAK,UAAU,MAAM;;;;;gBA7DX,CACd,GAAG;;;;;MAMJ;;CAMD,IAAI,YAA0C;AAC5C,SAAO,KAAK;;CAId,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,OAAK,iBAAiB,SAAS,KAAK,WAAW;;CAIjD,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,OAAK,oBAAoB,SAAS,KAAK,WAAW;;CAGpD,SAAS;AACP,SAAO,IAAI;;UAEL,KAAK,UAAU,IAAI,+BAA+B,IAAI,4BAA4B;;;;CAkC1F,AAAQ,wBAAmD;EACzD,MAAM,UAAU,KAAK;AACrB,MAAI,CAAC,QACH,QAAO;AAIT,MAAI,aAAa,QAAQ,IAAI,QAAQ,mBACnC,QAAO,QAAQ;AAGjB,SAAO;;;YApER,QAAQ;CAAE,SAAS;CAAgB,WAAW;CAAM,CAAC,EACrD,OAAO;2BAZT,cAAc,iBAAiB"}
+{"version":3,"file":"EFTogglePlay.js","names":[],"sources":["../../src/gui/EFTogglePlay.ts"],"mappings":";;;;;;;;;;AAWA,mBAAmB;AAGZ,IAAA,eAAA,MAAM,qBAAqB,qBAAqB,YAAY,UAAU,CAAC;;;iBAYlE;0BA0BS;AACjB,OAAI,KAAK,UACP,KAAI,KAAK,QACP,MAAK,UAAU,OAAO;QACjB;IAIL,MAAM,qBAAqB,KAAK,uBAAuB;AACvD,QAAI,mBACF,KAAI;KACF,MAAM,eAAe,IAAI,aAAa,EACpC,aAAa,YACd,CAAC;AAGF,kBAAa,QAAQ;AACrB,wBAAmB,uBAAuB,aAAa;aAChD,OAAO;AAGd,aAAQ,KAAK,uDAAuD,MAAM;;AAG9E,SAAK,UAAU,MAAM;;;;;gBA7DX,CACd,GAAG;;;;;MAMJ;;CAMD,IAAI,YAA0C;AAC5C,SAAO,KAAK;;CAId,oBAAoB;AAClB,QAAM,mBAAmB;AACzB,OAAK,iBAAiB,SAAS,KAAK,WAAW;;CAIjD,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,OAAK,oBAAoB,SAAS,KAAK,WAAW;;CAGpD,SAAS;AACP,SAAO,IAAI;;UAEL,KAAK,UAAU,IAAI,+BAA+B,IAAI,4BAA4B;;;;CAkC1F,wBAA2D;EACzD,MAAM,UAAU,KAAK;AACrB,MAAI,CAAC,QACH,QAAO;AAIT,MAAI,aAAa,QAAQ,IAAI,QAAQ,mBACnC,QAAO,QAAQ;AAGjB,SAAO;;;YApER,QAAQ;CAAE,SAAS;CAAgB,WAAW;CAAM,CAAC,EACrD,OAAO,CAAA,EAAA,aAAA,WAAA,WAAA,KAAA,EAAA;2BAZT,cAAc,iBAAiB,CAAA,EAAA,aAAA"}

package/dist/gui/EFTransformHandles.d.ts

@@ -1,7 +1,7 @@
+import { TemplateResult as TemplateResult$1 } from "../node_modules/lit-html/development/lit-html.js";
 import { PanZoomTransform } from "../elements/EFPanZoom.js";
-import * as lit25 from "lit";
+import * as _$lit from "lit";
 import { LitElement } from "lit";
-import * as lit_html23 from "lit-html";
 
 //#region src/gui/EFTransformHandles.d.ts
 interface TransformBounds {
@@ -49,7 +49,7 @@ declare class EFTransformHandles extends LitElement {
    * Note: Not a @state() property to avoid re-renders during interaction.
    */
   private initialBounds;
-  static styles: lit25.CSSResult;
+  static styles: _$lit.CSSResult;
   private resizeObserver?;
   /**
    * Single source of truth for zoom scale.
@@ -79,7 +79,7 @@ declare class EFTransformHandles extends LitElement {
   private handleMouseMove;
   private handleMouseUp;
   private cleanup;
-  render(): lit_html23.TemplateResult<1>;
+  render(): TemplateResult$1<1>;
 }
 declare global {
   interface HTMLElementTagNameMap {

package/dist/gui/EFTransformHandles.js

@@ -1,4 +1,4 @@
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { panZoomTransformContext } from "./panZoomTransformContext.js";
 import { getCornerPoint, getOppositeCorner } from "./transformUtils.js";
 import { calculateDragBounds, calculateResizeBounds, getResizeHandleCursor } from "./transformCalculations.js";
@@ -6,10 +6,9 @@ import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { styleMap } from "lit/directives/style-map.js";
-
 //#region src/gui/EFTransformHandles.ts
 const DEFAULT_MIN_SIZE = 10;
-let EFTransformHandles = class EFTransformHandles$1 extends LitElement {
+let EFTransformHandles = class EFTransformHandles extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.bounds = {
@@ -387,7 +386,7 @@ __decorate([property({
 })], EFTransformHandles.prototype, "rotationStep", void 0);
 __decorate([state()], EFTransformHandles.prototype, "interactionMode", void 0);
 EFTransformHandles = __decorate([customElement("ef-transform-handles")], EFTransformHandles);
-
 //#endregion
 export { EFTransformHandles };
+
 //# sourceMappingURL=EFTransformHandles.js.map

package/dist/gui/EFTransformHandles.js.map

@@ -1 +1 @@
-{"version":3,"file":"EFTransformHandles.js","names":["EFTransformHandles","overlayStyles: Record<string, string>"],"sources":["../../src/gui/EFTransformHandles.ts"],"sourcesContent":["import { consume } from \"@lit/context\";\nimport { css, html, LitElement } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\nimport { panZoomTransformContext } from \"./panZoomTransformContext.js\";\nimport type { PanZoomTransform } from \"../elements/EFPanZoom.js\";\nimport {\n  type ResizeHandle,\n  calculateDragBounds,\n  calculateResizeBounds,\n  getResizeHandleCursor,\n} from \"./transformCalculations.js\";\nimport { getCornerPoint, getOppositeCorner } from \"./transformUtils.js\";\n\nconst DEFAULT_MIN_SIZE = 10;\n\nexport interface TransformBounds {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n  rotation?: number;\n}\n\n/**\n * Interaction mode enumeration.\n * Only one mode can be active at a time (invariant).\n */\ntype InteractionMode = \"idle\" | \"dragging\" | \"resizing\" | \"rotating\";\n\n@customElement(\"ef-transform-handles\")\nexport class EFTransformHandles extends LitElement {\n  @property({ type: Object })\n  bounds: TransformBounds = { x: 0, y: 0, width: 100, height: 100 };\n\n  @property({ type: Number })\n  minSize = DEFAULT_MIN_SIZE;\n\n  @property({ type: String })\n  target?: string;\n\n  @consume({ context: panZoomTransformContext, subscribe: true })\n  panZoomTransformFromContext?: PanZoomTransform;\n\n  @property({ type: Number, attribute: \"canvas-scale\" })\n  canvasScale = 1;\n\n  @property({ type: Boolean, attribute: \"enable-rotation\" })\n  enableRotation = false;\n\n  @property({ type: Boolean, attribute: \"enable-resize\" })\n  enableResize = true;\n\n  @property({ type: Boolean, attribute: \"corners-only\" })\n  cornersOnly = false;\n\n  @property({ type: Boolean, attribute: \"lock-aspect-ratio\" })\n  lockAspectRatio = false;\n\n  @property({ type: Boolean, attribute: \"enable-drag\" })\n  enableDrag = true;\n\n  @property({ type: Number, attribute: \"rotation-step\" })\n  rotationStep?: number;\n\n  /**\n   * Current interaction mode.\n   * Invariant: Only one mode active at a time.\n   */\n  @state()\n  interactionMode: InteractionMode = \"idle\";\n\n  /**\n   * Active resize handle when in \"resizing\" mode.\n   * Only valid when interactionMode === \"resizing\".\n   */\n  private activeResizeHandle: ResizeHandle | null = null;\n\n  /**\n   * Mouse start position for calculating deltas.\n   * Only valid during active interaction.\n   */\n  private mouseStart: { x: number; y: number } | null = null;\n\n  /**\n   * Initial bounds at interaction start - NEVER mutated during interaction.\n   * All calculations derive from this + mouse deltas.\n   * Note: Not a @state() property to avoid re-renders during interaction.\n   */\n  private initialBounds: TransformBounds | null = null;\n\n  static styles = css`\n    :host {\n      display: block;\n      position: absolute;\n      pointer-events: none;\n    }\n    .overlay {\n      position: absolute;\n      border: 2px solid var(--ef-transform-handles-border-color, var(--ef-color-primary));\n      pointer-events: none;\n    }\n    .overlay.dragging {\n      border-color: var(--ef-transform-handles-dragging-border-color, var(--ef-color-primary));\n    }\n    .drag-area {\n      position: absolute;\n      inset: 0;\n      cursor: move;\n      pointer-events: none;\n    }\n    /* Only enable pointer events when actively dragging */\n    .drag-area:active {\n      pointer-events: auto;\n    }\n    .handle {\n      position: absolute;\n      width: 8px;\n      height: 8px;\n      background: var(--ef-transform-handles-handle-color, var(--ef-color-bg-elevated));\n      border: 1px solid var(--ef-transform-handles-handle-border-color, var(--ef-color-primary));\n      pointer-events: auto;\n      /* Only capture pointer events, allow wheel events to pass through */\n      touch-action: none;\n    }\n    .handle.nw { top: -4px; left: -4px; }\n    .handle.n { top: -4px; left: 50%; transform: translateX(-50%); }\n    .handle.ne { top: -4px; right: -4px; }\n    .handle.e { top: 50%; right: -4px; transform: translateY(-50%); }\n    .handle.se { bottom: -4px; right: -4px; }\n    .handle.s { bottom: -4px; left: 50%; transform: translateX(-50%); }\n    .handle.sw { bottom: -4px; left: -4px; }\n    .handle.w { top: 50%; left: -4px; transform: translateY(-50%); }\n    .rotate-handle {\n      position: absolute;\n      top: -30px;\n      left: 50%;\n      transform: translateX(-50%);\n      cursor: grab;\n      pointer-events: auto;\n      /* Only capture pointer events, allow wheel events to pass through */\n      touch-action: none;\n    }\n    .rotate-handle-circle {\n      width: 24px;\n      height: 24px;\n      background: var(--ef-transform-handles-rotate-handle-color, var(--ef-color-success));\n      border: 2px solid var(--ef-color-bg-elevated);\n      border-radius: 50%;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .rotate-handle-circle span {\n      font-size: 12px;\n      color: white;\n    }\n  `;\n\n  private resizeObserver?: ResizeObserver;\n\n  /**\n   * Single source of truth for zoom scale.\n   * Priority: context > prop > 1.0\n   */\n  private getZoomScale(): number {\n    return this.panZoomTransformFromContext?.scale ?? this.canvasScale ?? 1;\n  }\n\n  /**\n   * Convert screen pixel bounds to canvas coordinates.\n   */\n  private screenToCanvas(bounds: TransformBounds): TransformBounds {\n    const scale = this.getZoomScale();\n    return {\n      x: bounds.x / scale,\n      y: bounds.y / scale,\n      width: bounds.width / scale,\n      height: bounds.height / scale,\n      rotation: bounds.rotation,\n    };\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.resizeObserver = new ResizeObserver(() => {\n      // Dimensions are read directly when needed\n    });\n    if (this.offsetParent) {\n      this.resizeObserver.observe(this.offsetParent);\n    }\n    // Forward wheel events to parent panzoom so zoom works even when pointer is over handles\n    // Wheel events should pass through, but we'll forward them to ensure panzoom receives them\n    this.addEventListener(\n      \"wheel\",\n      (e: WheelEvent) => {\n        // Only forward if not actively interacting with handles\n        if (this.interactionMode === \"idle\") {\n          // Find parent panzoom and forward the event\n          const panZoom = this.closest(\"ef-pan-zoom\");\n          if (panZoom) {\n            // Create a new wheel event and dispatch it on panzoom\n            const wheelEvent = new WheelEvent(\"wheel\", {\n              bubbles: true,\n              cancelable: true,\n              clientX: e.clientX,\n              clientY: e.clientY,\n              deltaX: e.deltaX,\n              deltaY: e.deltaY,\n              deltaZ: e.deltaZ,\n              deltaMode: e.deltaMode,\n              ctrlKey: e.ctrlKey,\n              metaKey: e.metaKey,\n              shiftKey: e.shiftKey,\n              altKey: e.altKey,\n            });\n            panZoom.dispatchEvent(wheelEvent);\n          }\n        }\n      },\n      { passive: true },\n    );\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.resizeObserver?.disconnect();\n    this.cleanup();\n  }\n\n  /**\n   * Transition interaction mode state machine.\n   * Ensures only one mode is active at a time (invariant).\n   */\n  private transitionInteractionMode(\n    event: \"mousedown-drag\" | \"mousedown-resize\" | \"mousedown-rotate\" | \"mouseup\",\n  ): InteractionMode {\n    if (event === \"mouseup\") {\n      return \"idle\";\n    }\n    // Only allow transition from idle\n    if (this.interactionMode !== \"idle\") {\n      return this.interactionMode;\n    }\n    switch (event) {\n      case \"mousedown-drag\":\n        return \"dragging\";\n      case \"mousedown-resize\":\n        return \"resizing\";\n      case \"mousedown-rotate\":\n        return \"rotating\";\n      default:\n        return \"idle\";\n    }\n  }\n\n  private handleMouseDown = (e: MouseEvent) => {\n    if (!this.enableDrag) return;\n    e.stopPropagation();\n    this.interactionMode = this.transitionInteractionMode(\"mousedown-drag\");\n    this.mouseStart = { x: e.clientX, y: e.clientY };\n    this.initialBounds = { ...this.bounds };\n    document.addEventListener(\"mousemove\", this.handleMouseMove);\n    document.addEventListener(\"mouseup\", this.handleMouseUp);\n  };\n\n  private handleResizeMouseDown = (e: MouseEvent, handle: ResizeHandle) => {\n    if (!this.enableResize) return;\n    e.stopPropagation();\n    e.preventDefault();\n    this.interactionMode = this.transitionInteractionMode(\"mousedown-resize\");\n    this.activeResizeHandle = handle;\n    this.mouseStart = { x: e.clientX, y: e.clientY };\n    // Store initial bounds as-is (in screen pixels) - we'll convert to canvas when calculating\n    this.initialBounds = { ...this.bounds };\n    document.addEventListener(\"mousemove\", this.handleMouseMove);\n    document.addEventListener(\"mouseup\", this.handleMouseUp);\n  };\n\n  private handleRotateMouseDown = (e: MouseEvent) => {\n    if (!this.enableRotation) return;\n    e.stopPropagation();\n    this.interactionMode = this.transitionInteractionMode(\"mousedown-rotate\");\n    this.mouseStart = { x: e.clientX, y: e.clientY };\n    this.initialBounds = { ...this.bounds };\n    document.addEventListener(\"mousemove\", this.handleMouseMove);\n    document.addEventListener(\"mouseup\", this.handleMouseUp);\n  };\n\n  /**\n   * Dispatch bounds change event (one-way data flow).\n   * Parent updates element, then reads element and updates handle bounds prop.\n   * We don't modify this.bounds directly - always render from prop.\n   */\n  private dispatchBoundsChange(bounds: TransformBounds): void {\n    this.dispatchEvent(\n      new CustomEvent(\"bounds-change\", {\n        detail: { bounds },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private handleMouseMove = (e: MouseEvent) => {\n    if (!this.mouseStart || !this.initialBounds) return;\n\n    // Calculate mouse deltas in viewport coordinates\n    const screenDeltaX = e.clientX - this.mouseStart.x;\n    const screenDeltaY = e.clientY - this.mouseStart.y;\n\n    switch (this.interactionMode) {\n      case \"dragging\": {\n        const zoomScale = this.getZoomScale();\n        const initialCanvas = this.screenToCanvas(this.initialBounds);\n\n        const newPosition = calculateDragBounds(\n          { x: initialCanvas.x, y: initialCanvas.y },\n          screenDeltaX,\n          screenDeltaY,\n          zoomScale,\n        );\n\n        this.dispatchBoundsChange({\n          ...newPosition,\n          width: initialCanvas.width,\n          height: initialCanvas.height,\n          rotation: this.initialBounds.rotation,\n        });\n        break;\n      }\n\n      case \"resizing\": {\n        if (!this.activeResizeHandle) return;\n\n        const zoomScale = this.getZoomScale();\n        const initialCanvas = this.screenToCanvas(this.initialBounds);\n        const rotation = this.enableRotation ? (this.initialBounds.rotation ?? 0) : 0;\n\n        // Calculate the fixed corner (opposite to handle being dragged)\n        const oppositeCorner = getOppositeCorner(this.activeResizeHandle);\n        const rotationRadians = (rotation * Math.PI) / 180;\n        const fixedCorner = getCornerPoint(\n          initialCanvas.x,\n          initialCanvas.y,\n          initialCanvas.width,\n          initialCanvas.height,\n          rotationRadians,\n          oppositeCorner.x,\n          oppositeCorner.y,\n        );\n\n        const newCanvasBounds = calculateResizeBounds(\n          { width: initialCanvas.width, height: initialCanvas.height },\n          { x: initialCanvas.x, y: initialCanvas.y },\n          fixedCorner,\n          this.activeResizeHandle,\n          screenDeltaX,\n          screenDeltaY,\n          rotation,\n          this.minSize / zoomScale,\n          zoomScale,\n          {\n            lockAspectRatio: this.lockAspectRatio || e.shiftKey,\n            resizeFromCenter: e.ctrlKey || e.metaKey,\n          },\n        );\n\n        // Preserve rotation\n        newCanvasBounds.rotation = this.initialBounds.rotation;\n        this.dispatchBoundsChange(newCanvasBounds);\n        break;\n      }\n\n      case \"rotating\": {\n        // Calculate center in screen coordinates (bounds are overlay-relative)\n        const overlayRect = this.offsetParent?.getBoundingClientRect() ?? {\n          left: 0,\n          top: 0,\n        };\n        const centerX = overlayRect.left + this.initialBounds.x + this.initialBounds.width / 2;\n        const centerY = overlayRect.top + this.initialBounds.y + this.initialBounds.height / 2;\n\n        // Calculate angle from mouse start to current position\n        const startAngle =\n          Math.atan2(this.mouseStart.y - centerY, this.mouseStart.x - centerX) * (180 / Math.PI) +\n          90;\n        const currentAngle =\n          Math.atan2(e.clientY - centerY, e.clientX - centerX) * (180 / Math.PI) + 90;\n\n        // Normalize angle difference to [-180, 180] to avoid wrapping issues\n        let deltaAngle = currentAngle - startAngle;\n        while (deltaAngle > 180) deltaAngle -= 360;\n        while (deltaAngle < -180) deltaAngle += 360;\n\n        let newRotation = (this.initialBounds.rotation ?? 0) + deltaAngle;\n        if (this.rotationStep !== undefined && this.rotationStep > 0) {\n          newRotation = Math.round(newRotation / this.rotationStep) * this.rotationStep;\n        }\n\n        this.dispatchEvent(\n          new CustomEvent(\"rotation-change\", {\n            detail: { rotation: newRotation },\n            bubbles: true,\n            composed: true,\n          }),\n        );\n        break;\n      }\n\n      case \"idle\":\n        // No action needed\n        break;\n    }\n  };\n\n  private handleMouseUp = () => {\n    this.cleanup();\n  };\n\n  private cleanup() {\n    this.interactionMode = this.transitionInteractionMode(\"mouseup\");\n    this.activeResizeHandle = null;\n    this.mouseStart = null;\n    this.initialBounds = null;\n    document.removeEventListener(\"mousemove\", this.handleMouseMove);\n    document.removeEventListener(\"mouseup\", this.handleMouseUp);\n  }\n\n  render() {\n    // Always render from bounds prop (one-way data flow)\n    // During interaction: dispatch events, parent updates element, parent updates handle bounds prop\n    const currentBounds = this.bounds;\n    const rotation = this.enableRotation ? (currentBounds.rotation ?? 0) : 0;\n\n    const overlayStyles: Record<string, string> = {\n      left: `${currentBounds.x}px`,\n      top: `${currentBounds.y}px`,\n      width: `${currentBounds.width}px`,\n      height: `${currentBounds.height}px`,\n    };\n\n    if (this.enableRotation && rotation !== 0) {\n      overlayStyles.transform = `rotate(${rotation}deg)`;\n      overlayStyles.transformOrigin = \"center\";\n    }\n\n    const allHandles: ResizeHandle[] = [\"nw\", \"n\", \"ne\", \"e\", \"se\", \"s\", \"sw\", \"w\"];\n    const cornerHandles: ResizeHandle[] = [\"nw\", \"ne\", \"se\", \"sw\"];\n    const handles = this.cornersOnly ? cornerHandles : allHandles;\n\n    return html`\n      <div\n        class=\"overlay ${this.interactionMode === \"dragging\" ? \"dragging\" : \"\"}\"\n        style=${styleMap(overlayStyles)}\n      >\n        ${\n          this.enableDrag\n            ? html`\n              <div\n                class=\"drag-area\"\n                @mousedown=${this.handleMouseDown}\n              ></div>\n            `\n            : \"\"\n        }\n        ${\n          this.enableResize\n            ? handles.map((handle) => {\n                const rotation = this.enableRotation ? (currentBounds.rotation ?? 0) : 0;\n                const cursor = getResizeHandleCursor(handle, rotation);\n                return html`\n                <div\n                  class=\"handle ${handle}\"\n                      style=${styleMap({ cursor })}\n                  @mousedown=${(e: MouseEvent) => this.handleResizeMouseDown(e, handle)}\n                ></div>\n                  `;\n              })\n            : \"\"\n        }\n        ${\n          this.enableRotation\n            ? html`\n              <div class=\"rotate-handle\" @mousedown=${this.handleRotateMouseDown}>\n                <div class=\"rotate-handle-circle\">\n                  <span>↻</span>\n                </div>\n              </div>\n            `\n            : \"\"\n        }\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ef-transform-handles\": EFTransformHandles;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"EFTransformHandles.js","names":[],"sources":["../../src/gui/EFTransformHandles.ts"],"mappings":"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"}

package/dist/gui/EFWorkbench.d.ts

@@ -1,16 +1,15 @@
+import { TemplateResult as TemplateResult$1 } from "../node_modules/lit-html/development/lit-html.js";
 import { ContextMixinInterface } from "./ContextMixin.js";
 import { RenderToVideoOptions } from "../preview/renderTimegroupToVideo.types.js";
-import "./EFFitScale.js";
-import * as lit8 from "lit";
+import { Ref } from "../node_modules/lit-html/development/directives/ref.js";
+import * as _$lit from "lit";
 import { LitElement, PropertyValueMap } from "lit";
-import * as lit_html8 from "lit-html";
-import * as lit_html_directives_ref_js2 from "lit-html/directives/ref.js";
 
 //#region src/gui/EFWorkbench.d.ts
 declare const EFWorkbench_base: (new (...args: any[]) => ContextMixinInterface) & typeof LitElement;
 declare class EFWorkbench extends EFWorkbench_base {
   #private;
-  static styles: lit8.CSSResult[];
+  static styles: _$lit.CSSResult[];
   rendering: boolean;
   private panZoomTransform;
   private isExporting;
@@ -70,7 +69,7 @@ declare class EFWorkbench extends EFWorkbench_base {
   private canvasAnimationFrame;
   private boundHandleTransformChanged;
   private boundHandleKeyDown;
-  focusOverlay: lit_html_directives_ref_js2.Ref<HTMLDivElement>;
+  focusOverlay: Ref<HTMLDivElement>;
   handleStageWheel(event: WheelEvent): void;
   connectedCallback(): void;
   disconnectedCallback(): void;
@@ -201,7 +200,7 @@ declare class EFWorkbench extends EFWorkbench_base {
   updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
   drawOverlays: () => void;
   private renderPlaybackStats;
-  render(): lit_html8.TemplateResult<1>;
+  render(): TemplateResult$1<1>;
 }
 declare global {
   interface HTMLElementTagNameMap {

package/dist/gui/EFWorkbench.js

@@ -1,6 +1,6 @@
 import { TWMixin } from "./TWMixin2.js";
 import { updateAnimations } from "../elements/updateAnimations.js";
-import { __decorate } from "../_virtual/_@oxc-project_runtime@0.95.0/helpers/decorate.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
 import { ContextMixin } from "./ContextMixin.js";
 import { findRootTemporal } from "../elements/findRootTemporal.js";
 import { ICONS, phosphorIcon } from "./icons.js";
@@ -17,11 +17,10 @@ import { provide } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement, eventOptions, property, state } from "lit/decorators.js";
 import { createRef, ref } from "lit/directives/ref.js";
-
 //#region src/gui/EFWorkbench.ts
 /** Debounce delay before considering the preview "at rest" after motion stops */
 const REST_DEBOUNCE_MS = 200;
-let EFWorkbench = class EFWorkbench$1 extends ContextMixin(TWMixin(LitElement)) {
+let EFWorkbench = class EFWorkbench extends ContextMixin(TWMixin(LitElement)) {
 	constructor(..._args) {
 		super(..._args);
 		this.rendering = false;
@@ -707,12 +706,12 @@ let EFWorkbench = class EFWorkbench$1 extends ContextMixin(TWMixin(LitElement))
 		const storageKey = this.getPreviewPanZoomStorageKey();
 		if (!storageKey) return;
 		try {
-			const state$1 = {
+			const state = {
 				x: this.panZoomTransform.x,
 				y: this.panZoomTransform.y,
 				scale: this.panZoomTransform.scale
 			};
-			localStorage.setItem(storageKey, JSON.stringify(state$1));
+			localStorage.setItem(storageKey, JSON.stringify(state));
 		} catch (error) {
 			console.warn("Failed to save preview pan/zoom to localStorage", error);
 		}
@@ -726,12 +725,12 @@ let EFWorkbench = class EFWorkbench$1 extends ContextMixin(TWMixin(LitElement))
 		try {
 			const stored = localStorage.getItem(storageKey);
 			if (!stored) return;
-			const state$1 = JSON.parse(stored);
-			if (typeof state$1.x === "number" && typeof state$1.y === "number" && typeof state$1.scale === "number" && state$1.scale > 0) {
-				const clampedScale = Math.max(.1, Math.min(5, state$1.scale));
+			const state = JSON.parse(stored);
+			if (typeof state.x === "number" && typeof state.y === "number" && typeof state.scale === "number" && state.scale > 0) {
+				const clampedScale = Math.max(.1, Math.min(5, state.scale));
 				this.panZoomTransform = {
-					x: state$1.x,
-					y: state$1.y,
+					x: state.x,
+					y: state.y,
 					scale: clampedScale
 				};
 				requestAnimationFrame(() => {
@@ -876,8 +875,7 @@ let EFWorkbench = class EFWorkbench$1 extends ContextMixin(TWMixin(LitElement))
 			return scale;
 		} else {
 			const adaptiveScale = this.currentAdaptiveScale;
-			const targetScale = Math.min(displayScale, adaptiveScale);
-			const scale = Math.max(.1, Math.min(1, targetScale));
+			const scale = Math.max(.1, Math.min(1, Math.min(displayScale, adaptiveScale)));
 			console.log(`[EFWorkbench] Auto mode (in motion): adaptive=${adaptiveScale}, display=${displayScale.toFixed(2)}, final=${(scale * 100).toFixed(1)}%`);
 			return scale;
 		}
@@ -1712,8 +1710,8 @@ let EFWorkbench = class EFWorkbench$1 extends ContextMixin(TWMixin(LitElement))
 			if (stats.pressureHistory.length === 0) return html`<div style="color: var(--ef-color-text-subtle); font-size: 9px;">No pressure data (API not available)</div>`;
 			return html`
         <div class="pressure-histogram">
-          ${stats.pressureHistory.map((state$1) => html`
-            <div class="bar ${state$1}"></div>
+          ${stats.pressureHistory.map((state) => html`
+            <div class="bar ${state}"></div>
           `)}
         </div>
         <div class="pressure-histogram-label">
@@ -1870,7 +1868,7 @@ __decorate([eventOptions({
 	capture: true
 })], EFWorkbench.prototype, "handleStageWheel", null);
 EFWorkbench = __decorate([customElement("ef-workbench")], EFWorkbench);
-
 //#endregion
 export { EFWorkbench };
+
 //# sourceMappingURL=EFWorkbench.js.map