From 3bc976b8c61f858d2f3e0004cb5567549660e695 Mon Sep 17 00:00:00 2001
From: giuliana <giuliana.silva@outsystems.com>
Date: Thu, 23 Jan 2025 11:46:53 +0000
Subject: [PATCH] feat(toggle): add required prop

---
 core/src/components/toggle/toggle.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/core/src/components/toggle/toggle.tsx b/core/src/components/toggle/toggle.tsx
index b20ef320f0..2bfbd08496 100644
--- a/core/src/components/toggle/toggle.tsx
+++ b/core/src/components/toggle/toggle.tsx
@@ -108,6 +108,11 @@ export class Toggle implements ComponentInterface {
    */
   @Prop() alignment?: 'start' | 'center';
 
+  /**
+   * If `true`, the user must fill in a value before submitting a form.
+   */
+  @Prop() required = false;
+
   /**
    * Emitted when the user switches the toggle on or off.
    *
@@ -290,7 +295,7 @@ export class Toggle implements ComponentInterface {
   }
 
   render() {
-    const { activated, color, checked, disabled, el, justify, labelPlacement, inputId, name, alignment } = this;
+    const { activated, color, checked, disabled, el, justify, labelPlacement, inputId, name, alignment, required } = this;
 
     const mode = getIonMode(this);
     const value = this.getValue();
@@ -327,6 +332,7 @@ export class Toggle implements ComponentInterface {
             onFocus={() => this.onFocus()}
             onBlur={() => this.onBlur()}
             ref={(focusEl) => (this.focusEl = focusEl)}
+            required={required}
             {...this.inheritedAttributes}
           />
           <div