Sha256: 6ae7091a5cc9b511af3dcbf636b3e505804a94de2c84a0c62732eda168ab8378
Contents?: true
Size: 803 Bytes
Versions: 948
Compression:
Stored size: 803 Bytes
Contents
import React, { useEffect, useRef } from 'react'
import { Body, PhoneNumberInput } from 'playbook-ui'
const PhoneNumberInputAccessInputElement = (props) => {
// 1. Create a ref - this accesses the kit's input element.
const ref = useRef()
// 2. Add any event listener to ref.current.inputNode() inside a useEffect hook and trigger it once.
useEffect(() => {
ref.current.inputNode().addEventListener("click", () => alert("Clicked!"))
}, [])
// 3. Pass the ref to the ref prop.
return (
<>
<Body text="Click the input field below:" />
<PhoneNumberInput
id="access-input-element"
ref={ref}
{...props}
/>
</>
)
}
export default PhoneNumberInputAccessInputElement
Version data entries
948 entries across 948 versions & 2 rubygems