Server IP : 172.67.158.161 / Your IP : 3.144.17.193 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/text-input/ |
Upload File : |
/** * External dependencies */ import { forwardRef } from 'react'; import PropTypes from 'prop-types'; import classnames from 'classnames'; import { useState } from '@wordpress/element'; /** * Internal dependencies */ import Label from '../label'; import './style.scss'; const TextInput = forwardRef( ( { className, id, type = 'text', ariaLabel, ariaDescribedBy, label, screenReaderLabel, disabled, help, autoComplete = 'off', value = '', onChange, required = false, onBlur = () => {}, feedback, }, ref ) => { const [ isActive, setIsActive ] = useState( false ); return ( <div className={ classnames( 'wc-block-components-text-input', className, { 'is-active': isActive || value, } ) } > <input type={ type } id={ id } value={ value } ref={ ref } autoComplete={ autoComplete } onChange={ ( event ) => { onChange( event.target.value ); } } onFocus={ () => setIsActive( true ) } onBlur={ () => { onBlur(); setIsActive( false ); } } aria-label={ ariaLabel || label } disabled={ disabled } aria-describedby={ !! help && ! ariaDescribedBy ? id + '__help' : ariaDescribedBy } required={ required } /> <Label label={ label } screenReaderLabel={ screenReaderLabel || label } wrapperElement="label" wrapperProps={ { htmlFor: id, } } htmlFor={ id } /> { !! help && ( <p id={ id + '__help' } className="wc-block-components-text-input__help" > { help } </p> ) } { feedback } </div> ); } ); TextInput.propTypes = { id: PropTypes.string.isRequired, onChange: PropTypes.func.isRequired, value: PropTypes.string, ariaLabel: PropTypes.string, ariaDescribedBy: PropTypes.string, label: PropTypes.string, screenReaderLabel: PropTypes.string, disabled: PropTypes.bool, help: PropTypes.string, autoComplete: PropTypes.string, required: PropTypes.bool, }; export default TextInput; export { default as ValidatedTextInput } from './validated';