mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
6da0db0113
Co-authored-by: Daniel Roe <daniel@roe.dev> Co-authored-by: Sébastien Chopin <seb@nuxt.com>
153 lines
7.9 KiB
Markdown
153 lines
7.9 KiB
Markdown
---
|
|
navigation: false
|
|
---
|
|
|
|
## Breaking Changes
|
|
|
|
Classes to invert dark mode like `u-text-gray-900` have been removed.
|
|
|
|
- Components now have a `ui` prop to override the entire preset instead of individual props
|
|
- Components prop `popperOptions` has been renamed to `popper`
|
|
- `Alert`, `AlertDialog`, `Tabs` and `Pills` components have been removed
|
|
|
|
### `Avatar`
|
|
|
|
- `wrapperClass`, `backgroundClass`, `placeholderClass` and `roundedClass` props have been removed in favor of `ui`
|
|
- `rounded` prop is now a class defaulting to `rounded-full` instead of a boolean prop, can be overriden through `ui.avatar.rounded`
|
|
- `chip` prop is now `chipVariant`
|
|
- `ui.avatar.size` and `ui.avatar.chip.size` `xxs` and `xxxs` have been renamed respectively to `2xs` and `3xs`
|
|
|
|
### `AvatarGroup`
|
|
|
|
- `ringClass` and `marginClass` props have been removed in favor of `ui`
|
|
- `group` prop has been removed in favor of slots
|
|
|
|
### `Badge`
|
|
|
|
- `baseClass` prop has been removed in favor of `ui`
|
|
- `rounded` prop is now a class defaulting to `rounded-md` instead of a boolean prop, can be overriden through `ui.badge.rounded`
|
|
- `color` prop has been added to change the color scheme of the badge
|
|
- `variant` prop is now the variant instead of the color
|
|
- `font-medium` has been moved from `ui.badge.base` to `ui.badge.font`
|
|
|
|
### `Button`
|
|
|
|
- `customClass` prop have been removed
|
|
- `baseClass`, `iconBaseClass` and `roundedClass` props have been removed in favor of `ui`
|
|
- `leadingIconClass` and `trailingIconClass` props have been removed
|
|
- `rounded` prop is now a class defaulting to `rounded-md` instead of a boolean prop, can be overriden through `ui.button.rounded`
|
|
- `color` prop has been added to change the color scheme of the badge
|
|
- `variant` prop is now the variant instead of the color
|
|
- `labelCompact` and `compact` props have been removed entirely alongside preset `ui.button.compact` and `ui.button.icon.leading.compactSpacing` and `ui.button.icon.trailing.compactSpacing`
|
|
- `padded` prop has been added to remove padding
|
|
- `ui.button.size.xxs` has been renamed to `ui.button.size.2xs`
|
|
- `ui.button.size.2xl` has been introduced
|
|
- `ui.button.gap` has been introduced to replace margins defined in `ui.button.icon.leading.spacing` and `ui.button.icon.trailing.spacing`
|
|
- `ui.button.icon.leading.spacing` and `ui.button.icon.trailing.spacing` that added negative margin to icons have been removed to keep consitency when surcharging a button through default slot (code has only been commented for now)
|
|
- `font-medium` has been moved from `ui.button.base` to `ui.button.font`
|
|
|
|
### `ButtonGroup`
|
|
|
|
- New component
|
|
|
|
### `Dropdown`
|
|
|
|
- `wrapperClass`, `containerClass`, `widthClass`, `backgroundClass`, `shadowClass`, `roundedClass`, `ringClass`, `divideClass`, `baseClass`, `transitionClass`, `groupClass`, `itemBaseClass`, `itemActiveClass`, `itemInactiveClass`, `itemDisabledClass`, `itemIconClass`, `itemAvatarClass` and `itemShortcutsClass` props have been removed in favor of `ui`
|
|
- preset has been updated to improve dark mode
|
|
|
|
### `Card`
|
|
|
|
- `baseClass`, `backgroundClass`, `borderColorClass`, `shadowClass`, `ringClass`, `roundedClass`, `bodyClass`, `bodyBackgroundClass`, `headerClass`, `headerBackgroundClass`, `footerClass`, `footerBackgroundClass` props have been removed in favor of `ui`
|
|
- `rounded` prop is now a class defaulting to `rounded-lg` instead of a boolean prop, can be overriden through `ui.avatar.rounded`
|
|
- `padded` prop has been removed, use `ui.rounded = 'sm:rounded-lg'` instead when false
|
|
- `ui.card.border` has been removed in favor of `ui.card.divide`
|
|
- `ui.card.header` & `ui.card.footer` are now `{ spacing: '', background: '' }`
|
|
|
|
### `Container`
|
|
|
|
- `constrainedClass` prop has been removed in favor of `ui`
|
|
- `ui.container.base` and `ui.container.spacing` have been added
|
|
- `padded` prop has been removed, use `ui.spacing = 'sm:px-6 lg:px-8'` instead when false
|
|
- `constrained` prop has been removed, use `ui.constrained = ''` instead when false
|
|
|
|
### `Input`
|
|
|
|
- `wrapperClass`, `baseClass`, `iconBaseClass` and `customClass` props have been removed in favor of `ui`
|
|
|
|
### `FormGroup`
|
|
|
|
- Renamed to `InputGroup`
|
|
- `wrapperClass`, `containerClass`, `labelClass`, `labelWrapperClass`, `descriptionClass`, `requiredClass` and `hintClass` props have been removed in favor of `ui`
|
|
|
|
### `Textarea`
|
|
|
|
- `wrapperClass`, `baseClass` and `customClass` props have been removed in favor of `ui`
|
|
- `resize` is now false by default
|
|
|
|
### `Select`
|
|
|
|
- `wrapperClass`, `baseClass`, `iconBaseClass` and `customClass` props have been removed in favor of `ui`
|
|
|
|
### `SelectCustom`
|
|
|
|
- Renamed to `SelectMenu`
|
|
- `placeholder` prop is now `null` by default
|
|
- `nullable` prop has been removed
|
|
- `textAttribute` has been renamed to `optionAttribute` and now defaults to `label`
|
|
- `wrapperClass`, `baseClass`, `iconBaseClass`, `customClass`, `listBaseClass`, `listContainerClass`, `listWidthClass`, `listInputClass`, `listTransitionClass`, `listOptionBaseClass`, `listOptionContainerClass`, `listOptionActiveClass`, `listOptionInactiveClass`, `listOptionSelectedClass`, `listOptionUnselectedClass`, `listOptionDisabledClass`, `listOptionEmptyClass`, `listOptionIcon`, `listOptionIconBaseClass`, `listOptionIconActiveClass`, `listOptionIconInactiveClass` and `listOptionIconSizeClass` props have been removed in favor of `ui`
|
|
- `ui.selectCustom.list` has been moved to the root of `ui.selectMenu`, the component now uses `ui.select` to render the default slot
|
|
|
|
### `Radio`
|
|
|
|
- `wrapperClass`, `baseClass`, `labelClass`, `requiredClass`, `helpClass` and `customClass` props have been removed in favor of `ui`
|
|
|
|
### `Checkbox`
|
|
|
|
- `wrapperClass`, `baseClass`, `labelClass`, `requiredClass`, `helpClass` and `customClass` props have been removed in favor of `ui`
|
|
|
|
### `Toggle`
|
|
|
|
- `baseClass`, `activeClass`, `inactiveClass`, `containerBaseClass`, `containerActiveClass`, `containerInactiveClass`, `iconBaseClass`, `iconActiveClass`, `iconInactiveClass`, `iconOnClass` and `iconOffClass` props have been removed in favor of `ui`
|
|
|
|
### `CommandPalette`
|
|
|
|
- `inputCloseIcon` and `emptyIcon` props have been removed in favor of `ui`
|
|
- `inputIcon` prop has been renamed to `icon`
|
|
- `inputPlaceholder` prop has been renamed to `placeholder`
|
|
- `options` prop has been renamed to `fuse` to follow the `popper` and `ui` props convention
|
|
|
|
### `Modal`
|
|
|
|
- `wrapperClass`, `innerClass`, `containerClass`, `baseClass`, `backgroundClass`, `overlayBackgroundClass`, `overlayTransitionClass`, `shadowClass`, `ringClass`, `roundedClass`, `widthClass` and `transitionClass` props have been removed in favor of `ui`
|
|
- `innerStyle` prop has been removed
|
|
- `#header` and `#footer` slots have been removed
|
|
|
|
### `Slideover`
|
|
|
|
- `wrapperClass`, `baseClass`, `backgroundClass`, `overlayBackgroundClass`, `overlayTransitionClass`, `widthClass`, `headerClass` and `transitionClass` props have been removed in favor of `ui`
|
|
- `#header` slot has been removed
|
|
|
|
### `Popover`
|
|
|
|
- `wrapperClass`, `containerClass`, `widthClass`, `baseClass`, `backgroundClass`, `shadowClass`, `roundedClass`, `ringClass` and `transitionClass` props have been removed in favor of `ui`
|
|
|
|
### `Tooltip`
|
|
|
|
- `wrapperClass`, `containerClass`, `baseClass`, `widthClass`, `backgroundClass`, `shadowClass`, `ringClass`, `roundedClass`, `shortcutsClass` and `transitionClass` props have been removed in favor of `ui`
|
|
|
|
### `ContextMenu`
|
|
|
|
- `wrapperClass`, `containerClass`, `widthClass`, `backgroundClass`, `shadowClass`, `roundedClass`, `ringClass`, `baseClass` and `transitionClass`
|
|
|
|
### `Notification`
|
|
|
|
- `backgroundClass`, `shadowClass`, `ringClass`, `roundedClass`, `transitionClass`, `customClass` and `iconBaseClass` props have been removed in favor of `ui`
|
|
- `type` prop has been removed
|
|
- `ui.notification.type` and `ui.notification.icon.color` have been removed
|
|
- `ui.notification.close.icon.name` has been moved to `ui.notification.default.closeIcon`
|
|
|
|
### `useToast`
|
|
|
|
- `addNotification` and `removeNotification` have been renamed to `add` and `remove`
|
|
- `success`, `info`, `warning` and `error` methods have been removed as `type` disappeared from `Notification`
|