@soyio/soyio-widget 2.20.0 → 2.21.0

package/README.md

@@ -216,6 +216,10 @@ The `PrivacyCenterBox` lets you embed the Privacy Center inside your page. You c
   - `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.
 - `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'`.
+- `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.
 - `onReady`: Optional callback fired when the iframe becomes ready.
@@ -543,6 +547,7 @@ interface Config {
 | `icon.size` | Global default icon size in pixels | `24` |
 | `iconRules` | Per-component icon style overrides | `{}` |
 | `mainPageColumns` | Number of columns in the main page feature cards grid (1-4) | `2` |
+| `consentManagementColumns` | Number of columns in the consent management grid (1-4) | `2` |
 | `brandTheme` | Theme variant for branded elements like the footer (`default`, `dark`, `light`) | `"default"` |
 
 #### Icons

package/dist/index.d.ts

@@ -264,6 +264,9 @@ declare type PrivacyCenterConfig = BaseConfig & {
         allowedExtensions?: string[];
         maxFileSize?: number;
     };
+    consentMode?: 'immediate' | 'batch';
+    consentRetentionPeriod?: string;
+    showBatchConsentConfirmation?: boolean;
     redecOperationIds?: RedecOperationId[];
 } & ({
     companyId: `com_${string}`;
@@ -310,6 +313,13 @@ declare interface SoyioAppearance {
 
 declare interface SoyioAppearanceConfig {
     helperTextPosition?: 'top' | 'bottom';
+    /**
+     * Control type for consent items.
+     * - 'switch': Toggle switch (default)
+     * - 'checkbox': Checkbox
+     * @default 'switch'
+     */
+    consentControl?: 'switch' | 'checkbox';
     /**
      * Icon name to use for hint/help tooltips on input labels.
      * Available icons: 'Question' (default), 'Info', 'QuestionMark', etc.
@@ -340,6 +350,11 @@ declare interface SoyioAppearanceConfig {
      * @default 2
      */
     mainPageColumns?: 1 | 2 | 3 | 4;
+    /**
+     * Number of columns in the consent management grid.
+     * @default 2
+     */
+    consentManagementColumns?: 1 | 2 | 3 | 4;
     /**
      * Theme variant for branded elements like the footer.
      * - 'default': Standard Soyio brand colors (purple/indigo)
@@ -389,7 +404,7 @@ declare interface SoyioAppearanceVariables {
     dataUseIconColor?: string;
 }
 
-declare type SoyioBaseRule = '.MainContainer' | '.Button' | '.Checkbox' | '.CheckboxInput' | '.CheckboxLabel' | '.Input' | '.Label' | '.HintIcon' | '.Title' | '.StepTitle' | '.Link' | '.Card' | '.CardTitle' | '.Select' | '.Loader' | '.TextArea' | '.ErrorMessage' | '.Description' | '.Switch' | '.SwitchRoot' | '.SwitchThumb' | '.SwitchIcon' | '.Alert' | '.AlertIcon' | '.AlertContent' | '.Radio' | '.RadioButton' | '.RadioIndicator' | '.RadioLabel' | '.Chip' | '.Dialog' | '.DialogOverlay' | '.DialogContent' | '.DialogTitle' | '.DialogDescription' | '.Combobox' | '.NinInput' | '.TrackingCodeInput' | '.TrackingCodeInputCell' | '.TrackingCodeInputSeparator' | '.RadioCard' | '.RadioCardButton' | '.RadioCardIndicator' | '.RadioCardTitle' | '.StepIndicatorContainer' | '.StepIndicator' | '.StepIndicatorLine' | '.StepIndicatorIcon' | '.StepIndicatorDot' | '.StepIndicatorNumber' | '.TooltipContent';
+declare type SoyioBaseRule = '.MainContainer' | '.Button' | '.Checkbox' | '.CheckboxInput' | '.CheckboxLabel' | '.CheckboxCheck' | '.Input' | '.Label' | '.HintIcon' | '.Title' | '.CategoryTag' | '.StepTitle' | '.Link' | '.Card' | '.CardTitle' | '.Select' | '.Loader' | '.TextArea' | '.ErrorMessage' | '.Description' | '.Switch' | '.SwitchRoot' | '.SwitchThumb' | '.SwitchIcon' | '.Alert' | '.AlertIcon' | '.AlertContent' | '.Radio' | '.RadioButton' | '.RadioIndicator' | '.RadioLabel' | '.Chip' | '.Dialog' | '.DialogOverlay' | '.DialogContent' | '.DialogTitle' | '.DialogDescription' | '.Combobox' | '.NinInput' | '.TrackingCodeInput' | '.TrackingCodeInputCell' | '.TrackingCodeInputSeparator' | '.RadioCard' | '.RadioCardButton' | '.RadioCardIndicator' | '.RadioCardTitle' | '.StepIndicatorContainer' | '.StepIndicator' | '.StepIndicatorLine' | '.StepIndicatorIcon' | '.StepIndicatorDot' | '.StepIndicatorNumber' | '.TooltipContent';
 
 declare type SoyioElementState = '--checked';
 
@@ -427,7 +442,7 @@ declare type SoyioRule = {
 
 declare type SoyioRuleKey = `${SoyioBaseRule}${SoyioElementState | SoyioPseudoClass | SoyioPseudoElement | ''}` | SoyioStateRule;
 
-declare type SoyioStateRule = '.Input--error' | '.Alert--error' | '.Alert--warning' | '.Alert--info' | '.Alert--success' | '.Chip--info' | '.Chip--green' | '.Chip--red' | '.Chip--amber' | '.RadioCard--checked' | '.RadioCardIndicator--checked' | '.StepIndicator--active' | '.StepIndicator--completed' | '.StepIndicator--pending' | '.StepIndicatorLine--top' | '.StepIndicatorLine--bottom';
+declare type SoyioStateRule = '.Input--error' | '.Alert--error' | '.Alert--warning' | '.Alert--info' | '.Alert--note' | '.Alert--success' | '.Chip--info' | '.Chip--green' | '.Chip--red' | '.Chip--amber' | '.RadioCard--checked' | '.RadioCardIndicator--checked' | '.StepIndicator--active' | '.StepIndicator--completed' | '.StepIndicator--pending' | '.StepIndicatorLine--top' | '.StepIndicatorLine--bottom';
 
 declare type SoyioTheme = 'soyio' | 'night' | 'flat';