Zero-JS Embed

Single script tag — no React, no build step. Works on any website.

1. Zero-JS Embed

Just add a script tag with data-* attributes. No JavaScript required.

data-* Attributes

HTML · html
<script
  src="https://cdn.example.com/widget.js"
  data-api-url="https://agent-api.zenku.dev"
  data-mode="bubble"
  data-color="#667eea"
  data-greeting="Hi! I can help you find the perfect product."
  data-theme="system"
  data-suggestions="true"
  data-position="bottom-right"
></script>

2. Embed + JavaScript API

Use data-on-ready to get the API object. Register actions, share state, and listen for events.

JavaScript API · javascript
function onChatReady(chat) {
  // Share state with AI
  chat.setReadable("cart", {
    description: "User shopping cart",
    value: { items: [], total: 0 }
  });

  // Register callable action
  chat.registerAction("addToCart", {
    description: "Add a product to the cart",
    parameters: {
      productName: { type: "string" },
      price: { type: "number" },
      quantity: { type: "number" }
    },
    handler: async (params) => {
      // Update cart DOM...
      return "Added to cart";
    }
  });

  // Listen for events
  chat.on("message", (msg) => console.log(msg));
  chat.on("open", () => console.log("opened"));
  chat.on("close", () => console.log("closed"));

  // Programmatic control
  chat.open();
  chat.sendMessage("Hello!");
}

Programmatic Controls

Event Console

Waiting for events...