@nextcloud/vue 9.0.0-alpha.0 → 9.0.0-alpha.1

package/dist/chunks/NcAppSidebar-19vWkj82.cjs

@@ -1,706 +0,0 @@
-var be = require("../assets/NcAppSidebar-QQPSZPo9.css");
-const C = require("../Components/NcVNodes.cjs"), S = require("./NcCheckboxRadioSwitch-Hi5ocuhB.cjs"), e = require("vue"), m = require("./_plugin-vue_export-helper-xG2iG1wl.cjs"), T = require("./NcActions-VJy75Dj8.cjs"), B = require("./NcLoadingIcon-Fwid-wWE.cjs"), h = require("./NcButton-Uxh-oARg.cjs"), w = require("./NcEmptyContent-M3ClqFZe.cjs"), E = require("../Directives/Focus.cjs"), L = require("../Directives/Linkify.cjs");
-require("../Directives/Tooltip.cjs");
-const A = require("../Composables/useIsMobile.cjs"), V = require("./focusTrap-n3H52LOw.cjs"), l = require("./_l10n-wK0o0jNS.cjs"), x = require("./ArrowRight-mI4Fw0h2.cjs"), M = require("./Close-2nENZfbn.cjs"), I = require("@vueuse/components"), q = require("focus-trap"), F = require("floating-vue"), z = {
-  name: "NcAppSidebarTabs",
-  components: {
-    NcCheckboxRadioSwitch: S.NcCheckboxRadioSwitch,
-    NcVNodes: C
-  },
-  provide() {
-    return {
-      registerTab: this.registerTab,
-      unregisterTab: this.unregisterTab,
-      // Getter as an alternative to Vue 2.7 computed(() => this.activeTab)
-      getActiveTab: () => this.activeTab,
-      // Used to check whether the tab header is shown so the tabs can reference the tab header for `aria-labelledby` or not
-      isTablistShown: () => this.hasMultipleTabs
-    };
-  },
-  props: {
-    /**
-     * Id of the tab to activate
-     */
-    active: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: ["update:active"],
-  data() {
-    return {
-      /**
-       * Tab descriptions from the passed NcSidebarTab components' props to build the tab navbar from.
-       */
-      tabs: [],
-      /**
-       * Local active (open) tab's ID. It allows to use component without v-model:active
-       */
-      activeTab: ""
-    };
-  },
-  computed: {
-    /**
-     * Has multiple tabs. If only one tab - its content is shown without navigation
-     *
-     * @return {boolean}
-     */
-    hasMultipleTabs() {
-      return this.tabs.length > 1;
-    },
-    currentTabIndex() {
-      return this.tabs.findIndex((a) => a.id === this.activeTab);
-    }
-  },
-  watch: {
-    active(a) {
-      a !== this.activeTab && this.updateActive();
-    }
-  },
-  methods: {
-    /**
-     * Set the current active tab
-     *
-     * @param {string} id the id of the tab
-     */
-    setActive(a) {
-      this.activeTab = a, this.$emit("update:active", this.activeTab);
-    },
-    /**
-     * Focus the previous tab
-     * and emit to the parent component
-     */
-    focusPreviousTab() {
-      this.currentTabIndex > 0 && this.setActive(this.tabs[this.currentTabIndex - 1].id), this.focusActiveTab();
-    },
-    /**
-     * Focus the next tab
-     * and emit to the parent component
-     */
-    focusNextTab() {
-      this.currentTabIndex < this.tabs.length - 1 && this.setActive(this.tabs[this.currentTabIndex + 1].id), this.focusActiveTab();
-    },
-    /**
-     * Focus the first tab
-     * and emit to the parent component
-     */
-    focusFirstTab() {
-      this.setActive(this.tabs[0].id), this.focusActiveTab();
-    },
-    /**
-     * Focus the last tab
-     * and emit to the parent component
-     */
-    focusLastTab() {
-      this.setActive(this.tabs[this.tabs.length - 1].id), this.focusActiveTab();
-    },
-    /**
-     * Focus the current active tab
-     */
-    focusActiveTab() {
-      this.$el.querySelector(`#tab-button-${this.activeTab}`).focus();
-    },
-    /**
-     * Focus the content on tab
-     * see aria accessibility guidelines
-     */
-    focusActiveTabContent() {
-      this.$el.querySelector("#tab-" + this.activeTab).focus();
-    },
-    /**
-     * Update the current active tab
-     */
-    updateActive() {
-      this.activeTab = this.active && this.tabs.some((a) => a.id === this.active) ? this.active : this.tabs.length > 0 ? this.tabs[0].id : "";
-    },
-    /**
-     * Register child tab in the tabs
-     *
-     * @param {object} tab child tab passed to slot
-     */
-    registerTab(a) {
-      this.tabs.push(a), this.tabs.sort((s, t) => s.order === t.order ? OC.Util.naturalSortCompare(s.name, t.name) : s.order - t.order), this.updateActive();
-    },
-    /**
-     * Unregister child tab from the tabs
-     *
-     * @param {string} id tab's id
-     */
-    unregisterTab(a) {
-      const s = this.tabs.findIndex((t) => t.id === a);
-      s !== -1 && this.tabs.splice(s, 1), this.activeTab === a && this.updateActive();
-    }
-  }
-}, D = { class: "app-sidebar-tabs" }, P = { class: "app-sidebar-tabs__tab-caption" };
-function K(a, s, t, d, o, i) {
-  const c = e.resolveComponent("NcVNodes"), b = e.resolveComponent("NcCheckboxRadioSwitch");
-  return e.openBlock(), e.createElementBlock("div", D, [
-    i.hasMultipleTabs ? (e.openBlock(), e.createElementBlock("div", {
-      key: 0,
-      role: "tablist",
-      class: "app-sidebar-tabs__nav",
-      onKeydown: [
-        s[0] || (s[0] = e.withKeys(e.withModifiers((...r) => i.focusPreviousTab && i.focusPreviousTab(...r), ["exact", "prevent", "stop"]), ["left"])),
-        s[1] || (s[1] = e.withKeys(e.withModifiers((...r) => i.focusNextTab && i.focusNextTab(...r), ["exact", "prevent", "stop"]), ["right"])),
-        s[2] || (s[2] = e.withKeys(e.withModifiers((...r) => i.focusActiveTabContent && i.focusActiveTabContent(...r), ["exact", "prevent", "stop"]), ["tab"])),
-        s[3] || (s[3] = e.withKeys(e.withModifiers((...r) => i.focusFirstTab && i.focusFirstTab(...r), ["exact", "prevent", "stop"]), ["home"])),
-        s[4] || (s[4] = e.withKeys(e.withModifiers((...r) => i.focusLastTab && i.focusLastTab(...r), ["exact", "prevent", "stop"]), ["end"])),
-        s[5] || (s[5] = e.withKeys(e.withModifiers((...r) => i.focusFirstTab && i.focusFirstTab(...r), ["exact", "prevent", "stop"]), ["page-up"])),
-        s[6] || (s[6] = e.withKeys(e.withModifiers((...r) => i.focusLastTab && i.focusLastTab(...r), ["exact", "prevent", "stop"]), ["page-down"]))
-      ]
-    }, [
-      (e.openBlock(!0), e.createElementBlock(e.Fragment, null, e.renderList(o.tabs, (r) => (e.openBlock(), e.createBlock(b, {
-        key: r.id,
-        "aria-controls": `tab-${r.id}`,
-        "aria-selected": String(o.activeTab === r.id),
-        "button-variant": !0,
-        "model-value": o.activeTab === r.id,
-        "wrapper-id": `tab-button-${r.id}`,
-        tabindex: o.activeTab === r.id ? 0 : -1,
-        "button-variant-grouped": "horizontal",
-        class: e.normalizeClass(["app-sidebar-tabs__tab", { active: r.id === o.activeTab }]),
-        role: "tab",
-        type: "button",
-        "onUpdate:modelValue": (u) => i.setActive(r.id)
-      }, {
-        icon: e.withCtx(() => [
-          e.createVNode(c, {
-            vnodes: r.renderIcon()
-          }, {
-            default: e.withCtx(() => [
-              e.createElementVNode("span", {
-                class: e.normalizeClass(["app-sidebar-tabs__tab-icon", r.icon])
-              }, null, 2)
-            ]),
-            _: 2
-          }, 1032, ["vnodes"])
-        ]),
-        default: e.withCtx(() => [
-          e.createElementVNode("span", P, e.toDisplayString(r.name), 1)
-        ]),
-        _: 2
-      }, 1032, ["aria-controls", "aria-selected", "model-value", "wrapper-id", "tabindex", "class", "onUpdate:modelValue"]))), 128))
-    ], 32)) : e.createCommentVNode("", !0),
-    e.createElementVNode("div", {
-      class: e.normalizeClass([{ "app-sidebar-tabs__content--multiple": i.hasMultipleTabs }, "app-sidebar-tabs__content"])
-    }, [
-      e.renderSlot(a.$slots, "default", {}, void 0, !0)
-    ], 2)
-  ]);
-}
-const R = /* @__PURE__ */ m._export_sfc(z, [["render", K], ["__scopeId", "data-v-be5cc033"]]);
-l.register(l.t13);
-const O = {
-  name: "StarIcon",
-  emits: ["click"],
-  props: {
-    title: {
-      type: String
-    },
-    fillColor: {
-      type: String,
-      default: "currentColor"
-    },
-    size: {
-      type: Number,
-      default: 24
-    }
-  }
-}, U = ["aria-hidden", "aria-label"], Z = ["fill", "width", "height"], H = { d: "M12,17.27L18.18,21L16.54,13.97L22,9.24L14.81,8.62L12,2L9.19,8.62L2,9.24L7.45,13.97L5.82,21L12,17.27Z" }, j = { key: 0 };
-function G(a, s, t, d, o, i) {
-  return e.openBlock(), e.createElementBlock("span", e.mergeProps(a.$attrs, {
-    "aria-hidden": !t.title,
-    "aria-label": t.title,
-    class: "material-design-icon star-icon",
-    role: "img",
-    onClick: s[0] || (s[0] = (c) => a.$emit("click", c))
-  }), [
-    (e.openBlock(), e.createElementBlock("svg", {
-      fill: t.fillColor,
-      class: "material-design-icon__svg",
-      width: t.size,
-      height: t.size,
-      viewBox: "0 0 24 24"
-    }, [
-      e.createElementVNode("path", H, [
-        t.title ? (e.openBlock(), e.createElementBlock("title", j, e.toDisplayString(t.title), 1)) : e.createCommentVNode("", !0)
-      ])
-    ], 8, Z))
-  ], 16, U);
-}
-const J = /* @__PURE__ */ m._export_sfc(O, [["render", G]]), Q = {
-  name: "StarOutlineIcon",
-  emits: ["click"],
-  props: {
-    title: {
-      type: String
-    },
-    fillColor: {
-      type: String,
-      default: "currentColor"
-    },
-    size: {
-      type: Number,
-      default: 24
-    }
-  }
-}, W = ["aria-hidden", "aria-label"], X = ["fill", "width", "height"], Y = { d: "M12,15.39L8.24,17.66L9.23,13.38L5.91,10.5L10.29,10.13L12,6.09L13.71,10.13L18.09,10.5L14.77,13.38L15.76,17.66M22,9.24L14.81,8.63L12,2L9.19,8.63L2,9.24L7.45,13.97L5.82,21L12,17.27L18.18,21L16.54,13.97L22,9.24Z" }, $ = { key: 0 };
-function ee(a, s, t, d, o, i) {
-  return e.openBlock(), e.createElementBlock("span", e.mergeProps(a.$attrs, {
-    "aria-hidden": !t.title,
-    "aria-label": t.title,
-    class: "material-design-icon star-outline-icon",
-    role: "img",
-    onClick: s[0] || (s[0] = (c) => a.$emit("click", c))
-  }), [
-    (e.openBlock(), e.createElementBlock("svg", {
-      fill: t.fillColor,
-      class: "material-design-icon__svg",
-      width: t.size,
-      height: t.size,
-      viewBox: "0 0 24 24"
-    }, [
-      e.createElementVNode("path", Y, [
-        t.title ? (e.openBlock(), e.createElementBlock("title", $, e.toDisplayString(t.title), 1)) : e.createCommentVNode("", !0)
-      ])
-    ], 8, X))
-  ], 16, W);
-}
-const te = /* @__PURE__ */ m._export_sfc(Q, [["render", ee]]), ie = {
-  name: "NcAppSidebar",
-  components: {
-    NcActions: T.NcActions,
-    NcAppSidebarTabs: R,
-    ArrowRight: x.ArrowRight,
-    NcButton: h.NcButton,
-    NcLoadingIcon: B.NcLoadingIcon,
-    NcEmptyContent: w.NcEmptyContent,
-    Close: M.Close,
-    Star: J,
-    StarOutline: te
-  },
-  directives: {
-    focus: E.directive,
-    linkify: L.directive,
-    ClickOutside: I.vOnClickOutside,
-    Tooltip: F.VTooltip
-  },
-  props: {
-    active: {
-      type: String,
-      default: ""
-    },
-    name: {
-      type: String,
-      default: "",
-      required: !0
-    },
-    /**
-     * Allow to edit the sidebar name.
-     */
-    nameEditable: {
-      type: Boolean,
-      default: !1
-    },
-    namePlaceholder: {
-      type: String,
-      default: ""
-    },
-    subname: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Title to display for the subname.
-     */
-    subtitle: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Url to the top header background image
-     * Applied with css
-     */
-    background: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Enable the favourite icon if not null
-     * See fired events
-     */
-    starred: {
-      type: Boolean,
-      default: null
-    },
-    /**
-     * Show loading spinner instead of the star icon
-     */
-    starLoading: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Show loading spinner instead of tabs
-     */
-    loading: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Display the sidebar in compact mode
-     */
-    compact: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Only display close button and default slot content.
-     * Don't display other header content and primary and secondary actions.
-     * Useful when showing the EmptyContent component as content.
-     */
-    empty: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Force the actions to display in a three dot menu
-     */
-    forceMenu: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Linkify the name
-     */
-    linkifyName: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * Title to display for the name.
-     * Can be set to the same text in case it's too long.
-     */
-    title: {
-      type: String,
-      default: ""
-    }
-  },
-  emits: [
-    "close",
-    "closing",
-    "closed",
-    "opening",
-    "opened",
-    // 'figure-click', not emitted on purpose to make "hasFigureClickListener" work
-    "update:starred",
-    "update:nameEditable",
-    "update:name",
-    "update:active",
-    "submit-name",
-    "dismiss-editing"
-  ],
-  setup() {
-    return {
-      isMobile: A.useIsSmallMobile()
-    };
-  },
-  data() {
-    return {
-      changeNameTranslated: l.t("Change name"),
-      closeTranslated: l.t("Close sidebar"),
-      favoriteTranslated: l.t("Favorite"),
-      isStarred: this.starred,
-      focusTrap: null
-    };
-  },
-  computed: {
-    canStar() {
-      return this.isStarred !== null;
-    },
-    hasFigureClickListener() {
-      return !!this.$attrs.onFigureClick;
-    }
-  },
-  watch: {
-    starred() {
-      this.isStarred = this.starred;
-    },
-    isMobile() {
-      this.toggleFocusTrap();
-    }
-  },
-  mounted() {
-    this.toggleFocusTrap();
-  },
-  beforeUnmount() {
-    this.$emit("closed"), this.focusTrap?.deactivate();
-  },
-  methods: {
-    isSlotPopulated: h.isSlotPopulated,
-    initFocusTrap() {
-      this.focusTrap || (this.focusTrap = q.createFocusTrap([
-        // The sidebar itself
-        this.$refs.sidebar,
-        // Nextcloud Server header navigarion
-        document.querySelector("#header"),
-        // The app navigation toggle. Navigation can be opened above the sidebar
-        // Take the parent element, because the focus-trap requires a container with elements, not the element itself
-        document.querySelector('[aria-controls="app-navigation-vue"]')?.parentElement
-      ], {
-        allowOutsideClick: !0,
-        fallbackFocus: this.$refs.closeButton,
-        trapStack: V.getTrapStack(),
-        escapeDeactivates: !1
-      }));
-    },
-    /**
-     * Activate focus trap if it is currently needed, otherwise deactivate
-     */
-    toggleFocusTrap() {
-      this.isMobile ? (this.initFocusTrap(), this.focusTrap.activate()) : this.focusTrap?.deactivate();
-    },
-    onBeforeEnter(a) {
-      this.$emit("opening", a);
-    },
-    onAfterEnter(a) {
-      this.$emit("opened", a);
-    },
-    onBeforeLeave(a) {
-      this.$emit("closing", a);
-    },
-    onAfterLeave(a) {
-      this.$emit("closed", a);
-    },
-    /**
-     * Used to tell parent component the user asked to close the sidebar
-     *
-     * @param {Event} e close icon click event
-     */
-    closeSidebar(a) {
-      this.$emit("close", a);
-    },
-    /**
-     * Emit figure click event to parent component
-     *
-     * @param {Event} e click event
-     */
-    onFigureClick(a) {
-      this.$emit("figure-click", a);
-    },
-    /**
-     * Toggle the favourite state
-     * and emit to the parent component
-     */
-    toggleStarred() {
-      this.isStarred = !this.isStarred, this.$emit("update:starred", this.isStarred);
-    },
-    async editName() {
-      this.$emit("update:nameEditable", !0), this.nameEditable && (await this.$nextTick(), this.$refs.nameInput.focus());
-    },
-    /**
-     * Emit name change event to parent component
-     *
-     * @param {Event} event input event
-     */
-    onNameInput(a) {
-      this.$emit("update:name", a.target.value);
-    },
-    /**
-     * Emit when the name form edit confirm button is pressed in order
-     * to change the name.
-     *
-     * @param {Event} event submit event
-     */
-    onSubmitName(a) {
-      this.$emit("update:nameEditable", !1), this.$emit("submit-name", a);
-    },
-    onDismissEditing() {
-      this.$emit("update:nameEditable", !1), this.$emit("dismiss-editing");
-    },
-    onUpdateActive(a) {
-      this.$emit("update:active", a);
-    }
-  }
-}, ae = { class: "app-sidebar-header__info" }, se = {
-  key: 0,
-  class: "app-sidebar-header__tertiary-actions"
-}, re = { class: "app-sidebar-header__name-container" }, oe = { class: "app-sidebar-header__mainname-container" }, ne = ["aria-label", "title", "tabindex"], ce = ["placeholder", "value"], le = ["aria-label", "title"], de = {
-  key: 0,
-  class: "app-sidebar-header__description"
-};
-function ue(a, s, t, d, o, i) {
-  const c = e.resolveComponent("NcLoadingIcon"), b = e.resolveComponent("Star"), r = e.resolveComponent("StarOutline"), u = e.resolveComponent("NcButton"), p = e.resolveComponent("ArrowRight"), f = e.resolveComponent("NcActions"), v = e.resolveComponent("Close"), _ = e.resolveComponent("NcAppSidebarTabs"), g = e.resolveComponent("NcEmptyContent"), k = e.resolveDirective("linkify"), y = e.resolveDirective("focus"), N = e.resolveDirective("click-outside");
-  return e.openBlock(), e.createBlock(e.Transition, {
-    appear: "",
-    name: "slide-right",
-    onBeforeEnter: i.onBeforeEnter,
-    onAfterEnter: i.onAfterEnter,
-    onBeforeLeave: i.onBeforeLeave,
-    onAfterLeave: i.onAfterLeave
-  }, {
-    default: e.withCtx(() => [
-      e.createElementVNode("aside", {
-        id: "app-sidebar-vue",
-        ref: "sidebar",
-        class: "app-sidebar",
-        onKeydown: s[6] || (s[6] = e.withKeys(e.withModifiers((n) => d.isMobile && i.closeSidebar(), ["stop"]), ["esc"]))
-      }, [
-        e.createElementVNode("header", {
-          class: e.normalizeClass([{
-            "app-sidebar-header--with-figure": i.isSlotPopulated(a.$slots.header?.()) || t.background,
-            "app-sidebar-header--compact": t.compact
-          }, "app-sidebar-header"])
-        }, [
-          e.createElementVNode("div", ae, [
-            (i.isSlotPopulated(a.$slots.header?.()) || t.background) && !t.empty ? (e.openBlock(), e.createElementBlock("div", {
-              key: 0,
-              class: e.normalizeClass([{
-                "app-sidebar-header__figure--with-action": i.hasFigureClickListener
-              }, "app-sidebar-header__figure"]),
-              style: e.normalizeStyle({
-                backgroundImage: `url(${t.background})`
-              }),
-              tabindex: "0",
-              onClick: s[0] || (s[0] = (...n) => i.onFigureClick && i.onFigureClick(...n)),
-              onKeydown: s[1] || (s[1] = e.withKeys((...n) => i.onFigureClick && i.onFigureClick(...n), ["enter"]))
-            }, [
-              e.renderSlot(a.$slots, "header", { class: "app-sidebar-header__background" }, void 0, !0)
-            ], 38)) : e.createCommentVNode("", !0),
-            t.empty ? e.createCommentVNode("", !0) : (e.openBlock(), e.createElementBlock("div", {
-              key: 1,
-              class: e.normalizeClass([{
-                "app-sidebar-header__desc--with-tertiary-action": i.canStar || i.isSlotPopulated(a.$slots["tertiary-actions"]?.()),
-                "app-sidebar-header__desc--editable": t.nameEditable && !t.subname,
-                "app-sidebar-header__desc--with-subname--editable": t.nameEditable && t.subname,
-                "app-sidebar-header__desc--without-actions": !i.isSlotPopulated(a.$slots["secondary-actions"]?.())
-              }, "app-sidebar-header__desc"])
-            }, [
-              i.canStar || i.isSlotPopulated(a.$slots["tertiary-actions"]?.()) ? (e.openBlock(), e.createElementBlock("div", se, [
-                e.renderSlot(a.$slots, "tertiary-actions", {}, () => [
-                  i.canStar ? (e.openBlock(), e.createBlock(u, {
-                    key: 0,
-                    "aria-label": o.favoriteTranslated,
-                    pressed: o.isStarred,
-                    class: "app-sidebar-header__star",
-                    type: "secondary",
-                    onClick: e.withModifiers(i.toggleStarred, ["prevent"])
-                  }, {
-                    icon: e.withCtx(() => [
-                      t.starLoading ? (e.openBlock(), e.createBlock(c, { key: 0 })) : o.isStarred ? (e.openBlock(), e.createBlock(b, {
-                        key: 1,
-                        size: 20
-                      })) : (e.openBlock(), e.createBlock(r, {
-                        key: 2,
-                        size: 20
-                      }))
-                    ]),
-                    _: 1
-                  }, 8, ["aria-label", "pressed", "onClick"])) : e.createCommentVNode("", !0)
-                ], !0)
-              ])) : e.createCommentVNode("", !0),
-              e.createElementVNode("div", re, [
-                e.createElementVNode("div", oe, [
-                  e.withDirectives((e.openBlock(), e.createElementBlock("h2", {
-                    "aria-label": t.title,
-                    title: t.title,
-                    class: "app-sidebar-header__mainname",
-                    tabindex: t.nameEditable ? 0 : void 0,
-                    onClick: s[2] || (s[2] = e.withModifiers((...n) => i.editName && i.editName(...n), ["self"]))
-                  }, [
-                    e.createTextVNode(e.toDisplayString(t.name), 1)
-                  ], 8, ne)), [
-                    [e.vShow, !t.nameEditable],
-                    [k, { text: t.name, linkify: t.linkifyName }]
-                  ]),
-                  t.nameEditable ? e.withDirectives((e.openBlock(), e.createElementBlock("form", {
-                    key: 0,
-                    class: "app-sidebar-header__mainname-form",
-                    onSubmit: s[5] || (s[5] = e.withModifiers((...n) => i.onSubmitName && i.onSubmitName(...n), ["prevent"]))
-                  }, [
-                    e.withDirectives(e.createElementVNode("input", {
-                      ref: "nameInput",
-                      class: "app-sidebar-header__mainname-input",
-                      type: "text",
-                      placeholder: t.namePlaceholder,
-                      value: t.name,
-                      onKeydown: s[3] || (s[3] = e.withKeys(e.withModifiers((...n) => i.onDismissEditing && i.onDismissEditing(...n), ["stop"]), ["esc"])),
-                      onInput: s[4] || (s[4] = (...n) => i.onNameInput && i.onNameInput(...n))
-                    }, null, 40, ce), [
-                      [y]
-                    ]),
-                    e.createVNode(u, {
-                      type: "tertiary-no-background",
-                      "aria-label": o.changeNameTranslated,
-                      "native-type": "submit"
-                    }, {
-                      icon: e.withCtx(() => [
-                        e.createVNode(p, { size: 20 })
-                      ]),
-                      _: 1
-                    }, 8, ["aria-label"])
-                  ], 32)), [
-                    [N, () => i.onSubmitName()]
-                  ]) : e.createCommentVNode("", !0),
-                  i.isSlotPopulated(a.$slots["secondary-actions"]?.()) ? (e.openBlock(), e.createBlock(f, {
-                    key: 1,
-                    class: "app-sidebar-header__menu",
-                    "force-menu": t.forceMenu
-                  }, {
-                    default: e.withCtx(() => [
-                      e.renderSlot(a.$slots, "secondary-actions", {}, void 0, !0)
-                    ]),
-                    _: 3
-                  }, 8, ["force-menu"])) : e.createCommentVNode("", !0)
-                ]),
-                t.subname.trim() !== "" ? (e.openBlock(), e.createElementBlock("p", {
-                  key: 0,
-                  "aria-label": t.subtitle,
-                  title: t.subtitle,
-                  class: "app-sidebar-header__subname"
-                }, e.toDisplayString(t.subname), 9, le)) : e.createCommentVNode("", !0)
-              ])
-            ], 2))
-          ]),
-          e.createVNode(u, {
-            ref: "closeButton",
-            title: o.closeTranslated,
-            "aria-label": o.closeTranslated,
-            type: "tertiary",
-            class: "app-sidebar__close",
-            onClick: e.withModifiers(i.closeSidebar, ["prevent"])
-          }, {
-            icon: e.withCtx(() => [
-              e.createVNode(v, { size: 20 })
-            ]),
-            _: 1
-          }, 8, ["title", "aria-label", "onClick"]),
-          i.isSlotPopulated(a.$slots.description?.()) && !t.empty ? (e.openBlock(), e.createElementBlock("div", de, [
-            e.renderSlot(a.$slots, "description", {}, void 0, !0)
-          ])) : e.createCommentVNode("", !0)
-        ], 2),
-        e.withDirectives(e.createVNode(_, {
-          ref: "tabs",
-          active: t.active,
-          "onUpdate:active": i.onUpdateActive
-        }, {
-          default: e.withCtx(() => [
-            e.renderSlot(a.$slots, "default", {}, void 0, !0)
-          ]),
-          _: 3
-        }, 8, ["active", "onUpdate:active"]), [
-          [e.vShow, !t.loading]
-        ]),
-        t.loading ? (e.openBlock(), e.createBlock(g, { key: 0 }, {
-          icon: e.withCtx(() => [
-            e.createVNode(c, { size: 64 })
-          ]),
-          _: 1
-        })) : e.createCommentVNode("", !0)
-      ], 544)
-    ]),
-    _: 3
-  }, 8, ["onBeforeEnter", "onAfterEnter", "onBeforeLeave", "onAfterLeave"]);
-}
-const me = /* @__PURE__ */ m._export_sfc(ie, [["render", ue], ["__scopeId", "data-v-b1892d2b"]]);
-exports.NcAppSidebar = me;