move events to dom api (#117)

* move events to dom api * is empty fn * + * + * +
lifeart · May 1, 2024 · b3b70cb · b3b70cb
1 parent 5939146
commit b3b70cb
Show file tree

Hide file tree

Showing 5 changed files with 116 additions and 120 deletions.
diff --git a/src/utils/component.ts b/src/utils/component.ts
@@ -15,6 +15,7 @@ import {
   RENDER_TREE,
   isPrimitive,
   isArray,
+  isEmpty,
 } from './shared';
 import { addChild, getRoot, setRoot } from './dom';
 
@@ -34,7 +35,7 @@ export type GenericReturnType =
 
 function renderNode(parent: Node, target: Node, placeholder: Node | Comment) {
   if (import.meta.env.DEV) {
-    if (target === undefined || target === null) {
+    if (isEmpty(target)) {
       console.warn(`Trying to render ${typeof target}`);
       return;
     }
@@ -52,11 +53,10 @@ export function renderElement(
   placeholder: Comment | Node,
 ) {
   if (!isArray(el)) {
-    if (el === null || el === undefined || el === '') {
+    if (isEmpty(el) || el === '') {
       return;
     }
     if (isPrimitive(el)) {
-      // @ts-expect-error
       renderNode(target, api.text(el), placeholder);
     } else if ($nodes in el) {
       el[$nodes].forEach((node) => {
@@ -383,21 +383,4 @@ export type Slots = Record<
 export type ComponentReturnType = {
   nodes: Node[];
   ctx: Component<any> | null;
-};
-
-const noop = () => {};
-
-export function addEventListener(
-  node: Node,
-  eventName: string,
-  fn: EventListener,
-) {
-  node.addEventListener(eventName, fn);
-  if (RUN_EVENT_DESTRUCTORS_FOR_SCOPED_NODES) {
-    return () => {
-      node.removeEventListener(eventName, fn);
-    };
-  } else {
-    return noop;
-  }
-}
+};
diff --git a/src/utils/dom-api.ts b/src/utils/dom-api.ts
@@ -1,5 +1,5 @@
 import { getNodeCounter, incrementNodeCounter } from '@/utils/dom';
-import { IN_SSR_ENV } from './shared';
+import { IN_SSR_ENV, noop } from './shared';
 
 let $doc =
   typeof document !== 'undefined'
@@ -12,9 +12,27 @@ export function getDocument() {
   return $doc;
 }
 export const api = {
+  addEventListener(node: Node, eventName: string, fn: EventListener) {
+    if (import.meta.env.SSR) {
+      return noop;
+    }
+    node.addEventListener(eventName, fn);
+    if (RUN_EVENT_DESTRUCTORS_FOR_SCOPED_NODES) {
+      return () => {
+        node.removeEventListener(eventName, fn);
+      };
+    } else {
+      return noop;
+    }
+  },
   attr(element: HTMLElement, name: string, value: string | null) {
     element.setAttribute(name, value === null ? '' : value);
   },
+  prop(element: HTMLElement, name: string, value: any) {
+    // @ts-ignore
+    element[name] = value;
+    return value;
+  },
   comment(text = '') {
     if (IN_SSR_ENV) {
       incrementNodeCounter();
@@ -27,8 +45,8 @@ export const api = {
       }
     }
   },
-  text(text = '') {
-    return $doc.createTextNode(text);
+  text(text: string | number = '') {
+    return $doc.createTextNode(text as string);
   },
   textContent(node: Node, text: string) {
     node.textContent = text;