[Snyk] Upgrade @nuxt/ui from 2.22.0 to 3.1.0 #131
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Snyk has created this PR to upgrade @nuxt/ui from 2.22.0 to 3.1.0.
ℹ️ Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project.
The recommended version is 22 versions ahead of your current version.
The recommended version was released 23 days ago.
Release notes
Package name: @nuxt/ui
✨ Highlights
🎨 Improved Utility Classes
We've enhanced the utility class system to make it more intuitive and easier to use. While CSS variables provided flexibility, writing classes like
text-(--ui-text-muted)
proved cumbersome. We've introduced three major improvements:+ <div class="text-primary">
- <div class="bg-(--ui-error)">
+ <div class="bg-error">
+ <div class="text-muted">
- <div class="border-(--ui-border)">
+ <div class="border-default">
- <div class="bg-(--ui-bg-elevated)/50">
+ <div class="bg-elevated/50">
rounded-*
utilities to use our--ui-radius
CSS variable, making it easier to maintain consistent border radius across your application: https://ui.nuxt.com/getting-started/theme#radius+ <div class="rounded-sm">
- <div class="rounded-[calc(var(--ui-radius)*1.5)]">
+ <div class="rounded-md">
- <div class="rounded-[calc(var(--ui-radius)*2)]">
+ <div class="rounded-lg">
🧩 New Components and Features
import type { CheckboxGroupItem, CheckboxGroupValue } from '@ nuxt/ui'
const items = ref<CheckboxGroupItem[]>(['System', 'Light', 'Dark'])
const value = ref<CheckboxGroupValue[]>(['System'])
</script>
<template>
<UCheckboxGroup v-model="value" :items="items" />
</template>
card
andtable
variants for more flexible layouts: https://ui.nuxt.com/components/radio-group#variantimport type { RadioGroupItem, RadioGroupValue } from '@ nuxt/ui'
const items = ref<RadioGroupItem[]>(['System', 'Light', 'Dark'])
const value = ref<RadioGroupValue>('System')
</script>
<template>
<URadioGroup v-model="value" variant="table" :items="items" />
</template>
🌉 Inertia.js Integration
The Vue version now includes built-in support for Inertia.js. Enable it with the
inertia: true
option in yourvite.config.ts
:import vue from '@ vitejs/plugin-vue'
import ui from '@ nuxt/ui/vite'
export default defineConfig({
plugins: [
vue(),
ui({
inertia: true
})
]
})
This automatically replaces
RouterLink
withInertiaLink
in all components, providing seamless integration with your Inertia.js applications: https://ui.nuxt.com/getting-started/installation/vue#inertia⚡ Module Builder Update
The module has been updated to use nuxt/module-builder@1.0.0, bringing improved build performance and better TypeScript support.
Following this change, we've refactored how component types are handled which brings full HMR support with
app.config.ts
changes, this was only working when reloading the page previously.🚨 Breaking Changes
.open()
(#3829) (f3098df)This PR changes
.open()
to return an overlay instance with aresult
promise property instead of returning the promise directly, providing more flexibility:+ const instance = modal.open({ count: count.value })
+ const result = await instance.result
</script>
🚀 Features
portal
prop (#3688) (29fa462)select
event (#3678) (22edfd7)content-top
andcontent-bottom
slots (#3886) (1a46394)attach
prop to opt-out of nested form attachement (#3939) (1a0d7a3)resetSearchTermOnSelect
(cea881a), closes #3782stepSnapping
&disableWheelChange
props (#3731) (f5e6284)close:prevent
event (#3958) (f486423)rounded-*
utilities (#3906) (f9737c8).open()
(#3829) (f3098df)autofocus
/autofocus-delay
props (0456670), closes #3717card
andtable
variants (#3178) (4d138ad)onSelect
field in items (8640831)tr
andtd
(#3866) (80dfa88)list-leading
andlist-trailing
slots (#3837) (3447a06)autoresize-delay
prop (06414d3), closes #3730icon
,loading
, etc. props to match Input (cb193f1)resize-none
class withautoresize
prop (ffafd81)🐛 Bug Fixes
div
instead ofh3
for header tag (75e4792), closes #3963@ nuxt/module-builder
upgrade (#3855) (39c861a)transform-origin
in popper content (#3919) (01d8dc7)any
(#3741) (97274f1)onSelect
events (#3735) (f25fed5)disabled
items to be selected (8435a0f), closes #3474valueKey
string case (9ca213b), closes #3949 #3331value
(#3779) (52a97e2)change
on multiple item removal (9d2fed1), closes #3756download
property (#3879) (47cdc2e)sm:w-auto
content slot (abe0859), closes #3788icon
andcontent
slots (1d45980), closes #3785data
reactivity (#3967) (6e27304)colspan
toth
(#3926) (122e8ac)ClassValue
inui
prop (eea1415), closes #3860🌐 Locales
👋 New Contributors
Full Changelog: v3.0.2...v3.1.0
🚀 Features
empty
prop (afff54f)🐛 Bug Fixes
$attrs
to default slot (#3712) (88f349d)focus:outline-none
instead offocus:outline-hidden
(c231fe5), closes #3658group.id
as key (bc61d29)w-full
class (df00149)@ __NO_SIDE_EFFECTS__
(82e2665)fadeFromIndex
prop proxy (f7604e5)help
toaria-describedby
attribute (#3691) (20c3392)searchTerm
onupdate:open
(3074632), closes #3620aria-current
likeNuxtLink
/RouterLink
(c531d02)active="true"
binding on html (d73768b)aria-*
&data-*
attrs (ade16b7)onClick
(370054b), closes #3631z-index
on viewport (0095d89), closes #3654caption
slot (4ebb94c)focus:outline-hidden
class (1769d5e)open
method type to infer close emit return type (#3716) (bd99c2d)nuxtApp.hooks
&useRuntimeHook
(23bfeb9)🌐 Locales
👋 New Contributors
Full Changelog: v3.0.1...v3.0.2
✨ Highlights
theme(static)
(#3630) (ecff9ab)You no longer need to use
theme(static)
when importingtailwindcss
! 🎉However, you might still need this when using Tailwind CSS variables in your code explicitly like this for example:
🚨 Breaking Changes
zod
andvalibot
(#3617) (9a4bb34)We now rely on standard-schema for Form validation with
valibot
andzod
. Make sure to upgrade tovalibot@1.0.0
/zod@3.24.0
if you use them in your app.vaul-vue
(f401766)We've updated to
vaul-vue@0.4.0
which powers the Drawer component. There's no longer ahandle
slot, the themehandle
slot has changed a bit with some important values but you have access to ahandle-only
prop now: https://ui.nuxt.com/components/drawer#handle-only🚀 Features
content
prop (5dec0e1)🐛 Bug Fixes
any
fromproxySlots
(#3623) (764c41a)theme(static)
(#3630) (ecff9ab)disabled
on items (fe0bd83), closes nuxt/ui-pro#911@ select
is used (#3580) (e80cc15)@ compodium/examples
in auto-imports paths (#3585) (cc504b8)@ nuxt/ui-pro
(#3603) (dec2730)🌐 Locales
👋 New Contribut...
Summary by Sourcery
Chores: