PageGrid with UI props doesn't work

[ahoiroman]

Environment

• Operating System: Darwin
• Node Version: v22.20.0
• Nuxt Version: 4.1.3
• CLI Version: 3.28.0
• Nitro Version: 2.12.7
• Package Manager: pnpm@10.17.1
• Builder: -
• User Config: modules, devtools, css, content, mdc, routeRules, compatibilityDate, nitro, vite, eslint, i18n, sanctum
• Runtime Modules: @nuxt/eslint@1.9.0, @nuxt/image@1.11.0, @nuxt/ui@4.0.1, @nuxtjs/i18n@10.1.0, @nuxt/content@3.7.1, nuxt-auth-sanctum@1.4.0
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Package

v4.x

Version

4.0.1

Reproduction

Description

<UPageGrid
    :ui="{
      base: 'grid-cols-1 gap-4'
    }"
  >

generates

<div class="relative grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8" ui="[object Object]">

Additional context

No response

Logs

[HugoRCD]

@ahoiroman This is because the PageGrid has no slots other than the default and can only be modified by simply using class see https://ui.nuxt.com/docs/getting-started/theme/components#class-prop.

[ahoiroman]

Ah, I see. And as classes are merged, I need to overwrite the lg: class, too. Alright, thanks.