ant-design-family-frontend

Enforce Ant Design family governance across frontend design and implementation outputs.

Updated May 9, 2026
One-click install
npx skills add https://github.com/RhyTsui/PMOS --skill ant-design-family-frontend
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ant-design-family-frontend
Source: https://github.com/RhyTsui/PMOS/tree/main/skills/ant-design-family-frontend
Command: npx skills add https://github.com/RhyTsui/PMOS --skill ant-design-family-frontend

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It prevents inconsistent frontend outputs by enforcing PMOS’s Ant Design family baseline across design, UI schema, implementation handoff, and final page delivery.

Core Features & Use Cases

  • Governed Ant Design Family baseline: Ensures the output follows the required layering (Ant Design X host + Ant Design foundational layer) rather than generic Ant Design pages.
  • UI schema and implementation-ready delivery: Produces route/layout shell, functional links, and page contracts suitable for downstream frontend work.
  • Pro adapter boundary handling: Forces explicit decisions when Ant Design Pro/Pro Components are involved (reference only, isolated adapter layer, or blocked by compatibility).
  • State and verification expectations: Includes loading/empty/error/permission states and aligns outputs with browser-verification before user review.

Quick Start

Use this skill to generate a DESIGN.md and ui-schema for a new PMOS frontend page that must follow the Ant Design family baseline, including the correct Ant Design X host and Pro isolation decision.

Frequently Asked Questions about ant-design-family-frontend

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a DESIGN.md and UI schema for Ant Design frontend pages?

To create a DESIGN.md and UI schema for Ant Design frontend pages, apply a governed baseline that specifies host/foundation bindings, route/layout shells, and typed-surface decisions. This ensures implementation-ready delivery for downstream frontend work.

What is the Ant Design family governance baseline for frontend delivery?

The Ant Design family governance baseline enforces required layering using Ant Design X as the host and Ant Design as the foundational layer. It prevents inconsistent frontend outputs by mandating explicit state coverage and browser-verification expectations.

How do I handle Ant Design Pro adapter boundaries in a frontend project?

Handle Ant Design Pro adapter boundaries by making explicit decisions for Pro Components: use as reference only, isolate in a dedicated adapter layer, or block them entirely due to compatibility constraints. This prevents unmanaged integration issues.

Does this frontend delivery approach require specific loading and error state coverage?

Yes, this frontend delivery approach requires full state coverage including loading, empty, error, and permission states. It aligns outputs with browser-verification expectations before final user review to ensure complete UI contracts.

What's the best way to ensure implementation handoff consistency in Ant Design X projects?

The best way to ensure implementation handoff consistency in Ant Design X projects is to enforce a PMOS baseline that produces governed page contracts, explicit route/layout roles, and typed-surface decisions suitable for downstream frontend work.