@well-insight/ui 0.1.6 → 0.1.8

package/dist/table/style.js

@@ -0,0 +1,7 @@
+import '../theme/styles.css'
+import '../styles/base.css'
+import '../components/Checkbox/styles.css'
+import '../components/Icon/styles.css'
+import '../components/Pagination/styles.css'
+import '../components/ProgressSpinner/styles.css'
+import '../components/Table/styles.css'

package/dist/tabs/index.js

@@ -0,0 +1,136 @@
+import { n as e } from "../locale-CYkJyRd1.js";
+import "./style.js";
+import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, defineComponent as o, nextTick as s, normalizeClass as c, onBeforeUnmount as l, onMounted as u, openBlock as d, ref as f, renderList as p, renderSlot as m, toDisplayString as h, unref as g, watch as _, withModifiers as v } from "vue";
+//#region src/components/Tabs/Tabs.vue?vue&type=script&setup=true&lang.ts
+var y = { class: "wi-tabs__bar" }, b = ["aria-label"], x = ["aria-label"], S = [
+	"id",
+	"aria-selected",
+	"disabled",
+	"onClick",
+	"onKeydown"
+], C = [
+	"aria-label",
+	"disabled",
+	"onClick"
+], w = ["aria-label"], T = ["aria-label"], E = {
+	key: 3,
+	class: "wi-tabs__extra"
+}, D = {
+	class: "wi-tabs__panel",
+	role: "tabpanel"
+}, O = /* @__PURE__ */ o({
+	__name: "Tabs",
+	props: {
+		modelValue: {},
+		tabs: {},
+		type: { default: "line" },
+		closable: {
+			type: Boolean,
+			default: !1
+		},
+		addable: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"close",
+		"add"
+	],
+	setup(o, { emit: O }) {
+		let k = o, A = O, j = e(), M = f(null), N = f(!1), P = n(() => k.modelValue ?? k.tabs.find((e) => !e.disabled)?.value);
+		function F(e) {
+			A("update:modelValue", e), A("change", e);
+		}
+		function I(e) {
+			return e.closable ?? k.closable;
+		}
+		function L(e) {
+			if (e.disabled || (A("close", e.value), P.value !== e.value)) return;
+			let t = k.tabs.find((t) => t.value !== e.value && !t.disabled);
+			t && F(t.value);
+		}
+		function R(e, t) {
+			if (![
+				"ArrowRight",
+				"ArrowLeft",
+				"Home",
+				"End"
+			].includes(e.key)) return;
+			e.preventDefault();
+			let n = k.tabs.filter((e) => !e.disabled), r = n.findIndex((e) => e.value === k.tabs[t]?.value), i = n[e.key === "Home" ? 0 : e.key === "End" ? n.length - 1 : (r + (e.key === "ArrowRight" ? 1 : -1) + n.length) % n.length];
+			i && (F(i.value), requestAnimationFrame(() => document.getElementById(`wi-tab-${i.value}`)?.focus({ preventScroll: !0 })));
+		}
+		function z() {
+			let e = M.value;
+			N.value = !!(e && e.scrollWidth > e.clientWidth + 1);
+		}
+		function B(e) {
+			M.value?.scrollBy({
+				left: e,
+				behavior: "smooth"
+			});
+		}
+		let V;
+		return u(() => {
+			z(), !(!M.value || typeof ResizeObserver > "u") && (V = new ResizeObserver(() => z()), V.observe(M.value));
+		}), _(() => k.tabs, () => {
+			s(z);
+		}, { deep: !0 }), l(() => V?.disconnect()), (e, n) => (d(), i("div", { class: c(["wi-tabs", `wi-tabs--${o.type}`]) }, [a("div", y, [
+			N.value ? (d(), i("button", {
+				key: 0,
+				type: "button",
+				class: "wi-tabs__scroll",
+				"aria-label": g(j).prev,
+				onClick: n[0] ||= (e) => B(-160)
+			}, " ‹ ", 8, b)) : r("", !0),
+			a("div", {
+				ref_key: "scroller",
+				ref: M,
+				class: "wi-tabs__scroller"
+			}, [a("div", {
+				class: "wi-tabs__list",
+				role: "tablist",
+				"aria-label": g(j).tabs
+			}, [(d(!0), i(t, null, p(o.tabs, (e, t) => (d(), i("div", {
+				key: e.value,
+				class: c(["wi-tabs__item", { "wi-tabs__item--active": P.value === e.value }])
+			}, [a("button", {
+				id: `wi-tab-${e.value}`,
+				class: c(["wi-tabs__tab", { "wi-tabs__tab--active": P.value === e.value }]),
+				type: "button",
+				role: "tab",
+				"aria-selected": P.value === e.value,
+				disabled: e.disabled,
+				onClick: (t) => F(e.value),
+				onKeydown: (e) => R(e, t)
+			}, h(e.label), 43, S), I(e) ? (d(), i("button", {
+				key: 0,
+				type: "button",
+				class: "wi-tabs__close",
+				"aria-label": g(j).closeTab,
+				disabled: e.disabled,
+				onClick: v((t) => L(e), ["stop"])
+			}, " × ", 8, C)) : r("", !0)], 2))), 128))], 8, x)], 512),
+			N.value ? (d(), i("button", {
+				key: 1,
+				type: "button",
+				class: "wi-tabs__scroll",
+				"aria-label": g(j).next,
+				onClick: n[1] ||= (e) => B(160)
+			}, " › ", 8, w)) : r("", !0),
+			o.addable ? (d(), i("button", {
+				key: 2,
+				type: "button",
+				class: "wi-tabs__add",
+				"aria-label": g(j).addTab,
+				onClick: n[2] ||= (e) => A("add")
+			}, " + ", 8, T)) : r("", !0),
+			e.$slots.extra ? (d(), i("div", E, [m(e.$slots, "extra")])) : r("", !0)
+		]), a("div", D, [m(e.$slots, "default", { activeValue: P.value })])], 2));
+	}
+});
+//#endregion
+export { O as WiTabs };