Ver código
<co-modal heading="Título de ejemplo"></co-modal>
Props
| Prop | Atributo | Tipo | Default | Descripción |
|---|
closable | closable | boolean | true | Show close (X) button in header |
closeOnEscape | close-on-escape | boolean | false | Opt-in: close when Escape is pressed. Default false → existing consumers
are unchanged.
Handled here rather than by forwarding co-overlay's own `closeOnEscape`:
co-overlay emits the SAME `coClose` for a backdrop click and for Escape,
and this component gates that event on `closeOnOverlay`. Forwarding would
therefore swallow Escape whenever `closeOnOverlay` is false. |
closeOnOverlay | close-on-overlay | boolean | true | Close when clicking the overlay backdrop |
description | description | string | undefined | — | Subtitle / description |
heading | heading | string | '' | Modal title |
noDividers | no-dividers | boolean | false | Hide body section and all border dividers (compact confirm dialogs) |
open | open | boolean | false | Whether the modal is visible |
size | size | "full" | "lg" | "md" | "sm" | 'md' | Modal width: sm (400px), md (540px), lg (680px),
full (min(1400px, 95vw) × 92vh — media/document viewers).
`full` also drops the body padding and lets the body grow, so a slotted
<video>/<iframe> fills the panel edge-to-edge instead of sitting in a
content-height box. |
Eventos
| Evento | Detail | Bubbles | Cancelable | Descripción |
|---|
coAfterClose | void | — | ✓ | Close animation finished. |
coAfterOpen | void | — | ✓ | Open animation finished. |
coClose | void | ✓ | ✓ | Emitted when the modal requests to close |
Slots
| Slot | Descripción |
|---|
(default) | Modal body content |
footer | Footer with action buttons |
CSS Parts
| Part | Descripción |
|---|
::part(body) | |
::part(footer) | |
::part(header) | |
::part(modal) | |
CSS Custom Properties
Este componente no expone CSS custom properties.
