feat(datetime): add clear button (#23920)

resolves #17482 

Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>

core/src/components/datetime/usage/angular.md

@@ -40,6 +40,9 @@
   <div slot="title">My Custom Title</div>
 </ion-datetime>
 
+<!-- Clear button -->
+<ion-datetime [showClearButton]="true"></ion-datetime>
+
 <!-- Datetime in overlay -->
 <ion-button id="open-modal">Open Datetime Modal</ion-button>
 <ion-modal trigger="open-modal">

core/src/components/datetime/usage/javascript.md

@@ -40,6 +40,9 @@
   <div slot="title">My Custom Title</div>
 </ion-datetime>
 
+<!-- Clear button -->
+<ion-datetime show-clear-button="true"></ion-datetime>
+
 <!-- Custom buttons -->
 <ion-datetime id="custom-datetime">
   <ion-buttons slot="buttons">

core/src/components/datetime/usage/react.md

@@ -66,6 +66,9 @@ export const DateTimeExamples: React.FC = () => {
       <IonDatetime>
         <div slot="title">My Custom Title</div>
       </IonDatetime>
+
+      {/* Clear button */}
+      <IonDatetime showClearButton={true}></IonDatetime>
       
       {/* Custom buttons */}
       <IonDatetime ref={customDatetime}>

core/src/components/datetime/usage/stencil.md

@@ -64,6 +64,9 @@ export class DatetimeExample {
       <ion-datetime>
         <div slot="title">My Custom Title</div>
       </ion-datetime>,
+
+      {/* Clear button */}
+      <ion-datetime showClearButton={true}></ion-datetime>  
       
       {/* Custom buttons */}
       <ion-datetime ref={el => this.customDatetime = el}>

core/src/components/datetime/usage/vue.md

@@ -40,6 +40,9 @@
   <ion-datetime>
     <div slot="title">My Custom Title</div>
   </ion-datetime>
+
+  <!-- Clear button -->
+  <ion-datetime :show-clear-button="true"></ion-datetime>
   
   <!-- Custom buttons -->
   <ion-datetime ref="customDatetime">