Skills
.Work. You
Rest

component-inventory

Community

Derive a reusable UI library from screens.

Design & Creative#ui#documentation#component#inventory#design-system#screens#variants
Authorbflandev
Version1.0.0
Installs0

System Documentation

What problem does it solve?

Use this skill to derive a reusable UI component library from a screen inventory, identifying common elements and variants to accelerate design-system work and handoffs.

Core Features & Use Cases

  • Extract raw components from screens (inputs, buttons, records, badges, navigation, empty states, modals, data views)
  • Consolidate into named components (e.g., FormFieldBlock, RecordRow, StatusBadge)
  • Define variants for each component (empty, filled, required-error, type-error, disabled, hidden)
  • Identify shared components and plan for design-system consolidation
  • Support for actor-specific or permission-based variants and mapping to design assets

Quick Start

Generate a component inventory from your screen inventory to outline reusable UI components and their variants for design-system planning.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: component-inventory
Download link: https://github.com/bflandev/threadline-ai/archive/main.zip#component-inventory

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.