nuxt / ui

A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.
https://ui.nuxt.com
MIT License
3.4k stars 374 forks source link

Break-point of collapsible panel #1735

Closed MichaelSchmidle closed 2 weeks ago

MichaelSchmidle commented 2 weeks ago

Description

According to the docs, the ui config for UDashboardPanel looks like this:

{
  wrapper: 'flex-col items-stretch relative w-full',
  border: 'border-b lg:border-b-0 lg:border-r border-gray-200 dark:border-gray-800 lg:w-[--width] flex-shrink-0',
  grow: 'flex-1',
  collapsible: 'hidden lg:flex',
  slideover: 'lg:hidden'
}

The ui attribute for UDashboardPanel however only exposes this:

(property) ui?: Partial<{
    wrapper: string;
    border: string;
    grow: string;
}> | undefined

In other words, collapsible and slideover can't be configured. Why would I need that: To control the break-point. In my case, I'd like one panel to only become visible (i.e., flex) at the xl break-point, not at lg.

Not sure if this is a bug or intentional behavior?

Additional context

No response

benjamincanac commented 2 weeks ago

This has been implemented in https://github.com/nuxt/ui-pro/commit/d27cbf55d50a9805ca1190f6cad421565db0a980 but not released yet. Will try to make a release next week :)