@nextcloud/vue 9.8.1 → 9.9.0

package/dist/index.mjs

@@ -1,85 +1,85 @@
 import { N } from "./chunks/NcActionButton-BO5T5ePT.mjs";
-import { N as N2 } from "./chunks/NcActionButtonGroup-B9LfyE-G.mjs";
+import { N as N2 } from "./chunks/NcActionButtonGroup-Dd03Oluy.mjs";
 import { N as N3 } from "./chunks/NcActionCaption-f7L9gBlT.mjs";
 import { N as N4 } from "./chunks/NcActionCheckbox-DBqiK-AZ.mjs";
-import { N as N5 } from "./chunks/NcActionInput-BO0lB4VP.mjs";
+import { N as N5 } from "./chunks/NcActionInput-Dr8Yrafu.mjs";
 import { N as N6 } from "./chunks/NcActionLink-BFiaYt9A.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-CUmcZ3C3.mjs";
+import { N as N9 } from "./chunks/NcActions-C-wDqSrv.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-B8y_GEre.mjs";
-import { N as N13 } from "./chunks/NcAppContent--92JdjRr.mjs";
+import { N as N13 } from "./chunks/NcAppContent-DavgjaFX.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-Bb9-C2eO.mjs";
-import { N as N16 } from "./chunks/NcAppNavigationCaption-E9iJtiQt.mjs";
+import { N as N15 } from "./chunks/NcAppNavigation-g57j16pB.mjs";
+import { N as N16 } from "./chunks/NcAppNavigationCaption-VjSWJ8R4.mjs";
 import { N as N17 } from "./chunks/NcAppNavigationIconBullet-BmU-dPcY.mjs";
-import { N as N18 } from "./chunks/NcAppNavigationItem-BFAIHyTL.mjs";
+import { N as N18 } from "./chunks/NcAppNavigationItem-CDeYtA3E.mjs";
 import { N as N19 } from "./chunks/NcAppNavigationList-CGSWabRB.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 N20 } from "./chunks/NcAppNavigationNew-CBNppM7Q.mjs";
+import { N as N21 } from "./chunks/NcAppNavigationNewItem-B1RfQkvu.mjs";
+import { N as N22 } from "./chunks/NcAppNavigationSearch-CQQWb1Eq.mjs";
+import { N as N23 } from "./chunks/NcAppNavigationSettings-DoMjRExO.mjs";
 import { N as N24 } from "./chunks/NcAppNavigationSpacer-CIRC4ZEj.mjs";
-import { N as N25 } from "./chunks/NcAppSettingsDialog-DByPnndK.mjs";
+import { N as N25 } from "./chunks/NcAppSettingsDialog-BPcEYLjP.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 { N as N27, N as N28 } from "./chunks/NcAppSettingsShortcutsSection-DLwubKV9.mjs";
+import { N as N29 } from "./chunks/NcAppSidebar-C8YzAzrZ.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-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 N31 } from "./chunks/NcAssistantButton-iK491d2v.mjs";
+import { N as N32 } from "./chunks/NcAssistantContent-iHA4O4cC.mjs";
+import { N as N33 } from "./chunks/NcAssistantIcon-C6s4Qm7-.mjs";
+import { N as N34 } from "./chunks/NcAvatar-1KxMUN7V.mjs";
+import { N as N35 } from "./chunks/NcBlurHash-B30Ol8KP.mjs";
+import { N as N36 } from "./chunks/NcBreadcrumb-3Y5NWXnV.mjs";
+import { N as N37 } from "./chunks/NcBreadcrumbs-BaTp3Sya.mjs";
+import { N as N38 } from "./chunks/NcButton-jvoYS2my.mjs";
+import { N as N39 } from "./chunks/NcCheckboxRadioSwitch-DVdt5Hkq.mjs";
+import { N as N40 } from "./chunks/NcChip-DKRlV47q.mjs";
+import { N as N41 } from "./chunks/NcCollectionList-B9qCtjJw.mjs";
+import { N as N42 } from "./chunks/NcColorPicker-BCkasLwT.mjs";
+import { N as N43 } from "./chunks/NcContent-BYh5hWDN.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 { N as N45 } from "./chunks/NcDashboardWidget-zmbDEGL-.mjs";
+import { N as N46 } from "./chunks/NcDashboardWidgetItem-DwDndrm_.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 N47 } from "./chunks/NcDateTimePicker-qaFC_wUt.mjs";
+import { N as N48 } from "./chunks/NcDateTimePickerNative-B8CMOUnH.mjs";
+import { N as N49 } from "./chunks/NcDialog-D617YI0t.mjs";
+import { _ as _4 } from "./chunks/NcDialogButton.vue_vue_type_script_setup_true_lang-Bqfy678u.mjs";
 import { N as N50 } from "./chunks/NcEllipsisedOption-D6Amb91K.mjs";
-import { N as N51 } from "./chunks/NcEmojiPicker-Bpw-68QP.mjs";
+import { N as N51 } from "./chunks/NcEmojiPicker-UTxgju3f.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-m4oAOSTa.mjs";
-import { N as N60 } from "./chunks/NcHeaderMenu-DRxcyWNX.mjs";
+import { N as N53 } from "./chunks/NcFilePicker-bD2toutn.mjs";
+import { N as N54 } from "./chunks/NcFormBox-Bmqar8nn.mjs";
+import { N as N55 } from "./chunks/NcFormBoxButton-G_PkUiQy.mjs";
+import { _ as _5 } from "./chunks/NcFormBoxCopyButton.vue_vue_type_script_setup_true_lang-BA_gWnmz.mjs";
+import { N as N56 } from "./chunks/NcFormBoxSwitch-DSXiQcnq.mjs";
+import { N as N57 } from "./chunks/NcFormGroup-N7qIFAwN.mjs";
+import { N as N58 } from "./chunks/NcGuestContent-CvT6VGt1.mjs";
+import { N as N59 } from "./chunks/NcHeaderButton-BnLwYCog.mjs";
+import { N as N60 } from "./chunks/NcHeaderMenu-ktQJV2SW.mjs";
 import { _ as _6 } from "./chunks/NcHighlight.vue_vue_type_script_lang-DnWQDM_2.mjs";
-import { N as N61 } from "./chunks/NcHotkey-C-TYyC8X.mjs";
-import { N as N62 } from "./chunks/NcHotkeyList-CmMgGhMr.mjs";
+import { N as N61 } from "./chunks/NcHotkey-BDGeF3eH.mjs";
+import { N as N62 } from "./chunks/NcHotkeyList-B4WjTLAp.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 N64 } from "./chunks/NcInputField-5Sg6EUP6.mjs";
+import { N as N65 } from "./chunks/NcKbd-Bh_Tk6Ar.mjs";
+import { N as N66 } from "./chunks/NcListItem-BliLJpvU.mjs";
+import { N as N67 } from "./chunks/NcListItemIcon-Dl_tfkk9.mjs";
 import { N as N68 } from "./chunks/NcLoadingIcon-BOVpFVQz.mjs";
-import { N as N69 } from "./chunks/NcModal-DUWLRm_F.mjs";
+import { N as N69 } from "./chunks/NcModal-DiDvgcU8.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 N71 } from "./chunks/NcPasswordField-BFyzHTOO.mjs";
+import { N as N72 } from "./chunks/NcPopover-B87bEPLq.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 { N as N74 } from "./chunks/NcRadioGroup-B4qmS2UD.mjs";
+import { N as N75 } from "./chunks/NcRadioGroupButton-CZykGwv3.mjs";
+import { N as N76 } from "./chunks/NcRelatedResourcesPanel-D_Ttpg5_.mjs";
+import { N as N77, a, b } from "./chunks/NcRichContenteditable-Qw614bJ5.mjs";
 import "@nextcloud/auth";
 import "@nextcloud/axios";
 import "@nextcloud/router";
@@ -87,26 +87,27 @@ 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-B4bsiMOy.mjs";
-import { N as N78, h, i, b as b3, r, c as c2, e, f } from "./chunks/customPickerElements-Cu7bLbap.mjs";
+import { a as a2, g, b as b2, c, d, s, e } from "./chunks/referencePickerModal-CnKdEDwu.mjs";
+import "./chunks/createElementId-DhjFt1I9.mjs";
+import { N as N78, h, i, b as b3, r, c as c2, e as e2, f } from "./chunks/customPickerElements-BqbDcaEu.mjs";
 import "unist-builder";
 import "unist-util-visit-parents";
 import "./chunks/logger-D3RVzcfQ.mjs";
-import { N as N79 } from "./chunks/NcRichText-BOBQq7Od.mjs";
-import { N as N80 } from "./chunks/NcSelect-BOFzoCwK.mjs";
+import { N as N79 } from "./chunks/NcRichText-BO_4KtBA.mjs";
+import { N as N80 } from "./chunks/NcSelect--kERLlBK.mjs";
 import "debounce";
-import { _ as _7 } from "./chunks/NcTextField.vue_vue_type_script_setup_true_lang-BQHjkK8r.mjs";
+import { _ as _7 } from "./chunks/NcTextField.vue_vue_type_script_setup_true_lang-Bx2esFU2.mjs";
 import "@nextcloud/event-bus";
 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 N81 } from "./chunks/NcSelectTags-I2hJaNax.mjs";
+import { N as N82 } from "./chunks/NcSelectUsers-K14Bepkq.mjs";
+import { N as N83 } from "./chunks/NcSettingsSection-Caz1fuWt.mjs";
+import { N as N84 } from "./chunks/NcSettingsSelectGroup-SYJ8-XlR.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-Csd1JQe6.mjs";
-import { N as N86 } from "./chunks/NcUserBubble-CDQa0hGy.mjs";
-import { N as N87 } from "./chunks/NcUserStatusIcon-DsviB2Cr.mjs";
+import { _ as _10 } from "./chunks/NcTimezonePicker.vue_vue_type_script_setup_true_lang-D7ZHgnwW.mjs";
+import { N as N86 } from "./chunks/NcUserBubble-BXR7vT0V.mjs";
+import { N as N87 } from "./chunks/NcUserStatusIcon-BF5OEQFU.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";
@@ -116,7 +117,7 @@ import { MOBILE_BREAKPOINT, MOBILE_SMALL_BREAKPOINT, useIsMobile, useIsSmallMobi
 import { isA11yActivation } from "./functions/a11y/index.mjs";
 import { getEnabledContactsMenuActions, registerContactsMenuAction } from "./functions/contactsMenu/index.mjs";
 import { spawnDialog } from "./functions/dialog/index.mjs";
-import { E, e as e2, a as a3, g as g2, s as s2 } from "./chunks/emoji-C8k9NUlo.mjs";
+import { E, e as e3, a as a3, g as g2, s as s2 } from "./chunks/emoji-C8k9NUlo.mjs";
 import { checkIfDarkTheme, isDarkTheme } from "./functions/isDarkTheme/index.mjs";
 import { preloadImage } from "./functions/preloadImage/index.mjs";
 import { usernameToColor } from "./functions/usernameToColor/index.mjs";
@@ -230,13 +231,14 @@ export {
   _11 as NcVNodes,
   a2 as anyLinkProviderId,
   checkIfDarkTheme,
-  e2 as emojiAddRecent,
+  e3 as emojiAddRecent,
   a3 as emojiSearch,
   g2 as getCurrentSkinTone,
   getEnabledContactsMenuActions,
   g as getLinkWithPicker,
   b2 as getProvider,
   c as getProviders,
+  d as getReferenceWithPicker,
   h as hasInteractiveView,
   isA11yActivation,
   i as isCustomPickerElementRegistered,
@@ -246,11 +248,11 @@ export {
   registerContactsMenuAction,
   r as registerCustomPickerElement,
   c2 as registerWidget,
-  e as renderCustomPickerElement,
+  e2 as renderCustomPickerElement,
   f as renderWidget,
   s as searchProvider,
   s2 as setCurrentSkinTone,
-  d as sortProviders,
+  e as sortProviders,
   spawnDialog,
   useFormatRelativeTime,
   useFormatTime,

package/dist/index.mjs.map

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

package/dist/mixins/userStatus.d.ts

@@ -19,11 +19,12 @@ declare namespace _default {
         /**
          * Sets the user status
          *
-         * @param {string} status user's status
-         * @param {string} message user's message
-         * @param {string} icon user's icon
+         * @param {Record<string, string>} options - Options for setting the user status
+         * @param {string} options.status user's status
+         * @param {string} options.message user's message
+         * @param {string} options.icon user's icon
          */
-        function setUserStatus({ status, message, icon }: string): void;
+        function setUserStatus({ status, message, icon }: Record<string, string>): void;
     }
 }
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextcloud/vue",
-  "version": "9.8.1",
+  "version": "9.9.0",
   "description": "Nextcloud vue components",
   "keywords": [
     "vuejs",
@@ -76,7 +76,7 @@
   },
   "dependencies": {
     "@ckpack/vue-color": "^1.6.0",
-    "@floating-ui/dom": "^1.7.6",
+    "@floating-ui/dom": "^1.8.0",
     "@nextcloud/auth": "^2.6.0",
     "@nextcloud/axios": "^2.6.0",
     "@nextcloud/browser-storage": "^0.5.0",
@@ -94,14 +94,14 @@
     "blurhash": "^2.0.5",
     "clone": "^2.1.2",
     "debounce": "^3.0.0",
-    "dompurify": "^3.4.3",
+    "dompurify": "^3.4.12",
     "emoji-mart-vue-fast": "^15.0.5",
     "escape-html": "^1.0.3",
     "floating-vue": "^5.2.2",
-    "focus-trap": "^8.2.0",
+    "focus-trap": "^8.2.2",
     "linkifyjs": "^4.3.3",
     "mdast-util-to-string": "^4.0.0",
-    "p-queue": "^9.2.0",
+    "p-queue": "^9.3.1",
     "rehype-external-links": "^3.0.0",
     "rehype-highlight": "^7.0.2",
     "rehype-react": "^8.0.0",
@@ -118,49 +118,49 @@
     "unist-builder": "^4.0.0",
     "unist-util-visit-parents": "^6.0.2",
     "vue": "^3.5.18",
-    "vue-router": "^5.0.7"
+    "vue-router": "^5.1.0"
   },
   "devDependencies": {
-    "@babel/plugin-syntax-import-assertions": "^7.28.6",
-    "@babel/plugin-transform-typescript": "^7.28.6",
-    "@babel/preset-typescript": "^7.28.5",
+    "@babel/plugin-syntax-import-assertions": "^7.29.7",
+    "@babel/plugin-transform-typescript": "^7.29.7",
+    "@babel/preset-typescript": "^7.29.7",
     "@fontsource/roboto": "^5.2.10",
     "@mdi/js": "^7.4.47",
     "@mdi/svg": "^7.4.47",
     "@nextcloud/babel-config": "^1.3.0",
     "@nextcloud/browserslist-config": "^3.1.2",
-    "@nextcloud/eslint-config": "^9.0.0-rc.9",
+    "@nextcloud/eslint-config": "^9.0.1",
     "@nextcloud/stylelint-config": "^3.2.2",
     "@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.60.0",
+    "@playwright/experimental-ct-vue": "^1.61.1",
+    "@playwright/test": "^1.61.1",
     "@types/gettext-parser": "^9.0.0",
-    "@types/node": "^24.12.4",
-    "@vitest/coverage-v8": "^4.1.6",
+    "@types/node": "^26.1.1",
+    "@vitest/coverage-v8": "^4.1.10",
     "@vue/test-utils": "^2.4.6",
     "@vue/tsconfig": "^0.9.1",
     "babel-loader-exclude-node-modules-except": "^1.2.4",
     "core-js": "^3.49.0",
-    "eslint": "^10.3.0",
+    "eslint": "^10.6.0",
     "file-loader": "^6.2.0",
     "gettext-extractor": "^4.0.6",
-    "gettext-parser": "^9.0.2",
+    "gettext-parser": "^9.1.1",
     "glob": "^13.0.6",
     "jsdom": "^29.1.1",
     "remark-gfm": "^4.0.1",
     "resolve-url-loader": "^5.0.0",
-    "sass": "^1.99.0",
-    "stylelint": "^17.11.1",
+    "sass": "^1.101.0",
+    "stylelint": "^17.14.0",
     "ts-node": "^10.9.2",
     "typescript": "^5.9.3",
     "url-loader": "^4.1.1",
-    "vite": "^7.3.2",
+    "vite": "^7.3.5",
     "vitest": "^4.0.14",
     "vue-material-design-icons": "^5.3.1",
     "vue-styleguidist": "^4.72.4",
-    "vue-tsc": "^3.2.9",
-    "webpack": "^5.106.2",
+    "vue-tsc": "^3.3.7",
+    "webpack": "^5.108.4",
     "webpack-merge": "^6.0.1"
   },
   "engines": {

package/dist/chunks/NcActions-CUmcZ3C3.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcActions-CUmcZ3C3.mjs","sources":["../../node_modules/vue-material-design-icons/DotsHorizontal.vue","../../src/utils/isSlotPopulated.ts","../../src/components/NcActions/NcActions.vue"],"sourcesContent":["<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"title ? null : 'true'\"\n        :aria-label=\"title\"\n        class=\"material-design-icon dots-horizontal-icon\"\n        role=\"img\"\n        @click=\"$emit('click', $event)\">\n    <svg :fill=\"fillColor\"\n         class=\"material-design-icon__svg\"\n         :width=\"size\"\n         :height=\"size\"\n         viewBox=\"0 0 24 24\">\n      <path d=\"M16,12A2,2 0 0,1 18,10A2,2 0 0,1 20,12A2,2 0 0,1 18,14A2,2 0 0,1 16,12M10,12A2,2 0 0,1 12,10A2,2 0 0,1 14,12A2,2 0 0,1 12,14A2,2 0 0,1 10,12M4,12A2,2 0 0,1 6,10A2,2 0 0,1 8,12A2,2 0 0,1 6,14A2,2 0 0,1 4,12Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"DotsHorizontalIcon\",\n  emits: ['click'],\n  props: {\n    title: {\n      type: String,\n    },\n    fillColor: {\n      type: String,\n      default: \"currentColor\"\n    },\n    size: {\n      type: Number,\n      default: 24\n    }\n  }\n}\n</script>","/**\n * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors\n * SPDX-License-Identifier: AGPL-3.0-or-later\n */\n\nimport type { VNode, VNodeNormalizedChildren } from 'vue'\n\nimport { Comment, Fragment, Text } from 'vue'\n\n/**\n * Checks whether a slot is populated\n *\n * @param vnodes The array of vnodes to check\n */\nexport function isSlotPopulated(vnodes?: VNode[] | VNodeNormalizedChildren) {\n\treturn Array.isArray(vnodes) && vnodes.some((node) => {\n\t\tif (node === null) {\n\t\t\treturn false\n\t\t} else if (typeof node === 'object') {\n\t\t\tconst vnode = node as VNode\n\t\t\tif (vnode.type === Comment) {\n\t\t\t\treturn false\n\t\t\t} else if (vnode.type === Fragment && !isSlotPopulated(vnode.children)) {\n\t\t\t\treturn false\n\t\t\t} else if (vnode.type === Text && !(vnode.children as string).trim()) {\n\t\t\t\treturn false\n\t\t\t}\n\t\t}\n\t\treturn true\n\t})\n}\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<!-- Accessibility guidelines:\nhttps://www.w3.org/TR/wai-aria-practices/examples/menu-button/menu-button-actions.html -->\n\n<docs>\n### Single action\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton @click=\"actionDelete\">\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t},\n\tmethods: {\n\t\tactionDelete() {\n\t\t\talert('Delete')\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions\n\n```vue\n<template>\n\t<NcActions>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<IconOpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconOpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconOpenInNew,\n\t\tIconPencilOutline,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with 2 items inline\n\n```vue\n<template>\n\t<NcActions :inline=\"2\">\n\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPlus :size=\"20\" />\n\t\t\t</template>\n\t\t\tAdd\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<IconOpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport IconPlus from 'vue-material-design-icons/Plus.vue'\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconOpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconOpenInNew,\n\t\tIconPencilOutline,\n\t\tIconPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with 2 items inline AND forced names\n\n```vue\n<template>\n\t<NcActions :force-name=\"true\" :inline=\"2\">\n\t\t<NcActionButton @click=\"showMessage('Add')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPlus :size=\"20\" />\n\t\t\t</template>\n\t\t\tAdd\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<IconOpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport IconPlus from 'vue-material-design-icons/Plus.vue'\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconOpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconOpenInNew,\n\t\tIconPencilOutline,\n\t\tIconPlus,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### Multiple actions with custom icon\n\n```vue\n<template>\n\t<NcActions>\n\t\t<template #icon>\n\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton @click=\"showMessage('Edit')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton @click=\"showMessage('Delete')\">\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionLink href=\"https://nextcloud.com\">\n\t\t\t<template #icon>\n\t\t\t\t<IconOpenInNew :size=\"20\" />\n\t\t\t</template>\n\t\t\tLink\n\t\t</NcActionLink>\n\t</NcActions>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconOpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconOpenInNew,\n\t\tIconPencilOutline,\n\t},\n\tmethods: {\n\t\tshowMessage(msg) {\n\t\t\talert(msg)\n\t\t},\n\t},\n}\n</script>\n```\n\n### With menu name\n\n```vue\n<template>\n\t<NcActions menu-name=\"Object management\">\n\t\t<template #icon>\n\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tRename\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconArrowRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tValidate\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrayArrowDown :size=\"20\" />\n\t\t\t</template>\n\t\t\tDownload\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconTrayArrowDown from 'vue-material-design-icons/TrayArrowDown.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconArrowRight,\n\t\tIconTrashCanOutline,\n\t\tIconTrayArrowDown,\n\t\tIconPencilOutline,\n\t},\n}\n</script>\n```\n\n### Various icons styles\n```vue\n<template>\n\t<NcActions :primary=\"true\">\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tEdit\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconPencilOutline,\n\t},\n}\n</script>\n```\n\n```vue\n<template>\n\t<NcActions :primary=\"true\" menu-name=\"Object management\">\n\t\t<template #icon>\n\t\t\t<IconPlus :size=\"20\" />\n\t\t</template>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tRename\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconArrowRight :size=\"20\" />\n\t\t\t</template>\n\t\t\tValidate\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrayArrowDown :size=\"20\" />\n\t\t\t</template>\n\t\t\tDownload\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconArrowRight from 'vue-material-design-icons/ArrowRight.vue'\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconTrayArrowDown from 'vue-material-design-icons/TrayArrowDown.vue'\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\nimport IconPlus from 'vue-material-design-icons/Plus.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconArrowRight,\n\t\tIconTrashCanOutline,\n\t\tIconTrayArrowDown,\n\t\tIconPencilOutline,\n\t\tIconPlus,\n\t},\n}\n</script>\n```\n\n### Custom icon slot\nTo be used with `vue-material-design-icons` only. For icon classes use the `default-icon` slot.\nIt can be used with one or multiple actions.\n```vue\n<template>\n\t<div style=\"display: flex;align-items: center;\">\n\t\t<NcButton @click=\"toggled = !toggled\">Toggle multiple action</NcButton>\n\t\t<NcActions>\n\t\t\t<template #icon>\n\t\t\t\t<IconDotsHorizontalCircleOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\t<NcActionButton>\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconMicrophoneOff :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tMute\n\t\t\t</NcActionButton>\n\t\t\t<NcActionButton v-if=\"toggled\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tDelete\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconDotsHorizontalCircleOutline from 'vue-material-design-icons/DotsHorizontalCircleOutline.vue'\nimport IconMicrophoneOff from 'vue-material-design-icons/MicrophoneOff.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconDotsHorizontalCircleOutline,\n\t\tIconMicrophoneOff,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\ttoggled: false\n\t\t}\n\t}\n}\n</script>\n```\n\n### Custom icon slot in child elements\n```vue\n<template>\n\t<NcActions :primary=\"true\">\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconMagnify :size=\"20\" />\n\t\t\t</template>\n\t\t\tSearch\n\t\t</NcActionButton>\n\t\t<NcActionButton>\n\t\t\t<template #icon>\n\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t</template>\n\t\t\tDelete\n\t\t</NcActionButton>\n\t</NcActions>\n</template>\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconMagnify from 'vue-material-design-icons/Magnify.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconMagnify,\n\t},\n}\n</script>\n```\n\n### Design variants\n\n```vue\n<template>\n\t<div>\n\t\t<NcActions :variant=\"current\">\n\t\t\t<template #icon>\n\t\t\t\t<IconSelectColor :size=\"20\" />\n\t\t\t</template>\n\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-icon--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<IconSelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\n\t\t<NcActions :variant=\"current\" menu-name=\"Choose a variant\">\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-text--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<IconSelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\n\t\t<NcActions :variant=\"current\"  menu-name=\"Choose a variant\">\n\t\t\t<template #icon>\n\t\t\t\t<IconSelectColor :size=\"20\" />\n\t\t\t</template>\n\n\t\t\t<NcActionButton v-if=\"current\" close-after-click @click=\"define()\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\tRemove\n\t\t\t</NcActionButton>\n\n\t\t\t<NcActionButton v-for=\"row in variants\" close-after-click @click=\"define(row)\" :key=\"`type-icon-text--${row}`\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconCheckboxMarkedCircleOutline v-if=\"row === current\" :size=\"20\" />\n\t\t\t\t\t<IconSelectColor v-else :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t{{ row }}\n\t\t\t</NcActionButton>\n\t\t</NcActions>\n\t</div>\n</template>\n\n<script>\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\nimport IconPaletteOutline from 'vue-material-design-icons/PaletteOutline.vue'\nimport IconSelectColor from 'vue-material-design-icons/SelectColor.vue'\nimport IconCheckboxMarkedCircleOutline from 'vue-material-design-icons/CheckboxMarkedCircleOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconTrashCanOutline,\n\t\tIconPaletteOutline,\n\t\tIconSelectColor,\n\t\tIconCheckboxMarkedCircleOutline,\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tcurrent: 'primary',\n\t\t\tvariants: [\n\t\t\t\t'primary',\n\t\t\t\t'secondary',\n\t\t\t\t'tertiary',\n\t\t\t\t'error',\n\t\t\t\t'warning',\n\t\t\t\t'success'\n\t\t\t]\n\t\t}\n\t},\n\tmethods: {\n\t\tdefine(row = undefined) {\n\t\t\tthis.current = row\n\t\t}\n\t}\n}\n</script>\n```\n\n### Use cases\n\n```vue\n<template>\n\t<div>\n\t\t<h2>Application menu</h2>\n\t\t<p>Has buttons, button groups, links and router links, separators, texts. May have checkboxes and radio buttons. Separator can be used to make groups of radio buttons as well.</p>\n\t\t<p><kbd>Arrows</kbd> are used to navigate between items, <kbd>Tab</kbd> is used to navigate to the next UI element on the page.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Email menu\" variant=\"tertiary\">\n\t\t\t\t<NcActionButtonGroup>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconStarOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tFavorite\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconEmail :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tUnread\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconBookmarkOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tImportant\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActionButtonGroup>\n\t\t\t\t<NcActionText>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconClockOutline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\t{{ new Date().toLocaleDateString('en-US') }}\n\t\t\t\t</NcActionText>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconAlertOctagonOutline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tMark as spam\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionCheckbox v-model=\"selected\">\n\t\t\t\t\tSelect\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconOpenInNew :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tMove thread\n\t\t\t\t</NcActionButton>\n\t\t\t\t<NcActionLink href=\"#\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconTrayArrowDown :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tDownload message\n\t\t\t\t</NcActionLink>\n\t\t\t</NcActions>\n\t\t</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Text settings\" variant=\"tertiary\">\n\t\t\t\t<template #icon>\n\t\t\t\t\t<IconFormatTitle :size=\"20\" />\n\t\t\t\t</template>\n\t\t\t\t<NcActionButtonGroup name=\"Alignment\">\n\t\t\t\t\t<NcActionButton aria-label=\"Left\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconFormatAlignLeft :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton aria-label=\"Center\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconFormatAlignCenter :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton aria-label=\"Right\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconFormatAlignRight :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActionButtonGroup>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionCheckbox v-model=\"checked.bold\" value=\"bold\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconFormatBold :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tBold\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionCheckbox v-model=\"checked.italic\" value=\"italic\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconFormatItalic :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tItalic\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionCheckbox v-model=\"checked.underline\" value=\"underline\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconFormatUnderline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tUnderline\n\t\t\t\t</NcActionCheckbox>\n\t\t\t\t<NcActionSeparator />\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.black\" value=\"Black\">Black</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.blue\" value=\"Blue\">Blue</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.red\" value=\"Red\">Red</NcActionRadio>\n\t\t\t\t<NcActionRadio name=\"color\" v-model=\"color.green\" value=\"Green\">Green</NcActionRadio>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Navigation</h2>\n\t\t<p>Has links or router links. May use text elements, captions and separators.</p>\n\t\t<p>Uses classic <kbd>Tab</kbd> navigation.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Applications navigation\" :inline=\"2\" variant=\"tertiary\">\n\t\t\t\t<NcActionLink href=\"/apps/dashboard\" icon=\"icon-category-dashboard-white\">\n\t\t\t\t\tDashboard\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/files\" icon=\"icon-files-white\">\n\t\t\t\t\tFiles\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/spreed\" icon=\"icon-talk-white\">\n\t\t\t\t\tTalk\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/contacts\" icon=\"icon-contacts-white\">\n\t\t\t\t\tContacts\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionLink href=\"/apps/circles\" icon=\"icon-circles-white\">\n\t\t\t\t\tCircles\n\t\t\t\t</NcActionLink>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Dialog</h2>\n\t\t<p>Includes data input elements, forms.</p>\n\t\t<p>Uses <kbd>Tab</kbd> navigation with a focus trap.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Group management\">\n\t\t\t\t<NcActionInput trailing-button-label=\"Submit\" label=\"Rename group\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconPencilOutline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcActionInput>\n\t\t\t\t<NcActionButton>\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconTrashCanOutline :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\tRemove group\n\t\t\t\t</NcActionButton>\n\t\t\t</NcActions>\n\t\t</p>\n\n\t\t<h2>Tooltip</h2>\n\t\t<p>Has only text and no interactive elements.</p>\n\t\t<p>\n\t\t\t<NcActions aria-label=\"Contact\" :inline=\"1\">\n\t\t\t\t<NcActionLink aria-label=\"View profile\" href=\"/u/alice\" icon=\"icon-user-white\">\n\t\t\t\t\tView profile\n\t\t\t\t</NcActionLink>\n\t\t\t\t<NcActionText icon=\"icon-timezone-white\">\n\t\t\t\t\tLocal time: 10:12\n\t\t\t\t</NcActionText>\n\t\t\t</NcActions>\n\t\t</p>\n\t</div>\n</template>\n\n<script>\n// Common icons\nimport IconPencilOutline from 'vue-material-design-icons/PencilOutline.vue'\nimport IconTrashCanOutline from 'vue-material-design-icons/TrashCanOutline.vue'\n\n// Email icons\nimport IconStarOutline from 'vue-material-design-icons/StarOutline.vue'\nimport IconEmail from 'vue-material-design-icons/Email.vue'\nimport IconBookmarkOutline from 'vue-material-design-icons/BookmarkOutline.vue'\nimport IconClockOutline from 'vue-material-design-icons/ClockOutline.vue'\nimport IconAlertOctagonOutline from 'vue-material-design-icons/AlertOctagonOutline.vue'\nimport IconCheck from 'vue-material-design-icons/Check.vue'\nimport IconOpenInNew from 'vue-material-design-icons/OpenInNew.vue'\nimport IconTrayArrowDown from 'vue-material-design-icons/TrayArrowDown.vue'\n\n// Formatting icons\nimport IconFormatTitle from 'vue-material-design-icons/FormatTitle.vue'\nimport IconFormatAlignLeft from 'vue-material-design-icons/FormatAlignLeft.vue'\nimport IconFormatAlignCenter from 'vue-material-design-icons/FormatAlignCenter.vue'\nimport IconFormatAlignRight from 'vue-material-design-icons/FormatAlignRight.vue'\nimport IconFormatBold from 'vue-material-design-icons/FormatBold.vue'\nimport IconFormatItalic from 'vue-material-design-icons/FormatItalic.vue'\nimport IconFormatUnderline from 'vue-material-design-icons/FormatUnderline.vue'\n\nexport default {\n\tcomponents: {\n\t\t// Common icons\n\t\tIconPencilOutline,\n\t\tIconTrashCanOutline,\n\n\t\t// Email icons\n\t\tIconStarOutline,\n\t\tIconEmail,\n\t\tIconBookmarkOutline,\n\t\tIconClockOutline,\n\t\tIconAlertOctagonOutline,\n\t\tIconCheck,\n\t\tIconOpenInNew,\n\t\tIconTrayArrowDown,\n\n\t\t// Formatting icons\n\t\tIconFormatTitle,\n\t\tIconFormatAlignLeft,\n\t\tIconFormatAlignCenter,\n\t\tIconFormatAlignRight,\n\t\tIconFormatBold,\n\t\tIconFormatItalic,\n\t\tIconFormatUnderline,\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\tselected: false,\n\t\t\t// Formatting\n\t\t\tchecked: {\n\t\t\t\tbold: true,\n\t\t\t\titalic: false,\n\t\t\t\tunderline: false,\n\t\t\t},\n\t\t\tcolor: {\n\t\t\t\tblack: true,\n\t\t\t\tblue: false,\n\t\t\t\tred: false,\n\t\t\t\tgreen: false,\n\t\t\t},\n\t\t}\n\t},\n}\n</script>\n\n<style scoped>\np {\n\tmargin: 1rem 0;\n}\n</style>\n```\n\n## NcActions children limitations\n\n`<NcActions>` is supposed to be used with direct `<NcAction*>` children.\nAlthough it works when actions are not direct children but wrapped in custom components, it has limitations:\n- No `inline` prop property, including a single action display;\n- Accessibility issues, including changed keyboard behavior;\n- Invalid HTML.\n\n```\n<template>\n\t<table class=\"actions-limitations-table\">\n\t\t<tr>\n\t\t\t<th style=\"width: 50%\">Non-direct children</th>\n\t\t\t<th style=\"width: 50%\">Direct NcAction* children</th>\n\t\t</tr>\n\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This single button is supposed to be rendered as inline action but it is rendered as a menu:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<MyUserActionButton />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<NcActionButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconAccountOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This NcActions is supposed to have 2 inline buttons but it has none:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions :inline=\"2\">\n\t\t\t\t\t<MyUserActionButton v-for=\"i in 4\" />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions :inline=\"2\">\n\t\t\t\t\t<NcActionButton v-for=\"i in 4\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconAccountOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<th colspan=\"2\">This NcActions is supposed to have a11y role menu and keyboard navigation but it acts like a dialog:</th>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<MyActionsList />\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t\t<td>\n\t\t\t\t<NcActions>\n\t\t\t\t\t<NcActionButton v-for=\"i in 4\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconAccountOutline :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tButton\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcActions>\n\t\t\t</td>\n\t\t</tr>\n\t</table>\n</template>\n\n<script>\nimport { h, resolveComponent } from 'vue'\nimport IconAccountOutline from 'vue-material-design-icons/AccountOutline.vue'\n\nexport default {\n\tcomponents: {\n\t\tIconAccountOutline,\n\n\t\tMyUserActionButton: {\n\t\t\tname: 'MyUserActionButton',\n\t\t\tcomponents: { IconAccountOutline },\n\t\t\trender: () => h(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(IconAccountOutline, { size: 20 }) }),\n\t\t},\n\n\t\tMyActionsList: {\n\t\t\tname: 'MyActionsList',\n\t\t\tcomponents: { IconAccountOutline },\n\t\t\trender: () => h('div', null, {\n\t\t\t\tdefault: () => [\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(IconAccountOutline, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(IconAccountOutline, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(IconAccountOutline, { size: 20 }) }),\n\t\t\t\t\th(resolveComponent('NcActionButton'), null, { default: () => 'Button', icon: () => h(IconAccountOutline, { size: 20 }) }),\n\t\t\t\t],\n\t\t\t}),\n\t\t},\n\t},\n}\n</script>\n\n<style>\n.actions-limitations-table {\n\tborder-collapse: collapse;\n\twidth: 100%;\n\tth,\n\ttd {\n\t\tborder: 1px solid var(--color-border);\n\t\tpadding: var(--default-grid-baseline);\n\t\tmax-width: 50%;\n\t}\n\n\tth {\n\t\ttext-align: center;\n\t\ttext-wrap: wrap;\n\t}\n}\n</style>\n```\n</docs>\n\n<script>\nimport { computed, Fragment, h, mergeProps, warn } from 'vue'\nimport IconDotsHorizontal from 'vue-material-design-icons/DotsHorizontal.vue'\nimport { useTrapStackControl } from '../../composables/useTrapStackControl.ts'\nimport { t } from '../../l10n.ts'\nimport { createElementId } from '../../utils/createElementId.ts'\nimport { isSlotPopulated } from '../../utils/isSlotPopulated.ts'\nimport NcButton from '../NcButton/index.ts'\nimport NcPopover from '../NcPopover/index.js'\nimport { NC_ACTIONS_CLOSE_MENU, NC_ACTIONS_IS_SEMANTIC_MENU } from './useNcActions.ts'\n\nconst focusableSelector = '.focusable'\n\n/**\n * The Actions component can be used to display one ore more actions.\n * If only a single action is provided, it will be rendered as an inline icon.\n * For more, a menu indicator will be shown and a popover menu containing the\n * actions will be opened on click.\n *\n * @since 0.10.0\n */\nexport default {\n\tname: 'NcActions',\n\n\tcomponents: {\n\t\tNcButton,\n\t\tNcPopover,\n\t},\n\n\tprovide() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * NcActions can be used as:\n\t\t\t * - Application menu (has menu role)\n\t\t\t * - Navigation (has no specific role, should be used an element with navigation role)\n\t\t\t * - Popover with plain text or text inputs (has no specific role)\n\t\t\t * Depending on the usage (used items), the menu and its items should have different roles for a11y.\n\t\t\t * Provide the role for NcAction* components in the NcActions content.\n\t\t\t *\n\t\t\t * @type {import('vue').ComputedRef<boolean>}\n\t\t\t */\n\t\t\t[NC_ACTIONS_IS_SEMANTIC_MENU]: computed(() => this.actionsMenuSemanticType === 'menu'),\n\t\t\t[NC_ACTIONS_CLOSE_MENU]: this.closeMenu,\n\t\t}\n\t},\n\n\tprops: {\n\t\t/**\n\t\t * Specify the open state of the popover menu\n\t\t */\n\t\topen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * This disables the internal open management,\n\t\t * so the actions menu only respects the `open` prop.\n\t\t * This is e.g. necessary for the NcAvatar component\n\t\t * to only open the actions menu after loading it's entries has finished.\n\t\t */\n\t\tmanualOpen: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Force the actions to display in a three dot menu\n\t\t */\n\t\tforceMenu: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Force the name to show for single actions\n\t\t */\n\t\tforceName: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Specify the menu name\n\t\t */\n\t\tmenuName: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Apply primary styling for this menu\n\t\t */\n\t\tprimary: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Icon to show for the toggle menu button\n\t\t * when more than one action is inside the actions component.\n\t\t * Only replace the default three-dot icon if really necessary.\n\t\t */\n\t\tdefaultIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: '',\n\t\t},\n\n\t\t/**\n\t\t * Aria label for the actions menu.\n\t\t *\n\t\t * If `menuName` is defined this will not be used to prevent\n\t\t * any accessible name conflicts. This ensures that the\n\t\t * element can be activated via voice input.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: t('Actions'),\n\t\t},\n\n\t\t/**\n\t\t * Wanted direction of the menu\n\t\t */\n\t\tplacement: {\n\t\t\ttype: String,\n\t\t\tdefault: 'bottom',\n\t\t},\n\n\t\t/**\n\t\t * DOM element for the actions' popover boundaries\n\t\t */\n\t\tboundariesElement: {\n\t\t\ttype: Element,\n\t\t\tdefault: () => document.getElementById('content-vue') ?? document.querySelector('body'),\n\t\t},\n\n\t\t/**\n\t\t * Selector for the actions' popover container\n\t\t */\n\t\tcontainer: {\n\t\t\ttype: [Boolean, String, Object, Element],\n\t\t\tdefault: 'body',\n\t\t},\n\n\t\t/**\n\t\t * Disabled state of the main button (single action or menu toggle)\n\t\t */\n\t\tdisabled: {\n\t\t\ttype: Boolean,\n\t\t\tdefault: false,\n\t\t},\n\n\t\t/**\n\t\t * Display x items inline out of the dropdown menu\n\t\t * Will be ignored if `forceMenu` is set\n\t\t */\n\t\tinline: {\n\t\t\ttype: Number,\n\t\t\tdefault: 0,\n\t\t},\n\n\t\t/**\n\t\t * Specifies the button variant used for trigger and single actions buttons.\n\t\t *\n\t\t * If left empty, the default button style will be applied.\n\t\t *\n\t\t * @since 8.23.0\n\t\t */\n\t\tvariant: {\n\t\t\ttype: String,\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['primary', 'secondary', 'tertiary', 'tertiary-no-background', 'tertiary-on-primary', 'error', 'warning', 'success'].includes(value)\n\t\t\t},\n\n\t\t\tdefault: null,\n\t\t},\n\n\t\t/**\n\t\t * Specify the size used for trigger and single actions buttons.\n\t\t *\n\t\t * If left empty, the default button size will be applied.\n\t\t */\n\t\tsize: {\n\t\t\ttype: String,\n\t\t\tdefault: 'normal',\n\t\t\tvalidator(value) {\n\t\t\t\treturn ['small', 'normal', 'large'].includes(value)\n\t\t\t},\n\t\t},\n\t},\n\n\temits: [\n\t\t'click',\n\t\t'blur',\n\t\t'focus',\n\n\t\t'close',\n\t\t'closed',\n\t\t'open',\n\t\t'opened',\n\t\t'update:open',\n\t],\n\n\tsetup() {\n\t\tconst randomId = createElementId()\n\n\t\treturn {\n\t\t\trandomId,\n\t\t}\n\t},\n\n\tdata() {\n\t\treturn {\n\t\t\topened: this.open,\n\t\t\tfocusIndex: 0,\n\t\t\t/**\n\t\t\t * @type {'menu'|'navigation'|'dialog'|'tooltip'|'unknown'}\n\t\t\t */\n\t\t\tactionsMenuSemanticType: 'unknown',\n\t\t}\n\t},\n\n\tcomputed: {\n\t\ttriggerButtonVariant() {\n\t\t\t// If requested, we use a primary button\n\t\t\treturn this.variant || (this.primary\n\t\t\t\t? 'primary'\n\t\t\t\t// If it has a name, we use a secondary button\n\t\t\t\t: this.menuName ? 'secondary' : 'tertiary')\n\t\t},\n\n\t\t/**\n\t\t * A11y roles and keyboard navigation configuration depending on the semantic type\n\t\t */\n\t\tconfig() {\n\t\t\t/**\n\t\t\t * Accessibility notes:\n\t\t\t *\n\t\t\t * There is no valid popup role for navigation and tooltip in `aria-haspopup`.\n\t\t\t * aria-haspopup=\"true\" is equivalent to aria-haspopup=\"menu\".\n\t\t\t * They must not be treated as menus.\n\t\t\t *\n\t\t\t * Having both arrow and tab navigation is not allowed for a11y.\n\t\t\t * Either menu is an atomic UI element, and arrows select menu items, Tab moves to the next UI element.\n\t\t\t * Or the menu is an expanded list of UI elements.\n\t\t\t *\n\t\t\t * Navigation type is just an \"expanded\" block, similar to native <details> element.\n\t\t\t */\n\t\t\tconst configs = {\n\t\t\t\tmenu: {\n\t\t\t\t\tpopupRole: 'menu',\n\t\t\t\t\twithArrowNavigation: true,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\n\t\t\t\tnavigation: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: true,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\n\t\t\t\tdialog: {\n\t\t\t\t\tpopupRole: 'dialog',\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: true,\n\t\t\t\t\twithFocusTrap: true,\n\t\t\t\t},\n\n\t\t\t\ttooltip: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\twithArrowNavigation: false,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: false,\n\t\t\t\t},\n\n\t\t\t\t// Due to Vue limitations, we sometimes cannot determine the true type\n\t\t\t\t// As a fallback use both arrow navigation and focus trap\n\t\t\t\tunknown: {\n\t\t\t\t\tpopupRole: undefined,\n\t\t\t\t\trole: undefined,\n\t\t\t\t\twithArrowNavigation: true,\n\t\t\t\t\twithTabNavigation: false,\n\t\t\t\t\twithFocusTrap: true,\n\t\t\t\t},\n\t\t\t}\n\t\t\treturn configs[this.actionsMenuSemanticType]\n\t\t},\n\n\t\twithFocusTrap() {\n\t\t\treturn this.config.withFocusTrap\n\t\t},\n\t},\n\n\twatch: {\n\t\t// Watch parent prop\n\t\topen(state) {\n\t\t\tif (state === this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.opened = state\n\t\t},\n\n\t\topened() {\n\t\t\t// Ensure that pressing escape will close the menu even if the menu is not hovered\n\t\t\t// and not currently active, e.g. because user opened the context menu\n\t\t\tif (this.opened) {\n\t\t\t\tdocument.body.addEventListener('keydown', this.handleEscapePressed)\n\t\t\t} else {\n\t\t\t\tdocument.body.removeEventListener('keydown', this.handleEscapePressed)\n\t\t\t}\n\t\t},\n\t},\n\n\tcreated() {\n\t\t// When component has its own custom focus management\n\t\t// The global focus trap stack should be paused\n\t\tuseTrapStackControl(() => this.opened, {\n\t\t\tdisabled: () => this.config.withFocusTrap,\n\t\t})\n\n\t\tif ('ariaHidden' in this.$attrs) {\n\t\t\twarn('[NcActions]: Do not set the ariaHidden attribute as the root element will inherit the incorrect aria-hidden.')\n\t\t}\n\t},\n\n\tmethods: {\n\t\t/**\n\t\t * Get the name of the action component\n\t\t *\n\t\t * @param {import('vue').VNode} action - a vnode with a NcAction* component instance\n\t\t * @return {string} the name of the action component\n\t\t */\n\t\tgetActionName(action) {\n\t\t\treturn action?.type?.name\n\t\t},\n\n\t\t/**\n\t\t * Do we have exactly one Action and\n\t\t * is it allowed as a standalone element?\n\t\t *\n\t\t * @param {import('vue').VNode} action The action to check\n\t\t * @return {boolean}\n\t\t */\n\t\tisValidSingleAction(action) {\n\t\t\treturn ['NcActionButton', 'NcActionLink', 'NcActionRouter'].includes(this.getActionName(action))\n\t\t},\n\n\t\tisAction(action) {\n\t\t\treturn this.getActionName(action)?.startsWith?.('NcAction')\n\t\t},\n\n\t\t/**\n\t\t * Check whether a icon prop value is an URL or not\n\t\t *\n\t\t * @param {string} url The icon prop value\n\t\t */\n\t\tisIconUrl(url) {\n\t\t\ttry {\n\t\t\t\treturn !!(new URL(url, url.startsWith('/') ? window.location.origin : undefined))\n\t\t\t} catch {\n\t\t\t\treturn false\n\t\t\t}\n\t\t},\n\n\t\t// MENU STATE MANAGEMENT\n\t\ttoggleMenu(state) {\n\t\t\tif (state) {\n\t\t\t\tthis.openMenu()\n\t\t\t} else {\n\t\t\t\tthis.closeMenu()\n\t\t\t}\n\t\t},\n\n\t\topenMenu() {\n\t\t\tif (this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tthis.opened = true\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu open state is changed\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:open', true)\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is opened\n\t\t\t */\n\t\t\tthis.$emit('open')\n\t\t},\n\n\t\tasync closeMenu(returnFocus = true) {\n\t\t\tif (!this.opened) {\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\t// Wait for the next tick to keep the menu in DOM, allowing other components to find what button in what menu was used,\n\t\t\t// for example, to implement auto set return focus.\n\t\t\t// NcPopover will actually remove the menu from DOM also on the next tick.\n\t\t\tawait this.$nextTick()\n\n\t\t\tthis.opened = false\n\n\t\t\tthis.$refs.popover?.clearFocusTrap({ returnFocus })\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu open state is changed\n\t\t\t *\n\t\t\t * @type {boolean}\n\t\t\t */\n\t\t\tthis.$emit('update:open', false)\n\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is closed\n\t\t\t */\n\t\t\tthis.$emit('close')\n\n\t\t\t// close everything\n\t\t\tthis.focusIndex = 0\n\n\t\t\tif (returnFocus) {\n\t\t\t\t// Focus back the trigger button\n\t\t\t\tthis.$refs.triggerButton?.$el.focus()\n\t\t\t}\n\t\t},\n\n\t\t/**\n\t\t * Called when popover is shown after the show delay\n\t\t */\n\t\tonOpened() {\n\t\t\tthis.$nextTick(() => {\n\t\t\t\tthis.focusFirstAction(null)\n\n\t\t\t\t/**\n\t\t\t\t * Event emitted when the popover menu is opened.\n\t\t\t\t *\n\t\t\t\t * This event is emitted after `update:open` was emitted and the opening transition finished.\n\t\t\t\t */\n\t\t\t\tthis.$emit('opened')\n\t\t\t})\n\t\t},\n\n\t\tonClosed() {\n\t\t\t/**\n\t\t\t * Event emitted when the popover menu is closed.\n\t\t\t *\n\t\t\t * This event is emitted after `update:open` was emitted and the closing transition finished.\n\t\t\t */\n\t\t\tthis.$emit('closed')\n\t\t},\n\n\t\t// MENU KEYS & FOCUS MANAGEMENT\n\t\t/**\n\t\t * @return {HTMLElement|null}\n\t\t */\n\t\tgetCurrentActiveMenuItemElement() {\n\t\t\treturn this.$refs.menu.querySelector('li.active')\n\t\t},\n\n\t\t/**\n\t\t * @return {NodeList<HTMLElement>}\n\t\t */\n\t\tgetFocusableMenuItemElements() {\n\t\t\treturn this.$refs.menu.querySelectorAll(focusableSelector)\n\t\t},\n\n\t\t/**\n\t\t * Dispatches the keydown listener to different handlers\n\t\t *\n\t\t * @param {object} event The keydown event\n\t\t */\n\t\tonKeydown(event) {\n\t\t\tif (event.key === 'Tab') {\n\t\t\t\tif (this.config.withFocusTrap) {\n\t\t\t\t\t// Focus is managed by focus-trap\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\tif (!this.config.withTabNavigation) {\n\t\t\t\t\t// Tab is not used for navigation - close the menu\n\t\t\t\t\t// Return focus to restore Tab sequence\n\t\t\t\t\t// So browser will correctly move focus to the next element\n\t\t\t\t\tthis.closeMenu(true)\n\t\t\t\t\treturn\n\t\t\t\t}\n\n\t\t\t\t// Tab is used for classic navigation but we implement it manually\n\n\t\t\t\tevent.preventDefault()\n\n\t\t\t\tconst focusList = this.getFocusableMenuItemElements()\n\t\t\t\tconst focusIndex = [...focusList].indexOf(document.activeElement)\n\t\t\t\tif (focusIndex === -1) {\n\t\t\t\t\t// This is not supposed to happen\n\t\t\t\t\t// But if it does - do nothing and keep native behavior\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tconst newFocusIndex = event.shiftKey ? focusIndex - 1 : focusIndex + 1\n\n\t\t\t\t// There is no focus-trap, so going out of the menu closes it\n\t\t\t\tif (newFocusIndex < 0 || newFocusIndex === focusList.length) {\n\t\t\t\t\tthis.closeMenu(true)\n\t\t\t\t}\n\n\t\t\t\t// Update current focused element\n\t\t\t\tthis.focusIndex = newFocusIndex\n\t\t\t\tthis.focusAction()\n\t\t\t\treturn\n\t\t\t}\n\n\t\t\tif (this.config.withArrowNavigation) {\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tthis.focusPreviousAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tthis.focusNextAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'PageUp') {\n\t\t\t\t\tthis.focusFirstAction(event)\n\t\t\t\t}\n\n\t\t\t\tif (event.key === 'PageDown') {\n\t\t\t\t\tthis.focusLastAction(event)\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tthis.handleEscapePressed(event)\n\t\t},\n\n\t\tonTriggerKeydown(event) {\n\t\t\tif (event.key === 'Escape') {\n\t\t\t\t// Tooltip has no focusable elements and the focus remains on the trigger button.\n\t\t\t\t// So keydown event on the menu cannot be handled to close Tooltip on Escape.\n\t\t\t\t// Handle on the trigger.\n\t\t\t\tif (this.actionsMenuSemanticType === 'tooltip') {\n\t\t\t\t\tthis.closeMenu()\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\thandleEscapePressed(event) {\n\t\t\tif (event.key === 'Escape') {\n\t\t\t\tthis.closeMenu()\n\t\t\t\tevent.preventDefault()\n\t\t\t}\n\t\t},\n\n\t\tremoveCurrentActive() {\n\t\t\tconst currentActiveElement = this.$refs.menu.querySelector('li.active')\n\t\t\tif (currentActiveElement) {\n\t\t\t\tcurrentActiveElement.classList.remove('active')\n\t\t\t}\n\t\t},\n\n\t\tfocusAction() {\n\t\t\t// TODO: have a global disabled state for non input elements\n\t\t\tconst focusElement = this.getFocusableMenuItemElements()[this.focusIndex]\n\t\t\tif (focusElement) {\n\t\t\t\tthis.removeCurrentActive()\n\t\t\t\tconst liMenuParent = focusElement.closest('li.action')\n\t\t\t\tfocusElement.focus()\n\t\t\t\tif (liMenuParent) {\n\t\t\t\t\tliMenuParent.classList.add('active')\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tfocusPreviousAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tif (this.focusIndex === 0) {\n\t\t\t\t\tthis.focusLastAction(event)\n\t\t\t\t} else {\n\t\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t\tthis.focusIndex = this.focusIndex - 1\n\t\t\t\t}\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\n\t\tfocusNextAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tconst indexLength = this.getFocusableMenuItemElements().length - 1\n\t\t\t\tif (this.focusIndex === indexLength) {\n\t\t\t\t\tthis.focusFirstAction(event)\n\t\t\t\t} else {\n\t\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t\tthis.focusIndex = this.focusIndex + 1\n\t\t\t\t}\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\n\t\tfocusFirstAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\t// In case a NcActionButton is considered checked we will use this one as a initial focus\n\t\t\t\t// Having aria-checked is the simplest way to determine the checked state of a button\n\t\t\t\t// TODO: determine when we need to focus the first checked item and when we not, for example, if menu has many radio groups\n\t\t\t\tconst firstCheckedIndex = [...this.getFocusableMenuItemElements()].findIndex((button) => {\n\t\t\t\t\treturn button.getAttribute('aria-checked') === 'true' && button.getAttribute('role') === 'menuitemradio'\n\t\t\t\t})\n\t\t\t\tthis.focusIndex = firstCheckedIndex > -1 ? firstCheckedIndex : 0\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\n\t\tfocusLastAction(event) {\n\t\t\tif (this.opened) {\n\t\t\t\tthis.preventIfEvent(event)\n\t\t\t\tthis.focusIndex = this.getFocusableMenuItemElements().length - 1\n\t\t\t\tthis.focusAction()\n\t\t\t}\n\t\t},\n\n\t\tpreventIfEvent(event) {\n\t\t\tif (event) {\n\t\t\t\tevent.preventDefault()\n\t\t\t\tevent.stopPropagation()\n\t\t\t}\n\t\t},\n\n\t\tonFocus(event) {\n\t\t\tthis.$emit('focus', event)\n\t\t},\n\n\t\tonBlur(event) {\n\t\t\tthis.$emit('blur', event)\n\n\t\t\t// When there is no focusable elements to handle Tab press from actions menu\n\t\t\t// It requires manual closing\n\t\t\tif (this.actionsMenuSemanticType === 'tooltip') {\n\t\t\t\t// Tooltip is supposed to have no focusable element.\n\t\t\t\t// However, if there is a custom focusable element, it will be auto-focused and cause the menu to be closed on open.\n\t\t\t\tif (this.$refs.menu && this.getFocusableMenuItemElements().length === 0) {\n\t\t\t\t\tthis.closeMenu(false)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\n\t\tonClick(event) {\n\t\t\t/**\n\t\t\t * Event emitted when the menu toggle button is clicked.\n\t\t\t *\n\t\t\t * This is e.g. necessary for the NcAvatar component\n\t\t\t * which needs to fetch the menu items on click.\n\t\t\t *\n\t\t\t * @type {PointerEvent}\n\t\t\t */\n\t\t\tthis.$emit('click', event)\n\t\t},\n\t},\n\n\t/**\n\t * The render function to display the component\n\t *\n\t * @return {object|undefined} The created VNode\n\t */\n\trender() {\n\t\tconst actions = []\n\t\t// We have to iterate over all slot elements\n\t\tconst findActions = (vnodes, actions) => {\n\t\t\tvnodes.forEach((vnode) => {\n\t\t\t\tif (this.isAction(vnode)) {\n\t\t\t\t\tactions.push(vnode)\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// If we encounter a Fragment, we have to check its children too\n\t\t\t\tif (vnode.type === Fragment) {\n\t\t\t\t\tfindActions(vnode.children, actions)\n\t\t\t\t}\n\t\t\t})\n\t\t}\n\t\tfindActions(this.$slots.default?.(), actions)\n\n\t\t// Check that we have at least one action\n\t\tif (actions.length === 0) {\n\t\t\treturn\n\t\t}\n\n\t\t/**\n\t\t * Separate the actions into inline and menu actions\n\t\t */\n\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tlet validInlineActions = actions.filter(this.isValidSingleAction)\n\t\tif (this.forceMenu && validInlineActions.length > 0 && this.inline > 0) {\n\t\t\twarn('Specifying forceMenu will ignore any inline actions rendering.')\n\t\t\tvalidInlineActions = []\n\t\t}\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tconst inlineActions = validInlineActions.slice(0, this.inline)\n\t\t/**\n\t\t * @type {import('vue').VNode[]}\n\t\t */\n\t\tconst menuActions = actions.filter((action) => !inlineActions.includes(action))\n\n\t\t/**\n\t\t * Determine what kind of menu we have.\n\t\t * It defines keyboard navigation and a11y.\n\t\t */\n\n\t\tconst menuItemsActions = ['NcActionButton', 'NcActionButtonGroup', 'NcActionCheckbox', 'NcActionRadio']\n\t\tconst textInputActions = ['NcActionInput', 'NcActionTextEditable']\n\t\tconst linkActions = ['NcActionLink', 'NcActionRouter']\n\n\t\tconst hasTextInputAction = menuActions.some((action) => textInputActions.includes(this.getActionName(action)))\n\t\tconst hasMenuItemAction = menuActions.some((action) => menuItemsActions.includes(this.getActionName(action)))\n\t\tconst hasLinkAction = menuActions.some((action) => linkActions.includes(this.getActionName(action)))\n\n\t\tif (hasTextInputAction) {\n\t\t\tthis.actionsMenuSemanticType = 'dialog'\n\t\t} else if (hasMenuItemAction) {\n\t\t\tthis.actionsMenuSemanticType = 'menu'\n\t\t} else if (hasLinkAction) {\n\t\t\tthis.actionsMenuSemanticType = 'navigation'\n\t\t} else {\n\t\t\t// (!) Hotfix (!)\n\t\t\t// In Vue 2 it is not easy to search for NcAction* in sub-component of a slot.\n\t\t\t// When a menu is rendered, children are not mounted yet.\n\t\t\t// If we have NcActions > MyActionsList > NcActionButton, only MyActionsList's vnode is available.\n\t\t\t// So when NcActions has actions as non-direct children, here then we don't know about them.\n\t\t\t// Like this menu has no buttons/links/inputs.\n\t\t\t// It makes the menu incorrectly considered a tooltip.\n\t\t\tconst ncActions = actions.filter((action) => this.getActionName(action).startsWith('NcAction'))\n\t\t\tif (ncActions.length === actions.length) {\n\t\t\t\t// True tooltip\n\t\t\t\tthis.actionsMenuSemanticType = 'tooltip'\n\t\t\t} else {\n\t\t\t\t// Custom components are passed to the NcActions\n\t\t\t\tthis.actionsMenuSemanticType = 'unknown'\n\t\t\t}\n\t\t}\n\n\t\t/**\n\t\t * Render the provided action\n\t\t *\n\t\t * @param {import('vue').VNode} action the action to render\n\t\t * @return {Function} the vue render function\n\t\t */\n\t\tconst renderInlineAction = (action) => {\n\t\t\tconst iconProp = action?.props?.icon\n\t\t\tconst icon = action?.children?.icon?.()?.[0] ?? (\n\t\t\t\tthis.isIconUrl(iconProp)\n\t\t\t\t\t? h('img', { class: 'action-item__menutoggle__icon', src: iconProp, alt: '' })\n\t\t\t\t\t: h('span', { class: ['icon', iconProp] })\n\t\t\t)\n\t\t\tconst text = action?.children?.default?.()?.[0]?.children?.trim()\n\t\t\tconst buttonText = this.forceName ? text : ''\n\n\t\t\tlet title = action?.props?.title\n\t\t\t// Show a default title for single actions if none is present\n\t\t\tif (!(this.forceName || title)) {\n\t\t\t\ttitle = text\n\t\t\t}\n\n\t\t\tconst propsToForward = { ...(action?.props ?? {}) }\n\t\t\tconst type = ['submit', 'reset'].includes(propsToForward.type) ? propsToForward.modelValue : 'button'\n\t\t\t// not available on NcButton or with different meaning\n\t\t\tdelete propsToForward.modelValue\n\t\t\tdelete propsToForward.type\n\n\t\t\treturn h(\n\t\t\t\tNcButton,\n\t\t\t\tmergeProps(\n\t\t\t\t\tpropsToForward,\n\t\t\t\t\t{\n\t\t\t\t\t\tclass: 'action-item action-item--single',\n\t\t\t\t\t\t'aria-label': action?.props?.['aria-label'] || text,\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tdisabled: this.disabled || action?.props?.disabled,\n\t\t\t\t\t\tpressed: action?.props?.modelValue,\n\t\t\t\t\t\tsize: this.size,\n\t\t\t\t\t\ttype,\n\t\t\t\t\t\t// If it has a menuName, we use a secondary button\n\t\t\t\t\t\tvariant: this.variant || (buttonText ? 'secondary' : 'tertiary'),\n\t\t\t\t\t\tonFocus: this.onFocus,\n\t\t\t\t\t\tonBlur: this.onBlur,\n\t\t\t\t\t\t// forward any pressed state from NcButton just like NcActionButton does\n\t\t\t\t\t\t'onUpdate:pressed': action?.props?.['onUpdate:modelValue'] ?? (() => {}),\n\t\t\t\t\t},\n\t\t\t\t),\n\t\t\t\t{\n\t\t\t\t\tdefault: () => buttonText,\n\t\t\t\t\ticon: () => icon,\n\t\t\t\t},\n\t\t\t)\n\t\t}\n\n\t\t/**\n\t\t * Render the actions popover\n\t\t *\n\t\t * @param {Array} actions the actions to render within\n\t\t * @return {Function} the vue render function\n\t\t */\n\t\tconst renderActionsPopover = (actions) => {\n\t\t\tconst triggerIcon = isSlotPopulated(this.$slots.icon?.())\n\t\t\t\t? this.$slots.icon?.()\n\t\t\t\t: (this.defaultIcon\n\t\t\t\t\t\t? h('span', { class: ['icon', this.defaultIcon] })\n\t\t\t\t\t\t: h(IconDotsHorizontal, { size: 20 })\n\t\t\t\t\t)\n\t\t\tconst triggerRandomId = `${this.randomId}-trigger`\n\t\t\treturn h(\n\t\t\t\tNcPopover,\n\t\t\t\t{\n\t\t\t\t\tref: 'popover',\n\t\t\t\t\tdelay: 0,\n\t\t\t\t\tshown: this.opened,\n\t\t\t\t\tplacement: this.placement,\n\t\t\t\t\tboundary: this.boundariesElement,\n\t\t\t\t\tautoBoundaryMaxSize: true,\n\t\t\t\t\tcontainer: this.container,\n\t\t\t\t\t...this.manualOpen && {\n\t\t\t\t\t\ttriggers: [],\n\t\t\t\t\t},\n\t\t\t\t\tnoCloseOnClickOutside: this.manualOpen,\n\t\t\t\t\tpopoverBaseClass: 'action-item__popper',\n\t\t\t\t\tpopupRole: this.config.popupRole,\n\t\t\t\t\tsetReturnFocus: this.config.withFocusTrap ? this.$refs.triggerButton?.$el : undefined,\n\t\t\t\t\tnoFocusTrap: !this.config.withFocusTrap,\n\t\t\t\t\t'onUpdate:shown': this.toggleMenu,\n\t\t\t\t\tonAfterShow: this.onOpened,\n\t\t\t\t\tonAfterClose: this.onClosed,\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\ttrigger: () => h(NcButton, {\n\t\t\t\t\t\tid: triggerRandomId,\n\t\t\t\t\t\tclass: 'action-item__menutoggle',\n\t\t\t\t\t\tdisabled: this.disabled,\n\t\t\t\t\t\tsize: this.size,\n\t\t\t\t\t\tvariant: this.triggerButtonVariant,\n\t\t\t\t\t\tref: 'triggerButton',\n\t\t\t\t\t\t'aria-label': this.menuName ? null : this.ariaLabel,\n\t\t\t\t\t\t// 'aria-controls' should only present together with a valid aria-haspopup\n\t\t\t\t\t\t'aria-controls': this.opened && this.config.popupRole ? this.randomId : null,\n\t\t\t\t\t\tonFocus: this.onFocus,\n\t\t\t\t\t\tonBlur: this.onBlur,\n\t\t\t\t\t\tonClick: this.onClick,\n\t\t\t\t\t\tonKeydown: this.onTriggerKeydown,\n\t\t\t\t\t}, {\n\t\t\t\t\t\ticon: () => triggerIcon,\n\t\t\t\t\t\tdefault: () => this.menuName,\n\t\t\t\t\t}),\n\t\t\t\t\tdefault: () => h('div', {\n\t\t\t\t\t\tclass: {\n\t\t\t\t\t\t\topen: this.opened,\n\t\t\t\t\t\t},\n\t\t\t\t\t\ttabindex: '-1',\n\t\t\t\t\t\tonKeydown: this.onKeydown,\n\t\t\t\t\t\tref: 'menu',\n\t\t\t\t\t}, [\n\t\t\t\t\t\th('ul', {\n\t\t\t\t\t\t\tid: this.randomId,\n\t\t\t\t\t\t\ttabindex: '-1',\n\t\t\t\t\t\t\tref: 'menuList',\n\t\t\t\t\t\t\trole: this.config.popupRole,\n\t\t\t\t\t\t\t// For most roles a label is required (dialog, menu), but also in general nothing speaks against labelling a list.\n\t\t\t\t\t\t\t// It is even recommended to do so.\n\t\t\t\t\t\t\t'aria-labelledby': triggerRandomId,\n\t\t\t\t\t\t\t'aria-modal': this.actionsMenuSemanticType === 'dialog' ? 'true' : undefined,\n\t\t\t\t\t\t}, [\n\t\t\t\t\t\t\tactions,\n\t\t\t\t\t\t]),\n\t\t\t\t\t]),\n\t\t\t\t},\n\t\t\t)\n\t\t}\n\n\t\t/**\n\t\t * If we have a single action only and didn't force a menu,\n\t\t * we render the action as a standalone button\n\t\t */\n\t\tif (actions.length === 1 && validInlineActions.length === 1 && !this.forceMenu) {\n\t\t\treturn renderInlineAction(actions[0])\n\t\t}\n\n\t\t// If we completely re-render the children\n\t\t// we need to focus the first action again\n\t\t// Mostly used when clicking a menu item\n\t\tthis.$nextTick(() => {\n\t\t\tif (this.opened && this.$refs.menu) {\n\t\t\t\tconst isAnyActive = this.$refs.menu.querySelector('li.active') || []\n\t\t\t\tif (isAnyActive.length === 0) {\n\t\t\t\t\tthis.focusFirstAction()\n\t\t\t\t}\n\t\t\t}\n\t\t})\n\n\t\t/**\n\t\t * If we some inline actions to render, render them, then the menu\n\t\t */\n\t\tif (inlineActions.length > 0 && this.inline > 0) {\n\t\t\treturn h(\n\t\t\t\t'div',\n\t\t\t\t{\n\t\t\t\t\tclass: [\n\t\t\t\t\t\t'action-items',\n\t\t\t\t\t\t`action-item--${this.triggerButtonVariant}`,\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t\t[\n\t\t\t\t\t// Render inline actions\n\t\t\t\t\t...inlineActions.map(renderInlineAction),\n\t\t\t\t\t// render the rest within the popover menu\n\t\t\t\t\tmenuActions.length > 0\n\t\t\t\t\t\t? h(\n\t\t\t\t\t\t\t\t'div',\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tclass: [\n\t\t\t\t\t\t\t\t\t\t'action-item',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'action-item--open': this.opened,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t[renderActionsPopover(menuActions)],\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t: null,\n\t\t\t\t],\n\t\t\t)\n\t\t}\n\n\t\t/**\n\t\t * Otherwise, we render the actions in a popover\n\t\t */\n\t\treturn h(\n\t\t\t'div',\n\t\t\t{\n\t\t\t\tclass: [\n\t\t\t\t\t'action-item action-item--default-popover',\n\t\t\t\t\t`action-item--${this.triggerButtonVariant}`,\n\t\t\t\t\t{\n\t\t\t\t\t\t'action-item--open': this.opened,\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t},\n\t\t\t[\n\t\t\t\trenderActionsPopover(actions),\n\t\t\t],\n\t\t)\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n// Inline buttons\n.action-items {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: calc($icon-margin / 2);\n}\n\n.action-item {\n\t--open-background-color: var(--color-background-hover, $action-background-hover);\n\tposition: relative;\n\tdisplay: inline-block;\n\n\t&.action-item--primary {\n\t\t--open-background-color: var(--color-primary-element-hover);\n\t}\n\n\t&.action-item--secondary {\n\t\t--open-background-color: var(--color-primary-element-light-hover);\n\t}\n\n\t&.action-item--error {\n\t\t--open-background-color: var(--color-error-hover);\n\t}\n\n\t&.action-item--warning {\n\t\t--open-background-color: var(--color-warning-hover);\n\t}\n\n\t&.action-item--success {\n\t\t--open-background-color: var(--color-success-hover);\n\t}\n\n\t&.action-item--tertiary-no-background {\n\t\t--open-background-color: transparent;\n\t}\n\n\t&.action-item--open .action-item__menutoggle {\n\t\tbackground-color: var(--open-background-color);\n\t}\n\n\t&__menutoggle__icon {\n\t\twidth: 20px;\n\t\theight: 20px;\n\t\tobject-fit: contain;\n\t}\n}\n</style>\n\n<style lang=\"scss\">\n// We overwrote the popover base class, so we can style\n// the popover__inner for actions only.\n.v-popper--theme-nc-popover-9.v-popper__popper.action-item__popper .v-popper__wrapper {\n\tborder-radius: var(--border-radius-element);\n\n\t.v-popper__inner {\n\t\tborder-radius: var(--border-radius-element);\n\t\tpadding: 4px;\n\t\tmax-height: calc(100vh - var(--header-height));\n\t\toverflow: auto;\n\t}\n}\n</style>\n"],"names":["_sfc_main","_createElementBlock","_mergeProps","_createElementVNode","_openBlock","actions"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/chunks/NcAppNavigation-Bb9-C2eO.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"NcAppNavigation-Bb9-C2eO.mjs","sources":["../../src/components/NcAppNavigation/NcAppNavigationToggle.vue","../../src/components/NcAppNavigation/NcAppNavigation.vue"],"sourcesContent":["<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n  -->\n\n<script setup lang=\"ts\">\nimport { mdiMenu, mdiMenuOpen } from '@mdi/js'\nimport { computed } from 'vue'\nimport NcIconSvgWrapper from '../NcIconSvgWrapper/NcIconSvgWrapper.vue'\nimport { t } from '../../l10n.ts'\nimport NcButton from '../NcButton/index.ts'\n\n/**\n * Tracks whether the toggle has been clicked or not.\n * If it has been clicked, switches between the different MenuIcons\n * and emits a boolean indicating its opened status\n */\nconst open = defineModel<boolean>('open', { required: true })\n\nconst title = computed(() => open.value ? t('Close navigation') : t('Open navigation'))\n</script>\n\n<template>\n\t<div class=\"app-navigation-toggle-wrapper\">\n\t\t<NcButton\n\t\t\tclass=\"app-navigation-toggle\"\n\t\t\taria-controls=\"app-navigation-vue\"\n\t\t\t:aria-expanded=\"open ? 'true' : 'false'\"\n\t\t\t:aria-label=\"title\"\n\t\t\t:title\n\t\t\tvariant=\"tertiary\"\n\t\t\t@click=\"open = !open\">\n\t\t\t<template #icon>\n\t\t\t\t<NcIconSvgWrapper :path=\"open ? mdiMenuOpen : mdiMenu\" />\n\t\t\t</template>\n\t\t</NcButton>\n\t</div>\n</template>\n\n<style scoped lang=\"scss\">\n.app-navigation-toggle-wrapper {\n\tposition: absolute;\n\ttop: var(--app-navigation-padding);\n\tinset-inline-end: calc(0px - var(--app-navigation-padding));\n\tmargin-inline-end: calc(-1 * var(--default-clickable-area));\n}\n\nbutton.app-navigation-toggle {\n\tbackground-color: var(--color-main-background);\n}\n</style>\n","<!--\n  - SPDX-FileCopyrightText: 2019 Nextcloud GmbH and Nextcloud contributors\n  - SPDX-License-Identifier: AGPL-3.0-or-later\n-->\n\n<docs>\n```vue\n<template>\n\t<div class=\"styleguide-nc-content\">\n\t\t<NcAppNavigation>\n\t\t\t<template #search>\n\t\t\t\t<div class=\"navigation__header\">\n\t\t\t\t\t<NcAppNavigationSearch v-model=\"searchValue\" label=\"Search …\" />\n\t\t\t\t\t<NcActions>\n\t\t\t\t\t\t<NcActionButton close-after-click @click=\"showModal = true\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<IconCogOutline />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\tApp settings (close after click)\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t\t<NcActionButton @click=\"showModal = true\">\n\t\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t\t<IconCogOutline />\n\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\tApp settings (handle only click)\n\t\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t</NcActions>\n\t\t\t\t</div>\n\t\t\t</template>\n\t\t\t<template #list>\n\t\t\t\t<NcAppNavigationItem v-for=\"item in items\" :key=\"item\" :name=\"item\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<IconCheck :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcAppNavigationItem>\n\t\t\t</template>\n\t\t\t<template #footer>\n\t\t\t\t<div class=\"navigation__footer\">\n\t\t\t\t\t<NcButton wide @click=\"showModal = true\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<IconCogOutline />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tApp settings\n\t\t\t\t\t</NcButton>\n\t\t\t\t\t<NcModal v-if=\"showModal\" name=\"Modal for focus-trap check\" @close=\"showModal = false\">\n\t\t\t\t\t\t<div class=\"modal-content\">\n\t\t\t\t\t\t\t<h4>Focus-trap should be locked inside the modal</h4>\n\t\t\t\t\t\t\t<NcTextField v-model=\"modalValue\" label=\"Focus me\" />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</NcModal>\n\t\t\t\t</div>\n\t\t\t</template>\n\t\t</NcAppNavigation>\n\t</div>\n</template>\n\n<script>\n\timport IconCheck from 'vue-material-design-icons/Check'\n\timport IconCogOutline from 'vue-material-design-icons/CogOutline'\n\n\texport default {\n\t\tcomponents: {\n\t\t\tIconCheck,\n\t\t\tIconCogOutline,\n\t\t},\n\t\tprovide() {\n\t\t\treturn {\n\t\t\t\t'NcContent:setHasAppNavigation': () => {},\n\t\t\t}\n\t\t},\n\t\tdata() {\n\t\t\treturn {\n\t\t\t\titems: Array.from({ length: 5 }, (v, i) => `Item ${i+1}`),\n\t\t\t\tsearchValue: '',\n\t\t\t\tmodalValue: '',\n\t\t\t\tshowModal: false,\n\t\t\t}\n\t\t},\n\t}\n</script>\n\n<style scoped>\n\t/* Mock NcContent */\n\t.styleguide-nc-content {\n\t\tposition: relative;\n\t\theight: 300px;\n\t\tbackground-color: var(--color-background-plain);\n\t\toverflow: hidden;\n\t}\n\n\t.navigation__header,\n\t.navigation__footer {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 4px;\n\t\tpadding: 4px;\n\t}\n\n\t.modal-content {\n\t\theight: 120px;\n\t\tpadding: 10px;\n\t}\n</style>\n```\n\nThe navigation bar can be open and closed from anywhere in the app using the\nnextcloud event bus.\n\n### Install the event bus package\n\n```bash\nnpm i -S @nextcloud/event-bus\n```\n\n### Usage\n\n#### Open the navigation\n\n```js static\nimport { emit } from '@nextcloud/event-bus'\nemit('toggle-navigation', {\n\topen: true,\n})\n```\n\n#### Close the navigation\n\n```js static\nimport { emit } from '@nextcloud/event-bus'\nemit('toggle-navigation', {\n\topen: false,\n})\n```\n\n</docs>\n\n<script setup lang=\"ts\">\nimport type { FocusTrap } from 'focus-trap'\nimport type { Slot } from 'vue'\n\nimport { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'\nimport { createFocusTrap } from 'focus-trap'\nimport { inject, onMounted, onUnmounted, ref, useTemplateRef, warn, watch, watchEffect } from 'vue'\nimport NcAppNavigationList from '../NcAppNavigationList/NcAppNavigationList.vue'\nimport NcAppNavigationToggle from './NcAppNavigationToggle.vue'\nimport { useIsMobile } from '../../composables/useIsMobile/index.ts'\nimport { getTrapStack } from '../../utils/focusTrap.ts'\nimport { isLegacy34 } from '../../utils/legacy.ts'\nimport { HAS_APP_NAVIGATION_KEY } from '../NcContent/constants.ts'\n\nconst props = defineProps<{\n\t/**\n\t * The aria label to describe the navigation\n\t */\n\tariaLabel?: string\n\n\t/**\n\t * aria-labelledby attribute to describe the navigation\n\t */\n\tariaLabelledby?: string\n}>()\n\ndefineSlots<{\n\t/**\n\t * The main content of the navigation.\n\t * If no list is passed to the `#list` slot, stretched vertically.\n\t */\n\tdefault?: Slot\n\t/**\n\t * Footer for e.g. `NcAppNavigationSettings`\n\t */\n\tfooter?: Slot\n\t/**\n\t * List for Navigation list items.\n\t * Stretched between the main content and the footer\n\t */\n\tlist?: Slot\n\t/**\n\t * For in-app search you can pass a `NcAppNavigationSearch` component as the slot content.\n\t */\n\tsearch?: Slot\n}>()\n\nlet focusTrap: FocusTrap\nconst setHasAppNavigation = inject(\n\tHAS_APP_NAVIGATION_KEY,\n\t() => warn('NcAppNavigation is not mounted inside NcContent, this is probably an error.'),\n\tfalse,\n)\n\nconst appNavigationContainerElement = useTemplateRef('appNavigationContainer')\nconst isMobile = useIsMobile()\nconst open = ref(!isMobile.value)\n\nwatchEffect(() => {\n\tif (!props.ariaLabel && !props.ariaLabelledby) {\n\t\twarn('NcAppNavigation requires either `ariaLabel` or `ariaLabelledby` to be set for accessibility.')\n\t}\n})\n\nwatch(isMobile, () => {\n\topen.value = !isMobile.value\n})\n\nwatch(open, () => {\n\ttoggleFocusTrap()\n})\n\nonMounted(() => {\n\tsetHasAppNavigation(true)\n\tsubscribe('toggle-navigation', toggleNavigationByEventBus)\n\t// Emit an event with the initial state of the navigation\n\temit('navigation-toggled', {\n\t\topen: open.value,\n\t})\n\n\tfocusTrap = createFocusTrap(appNavigationContainerElement.value!, {\n\t\tallowOutsideClick: true,\n\t\tclickOutsideDeactivates: () => {\n\t\t\tif (isMobile.value) {\n\t\t\t\tfocusTrap.deactivate({ returnFocus: false })\n\t\t\t\ttoggleNavigation(false)\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\tfallbackFocus: appNavigationContainerElement.value!,\n\t\ttrapStack: getTrapStack(),\n\t\tescapeDeactivates: false,\n\t})\n\ttoggleFocusTrap()\n})\n\nonUnmounted(() => {\n\tsetHasAppNavigation(false)\n\tunsubscribe('toggle-navigation', toggleNavigationByEventBus)\n\tfocusTrap.deactivate()\n})\n\n/**\n * Toggle the navigation\n *\n * @param state set the state instead of inverting the current one\n */\nfunction toggleNavigation(state?: boolean): void {\n\t// Early return if already in that state\n\tif (open.value === state) {\n\t\temit('navigation-toggled', {\n\t\t\topen: open.value,\n\t\t})\n\t\treturn\n\t}\n\n\topen.value = state === undefined ? !open.value : state\n\tconst bodyStyles = getComputedStyle(document.body)\n\tconst animationLength = parseInt(bodyStyles.getPropertyValue('--animation-quick')) || 100\n\n\tsetTimeout(() => {\n\t\temit('navigation-toggled', {\n\t\t\topen: open.value,\n\t\t})\n\t// We wait for 1.5 times the animation length to give the animation time to really finish.\n\t}, 1.5 * animationLength)\n}\n\n/**\n * Handler for the event-bus navigation event.\n *\n * @param context - The event bus context\n * @param context.open - The new navigation open state\n */\nfunction toggleNavigationByEventBus({ open }: { open: boolean }): void {\n\treturn toggleNavigation(open)\n}\n\n/**\n * Activate focus trap if it is currently needed, otherwise deactivate\n */\nfunction toggleFocusTrap(): void {\n\tif (isMobile.value && open.value) {\n\t\tfocusTrap.activate()\n\t} else {\n\t\tfocusTrap.deactivate()\n\t}\n}\n\n/**\n * Handle hotkey for closing the navigation.\n */\nfunction handleEsc(): void {\n\tif (isMobile.value) {\n\t\ttoggleNavigation(false)\n\t}\n}\n</script>\n\n<template>\n\t<div\n\t\tref=\"appNavigationContainer\"\n\t\tclass=\"app-navigation\"\n\t\t:class=\"{\n\t\t\t'app-navigation--closed': !open,\n\t\t\t'app-navigation--legacy': isLegacy34,\n\t\t}\">\n\t\t<nav\n\t\t\tid=\"app-navigation-vue\"\n\t\t\t:aria-hidden=\"open ? 'false' : 'true'\"\n\t\t\t:aria-label=\"ariaLabel || undefined\"\n\t\t\t:aria-labelledby=\"ariaLabelledby || undefined\"\n\t\t\tclass=\"app-navigation__content\"\n\t\t\t:inert=\"!open || undefined\"\n\t\t\t@keydown.esc=\"handleEsc\">\n\t\t\t<div class=\"app-navigation__search\">\n\t\t\t\t<slot name=\"search\" />\n\t\t\t</div>\n\n\t\t\t<div class=\"app-navigation__body\" :class=\"{ 'app-navigation__body--no-list': !$slots.list }\">\n\t\t\t\t<slot />\n\t\t\t</div>\n\n\t\t\t<NcAppNavigationList v-if=\"$slots.list\" class=\"app-navigation__list\">\n\t\t\t\t<slot name=\"list\" />\n\t\t\t</NcAppNavigationList>\n\n\t\t\t<slot name=\"footer\" />\n\t\t</nav>\n\t\t<NcAppNavigationToggle :open @update:open=\"toggleNavigation\" />\n\t</div>\n</template>\n\n<style lang=\"scss\">\n.app-navigation,\n.app-content {\n\t/** Distance of the app navigation toggle and the first navigation item to the top edge of the app content container */\n\t--app-navigation-padding: #{$app-navigation-padding};\n}\n</style>\n\n<style lang=\"scss\" scoped>\n.app-navigation {\n\t// Set scoped variable override\n\t// Using --color-text-maxcontrast as a fallback evaluates to an invalid value as it references itself in this scope instead of the variable defined higher up\n\t--color-text-maxcontrast: var(--color-text-maxcontrast-background-blur, var(--color-text-maxcontrast-default));\n\ttransition: transform var(--animation-quick), margin var(--animation-quick);\n\twidth: $navigation-width;\n\t// Left toggle button padding + toggle button + right padding from NcAppContent\n\t--app-navigation-max-width: calc(100vw - (var(--app-navigation-padding) + var(--default-clickable-area) + var(--default-grid-baseline)));\n\tmax-width: var(--app-navigation-max-width);\n\tposition: relative;\n\ttop: 0;\n\tinset-inline-start: 0;\n\tpadding: 0px;\n\t// Above NcAppContent\n\tz-index: 1800;\n\theight: 100%;\n\t-webkit-user-select: none;\n\t-moz-user-select: none;\n\t-ms-user-select: none;\n\tuser-select: none;\n\tflex-grow: 0;\n\tflex-shrink: 0;\n\t// New design (NC34+): transparent so the frosted chrome on NcContent shows through.\n\tbackground-color: transparent;\n\n\t&--legacy {\n\t\tbackground-color: var(--color-main-background-blur, var(--color-main-background));\n\t\tbackdrop-filter: var(--filter-background-blur, none);\n\t}\n\n\t&--closed {\n\t\tmargin-inline-start: calc(-1 * min($navigation-width, var(--app-navigation-max-width)));\n\t}\n\n\t&__search {\n\t\twidth: 100%;\n\t}\n\n\t&__body {\n\t\toverflow-y: scroll;\n\t}\n\n\t// For legacy purposes support passing a bare list to the content in #default slot and including #footer slot\n\t// Same styles as NcAppNavigationList\n\t&__content > ul {\n\t\tposition: relative;\n\t\twidth: 100%;\n\t\toverflow-x: hidden;\n\t\toverflow-y: auto;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tgap: var(--default-grid-baseline, 4px);\n\t\tpadding: var(--app-navigation-padding);\n\t}\n\n\t// Always stretch the navigation list\n\t& &__list {\n\t\theight: 100%;\n\t}\n\n\t// Stretch the main content if there is no stretched list\n\t&__body--no-list {\n\t\tflex: 1 1 auto;\n\t\toverflow: auto;\n\t\theight: 100%;\n\t}\n\n\t&__content {\n\t\theight: 100%;\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t}\n}\n\n// Add extra border for high contrast mode\n[data-themes*=\"highcontrast\"] {\n\t.app-navigation {\n\t\tborder-inline-end: 1px solid var(--color-border);\n\t}\n}\n\n// When on mobile, we make the navigation slide over the NcAppContent\n@media only screen and (width < $breakpoint-mobile) {\n\t.app-navigation {\n\t\tposition: absolute;\n\t\tborder-inline-end: 1px solid var(--color-border);\n\t\tbackground-color: var(--color-main-background-blur, var(--color-main-background));\n\t\tbackdrop-filter: var(--filter-background-blur, none);\n\t}\n}\n\n// Put the toggle behind NcAppSidebar on small screens\n@media only screen and (max-width: $breakpoint-small-mobile) {\n\t.app-navigation {\n\t\tz-index: 1400;\n\t}\n}\n\n</style>\n"],"names":["_useModel","_openBlock","_createElementBlock","_hoisted_1","_createVNode","_unref","open","_createElementVNode","_renderSlot","_normalizeClass","$slots","_createBlock"],"mappings":"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"}