Remove jQuery Datepicker from Form Block

.dev/config/webpack.config.js

@@ -14,7 +14,6 @@ const scripts = [
 	'coblocks-accordion-polyfill',
 	'coblocks-animation',
 	'coblocks-checkbox-required',
-	'coblocks-datepicker',
 	'coblocks-events',
 	'coblocks-fromEntries',
 	'coblocks-google-maps',

.dev/tests/phpunit/includes/test-coblocks-form.php

@@ -325,25 +325,12 @@ public function test_render_field_textarea() {
 
 	}
 
-	/**
-	 * Test the datepicker script is enqueued
-	 */
-	public function test_field_date_scripts() {
-
-		$this->coblocks_form->render_field_date( [], '' );
-
-		global $wp_scripts;
-
-		$this->assertArrayHasKey( 'coblocks-datepicker', $wp_scripts->registered );
-
-	}
-
 	/**
 	 * Test the date field markup is as expected
 	 */
 	public function test_render_field_date() {
 
-		$this->expectOutputRegex( '/<input type="text" id="date-2" name="field-date-2\[value\]" class="coblocks-field coblocks-field--date"  \/>/' );
+		$this->expectOutputRegex( '/<input type="date" id="date" name="field-date\[value\]" class="coblocks-field coblocks-field--date"  \/>/' );
 
 		echo $this->coblocks_form->render_field_date( [], '' );
 

.dev/tests/phpunit/test-class-coblocks.php

@@ -185,7 +185,6 @@ public function test_final_build_assets_exist() {
 				'dist/coblocks-1.js',
 				'dist/js/coblocks-accordion-polyfill.js',
 				'dist/js/coblocks-checkbox-required.js',
-				'dist/js/coblocks-datepicker.js',
 				'dist/js/coblocks-fromEntries.js',
 				'dist/js/coblocks-google-maps.js',
 				'dist/js/coblocks-google-recaptcha.js',
@@ -197,7 +196,6 @@ public function test_final_build_assets_exist() {
 				'dist/js/vendors/slick.js',
 				'src/js/coblocks-accordion-polyfill.js',
 				'src/js/coblocks-checkbox-required.js',
-				'src/js/coblocks-datepicker.js',
 				'src/js/coblocks-fromEntries.js',
 				'src/js/coblocks-google-maps.js',
 				'src/js/coblocks-google-recaptcha.js',

includes/class-coblocks-form.php

@@ -410,16 +410,6 @@ public function render_field_date( $atts ) {
 
 		static $date_count = 1;
 
-		wp_enqueue_script(
-			'coblocks-datepicker',
-			CoBlocks()->asset_source( 'js' ) . 'coblocks-datepicker.js',
-			array( 'jquery', 'jquery-ui-datepicker' ),
-			COBLOCKS_VERSION,
-			true
-		);
-
-		wp_localize_jquery_ui_datepicker();
-
 		$label         = isset( $atts['label'] ) ? $atts['label'] : __( 'Date', 'coblocks' );
 		$label_slug    = $date_count > 1 ? sanitize_title( $label . '-' . $date_count ) : sanitize_title( $label );
 		$required_attr = ( isset( $atts['required'] ) && $atts['required'] ) ? 'required' : '';
@@ -430,7 +420,7 @@ public function render_field_date( $atts ) {
 
 		?>
 
-		<input type="text" id="<?php echo esc_attr( $label_slug ); ?>" name="field-<?php echo esc_attr( $label_slug ); ?>[value]" class="coblocks-field coblocks-field--date" <?php echo esc_attr( $required_attr ); ?> />
+		<input type="date" id="<?php echo esc_attr( $label_slug ); ?>" name="field-<?php echo esc_attr( $label_slug ); ?>[value]" class="coblocks-field coblocks-field--date" <?php echo esc_attr( $required_attr ); ?> />
 
 		<?php
 

src/blocks/form/fields/date/edit.js

@@ -10,14 +10,14 @@ function CoBlocksFieldDate( props ) {
 	return (
 		<>
 			<CoBlocksField
-				type="text"
+				customTextColor={ customTextColor }
+				isSelected={ isSelected }
 				label={ label }
+				name={ name }
 				required={ required }
 				setAttributes={ setAttributes }
-				isSelected={ isSelected }
 				textColor={ textColor }
-				customTextColor={ customTextColor }
-				name={ name }
+				type="date"
 			/>
 		</>
 	);

src/styles/style.scss

@@ -9,7 +9,6 @@
 @import "style/has-margin";
 @import "style/shadow";
 @import "style/tooltips";
-@import "style/datepicker";
 
 // @import "../components/**/style.scss";
 @import "../components/background/styles/style.scss";