@revenexx/studio-shared 0.3.3 → 0.4.1

package/dist/runtime/components/Shared/TabBar.vue

@@ -1,34 +1,51 @@
 <script setup>
-defineProps({
+import { ref } from "vue";
+const props = defineProps({
   tabs: { type: Array, required: true },
   modelValue: { type: String, required: true },
-  sticky: { type: Boolean, required: false, default: true }
+  sticky: { type: Boolean, required: false, default: true },
+  label: { type: String, required: false }
 });
-defineEmits(["update:modelValue"]);
+const emit = defineEmits(["update:modelValue"]);
+const buttons = ref([]);
+function onKeydown(event, index) {
+  const last = props.tabs.length - 1;
+  const next = event.key === "ArrowRight" ? index === last ? 0 : index + 1 : event.key === "ArrowLeft" ? index === 0 ? last : index - 1 : event.key === "Home" ? 0 : event.key === "End" ? last : -1;
+  if (next < 0) return;
+  event.preventDefault();
+  const tab = props.tabs[next];
+  if (!tab) return;
+  emit("update:modelValue", tab.key);
+  buttons.value[next]?.focus();
+}
 </script>
 
 <template>
   <!-- Sticks flush against the bottom of the sticky PageHeader (57px = its
        pt-4 pb-3 + text-xl line + 1px border) so header and tabs stay glued as
-       one unit while the panel scrolls. Glassy frosted bg (blur + low opacity)
-       lets content scroll through. -->
-  <div :class="sticky ? 'sticky top-[57px] z-10 bg-white/40 backdrop-blur-xl' : 'relative'">
+       one unit while the panel scrolls. Opaque in the shell's ground, like the
+       header — content scrolling through read as overlapping text
+       (customers-09). -->
+  <div :class="sticky ? 'sticky top-[57px] z-10 bg-[var(--color-shell,#f3f1fa)]' : 'relative'">
     <!-- Pull the row out by the tab padding so the first/last label sits flush
          with the surrounding content (headline) edges. -->
-    <div class="relative z-10 -mx-2.5 flex gap-1 overflow-x-auto">
+    <div class="relative z-10 -mx-2.5 flex gap-1 overflow-x-auto" role="tablist" :aria-label="label">
       <button
-        v-for="t in tabs"
+        v-for="(t, index) in tabs"
         :key="t.key"
+        ref="buttons"
         type="button"
+        role="tab"
+        :aria-selected="modelValue === t.key"
+        :tabindex="modelValue === t.key || !tabs.some((x) => x.key === modelValue) && index === 0 ? 0 : -1"
         class="group relative shrink-0 cursor-pointer whitespace-nowrap px-2.5 py-2 text-sm font-medium transition-colors"
         :class="modelValue === t.key ? 'text-[#0B0522] hover:text-primary' : 'text-[#0B0522]/80 hover:text-primary'"
-        @click="$emit('update:modelValue', t.key)"
+        @click="emit('update:modelValue', t.key)"
+        @keydown="onKeydown($event, index)"
       >
+        <!-- No counters in tabs (Michael 13.10.): only some tabs could carry
+             one, and a half-counted tab bar reads as inconsistent. -->
         {{ t.label }}
-        <span
-          v-if="t.badge"
-          class="ml-1 rounded-full bg-muted px-1.5 text-mono font-medium tabular-nums text-muted-foreground"
-        >{{ t.badge }}</span>
         <!-- 2px indicator, exactly under the label (inset-x-3 = px-3). -->
         <span
           class="pointer-events-none absolute inset-x-2.5 bottom-0 h-0.5 rounded-full transition-colors"

package/dist/runtime/components/Shared/TabBar.vue.d.ts

@@ -1,23 +1,3 @@
-/**
- * Underline tab bar — the standard cockpit tabs. A full-width hairline sits
- * behind the row; the active/hover indicator is a 2px bar spanning exactly the
- * label width (inset-x-2.5 = the button's px-2.5), sitting on the baseline over
- * the hairline. Active = primary; hover = soft primary. Tabs scroll
- * horizontally on overflow. To bleed the line to the panel edges, pass e.g.
- * `class="-mx-4 px-4"` from a padded page.
- *
- * ## `sticky`
- *
- * On by default, because the original job was a detail page: the row glues
- * itself to the bottom of the sticky `PageHeader` (hence the magic `57px`) and
- * frosts its background so content scrolls through.
- *
- * Off for a row INSIDE a panel — the queue tabs between a DataTable's toolbar
- * and its header, say. There the offset is wrong (there is no page header above
- * it) and the frosted layer is worse than nothing, because the panel already
- * has a background of its own and the blur only muddies the rows scrolling past
- * underneath. Same tabs, same indicator, same hairline; just not pinned.
- */
 export interface TabItem {
     key: string;
     label: string;
@@ -28,12 +8,15 @@ type __VLS_Props = {
     modelValue: string;
     /** Pin to the page header. Off for a bar inside a panel. */
     sticky?: boolean;
+    /** Accessible name of the tab list. */
+    label?: string;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (key: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((key: string) => any) | undefined;
 }>, {
     sticky: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Shared/ViewTab.d.vue.ts

@@ -3,5 +3,6 @@ type __VLS_Props = {
     icon?: unknown;
     label: string;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Shared/ViewTab.vue.d.ts

@@ -3,5 +3,6 @@ type __VLS_Props = {
     icon?: unknown;
     label: string;
 };
-declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Shared/Wizard.d.vue.ts

@@ -9,17 +9,28 @@ type __VLS_Props = {
     /** Gate the Next/Finish button for the current step. */
     canAdvance?: boolean;
     busy?: boolean;
+    /** Label of the last step's button — the surface's own verb ("Anlegen"). */
+    finishLabel?: string;
+    /** Extra class on the foot, e.g. `rx-dialog-foot` inside a modal (PE-1055). */
+    footerClass?: string;
+    /**
+     * Fill a fixed-height parent: the steps and the foot stay put, only the
+     * step's content scrolls (a stepped create dialog, Michael 18.10.).
+     */
+    fill?: boolean;
 };
+declare function back(): void;
+declare function next(): void;
 declare var __VLS_1: {
     step: any;
     index: any;
 }, __VLS_3: {
-    back: any;
-    next: any;
+    back: typeof back;
+    next: typeof next;
     isFirst: any;
     isLast: any;
-    canAdvance: any;
-    busy: any;
+    canAdvance: boolean;
+    busy: boolean;
     index: any;
 };
 type __VLS_Slots = {} & {
@@ -27,18 +38,20 @@ type __VLS_Slots = {} & {
 } & {
     footer?: (props: typeof __VLS_3) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (args_0: number) => any;
     finish: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((args_0: number) => any) | undefined;
     onFinish?: (() => any) | undefined;
 }>, {
+    fill: boolean;
+    busy: boolean;
     modelValue: number;
     canAdvance: boolean;
-    busy: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/components/Shared/Wizard.vue

@@ -1,10 +1,14 @@
 <script setup>
+import { DIALOG_BODY_CLASS } from "../../lib/formLayout";
 import { Button } from "@revenexx/studio";
 const props = defineProps({
   steps: { type: Array, required: true },
   modelValue: { type: Number, required: false, default: 0 },
   canAdvance: { type: Boolean, required: false, default: true },
-  busy: { type: Boolean, required: false, default: false }
+  busy: { type: Boolean, required: false, default: false },
+  finishLabel: { type: String, required: false },
+  footerClass: { type: String, required: false },
+  fill: { type: Boolean, required: false, default: false }
 });
 const emit = defineEmits(["update:modelValue", "finish"]);
 const t = useT();
@@ -29,7 +33,7 @@ function goTo(i) {
 </script>
 
 <template>
-  <div class="space-y-5">
+  <div :class="fill ? 'flex min-h-0 flex-1 flex-col gap-5' : 'space-y-5'">
     <!-- Go-Live-style stepper: a fill bar + label per step, completed steps
          are clickable to jump back. -->
     <div class="flex gap-3">
@@ -46,11 +50,11 @@ function goTo(i) {
       </div>
     </div>
 
-    <div>
+    <div :class="fill ? DIALOG_BODY_CLASS : ''" data-testid="wizard-body">
       <slot :step="activeStep" :index="index" />
     </div>
 
-    <div class="flex items-center justify-between border-t pt-3">
+    <div class="flex shrink-0 items-center justify-between border-t pt-3" :class="footerClass">
       <!-- Custom footer (e.g. multiple finish actions on a review step). Falls
            back to the standard Back / Next·Finish pair. -->
       <slot name="footer" :back="back" :next="next" :is-first="isFirst" :is-last="isLast" :can-advance="canAdvance" :busy="busy" :index="index">
@@ -58,7 +62,7 @@ function goTo(i) {
           {{ t("shared.wizard.action.back") }}
         </Button>
         <Button :disabled="!canAdvance || busy" class="gap-1" @click="next">
-          {{ isLast ? t("shared.wizard.action.finish") : t("shared.wizard.action.next") }}
+          {{ isLast ? finishLabel || t("shared.wizard.action.finish") : t("shared.wizard.action.next") }}
         </Button>
       </slot>
     </div>

package/dist/runtime/components/Shared/Wizard.vue.d.ts

@@ -9,17 +9,28 @@ type __VLS_Props = {
     /** Gate the Next/Finish button for the current step. */
     canAdvance?: boolean;
     busy?: boolean;
+    /** Label of the last step's button — the surface's own verb ("Anlegen"). */
+    finishLabel?: string;
+    /** Extra class on the foot, e.g. `rx-dialog-foot` inside a modal (PE-1055). */
+    footerClass?: string;
+    /**
+     * Fill a fixed-height parent: the steps and the foot stay put, only the
+     * step's content scrolls (a stepped create dialog, Michael 18.10.).
+     */
+    fill?: boolean;
 };
+declare function back(): void;
+declare function next(): void;
 declare var __VLS_1: {
     step: any;
     index: any;
 }, __VLS_3: {
-    back: any;
-    next: any;
+    back: typeof back;
+    next: typeof next;
     isFirst: any;
     isLast: any;
-    canAdvance: any;
-    busy: any;
+    canAdvance: boolean;
+    busy: boolean;
     index: any;
 };
 type __VLS_Slots = {} & {
@@ -27,18 +38,20 @@ type __VLS_Slots = {} & {
 } & {
     footer?: (props: typeof __VLS_3) => any;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (args_0: number) => any;
     finish: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     "onUpdate:modelValue"?: ((args_0: number) => any) | undefined;
     onFinish?: (() => any) | undefined;
 }>, {
+    fill: boolean;
+    busy: boolean;
     modelValue: number;
     canAdvance: boolean;
-    busy: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/runtime/composables/useDetailSheet.d.ts

@@ -0,0 +1,20 @@
+import type { ComputedRef, MaybeRefOrGetter, WritableComputedRef } from 'vue';
+export interface DetailSheetBinding {
+    /** The open record's id, or `null` when the panel is shut. */
+    openId: ComputedRef<string | null>;
+    /** For `v-model:open` — writing `false` closes. */
+    isOpen: WritableComputedRef<boolean>;
+    open: (id: string) => void;
+    close: () => void;
+    /** Move to the neighbouring record in `ids`; a no-op at either end. */
+    step: (dir: -1 | 1) => void;
+    /** Whether `step(-1)` / `step(1)` would land anywhere — for the panel's arrow buttons. */
+    canStep: ComputedRef<{
+        prev: boolean;
+        next: boolean;
+    }>;
+}
+export declare function useDetailSheet(key: string, options?: {
+    /** The records in the order the list shows them, for `step`. */
+    ids?: MaybeRefOrGetter<readonly string[]>;
+}): DetailSheetBinding;

package/dist/runtime/composables/useDetailSheet.js

@@ -0,0 +1,50 @@
+import { computed, toValue, watch } from "vue";
+import { idFromQuery, neighbourId, queryWith } from "../lib/detailSheet.js";
+const MARKER = "detailSheet";
+export function useDetailSheet(key, options = {}) {
+  const route = useRoute();
+  const router = useRouter();
+  const openId = computed(() => idFromQuery(route.query[key]));
+  function pushedHere() {
+    if (typeof window === "undefined") return false;
+    return window.history.state?.[MARKER] === key;
+  }
+  let closing = false;
+  watch(openId, (id) => {
+    if (id === null) closing = false;
+  });
+  function open(id) {
+    if (openId.value === id) return;
+    closing = false;
+    const query = queryWith(route.query, key, id);
+    if (openId.value === null) {
+      void router.push({ query, state: { [MARKER]: key } });
+    } else {
+      void router.replace({ query, state: pushedHere() ? { [MARKER]: key } : {} });
+    }
+  }
+  function close() {
+    if (openId.value === null || closing) return;
+    closing = true;
+    if (pushedHere()) router.back();
+    else void router.replace({ query: queryWith(route.query, key, null) });
+  }
+  function step(dir) {
+    const next = neighbourId(toValue(options.ids) ?? [], openId.value, dir);
+    if (next !== null) open(next);
+  }
+  const canStep = computed(() => {
+    const ids = toValue(options.ids) ?? [];
+    return {
+      prev: neighbourId(ids, openId.value, -1) !== null,
+      next: neighbourId(ids, openId.value, 1) !== null
+    };
+  });
+  const isOpen = computed({
+    get: () => openId.value !== null,
+    set: (v) => {
+      if (!v) close();
+    }
+  });
+  return { openId, isOpen, open, close, step, canStep };
+}

package/dist/runtime/composables/useMediaLibrary.d.ts

@@ -37,5 +37,17 @@ export interface MediaLibraryClient {
     thumbnailUrl: (asset: StorageAsset, size?: number) => string | null;
     /** True while the asset is still being scanned/processed. */
     isProcessing: (asset: StorageAsset) => boolean;
+    /**
+     * Optional server-side narrowing (the cockpit's client has it): free-text
+     * search over name, title, alt text and tags; one kind; the sort key
+     * (`-created_at`, `original_name`, …); a reload of page 1; a reset. A host
+     * without them gets a picker without search, chips and sort.
+     */
+    search?: Ref<string>;
+    kind?: Ref<string | null>;
+    sortKey?: Ref<string>;
+    total?: Ref<number | null>;
+    loadAssets?: () => Promise<void>;
+    resetFilters?: () => void;
 }
 export declare function useMediaLibrary(): MediaLibraryClient;

package/dist/runtime/composables/usePlatformTenant.d.ts

@@ -9,6 +9,12 @@ import type { Ref } from 'vue';
  */
 export interface PlatformTenant {
     slug: Ref<string | null>;
+    /**
+     * Resolves once the active tenant is known, or once it is clear there is
+     * none yet (bounded — the host decides how long). Never throws. Callers that
+     * send tenant-scoped requests use `requirePlatformTenant` from
+     * `@revenexx/studio-shared/lib/activeTenant` instead of reading `slug`.
+     */
     load: () => Promise<void>;
 }
 export declare function usePlatformTenant(): PlatformTenant;

package/dist/runtime/composables/useSavedViews.d.ts

@@ -28,12 +28,22 @@ export interface StoredSavedView {
     id: string;
     name: string;
     snapshot: unknown;
+    /** PE-1052: shared with everyone in the tenant. Private when absent. */
+    shared?: boolean;
+    /** Who shared it, for a view that is not the reader's own. */
+    ownerName?: string | null;
+    /** The reader's own view (may change and delete it). Absent = own. */
+    mine?: boolean;
+}
+export interface SaveViewOptions {
+    /** „Für alle im Mandanten freigeben“ (PE-1052). Default private. */
+    shared?: boolean;
 }
 export interface SavedViewsStore {
     /** Read this surface's views. Never throws — a failure is an empty list. */
     list: (surface: string) => Promise<StoredSavedView[]>;
     /** Save under a name, replacing what that name held. */
-    save: (surface: string, name: string, snapshot: unknown) => Promise<StoredSavedView>;
+    save: (surface: string, name: string, snapshot: unknown, options?: SaveViewOptions) => Promise<StoredSavedView>;
     remove: (surface: string, id: string) => Promise<void>;
     /**
      * Does this store survive a new browser? The menu says so in one line, so

package/dist/runtime/composables/useSavedViews.js

@@ -8,7 +8,7 @@ function readAll(surface) {
     if (!raw) return [];
     const parsed = JSON.parse(raw);
     if (!Array.isArray(parsed)) return [];
-    return parsed.filter((v) => !!v && typeof v === "object" && typeof v.name === "string").map((v) => ({ id: localId(surface, v.name), name: v.name, snapshot: v.snapshot }));
+    return parsed.filter((v) => !!v && typeof v === "object" && typeof v.name === "string").map((v) => ({ id: localId(surface, v.name), name: v.name, snapshot: v.snapshot, shared: v.shared === true }));
   } catch {
     return [];
   }
@@ -17,7 +17,7 @@ function writeAll(surface, views) {
   try {
     if (typeof window === "undefined") return;
     window.localStorage.setItem(surface, JSON.stringify(
-      views.map((v) => ({ name: v.name, snapshot: v.snapshot }))
+      views.map((v) => ({ name: v.name, snapshot: v.snapshot, ...v.shared ? { shared: true } : {} }))
     ));
   } catch {
   }
@@ -28,9 +28,9 @@ export function useSavedViews() {
     async list(surface) {
       return readAll(surface);
     },
-    async save(surface, name, snapshot) {
+    async save(surface, name, snapshot, options) {
       const views = readAll(surface);
-      const entry = { id: localId(surface, name), name, snapshot };
+      const entry = { id: localId(surface, name), name, snapshot, shared: options?.shared === true };
       const at = views.findIndex((v) => v.name === name);
       if (at >= 0) views.splice(at, 1, entry);
       else views.push(entry);

package/dist/runtime/composables/useWidgetFigures.d.ts

@@ -0,0 +1,12 @@
+import type { MaybeRefOrGetter, Ref } from 'vue';
+/** One figure as the widget shows it, already formatted. */
+export interface WidgetFigure {
+    label: string;
+    value: string;
+}
+/** Called by the frame: the figures its widget may provide. */
+export declare function provideWidgetFigures(): Ref<WidgetFigure[] | null>;
+/** Called by a widget: keep its frame's figures in step with `figures`. */
+export declare function useWidgetFigures(figures: MaybeRefOrGetter<WidgetFigure[] | null>): void;
+/** The figures as card text: one `label: value` line each. */
+export declare function figuresText(figures: WidgetFigure[] | null): string;

package/dist/runtime/composables/useWidgetFigures.js

@@ -0,0 +1,24 @@
+import { getCurrentInstance, inject, onBeforeUnmount, provide, ref, toValue, watch } from "vue";
+const WIDGET_FIGURES = Symbol("widgetFigures");
+export function provideWidgetFigures() {
+  const figures = ref(null);
+  provide(WIDGET_FIGURES, figures);
+  return figures;
+}
+export function useWidgetFigures(figures) {
+  const target = inject(WIDGET_FIGURES, null);
+  if (!target) return;
+  watch(
+    () => toValue(figures)?.filter((f) => f.label && f.value) ?? null,
+    (next) => {
+      target.value = next?.length ? next : null;
+    },
+    { immediate: true, deep: true }
+  );
+  if (getCurrentInstance()) onBeforeUnmount(() => {
+    target.value = null;
+  });
+}
+export function figuresText(figures) {
+  return figures?.map((f) => `${f.label}: ${f.value}`).join("\n") ?? "";
+}

package/dist/runtime/composables/useWidgetHeader.d.ts

@@ -0,0 +1,15 @@
+import type { Ref } from 'vue';
+export interface WidgetHeaderStatus {
+    /** Show the loading indicator. */
+    busy: boolean;
+    /** One short line; truncated to fit beside the title. */
+    text: string;
+    /** How far along, 0 to 100. Omit when unknown: the frame shows a spinner. */
+    progress?: number;
+}
+/** Called by the frame: the status its widget may set, provided to the widget below it. */
+export declare function provideWidgetHeader(): Ref<WidgetHeaderStatus | null>;
+/** Called by a widget: set or clear the status its frame shows. */
+export declare function useWidgetHeader(): {
+    setStatus: (next: WidgetHeaderStatus | null) => void;
+};

package/dist/runtime/composables/useWidgetHeader.js

@@ -0,0 +1,15 @@
+import { getCurrentInstance, inject, onBeforeUnmount, provide, ref } from "vue";
+const WIDGET_HEADER_STATUS = Symbol("widgetHeaderStatus");
+export function provideWidgetHeader() {
+  const status = ref(null);
+  provide(WIDGET_HEADER_STATUS, status);
+  return status;
+}
+export function useWidgetHeader() {
+  const status = inject(WIDGET_HEADER_STATUS, null);
+  function setStatus(next) {
+    if (status) status.value = next;
+  }
+  if (getCurrentInstance()) onBeforeUnmount(() => setStatus(null));
+  return { setStatus };
+}

package/dist/runtime/lib/activeTenant.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The active tenant, as every tenant-scoped client sends it (PE-828).
+ *
+ * The contract the Cockpit shares with Console, Baseline and every gateway:
+ * each tenant-scoped request carries the active tenant slug in a header, and
+ * the service checks it against the token. The header only SELECTS a tenant
+ * the token already holds; it never grants one.
+ *
+ * Before this helper each client had its own copy of "send the header if we
+ * happen to know the slug", and most of them sent the request without it while
+ * the top-bar selection was still resolving. In an org with two tenants that
+ * is an ambiguous request, which the services answer with 400/403/422.
+ *
+ * So the rule is now one function: wait (bounded) for the active tenant, and
+ * refuse to send a tenant-scoped request when there is none. A missing tenant
+ * is a `NoActiveTenantError`, which the UI shows as "pick a tenant".
+ *
+ * Pure (Vue only), so the cockpit, studio-commerce and their tests share it.
+ */
+import { type Ref } from 'vue';
+/** The header the platform, Console, Baseline and most gateways read. */
+export declare const TENANT_HEADER = "X-Revenexx-Tenant";
+/** The header the AI gateway, Aria and integrations read instead. */
+export declare const TENANT_ID_HEADER = "X-Tenant-Id";
+/** How long a request waits for the active tenant before it gives up. */
+export declare const TENANT_WAIT_MS = 8000;
+export declare class NoActiveTenantError extends Error {
+    readonly status = 400;
+    readonly code = "no_active_tenant";
+    constructor(message?: string);
+}
+/** True for the error `requireTenant` throws, across bundle copies. */
+export declare function isNoActiveTenant(err: unknown): err is NoActiveTenantError;
+/**
+ * Wait for a shared ref to hold a value, bounded (RAD-182).
+ *
+ * Loads what can be loaded, then waits until the value arrives or `timeoutMs`
+ * passes. Resolves null on timeout; never throws.
+ */
+export declare function waitForValue<T>(source: Ref<T | null | undefined>, load: () => Promise<unknown>, timeoutMs?: number): Promise<T | null>;
+/** Anything that can name the active tenant: `useConsoleTenants`, `usePlatformTenant`. */
+export interface TenantSource {
+    slug: Ref<string | null>;
+    load: () => Promise<unknown>;
+}
+/**
+ * The active tenant slug, or a `NoActiveTenantError`.
+ *
+ * Never returns null: a caller that gets past this line has a tenant to send.
+ */
+export declare function requireTenant(source: TenantSource, timeoutMs?: number): Promise<string>;
+/**
+ * The active tenant from a `usePlatformTenant()` seam, or a `NoActiveTenantError`.
+ *
+ * The seam's `load` already waits for the selection (the host bounds it), so
+ * nothing is waited for twice here.
+ */
+export declare function requirePlatformTenant(tenant: TenantSource): Promise<string>;

package/dist/runtime/lib/activeTenant.js

@@ -0,0 +1,45 @@
+import { watch } from "vue";
+export const TENANT_HEADER = "X-Revenexx-Tenant";
+export const TENANT_ID_HEADER = "X-Tenant-Id";
+export const TENANT_WAIT_MS = 8e3;
+export class NoActiveTenantError extends Error {
+  status = 400;
+  code = "no_active_tenant";
+  constructor(message = "No active tenant. Pick one in the top bar.") {
+    super(message);
+    this.name = "NoActiveTenantError";
+  }
+}
+export function isNoActiveTenant(err) {
+  return err?.code === "no_active_tenant";
+}
+export async function waitForValue(source, load, timeoutMs = TENANT_WAIT_MS) {
+  if (source.value) return source.value;
+  try {
+    await load();
+  } catch {
+  }
+  if (source.value) return source.value;
+  if (timeoutMs <= 0) return null;
+  return await new Promise((resolve) => {
+    let stop = null;
+    const timer = setTimeout(() => {
+      stop?.();
+      resolve(null);
+    }, timeoutMs);
+    stop = watch(source, (value) => {
+      if (!value) return;
+      clearTimeout(timer);
+      stop?.();
+      resolve(value);
+    });
+  });
+}
+export async function requireTenant(source, timeoutMs = TENANT_WAIT_MS) {
+  const slug = await waitForValue(source.slug, source.load, timeoutMs);
+  if (!slug) throw new NoActiveTenantError();
+  return slug;
+}
+export function requirePlatformTenant(tenant) {
+  return requireTenant(tenant, 0);
+}