@mhmo91/schmancy 0.10.4 → 0.10.5

package/dist/{mailbox-DsPII8HR.js → mailbox-DD2How0H.js}

@@ -1,16 +1,14 @@
-import { s as e } from "./mixins-CcIWET41.js";
+import { s as e } from "./mixins-B34UxxCe.js";
 import { t } from "./decorate-23nYs4Le.js";
-import { t as n } from "./dialog-service-DI9PPy4H.js";
-import { n as r } from "./sheet.service-SPQ8oLCi.js";
-import "./dialog.js";
-import { r as i } from "./notification-CVLqQ8c_.js";
-import { fromEvent as a, takeUntil as o } from "rxjs";
-import { customElement as s, property as c, state as l } from "lit/decorators.js";
-import { css as u, html as d } from "lit";
-import { createRef as f, ref as p } from "lit/directives/ref.js";
-import { repeat as m } from "lit/directives/repeat.js";
-import { when as h } from "lit/directives/when.js";
-var g = class extends e {
+import { o as n } from "./overlay.service-BUCuZa6V.js";
+import { r } from "./notification-DB25M-qo.js";
+import { fromEvent as i, takeUntil as a } from "rxjs";
+import { customElement as o, property as s, state as c } from "lit/decorators.js";
+import { css as l, html as u } from "lit";
+import { createRef as d, ref as f } from "lit/directives/ref.js";
+import { repeat as p } from "lit/directives/repeat.js";
+import { when as m } from "lit/directives/when.js";
+var h = class extends e {
 	constructor(...e) {
 		super(...e), this.config = {}, this.templates = [], this.importSources = [], this.disabled = !1, this.recipientsTitle = "Recipients", this.recipientsEmptyTitle = "No recipients yet", this.recipientsEmptyMessage = "Import from sources or upload a CSV", this.enableCsvImport = !0, this.enableDragDrop = !0, this.recipients = [], this.selectedRecipients = [], this.subject = "", this.body = "", this.templateId = null, this.attachments = [], this.isSending = !1, this.handleEmailsImported = (e) => {
 			let { emails: t } = e.detail, n = [...new Set([...this.recipients, ...t])], r = t.filter((e) => !this.recipients.includes(e));
@@ -96,7 +94,7 @@ var g = class extends e {
 		};
 	}
 	static {
-		this.styles = [u`
+		this.styles = [l`
 	:host {
 		display: block;
 		height: 100%;
@@ -130,7 +128,7 @@ var g = class extends e {
 	}
 	render() {
 		let e = this.selectedRecipients.length > 0 && this.subject.trim() && this.body.trim() && !this.isSending && !this.disabled;
-		return d`
+		return u`
 			<!-- Main Layout Container -->
 			<div class="flex flex-col h-full gap-6 p-6">
 				
@@ -177,7 +175,7 @@ var g = class extends e {
 								<schmancy-typography type="body" token="sm" class="font-medium">
 									${this.selectedRecipients.length} recipient${this.selectedRecipients.length === 1 ? "" : "s"} selected
 								</schmancy-typography>
-								${h(this.attachments.length > 0, () => d`
+								${m(this.attachments.length > 0, () => u`
 									<schmancy-typography type="body" token="xs">
 										${this.attachments.length} attachment${this.attachments.length === 1 ? "" : "s"}
 									</schmancy-typography>
@@ -219,8 +217,8 @@ var g = class extends e {
 		`;
 	}
 };
-t([c({ type: Object })], g.prototype, "config", void 0), t([c({ type: Array })], g.prototype, "templates", void 0), t([c({ type: Array })], g.prototype, "importSources", void 0), t([c({ type: Boolean })], g.prototype, "disabled", void 0), t([c({ type: String })], g.prototype, "recipientsTitle", void 0), t([c({ type: String })], g.prototype, "recipientsEmptyTitle", void 0), t([c({ type: String })], g.prototype, "recipientsEmptyMessage", void 0), t([c({ type: Boolean })], g.prototype, "enableCsvImport", void 0), t([c({ type: Boolean })], g.prototype, "enableDragDrop", void 0), t([l()], g.prototype, "recipients", void 0), t([l()], g.prototype, "selectedRecipients", void 0), t([l()], g.prototype, "subject", void 0), t([l()], g.prototype, "body", void 0), t([l()], g.prototype, "templateId", void 0), t([l()], g.prototype, "attachments", void 0), t([l()], g.prototype, "isSending", void 0), g = t([s("schmancy-mailbox")], g);
-var _ = class extends e {
+t([s({ type: Object })], h.prototype, "config", void 0), t([s({ type: Array })], h.prototype, "templates", void 0), t([s({ type: Array })], h.prototype, "importSources", void 0), t([s({ type: Boolean })], h.prototype, "disabled", void 0), t([s({ type: String })], h.prototype, "recipientsTitle", void 0), t([s({ type: String })], h.prototype, "recipientsEmptyTitle", void 0), t([s({ type: String })], h.prototype, "recipientsEmptyMessage", void 0), t([s({ type: Boolean })], h.prototype, "enableCsvImport", void 0), t([s({ type: Boolean })], h.prototype, "enableDragDrop", void 0), t([c()], h.prototype, "recipients", void 0), t([c()], h.prototype, "selectedRecipients", void 0), t([c()], h.prototype, "subject", void 0), t([c()], h.prototype, "body", void 0), t([c()], h.prototype, "templateId", void 0), t([c()], h.prototype, "attachments", void 0), t([c()], h.prototype, "isSending", void 0), h = t([o("schmancy-mailbox")], h);
+var g = class extends e {
 	constructor(...e) {
 		super(...e), this.layouts = [
 			{
@@ -259,9 +257,9 @@ var _ = class extends e {
 		}));
 	}
 	render() {
-		return d`
+		return u`
 			<div class="grid p-3 gap-2">
-				${this.layouts.map((e) => d`
+				${this.layouts.map((e) => u`
 					<schmancy-button 
 						variant="outlined"
 						@click=${() => this.selectLayout(e.id)}
@@ -280,8 +278,8 @@ var _ = class extends e {
 		`;
 	}
 };
-_ = t([s("schmancy-email-layout-selector")], _);
-var v = class extends e {
+g = t([o("schmancy-email-layout-selector")], g);
+var _ = class extends e {
 	constructor(...e) {
 		super(...e), this.templates = [], this.searchQuery = "", this.filteredTemplates = [], this.selectedCategory = "all", this.handleSearch = (e) => {
 			let t = e.target;
@@ -293,13 +291,20 @@ var v = class extends e {
 				detail: e,
 				bubbles: !0,
 				composed: !0
-			})), r.dismiss();
+			})), this.dispatchEvent(new CustomEvent("close", {
+				detail: e,
+				bubbles: !0,
+				composed: !0
+			}));
 		}, this.close = () => {
-			r.dismiss();
+			this.dispatchEvent(new CustomEvent("close", {
+				bubbles: !0,
+				composed: !0
+			}));
 		};
 	}
 	static {
-		this.styles = [u`
+		this.styles = [l`
 	:host {
 		display: block;
 	}
@@ -326,7 +331,7 @@ var v = class extends e {
 		this.filteredTemplates = e;
 	}
 	render() {
-		return d`
+		return u`
 			<div class="flex flex-col h-full overflow-hidden">
 				<!-- Header -->
 				<div class="flex items-center justify-between px-6 py-4 border-b border-outline-variant">
@@ -353,7 +358,7 @@ var v = class extends e {
 		`;
 	}
 	renderTemplateList() {
-		return d`
+		return u`
 			<!-- Search and Filter Bar -->
 			<div class="px-6 py-4 border-b border-outline-variant bg-surface-containerLow">
 				<div class="flex flex-col gap-4">
@@ -366,7 +371,7 @@ var v = class extends e {
 						class="w-full"
 					>
 						<schmancy-icon slot="prefix" size="20px" class="text-surface-onVariant">search</schmancy-icon>
-						${h(this.searchQuery, () => d`
+						${m(this.searchQuery, () => u`
 							<schmancy-button
 								slot="suffix"
 								variant="text"
@@ -381,9 +386,9 @@ var v = class extends e {
 					</schmancy-input>
 
 					<!-- Category Filter -->
-					${h(this.categories.length > 1, () => d`
+					${m(this.categories.length > 1, () => u`
 						<div class="flex gap-2 flex-wrap">
-							${m(this.categories, (e) => e, (e) => d`
+							${p(this.categories, (e) => e, (e) => u`
 									<schmancy-chip
 										class="cursor-pointer transition-all hover:shadow-sm ${this.selectedCategory === e ? "bg-primary text-primary-on" : "border border-outline"}"
 										@click=${() => this.handleCategorySelect(e)}
@@ -398,9 +403,9 @@ var v = class extends e {
 
 			<!-- Template List with Previews -->
 			<div class="flex-1 overflow-y-auto px-6 py-6">
-				${h(this.filteredTemplates.length > 0, () => d`
+				${m(this.filteredTemplates.length > 0, () => u`
 						<div class="space-y-6">
-							${m(this.filteredTemplates, (e) => e.id, (e) => d`
+							${p(this.filteredTemplates, (e) => e.id, (e) => u`
 									<schmancy-surface
 										type="subtle"
 										elevation="1"
@@ -415,7 +420,7 @@ var v = class extends e {
 													<schmancy-typography type="title" token="md" class="font-semibold leading-tight mb-1">
 														${e.name}
 													</schmancy-typography>
-													${h(e.category, () => d`
+													${m(e.category, () => u`
 														<schmancy-chip class="text-xs border border-outline">
 															${e.category}
 														</schmancy-chip>
@@ -442,7 +447,7 @@ var v = class extends e {
 									</schmancy-surface>
 								`)}
 						</div>
-					`, () => d`
+					`, () => u`
 						<div class="flex flex-col items-center justify-center h-96 text-center">
 							<div class="mb-6">
 								<schmancy-icon size="64px" class="text-surface-onVariant opacity-20">mail_outline</schmancy-icon>
@@ -453,9 +458,9 @@ var v = class extends e {
 							<schmancy-typography type="body" token="md" class="text-surface-onVariant mb-6 max-w-md">
 								${this.searchQuery ? `No templates match your search for "${this.searchQuery}"` : this.selectedCategory === "all" ? "Start by creating your first email template" : `No templates found in the "${this.selectedCategory}" category`}
 							</schmancy-typography>
-							${h(this.searchQuery || this.selectedCategory !== "all", () => d`
+							${m(this.searchQuery || this.selectedCategory !== "all", () => u`
 								<div class="flex gap-3">
-									${h(this.searchQuery, () => d`
+									${m(this.searchQuery, () => u`
 										<schmancy-button
 											variant="outlined"
 											@click=${() => {
@@ -466,7 +471,7 @@ var v = class extends e {
 											Clear Search
 										</schmancy-button>
 									`)}
-									${h(this.selectedCategory !== "all", () => d`
+									${m(this.selectedCategory !== "all", () => u`
 										<schmancy-button
 											variant="filled"
 											@click=${() => this.handleCategorySelect("all")}
@@ -483,10 +488,10 @@ var v = class extends e {
 		`;
 	}
 };
-t([c({ type: Array })], v.prototype, "templates", void 0), t([l()], v.prototype, "searchQuery", void 0), t([l()], v.prototype, "filteredTemplates", void 0), t([l()], v.prototype, "selectedCategory", void 0), v = t([s("schmancy-email-template-picker")], v);
-var y = class extends e {
+t([s({ type: Array })], _.prototype, "templates", void 0), t([c()], _.prototype, "searchQuery", void 0), t([c()], _.prototype, "filteredTemplates", void 0), t([c()], _.prototype, "selectedCategory", void 0), _ = t([o("schmancy-email-template-picker")], _);
+var v = class extends e {
 	constructor(...e) {
-		super(...e), this.subject = "", this.body = "", this.disabled = !1, this.attachments = [], this.config = {}, this.templates = this.getDefaultTemplates(), this.dragOver = !1, this.isUploading = !1, this.subjectInputRef = f(), this.bodyTextAreaRef = f(), this.fileInputRef = f(), this.imageInputRef = f(), this.handleKeyDown = (e) => {
+		super(...e), this.subject = "", this.body = "", this.disabled = !1, this.attachments = [], this.config = {}, this.templates = this.getDefaultTemplates(), this.dragOver = !1, this.isUploading = !1, this.subjectInputRef = d(), this.bodyTextAreaRef = d(), this.fileInputRef = d(), this.imageInputRef = d(), this.handleKeyDown = (e) => {
 			if (this.disabled) return;
 			let t = this.bodyTextAreaRef.value?.shadowRoot?.querySelector("textarea");
 			e.key === "Tab" && e.target === t && (e.preventDefault(), this.insertAtCursor("  "));
@@ -519,19 +524,25 @@ var y = class extends e {
 				composed: !0
 			}));
 		}, this.openLayoutDialog = () => {
-			n.component(d`
+			n(u`
 			<schmancy-email-layout-selector
 				@layout-select=${(e) => {
-				this.applyLayout(e.detail.layout), n.close();
+				e.currentTarget?.dispatchEvent(new CustomEvent("close", {
+					detail: e.detail.layout,
+					bubbles: !0,
+					composed: !0
+				}));
 			}}
 			></schmancy-email-layout-selector>
-		`);
+		`).pipe(a(this.disconnecting)).subscribe((e) => {
+				e && this.applyLayout(e);
+			});
 		}, this.openTemplatePicker = () => {
-			let e = new v();
-			e.templates = this.templates, a(e, "template-selected").pipe(o(this.disconnecting)).subscribe(this.handleTemplateSelected), r.open({ component: e });
+			n(_, { props: { templates: this.templates } }).pipe(a(this.disconnecting)).subscribe((e) => {
+				e && this.handleTemplateSelected(e);
+			});
 		}, this.handleTemplateSelected = (e) => {
-			let t = e.detail;
-			this.subject = t.subject, this.body = t.body, this.dispatchChange(), i.success(`Template "${t.name}" applied successfully`);
+			this.subject = e.subject, this.body = e.body, this.dispatchChange(), r.success(`Template "${e.name}" applied successfully`);
 		}, this.applyLayout = (e) => {
 			let t = {
 				"columns-2": "\n:::layout columns-2\n<div class=\"column\">\n![Left Photo](https://via.placeholder.com/400x300?text=Replace+with+your+photo){height=300px}\n\n**Photo Title**\n\nReplace the placeholder image above with your own photo. The height=300px ensures both images have equal height while width adjusts automatically.\n</div>\n\n<div class=\"column\">\n![Right Photo](https://via.placeholder.com/400x300?text=Replace+with+your+photo){height=300px}\n\n**Photo Title**\n\nUse the same height value (300px) for both images to keep them aligned perfectly side by side.\n</div>\n:::\n",
@@ -542,21 +553,21 @@ var y = class extends e {
 			}[e];
 			t && this.insertAtCursor(t);
 		}, this.uploadImage = async (e) => {
-			if (e.type.startsWith("image/")) if (e.size > 10485760) i.error(`Image "${e.name}" is too large. Maximum size is 10MB.`);
+			if (e.type.startsWith("image/")) if (e.size > 10485760) r.error(`Image "${e.name}" is too large. Maximum size is 10MB.`);
 			else {
 				this.isUploading = !0;
 				try {
 					let t;
-					this.config.imageUploadHandler ? t = await this.config.imageUploadHandler(e) : this.config.uploadHandler ? t = await this.config.uploadHandler(e) : (t = await this.createDataUrl(e), i.warning("No upload handler configured. Using local preview."));
+					this.config.imageUploadHandler ? t = await this.config.imageUploadHandler(e) : this.config.uploadHandler ? t = await this.config.uploadHandler(e) : (t = await this.createDataUrl(e), r.warning("No upload handler configured. Using local preview."));
 					let n = await this.getImageDimensions(e);
-					this.insertImageMarkdown(t, e.name, n.width, n.height), i.success("Image uploaded successfully");
+					this.insertImageMarkdown(t, e.name, n.width, n.height), r.success("Image uploaded successfully");
 				} catch {
-					i.error("Failed to upload image");
+					r.error("Failed to upload image");
 				} finally {
 					this.isUploading = !1;
 				}
 			}
-			else i.error(`File "${e.name}" is not an image`);
+			else r.error(`File "${e.name}" is not an image`);
 		}, this.createDataUrl = (e) => new Promise((t, n) => {
 			let r = new FileReader();
 			r.addEventListener("load", () => t(r.result), { once: !0 }), r.addEventListener("error", () => n(r.error), { once: !0 }), r.readAsDataURL(e);
@@ -612,8 +623,8 @@ var y = class extends e {
 		}, this.handleDragLeave = (e) => {
 			e.preventDefault();
 		}, this.addFile = (e) => {
-			if (e.size > 10485760) return void i.error(`File "${e.name}" is too large. Maximum size is 10MB.`);
-			if (this.attachments.some((t) => t.name === e.name && t.size === e.size)) return void i.warning(`File "${e.name}" is already attached.`);
+			if (e.size > 10485760) return void r.error(`File "${e.name}" is too large. Maximum size is 10MB.`);
+			if (this.attachments.some((t) => t.name === e.name && t.size === e.size)) return void r.warning(`File "${e.name}" is already attached.`);
 			let t = {
 				id: crypto.randomUUID(),
 				file: e,
@@ -627,7 +638,7 @@ var y = class extends e {
 		};
 	}
 	static {
-		this.styles = [u`
+		this.styles = [l`
 	:host {
 		display: block;
 		height: 100%;
@@ -709,7 +720,7 @@ var y = class extends e {
 		];
 	}
 	addEventListeners() {
-		a(this, "keydown").pipe(o(this.disconnecting)).subscribe(this.handleKeyDown), a(document, "paste").pipe(o(this.disconnecting)).subscribe(this.handlePaste), a(document, "dragenter").pipe(o(this.disconnecting)).subscribe(this.handleDragEnter), a(document, "dragleave").pipe(o(this.disconnecting)).subscribe(this.handleDocumentDragLeave), a(document, "drop").pipe(o(this.disconnecting)).subscribe(this.handleDocumentDrop);
+		i(this, "keydown").pipe(a(this.disconnecting)).subscribe(this.handleKeyDown), i(document, "paste").pipe(a(this.disconnecting)).subscribe(this.handlePaste), i(document, "dragenter").pipe(a(this.disconnecting)).subscribe(this.handleDragEnter), i(document, "dragleave").pipe(a(this.disconnecting)).subscribe(this.handleDocumentDragLeave), i(document, "drop").pipe(a(this.disconnecting)).subscribe(this.handleDocumentDrop);
 	}
 	insertAtCursor(e, t) {
 		if (!this.bodyTextAreaRef.value) return;
@@ -735,7 +746,7 @@ var y = class extends e {
 		});
 	}
 	render() {
-		return d`
+		return u`
 			<schmancy-surface 
 				type="solid"
 				rounded="all"
@@ -757,7 +768,7 @@ var y = class extends e {
 								Subject *
 							</schmancy-typography>
 							<schmancy-input
-								${p(this.subjectInputRef)}
+								${f(this.subjectInputRef)}
 								.value=${this.subject}
 								@input=${this.handleSubjectChange}
 								placeholder="Enter email subject..."
@@ -839,7 +850,7 @@ var y = class extends e {
 										?disabled=${this.disabled || this.isUploading}
 										@click=${() => this.imageInputRef.value?.click()}
 									>
-										${h(this.isUploading, () => d`<schmancy-progress size="sm" class="w-4 h-4"></schmancy-progress>`, () => d`<schmancy-icon>image</schmancy-icon>`)}
+										${m(this.isUploading, () => u`<schmancy-progress size="sm" class="w-4 h-4"></schmancy-progress>`, () => u`<schmancy-icon>image</schmancy-icon>`)}
 									</schmancy-icon-button>
 									<schmancy-icon-button 
 										size="sm" 
@@ -867,7 +878,7 @@ var y = class extends e {
 					<!-- Textarea Container - Takes remaining space -->
 					<div class="flex-1 px-4 relative min-h-0">
 						<schmancy-textarea
-							${p(this.bodyTextAreaRef)}
+							${f(this.bodyTextAreaRef)}
 							.value=${this.body}
 							@change=${this.handleBodyChange}
 							placeholder="Enter your email message here...
@@ -884,7 +895,7 @@ Tab key inserts 2 spaces for better formatting."
 						></schmancy-textarea>
 						
 						<!-- Upload Progress Overlay -->
-						${h(this.isUploading, () => d`
+						${m(this.isUploading, () => u`
 							<div class="absolute top-3 right-3 z-10">
 								<schmancy-surface type="subtle" rounded="all" class="p-2">
 									<div class="flex items-center gap-2">
@@ -906,14 +917,14 @@ Tab key inserts 2 spaces for better formatting."
 						</div>
 
 						<!-- Attachments Display (if any) -->
-						${h(this.attachments.length > 0, () => d`
+						${m(this.attachments.length > 0, () => u`
 							<div class="space-y-2">
 								<schmancy-typography type="label" token="sm" class="flex items-center gap-2">
 									<schmancy-icon size="16px">attach_file</schmancy-icon>
 									Attachments (${this.attachments.length})
 								</schmancy-typography>
 								<div class="flex flex-wrap gap-2">
-									${m(this.attachments, (e) => e.id, (e) => d`
+									${p(this.attachments, (e) => e.id, (e) => u`
 										<schmancy-chip class="text-xs">
 											<span class="truncate max-w-32">${e.name}</span>
 											<button 
@@ -933,13 +944,13 @@ Tab key inserts 2 spaces for better formatting."
 					<!-- Hidden File Inputs -->
 					<div class="hidden">
 						<input
-							${p(this.fileInputRef)}
+							${f(this.fileInputRef)}
 							type="file"
 							multiple
 							@change=${this.handleFileChange}
 						>
 						<input
-							${p(this.imageInputRef)}
+							${f(this.imageInputRef)}
 							type="file"
 							accept="image/*"
 							@change=${this.handleImageSelect}
@@ -952,13 +963,13 @@ Tab key inserts 2 spaces for better formatting."
 		`;
 	}
 };
-t([c({ type: String })], y.prototype, "subject", void 0), t([c({ type: String })], y.prototype, "body", void 0), t([c({ type: Boolean })], y.prototype, "disabled", void 0), t([c({ type: Array })], y.prototype, "attachments", void 0), t([c({ type: Object })], y.prototype, "config", void 0), t([c({ type: Array })], y.prototype, "templates", void 0), t([l()], y.prototype, "dragOver", void 0), t([l()], y.prototype, "isUploading", void 0), y = t([s("schmancy-email-editor")], y);
-var b = class extends e {
+t([s({ type: String })], v.prototype, "subject", void 0), t([s({ type: String })], v.prototype, "body", void 0), t([s({ type: Boolean })], v.prototype, "disabled", void 0), t([s({ type: Array })], v.prototype, "attachments", void 0), t([s({ type: Object })], v.prototype, "config", void 0), t([s({ type: Array })], v.prototype, "templates", void 0), t([c()], v.prototype, "dragOver", void 0), t([c()], v.prototype, "isUploading", void 0), v = t([o("schmancy-email-editor")], v);
+var y = class extends e {
 	constructor(...e) {
 		super(...e), this.subject = "", this.body = "", this.attachments = [], this.recipients = [], this.fromAddress = "sender@example.com", this.toAddress = "recipient@example.com", this.viewMode = "html";
 	}
 	static {
-		this.styles = [u`
+		this.styles = [l`
 	:host {
 		display: block;
 	}
@@ -1057,7 +1068,7 @@ var b = class extends e {
 	}
 	render() {
 		let e = this.parseExtendedMarkdown(this.body), t = this.convertToPlainText(this.body), n = this.recipients[0] || this.toAddress;
-		return d`
+		return u`
 			<schmancy-surface type="solid" rounded="all" class="h-full flex flex-col">
 				
 				<!-- Header Section -->
@@ -1144,7 +1155,7 @@ var b = class extends e {
 											</schmancy-typography>
 										</div>
 										<schmancy-typography type="body" token="sm" class="font-medium flex-1">
-											${this.subject || d`<span class="italic text-surface-onVariant">(No subject)</span>`}
+											${this.subject || u`<span class="italic text-surface-onVariant">(No subject)</span>`}
 										</schmancy-typography>
 									</div>
 								</div>
@@ -1152,17 +1163,17 @@ var b = class extends e {
 
 							<!-- Email Body Content -->
 							<div class="flex-1 overflow-y-auto min-h-0">
-								${h(this.body, () => d`
-										${h(this.viewMode === "html", () => d`
+								${m(this.body, () => u`
+										${m(this.viewMode === "html", () => u`
 												<div class="p-6 bg-white" style="color: #333; line-height: 1.6; font-family: system-ui, -apple-system, sans-serif; font-size: 14px;">
 													<div .innerHTML=${e}></div>
 												</div>
-											`, () => d`
+											`, () => u`
 												<div class="p-6 bg-white" style="color: #333; line-height: 1.6; font-family: 'Courier New', monospace; font-size: 13px; white-space: pre-wrap;">
 													${t}
 												</div>
 											`)}
-									`, () => d`
+									`, () => u`
 										<!-- Empty State -->
 										<div class="flex-1 flex items-center justify-center p-8">
 											<div class="text-center space-y-3">
@@ -1179,7 +1190,7 @@ var b = class extends e {
 							</div>
 
 							<!-- Attachments Section -->
-							${h(this.attachments.length > 0, () => d`
+							${m(this.attachments.length > 0, () => u`
 								<div class="shrink-0 p-4 border-t border-outline-variant bg-surface-containerLowest">
 									<div class="space-y-3">
 										<!-- Attachments Header -->
@@ -1192,7 +1203,7 @@ var b = class extends e {
 										
 										<!-- Attachments List -->
 										<div class="grid gap-2 sm:grid-cols-2 lg:grid-cols-1 xl:grid-cols-2">
-											${m(this.attachments, (e) => e.id, (e) => d`
+											${p(this.attachments, (e) => e.id, (e) => u`
 												<schmancy-surface type="subtle" rounded="all" class="p-3">
 													<div class="flex items-center gap-3">
 														<!-- File Icon -->
@@ -1220,7 +1231,7 @@ var b = class extends e {
 					</div>
 					
 					<!-- Preview Stats -->
-					${h(this.body, () => d`
+					${m(this.body, () => u`
 						<div class="shrink-0">
 							<schmancy-surface type="subtle" rounded="all" class="p-3">
 								<div class="flex items-center justify-center gap-6 text-center">
@@ -1241,7 +1252,7 @@ var b = class extends e {
 											${this.body.trim() ? this.body.trim().split(/\s+/).length : 0}
 										</schmancy-typography>
 									</div>
-									${h(this.attachments.length > 0, () => d`
+									${m(this.attachments.length > 0, () => u`
 										<div class="w-px h-8 bg-outline-variant"></div>
 										<div>
 											<schmancy-typography type="body" token="xs" class="text-surface-onVariant">
@@ -1262,10 +1273,10 @@ var b = class extends e {
 		`;
 	}
 };
-t([c({ type: String })], b.prototype, "subject", void 0), t([c({ type: String })], b.prototype, "body", void 0), t([c({ type: Array })], b.prototype, "attachments", void 0), t([c({ type: Array })], b.prototype, "recipients", void 0), t([c({ type: String })], b.prototype, "fromAddress", void 0), t([c({ type: String })], b.prototype, "toAddress", void 0), t([l()], b.prototype, "viewMode", void 0), b = t([s("schmancy-email-viewer")], b);
-var x = class extends e {
+t([s({ type: String })], y.prototype, "subject", void 0), t([s({ type: String })], y.prototype, "body", void 0), t([s({ type: Array })], y.prototype, "attachments", void 0), t([s({ type: Array })], y.prototype, "recipients", void 0), t([s({ type: String })], y.prototype, "fromAddress", void 0), t([s({ type: String })], y.prototype, "toAddress", void 0), t([c()], y.prototype, "viewMode", void 0), y = t([o("schmancy-email-viewer")], y);
+var b = class extends e {
 	constructor(...e) {
-		super(...e), this.disabled = !1, this.recipients = [], this.importSources = [], this.selectedRecipients = [], this.enableCsvImport = !0, this.enableDragDrop = !0, this.title = "Recipients", this.emptyStateTitle = "No recipients yet", this.emptyStateMessage = "Import from sources or upload a CSV", this.dragOver = !1, this.localSelectedRecipients = /* @__PURE__ */ new Set(), this.searchQuery = "", this.filteredRecipients = [], this.boatState = "collapsed", this.fileInputRef = f(), this.handleEmailsImported = () => {
+		super(...e), this.disabled = !1, this.recipients = [], this.importSources = [], this.selectedRecipients = [], this.enableCsvImport = !0, this.enableDragDrop = !0, this.title = "Recipients", this.emptyStateTitle = "No recipients yet", this.emptyStateMessage = "Import from sources or upload a CSV", this.dragOver = !1, this.localSelectedRecipients = /* @__PURE__ */ new Set(), this.searchQuery = "", this.filteredRecipients = [], this.boatState = "collapsed", this.fileInputRef = d(), this.handleEmailsImported = () => {
 			this.updateFilteredRecipients(), this.requestUpdate();
 		}, this.handleImportFromCSV = () => {
 			this.enableCsvImport && this.fileInputRef.value?.click();
@@ -1278,13 +1289,13 @@ var x = class extends e {
 			let t = e.dataTransfer?.files[0];
 			t && this.processCSVFile(t);
 		}, this.processCSVFile = (e) => {
-			if (!e.name.endsWith(".csv")) return void i.error("Please select a CSV file");
+			if (!e.name.endsWith(".csv")) return void r.error("Please select a CSV file");
 			let t = new FileReader();
 			t.addEventListener("load", (e) => {
 				let t = e.target?.result;
 				try {
 					let e = this.parseCSV(t);
-					if (e.length === 0) return void i.error("No valid email addresses found in CSV");
+					if (e.length === 0) return void r.error("No valid email addresses found in CSV");
 					this.dispatchEvent(new CustomEvent("emails-imported", {
 						detail: {
 							emails: e,
@@ -1292,9 +1303,9 @@ var x = class extends e {
 						},
 						bubbles: !0,
 						composed: !0
-					})), i.success(`Imported ${e.length} emails from CSV file`);
+					})), r.success(`Imported ${e.length} emails from CSV file`);
 				} catch {
-					i.error("Failed to parse CSV file");
+					r.error("Failed to parse CSV file");
 				}
 			}, { once: !0 }), t.readAsText(e);
 		}, this.toggleRecipientSelection = (e) => {
@@ -1336,7 +1347,7 @@ var x = class extends e {
 		};
 	}
 	static {
-		this.styles = [u`
+		this.styles = [l`
 	:host {
 		display: block;
 		height: 100%;
@@ -1344,7 +1355,7 @@ var x = class extends e {
 `];
 	}
 	connectedCallback() {
-		super.connectedCallback(), this.localSelectedRecipients = new Set(this.selectedRecipients), this.updateFilteredRecipients(), a(this, "emails-imported").pipe(o(this.disconnecting)).subscribe(this.handleEmailsImported);
+		super.connectedCallback(), this.localSelectedRecipients = new Set(this.selectedRecipients), this.updateFilteredRecipients(), i(this, "emails-imported").pipe(a(this.disconnecting)).subscribe(this.handleEmailsImported);
 	}
 	updated(e) {
 		super.updated(e), e.has("selectedRecipients") && (this.localSelectedRecipients = new Set(this.selectedRecipients)), (e.has("recipients") || e.has("searchQuery")) && this.updateFilteredRecipients(), e.has("recipients") && this.requestUpdate();
@@ -1418,13 +1429,13 @@ var x = class extends e {
 		return this.renderBoatLayout();
 	}
 	renderBoatLayout() {
-		return d`
+		return u`
 			<!-- Hidden file input for CSV import -->
-			${h(this.enableCsvImport, () => d`
+			${m(this.enableCsvImport, () => u`
 				<input
 					type="file"
 					accept=".csv"
-					${p(this.fileInputRef)}
+					${f(this.fileInputRef)}
 					@change=${this.handleFileSelect}
 					class="hidden"
 				/>
@@ -1441,7 +1452,7 @@ var x = class extends e {
 						<schmancy-typography type="title" token="md" class="font-semibold">
 							${this.title}
 						</schmancy-typography>
-						${h(this.recipients.length > 0, () => d`
+						${m(this.recipients.length > 0, () => u`
 							<schmancy-badge>
 								${this.localSelectedRecipients.size}/${this.recipients.length}
 							</schmancy-badge>
@@ -1457,7 +1468,7 @@ var x = class extends e {
 		`;
 	}
 	renderBoatContent() {
-		return d`
+		return u`
 			<!-- Search Bar and CSV Import on one line -->
 			<div class="p-4 flex gap-3">
 				<schmancy-input
@@ -1467,7 +1478,7 @@ var x = class extends e {
 					@input=${this.handleSearchInput}
 					class="flex-1"
 				>
-					${h(this.searchQuery, () => d`
+					${m(this.searchQuery, () => u`
 						<schmancy-button
 							slot="suffix" 
 							variant="text"
@@ -1478,7 +1489,7 @@ var x = class extends e {
 					`)}
 				</schmancy-input>
 				
-				${h(this.enableCsvImport, () => d`
+				${m(this.enableCsvImport, () => u`
 					<schmancy-button
 						variant="outlined"
 						@click=${this.handleImportFromCSV}
@@ -1490,7 +1501,7 @@ var x = class extends e {
 				`)}
 			</div>
 
-			${h(this.recipients.length > 0, () => d`
+			${m(this.recipients.length > 0, () => u`
 				<!-- Bulk Actions -->
 				<div class="px-4 pb-4">
 					<div class="flex items-center gap-3">
@@ -1523,9 +1534,9 @@ var x = class extends e {
 
 				<!-- Recipients List -->
 				<div class="flex-1 overflow-y-auto px-4 pb-4">
-					${h(this.filteredRecipients.length > 0, () => d`
+					${m(this.filteredRecipients.length > 0, () => u`
 							<div class="flex flex-wrap gap-3">
-								${m(this.filteredRecipients, (e) => e, (e) => d`
+								${p(this.filteredRecipients, (e) => e, (e) => u`
 										<schmancy-button
 											variant=${this.localSelectedRecipients.has(e) ? "filled" : "outlined"}
 											@click=${(t) => {
@@ -1544,7 +1555,7 @@ var x = class extends e {
 										</schmancy-button>
 									`)}
 							</div>
-						`, () => d`
+						`, () => u`
 							<div class="text-center py-8">
 								<schmancy-icon size="32px" class="opacity-50 mb-2">search_off</schmancy-icon>
 								<schmancy-typography type="body" token="sm" class="mb-2">
@@ -1556,7 +1567,7 @@ var x = class extends e {
 							</div>
 						`)}
 				</div>
-			`, () => d`
+			`, () => u`
 				<!-- Empty State -->
 				<div class="flex-1 flex items-center justify-center p-8">
 					<div class="text-center space-y-4">
@@ -1572,7 +1583,7 @@ var x = class extends e {
 			`)}
 
 			<!-- Drag Overlay -->
-			${h(this.dragOver && this.enableDragDrop, () => d`
+			${m(this.dragOver && this.enableDragDrop, () => u`
 					<div 
 						class="absolute inset-4 flex items-center justify-center border-2 border-dashed border-primary rounded-lg z-10"
 						@dragover=${(e) => {
@@ -1592,5 +1603,5 @@ var x = class extends e {
 		`;
 	}
 };
-t([c({ type: Boolean })], x.prototype, "disabled", void 0), t([c({ type: Array })], x.prototype, "recipients", void 0), t([c({ type: Array })], x.prototype, "importSources", void 0), t([c({ type: Array })], x.prototype, "selectedRecipients", void 0), t([c({ type: Boolean })], x.prototype, "enableCsvImport", void 0), t([c({ type: Boolean })], x.prototype, "enableDragDrop", void 0), t([c({ type: String })], x.prototype, "title", void 0), t([c({ type: String })], x.prototype, "emptyStateTitle", void 0), t([c({ type: String })], x.prototype, "emptyStateMessage", void 0), t([c({ type: Object })], x.prototype, "csvParser", void 0), t([l()], x.prototype, "dragOver", void 0), t([l()], x.prototype, "localSelectedRecipients", void 0), t([l()], x.prototype, "searchQuery", void 0), t([l()], x.prototype, "filteredRecipients", void 0), t([l()], x.prototype, "boatState", void 0), x = t([s("schmancy-email-recipients")], x);
-export { g as a, _ as i, b as n, y as r, x as t };
+t([s({ type: Boolean })], b.prototype, "disabled", void 0), t([s({ type: Array })], b.prototype, "recipients", void 0), t([s({ type: Array })], b.prototype, "importSources", void 0), t([s({ type: Array })], b.prototype, "selectedRecipients", void 0), t([s({ type: Boolean })], b.prototype, "enableCsvImport", void 0), t([s({ type: Boolean })], b.prototype, "enableDragDrop", void 0), t([s({ type: String })], b.prototype, "title", void 0), t([s({ type: String })], b.prototype, "emptyStateTitle", void 0), t([s({ type: String })], b.prototype, "emptyStateMessage", void 0), t([s({ type: Object })], b.prototype, "csvParser", void 0), t([c()], b.prototype, "dragOver", void 0), t([c()], b.prototype, "localSelectedRecipients", void 0), t([c()], b.prototype, "searchQuery", void 0), t([c()], b.prototype, "filteredRecipients", void 0), t([c()], b.prototype, "boatState", void 0), b = t([o("schmancy-email-recipients")], b);
+export { h as a, g as i, y as n, v as r, b as t };