@nextcloud/vue 8.0.0-beta.7 → 8.0.0-beta.9

package/dist/Components/NcActions.mjs

@@ -1,104 +1,467 @@
-import "../assets/index-a4a40fa3.css";
-import _ from "./NcButton.mjs";
-import T from "./NcPopover.mjs";
-import { G as z } from "../chunks/GenRandomId-1e1b509a.mjs";
-import { t as P } from "../chunks/l10n-9a5a6afc.mjs";
-import K from "vue";
-import R from "vue-material-design-icons/DotsHorizontal.vue";
-import { n as V } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
-const y = ".focusable", j = { name: "NcActions", components: { NcButton: _, DotsHorizontal: R, NcPopover: T }, props: { open: { type: Boolean, default: !1 }, manualOpen: { type: Boolean, default: !1 }, forceMenu: { type: Boolean, default: !1 }, forceName: { type: Boolean, default: !1 }, menuName: { type: String, default: null }, primary: { type: Boolean, default: !1 }, type: { type: String, validator(e) {
-  return ["primary", "secondary", "tertiary", "tertiary-no-background", "tertiary-on-primary", "error", "warning", "success"].indexOf(e) !== -1;
-}, default: null }, defaultIcon: { type: String, default: "" }, ariaLabel: { type: String, default: P("Actions") }, ariaHidden: { type: Boolean, default: null }, placement: { type: String, default: "bottom" }, boundariesElement: { type: Element, default: () => document.querySelector("body") }, container: { type: [String, Object, Element, Boolean], default: "body" }, disabled: { type: Boolean, default: !1 }, inline: { type: Number, default: 0 } }, emits: ["open", "update:open", "close", "focus", "blur"], data() {
-  return { opened: this.open, focusIndex: 0, randomId: `menu-${z()}` };
-}, computed: { triggerBtnType() {
-  return this.type || (this.primary ? "primary" : this.menuName ? "secondary" : "tertiary");
-} }, watch: { open(e) {
-  e !== this.opened && (this.opened = e);
-} }, methods: { isValidSingleAction(e) {
-  var c, a, r, u, d;
-  const n = (d = (r = (a = (c = e == null ? void 0 : e.componentOptions) == null ? void 0 : c.Ctor) == null ? void 0 : a.extendOptions) == null ? void 0 : r.name) != null ? d : (u = e == null ? void 0 : e.componentOptions) == null ? void 0 : u.tag;
-  return ["NcActionButton", "NcActionLink", "NcActionRouter"].includes(n);
-}, openMenu(e) {
-  this.opened || (this.opened = !0, this.$emit("update:open", !0), this.$emit("open"));
-}, closeMenu(e = !0) {
-  this.opened && (this.opened = !1, this.$refs.popover.clearFocusTrap({ returnFocus: e }), this.$emit("update:open", !1), this.$emit("close"), this.focusIndex = 0, this.$refs.menuButton.$el.focus());
-}, onOpen(e) {
-  this.$nextTick(() => {
-    this.focusFirstAction(e);
-  });
-}, onMouseFocusAction(e) {
-  if (document.activeElement === e.target)
-    return;
-  const n = e.target.closest("li");
-  if (n) {
-    const c = n.querySelector(y);
-    if (c) {
-      const a = [...this.$refs.menu.querySelectorAll(y)].indexOf(c);
-      a > -1 && (this.focusIndex = a, this.focusAction());
+import "../assets/index-4b75fe20.css";
+import P from "./NcButton.mjs";
+import z from "./NcPopover.mjs";
+import { G as R } from "../chunks/GenRandomId-cb9ccebe.mjs";
+import { t as K } from "../chunks/l10n-05a09c66.mjs";
+import V from "vue";
+import G from "vue-material-design-icons/DotsHorizontal.vue";
+import { n as j } from "../chunks/_plugin-vue2_normalizer-71e2aa87.mjs";
+const a = ".focusable", W = {
+  name: "NcActions",
+  components: {
+    NcButton: P,
+    DotsHorizontal: G,
+    NcPopover: z
+  },
+  props: {
+    /**
+     * Specify the open state of the popover menu
+     */
+    open: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * This disables the internal open management,
+     * so the actions menu only respects the `open` prop.
+     * This is e.g. necessary for the NcAvatar component
+     * to only open the actions menu after loading it's entries has finished.
+     */
+    manualOpen: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Force the actions to display in a three dot menu
+     */
+    forceMenu: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Force the name to show for single actions
+     */
+    forceName: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Specify the menu name
+     */
+    menuName: {
+      type: String,
+      default: null
+    },
+    /**
+     * Apply primary styling for this menu
+     */
+    primary: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Specifies the button type used for trigger and single actions buttons
+     * Accepted values: primary, secondary, tertiary, tertiary-no-background, tertiary-on-primary, error, warning, success. If left empty,
+     * the default button style will be applied.
+     */
+    type: {
+      type: String,
+      validator(e) {
+        return ["primary", "secondary", "tertiary", "tertiary-no-background", "tertiary-on-primary", "error", "warning", "success"].indexOf(e) !== -1;
+      },
+      default: null
+    },
+    /**
+     * Icon to show for the toggle menu button
+     * when more than one action is inside the actions component.
+     * Only replace the default three-dot icon if really necessary.
+     */
+    defaultIcon: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Aria label for the actions menu.
+     *
+     * If `menuName` is defined this will not be used to prevent
+     * any accessible name conflicts. This ensures that the
+     * element can be activated via voice input.
+     */
+    ariaLabel: {
+      type: String,
+      default: K("Actions")
+    },
+    /**
+     * aria-hidden attribute for the icon slot
+     */
+    ariaHidden: {
+      type: Boolean,
+      default: null
+    },
+    /**
+     * Wanted direction of the menu
+     */
+    placement: {
+      type: String,
+      default: "bottom"
+    },
+    /**
+     * DOM element for the actions' popover boundaries
+     */
+    boundariesElement: {
+      type: Element,
+      default: () => document.querySelector("body")
+    },
+    /**
+     * Selector for the actions' popover container
+     */
+    container: {
+      type: [String, Object, Element, Boolean],
+      default: "body"
+    },
+    /**
+     * Disabled state of the main button (single action or menu toggle)
+     */
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    /**
+     * Display x items inline out of the dropdown menu
+     * Will be ignored if `forceMenu` is set
+     */
+    inline: {
+      type: Number,
+      default: 0
     }
+  },
+  emits: [
+    "open",
+    "update:open",
+    "close",
+    "focus",
+    "blur"
+  ],
+  data() {
+    return {
+      opened: this.open,
+      focusIndex: 0,
+      randomId: `menu-${R()}`
+    };
+  },
+  computed: {
+    triggerBtnType() {
+      return this.type || (this.primary ? "primary" : this.menuName ? "secondary" : "tertiary");
+    }
+  },
+  watch: {
+    // Watch parent prop
+    open(e) {
+      e !== this.opened && (this.opened = e);
+    }
+  },
+  methods: {
+    /**
+     * Do we have exactly one Action and
+     * is it allowed as a standalone element?
+     *
+     * @param {Array} action The action to check
+     * @return {boolean}
+     */
+    isValidSingleAction(e) {
+      var u, p, n, d, f;
+      const s = (f = (n = (p = (u = e == null ? void 0 : e.componentOptions) == null ? void 0 : u.Ctor) == null ? void 0 : p.extendOptions) == null ? void 0 : n.name) != null ? f : (d = e == null ? void 0 : e.componentOptions) == null ? void 0 : d.tag;
+      return ["NcActionButton", "NcActionLink", "NcActionRouter"].includes(s);
+    },
+    // MENU STATE MANAGEMENT
+    openMenu(e) {
+      this.opened || (this.opened = !0, this.$emit("update:open", !0), this.$emit("open"));
+    },
+    closeMenu(e = !0) {
+      this.opened && (this.opened = !1, this.$refs.popover.clearFocusTrap({ returnFocus: e }), this.$emit("update:open", !1), this.$emit("close"), this.focusIndex = 0, this.$refs.menuButton.$el.focus());
+    },
+    onOpen(e) {
+      this.$nextTick(() => {
+        this.focusFirstAction(e);
+      });
+    },
+    // MENU KEYS & FOCUS MANAGEMENT
+    // focus nearest focusable item on mouse move
+    // DO NOT change the focus if the target is already focused
+    // this will prevent issues with input being unfocused
+    // on mouse move
+    onMouseFocusAction(e) {
+      if (document.activeElement === e.target)
+        return;
+      const s = e.target.closest("li");
+      if (s) {
+        const u = s.querySelector(a);
+        if (u) {
+          const n = [...this.$refs.menu.querySelectorAll(a)].indexOf(u);
+          n > -1 && (this.focusIndex = n, this.focusAction());
+        }
+      }
+    },
+    /**
+     * Dispatches the keydown listener to different handlers
+     *
+     * @param {object} event The keydown event
+     */
+    onKeydown(e) {
+      (e.keyCode === 38 || e.keyCode === 9 && e.shiftKey) && this.focusPreviousAction(e), (e.keyCode === 40 || e.keyCode === 9 && !e.shiftKey) && this.focusNextAction(e), e.keyCode === 33 && this.focusFirstAction(e), e.keyCode === 34 && this.focusLastAction(e), e.keyCode === 27 && (this.closeMenu(), e.preventDefault());
+    },
+    removeCurrentActive() {
+      const e = this.$refs.menu.querySelector("li.active");
+      e && e.classList.remove("active");
+    },
+    focusAction() {
+      const e = this.$refs.menu.querySelectorAll(a)[this.focusIndex];
+      if (e) {
+        this.removeCurrentActive();
+        const s = e.closest("li.action");
+        e.focus(), s && s.classList.add("active");
+      }
+    },
+    focusPreviousAction(e) {
+      this.opened && (this.focusIndex === 0 ? this.closeMenu() : (this.preventIfEvent(e), this.focusIndex = this.focusIndex - 1), this.focusAction());
+    },
+    focusNextAction(e) {
+      if (this.opened) {
+        const s = this.$refs.menu.querySelectorAll(a).length - 1;
+        this.focusIndex === s ? this.closeMenu() : (this.preventIfEvent(e), this.focusIndex = this.focusIndex + 1), this.focusAction();
+      }
+    },
+    focusFirstAction(e) {
+      if (this.opened) {
+        this.preventIfEvent(e);
+        const s = [...this.$refs.menu.querySelectorAll(a)].findIndex((u) => u.parentElement.getAttribute("aria-selected"));
+        this.focusIndex = s > -1 ? s : 0, this.focusAction();
+      }
+    },
+    focusLastAction(e) {
+      this.opened && (this.preventIfEvent(e), this.focusIndex = this.$refs.menu.querySelectorAll(a).length - 1, this.focusAction());
+    },
+    preventIfEvent(e) {
+      e && (e.preventDefault(), e.stopPropagation());
+    },
+    onFocus(e) {
+      this.$emit("focus", e);
+    },
+    onBlur(e) {
+      this.$emit("blur", e);
+    }
+  },
+  /**
+   * The render function to display the component
+   *
+   * @param {Function} h The function to create VNodes
+   * @return {object|undefined} The created VNode
+   */
+  render(e) {
+    const s = (this.$slots.default || []).filter(
+      (t) => {
+        var l, r, o, i;
+        return ((l = t == null ? void 0 : t.componentOptions) == null ? void 0 : l.tag) || ((i = (o = (r = t == null ? void 0 : t.componentOptions) == null ? void 0 : r.Ctor) == null ? void 0 : o.extendOptions) == null ? void 0 : i.name);
+      }
+    ), u = (t) => {
+      var r, o, i, g, m, c, h, y;
+      return ((m = (i = (o = (r = t == null ? void 0 : t.componentOptions) == null ? void 0 : r.Ctor) == null ? void 0 : o.extendOptions) == null ? void 0 : i.name) != null ? m : (g = t == null ? void 0 : t.componentOptions) == null ? void 0 : g.tag) === "NcActionLink" && ((y = (h = (c = t == null ? void 0 : t.componentOptions) == null ? void 0 : c.propsData) == null ? void 0 : h.href) == null ? void 0 : y.startsWith(window.location.origin));
+    }, p = s.every(u);
+    let n = s.filter(this.isValidSingleAction);
+    if (this.forceMenu && n.length > 0 && this.inline > 0 && (V.util.warn("Specifying forceMenu will ignore any inline actions rendering."), n = []), s.length === 0)
+      return;
+    const d = (t) => {
+      var h, y, x, b, I, _, v, N, O, B, $, A, S, k, C, E, L, M, w, F, D, q, T;
+      const l = ((x = (y = (h = t == null ? void 0 : t.data) == null ? void 0 : h.scopedSlots) == null ? void 0 : y.icon()) == null ? void 0 : x[0]) || e("span", { class: ["icon", (I = (b = t == null ? void 0 : t.componentOptions) == null ? void 0 : b.propsData) == null ? void 0 : I.icon] }), r = ((_ = t == null ? void 0 : t.data) == null ? void 0 : _.attrs) || {}, o = (N = (v = t == null ? void 0 : t.componentOptions) == null ? void 0 : v.listeners) == null ? void 0 : N.click, i = (S = (A = ($ = (B = (O = t == null ? void 0 : t.componentOptions) == null ? void 0 : O.children) == null ? void 0 : B[0]) == null ? void 0 : $.text) == null ? void 0 : A.trim) == null ? void 0 : S.call(A), g = ((C = (k = t == null ? void 0 : t.componentOptions) == null ? void 0 : k.propsData) == null ? void 0 : C.ariaLabel) || i, m = this.forceName ? i : "";
+      let c = (L = (E = t == null ? void 0 : t.componentOptions) == null ? void 0 : E.propsData) == null ? void 0 : L.title;
+      return this.forceName || c || (c = i), e(
+        "NcButton",
+        {
+          class: [
+            "action-item action-item--single",
+            (M = t == null ? void 0 : t.data) == null ? void 0 : M.staticClass,
+            (w = t == null ? void 0 : t.data) == null ? void 0 : w.class
+          ],
+          attrs: {
+            ...r,
+            "aria-label": g,
+            title: c
+          },
+          ref: (F = t == null ? void 0 : t.data) == null ? void 0 : F.ref,
+          props: {
+            // If it has a menuName, we use a secondary button
+            type: this.type || (m ? "secondary" : "tertiary"),
+            disabled: this.disabled || ((q = (D = t == null ? void 0 : t.componentOptions) == null ? void 0 : D.propsData) == null ? void 0 : q.disabled),
+            ariaHidden: this.ariaHidden,
+            ...(T = t == null ? void 0 : t.componentOptions) == null ? void 0 : T.propsData
+          },
+          on: {
+            focus: this.onFocus,
+            blur: this.onBlur,
+            // If we have a click listener,
+            // we bind it to execute on click and forward the click event
+            ...!!o && {
+              click: (H) => {
+                o && o(H);
+              }
+            }
+          }
+        },
+        [
+          e("template", { slot: "icon" }, [l]),
+          m
+        ]
+      );
+    }, f = (t) => {
+      var o, i;
+      const l = ((o = this.$slots.icon) == null ? void 0 : o[0]) || (this.defaultIcon ? e("span", { class: ["icon", this.defaultIcon] }) : e("DotsHorizontal", {
+        props: {
+          size: 20
+        }
+      })), r = () => p || this.opened ? this.opened.toString() : null;
+      return e(
+        "NcPopover",
+        {
+          ref: "popover",
+          props: {
+            delay: 0,
+            handleResize: !0,
+            shown: this.opened,
+            placement: this.placement,
+            boundary: this.boundariesElement,
+            container: this.container,
+            popoverBaseClass: "action-item__popper",
+            setReturnFocus: (i = this.$refs.menuButton) == null ? void 0 : i.$el
+          },
+          // For some reason the popover component
+          // does not react to props given under the 'props' key,
+          // so we use both 'attrs' and 'props'
+          attrs: {
+            delay: 0,
+            handleResize: !0,
+            shown: this.opened,
+            placement: this.placement,
+            boundary: this.boundariesElement,
+            container: this.container,
+            ...this.manualOpen && { triggers: [] }
+          },
+          on: {
+            show: this.openMenu,
+            "after-show": this.onOpen,
+            hide: this.closeMenu
+          }
+        },
+        [
+          e("NcButton", {
+            class: "action-item__menutoggle",
+            props: {
+              type: this.triggerBtnType,
+              disabled: this.disabled,
+              ariaHidden: this.ariaHidden
+            },
+            slot: "trigger",
+            ref: "menuButton",
+            attrs: {
+              "aria-haspopup": p ? null : "menu",
+              "aria-label": this.menuName ? null : this.ariaLabel,
+              "aria-controls": this.opened ? this.randomId : null,
+              "aria-expanded": r()
+            },
+            on: {
+              focus: this.onFocus,
+              blur: this.onBlur
+            }
+          }, [
+            e("template", { slot: "icon" }, [l]),
+            this.menuName
+          ]),
+          e("div", {
+            class: {
+              open: this.opened
+            },
+            attrs: {
+              tabindex: "-1"
+            },
+            on: {
+              keydown: this.onKeydown,
+              mousemove: this.onMouseFocusAction
+            },
+            ref: "menu"
+          }, [
+            e("ul", {
+              attrs: {
+                id: this.randomId,
+                tabindex: "-1",
+                role: p ? null : "menu"
+              }
+            }, [
+              t
+            ])
+          ])
+        ]
+      );
+    };
+    if (s.length === 1 && n.length === 1 && !this.forceMenu)
+      return d(n[0]);
+    if (n.length > 0 && this.inline > 0) {
+      const t = n.slice(0, this.inline), l = s.filter((r) => !t.includes(r));
+      return e(
+        "div",
+        {
+          class: [
+            "action-items",
+            `action-item--${this.triggerBtnType}`
+          ]
+        },
+        [
+          // Render inline actions
+          ...t.map(d),
+          // render the rest within the popover menu
+          l.length > 0 ? e(
+            "div",
+            {
+              class: [
+                "action-item",
+                {
+                  "action-item--open": this.opened
+                }
+              ]
+            },
+            [
+              f(l)
+            ]
+          ) : null
+        ]
+      );
+    }
+    return e(
+      "div",
+      {
+        class: [
+          "action-item action-item--default-popover",
+          `action-item--${this.triggerBtnType}`,
+          {
+            "action-item--open": this.opened
+          }
+        ]
+      },
+      [
+        f(s)
+      ]
+    );
   }
-}, onKeydown(e) {
-  (e.keyCode === 38 || e.keyCode === 9 && e.shiftKey) && this.focusPreviousAction(e), (e.keyCode === 40 || e.keyCode === 9 && !e.shiftKey) && this.focusNextAction(e), e.keyCode === 33 && this.focusFirstAction(e), e.keyCode === 34 && this.focusLastAction(e), e.keyCode === 27 && (this.closeMenu(), e.preventDefault());
-}, removeCurrentActive() {
-  const e = this.$refs.menu.querySelector("li.active");
-  e && e.classList.remove("active");
-}, focusAction() {
-  const e = this.$refs.menu.querySelectorAll(y)[this.focusIndex];
-  if (e) {
-    this.removeCurrentActive();
-    const n = e.closest("li.action");
-    e.focus(), n && n.classList.add("active");
-  }
-}, focusPreviousAction(e) {
-  this.opened && (this.focusIndex === 0 ? this.closeMenu() : (this.preventIfEvent(e), this.focusIndex = this.focusIndex - 1), this.focusAction());
-}, focusNextAction(e) {
-  if (this.opened) {
-    const n = this.$refs.menu.querySelectorAll(y).length - 1;
-    this.focusIndex === n ? this.closeMenu() : (this.preventIfEvent(e), this.focusIndex = this.focusIndex + 1), this.focusAction();
-  }
-}, focusFirstAction(e) {
-  this.opened && (this.preventIfEvent(e), this.focusIndex = 0, this.focusAction());
-}, focusLastAction(e) {
-  this.opened && (this.preventIfEvent(e), this.focusIndex = this.$refs.menu.querySelectorAll(y).length - 1, this.focusAction());
-}, preventIfEvent(e) {
-  e && (e.preventDefault(), e.stopPropagation());
-}, onFocus(e) {
-  this.$emit("focus", e);
-}, onBlur(e) {
-  this.$emit("blur", e);
-} }, render(e) {
-  const n = (this.$slots.default || []).filter((t) => {
-    var i, o, s, l;
-    return ((i = t == null ? void 0 : t.componentOptions) == null ? void 0 : i.tag) || ((l = (s = (o = t == null ? void 0 : t.componentOptions) == null ? void 0 : o.Ctor) == null ? void 0 : s.extendOptions) == null ? void 0 : l.name);
-  }), c = (t) => {
-    var i, o, s, l, h, p, m, f;
-    return ((h = (s = (o = (i = t == null ? void 0 : t.componentOptions) == null ? void 0 : i.Ctor) == null ? void 0 : o.extendOptions) == null ? void 0 : s.name) != null ? h : (l = t == null ? void 0 : t.componentOptions) == null ? void 0 : l.tag) === "NcActionLink" && ((f = (m = (p = t == null ? void 0 : t.componentOptions) == null ? void 0 : p.propsData) == null ? void 0 : m.href) == null ? void 0 : f.startsWith(window.location.origin));
-  }, a = n.every(c);
-  let r = n.filter(this.isValidSingleAction);
-  if (this.forceMenu && r.length > 0 && this.inline > 0 && (K.util.warn("Specifying forceMenu will ignore any inline actions rendering."), r = []), n.length === 0)
-    return;
-  const u = (t) => {
-    var m, f, v, A, b, x, B, O, I, $, g, N, S, C, k, w, M, F, D, E, L, q;
-    const i = ((v = (f = (m = t == null ? void 0 : t.data) == null ? void 0 : m.scopedSlots) == null ? void 0 : f.icon()) == null ? void 0 : v[0]) || e("span", { class: ["icon", (b = (A = t == null ? void 0 : t.componentOptions) == null ? void 0 : A.propsData) == null ? void 0 : b.icon] }), o = (B = (x = t == null ? void 0 : t.componentOptions) == null ? void 0 : x.listeners) == null ? void 0 : B.click, s = (N = (g = ($ = (I = (O = t == null ? void 0 : t.componentOptions) == null ? void 0 : O.children) == null ? void 0 : I[0]) == null ? void 0 : $.text) == null ? void 0 : g.trim) == null ? void 0 : N.call(g), l = ((C = (S = t == null ? void 0 : t.componentOptions) == null ? void 0 : S.propsData) == null ? void 0 : C.ariaLabel) || s, h = this.forceName ? s : "";
-    let p = (w = (k = t == null ? void 0 : t.componentOptions) == null ? void 0 : k.propsData) == null ? void 0 : w.title;
-    return this.forceName || p || (p = s), e("NcButton", { class: ["action-item action-item--single", (M = t == null ? void 0 : t.data) == null ? void 0 : M.staticClass, (F = t == null ? void 0 : t.data) == null ? void 0 : F.class], attrs: { "aria-label": l, title: p }, ref: (D = t == null ? void 0 : t.data) == null ? void 0 : D.ref, props: { type: this.type || (h ? "secondary" : "tertiary"), disabled: this.disabled || ((L = (E = t == null ? void 0 : t.componentOptions) == null ? void 0 : E.propsData) == null ? void 0 : L.disabled), ariaHidden: this.ariaHidden, ...(q = t == null ? void 0 : t.componentOptions) == null ? void 0 : q.propsData }, on: { focus: this.onFocus, blur: this.onBlur, ...!!o && { click: (H) => {
-      o && o(H);
-    } } } }, [e("template", { slot: "icon" }, [i]), h]);
-  }, d = (t) => {
-    var o, s;
-    const i = ((o = this.$slots.icon) == null ? void 0 : o[0]) || (this.defaultIcon ? e("span", { class: ["icon", this.defaultIcon] }) : e("DotsHorizontal", { props: { size: 20 } }));
-    return e("NcPopover", { ref: "popover", props: { delay: 0, handleResize: !0, shown: this.opened, placement: this.placement, boundary: this.boundariesElement, container: this.container, popoverBaseClass: "action-item__popper", setReturnFocus: (s = this.$refs.menuButton) == null ? void 0 : s.$el }, attrs: { delay: 0, handleResize: !0, shown: this.opened, placement: this.placement, boundary: this.boundariesElement, container: this.container, ...this.manualOpen && { triggers: [] }, popoverBaseClass: "action-item__popper" }, on: { show: this.openMenu, "after-show": this.onOpen, hide: this.closeMenu } }, [e("NcButton", { class: "action-item__menutoggle", props: { type: this.triggerBtnType, disabled: this.disabled, ariaHidden: this.ariaHidden }, slot: "trigger", ref: "menuButton", attrs: { "aria-haspopup": a ? null : "menu", "aria-label": this.menuName ? null : this.ariaLabel, "aria-controls": this.opened ? this.randomId : null, "aria-expanded": this.opened.toString() }, on: { focus: this.onFocus, blur: this.onBlur } }, [e("template", { slot: "icon" }, [i]), this.menuName]), e("div", { class: { open: this.opened }, attrs: { tabindex: "-1" }, on: { keydown: this.onKeydown, mousemove: this.onMouseFocusAction }, ref: "menu" }, [e("ul", { attrs: { id: this.randomId, tabindex: "-1", role: a ? null : "menu" } }, [t])])]);
-  };
-  if (n.length === 1 && r.length === 1 && !this.forceMenu)
-    return u(r[0]);
-  if (r.length > 0 && this.inline > 0) {
-    const t = r.slice(0, this.inline), i = n.filter((o) => !t.includes(o));
-    return e("div", { class: ["action-items", `action-item--${this.triggerBtnType}`] }, [...t.map(u), i.length > 0 ? e("div", { class: ["action-item", { "action-item--open": this.opened }] }, [d(i)]) : null]);
-  }
-  return e("div", { class: ["action-item action-item--default-popover", `action-item--${this.triggerBtnType}`, { "action-item--open": this.opened }] }, [d(n)]);
-} }, G = null, W = null;
-var J = V(j, G, W, !1, null, "b84866e9", null, null);
-const oe = J.exports;
+}, J = null, Q = null;
+var U = /* @__PURE__ */ j(
+  W,
+  J,
+  Q,
+  !1,
+  null,
+  "4a3cc05a",
+  null,
+  null
+);
+const ie = U.exports;
 export {
-  oe as default
+  ie as default
 };