@nextcloud/vue
Version:
Nextcloud vue components
97 lines (96 loc) • 2.85 kB
JavaScript
import '../assets/NcAppSidebarTab-Xd3HTDbw.css';
import { createElementBlock, openBlock, normalizeClass, createElementVNode, renderSlot, toDisplayString } from "vue";
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
const _sfc_main = {
name: "NcAppSidebarTab",
inject: ["registerTab", "unregisterTab", "getActiveTab", "isTablistShown"],
props: {
/**
* Unique id of the sidebar tab
*/
id: {
type: String,
required: true
},
/**
* Tab name in navigation
*/
name: {
type: String,
required: true
},
/**
* Tab icon's html class in navigation. Used if #icon slot is not provided
*/
icon: {
type: String,
default: ""
},
/**
* Tab order in navigation. If not provided, name is used.
*/
order: {
type: Number,
default: 0
}
},
emits: [
"bottomReached",
"scroll"
],
expose: ["id", "name", "icon", "order", "renderIcon"],
computed: {
/**
* Is the current tab an active tab, that should be shown?
*
* @return {boolean}
*/
isActive() {
return this.getActiveTab() === this.id;
}
},
created() {
this.registerTab(this);
},
beforeUnmount() {
this.unregisterTab(this.id);
},
methods: {
onScroll(event) {
if (this.$el.scrollHeight - this.$el.scrollTop === this.$el.clientHeight) {
this.$emit("bottomReached", event);
}
this.$emit("scroll", event);
},
/**
* Render tab's icon slot if any
*
* @return {import('vue').VNode[]}
*/
renderIcon() {
return this.$slots.icon?.();
}
}
};
const _hoisted_1 = ["id", "aria-hidden", "aria-label", "aria-labelledby", "role", "tabindex"];
const _hoisted_2 = { class: "hidden-visually" };
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return openBlock(), createElementBlock("section", {
id: `tab-${$props.id}`,
"aria-hidden": !$options.isActive,
"aria-label": $options.isTablistShown() ? void 0 : $props.name,
"aria-labelledby": $options.isTablistShown() ? `tab-button-${$props.id}` : void 0,
class: normalizeClass(["app-sidebar__tab", { "app-sidebar__tab--active": $options.isActive }]),
role: $options.isTablistShown() ? "tabpanel" : void 0,
tabindex: $options.isTablistShown() ? 0 : -1,
onScroll: _cache[0] || (_cache[0] = (...args) => $options.onScroll && $options.onScroll(...args))
}, [
createElementVNode("h3", _hoisted_2, toDisplayString($props.name), 1),
renderSlot(_ctx.$slots, "default", {}, void 0, true)
], 42, _hoisted_1);
}
const NcAppSidebarTab = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-dba10798"]]);
export {
NcAppSidebarTab as N
};
//# sourceMappingURL=NcAppSidebarTab-Cjetm3Fs.mjs.map