@soyio/soyio-widget 2.24.0 → 2.25.0

package/README.md

@@ -197,11 +197,37 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
         title: "Privacy preferences",
         description: "Manage your requests and consent settings.",
       },
+      consentManagement: {
+        header: {
+          title: "Manage your consent settings",
+          description: "Select which permissions should remain active.",
+        },
+      },
       rightExamples: {
         access: 'Example: "I want to know what data you store about me."',
       },
     },
 
+    // Consent management grouping customization (optional)
+    consentManagement: {
+      scopeGroups: [
+        {
+          title: "Financial products",
+          scopes: [
+            { scopeType: "product", scopeId: "prod_checking_account" },
+            { scopeType: "product", scopeId: "prod_credit_card" },
+          ],
+        },
+        {
+          title: "Main branches",
+          scopes: [
+            { scopeType: "branch", scopeId: "branch_centro" },
+            { scopeType: "branch", scopeId: "branch_providencia" },
+          ],
+        },
+      ],
+    },
+
     // Common options
     consentControl: "checkbox", // Optional: 'switch' (default) | 'checkbox'
     consentMode: "batch", // Optional: 'immediate' (default) | 'batch'
@@ -215,6 +241,7 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
     appearance: {
       config: {
         showHeader: true,
+        showConsentManagementHeader: true,
       },
     }, // Optional
   };
@@ -241,6 +268,8 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
 - `redecOperationIds`: Optional array of `{ id, label }` values for the Redec operation select. Required if `redec` right is included in `enabledRights` param.
 - `appearance.config.showHeader`: Optional boolean to show/hide the privacy center header (title and description).
 - `content.header`: Optional object with `title` and `description` overrides for the privacy center header copy.
+- `appearance.config.showConsentManagementHeader`: Optional boolean to show/hide the title and description in the consent management page.
+- `content.consentManagement.header`: Optional object with `title` and `description` overrides for the consent management header copy.
 - `content.rightExamples`: Optional object to override DSR right examples. Supported keys: `access`, `opposition`, `rectification`, `suppression`, `portability`, `redec_update`, `redec_rectification`, `redec_complementation`, `redec_cancellation`.
 - `header`: Optional legacy alias for `content.header`.
 - `rightExamples`: Optional legacy alias for `content.rightExamples`.
@@ -249,7 +278,8 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
 - `consentMode`: Optional, controls how consent changes are committed. Values: `'immediate'` (default) or `'batch'` (save multiple changes at once).
 - `consentRetentionPeriod`: Optional, specifies a duration during which a consent cannot be revoked after being granted. Format: `"<value> <unit>"`. Supported units: `day`, `week`, `month`, `year` (and their plural forms). Example: `'30 days'`, `'1 week'`.
 - `allowGranularScopeSelection`: Optional boolean, enables selecting/deselecting individual consent scopes in consent management when templates define multiple scopes. When enabled and a consent has more than one scope, the main consent checkbox supports partial state.
-- `groupConsentsByScope`: Optional boolean, groups consent templates by scope in consent management.
+- `groupConsentsByScope`: Optional boolean, groups consent templates by scope in consent management. This must be enabled for `consentManagement.scopeGroups` to apply.
+- `consentManagement.scopeGroups`: Optional array to customize accordion groups in consent management. Each group requires a `title` and a `scopes` array with `{ scopeType: 'product' | 'branch', scopeId: string }` entries. Scopes not included in custom groups keep the default scope grouping.
 - `showBatchConsentConfirmation`: Optional boolean, whether to show a confirmation dialog before saving consent changes in batch mode.
 - `appearance`: Customize the iframe appearance. See Appearance section below.
 - `onEvent`: Callback that receives events from the iframe.
@@ -257,6 +287,8 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
 
 Note:
 - When `sessionToken` is provided, do not pass `companyId`.
+- `consentManagement.scopeGroups` is applied during initial iframe URL render and also synchronized through `SET_PRIVACY_CENTER_CONFIG` updates.
+- `content.header`, `content.consentManagement.header`, and `appearance.config.showConsentManagementHeader` are applied through `SET_PRIVACY_CENTER_CONFIG`; the header may briefly appear before the update is received.
 
 ### Privacy Center Events
 

package/dist/index.d.ts

@@ -338,6 +338,7 @@ declare type PrivacyCenterConfig = BaseConfig & {
     allowGranularScopeSelection?: boolean;
     groupConsentsByScope?: boolean;
     showBatchConsentConfirmation?: boolean;
+    consentManagement?: PrivacyCenterConsentManagementConfig;
     redecOperationIds?: RedecOperationId[];
     content?: PrivacyCenterContentConfig;
     header?: PrivacyCenterHeaderCopyConfig;
@@ -350,8 +351,25 @@ declare type PrivacyCenterConfig = BaseConfig & {
     companyId?: never;
 });
 
+declare type PrivacyCenterConsentManagementConfig = {
+    scopeGroups?: [
+    PrivacyCenterConsentManagementScopeGroupConfig,
+    ...PrivacyCenterConsentManagementScopeGroupConfig[]
+    ];
+};
+
+declare type PrivacyCenterConsentManagementCopyConfig = {
+    header?: PrivacyCenterHeaderCopyConfig;
+};
+
+declare type PrivacyCenterConsentManagementScopeGroupConfig = {
+    title: string;
+    scopes: [PrivacyCenterScopeReference, ...PrivacyCenterScopeReference[]];
+};
+
 declare type PrivacyCenterContentConfig = {
     header?: PrivacyCenterHeaderCopyConfig;
+    consentManagement?: PrivacyCenterConsentManagementCopyConfig;
     rightExamples?: Partial<Record<DataSubjectRequestKind, string>>;
 };
 
@@ -362,6 +380,11 @@ declare type PrivacyCenterHeaderCopyConfig = {
 
 declare type PrivacyCenterRight = 'arsop' | 'redec';
 
+declare type PrivacyCenterScopeReference = {
+    scopeType: 'product' | 'branch';
+    scopeId: string;
+};
+
 declare type PrivacyManagerFeature = 'DataSubjectRequest' | 'ConsentManagement' | 'RequestTracking';
 
 declare type RedecOperationId = {
@@ -405,6 +428,7 @@ declare interface SoyioAppearanceConfig {
      */
     consentControl?: 'switch' | 'checkbox';
     showHeader?: boolean;
+    showConsentManagementHeader?: boolean;
     /**
      * Icon name to use for hint/help tooltips on input labels.
      * Available icons: 'Question' (default), 'Info', 'QuestionMark', etc.