better-svelte-email 1.0.0-beta.2 → 1.0.1

package/dist/preprocessor/transformer.js

@@ -1,158 +0,0 @@
-import { tailwindToCSS } from 'tw-to-css';
-/**
- * Initialize Tailwind converter with config
- */
-export function createTailwindConverter(config) {
-    const { twi } = tailwindToCSS({ config });
-    return twi;
-}
-/**
- * Transform Tailwind classes to inline styles and responsive classes
- */
-export function transformTailwindClasses(classString, tailwindConverter) {
-    // Split classes
-    const classes = classString.trim().split(/\s+/).filter(Boolean);
-    // Separate responsive from non-responsive classes
-    const responsiveClasses = [];
-    const nonResponsiveClasses = [];
-    for (const cls of classes) {
-        // Responsive classes have format: sm:, md:, lg:, xl:, 2xl:
-        if (/^(sm|md|lg|xl|2xl):/.test(cls)) {
-            responsiveClasses.push(cls);
-        }
-        else {
-            nonResponsiveClasses.push(cls);
-        }
-    }
-    // Convert non-responsive classes to CSS
-    let inlineStyles = '';
-    const invalidClasses = [];
-    if (nonResponsiveClasses.length > 0) {
-        const classesStr = nonResponsiveClasses.join(' ');
-        try {
-            // Generate CSS from Tailwind classes
-            const css = tailwindConverter(classesStr, {
-                merge: false,
-                ignoreMediaQueries: true
-            });
-            // Extract styles from CSS
-            const styles = extractStylesFromCSS(css, nonResponsiveClasses);
-            inlineStyles = styles.validStyles;
-            invalidClasses.push(...styles.invalidClasses);
-        }
-        catch (error) {
-            console.warn('Failed to convert Tailwind classes:', error);
-        }
-    }
-    return {
-        inlineStyles,
-        responsiveClasses,
-        invalidClasses
-    };
-}
-/**
- * Extract CSS properties from generated CSS
- * Handles the format: .classname { prop: value; }
- */
-function extractStylesFromCSS(css, originalClasses) {
-    const invalidClasses = [];
-    const styleProperties = [];
-    // Remove media queries (we handle those separately)
-    const cssWithoutMedia = css.replace(/@media[^{]+\{(?:[^{}]|\{[^{}]*\})*\}/g, '');
-    // Create a map of class name -> CSS rules
-    const classMap = new Map();
-    // Match .classname { rules }
-    const classRegex = /\.([^\s{]+)\s*\{([^}]+)\}/g;
-    let match;
-    while ((match = classRegex.exec(cssWithoutMedia)) !== null) {
-        const className = match[1];
-        const rules = match[2].replace(/\\/g, '').trim();
-        // Normalize class name (tw-to-css might transform special chars)
-        const normalizedClass = className.replace(/\\/g, '').replace(/[:#\-[\]/.%!_]+/g, '_');
-        classMap.set(normalizedClass, rules);
-    }
-    // For each original class, try to find its CSS
-    for (const originalClass of originalClasses) {
-        // Normalize the original class name to match what tw-to-css produces
-        const normalized = originalClass.replace(/[:#\-[\]/.%!_]+/g, '_');
-        if (classMap.has(normalized)) {
-            const rules = classMap.get(normalized);
-            // Ensure rules end with semicolon for proper concatenation
-            const rulesWithSemicolon = rules.trim().endsWith(';') ? rules.trim() : rules.trim() + ';';
-            styleProperties.push(rulesWithSemicolon);
-        }
-        else {
-            // Class not found - might be invalid Tailwind
-            invalidClasses.push(originalClass);
-        }
-    }
-    // Combine all style properties with space separator
-    const validStyles = styleProperties.join(' ').trim();
-    return { validStyles, invalidClasses };
-}
-/**
- * Generate media query CSS for responsive classes
- */
-export function generateMediaQueries(responsiveClasses, tailwindConverter, tailwindConfig) {
-    if (responsiveClasses.length === 0) {
-        return [];
-    }
-    const mediaQueries = [];
-    // Default breakpoints (can be overridden by config)
-    const breakpoints = {
-        sm: '475px',
-        md: '768px',
-        lg: '1024px',
-        xl: '1280px',
-        '2xl': '1536px',
-        ...tailwindConfig?.theme?.screens
-    };
-    // Group classes by breakpoint
-    const classesByBreakpoint = new Map();
-    for (const cls of responsiveClasses) {
-        const match = cls.match(/^(sm|md|lg|xl|2xl):(.+)/);
-        if (match) {
-            const [, breakpoint] = match;
-            if (!classesByBreakpoint.has(breakpoint)) {
-                classesByBreakpoint.set(breakpoint, []);
-            }
-            classesByBreakpoint.get(breakpoint).push(cls);
-        }
-    }
-    // Generate CSS for each breakpoint
-    for (const [breakpoint, classes] of classesByBreakpoint) {
-        const breakpointValue = breakpoints[breakpoint];
-        if (!breakpointValue)
-            continue;
-        // Generate full CSS including media queries
-        const fullCSS = tailwindConverter(classes.join(' '), {
-            merge: false,
-            ignoreMediaQueries: false
-        });
-        // Extract just the media query portion
-        const mediaQueryRegex = new RegExp(`@media[^{]*\\{([^{}]|\\{[^{}]*\\})*\\}`, 'g');
-        let match;
-        while ((match = mediaQueryRegex.exec(fullCSS)) !== null) {
-            const mediaQueryBlock = match[0];
-            // Make all rules !important for email clients
-            const withImportant = mediaQueryBlock.replace(/([a-z-]+)\s*:\s*([^;!}]+)/gi, '$1: $2 !important');
-            // Parse out the query and content
-            const queryMatch = withImportant.match(/@media\s*([^{]+)/);
-            if (queryMatch) {
-                const query = `@media ${queryMatch[1].trim()}`;
-                mediaQueries.push({
-                    query,
-                    className: `responsive-${breakpoint}`,
-                    rules: withImportant
-                });
-            }
-        }
-    }
-    return mediaQueries;
-}
-/**
- * Sanitize class names for use in CSS (replace special characters)
- */
-export function sanitizeClassName(className) {
-    return className.replace(/[:#\-[\]/.%!]+/g, '_');
-}

package/dist/preprocessor/types.d.ts

@@ -1,125 +0,0 @@
-import type { TailwindConfig } from 'tw-to-css';
-/**
- * Options for the preprocessor
- */
-export interface PreprocessorOptions {
-    /**
-     * Custom Tailwind configuration
-     */
-    tailwindConfig?: TailwindConfig;
-    /**
-     * Path to folder containing email components
-     * @default '/src/lib/emails'
-     */
-    pathToEmailFolder?: string;
-    /**
-     * Enable debug logging
-     * @default false
-     */
-    debug?: boolean;
-}
-/**
- * Represents a class attribute found in the AST
- */
-export interface ClassAttribute {
-    /**
-     * Raw class string (e.g., "text-red-500 sm:bg-blue")
-     */
-    raw: string;
-    /**
-     * Start position in source code
-     */
-    start: number;
-    /**
-     * End position in source code
-     */
-    end: number;
-    /**
-     * Parent element/component name
-     */
-    elementName: string;
-    /**
-     * Whether this is a static string or dynamic expression
-     */
-    isStatic: boolean;
-}
-/**
- * Represents a style attribute found in the AST
- */
-export interface StyleAttribute {
-    /**
-     * Raw style string (e.g., "background-color: red;")
-     */
-    raw: string;
-    /**
-     * Start position in source code
-     */
-    start: number;
-    /**
-     * End position in source code
-     */
-    end: number;
-    /**
-     * Parent element/component name
-     */
-    elementName: string;
-}
-/**
- * Result of transforming Tailwind classes
- */
-export interface TransformResult {
-    /**
-     * CSS styles for inline styleString prop
-     */
-    inlineStyles: string;
-    /**
-     * Responsive classes to keep in class attribute
-     */
-    responsiveClasses: string[];
-    /**
-     * Classes that couldn't be converted (warnings)
-     */
-    invalidClasses: string[];
-}
-/**
- * Media query CSS to inject into head
- */
-export interface MediaQueryStyle {
-    /**
-     * Media query condition (e.g., "@media (max-width: 475px)")
-     */
-    query: string;
-    /**
-     * CSS class name
-     */
-    className: string;
-    /**
-     * CSS rules
-     */
-    rules: string;
-}
-/**
- * Information about a component's transformations
- */
-export interface ComponentTransform {
-    /**
-     * Original source code
-     */
-    originalCode: string;
-    /**
-     * Transformed source code
-     */
-    transformedCode: string;
-    /**
-     * Media queries to inject
-     */
-    mediaQueries: MediaQueryStyle[];
-    /**
-     * Whether <Head> component was found
-     */
-    hasHead: boolean;
-    /**
-     * Warnings encountered during transformation
-     */
-    warnings: string[];
-}

package/dist/preprocessor/types.js

@@ -1 +0,0 @@
-export {};