@antelopejs/dms 0.9.8 → 0.11.0

package/frontend-vue/layers/dms-core/i18n/locales/core-fr-FR.json

@@ -408,6 +408,8 @@
       "too_short": "Cette valeur est trop courte.",
       "too_small": "Cette valeur est trop petite.",
       "too_large": "Cette valeur est trop grande.",
+      "named_required": "{field} est obligatoire.",
+      "named_invalid": "{field} n’est pas valide.",
       "with_values": "{message} : {values}",
       "code_incomplete": "Saisissez tous les chiffres du code.",
       "password_rules": "Le mot de passe ne respecte pas toutes les règles.",
@@ -438,7 +440,8 @@
     "chart": {
       "no_data": "Aucune donnée",
       "legend_period": "Période",
-      "legend_comparison": "Comparaison"
+      "legend_comparison": "Comparaison",
+      "versus_value": "vs {value}"
     },
     "period": {
       "aria_label": "Sélecteur de période",
@@ -463,12 +466,33 @@
         "all": "Toute la période",
         "custom": "Personnalisé"
       },
+      "short_presets": {
+        "last-hour": "1 h",
+        "last-24h": "24 h",
+        "today": "Auj.",
+        "yesterday": "Hier",
+        "last-7-days": "7 j",
+        "last-30-days": "30 j",
+        "last-90-days": "90 j",
+        "this-month": "Mois",
+        "last-month": "M-1",
+        "this-quarter": "Trim.",
+        "last-quarter": "T-1",
+        "ytd": "Année",
+        "last-year": "A-1",
+        "all": "Tout"
+      },
       "comparisons": {
         "none": "Sans comparaison",
         "previous-period": "vs période précédente",
         "previous-year": "vs année précédente",
         "custom": "Personnalisé"
       },
+      "compare_labels": {
+        "previous-period": "vs période précédente",
+        "previous-year": "vs année précédente",
+        "custom": "vs période de comparaison"
+      },
       "compare_options": {
         "none": "Aucune comparaison",
         "previous-period": "Période précédente",
@@ -494,7 +518,117 @@
     },
     "a11y": {
       "breadcrumb": "Fil d'Ariane",
-      "loading": "Chargement"
+      "close": "Fermer",
+      "loading": "Chargement",
+      "show_options": "Afficher les options"
+    },
+    "automation": {
+      "triggers": {
+        "memberAdded": {
+          "name": "Membre ajouté",
+          "description": "Se déclenche quand un utilisateur devient membre d'un espace de travail"
+        },
+        "memberRemoved": {
+          "name": "Membre retiré",
+          "description": "Se déclenche quand des membres sont retirés d'un espace de travail"
+        },
+        "inviteCreated": {
+          "name": "Invitation créée",
+          "description": "Se déclenche quand une invitation est créée dans un espace de travail"
+        },
+        "userRegistered": {
+          "name": "Utilisateur inscrit",
+          "description": "Se déclenche quand un nouvel utilisateur termine son inscription"
+        },
+        "recordCreated": {
+          "name": "Enregistrement créé",
+          "description": "Se déclenche quand des lignes sont créées dans une table adossée à une TableView"
+        },
+        "recordUpdated": {
+          "name": "Enregistrement modifié",
+          "description": "Se déclenche quand des lignes sont modifiées dans une table adossée à une TableView"
+        },
+        "recordDeleted": {
+          "name": "Enregistrement supprimé",
+          "description": "Se déclenche quand des lignes sont supprimées dans une table adossée à une TableView"
+        },
+        "record": {
+          "fields": {
+            "location": "Emplacement du contrôleur de données à surveiller, par ex. \"/api/tables/members\". Laissez vide pour réagir à toutes les tables."
+          }
+        }
+      },
+      "actions": {
+        "sendEmail": {
+          "name": "Envoyer un e-mail",
+          "description": "Envoie un e-mail HTML via le fournisseur d'e-mail configuré, rédigé tel quel ou généré à partir d'un modèle HTML enregistré",
+          "fields": {
+            "template": "Nom d'un modèle HTML enregistré à générer à la place du HTML",
+            "props": "Propriétés avec lesquelles le modèle est généré",
+            "language": "Langue dans laquelle le modèle est généré ; par défaut celle du destinataire quand l'adresse appartient à un utilisateur"
+          }
+        },
+        "sendNotification": {
+          "name": "Envoyer une notification",
+          "description": "Envoie une notification dans l'application à des utilisateurs précis et/ou à tous les utilisateurs ayant l'un des rôles indiqués",
+          "fields": {
+            "userId": "Un destinataire, par ex. l'ID utilisateur d'un déclencheur",
+            "tenantId": "Espace de travail dont les membres reçoivent la notification par rôle ; laissez vide pour l'espace par défaut",
+            "title": "Texte littéral, ou clé de traduction \"$\"",
+            "description": "Texte littéral, ou clé de traduction \"$\"",
+            "params": "Paramètres d'interpolation des traductions du titre et de la description",
+            "idempotencyKey": "Clé stable de l'événement, par ex. l'ID de livraison d'un déclencheur : un événement rejoué n'est livré qu'une fois"
+          }
+        },
+        "inviteUser": {
+          "name": "Inviter un utilisateur",
+          "description": "Invite une adresse e-mail dans un espace de travail : un utilisateur existant y est ajouté directement comme membre, sinon une invitation est créée (et son e-mail d'inscription envoyé, sauf si Envoyer l'e-mail est désactivé)",
+          "fields": {
+            "tenantId": "Espace de travail où inviter ; par défaut l'espace par défaut",
+            "language": "Langue de l'e-mail d'invitation et du compte qu'il crée ; en par défaut",
+            "inviterName": "Nom de l'expéditeur indiqué dans l'e-mail d'invitation"
+          }
+        }
+      },
+      "fields": {
+        "actorId": "ID de l'auteur",
+        "actorName": "Nom de l'auteur",
+        "asTenantOwner": "Propriétaire de l'espace",
+        "at": "Date",
+        "deliveryId": "ID de livraison",
+        "description": "Description",
+        "email": "E-mail",
+        "error": "Erreur",
+        "firstname": "Prénom",
+        "html": "HTML",
+        "icon": "Icône",
+        "idempotencyKey": "Clé de rejeu",
+        "ids": "ID des enregistrements",
+        "inviteId": "ID de l'invitation",
+        "inviterName": "Nom de l'invitant",
+        "isTenantOwner": "Propriétaire de l'espace",
+        "kind": "Résultat",
+        "language": "Langue",
+        "lastname": "Nom",
+        "linkTo": "Lien",
+        "location": "Table",
+        "messageId": "ID du message",
+        "name": "Nom",
+        "ok": "Envoyée",
+        "params": "Paramètres",
+        "props": "Propriétés du modèle",
+        "roleIds": "Rôles",
+        "sendEmail": "Envoyer l'e-mail",
+        "subject": "Objet",
+        "success": "Succès",
+        "template": "Modèle",
+        "tenantId": "Espace de travail",
+        "title": "Titre",
+        "to": "Destinataire",
+        "tone": "Ton",
+        "userId": "Utilisateur",
+        "userIds": "Utilisateurs"
+      }
     }
   }
 }

package/frontend-vue/layers/dms-core/shared/types/app-config.ts

@@ -67,8 +67,6 @@ export interface DmsFooterConfig {
    * the copyright.
    */
   copyright?: string | false;
-  /** The GitHub "Star" button of the DMS repository. */
-  githubStar?: boolean;
   /** The language picker. */
   localeSwitcher?: boolean;
 }

package/frontend-vue/layers/dms-layout/app/app.config.ts

@@ -215,7 +215,6 @@ export default {
     defaults: { logo: dmsLogo(), colors: dmsColors() },
     footer: {
       copyright: "Antelope",
-      githubStar: true,
       localeSwitcher: true,
     },
   },

package/frontend-vue/layers/dms-layout/app/assets/css/main.css

@@ -31,7 +31,12 @@
 }
 
 /* Self-hosted Geist (SIL OFL 1.1, files and LICENSE.txt in ../fonts).
-   Variable files cover weights 100–900 and keep builds deterministic offline. */
+   Variable files cover weights 100–900 and keep builds deterministic offline.
+   Geist has no narrow no-break space (U+202F), which French and a few other
+   locales group digits with: a fallback face drew it a fraction of a digit
+   wide, so "1 234" read as "1234". Each file here maps U+202F to its no-break
+   space glyph (fontTools: cmap[0x202F] = cmap[0xA0]); keep that mapping when
+   updating them. */
 @font-face {
   font-family: "Geist";
   font-style: normal;
@@ -155,6 +160,11 @@
      items, ~10px menus and 16px modals. */
     --ui-radius: calc(0.5rem / 1.5);
     --dms-radius-card: 0.875rem;
+    /* Pill tabs keep their v2 10px track, 7px tab and 4px count at the
+     default radius, and follow a theme that changes it. */
+    --dms-radius-tab-list: calc(var(--ui-radius) * 1.875);
+    --dms-radius-tab: calc(var(--ui-radius) * 1.3125);
+    --dms-radius-tab-badge: calc(var(--ui-radius) * 0.75);
 
     /* v2 shell metrics: 48px navbar, 56px sidebar brand row. */
     --ui-header-height: 3rem;

package/frontend-vue/layers/dms-layout/app/build/components/layout/DashboardBanners.vue

@@ -3,8 +3,9 @@ import DmsBlockActions from "#dms-ui/app/build/components/blocks/BlockActions.vu
 import { useComposedText } from "#dms-core/app/composables/translation/useComposedText";
 
 /**
- * Stacks the global layout banners under the dashboard header, on every page
- * of the dashboard layout. Each banner carries its own live-region role, so a
+ * Stacks the global layout banners under the dashboard header, on the pages
+ * each banner's scope covers (the application's pages unless it says
+ * otherwise). Each banner carries its own live-region role, so a
  * banner appearing after a navigation is announced as well. A text is a
  * string or a composed text, written in the reader's language, followed by
  * the banner's link buttons.

package/frontend-vue/layers/dms-layout/app/build/components/layout/DashboardHeader.vue

@@ -11,6 +11,12 @@ import {
 import { usePageRecordLabel } from "#dms-core/app/composables/page/usePageRecordLabel";
 import type { CategoryInfo } from "../../../types/page";
 import { resolveModuleLandingSlug } from "../../../utils/moduleLanding";
+import {
+  foldBreadcrumb,
+  isFoldedCrumbs,
+  withParentCrumb,
+} from "../../../utils/breadcrumb";
+import { fillRouteParams } from "../../../utils/pageQuery";
 
 const HOME_ICON = "i-ph-house-light";
 /** Breadcrumb slot of the folded middle crumbs on small screens. */
@@ -130,6 +136,26 @@ function moduleLandingSlug(
   );
 }
 
+/**
+ * The crumb of the page the current one is a detail of (`parentSlug`), its
+ * route parameters filled from the current page's: none when it is missing,
+ * out of reach, or names a parameter the current page lacks.
+ */
+const parentCrumb = computed((): BreadcrumbItem | null => {
+  const current = siteLayout.findMatchingRoute(route.path);
+  const parentSlug = current?.metadata.parentSlug;
+  if (!parentSlug) return null;
+  const path = fillRouteParams(parentSlug, current.params);
+  if (path.includes(":")) return null;
+  const parent = siteLayout.findMatchingRoute(path)?.metadata;
+  if (!parent || parent.hasAccess === false) return null;
+  const target = buildBreadcrumbTarget(path, parent, route.query);
+  return {
+    label: processI18n(parent.displayName),
+    ...(target ? { to: target } : {}),
+  };
+});
+
 const breadcrumb = computed((): BreadcrumbItem[] => {
   const base: BreadcrumbItem[] = [
     { icon: HOME_ICON, to: homepage || "/", "aria-label": t("header.home") },
@@ -143,7 +169,7 @@ const breadcrumb = computed((): BreadcrumbItem[] => {
 
   const paths = route.path.split("/").filter((path) => path);
 
-  const crumbs = base.concat(
+  const pathCrumbs = base.concat(
     paths
       .map((path, index): BreadcrumbItem | null => {
         const to = `/${paths.slice(0, index + 1).join("/")}`;
@@ -170,6 +196,7 @@ const breadcrumb = computed((): BreadcrumbItem[] => {
       })
       .filter((item) => item !== null),
   );
+  const crumbs = withParentCrumb(pathCrumbs, parentCrumb.value);
 
   // Written as the row has it: an email address keeps its lowercase.
   const last = crumbs.at(-1);
@@ -183,32 +210,25 @@ const breadcrumb = computed((): BreadcrumbItem[] => {
   return crumbs;
 });
 
+// The middle crumbs fold into a "…" menu (see the `#ellipsis` slot) so a
+// deep page still fits a phone without losing the way back up.
 const mobileBreadcrumb = computed(
-  (): (BreadcrumbItem & { children?: DropdownMenuItem[] })[] => {
-    if (breadcrumb.value.length <= 2) {
-      return breadcrumb.value;
-    }
-
-    // The middle crumbs fold into a "…" menu (see the `#ellipsis` slot) so a
-    // deep page still fits a phone without losing the way back up.
-    return [
-      breadcrumb.value[0]!,
-      {
-        slot: MOBILE_ELLIPSIS_SLOT,
-        children: breadcrumb.value.slice(1, -1).map((x) => ({
-          label: x.label,
-          to: x.to,
-        })),
-      },
-      breadcrumb.value.slice(-1)[0]!,
-    ];
-  },
+  (): (BreadcrumbItem & { children?: DropdownMenuItem[] })[] =>
+    foldBreadcrumb(breadcrumb.value, MOBILE_ELLIPSIS_SLOT).map((crumb) => {
+      if (!isFoldedCrumbs(crumb)) return crumb;
+      return {
+        slot: crumb.slot,
+        children: crumb.children.map((x) => ({ label: x.label, to: x.to })),
+      };
+    }),
 );
 </script>
 
 <template>
   <div data-dms-persistent-header>
-    <UDashboardNavbar>
+    <!-- The phone toggle below is the only one: the navbar's own would sit
+         next to it. -->
+    <UDashboardNavbar :toggle="false">
       <template #leading>
         <UButton
           class="lg:hidden"

package/frontend-vue/layers/dms-layout/app/build/components/layout/DashboardPageBody.vue

@@ -14,10 +14,12 @@ interface Props {
   /** Header buttons declared by the backend page (`headerActions`). */
   headerActions?: LayoutHeaderAction[];
   /**
-   * The page query the server resolved the buttons' availability for, set
-   * when one declares an `availability` (`headerActionsQuery`).
+   * The page query the server served the buttons for, set when one declares
+   * an `availability` or the page reads a `record` (`headerActionsQuery`).
    */
   headerActionsQuery?: Record<string, string>;
+  /** The route parameters (`:id`) they were resolved for, likewise. */
+  headerActionsParams?: Record<string, string>;
   /** Space between the page header and the page. */
   headerClass?: string;
 }
@@ -29,6 +31,7 @@ const props = withDefaults(defineProps<Props>(), {
   description: undefined,
   headerActions: () => [],
   headerActionsQuery: undefined,
+  headerActionsParams: undefined,
   headerClass: "pb-6",
 });
 
@@ -67,6 +70,7 @@ const PAGE_SLOT_CLASS =
       <PageHeaderActionsOutlet
         :actions="props.headerActions"
         :served-query="props.headerActionsQuery"
+        :served-params="props.headerActionsParams"
       />
     </template>
   </PageHeader>

package/frontend-vue/layers/dms-layout/app/build/components/layout/DashboardSidebar.vue

@@ -14,13 +14,10 @@ import { useKeyboardPlatform } from "#dms-ui/app/composables/global/keyboardPlat
 import { useMediaQuery } from "@vueuse/core";
 import DmsSidebarUserMenu from "./SidebarUserMenu.vue";
 
-const SETTINGS_PATH = "/settings";
 const MODULES_PATH = "/modules";
-// Registered ids of the footer entries, so "Preview as role" can lock them.
-const SETTINGS_FULL_ID = "settings";
+// Registered id of the Modules entry, so "Preview as role" can lock it.
 const MODULES_FULL_ID = "modules";
 const MODULES_TREE_KEY = "modules";
-const SETTINGS_ICON = "i-ph-gear-six-light";
 const MODULES_ICON = "i-ph-squares-four-light";
 const BACK_ICON = "i-ph-arrow-left-light";
 const ESCAPE_KEY = "Escape";
@@ -254,21 +251,9 @@ const footerItems = computed((): NavigationMenuItem[] => {
     });
   }
 
-  // Settings highlights its sub-pages; Back and Modules only highlight their
-  // destinations, regardless of the router's default prefix matching.
-  result.push(
-    addActiveStateToMenuItem(
-      {
-        fullId: SETTINGS_FULL_ID,
-        label: t("menu.section.settings"),
-        to: SETTINGS_PATH,
-        icon: SETTINGS_ICON,
-      } as DmsMenuItem,
-      currentFullId.value,
-      currentRoute.value,
-    ),
-  );
-
+  // The settings are reached from the account menu, not from here. Back and
+  // Modules only highlight their destinations, regardless of the router's
+  // default prefix matching.
   if (isOwner.value) {
     result.push({
       fullId: MODULES_FULL_ID,

package/frontend-vue/layers/dms-layout/app/build/components/layout/Footer.vue

@@ -1,19 +1,12 @@
 <script setup lang="ts">
 import type { SelectItem } from "@nuxt/ui";
-import {
-  GITHUB_REPOSITORY,
-  GITHUB_REPOSITORY_URL,
-} from "../../utils/github-repository";
 
 const EXTERNAL_LINK_PATTERN = /^https?:\/\//;
 const DEFAULT_COPYRIGHT = "Antelope";
-const GITHUB_REPOSITORY_API = `https://api.github.com/repos/${GITHUB_REPOSITORY}`;
-const GITHUB_STARS_CACHE_KEY = "dms-github-stars";
-// GitHub allows 60 anonymous API calls an hour per visitor: the count is
-// cached for the session and refreshed hourly.
-const GITHUB_STARS_CACHE_TTL_MS = 60 * 60 * 1000;
 
 const { locale, setLocale, t } = useI18n();
+const { loggedIn: isLoggedIn } = useDmsUserSession();
+const { changeLanguage } = useUserLanguage();
 const { uniqueLocales } = useUniqueLocales();
 const { links } = useFooterLinks();
 const { processI18n } = useTranslation();
@@ -23,7 +16,6 @@ const copyright = computed(() =>
     ? null
     : processI18n(footer.value.copyright ?? DEFAULT_COPYRIGHT),
 );
-const showsGithubStar = computed(() => footer.value.githubStar !== false);
 const showsLocaleSwitcher = computed(
   () => footer.value.localeSwitcher !== false,
 );
@@ -37,82 +29,23 @@ function isExternal(to: string): boolean {
   return EXTERNAL_LINK_PATTERN.test(to);
 }
 
-interface CachedStars {
-  count: number;
-  fetchedAt: number;
-}
-
-const githubStars = ref<number | null>(null);
-// The count is fetched after mount: a placeholder holds its place until then,
-// and the segment only goes away if no count could be read.
-const githubStarsSettled = ref(false);
-const formattedGithubStars = computed(() =>
-  githubStars.value === null
-    ? ""
-    : new Intl.NumberFormat(locale.value, { notation: "compact" }).format(
-        githubStars.value,
-      ),
-);
-
-function readCachedStars(): CachedStars | null {
-  try {
-    const raw = sessionStorage.getItem(GITHUB_STARS_CACHE_KEY);
-    return raw ? (JSON.parse(raw) as CachedStars) : null;
-  } catch {
-    return null;
-  }
-}
-
-function writeCachedStars(count: number): void {
-  try {
-    sessionStorage.setItem(
-      GITHUB_STARS_CACHE_KEY,
-      JSON.stringify({ count, fetchedAt: Date.now() } satisfies CachedStars),
-    );
-  } catch {
-    /* storage unavailable: the count is fetched again next time */
-  }
-}
-
-// Starring itself happens on GitHub (it needs the visitor's GitHub session);
-// the button shows the live count and opens the repository.
-async function loadGithubStars(): Promise<void> {
-  const cached = readCachedStars();
-  if (cached && Date.now() - cached.fetchedAt < GITHUB_STARS_CACHE_TTL_MS) {
-    githubStars.value = cached.count;
+// A signed-in user on a page of this layout (the account switcher) switches
+// their profile's language too: the session applies that one on every load,
+// and the server writes in it, so switching the screen alone would leave the
+// two apart. A visitor's choice lives in the locale cookie.
+async function onLocaleChange(code: unknown) {
+  if (isLoggedIn.value) {
+    await changeLanguage(code as string);
     return;
   }
-  try {
-    const response = await fetch(GITHUB_REPOSITORY_API, {
-      headers: { Accept: "application/vnd.github+json" },
-    });
-    if (!response.ok) return;
-    const { stargazers_count: count } = (await response.json()) as {
-      stargazers_count?: unknown;
-    };
-    if (typeof count !== "number") return;
-    githubStars.value = count;
-    writeCachedStars(count);
-  } catch {
-    /* offline or rate-limited: the button shows without a count */
-  }
-}
-
-onMounted(async () => {
-  if (!showsGithubStar.value) return;
-  await loadGithubStars();
-  githubStarsSettled.value = true;
-});
-
-async function onLocaleChange(code: unknown) {
   await setLocale(code as typeof locale.value);
 }
 </script>
 
 <template>
   <!-- v2 .au-foot: one quiet 12.5px row, the locale switcher pushed right.
-       On phones the links get a taller invisible hit area and the star
-       button grows to 32px, so each stays easy to tap. -->
+       On phones the links get a taller invisible hit area, so each stays
+       easy to tap. -->
   <footer
     class="border-default text-dimmed flex flex-wrap items-center gap-x-[18px] gap-y-1.5 border-t px-5 py-3 text-[12.5px] max-sm:justify-center"
   >
@@ -136,35 +69,6 @@ async function onLocaleChange(code: unknown) {
       </DmsLink>
     </template>
 
-    <!-- GitHub star button: icon + "Star" | live count, opens the repository. -->
-    <a
-      v-if="showsGithubStar"
-      :href="GITHUB_REPOSITORY_URL"
-      target="_blank"
-      rel="noopener noreferrer"
-      :aria-label="t('empty_layout.footer.github_star_label')"
-      :title="t('empty_layout.footer.github_star_label')"
-      class="border-default text-muted hover:text-highlighted hover:border-accented hover:bg-elevated inline-flex h-6 items-stretch overflow-hidden rounded-md border transition-colors max-sm:h-8"
-    >
-      <span class="flex items-center gap-1.5 px-2 font-medium">
-        <UIcon name="i-ph-github-logo" class="size-3.5" :aria-hidden="true" />
-        <UIcon name="i-ph-star" class="size-3" :aria-hidden="true" />
-        {{ t("empty_layout.footer.github_star") }}
-      </span>
-      <span
-        v-if="githubStars !== null || !githubStarsSettled"
-        class="border-default flex items-center border-s px-2 font-mono tabular-nums"
-      >
-        <USkeleton
-          :aria-label="t('dms.a11y.loading')"
-          v-if="githubStars === null"
-          aria-hidden="true"
-          class="h-2.5 w-6"
-        />
-        <template v-else>{{ formattedGithubStars }}</template>
-      </span>
-    </a>
-
     <USelect
       v-if="showsLocaleSwitcher"
       :model-value="locale"

package/frontend-vue/layers/dms-layout/app/build/components/layout/GithubStarPrompt.vue

@@ -1,7 +1,10 @@
 <script setup lang="ts">
 import { computed } from "vue";
+import { useOpenDialog } from "#dms-ui/app/build/composables/containers/closingLayers";
 import { isFloatingSaveBarShown } from "#dms-ui/app/build/composables/form/floatingSaveBars";
 import { useGithubStarPrompt } from "../../composables/general/useGithubStarPrompt";
+import { useActiveSidePanel } from "../../composables/layout/sidePanelState";
+import { useSidebarState } from "./sidebarState";
 
 const TITLE_ID = "dms-github-star-prompt-title";
 const DESCRIPTION_ID = "dms-github-star-prompt-description";
@@ -9,6 +12,9 @@ const DESCRIPTION_ID = "dms-github-star-prompt-description";
 const { t } = useI18n();
 const { user } = useCurrentUser();
 const toast = useToast();
+const { open: isSidebarOpen } = useSidebarState();
+const { panel: sidePanel } = useActiveSidePanel();
+const isDialogOpen = useOpenDialog();
 
 // Developers only: a production build, a client's dashboard included, never
 // counts, stores or shows anything. The same flag gates the dev reload.
@@ -16,15 +22,21 @@ const { isDue, snooze, star, dismiss } = useGithubStarPrompt(
   import.meta.env.DEV,
 );
 
-// The toaster stacks in the same corner, and a floating save bar sticks to
-// the bottom of the panel: the prompt steps aside while either is up rather
-// than cover it.
+// The toaster stacks in the same corner, a floating save bar sticks to the
+// bottom of the panel, and the phone sidebar keeps its account menu trigger
+// at the bottom of the screen: the prompt steps aside while any is up rather
+// than cover it. The sidebar only opens as a drawer, below `lg`. It waits
+// as well while a drawer, a modal or a side panel is open, whose footer or
+// content it would float over, and comes back once they close.
 const isShown = computed(
   () =>
     isDue.value &&
     !!user.value &&
     toast.toasts.value.length === 0 &&
-    !isFloatingSaveBarShown.value,
+    !isFloatingSaveBarShown.value &&
+    !isSidebarOpen.value &&
+    !sidePanel.value &&
+    !isDialogOpen.value,
 );
 </script>
 
@@ -34,14 +46,13 @@ const isShown = computed(
        width, rising into place like a toast. The buttons take the card's
        full width, so the longer French label still fits beside "Later".
        On a phone it tightens and drops the icon, so the text runs the full
-       width and covers less of the page. From `lg` it stays clear of an
-       open side panel, whose width the dashboard frame sets. -->
+       width and covers less of the page. -->
   <div
     v-if="isShown"
     role="dialog"
     :aria-labelledby="TITLE_ID"
     :aria-describedby="DESCRIPTION_ID"
-    class="bg-default ring-accented fixed inset-x-3 bottom-3 z-50 rounded-(--dms-radius-card) p-3 shadow-(--dms-shadow-pop) ring transition duration-300 ease-out motion-reduce:transition-none sm:inset-x-auto sm:right-5 sm:bottom-5 sm:w-[380px] sm:p-3.5 sm:ps-4 lg:right-[calc(min(var(--dms-side-panel-width,0px),60vw)+1.25rem)] starting:translate-y-4 starting:opacity-0"
+    class="bg-default ring-accented fixed inset-x-3 bottom-3 z-50 rounded-(--dms-radius-card) p-3 shadow-(--dms-shadow-pop) ring transition duration-300 ease-out motion-reduce:transition-none sm:inset-x-auto sm:right-5 sm:bottom-5 sm:w-[380px] sm:p-3.5 sm:ps-4 starting:translate-y-4 starting:opacity-0"
   >
     <div class="flex items-start gap-3 pe-6">
       <DmsIconWell icon="i-ph-star" size="sm" class="max-sm:hidden" />

package/frontend-vue/layers/dms-layout/app/build/components/layout/PageHeaderActionsOutlet.vue

@@ -11,15 +11,19 @@ interface PageHeaderActionsOutletProps {
   actions: LayoutHeaderAction[];
   /** The page query the server resolved their availability for. */
   servedQuery?: Record<string, string>;
+  /** The route parameters the server resolved their availability for. */
+  servedParams?: Record<string, string>;
 }
 
 const props = withDefaults(defineProps<PageHeaderActionsOutletProps>(), {
   servedQuery: undefined,
+  servedParams: undefined,
 });
 
 const actions = useServedHeaderActions({
   actions: () => props.actions,
   servedQuery: () => props.servedQuery,
+  servedParams: () => props.servedParams,
 });
 
 const ROOT_SELECTOR = "[data-dms-page-header-actions]";