From cd4d195bd439dc1c97513370af148e93aa806a67 Mon Sep 17 00:00:00 2001
From: Astrian Zheng <happy.wheel6743@astrian.moe>
Date: Wed, 14 May 2025 15:21:45 +1000
Subject: [PATCH] Refactor component structure: move ComponentOptions to
 main.ts, update package.json, and remove unused files

---
 package.json                    |  4 +-
 src/index.ts                    | 32 ----------------
 src/main.ts                     | 66 +++++++++++++++++++++++++++++++++
 src/types/ComponentOptions.d.ts |  8 ----
 tsconfig.json                   |  2 +-
 5 files changed, 69 insertions(+), 43 deletions(-)
 delete mode 100644 src/index.ts
 create mode 100644 src/main.ts
 delete mode 100644 src/types/ComponentOptions.d.ts

diff --git a/package.json b/package.json
index dcfee8d..9913213 100644
--- a/package.json
+++ b/package.json
@@ -1,8 +1,8 @@
 {
   "name": "laterano",
   "version": "0.0.0",
-  "main": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "dist/main.js",
+  "types": "dist/main.d.ts",
   "scripts": {
     "build": "tsc"
   },
diff --git a/src/index.ts b/src/index.ts
deleted file mode 100644
index ac5ebd8..0000000
--- a/src/index.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-export default (options: ComponentOptions) => {
-	const { tag, template, style, onMount, onUnmount, onAttributeChanged } = options
-
-	class CustomElement extends HTMLElement {
-		constructor() {
-			super()
-			this.attachShadow({ mode: 'open' })
-			this.shadowRoot!.innerHTML = `
-				<style>${style}</style>
-				${template}
-			`
-		}
-
-		connectedCallback() {
-			if (onMount) onMount()
-		}
-
-		disconnectedCallback() {
-			if (onUnmount) onUnmount()
-		}
-
-		static get observedAttributes() {
-			return ['data-attribute']
-		}
-
-		attributeChangedCallback(attrName: string, oldValue: string, newValue: string) {
-			if (onAttributeChanged) onAttributeChanged(attrName, oldValue, newValue)
-		}
-	}
-
-	customElements.define(tag, CustomElement)
-}
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..fa5bc5e
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,66 @@
+interface ComponentOptions {
+	tag: string
+	template: string
+	style?: string
+	onMount?: () => void
+	onUnmount?: () => void
+	onAttributeChanged?: (attrName: string, oldValue: string, newValue: string) => void
+}
+
+export default (options: ComponentOptions) => {
+	const { tag, template, style, onMount, onUnmount, onAttributeChanged } = options
+	const componentRegistry = new Map()
+	componentRegistry.set(tag, options)
+
+	const domTree = document.createElement('template')
+
+	class CustomElement extends HTMLElement {
+		constructor() {
+			super()
+			this.attachShadow({ mode: 'open' })
+			this._initialize()
+		}
+
+		private _initialize() {
+			if (style) {
+				const styleElement = document.createElement('style')
+				styleElement.textContent = style
+				this.shadowRoot?.appendChild(styleElement)
+			}
+			
+			// 使用 text/html 解析，这更适合处理 HTML 模板
+			const parser = new DOMParser()
+			const doc = parser.parseFromString(template, 'text/html')
+			
+			// 找到并导入主要内容元素
+			const mainContent = doc.body.firstElementChild
+			if (mainContent) {
+				// 使用 importNode 确保所有事件和属性都被正确复制
+				this.shadowRoot?.appendChild(document.importNode(mainContent, true))
+			} else {
+				// 如果没有根元素，将所有内容放入一个新的 div 中
+				const container = document.createElement('div')
+				container.innerHTML = template
+				this.shadowRoot?.appendChild(container)
+			}
+		}
+
+		connectedCallback() {
+			if (onMount) onMount()
+		}
+
+		disconnectedCallback() {
+			if (onUnmount) onUnmount()
+		}
+
+		static get observedAttributes() {
+			return ['data-attribute']
+		}
+
+		attributeChangedCallback(attrName: string, oldValue: string, newValue: string) {
+			if (onAttributeChanged) onAttributeChanged(attrName, oldValue, newValue)
+		}
+	}
+
+	customElements.define(tag, CustomElement)
+}
\ No newline at end of file
diff --git a/src/types/ComponentOptions.d.ts b/src/types/ComponentOptions.d.ts
deleted file mode 100644
index 0eaa9ad..0000000
--- a/src/types/ComponentOptions.d.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-interface ComponentOptions {
-	tag: string
-	template: string
-	style?: string
-	onMount?: () => void
-	onUnmount?: () => void
-	onAttributeChanged?: (attrName: string, oldValue: string, newValue: string) => void
-}
\ No newline at end of file
diff --git a/tsconfig.json b/tsconfig.json
index bd46907..002c0a8 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -32,7 +32,7 @@
     // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
     // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
     // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
-    "typeRoots": ["./src/types"],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "typeRoots": ["./src/types"],                                  /* Specify multiple folders that act like './node_modules/@types'. */
     // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
     // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
     // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */