Server IP : 104.21.14.103 / Your IP : 18.222.3.153 Web Server : LiteSpeed System : Linux business53.web-hosting.com 4.18.0-553.lve.el8.x86_64 #1 SMP Mon May 27 15:27:34 UTC 2024 x86_64 User : giankuin ( 1871) PHP Version : 7.4.33 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : ON | Sudo : OFF | Pkexec : OFF Directory : /proc/thread-self/root/home/giankuin/sieuthiweb.com.vn/wp-content/plugins/woocommerce/packages/woocommerce-blocks/assets/js/base/components/state-input/ |
Upload File : |
/** * External dependencies */ import { __ } from '@wordpress/i18n'; import PropTypes from 'prop-types'; import { decodeEntities } from '@wordpress/html-entities'; import { useCallback } from '@wordpress/element'; /** * Internal dependencies */ import { ValidatedTextInput } from '../text-input'; import { ValidatedSelect } from '../select'; const StateInput = ( { className, id, states, country, label, onChange, autoComplete = 'off', value = '', required = false, } ) => { const countryStates = states[ country ]; const options = countryStates ? Object.keys( countryStates ).map( ( key ) => ( { key, name: decodeEntities( countryStates[ key ] ), } ) ) : []; /** * Handles state selection onChange events. Finds a matching state by key or value. * * @param {Object} event event data. */ const onChangeState = useCallback( ( stateValue ) => { if ( options.length > 0 ) { const foundOption = options.find( ( option ) => option.key === stateValue || option.name === stateValue ); onChange( foundOption ? foundOption.key : '' ); return; } onChange( stateValue ); }, [ onChange, options ] ); if ( options.length > 0 ) { return ( <> <ValidatedSelect className={ className } id={ id } label={ label } onChange={ onChangeState } options={ options } value={ options.find( ( option ) => option.key === value ) } errorMessage={ __( 'Please select a state.', 'woocommerce' ) } required={ required } /> { autoComplete !== 'off' && ( <input type="text" aria-hidden={ true } autoComplete={ autoComplete } value={ value } onChange={ ( event ) => onChangeState( event.target.value ) } style={ { minHeight: '0', height: '0', border: '0', padding: '0', position: 'absolute', } } tabIndex={ -1 } /> ) } </> ); } return ( <ValidatedTextInput className={ className } id={ id } label={ label } onChange={ onChangeState } autoComplete={ autoComplete } value={ value } required={ required } /> ); }; StateInput.propTypes = { states: PropTypes.objectOf( PropTypes.oneOfType( [ PropTypes.array, PropTypes.objectOf( PropTypes.string ), ] ) ).isRequired, onChange: PropTypes.func.isRequired, autoComplete: PropTypes.string, id: PropTypes.string, className: PropTypes.string, country: PropTypes.string, label: PropTypes.string, value: PropTypes.string, }; export default StateInput;