Add required property to checkbox and set it for deployment dialog (#9392)

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<azdata.CheckBoxProperties>({
-			ariaLabel: this.getAgreementDisplayText(agreementInfo)
+			ariaLabel: this.getAgreementDisplayText(agreementInfo),
+			required: true
 		}).component();
 		checkbox.checked = false;
 		this._toDispose.push(checkbox.onChanged(() => {

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;
+	}
 }

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();
 	}

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<azdata.CheckBoxProperties, string>((properties, label) => { properties.label = label; }, newValue);
 	}
 
+	public get required(): boolean {
+		return this.getPropertyOrDefault<azdata.CheckBoxProperties, boolean>((props) => props.required, false);
+	}
+
+	public set required(newValue: boolean) {
+		this.setPropertyFromUI<azdata.CheckBoxProperties, boolean>((props, value) => props.required = value, newValue);
+	}
+
 	public focus(): void {
 		this._input.focus();
 	}