@nextcloud/vue 8.4.0 → 8.5.1

package/dist/Components/NcBreadcrumbs.mjs

@@ -1,422 +1,4 @@
-import "../assets/index-f5162bbd.css";
-import L from "./NcActions.mjs";
-import y from "./NcActionButton.mjs";
-import B from "./NcActionRouter.mjs";
-import O from "./NcActionLink.mjs";
-import w from "./NcBreadcrumb.mjs";
-import m from "vue";
-import { subscribe as R, unsubscribe as W } from "@nextcloud/event-bus";
-import { n as g } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
-import z from "debounce";
-import { Fragment as D } from "vue-frag";
-/**
- * @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @author John Molakvoæ <skjnldsv@protonmail.com>
- *
- * @license AGPL-3.0-or-later
- *
- * This program is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, either version 3 of the
- * License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program. If not, see <http://www.gnu.org/licenses/>.
- *
- */
-const b = (t, e, s) => {
-  if (t !== void 0)
-    for (let n = t.length - 1; n >= 0; n--) {
-      const a = t[n], r = !a.componentOptions && a.tag && e.indexOf(a.tag) === -1, i = !!a.componentOptions && typeof a.componentOptions.tag == "string", c = i && e.indexOf(a.componentOptions.tag) === -1;
-      (r || !i || c) && ((r || c) && m.util.warn(`${r ? a.tag : a.componentOptions.tag} is not allowed inside the ${s.$options.name} component`, s), t.splice(n, 1));
-    }
-}, I = {
-  name: "FolderIcon",
-  emits: ["click"],
-  props: {
-    title: {
-      type: String
-    },
-    fillColor: {
-      type: String,
-      default: "currentColor"
-    },
-    size: {
-      type: Number,
-      default: 24
-    }
-  }
-};
-var N = function() {
-  var e = this, s = e._self._c;
-  return s("span", e._b({ staticClass: "material-design-icon folder-icon", attrs: { "aria-hidden": !e.title, "aria-label": e.title, role: "img" }, on: { click: function(n) {
-    return e.$emit("click", n);
-  } } }, "span", e.$attrs, !1), [s("svg", { staticClass: "material-design-icon__svg", attrs: { fill: e.fillColor, width: e.size, height: e.size, viewBox: "0 0 24 24" } }, [s("path", { attrs: { d: "M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z" } }, [e.title ? s("title", [e._v(e._s(e.title))]) : e._e()])])]);
-}, C = [], A = /* @__PURE__ */ g(
-  I,
-  N,
-  C,
-  !1,
-  null,
-  null,
-  null,
-  null
-);
-const E = A.exports;
-const o = "vue-crumb", x = {
-  name: "NcBreadcrumbs",
-  components: {
-    NcActions: L,
-    NcActionButton: y,
-    NcActionRouter: B,
-    NcActionLink: O,
-    NcBreadcrumb: w,
-    IconFolder: E
-  },
-  props: {
-    /**
-     * Set a css icon-class for the icon of the root breadcrumb to be used.
-     */
-    rootIcon: {
-      type: String,
-      default: "icon-home"
-    },
-    /**
-     * Set the aria-label of the nav element.
-     */
-    ariaLabel: {
-      type: String,
-      default: null
-    }
-  },
-  emits: ["dropped"],
-  data() {
-    return {
-      /**
-       * Array to track the hidden breadcrumbs by their index.
-       * Comparing two crumbs somehow does not work, so we use the indices.
-       */
-      hiddenIndices: [],
-      /**
-       * This is the props of the middle Action menu
-       * that show the ellipsised breadcrumbs
-       */
-      menuBreadcrumbProps: {
-        // Don't show a name for this breadcrumb, only the Actions menu
-        name: "",
-        forceMenu: !0,
-        // Don't allow dropping directly on the actions breadcrumb
-        disableDrop: !0,
-        // Is the menu open or not
-        open: !1
-      },
-      breadcrumbsRefs: {}
-    };
-  },
-  beforeMount() {
-    b(this.$slots.default, ["NcBreadcrumb"], this);
-  },
-  beforeUpdate() {
-    b(this.$slots.default, ["NcBreadcrumb"], this);
-  },
-  created() {
-    window.addEventListener("resize", z(() => {
-      this.handleWindowResize();
-    }, 100)), R("navigation-toggled", this.delayedResize);
-  },
-  mounted() {
-    this.handleWindowResize();
-  },
-  updated() {
-    this.delayedResize(), this.$nextTick(() => {
-      this.hideCrumbs();
-    });
-  },
-  beforeDestroy() {
-    window.removeEventListener("resize", this.handleWindowResize), W("navigation-toggled", this.delayedResize);
-  },
-  methods: {
-    /**
-     * Close the actions menu
-     *
-     * @param {object} e The event
-     */
-    closeActions(t) {
-      this.$refs.actionsBreadcrumb.$el.contains(t.relatedTarget) || (this.menuBreadcrumbProps.open = !1);
-    },
-    /**
-     * Call the resize function after a delay
-     */
-    async delayedResize() {
-      await this.$nextTick(), this.handleWindowResize();
-    },
-    /**
-     * Check the width of the breadcrumb and hide breadcrumbs
-     * if we overflow otherwise.
-     */
-    handleWindowResize() {
-      var l;
-      if (!this.$refs.container)
-        return;
-      const t = Object.values(this.breadcrumbsRefs), e = t.length, s = [], n = this.$refs.container.offsetWidth;
-      let a = this.getTotalWidth(t);
-      this.$refs.breadcrumb__actions && (a += this.$refs.breadcrumb__actions.offsetWidth);
-      let r = a - n;
-      r += r > 0 ? 64 : 0;
-      let i = 0;
-      const c = Math.floor(e / 2);
-      for (; r > 0 && i < e - 2; ) {
-        const d = c + (i % 2 ? i + 1 : i) / 2 * Math.pow(-1, i + e % 2);
-        r -= this.getWidth((l = t[d]) == null ? void 0 : l.elm), s.push(d), i++;
-      }
-      this.arraysEqual(this.hiddenIndices, s.sort((d, u) => d - u)) || (this.hiddenIndices = s);
-    },
-    /**
-     * Checks if two arrays are equal.
-     * Only works for primitive arrays, but that's enough here.
-     *
-     * @param {Array} a The first array
-     * @param {Array} b The second array
-     * @return {boolean} Wether the arrays are equal
-     */
-    arraysEqual(t, e) {
-      if (t.length !== e.length)
-        return !1;
-      if (t === e)
-        return !0;
-      if (t === null || e === null)
-        return !1;
-      for (let s = 0; s < t.length; ++s)
-        if (t[s] !== e[s])
-          return !1;
-      return !0;
-    },
-    /**
-     * Calculates the total width of all breadcrumbs
-     *
-     * @param {Array} breadcrumbs All breadcrumbs
-     * @return {number} The total width
-     */
-    getTotalWidth(t) {
-      return t.reduce((e, s, n) => e + this.getWidth(s == null ? void 0 : s.elm), 0);
-    },
-    /**
-     * Calculates the width of the provided element
-     *
-     * @param {object} el The element
-     * @return {number} The width
-     */
-    getWidth(t) {
-      if (!(t != null && t.classList))
-        return 0;
-      const e = t.classList.contains(`${o}--hidden`);
-      t.style.minWidth = "auto", t.classList.remove(`${o}--hidden`);
-      const s = t.offsetWidth;
-      return e && t.classList.add(`${o}--hidden`), t.style.minWidth = "", s;
-    },
-    /**
-     * Prevents the default of a provided event
-     *
-     * @param {object} e The event
-     * @return {boolean}
-     */
-    preventDefault(t) {
-      return t.preventDefault && t.preventDefault(), !1;
-    },
-    /**
-     * Handles the drag start.
-     * Prevents a breadcrumb from being draggable.
-     *
-     * @param {object} e The event
-     * @return {boolean}
-     */
-    dragStart(t) {
-      return this.preventDefault(t);
-    },
-    /**
-     * Handles when something is dropped on the breadcrumb.
-     *
-     * @param {object} e The drop event
-     * @param {string} path The path of the breadcrumb
-     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
-     * @return {boolean}
-     */
-    dropped(t, e, s) {
-      return s || this.$emit("dropped", t, e), this.menuBreadcrumbProps.open = !1, document.querySelectorAll(`.${o}`).forEach((a) => {
-        a.classList.remove(`${o}--hovered`);
-      }), this.preventDefault(t);
-    },
-    /**
-     * Handles the drag over event
-     *
-     * @param {object} e The drag over event
-     * @return {boolean}
-     */
-    dragOver(t) {
-      return this.preventDefault(t);
-    },
-    /**
-     * Handles the drag enter event
-     *
-     * @param {object} e The drag over event
-     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
-     */
-    dragEnter(t, e) {
-      if (!e && t.target.closest) {
-        const s = t.target.closest(`.${o}`);
-        s.classList && s.classList.contains(o) && (document.querySelectorAll(`.${o}`).forEach((a) => {
-          a.classList.remove(`${o}--hovered`);
-        }), s.classList.add(`${o}--hovered`));
-      }
-    },
-    /**
-     * Handles the drag leave event
-     *
-     * @param {object} e The drag leave event
-     * @param {boolean} disabled Whether dropping is disabled for this breadcrumb
-     */
-    dragLeave(t, e) {
-      if (!e && !t.target.contains(t.relatedTarget) && t.target.closest) {
-        const s = t.target.closest(`.${o}`);
-        if (s.contains(t.relatedTarget))
-          return;
-        s.classList && s.classList.contains(o) && s.classList.remove(`${o}--hovered`);
-      }
-    },
-    /**
-     * Check for each crumb if we have to hide it and
-     * add it to the array of all crumbs.
-     */
-    hideCrumbs() {
-      Object.values(this.breadcrumbsRefs).forEach((e, s) => {
-        var n;
-        (n = e == null ? void 0 : e.elm) != null && n.classList && (this.hiddenIndices.includes(s) ? e.elm.classList.add(`${o}--hidden`) : e.elm.classList.remove(`${o}--hidden`));
-      });
-    },
-    isBreadcrumb(t) {
-      var e;
-      return (((e = t == null ? void 0 : t.componentOptions) == null ? void 0 : e.tag) || (t == null ? void 0 : t.tag) || "").includes("NcBreadcrumb");
-    }
-  },
-  /**
-   * The render function to display the component
-   *
-   * @param {Function} h The function to create VNodes
-   * @return {object|undefined} The created VNode
-   */
-  render(t) {
-    const e = [];
-    if (this.$slots.default.forEach((r) => {
-      var i, c;
-      if (this.isBreadcrumb(r)) {
-        e.push(r);
-        return;
-      }
-      (r == null ? void 0 : r.type) === D && ((c = (i = r == null ? void 0 : r.children) == null ? void 0 : i.forEach) == null || c.call(i, (l) => {
-        this.isBreadcrumb(l) && e.push(l);
-      }));
-    }), e.length === 0)
-      return;
-    m.set(e[0].componentOptions.propsData, "icon", this.rootIcon), m.set(e[0].componentOptions.propsData, "ref", "breadcrumbs");
-    const s = {};
-    e.forEach((r, i) => {
-      m.set(r, "ref", `crumb-${i}`), s[i] = r;
-    });
-    let n = [];
-    if (!this.hiddenIndices.length)
-      n = e;
-    else {
-      n = e.slice(0, Math.round(e.length / 2)), n.push(
-        t("NcBreadcrumb", {
-          class: "dropdown",
-          props: this.menuBreadcrumbProps,
-          attrs: {
-            // Hide the dropdown menu from screen-readers,
-            // since the crumbs in the menu are still in the list.
-            "aria-hidden": !0
-          },
-          // Add a ref to the Actions menu
-          ref: "actionsBreadcrumb",
-          key: "actions-breadcrumb-1",
-          // Add handlers so the Actions menu opens on hover
-          nativeOn: {
-            dragstart: this.dragStart,
-            dragenter: () => {
-              this.menuBreadcrumbProps.open = !0;
-            },
-            dragleave: this.closeActions
-          },
-          on: {
-            // Make sure we keep the same open state
-            // as the Actions component
-            "update:open": (i) => {
-              this.menuBreadcrumbProps.open = i;
-            }
-          }
-          // Add all hidden breadcrumbs as ActionRouter or ActionLink
-        }, this.hiddenIndices.map((i) => {
-          const c = e[i], l = c.componentOptions.propsData.to, d = c.componentOptions.propsData.href, u = c.componentOptions.propsData.disableDrop, _ = c.componentOptions.propsData.title, $ = c.componentOptions.propsData.name;
-          let h = "NcActionButton", f = "";
-          d && (h = "NcActionLink", f = d), l && (h = "NcActionRouter", f = l);
-          const v = t("IconFolder", {
-            props: {
-              size: 20
-            },
-            slot: "icon"
-          });
-          return t(
-            h,
-            {
-              class: o,
-              props: {
-                href: d || null,
-                title: _,
-                to: l || null
-              },
-              // Prevent the breadcrumbs from being draggable
-              attrs: {
-                draggable: !1
-              },
-              on: {
-                ...c.componentOptions.listeners
-              },
-              // Add the drag and drop handlers
-              nativeOn: {
-                dragstart: this.dragStart,
-                drop: (p) => this.dropped(p, f, u),
-                dragover: this.dragOver,
-                dragenter: (p) => this.dragEnter(p, u),
-                dragleave: (p) => this.dragLeave(p, u)
-              }
-            },
-            [v, $]
-          );
-        }))
-      );
-      const r = e.slice(Math.round(e.length / 2));
-      n = n.concat(r);
-    }
-    const a = [t("nav", { attrs: { "aria-label": this.ariaLabel } }, [t("ul", { class: "breadcrumb__crumbs" }, [n])])];
-    return this.$slots.actions && a.push(t("div", { class: "breadcrumb__actions", ref: "breadcrumb__actions" }, this.$slots.actions)), this.breadcrumbsRefs = s, t("div", { class: ["breadcrumb", { "breadcrumb--collapsed": this.hiddenIndices.length === e.length - 2 }], ref: "container" }, a);
-  }
-}, S = null, k = null;
-var F = /* @__PURE__ */ g(
-  x,
-  S,
-  k,
-  !1,
-  null,
-  "50e21eb2",
-  null,
-  null
-);
-const K = F.exports;
+import { N as f } from "../chunks/NcBreadcrumbs-tq1eD4Hk.mjs";
 export {
-  K as default
+  f as default
 };

package/dist/Components/NcBreadcrumbs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NcBreadcrumbs.mjs","sources":["../../src/utils/ValidateSlot.js","../../node_modules/vue-material-design-icons/Folder.vue","../../src/components/NcBreadcrumbs/NcBreadcrumbs.vue"],"sourcesContent":["/**\n * @copyright Copyright (c) 2018 John Molakvoæ <skjnldsv@protonmail.com>\n *\n * @author John Molakvoæ <skjnldsv@protonmail.com>\n *\n * @license AGPL-3.0-or-later\n *\n * This program is free software: you can redistribute it and/or modify\n * it under the terms of the GNU Affero General Public License as\n * published by the Free Software Foundation, either version 3 of the\n * License, or (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU Affero General Public License for more details.\n *\n * You should have received a copy of the GNU Affero General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n *\n */\nimport Vue from 'vue'\n\n/**\n * Validate children of a vue component\n *\n * @param {object[]} slots the vue component slot\n * @param {string[]} allowed the allowed components name\n * @param {object} vm the vue component instance\n */\nconst ValidateSlot = (slots, allowed, vm) => {\n\tif (slots === undefined) {\n\t\treturn\n\t}\n\n\tfor (let index = slots.length - 1; index >= 0; index--) {\n\t\tconst node = slots[index]\n\t\t// also check against allowed to avoid uninitiated vnodes with no componentOptions\n\t\tconst isHtmlElement = !node.componentOptions && node.tag && allowed.indexOf(node.tag) === -1\n\t\tconst isVueComponent = !!node.componentOptions && typeof node.componentOptions.tag === 'string'\n\t\tconst isForbiddenComponent = isVueComponent && allowed.indexOf(node.componentOptions.tag) === -1\n\n\t\t// if html element or not a vue component or vue component not in allowed tags\n\t\tif (isHtmlElement || !isVueComponent || isForbiddenComponent) {\n\t\t\t// only warn when html elment or forbidden component\n\t\t\t// sometimes text nodes are present which are hardly removeable by the developer and spam the warnings\n\t\t\tif (isHtmlElement || isForbiddenComponent) {\n\t\t\t\tVue.util.warn(`${isHtmlElement ? node.tag : node.componentOptions.tag} is not allowed inside the ${vm.$options.name} component`, vm)\n\t\t\t}\n\n\t\t\t// cleanup\n\t\t\tslots.splice(index, 1)\n\t\t}\n\t}\n}\n\nexport default ValidateSlot\n","<template>\n  <span v-bind=\"$attrs\"\n        :aria-hidden=\"!title\"\n        :aria-label=\"title\"\n        class=\"material-design-icon folder-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=\"M10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z\">\n        <title v-if=\"title\">{{ title }}</title>\n      </path>\n    </svg>\n  </span>\n</template>\n\n<script>\nexport default {\n  name: \"FolderIcon\",\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 - @copyright Copyright (c) 2020 Raimund Schlüßler <raimund.schluessler@mailbox.org>\n -\n - @author Raimund Schlüßler <raimund.schluessler@mailbox.org>\n -\n - @license GNU AGPL version 3 or any later version\n -\n - This program is free software: you can redistribute it and/or modify\n - it under the terms of the GNU Affero General Public License as\n - published by the Free Software Foundation, either version 3 of the\n - License, or (at your option) any later version.\n -\n - This program is distributed in the hope that it will be useful,\n - but WITHOUT ANY WARRANTY; without even the implied warranty of\n - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n - GNU Affero General Public License for more details.\n -\n - You should have received a copy of the GNU Affero General Public License\n - along with this program. If not, see <http://www.gnu.org/licenses/>.\n -\n -->\n\n<docs>\n\n### General description\n\nThis component renders a breadcrumb bar. It adjusts to the available width\nby hiding breadcrumbs in a dropdown menu and emits an event when something\nis dropped on a creadcrumb.\n\n### Usage\n\n```vue\n<template>\n\t<div>\n\t\t<div class=\"container\">\n\t\t\t<NcBreadcrumbs @dropped=\"dropped\">\n\t\t\t\t<NcBreadcrumb name=\"Home\"\n\t\t\t\t\ttitle=\"Title of the Home folder\"\n\t\t\t\t\thref=\"/\"\n\t\t\t\t\t@dropped=\"droppedOnCrumb\">\n\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t<Folder :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t</NcBreadcrumb>\n\t\t\t\t<NcBreadcrumb name=\"Folder 1\"\n\t\t\t\t\ttitle=\"Folder 1\"\n\t\t\t\t\thref=\"/Folder 1\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 2\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2\"\n\t\t\t\t\t:disable-drop=\"true\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 3\"\n\t\t\t\t\ttitle=\"Folder 3\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 4\"\n\t\t\t\t\ttitle=\"Folder 4\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3/Folder 4\" />\n\t\t\t\t<NcBreadcrumb name=\"Folder 5\"\n\t\t\t\t\ttitle=\"Folder 5\"\n\t\t\t\t\thref=\"/Folder 1/Folder 2/Folder 3/Folder 4/Folder 5\"\n\t\t\t\t\t:disable-drop=\"true\">\n\t\t\t\t\t<template #menu-icon>\n\t\t\t\t\t\t<MenuDown :size=\"20\" />\n\t\t\t\t\t</template>\n\t\t\t\t\t<NcActionButton @click=\"alert('Share')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<ShareVariant :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tShare\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t\t<NcActionButton @click=\"alert('Download')\">\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Download :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tDownload\n\t\t\t\t\t</NcActionButton>\n\t\t\t\t</NcBreadcrumb>\n\t\t\t\t<template #actions>\n\t\t\t\t\t<NcButton>\n\t\t\t\t\t\t<template #icon>\n\t\t\t\t\t\t\t<Plus :size=\"20\" />\n\t\t\t\t\t\t</template>\n\t\t\t\t\t\tNew\n\t\t\t\t\t</NcButton>\n\t\t\t\t</template>\n\t\t\t</NcBreadcrumbs>\n\t\t</div>\n\t\t<br />\n\t\t<div class=\"dragme\" draggable=\"true\" @dragstart=\"dragStart\">\n\t\t\t<span>Drag me onto the breadcrumbs.</span>\n\t\t</div>\n\t</div>\n</template>\n\n<script>\nimport Download from 'vue-material-design-icons/Download'\nimport Folder from 'vue-material-design-icons/Folder'\nimport MenuDown from 'vue-material-design-icons/MenuDown'\nimport Plus from 'vue-material-design-icons/Plus'\nimport ShareVariant from 'vue-material-design-icons/ShareVariant'\n\nexport default {\n\tcomponents: {\n\t\tDownload,\n\t\tFolder,\n\t\tMenuDown,\n\t\tPlus,\n\t\tShareVariant,\n\t},\n\tmethods: {\n\t\tdropped(e, path) {\n\t\t\talert('Global drop on ' + path)\n\t\t},\n\t\tdroppedOnCrumb(e, path) {\n\t\t\talert('Drop on crumb ' + path)\n\t\t},\n\t\tdragStart(e) {\n\t\t\te.dataTransfer.setData('text/plain', 'dragging')\n\t\t},\n\t}\n}\n</script>\n<style>\n.container {\n\tdisplay: inline-flex;\n\twidth: 100%;\n}\n\n.dragme {\n\tdisplay: block;\n\twidth: 100px;\n\theight: 44px;\n\tbackground-color: var(--color-background-dark);\n}\n</style>\n```\n</docs>\n\n<script>\nimport NcActions from '../NcActions/index.js'\nimport NcActionButton from '../NcActionButton/index.js'\nimport NcActionRouter from '../NcActionRouter/index.js'\nimport NcActionLink from '../NcActionLink/index.js'\nimport NcBreadcrumb from '../NcBreadcrumb/index.js'\nimport ValidateSlot from '../../utils/ValidateSlot.js'\n\nimport { subscribe, unsubscribe } from '@nextcloud/event-bus'\n\nimport IconFolder from 'vue-material-design-icons/Folder.vue'\n\nimport debounce from 'debounce'\nimport Vue from 'vue'\nimport { Fragment } from 'vue-frag'\n\nconst crumbClass = 'vue-crumb'\n\nexport default {\n\tname: 'NcBreadcrumbs',\n\tcomponents: {\n\t\tNcActions,\n\t\tNcActionButton,\n\t\tNcActionRouter,\n\t\tNcActionLink,\n\t\tNcBreadcrumb,\n\t\tIconFolder,\n\t},\n\tprops: {\n\t\t/**\n\t\t * Set a css icon-class for the icon of the root breadcrumb to be used.\n\t\t */\n\t\trootIcon: {\n\t\t\ttype: String,\n\t\t\tdefault: 'icon-home',\n\t\t},\n\n\t\t/**\n\t\t * Set the aria-label of the nav element.\n\t\t */\n\t\tariaLabel: {\n\t\t\ttype: String,\n\t\t\tdefault: null,\n\t\t},\n\t},\n\temits: ['dropped'],\n\tdata() {\n\t\treturn {\n\t\t\t/**\n\t\t\t * Array to track the hidden breadcrumbs by their index.\n\t\t\t * Comparing two crumbs somehow does not work, so we use the indices.\n\t\t\t */\n\t\t\thiddenIndices: [],\n\n\t\t\t/**\n\t\t\t * This is the props of the middle Action menu\n\t\t\t * that show the ellipsised breadcrumbs\n\t\t\t */\n\t\t\tmenuBreadcrumbProps: {\n\t\t\t\t// Don't show a name for this breadcrumb, only the Actions menu\n\t\t\t\tname: '',\n\t\t\t\tforceMenu: true,\n\t\t\t\t// Don't allow dropping directly on the actions breadcrumb\n\t\t\t\tdisableDrop: true,\n\t\t\t\t// Is the menu open or not\n\t\t\t\topen: false,\n\t\t\t},\n\t\t\tbreadcrumbsRefs: {},\n\t\t}\n\t},\n\tbeforeMount() {\n\t\t// Filter all invalid items, only Breadcrumb components are allowed\n\t\tValidateSlot(this.$slots.default, ['NcBreadcrumb'], this)\n\t},\n\tbeforeUpdate() {\n\t\t// Also check before every update\n\t\tValidateSlot(this.$slots.default, ['NcBreadcrumb'], this)\n\t},\n\tcreated() {\n\t\t/**\n\t\t * Add a listener so the component reacts on resize\n\t\t */\n\t\twindow.addEventListener('resize', debounce(() => {\n\t\t\tthis.handleWindowResize()\n\t\t}, 100))\n\t\tsubscribe('navigation-toggled', this.delayedResize)\n\t},\n\tmounted() {\n\t\tthis.handleWindowResize()\n\t},\n\tupdated() {\n\t\t/**\n\t\t * Check the size on update\n\t\t */\n\t\tthis.delayedResize()\n\t\t/**\n\t\t * Check that crumbs to hide are hidden\n\t\t */\n\t\tthis.$nextTick(() => {\n\t\t\tthis.hideCrumbs()\n\t\t})\n\t},\n\tbeforeDestroy() {\n\t\twindow.removeEventListener('resize', this.handleWindowResize)\n\t\tunsubscribe('navigation-toggled', this.delayedResize)\n\t},\n\tmethods: {\n\t\t/**\n\t\t * Close the actions menu\n\t\t *\n\t\t * @param {object} e The event\n\t\t */\n\t\tcloseActions(e) {\n\t\t\t// Don't do anything if we leave towards a child element.\n\t\t\tif (this.$refs.actionsBreadcrumb.$el.contains(e.relatedTarget)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\tthis.menuBreadcrumbProps.open = false\n\t\t},\n\t\t/**\n\t\t * Call the resize function after a delay\n\t\t */\n\t\t async delayedResize() {\n\t\t\tawait this.$nextTick()\n\t\t\tthis.handleWindowResize()\n\t\t},\n\t\t/**\n\t\t * Check the width of the breadcrumb and hide breadcrumbs\n\t\t * if we overflow otherwise.\n\t\t */\n\t\thandleWindowResize() {\n\t\t\t// If there is no container yet, we cannot determine its size\n\t\t\tif (!this.$refs.container) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// All breadcrumb components passed into the default slot\n\t\t\tconst breadcrumbs = Object.values(this.breadcrumbsRefs)\n\n\t\t\tconst nrCrumbs = breadcrumbs.length\n\t\t\tconst hiddenIndices = []\n\t\t\tconst availableWidth = this.$refs.container.offsetWidth\n\t\t\tlet totalWidth = this.getTotalWidth(breadcrumbs)\n\t\t\t// If we have breadcumbs actions, we have to take their width into account too.\n\t\t\tif (this.$refs.breadcrumb__actions) {\n\t\t\t\ttotalWidth += this.$refs.breadcrumb__actions.offsetWidth\n\t\t\t}\n\t\t\tlet overflow = totalWidth - availableWidth\n\t\t\t// If we overflow, we have to take the action-item width into account as well.\n\t\t\toverflow += (overflow > 0) ? 64 : 0\n\t\t\tlet i = 0\n\t\t\t// We start hiding the breadcrumb in the center\n\t\t\tconst startIndex = Math.floor(nrCrumbs / 2)\n\t\t\t// Don't hide the first and last breadcrumb\n\t\t\twhile (overflow > 0 && i < nrCrumbs - 2) {\n\t\t\t\t// We hide elements alternating to the left and right\n\t\t\t\tconst currentIndex = startIndex + ((i % 2) ? i + 1 : i) / 2 * Math.pow(-1, i + (nrCrumbs % 2))\n\t\t\t\t// Calculate the remaining overflow width after hiding this breadcrumb\n\t\t\t\toverflow -= this.getWidth(breadcrumbs[currentIndex]?.elm)\n\t\t\t\thiddenIndices.push(currentIndex)\n\t\t\t\ti++\n\t\t\t}\n\t\t\t// We only update the hidden crumbs if they have changed,\n\t\t\t// otherwise we will run into an infinite update loop.\n\t\t\tif (!this.arraysEqual(this.hiddenIndices, hiddenIndices.sort((a, b) => a - b))) {\n\t\t\t\tthis.hiddenIndices = hiddenIndices\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Checks if two arrays are equal.\n\t\t * Only works for primitive arrays, but that's enough here.\n\t\t *\n\t\t * @param {Array} a The first array\n\t\t * @param {Array} b The second array\n\t\t * @return {boolean} Wether the arrays are equal\n\t\t */\n\t\tarraysEqual(a, b) {\n\t\t\tif (a.length !== b.length) return false\n\t\t\tif (a === b) return true\n\t\t\tif (a === null || b === null) return false\n\n\t\t\tfor (let i = 0; i < a.length; ++i) {\n\t\t\t\tif (a[i] !== b[i]) {\n\t\t\t\t\treturn false\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn true\n\t\t},\n\t\t/**\n\t\t * Calculates the total width of all breadcrumbs\n\t\t *\n\t\t * @param {Array} breadcrumbs All breadcrumbs\n\t\t * @return {number} The total width\n\t\t */\n\t\tgetTotalWidth(breadcrumbs) {\n\t\t\treturn breadcrumbs.reduce((width, crumb, index) => width + this.getWidth(crumb?.elm), 0)\n\t\t},\n\t\t/**\n\t\t * Calculates the width of the provided element\n\t\t *\n\t\t * @param {object} el The element\n\t\t * @return {number} The width\n\t\t */\n\t\tgetWidth(el) {\n\t\t\tif (!el?.classList) return 0\n\t\t\tconst hide = el.classList.contains(`${crumbClass}--hidden`)\n\t\t\tel.style.minWidth = 'auto'\n\t\t\tel.classList.remove(`${crumbClass}--hidden`)\n\t\t\tconst w = el.offsetWidth\n\t\t\tif (hide) {\n\t\t\t\tel.classList.add(`${crumbClass}--hidden`)\n\t\t\t}\n\t\t\tel.style.minWidth = ''\n\t\t\treturn w\n\t\t},\n\t\t/**\n\t\t * Prevents the default of a provided event\n\t\t *\n\t\t * @param {object} e The event\n\t\t * @return {boolean}\n\t\t */\n\t\tpreventDefault(e) {\n\t\t\tif (e.preventDefault) {\n\t\t\t\te.preventDefault()\n\t\t\t}\n\t\t\treturn false\n\t\t},\n\t\t/**\n\t\t * Handles the drag start.\n\t\t * Prevents a breadcrumb from being draggable.\n\t\t *\n\t\t * @param {object} e The event\n\t\t * @return {boolean}\n\t\t */\n\t\tdragStart(e) {\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles when something is dropped on the breadcrumb.\n\t\t *\n\t\t * @param {object} e The drop event\n\t\t * @param {string} path The path of the breadcrumb\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t * @return {boolean}\n\t\t */\n\t\tdropped(e, path, disabled) {\n\t\t\t/**\n\t\t\t * Don't emit if dropping is disabled.\n\t\t\t */\n\t\t\tif (!disabled) {\n\t\t\t\t/**\n\t\t\t\t * Event emitted when something is dropped on the breadcrumb.\n\t\t\t\t *\n\t\t\t\t * @param {Event} e the drop DOM event\n\t\t\t\t * @param {string} path The path of the breadcrumb\n\t\t\t\t */\n\t\t\t\tthis.$emit('dropped', e, path)\n\t\t\t}\n\t\t\t// Close the actions menu after the drop\n\t\t\tthis.menuBreadcrumbProps.open = false\n\n\t\t\t// Remove all hovering classes\n\t\t\tconst crumbs = document.querySelectorAll(`.${crumbClass}`)\n\t\t\tcrumbs.forEach((f) => { f.classList.remove(`${crumbClass}--hovered`) })\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles the drag over event\n\t\t *\n\t\t * @param {object} e The drag over event\n\t\t * @return {boolean}\n\t\t */\n\t\tdragOver(e) {\n\t\t\treturn this.preventDefault(e)\n\t\t},\n\t\t/**\n\t\t * Handles the drag enter event\n\t\t *\n\t\t * @param {object} e The drag over event\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t */\n\t\tdragEnter(e, disabled) {\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (disabled) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Get the correct element, in case we hover a child.\n\t\t\tif (e.target.closest) {\n\t\t\t\tconst target = e.target.closest(`.${crumbClass}`)\n\t\t\t\tif (target.classList && target.classList.contains(crumbClass)) {\n\t\t\t\t\tconst crumbs = document.querySelectorAll(`.${crumbClass}`)\n\t\t\t\t\tcrumbs.forEach((f) => { f.classList.remove(`${crumbClass}--hovered`) })\n\t\t\t\t\ttarget.classList.add(`${crumbClass}--hovered`)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Handles the drag leave event\n\t\t *\n\t\t * @param {object} e The drag leave event\n\t\t * @param {boolean} disabled Whether dropping is disabled for this breadcrumb\n\t\t */\n\t\tdragLeave(e, disabled) {\n\t\t\t/**\n\t\t\t * Don't do anything if dropping is disabled.\n\t\t\t */\n\t\t\tif (disabled) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Don't do anything if we leave towards a child element.\n\t\t\tif (e.target.contains(e.relatedTarget)) {\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// Get the correct element, in case we leave directly from a child.\n\t\t\tif (e.target.closest) {\n\t\t\t\tconst target = e.target.closest(`.${crumbClass}`)\n\t\t\t\tif (target.contains(e.relatedTarget)) {\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\tif (target.classList && target.classList.contains(crumbClass)) {\n\t\t\t\t\ttarget.classList.remove(`${crumbClass}--hovered`)\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t/**\n\t\t * Check for each crumb if we have to hide it and\n\t\t * add it to the array of all crumbs.\n\t\t */\n\t\thideCrumbs() {\n\t\t\tconst crumbs = Object.values(this.breadcrumbsRefs)\n\t\t\tcrumbs.forEach((crumb, i) => {\n\t\t\t\tif (crumb?.elm?.classList) {\n\t\t\t\t\tif (this.hiddenIndices.includes(i)) {\n\t\t\t\t\t\tcrumb.elm.classList.add(`${crumbClass}--hidden`)\n\t\t\t\t\t} else {\n\t\t\t\t\t\tcrumb.elm.classList.remove(`${crumbClass}--hidden`)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t})\n\t\t},\n\n\t\tisBreadcrumb(vnode) {\n\t\t\treturn (vnode?.componentOptions?.tag || vnode?.tag || '').includes('NcBreadcrumb')\n\t\t},\n\t},\n\t/**\n\t * The render function to display the component\n\t *\n\t * @param {Function} h The function to create VNodes\n\t * @return {object|undefined} The created VNode\n\t */\n\trender(h) {\n\t\t// Get the breadcrumbs\n\t\tconst breadcrumbs = []\n\t\t// We have to iterate over all slot elements\n\t\tthis.$slots.default.forEach(vnode => {\n\t\t\tif (this.isBreadcrumb(vnode)) {\n\t\t\t\tbreadcrumbs.push(vnode)\n\t\t\t\treturn\n\t\t\t}\n\t\t\t// If we encounter a Fragment, we have to check its children too\n\t\t\tif (vnode?.type === Fragment) {\n\t\t\t\tvnode?.children?.forEach?.(child => {\n\t\t\t\t\tif (this.isBreadcrumb(child)) {\n\t\t\t\t\t\tbreadcrumbs.push(child)\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t}\n\t\t})\n\n\t\t// Check that we have at least one breadcrumb\n\t\tif (breadcrumbs.length === 0) {\n\t\t\treturn\n\t\t}\n\n\t\t// Add the root icon to the first breadcrumb\n\t\t// eslint-disable-next-line import/no-named-as-default-member\n\t\tVue.set(breadcrumbs[0].componentOptions.propsData, 'icon', this.rootIcon)\n\t\t// eslint-disable-next-line import/no-named-as-default-member\n\t\tVue.set(breadcrumbs[0].componentOptions.propsData, 'ref', 'breadcrumbs')\n\n\t\t/**\n\t\t * Use a proxy object to store breadcrumbs refs\n\t\t * and don't write to this.breadcrumbsRefs directly\n\t\t * to not trigger a myriad of re-renders.\n\t\t */\n\t\tconst breadcrumbsRefs = {}\n\t\t// Add the breadcrumbs to the array of the created VNodes, check if hiding them is necessary.\n\t\tbreadcrumbs.forEach((crumb, index) => {\n\t\t\t// eslint-disable-next-line import/no-named-as-default-member\n\t\t\tVue.set(crumb, 'ref', `crumb-${index}`)\n\t\t\tbreadcrumbsRefs[index] = crumb\n\t\t})\n\n\t\t// The array of all created VNodes\n\t\tlet crumbs = []\n\n\t\tif (!this.hiddenIndices.length) {\n\t\t\t// We don't hide any breadcrumbs.\n\t\t\tcrumbs = breadcrumbs\n\t\t} else {\n\t\t\t/**\n\t\t\t * We show the first half of the breadcrumbs before the Actions dropdown menu\n\t\t\t * which shows the hidden breadcrumbs.\n\t\t\t */\n\t\t\t// Add the breadcrumbs to the array of the created VNodes, check if hiding them is necessary.\n\t\t\tcrumbs = breadcrumbs.slice(0, Math.round(breadcrumbs.length / 2))\n\n\t\t\t// The Actions menu\n\t\t\t// Use a breadcrumb component for the hidden breadcrumbs\n\t\t\tcrumbs.push(h('NcBreadcrumb', {\n\t\t\t\tclass: 'dropdown',\n\n\t\t\t\tprops: this.menuBreadcrumbProps,\n\n\t\t\t\tattrs: {\n\t\t\t\t\t// Hide the dropdown menu from screen-readers,\n\t\t\t\t\t// since the crumbs in the menu are still in the list.\n\t\t\t\t\t'aria-hidden': true,\n\t\t\t\t},\n\n\t\t\t\t// Add a ref to the Actions menu\n\t\t\t\tref: 'actionsBreadcrumb',\n\t\t\t\tkey: 'actions-breadcrumb-1',\n\t\t\t\t// Add handlers so the Actions menu opens on hover\n\t\t\t\tnativeOn: {\n\t\t\t\t\tdragstart: this.dragStart,\n\t\t\t\t\tdragenter: () => { this.menuBreadcrumbProps.open = true },\n\t\t\t\t\tdragleave: this.closeActions,\n\t\t\t\t},\n\t\t\t\ton: {\n\t\t\t\t\t// Make sure we keep the same open state\n\t\t\t\t\t// as the Actions component\n\t\t\t\t\t'update:open': (open) => {\n\t\t\t\t\t\tthis.menuBreadcrumbProps.open = open\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t// Add all hidden breadcrumbs as ActionRouter or ActionLink\n\t\t\t}, this.hiddenIndices.map(index => {\n\t\t\t\tconst crumb = breadcrumbs[index]\n\t\t\t\t// Get the parameters from the breadcrumb component props\n\t\t\t\tconst to = crumb.componentOptions.propsData.to\n\t\t\t\tconst href = crumb.componentOptions.propsData.href\n\t\t\t\tconst disabled = crumb.componentOptions.propsData.disableDrop\n\t\t\t\tconst title = crumb.componentOptions.propsData.title\n\t\t\t\tconst name = crumb.componentOptions.propsData.name\n\n\t\t\t\t// Decide whether to show the breadcrumbs as ActionButton, ActionRouter or ActionLink\n\t\t\t\tlet element = 'NcActionButton'\n\t\t\t\tlet path = ''\n\t\t\t\tif (href) {\n\t\t\t\t\telement = 'NcActionLink'\n\t\t\t\t\tpath = href\n\t\t\t\t}\n\t\t\t\tif (to) {\n\t\t\t\t\telement = 'NcActionRouter'\n\t\t\t\t\tpath = to\n\t\t\t\t}\n\t\t\t\tconst folderIcon = h('IconFolder', {\n\t\t\t\t\tprops: {\n\t\t\t\t\t\tsize: 20,\n\t\t\t\t\t},\n\t\t\t\t\tslot: 'icon',\n\t\t\t\t})\n\t\t\t\treturn h(element, {\n\t\t\t\t\tclass: crumbClass,\n\t\t\t\t\tprops: {\n\t\t\t\t\t\thref: href || null,\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tto: to || null,\n\t\t\t\t\t},\n\t\t\t\t\t// Prevent the breadcrumbs from being draggable\n\t\t\t\t\tattrs: {\n\t\t\t\t\t\tdraggable: false,\n\t\t\t\t\t},\n\t\t\t\t\ton: {\n\t\t\t\t\t\t...crumb.componentOptions.listeners,\n\t\t\t\t\t},\n\t\t\t\t\t// Add the drag and drop handlers\n\t\t\t\t\tnativeOn: {\n\t\t\t\t\t\tdragstart: this.dragStart,\n\t\t\t\t\t\tdrop: ($event) => this.dropped($event, path, disabled),\n\t\t\t\t\t\tdragover: this.dragOver,\n\t\t\t\t\t\tdragenter: ($event) => this.dragEnter($event, disabled),\n\t\t\t\t\t\tdragleave: ($event) => this.dragLeave($event, disabled),\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t\t[folderIcon, name],\n\t\t\t\t)\n\t\t\t})),\n\t\t\t)\n\n\t\t\t// The second half of the breadcrumbs\n\t\t\tconst crumbs2 = breadcrumbs.slice(Math.round(breadcrumbs.length / 2))\n\t\t\tcrumbs = crumbs.concat(crumbs2)\n\t\t}\n\n\t\tconst wrapper = [h('nav', { attrs: { 'aria-label': this.ariaLabel } }, [h('ul', { class: 'breadcrumb__crumbs' }, [crumbs])])]\n\t\t// Append the actions slot if it is populated\n\t\tif (this.$slots.actions) {\n\t\t\twrapper.push(h('div', { class: 'breadcrumb__actions', ref: 'breadcrumb__actions' }, this.$slots.actions))\n\t\t}\n\n\t\tthis.breadcrumbsRefs = breadcrumbsRefs\n\n\t\treturn h('div', { class: ['breadcrumb', { 'breadcrumb--collapsed': (this.hiddenIndices.length === breadcrumbs.length - 2) }], ref: 'container' }, wrapper)\n\t},\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.breadcrumb {\n\twidth: 100%;\n\tflex-grow: 1;\n\tdisplay: inline-flex;\n\talign-items: center;\n\n\t&--collapsed  :deep(.vue-crumb:last-child) {\n\t\tmin-width: 100px;\n\t\tflex-shrink: 1;\n\t}\n\n\tnav {\n\t\tflex-shrink: 1;\n\t\tmin-width: 0;\n\t}\n\n\t& #{&}__crumbs {\n\t\tmax-width: 100%;\n\t}\n\n\t& #{&}__crumbs,\n\t& #{&}__actions {\n\t\tdisplay: inline-flex;\n\t}\n}\n</style>\n"],"names":["ValidateSlot","slots","allowed","vm","index","node","isHtmlElement","isVueComponent","isForbiddenComponent","Vue","_sfc_main$1","crumbClass","_sfc_main","NcActions","NcActionButton","NcActionRouter","NcActionLink","NcBreadcrumb","IconFolder","debounce","subscribe","unsubscribe","e","breadcrumbs","nrCrumbs","hiddenIndices","availableWidth","totalWidth","overflow","startIndex","currentIndex","_a","a","b","i","width","crumb","el","hide","w","path","disabled","f","target","vnode","h","Fragment","_b","child","breadcrumbsRefs","crumbs","open","to","href","title","name","element","folderIcon","$event","crumbs2","wrapper"],"mappings":"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","x_google_ignoreList":[1]}
+{"version":3,"file":"NcBreadcrumbs.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/Components/NcButton.cjs

@@ -1,7 +1,12 @@
-var _ = require("../assets/index-f091e784.css");
-const h = require("../chunks/_plugin-vue2_normalizer-7f9efb60.cjs");
-const p = {
+var b = require("../assets/NcButton-4Wj3KJn8.css");
+const c = require("../chunks/_plugin-vue2_normalizer-DCfUPqga.cjs"), p = {
   name: "NcButton",
+  inject: {
+    getNcPopoverTriggerAttrs: {
+      from: "NcPopover:trigger:attrs",
+      default: () => () => ({})
+    }
+  },
   props: {
     /**
      * Set the text and icon alignment
@@ -105,6 +110,8 @@ const p = {
     /**
      * The pressed state of the button if it has a checked state
      * This will add the `aria-pressed` attribute and for the button to have the primary style in checked state.
+     *
+     * Pressed state is not supported for links
      */
     pressed: {
       type: Boolean,
@@ -131,6 +138,9 @@ const p = {
      */
     isReverseAligned() {
       return this.alignment.includes("-");
+    },
+    ncPopoverTriggerAttrs() {
+      return this.getNcPopoverTriggerAttrs();
     }
   },
   /**
@@ -140,25 +150,24 @@ const p = {
    * @return {object|undefined} The created VNode
    */
   render(t) {
-    var i, l, o;
-    const e = !!this.$slots.default, s = (i = this.$slots) == null ? void 0 : i.icon;
-    !e && !this.ariaLabel && console.warn(
+    const r = !!this.$slots.default, n = this.$slots?.icon;
+    !r && !this.ariaLabel && console.warn(
       "You need to fill either the text or the ariaLabel props in the button component.",
       {
-        text: (o = (l = this.$slots.default) == null ? void 0 : l[0]) == null ? void 0 : o.text,
+        text: this.$slots.default?.[0]?.text,
         ariaLabel: this.ariaLabel
       },
       this
     );
-    const r = ({ navigate: n, isActive: u, isExactActive: d } = {}) => t(
-      this.to || !this.href ? "button" : "a",
+    const e = this.to || this.href, s = !e && typeof this.pressed == "boolean", i = ({ href: o, navigate: a, isActive: u, isExactActive: d } = {}) => t(
+      e ? "a" : "button",
       {
         class: [
           "button-vue",
           {
-            "button-vue--icon-only": s && !e,
-            "button-vue--text-only": e && !s,
-            "button-vue--icon-and-text": s && e,
+            "button-vue--icon-only": n && !r,
+            "button-vue--text-only": r && !n,
+            "button-vue--icon-and-text": n && r,
             [`button-vue--vue-${this.realType}`]: this.realType,
             "button-vue--wide": this.wide,
             [`button-vue--${this.flexAlignment}`]: this.flexAlignment !== "center",
@@ -169,26 +178,29 @@ const p = {
         ],
         attrs: {
           "aria-label": this.ariaLabel,
-          "aria-pressed": this.pressed,
+          "aria-pressed": s ? this.pressed.toString() : void 0,
           disabled: this.disabled,
-          type: this.href ? null : this.nativeType,
-          role: this.href ? "button" : null,
-          href: !this.to && this.href ? this.href : null,
-          target: !this.to && this.href ? "_self" : null,
-          rel: !this.to && this.href ? "nofollow noreferrer noopener" : null,
+          type: e ? null : this.nativeType,
+          role: e ? "button" : null,
+          href: this.to ? o : this.href || null,
+          target: e ? "_self" : null,
+          rel: e ? "nofollow noreferrer noopener" : null,
           download: !this.to && this.href && this.download ? this.download : null,
+          // If this button is used as a popover trigger, we need to apply trigger attrs, e.g. aria attributes
+          ...this.ncPopoverTriggerAttrs,
+          // Inherit all the component attrs
           ...this.$attrs
         },
         on: {
           ...this.$listeners,
-          click: (a) => {
-            typeof this.pressed == "boolean" && this.$emit("update:pressed", !this.pressed), this.$emit("click", a), n == null || n(a);
+          click: (l) => {
+            s && this.$emit("update:pressed", !this.pressed), this.$emit("click", l), a?.(l);
           }
         }
       },
       [
         t("span", { class: "button-vue__wrapper" }, [
-          s ? t(
+          n ? t(
             "span",
             {
               class: "button-vue__icon",
@@ -198,7 +210,7 @@ const p = {
             },
             [this.$slots.icon]
           ) : null,
-          e ? t("span", { class: "button-vue__text" }, [this.$slots.default]) : null
+          r ? t("span", { class: "button-vue__text" }, [this.$slots.default]) : null
         ])
       ]
     );
@@ -209,20 +221,20 @@ const p = {
         exact: this.exact
       },
       scopedSlots: {
-        default: r
+        default: i
       }
-    }) : r();
+    }) : i();
   }
-}, c = null, f = null;
-var y = /* @__PURE__ */ h.normalizeComponent(
+}, h = null, f = null;
+var y = /* @__PURE__ */ c.normalizeComponent(
   p,
-  c,
+  h,
   f,
   !1,
   null,
-  "8f4e0666",
+  "fe3b5af5",
   null,
   null
 );
-const b = y.exports;
-module.exports = b;
+const g = y.exports;
+module.exports = g;