@nexdom/uimed-vue 2.0.0-beta.48 → 2.0.0-beta.49

package/dist/components.d.ts

@@ -252,6 +252,18 @@ type MainProps = {
    * @default false
    */
   loading?: boolean;
+  /**
+   * Applies a color to the background of the whole app, e.g. on landing pages. Text placed
+   * directly on the background takes the color the theme pairs with it (white or black), while
+   * the app bar, the footer, sections and dialogs keep their own backgrounds. When omitted, the
+   * app uses the theme's default background.
+   *
+   * @example
+   * ```vue
+   * <u-main background="primary" />
+   * ```
+   */
+  background?: ColorVariant;
 };
 //#endregion
 //#region src/components/main/main.vue.d.ts
@@ -575,8 +587,8 @@ declare const __VLS_export$16: import("vue", { with: { "resolution-mode": "impor
   "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
   variant: TextFieldVariant;
-  clearable: boolean;
   type: TextFieldType;
+  clearable: boolean;
 }, {}, {}, {}, string, import("vue", { with: { "resolution-mode": "import" } }).ComponentProvideOptions, false, {}, any>;
 //#endregion
 //#region src/components/inputs/checkbox/types.d.ts

package/dist/components.js

@@ -1,4 +1,4 @@
-import { a as messages, c as colorToVuetifyTextColor, n as owners$1, r as requests, s as useVuetifyColor } from "./use-dialog-Czq2P-Z9.js";
+import { a as messages, c as colorToVuetifyColor, l as colorToVuetifyTextColor, n as owners$1, r as requests, s as useVuetifyColor } from "./use-dialog-C0sM_bA2.js";
 import { useLocale, useMask } from "vuetify";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, inject, isRef, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, onMounted, onScopeDispose, onUnmounted, openBlock, provide, readonly, ref, renderList, renderSlot, resolveDynamicComponent, shallowRef, toDisplayString, toValue, unref, useId, useModel, useSlots, useTemplateRef, watch, withCtx, withKeys, withModifiers } from "vue";
 import { pt } from "vuetify/locale";
@@ -1409,6 +1409,19 @@ var dialog_host_default = /* @__PURE__ */ defineComponent({
 	}
 });
 //#endregion
+//#region src/composables/colors/use-vuetify-background-color.ts
+/**
+* Vuetify's utility class that applies a color to the background of an element, and the color the
+* theme pairs with it to its text, for props that color a background. No class when the color is
+* omitted, so the element keeps its default background.
+*/
+function useVuetifyBackgroundColor(color) {
+	return computed(() => {
+		const colorValue = toValue(color);
+		return colorValue ? `bg-${colorToVuetifyColor[colorValue]}` : void 0;
+	});
+}
+//#endregion
 //#region src/components/main/main.vue
 var main_default = /* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
@@ -1437,6 +1450,10 @@ var main_default = /* @__PURE__ */ defineComponent({
 		loading: {
 			type: Boolean,
 			required: false
+		},
+		background: {
+			type: String,
+			required: false
 		}
 	}, {
 		"notificationsOpen": {
@@ -1454,10 +1471,14 @@ var main_default = /* @__PURE__ */ defineComponent({
 			navigation: props.navigationMenu !== void 0,
 			loading: props.loading
 		} : void 0);
+		const backgroundClass = useVuetifyBackgroundColor(() => props.background);
 		const notificationsOpen = useModel(__props, "notificationsOpen");
 		const navigationMenuOpen = ref(false);
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(VApp), { "data-testid": props.dataTestid }, {
+			return openBlock(), createBlock(unref(VApp), {
+				class: normalizeClass(unref(backgroundClass)),
+				"data-testid": props.dataTestid
+			}, {
 				default: withCtx(() => [
 					appBarProps.value ? (openBlock(), createBlock(app_bar_default, mergeProps({ key: 0 }, appBarProps.value, {
 						"notifications-open": notificationsOpen.value,
@@ -1484,7 +1505,7 @@ var main_default = /* @__PURE__ */ defineComponent({
 					props.footer?.description ? (openBlock(), createBlock(footer_default, normalizeProps(mergeProps({ key: 2 }, props.footer)), null, 16)) : createCommentVNode("v-if", true)
 				]),
 				_: 3
-			}, 8, ["data-testid"]);
+			}, 8, ["class", "data-testid"]);
 		};
 	}
 });

package/dist/composables.js

@@ -1,4 +1,4 @@
-import { i as useDialog, o as useToast, t as openDialog } from "./use-dialog-Czq2P-Z9.js";
+import { i as useDialog, o as useToast, t as openDialog } from "./use-dialog-C0sM_bA2.js";
 import { computed, onActivated, onDeactivated, onMounted, onUnmounted, ref, toValue, watch } from "vue";
 import { isDeepEqual } from "@nexdom/shared/utils";
 import { onBeforeRouteLeave } from "vue-router";

package/dist/{use-dialog-Czq2P-Z9.js → use-dialog-C0sM_bA2.js}

@@ -135,4 +135,4 @@ function dialog(options) {
 	}, (value) => value);
 }
 //#endregion
-export { messages as a, colorToVuetifyTextColor as c, useDialog as i, owners as n, useToast as o, requests as r, useVuetifyColor as s, openDialog as t };
+export { messages as a, colorToVuetifyColor as c, useDialog as i, colorToVuetifyTextColor as l, owners as n, useToast as o, requests as r, useVuetifyColor as s, openDialog as t };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nexdom/uimed-vue",
-  "version": "2.0.0-beta.48",
+  "version": "2.0.0-beta.49",
   "description": "A ui framework for NEXDOM applications.",
   "keywords": [
     "lib",