@designcrowd/library.brand-page 6.0.17 → 6.0.18-single-h1-1

package/lib/src/{CreatedOnBrandCrowd-de-de-CRuM9pwt.js → CreatedOnBrandCrowd-de-de-DfogbXGp.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "275",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-en-us-DiV7Qndt.js → CreatedOnBrandCrowd-en-us-BMLmkiYc.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "251",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-es-es-p3wHaNxy.js → CreatedOnBrandCrowd-es-es-Uk9iK_0j.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "250",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-fr-fr-lBe3GAaV.js → CreatedOnBrandCrowd-fr-ca-Cy51ZgX0.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "237",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-fr-ca-lBe3GAaV.js → CreatedOnBrandCrowd-fr-fr-Cy51ZgX0.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "237",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-pt-pt-CYdNvtj_.js → CreatedOnBrandCrowd-pt-br-CEXgWjzj.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "263",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-pt-br-CYdNvtj_.js → CreatedOnBrandCrowd-pt-pt-CEXgWjzj.js}

@@ -1,5 +1,5 @@
 import { openBlock as e, createElementBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-A3BBQz0z.js";
+import { _ as t } from "./lib-B-AsdjHe.js";
 const i = {}, h = {
   width: "263",
   height: "36",

package/lib/src/{CreatedOnDcom-de-de-CkkOK8P7.js → CreatedOnDcom-de-de-QLEevsbN.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-A3BBQz0z.js";
+import { _ as e } from "./lib-B-AsdjHe.js";
 const M = {}, Z = {
   width: "242",
   height: "36",

package/lib/src/{CreatedOnDcom-en-us-vj6FbDx4.js → CreatedOnDcom-en-us-z1AQXwpB.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-A3BBQz0z.js";
+import { _ as e } from "./lib-B-AsdjHe.js";
 const i = {}, M = {
   width: "231",
   height: "36",

package/lib/src/{CreatedOnDcom-es-es-CY73pZR2.js → CreatedOnDcom-es-es-CRI1tyjM.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-A3BBQz0z.js";
+import { _ as e } from "./lib-B-AsdjHe.js";
 const M = {}, Z = {
   width: "230",
   height: "36",

package/lib/src/{CreatedOnDcom-fr-ca-D6tw2qnx.js → CreatedOnDcom-fr-ca-BvQdGFy0.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-A3BBQz0z.js";
+import { _ as e } from "./lib-B-AsdjHe.js";
 const i = {}, l = {
   width: "216",
   height: "36",

package/lib/src/{CreatedOnDcom-fr-fr-DbjyyrVQ.js → CreatedOnDcom-fr-fr-JzSzsXGi.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-A3BBQz0z.js";
+import { _ as e } from "./lib-B-AsdjHe.js";
 const i = {}, l = {
   width: "216",
   height: "36",

package/lib/src/{CreatedOnDcom-pt-br-C604XK7d.js → CreatedOnDcom-pt-br-CxE4X3lp.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as M } from "./lib-A3BBQz0z.js";
+import { _ as M } from "./lib-B-AsdjHe.js";
 const Z = {}, e = {
   width: "232",
   height: "36",

package/lib/src/{CreatedOnDcom-pt-pt-CSQ9xpbn.js → CreatedOnDcom-pt-pt-CPFY5hsH.js}

@@ -1,5 +1,5 @@
 import { openBlock as H, createElementBlock as V, createStaticVNode as t } from "vue";
-import { _ as M } from "./lib-A3BBQz0z.js";
+import { _ as M } from "./lib-B-AsdjHe.js";
 const Z = {}, e = {
   width: "232",
   height: "36",

package/lib/src/brand-page/components/media/Media.mixin.d.ts

@@ -68,7 +68,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>, {}, {
     type: string | undefined;
     isImageBroken: boolean;
-}, {}, {
+}, {
+    /**
+     * BP-5866: content images must never emit an empty `alt`. Reuses the
+     * shared alt fallback (author title → "{business}'s image" → "image") so
+     * a caller that passes no `alt-text` still renders descriptive text.
+     * Only consumed by the content `<FallbackImage>`; decorative/background
+     * images (rendered via `media`) and shapes never reach this path.
+     */
+    effectiveAltText(): string;
+}, {
     onImageError(): void;
 }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     mediaType: {

package/lib/src/brand-page/components/media/Media.mixin.js

@@ -1,4 +1,5 @@
 import { defineComponent } from 'vue';
+import { getImageAltText } from '@brand-page/utils';
 export default defineComponent({
     props: {
         mediaType: {
@@ -71,6 +72,18 @@ export default defineComponent({
             isImageBroken: false,
         };
     },
+    computed: {
+        /**
+         * BP-5866: content images must never emit an empty `alt`. Reuses the
+         * shared alt fallback (author title → "{business}'s image" → "image") so
+         * a caller that passes no `alt-text` still renders descriptive text.
+         * Only consumed by the content `<FallbackImage>`; decorative/background
+         * images (rendered via `media`) and shapes never reach this path.
+         */
+        effectiveAltText() {
+            return getImageAltText({ imageTitle: this.altText }, this.context);
+        },
+    },
     methods: {
         onImageError() {
             this.isImageBroken = true;

package/lib/src/brand-page/components/page/Page.mixin.d.ts

@@ -75,6 +75,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     bpShowTopNavigationMobile(): boolean;
     bpShowTopNavigationDesktop(): boolean;
     slug(): string;
+    /**
+     * Text for the single page-level `<h1>` (BP-5866). Sourced from the
+     * business/site name + page name so it mirrors the SSR document `<title>`.
+     */
+    pageHeadingText(): string;
     shouldShowSaveContactWidget(): boolean;
     isPremiumSubscription(): boolean;
     shouldShowPopupBranding(): boolean;

package/lib/src/brand-page/components/page/Page.mixin.js

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import { DEFAULT_FONT_FAMILY_KEY, FALLBACK_FONT_FAMILIES, FONT_FAMILY_CONFIGS, } from '../../constants';
-import { getSlugFromContext } from '@brand-page/utils';
+import { getSlugFromContext, getPageHeadingText } from '@brand-page/utils';
 import { findNavItemByRelativePath } from '@brand-page/utils/route.util';
 import { BRAND_PAGE_TYPES } from '@brand-page/models';
 import { hasProfileContent as checkHasProfileContent } from '@brand-page/utils/vcard.util';
@@ -292,6 +292,13 @@ export default defineComponent({
         slug() {
             return getSlugFromContext(this.context);
         },
+        /**
+         * Text for the single page-level `<h1>` (BP-5866). Sourced from the
+         * business/site name + page name so it mirrors the SSR document `<title>`.
+         */
+        pageHeadingText() {
+            return getPageHeadingText(this.context);
+        },
         shouldShowSaveContactWidget() {
             try {
                 if ((!this.context.isPreview &&

package/lib/src/brand-page/utils/index.d.ts

@@ -6,6 +6,7 @@ export * from './model.util';
 export * from './validation.util';
 export * from './payment.util';
 export * from './image.util';
+export * from './page-heading.util';
 export * from './font-loader.util';
 export * from './aspect-ratio.util';
 export * from './context.util';

package/lib/src/brand-page/utils/index.js

@@ -6,6 +6,7 @@ export * from './model.util';
 export * from './validation.util';
 export * from './payment.util';
 export * from './image.util';
+export * from './page-heading.util';
 export * from './font-loader.util';
 export * from './aspect-ratio.util';
 export * from './context.util';

package/lib/src/brand-page/utils/page-heading.util.d.ts

@@ -0,0 +1,13 @@
+import type { BrandPageContext } from '../models';
+/**
+ * Resolves the text for the single page-level `<h1>` a published site renders
+ * (BP-5866 — Bing rejected indexing because every section emitted its own
+ * `<h1>`; the page now owns exactly one).
+ *
+ * Mirrors the SSR `<title>` rule so the crawlable heading matches the document
+ * title: a sub-page reads `"{business} - {page}"`, while the home/root page
+ * reads just the business/site name — never the weak, non-descriptive literal
+ * "Home". Falls back to the page name, then the slug, when the business name
+ * is unset.
+ */
+export declare const getPageHeadingText: (context: BrandPageContext) => string;

package/lib/src/brand-page/utils/page-heading.util.js

@@ -0,0 +1,24 @@
+import { findNavItemByRelativePath } from './route.util';
+/**
+ * Resolves the text for the single page-level `<h1>` a published site renders
+ * (BP-5866 — Bing rejected indexing because every section emitted its own
+ * `<h1>`; the page now owns exactly one).
+ *
+ * Mirrors the SSR `<title>` rule so the crawlable heading matches the document
+ * title: a sub-page reads `"{business} - {page}"`, while the home/root page
+ * reads just the business/site name — never the weak, non-descriptive literal
+ * "Home". Falls back to the page name, then the slug, when the business name
+ * is unset.
+ */
+export const getPageHeadingText = (context) => {
+    const businessName = (context.pageTitle || '').trim();
+    const navItem = findNavItemByRelativePath(context.nav?.navItems || [], context.currentPageRelativePath || '');
+    const pageName = (navItem?.displayName || '').trim();
+    const isSubPage = Boolean(navItem && !navItem.isRoot && pageName);
+    if (businessName) {
+        return isSubPage ? `${businessName} - ${pageName}` : businessName;
+    }
+    // No business name: use the sub-page's name, else the slug — never the
+    // root page's own display name (usually the literal "Home").
+    return (isSubPage ? pageName : '') || context.brandPageSlug || '';
+};

package/lib/src/brand-page-maker/components/brand-page-maker/BrandPageMaker.mixin.d.ts

@@ -50,6 +50,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     isSaving: import("vue").ComputedRef<boolean>;
     isPublishing: import("vue").ComputedRef<boolean>;
     isPublished: import("vue").ComputedRef<boolean>;
+    shouldShowQuickLinkBar: import("vue").ComputedRef<boolean>;
     isBrandPageOrIsBrandContact: import("vue").ComputedRef<boolean>;
     brandPageViewModel: import("vue").ComputedRef<import("@brand-page").BrandPageViewModel>;
     backUrl: import("vue").ComputedRef<string>;

package/lib/src/brand-page-maker/components/brand-page-maker/BrandPageMaker.mixin.js

@@ -13,6 +13,7 @@ import { UI_DEVICE_MODES, UI_SCREENSIZE_MODES, } from '@shared/models';
 import { useBrandPageMakerStore, useBrandPageMakerUserStore, useLocalisedRouteStore, useUiStore, useSnapshotStore, useVideoStore, } from '@brand-page-maker/stores';
 import { useHistoryStore } from '@brand-page-maker/stores/history/history-store';
 import { useUndoRedoFlag } from '@brand-page-maker/composables/useUndoRedoFlag';
+import { useQuickLinkBarVisibility } from '@brand-page-maker/composables/useQuickLinkBarVisibility';
 import { useUiContentSettingsStore } from '@shared/content-settings/store';
 import { useUiTemplateSettingsStore } from '@shared/template-settings/store';
 import { useUiPageSettingsStore } from '@shared/page-settings/store';
@@ -73,6 +74,10 @@ export default defineComponent({
             isSaving: computed(() => brandPageMakerStore.isSaving),
             isPublishing: computed(() => brandPageMakerStore.isPublishing),
             isPublished: computed(() => brandPageMakerStore.isPublished),
+            // Whether the QuickLinkBar renders — used to offset the preview (Device)
+            // and SideBar clear of the fixed bar on mobile. Must match the bar's own
+            // render condition, so it shares the same predicate.
+            shouldShowQuickLinkBar: useQuickLinkBarVisibility(),
             isBrandPageOrIsBrandContact: computed(() => brandPageMakerStore.isBrandPageOrIsBrandContact),
             brandPageViewModel: computed(() => brandPageMakerStore.brandPageViewModel),
             backUrl: computed(() => localisedRouteStore.backToWebsiteManageUrlPath),

package/lib/src/brand-page-maker/components/brandpage-maker-page/BrandPageMakerPage.mixin.d.ts

@@ -1347,6 +1347,7 @@ declare const _default: import("vue").DefineComponent<{}, {
     bpShowTopNavigationMobile(): boolean;
     bpShowTopNavigationDesktop(): boolean;
     slug(): string;
+    pageHeadingText(): string;
     shouldShowSaveContactWidget(): boolean;
     isPremiumSubscription(): boolean;
     shouldShowPopupBranding(): boolean;

package/lib/src/brand-page-maker/components/quick-link-bar/QuickLinkBar.mixin.d.ts

@@ -292,11 +292,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         pushManageWebPageUnpublishClickEvent(): Promise<void>;
     }>;
     undoRedoEnabled: import("vue").ComputedRef<boolean>;
+    shouldShowBar: import("vue").ComputedRef<boolean>;
 }, {
     copied: boolean;
 }, {
     isPublished(): boolean;
-    shouldShowBar(): boolean;
     brandPageUrl(): string;
     copyButtonLabel(): string;
 }, {

package/lib/src/brand-page-maker/components/quick-link-bar/QuickLinkBar.mixin.js

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue';
 import { CUSTOM_DOMAIN_STATUSES } from '@brand-page-maker/constants';
 import { useBrandPageContainerStore, useEventManagerStore, } from '@brand-page-maker/stores';
 import { useUndoRedoFlag } from '@brand-page-maker/composables/useUndoRedoFlag';
+import { useQuickLinkBarVisibility } from '@brand-page-maker/composables/useQuickLinkBarVisibility';
 import { quickLinkBarTr } from '@src/composables/useTranslate';
 export default defineComponent({
     props: {
@@ -19,6 +20,9 @@ export default defineComponent({
             brandPageContainerStore: useBrandPageContainerStore(),
             eventManagerStore: useEventManagerStore(),
             undoRedoEnabled: useUndoRedoFlag(),
+            // Single source of truth for whether the bar renders — shared with the
+            // layout components (Device, SideBar) that offset content clear of it.
+            shouldShowBar: useQuickLinkBarVisibility(),
         };
     },
     data() {
@@ -30,12 +34,6 @@ export default defineComponent({
         isPublished() {
             return this.brandPageContainerStore.isPublished;
         },
-        // Only render the bar when at least one inner cluster has something to
-        // show. Otherwise we'd render an empty white strip — e.g. on an
-        // unpublished page with the undo flag off.
-        shouldShowBar() {
-            return Boolean(this.undoRedoEnabled) || this.isPublished;
-        },
         brandPageUrl() {
             if (this.brandPageContainerStore.isCustomDomainEnabled &&
                 this.brandPageContainerStore.customDomain &&

package/lib/src/brand-page-maker/composables/useQuickLinkBarVisibility.d.ts

@@ -0,0 +1,17 @@
+import { type ComputedRef } from 'vue';
+/**
+ * Whether the QuickLinkBar is rendered in the maker.
+ *
+ * The bar shows when at least one of its inner clusters has something to
+ * display: the undo/redo controls (flag on, non-admin — see
+ * {@link useUndoRedoFlag}) OR the published-URL cluster (page published).
+ *
+ * This is the single source of truth shared by the bar itself
+ * (`QuickLinkBar`) and the layout components that offset their content to sit
+ * clear of the fixed bar on mobile (`Device`, `SideBar`). Keeping the offset
+ * bound to the same predicate the bar renders on prevents the two from
+ * drifting — a drift where the bar showed for the undo/redo reason but the
+ * offset only accounted for the published reason caused the bar to overlap
+ * the mobile preview.
+ */
+export declare function useQuickLinkBarVisibility(): ComputedRef<boolean>;

package/lib/src/brand-page-maker/composables/useQuickLinkBarVisibility.js

@@ -0,0 +1,23 @@
+import { computed } from 'vue';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
+import { useUndoRedoFlag } from './useUndoRedoFlag';
+/**
+ * Whether the QuickLinkBar is rendered in the maker.
+ *
+ * The bar shows when at least one of its inner clusters has something to
+ * display: the undo/redo controls (flag on, non-admin — see
+ * {@link useUndoRedoFlag}) OR the published-URL cluster (page published).
+ *
+ * This is the single source of truth shared by the bar itself
+ * (`QuickLinkBar`) and the layout components that offset their content to sit
+ * clear of the fixed bar on mobile (`Device`, `SideBar`). Keeping the offset
+ * bound to the same predicate the bar renders on prevents the two from
+ * drifting — a drift where the bar showed for the undo/redo reason but the
+ * offset only accounted for the published reason caused the bar to overlap
+ * the mobile preview.
+ */
+export function useQuickLinkBarVisibility() {
+    const containerStore = useBrandPageContainerStore();
+    const undoRedoEnabled = useUndoRedoFlag();
+    return computed(() => undoRedoEnabled.value || containerStore.isPublished);
+}