@ai-slot/adapter-dom 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 iannil
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,39 @@
+# @ai-slot/adapter-dom
+
+DOM renderer adapter for [ai-slot-component](https://github.com/iannil/ai-slot-component#readme): map validated component trees to plain HTML elements — no framework required.
+
+Text is always written via `textContent`, never `innerHTML`; unregistered components are skipped with a warning.
+
+## Install
+
+```bash
+npm install @ai-slot/adapter-dom
+```
+
+## Usage
+
+```ts
+import { registerRenderer } from "@ai-slot/runtime";
+import { createDomRenderer } from "@ai-slot/adapter-dom";
+
+registerRenderer(
+  "dom",
+  createDomRenderer({
+    Banner: {
+      tag: "section",
+      class: "hero",
+      applyProps: (el, props) => {
+        /* write props onto the element */
+      },
+    },
+  }),
+);
+```
+
+## Docs
+
+- [Root README](https://github.com/iannil/ai-slot-component#readme)
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+import { Renderer } from '@ai-slot/runtime';
+
+interface DomComponentDef {
+    /** 组件映射到的 HTML 标签 */
+    tag: string;
+    class?: string;
+    /** 写入 props。实现方必须用 textContent 写文本，禁止把 AI 文本塞进 innerHTML。 */
+    applyProps?: (el: HTMLElement, props: Record<string, unknown>) => void;
+    /** 子元素挂载点，默认组件元素本身 */
+    childrenTarget?: (el: HTMLElement) => HTMLElement;
+}
+/** 内置 DOM 渲染器：按注册表 tag 映射直接建 DOM。未注册组件跳过并警告。只消费默认槽位 children，命名槽位（ctx.slots）会被忽略。 */
+declare function createDomRenderer(components: Record<string, DomComponentDef>): Renderer;
+
+export { type DomComponentDef, createDomRenderer };

package/dist/index.js

@@ -0,0 +1,19 @@
+// src/dom-renderer.ts
+function createDomRenderer(components) {
+  return (node, ctx) => {
+    const def = Object.hasOwn(components, node.component) ? components[node.component] : void 0;
+    if (!def) {
+      console.warn(`[ai-slot] \u7EC4\u4EF6\u672A\u5728\u5BA2\u6237\u7AEF\u6CE8\u518C\uFF0C\u5DF2\u8DF3\u8FC7: ${node.component}`);
+      return null;
+    }
+    const el = document.createElement(def.tag);
+    if (def.class) el.className = def.class;
+    def.applyProps?.(el, node.props ?? {});
+    const target = def.childrenTarget?.(el) ?? el;
+    for (const child of ctx.children) target.appendChild(child);
+    return el;
+  };
+}
+export {
+  createDomRenderer
+};

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@ai-slot/adapter-dom",
+  "version": "0.1.0",
+  "license": "MIT",
+  "description": "DOM renderer adapter for ai-slot: map validated component trees to plain HTML elements.",
+  "keywords": [
+    "dom",
+    "web-components",
+    "ai",
+    "renderer"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/iannil/ai-slot-component.git",
+    "directory": "packages/adapter-dom"
+  },
+  "bugs": "https://github.com/iannil/ai-slot-component/issues",
+  "homepage": "https://github.com/iannil/ai-slot-component/tree/master/packages/adapter-dom#readme",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "sideEffects": false,
+  "dependencies": {
+    "@ai-slot/registry": "0.1.0",
+    "@ai-slot/runtime": "0.1.0"
+  },
+  "devDependencies": {
+    "jsdom": "^25.0.0",
+    "tsup": "^8.3.0",
+    "typescript": "^5.6.0",
+    "vitest": "^2.1.0"
+  },
+  "scripts": {
+    "build": "tsup src/index.ts --format esm --dts --clean",
+    "test": "vitest run",
+    "typecheck": "tsc --noEmit"
+  }
+}