NODEDC_LAUNCHER/dc-ui-guideline/components/delete-modal.json

75 lines
2.6 KiB
JSON

{
"id": "delete-modal",
"name": "NodeDcDeleteModal",
"kind": "component",
"status": "draft-stable",
"summary": "Canonical dark glass confirmation modal for destructive object deletion.",
"sourceRefs": [
{
"project": "nodedc_launcher",
"file": "src/shared/nodedc-ui/DeleteModal.tsx",
"exports": ["NodeDcDeleteModal"]
},
{
"project": "nodedc_launcher",
"file": "src/styles/globals.css",
"classes": [
"nodedc-delete-modal-layer",
"nodedc-delete-modal",
"nodedc-delete-modal__icon",
"nodedc-delete-modal__foot"
]
},
{
"project": "nodedc_taskmanager",
"file": "plane-src/packages/ui/src/modals/alert-modal.tsx",
"exports": ["AlertModalCore"]
},
{
"project": "nodedc_taskmanager",
"file": "plane-src/apps/web/styles/globals.css",
"classes": [
"nodedc-glass-modal",
"nodedc-modal-alert-icon",
"nodedc-modal-danger-button",
"nodedc-modal-secondary-button"
]
}
],
"anatomy": [
"fixed blurred overlay layer",
"dark glass shell",
"round alert icon",
"title and description copy",
"footer with secondary cancel and destructive confirm"
],
"visualContract": {
"width": "min(34rem, viewport - 2.8rem)",
"radius": "modal",
"background": "transparent black detail glass, not monocolor fill",
"blur": "44px detail glass pseudo-layer blur",
"iconSize": "2.75rem circle",
"iconColor": "component accent, white in launcher",
"buttonHeight": "tokens.size.modalButtonHeight through Button surface='modal'",
"buttonRadius": "control radius",
"cancelButton": "Button variant='secondary' surface='modal'",
"destructiveButton": "Button variant='accent' surface='modal' with computed on-accent text"
},
"rules": [
"Use this component for every delete/destructive removal action.",
"Never delete immediately from a row, footer, dropdown, or editor without this modal.",
"Do not add visible outlines or hard stroke borders to the modal, icon, or buttons.",
"The shell uses nodedc-glass-detail-surface so the panel blurs the actual content under it.",
"The destructive button uses the shared Button accent variant and component-local accent contrast variables, not a hardcoded red fill.",
"Cancel is secondary and stays left of the destructive confirm action.",
"The description must name the object and describe dependent data that will also be removed."
],
"launcherBindings": [
"service showcase deletion",
"client/company deletion",
"client membership removal",
"client group deletion",
"invite deletion"
]
}