62 lines
2.0 KiB
JSON
62 lines
2.0 KiB
JSON
{
|
|
"id": "button",
|
|
"name": "Button",
|
|
"kind": "primitive",
|
|
"status": "draft-stable",
|
|
"summary": "Canonical text/action button used by launcher stages, admin editors, and modal footers.",
|
|
"sourceRefs": [
|
|
{
|
|
"project": "nodedc_launcher",
|
|
"file": "src/shared/ui/Button.tsx",
|
|
"exports": ["Button"]
|
|
},
|
|
{
|
|
"project": "nodedc_launcher",
|
|
"file": "src/styles/globals.css",
|
|
"classes": [
|
|
"button",
|
|
"button--primary",
|
|
"button--secondary",
|
|
"button--danger",
|
|
"button--ghost",
|
|
"button--accent",
|
|
"button[data-surface='modal']"
|
|
]
|
|
},
|
|
{
|
|
"project": "nodedc_taskmanager",
|
|
"file": "plane-src/apps/web/styles/globals.css",
|
|
"classes": [
|
|
"nodedc-modal-primary-button",
|
|
"nodedc-modal-secondary-button",
|
|
"nodedc-modal-danger-button"
|
|
]
|
|
}
|
|
],
|
|
"api": {
|
|
"props": {
|
|
"variant": ["primary", "secondary", "danger", "ghost", "accent"],
|
|
"surface": ["default", "modal"],
|
|
"accentRgb": "optional RGB tuple used by accent variant",
|
|
"icon": "optional leading icon"
|
|
}
|
|
},
|
|
"visualContract": {
|
|
"height": "2.65rem default, tokens.size.modalButtonHeight on modal surface",
|
|
"radius": "control",
|
|
"fontWeight": "800",
|
|
"outline": "never",
|
|
"modalSecondaryDanger": "transparent until hover",
|
|
"modalAccent": "filled component accent with computed on-accent text"
|
|
},
|
|
"rules": [
|
|
"Use Button instead of hand-written button classes for text actions.",
|
|
"Use IconButton or circle-action-button for icon-only actions.",
|
|
"Inside modals, pass surface='modal' on every footer button.",
|
|
"Modal Save and modal destructive confirm use variant='accent' with local accentRgb when the app accent differs.",
|
|
"Inline modal delete buttons use variant='danger' with surface='modal'; they are transparent until neutral hover.",
|
|
"Do not use red filled delete buttons outside NodeDcDeleteModal confirmation.",
|
|
"Filled accent variants must use accent-contrast variables for readable text."
|
|
]
|
|
}
|