Merge pull request #22936 from woocommerce/fix/21814
Setup Wizard: Add keyboard events for custom input toggles
This commit is contained in:
commit
d8f665bb89
|
@ -670,6 +670,7 @@ body {
|
|||
position: relative;
|
||||
max-height: 1.5em;
|
||||
align-self: flex-start;
|
||||
order: 3;
|
||||
}
|
||||
|
||||
.wc-wizard-service-toggle {
|
||||
|
|
|
@ -67,6 +67,15 @@ jQuery( function( $ ) {
|
|||
}
|
||||
} );
|
||||
|
||||
$( '.wc-wizard-services' ).on( 'keyup', function( e ) {
|
||||
var code = e.keyCode || e.which,
|
||||
$focused = $( document.activeElement );
|
||||
|
||||
if ( $focused.is( '.wc-wizard-service-toggle, .wc-wizard-service-enable' ) && ( 13 === code || 32 === code ) ) {
|
||||
$focused.find( ':input' ).click();
|
||||
}
|
||||
} );
|
||||
|
||||
$( '.wc-wizard-services' ).on( 'click', '.wc-wizard-service-enable', function( e ) {
|
||||
var eventTarget = $( e.target );
|
||||
|
||||
|
|
|
@ -1630,6 +1630,18 @@ class WC_Admin_Setup_Wizard {
|
|||
<p><?php echo esc_html( $item_info['name'] ); ?></p>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="wc-wizard-service-enable">
|
||||
<span class="wc-wizard-service-toggle <?php echo esc_attr( $should_enable_toggle ? '' : 'disabled' ); ?>" tabindex="0">
|
||||
<input
|
||||
id="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>"
|
||||
type="checkbox"
|
||||
name="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>-enabled"
|
||||
value="yes" <?php checked( $should_enable_toggle ); ?>
|
||||
data-plugins="<?php echo wc_esc_json( wp_json_encode( $plugins ) ); ?>"
|
||||
/>
|
||||
<label for="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>">
|
||||
</span>
|
||||
</div>
|
||||
<div class="wc-wizard-service-description">
|
||||
<?php echo wp_kses_post( wpautop( $item_info['description'] ) ); ?>
|
||||
<?php if ( ! empty( $item_info['settings'] ) ) : ?>
|
||||
|
@ -1679,18 +1691,6 @@ class WC_Admin_Setup_Wizard {
|
|||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="wc-wizard-service-enable">
|
||||
<span class="wc-wizard-service-toggle <?php echo esc_attr( $should_enable_toggle ? '' : 'disabled' ); ?>">
|
||||
<input
|
||||
id="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>"
|
||||
type="checkbox"
|
||||
name="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>-enabled"
|
||||
value="yes" <?php checked( $should_enable_toggle ); ?>
|
||||
data-plugins="<?php echo wc_esc_json( wp_json_encode( $plugins ) ); ?>"
|
||||
/>
|
||||
<label for="wc-wizard-service-<?php echo esc_attr( $item_id ); ?>">
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<?php
|
||||
}
|
||||
|
@ -1768,7 +1768,7 @@ class WC_Admin_Setup_Wizard {
|
|||
<div class="wc-wizard-service-description">
|
||||
<?php esc_html_e( 'Collect payments from customers offline.', 'woocommerce' ); ?>
|
||||
</div>
|
||||
<div class="wc-wizard-service-enable">
|
||||
<div class="wc-wizard-service-enable" tabindex="0">
|
||||
<input class="wc-wizard-service-list-toggle" id="wc-wizard-service-list-toggle" type="checkbox">
|
||||
<label for="wc-wizard-service-list-toggle"></label>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue