import e from "./pl-tabs.module.js";
import t from "./Tab.js";
import { Fragment as n, createBlock as r, createElementBlock as i, createElementVNode as a, defineComponent as o, normalizeClass as s, normalizeStyle as c, openBlock as l, renderList as u, renderSlot as d, toDisplayString as f, unref as p, withCtx as m, withKeys as h } from "vue";
var g = /* @__PURE__ */ o({
	name: "PlTabs",
	props: {
		modelValue: {},
		options: {},
		disabled: { type: Boolean },
		topLine: { type: Boolean },
		maxTabWidth: {}
	},
	emits: ["update:modelValue"],
	setup(o, { emit: g }) {
		let _ = g, v = (e) => _("update:modelValue", e);
		return (g, _) => (l(), i("div", { class: s([p(e).component, {
			[p(e).disabled]: o.disabled,
			[p(e).topLine]: o.topLine
		}]) }, [(l(!0), i(n, null, u(o.options, (n, i) => (l(), r(t, {
			key: i,
			tabindex: o.modelValue === n.value || o.disabled || n.disabled ? void 0 : 0,
			option: n,
			class: s([{
				[p(e).active]: o.modelValue === n.value,
				[p(e).disabled]: n.disabled
			}, p(e).tab]),
			style: c({ "--pl-tabs-item-max-width": n.maxWidth ?? o.maxTabWidth }),
			onKeydown: h((e) => v(n.value), ["enter"]),
			onClick: (e) => v(n.value)
		}, {
			default: m(() => [d(g.$slots, n.value, { option: n }, () => [a("span", null, f(n.label), 1)])]),
			_: 2
		}, 1032, [
			"tabindex",
			"option",
			"class",
			"style",
			"onKeydown",
			"onClick"
		]))), 128))], 2));
	}
});
export { g as default };

//# sourceMappingURL=PlTabs.vue2.js.map