@soyio/soyio-widget 2.22.1 → 2.24.0

package/README.md

@@ -85,6 +85,7 @@ The **`ConsentBox`** is a component that allows you to embed a consent request d
     onReady: () => console.log("ConsentBox is ready"), // Optional
     optionalReconsentBehavior: "notice", // Optional
     mandatoryReconsentBehavior: "notice", // Optional
+    allowGranularScopeSelection: true, // Optional
   };
 
   // Wait for DOM to be fully loaded
@@ -140,6 +141,7 @@ The `onEvent` follows the following format:
   - `askAgain` will show the consent as if it wasn't given in the first place,
 
   We don't support hiding the mandatory consent, and we strongly recommend using `notice` so the user doesn't have to give the consent again and knows what they have already given consent to.
+- **`allowGranularScopeSelection`**: Enables selecting consent at a more granular scope when the template supports granular scopes.
 
 ## Privacy Center
 
@@ -189,11 +191,32 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
       { id: "op_rectification", label: "Rectification" },
     ],
 
+    // Header and copy customization (optional)
+    content: {
+      header: {
+        title: "Privacy preferences",
+        description: "Manage your requests and consent settings.",
+      },
+      rightExamples: {
+        access: 'Example: "I want to know what data you store about me."',
+      },
+    },
+
     // Common options
+    consentControl: "checkbox", // Optional: 'switch' (default) | 'checkbox'
+    consentMode: "batch", // Optional: 'immediate' (default) | 'batch'
+    showBatchConsentConfirmation: true, // Optional: only used in batch mode
+    consentRetentionPeriod: "30 days", // Optional: prevents immediate revoke for this period
+    allowGranularScopeSelection: true, // Optional: only applies when templates have multiple scopes
+    groupConsentsByScope: true, // Optional: groups consent templates by scope in consent management
     onEvent: (event) => console.log(event),
     onReady: () => console.log("PrivacyCenterBox is ready"), // Optional
     isSandbox: true, // Optional
-    appearance: {}, // Optional
+    appearance: {
+      config: {
+        showHeader: true,
+      },
+    }, // Optional
   };
 
   // Wait for DOM to be fully loaded
@@ -216,10 +239,17 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
   - `allowedExtensions`: Array of allowed file extensions (e.g. `['pdf', 'jpg']`). Default: `['pdf', 'png', 'jpeg', 'jpg']`.
   - `maxFileSize`: Maximum file size in bytes. Default: `5 * 1024 * 1024` (5MB).
 - `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.
+- `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`.
 - `isSandbox`: Whether to use the sandbox environment. Defaults to `false`.
 - `consentControl`: Optional, controls the visual interaction for consent toggles. Values: `'switch'` (default) or `'checkbox'`.
 - `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.
 - `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.

package/dist/index.d.ts

@@ -84,6 +84,7 @@ declare type ConsentConfig = BaseConfig & {
     context?: string;
     optionalReconsentBehavior?: 'notice' | 'askAgain' | 'hide';
     mandatoryReconsentBehavior?: 'notice' | 'askAgain';
+    allowGranularScopeSelection?: boolean;
 };
 
 declare type ConsentEvent = ConsentCheckboxChangeEvent;
@@ -185,6 +186,8 @@ declare type CSSProperties = {
 
 declare type DataSubject = 'anonymous_user' | 'citizen_voter' | 'commuter' | 'consultant' | 'customer' | 'employee' | 'job_applicant' | 'next_of_kin' | 'passenger' | 'patient' | 'prospect' | 'shareholder' | 'supplier_vendor' | 'trainee' | 'visitor';
 
+declare type DataSubjectRequestKind = 'access' | 'opposition' | 'rectification' | 'suppression' | 'portability' | 'redec_update' | 'redec_rectification' | 'redec_complementation' | 'redec_cancellation';
+
 export declare class DisclosureRequestBox extends BaseIframeBox<DisclosureRequestBoxEvent, DisclosureRequestBoxConfig> {
     readonly defaultIframePrefix = "disclosure-request-box";
     private passkeyPopupWindow;
@@ -332,8 +335,13 @@ declare type PrivacyCenterConfig = BaseConfig & {
     };
     consentMode?: 'immediate' | 'batch';
     consentRetentionPeriod?: string;
+    allowGranularScopeSelection?: boolean;
+    groupConsentsByScope?: boolean;
     showBatchConsentConfirmation?: boolean;
     redecOperationIds?: RedecOperationId[];
+    content?: PrivacyCenterContentConfig;
+    header?: PrivacyCenterHeaderCopyConfig;
+    rightExamples?: PrivacyCenterContentConfig['rightExamples'];
 } & ({
     companyId: `com_${string}`;
     sessionToken?: never;
@@ -342,6 +350,16 @@ declare type PrivacyCenterConfig = BaseConfig & {
     companyId?: never;
 });
 
+declare type PrivacyCenterContentConfig = {
+    header?: PrivacyCenterHeaderCopyConfig;
+    rightExamples?: Partial<Record<DataSubjectRequestKind, string>>;
+};
+
+declare type PrivacyCenterHeaderCopyConfig = {
+    title?: string;
+    description?: string;
+};
+
 declare type PrivacyCenterRight = 'arsop' | 'redec';
 
 declare type PrivacyManagerFeature = 'DataSubjectRequest' | 'ConsentManagement' | 'RequestTracking';
@@ -386,6 +404,7 @@ declare interface SoyioAppearanceConfig {
      * @default 'switch'
      */
     consentControl?: 'switch' | 'checkbox';
+    showHeader?: boolean;
     /**
      * Icon name to use for hint/help tooltips on input labels.
      * Available icons: 'Question' (default), 'Info', 'QuestionMark', etc.