@dark-engine/core/dist/cjs/view/view.js

The lightweight and powerful UI rendering engine without dependencies and written in TypeScript (Browser, Node.js, Android, iOS, Windows, Linux, macOS)

'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
exports.detectAreSameComponentTypesWithSameKeys =
  exports.detectAreSameInstanceTypes =
  exports.detectIsVirtualNodeFactory =
  exports.detectIsPlainVirtualNode =
  exports.detectIsTextVirtualNode =
  exports.detectIsCommentVirtualNode =
  exports.detectIsTagVirtualNode =
  exports.detectIsVirtualNode =
  exports.hasChildrenProp =
  exports.getElementType =
  exports.getElementKey =
  exports.createReplacer =
  exports.CommentVirtualNode =
  exports.TextVirtualNode =
  exports.TagVirtualNode =
  exports.VirtualNode =
  exports.Comment =
  exports.Text =
  exports.View =
  exports.NodeType =
    void 0;
const component_1 = require('../component');
const utils_1 = require('../utils');
const constants_1 = require('../constants');
const scope_1 = require('../scope');
const $$vNode = Symbol('vNode');
const PROP_PROPS = 'props';
const PROP_ATTRS = 'attrs';
const PROP_NAME = 'name';
const PROP_TYPE = 'type';
const PROP_CHILDREN = 'children';
class VirtualNode {
  type = null;
  constructor(type) {
    this.type = type;
  }
}
exports.VirtualNode = VirtualNode;
class TagVirtualNode extends VirtualNode {
  name;
  attrs;
  children;
  constructor(name, attrs, children) {
    super(NodeType.TAG);
    this.name = name;
    this.attrs = attrs;
    this.children = children;
  }
}
exports.TagVirtualNode = TagVirtualNode;
class TextVirtualNode extends VirtualNode {
  value;
  constructor(source) {
    super(NodeType.TEXT);
    this.value = String(source);
  }
}
exports.TextVirtualNode = TextVirtualNode;
class CommentVirtualNode extends VirtualNode {
  value = '';
  constructor(text) {
    super(NodeType.COMMENT);
    this.value = text;
  }
}
exports.CommentVirtualNode = CommentVirtualNode;
const View = options => {
  const factory = () => {
    const { as: name, slot, _void = false, ...attrs } = options;
    const children = _void
      ? []
      : (0, utils_1.detectIsArray)(slot)
      ? slot
      : !(0, utils_1.detectIsEmpty)(slot)
      ? [slot]
      : [];
    return new TagVirtualNode(name, attrs, children);
  };
  factory[$$vNode] = true;
  factory[PROP_TYPE] = options.as;
  factory[constants_1.KEY_ATTR] = options.key;
  return factory;
};
exports.View = View;
const Text = source => new TextVirtualNode(source);
exports.Text = Text;
Text.from = x => (detectIsTextVirtualNode(x) ? x.value : String(x));
const Comment = text => new CommentVirtualNode(text);
exports.Comment = Comment;
const createReplacer = () => new CommentVirtualNode(constants_1.REPLACER);
exports.createReplacer = createReplacer;
const detectIsVirtualNode = x => x instanceof VirtualNode;
exports.detectIsVirtualNode = detectIsVirtualNode;
const detectIsTagVirtualNode = x => x instanceof TagVirtualNode;
exports.detectIsTagVirtualNode = detectIsTagVirtualNode;
const detectIsCommentVirtualNode = x => x instanceof CommentVirtualNode;
exports.detectIsCommentVirtualNode = detectIsCommentVirtualNode;
const detectIsTextVirtualNode = x => x instanceof TextVirtualNode;
exports.detectIsTextVirtualNode = detectIsTextVirtualNode;
const detectIsVirtualNodeFactory = x => x?.[$$vNode];
exports.detectIsVirtualNodeFactory = detectIsVirtualNodeFactory;
const detectIsPlainVirtualNode = x => !detectIsTagVirtualNode(x);
exports.detectIsPlainVirtualNode = detectIsPlainVirtualNode;
const getElementType = inst => inst[PROP_NAME] ?? inst[PROP_TYPE] ?? null;
exports.getElementType = getElementType;
const getElementKey = inst => {
  return inst
    ? inst[PROP_PROPS]
      ? inst[PROP_PROPS][constants_1.KEY_ATTR] ?? null
      : inst[PROP_ATTRS]
      ? inst[PROP_ATTRS][constants_1.KEY_ATTR] ?? null
      : inst[constants_1.KEY_ATTR] ?? null
    : null;
};
exports.getElementKey = getElementKey;
const hasChildrenProp = inst => {
  return inst?.[PROP_CHILDREN] !== undefined;
};
exports.hasChildrenProp = hasChildrenProp;
const detectAreSameInstanceTypes = (prevInst, nextInst) => {
  if (process.env.NODE_ENV !== 'production') {
    if (process.env.NODE_ENV === 'development' && (0, scope_1.$$scope)().getIsHot()) {
      if ((0, component_1.detectIsComponent)(prevInst) && (0, component_1.detectIsComponent)(nextInst)) {
        return prevInst.displayName === nextInst.displayName;
      }
    }
  }
  return getElementType(prevInst) === getElementType(nextInst);
};
exports.detectAreSameInstanceTypes = detectAreSameInstanceTypes;
const detectAreSameComponentTypesWithSameKeys = (prevInst, nextInst) => {
  return (
    (0, component_1.detectIsComponent)(prevInst) &&
    (0, component_1.detectIsComponent)(nextInst) &&
    detectAreSameInstanceTypes(prevInst, nextInst) &&
    getElementKey(prevInst) === getElementKey(nextInst)
  );
};
exports.detectAreSameComponentTypesWithSameKeys = detectAreSameComponentTypesWithSameKeys;
var NodeType;
(function (NodeType) {
  NodeType['TAG'] = 'TAG';
  NodeType['TEXT'] = 'TEXT';
  NodeType['COMMENT'] = 'COMMENT';
})(NodeType || (exports.NodeType = NodeType = {}));
//# sourceMappingURL=view.js.map