How do I increase the width of modal in NuxtUI UModal component?

Does anyone know how to increase the width of the modal in NuxtUI UModal component? I can't seem to find any docs on how to increase it. Did I miss something?

In NuxtUI there are two options, default, the one you see below and fullscreen. I'd like to customize the size of this component.

Components are controlled by the ui configuration. You can modify this globally for all instances of a component in app.config.ts:

You can override component config in your own app.config.ts:

export default defineAppConfig({
  ui: {
    container: {
      constrained: 'max-w-5xl'
    }
  }
})

Or through the ui prop for each instance of a component:

Each component has a ui prop that allows you to customize everything specifically.

<template>
  <UContainer :ui="{ constrained: 'max-w-2xl' }">
    <slot />
  </UContainer>
</template>

Thus, if we look at the documentation of the ui configuration for the Modal component:

{
  …
  width: 'w-full sm:max-w-lg',

We see a width property that is responsible for restricting the width of the modal.

Thus, we can override this in app.config.ts (for global override):

export default defineAppConfig({
  ui: {
    modal: {
      width: 'sm:max-w-3xl'
    }
  }
})

Or with a specific usage with the ui prop:

<UModal :ui="{ width: 'sm:max-w-3xl' }">

See an example of both methods in this Stackblitz project.