@empathyco/x-components
Version:
Empathy X Components
73 lines (70 loc) • 3.39 kB
JavaScript
import _sfc_main from './base-tabs-panel.vue2.js';
import { openBlock, createElementBlock, createBlock, resolveDynamicComponent, normalizeClass, withCtx, Fragment, renderList, renderSlot, mergeProps, createTextVNode, toDisplayString, normalizeProps, guardReactiveProps, createCommentVNode } from 'vue';
import './base-tabs-panel.vue3.js';
import _export_sfc from '../../_virtual/_plugin-vue_export-helper.js';
const _hoisted_1 = {
key: 0,
class: "x-tabs-panel",
"data-test": "base-tabs-panel"
};
const _hoisted_2 = ["id", "aria-selected", "onClick"];
const _hoisted_3 = ["aria-labelledby"];
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return _ctx.getTabs().length > 0 ? (openBlock(), createElementBlock("section", _hoisted_1, [
(openBlock(), createBlock(resolveDynamicComponent(_ctx.tabsAnimation), {
class: normalizeClass(["x-tabs-panel__items-list", _ctx.tabsListClass]),
"data-test": "base-tabs-panel-list",
role: "tablist"
}, {
default: withCtx(() => [
(openBlock(true), createElementBlock(
Fragment,
null,
renderList(_ctx.getTabs(), (tab) => {
return renderSlot(_ctx.$slots, "tab", mergeProps({ ref_for: true }, { tab, isSelected: _ctx.tabIsSelected(tab), select: () => _ctx.selectTab(tab) }), () => [
(openBlock(), createElementBlock("button", {
id: `base-tabs-panel-${tab}`,
key: tab,
class: normalizeClass(["x-tabs-panel__list-item x-tabs-panel__button x-button", _ctx.tabIsSelected(tab) ? _ctx.activeTabClass : _ctx.tabClass]),
"aria-selected": _ctx.tabIsSelected(tab).toString(),
"data-test": "base-tabs-panel-button",
role: "tab",
onClick: ($event) => _ctx.selectTab(tab)
}, [
renderSlot(_ctx.$slots, "tab-content", mergeProps({ ref_for: true }, { tab, isSelected: _ctx.tabIsSelected(tab) }), () => [
createTextVNode(
toDisplayString(tab),
1
/* TEXT */
)
], true)
], 10, _hoisted_2))
], true);
}),
256
/* UNKEYED_FRAGMENT */
))
]),
_: 3
/* FORWARDED */
}, 8, ["class"])),
(openBlock(), createBlock(resolveDynamicComponent(_ctx.contentAnimation), null, {
default: withCtx(() => [
_ctx.selectedTab && _ctx.slots[_ctx.selectedTab] ? (openBlock(), createElementBlock("div", {
key: _ctx.selectedTab,
class: normalizeClass(_ctx.contentClass),
"aria-labelledby": `base-tabs-panel-${_ctx.selectedTab}`,
"data-test": "base-tabs-panel-content",
role: "tabpanel"
}, [
renderSlot(_ctx.$slots, _ctx.selectedTab, normalizeProps(guardReactiveProps({ tab: _ctx.selectedTab, selectTab: _ctx.selectTab, deselectTab: () => _ctx.selectTab(_ctx.selectedTab) })), void 0, true)
], 10, _hoisted_3)) : createCommentVNode("v-if", true)
]),
_: 3
/* FORWARDED */
}))
])) : createCommentVNode("v-if", true);
}
var baseTabsPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-d9d4ee33"]]);
export { baseTabsPanel as default };
//# sourceMappingURL=base-tabs-panel.vue.js.map