diff --git a/extensions/resource-deployment/src/ui/resourceTypePickerDialog.ts b/extensions/resource-deployment/src/ui/resourceTypePickerDialog.ts index 4221bf2d2c..121d470f9a 100644 --- a/extensions/resource-deployment/src/ui/resourceTypePickerDialog.ts +++ b/extensions/resource-deployment/src/ui/resourceTypePickerDialog.ts @@ -297,7 +297,8 @@ export class ResourceTypePickerDialog extends DialogBase { private createAgreementCheckbox(agreementInfo: AgreementInfo): azdata.FlexContainer { const checkbox = this._view.modelBuilder.checkBox().withProperties({ - ariaLabel: this.getAgreementDisplayText(agreementInfo) + ariaLabel: this.getAgreementDisplayText(agreementInfo), + required: true }).component(); checkbox.checked = false; this._toDispose.push(checkbox.onChanged(() => { diff --git a/src/sql/azdata.proposed.d.ts b/src/sql/azdata.proposed.d.ts index f040cab6a8..1b313141cf 100644 --- a/src/sql/azdata.proposed.d.ts +++ b/src/sql/azdata.proposed.d.ts @@ -202,4 +202,8 @@ declare module 'azdata' { export interface InputBoxProperties extends ComponentProperties { validationErrorMessage?: string; } + + export interface CheckBoxProperties { + required?: boolean; + } } diff --git a/src/sql/base/browser/ui/checkbox/checkbox.ts b/src/sql/base/browser/ui/checkbox/checkbox.ts index 14aa6b9537..bad9ce3655 100644 --- a/src/sql/base/browser/ui/checkbox/checkbox.ts +++ b/src/sql/base/browser/ui/checkbox/checkbox.ts @@ -100,6 +100,14 @@ export class Checkbox extends Widget { return this._el.getAttribute('aria-label'); } + public set required(val: boolean) { + this._el.required = val; + } + + public get required(): boolean { + return this._el.required; + } + public focus(): void { this._el.focus(); } diff --git a/src/sql/workbench/browser/modelComponents/checkbox.component.ts b/src/sql/workbench/browser/modelComponents/checkbox.component.ts index 1e971c8c7f..6802e5cef1 100644 --- a/src/sql/workbench/browser/modelComponents/checkbox.component.ts +++ b/src/sql/workbench/browser/modelComponents/checkbox.component.ts @@ -90,6 +90,9 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone if (this.ariaLabel) { this._input.ariaLabel = this.ariaLabel; } + if (this.required) { + this._input.required = this.required; + } } // CSS-bound properties @@ -110,6 +113,14 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone this.setPropertyFromUI((properties, label) => { properties.label = label; }, newValue); } + public get required(): boolean { + return this.getPropertyOrDefault((props) => props.required, false); + } + + public set required(newValue: boolean) { + this.setPropertyFromUI((props, value) => props.required = value, newValue); + } + public focus(): void { this._input.focus(); }