Complete AI TrainingYourJobSkills for your job

Skills / frontend

markstream-angular

Integrate the alpha markstream-angular renderer into Angular 20+ applications with standalone components, signals, safe HTML defaults, and optional peer features.

IT & Software Developmentai-chatangularfrontendmarkdownstreaming

Markstream Angular

Overview

Add Markstream to Angular 20+ while preserving standalone-component patterns, signal-friendly bindings, safe rendering defaults, and explicit optional dependencies. Use markstream-install for framework selection; use this skill once Angular is confirmed.

When to Use

Use for Angular-specific standalone imports, CSS, signals, custom tags or components, streaming state, and optional peers. Do not use below Angular 20 or when the application cannot accept an alpha renderer API.

Workflow

Before changing dependencies or source files, inspect the existing package manager and project conventions, preview the intended edits, and obtain explicit user approval.

  1. Confirm Angular 20+ and record that markstream-angular is alpha.
  2. Install the package plus only requested peers. Import markstream-angular/index.css; add KaTeX CSS only for math.
  3. Import MarkstreamAngularComponent into the standalone component's imports.
  4. Start with [content] and [smoothStreaming]="'auto'". Use nodes plus final only when another layer owns the AST.
  5. For live chat use [fade]="false" and opt into [typewriter]="true". On completion set [final]="true", disable pacing/cursor, and enable fade only if desired.
  6. Use [customHtmlTags] and [customComponents] only for trusted tag workflows.
  7. Keep [htmlPolicy]="'safe'" and Mermaid strict

Subscribers only

The full skill, its 1 bundled files and every download is included with every paid Complete AI plan.

Details

SourceSimon-He95/markstream-vue
LicenseMIT
Risk labelcritical ("critical" means the skill may run commands or touch files — read before use)
FilesSKILL.md
Added2026-07-21

Related skills

anti-ui-slop

Stop coding agents from shipping generic UI. Extend the product's design system, use UIZZE evidence only when useful, cover required states, and inspect the rendered result.

astro

Build content-focused websites with Astro — zero JS by default, islands architecture, multi-framework components, and Markdown/MDX support.

chat-widget

Build a real-time support chat system with a floating widget for users and an admin dashboard for support staff. Use when the user wants live chat, customer support chat, real-time messaging, or in-app support.

chrome-extension-developer

Expert in building Chrome Extensions using Manifest V3. Covers background scripts, service workers, content scripts, and cross-context communication.

design-it

Routes frontend design tasks to 48 specific UI styles. Triggers for websites, app screens, or UI components requesting a specific aesthetic.

design-taste-frontend

Use when building high-agency frontend interfaces with strict design taste, calibrated color, responsive layout, and motion rules.