@thomas-siegfried/tapout 0.0.1 → 0.0.3

package/src/virtualElements.ts

@@ -1,153 +1,153 @@
-import { domDataGet, domDataSet } from './domData.js';
-import { removeNode } from './domNodeDisposal.js';
-
-const startCommentRegex = /^\s*tap(?:\s+([\s\S]+))?\s*$/;
-const endCommentRegex = /^\s*\/tap\s*$/;
-const matchedEndCommentDataKey = '__tap_matchedEndComment__';
-
-export const allowedVirtualElementBindings: Record<string, boolean> = {};
-
-export function isStartComment(node: Node): boolean {
-  return node.nodeType === 8 && startCommentRegex.test(node.nodeValue || '');
-}
-
-function isEndComment(node: Node): boolean {
-  return node.nodeType === 8 && endCommentRegex.test(node.nodeValue || '');
-}
-
-function isUnmatchedEndComment(node: Node): boolean {
-  return isEndComment(node) && !domDataGet(node, matchedEndCommentDataKey);
-}
-
-function getVirtualChildren(startComment: Node, allowUnbalanced?: boolean): Node[] | null {
-  let currentNode = startComment.nextSibling;
-  let depth = 1;
-  const children: Node[] = [];
-  while (currentNode) {
-    if (isEndComment(currentNode)) {
-      domDataSet(currentNode, matchedEndCommentDataKey, true);
-      depth--;
-      if (depth === 0) return children;
-    }
-    children.push(currentNode);
-    if (isStartComment(currentNode)) depth++;
-    currentNode = currentNode.nextSibling;
-  }
-  if (!allowUnbalanced) {
-    throw new Error('Cannot find closing comment tag to match: ' + startComment.nodeValue);
-  }
-  return null;
-}
-
-function getMatchingEndComment(startComment: Node, allowUnbalanced?: boolean): Node | null {
-  const allVirtualChildren = getVirtualChildren(startComment, allowUnbalanced);
-  if (allVirtualChildren) {
-    if (allVirtualChildren.length > 0) {
-      return allVirtualChildren[allVirtualChildren.length - 1].nextSibling;
-    }
-    return startComment.nextSibling;
-  }
-  return null;
-}
-
-export function virtualChildNodes(node: Node): Node[] | NodeListOf<ChildNode> {
-  return isStartComment(node) ? getVirtualChildren(node)! : node.childNodes;
-}
-
-export function virtualEmptyNode(node: Node): void {
-  if (!isStartComment(node)) {
-    while (node.firstChild) {
-      removeNode(node.firstChild);
-    }
-  } else {
-    const children = getVirtualChildren(node)!;
-    for (let i = 0; i < children.length; i++) {
-      removeNode(children[i]);
-    }
-  }
-}
-
-export function virtualSetChildren(node: Node, childNodes: Node[]): void {
-  if (!isStartComment(node)) {
-    while (node.firstChild) {
-      removeNode(node.firstChild);
-    }
-    for (let i = 0; i < childNodes.length; i++) {
-      node.appendChild(childNodes[i]);
-    }
-  } else {
-    virtualEmptyNode(node);
-    const endCommentNode = node.nextSibling!;
-    for (let i = 0; i < childNodes.length; i++) {
-      endCommentNode.parentNode!.insertBefore(childNodes[i], endCommentNode);
-    }
-  }
-}
-
-export function virtualPrepend(containerNode: Node, nodeToPrepend: Node): void {
-  let insertBeforeNode: Node | null;
-  let parent: Node;
-
-  if (isStartComment(containerNode)) {
-    insertBeforeNode = containerNode.nextSibling;
-    parent = containerNode.parentNode!;
-  } else {
-    insertBeforeNode = containerNode.firstChild;
-    parent = containerNode;
-  }
-
-  if (!insertBeforeNode) {
-    parent.appendChild(nodeToPrepend);
-  } else {
-    parent.insertBefore(nodeToPrepend, insertBeforeNode);
-  }
-}
-
-export function virtualInsertAfter(containerNode: Node, nodeToInsert: Node, insertAfterNode: Node | null): void {
-  if (!insertAfterNode) {
-    virtualPrepend(containerNode, nodeToInsert);
-    return;
-  }
-
-  const insertBeforeNode = insertAfterNode.nextSibling;
-  const parent = isStartComment(containerNode) ? containerNode.parentNode! : containerNode;
-
-  if (!insertBeforeNode) {
-    parent.appendChild(nodeToInsert);
-  } else {
-    parent.insertBefore(nodeToInsert, insertBeforeNode);
-  }
-}
-
-export function virtualFirstChild(node: Node): Node | null {
-  if (!isStartComment(node)) {
-    const first = node.firstChild;
-    if (first && isEndComment(first)) {
-      return first.nextSibling;
-    }
-    return first;
-  }
-  if (!node.nextSibling || isEndComment(node.nextSibling)) {
-    return null;
-  }
-  return node.nextSibling;
-}
-
-export function virtualNextSibling(node: Node): Node | null {
-  if (isStartComment(node)) {
-    node = getMatchingEndComment(node)!;
-  }
-  if (node.nextSibling && isEndComment(node.nextSibling)) {
-    return null;
-  }
-  return node.nextSibling;
-}
-
-export function hasBindingValue(node: Node): boolean {
-  return isStartComment(node);
-}
-
-export function virtualNodeBindingValue(node: Node): string | null {
-  const match = (node.nodeValue || '').match(startCommentRegex);
-  return match ? match[1]?.trim() ?? null : null;
-}
+import { domDataGet, domDataSet } from './domData.js';
+import { removeNode } from './domNodeDisposal.js';
+
+const startCommentRegex = /^\s*tap(?:\s+([\s\S]+))?\s*$/;
+const endCommentRegex = /^\s*\/tap\s*$/;
+const matchedEndCommentDataKey = '__tap_matchedEndComment__';
+
+export const allowedVirtualElementBindings: Record<string, boolean> = {};
+
+export function isStartComment(node: Node): boolean {
+  return node.nodeType === 8 && startCommentRegex.test(node.nodeValue || '');
+}
+
+function isEndComment(node: Node): boolean {
+  return node.nodeType === 8 && endCommentRegex.test(node.nodeValue || '');
+}
+
+function isUnmatchedEndComment(node: Node): boolean {
+  return isEndComment(node) && !domDataGet(node, matchedEndCommentDataKey);
+}
+
+function getVirtualChildren(startComment: Node, allowUnbalanced?: boolean): Node[] | null {
+  let currentNode = startComment.nextSibling;
+  let depth = 1;
+  const children: Node[] = [];
+  while (currentNode) {
+    if (isEndComment(currentNode)) {
+      domDataSet(currentNode, matchedEndCommentDataKey, true);
+      depth--;
+      if (depth === 0) return children;
+    }
+    children.push(currentNode);
+    if (isStartComment(currentNode)) depth++;
+    currentNode = currentNode.nextSibling;
+  }
+  if (!allowUnbalanced) {
+    throw new Error('Cannot find closing comment tag to match: ' + startComment.nodeValue);
+  }
+  return null;
+}
+
+function getMatchingEndComment(startComment: Node, allowUnbalanced?: boolean): Node | null {
+  const allVirtualChildren = getVirtualChildren(startComment, allowUnbalanced);
+  if (allVirtualChildren) {
+    if (allVirtualChildren.length > 0) {
+      return allVirtualChildren[allVirtualChildren.length - 1].nextSibling;
+    }
+    return startComment.nextSibling;
+  }
+  return null;
+}
+
+export function virtualChildNodes(node: Node): Node[] | NodeListOf<ChildNode> {
+  return isStartComment(node) ? getVirtualChildren(node)! : node.childNodes;
+}
+
+export function virtualEmptyNode(node: Node): void {
+  if (!isStartComment(node)) {
+    while (node.firstChild) {
+      removeNode(node.firstChild);
+    }
+  } else {
+    const children = getVirtualChildren(node)!;
+    for (let i = 0; i < children.length; i++) {
+      removeNode(children[i]);
+    }
+  }
+}
+
+export function virtualSetChildren(node: Node, childNodes: Node[]): void {
+  if (!isStartComment(node)) {
+    while (node.firstChild) {
+      removeNode(node.firstChild);
+    }
+    for (let i = 0; i < childNodes.length; i++) {
+      node.appendChild(childNodes[i]);
+    }
+  } else {
+    virtualEmptyNode(node);
+    const endCommentNode = node.nextSibling!;
+    for (let i = 0; i < childNodes.length; i++) {
+      endCommentNode.parentNode!.insertBefore(childNodes[i], endCommentNode);
+    }
+  }
+}
+
+export function virtualPrepend(containerNode: Node, nodeToPrepend: Node): void {
+  let insertBeforeNode: Node | null;
+  let parent: Node;
+
+  if (isStartComment(containerNode)) {
+    insertBeforeNode = containerNode.nextSibling;
+    parent = containerNode.parentNode!;
+  } else {
+    insertBeforeNode = containerNode.firstChild;
+    parent = containerNode;
+  }
+
+  if (!insertBeforeNode) {
+    parent.appendChild(nodeToPrepend);
+  } else {
+    parent.insertBefore(nodeToPrepend, insertBeforeNode);
+  }
+}
+
+export function virtualInsertAfter(containerNode: Node, nodeToInsert: Node, insertAfterNode: Node | null): void {
+  if (!insertAfterNode) {
+    virtualPrepend(containerNode, nodeToInsert);
+    return;
+  }
+
+  const insertBeforeNode = insertAfterNode.nextSibling;
+  const parent = isStartComment(containerNode) ? containerNode.parentNode! : containerNode;
+
+  if (!insertBeforeNode) {
+    parent.appendChild(nodeToInsert);
+  } else {
+    parent.insertBefore(nodeToInsert, insertBeforeNode);
+  }
+}
+
+export function virtualFirstChild(node: Node): Node | null {
+  if (!isStartComment(node)) {
+    const first = node.firstChild;
+    if (first && isEndComment(first)) {
+      return first.nextSibling;
+    }
+    return first;
+  }
+  if (!node.nextSibling || isEndComment(node.nextSibling)) {
+    return null;
+  }
+  return node.nextSibling;
+}
+
+export function virtualNextSibling(node: Node): Node | null {
+  if (isStartComment(node)) {
+    node = getMatchingEndComment(node)!;
+  }
+  if (node.nextSibling && isEndComment(node.nextSibling)) {
+    return null;
+  }
+  return node.nextSibling;
+}
+
+export function hasBindingValue(node: Node): boolean {
+  return isStartComment(node);
+}
+
+export function virtualNodeBindingValue(node: Node): string | null {
+  const match = (node.nodeValue || '').match(startCommentRegex);
+  return match ? match[1]?.trim() ?? null : null;
+}

package/src/wireParams.ts

@@ -1,49 +1,69 @@
-import { Observable } from './observable.js';
-import { Computed } from './computed.js';
-import { isSubscribable } from './subscribable.js';
-import type { Subscription } from './subscribable.js';
-import { getObservable, replaceObservable } from './decorators.js';
-import { addDisposeCallback } from './domNodeDisposal.js';
-
-const SKIP_KEYS = new Set(['$raw']);
-
-export interface WireParamsResult {
-  subscriptions: Subscription<unknown>[];
-}
-
-export function wireParams(
-  instance: object,
-  params: Record<string, unknown>,
-  element?: Node,
-): WireParamsResult {
-  const subscriptions: Subscription<unknown>[] = [];
-
-  for (const key of Object.keys(params)) {
-    if (SKIP_KEYS.has(key)) continue;
-
-    const paramValue = params[key];
-    const childObs = getObservable(instance, key);
-    const childIsReactive = childObs !== undefined && isSubscribable(childObs);
-
-    if (paramValue instanceof Observable) {
-      if (childIsReactive) {
-        replaceObservable(instance, key, paramValue);
-      } else {
-        (instance as Record<string, unknown>)[key] = paramValue.get();
-      }
-    } else if (paramValue instanceof Computed) {
-      (instance as Record<string, unknown>)[key] = paramValue.get();
-      const sub = paramValue.subscribe((newValue: unknown) => {
-        (instance as Record<string, unknown>)[key] = newValue;
-      });
-      subscriptions.push(sub);
-      if (element) {
-        addDisposeCallback(element, () => sub.dispose());
-      }
-    } else {
-      (instance as Record<string, unknown>)[key] = paramValue;
-    }
-  }
-
-  return { subscriptions };
-}
+import { Observable } from './observable.js';
+import { Computed } from './computed.js';
+import { isSubscribable } from './subscribable.js';
+import type { Subscription } from './subscribable.js';
+import { getObservable, replaceObservable } from './decorators.js';
+import { addDisposeCallback } from './domNodeDisposal.js';
+
+const SKIP_KEYS = new Set(['$raw']);
+
+function getWritableChildTarget(instance: object, key: string): Observable<unknown> | Computed<unknown> | undefined {
+  const decorated = getObservable(instance, key);
+  if (decorated instanceof Observable) return decorated;
+  if (decorated instanceof Computed && decorated.hasWriteFunction) return decorated;
+
+  const directValue = (instance as Record<string, unknown>)[key];
+  if (directValue instanceof Observable) return directValue;
+  if (directValue instanceof Computed && directValue.hasWriteFunction) return directValue;
+
+  return undefined;
+}
+
+export interface WireParamsResult {
+  subscriptions: Subscription<unknown>[];
+}
+
+export function wireParams(
+  instance: object,
+  params: Record<string, unknown>,
+  element?: Node,
+): WireParamsResult {
+  const subscriptions: Subscription<unknown>[] = [];
+
+  for (const key of Object.keys(params)) {
+    if (SKIP_KEYS.has(key)) continue;
+
+    const paramValue = params[key];
+    const childTarget = getWritableChildTarget(instance, key);
+    const childIsReactive = childTarget !== undefined && isSubscribable(childTarget);
+
+    if (paramValue instanceof Observable) {
+      if (childIsReactive) {
+        replaceObservable(instance, key, paramValue);
+      } else {
+        (instance as Record<string, unknown>)[key] = paramValue.get();
+      }
+    } else if (paramValue instanceof Computed) {
+      if (childTarget) {
+        childTarget.set(paramValue.get());
+      } else {
+        (instance as Record<string, unknown>)[key] = paramValue.get();
+      }
+      const sub = paramValue.subscribe((newValue: unknown) => {
+        if (childTarget) {
+          childTarget.set(newValue);
+        } else {
+          (instance as Record<string, unknown>)[key] = newValue;
+        }
+      });
+      subscriptions.push(sub);
+      if (element) {
+        addDisposeCallback(element, () => sub.dispose());
+      }
+    } else {
+      (instance as Record<string, unknown>)[key] = paramValue;
+    }
+  }
+
+  return { subscriptions };
+}