Skip to content

Releases: nextcloud-libraries/nextcloud-vue

v9.3.0

20 Nov 11:47
5930a2b

Choose a tag to compare

What's Changed

🚀 Enhancements

  • feat(NcAppSettingsDialog): add version on the bottom and noVersion prop to disable it by @ShGKme in #7837
  • fix(NcActions): introduce 'size' prop by @Antreesy in #7847
  • feat(NcRichText): add 'Copy to clipboard' button for code blocks by @Antreesy in #7841

🐛 Fixed bugs

  • fix(NcPasswordField): respect checkPasswordStrength for input validation by @Antreesy in #7845
  • fix(NcTextField): helper text icon is too large by @ShGKme in #7856
  • fix(NcFormBox): use default text color in items by @ShGKme in #7854
  • fix(NcAvatar): do no request avatar image if icon slot provided by @Antreesy in #7891

Other Changes

  • ci(dependabot): Use auto merge instead of deprecated option by @nickvergessen in #7835
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7840
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7858
  • docs: Move to more outline icons by @nickvergessen in #7860
  • docs: Move more icons to outline by @nickvergessen in #7862
  • fix(NcActions): handle expensive height computation by popover library by @Antreesy in #7778
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7867
  • chore: refactor deprecated :deep selector by @ShGKme in #7875
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7876

Full Changelog: v9.2.0...v9.3.0

v9.2.0

07 Nov 21:00
3982691

Choose a tag to compare

What's Changed

📝 Notes

  • NcAppSettingsSectionShortcuts has been renamed to NcAppSettingsShortcutsSection but still available by the previous name
  • NcAppSettingsDialog has started the process of migration to the new design. It may break the existing settings layout. Use layout prop to partially revert the change or migrate to use NcFormBox and NcFormGroup components in the settings sections.

🚀 Enhancements

  • feat: add NcFormGroup by @ShGKme in #7689
  • feat: add NcFormBox and adjust NcRadioGroup to NcFormbox and NcFormGroup by @ShGKme in #7690
  • feat(NcRadioGroup): deprecate labelHidden prop in favor of hideLabel by @susnux in #7771
  • feat: add NcFormBoxButton by @ShGKme in #7779
  • feat: add NcFormBoxSwitch by @ShGKme in #7781
  • feat: add NcFormBoxCopyButton by @ShGKme in #7787
  • feat(NcAppSettingsDialog): adjust design for new form elements, add section descriptions and optional switch to legacy design by @ShGKme in #7797
  • feat: NcAppSettingsSectionShortcuts -> NcAppSettingsShortcutsSection by @ShGKme in #7814

🐛 Fixed bugs

  • fix(NcRichText): start heading from h4 by @ShGKme in #7748
  • fix(NcFormGroup): remove margin when no label/description by @ShGKme in #7764
  • fix(NcFormGroup): decrease gap between label and content by @ShGKme in #7775
  • fix(NcFormBox*): user-select: none on Safari as well by @ShGKme in #7792
  • fix(NcRichContenteditable): keep previous cursor position on focus by @Antreesy in #7791
  • fix(NcHotkeyList): align with form labels by @ShGKme in #7807
  • fix(NcHotkeyList): align with the section by @ShGKme in #7811
  • fix(NcActions): improve performance by only computing popover maxHeight on demand by @Antreesy in #7808
  • fix(NcListItem): do not mount NcAction until necessary by @ShGKme in #7817

Other Changes

  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7714
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7750
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7751
  • chore(docs): update docs link titles by @ShGKme in #7768
  • chore(docs): correct min supported Nextcloud version by @ShGKme in #7774
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7783
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7794
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7798
  • chore(docs): do not minimize docs and add examples code highlight by @ShGKme in #7784
  • chore(docs): optionally set docs server port via VUE_STYLEGUIDIST_PORT by @ShGKme in #7805
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7809
  • chore: bump node and npm dev versions by @susnux in #7785
  • Updates for project Nextcloud vue library by @transifex-integration[bot] in #7819

Full Changelog: v9.1.0...v9.2.0

v8.34.0

07 Nov 20:10
92a8e63

Choose a tag to compare

What's Changed

📝 Notes

  • NcAppSettingsSectionShortcuts has been renamed to NcAppSettingsShortcutsSection but still available by the previous name

🚀 Enhancements

  • [stable8] feat: add NcFormGroup by @backportbot[bot] in #7762
  • [stable8] feat: add NcFormBox and adjust NcRadioGroup to NcFormBox and NcFormGroup by @backportbot[bot] in #7765
  • [stable8] feat: add NcFormBoxButton by @backportbot[bot] in #7789
  • [stable8] feat(NcRadioGroup): deprecate labelHidden prop in favor of hideLabel by @backportbot[bot] in #7772
  • [stable8] feat: add NcFormBoxCopyButton by @backportbot[bot] in #7793
  • [stable8] feat: add NcFormBoxSwitch by @backportbot[bot] in #7795
  • [stable8] feat(NcAppSettingsDialog): adjust design for new form elements, add section descriptions by @backportbot[bot] in #7802
  • [stable8] feat: NcAppSettingsSectionShortcuts -> NcAppSettingsShortcutsSection by @backportbot[bot] in #7816

🐛 Fixed bugs

  • [stable8] fix(NcFormGroup): remove margin when no label/description by @backportbot[bot] in #7780
  • [stable8] fix(NcFormGroup): decrease gap between label and content by @ShGKme in #7782
  • [stable8] fix(NcFormBox*): user-select: none on Safari as well by @backportbot[bot] in #7796
  • [stable8] fix(NcRichContenteditable): keep previous cursor position on focus by @backportbot[bot] in #7804
  • [stable8] fix(NcHotkeyList): align with form labels by @backportbot[bot] in #7810
  • [stable8] fix(NcHotkeyList): align with the section by @backportbot[bot] in #7812
  • [stable8] fix(NcActions): improve performance by only computing popover maxHeight on demand by @backportbot[bot] in #7815
  • [stable8] fix(NcListItem): do not mount NcAction until necessary by @backportbot[bot] in #7818
  • [stable8] fix(NcRichText): start heading from h4 by @ShGKme in #7821
  • [stable8] fix(NcFormBoxButton): router check on Vue 2 by @ShGKme in #7822

Other Changes

  • [stable8] chore(docs): update docs link titles by @backportbot[bot] in #7770
  • [stable8] chore: update workflows from organization by @susnux in #7763
  • [stable8] chore(docs): add missing backports around supported versions and links by @ShGKme in #7773
  • [stable8] chore(docs): correct min supported Nextcloud version by @backportbot[bot] in #7776
  • [stable8] chore(docs): do not minimize docs and add examples code highlight by @backportbot[bot] in #7803
  • [stable8] chore: update Node and NPM version in dev engines by @susnux in #7786
  • [stable8] chore(docs): optionally set docs server port via VUE_STYLEGUIDIST_PORT by @backportbot[bot] in #7806

Full Changelog: v8.33.0...v8.34.0

v9.1.0

23 Oct 06:53
0399ae0

Choose a tag to compare

What's Changed

🚀 Enhancements

  • feat(NcChip): add error, success and warning variants by @DorraJaouad in #7652
  • feat(NcAppSettingsSection): add order prop, ensure intended order in navigation list by @Antreesy in #7636
  • feat: add NcAppSettingsSectionShortcuts, NcHotkeyList and NcHotkey by @ShGKme in #7633

🐛 Fixed bugs

  • fix(NcInputField): use empty string to fix label position by @susnux in #7630
  • chore: switch dependency for MD5 to ts-md5 by @susnux in #7623
  • fix(NcEmptyContent): use name as label by @susnux in #7634
  • fix(NcRadioGroupButton): scope expensive CSS selectors by @Antreesy in #7661
  • fix(NcAppContentDetailsToggle): Hide navigation toggle on mobile by @mejo- in #7697

Other Changes

  • refactor(NcAppSidebarTabs): use custom components for tab buttons by @susnux in #7516
  • refactor(NcAppSettingsSection): migrate to <script setup lang="ts"> by @ShGKme in #7651
  • refactor: use named export for logger by @ShGKme in #7655

Full Changelog: v9.0.1...v9.1.0

v8.33.0

22 Oct 21:20
028c435

Choose a tag to compare

What's Changed

🚀 Enhancements

  • [stable8] feat(NcChip): add error, success and warning variants by @backportbot[bot] in #7653
  • [stable8] feat(NcAppSettingsSection): add order prop, ensure intended order in navigation list by @backportbot[bot] in #7656
  • [stable8] feat: add NcAppSettingsSectionShortcuts, NcHotkeyList and NcHotkey by @backportbot[bot] in #7696

🐛 Fixed bugs

  • [stable8] fix(NcInputField): use empty string to fix label position by @susnux in #7637
  • [stable8] fix(NcEmptyContent): use name as label by @backportbot[bot] in #7649
  • [stable8] fix(NcRadioGroupButton): scope expensive CSS selectors by @backportbot[bot] in #7662
  • [stable8] fix(NcAppContentDetailsToggle): Hide navigation toggle on mobile by @mejo- in #7698
  • [stable8] fix(NcAppNavigationSettings): migrate to NcButton component by @mejo- in #7700

Other Changes

  • [stable8] chore: adjust heading in changelog to match version by @susnux in #7622
  • [stable8] refactor(NcAppSettingsSection): migrate to <script setup lang="ts"> by @backportbot[bot] in #7654

Full Changelog: v8.32.0...v8.32.1

v9.0.1

06 Oct 17:20
399515d

Choose a tag to compare

What's Changed

🐛 Fixed bugs

  • fix(NcAppContent): avoid double content mount by @ShGKme in #7590
  • fix(NcAppContent): add reactivity to pane config key in #7574

Other Changes

  • Updated translations
  • chore: prepare release of v9.0.1 by @susnux in #7621

Full Changelog: v9.0.0...v9.0.1

v8.32.0

06 Oct 15:46
5f8105a

Choose a tag to compare

What's Changed

🚀 Enhancements

  • [stable8] feat(NcColorPicker): allow to clear selected value by @backportbot[bot] in #7531
  • [stable8] feat(NcModal): add new closeButtonOutside prop and deprecated closeButtonContained by @Antreesy in #7553

🐛 Fixed bugs

  • [stable8] fix(useHotKey): use correct callback type by @backportbot[bot] in #7511
  • [stable8] fix(NcRadioGroupButton): adjust hight if needed by @backportbot[bot] in #7554
  • [stable8] fix(NcAvatar): log error and URL on error by @ChristophWurst in #7561
  • [stable8] fix(console): fix log context object by @ChristophWurst in #7563
  • [stable8] fix(NcAppContent): avoid double content mount by @backportbot[bot] in #7619

Other Changes

  • [stable8] refactor(NcColorPicker): migrate component to Typescript and script-setup by @backportbot[bot] in #7532
  • [stable8] fix(NcAppContent): add reactivity to pane config key by @GVodyanov in #7573
  • [stable8] refactor(NcAppSettingsDialog): migrate to Typescript and script-setup by @backportbot[bot] in #7517
  • chore: prepare release of v8.32.0 by @susnux in #7620

Full Changelog: v8.31.0...v8.32.0

v9.0.0

25 Sep 11:08
dd64239

Choose a tag to compare

v9.0.0 (2025-09-25)

💥 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.
  • The NcSettingsInputText component was deprecated in v8 and is now removed.

Plugin registering removed

The plugin registering all the components and directives globally is removed.
Instead use local registration of components and directives.
If you really need an alternative we recommend using unplugin-vue-components.

Import paths changed

The old import paths like @nextcloud/vue/dist/Components/NcComponent.js were removed.
Instead use the new ones (@nextcloud/vue/components/NcComponent).

Example shell command to do the refactoring:

PATTERN='s,@nextcloud/vue/dist/([^/]+)/([^.]+).js,@nextcloud/vue/\L\1\E/\2,'
find src \
  -name "*.vue" \
  -exec sed -i -re "$PATTERN" \{\} +

Container components now default to box-sizing: border-box

For container components that can be directly mounted to <body> the box-sizing was adjusted to match the behavior of NcContent.

The box-sizing: border-box is now default for following components and its content:

  • NcDialog
  • NcModal
  • NcPopover

Consistent usage of modelValue prop

All input elements were refactored to use the modelValue prop instead of the now removed value / checked prop and emit the update:modelValue event instead of the removed update:checked / update:value / input events.
This which allows consistent using of v-model.

Affected components:

  • Removed checked prop and update:checked event
    • NcActionCheckbox
    • NcActionRadio
    • NcCheckboxRadioSwitch
  • Removed value prop and update:value / input events:
  • The modelValue prop of NcActionRadio is expecting to have type string|number to be compared to value prop.
  • The value prop was renamed to modelValue, the update:value or input events were renamed to update:modelValue. This affects the following components:
    • NcActionInput
    • NcActionTextEditable
    • NcColorPicker
    • NcDateTimePicker
    • NcDateTimePickerNative
    • NcInputField
    • NcPasswordField
    • NcRichContenteditable
    • NcSelect
    • NcSelectTags
    • NcSettingsInputText
    • NcSettingsSelectGroup
    • NcTextArea
    • NcTextField
    • NcTimezonePicker

Removing the exact prop

The exact prop, previously used by router-link components, was removed.
This affects the following components:

  • NcActionRouter
  • NcAppNavigationItem
  • NcBreadcrumb
  • NcButton
  • NcListItem

Renaming icon slot of Nc*Field

The leading icon slot was changed from #default to #icon in Nc*Field components:

  • NcInputField
  • NcTextField
  • NcPasswordField

Boolean props default to false

Some boolean props that have been deprecated in favor of alternatives with default value false,
are now removed. Following components have been adjusted:

Component Removed deprecated prop New alternative
NcAppContent allowSwipeNavigation disabledSwipe
NcAvatar showUserStatus hideStatus
NcAvatar showUserStatusCompact verboseStatus
NcModal closeButtonContained closeButtonOutside
NcModal enableSwipe disableSwipe
NcModal canClose noClose
NcDialog canClose noClose
NcPopover focusTrap noFocusTrap

Additionally the default value closeOnClickOutside for NcModal was aligned with NcDialog and now defaults to false.

Removal of type and nativeType props

The type property for button components (NcButton, NcActions, NcDialogButton) was deprecated for the usage with color variants like primary.
The fallback behavior was removed, type now only allows the native HTML button type like button, reset or submit.
Instead use the variant property for the color variant.

The nativeType property was removed in favor of type.

<!-- Old: Nextcloud Vue v8 -->
<NcButton type="primary" native-type="submit">Submit</NcButton>
<!-- New: Nextcloud Vue v9 -->
<NcButton type="submit" variant="primary">Submit</NcButton>

Event names

To have a consistent naming for custom event the following events were deprecated
and now are removed in favor of a new consistent event name:

 Component |       Old event |       New event

---------------|-----------------|----------------
NcAppContent | resize:list | resizeList
NcRichText | interact:todo | interactTodo

Mixins are removed

Mixins only work in Options API and are in general not recommended by Vue anymore:

In Vue 2, mixins were the primary mechanism for creating reusable chunks of component logic. While mixins continue to be supported in Vue 3, Composable functions using Composition API is now the preferred approach for code reuse between components.

As this library also uses composition API now all required mixins have been migrated to composables which work in Options API and Composition API.
Especially the following are now provided as composables:

  • isFullscreen is now provided as useIsFullscreen
  • isMobile is now provided as useIsMobile and isMobileState was removed.

The richEditing mixin can be replaced by just using the NcRichText component.

Other breaking changes

  • NcActions and NcAction*
    • The ariaHidden property is removed, please do no longer provide it, otherwise the root element will inherit incorrect aria-hidden.
  • NcAppSidebar
    • 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
  • 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 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
  • NcHeaderMenu
    • open, close and cancel events were removed in favor of opened and closed events #6429
  • NcSettingsSection
    • The limitWidth was removed (the content is now always limited width) #5605
  • The isFullscreen, and isMobile mixins were removed. Use the according composables instead.
  • The clickOutsideOptions mixin is removed
  • The box-sizing: border-box is now default for following components and its content. This is done to match behavior of NcContent (as they can be mounted directly to body):
    • NcModal
    • NcPopover
  • NcDateTimePicker
    • The range property was removed in favor of type="datetime-range" (datetime ranges), type="date-range" (date only ranges), and type="time-range" (time only ranges).
    • The lang property was replaced with the locale property.
    • The formatter property was removed.
  • NcPopover is no longer a transparent wrapper over the floating-vue package.
    Instead only use the documented properties and events.
    If you find some use cases not covered by the documented interface, please open a feature request.
  • NcRichContenteditable
    • NcAutoCompleteResult: The title prop was deprecated and is now removed in favor of the label prop
    • NcMentionBubble: The title prop was deprecated and is now removed in favor of the label prop
  • NcSelect
    • userSelect property was removed, instead just use the NcSelectUsers component
    • closeOnSelect property was removed in favor of keepOpen.
  • NcTextField:
    • The value 'arrowRight' for the trailingButtonIcon property was deprecated is now removed in favor of arrowEnd.
  • Tooltip directive was deprecated in v8 and is now removed.
    This was done in favor of native tooltips using the title attribute, which is better for accessibility.
    If you really need custom formatted tooltips, you can use NcPopover instead.
  • The useFormatDateTime composable - only exported from default entry point - is removed.
    Instead you can now use useFormatTime for formatting a time to a local date string or useFormatRelativeTime to format it to a humanized string like a day ago.
  • The usernameToColor function is named exported instead of a default export.
    This was done to have consistent export types.

🚀 Enhancements

  • Allow writing components using Typescript and provide type definitions for NcButton #4525 (susnux)
  • feat(NcDateTimePicker): add time range picker and align naming #6728 (susnux)
  • feat(dialogs/spawnDialog): separate spawning options from dialog props and allow Element as a container #6756 ([ShGKme](https://gith...
Read more

v9.0.0-rc.9

11 Sep 13:24
304c9d1

Choose a tag to compare

v9.0.0-rc.9 Pre-release
Pre-release

What's Changed

🚀 Enhancements

  • feat(NcRadioGroup): add component to group radio buttons #7441 (susnux)

🐛 Fixed bugs

  • fix(NcAssistantIcon): adjust gradient for dark theme #7426 (susnux)
  • fix(NcCheckboxContent): limit wrapper width #7445 (Antreesy)
  • fix(NcRichText): correctly render empty children list #7447 (Antreesy)
  • fix: revert renaming template refs resulting in a breaking change #7448 (ShGKme)
  • fix(NcDateTimePicker): use proper day names #7473 (susnux)
  • fix(NcCheckboxRadioSwitch): ensure label less radio has proper size #7471 (susnux)
  • fix(NcDateTime): adjust for bidi support #7484 (susnux)
  • fix(NcAppNavigationItem): ensure to pass boolean where needed #7489 (susnux)
  • fix(NcReferenceWidget): harden checks for reference = null #7478 (Antreesy)
  • fix(NcAvatar): make min status size visually accessible #7476 (DorraJaouad)
  • fix(NcRadioGroup): fieldsets always need a label for accessibility #7483
  • fix(usernameToColor): restore original color algorithm #7470

Other Changes

  • docs: enhance NcAppSidebar documentation #6913 (Antreesy)
  • chore!: deprecate and remove NcSettingsInputText component #7486 (susnux)
  • chore(NcCheckboxRadioSwitch): deprecate button variant in favor of NcRadioGroup #7490 (susnux)

Full Changelog: v9.0.0-rc.8...v9.0.0-rc.9

v8.31.0

11 Sep 13:00
89a7787

Choose a tag to compare

Changelog

v8.31.0 (2025-09-11)

📝 Notes

The NcSettingsInputText component was deprecated,
it is no longer used by Nextcloud or Nextcloud apps and not recommended to be used for design reasons.

🚀 Enhancements

  • feat: add NcKbd component #7407
  • feat(NcRadioGroup): add component to group radio buttons #7474

🐛 Fixed bugs

  • fix(NcAssistantIcon): adjust gradient for dark theme #7430
  • fix(NcPopover): regression with this.getPopoverTriggerContainerElement is not a function #7443 (max-nextcloud)
  • fix(NcCheckboxRadioSwitch): ensure label less radio has proper size #7477
  • fix(NcDateTime): adjust for bidi support #7485
  • fix(NcReferenceWidget): harden checks for reference = null #7493
  • fix(NcRadioGroup): fieldsets always need a label for accessibility #7495
  • fix(NcAvatar): make min status size visually accessible #7480
  • fix(NcAppNavigationItem): ensure to pass boolean where needed #7491

Other Changes

  • chore(NcCheckboxRadioSwitch): deprecate button variant in favor of NcRadioGroup #7492
  • chore: deprecate NcSettingsInputText component #7488
  • chore: migrate to ESLint 9 and @nextcloud/eslint-config 9 #7418 (ShGKme)
  • chore(lint): fix #7425 (ShGKme)
  • chore(test): explicitly import from jest/globals to simplify migration to/from Vitest #7424 (ShGKme)
  • docs: typos in 8.30.0 changelog #7422