@fastkit/vui 1.4.0-next.0 → 1.4.0

package/dist/vui.mjs

@@ -18,43 +18,24 @@ import { DISABLED_REASON_CONTAINER_BIND, defineDisabledReasonComponent } from "@
 import { loadImage } from "@fastkit/dom";
 import { RouterLink, useLink, useRoute, useRouter } from "vue-router";
 import { installResizeDirective, resizeDirectiveArgument } from "@fastkit/vue-resize";
-
-export * from "@fastkit/helpers"
-
-export * from "@fastkit/icon-font"
-
-export * from "@fastkit/media-match"
-
-export * from "@fastkit/vue-media-match"
-
-export * from "@fastkit/vue-keyboard"
-
-export * from "@fastkit/vue-transitions"
-
-export * from "@fastkit/vue-location"
-
-export * from "@fastkit/rules"
-
-export * from "@fastkit/vue-body-scroll-lock"
-
-export * from "@fastkit/vue-click-outside"
-
-export * from "@fastkit/vue-app-layout"
-
-export * from "@fastkit/vue-color-scheme"
-
-export * from "@fastkit/vue-form-control"
-
-export * from "@fastkit/vue-scroller"
-
-export * from "@fastkit/vue-stack"
-
-export * from "@fastkit/vue-action"
-
-export * from "@fastkit/vue-utils"
-
-export * from "@fastkit/vue-loading"
-
+export * from "@fastkit/helpers";
+export * from "@fastkit/icon-font";
+export * from "@fastkit/media-match";
+export * from "@fastkit/vue-media-match";
+export * from "@fastkit/vue-keyboard";
+export * from "@fastkit/vue-transitions";
+export * from "@fastkit/vue-location";
+export * from "@fastkit/rules";
+export * from "@fastkit/vue-body-scroll-lock";
+export * from "@fastkit/vue-click-outside";
+export * from "@fastkit/vue-app-layout";
+export * from "@fastkit/vue-color-scheme";
+export * from "@fastkit/vue-form-control";
+export * from "@fastkit/vue-scroller";
+export * from "@fastkit/vue-stack";
+export * from "@fastkit/vue-action";
+export * from "@fastkit/vue-utils";
+export * from "@fastkit/vue-loading";
 //#region src/schemes/control.ts
 const CONTROL_SIZES = [
 	"sm",
@@ -71,7 +52,6 @@ const CONTROL_LOADING_SPINNER_SIZES = {
 	md: 20,
 	lg: 24
 };
-
 //#endregion
 //#region src/injections.ts
 const VuiInjectionKey = Symbol("Vui");
@@ -110,7 +90,6 @@ function useVuiColorProvider() {
 	provide(VuiColorProviderInjectionKey, provider);
 	return provider;
 }
-
 //#endregion
 //#region src/composables/control.ts
 function createControlProps() {
@@ -160,7 +139,6 @@ function useControlField(props, opts = {}) {
 	provide(VuiControlFieldInjectionKey, provider);
 	return provider;
 }
-
 //#endregion
 //#region src/components/VIcon/VIcon.tsx
 const _rawIconProp = [String, Function];
@@ -195,21 +173,16 @@ const VIcon = defineComponent({
 		return () => createVNode("span", { "class": [`v-icon notranslate`, classes.value] }, [createVNode("i", iconAttrs.value, null)]);
 	}
 });
-
-//#endregion
-//#region src/components/VMenu/VMenu.tsx
-const colorProps$2 = colorSchemeProps();
 const VMenu = defineMenuComponent({
 	name: "VMenu",
 	attrs: { class: "v-menu" },
-	props: { ...colorProps$2 },
+	props: { ...colorSchemeProps() },
 	setup(ctx) {
 		const color = useColorClasses(ctx.props, { useRootThemeDefault: true });
 		ctx.setupContext.expose({ menu: ctx });
 		return (children) => createVNode("div", mergeProps({ "class": ["v-menu__body", color.colorClasses.value] }, ctx.attrs), [children]);
 	}
 });
-
 //#endregion
 //#region src/components/VTooltip/VTooltip.tsx
 const VTooltip = defineComponent({
@@ -232,7 +205,6 @@ const VTooltip = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VFormControl/VFormControl.tsx
 const { props: props$11, emits: emits$11 } = createFormNodeWrapperSettings();
@@ -320,7 +292,6 @@ const VFormControl = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/composables/form-selector.tsx
 const slots$10 = defineSlots();
@@ -414,7 +385,6 @@ function defineFormSelectorComponent(opts) {
 		}
 	});
 }
-
 //#endregion
 //#region src/composables/elevation.ts
 function createElevationProps() {
@@ -430,7 +400,6 @@ function useElevation(props, opts = {}) {
 		})
 	};
 }
-
 //#endregion
 //#region src/components/VDialog/VDialog.tsx
 const colorProps$1 = colorSchemeProps();
@@ -459,7 +428,6 @@ const VDialog = defineDialogComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VSnackbar/VSnackbar.tsx
 const colorProps = colorSchemeProps();
@@ -483,7 +451,6 @@ const VSnackbar = defineSnackbarComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VSheetModal/VSheetModal.tsx
 const { props: props$10, emits: emits$10 } = createStackableDefine({
@@ -522,7 +489,6 @@ const VSheetModal = defineComponent({
 		}, [headerSlot && createVNode("div", { "class": "v-sheet-modal__header" }, [headerSlot(this.stackControl)]), createVNode("div", { "class": "v-sheet-modal__scroller" }, [children])]));
 	}
 });
-
 //#endregion
 //#region src/components/VSkeltonLoader/VSkeltonLoaderBone.tsx
 const VSkeltonLoaderBone = defineComponent({
@@ -539,16 +505,22 @@ const VSkeltonLoaderBone = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VDisabledReason/VDisabledReason.tsx
 function _isSlot$10(s) {
 	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
 }
-const menuProps = createMenuProps();
 const DISABLED_REASON_PROPS = {
-	...menuProps,
-	...createPropsOptions({ type: {
+	...createMenuProps(),
+	...createPropsOptions({ 
+	/**
+	* Display type
+	*
+	* Currently, only tooltip is supported
+	*
+	* @see {@link DisabledReasonType}
+	*/
+type: {
 		type: String,
 		default: "tooltip"
 	} })
@@ -582,7 +554,6 @@ registerActionableRenderWrapper((customProps, currentNode) => {
 	if (disabledReasonInput) return createVNode(VDisabledReason, disabledReasonInput, _isSlot$10(currentNode) ? currentNode : { default: () => [currentNode] });
 	return currentNode;
 });
-
 //#endregion
 //#region src/components/VBusyImage/VBusyImage.tsx
 const IMAGE_ATTRS = [
@@ -748,14 +719,12 @@ function imageIsReady(image) {
 function isAvailableSrc(src) {
 	return typeof src === "string" && src !== "";
 }
-
 //#endregion
 //#region src/components/VGrid/schemes.ts
 function extractRawGridValueClasses(value, prefix, getter) {
 	if (typeof value !== "object") return `${prefix}${getter ? getter(value) : value}`;
 	return Object.entries(value).map(([breakpoint, breakpointValue]) => `${prefix}${getter ? getter(breakpointValue) : breakpointValue}--${breakpoint}`);
 }
-
 //#endregion
 //#region src/components/VGrid/VGridItem.tsx
 const VGridItem = defineComponent({
@@ -796,7 +765,6 @@ const VGridItem = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VGrid/VGridContainer.tsx
 function spacingValueToString(value) {
@@ -863,7 +831,6 @@ const VGridContainer = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VPaper/VPaper.tsx
 const paperBaseSlots = defineSlots();
@@ -925,7 +892,6 @@ const VPaper = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VAvatar/VAvatar.tsx
 const AVATAR_SIZES = [
@@ -991,7 +957,6 @@ const VAvatar = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VChip/VChip.tsx
 const CHIP_SIZES = [
@@ -1065,7 +1030,6 @@ const VChip = defineComponent({
 		]);
 	}
 });
-
 //#endregion
 //#region src/components/VCard/VCard.tsx
 function createCardProps() {
@@ -1100,7 +1064,6 @@ const VCard = defineComponent({
 		return () => createVNode(VPaper, data.value.attrs, ctx.slots);
 	}
 });
-
 //#endregion
 //#region src/components/VCard/VCardContent.tsx
 const VCardContent = defineComponent({
@@ -1109,7 +1072,6 @@ const VCardContent = defineComponent({
 		return () => createVNode("div", { "class": "v-card-content" }, [ctx.slots.default?.()]);
 	}
 });
-
 //#endregion
 //#region src/components/VCard/VCardActions.tsx
 const VCardActions = defineComponent({
@@ -1118,7 +1080,6 @@ const VCardActions = defineComponent({
 		return () => createVNode("div", { "class": "v-card-actions" }, [ctx.slots.default?.()]);
 	}
 });
-
 //#endregion
 //#region src/components/VButton/VButton.tsx
 const BUTTON_ALIGNS = [
@@ -1210,7 +1171,6 @@ const VButton = defineComponent({
 		}, null)])) });
 	}
 });
-
 //#endregion
 //#region src/components/VButton/VButtonGroup.tsx
 const VButtonGroup = defineComponent({
@@ -1262,7 +1222,6 @@ const VButtonGroup = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VPagination/VPagination.tsx
 function _isSlot$9(s) {
@@ -1275,21 +1234,36 @@ const PAGINATION_ALIGNS = [
 ];
 function paginationProps() {
 	return createPropsOptions({
+		/**
+		* Active Pages
+		*/
 		modelValue: {
 			type: rawNumberPropType,
 			default: 1
 		},
+		/**
+		* Total number of pages
+		*/
 		length: {
 			type: rawNumberPropType,
 			default: 0
 		},
+		/**
+		* Maximum number of links to display.
+		*/
 		totalVisible: rawNumberPropType,
+		/**
+		* true when narrowing
+		*/
 		dense: Boolean,
 		disabled: Boolean,
 		align: {
 			type: String,
 			default: "center"
 		},
+		/**
+		* To synchronize with a query, use the query name
+		*/
 		routeQuery: String,
 		beforeChange: Function,
 		color: String
@@ -1444,14 +1418,11 @@ const VPagination = defineComponent({
 			};
 			const key = `${source}-${index}`;
 			const { routeQuery } = props;
-			if (page !== void 0 && routeQuery) {
-				const to = createRoutableLocationByPage(page, routeQuery);
-				return createVNode(RouterLink, {
-					"class": classes,
-					"to": to,
-					"key": key
-				}, _isSlot$9(children) ? children : { default: () => [children] });
-			}
+			if (page !== void 0 && routeQuery) return createVNode(RouterLink, {
+				"class": classes,
+				"to": createRoutableLocationByPage(page, routeQuery),
+				"key": key
+			}, _isSlot$9(children) ? children : { default: () => [children] });
 			return createVNode("button", {
 				"class": classes,
 				"type": "button",
@@ -1486,7 +1457,6 @@ const VPagination = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VListTile/VListTile.tsx
 function createListTileProps() {
@@ -1552,7 +1522,6 @@ const VListTile = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VDrawerLayout/VDrawerLayout.tsx
 const VDrawerLayout = defineComponent({
@@ -1561,14 +1530,13 @@ const VDrawerLayout = defineComponent({
 	slots: paperBaseSlots,
 	setup(props, ctx) {
 		return () => {
-			const paperProps = computed(() => ({
-				color: props.color,
-				tag: props.tag
-			}));
 			return createVNode(VPaper, mergeProps({
 				"class": "v-drawer-layout",
 				"innerClass": "v-drawer-layout__inner"
-			}, paperProps.value, {
+			}, computed(() => ({
+				color: props.color,
+				tag: props.tag
+			})).value, {
 				"square": true,
 				"headerProps": { class: "v-drawer-layout__header" },
 				"bodyProps": { class: "v-drawer-layout__body" },
@@ -1577,7 +1545,6 @@ const VDrawerLayout = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VHero/VHero.tsx
 const slots$8 = defineSlots();
@@ -1608,7 +1575,6 @@ const VHero = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VNavigation/VNavigationItem.tsx
 function _isSlot$8(s) {
@@ -1741,7 +1707,6 @@ const VNavigationItem = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VNavigation/VNavigation.tsx
 function createNavigationProps() {
@@ -1801,7 +1766,6 @@ const VNavigation = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VControlField/VControlField.tsx
 const ADORNMENT_POSITIONS = ["start", "end"];
@@ -1886,7 +1850,6 @@ const VControlField = defineComponent({
 		]);
 	}
 });
-
 //#endregion
 //#region src/components/VTextCounter/VTextCounter.tsx
 const VTextCounter = defineComponent({
@@ -1905,7 +1868,6 @@ const VTextCounter = defineComponent({
 		return createVNode("span", { "class": "v-text-counter" }, [`${this.length} / ${this.maxlength}`]);
 	}
 });
-
 //#endregion
 //#region src/components/VCheckable/VCheckable.tsx
 const CHECKABLE_SLOTS = defineSlots();
@@ -1936,7 +1898,6 @@ const VCheckable = defineComponent({
 		return () => createVNode("label", mergeProps({ "class": ["v-checkable", classes.value] }, DISABLED_REASON_CONTAINER_BIND), [createVNode("span", { "class": "v-checkable__faux" }, [ctx.slots.input?.(), ctx.slots.icon ? ctx.slots.icon() : createVNode("span", { "class": "v-checkable__faux__icon" }, [ctx.slots.faux?.()])]), createVNode("span", { "class": "v-checkable__label" }, [ctx.slots.label?.()])]);
 	}
 });
-
 //#endregion
 //#region src/components/VCheckbox/VCheckbox.tsx
 const { props: props$9, emits: emits$9 } = createFormSelectorItemSettings();
@@ -1981,7 +1942,6 @@ const VCheckbox = defineComponent({
 		}, withCtxForSlots(slots));
 	}
 });
-
 //#endregion
 //#region src/components/VCheckboxGroup/VCheckboxGroup.tsx
 function _isSlot$7(s) {
@@ -1994,7 +1954,6 @@ const VCheckboxGroup = defineFormSelectorComponent({
 	className: "v-checkbox-group",
 	itemRenderer: ({ attrs, slots }) => createVNode(VCheckbox, attrs, _isSlot$7(slots) ? slots : { default: () => [slots] })
 });
-
 //#endregion
 //#region src/components/VRadio/VRadio.tsx
 const { props: props$8, emits: emits$8 } = createFormSelectorItemSettings();
@@ -2030,7 +1989,6 @@ const VRadio = defineComponent({
 		}, withCtxForSlots(slots));
 	}
 });
-
 //#endregion
 //#region src/components/VRadioGroup/VRadioGroup.tsx
 function _isSlot$6(s) {
@@ -2042,7 +2000,6 @@ const VRadioGroup = defineFormSelectorComponent({
 	className: "v-radio-group",
 	itemRenderer: ({ attrs, slots }) => createVNode(VRadio, attrs, _isSlot$6(slots) ? slots : { default: () => [slots] })
 });
-
 //#endregion
 //#region src/components/VSwitch/VSwitch.tsx
 const { props: props$7, emits: emits$7 } = createFormSelectorItemSettings();
@@ -2086,7 +2043,6 @@ const VSwitch = defineComponent({
 		}, withCtxForSlots(slots));
 	}
 });
-
 //#endregion
 //#region src/components/VSwitchGroup/VSwitchGroup.tsx
 function _isSlot$5(s) {
@@ -2099,7 +2055,6 @@ const VSwitchGroup = defineFormSelectorComponent({
 	className: "v-switch-group",
 	itemRenderer: ({ attrs, slots }) => createVNode(VSwitch, attrs, _isSlot$5(slots) ? slots : { default: () => [slots] })
 });
-
 //#endregion
 //#region src/components/VOption/VOption.tsx
 const { props: props$6, emits: emits$6 } = createFormSelectorItemSettings();
@@ -2134,7 +2089,6 @@ const VOption = defineComponent({
 		}, [createVNode("span", { "class": "v-option__label" }, [ctx.slots.default?.()])]);
 	}
 });
-
 //#endregion
 //#region src/components/VOptionGroup/VOptionGroup.tsx
 const slots$6 = defineSlots();
@@ -2157,7 +2111,6 @@ const VOptionGroup = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VSelect/VSelect.tsx
 function _isSlot$4(s) {
@@ -2392,9 +2345,8 @@ const VSelect = defineComponent({
 				"onClick": (ev) => {
 					if (inputControl.canOperation && !menu.isActive) {
 						let t = ev.target;
-						const count = 0;
 						let hit = false;
-						while (count < 5) {
+						while (true) {
 							if (t.classList.contains("v-select__input")) {
 								hit = true;
 								break;
@@ -2440,7 +2392,6 @@ const VSelect = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VTextField/VTextField.tsx
 const { props: props$4, emits: emits$4 } = createTextInputNodeSettings();
@@ -2499,7 +2450,6 @@ const VTextField = defineComponent({
 		});
 	}
 });
-
 //#endregion
 //#region src/components/VNumberField/VNumberField.tsx
 const toString = (value) => {
@@ -2548,7 +2498,6 @@ const VNumberField = defineComponent({
 		}), ctx.slots);
 	}
 });
-
 //#endregion
 //#region src/components/VTextarea/VTextarea.tsx
 const { props: props$3, emits: emits$3 } = createTextareaNodeSettings();
@@ -2605,7 +2554,6 @@ const VTextarea = defineComponent({
 		});
 	}
 });
-
 //#endregion
 //#region src/components/VFileInput/VFileInput.tsx
 const { props: props$2, emits: emits$2 } = createFileInputNodeSettings();
@@ -2699,7 +2647,6 @@ const VFileInput = defineComponent({
 		});
 	}
 });
-
 //#endregion
 //#region src/components/VFormGroup/VFormGroup.tsx
 const { props: props$1, emits: emits$1 } = createFormGroupSettings();
@@ -2724,7 +2671,6 @@ const VFormGroup = defineComponent({
 		return () => ctx.slots.default?.(nodeControl);
 	}
 });
-
 //#endregion
 //#region src/components/VForm/VForm.tsx
 const { props, emits } = createFormSettings({ nodeType: VUI_FORM_SYMBOL });
@@ -2763,7 +2709,6 @@ const VForm = defineComponent({
 		return { control: nodeControl };
 	}
 });
-
 //#endregion
 //#region src/components/VTabs/VTab.tsx
 function _isSlot$3(s) {
@@ -2792,14 +2737,11 @@ const VTab = defineComponent({
 			const { to, value, icon, active } = props;
 			const classes = ["v-tab", classesRef.value];
 			const children = createVNode("span", { "class": "v-tab__content" }, [icon && resolveRawIconProp(active, icon, { class: "v-tab__icon" }), ctx.slots.default?.()]);
-			if (to) {
-				const replace = typeof to === "string" ? void 0 : to.replace;
-				return createVNode(RouterLink, {
-					"class": classes,
-					"to": to,
-					"replace": replace
-				}, _isSlot$3(children) ? children : { default: () => [children] });
-			}
+			if (to) return createVNode(RouterLink, {
+				"class": classes,
+				"to": to,
+				"replace": typeof to === "string" ? void 0 : to.replace
+			}, _isSlot$3(children) ? children : { default: () => [children] });
 			return createVNode("button", {
 				"class": classes,
 				"type": "button",
@@ -2811,7 +2753,6 @@ const VTab = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VTabs/VTabs.tsx
 function _isSlot$2(s) {
@@ -2826,11 +2767,21 @@ const VTabs = defineComponent({
 			type: Array,
 			required: true
 		},
+		/**
+		* 自動スクロールする際の余剰オフセット幅（px）
+		*/
 		autoScrollOffset: {
 			type: Number,
 			default: 20
 		},
+		/**
+		* ルーター同期する場合設定する
+		*/
 		router: Function,
+		/**
+		* ルーティング連携を行う際に、クエリベースのURLマッチングを行う
+		* タブのURLが /page1?tab=xxx のようになる時に設定する
+		*/
 		withQuery: Boolean,
 		color: String,
 		onBeforeChange: Function,
@@ -2985,10 +2936,9 @@ const VTabs = defineComponent({
 					active,
 					vui
 				}) : label;
-				const _to = location && location.to || void 0;
 				return createVNode(VTab, {
 					"value": value,
-					"to": _to,
+					"to": location && location.to || void 0,
 					"icon": icon,
 					"active": active,
 					"ref": setTabRef,
@@ -3008,7 +2958,6 @@ const VTabs = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VBreadcrumbs/VBreadcrumbs.tsx
 function _isSlot$1(s) {
@@ -3074,7 +3023,6 @@ const VBreadcrumbs = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VContentSwitcher/VContentSwitcher.tsx
 function _isSlot(s) {
@@ -3175,7 +3123,6 @@ const VContentSwitcher = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VDataTable/VDataTable.tsx
 const DATA_TABLE_DEFAULTS = {
@@ -3206,6 +3153,7 @@ const SELECTABLE_HEADER_SYMBOL = "__selectable_header__";
 const VDataTable = defineComponent({
 	name: "VDataTable",
 	props: {
+		/** 選択中のkeyの配列 */
 		modelValue: {
 			type: Array,
 			default: () => []
@@ -3214,22 +3162,37 @@ const VDataTable = defineComponent({
 			type: String,
 			default: () => DATA_TABLE_DEFAULTS.itemKey
 		},
+		/**
+		* ページネーションクエリ名
+		*/
 		pageQuery: {
 			type: String,
 			default: () => DATA_TABLE_DEFAULTS.pageQuery
 		},
+		/**
+		* ソートクエリ名
+		*/
 		sortQuery: {
 			type: String,
 			default: () => DATA_TABLE_DEFAULTS.sortQuery
 		},
+		/**
+		* 表示順クエリ名
+		*/
 		orderQuery: {
 			type: String,
 			default: () => DATA_TABLE_DEFAULTS.orderQuery
 		},
+		/**
+		* 検索クエリ名
+		*/
 		searchQuery: {
 			type: [String, Array],
 			default: () => DATA_TABLE_DEFAULTS.searchQuery
 		},
+		/**
+		* リミット件数クエリ名
+		*/
 		limitQuery: {
 			type: String,
 			default: () => DATA_TABLE_DEFAULTS.limitQuery
@@ -3496,7 +3459,7 @@ const VDataTable = defineComponent({
 			const isIndeterminate = isIndeterminateRef.value;
 			const isAllSelected = isAllSelectedRef.value;
 			const { defaultOrder, ascQueryValue } = props;
-			const children = headersRef.value.map((header) => {
+			return createVNode("thead", { "class": "v-data-table__table__header" }, [createVNode("tr", null, [headersRef.value.map((header) => {
 				const { label, sortQuery, align, key } = header;
 				const headerChildren = [];
 				if (label != null && typeof label !== "boolean") {
@@ -3535,8 +3498,7 @@ const VDataTable = defineComponent({
 						handleClickSortHeader(header, ev);
 					}
 				}, [createVNode("div", { "class": "v-data-table__table__cell__tile" }, [headerChildren])]);
-			});
-			return createVNode("thead", { "class": "v-data-table__table__header" }, [createVNode("tr", null, [children])]);
+			})])]);
 		}
 		function toggleSelect(key) {
 			return isSelected(key) ? deselect(key) : select(key);
@@ -3566,9 +3528,8 @@ const VDataTable = defineComponent({
 						}, null)];
 						break;
 				}
-				const classes = align ? { [`v-data-table__table__cell--${align}`]: true } : void 0;
 				return createVNode("td", {
-					"class": ["v-data-table__table__cell", classes],
+					"class": ["v-data-table__table__cell", align ? { [`v-data-table__table__cell--${align}`]: true } : void 0],
 					"key": header.key
 				}, [cellChildren]);
 			});
@@ -3584,15 +3545,14 @@ const VDataTable = defineComponent({
 		function genBody() {
 			const { items, itemKey } = props;
 			const { item: itemSlot = defaultItemSlot } = ctx.slots;
-			const children = items.map((item) => {
+			return createVNode("tbody", { "class": "v-data-table__table__body" }, [items.map((item) => {
 				const key = item[itemKey];
 				return itemSlot({
 					key,
 					item,
 					selected: isSelected(key)
 				});
-			});
-			return createVNode("tbody", { "class": "v-data-table__table__body" }, [children]);
+			})]);
 		}
 		watch(() => props.modelValue, (modelValue) => {
 			internalValues.value = modelValue.slice();
@@ -3619,7 +3579,6 @@ const VDataTable = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VApp/VApp.tsx
 const VApp = defineComponent({
@@ -3629,7 +3588,6 @@ const VApp = defineComponent({
 		return () => createVNode(VDynamicStacks, null, { default: () => [createVNode(VAppLayout, null, ctx.slots)] });
 	}
 });
-
 //#endregion
 //#region src/components/VToolbar/VToolbar.tsx
 const VToolbar = defineComponent({
@@ -3658,7 +3616,6 @@ const VToolbar = defineComponent({
 		return () => createVNode("div", { "class": ["v-toolbar", classes.value] }, [ctx.slots.default?.()]);
 	}
 });
-
 //#endregion
 //#region src/components/VToolbar/VToolbarMenu.tsx
 const VToolbarMenu = defineComponent({
@@ -3676,7 +3633,6 @@ const VToolbarMenu = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VToolbar/VToolbarEdge.tsx
 const VToolbarEdge = defineComponent({
@@ -3698,7 +3654,6 @@ const VToolbarEdge = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/components/VToolbar/VToolbarTitle.tsx
 const slots = defineSlots();
@@ -3720,7 +3675,6 @@ const VToolbarTitle = defineComponent({
 		};
 	}
 });
-
 //#endregion
 //#region src/service.tsx
 const DEFAULT_AUTO_SCROLL_TO_ELEMENT_OFFSET_TOP = -20;
@@ -3915,7 +3869,6 @@ var VuiService = class {
 		};
 	}
 };
-
 //#endregion
 //#region src/plugin.tsx
 setDefaultActionableClassName("clickable");
@@ -3968,7 +3921,7 @@ var VuiPlugin = class {
 function installVuiPlugin(app, opts) {
 	return app.use(VuiPlugin, opts);
 }
-
 //#endregion
 export { ARROW_KEY_TYPES, AVATAR_SIZES, BUTTON_ALIGNS, CHIP_SIZES, CHOICE_KEY_TYPES, CONTROL_FIELD_VARIANTS, CONTROL_LOADING_SPINNER_SIZES, CONTROL_SIZES, DISABLED_REASON_PROPS, ICON_NAMES, KEYBOARD_EVENT_TYPES, PAGINATION_ALIGNS, VApp, VAvatar, VBreadcrumbs, VBusyImage, VButton, VButtonGroup, VCard, VCardActions, VCardContent, VCheckbox, VCheckboxGroup, VChip, VContentSwitcher, VControlField, VDataTable, VDialog, VDisabledReason, VDrawerLayout, VFileInput, VForm, VFormControl, VFormGroup, VGridContainer, VGridItem, VHero, VIcon, VLink, VListTile, VMenu, VNavigation, VNavigationItem, VNumberField, VOption, VOptionGroup, VPagination, VPaper, VProgressCircular, VProgressLinear, VRadio, VRadioGroup, VSelect, VSheetModal, VSkeltonLoaderBone, VSnackbar, VSwitch, VSwitchGroup, VTabs, VTextCounter, VTextField, VTextarea, VToolbar, VToolbarEdge, VToolbarMenu, VToolbarTitle, VTooltip, VUI_CHECKBOX_GROUP_SYMBOL, VUI_CHECKBOX_SYMBOL, VUI_FILE_INPUT_SYMBOL, VUI_FORM_GROUP_SYMBOL, VUI_FORM_SYMBOL, VUI_OPTION_SYMBOL, VUI_RADIO_GROUP_SYMBOL, VUI_RADIO_SYMBOL, VUI_SELECT_SYMBOL, VUI_SWITCH_GROUP_SYMBOL, VUI_SWITCH_SYMBOL, VUI_TEXTAREA_SYMBOL, VUI_TEXT_FIELD_SYMBOL, VuiColorProviderInjectionKey, VuiControlFieldInjectionKey, VuiControlInjectionKey, VuiInjectionKey, VuiPlugin, VuiService, configureDataTableDefaults, createAvatarProps, createCardProps, createChipProps, createControlFieldProps, createControlFieldProviderProps, createControlProps, createElevationProps, createListTileProps, createNavigationItemProps, createNavigationProps, createPaperBaseProps, createPaperProps, createRequiredChipRenderer, createVFormGroupProps, createVFormProps, defineFormSelectorComponent, formGroupSlots, formSlots, iconProps, installVuiPlugin, listTileEmits, mergeVuiPluginOptions, mergeVuiServiceIconSettings, mergeVuiServiceOptions, mergeVuiServiceUISettings, paginationProps, paperBaseSlots, rawIconProp, renderNavigationItemInput, resolveNavigationItemInput, resolveRawIconProp, sheetModalProps, splitAttrs, useControl, useControlField, useElevation, useVui, useVuiColorProvider, vueButtonProps };
+
 //# sourceMappingURL=vui.mjs.map