@nextcloud/vue 9.0.0-rc.5 → 9.0.0-rc.7

package/CHANGELOG.md

@@ -7,12 +7,14 @@
 
 All notable changes to this project will be documented in this file.
 
-## [v9.0.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v9.0.0-rc.5) (unreleased)
-[Full Changelog](https://github.com/nextcloud-libraries/nextcloud-vue/compare/v8.28.0...v9.0.0-rc.5)
+## [v9.0.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v9.0.0-rc.7) (unreleased)
+[Full Changelog](https://github.com/nextcloud-libraries/nextcloud-vue/compare/v8.29.2...v9.0.0-rc.7)
 
 ### 💥 Breaking Changes
 * The package now uses Vue 3 instead of Vue 2.7
 * The package is now a native ESM package and the CommonJS entry points were dropped!
+* The package has dropped compatibility with Nextcloud before version 31.
+  This mostly affects the visual appearance of components.
 
 #### Plugin registering removed
 The plugin registering all the components and directives globally is removed.
@@ -140,8 +142,10 @@ The `richEditing` mixin can be replaced by just using the `NcRichText` component
   - The `closing` and `opening` events were removed.
     They are directly emitted when the sidebar was opened when using `v-if`
     and also just duplicated the state of the `open` prop [\#5606](https://github.com/nextcloud-libraries/nextcloud-vue/pull/5606)
+- `NcButton` now does no longer has `role="button"` when used as a link (passing the `href` prop or a router link (`to`)).
+   Instead, for accessibility and semantical correctness, has the `link` role.
 - `NcColorPicker`
-  - The `update:open` event is removed in favor of the already available `close` event.
+  - The deprecated `close` event was removed in favor of the `closed` event, this was done for consistent event names.
 - `NcCounterBubble`
   - The default slot was removed
   - The `count` prop is now required [\#5997](https://github.com/nextcloud-libraries/nextcloud-vue/pull/5997)
@@ -187,6 +191,12 @@ The `richEditing` mixin can be replaced by just using the `NcRichText` component
 * feat: add `useFormatRelativeTime` composable [#7067](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7067) ([susnux](https://github.com/susnux))
 * feat(NcPasswordField): allow to set visibility state [#7135](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7135) ([susnux](https://github.com/susnux))
 * feat(NcThemeProvider): allow to override the current theme for parts of the UI [#6764](https://github.com/nextcloud-libraries/nextcloud-vue/pull/6764) ([susnux](https://github.com/susnux))
+* fix(NcDateTimePicker): adjust input padding inline end [#7208](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7208) ([raimund-schluessler](https://github.com/raimund-schluessler))
+* feat(NcColorPicker): add proper open-state handling [#7212](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7212) ([susnux](https://github.com/susnux))
+* feat(NcAppNavigationItem): add `active` as slot property to the "icon"-slot [#7273](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7273) ([susnux](https://github.com/susnux))
+* feat(NcButton): add border with a bottom shadow [#7282](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7282) ([susnux](https://github.com/susnux))
+* feat: add new border design for NcInputField and NcTextArea [\#7351](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7351) \([susnux](https://github.com/susnux)\)
+* feat(NcCheckboxRadioSwitch): Add support for a description field [\#7378](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7378) \([CarlSchwan](https://github.com/CarlSchwan)\)
 
 ### 🐛 Fixed bugs
 * feat(NcAppSidebar): add `info` slot [#6666](https://github.com/nextcloud-libraries/nextcloud-vue/pull/6666) ([Antreesy](https://github.com/Antreesy))
@@ -264,6 +274,34 @@ The `richEditing` mixin can be replaced by just using the `NcRichText` component
 * fix(NcModal): use `--border-radius-container` [#7176](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7176) ([susnux](https://github.com/susnux))
 * fix(useIsDarkTheme): provide default value to silence runtime warnings [#7185](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7185) ([susnux](https://github.com/susnux))
 * fix(NcAppSidebar): remove slot styling for buttons in the description [#7182](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7182) ([susnux](https://github.com/susnux))
+* fix(NcAvatar): contacts menu is broken [#7194](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7194) ([ShGKme](https://github.com/ShGKme))
+* fix(NcActionInput): lazy load large children [#7195](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7195) ([ShGKme](https://github.com/ShGKme))
+* fix(NcButton): use correct type for `to` prop from VueRouter [#7201](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7201) ([susnux](https://github.com/susnux))
+* fix(NcButton): render <a> with "to" and prevent wrong context crash [#7100](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7100) ([ShGKme](https://github.com/ShGKme))
+* fix(NcContent): flip skip action image in rtl mode [#7202](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7202) ([skjnldsv](https://github.com/skjnldsv))
+* fix: remove asterisk from filename allowing checkout on Windows [#7211](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7211) ([ShGKme](https://github.com/ShGKme))
+* fix: correctly apply types so that type definitions are generated during build [#7207](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7207) ([susnux](https://github.com/susnux))
+* fix(NcColorPicker): use proper directional arrow icon for submit [#7217](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7217) ([susnux](https://github.com/susnux))
+* fix(NcBreadCrumb): correctly pass container for `NcActions` [#7237](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7237) ([susnux](https://github.com/susnux))
+* ci: use correct base branch when doing styling update on stable* [#7256](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7256) ([susnux](https://github.com/susnux))
+* fix(NcAvatar): orbital best-fit adaptive status icon  [#6004](https://github.com/nextcloud-libraries/nextcloud-vue/pull/6004) ([ShGKme](https://github.com/ShGKme))
+* fix(NcLoadingIcon): prevent height change from rotate transformation [#7275](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7275) ([Antreesy](https://github.com/Antreesy))
+* fix: 'Set operation on key "value" failed: target is readonly' [#7239](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7239) ([ShGKme](https://github.com/ShGKme))
+* fix(NcInputField, NcTextArea): remove placeholder on Nextcloud 32+ [#7283](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7283) ([susnux](https://github.com/susnux))
+* fix: auto-resolve focus trap stack, if was changed outside of controller [#7277](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7277) ([Antreesy](https://github.com/Antreesy))
+* fix: adjust color variable to work with Nextcloud 32+ [#7311](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7311) ([susnux](https://github.com/susnux))
+* fix(utils): legacy version detection [#7313](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7313) ([skjnldsv](https://github.com/skjnldsv))
+* fix(NcEmojiPicker): scope styles [\#7334](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7334) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcPopover): scope styles to avoid leak [\#7330](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7330) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcReferencePickerModal): scope styles [\#7333](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7333) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcActionButtonGroup): scope styles [\#7332](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7332) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcAppNavigationItem): icon-collapse has wrong color [\#7329](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7329) \([GretaD](https://github.com/GretaD)\)
+* fix(NcAppNavigation): warn if neither `ariaLabel` nor `ariaLabelledby` is set [\#7350](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7350) \([susnux](https://github.com/susnux)\)
+* fix: revert breaking changes and keep Nextcloud 31 support [\#7353](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7353) \([susnux](https://github.com/susnux)\)
+* fix(NcAppNavigationSearch): add space before ellipsis [\#7372](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7372) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcHeaderMenu): pause trap stack on opening [\#7370](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7370) \([Antreesy](https://github.com/Antreesy)\)
+* fix(NcAppNavigationSettings): bring filled icon back for Nextcloud 31 [\#7397](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7397) \([susnux](https://github.com/susnux)\)
+* fix(NcHeaderMenu): apply `ariaLabel` prop and add proper default values [\#7367](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7367) \([susnux](https://github.com/susnux)\)
 
 ### Changed
 * refactor: replace boolean properties with `default: true` with `default: false` [#6653](https://github.com/nextcloud-libraries/nextcloud-vue/pull/6653) ([susnux](https://github.com/susnux))
@@ -391,6 +429,103 @@ The `richEditing` mixin can be replaced by just using the `NcRichText` component
 * refactor(NcRichText): use `debounce` instead of custom delay function [#7174](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7174) ([susnux](https://github.com/susnux))
 * refactor: replace deprecated CSS variables and legacy fallbacks [#7177](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7177) ([susnux](https://github.com/susnux))
 * refactor: use Typescript for l10n dummy import [#7171](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7171) ([susnux](https://github.com/susnux))
+* refactor(NcProgressBar): migrate component to Typescript and update docs [#7138](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7138) ([susnux](https://github.com/susnux))
+* fix: remove asterisk from filename [#7215](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7215) ([raimund-schluessler](https://github.com/raimund-schluessler))
+* docs: clarify application containers and especially NcGuestContent [#7160](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7160) ([susnux](https://github.com/susnux))
+* refactor(NcAppNavigation): migrate component to Typescript and `script-setup` [#7200](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7200) ([susnux](https://github.com/susnux))
+* feat(NcUserStatusIcon): update status icons [#7218](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7218) ([Antreesy](https://github.com/Antreesy))
+* chore: work around bug in `corepack` blocking dependency updates [#7213](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7213) ([susnux](https://github.com/susnux))
+* fix(NcListItem): drop legacy check [#7234](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7234) ([Antreesy](https://github.com/Antreesy))
+* feat(NcHeaderMenu): apply alpha mask to icon slot [#7242](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7242) ([susnux](https://github.com/susnux))
+* docs: v9 will only provide visual compatibility with Nextcloud 32+ [#7287](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7287) ([susnux](https://github.com/susnux))
+* feat: change cog icon into the outline version [#7299](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7299) ([GretaD](https://github.com/GretaD))
+* refactor(NcButton, NcNoteCard): use status text color for icons and text [#7300](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7300) ([susnux](https://github.com/susnux))
+* fix(utils): legacy check syntax adjust [#7314](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7314) ([skjnldsv](https://github.com/skjnldsv))
+* docs: fix CSS Modules support in Styleguidist [\#7331](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7331) \([ShGKme](https://github.com/ShGKme)\)
+* refactor: use properly types injection keys instead of plain names [\#7349](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7349) \([susnux](https://github.com/susnux)\)
+* chore: add missing docblock comments [\#7365](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7365) \([susnux](https://github.com/susnux)\)
+* refactor(NcButton): use proper prop type for `pressed` to allow `undefined` [\#7368](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7368) \([susnux](https://github.com/susnux)\)
+* refactor(NcAppNavigationList): migrate to Typescript [\#7364](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7364) \([susnux](https://github.com/susnux)\)
+* chore(NcAppNavigationItem): fix linting warnings [\#7366](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7366) \([susnux](https://github.com/susnux)\)
+* chore(docs): fix css modules export names in styleguidist [\#7385](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7385) \([ShGKme](https://github.com/ShGKme)\)
+* fix(NcUserStatusIcon): adjust icon colors [\#7392](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7392) \([Antreesy](https://github.com/Antreesy)\)
+* fix(NcUserStatusIcon): adjust scoped names for style variables [\#7396](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7396) \([Antreesy](https://github.com/Antreesy)\)
+
+## [v8.29.2](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.29.2) (2025-08-28)
+### 🐛 Fixed bugs
+* fix(NcUserStatusIcon): legacy 32 check [#7320](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7320) ([skjnldsv](https://github.com/skjnldsv))
+* fix(NcDateTimePicker): lost styles in docs [#7344](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7344) ([ShGKme](https://github.com/ShGKme))
+* fix(NcPopover): scope styles to avoid leak [#7341](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7341)
+* fix(NcReferencePickerModal): scope styles [#7347](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7347)
+* fix(NcEmojiPicker): scope styles [#7343](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7343)
+* fix(NcActionButtonGroup): scope styles [#7348](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7348)
+* fix(NcAppNavigationItem): icon-collapse has wrong colour [#7346](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7346) ([GretaD](https://github.com/GretaD))
+* fix(NcNoteCard): adjust colors to work with Nextcloud 32+ [#7361](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7361) ([susnux](https://github.com/susnux))
+* fix(l10n): add non-breaking space before ellipsis [#7373](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7373)
+* fix(NcHeaderMenu): pause trap stack on opening [#7384](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7384) ([Antreesy](https://github.com/Antreesy))
+* add new border design for NcInputField and NcTextArea [#7383](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7383)
+* fix: change icon cog into outline version on 32+ [#7394](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7394) \([GretaD](https://github.com/GretaD)\)
+
+### Other Changes
+* docs: fix CSS Modules support in Styleguidist [#7342](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7342)
+* chore(docs): fix css modules export names in styleguidist [#7387](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7387)
+* fix(NcUserStatusIcon): adjust icon colors [#7393](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7393)
+* fix(NcUserStatusIcon): adjust scoped names for style variables [#7400](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7400)
+
+
+## [v8.29.1](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.29.1) (2025-08-19)
+### 🐛 Fixed bugs
+* fix(NcButton): ensure correct padding [#7305](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7305) ([susnux](https://github.com/susnux))
+* fix(NcCheckboxRadioSwitch): ensure component has correct box sizing [#7306](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7306) ([susnux](https://github.com/susnux))
+* fix(utils): legacy check syntax [#7315](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7315) ([skjnldsv](https://github.com/skjnldsv))
+* fix: adjust color variables to work with Nextcloud 32+ [#7312](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7312)
+
+## [v8.29.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.29.0) (2025-08-18)
+
+### 📝 Notes
+#### `NcColorPicker`
+The `update:open` event was undeprecated, instead proper open state handling of the component was added.
+This means it is now possible to pass the `open` prop directly to the component,
+it is implemented as two-way binding with the corresponding `update:open` event.
+It is now discouraged to use the previous solution of relying on the `shown` prop of the underlying component.
+
+Additionally for consistent event naming the `close` event was deprecated in favor of the `closed` event.
+The `closed` event will be emitted after `update:open` (with payload `false`) was emitted and all transitions have finished.
+
+### 🚀 Enhancements
+* feat(NcThemeProvider): allow to override the current theme for parts of the UI [#7152](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7152)
+* feat(dialogs/spawnDialog): separate spawning options from dialog props and allow Element as a container [#6768](https://github.com/nextcloud-libraries/nextcloud-vue/pull/6768)
+* feat(NcColorPicker): add proper open-state handling [#7214](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7214)
+* feat(NcAppNavigationItem): add `active` as slot property to the "icon"-slot [#7274](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7274)
+* feat: add visual border for buttons on Nextcloud 32+ [#7291](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7291)
+* feat(NcUserStatusIcon): update status icons [#7223](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7223)
+* feat(NcHeaderMenu): apply alpha mask to icon slot [#7243](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7243)
+
+### 🐛 Fixed bugs
+* perf(NcAvatar): ensure avatar does not add mutation observer [#7168](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7168)
+* perf(utils): ensure only 64px or 512px avatars are loaded [#7153](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7153)
+* fix(NcButton): force cursor pointer [#7158](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7158) ([ShGKme](https://github.com/ShGKme))
+* fix(NcInputField): remove browser injected clear button [#7169](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7169)
+* fix(NcModal): use `--border-radius-container` [#7178](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7178)
+* fix(useIsDarkTheme): provide default value to silence runtime warnings [#7189](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7189)
+* fix(NcAppSidebar): remove slot styling for buttons in the description [#7190](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7190)
+* fix(NcActionInput): register used NcColorPicker component [#7198](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7198)
+* fix(NcActionInput): lazy load large children [#7197](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7197)
+* fix(NcContent): flip skip action image in rtl mode [#7205](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7205)
+* fix(NcColorPicker): use proper directional arrow icon for submit [#7219](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7219)
+* fix(NcAvatar): orbital best-fit adaptive status icon  [#7260](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7260)
+* fix(NcLoadingIcon): prevent height change from rotate transformation [#7276](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7276)
+* fix(NcInputField, NcTextareaField): remove placeholder on Nextcloud 32+ [#7286](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7286) ([susnux](https://github.com/susnux))
+* fix: migrate from _oc_config to initial state [#7235](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7235) ([Antreesy](https://github.com/Antreesy))
+* fix: auto-resolve focus trap stack, if was changed outside of controller [#7304](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7304) ([Antreesy](https://github.com/Antreesy))
+
+### Other Changes
+* refactor(functions): Make sure only named exports are used (usernameToColor) [#7170](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7170) ([susnux](https://github.com/susnux))
+* refactor: use secondary colors for buttons on Nextcloud 32+ [#7301](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7301) ([susnux](https://github.com/susnux))
+* chore: copy diff from stable8 changelog [#7159](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7159)
+* chore: align sorting of package.json [#7162](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7162) ([susnux](https://github.com/susnux))
+* docs: clarify application containers and especially NcGuestContent [#7216](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7216)
+* ci: update workflows from organization [#7166](https://github.com/nextcloud-libraries/nextcloud-vue/pull/7166) ([susnux](https://github.com/susnux))
 
 ## [v8.28.0](https://github.com/nextcloud-libraries/nextcloud-vue/tree/v8.28.0) (2025-07-14)
 [Full Changelog](https://github.com/nextcloud-libraries/nextcloud-vue/compare/v8.27.0...v8.28.0)
@@ -406,7 +541,7 @@ The value `arrowRight` of the property `trailingButtonIcon` is deprecated and wi
 It is replaced by `arrowEnd` which reflects that the directions depends on the text directions (LTR vs RTL).
 
 #### `NcColorPicker`
-The `update:open` event is deprecated, instead just use the `close` event which is emitted at the same time.
+<del>The `update:open` event is deprecated, instead just use the `close` event which is emitted at the same time.</del> *(this was reverted in 8.29.0)*
 
 #### Event names
 Custom events now have a consistent naming without custom scoping of the events.

package/README.md

@@ -18,7 +18,7 @@
 
 | Version        | Target                | Documentation                                         |
 |----------------|-----------------------|-------------------------------------------------------|
-| v9.x [main]    | Nextcloud 30+ (Vue 3) | https://nextcloud-vue-components.netlify.app          |
+| v9.x [main]    | Nextcloud 31+ (Vue 3) | https://nextcloud-vue-components.netlify.app          |
 | v8.x [stable8] | Nextcloud 28+ (Vue 2) | https://stable8--nextcloud-vue-components.netlify.app |
 | v7.x [stable7] | Nextcloud 25 - 27     | https://stable7--nextcloud-vue-components.netlify.app |
 | v6.x [stable6] | Nextcloud 24 - 25     | https://stable6--nextcloud-vue-components.netlify.app |
@@ -106,9 +106,10 @@ npm run l10n:extract
 
 ### 🐸 Styleguidist
 
-When developing new components or extending components, make sure to also have some bits of related documentation like examples, where applicable.
-To test components and the documentation in that context, you can run `npm run styleguide` to run a local server that serves the style guide
-with all the components.
+When developing new components or extending components, make sure to also have some bits of related documentation like examples, where applicable. To test components and the documentation in that context, you can run `npm run styleguide` to run a local server that serves the style guide with all the components.
+
+You can also test if the design still works with a legacy Nextcloud version.
+To do so just run `NEXTCLOUD_LEGACY=y npm run styleguide`.
 
 #### Using vue-devtools in Firefox
 

package/dist/assets/{NcActionButton-Dz2EBAuD.css → NcActionButton-D7bnKlOt.css}

@@ -9,7 +9,7 @@
 /*
 * Ensure proper alignment of the vue material icons
 */
-.material-design-icon[data-v-76892c52] {
+.material-design-icon[data-v-330b5e3e] {
   display: flex;
   align-self: center;
   justify-self: center;
@@ -21,25 +21,25 @@
  * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
-li.action[data-v-76892c52]:hover, li.action.active[data-v-76892c52] {
+li.action[data-v-330b5e3e]:hover, li.action.active[data-v-330b5e3e] {
   border-radius: 6px;
   padding: 0;
 }
-li.action[data-v-76892c52]:hover {
+li.action[data-v-330b5e3e]:hover {
   background-color: var(--color-background-hover);
 }
-.action--disabled[data-v-76892c52] {
+.action--disabled[data-v-330b5e3e] {
   pointer-events: none;
   opacity: 0.5;
 }
-.action--disabled[data-v-76892c52]:hover, .action--disabled[data-v-76892c52]:focus {
+.action--disabled[data-v-330b5e3e]:hover, .action--disabled[data-v-330b5e3e]:focus {
   cursor: default;
   opacity: 0.5;
 }
-.action--disabled[data-v-76892c52] * {
+.action--disabled[data-v-330b5e3e] * {
   opacity: 1 !important;
 }
-.action-button[data-v-76892c52] {
+.action-button[data-v-330b5e3e] {
   display: flex;
   align-items: flex-start;
   width: 100%;
@@ -59,11 +59,11 @@ li.action[data-v-76892c52]:hover {
   font-size: var(--default-font-size);
   line-height: var(--default-clickable-area);
 }
-.action-button > span[data-v-76892c52] {
+.action-button > span[data-v-330b5e3e] {
   cursor: pointer;
   white-space: nowrap;
 }
-.action-button__icon[data-v-76892c52] {
+.action-button__icon[data-v-330b5e3e] {
   width: var(--default-clickable-area);
   height: var(--default-clickable-area);
   opacity: 1;
@@ -71,15 +71,15 @@ li.action[data-v-76892c52]:hover {
   background-size: 16px;
   background-repeat: no-repeat;
 }
-.action-button[data-v-76892c52] .material-design-icon {
+.action-button[data-v-330b5e3e] .material-design-icon {
   width: var(--default-clickable-area);
   height: var(--default-clickable-area);
   opacity: 1;
 }
-.action-button[data-v-76892c52] .material-design-icon .material-design-icon__svg {
+.action-button[data-v-330b5e3e] .material-design-icon .material-design-icon__svg {
   vertical-align: middle;
 }
-.action-button__longtext-wrapper[data-v-76892c52], .action-button__longtext[data-v-76892c52] {
+.action-button__longtext-wrapper[data-v-330b5e3e], .action-button__longtext[data-v-330b5e3e] {
   max-width: 220px;
   line-height: 1.6em;
   padding: calc((var(--default-clickable-area) - 1.6em) / 2) 0;
@@ -88,11 +88,11 @@ li.action[data-v-76892c52]:hover {
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.action-button__longtext[data-v-76892c52] {
+.action-button__longtext[data-v-330b5e3e] {
   cursor: pointer;
   white-space: pre-wrap !important;
 }
-.action-button__name[data-v-76892c52] {
+.action-button__name[data-v-330b5e3e] {
   font-weight: bold;
   text-overflow: ellipsis;
   overflow: hidden;
@@ -100,7 +100,7 @@ li.action[data-v-76892c52]:hover {
   max-width: 100%;
   display: block;
 }
-.action-button__description[data-v-76892c52] {
+.action-button__description[data-v-330b5e3e] {
   display: block;
   white-space: pre-wrap;
   font-size: var(--font-size-small);
@@ -108,12 +108,12 @@ li.action[data-v-76892c52]:hover {
   color: var(--color-text-maxcontrast);
   cursor: pointer;
 }
-.action-button__menu-icon[data-v-76892c52] {
+.action-button__menu-icon[data-v-330b5e3e] {
   margin-inline: auto calc((var(--default-clickable-area) - 16px) / 2 * -1);
 }
-.action-button__pressed-icon[data-v-76892c52] {
+.action-button__pressed-icon[data-v-330b5e3e] {
   margin-inline: auto calc((var(--default-clickable-area) - 16px) / 2 * -1);
 }
-.action-button[data-v-76892c52] * {
+.action-button[data-v-330b5e3e] * {
   cursor: pointer;
 }

package/dist/assets/{NcActionButtonGroup-BLIEEeG3.css → NcActionButtonGroup-CRTH2v24.css}

@@ -9,39 +9,39 @@
 /*
 * Ensure proper alignment of the vue material icons
 */
-.material-design-icon {
+.material-design-icon[data-v-f57c2142] {
   display: flex;
   align-self: center;
   justify-self: center;
   align-items: center;
   justify-content: center;
 }
-.nc-button-group-base > div {
+.nc-button-group-base > div[data-v-f57c2142] {
   text-align: center;
   color: var(--color-text-maxcontrast);
 }
-.nc-button-group-base ul.nc-button-group-content {
+.nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] {
   display: flex;
   gap: 4px;
   justify-content: space-between;
 }
-.nc-button-group-base ul.nc-button-group-content li {
+.nc-button-group-base ul.nc-button-group-content li[data-v-f57c2142-s] {
   flex: 1 1;
 }
-.nc-button-group-base ul.nc-button-group-content .action-button {
+.nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button {
   padding: 0 !important;
   width: 100%;
   display: flex;
   justify-content: center;
 }
-.nc-button-group-base ul.nc-button-group-content .action-button.action-button--active {
+.nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button.action-button--active {
   background-color: var(--color-primary-element);
   border-radius: var(--border-radius-element);
   color: var(--color-primary-element-text);
 }
-.nc-button-group-base ul.nc-button-group-content .action-button.action-button--active:hover, .nc-button-group-base ul.nc-button-group-content .action-button.action-button--active:focus, .nc-button-group-base ul.nc-button-group-content .action-button.action-button--active:focus-within {
+.nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button.action-button--active:hover, .nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button.action-button--active:focus, .nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button.action-button--active:focus-within {
   background-color: var(--color-primary-element-hover);
 }
-.nc-button-group-base ul.nc-button-group-content .action-button .action-button__pressed-icon {
+.nc-button-group-base ul.nc-button-group-content[data-v-f57c2142] .action-button .action-button__pressed-icon {
   display: none;
 }

package/dist/assets/{NcActionCheckbox--lTDnNsx.css → NcActionCheckbox-BeT6fCCy.css}

@@ -9,7 +9,7 @@
 /*
 * Ensure proper alignment of the vue material icons
 */
-.material-design-icon[data-v-8e31d57f] {
+.material-design-icon[data-v-6099342c] {
   display: flex;
   align-self: center;
   justify-self: center;
@@ -21,25 +21,25 @@
  * SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
-li.action[data-v-8e31d57f]:hover, li.action.active[data-v-8e31d57f] {
+li.action[data-v-6099342c]:hover, li.action.active[data-v-6099342c] {
   border-radius: 6px;
   padding: 0;
 }
-li.action[data-v-8e31d57f]:hover {
+li.action[data-v-6099342c]:hover {
   background-color: var(--color-background-hover);
 }
-.action--disabled[data-v-8e31d57f] {
+.action--disabled[data-v-6099342c] {
   pointer-events: none;
   opacity: 0.5;
 }
-.action--disabled[data-v-8e31d57f]:hover, .action--disabled[data-v-8e31d57f]:focus {
+.action--disabled[data-v-6099342c]:hover, .action--disabled[data-v-6099342c]:focus {
   cursor: default;
   opacity: 0.5;
 }
-.action--disabled[data-v-8e31d57f] * {
+.action--disabled[data-v-6099342c] * {
   opacity: 1 !important;
 }
-.action-checkbox[data-v-8e31d57f] {
+.action-checkbox[data-v-6099342c] {
   display: flex;
   align-items: flex-start;
   width: 100%;
@@ -57,24 +57,24 @@ li.action[data-v-8e31d57f]:hover {
   line-height: var(--default-clickable-area);
   /* checkbox/radio fixes */
 }
-.action-checkbox__checkbox[data-v-8e31d57f] {
+.action-checkbox__checkbox[data-v-6099342c] {
   position: absolute;
   inset-inline-start: 0 !important;
   z-index: -1;
   opacity: 0;
 }
-.action-checkbox__label[data-v-8e31d57f] {
+.action-checkbox__label[data-v-6099342c] {
   display: flex;
   align-items: center;
   width: 100%;
   padding: 0 !important;
   padding-inline-end: calc((var(--default-clickable-area) - 16px) / 2) !important;
 }
-.action-checkbox__label[data-v-8e31d57f]::before {
+.action-checkbox__label[data-v-6099342c]::before {
   margin-block: 0 !important;
   margin-inline: calc((var(--default-clickable-area) - 14px) / 2) !important;
 }
-.action-checkbox--disabled[data-v-8e31d57f],
-.action-checkbox--disabled .action-checkbox__label[data-v-8e31d57f] {
+.action-checkbox--disabled[data-v-6099342c],
+.action-checkbox--disabled .action-checkbox__label[data-v-6099342c] {
   cursor: pointer;
 }