fix(Run lint:fix)

Signed-off-by: Marcel Klehr <mklehr@gmx.net>

src/components/Bookmark.vue

@@ -86,12 +86,7 @@
 <script>
 import Item from './Item.vue'
 import { NcActionButton, NcActionCheckbox } from '@nextcloud/vue'
-import { FolderPlusIcon } from './Icons.js'
-import { FolderMoveIcon } from './Icons.js'
-import { ContentCopyIcon } from './Icons.js'
-import { PencilIcon } from './Icons.js'
-import { InformationVariantIcon } from './Icons.js'
-import { DeleteIcon } from './Icons.js'
+import { FolderPlusIcon, FolderMoveIcon, ContentCopyIcon, PencilIcon, InformationVariantIcon, DeleteIcon } from './Icons.js'
 import { getCurrentUser } from '@nextcloud/auth'
 import { generateUrl } from '@nextcloud/router'
 import { actions, mutations } from '../store/index.js'

src/components/BulkEditing.vue

@@ -64,13 +64,7 @@
 <script>
 
 import { NcActions, NcActionSeparator, NcActionButton, NcActionInput } from '@nextcloud/vue'
-import { FolderPlusIcon } from './Icons.js'
-import { FolderMoveIcon } from './Icons.js'
-import { OpenInNewIcon } from './Icons.js'
-import { TagIcon } from './Icons.js'
-import { SelectAllIcon } from './Icons.js'
-import { SelectOffIcon } from './Icons.js'
-import { DeleteIcon } from './Icons.js'
+import { FolderPlusIcon, FolderMoveIcon, OpenInNewIcon, TagIcon, SelectAllIcon, SelectOffIcon, DeleteIcon } from './Icons.js'
 import { actions, mutations } from '../store/index.js'
 import intersection from 'lodash/intersection.js'
 

src/components/Controls.vue

@@ -66,8 +66,8 @@
 			<NcActions>
 				<NcActionButton @click="onToggleViewMode">
 					<template #icon>
-						<ViewListIcon :size="20" v-if="viewMode !== 'list'" />
-						<ViewGridIcon :size="20" v-else />
+						<ViewListIcon v-if="viewMode !== 'list'" :size="20" />
+						<ViewGridIcon v-else :size="20" />
 					</template>
 					{{ viewMode === 'list' ? t('bookmarks', 'Change to grid view') : t('bookmarks', 'Change to list view') }}
 				</NcActionButton>
@@ -112,22 +112,7 @@
 </template>
 <script>
 import { NcSelect, NcActions, NcActionButton, NcActionInput, NcActionRouter, NcTextField } from '@nextcloud/vue'
-import { MagnifyIcon } from './Icons.js'
-import { EarthIcon } from './Icons.js'
-import { ViewGridIcon } from './Icons.js'
-import { ViewListIcon } from './Icons.js'
-import { PlusIcon } from './Icons.js'
-import { FolderIcon } from './Icons.js'
-import { ArrowLeftIcon } from './Icons.js'
-import { RssIcon } from './Icons.js'
-import { SortAlphabeticalAscendingIcon } from './Icons.js'
-import { SortBoolAscendingIcon } from './Icons.js'
-import { SortClockAscendingOutlineIcon } from './Icons.js'
-import { SortCalendarAscendingIcon } from './Icons.js'
-import { SortNumericAscendingIcon } from './Icons.js'
-import { SortAscendingIcon } from './Icons.js'
-import { ShareVariantIcon } from './Icons.js'
-import { TagIcon } from './Icons.js'
+import { MagnifyIcon, EarthIcon, ViewGridIcon, ViewListIcon, PlusIcon, FolderIcon, ArrowLeftIcon, RssIcon, SortAlphabeticalAscendingIcon, SortBoolAscendingIcon, SortClockAscendingOutlineIcon, SortCalendarAscendingIcon, SortNumericAscendingIcon, SortAscendingIcon, ShareVariantIcon, TagIcon } from './Icons.js'
 import { actions, mutations } from '../store/index.js'
 import { generateUrl } from '@nextcloud/router'
 import BulkEditing from './BulkEditing.vue'

src/components/DragImage.vue

@@ -6,14 +6,13 @@
 
 <template>
 	<div class="dragImage">
-		<FolderIcon :size="20" v-if="$store.state.selection.folders.length" :fill-color="colorPrimaryElement" />
-		<EarthIcon :size="20" v-else :fill-color="colorPrimaryElement" /><span class="description">{{ selectionDescription }}</span>
+		<FolderIcon v-if="$store.state.selection.folders.length" :size="20" :fill-color="colorPrimaryElement" />
+		<EarthIcon v-else :size="20" :fill-color="colorPrimaryElement" /><span class="description">{{ selectionDescription }}</span>
 	</div>
 </template>
 
 <script>
-import { FolderIcon } from './Icons.js'
-import { EarthIcon } from './Icons.js'
+import { FolderIcon, EarthIcon } from './Icons.js'
 export default {
 	name: 'DragImage',
 	components: { FolderIcon, EarthIcon },

src/components/FirstRun.vue

@@ -24,7 +24,7 @@
 				</NcButton>
 				<NcButton @click="onImportOpen">
 					<template #icon>
-						<UploadIcon :size="20" v-if="!importing" />
+						<UploadIcon v-if="!importing" :size="20" />
 						<NcLoadingIcon v-else />
 					</template>
 					{{ t('bookmarks', 'Import bookmarks') }}
@@ -44,10 +44,7 @@
 import { NcEmptyContent, NcButton, NcLoadingIcon } from '@nextcloud/vue'
 import { actions, mutations } from '../store/index.js'
 import { privateRoutes } from '../router.js'
-import { SyncIcon } from './Icons.js'
-import { PlusIcon } from './Icons.js'
-import { UploadIcon } from './Icons.js'
-import { StarShootingIcon } from './Icons.js'
+import { SyncIcon, PlusIcon, UploadIcon, StarShootingIcon } from './Icons.js'
 
 export default {
 	name: 'FirstRun',

src/components/Folder.vue

@@ -21,8 +21,12 @@
 		@rename-cancel="renaming = false"
 		@click="onSelect">
 		<template #icon>
-			<FolderIcon :size="20" :fill-color="colorPrimaryElement" :class="'folder__icon'" @click="onSelect" />
-			<ShareVariantIcon :size="20" v-if="(isShared || !isOwner) || isSharedPublicly"
+			<FolderIcon :size="20"
+				:fill-color="colorPrimaryElement"
+				:class="'folder__icon'"
+				@click="onSelect" />
+			<ShareVariantIcon v-if="(isShared || !isOwner) || isSharedPublicly"
+				:size="20"
 				:fill-color="colorPrimaryText"
 				:class="['folder__icon', 'shared']" />
 		</template>
@@ -80,12 +84,7 @@
 </template>
 <script>
 import { getCurrentUser } from '@nextcloud/auth'
-import { FolderMoveIcon } from './Icons.js'
-import { FolderIcon } from './Icons.js'
-import { ShareVariantIcon } from './Icons.js'
-import { DeleteIcon } from './Icons.js'
-import { PencilIcon } from './Icons.js'
-import { InformationVariantIcon } from './Icons.js'
+import { FolderMoveIcon, FolderIcon, ShareVariantIcon, DeleteIcon, PencilIcon, InformationVariantIcon } from './Icons.js'
 import { NcActionButton, NcActionCheckbox } from '@nextcloud/vue'
 import { actions, mutations } from '../store/index.js'
 import Item from './Item.vue'

src/components/FolderPicker.vue

@@ -38,9 +38,7 @@
 
 <script>
 import { NcActions, NcActionButton } from '@nextcloud/vue'
-import { FolderIcon } from './Icons.js'
-import { ArrowLeftIcon } from './Icons.js'
-import { HomeIcon } from './Icons.js'
+import { FolderIcon, ArrowLeftIcon, HomeIcon } from './Icons.js'
 import TreeFolder from './TreeFolder.vue'
 
 export default {

src/components/Item.vue

@@ -78,8 +78,7 @@ import { NcActions, NcActionButton } from '@nextcloud/vue'
 import TagLine from './TagLine.vue'
 import DragImage from './DragImage.vue'
 import { mutations } from '../store/index.js'
-import { CheckIcon } from './Icons.js'
-import { CloseIcon } from './Icons.js'
+import { CheckIcon, CloseIcon } from './Icons.js'
 
 export default {
 	name: 'Item',

src/components/Navigation.vue

@@ -11,7 +11,7 @@
 				:to="{ name: routes.HOME }"
 				:name="t('bookmarks', 'All bookmarks')"
 				:exact="true">
-				<HomeIcon :size="20" slot="icon" />
+				<HomeIcon slot="icon" :size="20" />
 				<NcCounterBubble slot="counter">
 					{{ allBookmarksCount | largeNumbers }}
 				</NcCounterBubble>
@@ -19,12 +19,12 @@
 			<NcAppNavigationItem key="menu-recent"
 				:to="{ name: routes.RECENT }"
 				:name="t('bookmarks', 'Recent')">
-				<HistoryIcon :size="20" slot="icon" />
+				<HistoryIcon slot="icon" :size="20" />
 			</NcAppNavigationItem>
 			<NcAppNavigationItem key="menu-shared-folders"
 				:to="{ name: routes.SHARED_FOLDERS }"
 				:name="t('bookmarks', 'Shared with you')">
-				<ShareVariantIcon :size="20" slot="icon" />
+				<ShareVariantIcon slot="icon" :size="20" />
 				<NcCounterBubble v-show="Boolean(sharedFoldersCount)" slot="counter">
 					{{ sharedFoldersCount | largeNumbers }}
 				</NcCounterBubble>
@@ -32,7 +32,7 @@
 			<NcAppNavigationItem key="menu-archived"
 				:to="{ name: routes.ARCHIVED }"
 				:name="t('bookmarks', 'Files')">
-				<FileDocumentMultipleIcon :size="20" slot="icon" />
+				<FileDocumentMultipleIcon slot="icon" :size="20" />
 				<NcCounterBubble v-show="Boolean(archivedBookmarksCount)" slot="counter">
 					{{ archivedBookmarksCount }}
 				</NcCounterBubble>
@@ -40,7 +40,7 @@
 			<NcAppNavigationItem key="menu-duplicated"
 				:to="{ name: routes.DUPLICATED }"
 				:name="t('bookmarks', 'Duplicates')">
-				<VectorLinkIcon :size="20" slot="icon" />
+				<VectorLinkIcon slot="icon" :size="20" />
 				<NcCounterBubble v-show="Boolean(duplicatedBookmarksCount)" slot="counter">
 					{{ duplicatedBookmarksCount | largeNumbers }}
 				</NcCounterBubble>
@@ -48,7 +48,7 @@
 			<NcAppNavigationItem key="menu-unavailable"
 				:to="{ name: routes.UNAVAILABLE }"
 				:name="t('bookmarks', 'Broken links')">
-				<LinkVariantOffIcon :size="20" slot="icon" />
+				<LinkVariantOffIcon slot="icon" :size="20" />
 				<NcCounterBubble v-show="Boolean(unavailableBookmarksCount)" slot="counter">
 					{{ unavailableBookmarksCount | largeNumbers }}
 				</NcCounterBubble>
@@ -57,13 +57,13 @@
 			<NcAppNavigationNewItem key="menu-new-tag"
 				:name="t('bookmarks', 'New tag')"
 				@new-item="onNewTag">
-				<TagPlusIcon :size="20" slot="icon" />
+				<TagPlusIcon slot="icon" :size="20" />
 			</NcAppNavigationNewItem>
 			<template v-if="Boolean(tags.length)">
 				<NcAppNavigationItem key="menu-tags"
 					:name="t('bookmarks', 'Search tags')"
 					@click="onSearchTags">
-					<TagMultipleIcon :size="20" slot="icon" />
+					<TagMultipleIcon slot="icon" :size="20" />
 				</NcAppNavigationItem>
 				<NcAppNavigationItem v-for="tag in tags"
 					:key="'tag-'+tag.name"
@@ -74,7 +74,7 @@
 					:editable="!isPublic"
 					:name="tag.name"
 					@update:name="onRenameTag(tag.name, $event)">
-					<TagIcon :size="20" slot="icon" />
+					<TagIcon slot="icon" :size="20" />
 					<NcCounterBubble slot="counter">
 						{{ tag.count | largeNumbers }}
 					</NcCounterBubble>
@@ -90,7 +90,7 @@
 				<NcAppNavigationItem key="menu-untagged"
 					:to="{ name: routes.UNTAGGED }"
 					:name="t('bookmarks', 'Untagged')">
-					<TagOffIcon :size="20" slot="icon" />
+					<TagOffIcon slot="icon" :size="20" />
 				</NcAppNavigationItem>
 			</template>
 			<template v-if="Number(bookmarksLimit) > 0">
@@ -104,27 +104,19 @@
 			</template>
 		</template>
 		<template #footer>
-			<NcAppNavigationItem :name="t('bookmarks', 'Settings')" @click="settingsOpen = !settingsOpen"><template #icon><CogIcon :size="20" /></template></NcAppNavigationItem>
-			<Settings :settingsOpen.sync="settingsOpen" />
+			<NcAppNavigationItem :name="t('bookmarks', 'Settings')" @click="settingsOpen = !settingsOpen">
+				<template #icon>
+					<CogIcon :size="20" />
+				</template>
+			</NcAppNavigationItem>
+			<Settings :settings-open.sync="settingsOpen" />
 		</template>
 	</NcAppNavigation>
 </template>
 
 <script>
-import { NcActionButton, NcAppNavigation, NcAppNavigationItem, NcAppNavigationNewItem, NcCounterBubble, NcAppNavigationSettings, NcAppNavigationSpacer } from '@nextcloud/vue'
-import { HomeIcon } from './Icons.js'
-import { HistoryIcon } from './Icons.js'
-import { TagOffIcon } from './Icons.js'
-import { LinkVariantOffIcon } from './Icons.js'
-import { ShareVariantIcon } from './Icons.js'
-import { FileDocumentMultipleIcon } from './Icons.js'
-import { TagPlusIcon } from './Icons.js'
-import { TagMultipleIcon } from './Icons.js'
-import { VectorLinkIcon } from './Icons.js'
-import { TagIcon } from './Icons.js'
-import { DeleteIcon } from './Icons.js'
-import { GaugeIcon } from './Icons.js'
-import { CogIcon } from './Icons.js'
+import { NcActionButton, NcAppNavigation, NcAppNavigationItem, NcAppNavigationNewItem, NcCounterBubble, NcAppNavigationSpacer } from '@nextcloud/vue'
+import { HomeIcon, HistoryIcon, TagOffIcon, LinkVariantOffIcon, ShareVariantIcon, FileDocumentMultipleIcon, TagPlusIcon, TagMultipleIcon, VectorLinkIcon, TagIcon, DeleteIcon, GaugeIcon, CogIcon } from './Icons.js'
 import ProgressBar from 'vue-simple-progress'
 import Settings from './Settings.vue'
 import { actions, mutations } from '../store/index.js'

src/components/NoBookmarks.vue

@@ -54,8 +54,8 @@
 				</NcButton>
 				<NcButton @click="onImportOpen">
 					<template #icon>
-						<UploadIcon :size="20" v-if="!importing" />
-						<NcLoadingIcon :size="20" v-else />
+						<UploadIcon v-if="!importing" :size="20" />
+						<NcLoadingIcon v-else :size="20" />
 					</template>
 					{{ t('bookmarks', 'Import bookmarks') }}
 				</NcButton>
@@ -68,13 +68,7 @@
 import { NcEmptyContent, NcButton, NcLoadingIcon } from '@nextcloud/vue'
 import { actions, mutations } from '../store/index.js'
 import { privateRoutes } from '../router.js'
-import { StarShootingIcon } from './Icons.js'
-import { UploadIcon } from './Icons.js'
-import { PlusIcon } from './Icons.js'
-import { ShareVariantIcon } from './Icons.js'
-import { VectorLinkIcon } from './Icons.js'
-import { LinkVariantOffIcon } from './Icons.js'
-import { FileDocumentMultipleIcon } from './Icons.js'
+import { StarShootingIcon, UploadIcon, PlusIcon, ShareVariantIcon, VectorLinkIcon, LinkVariantOffIcon, FileDocumentMultipleIcon } from './Icons.js'
 
 export default {
 	name: 'NoBookmarks',

src/components/Settings.vue

@@ -5,7 +5,11 @@
   -->
 
 <template>
-	<NcAppSettingsDialog :open.sync="settingsOpen" :show-navigation="true" :name="t('bookmarks', 'Bookmarks settings')" class="settings">
+	<NcAppSettingsDialog :open="settingsOpen"
+		@update:open="$trigger('update:settingsOpen', $event)"
+		:show-navigation="true"
+		:name="t('bookmarks', 'Bookmarks settings')"
+		class="settings">
 		<NcAppSettingsSection id="importexport" :name="t('bookmarks', 'Import/Export')">
 			<template #icon>
 				<ImportIcon :size="20" />
@@ -27,10 +31,14 @@
 				<ArchiveIcon :size="20" />
 			</template>
 			<p>{{ t('bookmarks', 'The bookmarks app can automatically archive the web content of links you have bookmarked') }}</p>
-			<NcCheckboxRadioSwitch :checked="archiveEnabled" @update:checked="onChangeArchiveEnabled">{{ t('bookmarks', 'Enable archiving') }}</NcCheckboxRadioSwitch>
-			<NcTextField v-if="archiveEnabled" :label="t('bookmarks', 'Enter the path of a folder in your Files where bookmarked files should be stored.')" :value="archivePath"
-									 :readonly="true"
-									 @click="onChangeArchivePath" />
+			<NcCheckboxRadioSwitch :checked="archiveEnabled" @update:checked="onChangeArchiveEnabled">
+				{{ t('bookmarks', 'Enable archiving') }}
+			</NcCheckboxRadioSwitch>
+			<NcTextField v-if="archiveEnabled"
+				:label="t('bookmarks', 'Enter the path of a folder in your Files where bookmarked files should be stored.')"
+				:value="archivePath"
+				:readonly="true"
+				@click="onChangeArchivePath" />
 		</NcAppSettingsSection>
 
 		<NcAppSettingsSection id="backup" :name="t('bookmarks', 'Auto-Backup')">
@@ -38,8 +46,12 @@
 				<BackupIcon :size="20" />
 			</template>
 			<p>{{ t('bookmarks', 'The bookmarks app can automatically backup your bookmarks on a daily basis to prevent data loss when syncing bookmarks across devices.') }}</p>
-			<NcCheckboxRadioSwitch :checked="backupEnabled" @update:checked="onChangeBackupEnabled">{{ t('bookmarks', 'Enable backups') }}</NcCheckboxRadioSwitch>
-			<NcTextField v-if="backupEnabled" :label="t('bookmarks', 'Enter the path of a folder in your Files where backups will be stored.')" :value="backupPath"
+			<NcCheckboxRadioSwitch :checked="backupEnabled" @update:checked="onChangeBackupEnabled">
+				{{ t('bookmarks', 'Enable backups') }}
+			</NcCheckboxRadioSwitch>
+			<NcTextField v-if="backupEnabled"
+				:label="t('bookmarks', 'Enter the path of a folder in your Files where backups will be stored.')"
+				:value="backupPath"
 				:readonly="true"
 				@click="onChangeBackupPath" />
 		</NcAppSettingsSection>
@@ -94,12 +106,7 @@ import { getRequestToken } from '@nextcloud/auth'
 import { getFilePickerBuilder } from '@nextcloud/dialogs'
 import { privateRoutes } from '../router.js'
 import { NcAppSettingsSection, NcAppSettingsDialog, NcCheckboxRadioSwitch, NcTextField } from '@nextcloud/vue'
-import { ImportIcon } from './Icons.js'
-import { ArchiveIcon } from './Icons.js'
-import { BackupIcon } from './Icons.js'
-import { LinkIcon } from './Icons.js'
-import { ApplicationIcon } from './Icons.js'
-import { ApplicationImportIcon } from './Icons.js'
+import { ImportIcon, ArchiveIcon, BackupIcon, LinkIcon, ApplicationIcon, ApplicationImportIcon } from './Icons.js'
 
 export default {
 	name: 'Settings',
@@ -236,9 +243,9 @@ export default {
 </script>
 <style>
 	.import {
-	opacity: 0;
-	position: absolute;
-	top: 0;
-	left: -1000px;
+		opacity: 0;
+		position: absolute;
+		top: 0;
+		left: -1000px;
 	}
 </style>

src/components/SidebarBookmark.vue

@@ -95,7 +95,8 @@
 						@tag="onAddTag" />
 				</div>
 				<div class="details__line">
-					<PencilBoxIcon :size="20" role="figure"
+					<PencilBoxIcon :size="20"
+						role="figure"
 						:aria-label="t('bookmarks', 'Notes')"
 						:title="t('bookmarks', 'Notes')" />
 					<NcRichContenteditable :value.sync="bookmark.description"
@@ -107,7 +108,8 @@
 						@update:value="onNotesChange" />
 				</div>
 				<div v-if="archivedFile" class="details__line">
-					<FileDocumentIcon :size="20" role="figure"
+					<FileDocumentIcon :size="20"
+						role="figure"
 						:aria-label="t('bookmarks', 'Archived file')"
 						:title="t('bookmarks', 'Archived file')" />
 					<NcButton :href="archivedFileUrl" target="_blank" type="primary">
@@ -125,16 +127,7 @@
 </template>
 <script>
 import { NcAppSidebar, NcRichContenteditable, NcActionButton, NcActions, NcSelect, NcAppSidebarTab, NcButton } from '@nextcloud/vue'
-import { FileDocumentIcon } from './Icons.js'
-import { FolderIcon } from './Icons.js'
-import { InformationVariantIcon } from './Icons.js'
-import { PencilIcon } from './Icons.js'
-import { ArrowRightIcon } from './Icons.js'
-import { TagIcon } from './Icons.js'
-import { OpenInNewIcon } from './Icons.js'
-import { CloseIcon } from './Icons.js'
-import { PencilBoxIcon } from './Icons.js'
-import { DownloadIcon } from './Icons.js'
+import { FileDocumentIcon, FolderIcon, InformationVariantIcon, PencilIcon, ArrowRightIcon, TagIcon, OpenInNewIcon, CloseIcon, PencilBoxIcon, DownloadIcon } from './Icons.js'
 
 import { getCurrentUser } from '@nextcloud/auth'
 import { generateRemoteUrl, generateUrl } from '@nextcloud/router'
@@ -152,7 +145,7 @@ export default {
 			editingTitle: false,
 			target: '',
 			editingTarget: false,
-			activeTab: ''
+			activeTab: '',
 		}
 	},
 	computed: {

src/components/SidebarFolder.vue

@@ -131,17 +131,7 @@ import { getCurrentUser } from '@nextcloud/auth'
 import { generateUrl, generateOcsUrl } from '@nextcloud/router'
 import axios from '@nextcloud/axios'
 import { actions, mutations } from '../store/index.js'
-import { EyeIcon } from './Icons.js'
-import { PencilIcon } from './Icons.js'
-import { ShareAllIcon } from './Icons.js'
-import { ShareVariantIcon } from './Icons.js'
-import { InformationVariantIcon } from './Icons.js'
-import { ClipboardIcon } from './Icons.js'
-import { DeleteIcon } from './Icons.js'
-import { RssIcon } from './Icons.js'
-import { PlusIcon } from './Icons.js'
-import { LinkIcon } from './Icons.js'
-import { AccountIcon } from './Icons.js'
+import { EyeIcon, PencilIcon, ShareAllIcon, ShareVariantIcon, InformationVariantIcon, ClipboardIcon, DeleteIcon, RssIcon, PlusIcon, LinkIcon, AccountIcon } from './Icons.js'
 
 export default {
 	name: 'SidebarFolder',

src/components/TreeFolder.vue

@@ -8,11 +8,13 @@
 	<div :class="{treefolder:true, active}">
 		<div class="treefolder__title" @click="$emit('select', folder.id)">
 			<h3>
-				<FolderIcon :size="20" v-if="!childrenShown"
+				<FolderIcon v-if="!childrenShown"
+					:size="20"
 					class="treefolder__icon-hover"
 					:fill-color="colorPrimaryElement"
 					@click.stop="folder.children.length && showChildren && (childrenShown = true)" />
-				<FolderOpenIcon :size="20" v-else
+				<FolderOpenIcon v-else
+					:size="20"
 					class="treefolder__icon-hover"
 					:fill-color="colorPrimaryElement"
 					@click.stop="folder.children.length && (childrenShown = false)" />
@@ -29,8 +31,7 @@
 </template>
 
 <script>
-import { FolderIcon } from './Icons.js'
-import { FolderOpenIcon } from './Icons.js'
+import { FolderIcon, FolderOpenIcon } from './Icons.js'
 import { privateRoutes } from '../router.js'
 export default {
 	name: 'TreeFolder',

src/references.js

@@ -7,7 +7,7 @@
 // with nc/vue 7.8.0, if we remove this, nothing works...
 import {} from '@nextcloud/vue-richtext'
 
-import { registerWidget, registerCustomPickerElement, NcCustomPickerRenderResult } from '@nextcloud/vue/dist/Components/NcRichText.js'
+import { registerWidget, registerCustomPickerElement, NcCustomPickerRenderResult } from '@nextcloud/vue/dist/Components/NcRichText.mjs'
 import Vue from 'vue'
 import BookmarkReferenceWidget from './components/BookmarkReferenceWidget.vue'