bobe 0.0.59 → 0.0.61

package/dist/bobe.esm.js

@@ -33,15 +33,15 @@ let FakeType = function (FakeType) {
   FakeType[FakeType["ForItem"] = 64] = "ForItem";
   FakeType[FakeType["Context"] = 128] = "Context";
   FakeType[FakeType["DynamicText"] = 256] = "DynamicText";
+  FakeType[FakeType["Tp"] = 512] = "Tp";
   return FakeType;
 }({});
 const CondBit = FakeType.If | FakeType.Fail | FakeType.Else;
-const LogicalBit = FakeType.If | FakeType.Fail | FakeType.Else | FakeType.For | FakeType.ForItem;
 const CtxProviderBit = FakeType.If | FakeType.Fail | FakeType.Else | FakeType.For | FakeType.ForItem | FakeType.Component | FakeType.Fragment | FakeType.DynamicText;
-const ContextBit = FakeType.If | FakeType.Fail | FakeType.Else | FakeType.ForItem | FakeType.Context;
+const ContextBit = FakeType.If | FakeType.Fail | FakeType.Else | FakeType.ForItem | FakeType.Context | FakeType.Tp;
 const TokenizerSwitcherBit = FakeType.Component | FakeType.Fragment;
 let NodeSort = function (NodeSort) {
-  NodeSort[NodeSort["Logic"] = 1] = "Logic";
+  NodeSort[NodeSort["EffectNode"] = 1] = "EffectNode";
   NodeSort[NodeSort["Real"] = 2] = "Real";
   NodeSort[NodeSort["Component"] = 4] = "Component";
   NodeSort[NodeSort["CtxProvider"] = 8] = "CtxProvider";
@@ -54,6 +54,7 @@ let NodeSort = function (NodeSort) {
   TerpEvt["HandledComponentNode"] = "handled-component-node";
   return TerpEvt;
 })({});
+const FakeNode = Symbol('fake-node');
 let ParseErrorCode = function (ParseErrorCode) {
   ParseErrorCode[ParseErrorCode["UNCLOSED_BRACE"] = 9001] = "UNCLOSED_BRACE";
   ParseErrorCode[ParseErrorCode["UNCLOSED_STRING"] = 9002] = "UNCLOSED_STRING";
@@ -1429,6 +1430,14 @@ class InlineFragment {
 }
 const isUI = fn => typeof fn === 'function' && fn.__BOBE_IS_UI;
 const isRenderAble = val => isStore(val) || isUI(val) || val instanceof InlineFragment;
+const SAFE_HANDLER = {
+  has: () => true,
+  get: (t, k) => {
+    if (typeof k === 'symbol') return t[k];
+    return k in t ? t[k] : undefined;
+  }
+};
+const safe = data => new Proxy(data, SAFE_HANDLER);
 
 const KEY_INDEX = '__BOBE_KEY_INDEX';
 let _ctxStack;
@@ -1440,9 +1449,6 @@ class Interpreter {
   constructor(tokenizer) {
     this.tokenizer = tokenizer;
   }
-  isLogicNode(node) {
-    return node && node.__logicType & LogicalBit;
-  }
   rootComponent = null;
   program(root, componentNode, before, ctxProvider) {
     this.rootComponent = componentNode;
@@ -1461,7 +1467,7 @@ class Interpreter {
       stack.push({
         node: ctxProvider,
         prev: null
-      }, (ctxProvider.__logicType & LogicalBit ? NodeSort.Logic : 0) | NodeSort.CtxProvider);
+      }, (ctxProvider.__logicType && ctxProvider.effect ? NodeSort.EffectNode : 0) | NodeSort.CtxProvider);
     }
     const rootLen = stack.length;
     const ctx = this.ctx = {
@@ -1484,18 +1490,22 @@ class Interpreter {
       const token = this.tokenizer.token;
       if (token.type & TokenType.Indent) {
         this.tokenizer.nextToken();
-        const isLogicNode = this.isLogicNode(ctx.current);
+        const isEffectNode = ctx.current && ctx.current.__logicType && ctx.current.effect;
         stack.push({
           node: ctx.current,
           prev: ctx.prevSibling
-        }, !ctx.current.__logicType ? NodeSort.Real : (ctx.current.__logicType & LogicalBit ? NodeSort.Logic : 0) | (ctx.current.__logicType & TokenizerSwitcherBit ? NodeSort.TokenizerSwitcher : 0) | (ctx.current.__logicType & ContextBit ? NodeSort.Context : 0) | (ctx.current.__logicType === FakeType.Component ? NodeSort.Component : 0) | (ctx.current.__logicType & CtxProviderBit ? NodeSort.CtxProvider : 0));
+        }, !ctx.current.__logicType ? NodeSort.Real : (isEffectNode ? NodeSort.EffectNode : 0) | (ctx.current.__logicType & TokenizerSwitcherBit ? NodeSort.TokenizerSwitcher : 0) | (ctx.current.__logicType & ContextBit ? NodeSort.Context : 0) | (ctx.current.__logicType === FakeType.Component ? NodeSort.Component : 0) | (ctx.current.__logicType & CtxProviderBit ? NodeSort.CtxProvider : 0));
         if (ctx.current.__logicType) {
           this.beforeLogicIndent?.(ctx.current);
-          if (isLogicNode) {
+          if (isEffectNode) {
             setPulling(ctx.current.effect);
             if (ctx.current.__logicType & FakeType.ForItem) {
               ctx.prevSibling = ctx.current.realBefore;
             }
+            if (ctx.current.__logicType & FakeType.Tp) {
+              ctx.realParent = ctx.current.tpData[Keys.Raw].node;
+              ctx.prevSibling = ctx.current.contentBefore;
+            }
           }
         } else {
           if (ctx.current) {
@@ -1531,14 +1541,17 @@ class Interpreter {
           const prevSameType = stack.peekByType(NodeSort.Real);
           ctx.realParent = prevSameType?.node || root;
         } else {
-          if (sort & NodeSort.Logic) {
-            const parentLogic = stack.peekByType(NodeSort.Logic)?.node;
+          if (sort & NodeSort.EffectNode) {
+            const parentLogic = stack.peekByType(NodeSort.EffectNode)?.node;
             if (parentLogic) {
               setPulling(parentLogic.effect);
             } else {
               setPulling(rootPulling);
             }
           }
+          if (parent.__logicType === FakeType.Tp) {
+            ctx.realParent = parent.realParent;
+          }
           if (sort & NodeSort.TokenizerSwitcher) {
             const switcher = stack.peekByType(NodeSort.TokenizerSwitcher)?.node;
             if (parent.resumeSnapshot) {
@@ -1575,13 +1588,17 @@ class Interpreter {
     }
     return componentNode;
   }
-  insertAnchor(name = 'anchor', isBefore = false) {
+  insertAnchor(node, name = 'anchor', isBefore = false) {
     const _this$ctx = this.ctx,
       realParent = _this$ctx.realParent,
       prevSibling = _this$ctx.prevSibling,
       stack = _this$ctx.stack,
       before = _this$ctx.before;
+      _this$ctx.current;
     const afterAnchor = this.createAnchor(name, isBefore);
+    if (!isBefore) {
+      this.anchorRefBack(afterAnchor, node);
+    }
     this.ctx.prevSibling = stack.length === 2 && !prevSibling ? before : prevSibling;
     this.handleInsert(realParent, afterAnchor, prevSibling);
     return afterAnchor;
@@ -1626,6 +1643,8 @@ class Interpreter {
       return this.condDeclaration(ctx);
     } else if (value === 'context') {
       _node = this.createContextNode();
+    } else if (value === 'tp') {
+      return this.createTpNode();
     } else if (value === 'for') {
       return this.forDeclaration();
     } else if (hookType) {
@@ -1665,11 +1684,11 @@ class Interpreter {
       effect: null,
       textNode: null,
       owner: ctx.stack.peekByType(NodeSort.TokenizerSwitcher)?.node,
-      snapshot: this.tokenizer.snapshot(['dentStack']),
+      snapshot: this.tokenizer.snapshot(['dentStack', 'isFirstToken']),
       parentDataProvider: ctx.stack.peekByType(NodeSort.CtxProvider)?.node
     };
     let isUpdate = false;
-    node.realAfter = this.insertAnchor(`dynamic-after`);
+    node.realAfter = this.insertAnchor(node, `dynamic-after`);
     node.effect = this.effect(({
       old,
       val
@@ -1678,7 +1697,7 @@ class Interpreter {
         oldTextNode = node.textNode;
       if (oldLogicType) {
         this.removeLogicNode(node);
-        pickInPlace(node, ['realParent', 'realBefore', 'realAfter',, 'owner', 'snapshot', 'parentDataProvider']);
+        pickInPlace(node, ['realParent', 'realBefore', 'realAfter', 'owner', 'snapshot', 'parentDataProvider']);
       }
       if (isRenderAble(val)) {
         if (oldTextNode) {
@@ -1708,7 +1727,7 @@ class Interpreter {
         }
         if (isUpdate) {
           this.tokenizer.useDedentAsEof = false;
-          this.program(node.realParent, node.owner, node.realBefore, node);
+          this.program(node.realParent, node, node.realBefore);
         } else {
           this.tokenizer.useDedentAsEof = true;
           this.tokenizer.initIndentWhenUseDedentAsEof();
@@ -1749,6 +1768,93 @@ class Interpreter {
     });
     return node;
   }
+  createTpNode() {
+    const child = deepSignal({}, getPulling());
+    const node = {
+      __logicType: FakeType.Tp,
+      data: this.getData(),
+      realParent: null,
+      realBefore: null,
+      realAfter: null,
+      contentBefore: null,
+      contentAfter: null,
+      effect: null,
+      snapshot: null,
+      tpData: child,
+      owner: this.ctx.stack.peekByType(NodeSort.TokenizerSwitcher)?.node
+    };
+    this.onePropParsed = createStoreOnePropParsed(child);
+    this.tokenizer.nextToken();
+    this.headerLineAndExtensions(node);
+    this.onePropParsed = this.oneRealPropParsed;
+    node.realAfter = this.insertAnchor(node, 'tp-after');
+    const before = node.contentBefore = this.createAnchor('tp-content-before', true);
+    const after = node.contentAfter = this.createAnchor('tp-content-after', true);
+    let firstRender = true;
+    node.effect = this.effect(({
+      old: oldDom,
+      val: dom
+    }) => {
+      const removeTpChild = () => {
+        if (oldDom) {
+          let point = before;
+          do {
+            const next = this.nextSib(point);
+            this.remove(point, oldDom, null);
+            if (point === after) break;
+            point = next;
+          } while (true);
+        }
+      };
+      if (firstRender) {
+        if (dom) {
+          this.handleInsert(dom, after, null);
+          this.handleInsert(dom, before, null);
+        } else {
+          if (this.tokenizer.token.type === TokenType.Indent) {
+            const dentLen = this.tokenizer.dentStack[this.tokenizer.dentStack.length - 2] ?? 0;
+            this.tokenizer.skip(dentLen);
+          }
+        }
+      } else {
+        if (dom) {
+          if (oldDom) {
+            let point = before,
+              lastInsert = null;
+            do {
+              const next = this.nextSib(point);
+              const fakeNode = point[FakeNode];
+              if (fakeNode) {
+                fakeNode.realParent = dom;
+              }
+              this.handleInsert(dom, point, lastInsert);
+              if (point === after) break;
+              lastInsert = point;
+              point = next;
+            } while (true);
+          } else {
+            this.handleInsert(dom, after, null);
+            this.handleInsert(dom, before, null);
+            this.tokenizer = node.owner.tokenizer;
+            this.tokenizer.resume(node.snapshot);
+            this.tokenizer.useDedentAsEof = false;
+            this.program(dom, node.owner, before, node);
+          }
+        } else {
+          removeTpChild();
+        }
+      }
+      firstRender = false;
+      return isDestroy => {
+        if (isDestroy) {
+          removeTpChild();
+        }
+      };
+    }, [() => child.node], {
+      type: 'render'
+    });
+    return node;
+  }
   createContextNode() {
     const child = deepSignal({}, getPulling());
     const parentContext = this.ctx.stack.peekByType(NodeSort.Context)?.node?.context;
@@ -1763,7 +1869,7 @@ class Interpreter {
       realBefore: null,
       realAfter: null
     };
-    node.realAfter = this.insertAnchor('context-after');
+    node.realAfter = this.insertAnchor(node, 'context-after');
     return node;
   }
   formatForCollection(collection) {
@@ -1853,15 +1959,15 @@ class Interpreter {
       i: 0
     };
     if (keyExp) {
-      forNode.getKey = new Function('data', `let v;with(data){v=${keyExp}\n};return v;`);
+      const rawGetKey = new Function('data', `with(data){return (${keyExp})}`);
+      forNode.getKey = data => rawGetKey(safe(data));
     }
-    window['for1'] = forNode;
     const data = this.getData();
     const cells = data[Keys.Meta].cells;
     const hasArrExpKey = Reflect.has(data[Keys.Raw], arrExp);
     const arrSignal = hasArrExpKey ? (data[arrExp], cells.get(arrExp)) : new Computed(this.getFn(data, arrExp));
     forNode.arrSignal = arrSignal;
-    forNode.realAfter = this.insertAnchor('for-after');
+    forNode.realAfter = this.insertAnchor(forNode, 'for-after');
     const _forNode$snapshot = forNode.snapshot;
       _forNode$snapshot.dentStack;
       _forNode$snapshot.isFirstToken;
@@ -1884,8 +1990,8 @@ class Interpreter {
         const len = arr.length;
         for (let i = len; i--;) {
           const item = this.createForItem(forNode, i, data);
-          item.realAfter = this.insertAnchor('for-item-after');
-          item.realBefore = this.insertAnchor('for-item-before', true);
+          item.realAfter = this.insertAnchor(item, 'for-item-after');
+          item.realBefore = this.insertAnchor(item, 'for-item-before', true);
           item.realParent = forNode.realParent;
           children[i] = item;
         }
@@ -2047,10 +2153,14 @@ class Interpreter {
     }, ScheduleType.Render);
     return forNode.children[0] || forNode;
   }
+  anchorRefBack(anchor, node) {
+    anchor[FakeNode] = node;
+  }
   insertForItem(forNode, i, parentData, newChildren, before, snapshotForUpdate) {
     const item = this.createForItem(forNode, i, parentData);
     newChildren[i] = item;
     let realAfter = this.createAnchor('for-item-after');
+    this.anchorRefBack(realAfter, item);
     this.handleInsert(forNode.realParent, realAfter, before);
     let realBefore = this.createAnchor('for-item-before', true);
     this.handleInsert(forNode.realParent, realBefore, before);
@@ -2221,11 +2331,11 @@ class Interpreter {
       resumeSnapshot
     };
     this.onePropParsed = onePropParsed;
-    node.realAfter = this.insertAnchor('component-after');
+    node.realAfter = this.insertAnchor(node, 'component-after');
     return node;
   }
   getFn(data, expression) {
-    return new Function('data', `let v;with(data){v=${expression}};return v;`).bind(undefined, data);
+    return new Function('data', `with(data){return (${expression})}`).bind(undefined, safe(data));
   }
   getAssignFn(data, expression) {
     const valueId = `value_bobe_${date32()}`;
@@ -2316,7 +2426,7 @@ class Interpreter {
         break;
     }
     ifNode.condition = signal;
-    ifNode.realAfter = this.insertAnchor(`${keyWord.value}-after`);
+    ifNode.realAfter = this.insertAnchor(ifNode, `${keyWord.value}-after`);
     const ef = this.effect(({
       val
     }) => {
@@ -2359,10 +2469,11 @@ class Interpreter {
     const tokenizer = this.tokenizer;
     do {
       const isComponent = _node.__logicType & TokenizerSwitcherBit;
+      const isTp = _node.__logicType === FakeType.Tp;
       let snapshot, dentLen;
       const data = this.getData();
       const unHandledKey = this.attributeList(_node, data);
-      if (isComponent) {
+      if (isComponent || isTp) {
         snapshot = tokenizer.snapshot(undefined, -1);
         dentLen = tokenizer.dentStack[tokenizer.dentStack.length - 1];
       }
@@ -2374,6 +2485,9 @@ class Interpreter {
           if ((tokenizer.token.type & TokenType.Pipe) === 0) {
             break;
           }
+        } else if (isTp) {
+          _node.snapshot = snapshot;
+          break;
         } else {
           break;
         }
@@ -2575,6 +2689,7 @@ function bobe(fragments, ...values) {
     return tokenizer;
   };
   ui.boundStore = Store.Current;
+  ui[Keys.ProxyFreeObject] = true;
   ui.__BOBE_IS_UI = true;
   return ui;
 }