Skip to main content

Application Templates

The AI Dev Kit can materialize five official application templates. Ask your coding agent for the desired framework and ownership model; it will select exactly one template and retrieve only that directory.

Available Templates

Template IDFrameworkModeChoose it when
io-assist-react-packagedReactPackaged io.AssistYou want a ready-made assistant UI through the published React package.
io-assist-angular-packagedAngularPackaged io.AssistYou want a ready-made assistant UI through the published Angular package.
io-assist-react-editableReactEditable io.AssistYou want the official assistant source as a starting point and will own subsequent changes.
io-assist-angular-editableAngularEditable io.AssistYou want the official assistant source as a starting point and will own subsequent changes.
ai-web-vanillaVanilla JavaScriptCustom AI WebYou want a framework-free shell for building a custom assistant experience.

Packaged or Editable io.Assist?

Choose packaged when the published assistant's configuration and extension points meet your needs. The application consumes the io.Assist package as a normal dependency, which keeps the assistant implementation outside your application source.

Choose editable when configuration isn't enough and you need direct ownership of the assistant implementation. Materialization is a one-way fork: the source becomes yours to change and maintain. V1 doesn't automatically merge later upstream features or fixes into an editable application.

Choose custom AI Web when you don't want io.Assist as the UI foundation and need to design the experience directly with the AI Web SDK.

Describe the outcome and target directory instead of invoking the materializer yourself:

Create a packaged Angular io.Assist application in ./assistant using the official AI Dev Kit template. Inspect the generated project and tell me what is required before it can run.

The coding agent should:

  1. establish the framework and choose packaged, editable, or custom mode;
  2. select exactly one template ID;
  3. require an absent or empty target directory;
  4. run the materializer included in the installed skill;
  5. work only with the selected, materialized application;
  6. inspect its manifest, lockfile, framework configuration, scripts, ports, and io.Connect setup instead of assuming them;
  7. preserve the generated provenance file.

If retrieval fails, the agent should report the failure. It shouldn't recreate the template from memory, substitute a different preset, or fetch a mutable branch.

Direct Materializer Usage

Agent-driven use is recommended, but the bundled script can also be invoked directly. Resolve <skill-directory> to the installed directory that contains the io-intelligence skill's SKILL.md:

node <skill-directory>/scripts/materialize-template.mjs --list
node <skill-directory>/scripts/materialize-template.mjs \
--template io-assist-react-packaged \
--target ./my-io-assist

The target must be absent or empty. The materializer requires Node.js 18 or newer, Git, and network access.

Retrieval and Provenance

Template source isn't installed with the skill. The materializer retrieves only the selected directory from the public InteropIO/iointel-dev-kit repository at the immutable tag recorded in its catalog. The current V1 catalog pins every template to V1.0.1.

The generated .io-intelligence-template.json records the template ID, repository, immutable tag, source path, framework, mode, and materialization time. Keep this file unless you deliberately choose to remove the provenance record.

The materializer retrieves source and records provenance. It doesn't install dependencies, start or build the application, register it with io.Connect, or validate its behavior. Those actions remain with the coding agent and developer.

Configure Before Starting

All V1 templates intentionally define AGENT_SERVER_URL as an empty string. Before starting a template application, set it to a valid LLM agentic backend that implements the io.Intelligence Agent Protocol.

Don't start with an empty agent server URL

The empty value blocks application startup, not materialization or use of the AI Dev Kit. Building the application can still be useful when the project defines a build command, but build success doesn't establish backend connectivity.

Don't invent a URL. Use a value supplied by the developer or established from the project's environment. If an existing backend uses Mastra, the kit can help configure AI Mastra Bridge. For other backends, it can help implement a custom Agent Protocol adapter.

Run as an io.Connect Application

Every template is an io.Connect client. The coding agent should discover the project's start and build scripts, development port, and platform configuration from the materialized files.

A standalone web server listening on its port isn't proof that the app behaves correctly inside io.Connect. Runtime inspection must use the applicable io.Connect application-registration and launch flow:

If the coding agent can't establish the correct io.Connect environment, it may still report evidence such as a successful dependency installation, build, or development process. It should state clearly that io.Connect-integrated behavior wasn't inspected.