feat(range): add ionFocus and ionBlur events (#10761)

* Added ionLeave output event to be emitted on leave

* Changed `ionLeave` to `ionDragEnd`

* Changed ionDragEnd to ionBlur. Added ionFocus

src/components/range/range.ts

@@ -302,11 +302,20 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
     return null;
   }
 
+  /**
+   * @output {Range} Emitted when the range selector drag starts.
+   */
+  @Output() ionFocus: EventEmitter<Range> = new EventEmitter<Range>();
+
   /**
    * @output {Range} Emitted when the range value changes.
    */
   @Output() ionChange: EventEmitter<Range> = new EventEmitter<Range>();
 
+  /**
+   * @output {Range} Emitted when the range selector drag ends.
+   */
+  @Output() ionBlur: EventEmitter<Range> = new EventEmitter<Range>();
 
   constructor(
     private _form: Form,
@@ -356,6 +365,9 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
       return false;
     }
 
+    // trigger ionFocus event
+    this.ionFocus.emit(this);
+
     // prevent default so scrolling does not happen
     ev.preventDefault();
     ev.stopPropagation();
@@ -411,6 +423,9 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
 
       // trigger a haptic end
       this._haptic.gestureSelectionEnd();
+
+      // trigger ionBlur event
+      this.ionBlur.emit(this);
     }
   }