@rettangoli/sites 0.1.0 → 0.2.0-rc1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rettangoli/sites",
-  "version": "0.1.0",
+  "version": "0.2.0-rc1",
   "description": "Generate static sites using Markdown and YAML. Straightforward, zero-complexity. Complete toolkit for landing pages, blogs, documentation, admin dashboards, and more.git remote add origin git@github.com:yuusoft-org/sitic.git",
   "author": {
     "name": "Luciano Hanyon Wu",
@@ -17,22 +17,19 @@
     "templates"
   ],
   "dependencies": {
-    "commander": "^13.1.0",
-    "html-minifier-terser": "^7.2.0",
+    "jempl": "^0.2.0-rc1",
     "js-yaml": "^4.1.0",
-    "liquidjs": "^10.21.0",
-    "luxon": "^3.6.1",
     "markdown-it": "^14.1.0",
-    "markdown-it-async": "^2.2.0",
-    "shiki": "^3.3.0"
+    "yahtml": "^0.0.2-rc1"
   },
   "devDependencies": {
-    "@types/bun": "^1.2.8"
+    "memfs": "^4.36.0",
+    "puty": "^0.0.4"
   },
-  "type": "module",
-  "bin": {
-    "sitic": "src/cli.js"
+  "scripts": {
+    "test": "vitest run --reporter=verbose"
   },
+  "type": "module",
   "license": "MIT",
   "keywords": [
     "static",

package/src/cli/build.js

@@ -1,166 +1,33 @@
-import { join, dirname } from "path";
-import { fileURLToPath } from "url";
-import { DateTime } from "luxon";
-
-// Create the equivalent of __dirname for ES modules
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-
-import {
-  safeYamlLoad,
-  safeReadFile,
-  deepMerge,
-  createTemplateRenderer,
-  createFolderIfNotExists,
-  configureMarkdown,
-  loadCollections,
-  createFileFormatHandlers,
-  loadItems,
-  copyDirRecursive,
-} from "../common.js";
-import { rm } from "fs/promises";
+import fs from 'fs';
+import path from 'path';
+import { createSiteBuilder } from '../createSiteBuilder.js';
 
 /**
- * Copy pages to site with processing
- * @param {Object} options - Options for copying pages
- * @param {string} options.resourcesPath - Path to resources directory
- * @param {string} options.pagesPath - Path to pages directory
- * @param {string} options.outputPath - Path to output directory
+ * Build the static site
+ * @param {Object} options - Options for building the site
+ * @param {string} options.rootDir - Root directory of the site (defaults to cwd)
+ * @param {Object} options.mdRender - Optional markdown renderer
  */
-export const copyPagesToSite = async (options) => {
-  const {
-    resourcesPath = "./sitic",
-    pagesPath = "./pages",
-    outputPath = "./_site",
-  } = options;
-
-  const dataPath = join(resourcesPath, "data.yaml");
-  const templatesPath = join(resourcesPath, "templates");
-  const componentsPath = join(resourcesPath, "components");
-  const recordsPath = join(resourcesPath, "records");
-
-  // Load hello.yaml template data
-  const inputYaml = await safeReadFile(dataPath);
-
-  const templates = await loadItems({
-    path: join(__dirname, "./templates"),
-    name: "templates",
-    isYaml: false,
-    keepExtension: true,
-  });
-
-  if (templatesPath) {
-    const customTemplates = await loadItems({
-      path: templatesPath,
-      name: "templates",
-      isYaml: false,
-      keepExtension: true,
-    });
-    Object.assign(templates, customTemplates);
+export const buildSite = async (options = {}) => {
+  const { rootDir = process.cwd(), mdRender } = options;
+  
+  // Try to load config file if it exists
+  let config = {};
+  if (!mdRender) {
+    try {
+      const configPath = path.join(rootDir, 'sites.config.js');
+      const configModule = await import(configPath);
+      config = configModule.default || {};
+    } catch (e) {
+      // Config file is optional, continue without it
+    }
   }
 
-  // Load data
-  const records = await loadItems({
-    path: recordsPath,
-    name: "records",
-    isYaml: true,
+  const build = createSiteBuilder({ 
+    fs, 
+    rootDir,
+    mdRender: mdRender || config.mdRender 
   });
-
-  const components = await loadItems({
-    path: join(__dirname, "./components"),
-    name: "components",
-    isYaml: false,
-  });
-
-  if (componentsPath) {
-    const customComponents = await loadItems({
-      path: componentsPath,
-      name: "components",
-      isYaml: false,
-    });
-    Object.assign(components, customComponents);
-  }
-
-  const collections = await loadCollections(pagesPath);
-
-  const liquidParse = createTemplateRenderer({
-    templates,
-    filters: {
-      json: (obj) => JSON.stringify(obj),
-      "json-escaped": (obj) => {
-        if (!obj) {
-          return "";
-        }
-        return encodeURIComponent(JSON.stringify(obj));
-      },
-      postDate: (dateObj) => {
-        if (!dateObj || typeof dateObj !== 'string') {
-          return ''; // Return empty string or some default value if dateObj is undefined or not a string
-        }
-        try {
-          return DateTime.fromFormat(dateObj, "yyyy-MM-dd").toLocaleString(
-            DateTime.DATE_MED
-          );
-        } catch (error) {
-          console.error(`Error formatting date "${dateObj}":`, error.message);
-          return dateObj; // Return the original date string if parsing fails
-        }
-      },
-    },
-  });
-
-  let data;
-  try {
-    data = safeYamlLoad(liquidParse(inputYaml, { collections }));
-  } catch (error) {
-    console.error("Error creating template renderer:", error);
-    throw error;
-  }
-
-  // Create global data object for templates
-  const globalData = {
-    data,
-    collections,
-    records,
-  };
-
-  const yamlComponentRenderer = (content) => {
-    const renderedContent = liquidParse(content, globalData);
-    const yamlContent = safeYamlLoad(renderedContent);
-
-    return yamlContent
-      .map(({ component, data }) => {
-        const foundComponent = components[component];
-        if (!foundComponent) {
-          throw new Error(`Component not found for ${component}`);
-        }
-        return liquidParse(foundComponent, deepMerge(globalData, data));
-      })
-      .join("\n");
-  };
-
-  const md = configureMarkdown({
-    yamlComponentRenderer,
-  });
-
-  const fileFormatHandlers = createFileFormatHandlers({
-    basePath: pagesPath,
-    templates,
-    liquidParse,
-    data: globalData.data,
-    collections,
-    md,
-  });
-
-  try {
-    await rm(outputPath, { recursive: true, force: true });
-    await createFolderIfNotExists(outputPath);
-    await copyDirRecursive(pagesPath, outputPath, fileFormatHandlers);
-    console.log(`Pages copied from ${pagesPath} to ${outputPath} successfully`);
-  } catch (error) {
-    console.error(
-      `Error copying pages from ${pagesPath} to ${outputPath}:`,
-      error
-    );
-  }
-};
+  
+  build();
+};

package/src/cli/index.js

@@ -1,5 +1,5 @@
-import { copyPagesToSite } from './build.js';
+import { buildSite } from './build.js';
 
 export {
-  copyPagesToSite,
+  buildSite,
 }

package/src/createSiteBuilder.js

@@ -0,0 +1,261 @@
+import { convertToHtml } from 'yahtml';
+import { parseAndRender } from 'jempl';
+import path from 'path';
+import yaml from 'js-yaml';
+
+import MarkdownIt from 'markdown-it';
+
+export function createSiteBuilder({ fs, rootDir = '.', mdRender }) {
+  return function build() {
+    // Use provided mdRender or default to standard markdown-it
+    const md = mdRender || MarkdownIt();
+
+    // Read all partials and create a JSON object
+    const partialsDir = path.join(rootDir, 'partials');
+    const partials = {};
+
+    if (fs.existsSync(partialsDir)) {
+      const files = fs.readdirSync(partialsDir);
+      files.forEach(file => {
+        const filePath = path.join(partialsDir, file);
+        const fileContent = fs.readFileSync(filePath, 'utf8');
+        const nameWithoutExt = path.basename(file, path.extname(file));
+        // Convert partial content from YAML string to JSON
+        partials[nameWithoutExt] = yaml.load(fileContent, { schema: yaml.JSON_SCHEMA });
+      });
+    }
+
+    // Read all data files and create a JSON object
+    const dataDir = path.join(rootDir, 'data');
+    const globalData = {};
+
+    if (fs.existsSync(dataDir)) {
+      const files = fs.readdirSync(dataDir);
+      files.forEach(file => {
+        if (file.endsWith('.yaml') || file.endsWith('.yml')) {
+          const filePath = path.join(dataDir, file);
+          const fileContent = fs.readFileSync(filePath, 'utf8');
+          const nameWithoutExt = path.basename(file, path.extname(file));
+          // Load YAML content and store under filename key
+          globalData[nameWithoutExt] = yaml.load(fileContent, { schema: yaml.JSON_SCHEMA });
+        }
+      });
+    }
+
+    // Read all templates and create a JSON object
+    const templatesDir = path.join(rootDir, 'templates');
+    const templates = {};
+
+    function readTemplatesRecursively(dir, basePath = '') {
+      if (!fs.existsSync(dir)) return;
+
+      const items = fs.readdirSync(dir, { withFileTypes: true });
+
+      items.forEach(item => {
+        const itemPath = path.join(dir, item.name);
+
+        if (item.isDirectory()) {
+          // Recursively read subdirectories
+          const newBasePath = basePath ? `${basePath}/${item.name}` : item.name;
+          readTemplatesRecursively(itemPath, newBasePath);
+        } else if (item.isFile() && item.name.endsWith('.yaml')) {
+          // Read and convert YAML file
+          const fileContent = fs.readFileSync(itemPath, 'utf8');
+          const nameWithoutExt = path.basename(item.name, '.yaml');
+          const templateKey = basePath ? `${basePath}/${nameWithoutExt}` : nameWithoutExt;
+          templates[templateKey] = yaml.load(fileContent, { schema: yaml.JSON_SCHEMA });
+        }
+      });
+    }
+
+    readTemplatesRecursively(templatesDir);
+
+    // Function to process a single page file
+    function processPage(pagePath, outputRelativePath, isMarkdown = false) {
+      console.log(`Processing ${pagePath}...`);
+
+      // Read page content
+      const pageFileContent = fs.readFileSync(pagePath, 'utf8');
+
+      // Extract frontmatter and content
+      const lines = pageFileContent.split('\n');
+      let frontmatterStart = -1;
+      let frontmatterEnd = -1;
+      let frontmatterCount = 0;
+
+      for (let i = 0; i < lines.length; i++) {
+        if (lines[i].trim() === '---') {
+          frontmatterCount++;
+          if (frontmatterCount === 1) {
+            frontmatterStart = i + 1;
+          } else if (frontmatterCount === 2) {
+            frontmatterEnd = i;
+            break;
+          }
+        }
+      }
+
+      // Store frontmatter
+      let frontmatter = {};
+      if (frontmatterStart > 0 && frontmatterEnd > frontmatterStart) {
+        const frontmatterContent = lines.slice(frontmatterStart, frontmatterEnd).join('\n');
+        frontmatter = yaml.load(frontmatterContent, { schema: yaml.JSON_SCHEMA }) || {};
+      }
+
+      // Get content after frontmatter
+      const contentStart = frontmatterEnd + 1;
+      const rawContent = lines.slice(contentStart).join('\n').trim();
+
+      // Merge global data with frontmatter for the page context
+      const pageData = { ...globalData, ...frontmatter };
+
+      let processedPageContent;
+
+      if (isMarkdown) {
+        // Process markdown content with MarkdownIt
+        const htmlContent = md.render(rawContent);
+        // For markdown, store as raw HTML that will be inserted directly
+        processedPageContent = { __html: htmlContent };
+      } else {
+        // Convert YAML content to JSON
+        const pageContent = yaml.load(rawContent, { schema: yaml.JSON_SCHEMA });
+        // Process the page content to resolve any $partial references with page data
+        processedPageContent = parseAndRender(pageContent, pageData, { partials });
+      }
+
+      // Find the template specified in frontmatter
+      let templateToUse = null;
+      if (frontmatter.template) {
+        // Look up template by exact path
+        templateToUse = templates[frontmatter.template];
+        if (!templateToUse) {
+          throw new Error(`Template "${frontmatter.template}" not found in ${pagePath}. Available templates: ${Object.keys(templates).join(', ')}`);
+        }
+      }
+
+      // Use the template with jempl to render the processed page content
+      let htmlString;
+
+      if (isMarkdown) {
+        if (templateToUse) {
+          // For markdown with template, use a placeholder and replace after
+          const placeholder = '___MARKDOWN_CONTENT_PLACEHOLDER___';
+          const templateData = { ...pageData, content: placeholder };
+          const templateResult = parseAndRender(templateToUse, templateData, { partials });
+          htmlString = convertToHtml(templateResult);
+          // Replace the placeholder with actual HTML content
+          htmlString = htmlString.replace(placeholder, processedPageContent.__html);
+        } else {
+          // Markdown without template - use HTML directly
+          htmlString = processedPageContent.__html;
+        }
+      } else {
+        // YAML content
+        const templateData = { ...pageData, content: processedPageContent };
+        const result = templateToUse
+          ? parseAndRender(templateToUse, templateData, { partials })
+          : processedPageContent;
+        htmlString = convertToHtml(result);
+      }
+
+      // Create output directory if it doesn't exist
+      const outputPath = path.join(rootDir, '_site', outputRelativePath);
+      const outputDir = path.dirname(outputPath);
+      if (!fs.existsSync(outputDir)) {
+        fs.mkdirSync(outputDir, { recursive: true });
+      }
+
+      // Write HTML to output file
+      fs.writeFileSync(outputPath, htmlString);
+      console.log(`  -> Written to ${outputPath}`);
+    }
+
+    // Process all YAML and Markdown files in pages directory recursively
+    function processAllPages(dir, basePath = '') {
+      const pagesDir = path.join(rootDir, 'pages');
+      const fullDir = path.join(pagesDir, basePath);
+
+      if (!fs.existsSync(fullDir)) return;
+
+      const items = fs.readdirSync(fullDir, { withFileTypes: true });
+
+      for (const item of items) {
+        const itemPath = path.join(fullDir, item.name);
+        const relativePath = basePath ? path.join(basePath, item.name) : item.name;
+
+        if (item.isDirectory()) {
+          // Recursively process subdirectories
+          processAllPages(dir, relativePath);
+        } else if (item.isFile()) {
+          if (item.name.endsWith('.yaml')) {
+            // Process YAML file
+            const outputFileName = item.name.replace('.yaml', '.html');
+            const outputRelativePath = basePath ? path.join(basePath, outputFileName) : outputFileName;
+            processPage(itemPath, outputRelativePath, false);
+          } else if (item.name.endsWith('.md')) {
+            // Process Markdown file
+            const outputFileName = item.name.replace('.md', '.html');
+            const outputRelativePath = basePath ? path.join(basePath, outputFileName) : outputFileName;
+            processPage(itemPath, outputRelativePath, true);
+          }
+          // Ignore other file types
+        }
+      }
+    }
+
+    // Function to copy static files recursively
+    function copyStaticFiles() {
+      const staticDir = path.join(rootDir, 'static');
+      const outputDir = path.join(rootDir, '_site');
+      
+      if (!fs.existsSync(staticDir)) {
+        return;
+      }
+      
+      // Ensure output directory exists
+      if (!fs.existsSync(outputDir)) {
+        fs.mkdirSync(outputDir, { recursive: true });
+      }
+      
+      function copyRecursive(src, dest) {
+        const stats = fs.statSync(src);
+        
+        if (stats.isDirectory()) {
+          // Create directory if it doesn't exist
+          if (!fs.existsSync(dest)) {
+            fs.mkdirSync(dest, { recursive: true });
+          }
+          
+          // Copy all items in directory
+          const items = fs.readdirSync(src);
+          items.forEach(item => {
+            copyRecursive(path.join(src, item), path.join(dest, item));
+          });
+        } else if (stats.isFile()) {
+          // Copy file
+          fs.copyFileSync(src, dest);
+          console.log(`  -> Copied ${src} to ${dest}`);
+        }
+      }
+      
+      console.log('Copying static files...');
+      const items = fs.readdirSync(staticDir);
+      items.forEach(item => {
+        const srcPath = path.join(staticDir, item);
+        const destPath = path.join(outputDir, item);
+        copyRecursive(srcPath, destPath);
+      });
+    }
+
+    // Start build process
+    console.log('Starting build process...');
+    
+    // Copy static files first (they can be overwritten by pages)
+    copyStaticFiles();
+    
+    // Process all pages (can overwrite static files)
+    processAllPages('');
+    
+    console.log('Build complete!');
+  };
+}

package/src/index.js

@@ -0,0 +1,3 @@
+export { createSiteBuilder } from './createSiteBuilder.js';
+export { createRtglMarkdown } from './rtglMarkdown.js';
+export { default as rtglMarkdown } from './rtglMarkdown.js';

package/src/rtglMarkdown.js

@@ -0,0 +1,126 @@
+import MarkdownIt from 'markdown-it';
+
+// Simple slug generation function
+function generateSlug(text) {
+  return text
+    .toLowerCase()
+    .trim()
+    .replace(/[^\w\s-]/g, '')
+    .replace(/[\s_-]+/g, '-')
+    .replace(/^-+|-+$/g, '');
+}
+
+/**
+ * Custom Markdown renderer configuration for Rettangoli
+ * Adds rtgl-specific elements and styling
+ */
+export const createRtglMarkdown = () => {
+  const md = MarkdownIt({
+    // Additional configuration can be added here
+  });
+
+  // Header configuration
+  md.renderer.rules.heading_open = (tokens, idx, options, env, self) => {
+    const token = tokens[idx];
+    const level = token.markup.length;
+    const inlineToken = tokens[idx + 1];
+    const headingText = inlineToken.content;
+    const id = generateSlug(headingText);
+
+    // Map heading levels to size values
+    const sizes = { 1: "h1", 2: "h2", 3: "h3", 4: "h4" };
+    const size = sizes[level] || "md";
+
+    return `<rtgl-text id="${id}" mt="lg" s="${size}" mb="md"> <a href="#${id}" style="display: contents;">`;
+  };
+
+  md.renderer.rules.heading_close = () => "</a></rtgl-text>\n";
+
+  // Paragraph configuration
+  md.renderer.rules.paragraph_open = (tokens, idx, options, env, self) => {
+    // Check if we're inside a list item
+    let isInListItem = false;
+    for (let i = idx - 1; i >= 0; i--) {
+      if (tokens[i].type === 'list_item_open') {
+        isInListItem = true;
+        break;
+      }
+      if (tokens[i].type === 'list_item_close') {
+        break;
+      }
+    }
+    
+    // Don't wrap paragraphs in list items with rtgl-text
+    if (isInListItem) {
+      return '';
+    }
+    return `<rtgl-text s="bl" mb="lg">`;
+  };
+  
+  md.renderer.rules.paragraph_close = (tokens, idx, options, env, self) => {
+    // Check if we're inside a list item
+    let isInListItem = false;
+    for (let i = idx - 1; i >= 0; i--) {
+      if (tokens[i].type === 'list_item_open') {
+        isInListItem = true;
+        break;
+      }
+      if (tokens[i].type === 'list_item_close') {
+        break;
+      }
+    }
+    
+    // Don't wrap paragraphs in list items with rtgl-text
+    if (isInListItem) {
+      return '\n';
+    }
+    return "</rtgl-text>\n";
+  };
+
+  // Table configuration
+  md.renderer.rules.table_open = () => '<rtgl-view w="f">\n<table>';
+  md.renderer.rules.table_close = () => "</table>\n</rtgl-view>";
+
+  // Link configuration - add target="_blank" to all external links
+  md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
+    const token = tokens[idx];
+    const targetIndex = token.attrIndex("target");
+    const href =
+      (token.attrs && token.attrs.find((attr) => attr[0] === "href")?.[1]) ||
+      "";
+    const isExternal = href.startsWith("http") || href.startsWith("//");
+
+    // If this is an external link or already has target="_blank"
+    if (isExternal || targetIndex >= 0) {
+      if (targetIndex < 0) {
+        token.attrPush(["target", "_blank"]);
+      }
+      token.attrPush(["rel", "noreferrer"]);
+
+      // Find the next text token to use for the aria-label
+      let nextIdx = idx + 1;
+      let textContent = "";
+      while (nextIdx < tokens.length && tokens[nextIdx].type !== "link_close") {
+        if (tokens[nextIdx].type === "text") {
+          textContent += tokens[nextIdx].content;
+        }
+        nextIdx++;
+      }
+
+      // Add aria-label for external links
+      if (textContent.trim() && token.attrIndex("aria-label") < 0) {
+        token.attrPush([
+          "aria-label",
+          `${textContent.trim()} (opens in new tab)`,
+        ]);
+      }
+    }
+
+    return self.renderToken(tokens, idx, options);
+  };
+
+  return md;
+};
+
+// Export a default instance for convenience
+export default createRtglMarkdown();