@mhmo91/schmancy 0.4.68 → 0.4.70

package/types/src/mailbox/email-layout-selector.d.ts

@@ -0,0 +1,19 @@
+declare const SchmancyEmailLayoutSelector_base: import("@mixins/index").Constructor<CustomElementConstructor> & import("@mixins/index").Constructor<import("@mixins/index").ITailwindElementMixin> & import("@mixins/index").Constructor<import("lit").LitElement> & import("@mixins/index").Constructor<import("@mixins/index").IBaseMixin>;
+/**
+ * Email layout selector component for choosing email templates
+ *
+ * Simple horizontal row of 5 layout options using Schmancy components only.
+ *
+ * @fires layout-select - When a layout is selected with {detail: {layout: string}}
+ */
+export declare class SchmancyEmailLayoutSelector extends SchmancyEmailLayoutSelector_base {
+    private layouts;
+    private selectLayout;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-email-layout-selector': SchmancyEmailLayoutSelector;
+    }
+}
+export {};

package/types/src/mailbox/email-recipients.d.ts

@@ -0,0 +1,118 @@
+/**
+ * CSV parser interface (optional dependency)
+ * Can be provided via global window object or imported
+ */
+interface CSVParser {
+    parse(csvContent: string, config: any): {
+        data: any[];
+        meta: {
+            fields?: string[];
+        };
+    };
+}
+declare const SchmancyEmailRecipients_base: CustomElementConstructor & import("@mixins/index").Constructor<import("lit").LitElement> & import("@mixins/index").Constructor<import("@mixins/index").IBaseMixin>;
+/**
+ * Email recipients management component with floating boat interface
+ *
+ * Features:
+ * - Floating boat UI that can be minimized/expanded
+ * - CSV import with drag & drop
+ * - Multiple import sources (configurable)
+ * - Bulk selection and management
+ * - Search and filtering
+ * - Email validation
+ *
+ * @example
+ * ```html
+ * <schmancy-email-recipients
+ *   .recipients=${['user1@example.com', 'user2@example.com']}
+ *   @emails-imported=${handleEmailsImported}
+ * ></schmancy-email-recipients>
+ * ```
+ */
+export declare class SchmancyEmailRecipients extends SchmancyEmailRecipients_base {
+    /** Disable all interactions */
+    disabled: boolean;
+    /** All available recipients */
+    recipients: string[];
+    /** Currently selected recipients */
+    selectedRecipients: string[];
+    /** Enable CSV import functionality */
+    enableCsvImport: boolean;
+    /** Enable drag and drop for files */
+    enableDragDrop: boolean;
+    /** Panel title */
+    title: string;
+    /** Empty state title */
+    emptyStateTitle: string;
+    /** Empty state message */
+    emptyStateMessage: string;
+    /** CSV parser function (optional) */
+    csvParser?: CSVParser;
+    /** Internal state */
+    private dragOver;
+    private localSelectedRecipients;
+    private searchQuery;
+    private filteredRecipients;
+    private boatState;
+    /** File input reference */
+    private fileInputRef;
+    connectedCallback(): void;
+    private handleEmailsImported;
+    updated(changedProperties: Map<string, any>): void;
+    /** Handle CSV import trigger */
+    private handleImportFromCSV;
+    /** Handle file selection */
+    private handleFileSelect;
+    /** Handle drag and drop */
+    private handleDrop;
+    /** Process CSV file */
+    private processCSVFile;
+    /** Parse CSV content */
+    private parseCSV;
+    /** Simple CSV parsing fallback */
+    private simpleCSVParse;
+    /** Validate email format */
+    private isValidEmail;
+    /** Toggle recipient selection */
+    private toggleRecipientSelection;
+    /** Select all filtered recipients */
+    private selectAll;
+    /** Clear all selections */
+    private selectNone;
+    /** Remove individual recipient */
+    private removeRecipient;
+    /** Clear all recipients */
+    private clearAll;
+    /** Update filtered recipients based on search */
+    private updateFilteredRecipients;
+    /** Handle search input */
+    private handleSearchInput;
+    /** Clear search query */
+    private clearSearch;
+    /** Dispatch selection change event */
+    private dispatchSelectionChange;
+    /** Handle boat state changes */
+    private handleBoatStateChange;
+    /** Add recipients programmatically */
+    addRecipients(emails: string[]): void;
+    /** Show boat */
+    showBoat(): void;
+    /** Hide boat */
+    hideBoat(): void;
+    /** Expand boat */
+    expandBoat(): void;
+    /** Toggle boat state */
+    toggleBoat(): void;
+    render(): import("lit-html").TemplateResult<1>;
+    /** Render floating boat layout */
+    private renderBoatLayout;
+    /** Render boat content */
+    private renderBoatContent;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-email-recipients': SchmancyEmailRecipients;
+    }
+}
+export {};

package/types/src/mailbox/email-template-picker.d.ts

@@ -0,0 +1,64 @@
+import type { EmailTemplate } from './types';
+declare const SchmancyEmailTemplatePicker_base: CustomElementConstructor & import("@mixins/index").Constructor<import("lit").LitElement> & import("@mixins/index").Constructor<import("@mixins/index").IBaseMixin>;
+/**
+ * Email template picker content component (for use inside sheets)
+ *
+ * Features:
+ * - Grid layout for template preview
+ * - Search/filter templates
+ * - Category filtering
+ * - Preview before selection
+ * - Confirm selection
+ *
+ * @example
+ * ```typescript
+ * // Open as sheet
+ * const picker = new SchmancyEmailTemplatePicker()
+ * picker.templates = templates
+ * picker.addEventListener('template-selected', handleSelection)
+ * sheet.open({ component: picker, title: 'Choose Template' })
+ * ```
+ */
+export declare class SchmancyEmailTemplatePicker extends SchmancyEmailTemplatePicker_base {
+    /** Available templates */
+    templates: EmailTemplate[];
+    /** Search query */
+    private searchQuery;
+    /** Selected template for preview */
+    private selectedTemplate;
+    /** Filtered templates based on search */
+    private filteredTemplates;
+    /** Show template preview */
+    private showPreview;
+    /** Selected category filter */
+    private selectedCategory;
+    connectedCallback(): void;
+    updated(changed: Map<string, any>): void;
+    /** Get unique categories from templates */
+    get categories(): string[];
+    /** Update filtered templates */
+    private updateFilteredTemplates;
+    /** Handle search input */
+    private handleSearch;
+    /** Handle category selection */
+    private handleCategorySelect;
+    /** Select template for preview */
+    private selectTemplate;
+    /** Confirm template selection */
+    private confirmSelection;
+    /** Close the picker */
+    private close;
+    /** Go back from preview */
+    private backToList;
+    render(): import("lit-html").TemplateResult<1>;
+    /** Render template list */
+    private renderTemplateList;
+    /** Render template preview */
+    private renderPreview;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-email-template-picker': SchmancyEmailTemplatePicker;
+    }
+}
+export {};

package/types/src/mailbox/email-viewer.d.ts

@@ -0,0 +1,86 @@
+import type { EmailAttachment } from './types';
+declare const SchmancyEmailViewer_base: CustomElementConstructor & import("@mixins/index").Constructor<import("lit").LitElement> & import("@mixins/index").Constructor<import("@mixins/index").IBaseMixin>;
+/**
+ * Email viewer component showing formatted HTML and plain text versions
+ *
+ * Features:
+ * - HTML and plain text preview modes
+ * - Email client-compatible styling
+ * - Layout parsing (columns, sidebars, image rows)
+ * - Markdown to HTML conversion
+ * - Attachment display
+ * - Email header simulation
+ * - Character/word statistics
+ *
+ * @example
+ * ```html
+ * <schmancy-email-viewer
+ *   subject="Welcome!"
+ *   body="**Hello** world"
+ *   .attachments=${attachments}
+ *   .recipients=${['user@example.com']}
+ * ></schmancy-email-viewer>
+ * ```
+ */
+export declare class SchmancyEmailViewer extends SchmancyEmailViewer_base {
+    /** Email subject */
+    subject: string;
+    /** Email body content (markdown) */
+    body: string;
+    /** Email attachments */
+    attachments: EmailAttachment[];
+    /** Selected recipients for preview */
+    recipients: string[];
+    /** From address for preview */
+    fromAddress: string;
+    /** To address for preview (uses first recipient if not provided) */
+    toAddress: string;
+    /** Current view mode */
+    private viewMode;
+    /**
+     * Parse layout blocks (:::layout type) and convert to email-safe table layouts
+     */
+    private parseLayoutBlocks;
+    /**
+     * Parse columns layout (2 or 3 columns)
+     */
+    private parseColumnsLayout;
+    /**
+     * Parse sidebar layout (left or right sidebar)
+     */
+    private parseSidebarLayout;
+    /**
+     * Parse image row layout
+     */
+    private parseImageRowLayout;
+    /**
+     * Parse image attributes from markdown syntax
+     */
+    private parseImageAttributes;
+    /**
+     * Generate email-safe image styles based on attributes
+     */
+    private generateImageStyles;
+    /**
+     * Parse basic markdown within layout content (simplified version)
+     */
+    private parseBasicMarkdown;
+    /**
+     * Email-compliant HTML generator for email clients (Gmail, Outlook, Apple Mail)
+     * Uses table-based layouts with inline styles only - no CSS classes or modern features
+     */
+    private parseExtendedMarkdown;
+    /**
+     * Convert markdown to plain text for plain text preview
+     */
+    private convertToPlainText;
+    /** Format file size for display */
+    private formatFileSize;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-email-viewer': SchmancyEmailViewer;
+    }
+}
+export {};

package/types/src/mailbox/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Schmancy Mailbox Components
+ *
+ * Comprehensive email composition and management system
+ */
+export * from './types';
+export { SchmancyMailbox } from './mailbox';
+export { SchmancyEmailEditor } from './email-editor';
+export { SchmancyEmailViewer } from './email-viewer';
+export { SchmancyEmailRecipients } from './email-recipients';
+export { SchmancyEmailLayoutSelector } from './email-layout-selector';
+export type { EmailTemplate, EmailAttachment, EmailComposeConfig, SendEmailRequest, SendEmailResponse, ImportSource, EmailCampaign, EmailRecipient, MailboxState, CurrentComposeState, BoatState, EmailPreviewMode } from './types';

package/types/src/mailbox/mailbox.d.ts

@@ -0,0 +1,82 @@
+import type { EmailTemplate, EmailComposeConfig, ImportSource } from './types';
+declare const SchmancyMailbox_base: CustomElementConstructor & import("@mixins/index").Constructor<import("lit").LitElement> & import("@mixins/index").Constructor<import("@mixins/index").IBaseMixin>;
+/**
+ * Main mailbox component that orchestrates the entire email composition flow
+ *
+ * Features:
+ * - Responsive layout with composer and preview panels
+ * - Recipients management with floating boat interface
+ * - Template selection and content editing
+ * - Attachment handling
+ * - Email validation and sending
+ *
+ * @example
+ * ```html
+ * <schmancy-mailbox
+ *   .config=${{ sendEndpoint: '/api/send-email' }}
+ *   .templates=${emailTemplates}
+ *   .importSources=${recipientSources}
+ * ></schmancy-mailbox>
+ * ```
+ */
+export declare class SchmancyMailbox extends SchmancyMailbox_base {
+    /** Configuration for endpoints and handlers */
+    config: EmailComposeConfig;
+    /** Available email templates */
+    templates: EmailTemplate[];
+    /** Import sources for recipients panel */
+    importSources: ImportSource[];
+    /** Disable all interactions */
+    disabled: boolean;
+    /** Recipients panel title */
+    recipientsTitle: string;
+    /** Empty state title for recipients */
+    recipientsEmptyTitle: string;
+    /** Empty state message for recipients */
+    recipientsEmptyMessage: string;
+    /** Enable CSV import functionality */
+    enableCsvImport: boolean;
+    /** Enable drag and drop for files */
+    enableDragDrop: boolean;
+    /** Email composition state */
+    private recipients;
+    private selectedRecipients;
+    private subject;
+    private body;
+    private templateId;
+    private attachments;
+    private isSending;
+    connectedCallback(): void;
+    updated(changedProperties: Map<string, any>): void;
+    /** Handle emails imported from various sources */
+    private handleEmailsImported;
+    /** Handle individual recipient removal */
+    private handleRecipientRemoved;
+    /** Handle clearing all recipients */
+    private handleRecipientsCleared;
+    /** Handle recipient selection changes */
+    private handleSelectionChanged;
+    /** Handle composer content changes */
+    private handleEditorChange;
+    /** Handle email sending */
+    private handleSend;
+    /** Add recipients programmatically */
+    addRecipients(emails: string[]): void;
+    /** Set email subject */
+    setSubject(subject: string): void;
+    /** Set email body */
+    setBody(body: string): void;
+    /** Set selected template */
+    setTemplate(templateId: string | null): void;
+    /** Clear all compose data */
+    clearCompose(): void;
+    /** Set sending state */
+    setSending(sending: boolean): void;
+    render(): import("lit-html").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'schmancy-mailbox': SchmancyMailbox;
+    }
+}
+export {};

package/types/src/mailbox/types.d.ts

@@ -0,0 +1,177 @@
+/**
+ * Mailbox component types and interfaces
+ * Extracted from funkhaus-events and generalized for reusability
+ */
+/**
+ * Email template definition
+ */
+export interface EmailTemplate {
+    id: string;
+    name: string;
+    subject: string;
+    body: string;
+    isDefault?: boolean;
+    createdAt?: Date | string;
+    category?: string;
+    description?: string;
+    thumbnail?: string;
+}
+/**
+ * Email attachment definition
+ */
+export interface EmailAttachment {
+    id: string;
+    file: File;
+    name: string;
+    size: number;
+    type: string;
+    url?: string;
+}
+/**
+ * Configuration for email composer component
+ */
+export interface EmailComposeConfig {
+    /** Endpoint for sending emails */
+    sendEndpoint?: string;
+    /** Endpoint for fetching templates */
+    templatesEndpoint?: string;
+    /** Endpoint for uploading files */
+    uploadEndpoint?: string;
+    /** Function to authenticate requests */
+    authenticateRequest?: (request: RequestInit) => RequestInit;
+    /** Custom upload handler for attachments */
+    uploadHandler?: (file: File) => Promise<string>;
+    /** Custom image upload handler */
+    imageUploadHandler?: (file: File) => Promise<string>;
+}
+/**
+ * Email send request structure
+ */
+export interface SendEmailRequest {
+    recipients: string[];
+    subject: string;
+    body: string;
+    attachments: EmailAttachment[];
+    templateId?: string | null;
+}
+/**
+ * Email send response structure
+ */
+export interface SendEmailResponse {
+    success: boolean;
+    message: string;
+    campaignId?: string;
+}
+/**
+ * Import source definition for recipients panel
+ */
+export interface ImportSource {
+    id: string;
+    label: string;
+    icon: string;
+    handler: () => void;
+}
+/**
+ * CSV parsing result
+ */
+export interface CsvParseResult {
+    validEmails: string[];
+    invalidEmails: string[];
+    totalRows: number;
+    duplicates: string[];
+}
+/**
+ * Email recipient status
+ */
+export type EmailRecipientStatus = 'pending' | 'sent' | 'failed';
+/**
+ * Email recipient definition
+ */
+export interface EmailRecipient {
+    email: string;
+    name?: string;
+    status: EmailRecipientStatus;
+    error?: string;
+    sentAt?: Date | string;
+}
+/**
+ * Email campaign definition
+ */
+export interface EmailCampaign {
+    id?: string;
+    subject: string;
+    body: string;
+    plainText?: string;
+    recipients: EmailRecipient[];
+    status: 'draft' | 'sent' | 'failed' | 'sending';
+    createdAt?: Date | string;
+    sentAt?: Date | string;
+    createdBy?: string;
+    templateId?: string;
+    attachments?: EmailAttachment[];
+    stats?: {
+        totalRecipients: number;
+        sent: number;
+        failed: number;
+        batches?: number;
+        retries?: number;
+        opened?: number;
+        clicked?: number;
+    };
+}
+/**
+ * Mailbox state for context management
+ */
+export interface MailboxState {
+    campaigns: EmailCampaign[];
+    templates: EmailTemplate[];
+    loading: boolean;
+    error: string | null;
+    currentCampaign: Partial<EmailCampaign> | null;
+}
+/**
+ * Current compose state for context management
+ */
+export interface CurrentComposeState {
+    selectedEmails: string[];
+    subject: string;
+    body: string;
+    templateId: string | null;
+    attachments: EmailAttachment[];
+}
+/**
+ * Email compose events
+ */
+export type EmailComposeEvents = {
+    'emails-imported': CustomEvent<{
+        emails: string[];
+        source: string;
+    }>;
+    'recipient-removed': CustomEvent<{
+        email: string;
+    }>;
+    'recipients-cleared': CustomEvent<{}>;
+    'selection-changed': CustomEvent<{
+        selectedEmails: string[];
+    }>;
+    'compose-changed': CustomEvent<{
+        subject: string;
+        body: string;
+        templateId: string | null;
+        attachments: EmailAttachment[];
+    }>;
+    'send-email': CustomEvent<{
+        request: SendEmailRequest;
+    }>;
+    'send-error': CustomEvent<{
+        error: string;
+    }>;
+};
+/**
+ * Boat state options for recipients panel
+ */
+export type BoatState = 'hidden' | 'minimized' | 'expanded';
+/**
+ * Email preview view modes
+ */
+export type EmailPreviewMode = 'html' | 'plaintext';

package/types/src/textarea/textarea.d.ts

@@ -80,7 +80,7 @@ export default class SchmancyTextarea extends SchmancyTextarea_base {
      * Automatically adjusts height based on content.
      * @attr autoHeight
      * @type {boolean}
-     * @default false
+     * @default true
      * @public
      */
     autoHeight: boolean;
@@ -88,7 +88,7 @@ export default class SchmancyTextarea extends SchmancyTextarea_base {
      * Controls whether the textarea can be resized by the user.
      * @attr resize
      * @type {'none' | 'vertical' | 'horizontal' | 'both'}
-     * @default 'none'
+     * @default 'vertical'
      * @public
      */
     resize: 'none' | 'vertical' | 'horizontal' | 'both';