@nextcloud/vue 9.8.0 → 9.8.1

package/dist/index.mjs

@@ -1,85 +1,85 @@
-import { N } from "./chunks/NcActionButton-BJKJG2zO.mjs";
-import { N as N2 } from "./chunks/NcActionButtonGroup-CgYSlRXJ.mjs";
+import { N } from "./chunks/NcActionButton-BO5T5ePT.mjs";
+import { N as N2 } from "./chunks/NcActionButtonGroup-B9LfyE-G.mjs";
 import { N as N3 } from "./chunks/NcActionCaption-f7L9gBlT.mjs";
-import { N as N4 } from "./chunks/NcActionCheckbox-D2Fu35M_.mjs";
-import { N as N5 } from "./chunks/NcActionInput-gv6uLn_N.mjs";
+import { N as N4 } from "./chunks/NcActionCheckbox-DBqiK-AZ.mjs";
+import { N as N5 } from "./chunks/NcActionInput-BO0lB4VP.mjs";
 import { N as N6 } from "./chunks/NcActionLink-BFiaYt9A.mjs";
-import { N as N7 } from "./chunks/NcActionRadio-BJ4i9n8a.mjs";
+import { N as N7 } from "./chunks/NcActionRadio-BA08CAtA.mjs";
 import { N as N8 } from "./chunks/NcActionRouter-vYFtIOzD.mjs";
-import { N as N9 } from "./chunks/NcActions-fCXSb_0o.mjs";
+import { N as N9 } from "./chunks/NcActions-CUmcZ3C3.mjs";
 import { N as N10 } from "./chunks/NcActionSeparator-B9pNQaji.mjs";
 import { N as N11 } from "./chunks/NcActionText-CQ9qwJ0p.mjs";
-import { N as N12 } from "./chunks/NcActionTextEditable-Bd6fU8b3.mjs";
-import { N as N13 } from "./chunks/NcAppContent-taTvqnvd.mjs";
+import { N as N12 } from "./chunks/NcActionTextEditable-B8y_GEre.mjs";
+import { N as N13 } from "./chunks/NcAppContent--92JdjRr.mjs";
 import { _ } from "./chunks/NcAppContentDetails.vue_vue_type_script_setup_true_lang-BWl5Pw5g.mjs";
 import { N as N14 } from "./chunks/NcAppContentList-Copx3Ver.mjs";
-import { N as N15 } from "./chunks/NcAppNavigation-Bb54U_qJ.mjs";
-import { N as N16 } from "./chunks/NcAppNavigationCaption-CwaRTmmd.mjs";
+import { N as N15 } from "./chunks/NcAppNavigation-Bb9-C2eO.mjs";
+import { N as N16 } from "./chunks/NcAppNavigationCaption-E9iJtiQt.mjs";
 import { N as N17 } from "./chunks/NcAppNavigationIconBullet-BmU-dPcY.mjs";
-import { N as N18 } from "./chunks/NcAppNavigationItem-Dg2d2AwS.mjs";
+import { N as N18 } from "./chunks/NcAppNavigationItem-BFAIHyTL.mjs";
 import { N as N19 } from "./chunks/NcAppNavigationList-CGSWabRB.mjs";
-import { N as N20 } from "./chunks/NcAppNavigationNew-Ch_kPggd.mjs";
-import { N as N21 } from "./chunks/NcAppNavigationNewItem-DYM8hEa7.mjs";
-import { N as N22 } from "./chunks/NcAppNavigationSearch-BWHsAoc1.mjs";
-import { N as N23 } from "./chunks/NcAppNavigationSettings-CJ2z5cYU.mjs";
+import { N as N20 } from "./chunks/NcAppNavigationNew-Dspn3-4i.mjs";
+import { N as N21 } from "./chunks/NcAppNavigationNewItem-Cg8IJ6ZV.mjs";
+import { N as N22 } from "./chunks/NcAppNavigationSearch-CiOKjV3M.mjs";
+import { N as N23 } from "./chunks/NcAppNavigationSettings-fbuQmy-q.mjs";
 import { N as N24 } from "./chunks/NcAppNavigationSpacer-CIRC4ZEj.mjs";
-import { N as N25 } from "./chunks/NcAppSettingsDialog-37Ko8yBC.mjs";
-import { N as N26 } from "./chunks/NcAppSettingsSection-MusCsTGg.mjs";
-import { N as N27, N as N28 } from "./chunks/NcAppSettingsShortcutsSection-C0io5RJP.mjs";
-import { N as N29 } from "./chunks/NcAppSidebar-CV2t1fDr.mjs";
-import { _ as _2 } from "./chunks/NcAppSidebarHeader.vue_vue_type_script_setup_true_lang-Bk4yFBHY.mjs";
+import { N as N25 } from "./chunks/NcAppSettingsDialog-DByPnndK.mjs";
+import { N as N26 } from "./chunks/NcAppSettingsSection-BosSmisT.mjs";
+import { N as N27, N as N28 } from "./chunks/NcAppSettingsShortcutsSection-DgqVuZGx.mjs";
+import { N as N29 } from "./chunks/NcAppSidebar-Ch7Vp7q5.mjs";
+import { _ as _2 } from "./chunks/NcAppSidebarHeader.vue_vue_type_script_setup_true_lang-C-QhdyiN.mjs";
 import { N as N30 } from "./chunks/NcAppSidebarTab-DOSDDbGA.mjs";
-import { N as N31 } from "./chunks/NcAssistantButton-u8m6vfFY.mjs";
-import { N as N32 } from "./chunks/NcAssistantContent-DWv2sak_.mjs";
-import { N as N33 } from "./chunks/NcAssistantIcon-Cf0B3EsL.mjs";
-import { N as N34 } from "./chunks/NcAvatar-QYahYt2p.mjs";
-import { N as N35 } from "./chunks/NcBlurHash-B3MufoB_.mjs";
-import { N as N36 } from "./chunks/NcBreadcrumb-CYI3eykz.mjs";
-import { N as N37 } from "./chunks/NcBreadcrumbs-DLKGhmX6.mjs";
-import { N as N38 } from "./chunks/NcButton-CdQzGSB6.mjs";
-import { N as N39 } from "./chunks/NcCheckboxRadioSwitch-B0KUiKrb.mjs";
-import { N as N40 } from "./chunks/NcChip-CjYZUIUu.mjs";
-import { N as N41 } from "./chunks/NcCollectionList-CU1Tigay.mjs";
-import { N as N42 } from "./chunks/NcColorPicker-DUIppkpO.mjs";
-import { N as N43 } from "./chunks/NcContent-Dd15hgck.mjs";
-import { N as N44 } from "./chunks/NcCounterBubble-VUNXKsnk.mjs";
-import { N as N45 } from "./chunks/NcDashboardWidget-CPI2VARK.mjs";
-import { N as N46 } from "./chunks/NcDashboardWidgetItem-DJ820dYQ.mjs";
-import { _ as _3 } from "./chunks/NcDateTime.vue_vue_type_script_setup_true_lang-B4upiZjL.mjs";
-import { N as N47 } from "./chunks/NcDateTimePicker-8vIvIKoD.mjs";
-import { N as N48 } from "./chunks/NcDateTimePickerNative-XO_O44n2.mjs";
-import { N as N49 } from "./chunks/NcDialog-D-qxVQxL.mjs";
-import { _ as _4 } from "./chunks/NcDialogButton.vue_vue_type_script_setup_true_lang-WZfDqDwc.mjs";
+import { N as N31 } from "./chunks/NcAssistantButton-CTrCv4CO.mjs";
+import { N as N32 } from "./chunks/NcAssistantContent-CeuwcdMY.mjs";
+import { N as N33 } from "./chunks/NcAssistantIcon-Dpp9_LUg.mjs";
+import { N as N34 } from "./chunks/NcAvatar-M3-CbKbq.mjs";
+import { N as N35 } from "./chunks/NcBlurHash-yPfSKY7W.mjs";
+import { N as N36 } from "./chunks/NcBreadcrumb-BeDMWE_b.mjs";
+import { N as N37 } from "./chunks/NcBreadcrumbs-CuQDDvin.mjs";
+import { N as N38 } from "./chunks/NcButton-QbPBynlU.mjs";
+import { N as N39 } from "./chunks/NcCheckboxRadioSwitch-D8Dfv4iw.mjs";
+import { N as N40 } from "./chunks/NcChip-nVHnbjaY.mjs";
+import { N as N41 } from "./chunks/NcCollectionList-CO-iHqi6.mjs";
+import { N as N42 } from "./chunks/NcColorPicker-D6NbBOX3.mjs";
+import { N as N43 } from "./chunks/NcContent-BhMoPROW.mjs";
+import { N as N44 } from "./chunks/NcCounterBubble-CV0YMrXW.mjs";
+import { N as N45 } from "./chunks/NcDashboardWidget-ftOfMTzx.mjs";
+import { N as N46 } from "./chunks/NcDashboardWidgetItem-BwwFiNOL.mjs";
+import { _ as _3 } from "./chunks/NcDateTime.vue_vue_type_script_setup_true_lang-BJuPH7S7.mjs";
+import { N as N47 } from "./chunks/NcDateTimePicker-CK4rhfEB.mjs";
+import { N as N48 } from "./chunks/NcDateTimePickerNative-BeM4WOA4.mjs";
+import { N as N49 } from "./chunks/NcDialog-kwzJ3A4X.mjs";
+import { _ as _4 } from "./chunks/NcDialogButton.vue_vue_type_script_setup_true_lang-Cn-8O9iZ.mjs";
 import { N as N50 } from "./chunks/NcEllipsisedOption-D6Amb91K.mjs";
-import { N as N51 } from "./chunks/NcEmojiPicker-DG3qO_fi.mjs";
-import { N as N52 } from "./chunks/NcEmptyContent--TRhmNAW.mjs";
-import { N as N53 } from "./chunks/NcFilePicker-DPiYJu5B.mjs";
-import { N as N54 } from "./chunks/NcFormBox-wP5mpW88.mjs";
-import { N as N55 } from "./chunks/NcFormBoxButton-DhEpFn7z.mjs";
-import { _ as _5 } from "./chunks/NcFormBoxCopyButton.vue_vue_type_script_setup_true_lang-DLh3Ylq_.mjs";
-import { N as N56 } from "./chunks/NcFormBoxSwitch-QMisnf8C.mjs";
-import { N as N57 } from "./chunks/NcFormGroup-BDjfDvq0.mjs";
+import { N as N51 } from "./chunks/NcEmojiPicker-Bpw-68QP.mjs";
+import { N as N52 } from "./chunks/NcEmptyContent-CGAPqk4S.mjs";
+import { N as N53 } from "./chunks/NcFilePicker-nPCwHMqj.mjs";
+import { N as N54 } from "./chunks/NcFormBox-ClWfuBWz.mjs";
+import { N as N55 } from "./chunks/NcFormBoxButton-i4i3Lt_Q.mjs";
+import { _ as _5 } from "./chunks/NcFormBoxCopyButton.vue_vue_type_script_setup_true_lang-NfKiRrIn.mjs";
+import { N as N56 } from "./chunks/NcFormBoxSwitch-DlNcJ1q7.mjs";
+import { N as N57 } from "./chunks/NcFormGroup-DvLGFMdb.mjs";
 import { N as N58 } from "./chunks/NcGuestContent-_z22nZMF.mjs";
-import { N as N59 } from "./chunks/NcHeaderButton-lhDrtYWN.mjs";
-import { N as N60 } from "./chunks/NcHeaderMenu-B5-BQbQ6.mjs";
+import { N as N59 } from "./chunks/NcHeaderButton-m4oAOSTa.mjs";
+import { N as N60 } from "./chunks/NcHeaderMenu-DRxcyWNX.mjs";
 import { _ as _6 } from "./chunks/NcHighlight.vue_vue_type_script_lang-DnWQDM_2.mjs";
-import { N as N61 } from "./chunks/NcHotkey-B0qDRy1t.mjs";
-import { N as N62 } from "./chunks/NcHotkeyList-Ca7AtgZ9.mjs";
-import { N as N63 } from "./chunks/NcIconSvgWrapper-De-2-ukl.mjs";
-import { N as N64 } from "./chunks/NcInputField-C3iof9pY.mjs";
-import { N as N65 } from "./chunks/NcKbd-Caeq706M.mjs";
-import { N as N66 } from "./chunks/NcListItem-Chk9TtPa.mjs";
-import { N as N67 } from "./chunks/NcListItemIcon-vZ-OTxIa.mjs";
-import { N as N68 } from "./chunks/NcLoadingIcon-CInLzPtA.mjs";
-import { N as N69 } from "./chunks/NcModal-DyOZxq9E.mjs";
-import { N as N70 } from "./chunks/NcNoteCard-BJF9bD7S.mjs";
-import { N as N71 } from "./chunks/NcPasswordField-ykWHv_hw.mjs";
+import { N as N61 } from "./chunks/NcHotkey-C-TYyC8X.mjs";
+import { N as N62 } from "./chunks/NcHotkeyList-CmMgGhMr.mjs";
+import { N as N63 } from "./chunks/NcIconSvgWrapper-g8ubWhoz.mjs";
+import { N as N64 } from "./chunks/NcInputField-B1bGxYHt.mjs";
+import { N as N65 } from "./chunks/NcKbd-Iyp0KDp4.mjs";
+import { N as N66 } from "./chunks/NcListItem-Y5a098Cw.mjs";
+import { N as N67 } from "./chunks/NcListItemIcon-D_f5AGrh.mjs";
+import { N as N68 } from "./chunks/NcLoadingIcon-BOVpFVQz.mjs";
+import { N as N69 } from "./chunks/NcModal-DUWLRm_F.mjs";
+import { N as N70 } from "./chunks/NcNoteCard-mI7qVZ9j.mjs";
+import { N as N71 } from "./chunks/NcPasswordField-Be5_qcfm.mjs";
 import { N as N72 } from "./chunks/NcPopover-CtdLAkEU.mjs";
-import { N as N73 } from "./chunks/NcProgressBar-JyXXoHLT.mjs";
-import { N as N74 } from "./chunks/NcRadioGroup-EGc_x6uH.mjs";
-import { N as N75 } from "./chunks/NcRadioGroupButton-Dd5hMWx5.mjs";
-import { N as N76 } from "./chunks/NcRelatedResourcesPanel-C7C0-pBV.mjs";
-import { N as N77, a, b } from "./chunks/NcRichContenteditable-DLPNb2TV.mjs";
+import { N as N73 } from "./chunks/NcProgressBar-C-ane-Ni.mjs";
+import { N as N74 } from "./chunks/NcRadioGroup-BzW4XHoK.mjs";
+import { N as N75 } from "./chunks/NcRadioGroupButton-CXKQMID9.mjs";
+import { N as N76 } from "./chunks/NcRelatedResourcesPanel-C0j0Fs4r.mjs";
+import { N as N77, a, b } from "./chunks/NcRichContenteditable-DO3_WniI.mjs";
 import "@nextcloud/auth";
 import "@nextcloud/axios";
 import "@nextcloud/router";
@@ -87,26 +87,26 @@ import "@nextcloud/sharing/public";
 import "vue";
 import "@vueuse/core";
 import "vue-router";
-import { a as a2, g, b as b2, c, s, d } from "./chunks/referencePickerModal-DgIpbEdl.mjs";
+import { a as a2, g, b as b2, c, s, d } from "./chunks/referencePickerModal-B4bsiMOy.mjs";
 import { N as N78, h, i, b as b3, r, c as c2, e, f } from "./chunks/customPickerElements-Cu7bLbap.mjs";
 import "unist-builder";
 import "unist-util-visit-parents";
 import "./chunks/logger-D3RVzcfQ.mjs";
-import { N as N79 } from "./chunks/NcRichText-rS9gcduo.mjs";
-import { N as N80 } from "./chunks/NcSelect-DK4ZWMha.mjs";
+import { N as N79 } from "./chunks/NcRichText-BOBQq7Od.mjs";
+import { N as N80 } from "./chunks/NcSelect-BOFzoCwK.mjs";
 import "debounce";
-import { _ as _7 } from "./chunks/NcTextField.vue_vue_type_script_setup_true_lang-DgvCZDmR.mjs";
+import { _ as _7 } from "./chunks/NcTextField.vue_vue_type_script_setup_true_lang-BQHjkK8r.mjs";
 import "@nextcloud/event-bus";
-import { _ as _8 } from "./chunks/NcSavingIndicatorIcon.vue_vue_type_script_setup_true_lang-CA0r_04W.mjs";
-import { N as N81 } from "./chunks/NcSelectTags-D3tAMWYx.mjs";
-import { N as N82 } from "./chunks/NcSelectUsers-2L4I2yvb.mjs";
-import { N as N83 } from "./chunks/NcSettingsSection-DnzR8DRc.mjs";
-import { N as N84 } from "./chunks/NcSettingsSelectGroup-CYgEv80h.mjs";
-import { N as N85 } from "./chunks/NcTextArea-BwFQx9Bj.mjs";
+import { _ as _8 } from "./chunks/NcSavingIndicatorIcon.vue_vue_type_script_setup_true_lang-DbQnMYZm.mjs";
+import { N as N81 } from "./chunks/NcSelectTags-D7qWNjXa.mjs";
+import { N as N82 } from "./chunks/NcSelectUsers-CI8twLn9.mjs";
+import { N as N83 } from "./chunks/NcSettingsSection-DmfxX2se.mjs";
+import { N as N84 } from "./chunks/NcSettingsSelectGroup-TN64yH4k.mjs";
+import { N as N85 } from "./chunks/NcTextArea-Dxzj4zdb.mjs";
 import { _ as _9 } from "./chunks/NcThemeProvider.vue_vue_type_script_setup_true_lang-wie70gn4.mjs";
-import { _ as _10 } from "./chunks/NcTimezonePicker.vue_vue_type_script_setup_true_lang-53QSdjMX.mjs";
-import { N as N86 } from "./chunks/NcUserBubble-BnaGHDoD.mjs";
-import { N as N87 } from "./chunks/NcUserStatusIcon-CNh1vXUF.mjs";
+import { _ as _10 } from "./chunks/NcTimezonePicker.vue_vue_type_script_setup_true_lang-Csd1JQe6.mjs";
+import { N as N86 } from "./chunks/NcUserBubble-CDQa0hGy.mjs";
+import { N as N87 } from "./chunks/NcUserStatusIcon-DsviB2Cr.mjs";
 import { _ as _11 } from "./chunks/NcVNodes.vue_vue_type_script_lang-BqUHinRZ.mjs";
 import { useFormatRelativeTime, useFormatTime } from "./composables/useFormatDateTime/index.mjs";
 import { useHotKey } from "./composables/useHotKey/index.mjs";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextcloud/vue",
-  "version": "9.8.0",
+  "version": "9.8.1",
   "description": "Nextcloud vue components",
   "keywords": [
     "vuejs",
@@ -94,12 +94,12 @@
     "blurhash": "^2.0.5",
     "clone": "^2.1.2",
     "debounce": "^3.0.0",
-    "dompurify": "^3.4.2",
+    "dompurify": "^3.4.3",
     "emoji-mart-vue-fast": "^15.0.5",
     "escape-html": "^1.0.3",
     "floating-vue": "^5.2.2",
-    "focus-trap": "^8.1.0",
-    "linkifyjs": "^4.3.2",
+    "focus-trap": "^8.2.0",
+    "linkifyjs": "^4.3.3",
     "mdast-util-to-string": "^4.0.0",
     "p-queue": "^9.2.0",
     "rehype-external-links": "^3.0.0",
@@ -118,7 +118,7 @@
     "unist-builder": "^4.0.0",
     "unist-util-visit-parents": "^6.0.2",
     "vue": "^3.5.18",
-    "vue-router": "^5.0.6"
+    "vue-router": "^5.0.7"
   },
   "devDependencies": {
     "@babel/plugin-syntax-import-assertions": "^7.28.6",
@@ -134,10 +134,10 @@
     "@nextcloud/vite-config": "^2.5.0",
     "@nextcloud/webpack-vue-config": "github:nextcloud/webpack-vue-config#vue3",
     "@playwright/experimental-ct-vue": "^1.58.2",
-    "@playwright/test": "^1.59.1",
+    "@playwright/test": "^1.60.0",
     "@types/gettext-parser": "^9.0.0",
-    "@types/node": "^24.12.3",
-    "@vitest/coverage-v8": "^4.1.5",
+    "@types/node": "^24.12.4",
+    "@vitest/coverage-v8": "^4.1.6",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.9.1",
     "babel-loader-exclude-node-modules-except": "^1.2.4",
@@ -151,7 +151,7 @@
     "remark-gfm": "^4.0.1",
     "resolve-url-loader": "^5.0.0",
     "sass": "^1.99.0",
-    "stylelint": "^17.11.0",
+    "stylelint": "^17.11.1",
     "ts-node": "^10.9.2",
     "typescript": "^5.9.3",
     "url-loader": "^4.1.1",
@@ -159,7 +159,7 @@
     "vitest": "^4.0.14",
     "vue-material-design-icons": "^5.3.1",
     "vue-styleguidist": "^4.72.4",
-    "vue-tsc": "^3.2.8",
+    "vue-tsc": "^3.2.9",
     "webpack": "^5.106.2",
     "webpack-merge": "^6.0.1"
   },

package/dist/chunks/NcAppSettingsDialog-37Ko8yBC.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppSettingsDialog-37Ko8yBC.mjs","sources":["../../src/components/NcAppSettingsDialog/NcAppSettingsDialogVersion.vue","../../src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<script setup lang=\"ts\">\nimport { inject } from 'vue'\nimport { APP_VERSION, useLocalizedAppName } from '../../utils/appName.ts'\nimport { APP_SETTINGS_LEGACY_DESIGN_KEY } from './useAppSettingsDialog.ts'\n\nconst legacy = inject(APP_SETTINGS_LEGACY_DESIGN_KEY)!\n\nconst localizedAppName = useLocalizedAppName()\n</script>\n\n<template>\n\t<div :class=\"[$style.appSettingsDialogVersion, { [$style.appSettingsDialogVersion__legacy]: legacy }]\">\n\t\t{{ localizedAppName }} {{ APP_VERSION }}\n\t</div>\n</template>\n\n<style lang=\"scss\" module>\n.appSettingsDialogVersion {\n    --form-element-label-offset: calc(var(--border-radius-element) + var(--default-grid-baseline));\n    color: var(--color-text-maxcontrast);\n    margin-block-end: calc(8 * var(--default-grid-baseline));\n    margin-inline: var(--form-element-label-offset);\n}\n\n.appSettingsDialogVersion__legacy {\n    margin-inline: 0;\n}\n</style>\n","<!--\n  - SPDX-FileCopyrightText: 2020 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<script setup lang=\"ts\">\nimport type { Slot, VNode } from 'vue'\n\nimport debounce from 'debounce'\nimport { computed, onBeforeUnmount, provide, ref, toRef, useTemplateRef, warn } from 'vue'\nimport NcDialog from '../NcDialog/NcDialog.vue'\nimport NcVNodes from '../NcVNodes/NcVNodes.vue'\nimport NcAppSettingsDialogVersion from './NcAppSettingsDialogVersion.vue'\nimport { useIsMobile } from '../../composables/useIsMobile/index.ts'\nimport { t } from '../../l10n.ts'\nimport { isLegacy34 } from '../../utils/legacy.ts'\nimport { APP_SETTINGS_LEGACY_DESIGN_KEY, APP_SETTINGS_REGISTRATION_KEY } from './useAppSettingsDialog.ts'\n\nexport interface IAppSettingsSection {\n\tid: string\n\tname: string\n\torder?: number\n\ticon?: VNode[]\n}\n\n/**\n * Determines the open / closed state of the modal\n */\nconst open = defineModel<boolean>('open', { required: true })\n\nconst props = withDefaults(defineProps<{\n\t/**\n\t * Shows the navigation on desktop if true\n\t */\n\tshowNavigation?: boolean\n\n\t/**\n\t * Selector for the popover container\n\t */\n\tcontainer?: string\n\n\t/**\n\t * Name of the settings\n\t */\n\tname?: string\n\n\t/**\n\t * Additional elements to add to the focus trap\n\t */\n\tadditionalTrapElements?: (string | HTMLElement)[]\n\n\t/**\n\t * Use legacy design without any requirements for the section content\n\t *\n\t * @deprecated The legacy design will be removed\n\t */\n\tlegacy?: boolean\n\n\t/**\n\t * Do not add the application version at the bottom of the dialog\n\t */\n\tnoVersion?: boolean\n}>(), {\n\tcontainer: 'body',\n\tname: '',\n\tadditionalTrapElements: () => [],\n\tlegacy: false,\n\tnoVersion: false,\n})\n\ndefineSlots<{\n\t/**\n\t * The NcAppSettingsSections\n\t */\n\tdefault?: Slot\n}>()\n\nprovide(APP_SETTINGS_REGISTRATION_KEY, {\n\tregisterSection,\n\tunregisterSection,\n})\n\nprovide(APP_SETTINGS_LEGACY_DESIGN_KEY, toRef(() => props.legacy))\n\nconst settingsScrollerElement = useTemplateRef('settingsScroller')\n\nconst isMobile = useIsMobile()\n\nconst selectedSection = ref('')\nconst linkClicked = ref(false)\nconst registeredSections = ref<IAppSettingsSection[]>([])\n\nconst hasNavigation = computed(() => !isMobile.value && props.showNavigation)\n\n/**\n * Check if one or more navigation entries provide icons\n */\nconst hasNavigationIcons = computed(() => registeredSections.value.some(({ icon }) => !!icon))\n\n/**\n * Remove selected section once the user starts scrolling\n */\nconst unfocusNavigationItem = debounce(() => {\n\tselectedSection.value = ''\n\tif (document.activeElement?.className.includes('navigation-list__link')) {\n\t\t(document.activeElement as HTMLElement).blur()\n\t}\n}, 300)\n\n/**\n * Fallback order map to keep track of section orders if not provided by child components\n */\nconst sectionsOrderMap = new Map()\nonBeforeUnmount(() => {\n\tsectionsOrderMap.clear()\n})\n\n/**\n * Scrolls the content to the selected settings section.absolute\n *\n * @param item - the ID of the section\n */\nfunction handleSettingsNavigationClick(item: string) {\n\tlinkClicked.value = true\n\tdocument.getElementById('settings-section_' + item)!.scrollIntoView({\n\t\tbehavior: 'smooth',\n\t\tinline: 'nearest',\n\t})\n\tselectedSection.value = item\n\tsetTimeout(() => {\n\t\tlinkClicked.value = false\n\t}, 1000)\n}\n\n/**\n * Reset the dialog state when closed to have a clean state if re-opened.\n *\n * @param isOpen - The new modal open state\n */\nfunction handleCloseModal(isOpen: boolean) {\n\tif (isOpen) {\n\t\treturn\n\t}\n\n\topen.value = false\n\t// reset the scrolling state if the modal is just hidden\n\tsettingsScrollerElement.value!.scrollTop = 0\n}\n\n/**\n * When scrolled manually we remove the focus from the navigation item.\n */\nfunction handleScroll() {\n\tif (open.value && !linkClicked.value) {\n\t\tunfocusNavigationItem()\n\t}\n}\n\n/**\n * Called when a new section is registered\n *\n * @param id - The section ID\n * @param name - The section name\n * @param order - Optional section order in navigation list\n * @param icon - Optional icon component\n */\nfunction registerSection(id: string, name: string, order?: number, icon?: VNode[]) {\n\t// Check for the uniqueness of section names\n\tif (registeredSections.value.some(({ id: otherId }) => id === otherId)) {\n\t\tthrow new Error(`Duplicate section id found: ${id}. Settings navigation sections must have unique section ids.`)\n\t}\n\tif (registeredSections.value.some(({ name: otherName }) => name === otherName)) {\n\t\twarn(`Duplicate section name found: ${name}. Settings navigation sections must have unique section names.`)\n\t}\n\n\t// Ensure tab order is set\n\tif (order !== undefined) {\n\t\tsectionsOrderMap.set(id, order)\n\t} else if (sectionsOrderMap.has(id)) {\n\t\torder = sectionsOrderMap.get(id)\n\t} else {\n\t\t// Fallback to the closest positive number that isn't already taken\n\t\torder = Math.max(0, ...sectionsOrderMap.values()) + 1\n\t\tsectionsOrderMap.set(id, order)\n\t}\n\n\t// Sort sections by order in slots\n\tregisteredSections.value = [...registeredSections.value, { id, name, order, icon }]\n\t\t.sort(({ order: orderA }, { order: orderB }) => {\n\t\t\treturn orderA! - orderB!\n\t\t})\n\n\t// If this is the first section registered, set it as selected\n\tif (registeredSections.value.length === 1) {\n\t\tselectedSection.value = id\n\t}\n}\n\n/**\n * Called when a section is unregistered to remove it from dialog\n *\n * @param id - The section ID\n */\nfunction unregisterSection(id: string) {\n\tregisteredSections.value = registeredSections.value\n\t\t.filter(({ id: otherId }) => id !== otherId)\n\n\t// If the current section is unregistered, set the first section as selected\n\tif (selectedSection.value === id) {\n\t\tselectedSection.value = registeredSections.value[0]?.id ?? ''\n\t}\n}\n</script>\n\n<template>\n\t<NcDialog\n\t\tv-if=\"open\"\n\t\tclass=\"app-settings\"\n\t\t:class=\"{ 'app-settings--legacy': isLegacy34 }\"\n\t\tcontentClasses=\"app-settings__content\"\n\t\tnavigationClasses=\"app-settings__navigation\"\n\t\t:additionalTrapElements\n\t\t:container\n\t\tcloseOnClickOutside\n\t\t:navigation-aria-label=\"t('Settings navigation')\"\n\t\tsize=\"large\"\n\t\t:name\n\t\t@update:open=\"handleCloseModal\">\n\t\t<template v-if=\"hasNavigation\" #navigation=\"{ isCollapsed }\">\n\t\t\t<div v-if=\"!isLegacy34\" class=\"app-settings__title\">\n\t\t\t\t{{ name }}\n\t\t\t</div>\n\t\t\t<ul\n\t\t\t\tv-if=\"!isCollapsed\"\n\t\t\t\tclass=\"navigation-list\">\n\t\t\t\t<li v-for=\"section in registeredSections\" :key=\"section.id\">\n\t\t\t\t\t<a\n\t\t\t\t\t\t:aria-current=\"`${section.id === selectedSection}`\"\n\t\t\t\t\t\tclass=\"navigation-list__link\"\n\t\t\t\t\t\t:class=\"{\n\t\t\t\t\t\t\t'navigation-list__link--active': section.id === selectedSection,\n\t\t\t\t\t\t\t'navigation-list__link--icon': hasNavigationIcons,\n\t\t\t\t\t\t}\"\n\t\t\t\t\t\t:href=\"`#settings-section_${section.id}`\"\n\t\t\t\t\t\ttabindex=\"0\"\n\t\t\t\t\t\t@click.prevent=\"handleSettingsNavigationClick(section.id)\"\n\t\t\t\t\t\t@keydown.enter=\"handleSettingsNavigationClick(section.id)\">\n\t\t\t\t\t\t<div v-if=\"hasNavigationIcons\" class=\"navigation-list__link-icon\">\n\t\t\t\t\t\t\t<NcVNodes v-if=\"section.icon\" :vnodes=\"section.icon\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<span class=\"navigation-list__link-text\">\n\t\t\t\t\t\t\t{{ section.name }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</a>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</template>\n\t\t<div ref=\"settingsScroller\" @scroll=\"handleScroll\">\n\t\t\t<slot />\n\t\t\t<NcAppSettingsDialogVersion v-if=\"!noVersion\" />\n\t\t</div>\n\t</NcDialog>\n</template>\n\n<style lang=\"scss\" scoped>\n$navigation-width: 200px;\n$content-inset: calc(3 * var(--default-grid-baseline));\n\n.app-settings:not(.app-settings--legacy) {\n\t--nav-tint: hsl(from var(--color-primary-element-light) h s calc(l * 1.045));\n\t--nav-tint-strong: var(--color-primary-element-light);\n\n\t:deep(.modal-wrapper .modal-container) {\n\t\tpadding-inline-start: 0 !important;\n\t\tpadding-block-start: 0 !important;\n\t\tbackground-color: var(--nav-tint);\n\t\toverflow: hidden;\n\t\tmax-width: 900px;\n\t}\n\n\t// Title is rendered inside the navigation slot; hide the native h2 but\n\t// keep it in the a11y tree so the modal still has its accessible name.\n\t:deep(.dialog__name) {\n\t\tposition: absolute;\n\t\twidth: 1px;\n\t\theight: 1px;\n\t\tmargin: -1px;\n\t\tpadding: 0;\n\t\toverflow: hidden;\n\t\tclip-path: inset(100%);\n\t\twhite-space: nowrap;\n\t\tborder: 0;\n\t}\n\n\t:deep(.app-settings__navigation) {\n\t\tmin-width: $navigation-width;\n\t\tmax-width: $navigation-width;\n\t\tflex: 0 0 $navigation-width;\n\t\t// Beat NcDialog's default 20px end-margin so the tint meets the content.\n\t\tmargin-inline-end: 0 !important;\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\tposition: relative;\n\t}\n\n\t:deep(.app-settings__content) {\n\t\tpadding: $content-inset;\n\t\tbackground-color: var(--color-main-background);\n\t\tborder-inline-start: 1px solid var(--color-border-dark);\n\t\tborder-start-start-radius: var(--border-radius-element);\n\t\tborder-end-start-radius: var(--border-radius-element);\n\t}\n\n\t.app-settings__title {\n\t\tbox-sizing: border-box;\n\t\tpadding: $content-inset;\n\t\tmargin: 0;\n\t\tfont-size: 20px;\n\t\tfont-weight: 700;\n\t}\n\n\t.navigation-list {\n\t\theight: 100%;\n\t\toverflow-y: auto;\n\t\tpadding: var(--default-grid-baseline);\n\n\t\t&__link {\n\t\t\tposition: relative;\n\t\t\tdisplay: flex;\n\t\t\talign-items: center;\n\t\t\tfont-size: var(--default-font-size);\n\t\t\tfont-weight: 500;\n\t\t\theight: var(--default-clickable-area);\n\t\t\tmargin: 2px 0;\n\t\t\tline-height: var(--default-clickable-area);\n\t\t\tborder-radius: var(--border-radius-element);\n\t\t\tpadding-inline: calc(2 * var(--default-grid-baseline));\n\t\t\tcursor: pointer;\n\t\t\twhite-space: nowrap;\n\t\t\ttext-overflow: ellipsis;\n\t\t\toverflow: hidden;\n\t\t\tbackground-color: transparent;\n\t\t\tborder: none;\n\t\t\tcolor: var(--color-main-text);\n\n\t\t\t&:hover,\n\t\t\t&:focus-visible {\n\t\t\t\tbackground-color: color-mix(in srgb, var(--color-primary-element) 8%, transparent);\n\t\t\t}\n\n\t\t\t&:focus-visible {\n\t\t\t\toutline: 2px solid var(--color-main-text);\n\t\t\t\toutline-offset: -2px;\n\t\t\t}\n\n\t\t\t&--active {\n\t\t\t\tbackground-color: var(--nav-tint-strong);\n\n\t\t\t\t&:hover,\n\t\t\t\t&:focus-visible {\n\t\t\t\t\tbackground-color: var(--color-primary-element-light-hover);\n\t\t\t\t}\n\n\t\t\t\t&::before {\n\t\t\t\t\tcontent: '';\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tinset-block: var(--default-grid-baseline);\n\t\t\t\t\tinset-inline-start: 0;\n\t\t\t\t\twidth: 3px;\n\t\t\t\t\tbackground-color: var(--color-primary-element);\n\t\t\t\t\tborder-radius: 999px;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&--icon {\n\t\t\t\tgap: var(--default-grid-baseline);\n\t\t\t}\n\n\t\t\t&-icon {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: center;\n\t\t\t\talign-content: center;\n\t\t\t\twidth: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t\t\tmax-width: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t\t}\n\t\t}\n\t}\n\n}\n\n@media only screen and (max-width: $breakpoint-mobile) {\n\t.app-settings:not(.app-settings--legacy) {\n\t\t:deep(.modal-wrapper .modal-container) {\n\t\t\tpadding-inline-start: 12px !important;\n\t\t\tpadding-block-start: 4px !important;\n\t\t\tbackground-color: var(--color-main-background);\n\t\t}\n\t\t:deep(.dialog__name) {\n\t\t\tposition: static;\n\t\t\twidth: auto;\n\t\t\theight: auto;\n\t\t\tmargin: 0 0 12px 0;\n\t\t\tpadding-inline-end: var(--default-clickable-area);\n\t\t\toverflow: visible;\n\t\t\tclip-path: none;\n\t\t\twhite-space: normal;\n\t\t\tborder: 0;\n\t\t}\n\t\t:deep(.app-settings__content) {\n\t\t\tborder: none;\n\t\t\tborder-radius: 0;\n\t\t}\n\t}\n}\n\n// Legacy design (NC < 34): keep the original centered-title layout.\n.app-settings.app-settings--legacy {\n\t:deep(.app-settings__navigation) {\n\t\tmin-width: 200px;\n\t\tmargin-inline-end: calc(4 * var(--default-grid-baseline));\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\tposition: relative;\n\t}\n\n\t:deep(.app-settings__content) {\n\t\tpadding-inline: calc(4 * var(--default-grid-baseline));\n\t}\n\n\t.navigation-list {\n\t\theight: 100%;\n\t\toverflow-y: auto;\n\t\tpadding: calc(3 * var(--default-grid-baseline));\n\n\t\t&__link {\n\t\t\tdisplay: flex;\n\t\t\talign-content: center;\n\t\t\tfont-size: 16px;\n\t\t\theight: var(--default-clickable-area);\n\t\t\tmargin: 4px 0;\n\t\t\tline-height: var(--default-clickable-area);\n\t\t\tborder-radius: var(--border-radius-element);\n\t\t\tfont-weight: var(--font-weight-element, bold);\n\t\t\tpadding: 0 calc(4 * var(--default-grid-baseline));\n\t\t\tcursor: pointer;\n\t\t\twhite-space: nowrap;\n\t\t\ttext-overflow: ellipsis;\n\t\t\toverflow: hidden;\n\t\t\tbackground-color: transparent;\n\t\t\tborder: none;\n\n\t\t\t&:hover,\n\t\t\t&:focus {\n\t\t\t\tbackground-color: var(--color-background-hover);\n\t\t\t}\n\n\t\t\t&--active {\n\t\t\t\tbackground-color: var(--color-primary-element-light) !important;\n\t\t\t}\n\n\t\t\t&--icon {\n\t\t\t\tpadding-inline-start: calc(2 * var(--default-grid-baseline));\n\t\t\t\tgap: var(--default-grid-baseline);\n\t\t\t}\n\n\t\t\t&-icon {\n\t\t\t\tdisplay: flex;\n\t\t\t\tjustify-content: center;\n\t\t\t\talign-content: center;\n\t\t\t\twidth: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t\t\tmax-width: calc(var(--default-clickable-area) - 2 * var(--default-grid-baseline));\n\t\t\t}\n\t\t}\n\t}\n\n\t@media only screen and (max-width: $breakpoint-small-mobile) {\n\t\t:deep(.dialog__name) {\n\t\t\tpadding-inline-start: 16px;\n\t\t}\n\t}\n}\n</style>\n\n<docs>\nJust nest the `AppSettingSections` component into `NcAppSettingsDialog`,\nproviding the section's name prop. You can put your settings within each\n`NcAppSettingsSection` component.\n\n```vue\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Show Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\" legacy>\n\t\t\t<NcAppSettingsSection id=\"asci-name-1\" name=\"Example name 1\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-2\" name=\"Example name 2\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-3\" name=\"Example name 3\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-4\" name=\"Example name 4\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-5\" name=\"Example name 5\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-6\" name=\"Example name 6\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-7\" name=\"Example name 7\">\n\t\t\t\tSome example content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-8\" name=\"Example name 8\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-9\" name=\"Example name 9\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-10\" name=\"Example name 10\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n\n<script>\nexport default {\n\tdata() {\n\t\treturn {\n\t\t\tsettingsOpen: false,\n\t\t}\n\t},\n}\n</script>\n```\n\nYou can also add icons to the section navigation:\n\n```vue\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Show Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\" legacy>\n\t\t\t<NcAppSettingsSection id=\"asci-name-1\" name=\"Instagram\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Instagram :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tInstagram setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-2\" name=\"Mastodon\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Mastodon :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tMastodon setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-3\" name=\"Twitch\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Twitch :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<p style=\"height: 100vh;\">\n\t\t\t\t\tTwitch setting\n\t\t\t\t</p>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-4\" name=\"Twitter\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<Twitter :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tTwitter setting\n\t\t\t</NcAppSettingsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n\n<script>\nimport Instagram from 'vue-material-design-icons/Instagram.vue'\nimport Mastodon from 'vue-material-design-icons/Mastodon.vue'\nimport Twitch from 'vue-material-design-icons/Twitch.vue'\nimport Twitter from 'vue-material-design-icons/Twitter.vue'\n\nexport default {\n\tcomponents: {\n\t\tInstagram,\n\t\tMastodon,\n\t\tTwitch,\n\t\tTwitter,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tsettingsOpen: false,\n\t\t}\n\t},\n}\n</script>\n```\n\nSections order in navigation list is defined during initial rendering.\nIn case of dynamic/conditional sections rendering explicit `order` prop must be used for ordering.\n\n```vue\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Show Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\" legacy>\n\t\t\t<NcAppSettingsSection id=\"asci-name-1\" name=\"Example name 1\" :order=\"1\">\n\t\t\t\tSome example content\n\t\t\t\t<NcCheckboxRadioSwitch v-model=\"showExtraSections\">Show section 3</NcCheckboxRadioSwitch>\n\t\t\t</NcAppSettingsSection>\n\t\t\t<NcAppSettingsSection id=\"asci-name-2\" name=\"Example name 2\" :order=\"2\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t\t<template v-if=\"showExtraSections\">\n\t\t\t\t<NcAppSettingsSection id=\"asci-name-3\" name=\"Example name 3\" :order=\"3\">\n\t\t\t\t\tSome example content\n\t\t\t\t</NcAppSettingsSection>\n\t\t\t</template>\n\t\t\t<NcAppSettingsSection id=\"asci-name-4\" name=\"Example name 4\" :order=\"4\">\n\t\t\t\tSome more content\n\t\t\t</NcAppSettingsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n\n<script>\n\texport default {\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\tsettingsOpen: false,\n\t\t\t\tshowExtraSections: true,\n\t\t\t}\n\t\t},\n\t}\n</script>\n```\n\n### New design\n\n```vue\n<script>\nimport { mdiArrowRight, mdiPlus, mdiDomain, mdiDockLeft, mdiDockBottom, mdiListBoxOutline, mdiPencilOutline, mdiTrashCanOutline, mdiMedalOutline, mdiEmailOutline } from '@mdi/js'\nexport default {\n\tsetup() {\n\t\treturn { mdiArrowRight, mdiPlus, mdiDomain, mdiDockLeft, mdiDockBottom, mdiListBoxOutline, mdiPencilOutline, mdiTrashCanOutline, mdiMedalOutline, mdiEmailOutline }\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tsettingsOpen: false,\n\t\t\tswitchValue: true,\n\t\t\tlayout: 'vertical',\n\t\t\tsorting: 'asc',\n\t\t\treply: 'top',\n\t\t}\n\t},\n}\n</script>\n\n<template>\n\t<div>\n\t\t<NcButton @click=\"settingsOpen = true\">Mail Settings</NcButton>\n\t\t<NcAppSettingsDialog v-model:open=\"settingsOpen\" :show-navigation=\"true\" name=\"Application settings\">\n\t\t\t<NcAppSettingsSection id=\"general\" name=\"General\">\n\t\t\t\t<NcButton wide>Set as default mail app</NcButton>\n\n\t\t\t\t<NcFormGroup label=\"Account settings\">\n\t\t\t\t\t<NcFormBox>\n\t\t\t\t\t\t<NcFormBoxButton label=\"user@example.com\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiArrowRight\" inline />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcFormBoxButton>\n\t\t\t\t\t\t<NcFormBoxButton label=\"sales@example.com\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiArrowRight\" inline />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcFormBoxButton>\n\t\t\t\t\t\t<NcButton wide>\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiPlus\" />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\tAdd mail account\n\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t</NcFormBox>\n\t\t\t\t</NcFormGroup>\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsSection id=\"appearance\" name=\"Appearance\">\n\t\t\t\t<NcFormBox>\n\t\t\t\t\t<NcFormBoxSwitch\n\t\t\t\t\t\tv-model=\"switchValue\"\n\t\t\t\t\t\tlabel=\"Show all messages in thread\"\n\t\t\t\t\t\tdescription=\"When off, only the selected messages will be shown\" />\n\t\t\t\t</NcFormBox>\n\t\t\t\t<NcRadioGroup v-model=\"layout\" label=\"Layout\">\n\t\t\t\t\t<NcRadioGroupButton label=\"Vertical\" value=\"vertical\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDockLeft\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcRadioGroupButton>\n\t\t\t\t\t<NcRadioGroupButton label=\"Horizontal\" value=\"horizontal\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDockBottom\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcRadioGroupButton>\n\t\t\t\t\t<NcRadioGroupButton label=\"List\" value=\"list\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiListBoxOutline\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcRadioGroupButton>\n\t\t\t\t</NcRadioGroup>\n\t\t\t\t<NcRadioGroup v-model=\"sorting\" label=\"Sorting\">\n\t\t\t\t\t<NcRadioGroupButton label=\"Newest first\" value=\"asc\" />\n\t\t\t\t\t<NcRadioGroupButton label=\"Oldest first\" value=\"desc\" />\n\t\t\t\t</NcRadioGroup>\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsSection id=\"messages\" name=\"Messages\">\n\t\t\t\t<NcFormBox>\n\t\t\t\t\t<NcFormBoxSwitch v-model=\"switchValue\" label=\"Avatars from Gravatar and favicons\" />\n\t\t\t\t\t<NcFormBoxSwitch v-model=\"switchValue\" label=\"Determine importance using machine learning\" />\n\t\t\t\t\t<NcFormBoxSwitch v-model=\"switchValue\" label=\"Search the body of messages in Priority inbox\" />\n\t\t\t\t</NcFormBox>\n\t\t\t\t<NcRadioGroup v-model=\"reply\" label=\"Reply position\">\n\t\t\t\t\t<NcRadioGroupButton label=\"Top\" value=\"top\" />\n\t\t\t\t\t<NcRadioGroupButton label=\"Bottom\" value=\"bottom\" />\n\t\t\t\t</NcRadioGroup>\n\t\t\t\t<NcFormGroup\n\t\t\t\t\tlabel=\"Text blocks\"\n\t\t\t\t\tdescription=\"Reusable pieces of text that can be inserted in messages\">\n\t\t\t\t\t<NcListItem name=\"Title\">\n\t\t\t\t\t\t<template #subname>\n\t\t\t\t\t\t\tContent\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiPencilOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t\t<NcListItem name=\"Reply\">\n\t\t\t\t\t\t<template #subname>\n\t\t\t\t\t\t\tThank you for contacting us!\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiPencilOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t</NcFormGroup>\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsSection id=\"privacy\" name=\"Privacy\">\n\t\t\t\t<NcFormBox>\n\t\t\t\t\t<NcFormBoxSwitch\n\t\t\t\t\t\tv-model=\"switchValue\"\n\t\t\t\t\t\tlabel=\"Data collection\"\n\t\t\t\t\t\tdescription=\"Allow the app to collect and process data locally to adapt to your preferences\" />\n\t\t\t\t</NcFormBox>\n\t\t\t\t<NcFormGroup label=\"Always show images from\">\n\t\t\t\t\t<NcListItem name=\"example.com\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDomain\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t\t<NcListItem name=\"example.net\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDomain\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t\t<NcListItem name=\"mail@example.org\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiEmailOutline\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t</NcFormGroup>\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsSection id=\"security\" name=\"Security\">\n\t\t\t\t<NcFormBox>\n\t\t\t\t\t<NcFormBoxSwitch v-model=\"switchValue\" label=\"Highlight external addresses\" />\n\t\t\t\t</NcFormBox>\n\t\t\t\t<NcFormGroup label=\"Internal addresses\">\n\t\t\t\t\t<NcListItem name=\"example.com\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDomain\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t\t<NcListItem name=\"example.company@example.net\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiEmailOutline\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\t<template #extra-actions>\n\t\t\t\t\t\t\t<NcButton variant=\"tertiary\" #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiTrashCanOutline\" inline />\n\t\t\t\t\t\t\t</NcButton>\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcListItem>\n\t\t\t\t\t<NcButton wide>Add internal address</NcButton>\n\t\t\t\t</NcFormGroup>\n\t\t\t\t<NcFormGroup label=\"S/MIME\">\n\t\t\t\t\t<NcButton wide>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiMedalOutline\" inline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tManage certificates\n\t\t\t\t\t</NcButton>\n\t\t\t\t</NcFormGroup>\n\t\t\t\t<NcFormGroup label=\"Mailvelope\">\n\t\t\t\t\t<NcFormBox>\n\t\t\t\t\t\t<NcFormBoxButton\n\t\t\t\t\t\t\tlabel=\"Step 1\"\n\t\t\t\t\t\t\tdescription=\"Install the browser extension\"\n\t\t\t\t\t\t\thref=\"https://www.mailvelope.com/\"\n\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\tinverted-accent />\n\t\t\t\t\t\t<NcFormBoxButton\n\t\t\t\t\t\t\tlabel=\"Step 2\"\n\t\t\t\t\t\t\tdescription=\"Enable the current domain\"\n\t\t\t\t\t\t\tinverted-accent>\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<NcIconSvgWrapper :path=\"mdiDomain\" inline />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t</NcFormBoxButton>\n\t\t\t\t\t</NcFormBox>\n\t\t\t\t</NcFormGroup>\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsSection id=\"about\" name=\"About\">\n\t\t\t\t<NcFormGroup label=\"Acknowledgements\" description=\"This application includes CKEditor, an open-source editor. Copyright (C) CKEditor contributors. Licensed under GPLv2.\" />\n\t\t\t</NcAppSettingsSection>\n\n\t\t\t<NcAppSettingsShortcutsSection>\n\t\t\t\t<NcHotkeyList>\n\t\t\t\t\t<NcHotkey label=\"Compose new message\" hotkey=\"C\" />\n\t\t\t\t\t<NcHotkey label=\"Newer message\" hotkey=\"ArrowLeft\" />\n\t\t\t\t\t<NcHotkey label=\"Older message\" hotkey=\"ArrowRight\" />\n\t\t\t\t\t<NcHotkey label=\"Toggle star\" hotkey=\"S\" />\n\t\t\t\t\t<NcHotkey label=\"Toggle unread\" hotkey=\"U\" />\n\t\t\t\t\t<NcHotkey label=\"Archive\" hotkey=\"A\" />\n\t\t\t\t\t<NcHotkey label=\"Delete\" hotkey=\"Delete\" />\n\t\t\t\t\t<NcHotkey label=\"Search\" hotkey=\"Control F\" />\n\t\t\t\t\t<NcHotkey label=\"Send\" hotkey=\"Control Enter\" />\n\t\t\t\t\t<NcHotkey label=\"Refresh\" hotkey=\"R\" />\n\t\t\t\t</NcHotkeyList>\n\t\t\t</NcAppSettingsShortcutsSection>\n\t\t</NcAppSettingsDialog>\n\t</div>\n</template>\n```\n</docs>\n"],"names":["_createElementBlock","_normalizeClass","$style","_unref","_toDisplayString","_useModel","_createBlock","additionalTrapElements","container","name","_createElementVNode","_renderSlot","noVersion","_withCtx","_openBlock","_Fragment","_renderList","_withModifiers","_withKeys","NcVNodes"],"mappings":";;;;;;;;;;;;;AAUA,UAAM,SAAS,OAAO,8BAA8B;AAEpD,UAAM,mBAAmB,oBAAA;;0BAIxBA,mBAEM,OAAA;AAAA,QAFA,OAAKC,eAAA,CAAGC,YAAO,6BAA6BA,KAAAA,OAAO,gCAAgC,GAAGC,MAAA,MAAA,EAAA,CAAM,CAAA;AAAA,MAAA,mBAC9FA,MAAA,gBAAA,CAAgB,IAAG,MAACC,gBAAGD,MAAA,WAAA,CAAW,GAAA,CAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACWvC,UAAM,OAAOE,SAAoB,SAAC,MAA0B;AAE5D,UAAM,QAAQ;AA+Cd,YAAQ,+BAA+B;AAAA,MACtC;AAAA,MACA;AAAA,IAAA,CACA;AAED,YAAQ,gCAAgC,MAAM,MAAM,MAAM,MAAM,CAAC;AAEjE,UAAM,0BAA0B,eAAe,kBAAkB;AAEjE,UAAM,WAAW,YAAA;AAEjB,UAAM,kBAAkB,IAAI,EAAE;AAC9B,UAAM,cAAc,IAAI,KAAK;AAC7B,UAAM,qBAAqB,IAA2B,EAAE;AAExD,UAAM,gBAAgB,SAAS,MAAM,CAAC,SAAS,SAAS,MAAM,cAAc;AAK5E,UAAM,qBAAqB,SAAS,MAAM,mBAAmB,MAAM,KAAK,CAAC,EAAE,KAAA,MAAW,CAAC,CAAC,IAAI,CAAC;AAK7F,UAAM,wBAAwB,SAAS,MAAM;AAC5C,sBAAgB,QAAQ;AACxB,UAAI,SAAS,eAAe,UAAU,SAAS,uBAAuB,GAAG;AACvE,iBAAS,cAA8B,KAAA;AAAA,MACzC;AAAA,IACD,GAAG,GAAG;AAKN,UAAM,uCAAuB,IAAA;AAC7B,oBAAgB,MAAM;AACrB,uBAAiB,MAAA;AAAA,IAClB,CAAC;AAOD,aAAS,8BAA8B,MAAc;AACpD,kBAAY,QAAQ;AACpB,eAAS,eAAe,sBAAsB,IAAI,EAAG,eAAe;AAAA,QACnE,UAAU;AAAA,QACV,QAAQ;AAAA,MAAA,CACR;AACD,sBAAgB,QAAQ;AACxB,iBAAW,MAAM;AAChB,oBAAY,QAAQ;AAAA,MACrB,GAAG,GAAI;AAAA,IACR;AAOA,aAAS,iBAAiB,QAAiB;AAC1C,UAAI,QAAQ;AACX;AAAA,MACD;AAEA,WAAK,QAAQ;AAEb,8BAAwB,MAAO,YAAY;AAAA,IAC5C;AAKA,aAAS,eAAe;AACvB,UAAI,KAAK,SAAS,CAAC,YAAY,OAAO;AACrC,8BAAA;AAAA,MACD;AAAA,IACD;AAUA,aAAS,gBAAgB,IAAY,MAAc,OAAgB,MAAgB;AAElF,UAAI,mBAAmB,MAAM,KAAK,CAAC,EAAE,IAAI,QAAA,MAAc,OAAO,OAAO,GAAG;AACvE,cAAM,IAAI,MAAM,+BAA+B,EAAE,8DAA8D;AAAA,MAChH;AACA,UAAI,mBAAmB,MAAM,KAAK,CAAC,EAAE,MAAM,UAAA,MAAgB,SAAS,SAAS,GAAG;AAC/E,aAAK,iCAAiC,IAAI,gEAAgE;AAAA,MAC3G;AAGA,UAAI,UAAU,QAAW;AACxB,yBAAiB,IAAI,IAAI,KAAK;AAAA,MAC/B,WAAW,iBAAiB,IAAI,EAAE,GAAG;AACpC,gBAAQ,iBAAiB,IAAI,EAAE;AAAA,MAChC,OAAO;AAEN,gBAAQ,KAAK,IAAI,GAAG,GAAG,iBAAiB,OAAA,CAAQ,IAAI;AACpD,yBAAiB,IAAI,IAAI,KAAK;AAAA,MAC/B;AAGA,yBAAmB,QAAQ,CAAC,GAAG,mBAAmB,OAAO,EAAE,IAAI,MAAM,OAAO,KAAA,CAAM,EAChF,KAAK,CAAC,EAAE,OAAO,UAAU,EAAE,OAAO,aAAa;AAC/C,eAAO,SAAU;AAAA,MAClB,CAAC;AAGF,UAAI,mBAAmB,MAAM,WAAW,GAAG;AAC1C,wBAAgB,QAAQ;AAAA,MACzB;AAAA,IACD;AAOA,aAAS,kBAAkB,IAAY;AACtC,yBAAmB,QAAQ,mBAAmB,MAC5C,OAAO,CAAC,EAAE,IAAI,QAAA,MAAc,OAAO,OAAO;AAG5C,UAAI,gBAAgB,UAAU,IAAI;AACjC,wBAAgB,QAAQ,mBAAmB,MAAM,CAAC,GAAG,MAAM;AAAA,MAC5D;AAAA,IACD;;aAKQ,KAAA,sBADPC,YA8CW,UAAA;AAAA;QA5CV,OAAKL,eAAA,CAAC,gBAAc,EAAA,wBACcE,MAAA,UAAA,EAAA,CAAU,CAAA;AAAA,QAC5C,gBAAe;AAAA,QACf,mBAAkB;AAAA,QACjB,wBAAAI,KAAAA;AAAAA,QACA,WAAAC,KAAAA;AAAAA,QACD,qBAAA;AAAA,QACC,yBAAuBL,MAAA,CAAA,EAAC,qBAAA;AAAA,QACzB,MAAK;AAAA,QACJ,MAAAM,KAAAA;AAAAA,QACA,iBAAa;AAAA,MAAA;yBA8Bd,MAGM;AAAA,UAHNC,mBAGM,OAAA;AAAA,YAHD,KAAI;AAAA,YAAoB,UAAQ;AAAA,UAAA;YACpCC,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,QAAA,IAAA;AAAA,aAC2BC,KAAAA,0BAAnCN,YAAgD,4BAAA,EAAA,KAAA,EAAA,CAAA;;;;;QA/BjC,cAAA;gBAAgB;AAAA,UAC/B,IAAAO,QAAA,CAEM,EAHuC,kBAAW;AAAA,aAC5CV,MAAA,UAAA,kBAAZH,mBAEM,OAFN,YAEMI,gBADFK,KAAAA,IAAI,GAAA,CAAA;aAGA,eADRK,UAAA,GAAAd,mBAuBK,MAvBL,YAuBK;AAAA,gCApBJA,mBAmBKe,UAAA,MAAAC,WAnBiB,mBAAA,OAAkB,CAA7B,YAAO;oCAAlBhB,mBAmBK,MAAA;AAAA,kBAnBsC,KAAK,QAAQ;AAAA,gBAAA;kBACvDU,mBAiBI,KAAA;AAAA,oBAhBF,gBAAY,GAAK,QAAQ,OAAO,gBAAA,KAAe;AAAA,oBAChD,uBAAM,yBAAuB;AAAA,uDACqB,QAAQ,OAAO,gBAAA;AAAA,qDAAuD,mBAAA;AAAA,oBAAA;oBAIvH,MAAI,qBAAuB,QAAQ,EAAE;AAAA,oBACtC,UAAS;AAAA,oBACR,SAAKO,cAAA,CAAA,WAAU,8BAA8B,QAAQ,EAAE,GAAA,CAAA,SAAA,CAAA;AAAA,oBACvD,WAAOC,SAAA,CAAA,WAAQ,8BAA8B,QAAQ,EAAE,GAAA,CAAA,OAAA,CAAA;AAAA,kBAAA;oBAC7C,mBAAA,SAAXJ,UAAA,GAAAd,mBAEM,OAFN,YAEM;AAAA,sBADW,QAAQ,qBAAxBM,YAAuDa,aAAA;AAAA;wBAAxB,QAAQ,QAAQ;AAAA,sBAAA;;oBAEhDT,mBAEO,QAFP,YAEON,gBADH,QAAQ,IAAI,GAAA,CAAA;AAAA,kBAAA;;;;;;;;;;;;"}

package/dist/chunks/_l10n-BCg4udFv.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"_l10n-BCg4udFv.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}