mirror of
https://github.com/tabler/tabler.git
synced 2026-08-29 13:21:29 +04:00
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
51 lines
977 B
Plaintext
51 lines
977 B
Plaintext
---
|
|
// Modal shell markup. Wrap with <CaptureModal> at the call site to emit at the
|
|
// end of <body> (see PageModals). For inline gallery demos use ModalInline.
|
|
interface Props {
|
|
modalId?: string;
|
|
size?: string;
|
|
top?: boolean;
|
|
scrollable?: boolean;
|
|
class?: string;
|
|
show?: boolean;
|
|
style?: string;
|
|
}
|
|
|
|
const {
|
|
modalId = 'simple',
|
|
size,
|
|
top,
|
|
scrollable,
|
|
class: className,
|
|
show,
|
|
style,
|
|
} = Astro.props;
|
|
|
|
const modalClass = ['modal modal-blur fade', className, show && 'show'].filter(Boolean).join(' ');
|
|
const dialogClass = [
|
|
'modal-dialog',
|
|
size && `modal-${size}`,
|
|
!top && 'modal-dialog-centered',
|
|
scrollable && 'modal-dialog-scrollable',
|
|
]
|
|
.filter(Boolean)
|
|
.join(' ');
|
|
---
|
|
|
|
<!-- BEGIN MODAL -->
|
|
<div
|
|
class={modalClass}
|
|
style={style}
|
|
id={`modal-${modalId}`}
|
|
tabindex="-1"
|
|
role="dialog"
|
|
aria-hidden={show ? 'false' : 'true'}
|
|
>
|
|
<div class={dialogClass} role="document">
|
|
<div class="modal-content">
|
|
<slot />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- END MODAL -->
|