@vizejs/ui 0.387.0 → 0.388.0

package/dist/table-BxU7htxc.mjs

@@ -0,0 +1,349 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { computed, createElementBlock, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, renderSlot, useTemplateRef } from "vue";
+//#region src/families/data/table/table.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$4 = ["data-layout", "data-density"];
+//#endregion
+//#region src/families/data/table/table.vue
+var table_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table",
+	props: {
+		layout: {
+			type: String,
+			required: false,
+			default: "auto"
+		},
+		density: {
+			type: String,
+			required: false,
+			default: "normal"
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const layoutState = computed(() => __props.layout);
+		const densityState = computed(() => __props.density);
+		const tableStyle = computed(() => ({
+			"--vize-ui-table-layout": layoutState.value,
+			tableLayout: layoutState.value
+		}));
+		const intrinsicProps = computed(() => ({ style: tableStyle.value }));
+		const slotState = computed(() => ({
+			density: densityState.value,
+			layout: layoutState.value,
+			style: tableStyle.value
+		}));
+		__expose({
+			density: densityState,
+			element,
+			layout: layoutState,
+			style: tableStyle
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("table", mergeProps({
+				ref_key: "element",
+				ref: element,
+				"data-vize-ui": "table",
+				part: "root",
+				"data-layout": layoutState.value,
+				"data-density": densityState.value
+			}, intrinsicProps.value), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 16, _hoisted_1$4);
+		};
+	}
+}), [["__scopeId", "data-v-ab1f9add"]]);
+//#endregion
+//#region src/families/data/table/table-body.vue?vue&type=script&setup=true&lang.ts
+const section$1 = "body";
+//#endregion
+//#region src/families/data/table/table-body.vue
+var table_body_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-body",
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const slotState = { section: section$1 };
+		__expose({
+			element,
+			section: section$1
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("tbody", {
+				ref_key: "element",
+				ref: element,
+				"data-vize-ui": "table-body",
+				part: "body",
+				"data-section": "body"
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState)), void 0, true)], 512);
+		};
+	}
+}), [["__scopeId", "data-v-bd7460bd"]]);
+//#endregion
+//#region src/families/data/table/table-caption.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$3 = ["data-caption-side"];
+//#endregion
+//#region src/families/data/table/table-caption.vue
+var table_caption_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-caption",
+	props: { side: {
+		type: String,
+		required: false,
+		default: "top"
+	} },
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const sideState = computed(() => __props.side);
+		const captionStyle = computed(() => ({
+			"--vize-ui-table-caption-side": sideState.value,
+			captionSide: sideState.value
+		}));
+		const intrinsicProps = computed(() => ({ style: captionStyle.value }));
+		const slotState = computed(() => ({
+			side: sideState.value,
+			style: captionStyle.value
+		}));
+		__expose({
+			element,
+			side: sideState,
+			style: captionStyle
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("caption", mergeProps({
+				ref_key: "element",
+				ref: element,
+				"data-vize-ui": "table-caption",
+				part: "caption",
+				"data-caption-side": sideState.value
+			}, intrinsicProps.value), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 16, _hoisted_1$3);
+		};
+	}
+}), [["__scopeId", "data-v-1cfd629a"]]);
+//#endregion
+//#region src/families/data/table/table-cell.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$2 = [
+	"headers",
+	"colspan",
+	"rowspan",
+	"data-align",
+	"data-colspan",
+	"data-rowspan"
+];
+//#endregion
+//#region src/families/data/table/table-cell.vue
+var table_cell_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-cell",
+	props: {
+		headers: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		colspan: {
+			type: Number,
+			required: false,
+			default: () => void 0
+		},
+		rowspan: {
+			type: Number,
+			required: false,
+			default: () => void 0
+		},
+		align: {
+			type: String,
+			required: false,
+			default: "start"
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const headersState = computed(() => __props.headers);
+		const colspanState = computed(() => __props.colspan);
+		const rowspanState = computed(() => __props.rowspan);
+		const alignState = computed(() => __props.align);
+		const cellStyle = computed(() => ({
+			"--vize-ui-table-cell-align": alignState.value,
+			textAlign: alignState.value
+		}));
+		const intrinsicProps = computed(() => ({ style: cellStyle.value }));
+		const slotState = computed(() => ({
+			align: alignState.value,
+			colspan: colspanState.value,
+			headers: headersState.value,
+			rowspan: rowspanState.value,
+			style: cellStyle.value
+		}));
+		__expose({
+			align: alignState,
+			colspan: colspanState,
+			element,
+			headers: headersState,
+			rowspan: rowspanState,
+			style: cellStyle
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("td", mergeProps({
+				ref_key: "element",
+				ref: element,
+				headers: headersState.value,
+				colspan: colspanState.value,
+				rowspan: rowspanState.value,
+				"data-vize-ui": "table-cell",
+				part: "cell",
+				"data-align": alignState.value,
+				"data-colspan": colspanState.value,
+				"data-rowspan": rowspanState.value
+			}, intrinsicProps.value), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 16, _hoisted_1$2);
+		};
+	}
+}), [["__scopeId", "data-v-4364bb73"]]);
+//#endregion
+//#region src/families/data/table/table-head.vue?vue&type=script&setup=true&lang.ts
+const section = "head";
+//#endregion
+//#region src/families/data/table/table-head.vue
+var table_head_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-head",
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const slotState = { section };
+		__expose({
+			element,
+			section
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("thead", {
+				ref_key: "element",
+				ref: element,
+				"data-vize-ui": "table-head",
+				part: "head",
+				"data-section": "head"
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState)), void 0, true)], 512);
+		};
+	}
+}), [["__scopeId", "data-v-dba649fa"]]);
+//#endregion
+//#region src/families/data/table/table-header.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$1 = [
+	"scope",
+	"abbr",
+	"colspan",
+	"rowspan",
+	"data-scope",
+	"data-align",
+	"data-colspan",
+	"data-rowspan"
+];
+//#endregion
+//#region src/families/data/table/table-header.vue
+var table_header_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-header",
+	props: {
+		scope: {
+			type: String,
+			required: false,
+			default: "col"
+		},
+		abbr: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		colspan: {
+			type: Number,
+			required: false,
+			default: () => void 0
+		},
+		rowspan: {
+			type: Number,
+			required: false,
+			default: () => void 0
+		},
+		align: {
+			type: String,
+			required: false,
+			default: "start"
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const scopeState = computed(() => __props.scope);
+		const abbrState = computed(() => __props.abbr);
+		const colspanState = computed(() => __props.colspan);
+		const rowspanState = computed(() => __props.rowspan);
+		const alignState = computed(() => __props.align);
+		const cellStyle = computed(() => ({
+			"--vize-ui-table-cell-align": alignState.value,
+			textAlign: alignState.value
+		}));
+		const intrinsicProps = computed(() => ({ style: cellStyle.value }));
+		const slotState = computed(() => ({
+			abbr: abbrState.value,
+			align: alignState.value,
+			colspan: colspanState.value,
+			rowspan: rowspanState.value,
+			scope: scopeState.value,
+			style: cellStyle.value
+		}));
+		__expose({
+			abbr: abbrState,
+			align: alignState,
+			colspan: colspanState,
+			element,
+			rowspan: rowspanState,
+			scope: scopeState,
+			style: cellStyle
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("th", mergeProps({
+				ref_key: "element",
+				ref: element,
+				scope: scopeState.value,
+				abbr: abbrState.value,
+				colspan: colspanState.value,
+				rowspan: rowspanState.value,
+				"data-vize-ui": "table-header",
+				part: "header",
+				"data-scope": scopeState.value,
+				"data-align": alignState.value,
+				"data-colspan": colspanState.value,
+				"data-rowspan": rowspanState.value
+			}, intrinsicProps.value), [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 16, _hoisted_1$1);
+		};
+	}
+}), [["__scopeId", "data-v-4db1f7e7"]]);
+//#endregion
+//#region src/families/data/table/table-row.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = ["data-state", "data-selected"];
+//#endregion
+//#region src/families/data/table/table-row.vue
+var table_row_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "table-row",
+	props: { state: {
+		type: String,
+		required: false,
+		default: "default"
+	} },
+	setup(__props, { expose: __expose }) {
+		const element = useTemplateRef("element");
+		const stateState = computed(() => __props.state);
+		const selected = computed(() => stateState.value === "selected");
+		const slotState = computed(() => ({
+			selected: selected.value,
+			state: stateState.value
+		}));
+		__expose({
+			element,
+			selected,
+			state: stateState
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("tr", {
+				ref_key: "element",
+				ref: element,
+				"data-vize-ui": "table-row",
+				part: "row",
+				"data-state": stateState.value,
+				"data-selected": selected.value ? "true" : void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), void 0, true)], 8, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-13ed59e0"]]);
+//#endregion
+export { table_caption_default as a, table_cell_default as i, table_header_default as n, table_body_default as o, table_head_default as r, table_default as s, table_row_default as t };