@designcrowd/library.brand-page 5.18.3-actionable-buttons-2 → 5.18.3-ast-subnav-2

package/lib/src/{CreatedOnBrandCrowd-de-de-HPO35Atc.js → CreatedOnBrandCrowd-de-de-B84M_Lpj.js}

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

package/lib/src/{CreatedOnBrandCrowd-en-us-Cl4aaalq.js → CreatedOnBrandCrowd-en-us-2tw4Ggs-.js}

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

package/lib/src/{CreatedOnBrandCrowd-es-es-B_2laZxX.js → CreatedOnBrandCrowd-es-es-BPzo-3sX.js}

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

package/lib/src/{CreatedOnBrandCrowd-fr-fr-BTauzkB5.js → CreatedOnBrandCrowd-fr-ca-B1e5tc2p.js}

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

package/lib/src/{CreatedOnBrandCrowd-fr-ca-BTauzkB5.js → CreatedOnBrandCrowd-fr-fr-B1e5tc2p.js}

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

package/lib/src/{CreatedOnBrandCrowd-pt-pt-B0V4UZv3.js → CreatedOnBrandCrowd-pt-br-B4qlZq68.js}

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

package/lib/src/{CreatedOnBrandCrowd-pt-br-B0V4UZv3.js → CreatedOnBrandCrowd-pt-pt-B4qlZq68.js}

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

package/lib/src/{CreatedOnDcom-de-de-DvX7MlWL.js → CreatedOnDcom-de-de-EXRLWJ0w.js}

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

package/lib/src/{CreatedOnDcom-en-us-BnXBQ4jL.js → CreatedOnDcom-en-us-CEyz1cLr.js}

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

package/lib/src/{CreatedOnDcom-es-es-lKzARICU.js → CreatedOnDcom-es-es-BABu1jVr.js}

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

package/lib/src/{CreatedOnDcom-fr-ca-BXBuLMp3.js → CreatedOnDcom-fr-ca-Duj4QQWa.js}

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

package/lib/src/{CreatedOnDcom-fr-fr-wUZo-ppX.js → CreatedOnDcom-fr-fr-bI4SLcPm.js}

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

package/lib/src/{CreatedOnDcom-pt-br-Dcpf3PTV.js → CreatedOnDcom-pt-br-Cdi0wukS.js}

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

package/lib/src/{CreatedOnDcom-pt-pt-BUN3ynDi.js → CreatedOnDcom-pt-pt-CyOP-8m-.js}

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

package/lib/src/brand-page/models/navigation-styles.model.d.ts

@@ -8,6 +8,13 @@ export declare class NavigationMenuStyles {
     subNavBackgroundColor?: string;
     constructor(options: Partial<NavigationMenuStyles>, defaultOptions: Partial<NavigationMenuStyles>);
 }
+export declare const getDefaultSubNavBackgroundColor: (defaultTextColor: string | undefined) => string | undefined;
+/**
+ * The hamburger sub nav background colour is auto color-matched only when the
+ * user has not deliberately set it - i.e. it has no value or is transparent.
+ * Any explicit colour (a hex) or an already color-matched key is preserved.
+ */
+export declare const isUnsetOrTransparentColor: (color: string | undefined | null) => boolean;
 type NavigationStylesOptionType = Partial<Omit<NavigationDesktop | NavigationMobile, 'hamburgerMenuStyle'>> & {
     hamburgerMenuStyle?: Partial<NavigationMenuStyles>;
 };

package/lib/src/brand-page/models/navigation-styles.model.js

@@ -1,4 +1,4 @@
-import { DEFAULT_FONT_FAMILY_KEY, DEFAULT_FONT_STYLE, DEFAULT_TEXT_ALIGN, DEFAULT_TEXT_DECORATION, FONT_FAMILY_CONFIGS, FONT_SIZE_BODY, FONT_WEIGHT_NORMAL, defaultHamburgerNavigation, NAVIGATION_DISPLAY, } from '../constants';
+import { DEFAULT_FONT_FAMILY_KEY, DEFAULT_FONT_STYLE, DEFAULT_TEXT_ALIGN, DEFAULT_TEXT_DECORATION, FONT_FAMILY_CONFIGS, FONT_SIZE_BODY, FONT_WEIGHT_NORMAL, STYLE_THEME_KEYS, defaultHamburgerNavigation, NAVIGATION_DISPLAY, } from '../constants';
 import { VIEWPORTS } from './index';
 import { TEXT_STYLE_TYPES } from './index';
 import cloneDeep from 'lodash.clonedeep';
@@ -15,6 +15,29 @@ export class NavigationMenuStyles {
             options.subNavBackgroundColor ?? defaultOptions.subNavBackgroundColor;
     }
 }
+export const getDefaultSubNavBackgroundColor = (defaultTextColor) => {
+    if (defaultTextColor === STYLE_THEME_KEYS.LogoTextColor ||
+        defaultTextColor === STYLE_THEME_KEYS.LogoTextMultiColor) {
+        return STYLE_THEME_KEYS.LogoBackgroundColor;
+    }
+    if (defaultTextColor === STYLE_THEME_KEYS.LogoBackgroundColor ||
+        defaultTextColor === STYLE_THEME_KEYS.LogoBackgroundMultiColor) {
+        return STYLE_THEME_KEYS.LogoTextColor;
+    }
+    return undefined;
+};
+/**
+ * The hamburger sub nav background colour is auto color-matched only when the
+ * user has not deliberately set it - i.e. it has no value or is transparent.
+ * Any explicit colour (a hex) or an already color-matched key is preserved.
+ */
+export const isUnsetOrTransparentColor = (color) => {
+    if (color == null) {
+        return true;
+    }
+    const normalised = color.trim().toLowerCase();
+    return normalised === '' || normalised === 'transparent';
+};
 class NavigationStyles {
     displayType;
     renderAfterLogo;
@@ -79,7 +102,7 @@ class NavigationStyles {
                 color: theme?.secondaryColor,
                 backgroundColor: theme?.primaryColor,
             },
-            subNavBackgroundColor: theme?.secondaryColor,
+            // No sub nav default: a hex here defeats migration-16's colour match.
         });
     }
 }

package/lib/src/brand-page/utils/migration/migration-16.d.ts

@@ -0,0 +1,2 @@
+import type { MigrationData } from '../migration.util';
+export declare const migration16: (migrationResult: MigrationData) => Promise<MigrationData>;

package/lib/src/brand-page/utils/migration/migration-16.js

@@ -0,0 +1,58 @@
+import { STYLE_THEME_KEYS, NAVIGATION_DISPLAY } from '../../constants';
+import { getDefaultSubNavBackgroundColor, isUnsetOrTransparentColor, } from '../../models';
+/**
+ * Migration 16: Default the sub nav background color to "color match on" for
+ * existing sites using the TAB_2 ("nav 2") or any hamburger display style.
+ *
+ * Before the sub nav background colour feature shipped, these styles defaulted
+ * to an explicit colour (e.g. the theme secondary colour for hamburger). This
+ * migration brings existing sites in line with the new default by setting the
+ * sub nav background colour to a logo theme key (color matched), unless the
+ * value is already color matched - in which case the user's choice is kept.
+ */
+const isColorMatched = (color) => !!color && Object.values(STYLE_THEME_KEYS).includes(color);
+// Matches NavigationStyleSettings.getMenuStyles: hamburger styles live on the
+// hamburgerMenuStyle (looser `.includes` to catch any hamburger variant),
+// TAB_2 uses the top-level styles.
+const isHamburger = (displayType) => displayType.includes('hamburger');
+const isColorMatchTargetDisplayType = (displayType) => isHamburger(displayType) || displayType === NAVIGATION_DISPLAY.TAB_2;
+const applyDefaultSubNavColorMatch = (navigation) => {
+    if (!navigation?.displayType) {
+        return;
+    }
+    if (!isColorMatchTargetDisplayType(navigation.displayType)) {
+        return;
+    }
+    let menuStyles;
+    if (isHamburger(navigation.displayType)) {
+        navigation.hamburgerMenuStyle =
+            navigation.hamburgerMenuStyle ?? {};
+        menuStyles = navigation.hamburgerMenuStyle;
+        // Hamburger: only auto-match when the sub nav has no value or is transparent.
+        // Preserve ANY explicit colour (a deliberate hex or an already color matched
+        // key) so we never overwrite a choice an admin/template made.
+        if (!isUnsetOrTransparentColor(menuStyles.subNavBackgroundColor)) {
+            return;
+        }
+    }
+    else {
+        menuStyles = navigation;
+        // TAB_2 (unchanged): respect an existing color matched value.
+        if (isColorMatched(menuStyles.subNavBackgroundColor)) {
+            return;
+        }
+    }
+    // Only color match the sub nav when the default text color is itself color
+    // matched - in which case it takes the opposite logo color (e.g. logo text
+    // color -> logo background color). Otherwise leave the sub nav as-is.
+    const colorMatchedSubNav = getDefaultSubNavBackgroundColor(menuStyles.defaultButtonStyle?.color);
+    if (colorMatchedSubNav) {
+        menuStyles.subNavBackgroundColor = colorMatchedSubNav;
+    }
+};
+export const migration16 = async (migrationResult) => {
+    const { brandPageModel } = migrationResult;
+    applyDefaultSubNavColorMatch(brandPageModel.pageHeaderDesktop?.navigation);
+    applyDefaultSubNavColorMatch(brandPageModel.pageHeaderMobile?.navigation);
+    return migrationResult;
+};

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

@@ -18,6 +18,7 @@ import { migration12_1 } from './migration/migration-12_1';
 import { migration13 } from './migration/migration-13';
 import { migration14 } from './migration/migration-14';
 import { migration15 } from './migration/migration-15';
+import { migration16 } from './migration/migration-16';
 const MIGRATION_TABLE = [
     {
         version: 1,
@@ -115,6 +116,12 @@ const MIGRATION_TABLE = [
         migrateFn: migration15,
         description: 'Adding default mediaOverlayStyle to background styles',
     },
+    {
+        version: 16,
+        migrateFn: migration16,
+        runAlways: true,
+        description: 'Default sub nav background color to color match on for TAB_2 and hamburger navs depending on font color',
+    },
 ];
 export const GetLatestModelVersion = () => Math.max(...MIGRATION_TABLE.map((x) => x.version));
 export const migrateBrandPageModel = async (brandPageModel, options) => {

package/lib/src/brand-page-maker/composables/ai-chat/types.d.ts

@@ -1,7 +1,5 @@
 import type { ComputedRef, Ref } from 'vue';
 import { type PlanItem } from '../../../clients/websocket-gateway-client';
-import type { AgentAction } from './ui-actions';
-export type { AgentAction };
 export interface BaseThreadMessage {
     id: string;
     role: 'user' | 'agent';
@@ -16,7 +14,6 @@ export interface TextThreadMessage extends BaseThreadMessage {
     initialMessage?: string;
     planItems?: PlanItem[];
     completedItemIds?: string[];
-    actions?: AgentAction[];
 }
 export interface ImageThreadMessage extends BaseThreadMessage {
     type: 'image';