@edifice.io/react 2.6.6-develop-b2school.20260925172645 → 2.6.6-develop-b2school.20260928135750

package/dist/components/Layout/Layout.js

@@ -14,16 +14,22 @@ import useZendeskGuide from "../../hooks/useZendeskGuide/useZendeskGuide.js";
 import useCantoo from "../../hooks/useCantoo/useCantoo.js";
 import Alert from "../Alert/Alert.js";
 import ButtonBeta from "../ButtonBeta/ButtonBeta.js";
-const HeaderV2 = /* @__PURE__ */ lazy(() => import("../../modules/homepage/components/Header/Header.js")), Layout = ({
+import HelpZone from "../../modules/HelpZone/HelpZone.js";
+const HeaderV2 = /* @__PURE__ */ lazy(() => import("../../modules/homepage/components/Header/Header.js"));
+function getHeaderColor() {
+  return getComputedStyle(document.documentElement).getPropertyValue("--primitive-blue-400").trim();
+}
+const Layout = ({
   children,
   headless = !1,
   whiteBg = !0,
   className,
   ...restProps
 }) => {
+  var _a;
   const {
     theme
-  } = useEdificeTheme(), override = useUiOverride("layout.header"), isHeaderV2 = (override == null ? void 0 : override.variant) === "v2", {
+  } = useEdificeTheme(), override = useUiOverride("layout.header"), isHeaderV2 = (override == null ? void 0 : override.variant) === "v2", isEdificeInProductHelp = ((_a = useUiOverride("layout.helpzone")) == null ? void 0 : _a.variant) === "edifice-in-product", {
     productOverride,
     background,
     isBackgroundImageOverridden
@@ -35,8 +41,13 @@ const HeaderV2 = /* @__PURE__ */ lazy(() => import("../../modules/homepage/compo
     showCookiesConsent,
     handleConsultCookies,
     handleCloseCookiesConsent
-  } = useCookiesConsent();
-  useZendeskGuide(), useCantoo();
+  } = useCookiesConsent(), {
+    isReady: isHelpZoneReady,
+    isOpen: isHelpZoneOpen,
+    open: openHelpZone,
+    close: closeHelpZone
+  } = useZendeskGuide(isEdificeInProductHelp ? getHeaderColor() : void 0);
+  useCantoo();
   const classes = clsx("d-flex flex-column", {
     "bg-white": whiteBg,
     "container-fluid": !headless,
@@ -50,7 +61,8 @@ const HeaderV2 = /* @__PURE__ */ lazy(() => import("../../modules/homepage/compo
     renderNotificationsOverlay,
     /* @__PURE__ */ jsx("main", { className: classes, ...restProps, children }),
     renderToaster,
-    renderCookies
+    renderCookies,
+    isEdificeInProductHelp && /* @__PURE__ */ jsx(HelpZone, { isReady: isHelpZoneReady, isOpen: isHelpZoneOpen, onOpen: openHelpZone, onClose: closeHelpZone })
   ] });
 };
 export {

package/dist/hooks/useZendeskGuide/useZendeskGuide.d.ts

@@ -9,6 +9,8 @@ export interface UseZendeskGuideAPI {
 /**
  * Add Zendesk Guide
  *
- * @param headerColor Overrides the widget panel's theme color.
+ * @param headerColor Overrides the widget panel's theme color. Can change
+ * across renders (e.g. once resolved from async platform config) — the
+ * widget is updated in place, no need to keep it stable.
  */
 export default function useZendeskGuide(headerColor?: string): UseZendeskGuideAPI;

package/dist/hooks/useZendeskGuide/useZendeskGuide.js

@@ -116,7 +116,15 @@ function useZendeskGuide(headerColor) {
         };
       }
     })();
-  }, [hasSupportWorkflow]), {
+  }, [hasSupportWorkflow]), useEffect(() => {
+    !isReady || headerColor === void 0 || window.zE("webWidget", "updateSettings", {
+      webWidget: {
+        color: {
+          theme: headerColor
+        }
+      }
+    });
+  }, [headerColor, isReady]), {
     isReady,
     isOpen,
     open,

package/dist/modules/homepage/components/Notifications/components/NotificationFilterModal.js

@@ -1,12 +1,11 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import clsx from "clsx";
-import { useState } from "react";
+import { useState, useRef, useMemo, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import SvgIconCheck from "../../../../icons/components/IconCheck.js";
 import { getAppCodeAndI18nKey } from "./notificationAdapter.js";
 import Modal from "../../../../../components/Modal/Modal.js";
 import Flex from "../../../../../components/Flex/Flex.js";
-import Checkbox from "../../../../../components/Checkbox/Checkbox.js";
 import AppIcon from "../../../../../components/AppIcon/AppIcon.js";
 import ButtonBeta from "../../../../../components/ButtonBeta/ButtonBeta.js";
 const NotificationFilterModal = ({
@@ -17,48 +16,59 @@ const NotificationFilterModal = ({
   onApply
 }) => {
   const {
-    t
-  } = useTranslation(), [selected, setSelected] = useState(appliedTypes), toggleType = (type) => {
+    t,
+    i18n
+  } = useTranslation(), [selected, setSelected] = useState(appliedTypes), refSelectAllCheckbox = useRef(null), allTypesSorted = useMemo(() => allTypes.map((type) => {
+    const [appCode, appI18nKey] = getAppCodeAndI18nKey(type), label = t(appI18nKey, {
+      defaultValue: appCode
+    });
+    return {
+      type,
+      appCode,
+      appI18nKey,
+      label
+    };
+  }).sort((a, b) => a.label.localeCompare(b.label, i18n.language, {
+    sensitivity: "base"
+  })), [allTypes, t, i18n.language]), toggleType = (type) => {
     setSelected((current) => current.includes(type) ? current.filter((value) => value !== type) : [...current, type]);
   }, toggleAll = () => {
     setSelected(selected.length === allTypes.length ? [] : allTypes);
   };
-  return /* @__PURE__ */ jsxs(Modal, { id: "notification-filter-modal", size: "lg", scrollable: !0, isOpen, onModalClose: onCancel, children: [
-    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: t("homepage.notifications.filter-modal.title", {
-      defaultValue: "Filtrer les notifications"
-    }) }),
-    /* @__PURE__ */ jsx(Modal.Subtitle, { children: t("homepage.notifications.filter-modal.subtitle", {
-      defaultValue: "Sélectionnez seulement les notifications importantes pour vous"
-    }) }),
+  return useEffect(() => {
+    refSelectAllCheckbox.current && (refSelectAllCheckbox.current.indeterminate = selected.length > 0 && selected.length < allTypes.length);
+  }, [selected.length, allTypes.length]), /* @__PURE__ */ jsxs(Modal, { id: "notification-filter-modal", size: "lg", scrollable: !0, isOpen, onModalClose: onCancel, children: [
+    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: t("homepage.notifications.filter-modal.title") }),
+    /* @__PURE__ */ jsx(Modal.Subtitle, { children: t("homepage.notifications.filter-modal.subtitle") }),
     /* @__PURE__ */ jsxs(Modal.Body, { children: [
-      /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "8", className: "mb-16", children: [
-        /* @__PURE__ */ jsx("div", { className: "notification-filter-select-all", children: /* @__PURE__ */ jsx(Checkbox, { label: t("homepage.notifications.filter-modal.select-all", {
-          defaultValue: "Tout sélectionner"
-        }), checked: selected.length === allTypes.length, indeterminate: selected.length > 0 && selected.length < allTypes.length, onChange: toggleAll }) }),
+      /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "8", className: "mb-24", children: [
+        /* @__PURE__ */ jsxs("label", { className: "notification-filter-select-all notification-filter-chip", children: [
+          /* @__PURE__ */ jsx("span", { children: t("homepage.notifications.filter-modal.select-all") }),
+          /* @__PURE__ */ jsx("input", { type: "checkbox", ref: refSelectAllCheckbox, checked: selected.length === allTypes.length, className: "notification-filter-checkbox", onChange: toggleAll })
+        ] }),
         /* @__PURE__ */ jsx("span", { className: "notification-filter-count", children: t("homepage.notifications.filter-modal.count", {
           selected: selected.length,
-          total: allTypes.length,
-          defaultValue: "[[selected]] / [[total]] sélectionnées"
+          total: allTypes.length
         }) })
       ] }),
-      /* @__PURE__ */ jsx(Flex, { wrap: "wrap", gap: "8", className: "notification-filter-options", children: allTypes.map((type) => {
-        const [appCode, appI18nKey] = getAppCodeAndI18nKey(type), checked = selected.includes(type);
+      /* @__PURE__ */ jsx(Flex, { wrap: "wrap", gap: "16", className: "notification-filter-options", children: allTypesSorted.map(({
+        type,
+        label,
+        appCode
+      }) => {
+        const checked = selected.includes(type);
         return /* @__PURE__ */ jsxs("label", { className: clsx("notification-filter-chip", {
           "is-checked": checked
         }), children: [
           /* @__PURE__ */ jsx(AppIcon, { app: appCode, size: "24", iconFit: "contain" }),
-          /* @__PURE__ */ jsx("span", { children: t(appI18nKey, {
-            defaultValue: appCode
-          }) }),
-          /* @__PURE__ */ jsx("input", { type: "checkbox", className: "form-check-input", checked, onChange: () => toggleType(type) })
+          /* @__PURE__ */ jsx("span", { children: label }),
+          /* @__PURE__ */ jsx("input", { type: "checkbox", className: "notification-filter-checkbox", checked, onChange: () => toggleType(type) })
         ] }, type);
       }) })
     ] }),
     /* @__PURE__ */ jsxs(Modal.Footer, { children: [
       /* @__PURE__ */ jsx(ButtonBeta, { color: "tertiary", onClick: onCancel, type: "button", variant: "ghost", children: t("cancel") }),
-      /* @__PURE__ */ jsx(ButtonBeta, { color: "default", onClick: () => onApply(selected), type: "button", variant: "filled", rightIcon: /* @__PURE__ */ jsx(SvgIconCheck, {}), children: t("homepage.notifications.filter-modal.confirm", {
-        defaultValue: "Enregistrer"
-      }) })
+      /* @__PURE__ */ jsx(ButtonBeta, { color: "default", onClick: () => onApply(selected), type: "button", variant: "filled", rightIcon: /* @__PURE__ */ jsx(SvgIconCheck, {}), children: t("homepage.notifications.filter-modal.confirm") })
     ] })
   ] });
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@edifice.io/react",
-  "version": "2.6.6-develop-b2school.20260925172645",
+  "version": "2.6.6-develop-b2school.20260928135750",
   "description": "Edifice React Library",
   "keywords": [
     "react",
@@ -140,9 +140,9 @@
     "swiper": "10.1.0",
     "ua-parser-js": "1.0.36",
     "zustand": "4.5.7",
-    "@edifice.io/bootstrap": "2.6.6-develop-b2school.20260925172645",
-    "@edifice.io/tiptap-extensions": "2.6.6-develop-b2school.20260925172645",
-    "@edifice.io/utilities": "2.6.6-develop-b2school.20260925172645"
+    "@edifice.io/tiptap-extensions": "2.6.6-develop-b2school.20260928135750",
+    "@edifice.io/utilities": "2.6.6-develop-b2school.20260928135750",
+    "@edifice.io/bootstrap": "2.6.6-develop-b2school.20260928135750"
   },
   "devDependencies": {
     "@babel/plugin-transform-react-pure-annotations": "7.27.1",
@@ -173,8 +173,8 @@
     "vite": "5.4.14",
     "vite-plugin-dts": "4.5.4",
     "vite-tsconfig-paths": "5.1.4",
-    "@edifice.io/client": "2.6.6-develop-b2school.20260925172645",
-    "@edifice.io/config": "2.6.6-develop-b2school.20260925172645"
+    "@edifice.io/client": "2.6.6-develop-b2school.20260928135750",
+    "@edifice.io/config": "2.6.6-develop-b2school.20260928135750"
   },
   "peerDependencies": {
     "@react-spring/web": "9.7.5",