bobe-dom 0.0.67 → 0.0.69

package/dist/bobe-dom.cjs.js

@@ -1,574 +0,0 @@
-'use strict';
-
-var bobe = require('bobe');
-var htmlparser2 = require('htmlparser2');
-
-const BOOLEAN_ATTRS$1 = new Set(['disabled', 'readonly', 'checked', 'selected', 'hidden', 'multiple', 'required', 'autofocus', 'autoplay', 'controls', 'loop', 'muted', 'defer', 'async', 'reversed', 'open', 'itemscope', 'ismap', 'nohref', 'noshade', 'nowrap', 'compact', 'default']);
-const VALUE_PROP_TAGS = new Set(['INPUT', 'TEXTAREA', 'SELECT']);
-const SVG_NS = 'http://www.w3.org/2000/svg';
-const MATH_NS = 'http://www.w3.org/1998/Math/MathML';
-const SVG_TAGS = new Set(['svg', 'animate', 'animateMotion', 'animateTransform', 'circle', 'clipPath', 'defs', 'desc', 'ellipse', 'feBlend', 'feColorMatrix', 'feComponentTransfer', 'feComposite', 'feConvolveMatrix', 'feDiffuseLighting', 'feDisplacementMap', 'feDistantLight', 'feDropShadow', 'feFlood', 'feFuncA', 'feFuncB', 'feFuncG', 'feFuncR', 'feGaussianBlur', 'feImage', 'feMerge', 'feMergeNode', 'feMorphology', 'feOffset', 'fePointLight', 'feSpecularLighting', 'feSpotLight', 'feTile', 'feTurbulence', 'filter', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'marker', 'mask', 'metadata', 'mpath', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'set', 'stop', 'switch', 'symbol', 'textPath', 'tspan', 'use', 'view']);
-const MATH_TAGS = new Set(['math', 'maction', 'maligngroup', 'malignmark', 'menclose', 'merror', 'mfenced', 'mfrac', 'mglyph', 'mi', 'mlabeledtr', 'mlongdiv', 'mmultiscripts', 'mn', 'mo', 'mover', 'mpadded', 'mphantom', 'mroot', 'mrow', 'ms', 'mscarries', 'mscarry', 'msgroup', 'mstack', 'mspace', 'msqrt', 'msrow', 'mstyle', 'msub', 'msup', 'msubsup', 'mtable', 'mtd', 'mtext', 'mtr', 'munder', 'munderover', 'semantics', 'annotation', 'annotation-xml']);
-const isNS = el => el.namespaceURI === SVG_NS || el.namespaceURI === MATH_NS;
-const createNode$1 = name => {
-  if (name === 'text') return document.createTextNode('');
-  if (MATH_TAGS.has(name)) return document.createElementNS(MATH_NS, name);
-  if (SVG_TAGS.has(name)) return document.createElementNS(SVG_NS, name);
-  return document.createElement(name);
-};
-const CONTENT_FLAG = Symbol('hasContent');
-const setProp$1 = (node, key, value) => {
-  const el = node;
-  if (key === 'text') {
-    node[CONTENT_FLAG] = value != null;
-    if (value == null) return;
-    node.textContent = value;
-    return;
-  }
-  if (key.startsWith('on')) {
-    const evtName = key.slice(2);
-    node.addEventListener(evtName, value);
-    return () => node.removeEventListener(evtName, value);
-  }
-  if (key.startsWith('.')) {
-    el.classList.toggle(key.slice(1), !!value);
-    return;
-  }
-  if (key.startsWith('#')) {
-    if (value) el.id = key.slice(1);else el.removeAttribute('id');
-    return;
-  }
-  if (key === 'class') {
-    if (value == null) {
-      el.className = '';
-    } else if (typeof value === 'object' && !Array.isArray(value)) {
-      if (isNS(el)) {
-        const names = Object.entries(value).filter(([, v]) => !!v).map(([k]) => k).join(' ');
-        el.setAttribute('class', names);
-      } else {
-        for (const k in value) {
-          el.classList.toggle(k, !!value[k]);
-        }
-      }
-    } else {
-      const str = typeof value === 'boolean' ? value ? 'true' : '' : String(value);
-      if (isNS(el)) {
-        el.setAttribute('class', str);
-      } else {
-        el.className = str;
-      }
-    }
-    return;
-  }
-  if (key === 'style') {
-    if (value == null) {
-      el.style.cssText = '';
-    } else {
-      el.style.cssText = String(value);
-    }
-    return;
-  }
-  if (key === 'html') {
-    node[CONTENT_FLAG] = value != null;
-    if (value == null) return;
-    node.innerHTML = String(value);
-    return;
-  }
-  if (BOOLEAN_ATTRS$1.has(key)) {
-    if (value === false || value === null || value === undefined) {
-      el.removeAttribute(key);
-    } else {
-      el.setAttribute(key, '');
-    }
-    return;
-  }
-  if ((key === 'value' || key === 'checked') && VALUE_PROP_TAGS.has(el.tagName)) {
-    el[key] = value;
-    return;
-  }
-  if (isNS(el)) {
-    if (value == null) {
-      el.removeAttribute(key);
-    } else {
-      el.setAttribute(key, String(value));
-    }
-    return;
-  }
-  if (key.startsWith('data-') || key.startsWith('aria-')) {
-    if (value == null) {
-      el.removeAttribute(key);
-    } else {
-      el.setAttribute(key, String(value));
-    }
-    return;
-  }
-  if (value == null) {
-    el.removeAttribute(key);
-  } else if (key in el) {
-    el[key] = value;
-  } else {
-    el.setAttribute(key, String(value));
-  }
-};
-const insertAfter$1 = (parent, node, prev) => {
-  if (!prev) parent.insertBefore(node, parent.firstChild);else parent.insertBefore(node, prev.nextSibling);
-};
-const createAnchor$1 = name => document.createComment(name);
-const remove$1 = node => {
-  node.remove();
-};
-const firstChild$1 = node => node.firstChild;
-const nextSib$1 = node => node.nextSibling;
-const beforeIndent$1 = node => {
-  if (node[CONTENT_FLAG]) {
-    const tag = node.tagName?.toLowerCase();
-    const hasText = node.textContent != null;
-    console.warn(`<${tag}> has ${hasText ? 'text' : 'html'} content and child elements — children ignored`);
-    return false;
-  }
-};
-const leaveNode = () => {};
-const leaveLogicNode = () => {};
-const render = bobe.customRender({
-  createNode: createNode$1,
-  setProp: setProp$1,
-  insertAfter: insertAfter$1,
-  createAnchor: createAnchor$1,
-  remove: remove$1,
-  firstChild: firstChild$1,
-  nextSib: nextSib$1,
-  beforeIndent: beforeIndent$1,
-  leaveNode,
-  leaveLogicNode
-});
-
-(function (SSRNodeType) {
-  SSRNodeType[SSRNodeType["Element"] = 0] = "Element";
-  SSRNodeType[SSRNodeType["Text"] = 1] = "Text";
-  SSRNodeType[SSRNodeType["Anchor"] = 2] = "Anchor";
-  SSRNodeType[SSRNodeType["Root"] = 3] = "Root";
-  return SSRNodeType;
-})({});
-class SSRFiber {
-  parent = undefined;
-  next = undefined;
-  child = undefined;
-  html = undefined;
-  openTagEnd = undefined;
-  constructor(type, props = {}) {
-    this.type = type;
-    this.props = props;
-  }
-  querySelector(selector) {
-    const idMatch = selector.match(/#([\w-]+)/);
-    const id = idMatch ? idMatch[1] : null;
-    const classMatches = selector.match(/\.[\w-]+/g);
-    const classes = classMatches ? classMatches.map(c => c.slice(1)) : [];
-    const tag = selector.replace(/#[\w-]+/g, '').replace(/\.[\w-]+/g, '').trim() || null;
-    const walk = node => {
-      if (!node) return null;
-      if (node.type !== 'root' && node.type !== 'anchor' && node.type !== 'text') {
-        if (!tag || node.type === tag) {
-          if (!id || node.props['id'] === id) {
-            if (classes.length === 0 || classes.every(c => (node.props['class'] || '').split(/\s+/).includes(c))) {
-              return node;
-            }
-          }
-        }
-      }
-      return walk(node.child) || walk(node.next);
-    };
-    return walk(this.child);
-  }
-  getElementById(id) {
-    return this.querySelector(`#${id}`);
-  }
-}
-
-function parseHtmlToFibers(html, root) {
-  const stack = [{
-    parent: root,
-    lastChild: null
-  }];
-  const append = node => {
-    const frame = stack[stack.length - 1];
-    if (!frame.parent.child) {
-      frame.parent.child = node;
-    } else if (frame.lastChild) {
-      frame.lastChild.next = node;
-    }
-    frame.lastChild = node;
-    node.parent = frame.parent;
-  };
-  let parserRef;
-  const parser = new htmlparser2.Parser({
-    onparserinit(p) {
-      parserRef = p;
-    },
-    onopentag(name, attribs) {
-      const fiber = new SSRFiber(name, {
-        ...attribs
-      });
-      fiber.openTagEnd = parserRef.endIndex;
-      append(fiber);
-      stack.push({
-        parent: fiber,
-        lastChild: null
-      });
-    },
-    ontext(text) {
-      const fiber = new SSRFiber('text', {
-        text
-      });
-      append(fiber);
-    },
-    onclosetag() {
-      stack.pop();
-      const top = stack[stack.length - 1];
-      top.lastChild ?? null;
-    }
-  });
-  parser.write(html);
-  parser.end();
-}
-
-const VOID_TAGS = new Set(['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link', 'meta', 'param', 'source', 'track', 'wbr']);
-const BOOLEAN_ATTRS = new Set(['disabled', 'readonly', 'checked', 'selected', 'hidden', 'multiple', 'required', 'autofocus', 'autoplay', 'controls', 'loop', 'muted', 'defer', 'async', 'reversed', 'open', 'itemscope', 'ismap', 'nohref', 'noshade', 'nowrap', 'compact', 'default']);
-const ATTR_RE = /[&"<>]/g;
-const TEXT_RE = /[&<>]/g;
-const ATTR_MAP = {
-  '&': '&amp;',
-  '"': '&quot;',
-  '<': '&lt;',
-  '>': '&gt;'
-};
-const TEXT_MAP = {
-  '&': '&amp;',
-  '<': '&lt;',
-  '>': '&gt;'
-};
-const escapeAttr = str => {
-  const s = String(str);
-  return ATTR_RE.test(s) ? s.replace(ATTR_RE, m => ATTR_MAP[m]) : s;
-};
-const escapeText = str => {
-  const s = String(str);
-  return TEXT_RE.test(s) ? s.replace(TEXT_RE, m => TEXT_MAP[m]) : s;
-};
-const createNode = name => {
-  return new SSRFiber(name);
-};
-const setProp = (node, key, value) => {
-  node.props[key] = value;
-  if (key === 'html') {
-    parseHtmlToFibers(value, node);
-  }
-};
-const beforeIndent = node => {
-  if (node.props.html != null) {
-    return false;
-  }
-};
-const insertAfter = (parent, node, prev) => {
-  let next;
-  if (prev) {
-    next = prev.next;
-    prev.next = node;
-  } else {
-    next = parent.child;
-    parent.child = node;
-  }
-  node.next = next;
-  node.parent = parent;
-};
-const createAnchor = (name, isBefore) => {
-  return new SSRFiber('anchor', {
-    name,
-    isBefore
-  });
-};
-const remove = (node, prev) => {
-  const parent = node.parent,
-    next = node.next;
-  node.next = null;
-  if (prev) {
-    prev.next = next;
-  } else {
-    parent.child = next;
-  }
-  node.parent = null;
-};
-const firstChild = node => node.child;
-const nextSib = node => node.next;
-function walkFiber(root) {
-  let point = root;
-  let shouldSink = true;
-  sink: do {
-    if (point.type === 'root') {
-      point.html = '';
-    } else if (point.type === 'anchor') {
-      point.html = `<!--${point.props.name}-->`;
-    } else if (point.type === 'text') {
-      const text = point.props.text;
-      if (text != null) {
-        point.html = escapeText(point.props.text);
-      }
-    } else {
-      point.html = `<${point.type}`;
-      const props = point.props;
-      let text;
-      let classStr = '';
-      const dotClasses = [];
-      let idValue = null;
-      for (const key in props) {
-        const value = props[key];
-        if (key.startsWith('on') || key === 'ref') continue;
-        if (key === 'html') {
-          continue;
-        }
-        if (key === 'text') {
-          text = value;
-          continue;
-        }
-        if (key.startsWith('.')) {
-          if (value) dotClasses.push(key.slice(1));
-          continue;
-        }
-        if (key.startsWith('#')) {
-          if (value) idValue = key.slice(1);
-          continue;
-        }
-        if (key === 'class') {
-          if (value == null) continue;
-          if (typeof value === 'object' && !Array.isArray(value)) {
-            classStr = Object.entries(value).filter(([, v]) => !!v).map(([k]) => k).join(' ');
-          } else {
-            classStr = typeof value === 'boolean' ? value ? 'true' : '' : String(value);
-          }
-          continue;
-        }
-        if (key === 'style') {
-          if (value == null) continue;
-          point.html += ` style="${escapeAttr(String(value))}"`;
-          continue;
-        }
-        if (BOOLEAN_ATTRS.has(key)) {
-          if (value !== false && value !== null && value !== undefined) {
-            point.html += ` ${key}`;
-          }
-          continue;
-        }
-        if (key.startsWith('data-') || key.startsWith('aria-')) {
-          if (value == null) continue;
-          point.html += ` ${key}="${escapeAttr(value)}"`;
-          continue;
-        }
-        if (value == null) continue;
-        point.html += ` ${key}="${escapeAttr(value)}"`;
-      }
-      if (dotClasses.length) {
-        classStr = (classStr ? classStr + ' ' : '') + dotClasses.join(' ');
-      }
-      if (classStr) {
-        point.html += ` class="${escapeAttr(classStr)}"`;
-      }
-      if (idValue) {
-        point.html += ` id="${escapeAttr(idValue)}"`;
-      }
-      if (text != null && props.html == null) {
-        const content = escapeText(text);
-        point.html += `>${content}</${point.type}>`;
-        if (point.child) console.warn(`<${point.type}> has text content and child elements — children ignored`);
-        shouldSink = false;
-      } else {
-        if (VOID_TAGS.has(point.type)) {
-          point.html += `/>`;
-          if (point.child) console.warn(`<${point.type}> can't have children`);
-          shouldSink = false;
-        } else {
-          point.html += `>`;
-        }
-      }
-    }
-    if (point.child && shouldSink) {
-      point = point.child;
-      continue;
-    }
-    do {
-      const notRoot = point !== root;
-      const notAnchor = point.type !== 'anchor';
-      const notText = point.type !== 'text';
-      if (shouldSink && notRoot && notAnchor && notText) {
-        point.html += `</${point.type}>`;
-      }
-      if (notRoot) {
-        point.parent.html += point.html;
-      }
-      shouldSink = true;
-      if (!notRoot) break sink;
-      if (point.next) {
-        point = point.next;
-        break;
-      }
-      point = point.parent;
-    } while (true);
-  } while (true);
-}
-const renderHtmlStr = ComponentClass => {
-  const root = new SSRFiber('root');
-  const render = bobe.customRender({
-    createNode,
-    setProp,
-    insertAfter,
-    createAnchor,
-    remove,
-    firstChild,
-    nextSib,
-    beforeIndent,
-    noopEffect: true
-  });
-  render(ComponentClass, root);
-  walkFiber(root);
-  return root.html;
-};
-
-class TreeCursor {
-  claimed = new WeakSet();
-  current = null;
-  constructor(container) {
-    this.parent = container;
-  }
-  enterChildren(node) {
-    this.parent = node;
-    this.current = null;
-  }
-  setParent(node) {
-    this.parent = node;
-    this.current = null;
-  }
-  setCurrent(node) {
-    this.current = node;
-  }
-  leaveToParent(node) {
-    if (node === this.parent && this.parent.parentNode) {
-      this.parent = this.parent.parentNode;
-      this.current = node;
-    }
-  }
-  findUnclaimed(predicate) {
-    let node = this.current?.nextSibling || this.parent.firstChild;
-    while (node) {
-      if (!this.claimed.has(node) && predicate(node)) {
-        this.claimed.add(node);
-        this.current = node;
-        return node;
-      }
-      node = node.nextSibling;
-    }
-    return null;
-  }
-  tryClaimElement(tagName) {
-    return this.findUnclaimed(node => node.nodeType === 1 && node.tagName.toLowerCase() === tagName);
-  }
-  tryClaimComment(name) {
-    return this.findUnclaimed(node => node.nodeType === 8 && node.data === name);
-  }
-  tryClaimText() {
-    return this.findUnclaimed(node => node.nodeType === 3 && !!node.textContent?.trim());
-  }
-}
-const hydrate = (ComponentClass, rootEl) => {
-  const cursor = new TreeCursor(rootEl);
-  let isFirstRender = true;
-  const hydrateSetProp = (node, key, value) => {
-    if (isFirstRender && (key === 'text' || key === 'html')) {
-      node[CONTENT_FLAG] = value != null;
-      return;
-    }
-    return setProp$1(node, key, value);
-  };
-  const createNode = name => {
-    if (isFirstRender) {
-      const claimed = name === 'text' ? cursor.tryClaimText() : cursor.tryClaimElement(name);
-      if (claimed) return claimed;
-    }
-    return name === 'text' ? document.createTextNode('') : createNode$1(name);
-  };
-  const createAnchor = name => {
-    if (isFirstRender) {
-      const claimed = cursor.tryClaimComment(name);
-      if (claimed) return claimed;
-    }
-    return document.createComment(name);
-  };
-  const insertAfter = (parent, node, prev) => {
-    if (node === parent) return;
-    const expectedNext = prev ? prev.nextSibling : parent.firstChild;
-    if (node === expectedNext) return;
-    parent.insertBefore(node, expectedNext);
-  };
-  const beforeIndent = node => {
-    if (node[CONTENT_FLAG]) {
-      const tag = node.tagName?.toLowerCase();
-      const hasText = node.textContent != null;
-      console.warn(`<${tag}> has ${hasText ? 'text' : 'html'} content and child elements — children ignored`);
-      return false;
-    }
-    if (isFirstRender) cursor.enterChildren(node);
-  };
-  const leaveNode = node => {
-    if (isFirstRender) cursor.leaveToParent(node);
-  };
-  const beforeLogicIndent = node => {
-    if (isFirstRender && node.tpData) {
-      const targetDom = node.tpData.node;
-      if (targetDom) cursor.enterChildren(targetDom);
-    }
-  };
-  const leaveLogicNode = (node, _isDedent) => {
-    if (isFirstRender && node.tpData) {
-      const parentDom = node.realAfter?.parentNode;
-      if (parentDom) {
-        cursor.setParent(parentDom);
-        if (node.realAfter) cursor.setCurrent(node.realAfter);
-      }
-      return;
-    }
-    if (isFirstRender) cursor.leaveToParent(node);
-  };
-  const render = bobe.customRender({
-    createNode,
-    setProp: hydrateSetProp,
-    insertAfter,
-    createAnchor,
-    remove: remove$1,
-    firstChild: firstChild$1,
-    nextSib: nextSib$1,
-    beforeIndent,
-    beforeLogicIndent,
-    leaveNode,
-    leaveLogicNode,
-    onBeforeFlush: () => {
-      isFirstRender = false;
-    }
-  });
-  return render(ComponentClass, rootEl);
-};
-
-exports.BOOLEAN_ATTRS = BOOLEAN_ATTRS$1;
-exports.CONTENT_FLAG = CONTENT_FLAG;
-exports.beforeIndent = beforeIndent$1;
-exports.createAnchor = createAnchor$1;
-exports.createNode = createNode$1;
-exports.firstChild = firstChild$1;
-exports.hydrate = hydrate;
-exports.insertAfter = insertAfter$1;
-exports.leaveLogicNode = leaveLogicNode;
-exports.leaveNode = leaveNode;
-exports.nextSib = nextSib$1;
-exports.remove = remove$1;
-exports.render = render;
-exports.renderHtmlStr = renderHtmlStr;
-exports.setProp = setProp$1;
-exports.walkFiber = walkFiber;
-//# sourceMappingURL=bobe-dom.cjs.js.map