feat(theatre): change sheet to a Directive

nartc · nartc · commit 99625b167d67 · 2025-03-16T21:17:42.000-05:00
diff --git a/libs/theatre/src/lib/sequence.ts b/libs/theatre/src/lib/sequence.ts
@@ -34,7 +34,7 @@ const defaultOptions: TheatreSequenceOptions = {
 	delay: 0,
 };
 
-@Directive({ selector: 'theatre-sheet[sequence]', exportAs: 'sequence' })
+@Directive({ selector: '[sheet][sequence]', exportAs: 'sequence' })
 export class TheatreSequence {
 	options = input(defaultOptions, { alias: 'sequence', transform: mergeInputs(defaultOptions) });
 	audioOptions = input<AttachAudioOptions | undefined>(undefined, { alias: 'sequenceAudio' });
diff --git a/libs/theatre/src/lib/sheet.ts b/libs/theatre/src/lib/sheet.ts
@@ -1,15 +1,15 @@
-import { ChangeDetectionStrategy, Component, computed, DestroyRef, inject, input } from '@angular/core';
+import { computed, DestroyRef, Directive, inject, input } from '@angular/core';
 import { TheatreProject } from './project';
 
-@Component({
-	selector: 'theatre-sheet',
-	template: `
-		<ng-content />
-	`,
-	changeDetection: ChangeDetectionStrategy.OnPush,
-})
+@Directive({ selector: '[sheet]', exportAs: 'sheet' })
 export class TheatreSheet {
-	name = input('default-theatre-sheet');
+	name = input('default-theatre-sheet', {
+		transform: (value: string) => {
+			if (value === '') return 'default-theatre-sheet';
+			return value;
+		},
+		alias: 'sheet',
+	});
 
 	private project = inject(TheatreProject);
 
