@indielayer/ui 1.18.1 → 2.1.0

package/lib/components/table/Table.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,440 @@
+import { useTheme as e } from "../../composables/useTheme.js";
+import { optionalBooleanProp as t } from "../../common/props.js";
+import n from "../icon/Icon.js";
+import { chevronDownIcon as r } from "../../common/icons.js";
+import i from "../spinner/Spinner.js";
+import a from "../checkbox/Checkbox.js";
+import { useVirtualList as ee } from "../../composables/useVirtualList.js";
+import o from "../skeleton/Skeleton.js";
+import te from "./TableHead.js";
+import s from "./TableHeader.js";
+import ne from "./TableBody.js";
+import c from "./TableRow.js";
+import l from "./TableCell.js";
+import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, createVNode as _, defineComponent as v, mergeModels as y, mergeProps as b, normalizeClass as x, normalizeStyle as S, openBlock as C, ref as w, renderList as T, renderSlot as E, toDisplayString as D, unref as O, useModel as re, useSlots as ie, watch as ae, withCtx as k, withModifiers as A } from "vue";
+//#region src/components/table/Table.vue?vue&type=script&setup=true&lang.ts
+var oe = { key: 1 }, se = ["colspan"], j = { key: 2 }, ce = ["colspan"], M = ["onClick"], le = ["colspan"], ue = { key: 0 }, N = /* @__PURE__ */ v({
+	name: "XTable",
+	docs: {
+		slots: {
+			title: "Optional title above the table.",
+			actions: "Optional actions above the table.",
+			"header-[column]": "Header cell content for a column (`header-{value}`).",
+			"item-[column]": "Cell content for a column (`item-{value}`).",
+			"loading-[column]": "Loading cell content for a column (`loading-{value}`).",
+			"footer-[column]": "Footer cell content for a column (`footer-{value}`).",
+			footer: "Custom footer (`tfoot`); overrides per-column footer slots when provided.",
+			empty: "Content when there are no items.",
+			error: "Content when `error` is true.",
+			"expanded-row": "Expanded content for a row when `expandable` is set."
+		},
+		emits: {
+			"update:sort": "Emitted when sort changes (`v-model:sort`).",
+			"update:selected": "Emitted when selection changes (`v-model:selected`).",
+			"click-row": "Emitted when a row is clicked; payload is `(item, index)`."
+		}
+	},
+	props: /* @__PURE__ */ y({
+		headers: {
+			type: Array,
+			default: () => [],
+			description: "Column definitions (text, value, sortable, align, width, etc.)."
+		},
+		items: {
+			type: Array,
+			default: () => [],
+			description: "Row data array. Cell values resolve from each header `value` path."
+		},
+		sort: {
+			type: Array,
+			default: () => [],
+			description: "Active sort entries as `column,-1|1` (use with `v-model:sort`)."
+		},
+		sortMultiple: t("Allow sorting by multiple columns at once."),
+		loading: {
+			type: Boolean,
+			description: "Shows loading rows (skeletons) and a spinner overlay."
+		},
+		loadingSkeleton: {
+			type: Boolean,
+			description: "When set, loading rows use skeleton placeholders."
+		},
+		loadingLines: {
+			type: [Number, String],
+			default: 3,
+			description: "Number of skeleton rows shown while loading."
+		},
+		error: {
+			type: Boolean,
+			description: "Shows the error slot instead of rows."
+		},
+		dense: t("Compact cell padding."),
+		fixed: t("Fixed table layout for consistent column widths."),
+		striped: t("Alternating row background colors."),
+		pointer: t("Pointer cursor on rows (also set when `toFn` or `hrefFn` is used)."),
+		scrollable: {
+			type: Boolean,
+			default: !0,
+			description: "Enables horizontal overflow scrolling for wide tables."
+		},
+		stickyHeader: {
+			type: Boolean,
+			default: !0,
+			description: "Keeps the header row sticky while scrolling."
+		},
+		expandable: t("Adds an expand control and `expanded-row` slot per row."),
+		virtualList: t("Virtualizes rows for large datasets."),
+		virtualListOffsetTop: {
+			type: Number,
+			description: "Top spacer offset (px) when using virtual list."
+		},
+		virtualListOffsetBottom: {
+			type: Number,
+			description: "Bottom spacer offset (px) when using virtual list."
+		},
+		virtualListItemHeight: {
+			type: Number,
+			default: 54,
+			description: "Fixed row height (px) for virtual list measurement."
+		},
+		virtualListOverscan: {
+			type: Number,
+			default: 10,
+			description: "Extra rows rendered above/below the viewport when virtualized."
+		},
+		keyProp: {
+			type: String,
+			description: "Item property used as the stable row key (falls back to index)."
+		},
+		selectable: t("Enables row selection (`v-model:selected`)."),
+		singleSelect: t("Select only one row at a time."),
+		autoClearSelected: {
+			type: Boolean,
+			default: !0,
+			description: "Clears selection entries that no longer exist in `items`."
+		},
+		toFn: {
+			type: Function,
+			description: "Returns a Vue Router location to make each cell a link."
+		},
+		hrefFn: {
+			type: Function,
+			description: "Returns an href to make each cell an anchor."
+		},
+		hrefTarget: {
+			type: String,
+			description: "Target for links created by `hrefFn`."
+		},
+		items: {
+			type: Array,
+			default: () => []
+		},
+		toFn: Function,
+		hrefFn: Function,
+		hrefTarget: String
+	}, {
+		selected: {},
+		selectedModifiers: {}
+	}),
+	emits: /* @__PURE__ */ y(["update:sort", "click-row"], ["update:selected"]),
+	setup(t, { emit: v }) {
+		let y = t, N = re(t, "selected"), P = w(/* @__PURE__ */ new Map()), F = d(() => y.items), { list: de, containerProps: I, wrapperProps: L } = ee(F, {
+			disabled: !y.virtualList,
+			itemHeight: y.virtualListItemHeight || 54,
+			topOffset: y.virtualListOffsetTop || 0,
+			bottomOffset: y.virtualListOffsetBottom || 0,
+			overscan: y.virtualListOverscan
+		});
+		function R(e, t) {
+			if (!y.keyProp || !e || typeof e != "object" || !e) return t;
+			let n = e[y.keyProp];
+			return n == null ? (console.warn(`[XTable] keyProp "${y.keyProp}" is undefined/null for item at index ${t}. Falling back to index.`), t) : typeof n != "string" && typeof n != "number" ? (console.warn(`[XTable] keyProp "${y.keyProp}" must be a string or number, got ${typeof n}. Falling back to index.`), t) : n;
+		}
+		function z(e) {
+			return e.index;
+		}
+		let B = v;
+		function V(e, t) {
+			if (e) for (let n = 0; n < t.length; n++) {
+				let { 0: r, 1: i } = t[n].split(",");
+				if (e === r) return parseInt(i) > 0 ? 1 : -1;
+			}
+		}
+		function H(e) {
+			if (!e.value) return;
+			if (!y.sortMultiple) {
+				let t = y.sort.findIndex((t) => t.split(",")[0] === e.value);
+				t >= 0 ? y.sort[t].split(",")[1] === "-1" ? B("update:sort", [`${e.value},1`]) : B("update:sort", []) : B("update:sort", [`${e.value},-1`]);
+				return;
+			}
+			let t = y.sort.slice(0), n = !1;
+			for (let r = 0; r < t.length; r++) {
+				let { 0: i, 1: a } = t[r].split(",");
+				if (i === e.value) {
+					if (n = !0, a === "-1") {
+						t.splice(r, 1, `${e.value},1`);
+						break;
+					} else if (a === "1") {
+						t.splice(r, 1);
+						break;
+					}
+				}
+			}
+			n || t.push(`${e.value},-1`), B("update:sort", t);
+		}
+		let U = /* @__PURE__ */ new Map();
+		function fe(e, t) {
+			if (!t || !e) return "";
+			let n;
+			return Array.isArray(t) ? n = t : U.has(t) ? n = U.get(t) : (n = t.match(/([^[.\]])+/g), n && U.set(t, n)), !n || n.length === 0 ? "" : n.reduce((e, t) => typeof e != "object" || !e ? null : e[t], e) ?? "";
+		}
+		let W = d(() => y.selectable ? F.value.map((e, t) => R(e, t)) : []), G = d(() => !y.selectable || y.singleSelect || !Array.isArray(N.value) ? /* @__PURE__ */ new Set() : new Set(N.value)), K = d(() => {
+			if (!y.selectable || y.singleSelect || !Array.isArray(N.value) || N.value.length === 0) return !1;
+			let e = W.value.length;
+			return e === 0 ? !1 : N.value.length === e;
+		}), q = d(() => {
+			if (!y.selectable || y.singleSelect || !Array.isArray(N.value) || N.value.length === 0) return !1;
+			let e = W.value.length;
+			return e === 0 ? !1 : N.value.length > 0 && N.value.length !== e;
+		});
+		function J(e) {
+			return y.selectable ? y.singleSelect ? N.value === e : G.value.has(e) : !1;
+		}
+		function Y(e) {
+			y.selectable && (y.singleSelect ? N.value = N.value === e ? void 0 : e : (Array.isArray(N.value) || (N.value = []), G.value.has(e) ? N.value = N.value.filter((t) => t !== e) : N.value = [...N.value, e]));
+		}
+		function X() {
+			!y.selectable || y.singleSelect || (K.value || q.value ? N.value = [] : N.value = W.value);
+		}
+		function pe(e) {
+			if (!y.expandable) return;
+			let t = R(e.data, z(e));
+			P.value.set(t, !P.value.get(t));
+		}
+		function Z(e) {
+			if (!y.expandable) return !1;
+			let t = R(e.data, z(e));
+			return P.value.get(t) ?? !1;
+		}
+		function me(e, t) {
+			let n = z(t);
+			y.selectable && y.singleSelect && Y(R(e, n)), B("click-row", e, n);
+		}
+		let Q = d(() => {
+			let e = y.headers.length;
+			return y.selectable && !y.singleSelect && e++, y.expandable && e++, e;
+		});
+		ae(F, (e) => {
+			let t = /* @__PURE__ */ new Set();
+			e.forEach((e, n) => {
+				t.add(R(e, n));
+			}), y.expandable && P.value.forEach((e, n) => {
+				t.has(n) || P.value.delete(n);
+			}), y.selectable && y.autoClearSelected && (y.singleSelect ? t.has(N.value) || (N.value = void 0) : Array.isArray(N.value) && N.value.length > 0 && (N.value = N.value.filter((e) => t.has(e))));
+		}, { immediate: !0 });
+		let he = ie(), ge = d(() => Object.keys(he).some((e) => e.startsWith("footer-"))), { styles: _e, classes: $, className: ve } = e("Table", {}, y);
+		return (e, ee) => (C(), m("div", b({ class: [O(ve), O($).wrapper] }, O(I)), [
+			E(e.$slots, "title"),
+			E(e.$slots, "actions"),
+			h("div", b(O(L), { class: ["relative", { "!h-auto": y.loading }] }), [h("table", {
+				style: S(O(_e)),
+				class: x(O($).table)
+			}, [
+				_(te, { "sticky-header": e.stickyHeader }, {
+					default: k(() => [
+						y.selectable && !y.singleSelect ? (C(), f(s, {
+							key: 0,
+							width: "40",
+							class: "!pl-3.5 !pr-0.5 !py-2.5 cursor-pointer",
+							onClick: X
+						}, {
+							default: k(() => [_(a, {
+								"model-value": K.value || q.value,
+								indeterminate: q.value,
+								"hide-footer": "",
+								"aria-label": "Select all rows",
+								"skip-form-registry": "",
+								onClick: A(X, ["prevent", "stop"])
+							}, null, 8, ["model-value", "indeterminate"])]),
+							_: 1
+						})) : p("", !0),
+						e.expandable ? (C(), f(s, {
+							key: 1,
+							width: "48",
+							class: "!p-0"
+						})) : p("", !0),
+						(C(!0), m(u, null, T(e.headers, (t, n) => (C(), f(s, {
+							key: n,
+							"text-align": t.align,
+							sort: V(t.value, e.sort),
+							sortable: t.sortable,
+							width: t.width,
+							tooltip: t.tooltip,
+							onClick: (e) => t.sortable ? H(t) : null
+						}, {
+							default: k(() => [E(e.$slots, `header-${t.value}`, { header: t }, () => [g(D(t.text), 1)])]),
+							_: 2
+						}, 1032, [
+							"text-align",
+							"sort",
+							"sortable",
+							"width",
+							"tooltip",
+							"onClick"
+						]))), 128))
+					]),
+					_: 3
+				}, 8, ["sticky-header"]),
+				_(O(ne), null, {
+					default: k(() => [e.loading ? (C(!0), m(u, { key: 0 }, T(Number(e.loadingLines), (t, n) => (C(), f(c, {
+						key: n,
+						striped: e.striped
+					}, {
+						default: k(() => [(C(!0), m(u, null, T(e.headers, (n, r) => (C(), f(l, {
+							key: r,
+							"text-align": n.align,
+							width: n.width,
+							dense: e.dense,
+							fixed: e.fixed
+						}, {
+							default: k(() => [E(e.$slots, `loading-${n.value}`, { item: t }, () => [_(o, {
+								class: x(["max-w-[60%]", {
+									"mx-auto": n.align === "center",
+									"ml-auto": n.align === "right"
+								}]),
+								shape: n.skeletonShape || "line"
+							}, null, 8, ["shape", "class"])])]),
+							_: 2
+						}, 1032, [
+							"text-align",
+							"width",
+							"dense",
+							"fixed"
+						]))), 128))]),
+						_: 2
+					}, 1032, ["striped"]))), 128)) : e.error ? (C(), m("tr", oe, [h("td", { colspan: Q.value }, [E(e.$slots, "error")], 8, se)])) : !F.value || F.value.length === 0 ? (C(), m("tr", j, [h("td", { colspan: Q.value }, [E(e.$slots, "empty")], 8, ce)])) : (C(!0), m(u, { key: 3 }, T(O(de), (i) => (C(), m(u, { key: R(i.data, i.index) }, [_(c, {
+						pointer: e.pointer || !!t.toFn || !!t.hrefFn,
+						striped: e.striped,
+						selected: J(R(i.data, i.index)),
+						"single-select": e.singleSelect,
+						onClick: (e) => me(i.data, i)
+					}, {
+						default: k(() => [
+							y.selectable && !e.singleSelect ? (C(), f(l, {
+								key: 0,
+								width: "40",
+								class: "!pl-3.5 !pr-0.5 cursor-pointer",
+								onClick: A((e) => Y(R(i.data, i.index)), ["stop"])
+							}, {
+								default: k(() => [_(a, {
+									"model-value": J(R(i.data, i.index)),
+									"hide-footer": "",
+									"aria-label": `Select row ${z(i) + 1}`,
+									"skip-form-registry": "",
+									onClick: A((e) => Y(R(i.data, i.index)), ["prevent", "stop"])
+								}, null, 8, [
+									"model-value",
+									"aria-label",
+									"onClick"
+								])]),
+								_: 2
+							}, 1032, ["onClick"])) : p("", !0),
+							e.expandable ? (C(), f(l, {
+								key: 1,
+								width: "48",
+								class: "!p-1"
+							}, {
+								default: k(() => [h("button", {
+									type: "button",
+									class: x(["px-3 p-2", [e.dense ? "p-0.5" : "px-3 py-2"]]),
+									onClick: A((e) => pe(i), ["stop"])
+								}, [_(n, {
+									icon: O(r),
+									size: e.dense ? "xs" : "md",
+									class: x(["transition-transform", { "rotate-180": Z(i) }])
+								}, null, 8, [
+									"icon",
+									"size",
+									"class"
+								])], 10, M)]),
+								_: 2
+							}, 1024)) : p("", !0),
+							(C(!0), m(u, null, T(e.headers, (n, r) => (C(), f(l, {
+								key: r,
+								"text-align": n.align,
+								truncate: n.truncate,
+								width: n.width,
+								dense: e.dense,
+								style: S([y.virtualList ? {
+									height: `${y.virtualListItemHeight}px`,
+									maxHeight: `${y.virtualListItemHeight}px`,
+									overflow: "hidden",
+									whiteSpace: "nowrap"
+								} : {}]),
+								href: t.hrefFn ? t.hrefFn(i.data) : void 0,
+								to: t.toFn ? t.toFn(i.data) : void 0,
+								target: t.hrefFn ? t.hrefTarget : void 0
+							}, {
+								default: k(() => [E(e.$slots, `item-${n.value}`, { item: i.data }, () => [g(D(fe(i.data, n.value)), 1)])]),
+								_: 2
+							}, 1032, [
+								"text-align",
+								"truncate",
+								"width",
+								"dense",
+								"style",
+								"href",
+								"to",
+								"target"
+							]))), 128))
+						]),
+						_: 2
+					}, 1032, [
+						"pointer",
+						"striped",
+						"selected",
+						"single-select",
+						"onClick"
+					]), e.expandable ? (C(), m("tr", {
+						key: 0,
+						class: x({ hidden: !Z(i) })
+					}, [h("td", { colspan: Q.value }, [h("div", { class: x(["overflow-hidden transition-opacity", [Z(i) ? "" : "opacity-0 max-h-0"]]) }, [E(e.$slots, "expanded-row", { item: i.data })], 2)], 8, le)], 2)) : p("", !0)], 64))), 128))]),
+					_: 3
+				}),
+				E(e.$slots, "footer", {}, () => [ge.value && !e.loading ? (C(), m("tfoot", ue, [_(c, null, {
+					default: k(() => [
+						y.selectable && !y.singleSelect ? (C(), f(l, {
+							key: 0,
+							width: "40",
+							class: "!pl-3.5 !pr-0.5"
+						})) : p("", !0),
+						e.expandable ? (C(), f(l, {
+							key: 1,
+							width: "48",
+							class: "!p-0"
+						})) : p("", !0),
+						(C(!0), m(u, null, T(e.headers, (t, n) => (C(), f(l, {
+							key: n,
+							"text-align": t.align,
+							width: t.width,
+							dense: e.dense
+						}, {
+							default: k(() => [E(e.$slots, `footer-${t.value}`, { header: t })]),
+							_: 2
+						}, 1032, [
+							"text-align",
+							"width",
+							"dense"
+						]))), 128))
+					]),
+					_: 3
+				})])) : p("", !0)])
+			], 6), e.loading ? (C(), m("div", {
+				key: 0,
+				class: x(O($).loadingWrapper)
+			}, [_(i, { size: "lg" })], 2)) : p("", !0)], 16)
+		], 16));
+	}
+});
+//#endregion
+export { N as default };

package/lib/components/table/TableBody.js

@@ -1,15 +1,10 @@
-import { defineComponent as d, createVNode as n } from "vue";
-const p = /* @__PURE__ */ d({
-  name: "XTableBody",
-  setup(o, {
-    slots: e
-  }) {
-    return () => {
-      var a;
-      return n("tbody", null, [(a = e.default) == null ? void 0 : a.call(e)]);
-    };
-  }
+import { createVNode as e, defineComponent as t } from "vue";
+//#region src/components/table/TableBody.tsx
+var n = /* @__PURE__ */ t({
+	name: "XTableBody",
+	setup(t, { slots: n }) {
+		return () => e("tbody", null, [n.default?.()]);
+	}
 });
-export {
-  p as default
-};
+//#endregion
+export { n as default };

package/lib/components/table/TableCell.js

@@ -0,0 +1,5 @@
+import e from "./TableCell.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/table/TableCell.vue
+var t = e;
+//#endregion
+export { t as default };

package/lib/components/table/TableCell.vue.d.ts

@@ -8,18 +8,32 @@ declare const tableCellProps: {
     textAlign: {
         type: PropType<"left" | "right" | "center" | "justify" | null>;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    truncate: import("vue").Prop<boolean | undefined>;
+    dense: import("vue").Prop<boolean | undefined>;
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
     };
-    truncate: BooleanConstructor;
-    dense: BooleanConstructor;
-    width: (StringConstructor | NumberConstructor)[];
     verticalAlign: {
         type: PropType<"top" | "bottom" | "baseline" | "middle" | "text-bottom" | "text-top" | null>;
         default: string;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+        description: string;
+    };
+    href: {
+        type: StringConstructor;
+        description: string;
+    };
+    target: {
+        type: PropType<"_blank" | "_self" | "_parent" | "_top">;
+        description: string;
     };
-    to: (ObjectConstructor | StringConstructor)[];
-    href: StringConstructor;
-    target: PropType<"_blank" | "_self" | "_parent" | "_top">;
 };
 export type TableCellTextAlign = typeof validators.textAlign[number];
 export type TableCellVerticalAlign = typeof validators.verticalAlign[number];
@@ -31,37 +45,63 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     textAlign: {
         type: PropType<"left" | "right" | "center" | "justify" | null>;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    truncate: import("vue").Prop<boolean | undefined>;
+    dense: import("vue").Prop<boolean | undefined>;
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
     };
-    truncate: BooleanConstructor;
-    dense: BooleanConstructor;
-    width: (StringConstructor | NumberConstructor)[];
     verticalAlign: {
         type: PropType<"top" | "bottom" | "baseline" | "middle" | "text-bottom" | "text-top" | null>;
         default: string;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+        description: string;
+    };
+    href: {
+        type: StringConstructor;
+        description: string;
+    };
+    target: {
+        type: PropType<"_blank" | "_self" | "_parent" | "_top">;
+        description: string;
     };
-    to: (ObjectConstructor | StringConstructor)[];
-    href: StringConstructor;
-    target: PropType<"_blank" | "_self" | "_parent" | "_top">;
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     textAlign: {
         type: PropType<"left" | "right" | "center" | "justify" | null>;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    truncate: import("vue").Prop<boolean | undefined>;
+    dense: import("vue").Prop<boolean | undefined>;
+    width: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
     };
-    truncate: BooleanConstructor;
-    dense: BooleanConstructor;
-    width: (StringConstructor | NumberConstructor)[];
     verticalAlign: {
         type: PropType<"top" | "bottom" | "baseline" | "middle" | "text-bottom" | "text-top" | null>;
         default: string;
         validator: (value: string) => boolean;
+        description: string;
+    };
+    to: {
+        type: (ObjectConstructor | StringConstructor)[];
+        description: string;
+    };
+    href: {
+        type: StringConstructor;
+        description: string;
+    };
+    target: {
+        type: PropType<"_blank" | "_self" | "_parent" | "_top">;
+        description: string;
     };
-    to: (ObjectConstructor | StringConstructor)[];
-    href: StringConstructor;
-    target: PropType<"_blank" | "_self" | "_parent" | "_top">;
 }>> & Readonly<{}>, {
-    truncate: boolean;
-    dense: boolean;
     verticalAlign: "top" | "bottom" | "baseline" | "middle" | "text-bottom" | "text-top" | null;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
     default?(_: {}): any;

package/lib/components/table/TableCell.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,96 @@
+import { useTheme as e } from "../../composables/useTheme.js";
+import { optionalBooleanProp as t } from "../../common/props.js";
+import { computed as n, createBlock as r, createElementBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, normalizeClass as c, normalizeStyle as l, openBlock as u, renderSlot as d, resolveDynamicComponent as f, unref as p, withCtx as m } from "vue";
+//#region src/components/table/TableCell.vue?vue&type=script&setup=true&lang.ts
+var h = {
+	textAlign: [
+		null,
+		"left",
+		"center",
+		"right",
+		"justify"
+	],
+	verticalAlign: [
+		null,
+		"baseline",
+		"bottom",
+		"middle",
+		"text-bottom",
+		"text-top",
+		"top"
+	]
+}, g = /* @__PURE__ */ o({
+	name: "XTableCell",
+	validators: h,
+	docs: { slots: { default: "Cell content." } },
+	props: {
+		textAlign: {
+			type: String,
+			validator: (e) => h.textAlign.includes(e),
+			description: "Horizontal text alignment."
+		},
+		truncate: t("Truncates overflowing cell content with an ellipsis."),
+		dense: t("Compact cell padding."),
+		width: {
+			type: [String, Number],
+			description: "Fixed cell width (number is treated as px)."
+		},
+		verticalAlign: {
+			type: String,
+			default: "middle",
+			validator: (e) => h.verticalAlign.includes(e),
+			description: "Vertical alignment of cell content."
+		},
+		to: {
+			type: [String, Object],
+			description: "Vue Router location; wraps cell content in a router-link."
+		},
+		href: {
+			type: String,
+			description: "Anchor href; wraps cell content in a link."
+		},
+		target: {
+			type: String,
+			description: "Link target when `href` or `to` is set."
+		}
+	},
+	setup(t) {
+		let o = t, h = n(() => typeof o.width == "number" ? `${o.width}px` : o.width), { styles: g, classes: _, className: v } = e("TableCell", {}, o);
+		return (e, t) => e.to || e.href ? (u(), i("td", {
+			key: 0,
+			class: c(["relative", p(v)]),
+			style: l([{
+				width: h.value,
+				minWidth: h.value,
+				maxWidth: h.value
+			}])
+		}, [(u(), r(f(e.to ? "router-link" : "a"), s(e.href ? { href: e.href } : {}, {
+			target: e.target,
+			to: e.to,
+			style: p(g),
+			class: p(_).wrapper
+		}), {
+			default: m(() => [a("div", { class: c([e.truncate ? "truncate" : ""]) }, [d(e.$slots, "default")], 2)]),
+			_: 3
+		}, 16, [
+			"target",
+			"to",
+			"style",
+			"class"
+		]))], 6)) : (u(), i("td", {
+			key: 1,
+			style: l([p(g), {
+				width: h.value,
+				minWidth: h.value,
+				maxWidth: h.value
+			}]),
+			class: c([
+				"relative",
+				p(v),
+				p(_).wrapper
+			])
+		}, [d(e.$slots, "default")], 6));
+	}
+});
+//#endregion
+export { g as default };

package/lib/components/table/TableHead.js

@@ -0,0 +1,5 @@
+import e from "./TableHead.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/table/TableHead.vue
+var t = e;
+//#endregion
+export { t as default };