feat: first version

Author: darlanalves

.github/workflows/cicd.yml

@@ -0,0 +1,10 @@
+name: release
+on:
+  push:
+
+jobs:
+  build:
+    uses: cloud-cli/workflows/.github/workflows/npm-build-release.yml@main
+    secrets:
+      NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -0,0 +1,5 @@
+node_modules
+dist/
+.cache
+coverage/
+index.js

.npmignore

@@ -0,0 +1,10 @@
+.github
+src/
+coverage/
+rollup.config.js
+tsconfig*
+.cache
+.prettierrc
+karma*
+test/
+test.js

README.md

@@ -1,2 +1,3 @@
-# parse-html-runtime
+# @homebots/parse-html-runtime
+
 Runtime extensions for @homebots/parse-html

package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@homebots/parse-html-runtime",
+  "version": "0.0.0-dev",
+  "description": "Runtime extension for @homebots/parse-html",
+  "main": "./index.js",
+  "typings": "./dist/index.d.ts",
+  "type": "module",
+  "scripts": {
+    "clean": "rm -rf dist/",
+    "test": "echo true",
+    "build": "npm run clean && tsc --project ./tsconfig.json && npm run rollup",
+    "rollup": "./node_modules/.bin/rollup -c rollup.config.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/homebots/parse-html-runtime.git"
+  },
+  "author": "Darlan Alves <me@darlanalv.es>",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^24.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-typescript": "^10.0.1",
+    "@types/node": "^20.0.0",
+    "rollup": "^2.79.1",
+    "ts-node": "^10.9.1",
+    "tslib": "^2.4.1",
+    "typescript": "^4.9.4",
+    "@homebots/parse-html": "^1.0.0"
+  }
+}

rollup.config.js

@@ -0,0 +1,17 @@
+import typescript from "@rollup/plugin-typescript";
+import commonjs from "@rollup/plugin-commonjs";
+import resolve from "@rollup/plugin-node-resolve";
+
+export default {
+  input: "src/index.ts",
+  external: [],
+  output: {
+    dir: ".",
+    format: "es",
+  },
+  plugins: [
+    typescript({ module: "esnext" }),
+    resolve(),
+    commonjs({ extensions: [".js", ".ts"] }),
+  ],
+};

src/index.ts

@@ -0,0 +1,5 @@
+export { normalize } from './normalize';
+export { serialize } from './serialize';
+export { materialize, createComment, createElement, createTextNode } from './materialize';
+export type { Visitor } from './materialize';
+export type { ParserNode, ParserAttribute, CommentNode, TextNode, ElementNode } from '@homebots/parse-html';

src/materialize.ts

@@ -0,0 +1,70 @@
+import type { ParserNode, ParserAttribute, CommentNode, TextNode, ElementNode } from '@homebots/parse-html';
+
+const validAttribute = /^[a-z][a-z0-9-]+$/;
+const noop = () => {};
+
+export type Visitor = <T>(el: T, node: ParserNode) => T | null | undefined | void;
+
+export function materialize(node: ParserNode, visitor: Visitor = noop) {
+  let el: any;
+
+  switch (node.type) {
+    case 'document': {
+      el = document.createDocumentFragment();
+      el.append(...node.children.map((n) => materialize(n, visitor)));
+      break;
+    }
+
+    case 'text':
+      el = createTextNode(node);
+      break;
+
+    case 'comment':
+      el = createComment(node);
+      break;
+
+    case 'element': {
+      el = createElement(node);
+      el.append(...node.children.map((n) => materialize(n, visitor)));
+      break;
+    }
+
+    default:
+      throw new Error(`Invalid node type: ${(node as any).type}`);
+  }
+
+  return visitor(el, node) || el;
+}
+
+export function createComment(node: CommentNode) {
+  return document.createComment(node.text);
+}
+
+export function createTextNode(node: TextNode) {
+  return document.createTextNode(node.text);
+}
+
+export function createElement(node: ElementNode) {
+  const el = document.createElement(node.tag);
+  el['@attributes'] = node.attributes;
+  node.attributes.forEach((a: ParserAttribute) => setAttribute(el, a.name, a.value));
+
+  return el;
+}
+
+export function setAttribute(el: HTMLElement, attribute: string, value: string | number | boolean) {
+  if (!validAttribute.test(attribute)) {
+    return;
+  }
+
+  if (typeof value === 'boolean' && value === false) {
+    el.removeAttribute(attribute);
+    return;
+  }
+
+  el.setAttribute(attribute, String(value));
+}
+
+export function setProperty(el: HTMLElement, property: string, value: any) {
+  el[property] = value;
+}

src/normalize.ts

@@ -0,0 +1,14 @@
+export function normalize(node) {
+  if (!node.children) return node;
+
+  node.children = node.children.filter((child) => {
+    if (child.type === 'text' && child.text.trim() === '') {
+      return false;
+    }
+
+    normalize(child);
+    return true;
+  });
+
+  return node;
+}

src/serialize.ts

@@ -0,0 +1,27 @@
+import type { ParserNode } from './types';
+
+export function serialize(node: ParserNode) {
+  switch (node.type) {
+    case 'document':
+      return node.children.map(serialize).join('');
+
+    case 'text':
+      return node.text;
+
+    case 'comment':
+      return `<!-- ${node.text} -->`;
+
+    case 'element':
+      const attr = node.attributes.length
+        ? ' ' + node.attributes.map((a) => (a.value !== '' ? `${a.name}="${a.value}"` : a.name)).join(' ')
+        : '';
+
+      const children = node.children.map(serialize).join('');
+
+      if (node.selfClose) {
+        return `<${node.tag} ${attr}/>`;
+      }
+
+      return `<${node.tag}${attr}>${children}</${node.tag}>`;
+  }
+}

tsconfig.json

@@ -0,0 +1,18 @@
+{
+  "compileOnSave": true,
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "target": "es2020",
+    "lib": ["ESNext", "DOM"],
+    "experimentalDecorators": true,
+    "emitDecoratorMetadata": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "typeRoots": ["./node_modules/@types"],
+    "outDir": "./dist",
+    "declaration": true,
+    "baseUrl": "."
+  },
+  "files": ["src/index.ts"],
+  "include": ["src/**/*.ts"]
+}