plugin.json

{
  "id": "render_web_app",
  "uuid": "af76c947-6deb-435e-8338-a712c8b36eb0",
  "emoji": "🔨",
  "iconURL": "https://custom.typingmind.com/assets/plugins/web-app-builder.webp",
  "title": "Web App Builder",
  "pluginFunctions": [
    {
      "id": "LEGACY_DEFAULT_FUNCTION",
      "name": "Render",
      "implementationType": "javascript",
      "outputType": "render_html",
      "openaiSpec": {
        "name": "render_web_app",
        "parameters": {
          "type": "object",
          "required": [
            "htmlSource"
          ],
          "properties": {
            "htmlSource": {
              "type": "string",
              "description": "The full HTML source to render to the canvas. Must be a complete document (e.g. starting with <!DOCTYPE html> or <html>). To use an image from the chat attachments, write its URL as `tm-attachment://<id>` with an attachment id from the <CHAT_ATTACHMENTS> list, e.g. `<img src=\"tm-attachment://<id>\">` or `background-image: url(tm-attachment://<id>)`; it is replaced with the real image when the app is displayed. Never embed the image data yourself. After this initial render, prefer the `update_web_app` tool to make small edits — it is much faster and uses far fewer tokens than re-emitting the entire HTML."
            }
          }
        },
        "description": "Render an interactive web app with HTML/CSS/JS source to the user interface. The HTML source can include JavaScript and CSS to create interactive elements. This can be used to create custom user interfaces, games, demos, charts, simple web apps, and more. Use this plugin when the user asks to create a web app, an interactive demo, a game, or some other types of interactive content. Use this for the FIRST render and for full rewrites. For small follow-up tweaks to a web app you have already rendered, prefer `update_web_app`. Use search_web_app_source and read_web_app_lines to inspect the latest source before editing. Use read_web_app_source only when you need the full source."
      },
      "codeFile": "render.js"
    },
    {
      "id": "5c5d0c9b-4d6a-4d72-9c05-7c1f3a3a4f01",
      "name": "Update",
      "implementationType": "javascript",
      "outputType": "render_html",
      "openaiSpec": {
        "name": "update_web_app",
        "parameters": {
          "type": "object",
          "required": [
            "edits"
          ],
          "properties": {
            "edits": {
              "type": "array",
              "minItems": 1,
              "description": "An ordered list of search-and-replace edits to apply to the most recently rendered web app HTML. Edits are applied sequentially: each edit operates on the result of the previous one. Each `oldText` must appear EXACTLY ONCE in the current HTML — include enough surrounding context (whitespace and neighbouring tags) to make the match unique. To insert new content, set `oldText` to a unique anchor that already exists and put both that anchor and the new content into `newText`. To delete content, set `newText` to an empty string.",
              "items": {
                "type": "object",
                "required": [
                  "oldText",
                  "newText"
                ],
                "properties": {
                  "oldText": {
                    "type": "string",
                    "description": "The exact substring to find in the current HTML. Whitespace, casing and punctuation must match byte-for-byte. Must occur exactly once in the current HTML."
                  },
                  "newText": {
                    "type": "string",
                    "description": "The replacement text. Use an empty string to delete the matched region."
                  }
                }
              }
            }
          }
        },
        "description": "Apply small, targeted edits to the most recently rendered web app instead of re-emitting the full HTML. Each edit performs an exact, literal find-and-replace on the current HTML. Use this WHENEVER you only need to tweak parts of an existing web app you previously rendered with `render_web_app` — it is much faster and uses far fewer output tokens than re-emitting the entire HTML.\n\nRules:\n- Do NOT use this for the very first render — use `render_web_app` instead.\n- Each `oldText` must match EXACTLY ONCE in the current HTML; include enough surrounding context to make it unique. If a match is ambiguous (matches more than once) or missing, the call will fail and you should retry with more context, or fall back to `render_web_app` with the full updated HTML.\n- Edits are applied in order; later edits see the result of earlier ones.\n- Prefer many small edits over one big rewrite — it makes failures localised and easier to retry.\n- Use search_web_app_source to locate code, then read_web_app_lines for the surrounding source before choosing oldText. Line number prefixes in those results are not part of the source."
      },
      "codeFile": "update.js"
    },
    {
      "id": "ed7a0f36-4d64-4d96-9880-9238fe7ae760",
      "name": "Read Source",
      "implementationType": "javascript",
      "outputType": "respond_to_ai",
      "openaiSpec": {
        "name": "read_web_app_source",
        "parameters": {
          "type": "object",
          "properties": {}
        },
        "description": "Read the full, exact HTML source of the latest web app rendered or updated by this plugin. Does not change the app. Attachment placeholders remain unchanged. Prefer search_web_app_source and read_web_app_lines when you only need part of a large app."
      },
      "codeFile": "read-source.js"
    },
    {
      "id": "7cf0e691-d23d-4dce-94d5-872707938e2b",
      "name": "Search Source",
      "implementationType": "javascript",
      "outputType": "respond_to_ai",
      "openaiSpec": {
        "name": "search_web_app_source",
        "parameters": {
          "type": "object",
          "required": [
            "keyword"
          ],
          "properties": {
            "keyword": {
              "type": "string",
              "minLength": 1,
              "description": "Literal text to find within each line. Matching is case-insensitive; regular expressions are not supported."
            },
            "limit": {
              "type": "integer",
              "minimum": 1,
              "maximum": 200,
              "default": 50,
              "description": "Maximum number of matching lines to return, starting from the top of the source. Defaults to 50."
            }
          }
        },
        "description": "Search the latest web app HTML for a literal keyword, ignoring case. Return matching lines with 1-based line numbers and the total match count. Does not change the app. Use read_web_app_lines to read nearby lines before editing. Line number prefixes are not part of the source."
      },
      "codeFile": "search-source.js"
    },
    {
      "id": "bdb977c5-4217-45de-bccb-cf33c73ed6a5",
      "name": "Read Lines",
      "implementationType": "javascript",
      "outputType": "respond_to_ai",
      "openaiSpec": {
        "name": "read_web_app_lines",
        "parameters": {
          "type": "object",
          "required": [
            "startLine",
            "endLine"
          ],
          "properties": {
            "startLine": {
              "type": "integer",
              "minimum": 1,
              "description": "First line to read, starting at 1."
            },
            "endLine": {
              "type": "integer",
              "minimum": 1,
              "description": "Last line to read, inclusive. Must be at least startLine."
            }
          }
        },
        "description": "Read an inclusive range of lines from the latest web app HTML, with 1-based line numbers. Does not change the app. endLine is capped at the final source line. Line number prefixes are not part of the source; omit them when building update_web_app edits."
      },
      "codeFile": "read-lines.js"
    }
  ]
}