posthtml-bootstrap/dist/ui/modal.html

A PostHTML plugin that allows you to use Bootstrap components directly in your HTML code

<script props>
  const { backdrop, size, centered, scrollable, fullscreen } = props

  module.exports = {
    classes: clsx("modal", !isEnabled(props["no-transition"]) && "fade"),
    dialogClasses: clsx(
      "modal-dialog",
      isString(size) && `modal-${size}`,
      isTruthy(fullscreen)
        ? typeof fullscreen === "boolean"
          ? "modal-fullscreen"
          : `modal-fullscreen-${fullscreen}-down`
        : "",
      isString(centered) && "modal-dialog-centered",
      isString(scrollable) && "modal-dialog-scrollable"
    ),
    backdrop,
    keyboard: isEnabled(props["no-keyboard"]) ? false : null
  }
</script>

<div
  class="{{classes}}"
  data-bs-backdrop="{{backdrop}}"
  data-bs-keyboard="{{keyboard}}"
>
  <div class="{{dialogClasses}}" role="document">
    <div class="modal-content"><children /></div>
  </div>
</div>