Releases · nuxt/ui

ui.custom has been removed in favor of class binding through v-bind="$attrs"
class will no longer apply on the wrapper but on the element so use :ui="{ wrapper: '...' }" instead

If you were using some form elements outside the library components, for example a basic <input type="checkbox" /> in your prose, you might loose some reset styles as @tailwindcss/forms now only applies when using form-${element} classes, see #278.

🚀 What's Changed

fix(forms): padded prop with p-0 class
fix(Button): same size when no label + uniformize form elements
fix(ButtonGroup): invalid size validator
fix(ButtonGroup): use -space-x-px on wrapper
chore(Dropdown): handle height for overflow
chore: add @tailwindcss/container-queries official plugin
fix(Notification): class priority for icon color
feat(Table): add slot for empty state by @Haythamasalama in #260
feat(Pagination): new component by @smarroufin in #257
feat(Table): add loading state by @Haythamasalama in #259
fix(module): use @tailwindcss/forms class strategy by @benjamincanac in #278
fix(Toggle): missing disabled prop
fix(Radio/Checkbox): split preset as indeterminate is checkbox only
chore(Select)!: rename text-attribute to option-attribute and def…
feat(CommandPalette): handle empty-state by @Haythamasalama in #271
fix(forms)!: bind $attrs to elements by @benjamincanac in #279
feat(module): smart safelisting by @benjamincanac in #268
fix(Table): colspan of empty and loading is wrong when selection enabled by @9uenther in #284

New Contributors

@9uenther made their first contribution in #284

Full Changelog: v2.3.0...v2.4.0

Contributors

benjamincanac, 9uenther, and 2 other contributors

Assets 2

05 Jun 11:00

benjamincanac

v2.3.0

60eea0e

v2.3.0

✨ Highlights

New Table component: https://ui.nuxtlabs.com/data/table

🚨 Breaking Changes

`Toggle`

icon-on / icon-off props have been renamed to on-icon / off-icon
ui.toggle.default.iconOn / ui.toggle.default.iconOff have been renamed to ui.toggle.default. onIcon / ui.toggle.default.offIcon in preset

`CommandPalette`

close prop has been renamed to close-button
ui.commandPalette.default.close has been renamed to ui.commandPalette.default.closeButton in preset
empty prop has been renamed to empty-state
ui.commandPalette.default.empty has been renamed to ui.commandPalette.default.emptyState in preset

`Notification`

close prop has been renamed to close-button
ui.notification.default.close has been renamed to ui.notification.default.closeButton in preset
ui.notification.default.action has been renamed to ui.notification.default. actionButton in preset

`Input`

pointer-events-none class has been moved from ui.input.icon.leading.wrapper / ui.input.icon.trailing.wrapper to ui.input.icon.leading.pointer / ui.input.icon.trailing.pointer in preset

`SelectMenu`

inline-flex class has been removed from wrapper so it might cause some alignment issues

🚀 What's Changed

New Contributors

@oritwoen made their first contribution in #250

Full Changelog: v2.2.1...v2.3.0

Contributors

benjamincanac, smarroufin, and oritwoen

Assets 2

05 Jun 10:14

benjamincanac

v2.2.1

0af5184

v2.2.1

What's Changed

Full Changelog: v2.2.0...v2.2.1

Assets 2

26 May 21:57

benjamincanac

v2.2.0

aa881a8

v2.2.0

What's Changed

fix(VerticalNavigation): badge display in d2ee505
chore(VerticalNavigation): links badge type as number in 6eda322
chore(Avatar): allow default value for chipColor through app.config.ts in 570b82d
fix(Radio/Checkbox): remove ring offset on focus in a56dbea
chore(Notification): add progressColor and progressVariant props by @benjamincanac in #219
chore(CommandPalette): handle loading state by @benjamincanac in #221
chore(Dropdown): use ULinkCustom (fixes close on link clicks) in 55f115f
chore(Notification): move padding to app.config in 6d3309c
chore(VerticalNavigation)!: split preset in 19923cb
chore(SelectMenu): add searchablePlaceholder prop in b7099aa
chore(deps): switch to pnpm by @benjamincanac in #228
chore(Avatar)!: remove chipVariant prop in 1f22f84
chore(Notification)!: rename progressColor to color and style icon in 1b61ec7
chore(Avatar): dark variant for chip background color in 589f86e
feat!: handle color states on form elements by @benjamincanac in #234

Migration Guide

As this library is quite new, some breaking changes are necessary to make it granular and more flexible. If you didn't override the preset through your app.config.ts file, most of the changes won't affect you (except for the form elements).

We'll do our best to keep the breaking changes as minimal as possible in the future and will document them properly.

`Avatar`

chipVariant prop has been removed and chip now uses chip.background preset class
chip.background preset class now defaults to 500 in light mode

`InputGroup`

Component has been renamed to FormGroup and now has its own documentation page
error prop has been added with its own preset classerror
Component now uses a render function to dynamically set the color prop of children to red
label, labelWrapper and required preset classes have been moved in label object

`Input` / `Textarea` / `Select` / `SelectMenu`

rounded preset class has been moved from variants to the root of the preset to be customizable globally
placeholder preset class has been moved from variants to the root of the preset to be customizable globally
appearance prop has been removed in favor of color (defaults to white) and variant (defaults to outline) to follow Badge and Button convention, this gives us color states for now will allow us to define other variants in the future
padded prop has been added to remove padding easily

`SelectMenu`

searchablePlaceholder prop has been added

`Notification`

padding preset class has been added
color prop has been added to style progress bar and icon
default.icon preset class has been added to set a default icon on all your notifications
icon, avatar and progress preset classes have been turned into an object
avatar.size preset class now defaults to md to be centered

`Vertical Navigation`

ring, width, rounded, font and size preset classes have been pulled out of base to customize component with granularity

New Contributors

@okisdev made their first contribution in #216
@sumitkolhe made their first contribution in #211

Full Changelog: v2.1.0...v2.2.0

Contributors

benjamincanac, sumitkolhe, and okisdev

Assets 2

19 May 10:39

benjamincanac

v2.1.0

f99b9e2

v2.1.0

What's Changed

chore(Card): add as prop by @benjamincanac in 4d8dbfb
chore(Container): add as prop by @benjamincanac in cba95de
chore(module): default primary to green by @benjamincanac in 11941bd
chore(colors): prevent err and add warning when specific colors dont exist by @benjamincanac in d93e995
fix(ButtonGroup/AvatarGroup): allow v-for by @ciaasteczkowy in #173
fix(module): node engine version by @atinux in #176
chore(Notifications): simplify how to position them by @atinux in #190
chore(SelectMenu): empty option shorter text by @benjamincanac in 617567d
chore(module): handle icons type as string by @benjamincanac in 85b10ba
fix(Input): expose ref by @benjamincanac in 2ded24b
fix(Textarea): expose ref by @benjamincanac in ea740bf
fix(module): add .mjs extension to tailwind content when builded by @benjamincanac in 246449b