@deints/ask-sir

Ask SIR Safety plugin — generative UI con brand SIR Safety System

An Ask generative-UI plugin: a set of custom components an LLM can compose into a page at runtime. Built on @websolutespa/ask-plugin and @websolutespa/ask-ui.

Develop

pnpm install
pnpm build     # tsdown (ESM + browser bundle) + Tailwind -> dist/styles.css
pnpm types     # tsc --noEmit

Structure

• src/catalog.ts — component schema + descriptions shown to the LLM.
• src/blocks/* — the custom React components the LLM can render.
• src/registry.ts — maps catalog names to blocks.
• src/components/* — chat shell overrides (Renderer binds the registry).
• src/exports/* — package subpath entrypoints (browser, catalog, registry, client).
• src/globals.css — Tailwind v4 theme.

Add a component

1. Add an entry (and a *Skeleton) to src/catalog.ts.
2. Create src/blocks/<name>.tsx typed with ComponentContext<'Name'>.
3. Register both in src/registry.ts.
4. Rebuild and bump the version.

Publish & register

npm publish --access public

Then set the app's pluginPackage to @deints/ask-sir on the platform (pluginLocal = false for CDN resolution).

Conventions (must hold)

• Package @deints/ask-sir → global askSir → tag <ask-sir>.
• ./catalog must export getSystemPrompt and catalog.
• ./browser self-registers the Web Component.
• The browser bundle inlines all deps (deps.alwaysBundle: ['**']).
• Use container query variants (@md:) instead of viewport (md:).