@synopackageland/ui 0.14.1 → 0.14.3

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## 0.14.3 (2026-10-22)
+
+- `AppLayout` emits `brand(event: MouseEvent)` when its default logo/name is activated. Listening opts into a native button with token-based hover/focus styles and a home label in all nine languages; no listener keeps the existing markup. Works in the sidebar, collapsed rail, top navigation and phone bar/drawer; activation closes the drawer. A custom `brand` slot retains its own behavior.
+
+## 0.14.2 (2026-10-22)
+
+Additive only: existing props, defaults and DOM stay as they were.
+
+- `LoadingMask`: `delay` (ms, default 0) shows the mask only once `loading` has lasted that long, so a quick load does not flash it; it hides as soon as `loading` ends. The region is `aria-busy` from the start.
+
 ## 0.14.1 (2026-10-22)
 
 Additive only: existing props, defaults and DOM stay as they were.

package/README.md

@@ -350,6 +350,24 @@ import { AppLayout, Button, PageHeader } from '@synopackageland/ui'
 
 `AppLayout` also accepts `sidebar`, `toolbar`, and `footer` slots.
 
+Listen to `@brand` to make the default logo and name a native home button:
+
+```vue
+<AppLayout wide-layout="web" brand-name="My App" @brand="page = 'home'">
+  <template #sidebar><AppSidebar v-model="page" :groups="groups" /></template>
+  <PageContent>…</PageContent>
+</AppLayout>
+```
+
+The event receives the original `MouseEvent`, including native Enter/Space
+activation. The button uses a localized “Go to home” accessible name in all nine
+built-in languages, token-based hover and keyboard focus styles, and works in
+the expanded/collapsed sidebar, top navigation, phone bar and phone drawer. A
+brand activation closes the phone drawer and returns focus to its menu button.
+Without a listener the existing logo/name markup stays unchanged. The `brand`
+slot replaces the default brand and owns its own interaction; it is never
+wrapped in a button. A DSM window's title bar remains managed by DSM.
+
 `navigation="top"` (0.13.1+) lays the `sidebar` slot out as one bar above the
 page instead of a left column: the brand, then the `AppSidebar` items in a row
 (a row with children opens them in a menu; the bar scrolls sideways when the
@@ -628,7 +646,7 @@ phone; use `DataGrid` for anything a user searches or arranges.
 
 ### Loading
 
-`Spinner` is the DSM ring (`size` is the box in px, default 24). `LoadingMask` wraps content and covers it with a white 60% mask and a centred message box while `loading`; `LoadingArea` fills its container (give the parent a height) and centres the indicator, for whole-page or whole-panel waits. `Button loading` shows the 16px ring inline. Do not place a bare `Spinner` in a block container and expect it to be centred: use `LoadingArea`.
+`Spinner` is the DSM ring (`size` is the box in px, default 24). `LoadingMask` wraps content and covers it with a white 60% mask and a centred message box while `loading` (`delay` in ms holds the mask back so a quick load never flashes it; the region is `aria-busy` at once, so disable the actions it gates yourself); `LoadingArea` fills its container (give the parent a height) and centres the indicator, for whole-page or whole-panel waits. `Button loading` shows the 16px ring inline. Do not place a bare `Spinner` in a block container and expect it to be centred: use `LoadingArea`.
 
 ### Toolbar
 

package/dist/components/app/app-layout/AppBrand.vue.d.ts

@@ -2,7 +2,12 @@ type __VLS_Props = {
     name?: string;
     icon?: string;
     collapsed?: boolean;
+    interactive?: boolean;
 };
-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 __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    activate: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onActivate?: ((event: MouseEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/app/app-layout/AppLayout.vue.d.ts

@@ -33,7 +33,11 @@ type __VLS_Slots = {
     default?: () => unknown;
     footer?: () => unknown;
 };
-declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    brand: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onBrand?: ((event: MouseEvent) => any) | undefined;
+}>, {
     height: "auto" | "fill";
     minHeight: string;
     sidebarWidth: string;

package/dist/components/primitives/loading/LoadingMask.vue.d.ts

@@ -1,6 +1,8 @@
 type __VLS_Props = {
     loading?: boolean;
     text?: string;
+    /** Milliseconds `loading` must last before the overlay shows, so a quick load does not flash it. The region is `aria-busy` at once. */
+    delay?: number;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
@@ -9,6 +11,7 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     text: string;
     loading: boolean;
+    delay: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/i18n/text.d.ts

@@ -32,6 +32,7 @@ export declare const englishUiText: {
     readonly Notifications: "Notifications";
     readonly "Press F6 to access notifications": "Press F6 to access notifications";
     readonly "Application navigation": "Application navigation";
+    readonly "Go to home": "Go to home";
     readonly "Collapse navigation": "Collapse navigation";
     readonly "Expand navigation": "Expand navigation";
     readonly "Resize navigation": "Resize navigation";