# dsar\_form `LayoutComponent` ❌ Theme ✅ Options ❌ Content & Translations First, take a look at the mapping between `options` properties and widget elements in these three visuals below.
To edit Privacy request widget design, you need to edit the layout-component `dsar_form` by sending a **PATCH** request on `/widgets/layout-components/{layout-component-id}` and specifying options in `options` property. {% hint style="warning" %} Be careful when you are editing the `options` property. This is a JSONB and by design, you need to fill in every properties already added every time you edit this object. {% endhint %} ```json PATCH https://api.didomi.io/widgets/layout-components/{layout_component_id}?organization_id=YOUR_ORG_ID&widget_id=YOUR_WIDGET_ID { "type": "dsar_form", "organization_id": "YOUR_ORGANIZATION_ID", "options": { ... } } ``` #### General options | Element | Description | Component options | | --------------------------- | -------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------- | | `card` | Container of Privacy request widget | [DidomiCardOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomicardoptions) | | `formTitle` | Title of widget | [DidomiTextOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomitextoptions) | | `firstStepButton` | Button to validate first step of form | [DidomiButtonOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomibuttonoptions) | | `backButton` | Button to go back to first step | [DidomiButtonOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomibuttonoptions) | | `secondStepButton` | Button to submit the form | [DidomiButtonOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomibuttonoptions) | | `formHint` | Hint at the bottom of second step | [DidomiTextOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomitextoptions) | | `sendRequestErrorMessage` | Error message when the request was not created after submitted | [DidomiTextOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomitextoptions) | | `successMessageTitle` | Title in confirmation step | [DidomiTextOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomitextoptions) | | `successMessageDescription` | Description in confirmation step | [DidomiTextOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomitextoptions) | | `closeIcon` | Close button to go back to first step from confirmation step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `formButtonsWrapper` | Wrapper of buttons in second step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `backButtonWrapper` | Wrapper of back button in second step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `secondStepButtonWrapper` | Wrapper of confirm button in second step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `loader` | Loader in confirm button in second step when clicked | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | #### userRightOptions | Element | Description | Component options | | -------------- | --------------------------- | ---------------------------------------------------------------------------------------------------------------------- | | `title` | Title in second step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `description` | Description in second step | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `radioOptions` | Radio buttons in first step | [radioOptions](#radiooptions) | #### radioOptions | Element | Description | Component options | | ----------------------- | -------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | | `label` | Label of a radio button | [DidomiStyle](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomistyle) | | `backgroundColor` | Background color of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | | `circleColor` | Radio circle of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | | `borderRadius` | Border radius of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | | `padding` | Padding of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | | `circleBackgroundColor` | Background of radio circle of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | | `borderColor` | Border of radio circle of a radio button | [ComponentOptionValue](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#componentoptionvalue) | #### formFieldsOptions | Element | Description | Component options | | ------------------- | ----------- | --------------------------------------------------------------------------------------------------------------------------------------------- | | `formFieldsOptions` | Text input | [DidomiFormFieldsOptions](https://developers.didomi.io/api-and-platform/widgets/privacy-widgets/edit-a-widget/options#didomiformfieldoptions) | We have gathered all elements and their options in the following object. You can use it to edit the `dsar_form` options by sending a **PATCH** request on `/widgets/layout-components/{layout-component-id}`. ```json PATCH https://api.didomi.io/widgets/layout-components/{layout_component_id}?organization_id=YOUR_ORG_ID&widget_id=YOUR_WIDGET_ID { "type": "dsar_form", "options": { "formTitle": { "style": { "default": {} } }, "firstStepButton": { "style": { "default": {} }, "text": { "style": { "default": {} }, "content": {} } }, "secondStepButton": { "style": { "default": {} }, "text": { "style": { "default": {} }, "content": {} } }, "backButton": { "style": { "default": {} }, "text": { "style": { "default": {} }, "content": {} } }, "formHint": { "style": { "default": {} }, "content": {} }, "sendRequestErrorMessage": { "style": { "default": {} }, "content": {} }, "successMessageTitle": { "style": { "default": {} }, "content": {} }, "successMessageDescription": { "style": { "default": {} }, "content": {} }, "closeIcon": { "style": { "default": {} } }, "formButtonsWrapper": { "style": { "default": {} } }, "backButtonWrapper": { "style": { "default": {} } }, "secondStepButtonWrapper": { "style": { "default": {} } }, "loader": { "style": { "default": {} } }, "userRightsOptions": { "title": { "style": { "default": {} } }, "description": { "style": { "default": {} } }, "radioOptions": { "label": { "style": { "default": {} } }, "backgroundColor": "", "circleColor": "", "borderRadius": "", "padding": "", "circleBackgroundColor": "", "borderColor": "" } }, "formFieldsOptions": { "label": { "style": { "default": {} } }, "description": { "style": { "default": {} } }, "hint": { "style": { "default": {} } }, "errorMessage": { "style": { "default": {} } }, "inputOptions": { "fontColor": "", "fontSize": "", "fontWeight": "", "lineHeight": "", "borderRadius": "", "borderColor": "", "borderWidth": "", "errorBorderColor": "", "placeholderColor": "", "backgroundColor": "" } } }, "organization_id": "YOUR_ORGANIZATION_ID" } ```