@nexdom/uimed-vue 2.0.0-beta.51 → 2.0.0-beta.53

package/dist/components.d.ts

@@ -202,10 +202,15 @@ type NavigationMenuParentItem = {
    */
   icon?: Icon;
   /**
-   * Child {@link NavigationMenuItem} list.
+   * Child {@link NavigationMenuChildItem} list. Unlike the first level items, they show no icon.
    */
-  items: Array<NavigationMenuItem>;
+  items: Array<NavigationMenuChildItem>;
 };
+/**
+ * Item inside a {@link NavigationMenuParentItem}. Only the first level items and groups show an
+ * icon, so every menu follows the same visual pattern.
+ */
+type NavigationMenuChildItem = Omit<NavigationMenuItem, "icon">;
 interface NavigationMenuItem {
   /**
    * Text to present for the item.

package/dist/components.js

@@ -3,7 +3,7 @@ import { a as messages, c as colorToVuetifyTextColor, n as owners$1, r as reques
 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";
-import { VApp, VAppBar, VAppBarNavIcon, VAppBarTitle, VAutocomplete, VAvatar, VBadge, VBtn, VCard, VCardActions, VCardText, VCheckboxBtn, VCol, VCombobox, VContainer, VDataIterator, VDatePicker, VDialog, VDivider, VEmptyState, VExpansionPanel, VExpansionPanelText, VExpansionPanelTitle, VExpansionPanels, VFooter, VForm, VIcon, VIconBtn, VImg, VList, VListGroup, VListItem, VListItemAction, VListSubheader, VLocaleProvider, VMain, VMenu, VNavigationDrawer, VPagination, VProgressCircular, VProgressLinear, VRow, VSkeletonLoader, VSnackbarQueue, VTable, VTextField, VTimePicker } from "vuetify/components";
+import { VApp, VAppBar, VAppBarNavIcon, VAppBarTitle, VAutocomplete, VAvatar, VBadge, VBtn, VCard, VCardActions, VCardItem, VCardText, VCheckboxBtn, VCol, VCombobox, VContainer, VDataIterator, VDatePicker, VDialog, VDivider, VEmptyState, VExpansionPanel, VExpansionPanelText, VExpansionPanelTitle, VExpansionPanels, VFooter, VForm, VIcon, VIconBtn, VImg, VList, VListGroup, VListItem, VListItemAction, VListSubheader, VLocaleProvider, VMain, VMenu, VNavigationDrawer, VPagination, VProgressCircular, VProgressLinear, VRow, VSkeletonLoader, VSnackbarQueue, VTable, VTextField, VTimePicker } from "vuetify/components";
 import { formatDateTime, isEmail, isEmpty, isPhone, isUrl, toInitials } from "@nexdom/shared/utils";
 import { VHighlight } from "vuetify/labs/VHighlight";
 import { RouterLink } from "vue-router";
@@ -272,6 +272,7 @@ var app_bar_default = /* @__PURE__ */ defineComponent({
 			if (userInitials.value) return { text: userInitials.value };
 			return { icon: icons.accountAlternative };
 		});
+		const hasUserInfo = computed(() => !!props.user.title || !!props.user.subtitle);
 		function isParentOption(option) {
 			return "items" in option;
 		}
@@ -368,51 +369,59 @@ var app_bar_default = /* @__PURE__ */ defineComponent({
 								}), null, 16)]),
 								_: 1
 							}, 16, ["data-testid"])]),
-							default: withCtx(() => [createVNode(unref(VCard), {
-								title: __props.user?.title,
-								subtitle: __props.user?.subtitle,
-								"data-testid": userMenuDataTestid.value
-							}, {
-								prepend: withCtx(() => [createCommentVNode(" Decorative: the user's name, when given, is already the card's title "), createVNode(unref(VAvatar), mergeProps(userAvatarProps.value, {
-									color: "primary",
-									"aria-hidden": "true"
-								}), null, 16)]),
-								default: withCtx(() => [createVNode(unref(VDivider)), createVNode(unref(VList), {
-									nav: "",
-									role: "group"
-								}, {
-									default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(props.user?.options, (option, index) => {
-										return openBlock(), createElementBlock(Fragment, { key: index }, [index > 0 ? (openBlock(), createBlock(unref(VDivider), {
-											key: 0,
-											class: "mt-1"
-										})) : createCommentVNode("v-if", true), isParentOption(option) ? (openBlock(), createBlock(unref(VListGroup), { key: 1 }, {
-											activator: withCtx(({ props, isOpen }) => [createVNode(unref(VListItem), mergeProps({ ref_for: true }, props, {
-												title: option.description,
-												"aria-expanded": isOpen,
-												role: void 0,
-												tag: "button",
-												type: "button"
-											}), null, 16, ["title", "aria-expanded"])]),
-											default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(option.items, (childOption, index) => {
-												return openBlock(), createBlock(unref(VListItem), mergeProps({ key: index }, { ref_for: true }, unref(routeToListItemProps)(childOption.route), {
-													title: childOption.description,
-													onClick: childOption.action
-												}), null, 16, ["title", "onClick"]);
-											}), 128))]),
-											_: 2
-										}, 1024)) : (openBlock(), createBlock(unref(VListItem), mergeProps({
-											key: 2,
-											title: option.description
-										}, { ref_for: true }, unref(routeToListItemProps)(option.route), { onClick: option.action }), null, 16, ["title", "onClick"]))], 64);
-									}), 128))]),
-									_: 1
-								})]),
+							default: withCtx(() => [createVNode(unref(VCard), { "data-testid": userMenuDataTestid.value }, {
+								default: withCtx(() => [
+									createCommentVNode(" The card's header puts the avatar beside the title, and no prop stacks or centers\n            them: the avatar and the user's info get an item each, centered by a class, as USection\n            and UFooter center their text. The options below stay aligned to the start "),
+									createVNode(unref(VCardItem), { class: "text-center" }, {
+										default: withCtx(() => [createCommentVNode(" Decorative: the user's name, when given, is already the title below "), createVNode(unref(VAvatar), mergeProps(userAvatarProps.value, {
+											size: "x-large",
+											color: "primary",
+											"aria-hidden": "true"
+										}), null, 16)]),
+										_: 1
+									}),
+									hasUserInfo.value ? (openBlock(), createBlock(unref(VCardItem), {
+										key: 0,
+										title: __props.user?.title,
+										subtitle: __props.user?.subtitle,
+										class: "text-center"
+									}, null, 8, ["title", "subtitle"])) : createCommentVNode("v-if", true),
+									createVNode(unref(VDivider)),
+									createCommentVNode(" Vuetify's `list` role only allows list items, but the options are links and\n            separators "),
+									createVNode(unref(VList), {
+										nav: "",
+										role: "group"
+									}, {
+										default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(props.user?.options, (option, index) => {
+											return openBlock(), createElementBlock(Fragment, { key: index }, [index > 0 ? (openBlock(), createBlock(unref(VDivider), {
+												key: 0,
+												class: "mt-1"
+											})) : createCommentVNode("v-if", true), isParentOption(option) ? (openBlock(), createBlock(unref(VListGroup), { key: 1 }, {
+												activator: withCtx(({ props, isOpen }) => [createVNode(unref(VListItem), mergeProps({ ref_for: true }, props, {
+													title: option.description,
+													"aria-expanded": isOpen,
+													role: void 0,
+													tag: "button",
+													type: "button",
+													class: "w-100 text-start"
+												}), null, 16, ["title", "aria-expanded"])]),
+												default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(option.items, (childOption, index) => {
+													return openBlock(), createBlock(unref(VListItem), mergeProps({ key: index }, { ref_for: true }, unref(routeToListItemProps)(childOption.route), {
+														title: childOption.description,
+														onClick: childOption.action
+													}), null, 16, ["title", "onClick"]);
+												}), 128))]),
+												_: 2
+											}, 1024)) : (openBlock(), createBlock(unref(VListItem), mergeProps({
+												key: 2,
+												title: option.description
+											}, { ref_for: true }, unref(routeToListItemProps)(option.route), { onClick: option.action }), null, 16, ["title", "onClick"]))], 64);
+										}), 128))]),
+										_: 1
+									})
+								]),
 								_: 1
-							}, 8, [
-								"title",
-								"subtitle",
-								"data-testid"
-							])]),
+							}, 8, ["data-testid"])]),
 							_: 1
 						})) : createCommentVNode("v-if", true)
 					]),
@@ -812,7 +821,8 @@ var navigation_menu_default = /* @__PURE__ */ defineComponent({
 									"aria-expanded": isOpen,
 									role: void 0,
 									tag: "button",
-									type: "button"
+									type: "button",
+									class: "w-100 text-start"
 								}), null, 16, [
 									"title",
 									"prepend-icon",
@@ -821,13 +831,8 @@ var navigation_menu_default = /* @__PURE__ */ defineComponent({
 								default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(item.items, (childItem, childIndex) => {
 									return openBlock(), createBlock(unref(VListItem), mergeProps({ key: childIndex }, { ref_for: true }, unref(routeToListItemProps)(childItem.route), {
 										title: childItem.description,
-										"prepend-icon": childItem.icon && unref(icons)[childItem.icon],
 										onClick: childItem.action
-									}), null, 16, [
-										"title",
-										"prepend-icon",
-										"onClick"
-									]);
+									}), null, 16, ["title", "onClick"]);
 								}), 128))]),
 								_: 2
 							}, 1024)) : (openBlock(), createBlock(unref(VListItem), mergeProps({

package/package.json

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