@quazardous/qdadm 2.12.0 → 2.14.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quazardous/qdadm",
-  "version": "2.12.0",
+  "version": "2.14.0",
   "description": "Vue 3 framework for admin dashboards with PrimeVue",
   "author": "quazardous",
   "license": "MIT",
@@ -71,6 +71,9 @@
     },
     "vite": {
       "optional": true
+    },
+    "primevue": {
+      "optional": true
     }
   },
   "optionalDependencies": {

package/src/components/InfoBanner.vue

@@ -20,7 +20,7 @@
  *   Just some information.
  * </InfoBanner>
  */
-import Message from 'primevue/message'
+import QdMessage from './base/QdMessage.vue'
 import { computed } from 'vue'
 
 type Severity = 'info' | 'success' | 'warn' | 'error' | 'secondary' | 'contrast'
@@ -58,7 +58,7 @@ const iconClass = computed(() => {
 </script>
 
 <template>
-  <Message
+  <QdMessage
     :severity="severity"
     :closable="closable"
     class="info-banner"
@@ -69,5 +69,5 @@ const iconClass = computed(() => {
         <slot />
       </span>
     </div>
-  </Message>
+  </QdMessage>
 </template>

package/src/components/base/QdButton.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+/**
+ * QdButton — the single indirection point over the widget library's Button
+ * (#1391 exit-readiness). Generic pass-through: every attr/prop/listener and
+ * every slot is forwarded verbatim, so swapping or shimming the underlying
+ * widget is a one-file change. Imports `primevue/button`, which the
+ * qdadmVitePlugin flavor alias (#1393) traverses.
+ */
+import Button from 'primevue/button'
+
+defineOptions({ inheritAttrs: false })
+</script>
+
+<template>
+  <Button v-bind="$attrs">
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps ?? {}" />
+    </template>
+  </Button>
+</template>

package/src/components/base/QdMessage.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+/**
+ * QdMessage — the single indirection point over the widget library's Message
+ * (#1391 exit-readiness). Generic pass-through, same contract as QdButton.
+ */
+import Message from 'primevue/message'
+
+defineOptions({ inheritAttrs: false })
+</script>
+
+<template>
+  <Message v-bind="$attrs">
+    <template v-for="(_, name) in $slots" #[name]="slotProps">
+      <slot :name="name" v-bind="slotProps ?? {}" />
+    </template>
+  </Message>
+</template>

package/src/components/dialogs/MultiStepDialog.vue

@@ -58,7 +58,7 @@
  */
 import { computed, watch, type PropType } from 'vue'
 import Dialog from 'primevue/dialog'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import Stepper from 'primevue/stepper'
 import StepList from 'primevue/steplist'
 import Step from 'primevue/step'
@@ -284,7 +284,7 @@ const slotActions = computed<SlotActions>(() => ({
               <div class="step-actions">
                 <slot name="actions" v-bind="slotActions">
                   <!-- Back button -->
-                  <Button
+                  <QdButton
                     v-if="!isFirstStep || showBackOnFirst"
                     :label="backLabel"
                     icon="pi pi-arrow-left"
@@ -294,7 +294,7 @@ const slotActions = computed<SlotActions>(() => ({
                   />
 
                   <!-- Cancel button -->
-                  <Button
+                  <QdButton
                     :label="cancelLabel"
                     severity="secondary"
                     @click="cancel"
@@ -302,7 +302,7 @@ const slotActions = computed<SlotActions>(() => ({
                   />
 
                   <!-- Next button (not on last step) -->
-                  <Button
+                  <QdButton
                     v-if="!isLastStep"
                     :label="nextLabel"
                     icon="pi pi-arrow-right"
@@ -312,7 +312,7 @@ const slotActions = computed<SlotActions>(() => ({
                   />
 
                   <!-- Submit button (only on last step) -->
-                  <Button
+                  <QdButton
                     v-if="isLastStep"
                     :label="submitLabel"
                     icon="pi pi-check"

package/src/components/dialogs/SimpleDialog.vue

@@ -26,13 +26,13 @@
  *   <SimpleDialog v-model:visible="showDialog" title="View Key" :showConfirm="false">
  *     <p>{{ key }}</p>
  *     <template #actions>
- *       <Button label="Copy" icon="pi pi-copy" @click="copyKey" />
+ *       <QdButton label="Copy" icon="pi pi-copy" @click="copyKey" />
  *     </template>
  *   </SimpleDialog>
  */
 import { computed } from 'vue'
 import Dialog from 'primevue/dialog'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 
 interface Props {
   visible?: boolean
@@ -101,14 +101,14 @@ const canClose = computed((): boolean => props.closable && !props.loading)
 
     <template #footer v-if="showCancel || showConfirm || $slots.actions">
       <slot name="actions" />
-      <Button
+      <QdButton
         v-if="showCancel"
         :label="cancelLabel"
         severity="secondary"
         @click="onCancel"
         :disabled="loading"
       />
-      <Button
+      <QdButton
         v-if="showConfirm"
         :label="confirmLabel"
         :icon="confirmIcon"

package/src/components/dialogs/UnsavedChangesDialog.vue

@@ -8,7 +8,7 @@
  * - Stay: cancels navigation
  */
 import SimpleDialog from './SimpleDialog.vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 
 interface Props {
   visible?: boolean
@@ -67,7 +67,7 @@ function onSaveAndLeave(): void {
     </div>
 
     <template #actions>
-      <Button
+      <QdButton
         v-if="hasOnSave"
         label="Save & Leave"
         icon="pi pi-save"

package/src/components/display/CopyableId.vue

@@ -7,7 +7,7 @@
  *   <CopyableId :value="apiKey" label="API Key" />
  */
 import { ref, inject } from 'vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import type { Orchestrator } from '../../orchestrator/Orchestrator'
 
 interface Props {
@@ -40,7 +40,7 @@ async function copyToClipboard(): Promise<void> {
   <div class="form-field">
     <label class="form-field-label">{{ label }}</label>
     <div class="copyable-id">
-      <Button
+      <QdButton
         type="button"
         :icon="copied ? 'pi pi-check' : 'pi pi-copy'"
         :severity="copied ? 'success' : 'secondary'"

package/src/components/edit/FormActions.vue

@@ -13,7 +13,7 @@
  * - cancel: Cancel/close without saving
  */
 
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import { useI18n } from '../../i18n/useI18n'
 
 const { t } = useI18n()
@@ -42,7 +42,7 @@ const emit = defineEmits<{
 <template>
   <div class="form-actions">
     <div class="form-actions-left">
-      <Button
+      <QdButton
         type="button"
         :label="isEdit ? t('core.actions.update') : t('core.actions.create')"
         :loading="saving"
@@ -51,7 +51,7 @@ const emit = defineEmits<{
         @click="emit('save')"
         v-tooltip.top="t('core.tooltips.saveAndContinue')"
       />
-      <Button
+      <QdButton
         v-if="showSaveAndClose"
         type="button"
         :label="isEdit ? t('core.actions.updateAndClose') : t('core.actions.createAndClose')"
@@ -66,7 +66,7 @@ const emit = defineEmits<{
         <i class="pi pi-circle-fill"></i>
       </span>
     </div>
-    <Button
+    <QdButton
       type="button"
       :label="t('core.actions.cancel')"
       severity="secondary"

package/src/components/edit/FormPage.vue

@@ -38,8 +38,8 @@ import FormActions from './FormActions.vue'
 import UnsavedChangesDialog from '../dialogs/UnsavedChangesDialog.vue'
 import CardShell from '../layout/CardShell.vue'
 import { formatFetchError } from '../../utils/errors'
-import Button from 'primevue/button'
-import Message from 'primevue/message'
+import QdButton from '../base/QdButton.vue'
+import QdMessage from '../base/QdMessage.vue'
 import type { ResolvedAction, ResolvedFieldConfig } from '../../composables/useEntityItemFormPage'
 import type { GuardDialogState } from '../../composables/useUnsavedChangesGuard'
 
@@ -151,7 +151,7 @@ function onGuardStay(): void {
       <template #actions>
         <slot name="header-actions" />
         <!-- Header actions from builder (excludes save/delete/cancel) -->
-        <Button
+        <QdButton
           v-for="action in headerActions"
           :key="action.name"
           :label="action.label"
@@ -180,16 +180,16 @@ function onGuardStay(): void {
     <!-- Error State (fetch error) -->
     <template v-else-if="fetchError">
       <slot name="error" :error="fetchError">
-        <Message severity="error" :closable="false" class="form-error-message">
+        <QdMessage severity="error" :closable="false" class="form-error-message">
           {{ fetchErrorMessage }}
-        </Message>
+        </QdMessage>
       </slot>
     </template>
 
     <!-- Form Content -->
     <template v-else>
       <!-- Validation Error Summary -->
-      <Message
+      <QdMessage
         v-if="errorSummary && errorSummary.length > 0"
         severity="warn"
         :closable="false"
@@ -200,7 +200,7 @@ function onGuardStay(): void {
             <strong>{{ error.label }}:</strong> {{ error.message }}
           </li>
         </ul>
-      </Message>
+      </QdMessage>
 
       <!-- Single content body; Card wrapper is conditional (#1193) -->
       <CardShell :card="cardWrapper">

package/src/components/edit/LookupPickerDialog.vue

@@ -12,7 +12,7 @@ import Dialog from 'primevue/dialog'
 import DataTable from 'primevue/datatable'
 import Column from 'primevue/column'
 import InputText from 'primevue/inputtext'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import { useI18n } from '../../i18n/useI18n'
 
 const { t } = useI18n()
@@ -208,12 +208,12 @@ const confirmLabel = computed(() => {
     </DataTable>
 
     <template #footer>
-      <Button
+      <QdButton
         :label="t('core.actions.cancel')"
         severity="secondary"
         @click="onCancel"
       />
-      <Button
+      <QdButton
         :label="confirmLabel"
         icon="pi pi-check"
         :disabled="confirmDisabled"

package/src/components/editors/JsonEditorFoldable.vue

@@ -10,10 +10,10 @@
  */
 
 import { ref, computed, watch } from 'vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import Textarea from 'primevue/textarea'
 import InputText from 'primevue/inputtext'
-import Message from 'primevue/message'
+import QdMessage from '../base/QdMessage.vue'
 import { getJsonValueType, getJsonPreview } from '../../composables/useJsonSyntax'
 
 interface Props {
@@ -165,7 +165,7 @@ function isMultiline(value: unknown): boolean {
     <!-- Toolbar -->
     <div class="editor-toolbar">
       <div class="toolbar-left">
-        <Button
+        <QdButton
           :icon="rawJsonMode ? 'pi pi-list' : 'pi pi-code'"
           :label="rawJsonMode ? 'Structured' : 'Raw JSON'"
           size="small"
@@ -175,7 +175,7 @@ function isMultiline(value: unknown): boolean {
         />
       </div>
       <div class="toolbar-right" v-if="!rawJsonMode">
-        <Button
+        <QdButton
           icon="pi pi-plus"
           label="Expand All"
           size="small"
@@ -183,7 +183,7 @@ function isMultiline(value: unknown): boolean {
           text
           @click="expandAll"
         />
-        <Button
+        <QdButton
           icon="pi pi-minus"
           label="Collapse All"
           size="small"
@@ -282,12 +282,12 @@ function isMultiline(value: unknown): boolean {
         spellcheck="false"
       ></textarea>
       <div v-if="parseError" class="raw-json-actions">
-        <Message severity="error" :closable="false" class="parse-error">
+        <QdMessage severity="error" :closable="false" class="parse-error">
           {{ parseError }}
-        </Message>
+        </QdMessage>
       </div>
       <div v-else class="raw-json-actions">
-        <Button
+        <QdButton
           label="Apply Changes"
           icon="pi pi-check"
           size="small"

package/src/components/editors/JsonStructuredField.vue

@@ -42,7 +42,7 @@
 
 import { ref, computed, watch } from 'vue'
 import SelectButton from 'primevue/selectbutton'
-import Message from 'primevue/message'
+import QdMessage from '../base/QdMessage.vue'
 import VanillaJsonEditor from './VanillaJsonEditor.vue'
 import type { Mode } from 'vanilla-jsoneditor'
 
@@ -179,14 +179,14 @@ watch(() => props.mode, (newMode: ViewMode | null | undefined) => {
 
     <!-- JSON View -->
     <div v-if="viewMode === 'json'" class="json-view">
-      <Message
+      <QdMessage
         v-if="guardInvalidJson && hasJsonError"
         severity="error"
         :closable="false"
         class="json-error"
       >
         {{ invalidJsonMessage }}
-      </Message>
+      </QdMessage>
       <VanillaJsonEditor
         :modelValue="effectiveJsonValue"
         :mode="jsonMode"

package/src/components/editors/KeyValueEditor.vue

@@ -18,7 +18,7 @@
  */
 
 import { ref, computed } from 'vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import InputText from 'primevue/inputtext'
 import AutoComplete from 'primevue/autocomplete'
 import Slider from 'primevue/slider'
@@ -161,7 +161,7 @@ function updateItemValue(index: number, value: string | number): void {
             />
           </template>
         </div>
-        <Button
+        <QdButton
           icon="pi pi-times"
           severity="danger"
           text
@@ -172,7 +172,7 @@ function updateItemValue(index: number, value: string | number): void {
       </div>
     </div>
     <div class="kv-add">
-      <Button
+      <QdButton
         icon="pi pi-plus"
         @click="addItem"
         :disabled="!newItem.key || (isTextMode && !newItem.value)"

package/src/components/editors/LanguageEditor.vue

@@ -9,7 +9,7 @@
  */
 
 import { ref, computed } from 'vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import InputText from 'primevue/inputtext'
 import Slider from 'primevue/slider'
 import Checkbox from 'primevue/checkbox'
@@ -113,7 +113,7 @@ function updateFluency(index: number, fluency: number | number[]): void {
             style="width: 100px"
           />
         </div>
-        <Button
+        <QdButton
           v-if="lang.primary"
           icon="pi pi-star-fill"
           severity="warning"
@@ -122,7 +122,7 @@ function updateFluency(index: number, fluency: number | number[]): void {
           size="small"
           v-tooltip.top="'Primary language'"
         />
-        <Button
+        <QdButton
           v-else
           icon="pi pi-star"
           severity="secondary"
@@ -132,7 +132,7 @@ function updateFluency(index: number, fluency: number | number[]): void {
           @click="setPrimaryLanguage(index)"
           v-tooltip.top="'Set as primary'"
         />
-        <Button
+        <QdButton
           icon="pi pi-times"
           severity="danger"
           text
@@ -143,7 +143,7 @@ function updateFluency(index: number, fluency: number | number[]): void {
       </div>
     </div>
     <div class="lang-add">
-      <Button
+      <QdButton
         icon="pi pi-plus"
         @click="addLanguage"
         :disabled="!newLanguage.code"

package/src/components/editors/ScopeEditor.vue

@@ -3,7 +3,7 @@ import { ref, computed, onMounted, watch, inject } from 'vue'
 import type { HttpClient } from '../../entity/storage/ApiStorage'
 import AutoComplete from 'primevue/autocomplete'
 import Select from 'primevue/select'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 
 interface ScopeRow {
   resource: string
@@ -266,7 +266,7 @@ onMounted(async () => {
       />
       <span v-if="isRowComplete(row)" class="scope-valid">✓</span>
       <span v-else class="scope-incomplete">...</span>
-      <Button
+      <QdButton
         icon="pi pi-trash"
         severity="danger"
         text
@@ -279,7 +279,7 @@ onMounted(async () => {
     </div>
 
     <div class="scope-add">
-      <Button
+      <QdButton
         label="Add Scope"
         icon="pi pi-plus"
         severity="secondary"

package/src/components/index.ts

@@ -3,6 +3,10 @@
  */
 
 // Layout
+// Base widget wrappers — the single indirection points over the widget
+// library (#1391 exit-readiness)
+export { default as QdButton } from './base/QdButton.vue'
+export { default as QdMessage } from './base/QdMessage.vue'
 export { default as AppLayout } from './layout/AppLayout.vue'
 export { default as BaseLayout } from './layout/BaseLayout.vue'
 export { default as PageLayout } from './layout/PageLayout.vue'

package/src/components/layout/AppLayout.vue

@@ -21,7 +21,7 @@ import { useApp } from '../../composables/useApp'
 import { useAuth } from '../../composables/useAuth'
 import { useGuardDialog } from '../../composables/useGuardStore'
 import { useNavContext, type BreadcrumbItem, type NavLinkItem } from '../../composables/useNavContext'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import Breadcrumb from 'primevue/breadcrumb'
 import UnsavedChangesDialog from '../dialogs/UnsavedChangesDialog.vue'
 import SidebarBox from './SidebarBox.vue'
@@ -366,7 +366,7 @@ const showBreadcrumb = computed<boolean>(() => {
     <main class="main-content" :class="{ 'main-content--sidebar-collapsed': sidebarCollapsed }">
       <!-- Mobile header bar -->
       <div class="mobile-header">
-        <Button
+        <QdButton
           icon="pi pi-bars"
           severity="secondary"
           text

package/src/components/layout/PageLayout.vue

@@ -17,7 +17,7 @@
  */
 import PageHeader from './PageHeader.vue'
 import CardsGrid from '../display/CardsGrid.vue'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 
 interface TitleParts {
   action?: string
@@ -89,7 +89,7 @@ function resolveLabel(label: string | (() => string)): string {
       </template>
       <template #actions>
         <slot name="header-actions" ></slot>
-        <Button
+        <QdButton
           v-for="action in headerActions"
           :key="action.name"
           :label="resolveLabel(action.label)"

package/src/components/layout/defaults/DefaultUserInfo.vue

@@ -11,7 +11,7 @@ import { computed, type ComputedRef } from 'vue'
 import { useRouter } from 'vue-router'
 import { prettifyRole } from '../../../utils/formatters'
 import { useAuth } from '../../../composables/useAuth'
-import Button from 'primevue/button'
+import QdButton from '../../base/QdButton.vue'
 
 interface UserData {
   username?: string
@@ -56,7 +56,7 @@ function handleLogout(): void {
       <div class="user-name">{{ userDisplayName }}</div>
       <div class="user-role">{{ userSubtitle }}</div>
     </div>
-    <Button
+    <QdButton
       icon="pi pi-sign-out"
       severity="secondary"
       text

package/src/components/lists/ActionButtons.vue

@@ -12,7 +12,7 @@
  * - handler: Click handler function
  * - isDisabled: Boolean disabled state
  */
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 
 interface Action {
   name: string
@@ -32,7 +32,7 @@ defineProps<Props>()
 
 <template>
   <div class="table-actions">
-    <Button
+    <QdButton
       v-for="action in actions"
       :key="action.name"
       :icon="action.icon"

package/src/components/lists/ListPage.vue

@@ -21,7 +21,7 @@ import FilterBar from './FilterBar.vue'
 import ActionButtons from './ActionButtons.vue'
 import DataTable from 'primevue/datatable'
 import Column from 'primevue/column'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import Select from 'primevue/select'
 import AutoComplete from 'primevue/autocomplete'
 import SplitButton from 'primevue/splitbutton'
@@ -333,7 +333,7 @@ function getFilterClass(filter: FilterConfig): Record<string, boolean> {
         <!-- Mobile: split button (primary action + dropdown) -->
         <template v-if="isMobile && headerActions.length > 0 && primaryHeaderAction">
           <!-- Single action: just a button -->
-          <Button
+          <QdButton
             v-if="headerActions.length === 1"
             :label="resolveLabel(primaryHeaderAction.label)"
             :icon="primaryHeaderAction.icon"
@@ -355,7 +355,7 @@ function getFilterClass(filter: FilterConfig): Record<string, boolean> {
         </template>
         <!-- Desktop: individual buttons -->
         <template v-else>
-          <Button
+          <QdButton
             v-for="action in headerActions"
             :key="action.name"
             :label="resolveLabel(action.label)"
@@ -417,7 +417,7 @@ function getFilterClass(filter: FilterConfig): Record<string, boolean> {
           />
         </template>
         <slot name="filters" ></slot>
-        <Button
+        <QdButton
           v-if="hasActiveFilters"
           icon="pi pi-filter-slash"
           severity="secondary"

package/src/components/pages/LoginPage.vue

@@ -22,7 +22,7 @@ import { useRouter } from 'vue-router'
 import Card from 'primevue/card'
 import InputText from 'primevue/inputtext'
 import Password from 'primevue/password'
-import Button from 'primevue/button'
+import QdButton from '../base/QdButton.vue'
 import type { OrchestratorLike } from '../../entity/EntityManager.interface'
 
 /**
@@ -245,7 +245,7 @@ async function handleLogin(): Promise<void> {
               :disabled="loading"
             />
           </div>
-          <Button
+          <QdButton
             type="submit"
             :label="submitLabel"
             icon="pi pi-sign-in"

package/src/components/show/ShowPage.vue

@@ -41,8 +41,8 @@ import { computed, type PropType } from 'vue'
 import PageHeader from '../layout/PageHeader.vue'
 import CardShell from '../layout/CardShell.vue'
 import { formatFetchError } from '../../utils/errors'
-import Button from 'primevue/button'
-import Message from 'primevue/message'
+import QdButton from '../base/QdButton.vue'
+import QdMessage from '../base/QdMessage.vue'
 import FieldGroups from '../item/FieldGroups.vue'
 import ShowField from './ShowField.vue'
 import type { ButtonSeverity } from '../../types'
@@ -187,7 +187,7 @@ type ShowFieldValue = string | number | boolean | Date | Record<string, unknown>
       <template #actions>
         <slot name="header-actions" />
         <!-- Header actions from builder (e.g., edit) -->
-        <Button
+        <QdButton
           v-for="action in headerActions"
           :key="action.name"
           :label="action.label"
@@ -215,9 +215,9 @@ type ShowFieldValue = string | number | boolean | Date | Record<string, unknown>
     <!-- Error State (fetch error) -->
     <template v-else-if="fetchError">
       <slot name="error" :error="fetchError">
-        <Message severity="error" :closable="false" class="show-error-message">
+        <QdMessage severity="error" :closable="false" class="show-error-message">
           {{ fetchErrorMessage }}
-        </Message>
+        </QdMessage>
       </slot>
     </template>
 
@@ -269,7 +269,7 @@ type ShowFieldValue = string | number | boolean | Date | Record<string, unknown>
         <template v-if="showActions && footerActions.length > 0">
           <slot name="footer">
             <div class="show-actions">
-              <Button
+              <QdButton
                 v-for="action in footerActions"
                 :key="action.name"
                 :label="action.label"

package/src/composables/useDirtyState.ts

@@ -59,6 +59,10 @@ export function useDirtyState<T extends FormState = FormState>(
   // initial side each time doubled the per-key work, and the old
   // JSON.parse(JSON.stringify(state)) deep clone tripled the snapshot cost.
   let initialFieldSnapshots: Map<string, string> | null = null
+  // Parsed deep copy of the initial form, kept for path-aware isFieldDirty
+  // (#1396). Built once per snapshot; the per-keystroke checkDirty path
+  // (#1194) never touches it.
+  let initialForm: Record<string, unknown> | null = null
   const ready = ref(false)
 
   /** Resolve the form object inside the state (common 'form'/'formData' patterns). */
@@ -76,6 +80,16 @@ export function useDirtyState<T extends FormState = FormState>(
     return s === undefined ? 'undefined' : s
   }
 
+  /** Resolve a dot path ('config.login') in an object, undefined-safe. */
+  function getByPath(obj: unknown, path: string): unknown {
+    let cur: unknown = obj
+    for (const seg of path.split('.')) {
+      if (cur === null || cur === undefined || typeof cur !== 'object') return undefined
+      cur = (cur as Record<string, unknown>)[seg]
+    }
+    return cur
+  }
+
   function getFormSnapshot(): string {
     return JSON.stringify(getState())
   }
@@ -96,6 +110,7 @@ export function useDirtyState<T extends FormState = FormState>(
         fieldSnapshots.set(key, stringifyField(form[key]))
       }
       initialFieldSnapshots = fieldSnapshots
+      initialForm = JSON.parse(JSON.stringify(form)) as Record<string, unknown>
       ready.value = true
     })
   }
@@ -126,7 +141,21 @@ export function useDirtyState<T extends FormState = FormState>(
   }
 
   function isFieldDirty(fieldName: string): boolean {
-    return dirtyFields.value.includes(fieldName)
+    // Dot-free names: exact historical behavior.
+    if (!fieldName.includes('.')) {
+      return dirtyFields.value.includes(fieldName)
+    }
+    // Path-aware (#1396): a sub-field can only be dirty if its ROOT key is —
+    // the pre-filter reuses the per-key work checkDirty already did, and
+    // reading dirtyFields keeps the same reactive trigger as flat names.
+    const root = fieldName.slice(0, fieldName.indexOf('.'))
+    if (!dirtyFields.value.includes(root)) return false
+    if (!initialForm) return false
+    const currentForm = resolveForm(getState())
+    return (
+      stringifyField(getByPath(currentForm, fieldName)) !==
+      stringifyField(getByPath(initialForm, fieldName))
+    )
   }
 
   function reset(): void {
@@ -134,6 +163,7 @@ export function useDirtyState<T extends FormState = FormState>(
     dirtyFields.value = []
     initialSnapshot.value = null
     initialFieldSnapshots = null
+    initialForm = null
     ready.value = false
   }
 

package/src/generated/managers/testManager.js

@@ -0,0 +1,45 @@
+/**
+ * TestManager - Auto-generated EntityManager
+ *
+ * Generated by qdadm/gen/generateManagers
+ * DO NOT EDIT MANUALLY - Changes will be overwritten
+ *
+ * Entity: test
+ * Endpoint: /test
+ */
+
+import { EntityManager } from '@quazardous/qdadm'
+import { ApiStorage } from '@quazardous/qdadm'
+
+/**
+ * Schema definition for test
+ * @type {import('qdadm/gen').UnifiedEntitySchema}
+ */
+export const testSchema = {
+  name: "test",
+  endpoint: "/test",
+  fields: {}
+}
+
+/**
+ * Storage options for test
+ */
+const storageOptions = {
+  endpoint: "/test"
+}
+
+/**
+ * TestManager instance
+ *
+ * Provides CRUD operations for test entity.
+ *
+ * @type {EntityManager}
+ */
+export const testManager = new EntityManager({
+  ...{
+  name: "test",
+  idField: "id",
+  fields: {}
+},
+  storage: new ApiStorage(storageOptions)
+})

package/src/security/pages/RoleList.vue

@@ -5,7 +5,7 @@
 
 import { useListPage, ListPage, useOrchestrator } from '../../index.js'
 import Column from 'primevue/column'
-import Message from 'primevue/message'
+import QdMessage from '../../components/base/QdMessage.vue'
 import Chip from 'primevue/chip'
 
 /**
@@ -49,7 +49,7 @@ const storageCanPersist: boolean = manager?.rolesProvider?.canPersist ?? false
   <ListPage v-bind="list.props.value" v-on="list.events">
     <!-- Read-only Warning -->
     <template #before-table>
-      <Message v-if="!storageCanPersist" severity="info" :closable="false" class="mb-4">
+      <QdMessage v-if="!storageCanPersist" severity="info" :closable="false" class="mb-4">
         <div class="flex align-items-center gap-2">
           <i class="pi pi-info-circle text-xl"></i>
           <span>
@@ -57,7 +57,7 @@ const storageCanPersist: boolean = manager?.rolesProvider?.canPersist ?? false
             Use a PersistableRoleProvider for editing.
           </span>
         </div>
-      </Message>
+      </QdMessage>
     </template>
 
     <template #columns>

package/src/vite/qdadmDebugPlugin.ts

@@ -34,9 +34,22 @@ interface PendingRequest {
   timeout: ReturnType<typeof setTimeout>
 }
 
+/** Typed page-side queries (#1398) — served by the injected client. */
+export type DebugQueryType =
+  | 'describe'
+  | 'dump'
+  | 'call'
+  | 'sessionInfo'
+  | 'routes'
+  | 'entityState'
+  | 'entityCall'
+  | 'storageDump'
+  | 'bootlog'
+  | 'recentSignals'
+
 interface DebugRequest {
   id: string
-  type: 'describe' | 'dump' | 'call'
+  type: DebugQueryType
   payload?: unknown
   /** Target a specific session (server → client). */
   sessionId?: string
@@ -67,6 +80,26 @@ interface SessionState {
   meta: Record<string, unknown>
 }
 
+/** Broker surface exposed to sibling plugins via `plugin.api` (#1398). */
+export interface QdadmDebugPluginApi {
+  /** Send a typed query to the page and await its reply. */
+  ask: (type: DebugQueryType, payload?: unknown, sessionId?: string) => Promise<unknown>
+  /** Resolve a session param ('latest' or id) to a live session, if any. */
+  pickSession: (
+    sessionParam: string | null
+  ) => { id: string; lastSeenAt: number; meta: Record<string, unknown> } | null
+  listSessions: () => Array<{
+    id: string
+    firstSeenAt: number
+    lastSeenAt: number
+    ageMs: number
+    hasDescribe: boolean
+    hasSnapshot: boolean
+    meta: Record<string, unknown>
+  }>
+  prefix: string
+}
+
 export interface QdadmDebugPluginOptions {
   /** URL prefix (default '/__qdadm') */
   prefix?: string
@@ -203,9 +236,21 @@ export function qdadmDebugPlugin(options: QdadmDebugPluginOptions = {}): Plugin
     return s
   }
 
+  /** Inter-plugin API (#1398) — consumed by @quazardous/qdmcp. */
+  const api: QdadmDebugPluginApi = {
+    ask,
+    pickSession: (sessionParam) => {
+      const s = pickSession(sessionParam)
+      return s ? { id: s.id, lastSeenAt: s.lastSeenAt, meta: s.meta } : null
+    },
+    listSessions,
+    prefix,
+  }
+
   return {
     name: 'qdadm-debug',
     apply: 'serve',
+    api,
 
     transformIndexHtml: {
       order: 'pre',
@@ -294,7 +339,10 @@ export function qdadmDebugPlugin(options: QdadmDebugPluginOptions = {}): Plugin
             res.setHeader('x-qdadm-session', session.id)
             return sendJson(res, 200, data)
           }
-          return sendJson(res, 404, { error: `unknown ${req.method} ${path}` })
+          // Unknown subpath: fall through — sibling plugins (e.g.
+          // @quazardous/qdadm-mcp) mount their own endpoints under the
+          // same prefix (#1398).
+          return next()
         } catch (e) {
           return sendJson(res, 500, { error: (e as Error).message })
         }
@@ -333,6 +381,34 @@ function readBody(req: IncomingMessage): Promise<string> {
  * stays fresh. Listens for ad-hoc requests targeted at this session.
  */
 const HMR_CLIENT_SCRIPT = String.raw`
+// ── Boot capture (#1398): this head module runs BEFORE the app's entry
+// module, so console/window errors from the very first app statement are
+// buffered — visible over MCP even when the app dies before the bridge
+// exists (the class of failure a bridge-only design can never see).
+const __bootAt = Date.now()
+const __bootlog = { errors: [], warns: [], pageErrors: [], rejections: [] }
+function __cap(arr, entry) { arr.push(entry); if (arr.length > 200) arr.shift() }
+function __fmt(args) {
+  try {
+    return Array.from(args).map((a) => {
+      if (a instanceof Error) return a.stack || a.message
+      if (typeof a === 'object') { try { return JSON.stringify(a) } catch (e) { return String(a) } }
+      return String(a)
+    }).join(' ').slice(0, 2000)
+  } catch (e) { return '[unformattable]' }
+}
+const __origError = console.error.bind(console)
+const __origWarn = console.warn.bind(console)
+console.error = function () { __cap(__bootlog.errors, { at: Date.now(), msg: __fmt(arguments) }); __origError.apply(null, arguments) }
+console.warn = function () { __cap(__bootlog.warns, { at: Date.now(), msg: __fmt(arguments) }); __origWarn.apply(null, arguments) }
+window.addEventListener('error', (e) => {
+  __cap(__bootlog.pageErrors, { at: Date.now(), msg: String(e.message || e), source: e.filename ? e.filename + ':' + e.lineno : undefined })
+})
+window.addEventListener('unhandledrejection', (e) => {
+  let msg; try { msg = e.reason && (e.reason.stack || e.reason.message) || String(e.reason) } catch (err) { msg = '[unreadable reason]' }
+  __cap(__bootlog.rejections, { at: Date.now(), msg: String(msg).slice(0, 2000) })
+})
+
 const hot = import.meta.hot
 if (!hot) {
   console.warn('[qdadm-debug] import.meta.hot unavailable in injected script')
@@ -344,6 +420,95 @@ if (!hot) {
 
   const w = /** @type {any} */ (window)
 
+  // Signal ring buffer — armed once __qdadm.signals is reachable.
+  const __signals = []
+  let __signalsArmed = false
+  function __armSignals() {
+    if (__signalsArmed) return
+    const q = w.__qdadm
+    if (!q || !q.signals || typeof q.signals.on !== 'function') return
+    try {
+      q.signals.on('**', (event) => { __cap(__signals, { at: Date.now(), name: event && event.name }) ; if (__signals.length > 100) __signals.shift() })
+      __signalsArmed = true
+    } catch (e) {}
+  }
+
+  function __sessionInfo() {
+    const q = w.__qdadm || {}
+    let app = {}
+    try { app = (q.kernel && q.kernel.options && q.kernel.options.app) || {} } catch (e) {}
+    let route = null
+    try { const r = q.router && q.router.currentRoute && q.router.currentRoute.value; route = r ? { name: r.name, fullPath: r.fullPath } : null } catch (e) {}
+    return {
+      sessionId, bootAt: __bootAt, now: Date.now(), url: location.href,
+      app: { name: app.name, version: typeof app.version === 'function' ? app.version() : app.version },
+      route, bridgeReady: !!bridge, signalsArmed: __signalsArmed,
+      bootlogCounts: { errors: __bootlog.errors.length, warns: __bootlog.warns.length, pageErrors: __bootlog.pageErrors.length, rejections: __bootlog.rejections.length },
+    }
+  }
+
+  function __routes() {
+    const q = w.__qdadm
+    if (!q || !q.router) throw new Error('router not ready')
+    return q.router.getRoutes().map((r) => ({
+      name: r.name, path: r.path,
+      meta: { entity: r.meta && r.meta.entity, layout: r.meta && r.meta.layout, requiresAuth: r.meta && r.meta.requiresAuth, public: r.meta && r.meta.public },
+    }))
+  }
+
+  function __manager(entity) {
+    const q = w.__qdadm
+    if (!q || !q.orchestrator) throw new Error('orchestrator not ready')
+    if (!q.orchestrator.isRegistered(entity)) throw new Error('entity not registered: ' + entity + ' (known: ' + q.orchestrator.getRegisteredNames().join(', ') + ')')
+    return q.orchestrator.get(entity)
+  }
+
+  function __entityState(payload) {
+    const q = w.__qdadm
+    if (!payload || !payload.entity) {
+      return { entities: q && q.orchestrator ? q.orchestrator.getRegisteredNames() : [] }
+    }
+    const m = __manager(payload.entity)
+    const safe = (fn) => { try { return fn() } catch (e) { return '[error: ' + (e && e.message) + ']' } }
+    const fields = {}
+    try {
+      const fs = m.fields || m._fields || {}
+      for (const k in fs) fields[k] = { type: fs[k] && fs[k].type, label: fs[k] && fs[k].label, required: !!(fs[k] && fs[k].required) }
+    } catch (e) {}
+    return {
+      entity: payload.entity,
+      idField: safe(() => m.idField), labelField: safe(() => m.labelField),
+      label: safe(() => m.label), labelPlural: safe(() => m.labelPlural),
+      can: { create: safe(() => m.canCreate()), read: safe(() => m.canRead()), update: safe(() => m.canUpdate()), delete: safe(() => m.canDelete()) },
+      fields,
+      storage: safe(() => { const st = m.storage || m._storage; return st ? { kind: st.constructor && st.constructor.name, storageKey: st._storageKey } : null }),
+    }
+  }
+
+  async function __entityCall(payload) {
+    if (!payload || !payload.entity || !payload.op) throw new Error('entityCall requires { entity, op, ... }')
+    const m = __manager(payload.entity)
+    const op = payload.op
+    if (op === 'list') return await m.list(payload.params || {})
+    if (op === 'get') return await m.get(payload.id)
+    if (op === 'create') return await m.create(payload.data || {})
+    if (op === 'update') return await m.update(payload.id, payload.data || {})
+    if (op === 'delete') { await m.delete(payload.id); return { deleted: payload.id } }
+    throw new Error('unknown op "' + op + '" (list|get|create|update|delete)')
+  }
+
+  function __storageDump(payload) {
+    if (!payload || !payload.entity) throw new Error('storageDump requires { entity }')
+    const m = __manager(payload.entity)
+    const st = m.storage || m._storage
+    const key = st && st._storageKey
+    if (!key) return { storageKey: null, note: 'storage exposes no localStorage key (' + (st && st.constructor && st.constructor.name) + ')' }
+    const raw = localStorage.getItem(key)
+    let parsed = null
+    try { parsed = raw ? JSON.parse(raw) : null } catch (e) { parsed = '[unparsable]' }
+    return { storageKey: key, count: Array.isArray(parsed) ? parsed.length : null, data: parsed }
+  }
+
   function helloIfNeeded() {
     try { hot.send('qdadm:debug:push', { type: 'hello', sessionId, meta }) } catch (e) {}
   }
@@ -365,6 +530,16 @@ if (!hot) {
     if (msg && msg.sessionId && msg.sessionId !== sessionId) return
     const id = (msg && msg.id) || ''
     try {
+      // Typed queries (#1398): bridge-independent — they must answer even
+      // when the app died before the bridge existed.
+      if (msg.type === 'bootlog') { hot.send('qdadm:debug:reply', { id, ok: true, data: __bootlog, sessionId }); return }
+      if (msg.type === 'sessionInfo') { hot.send('qdadm:debug:reply', { id, ok: true, data: __sessionInfo(), sessionId }); return }
+      if (msg.type === 'recentSignals') { __armSignals(); hot.send('qdadm:debug:reply', { id, ok: true, data: { armed: __signalsArmed, events: __signals }, sessionId }); return }
+      if (msg.type === 'routes') { hot.send('qdadm:debug:reply', { id, ok: true, data: __routes(), sessionId }); return }
+      if (msg.type === 'entityState') { hot.send('qdadm:debug:reply', { id, ok: true, data: __entityState(msg.payload), sessionId }); return }
+      if (msg.type === 'entityCall') { const data = await __entityCall(msg.payload); hot.send('qdadm:debug:reply', { id, ok: true, data, sessionId }); return }
+      if (msg.type === 'storageDump') { hot.send('qdadm:debug:reply', { id, ok: true, data: __storageDump(msg.payload), sessionId }); return }
+
       const b = w.__qdadm && w.__qdadm.debug && w.__qdadm.debug.bridge
       if (!b) throw new Error('debug bridge not ready')
       let data
@@ -385,6 +560,7 @@ if (!hot) {
     bridge = w.__qdadm && w.__qdadm.debug && w.__qdadm.debug.bridge
     if (!bridge) return
     clearInterval(attachTimer)
+    __armSignals()
     helloIfNeeded()
     pushDescribe()
     pushSnapshot()

package/src/vite/qdadmPlugin.ts

@@ -53,6 +53,26 @@ export interface QdadmVitePluginOptions {
    * (vue, vue-router, primevue, pinia).
    */
   dedupe?: string[]
+  /**
+   * PrimeVue "flavor" (#1393): alias every `primevue/*` import to a
+   * compatible fork (e.g. OpenVue). qdadm officially maintains and tests
+   * `primevue@4` (MIT) only — a flavor keeping the v4 module layout/API is
+   * drop-in; divergences are the consumer's to absorb.
+   *
+   * ```ts
+   * qdadmVitePlugin({ primevue: { package: 'openvue' } })
+   * ```
+   */
+  primevue?: {
+    /** Package that replaces `primevue` (e.g. 'openvue'). */
+    package: string
+    /**
+     * Optional package replacing `@primeuix/themes` — only needed if the
+     * flavor ships its own themes fork (none does today; OpenVue keeps the
+     * MIT @primeuix/* versions).
+     */
+    themes?: string
+  }
 }
 
 export function qdadmVitePlugin(options: QdadmVitePluginOptions = {}): Plugin {
@@ -76,12 +96,33 @@ export function qdadmVitePlugin(options: QdadmVitePluginOptions = {}): Plugin {
         // not installed under root node_modules (aliased/hoisted) — nothing to allow
       }
 
+      // Flavor aliasing (#1393): after the alias, no `primevue`/themes ids
+      // remain in the graph — dedupe/exclude lists must name the flavor.
+      const flavor = options.primevue ?? null
+      const widgetPkg = flavor?.package ?? 'primevue'
+      const themesPkg = flavor?.themes ?? '@primeuix/themes'
+      const alias = []
+      if (flavor) {
+        alias.push({ find: /^primevue(\/|$)/, replacement: `${flavor.package}$1` })
+        if (flavor.themes) {
+          alias.push({ find: /^@primeuix\/themes(\/|$)/, replacement: `${flavor.themes}$1` })
+        }
+      }
+
+      // With a flavor, the original packages may still be installed — keep
+      // them excluded too, or the optimizer pre-bundles a stray
+      // `primevue/*` id that bypassed the alias (split-instance again).
+      const widgetExcludes = flavor ? [widgetPkg, 'primevue'] : [widgetPkg]
+      const themesExcludes =
+        flavor?.themes ? [themesPkg, '@primeuix/themes'] : [themesPkg]
+
       return {
         resolve: {
-          dedupe: ['vue', 'vue-router', 'primevue', 'pinia', ...(options.dedupe ?? [])],
+          ...(alias.length > 0 ? { alias } : {}),
+          dedupe: ['vue', 'vue-router', widgetPkg, 'pinia', ...(options.dedupe ?? [])],
         },
         optimizeDeps: {
-          exclude: ['primevue', '@primeuix/themes', '@quazardous/qdadm'],
+          exclude: [...widgetExcludes, ...themesExcludes, '@quazardous/qdadm'],
           // One form per install mode: the nested path resolves through a
           // real node_modules chain (npm installs), the plain form through a
           // symlink realpath — declaring the unused one logs a "Failed to