@designcrowd/library.brand-page 6.2.3-ast-faq → 6.2.3

package/lib/src/shared/content-settings/store/content-settings-store.js

@@ -55,15 +55,8 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
         selectedItemIndex: null,
         selectedItemValue: null,
         activeCategoryTab: 'all',
-        activeItemIdByContentId: {},
     }),
     actions: {
-        setActiveItem(contentId, itemId) {
-            this.activeItemIdByContentId = {
-                ...this.activeItemIdByContentId,
-                [contentId]: itemId,
-            };
-        },
         onContentChanged() {
             const uiStore = useUiStore();
             uiStore.onContentChanged();
@@ -323,27 +316,12 @@ export const useUiContentSettingsStore = defineStore('uiContentSettings', {
             this.onContentChanged();
         },
         updateTextItemTextStyleTypeWithStyles({ id, name, value, index, isHydrationWrite, }) {
-            this.updateListItemTextStyles({
-                id,
-                name,
-                value,
-                isHydrationWrite,
-                target: {
-                    itemsField: 'textItems',
-                    index: index,
-                    styleField: 'textStyle',
-                },
-            });
-        },
-        /** Merge into the style of one list item, e.g. `items[2].questionStyle`. */
-        updateListItemTextStyles({ id, name, value, target, isHydrationWrite, }) {
             const item = this.items.find((i) => i.id === id);
-            const listItem = item?.settings.content[target.itemsField]?.[target.index];
-            if (!item || !listItem) {
+            if (!item) {
                 return;
             }
             armHistoryMergeForHydrationWrite(isHydrationWrite);
-            listItem[target.styleField] = vueDeepMerge(listItem[target.styleField], value);
+            item.settings.content.textItems[index].textStyle = vueDeepMerge(item.settings.content.textItems[index].textStyle, value);
             this.validateItem({ id, name });
             this.onContentChanged();
         },

package/lib/src/shared/page-settings/components/page-settings/PageSettings.mixin.d.ts

@@ -4296,7 +4296,6 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => Content | undefined;
         getFieldSettings(state: {
             addContentOptions: {
@@ -4348,7 +4347,6 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, fieldName: string) => import("../../../content-settings/models").ContentItemFieldSettings | undefined;
         getItem(state: {
             addContentOptions: {
@@ -4400,7 +4398,6 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => ContentItem<any> | undefined;
         getValue(state: {
             addContentOptions: {
@@ -4452,7 +4449,6 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, fieldName: string) => Content | string | undefined;
         getItemState(state: {
             addContentOptions: {
@@ -4504,7 +4500,6 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => import("../../../content-settings/models").ContentSettingsItemState;
         getItemGroupState(state: {
             addContentOptions: {
@@ -4556,13 +4551,11 @@ declare const _default: import("vue").DefineComponent<{}, {
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, groupId: string) => import("../../../content-settings/models").ContentSettingsItemGroupState;
         mode(): import("../../../content-settings/store").ContentSettingsMode;
         selectedItem(): ContentItem<any> | undefined;
         selectedItemTemplate(): import("../../../../brand-page-maker/models").ContentSettingsConfig<any> | undefined;
     }, {
-        setActiveItem(contentId: string, itemId: string | undefined): void;
         onContentChanged(): void;
         _addItem({ item, index, }: {
             item: ContentItem<any>;
@@ -4626,9 +4619,6 @@ declare const _default: import("vue").DefineComponent<{}, {
         }): void;
         updateTextItemTextStyleType({ id, name, value, index, isHydrationWrite, }: import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>): void;
         updateTextItemTextStyleTypeWithStyles({ id, name, value, index, isHydrationWrite, }: import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>): void;
-        updateListItemTextStyles({ id, name, value, target, isHydrationWrite, }: Omit<import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>, "index"> & {
-            target: import("../../../content-settings/models").RteItemStyleTarget;
-        }): void;
         _setActiveCategoryTab({ activeCategoryTab, }: {
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
         }): void;

package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.d.ts

@@ -3661,7 +3661,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => import("@brand-page").Content | undefined;
         getFieldSettings(state: {
             addContentOptions: {
@@ -3713,7 +3712,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, fieldName: string) => ContentItemFieldSettings | undefined;
         getItem(state: {
             addContentOptions: {
@@ -3765,7 +3763,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => import("../../../content-settings/models").ContentItem<any> | undefined;
         getValue(state: {
             addContentOptions: {
@@ -3817,7 +3814,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, fieldName: string) => import("@brand-page").Content | string | undefined;
         getItemState(state: {
             addContentOptions: {
@@ -3869,7 +3865,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string) => import("../../../content-settings/models").ContentSettingsItemState;
         getItemGroupState(state: {
             addContentOptions: {
@@ -3921,13 +3916,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             selectedItemValue: string | null;
             selectedItemIndex: number | null;
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
-            activeItemIdByContentId: Record<string, string | undefined>;
         } & import("pinia").PiniaCustomStateProperties<import("../../../content-settings/store").ContentSettingsState>): (id: string, groupId: string) => import("../../../content-settings/models").ContentSettingsItemGroupState;
         mode(): import("../../../content-settings/store").ContentSettingsMode;
         selectedItem(): import("../../../content-settings/models").ContentItem<any> | undefined;
         selectedItemTemplate(): import("../../../../brand-page-maker/models").ContentSettingsConfig<any> | undefined;
     }, {
-        setActiveItem(contentId: string, itemId: string | undefined): void;
         onContentChanged(): void;
         _addItem({ item, index, }: {
             item: import("../../../content-settings/models").ContentItem<any>;
@@ -3991,9 +3984,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }): void;
         updateTextItemTextStyleType({ id, name, value, index, isHydrationWrite, }: import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>): void;
         updateTextItemTextStyleTypeWithStyles({ id, name, value, index, isHydrationWrite, }: import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>): void;
-        updateListItemTextStyles({ id, name, value, target, isHydrationWrite, }: Omit<import("../../../content-settings/models").UpdateMultipleItemValuesPayload<any>, "index"> & {
-            target: import("../../../content-settings/models").RteItemStyleTarget;
-        }): void;
         _setActiveCategoryTab({ activeCategoryTab, }: {
             activeCategoryTab: import("../../../../brand-page-maker/models").ItemCategory;
         }): void;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@designcrowd/library.brand-page",
   "description": "A collection of Maker/Designer applications",
-  "version": "6.2.3-ast-faq",
+  "version": "6.2.3",
   "author": "Design.com Eng",
   "license": "UNLICENSED",
   "type": "module",
@@ -71,7 +71,7 @@
   },
   "dependencies": {
     "@ckpack/vue-color": "1.6.0",
-    "@designcrowd/fe-shared-lib": "2.1.2-ast-faq",
+    "@designcrowd/fe-shared-lib": "2.1.2",
     "@pinia/nuxt": "0.11.3",
     "@storybook/react": "9.0.4",
     "@tiptap/extension-bubble-menu": "3.28.0",

package/src/brand-page/components/page/PageComponent.vue

@@ -35,7 +35,6 @@ import ShapesSection from '../shapes-section/ShapesSection.vue';
 import PageComponentMixin from './PageComponent.mixin.ts';
 import Shop from '../shop/Shop.vue';
 import BookingSection from '../booking-section/BookingSection.vue';
-import FaqSection from '../faq-section/FaqSection.vue';
 
 export default {
   components: {
@@ -61,7 +60,6 @@ export default {
     'bp-shapes-section': ShapesSection,
     'bp-shop-section': Shop,
     'bp-booking-section': BookingSection,
-    'bp-faq-section': FaqSection,
   },
   mixins: [PageComponentMixin],
 };

package/src/brand-page/constants/misc.constants.ts

@@ -126,18 +126,6 @@ export const IMAGE_RESOLUTION_PRESETS = {
 export type ImagesSectionContentDisplayStyle =
   (typeof IMAGES_SECTION_CONTENT_DISPLAY_STYLES)[number];
 
-/** Centered and split are accordions; grid shows every answer. */
-export const FAQ_DISPLAY_STYLES = Object.freeze({
-  centered: 'faq-centered',
-  split: 'faq-split',
-  grid: 'faq-grid',
-} as const);
-
-export type FaqDisplayStyle =
-  (typeof FAQ_DISPLAY_STYLES)[keyof typeof FAQ_DISPLAY_STYLES];
-
-export const FAQ_MAX_ITEMS = 6;
-
 export const HEADER_CSRF_TOKEN = 'csrf-token';
 
 export const STYLE_THEME_KEYS = Object.freeze({

package/src/brand-page/constants/styles.constants.ts

@@ -40,8 +40,6 @@ export const CONTENT_TEXT_STYLE_PROPERTY_KEYS = {
   buttonTextStyle: 'buttonTextStyle',
   copyrightStyle: 'copyrightStyle',
   successMessageStyle: 'successMessageStyle',
-  questionStyle: 'questionStyle',
-  answerStyle: 'answerStyle',
 } as const;
 
 export type ContentTextStylePropertyKey =

package/src/brand-page/models/content.model.ts

@@ -31,7 +31,6 @@ export const CONTENT_TYPES = {
   'shapes-section': 'shapes-section',
   'shop-section': 'shop-section',
   'booking-section': 'booking-section',
-  'faq-section': 'faq-section',
 } as const;
 
 export type ContentType = keyof typeof CONTENT_TYPES;

package/src/brand-page/models/index.ts

@@ -672,27 +672,6 @@ export interface BookingSectionContent extends Content {
   buttonTextStyle: TextStyleDeclaration;
 }
 
-export interface FaqItem {
-  /** Stable per-item identifier. See ImageItem.id. */
-  id: string;
-  question: RichTextValue;
-  /** Drives `question`, per item — like a section's `titleStyle` drives its title. */
-  questionStyle: TextStyleDeclaration;
-  answer: RichTextValue;
-  answerStyle: TextStyleDeclaration;
-}
-
-export interface FaqSectionContent extends Content {
-  type: 'faq-section';
-  title: RichTextValue;
-  description: RichTextValue;
-  displayStyle: string;
-  items: FaqItem[];
-  titleStyle: TextStyleDeclaration;
-  descriptionStyle: TextStyleDeclaration;
-  backgroundStyle: BrandPageCssStyle;
-}
-
 export class PageModel {
   title: string;
   contents: Content[];

package/src/brand-page/utils/content-callback-util.ts

@@ -17,7 +17,6 @@ import type {
   ButtonContent,
   PageModel,
   BookingSectionContent,
-  FaqSectionContent,
 } from '../models';
 
 export type ContentCallback = {
@@ -40,7 +39,6 @@ export type ContentCallback = {
   shopSectionContentCallback: (content: ShopContent) => void;
   buttonContentCallback: (content: ButtonContent) => void;
   bookingSectionContentCallback: (content: BookingSectionContent) => void;
-  faqSectionContentCallback: (content: FaqSectionContent) => void;
 };
 
 export const forEachPageCallContentCallback = (
@@ -103,9 +101,6 @@ export const forEachPageCallContentCallback = (
           content as BookingSectionContent,
         );
         break;
-      case 'faq-section':
-        callbacks.faqSectionContentCallback(content as FaqSectionContent);
-        break;
       case 'general-link':
       case 'website':
       case 'email':

package/src/brand-page/utils/model.util.ts

@@ -21,7 +21,6 @@ import {
   type ImageContent,
   type ImageGalleryContent,
   type BookingSectionContent,
-  type FaqSectionContent,
 } from '../models';
 
 export const isLogoContent = (content?: Content): content is LogoContent => {
@@ -98,12 +97,6 @@ export const isBookingContent = (
   return content?.type === 'booking-section';
 };
 
-export const isFaqContent = (
-  content?: Content,
-): content is FaqSectionContent => {
-  return content?.type === 'faq-section';
-};
-
 export const isAboutContent = (
   content?: Content,
 ): content is AboutSectionContent => {

package/src/brand-page/utils/view-model.util.test.ts

@@ -1121,102 +1121,6 @@ describe('container-aware text colour defaults (view-model layer)', () => {
   });
 });
 
-describe('faq-section view model', () => {
-  const faqContent = (overrides: Record<string, unknown> = {}): any => ({
-    id: 'faq-1',
-    type: 'faq-section',
-    title: 'FAQ',
-    description: '',
-    displayStyle: 'faq-split',
-    items: [
-      {
-        id: 'q1',
-        question: 'Q1',
-        questionStyle: { textStyleType: 'headings' },
-        answer: 'A1',
-        answerStyle: { textStyleType: 'paragraphs' },
-      },
-      {
-        id: 'q2',
-        question: 'Q2',
-        questionStyle: { fontSize: '1.5rem' }, // detached
-        answer: 'A2',
-        answerStyle: { textStyleType: 'paragraphs' },
-      },
-    ],
-    titleStyle: { textStyleType: 'titles' },
-    descriptionStyle: { textStyleType: 'paragraphs' },
-    backgroundStyle: {},
-    topPadding: 32,
-    bottomPadding: 32,
-    ...overrides,
-  });
-
-  test.each([
-    [BRAND_PAGE_TYPES.default, true],
-    [BRAND_PAGE_TYPES.brandContact, true],
-    [BRAND_PAGE_TYPES.brandSite, false],
-  ])('%s → isStacked %s', (brandPageType, isStacked) => {
-    const viewModel: any = mapToViewModel(
-      new PageStyles(),
-      brandPageType,
-      {},
-    )(faqContent());
-
-    expect(viewModel.type).toBe('faq-section');
-    expect(viewModel.isStacked).toBe(isStacked);
-    expect(viewModel.items).toHaveLength(2);
-  });
-
-  test('carries the maker panel’s open item only for its own content', () => {
-    const map = (contentId: string): any =>
-      mapToViewModel(new PageStyles(), BRAND_PAGE_TYPES.brandSite, {
-        activeItemIdByContentId: { [contentId]: 'q2' },
-      })(faqContent());
-
-    expect(map('faq-1').activeItemId).toBe('q2');
-    expect(map('another-section').activeItemId).toBeUndefined();
-  });
-
-  test("each item's question and answer follow their global text roles until detached", () => {
-    const pageStyles = new PageStyles();
-    const { headings, paragraphs } = pageStyles.textStyles.textStyleOptions;
-
-    headings.style.fontSize = '1.875rem';
-    headings.style.color = '#00ff00';
-    headings.isModified = true;
-    paragraphs.style.color = '#0000ff';
-
-    const content = faqContent();
-    const viewModel: any = mapToViewModel(
-      pageStyles,
-      BRAND_PAGE_TYPES.brandSite,
-      {},
-    )(content);
-    const [linked, detached] = viewModel.items;
-
-    expect(linked.questionStyle.fontSize).toBe('1.875rem');
-    expect(linked.questionStyle.color).toBe('#00ff00');
-    expect(linked.answerStyle.color).toBe('#0000ff');
-    expect(detached.questionStyle.fontSize).toBe('1.5rem');
-    expect(detached.answerStyle.color).toBe('#0000ff');
-    // Resolution copies; the stored item keeps only its link.
-    expect(content.items[0].questionStyle).toEqual({
-      textStyleType: 'headings',
-    });
-  });
-
-  test('content without items maps without throwing', () => {
-    const viewModel: any = mapToViewModel(
-      new PageStyles(),
-      BRAND_PAGE_TYPES.brandSite,
-      {},
-    )(faqContent({ items: undefined }));
-
-    expect(viewModel.items).toEqual([]);
-  });
-});
-
 describe('mapToPageHeaderViewModel header button', () => {
   const headerButton: HeaderButton = {
     isVisible: true,

package/src/brand-page/utils/view-model.util.ts

@@ -36,7 +36,6 @@ import type {
   LogoTemplateImageModel,
   ShopContent,
   BookingSectionContent,
-  FaqSectionContent,
   TextShapeItem,
   GettyVideoMedia,
   AbstractMedia,
@@ -57,7 +56,6 @@ import {
   BUTTON_LINK_TYPE,
   NavigationMenuStyles,
   type TextItem,
-  type FaqItem,
 } from '../models';
 import type {
   ImageViewModel,
@@ -86,7 +84,6 @@ import type {
   ShapesSectionViewModel,
   ShopViewModel,
   BookingSectionViewModel,
-  FaqSectionViewModel,
   GettyVideoViewModel,
   PageStylesViewModel,
   BackgroundStylesViewModel,
@@ -1041,42 +1038,6 @@ const mapToTestimonialSectionViewModel = (
   );
 };
 
-// An item's question/answer styles are CONTENT_TEXT_STYLE_PROPERTY_KEYS, so the section
-// resolver handles them when handed the item.
-const mapFaqItem = (item: FaqItem, styles: PageStyles): FaqItem =>
-  applyViewModelTextStyles(
-    {
-      ...item,
-      questionStyle: { ...item.questionStyle },
-      answerStyle: { ...item.answerStyle },
-    } as unknown as ContentViewModel,
-    styles,
-  ) as unknown as FaqItem;
-
-const mapToFaqSectionViewModel = (
-  content: FaqSectionContent,
-  styles: PageStyles,
-  brandPageType: BrandPageType,
-  options: ViewModelMappingOptions,
-): FaqSectionViewModel => {
-  return applyViewModelTextStyles(
-    {
-      ...content,
-      role: content.type,
-      type: 'faq-section',
-      // No `color` pre-seed — these styles are CONTENT_TEXT_STYLE_PROPERTY_KEYS
-      // (see the testimonial mapper), resolved per item for the item styles.
-      titleStyle: { ...content.titleStyle },
-      descriptionStyle: { ...content.descriptionStyle },
-      items: (content.items ?? []).map((item) => mapFaqItem(item, styles)),
-      isFullWidth: true,
-      isStacked: brandPageType !== BRAND_PAGE_TYPES.brandSite,
-      activeItemId: options.activeItemIdByContentId?.[content.id],
-    },
-    styles,
-  );
-};
-
 const mapToSocialLinksViewModel = (
   content: SocialLinksContent,
   styles: PageStyles,
@@ -1550,14 +1511,6 @@ export const mapToViewModel =
           styles,
         );
 
-      case 'faq-section':
-        return mapToFaqSectionViewModel(
-          content as FaqSectionContent,
-          styles,
-          brandPageType,
-          options,
-        );
-
       case 'about-section':
         return mapToAboutSectionViewModel(
           content as AboutSectionContent,
@@ -1633,8 +1586,6 @@ interface ViewModelMappingOptions {
     previewImageUrl: string,
     assetId: string,
   ) => void;
-  /** Maker-only UI state: content id → the item its settings panel has open. Never persisted. */
-  activeItemIdByContentId?: Record<string, string | undefined>;
 }
 
 const mapBackgroundStylesToViewModel = (

package/src/brand-page/view-models.ts

@@ -35,7 +35,6 @@ import type {
   LogoTemplateImageModel,
   CookieOptions,
   BookingSectionContent,
-  FaqSectionContent,
   MediaTypes,
   TextStyles,
   BackgroundStyle,
@@ -68,8 +67,7 @@ export type ViewModelType =
   | 'social-links'
   | 'shapes-section'
   | 'shop-section'
-  | 'booking-section'
-  | 'faq-section';
+  | 'booking-section';
 
 export interface ContentViewModel {
   id: string;
@@ -251,15 +249,6 @@ export interface BookingSectionViewModel
   isFullWidth: boolean;
 }
 
-export interface FaqSectionViewModel
-  extends ContentViewModel, Omit<FaqSectionContent, 'type'> {
-  isFullWidth: boolean;
-  /** brand.page / brand.contact: split and grid always use their stacked layout. */
-  isStacked: boolean;
-  /** Maker-only: the item the settings panel has open, so the canvas shows it. */
-  activeItemId?: string;
-}
-
 export interface PageHeaderViewModel extends Omit<
   PageHeaderDesktop | PageHeaderMobile,
   | 'logoImage'