@emberkit/core 0.1.2-alpha.0

package/dist/hydration/types.js

@@ -0,0 +1,18 @@
+export const INTERACTIVE_ATTRIBUTES = new Set([
+    'onClick', 'onMouseDown', 'onMouseUp', 'onMouseEnter', 'onMouseLeave',
+    'onFocus', 'onBlur', 'onChange', 'onInput', 'onSubmit',
+    'onKeyDown', 'onKeyUp', 'onKeyPress', 'onScroll',
+    'onTouchStart', 'onTouchEnd', 'onTouchMove',
+    'onDragStart', 'onDrag', 'onDragEnd',
+    'onWheel', 'onAnimationStart', 'onAnimationEnd',
+]);
+export const HYDRATABLE_TAGS = new Set([
+    'button', 'a', 'input', 'select', 'textarea',
+    'form', 'details', 'dialog', 'summary',
+]);
+export function isInteractiveTag(tagName) {
+    return HYDRATABLE_TAGS.has(tagName.toLowerCase());
+}
+export function hasEventHandlers(props) {
+    return Object.keys(props).some((key) => INTERACTIVE_ATTRIBUTES.has(key));
+}

package/dist/image/index.js

@@ -0,0 +1,34 @@
+export function imagePlugin(config = {}) {
+    const processor = createImageConfig(config);
+    const images = new Set();
+    return {
+        name: 'emberkit-image',
+        version: '0.1.0',
+        setup(context) {
+            context.onHook('buildEnd', () => {
+                optimizeImages(images);
+            });
+            context.addWatchFile(config.watchDir ?? './src/images');
+        },
+    };
+}
+function createImageConfig(config) {
+    return {
+        provider: config.provider ?? 'none',
+        baseUrl: config.baseUrl ?? '',
+        quality: config.quality ?? 80,
+        formats: config.formats ?? ['webp', 'jpeg'],
+        sizes: config.sizes ?? [320, 640, 1024, 1920],
+        lazy: config.lazy ?? true,
+        placeholder: config.placeholder ?? 'blur',
+    };
+}
+async function optimizeImages(images) {
+    for (const imagePath of images) {
+        console.log(`[Image Plugin] Optimizing: ${imagePath}`);
+    }
+}
+export function createImageVitePlugin(config) {
+    return imagePlugin(config);
+}
+export { createImageProcessor } from './processor.js';

package/dist/image/processor.js

@@ -0,0 +1,143 @@
+export class ImageProcessor {
+    config;
+    constructor(config = {}) {
+        this.config = {
+            provider: config.provider ?? 'none',
+            baseUrl: config.baseUrl ?? '',
+            quality: config.quality ?? 80,
+            formats: config.formats ?? ['webp', 'jpeg'],
+            sizes: config.sizes ?? [320, 640, 1024, 1920],
+            lazy: config.lazy ?? true,
+            placeholder: config.placeholder ?? 'blur',
+        };
+    }
+    transform(src, options = {}) {
+        const { width = 800, height, format = 'webp', quality } = options;
+        const url = this.buildUrl(src, { width, height, format, quality: quality ?? this.config.quality });
+        const srcset = this.buildSrcset(src, {
+            format,
+            quality: quality ?? this.config.quality,
+        });
+        return {
+            src: url,
+            srcset,
+            width,
+            height: height ?? Math.round(width * 0.75),
+            format,
+            blurDataURL: this.config.placeholder !== 'none' ? this.generatePlaceholder() : undefined,
+        };
+    }
+    buildUrl(src, params) {
+        const url = new URL(src, this.config.baseUrl || 'https://example.com');
+        if (params.width)
+            url.searchParams.set('w', String(params.width));
+        if (params.height)
+            url.searchParams.set('h', String(params.height));
+        if (params.format)
+            url.searchParams.set('f', params.format);
+        if (params.quality)
+            url.searchParams.set('q', String(params.quality));
+        return url.toString();
+    }
+    buildSrcset(src, params) {
+        return this.config.sizes
+            .map((size) => {
+            const url = this.buildUrl(src, { width: size, ...params });
+            return `${url} ${size}w`;
+        })
+            .join(', ');
+    }
+    generatePlaceholder() {
+        return 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMDAiIGhlaWdodD0iMjAwIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjZmZmIj48L3JlY3Q+PC9zdmc+';
+    }
+    analyze(stats) {
+        const savingsPercent = parseFloat(((stats.savings / stats.originalSize) * 100).toFixed(1));
+        if (savingsPercent > 50) {
+            console.log(`[Image] Significant savings: ${savingsPercent}% reduction`);
+        }
+    }
+}
+export function createImageProcessor(config) {
+    return new ImageProcessor(config);
+}
+export function getOptimalFormat(acceptHeader) {
+    if (acceptHeader.includes('image/avif'))
+        return 'avif';
+    if (acceptHeader.includes('image/webp'))
+        return 'webp';
+    return 'jpeg';
+}
+export function calculateSizes(sizes, viewport) {
+    const parsed = sizes.replace(/(\d+)px/g, (_, n) => {
+        const vw = (parseInt(n) / viewport) * 100;
+        return `${vw.toFixed(2)}vw`;
+    });
+    return parsed || '100vw';
+}
+export const ASPECT_RATIOS = new Map([
+    ['1:1', 1],
+    ['4:3', 4 / 3],
+    ['16:9', 16 / 9],
+    ['21:9', 21 / 9],
+    ['3:2', 3 / 2],
+    ['2:3', 2 / 3],
+]);
+export function calculateDimensions(width, aspectRatio) {
+    const ratio = aspectRatio ? ASPECT_RATIOS.get(aspectRatio) : undefined;
+    return {
+        width,
+        height: ratio ? Math.round(width / ratio) : Math.round(width * 0.75),
+    };
+}
+export const LOW_QUALITY_IMAGE_SIZES = [20, 40, 80];
+export function generatePlaceholderSVG(width, height, color = '#e0e0e0') {
+    return `data:image/svg+xml;base64,${btoa(`<svg xmlns="http://www.w3.org/2000/svg" width="${width}" height="${height}">
+      <rect width="100%" height="100%" fill="${color}"/>
+      <text x="50%" y="50%" text-anchor="middle" fill="#999">Loading...</text>
+    </svg>`)}`;
+}
+export function createPictureElement(image, alt, options = {}) {
+    const { lazy = true, loading = 'lazy', fetchpriority = 'auto' } = options;
+    const sources = image.format !== 'avif'
+        ? `<source type="image/avif" srcset="${image.srcset.replace(/f=webp/g, 'f=avif')}">`
+        : '';
+    const webpSource = image.format !== 'webp'
+        ? `<source type="image/webp" srcset="${image.srcset.replace(/f=[\w]+/g, 'f=webp')}">`
+        : '';
+    return `<picture>
+  ${sources}
+  ${webpSource}
+  <img
+    src="${image.src}"
+    width="${image.width}"
+    height="${image.height}"
+    alt="${escapeHtml(alt)}"
+    loading="${loading}"
+    ${lazy ? 'decoding="async"' : ''}
+    fetchpriority="${fetchpriority}"
+    ${image.blurDataURL ? `style="background-image:url(${image.blurDataURL})"` : ''}
+  >
+</picture>`;
+}
+function escapeHtml(str) {
+    return str.replace(/[<>&"']/g, (c) => ({
+        '<': '&lt;',
+        '>': '&gt;',
+        '&': '&amp;',
+        '"': '&quot;',
+        "'": '&#39;',
+    })[c] ?? c);
+}
+export function parseImageSrc(src) {
+    const [path, query] = src.split('?');
+    const params = {};
+    if (query) {
+        for (const pair of query.split('&')) {
+            const [key, value] = pair.split('=');
+            if (key && value) {
+                params[key] = value;
+            }
+        }
+    }
+    return { path, params };
+}

package/dist/index.js

@@ -0,0 +1,16 @@
+export const VERSION = '0.1.0';
+export { createElement, render, hydrate } from './runtime/index.js';
+export { createSignal, createMemo, createEffect, batch, untrack } from './signals/index.js';
+export { createContext, useContext } from './context/index.js';
+export { navigate, preload, useNavigate } from './navigation/index.js';
+export { createRouter, matchRoute } from './router/index.js';
+export { createLoaderData } from './loader/index.js';
+export { createErrorBoundary, createLoadingBoundary } from './boundaries/index.js';
+export { createMarkdownParser, parseMarkdown, renderMarkdown, extractFrontmatter } from './markdown/index.js';
+export { compileMDX, compileSync, useMDX } from './mdx/index.js';
+export { DataCache, createCache, getCached, setCache, prefetch } from './cache/index.js';
+export { Head } from './meta/index.js';
+export { generateMeta, generateBreadcrumbs, generateArticleSchema, generateProductSchema } from './meta/index.js';
+export function defineConfig(config) {
+    return config;
+}

package/dist/jsx-dev-runtime.js

@@ -0,0 +1,7 @@
+export function jsxDEV(type, props) {
+    return { type, props };
+}
+export const Fragment = ({ children }) => {
+    return children;
+};
+export const jsxs = jsxDEV;

package/dist/jsx-runtime.js

@@ -0,0 +1,7 @@
+export function jsx(type, props) {
+    return { type, props };
+}
+export const Fragment = ({ children }) => {
+    return children;
+};
+export const jsxs = jsx;

package/dist/loader/helpers/loader.js

@@ -0,0 +1,61 @@
+export async function runLoader(loader, context) {
+    if (!loader) {
+        return { data: undefined };
+    }
+    try {
+        const result = await loader(context);
+        return result;
+    }
+    catch (error) {
+        if (error instanceof Error) {
+            return {
+                error: {
+                    code: 'LOADER_ERROR',
+                    message: error.message,
+                    status: 500,
+                },
+            };
+        }
+        return {
+            error: {
+                code: 'UNKNOWN_ERROR',
+                message: String(error),
+                status: 500,
+            },
+        };
+    }
+}
+export function extractLoaderData(result) {
+    if ('data' in result) {
+        return result.data;
+    }
+    return null;
+}
+export function extractLoaderError(result) {
+    if ('error' in result) {
+        return result;
+    }
+    return null;
+}
+export function mergeLoaderResults(results) {
+    const errors = [];
+    const data = [];
+    for (const result of results) {
+        if ('error' in result) {
+            errors.push(result);
+        }
+        else {
+            data.push(result.data);
+        }
+    }
+    if (errors.length > 0) {
+        return {
+            error: {
+                code: 'MULTIPLE_ERRORS',
+                message: `${errors.length} loaders failed`,
+                status: 500,
+            },
+        };
+    }
+    return { data };
+}

package/dist/loader/index.js

@@ -0,0 +1,2 @@
+export * from './types.js';
+export * from './helpers/loader.js';

package/dist/loader/types.js

@@ -0,0 +1,14 @@
+export function isLoaderError(result) {
+    return 'error' in result;
+}
+export function isLoaderData(result) {
+    return 'data' in result;
+}
+export function createLoaderError(code, message, status = 500) {
+    return {
+        error: { code, message, status },
+    };
+}
+export function createLoaderData(data) {
+    return { data };
+}

package/dist/markdown/index.js

@@ -0,0 +1,365 @@
+class MarkdownParser {
+    config;
+    constructor(config = {}) {
+        this.config = {
+            gfm: config.gfm ?? true,
+            breaks: config.breaks ?? false,
+            html: config.html ?? true,
+            tables: config.tables ?? true,
+            taskLists: config.taskLists ?? true,
+            footnotes: config.footnotes ?? false,
+            remarkPlugins: config.remarkPlugins ?? [],
+            rehypePlugins: config.rehypePlugins ?? [],
+            components: config.components ?? {},
+        };
+    }
+    parse(markdown) {
+        const frontmatter = this.extractFrontmatter(markdown);
+        const content = frontmatter ? this.removeFrontmatter(markdown) : markdown;
+        const html = this.renderMarkdown(content);
+        const headings = this.extractHeadings(html);
+        const links = this.extractLinks(content);
+        const images = this.extractImages(content);
+        const codeBlocks = this.extractCodeBlocks(content);
+        return { html, frontmatter, headings, links, images, codeBlocks };
+    }
+    extractFrontmatter(markdown) {
+        const match = markdown.match(/^---\n([\s\S]*?)\n---/);
+        if (!match)
+            return undefined;
+        const result = {};
+        const lines = match[1].split('\n');
+        for (const line of lines) {
+            const colonIndex = line.indexOf(':');
+            if (colonIndex === -1)
+                continue;
+            const key = line.slice(0, colonIndex).trim();
+            let value = line.slice(colonIndex + 1).trim();
+            if (value === 'true')
+                value = true;
+            else if (value === 'false')
+                value = false;
+            else if (!isNaN(Number(value)))
+                value = Number(value);
+            else if (typeof value === 'string' && value.startsWith('[')) {
+                value = value.replace(/[\[\]]/g, '').split(',').map((s) => s.trim());
+            }
+            result[key] = value;
+        }
+        return result;
+    }
+    removeFrontmatter(markdown) {
+        return markdown.replace(/^---\n[\s\S]*?\n---\n?/, '');
+    }
+    renderMarkdown(content) {
+        let html = content;
+        html = this.processCodeBlocks(html);
+        html = this.processHeadings(html);
+        html = this.processHorizontalRules(html);
+        html = this.processLists(html);
+        html = this.processTaskLists(html);
+        html = this.processTables(html);
+        html = this.processImages(html);
+        html = this.processLinks(html);
+        html = this.processBlockquotes(html);
+        html = this.processEmphasis(html);
+        html = this.processLineBreaks(html);
+        html = this.processComponents(html);
+        return html;
+    }
+    processCodeBlocks(html) {
+        return html.replace(/```(\w*)\n([\s\S]*?)```/g, (_match, lang, code) => {
+            const escaped = this.escapeHtml(code.trim());
+            return `<pre><code class="language-${lang}">${escaped}</code></pre>`;
+        });
+    }
+    processHeadings(html) {
+        return html.replace(/^(#{1,6})\s+(.+)$/gm, (_match, hashes, text) => {
+            const level = hashes.length;
+            const id = this.slugify(text);
+            return `<h${level} id="${id}">${text}</h${level}>`;
+        });
+    }
+    processLists(html) {
+        const lines = html.split('\n');
+        const result = [];
+        let inList = false;
+        for (const line of lines) {
+            const orderedMatch = line.match(/^(\d+)\.\s+(.+)/);
+            const unorderedMatch = line.match(/^[-*+]\s+(.+)/);
+            if (orderedMatch || unorderedMatch) {
+                const tag = orderedMatch ? 'ol' : 'ul';
+                const content = orderedMatch ? orderedMatch[2] : unorderedMatch[2];
+                if (!inList) {
+                    result.push(`<${tag}>`);
+                    inList = true;
+                }
+                result.push(`<li>${content}</li>`);
+            }
+            else {
+                if (inList) {
+                    const lastTag = result[result.length - 1]?.startsWith('<ol') ? 'ol' : 'ul';
+                    result.push(`</${lastTag}>`);
+                    inList = false;
+                }
+                result.push(line);
+            }
+        }
+        if (inList) {
+            const lastTag = result[result.length - 1]?.startsWith('<ol') ? 'ol' : 'ul';
+            result.push(`</${lastTag}>`);
+        }
+        return result.join('\n');
+    }
+    processTaskLists(html) {
+        return html.replace(/^- \[([ x])\]\s+(.+)/gm, (_match, checked, text) => {
+            const isChecked = checked === 'x';
+            return `<li class="task"><input type="checkbox" ${isChecked ? 'checked' : ''} disabled>${text}</li>`;
+        });
+    }
+    processTables(html) {
+        const rows = html.split('\n');
+        let inTable = false;
+        const result = [];
+        let headerProcessed = false;
+        for (const row of rows) {
+            if (row.match(/^\|.*\|$/)) {
+                if (!inTable) {
+                    result.push('<table><thead><tr>');
+                    inTable = true;
+                    headerProcessed = false;
+                }
+                const cells = row.split('|').filter((c) => c.trim()).map((c) => c.trim());
+                if (row.match(/^\|[\s-:]+\|$/)) {
+                    continue;
+                }
+                if (!headerProcessed) {
+                    for (const cell of cells) {
+                        result.push(`<th>${cell}</th>`);
+                    }
+                    result.push('</tr></thead><tbody>');
+                    headerProcessed = true;
+                }
+                else {
+                    result.push('<tr>');
+                    for (const cell of cells) {
+                        result.push(`<td>${cell}</td>`);
+                    }
+                    result.push('</tr>');
+                }
+            }
+            else {
+                if (inTable) {
+                    result.push('</tbody></table>');
+                    inTable = false;
+                }
+                result.push(row);
+            }
+        }
+        if (inTable) {
+            result.push('</tbody></table>');
+        }
+        return result.join('\n');
+    }
+    processLinks(html) {
+        return html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (_match, text, href) => {
+            const titleMatch = href.match(/^([^"]+)"([^"]+)"/);
+            if (titleMatch) {
+                return `<a href="${titleMatch[1]}" title="${titleMatch[2]}">${text}</a>`;
+            }
+            return `<a href="${href}">${text}</a>`;
+        });
+    }
+    processImages(html) {
+        return html.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, (_match, alt, src) => {
+            return `<img src="${src}" alt="${alt}" loading="lazy">`;
+        });
+    }
+    processBlockquotes(html) {
+        const lines = html.split('\n');
+        const result = [];
+        let inBlockquote = false;
+        let depth = 0;
+        for (const line of lines) {
+            const match = line.match(/^(\s*)>\s?(.*)/);
+            if (match) {
+                const indent = match[1].length;
+                const content = match[2];
+                const newDepth = Math.floor(indent / 2) + 1;
+                if (!inBlockquote) {
+                    for (let i = 0; i < newDepth; i++) {
+                        result.push('<blockquote>');
+                    }
+                    depth = newDepth;
+                    inBlockquote = true;
+                }
+                else if (newDepth > depth) {
+                    for (let i = depth; i < newDepth; i++) {
+                        result.push('<blockquote>');
+                    }
+                    depth = newDepth;
+                }
+                else if (newDepth < depth) {
+                    for (let i = depth; i > newDepth; i--) {
+                        result.push('</blockquote>');
+                    }
+                    depth = newDepth;
+                }
+                result.push(content || '<br>');
+            }
+            else {
+                if (inBlockquote) {
+                    for (let i = depth; i > 0; i--) {
+                        result.push('</blockquote>');
+                    }
+                    inBlockquote = false;
+                    depth = 0;
+                }
+                result.push(line);
+            }
+        }
+        if (inBlockquote) {
+            for (let i = depth; i > 0; i--) {
+                result.push('</blockquote>');
+            }
+        }
+        return result.join('\n');
+    }
+    processEmphasis(html) {
+        return html
+            .replace(/\*\*\*(.+?)\*\*\*/g, '<strong><em>$1</em></strong>')
+            .replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
+            .replace(/\*(.+?)\*/g, '<em>$1</em>')
+            .replace(/~~(.+?)~~/g, '<del>$1</del>')
+            .replace(/`([^`]+)`/g, (_match, code) => `<code>${this.escapeHtml(code)}</code>`);
+    }
+    processHorizontalRules(html) {
+        return html.replace(/^([-*_])\s*\1\s*\1[\s-]*$/gm, '<hr>');
+    }
+    processLineBreaks(html) {
+        if (this.config.breaks) {
+            return html.replace(/\n/g, '<br>');
+        }
+        return html.replace(/\n\n/g, '</p><p>').replace(/\n/g, ' ');
+    }
+    processComponents(html) {
+        for (const [component, tag] of Object.entries(this.config.components)) {
+            html = html.replace(new RegExp(`<${component}>`, 'g'), `<${tag}>`);
+            html = html.replace(new RegExp(`</${component}>`, 'g'), `</${tag}>`);
+        }
+        return html;
+    }
+    extractHeadings(html) {
+        const headings = [];
+        const regex = /<h(\d) id="([^"]+)">([^<]+)<\/h\1>/g;
+        let match;
+        while ((match = regex.exec(html)) !== null) {
+            headings.push({
+                level: parseInt(match[1]),
+                text: match[3],
+                id: match[2],
+            });
+        }
+        return headings;
+    }
+    extractLinks(content) {
+        const links = [];
+        const regex = /\[([^\]]+)\]\(([^)]+)\)/g;
+        let match;
+        while ((match = regex.exec(content)) !== null) {
+            const href = match[2];
+            if (!href.startsWith('#') && !links.includes(href)) {
+                links.push(href);
+            }
+        }
+        return links;
+    }
+    extractImages(content) {
+        const images = [];
+        const regex = /!\[([^\]]*)\]\(([^)]+)\)/g;
+        let match;
+        while ((match = regex.exec(content)) !== null) {
+            const src = match[2];
+            const alt = match[1];
+            const titleMatch = src.match(/"([^"]+)"/);
+            const title = titleMatch ? titleMatch[1] : undefined;
+            images.push({ src, alt, title });
+        }
+        return images;
+    }
+    extractCodeBlocks(content) {
+        const blocks = [];
+        const regex = /```(\w*)\n([\s\S]*?)```/g;
+        let match;
+        while ((match = regex.exec(content)) !== null) {
+            blocks.push({
+                lang: match[1],
+                code: match[2].trim(),
+            });
+        }
+        return blocks;
+    }
+    slugify(text) {
+        return text
+            .toLowerCase()
+            .replace(/[^\w\s-]/g, '')
+            .replace(/\s+/g, '-')
+            .replace(/-+/g, '-')
+            .trim();
+    }
+    escapeHtml(text) {
+        return text
+            .replace(/&/g, '&amp;')
+            .replace(/</g, '&lt;')
+            .replace(/>/g, '&gt;')
+            .replace(/"/g, '&quot;');
+    }
+}
+export function createMarkdownParser(options) {
+    return new MarkdownParser(options);
+}
+export function parseMarkdown(content, options) {
+    const parser = new MarkdownParser(options);
+    return parser.parse(content);
+}
+export function renderMarkdown(content, options) {
+    const parser = new MarkdownParser(options);
+    return parser.parse(content).html;
+}
+export function extractFrontmatter(content) {
+    const parser = new MarkdownParser();
+    const parsed = parser.parse(content);
+    if (!parsed.frontmatter) {
+        return null;
+    }
+    return {
+        data: parsed.frontmatter,
+        content: parsed.html,
+    };
+}
+export function markdownToPlainText(markdown) {
+    return markdown
+        .replace(/```[\s\S]*?```/g, '')
+        .replace(/`([^`]+)`/g, '$1')
+        .replace(/\*\*([^*]+)\*\*/g, '$1')
+        .replace(/\*([^*]+)\*/g, '$1')
+        .replace(/\[([^\]]+)\]\([^)]+\)/g, '$1')
+        .replace(/!\[([^\]]*)\]\([^)]+\)/g, '')
+        .replace(/^#+\s+/gm, '')
+        .replace(/^>\s+/gm, '')
+        .replace(/^[-*+]\s+/gm, '')
+        .replace(/^\d+\.\s+/gm, '');
+}
+export function getReadingTime(text, wpm = 200) {
+    const words = text.trim().split(/\s+/).length;
+    return Math.ceil(words / wpm);
+}
+export function getWordCount(text) {
+    return text.trim().split(/\s+/).length;
+}
+export function getCharacterCount(text, includeSpaces = false) {
+    if (includeSpaces) {
+        return text.length;
+    }
+    return text.replace(/\s/g, '').length;
+}