@domql/element 3.0.1 → 3.0.6

package/create.js

@@ -16,7 +16,6 @@ import {
   OPTIONS,
   initProps,
   createIfConditionFlag,
-  deepClone,
   createRoot
 } from '@domql/utils'
 
@@ -50,16 +49,8 @@ export const create = async (
 
   createRoot(element, parent) // Call createRoot after addCaching
 
-  if (element.key === 'BannerHgroup') {
-    console.warn(deepClone(element))
-  }
-
   applyExtends(element, parent, options)
 
-  if (element.key === 'BannerHgroup') {
-    console.warn(deepClone(element))
-  }
-
   propertizeElement(element, parent)
 
   await triggerEventOn('start', element, options)
@@ -68,10 +59,6 @@ export const create = async (
     return onlyResolveExtends(element, parent, key, options)
   }
 
-  if (element.key === 'BannerHgroup') {
-    console.warn(element)
-  }
-
   resetOptions(element, parent, options)
 
   addMethods(element, parent, options)

package/dist/cjs/create.js

@@ -39,21 +39,12 @@ const create = async (props, parentEl, passedKey, options = import_utils.OPTIONS
   if (!element) return;
   const { key, parent, __ref: ref } = element;
   (0, import_utils.createRoot)(element, parent);
-  if (element.key === "BannerHgroup") {
-    console.warn((0, import_utils.deepClone)(element));
-  }
   (0, import_utils.applyExtends)(element, parent, options);
-  if (element.key === "BannerHgroup") {
-    console.warn((0, import_utils.deepClone)(element));
-  }
   (0, import_utils.propertizeElement)(element, parent);
   await (0, import_event.triggerEventOn)("start", element, options);
   if (options.onlyResolveExtends) {
     return onlyResolveExtends(element, parent, key, options);
   }
-  if (element.key === "BannerHgroup") {
-    console.warn(element);
-  }
   resetOptions(element, parent, options);
   (0, import_set.addMethods)(element, parent, options);
   (0, import_utils.createScope)(element, parent);

package/dist/cjs/mixins/classList.js

@@ -29,9 +29,9 @@ module.exports = __toCommonJS(classList_exports);
 var import_utils = require("@domql/utils");
 const assignKeyAsClassname = (element) => {
   const { key } = element;
-  if (element.class === true) element.class = key;
-  else if (!element.class && typeof key === "string" && key.charAt(0) === "_" && key.charAt(1) !== "_") {
-    element.class = key.slice(1);
+  if (element.classlist === true) element.classlist = key;
+  else if (!element.classlist && typeof key === "string" && key.charAt(0) === "_" && key.charAt(1) !== "_") {
+    element.classlist = key.slice(1);
   }
 };
 const classify = (obj, element) => {
@@ -49,11 +49,10 @@ const classify = (obj, element) => {
 const classList = (params, element) => {
   if (!params) return;
   const { key } = element;
-  if (params === true) params = element.class = { key };
-  if ((0, import_utils.isString)(params)) params = element.class = { default: params };
+  if (params === true) params = element.classlist = { key };
+  if ((0, import_utils.isString)(params)) params = element.classlist = { default: params };
   if ((0, import_utils.isObject)(params)) params = classify(params, element);
   const className = params.replace(/\s+/g, " ").trim();
-  if (element.ref) element.ref.class = className;
   return className;
 };
 const applyClassListOnNode = (params, element, node) => {

package/dist/cjs/mixins/registry.js

@@ -42,11 +42,11 @@ var import_style = __toESM(require("./style.js"), 1);
 var import_text = __toESM(require("./text.js"), 1);
 const REGISTRY = {
   attr: import_attr.default,
-  style: import_style.default,
+  styles: import_style.default,
   text: import_text.default,
   html: import_html.default,
   data: import_data.default,
-  class: import_classList.classList,
+  classlist: import_classList.classList,
   state: import_state.default,
   scope: import_scope.default,
   deps: (param, el) => param || el.parent.deps,

package/dist/cjs/set.js

@@ -77,7 +77,7 @@ const updateContent = async function(params, opts) {
 async function setContent(param, element, opts) {
   const content = await (0, import_utils.execPromise)(param, element);
   if (content && element) {
-    set.call(element, content, opts);
+    await set.call(element, content, opts);
   }
 }
 const removeContent = function(el, opts = {}) {

package/dist/esm/create.js

@@ -13,7 +13,6 @@ import {
   OPTIONS,
   initProps,
   createIfConditionFlag,
-  deepClone,
   createRoot
 } from "@domql/utils";
 import { applyAnimationFrame, triggerEventOn } from "@domql/event";
@@ -30,21 +29,12 @@ const create = async (props, parentEl, passedKey, options = OPTIONS.create || {}
   if (!element) return;
   const { key, parent, __ref: ref } = element;
   createRoot(element, parent);
-  if (element.key === "BannerHgroup") {
-    console.warn(deepClone(element));
-  }
   applyExtends(element, parent, options);
-  if (element.key === "BannerHgroup") {
-    console.warn(deepClone(element));
-  }
   propertizeElement(element, parent);
   await triggerEventOn("start", element, options);
   if (options.onlyResolveExtends) {
     return onlyResolveExtends(element, parent, key, options);
   }
-  if (element.key === "BannerHgroup") {
-    console.warn(element);
-  }
   resetOptions(element, parent, options);
   addMethods(element, parent, options);
   createScope(element, parent);

package/dist/esm/mixins/classList.js

@@ -1,9 +1,9 @@
 import { exec, isObject, isString } from "@domql/utils";
 const assignKeyAsClassname = (element) => {
   const { key } = element;
-  if (element.class === true) element.class = key;
-  else if (!element.class && typeof key === "string" && key.charAt(0) === "_" && key.charAt(1) !== "_") {
-    element.class = key.slice(1);
+  if (element.classlist === true) element.classlist = key;
+  else if (!element.classlist && typeof key === "string" && key.charAt(0) === "_" && key.charAt(1) !== "_") {
+    element.classlist = key.slice(1);
   }
 };
 const classify = (obj, element) => {
@@ -21,11 +21,10 @@ const classify = (obj, element) => {
 const classList = (params, element) => {
   if (!params) return;
   const { key } = element;
-  if (params === true) params = element.class = { key };
-  if (isString(params)) params = element.class = { default: params };
+  if (params === true) params = element.classlist = { key };
+  if (isString(params)) params = element.classlist = { default: params };
   if (isObject(params)) params = classify(params, element);
   const className = params.replace(/\s+/g, " ").trim();
-  if (element.ref) element.ref.class = className;
   return className;
 };
 const applyClassListOnNode = (params, element, node) => {

package/dist/esm/mixins/registry.js

@@ -4,15 +4,15 @@ import data from "./data.js";
 import html from "./html.js";
 import scope from "./scope.js";
 import state from "./state.js";
-import style from "./style.js";
+import styles from "./style.js";
 import text from "./text.js";
 const REGISTRY = {
   attr,
-  style,
+  styles,
   text,
   html,
   data,
-  class: classList,
+  classlist: classList,
   state,
   scope,
   deps: (param, el) => param || el.parent.deps,

package/dist/esm/set.js

@@ -47,7 +47,7 @@ const updateContent = async function(params, opts) {
 async function setContent(param, element, opts) {
   const content = await execPromise(param, element);
   if (content && element) {
-    set.call(element, content, opts);
+    await set.call(element, content, opts);
   }
 }
 const removeContent = function(el, opts = {}) {

package/mixins/classList.js

@@ -4,14 +4,14 @@ import { exec, isObject, isString } from '@domql/utils'
 
 export const assignKeyAsClassname = element => {
   const { key } = element
-  if (element.class === true) element.class = key
+  if (element.classlist === true) element.classlist = key
   else if (
-    !element.class &&
+    !element.classlist &&
     typeof key === 'string' &&
     key.charAt(0) === '_' &&
     key.charAt(1) !== '_'
   ) {
-    element.class = key.slice(1)
+    element.classlist = key.slice(1)
   }
 }
 
@@ -32,12 +32,11 @@ export const classify = (obj, element) => {
 export const classList = (params, element) => {
   if (!params) return
   const { key } = element
-  if (params === true) params = element.class = { key }
-  if (isString(params)) params = element.class = { default: params }
+  if (params === true) params = element.classlist = { key }
+  if (isString(params)) params = element.classlist = { default: params }
   if (isObject(params)) params = classify(params, element)
   // TODO: fails on string
   const className = params.replace(/\s+/g, ' ').trim()
-  if (element.ref) element.ref.class = className // TODO: this check is NOT needed in new DOMQL
   return className
 }
 

package/mixins/registry.js

@@ -6,16 +6,16 @@ import data from './data.js'
 import html from './html.js'
 import scope from './scope.js'
 import state from './state.js'
-import style from './style.js'
+import styles from './style.js'
 import text from './text.js'
 
 export const REGISTRY = {
   attr,
-  style,
+  styles,
   text,
   html,
   data,
-  class: classList,
+  classlist: classList,
   state,
   scope,
   deps: (param, el) => param || el.parent.deps,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "3.0.1",
+  "version": "3.0.6",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -21,19 +21,19 @@
   ],
   "scripts": {
     "copy:package:cjs": "cp ../../build/package-cjs.json dist/cjs/package.json",
-    "build:esm": "npx esbuild *.js **/*.js --target=es2019 --format=esm --outdir=dist/esm",
-    "build:cjs": "npx esbuild *.js **/*.js --target=node16 --format=cjs --outdir=dist/cjs",
+    "build:esm": "npx esbuild \"*.js\" \"utils/**/*.js\" \"mixins/**/*.js\" \"methods/**/*.js\" --target=es2019 --format=esm --outdir=dist/esm",
+    "build:cjs": "npx esbuild \"*.js\" \"utils/**/*.js\" \"mixins/**/*.js\" \"methods/**/*.js\" --target=node16 --format=cjs --outdir=dist/cjs",
     "build": "rimraf -I dist; npm run build:cjs; npm run build:esm",
     "prepublish": "rimraf -I dist && npm run build && npm run copy:package:cjs"
   },
   "dependencies": {
-    "@domql/event": "^3.0.1",
-    "@domql/render": "^3.0.1",
+    "@domql/event": "^3.0.6",
+    "@domql/render": "^3.0.6",
     "@domql/report": "^3.0.0",
-    "@domql/state": "^3.0.1",
-    "@domql/utils": "^3.0.1"
+    "@domql/state": "^3.0.6",
+    "@domql/utils": "^3.0.6"
   },
-  "gitHead": "bdadc70a00c5ddde21ca889746bf28db0c3d7c2f",
+  "gitHead": "ef6f7abdb0a8cdaa28559e377bc10a12e76ef8f0",
   "devDependencies": {
     "@babel/core": "^7.12.0"
   }

package/set.js

@@ -58,7 +58,7 @@ export async function setContent (param, element, opts) {
   const content = await execPromise(param, element)
 
   if (content && element) {
-    set.call(element, content, opts)
+    await set.call(element, content, opts)
   }
 }
 

package/dist/cjs/__tests__/checkIfOnUpdate.test.js

@@ -1,73 +0,0 @@
-var import_update = require("../update");
-describe("checkIfOnUpdate via update()", () => {
-  let element, parent, options;
-  beforeEach(() => {
-    parent = {
-      node: document.createElement("div"),
-      props: {},
-      state: {}
-    };
-    element = {
-      __ref: {
-        __if: void 0,
-        __state: null,
-        __hasRootState: false,
-        __execProps: {},
-        contentElementKey: "content"
-      },
-      parent,
-      props: {},
-      state: {
-        update: (el, st) => {
-          return st;
-        }
-      },
-      context: {
-        defaultExtends: {}
-      },
-      node: document.createElement("div"),
-      if: () => true,
-      previousElement: () => {
-        return {};
-      },
-      nextElement: () => {
-        return {};
-      },
-      removeContent: () => {
-        return true;
-      }
-    };
-    options = {};
-  });
-  it("uses props.if when element.if missing", async () => {
-    delete element.if;
-    element.props.if = () => false;
-    await import_update.update.call(element, {}, options);
-    expect(element.node).toEqual(document.createElement("div"));
-  });
-  it("retains state when __hasRootState=true", async () => {
-    element.__ref.__hasRootState = true;
-    element.state.critical = true;
-    element.__ref.__if = false;
-    await import_update.update.call(element, {}, options);
-    expect(element.state.critical).toBe(true);
-    expect(element.state.preserved).toBeUndefined();
-  });
-  it("processes nested content with parseDeep", async () => {
-    element.content = {
-      parseDeep: () => ({ parsed: true }),
-      existing: "data"
-    };
-    await import_update.update.call(element, {}, options);
-    expect(element.content.parsed).toBe(true);
-    expect(element.content.existing).toBeUndefined();
-  });
-  it("reattaches after previous sibling", async () => {
-    const prevNode = document.createElement("span");
-    parent.node.appendChild(prevNode);
-    await import_update.update.call(element, {}, options);
-    const newElement = parent.node.children[0];
-    expect(newElement).toEqual(document.createElement("span"));
-    expect(newElement.previousSibling).toBe(null);
-  });
-});

package/dist/cjs/__tests__/children.test.js

@@ -1,177 +0,0 @@
-var import_globals = require("@jest/globals");
-var import_children = require("../children");
-describe("children", () => {
-  let element, node;
-  beforeEach(() => {
-    element = {
-      __ref: {},
-      state: {},
-      props: {},
-      call: import_globals.jest.fn(),
-      removeContent: import_globals.jest.fn(),
-      content: null
-    };
-    node = {};
-  });
-  it("handles null/undefined params", async () => {
-    const result = await (0, import_children.setChildren)(null, element, node);
-    expect(result).toBeUndefined();
-  });
-  it("handles direct string children", async () => {
-    const result = await (0, import_children.setChildren)("Hello World", element, node);
-    expect(result).toEqual({ tag: "fragment", 0: { text: "Hello World" } });
-  });
-  it("handles numeric children", async () => {
-    const result = await (0, import_children.setChildren)(42, element, node);
-    expect(result).toEqual({ tag: "fragment", 0: { text: 42 } });
-  });
-  it("handles array of primitive values with childrenAs prop", async () => {
-    const result = await (0, import_children.setChildren)(["one", "two"], element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { text: "one" },
-      1: { text: "two" }
-    });
-  });
-  it("handles array of primitive values with childrenAs state", async () => {
-    element.props.childrenAs = "state";
-    const result = await (0, import_children.setChildren)(["one", "two"], element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { state: { value: "one" } },
-      1: { state: { value: "two" } }
-    });
-  });
-  it("caches children and detects changes", async () => {
-    const children1 = [{ id: 1 }, { id: 2 }];
-    const children2 = [{ id: 1 }, { id: 2 }];
-    const children3 = [{ id: 1 }, { id: 3 }];
-    await (0, import_children.setChildren)(children1, element, node);
-    expect(element.__ref.__childrenCache).toEqual(children1);
-    expect(element.__ref.__noChildrenDifference).toBeUndefined();
-    await (0, import_children.setChildren)(children2, element, node);
-    expect(element.__ref.__noChildrenDifference).toBe(true);
-    await (0, import_children.setChildren)(children3, element, node);
-    expect(element.__ref.__noChildrenDifference).toBeUndefined();
-    expect(element.__ref.__childrenCache).toEqual(children3);
-  });
-  it("handles mixed React and normal components", async () => {
-    const mixedChildren = [
-      { type: "div", text: "Normal" },
-      { $$typeof: Symbol("react") },
-      { type: "span", text: "Another" }
-    ];
-    await (0, import_children.setChildren)(mixedChildren, element, node);
-    expect(element.call).toHaveBeenCalledWith(
-      "renderReact",
-      [mixedChildren[1]],
-      element
-    );
-  });
-  it("handles state-based children", async () => {
-    element.state = {
-      items: ["a", "b"],
-      parse: () => ["parsed a", "parsed b"]
-    };
-    const result = await (0, import_children.setChildren)("state", element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { text: "parsed a" },
-      1: { text: "parsed b" }
-    });
-  });
-  it("handles async function parameters", async () => {
-    const asyncParam = async () => ["async1", "async2"];
-    const result = await (0, import_children.setChildren)(asyncParam, element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { text: "async1" },
-      1: { text: "async2" }
-    });
-  });
-  it("handles nested object structures", async () => {
-    const nestedChildren = {
-      header: { text: "Title" },
-      content: {
-        nested: { text: "Content" }
-      }
-    };
-    const result = await (0, import_children.setChildren)(nestedChildren, element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { text: "Title" },
-      1: { nested: { text: "Content" } }
-    });
-  });
-  it("handles empty arrays and objects", async () => {
-    let result = await (0, import_children.setChildren)([], element, node);
-    expect(result).toEqual({
-      tag: "fragment"
-    });
-    result = await (0, import_children.setChildren)({}, element, node);
-    expect(result).toEqual({
-      tag: "fragment"
-    });
-  });
-  it("handles falsy values in arrays", async () => {
-    const result = await (0, import_children.setChildren)(
-      [null, void 0, false, 0, ""],
-      element,
-      node
-    );
-    expect(result).toEqual({
-      tag: "fragment",
-      3: { text: 0 },
-      4: { text: "" }
-    });
-  });
-  it("handles React components with falsy values in array", async () => {
-    const mixedChildren = [
-      null,
-      { $$typeof: Symbol("react") },
-      void 0,
-      { $$typeof: Symbol("react") },
-      false
-    ];
-    await (0, import_children.setChildren)(mixedChildren, element, node);
-    expect(element.call).toHaveBeenCalledWith(
-      "renderReact",
-      [mixedChildren[1], mixedChildren[3]],
-      element
-    );
-  });
-  it("handles nested state parsing", async () => {
-    element.state = {
-      nested: {
-        items: ["c", "d"]
-      }
-    };
-    element.state.nested.__proto__.parse = () => ["parsed c", "parsed d"];
-    const result = await (0, import_children.setChildren)("nested", element, node);
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { state: ["c", "d"] }
-    });
-  });
-  it("handles mixed state and regular objects", async () => {
-    element.state = {
-      header: { parse: () => "Header" },
-      footer: { parse: () => "Footer" }
-    };
-    const result = await (0, import_children.setChildren)(
-      {
-        header: "header",
-        content: { text: "Content" },
-        footer: "footer"
-      },
-      element,
-      node
-    );
-    expect(result).toEqual({
-      tag: "fragment",
-      0: { text: "header" },
-      1: { text: "Content" },
-      2: { text: "footer" }
-    });
-  });
-});

package/dist/cjs/__tests__/define.test.js

@@ -1,75 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var import_define = __toESM(require("../define"), 1);
-var import_mixins = require("../mixins");
-describe("default function (registry updater)", () => {
-  let originalRegistry;
-  beforeEach(() => {
-    originalRegistry = { ...import_mixins.REGISTRY };
-  });
-  afterEach(() => {
-    Object.keys(import_mixins.REGISTRY).forEach((key) => {
-      import_mixins.REGISTRY[key] = originalRegistry[key];
-    });
-  });
-  it("should add new params to REGISTRY when overwrite is true", () => {
-    const params = { newKey: "newValue", anotherKey: "anotherValue" };
-    const options = { overwrite: true };
-    (0, import_define.default)(params, options);
-    expect(import_mixins.REGISTRY.newKey).toBe("newValue");
-    expect(import_mixins.REGISTRY.anotherKey).toBe("anotherValue");
-  });
-  it("should not modify REGISTRY when trying to overwrite existing keys without overwrite option", () => {
-    const params = { attr: "newValue", text: "newText" };
-    try {
-      (0, import_define.default)(params);
-    } catch (e) {
-    }
-    expect(import_mixins.REGISTRY.attr).toBe(originalRegistry.attr);
-    expect(import_mixins.REGISTRY.text).toBe(originalRegistry.text);
-  });
-  it("should overwrite existing keys when overwrite is true", () => {
-    const params = { attr: "newValue", text: "newText" };
-    const options = { overwrite: true };
-    (0, import_define.default)(params, options);
-    expect(import_mixins.REGISTRY.attr).toBe("newValue");
-    expect(import_mixins.REGISTRY.text).toBe("newText");
-  });
-  it("should handle empty params object without errors", () => {
-    const params = {};
-    const options = { overwrite: true };
-    expect(() => (0, import_define.default)(params, options)).not.toThrow();
-    expect(import_mixins.REGISTRY).toEqual(originalRegistry);
-  });
-  it("should handle empty options object without errors", () => {
-    const params = { newKey: "newValue" };
-    expect(() => (0, import_define.default)(params, {})).not.toThrow();
-    expect(import_mixins.REGISTRY.newKey).toBe("newValue");
-  });
-  it("should not add new keys when params is empty", () => {
-    const params = {};
-    const options = { overwrite: true };
-    (0, import_define.default)(params, options);
-    expect(import_mixins.REGISTRY).toEqual(originalRegistry);
-  });
-});