@editframe/elements 0.20.4-beta.0 → 0.21.0-beta.0

package/dist/gui/EFFilmstrip.js

@@ -1,3 +1,4 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { focusContext } from "./focusContext.js";
 import { focusedElementContext } from "./focusedElementContext.js";
 import { loopContext, playingContext } from "./playingContext.js";
@@ -14,7 +15,6 @@ import { msToTimeCode } from "../msToTimeCode.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html, nothing } from "lit";
 import { customElement, eventOptions, property, state } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { createRef, ref } from "lit/directives/ref.js";
 import { styleMap } from "lit/directives/style-map.js";
 var ElementFilmstripController = class {
@@ -33,7 +33,7 @@ var ElementFilmstripController = class {
 		this.filmstrip.requestUpdate();
 	}
 };
-const CommonEffectKeys = new Set([
+var CommonEffectKeys = new Set([
 	"offset",
 	"easing",
 	"composite",
@@ -98,15 +98,13 @@ var FilmstripItem = class extends TWMixin(LitElement) {
 		return html``;
 	}
 	animations() {
-		const animations = this.element.getAnimations();
-		return animations.map((animation) => {
+		return this.element.getAnimations().map((animation) => {
 			const effect = animation.effect;
 			if (!(effect instanceof KeyframeEffect)) return nothing;
 			const start = effect.getTiming().delay ?? 0;
 			const duration = effect.getTiming().duration;
 			if (duration === null) return nothing;
-			const keyframes = effect.getKeyframes();
-			const firstKeyframe = keyframes[0];
+			const firstKeyframe = effect.getKeyframes()[0];
 			if (!firstKeyframe) return nothing;
 			const properties = new Set(Object.keys(firstKeyframe));
 			for (const key of CommonEffectKeys) properties.delete(key);
@@ -136,35 +134,34 @@ var FilmstripItem = class extends TWMixin(LitElement) {
 		super.update(changedProperties);
 	}
 };
-_decorate([consume({
+__decorate([consume({
 	context: focusContext,
 	subscribe: true
 })], FilmstripItem.prototype, "focusContext", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: focusedElementContext,
 	subscribe: true
 })], FilmstripItem.prototype, "focusedElement", void 0);
-_decorate([property({
+__decorate([property({
 	type: Object,
 	attribute: false
 })], FilmstripItem.prototype, "element", void 0);
-_decorate([property({ type: Number })], FilmstripItem.prototype, "pixelsPerMs", void 0);
-let EFAudioFilmstrip = class EFAudioFilmstrip$1 extends FilmstripItem {
+__decorate([property({ type: Number })], FilmstripItem.prototype, "pixelsPerMs", void 0);
+var EFAudioFilmstrip = class EFAudioFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html``;
 	}
 };
-EFAudioFilmstrip = _decorate([customElement("ef-audio-filmstrip")], EFAudioFilmstrip);
-let EFVideoFilmstrip = class EFVideoFilmstrip$1 extends FilmstripItem {
+EFAudioFilmstrip = __decorate([customElement("ef-audio-filmstrip")], EFAudioFilmstrip);
+var EFVideoFilmstrip = class EFVideoFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html` 📼 `;
 	}
 };
-EFVideoFilmstrip = _decorate([customElement("ef-video-filmstrip")], EFVideoFilmstrip);
-let EFCaptionsFilmstrip = class EFCaptionsFilmstrip$1 extends FilmstripItem {
+EFVideoFilmstrip = __decorate([customElement("ef-video-filmstrip")], EFVideoFilmstrip);
+var EFCaptionsFilmstrip = class EFCaptionsFilmstrip$1 extends FilmstripItem {
 	render() {
-		const captions = this.element;
-		const captionsData = captions.unifiedCaptionsDataTask.value;
+		const captionsData = this.element.unifiedCaptionsDataTask.value;
 		return html`<div style=${styleMap(this.gutterStyles)}>
       <div
         class="bg-slate-300 relative"
@@ -190,10 +187,7 @@ let EFCaptionsFilmstrip = class EFCaptionsFilmstrip$1 extends FilmstripItem {
 	renderCaptionsData(captionsData) {
 		if (!captionsData) return html``;
 		const captions = this.element;
-		const rootTimegroup = captions.rootTimegroup;
-		const currentTimeMs = rootTimegroup?.currentTimeMs || 0;
-		const captionsLocalTimeMs = currentTimeMs - captions.startTimeMs;
-		const captionsLocalTimeSec = captionsLocalTimeMs / 1e3;
+		const captionsLocalTimeSec = ((captions.rootTimegroup?.currentTimeMs || 0) - captions.startTimeMs) / 1e3;
 		const segmentElements = captionsData.segments.map((segment) => {
 			const isActive = captionsLocalTimeSec >= segment.start && captionsLocalTimeSec < segment.end;
 			return html`<div
@@ -215,8 +209,8 @@ let EFCaptionsFilmstrip = class EFCaptionsFilmstrip$1 extends FilmstripItem {
 		return super.renderChildren();
 	}
 };
-EFCaptionsFilmstrip = _decorate([customElement("ef-captions-filmstrip")], EFCaptionsFilmstrip);
-let EFCaptionsActiveWordFilmstrip = class EFCaptionsActiveWordFilmstrip$1 extends FilmstripItem {
+EFCaptionsFilmstrip = __decorate([customElement("ef-captions-filmstrip")], EFCaptionsFilmstrip);
+var EFCaptionsActiveWordFilmstrip = class EFCaptionsActiveWordFilmstrip$1 extends FilmstripItem {
 	get captionsTrackStyles() {
 		const parentCaptions = this.element.closest("ef-captions");
 		return {
@@ -233,10 +227,7 @@ let EFCaptionsActiveWordFilmstrip = class EFCaptionsActiveWordFilmstrip$1 extend
           🗣️ Active Word
         </div>
       </div>`;
-		const rootTimegroup = parentCaptions.rootTimegroup;
-		const currentTimeMs = rootTimegroup?.currentTimeMs || 0;
-		const captionsLocalTimeMs = currentTimeMs - parentCaptions.startTimeMs;
-		const captionsLocalTimeSec = captionsLocalTimeMs / 1e3;
+		const captionsLocalTimeSec = ((parentCaptions.rootTimegroup?.currentTimeMs || 0) - parentCaptions.startTimeMs) / 1e3;
 		return html`<div style=${styleMap(this.captionsTrackStyles)}>
       <div class="bg-slate-300 relative border border-slate-500 h-[1.1rem] mb-[1px] w-full">
         ${captionsData.word_segments.map((word) => {
@@ -258,8 +249,8 @@ let EFCaptionsActiveWordFilmstrip = class EFCaptionsActiveWordFilmstrip$1 extend
     </div>`;
 	}
 };
-EFCaptionsActiveWordFilmstrip = _decorate([customElement("ef-captions-active-word-filmstrip")], EFCaptionsActiveWordFilmstrip);
-let EFCaptionsSegmentFilmstrip = class EFCaptionsSegmentFilmstrip$1 extends FilmstripItem {
+EFCaptionsActiveWordFilmstrip = __decorate([customElement("ef-captions-active-word-filmstrip")], EFCaptionsActiveWordFilmstrip);
+var EFCaptionsSegmentFilmstrip = class EFCaptionsSegmentFilmstrip$1 extends FilmstripItem {
 	get captionsTrackStyles() {
 		const parentCaptions = this.element.closest("ef-captions");
 		return {
@@ -276,10 +267,7 @@ let EFCaptionsSegmentFilmstrip = class EFCaptionsSegmentFilmstrip$1 extends Film
           📄 Segment
         </div>
       </div>`;
-		const rootTimegroup = parentCaptions.rootTimegroup;
-		const currentTimeMs = rootTimegroup?.currentTimeMs || 0;
-		const captionsLocalTimeMs = currentTimeMs - parentCaptions.startTimeMs;
-		const captionsLocalTimeSec = captionsLocalTimeMs / 1e3;
+		const captionsLocalTimeSec = ((parentCaptions.rootTimegroup?.currentTimeMs || 0) - parentCaptions.startTimeMs) / 1e3;
 		return html`<div style=${styleMap(this.captionsTrackStyles)}>
       <div class="bg-slate-300 relative border border-slate-500 h-[1.1rem] mb-[1px] w-full">
         ${captionsData.segments.map((segment) => {
@@ -301,8 +289,8 @@ let EFCaptionsSegmentFilmstrip = class EFCaptionsSegmentFilmstrip$1 extends Film
     </div>`;
 	}
 };
-EFCaptionsSegmentFilmstrip = _decorate([customElement("ef-captions-segment-filmstrip")], EFCaptionsSegmentFilmstrip);
-let EFCaptionsBeforeWordFilmstrip = class EFCaptionsBeforeWordFilmstrip$1 extends FilmstripItem {
+EFCaptionsSegmentFilmstrip = __decorate([customElement("ef-captions-segment-filmstrip")], EFCaptionsSegmentFilmstrip);
+var EFCaptionsBeforeWordFilmstrip = class EFCaptionsBeforeWordFilmstrip$1 extends FilmstripItem {
 	get captionsTrackStyles() {
 		const parentCaptions = this.element.closest("ef-captions");
 		return {
@@ -319,10 +307,7 @@ let EFCaptionsBeforeWordFilmstrip = class EFCaptionsBeforeWordFilmstrip$1 extend
           ⬅️ Before
         </div>
       </div>`;
-		const rootTimegroup = parentCaptions.rootTimegroup;
-		const currentTimeMs = rootTimegroup?.currentTimeMs || 0;
-		const captionsLocalTimeMs = currentTimeMs - parentCaptions.startTimeMs;
-		const captionsLocalTimeSec = captionsLocalTimeMs / 1e3;
+		const captionsLocalTimeSec = ((parentCaptions.rootTimegroup?.currentTimeMs || 0) - parentCaptions.startTimeMs) / 1e3;
 		return html`<div style=${styleMap(this.captionsTrackStyles)}>
       <div class="bg-slate-300 relative border border-slate-500 h-[1.1rem] mb-[1px] w-full">
         ${captionsData.word_segments.map((word) => {
@@ -344,8 +329,8 @@ let EFCaptionsBeforeWordFilmstrip = class EFCaptionsBeforeWordFilmstrip$1 extend
     </div>`;
 	}
 };
-EFCaptionsBeforeWordFilmstrip = _decorate([customElement("ef-captions-before-word-filmstrip")], EFCaptionsBeforeWordFilmstrip);
-let EFCaptionsAfterWordFilmstrip = class EFCaptionsAfterWordFilmstrip$1 extends FilmstripItem {
+EFCaptionsBeforeWordFilmstrip = __decorate([customElement("ef-captions-before-word-filmstrip")], EFCaptionsBeforeWordFilmstrip);
+var EFCaptionsAfterWordFilmstrip = class EFCaptionsAfterWordFilmstrip$1 extends FilmstripItem {
 	get captionsTrackStyles() {
 		const parentCaptions = this.element.closest("ef-captions");
 		return {
@@ -362,10 +347,7 @@ let EFCaptionsAfterWordFilmstrip = class EFCaptionsAfterWordFilmstrip$1 extends
           ➡️ After
         </div>
       </div>`;
-		const rootTimegroup = parentCaptions.rootTimegroup;
-		const currentTimeMs = rootTimegroup?.currentTimeMs || 0;
-		const captionsLocalTimeMs = currentTimeMs - parentCaptions.startTimeMs;
-		const captionsLocalTimeSec = captionsLocalTimeMs / 1e3;
+		const captionsLocalTimeSec = ((parentCaptions.rootTimegroup?.currentTimeMs || 0) - parentCaptions.startTimeMs) / 1e3;
 		return html`<div style=${styleMap(this.captionsTrackStyles)}>
       <div class="bg-slate-300 relative border border-slate-500 h-[1.1rem] mb-[1px] w-full">
         ${captionsData.word_segments.map((word) => {
@@ -387,8 +369,8 @@ let EFCaptionsAfterWordFilmstrip = class EFCaptionsAfterWordFilmstrip$1 extends
     </div>`;
 	}
 };
-EFCaptionsAfterWordFilmstrip = _decorate([customElement("ef-captions-after-word-filmstrip")], EFCaptionsAfterWordFilmstrip);
-let EFWaveformFilmstrip = class EFWaveformFilmstrip$1 extends FilmstripItem {
+EFCaptionsAfterWordFilmstrip = __decorate([customElement("ef-captions-after-word-filmstrip")], EFCaptionsAfterWordFilmstrip);
+var EFWaveformFilmstrip = class EFWaveformFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html` 🌊 `;
 	}
@@ -396,14 +378,14 @@ let EFWaveformFilmstrip = class EFWaveformFilmstrip$1 extends FilmstripItem {
 		return nothing;
 	}
 };
-EFWaveformFilmstrip = _decorate([customElement("ef-waveform-filmstrip")], EFWaveformFilmstrip);
-let EFImageFilmstrip = class EFImageFilmstrip$1 extends FilmstripItem {
+EFWaveformFilmstrip = __decorate([customElement("ef-waveform-filmstrip")], EFWaveformFilmstrip);
+var EFImageFilmstrip = class EFImageFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html` 🖼️ `;
 	}
 };
-EFImageFilmstrip = _decorate([customElement("ef-image-filmstrip")], EFImageFilmstrip);
-let EFTimegroupFilmstrip = class EFTimegroupFilmstrip$1 extends FilmstripItem {
+EFImageFilmstrip = __decorate([customElement("ef-image-filmstrip")], EFImageFilmstrip);
+var EFTimegroupFilmstrip = class EFTimegroupFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html`
       <span>TIME GROUP</span>
@@ -412,8 +394,8 @@ let EFTimegroupFilmstrip = class EFTimegroupFilmstrip$1 extends FilmstripItem {
     `;
 	}
 };
-EFTimegroupFilmstrip = _decorate([customElement("ef-timegroup-filmstrip")], EFTimegroupFilmstrip);
-let EFHTMLFilmstrip = class EFHTMLFilmstrip$1 extends FilmstripItem {
+EFTimegroupFilmstrip = __decorate([customElement("ef-timegroup-filmstrip")], EFTimegroupFilmstrip);
+var EFHTMLFilmstrip = class EFHTMLFilmstrip$1 extends FilmstripItem {
 	contents() {
 		return html`
       <span>${this.element.tagName}</span>
@@ -421,8 +403,8 @@ let EFHTMLFilmstrip = class EFHTMLFilmstrip$1 extends FilmstripItem {
     `;
 	}
 };
-EFHTMLFilmstrip = _decorate([customElement("ef-html-filmstrip")], EFHTMLFilmstrip);
-let EFHierarchyItem = class EFHierarchyItem$1 extends TWMixin(LitElement) {
+EFHTMLFilmstrip = __decorate([customElement("ef-html-filmstrip")], EFHTMLFilmstrip);
+var EFHierarchyItem = class EFHierarchyItem$1 extends TWMixin(LitElement) {
 	constructor(..._args2) {
 		super(..._args2);
 		this.element = new EFTimegroup();
@@ -464,17 +446,17 @@ let EFHierarchyItem = class EFHierarchyItem$1 extends TWMixin(LitElement) {
 		return renderHierarchyChildren(Array.from(this.element.children));
 	}
 };
-_decorate([property({
+__decorate([property({
 	type: Object,
 	attribute: false
 })], EFHierarchyItem.prototype, "element", void 0);
-_decorate([consume({ context: focusContext })], EFHierarchyItem.prototype, "focusContext", void 0);
-_decorate([consume({
+__decorate([consume({ context: focusContext })], EFHierarchyItem.prototype, "focusContext", void 0);
+__decorate([consume({
 	context: focusedElementContext,
 	subscribe: true
 })], EFHierarchyItem.prototype, "focusedElement", void 0);
-EFHierarchyItem = _decorate([customElement("ef-hierarchy-item")], EFHierarchyItem);
-let EFTimegroupHierarchyItem = class EFTimegroupHierarchyItem$1 extends EFHierarchyItem {
+EFHierarchyItem = __decorate([customElement("ef-hierarchy-item")], EFHierarchyItem);
+var EFTimegroupHierarchyItem = class EFTimegroupHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "🕒";
 	}
@@ -482,8 +464,8 @@ let EFTimegroupHierarchyItem = class EFTimegroupHierarchyItem$1 extends EFHierar
 		return this.element.mode ?? "(no mode)";
 	}
 };
-EFTimegroupHierarchyItem = _decorate([customElement("ef-timegroup-hierarchy-item")], EFTimegroupHierarchyItem);
-let EFAudioHierarchyItem = class EFAudioHierarchyItem$1 extends EFHierarchyItem {
+EFTimegroupHierarchyItem = __decorate([customElement("ef-timegroup-hierarchy-item")], EFTimegroupHierarchyItem);
+var EFAudioHierarchyItem = class EFAudioHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "🔊";
 	}
@@ -491,8 +473,8 @@ let EFAudioHierarchyItem = class EFAudioHierarchyItem$1 extends EFHierarchyItem
 		return this.element.src ?? "(no src)";
 	}
 };
-EFAudioHierarchyItem = _decorate([customElement("ef-audio-hierarchy-item")], EFAudioHierarchyItem);
-let EFVideoHierarchyItem = class EFVideoHierarchyItem$1 extends EFHierarchyItem {
+EFAudioHierarchyItem = __decorate([customElement("ef-audio-hierarchy-item")], EFAudioHierarchyItem);
+var EFVideoHierarchyItem = class EFVideoHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "📼";
 	}
@@ -500,20 +482,20 @@ let EFVideoHierarchyItem = class EFVideoHierarchyItem$1 extends EFHierarchyItem
 		return this.element.src ?? "(no src)";
 	}
 };
-EFVideoHierarchyItem = _decorate([customElement("ef-video-hierarchy-item")], EFVideoHierarchyItem);
-let EFCaptionsHierarchyItem = class EFCaptionsHierarchyItem$1 extends EFHierarchyItem {
+EFVideoHierarchyItem = __decorate([customElement("ef-video-hierarchy-item")], EFVideoHierarchyItem);
+var EFCaptionsHierarchyItem = class EFCaptionsHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "📝 Captions";
 	}
 };
-EFCaptionsHierarchyItem = _decorate([customElement("ef-captions-hierarchy-item")], EFCaptionsHierarchyItem);
-let EFCaptionsActiveWordHierarchyItem = class EFCaptionsActiveWordHierarchyItem$1 extends EFHierarchyItem {
+EFCaptionsHierarchyItem = __decorate([customElement("ef-captions-hierarchy-item")], EFCaptionsHierarchyItem);
+var EFCaptionsActiveWordHierarchyItem = class EFCaptionsActiveWordHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "🗣️ Active Word";
 	}
 };
-EFCaptionsActiveWordHierarchyItem = _decorate([customElement("ef-captions-active-word-hierarchy-item")], EFCaptionsActiveWordHierarchyItem);
-let EFWaveformHierarchyItem = class EFWaveformHierarchyItem$1 extends EFHierarchyItem {
+EFCaptionsActiveWordHierarchyItem = __decorate([customElement("ef-captions-active-word-hierarchy-item")], EFCaptionsActiveWordHierarchyItem);
+var EFWaveformHierarchyItem = class EFWaveformHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "🌊";
 	}
@@ -521,8 +503,8 @@ let EFWaveformHierarchyItem = class EFWaveformHierarchyItem$1 extends EFHierarch
 		return nothing;
 	}
 };
-EFWaveformHierarchyItem = _decorate([customElement("ef-waveform-hierarchy-item")], EFWaveformHierarchyItem);
-let EFImageHierarchyItem = class EFImageHierarchyItem$1 extends EFHierarchyItem {
+EFWaveformHierarchyItem = __decorate([customElement("ef-waveform-hierarchy-item")], EFWaveformHierarchyItem);
+var EFImageHierarchyItem = class EFImageHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return "🖼️";
 	}
@@ -530,14 +512,14 @@ let EFImageHierarchyItem = class EFImageHierarchyItem$1 extends EFHierarchyItem
 		return this.element.src ?? "(no src)";
 	}
 };
-EFImageHierarchyItem = _decorate([customElement("ef-image-hierarchy-item")], EFImageHierarchyItem);
-let EFHTMLHierarchyItem = class EFHTMLHierarchyItem$1 extends EFHierarchyItem {
+EFImageHierarchyItem = __decorate([customElement("ef-image-hierarchy-item")], EFImageHierarchyItem);
+var EFHTMLHierarchyItem = class EFHTMLHierarchyItem$1 extends EFHierarchyItem {
 	get icon() {
 		return html`<code>${`<${this.element.tagName.toLowerCase()}>`}</code>`;
 	}
 };
-EFHTMLHierarchyItem = _decorate([customElement("ef-html-hierarchy-item")], EFHTMLHierarchyItem);
-const renderHierarchyChildren = (children) => {
+EFHTMLHierarchyItem = __decorate([customElement("ef-html-hierarchy-item")], EFHTMLHierarchyItem);
+var renderHierarchyChildren = (children) => {
 	return children.map((child) => {
 		if (child instanceof HTMLElement && child.dataset?.efHidden) return nothing;
 		if (child instanceof EFTimegroup) return html`<ef-timegroup-hierarchy-item
@@ -566,7 +548,7 @@ const renderHierarchyChildren = (children) => {
     ></ef-html-hierarchy-item>`;
 	});
 };
-const renderFilmstripChildren = (children, pixelsPerMs) => {
+var renderFilmstripChildren = (children, pixelsPerMs) => {
 	return children.map((child) => {
 		if (child instanceof HTMLElement && child.dataset?.efHidden) return nothing;
 		if (child instanceof EFTimegroup) return html`<ef-timegroup-filmstrip
@@ -616,7 +598,7 @@ const renderFilmstripChildren = (children, pixelsPerMs) => {
     ></ef-html-filmstrip>`;
 	});
 };
-let EFFilmstrip = class EFFilmstrip$1 extends TWMixin(LitElement) {
+var EFFilmstrip = class EFFilmstrip$1 extends TWMixin(LitElement) {
 	constructor(..._args3) {
 		super(..._args3);
 		this.pixelsPerMs = .04;
@@ -668,9 +650,7 @@ let EFFilmstrip = class EFFilmstrip$1 extends TWMixin(LitElement) {
 	#handleKeyPress = (event) => {
 		if (event.key === " ") {
 			const [target] = event.composedPath();
-			const interactiveSelector = "input, textarea, button, select, a, [contenteditable]";
-			const closestInteractive = target?.closest(interactiveSelector);
-			if (closestInteractive) return;
+			if (target?.closest("input, textarea, button, select, a, [contenteditable]")) return;
 			event.preventDefault();
 			if (this.#contextElement) this.#contextElement.playing = !this.#contextElement.playing;
 		}
@@ -707,8 +687,7 @@ let EFFilmstrip = class EFFilmstrip$1 extends TWMixin(LitElement) {
 		if (!gutter) return;
 		const rect = gutter.getBoundingClientRect();
 		if (this.targetTimegroup) {
-			const layerX = e.pageX - rect.left + gutter.scrollLeft;
-			const scrubTimeMs = layerX / this.pixelsPerMs;
+			const scrubTimeMs = (e.pageX - rect.left + gutter.scrollLeft) / this.pixelsPerMs;
 			this.targetTimegroup.currentTimeMs = scrubTimeMs;
 		}
 	}
@@ -816,32 +795,32 @@ let EFFilmstrip = class EFFilmstrip$1 extends TWMixin(LitElement) {
 		super.willUpdate(changedProperties);
 	}
 };
-_decorate([property({ type: Number })], EFFilmstrip.prototype, "pixelsPerMs", void 0);
-_decorate([state()], EFFilmstrip.prototype, "scrubbing", void 0);
-_decorate([state()], EFFilmstrip.prototype, "timelineScrolltop", void 0);
-_decorate([consume({
+__decorate([property({ type: Number })], EFFilmstrip.prototype, "pixelsPerMs", void 0);
+__decorate([state()], EFFilmstrip.prototype, "scrubbing", void 0);
+__decorate([state()], EFFilmstrip.prototype, "timelineScrolltop", void 0);
+__decorate([consume({
 	context: playingContext,
 	subscribe: true
 }), state()], EFFilmstrip.prototype, "playing", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: loopContext,
 	subscribe: true
 }), state()], EFFilmstrip.prototype, "loop", void 0);
-_decorate([state()], EFFilmstrip.prototype, "currentTimeMs", void 0);
-_decorate([property({
+__decorate([state()], EFFilmstrip.prototype, "currentTimeMs", void 0);
+__decorate([property({
 	type: Boolean,
 	reflect: true,
 	attribute: "auto-scale"
 })], EFFilmstrip.prototype, "autoScale", void 0);
-_decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "syncGutterScroll", null);
-_decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "syncHierarchyScroll", null);
-_decorate([eventOptions({ capture: false })], EFFilmstrip.prototype, "scrub", null);
-_decorate([eventOptions({ capture: false })], EFFilmstrip.prototype, "startScrub", null);
-_decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "scrollScrub", null);
-_decorate([property({ type: String })], EFFilmstrip.prototype, "target", void 0);
-_decorate([consume({
+__decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "syncGutterScroll", null);
+__decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "syncHierarchyScroll", null);
+__decorate([eventOptions({ capture: false })], EFFilmstrip.prototype, "scrub", null);
+__decorate([eventOptions({ capture: false })], EFFilmstrip.prototype, "startScrub", null);
+__decorate([eventOptions({ passive: false })], EFFilmstrip.prototype, "scrollScrub", null);
+__decorate([property({ type: String })], EFFilmstrip.prototype, "target", void 0);
+__decorate([consume({
 	context: targetTimegroupContext,
 	subscribe: true
 }), state()], EFFilmstrip.prototype, "targetTimegroup", void 0);
-EFFilmstrip = _decorate([customElement("ef-filmstrip")], EFFilmstrip);
+EFFilmstrip = __decorate([customElement("ef-filmstrip")], EFFilmstrip);
 export { EFFilmstrip };

package/dist/gui/EFFitScale.js

@@ -1,8 +1,8 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { LitElement } from "lit";
 import { customElement, state } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { createRef } from "lit/directives/ref.js";
-let EFFitScale = class EFFitScale$1 extends LitElement {
+var EFFitScale = class EFFitScale$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.containerRef = createRef();
@@ -91,9 +91,8 @@ let EFFitScale = class EFFitScale$1 extends LitElement {
 		const contentHeight = this.contentChild.clientHeight;
 		const containerRatio = containerWidth / containerHeight;
 		const contentRatio = contentWidth / contentHeight;
-		const scale = containerRatio > contentRatio ? containerHeight / contentHeight : containerWidth / contentWidth;
 		return {
-			scale,
+			scale: containerRatio > contentRatio ? containerHeight / contentHeight : containerWidth / contentWidth,
 			containerWidth,
 			containerHeight,
 			contentWidth,
@@ -110,6 +109,6 @@ let EFFitScale = class EFFitScale$1 extends LitElement {
 		if (this.animationFrameId) cancelAnimationFrame(this.animationFrameId);
 	}
 };
-_decorate([state()], EFFitScale.prototype, "scale", void 0);
-EFFitScale = _decorate([customElement("ef-fit-scale")], EFFitScale);
+__decorate([state()], EFFitScale.prototype, "scale", void 0);
+EFFitScale = __decorate([customElement("ef-fit-scale")], EFFitScale);
 export { EFFitScale };

package/dist/gui/EFFocusOverlay.js

@@ -1,10 +1,10 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { focusedElementContext } from "./focusedElementContext.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { createRef, ref } from "lit/directives/ref.js";
-let EFFocusOverlay = class EFFocusOverlay$1 extends LitElement {
+var EFFocusOverlay = class EFFocusOverlay$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.overlay = createRef();
@@ -58,9 +58,9 @@ let EFFocusOverlay = class EFFocusOverlay$1 extends LitElement {
 		this.drawOverlay();
 	}
 };
-_decorate([consume({
+__decorate([consume({
 	context: focusedElementContext,
 	subscribe: true
 })], EFFocusOverlay.prototype, "focusedElement", void 0);
-EFFocusOverlay = _decorate([customElement("ef-focus-overlay")], EFFocusOverlay);
+EFFocusOverlay = __decorate([customElement("ef-focus-overlay")], EFFocusOverlay);
 export { EFFocusOverlay };

package/dist/gui/EFPreview.js

@@ -1,3 +1,4 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { focusedElementContext } from "./focusedElementContext.js";
 import { ContextMixin } from "./ContextMixin.js";
 import { EFTargetable } from "../elements/TargetController.js";
@@ -5,8 +6,7 @@ import { TWMixin } from "./TWMixin2.js";
 import { provide } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
-let EFPreview = class EFPreview$1 extends EFTargetable(ContextMixin(TWMixin(LitElement))) {
+var EFPreview = class EFPreview$1 extends EFTargetable(ContextMixin(TWMixin(LitElement))) {
 	static {
 		this.styles = [css`
       :host {
@@ -33,6 +33,6 @@ let EFPreview = class EFPreview$1 extends EFTargetable(ContextMixin(TWMixin(LitE
 		return html`<slot></slot>`;
 	}
 };
-_decorate([provide({ context: focusedElementContext })], EFPreview.prototype, "focusedElement", void 0);
-EFPreview = _decorate([customElement("ef-preview")], EFPreview);
+__decorate([provide({ context: focusedElementContext })], EFPreview.prototype, "focusedElement", void 0);
+EFPreview = __decorate([customElement("ef-preview")], EFPreview);
 export { EFPreview };

package/dist/gui/EFScrubber.js

@@ -1,13 +1,13 @@
 import { currentTimeContext } from "./currentTimeContext.js";
 import { durationContext } from "./durationContext.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { efContext } from "./efContext.js";
 import { playingContext } from "./playingContext.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement, state } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { ref } from "lit/directives/ref.js";
-let EFScrubber = class EFScrubber$1 extends LitElement {
+var EFScrubber = class EFScrubber$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.playing = false;
@@ -109,23 +109,23 @@ let EFScrubber = class EFScrubber$1 extends LitElement {
 		window.removeEventListener("pointermove", this.boundHandlePointerMove);
 	}
 };
-_decorate([consume({
+__decorate([consume({
 	context: efContext,
 	subscribe: true
 })], EFScrubber.prototype, "context", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: playingContext,
 	subscribe: true
 })], EFScrubber.prototype, "playing", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: currentTimeContext,
 	subscribe: true
 })], EFScrubber.prototype, "currentTimeMs", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: durationContext,
 	subscribe: true
 })], EFScrubber.prototype, "durationMs", void 0);
-_decorate([state()], EFScrubber.prototype, "scrubProgress", void 0);
-_decorate([state()], EFScrubber.prototype, "isMoving", void 0);
-EFScrubber = _decorate([customElement("ef-scrubber")], EFScrubber);
+__decorate([state()], EFScrubber.prototype, "scrubProgress", void 0);
+__decorate([state()], EFScrubber.prototype, "isMoving", void 0);
+EFScrubber = __decorate([customElement("ef-scrubber")], EFScrubber);
 export { EFScrubber };

package/dist/gui/EFTimeDisplay.js

@@ -1,10 +1,10 @@
 import { currentTimeContext } from "./currentTimeContext.js";
 import { durationContext } from "./durationContext.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
-let EFTimeDisplay = class EFTimeDisplay$1 extends LitElement {
+var EFTimeDisplay = class EFTimeDisplay$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.currentTimeMs = NaN;
@@ -38,13 +38,13 @@ let EFTimeDisplay = class EFTimeDisplay$1 extends LitElement {
     `;
 	}
 };
-_decorate([consume({
+__decorate([consume({
 	context: currentTimeContext,
 	subscribe: true
 })], EFTimeDisplay.prototype, "currentTimeMs", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: durationContext,
 	subscribe: true
 })], EFTimeDisplay.prototype, "durationMs", void 0);
-EFTimeDisplay = _decorate([customElement("ef-time-display")], EFTimeDisplay);
+EFTimeDisplay = __decorate([customElement("ef-time-display")], EFTimeDisplay);
 export { EFTimeDisplay };

package/dist/gui/EFToggleLoop.js

@@ -1,9 +1,9 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { efContext } from "./efContext.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
-let EFToggleLoop = class EFToggleLoop$1 extends LitElement {
+var EFToggleLoop = class EFToggleLoop$1 extends LitElement {
 	static {
 		this.styles = [css`
       :host {}
@@ -17,6 +17,6 @@ let EFToggleLoop = class EFToggleLoop$1 extends LitElement {
     `;
 	}
 };
-_decorate([consume({ context: efContext })], EFToggleLoop.prototype, "context", void 0);
-EFToggleLoop = _decorate([customElement("ef-toggle-loop")], EFToggleLoop);
+__decorate([consume({ context: efContext })], EFToggleLoop.prototype, "context", void 0);
+EFToggleLoop = __decorate([customElement("ef-toggle-loop")], EFToggleLoop);
 export { EFToggleLoop };

package/dist/gui/EFTogglePlay.js

@@ -1,10 +1,10 @@
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.93.0/helpers/decorate.js";
 import { efContext } from "./efContext.js";
 import { playingContext } from "./playingContext.js";
 import { consume } from "@lit/context";
 import { LitElement, css, html } from "lit";
 import { customElement } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
-let EFTogglePlay = class EFTogglePlay$1 extends LitElement {
+var EFTogglePlay = class EFTogglePlay$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.playing = false;
@@ -34,13 +34,13 @@ let EFTogglePlay = class EFTogglePlay$1 extends LitElement {
 		else this.context.play();
 	}
 };
-_decorate([consume({
+__decorate([consume({
 	context: efContext,
 	subscribe: true
 })], EFTogglePlay.prototype, "context", void 0);
-_decorate([consume({
+__decorate([consume({
 	context: playingContext,
 	subscribe: true
 })], EFTogglePlay.prototype, "playing", void 0);
-EFTogglePlay = _decorate([customElement("ef-toggle-play")], EFTogglePlay);
+EFTogglePlay = __decorate([customElement("ef-toggle-play")], EFTogglePlay);
 export { EFTogglePlay };