angular-ui

Name: angular-ui
Author: Bat7Sheva

Use when creating or modifying Angular components, services, modules, or templates. Covers component structure, form patterns, API communication for this CRM project.

by Bat7Sheva(0) 0 installs

Free

Free account. Installing gives you the manifest plus copy-paste snippets.

See reviews

About

Instruction file imported from Bat7Sheva/SpaceFlow (.github/instructions/angular-ui.instructions.md). Copyright stays with the author.

Angular UI Guidelines

Component Structure

Use standalone components
Reactive Forms only (no template-driven)
Inject services via inject() function

API Communication

ONE central ApiService that wraps HttpClient
Each feature has its own service (e.g. LeadService) that calls ApiService
Always handle loading state and error state in components

UI Rules

Use Angular Material components only - no custom CSS framework
Every list screen has: search input, status filter, loading spinner, empty state
Every form has: validation messages, save button with loading state, cancel button

Navigation

Use Angular Router with lazy loading per feature module
Route structure: /leads, /leads/:id, /today

Use it

Copy one of these into your project. Installing also returns the manifest and these snippets.

yaml

targets:
  - https://api.opensmartroute.ai/api/v1/registry/bat7sheva-spaceflow-angular-ui-instructions/manifest   # or paste the manifest below

Manifest

An Open Capability Manifest: the router reads it to know what this does, what it costs and when to pick it.

bat7sheva-spaceflow-angular-ui-instructions.ocm.jsonjson

{
  "ocm": "1",
  "id": "bat7sheva-spaceflow-angular-ui-instructions",
  "kind": "skill",
  "name": "angular-ui",
  "description": "Use when creating or modifying Angular components, services, modules, or templates. Covers component structure, form patterns, API communication for this CRM project.",
  "publisher": "Bat7Sheva",
  "version": "1.0.0",
  "capabilities": {
    "domains": [
      "coding"
    ],
    "tags": [
      "skill-md",
      "github-instructions"
    ],
    "languages": [
      "en"
    ]
  },
  "quality_prior": 0.6,
  "examples": [
    "Use when creating or modifying Angular components, services, modules, or templates. Covers component structure, form patterns, API communication for this CRM project."
  ],
  "primary": false,
  "metadata": {
    "source": {
      "provider": "github-instructions",
      "repository": "https://github.com/Bat7Sheva/SpaceFlow",
      "path": ".github/instructions/angular-ui.instructions.md",
      "ref": "6e8fcd004cf029cbfdc57c58b92ac33176817c48",
      "url": "https://github.com/Bat7Sheva/SpaceFlow/blob/6e8fcd004cf029cbfdc57c58b92ac33176817c48/.github/instructions/angular-ui.instructions.md",
      "key": "Bat7Sheva/SpaceFlow/.github/instructions/angular-ui.instructions.md"
    },
    "applies_to": "**/*.ts, **/*.html"
  },
  "instructions": "# Angular UI Guidelines\n\n## Component Structure\n- Use standalone components\n- Reactive Forms only (no template-driven)\n- Inject services via `inject()` function\n\n## API Communication\n- ONE central `ApiService` that wraps HttpClient\n- Each feature has its own service (e.g. `LeadService`) that calls `ApiService`\n- Always handle loading state and error state in components\n\n## UI Rules\n- Use Angular Material components only - no custom CSS framework\n- Every list screen has: search input, status filter, loading spinner, empty state\n- Every form has: validation messages, save button with loading sta",
  "cost": {
    "context_tokens": 185
  }
}

Fetch it by URL: GET /api/v1/registry/bat7sheva-spaceflow-angular-ui-instructions/manifest?version=1.0.0