Newer
Older
vmk-ui-kit / src / vue / components / GnTable.js
/**
 * GnTable - Table wrapper with optional sortable/selectable variants.
 */

import { defineComponent, h, computed } from "vue";
import { cx } from "../utils.js";

export default defineComponent({
	name: "GnTable",
	props: {
		compact: { type: Boolean, default: false },
		striped: { type: Boolean, default: false },
		sortable: { type: Boolean, default: false },
		selectable: { type: Boolean, default: false }
	},
	setup(props, { slots }) {
		const classes = computed(() => cx("table", {
			"table-compact": props.compact,
			"table-striped": props.striped,
			"table-sortable": props.sortable,
			"table-selectable": props.selectable
		}));

		return () => h("div", { class: "table-container" }, [
			h("table", { class: classes.value }, slots.default?.())
		]);
	}
});