[
  {
    "name": "common-fixes",
    "tagline": "Fix the most common @godxjp/ui consumer mistakes & visual bugs (StatCard double-border, grey Badge, crushed/empty table headers, washed-out sidebar footer, Inertia layout crash, SSR hydration). Before → after.",
    "tags": [
      "fixes",
      "migration",
      "bug",
      "cardstat",
      "statusbadge",
      "datatable",
      "sidebar",
      "gotcha",
      "review"
    ]
  },
  {
    "name": "signup-form",
    "tagline": "Card-wrapped sign-up form using react-hook-form + zod with FormField/Input and a CardFooter action bar (real @godxjp/ui API).",
    "tags": [
      "form",
      "auth",
      "sign-up",
      "zod",
      "validation",
      "react-hook-form"
    ]
  },
  {
    "aliases": [
      "settings-tabs",
      "settings-page",
      "settings-layout"
    ],
    "name": "settings-page-responsive",
    "tagline": "Route-backed settings: persistent desktop local navigation, compact mobile tab strip, deep links + browser history, and bounded form content — NO Card wrapper, NO undefined CSS.",
    "tags": [
      "settings",
      "form",
      "tabs",
      "admin",
      "responsive",
      "navigation"
    ]
  },
  {
    "aliases": [
      "settings-section",
      "settings-row",
      "danger-zone",
      "billing-handoff",
      "preferences-rows",
      "account-identity"
    ],
    "name": "settings-section-rows",
    "tagline": "The four canonical settings blocks — identity · preference rows · billing handoff · danger zone. Identity and billing are SECTIONS (Heading + Descriptions, no surface); preference rows and the danger zone are Cards because they are real boundaries. A COMPOSITION pattern: godx-ui ships no SettingsSection/SettingsRow/DangerZone component and never will.",
    "tags": [
      "settings",
      "account",
      "billing",
      "danger",
      "preferences",
      "listrow",
      "card",
      "admin"
    ]
  },
  {
    "aliases": [
      "pricing-table",
      "plan-picker",
      "pricing-card"
    ],
    "name": "pricing-plans",
    "tagline": "Pricing plan cards — ResponsiveGrid preset + Card featured + FeatureList + tabular price. A composition, not a component (consumer request, debated 2026-10-09 on #1205).",
    "tags": [
      "pricing",
      "plans",
      "billing",
      "card",
      "composition"
    ]
  },
  {
    "name": "confirm-destructive",
    "tagline": "Type-to-confirm destructive dialog — the AlertDialog PRESET with `challenge` (the compound AlertDialog* parts are the older way in; a body the preset does not cover is Dialog variant=\"destructive\").",
    "tags": [
      "dialog",
      "confirm",
      "destructive",
      "delete"
    ]
  },
  {
    "aliases": [
      "cascading-selects",
      "country-state-city",
      "chained-selects",
      "linked-selects"
    ],
    "name": "dependent-selects",
    "tagline": "Country → state → city: three Selects where each child is disabled until its parent has a value (FormField helper says why), loading while its options fetch, and reset to \"\" when the parent changes. A composition, not a component — reach for Cascader only when it is ONE field.",
    "tags": [
      "form",
      "select",
      "dependent",
      "cascading",
      "address",
      "loading",
      "reset"
    ]
  },
  {
    "aliases": [
      "card-selection",
      "selectable-cards",
      "bulk-delete-cards",
      "grid-bulk-actions"
    ],
    "name": "card-grid-selection",
    "tagline": "Select cards in a grid and act on them in bulk — Card + Checkbox per item, the real DataTable.BulkActions driven by count outside a table, indeterminate select-all, AlertDialog before delete, toast with Undo after, EmptyState when nothing is left.",
    "tags": [
      "selection",
      "bulk",
      "cards",
      "grid",
      "delete",
      "undo",
      "empty",
      "checkbox"
    ]
  },
  {
    "name": "deferred-loading",
    "tagline": "Inertia deferred props with a Skeleton fallback — SkeletonTable while data loads, then DataTable (real @godxjp/ui API).",
    "tags": [
      "loading",
      "skeleton",
      "deferred",
      "inertia",
      "table"
    ]
  },
  {
    "name": "inertia-list-page",
    "tagline": "Inertia + @godxjp/ui list page — PageContainer + Toolbar (above the table) + DataTable + Badge + Pagination. No KPI row, no restating subtitle.",
    "tags": [
      "inertia",
      "list",
      "table",
      "page",
      "filter",
      "pagination",
      "datatable",
      "crm"
    ]
  },
  {
    "name": "inertia-detail-page",
    "tagline": "Inertia detail page — receives {id} prop, Descriptions (compound) in one Card + EmptyState fallback. No KPI tile row.",
    "tags": [
      "inertia",
      "detail",
      "show",
      "page",
      "keyvaluegrid",
      "crm"
    ]
  },
  {
    "name": "inertia-persistent-layout",
    "tagline": "Inertia persistent layout (AppShell+Sidebar) — the array-form gotcha + the SSR/Math.random gotcha.",
    "tags": [
      "inertia",
      "layout",
      "appshell",
      "sidebar",
      "ssr",
      "hydration",
      "gotcha"
    ]
  },
  {
    "aliases": [
      "error-surface",
      "errorsurface",
      "403",
      "404",
      "500",
      "503",
      "exception-page"
    ],
    "name": "error-pages",
    "tagline": "400 / 403 / 404 / 500 / 503 exception pages. USE THE COMPONENT: import { ErrorSurface } from \"@godxjp/ui/layout\". `mode=\"application\"` (400/403/404) is the body you put inside the AppShell the route already renders; `mode=\"system\"` (500/503) owns the page via CenteredShell align=\"center\".",
    "tags": [
      "error",
      "errorsurface",
      "403",
      "404",
      "500",
      "503",
      "maintenance",
      "inertia",
      "ssr",
      "layout",
      "emptystate",
      "centeredshell"
    ]
  },
  {
    "name": "badge-coloring",
    "tagline": "Colour a Badge for a localized STATUS via tone + icon; tiers and categories take one neutral tone (colour means status).",
    "tags": [
      "statusbadge",
      "badge",
      "tone",
      "color",
      "status",
      "tier",
      "table"
    ]
  },
  {
    "aliases": [
      "loading-states",
      "data-state",
      "query-states"
    ],
    "name": "async-data-state",
    "tagline": "The full async state machine — ONE primary state at a time: prerequisite, disabled-vs-loading, stale refresh, populated, real-empty, and cause-aware error (401/403/404/422/transient) with correct recovery.",
    "tags": [
      "async",
      "loading",
      "query",
      "error",
      "empty",
      "prerequisite",
      "retry",
      "react-query"
    ]
  },
  {
    "aliases": [
      "filter-bar",
      "table-state",
      "list-page"
    ],
    "name": "data-table-page",
    "tagline": "Filter (Toolbar) + table surface + bottom pagination driven by a query state machine — pagination shows ONLY for successful multi-page data; filters/page survive a transient retry.",
    "tags": [
      "table",
      "pagination",
      "filter",
      "async",
      "toolbar",
      "datatable"
    ]
  },
  {
    "aliases": [
      "more-filters",
      "many-filters",
      "filter-sheet",
      "advanced-filters",
      "add-filter"
    ],
    "name": "list-filters",
    "tagline": "A list page with MANY filters (cardinal rule #51) — FilterBar WRAPS; the 2–4 most-used filters stay inline, the rest sit behind ONE 'More filters' Button (count = hidden filters applied) that opens a Sheet; every applied filter is a removable chip. Never a sideways-scrolling strip.",
    "tags": [
      "filter",
      "filters",
      "list",
      "toolbar",
      "filter-bar",
      "sheet",
      "chips",
      "search",
      "responsive",
      "datatable"
    ]
  },
  {
    "aliases": [
      "filter-layouts",
      "faceted-filter",
      "faceted-sidebar",
      "saved-views-filter",
      "docked-filter-panel",
      "filter-panel",
      "filter-menu"
    ],
    "name": "filter-bar-layouts",
    "tagline": "Eleven list-filter layouts from leading products, all FilterBar + existing primitives: (a) inline packed, (b) search-first + ONE Filter menu + chips, (c) promoted + More-filters Sheet, (d) saved views above the bar, (e) wide search then filters, (f) actions at the end + sticky, (g) faceted sidebar, (h) compact bar in a table card, (i) date range + quick ranges, (j) phone stack + Sheet, (k) docked side panel. Filters always pack at the START.",
    "tags": [
      "filter",
      "filters",
      "layout",
      "faceted",
      "facets",
      "saved views",
      "docked",
      "panel",
      "sidebar",
      "chips",
      "date range",
      "mobile",
      "list",
      "datatable"
    ]
  },
  {
    "aliases": [
      "検索条件",
      "検索フォーム",
      "query-filter",
      "query filter",
      "advanced search",
      "advanced-search",
      "search-panel"
    ],
    "name": "search-form",
    "tagline": "「検索条件フォーム」 — SearchForm (Ant Design ProComponents QueryFilter): labelled conditions in aligned columns (label-top or label-left 「表形式」), ranges From〜To, 「部分一致」/「完全一致」, explicit 「検索」 + 「クリア」 (search on SUBMIT), the rest behind 「詳細条件を開く」, then a 「検索条件」 summary + result count. Plus the Google Advanced Search shape (label | input | what the row means).",
    "tags": [
      "search",
      "search form",
      "query",
      "filter",
      "検索",
      "検索条件",
      "japanese",
      "business",
      "advanced search",
      "list",
      "datatable"
    ]
  },
  {
    "aliases": [
      "絞り込み条件",
      "条件ビルダー",
      "filter-builder",
      "query-builder",
      "kintone filter",
      "kintone-filter",
      "salesforce list view filter",
      "salesforce-filter",
      "filter logic",
      "list-view-filter"
    ],
    "name": "condition-builder",
    "tagline": "Condition builder — numbered rows of field / operator / value, 「すべての条件を満たす」 / 「いずれかの条件を満たす」 / custom logic `1 AND (2 OR 3)`, add/remove rows, 「並び順」, save as a named view; applied on SUBMIT inside a role=\"search\" Form. Composition, not a component. Docked beside the list it is the Salesforce list-view filter panel.",
    "tags": [
      "filter",
      "condition",
      "builder",
      "query",
      "logic",
      "and",
      "or",
      "kintone",
      "salesforce",
      "saved view",
      "絞り込み",
      "list"
    ]
  },
  {
    "aliases": [
      "organization-switcher",
      "workspace-switcher",
      "received-invitations",
      "memberships"
    ],
    "name": "organization-memberships",
    "tagline": "Workspace membership list — recognizable identity, current/active state, role, permission-aware Open/Switch/Manage/Leave row actions, page-level Create, and CONDITIONAL invitations (omit when none).",
    "tags": [
      "organization",
      "workspace",
      "membership",
      "invitation",
      "account",
      "switcher"
    ]
  },
  {
    "aliases": [
      "password-recovery",
      "forgot-password",
      "reset-password",
      "mfa-challenge",
      "two-factor-challenge",
      "2fa-challenge",
      "otp-challenge",
      "passkey-failure",
      "scr-008"
    ],
    "name": "auth-recovery-panels",
    "tagline": "Signed-OUT password recovery + sign-in MFA challenge panels (SCR-008). There is NO PasswordRecoveryPanel and NO MfaChallengePanel — compose Card + AuthStack + FormField/InputOTP + Button inside CenteredShell variant=\"auth-canonical\" preset=\"account-recovery\" (the 432px token-owned measure).",
    "tags": [
      "auth",
      "authshell",
      "recovery",
      "password",
      "mfa",
      "2fa",
      "otp",
      "inputotp",
      "passkey",
      "layout",
      "presentation"
    ]
  },
  {
    "aliases": [
      "recovery-email",
      "backup-codes",
      "security-settings",
      "recovery-settings"
    ],
    "name": "account-recovery-settings",
    "tagline": "Signed-in recovery: compact method status/action rows (email · phone · backup codes) + a separate password-change destination — capability-aware, risk-appropriate, NO stacked Info Alerts.",
    "tags": [
      "account",
      "recovery",
      "security",
      "backup-codes",
      "password",
      "settings"
    ]
  },
  {
    "aliases": [
      "email-template",
      "email-tokens",
      "blade-email",
      "html-email"
    ],
    "name": "transactional-email",
    "tagline": "Build a transactional HTML email (Blade/Twig/MJML/React) from @godxjp/ui/email — literal hex + px derived from the web tokens, the canonical GoDX brand mark, a bulletproof CTA, legal footer and mobile reflow. NEVER hand-copy hex or hand-draw the logo in a mail template.",
    "tags": [
      "email",
      "transactional",
      "blade",
      "laravel",
      "tokens",
      "brand",
      "mark",
      "mjml",
      "cta"
    ]
  },
  {
    "aliases": [
      "cards-in-page",
      "page-layout",
      "stack-cards"
    ],
    "name": "page-sections",
    "tagline": "A page of several sections: a Heading + section spacing marks a section, not a Card. PageContainer spaces its direct children (section step); Flex gap spaces items inside one (item step). Card only for a real boundary.",
    "tags": [
      "layout",
      "page",
      "card",
      "spacing",
      "flex",
      "grid",
      "section",
      "heading"
    ]
  },
  {
    "aliases": [
      "user-chip",
      "account-menu",
      "signed-in-user"
    ],
    "name": "topbar-account-chip",
    "tagline": "Signed-in user in a PageContainer `extra` slot: Avatar + name + sign-out as a Flex row of primitives — same control height as the buttons beside it. Never a hand-rolled rounded-full border div.",
    "tags": [
      "auth",
      "topbar",
      "avatar",
      "header",
      "account",
      "chip"
    ]
  },
  {
    "aliases": [
      "tenanttheme",
      "customer-brand-color",
      "runtime-theme",
      "brand-color"
    ],
    "name": "tenant-brand-color",
    "tagline": "Wear a CUSTOMER's own hex at runtime, scoped to one region — tenantTheme(hex) returns the token declarations plus the WCAG 2.2 AA label, so you never hand-roll hex→HSL or guess a foreground. There is no <TenantTheme> component and there should not be one.",
    "tags": [
      "theme",
      "tenant",
      "multi-tenant",
      "brand",
      "color",
      "colour",
      "contrast",
      "wcag",
      "a11y",
      "runtime",
      "scoped",
      "hex",
      "hsl",
      "white-label",
      "launcher"
    ]
  },
  {
    "aliases": [
      "rebrand",
      "design-handoff",
      "brand-motion",
      "motion-tokens",
      "whitelabel",
      "white-label-theme",
      "theme-block",
      "external-brand"
    ],
    "name": "brand-theme-block",
    "tagline": "Wear a WHOLE external brand — its palette, shape, type AND its motion spec — as one scoped theme block of token declarations. No forked components, no page-local overrides of library selectors. Use when you are handed a design system (Figma/HTML prototype/brand book), not a single customer hex.",
    "tags": [
      "theme",
      "brand",
      "rebrand",
      "handoff",
      "motion",
      "animation",
      "reveal",
      "typography",
      "font",
      "cjk",
      "japanese",
      "tokens",
      "design-system",
      "white-label",
      "marketing",
      "landing"
    ]
  }
]