@redacto.io/consent-sdk-react 11.0.0-beta.2 → 11.0.0

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default from 'react';
-import { A as AppearanceStyle, N as NoticeControlStyle, a as NoticeMobileLayout, b as NoticeDesktopPosition, c as NoticeBackdrop, d as NoticePhoneFooter, e as NoticeTextScale, f as NoticeAppearance } from './types-Bwtzvz4W.mjs';
+import { A as AppearanceStyle, N as NoticeControlStyle, a as NoticeMobileLayout, b as NoticeDesktopPosition, c as NoticeBackdrop, d as NoticePhoneFooter, e as NoticeTextScale, f as NoticeAppearance } from './types-B8qroG0j.mjs';
 import { f as NoticeFontOptions } from './types-xaCyZUfo.mjs';
 
 /**

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default from 'react';
-import { A as AppearanceStyle, N as NoticeControlStyle, a as NoticeMobileLayout, b as NoticeDesktopPosition, c as NoticeBackdrop, d as NoticePhoneFooter, e as NoticeTextScale, f as NoticeAppearance } from './types-Bwtzvz4W.js';
+import { A as AppearanceStyle, N as NoticeControlStyle, a as NoticeMobileLayout, b as NoticeDesktopPosition, c as NoticeBackdrop, d as NoticePhoneFooter, e as NoticeTextScale, f as NoticeAppearance } from './types-B8qroG0j.js';
 import { f as NoticeFontOptions } from './types-xaCyZUfo.js';
 
 /**

package/dist/index.js

@@ -6526,6 +6526,7 @@ var NoticeConsentView = ({
     setCachedAppearance(readCachedAppearance(noticeId));
   }, [noticeId]);
   const servedAppearance = content ? content.appearance : cachedAppearance;
+  const showsProductSection = (servedAppearance == null ? void 0 : servedAppearance.show_product_section) !== false;
   const noticeAppearance = useNoticeAppearance(
     servedAppearance,
     settings,
@@ -7525,6 +7526,9 @@ var NoticeConsentView = ({
     if (!products || products.length !== 1) {
       return rows;
     }
+    if (!showsProductSection) {
+      return rows;
+    }
     const product = products[0];
     const purposes = (_a2 = content == null ? void 0 : content.purposes) != null ? _a2 : [];
     const boxPurposes = productBoxPurposes(purposes);

package/dist/index.mjs

@@ -5537,6 +5537,7 @@ var NoticeConsentView = ({
     setCachedAppearance(readCachedAppearance(noticeId));
   }, [noticeId]);
   const servedAppearance = content ? content.appearance : cachedAppearance;
+  const showsProductSection = (servedAppearance == null ? void 0 : servedAppearance.show_product_section) !== false;
   const noticeAppearance = useNoticeAppearance(
     servedAppearance,
     settings,
@@ -6536,6 +6537,9 @@ var NoticeConsentView = ({
     if (!products || products.length !== 1) {
       return rows;
     }
+    if (!showsProductSection) {
+      return rows;
+    }
     const product = products[0];
     const purposes = (_a2 = content == null ? void 0 : content.purposes) != null ? _a2 : [];
     const boxPurposes = productBoxPurposes(purposes);

package/dist/privacy-center.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ReactNode } from 'react';
-import { P as PrivacyCenterTheme } from './types-Bwtzvz4W.mjs';
+import { P as PrivacyCenterTheme } from './types-B8qroG0j.mjs';
 import * as _tanstack_react_query from '@tanstack/react-query';
 
 /**
@@ -250,12 +250,15 @@ type PrivacyCenterFooterLink = Readonly<{
     label: string;
     url: string;
 }>;
+type PrivacyCenterLogoAlign = 'auto' | 'left' | 'center' | 'right';
 type PrivacyCenterBrandingSettings = Readonly<{
     inherit_identity: boolean;
     display_name: string | null;
     logo_url: string | null;
     /** 28–96 px; `null` keeps the built-in size. */
     logo_height: number | null;
+    /** `"auto"` keeps the logo on the leading edge of the top bar. */
+    logo_align: PrivacyCenterLogoAlign;
     inherit_colors: boolean;
     primary_color: string | null;
     accent_color: string | null;

package/dist/privacy-center.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { ReactNode } from 'react';
-import { P as PrivacyCenterTheme } from './types-Bwtzvz4W.js';
+import { P as PrivacyCenterTheme } from './types-B8qroG0j.js';
 import * as _tanstack_react_query from '@tanstack/react-query';
 
 /**
@@ -250,12 +250,15 @@ type PrivacyCenterFooterLink = Readonly<{
     label: string;
     url: string;
 }>;
+type PrivacyCenterLogoAlign = 'auto' | 'left' | 'center' | 'right';
 type PrivacyCenterBrandingSettings = Readonly<{
     inherit_identity: boolean;
     display_name: string | null;
     logo_url: string | null;
     /** 28–96 px; `null` keeps the built-in size. */
     logo_height: number | null;
+    /** `"auto"` keeps the logo on the leading edge of the top bar. */
+    logo_align: PrivacyCenterLogoAlign;
     inherit_colors: boolean;
     primary_color: string | null;
     accent_color: string | null;

package/dist/privacy-center.js

@@ -14859,6 +14859,7 @@ var LANGUAGE_CODES = [
 ];
 var RTL_LANGUAGES = /* @__PURE__ */ new Set(["ur", "sd", "ks"]);
 var COUNTRY_CODES = ["+91", "+971", "+65", "+44", "+1"];
+var LOGO_ALIGNMENTS = ["auto", "left", "center", "right"];
 var FONT_FAMILIES = [
   "Inter",
   "Montserrat",
@@ -14911,6 +14912,7 @@ var DEFAULT_PRIVACY_CENTER_SETTINGS = {
     display_name: null,
     logo_url: null,
     logo_height: null,
+    logo_align: "auto",
     inherit_colors: true,
     primary_color: null,
     accent_color: null,
@@ -16417,6 +16419,17 @@ function CompactLanguageMenu({ locale, options, onChange }) {
 
 // src/RedactoPrivacyCenter/components/AppShell/TopAppBar.tsx
 var import_jsx_runtime37 = require("react/jsx-runtime");
+var LOGO_GROUP_PLACEMENT = {
+  // `left`, not `insetInlineStart`: the translation is physical, so a logical
+  // offset would measure from the right under RTL and land off centre.
+  center: {
+    position: "absolute",
+    left: "50%",
+    transform: "translateX(-50%)"
+  },
+  right: { order: 1 }
+};
+var hamburgerLeadsHeader = (logoAlign) => logoAlign === "center" || logoAlign === "right";
 var TOP_BAR_LOGO_HEIGHT = 32;
 var TOP_BAR_LOGO_MAX_HEIGHT = 40;
 var TopAppBar = (0, import_react37.forwardRef)(function TopAppBar2({ onOpenMobileNav, showHamburger, locale, onLocaleChange, onBack, showNotifications = true }, hamburgerRef) {
@@ -16479,6 +16492,22 @@ var TopAppBar = (0, import_react37.forwardRef)(function TopAppBar2({ onOpenMobil
     fontFamily: "inherit",
     flexShrink: 0
   };
+  const logoAlign = brandingSettings.logo_align;
+  const hamburgerIsOwnItem = hamburgerLeadsHeader(logoAlign);
+  const logoGroupStyle = {
+    display: "flex",
+    alignItems: "center",
+    gap: 8,
+    minWidth: 0,
+    ...LOGO_GROUP_PLACEMENT[logoAlign]
+  };
+  const actionsStyle = {
+    display: "flex",
+    alignItems: "center",
+    gap: 8,
+    flexShrink: 0,
+    ...logoAlign === "right" ? { order: 0 } : null
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_jsx_runtime37.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
       "header",
@@ -16488,8 +16517,16 @@ var TopAppBar = (0, import_react37.forwardRef)(function TopAppBar2({ onOpenMobil
         style: headerStyle,
         ...partAttribute("topbar"),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8, minWidth: 0 }, children: [
-            showHamburger && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+          showHamburger && hamburgerIsOwnItem && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+            HamburgerButton,
+            {
+              ref: hamburgerRef,
+              onClick: onOpenMobileNav,
+              label: t("openSidebarMenu")
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { style: logoGroupStyle, children: [
+            showHamburger && !hamburgerIsOwnItem && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
               HamburgerButton,
               {
                 ref: hamburgerRef,
@@ -16539,48 +16576,36 @@ var TopAppBar = (0, import_react37.forwardRef)(function TopAppBar2({ onOpenMobil
               }
             )
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
-            "div",
-            {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: 8,
-                flexShrink: 0
-              },
-              className: "pc-shell-topbar-actions",
-              children: [
-                !showSwitcher ? null : showHamburger ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-                  CompactLanguageMenu,
-                  {
-                    locale,
-                    options: languageOptions2,
-                    onChange: changeLanguage
-                  }
-                ) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
-                  PCSelect,
-                  {
-                    size: "sm",
-                    searchable: true,
-                    prefix: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react8.Globe2, { size: 12, strokeWidth: 1.8 }),
-                    searchPlaceholder: t("searchPlaceholder"),
-                    noOptionsMessage: t("noOptionsFound"),
-                    style: {
-                      width: "auto",
-                      minWidth: 120,
-                      maxWidth: "min(60vw, 280px)",
-                      flexShrink: 0
-                    },
-                    options: [...languageOptions2],
-                    value: languageOptions2.find((opt) => opt.value === locale) || null,
-                    onChange: handleLanguageChange
-                  }
-                ),
-                showNotifications && isSectionEnabled("notifications") && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NotificationBell, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(UserMenu, { onBack })
-              ]
-            }
-          )
+          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { style: actionsStyle, className: "pc-shell-topbar-actions", children: [
+            !showSwitcher ? null : showHamburger ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+              CompactLanguageMenu,
+              {
+                locale,
+                options: languageOptions2,
+                onChange: changeLanguage
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+              PCSelect,
+              {
+                size: "sm",
+                searchable: true,
+                prefix: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react8.Globe2, { size: 12, strokeWidth: 1.8 }),
+                searchPlaceholder: t("searchPlaceholder"),
+                noOptionsMessage: t("noOptionsFound"),
+                style: {
+                  width: "auto",
+                  minWidth: 120,
+                  maxWidth: "min(60vw, 280px)",
+                  flexShrink: 0
+                },
+                options: [...languageOptions2],
+                value: languageOptions2.find((opt) => opt.value === locale) || null,
+                onChange: handleLanguageChange
+              }
+            ),
+            showNotifications && isSectionEnabled("notifications") && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NotificationBell, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(UserMenu, { onBack })
+          ] })
         ]
       }
     ),
@@ -28806,7 +28831,7 @@ var orderedToggles = (raw, keys, defaults) => {
 };
 var stringList = (raw, max) => Array.isArray(raw) ? raw.filter((item) => typeof item === "string").map((item) => item.trim()).filter(Boolean).slice(0, max) : [];
 var resolveBranding = (raw) => {
-  var _a;
+  var _a, _b;
   const base = DEFAULT_PRIVACY_CENTER_SETTINGS.branding;
   const font = raw.font_family;
   return {
@@ -28814,11 +28839,12 @@ var resolveBranding = (raw) => {
     display_name: nullableText(raw.display_name, base.display_name),
     logo_url: nullableUrl(raw.logo_url, base.logo_url),
     logo_height: clampedInt(raw.logo_height, LOGO_HEIGHT_MIN, LOGO_HEIGHT_MAX, base.logo_height),
+    logo_align: (_a = LOGO_ALIGNMENTS.find((value) => value === raw.logo_align)) != null ? _a : base.logo_align,
     inherit_colors: bool(raw.inherit_colors, base.inherit_colors),
     primary_color: hex(raw.primary_color, base.primary_color),
     accent_color: hex(raw.accent_color, base.accent_color),
     inherit_font: bool(raw.inherit_font, base.inherit_font),
-    font_family: font === null ? null : (_a = FONT_FAMILIES.find((family) => family === font)) != null ? _a : base.font_family,
+    font_family: font === null ? null : (_b = FONT_FAMILIES.find((family) => family === font)) != null ? _b : base.font_family,
     style: raw.style === void 0 ? base.style : resolveAppearance(raw.style) === "glass" ? "glass" : "classic",
     corner_radius: clampedInt(raw.corner_radius, CORNER_RADIUS_MIN, CORNER_RADIUS_MAX, base.corner_radius)
   };

package/dist/privacy-center.mjs

@@ -14132,6 +14132,7 @@ var LANGUAGE_CODES = [
 ];
 var RTL_LANGUAGES = /* @__PURE__ */ new Set(["ur", "sd", "ks"]);
 var COUNTRY_CODES = ["+91", "+971", "+65", "+44", "+1"];
+var LOGO_ALIGNMENTS = ["auto", "left", "center", "right"];
 var FONT_FAMILIES = [
   "Inter",
   "Montserrat",
@@ -14184,6 +14185,7 @@ var DEFAULT_PRIVACY_CENTER_SETTINGS = {
     display_name: null,
     logo_url: null,
     logo_height: null,
+    logo_align: "auto",
     inherit_colors: true,
     primary_color: null,
     accent_color: null,
@@ -15666,6 +15668,17 @@ function CompactLanguageMenu({ locale, options, onChange }) {
 
 // src/RedactoPrivacyCenter/components/AppShell/TopAppBar.tsx
 import { Fragment as Fragment3, jsx as jsx37, jsxs as jsxs16 } from "react/jsx-runtime";
+var LOGO_GROUP_PLACEMENT = {
+  // `left`, not `insetInlineStart`: the translation is physical, so a logical
+  // offset would measure from the right under RTL and land off centre.
+  center: {
+    position: "absolute",
+    left: "50%",
+    transform: "translateX(-50%)"
+  },
+  right: { order: 1 }
+};
+var hamburgerLeadsHeader = (logoAlign) => logoAlign === "center" || logoAlign === "right";
 var TOP_BAR_LOGO_HEIGHT = 32;
 var TOP_BAR_LOGO_MAX_HEIGHT = 40;
 var TopAppBar = forwardRef2(function TopAppBar2({ onOpenMobileNav, showHamburger, locale, onLocaleChange, onBack, showNotifications = true }, hamburgerRef) {
@@ -15728,6 +15741,22 @@ var TopAppBar = forwardRef2(function TopAppBar2({ onOpenMobileNav, showHamburger
     fontFamily: "inherit",
     flexShrink: 0
   };
+  const logoAlign = brandingSettings.logo_align;
+  const hamburgerIsOwnItem = hamburgerLeadsHeader(logoAlign);
+  const logoGroupStyle = {
+    display: "flex",
+    alignItems: "center",
+    gap: 8,
+    minWidth: 0,
+    ...LOGO_GROUP_PLACEMENT[logoAlign]
+  };
+  const actionsStyle = {
+    display: "flex",
+    alignItems: "center",
+    gap: 8,
+    flexShrink: 0,
+    ...logoAlign === "right" ? { order: 0 } : null
+  };
   return /* @__PURE__ */ jsxs16(Fragment3, { children: [
     /* @__PURE__ */ jsxs16(
       "header",
@@ -15737,8 +15766,16 @@ var TopAppBar = forwardRef2(function TopAppBar2({ onOpenMobileNav, showHamburger
         style: headerStyle,
         ...partAttribute("topbar"),
         children: [
-          /* @__PURE__ */ jsxs16("div", { style: { display: "flex", alignItems: "center", gap: 8, minWidth: 0 }, children: [
-            showHamburger && /* @__PURE__ */ jsx37(
+          showHamburger && hamburgerIsOwnItem && /* @__PURE__ */ jsx37(
+            HamburgerButton,
+            {
+              ref: hamburgerRef,
+              onClick: onOpenMobileNav,
+              label: t("openSidebarMenu")
+            }
+          ),
+          /* @__PURE__ */ jsxs16("div", { style: logoGroupStyle, children: [
+            showHamburger && !hamburgerIsOwnItem && /* @__PURE__ */ jsx37(
               HamburgerButton,
               {
                 ref: hamburgerRef,
@@ -15788,48 +15825,36 @@ var TopAppBar = forwardRef2(function TopAppBar2({ onOpenMobileNav, showHamburger
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs16(
-            "div",
-            {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: 8,
-                flexShrink: 0
-              },
-              className: "pc-shell-topbar-actions",
-              children: [
-                !showSwitcher ? null : showHamburger ? /* @__PURE__ */ jsx37(
-                  CompactLanguageMenu,
-                  {
-                    locale,
-                    options: languageOptions2,
-                    onChange: changeLanguage
-                  }
-                ) : /* @__PURE__ */ jsx37(
-                  PCSelect,
-                  {
-                    size: "sm",
-                    searchable: true,
-                    prefix: /* @__PURE__ */ jsx37(Globe2, { size: 12, strokeWidth: 1.8 }),
-                    searchPlaceholder: t("searchPlaceholder"),
-                    noOptionsMessage: t("noOptionsFound"),
-                    style: {
-                      width: "auto",
-                      minWidth: 120,
-                      maxWidth: "min(60vw, 280px)",
-                      flexShrink: 0
-                    },
-                    options: [...languageOptions2],
-                    value: languageOptions2.find((opt) => opt.value === locale) || null,
-                    onChange: handleLanguageChange
-                  }
-                ),
-                showNotifications && isSectionEnabled("notifications") && /* @__PURE__ */ jsx37(NotificationBell, {}),
-                /* @__PURE__ */ jsx37(UserMenu, { onBack })
-              ]
-            }
-          )
+          /* @__PURE__ */ jsxs16("div", { style: actionsStyle, className: "pc-shell-topbar-actions", children: [
+            !showSwitcher ? null : showHamburger ? /* @__PURE__ */ jsx37(
+              CompactLanguageMenu,
+              {
+                locale,
+                options: languageOptions2,
+                onChange: changeLanguage
+              }
+            ) : /* @__PURE__ */ jsx37(
+              PCSelect,
+              {
+                size: "sm",
+                searchable: true,
+                prefix: /* @__PURE__ */ jsx37(Globe2, { size: 12, strokeWidth: 1.8 }),
+                searchPlaceholder: t("searchPlaceholder"),
+                noOptionsMessage: t("noOptionsFound"),
+                style: {
+                  width: "auto",
+                  minWidth: 120,
+                  maxWidth: "min(60vw, 280px)",
+                  flexShrink: 0
+                },
+                options: [...languageOptions2],
+                value: languageOptions2.find((opt) => opt.value === locale) || null,
+                onChange: handleLanguageChange
+              }
+            ),
+            showNotifications && isSectionEnabled("notifications") && /* @__PURE__ */ jsx37(NotificationBell, {}),
+            /* @__PURE__ */ jsx37(UserMenu, { onBack })
+          ] })
         ]
       }
     ),
@@ -28026,7 +28051,7 @@ var orderedToggles = (raw, keys, defaults) => {
 };
 var stringList = (raw, max) => Array.isArray(raw) ? raw.filter((item) => typeof item === "string").map((item) => item.trim()).filter(Boolean).slice(0, max) : [];
 var resolveBranding = (raw) => {
-  var _a;
+  var _a, _b;
   const base = DEFAULT_PRIVACY_CENTER_SETTINGS.branding;
   const font = raw.font_family;
   return {
@@ -28034,11 +28059,12 @@ var resolveBranding = (raw) => {
     display_name: nullableText(raw.display_name, base.display_name),
     logo_url: nullableUrl(raw.logo_url, base.logo_url),
     logo_height: clampedInt(raw.logo_height, LOGO_HEIGHT_MIN, LOGO_HEIGHT_MAX, base.logo_height),
+    logo_align: (_a = LOGO_ALIGNMENTS.find((value) => value === raw.logo_align)) != null ? _a : base.logo_align,
     inherit_colors: bool(raw.inherit_colors, base.inherit_colors),
     primary_color: hex(raw.primary_color, base.primary_color),
     accent_color: hex(raw.accent_color, base.accent_color),
     inherit_font: bool(raw.inherit_font, base.inherit_font),
-    font_family: font === null ? null : (_a = FONT_FAMILIES.find((family) => family === font)) != null ? _a : base.font_family,
+    font_family: font === null ? null : (_b = FONT_FAMILIES.find((family) => family === font)) != null ? _b : base.font_family,
     style: raw.style === void 0 ? base.style : resolveAppearance(raw.style) === "glass" ? "glass" : "classic",
     corner_radius: clampedInt(raw.corner_radius, CORNER_RADIUS_MIN, CORNER_RADIUS_MAX, base.corner_radius)
   };

package/dist/{types-Bwtzvz4W.d.mts → types-B8qroG0j.d.mts}

@@ -53,6 +53,8 @@ type NoticeAppearance = Readonly<{
     desktop_position?: string;
     backdrop?: string;
     collapsible_sections?: boolean;
+    /** Only read when the notice covers one product. */
+    show_product_section?: boolean;
     phone_footer?: string;
     auto_dark?: boolean;
     dark_colors?: NoticeAppearanceColors;

package/dist/{types-Bwtzvz4W.d.ts → types-B8qroG0j.d.ts}

@@ -53,6 +53,8 @@ type NoticeAppearance = Readonly<{
     desktop_position?: string;
     backdrop?: string;
     collapsible_sections?: boolean;
+    /** Only read when the notice covers one product. */
+    show_product_section?: boolean;
     phone_footer?: string;
     auto_dark?: boolean;
     dark_colors?: NoticeAppearanceColors;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redacto.io/consent-sdk-react",
-  "version": "11.0.0-beta.2",
+  "version": "11.0.0",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",