InputContextWrapper

Wraps its children in a InputContext.
Children can be a ReactNode or a Render Props function receiving TrackingContext.

InputContextWrapper: (props: {
  children: ReactNode | ((parameters: TrackingContext) => ReactNode),
  id: string
}) => ReactElement

Parameters​

type
requiredchildrenReactNode | ((parameters: TrackingContext) => void)
requiredidstring

Returns​

ReactElement

Usage example​

Enrich Locations​

import { InputContextWrapper } from '@objectiv/tracker-react';

<InputContextWrapper id={'email'}>
  <input type={'email'} />
</InputContextWrapper>

Tracking via Render Props​

import { 
  InputContextWrapper, 
  trackInputChangeEvent
} from '@objectiv/tracker-react';

<InputContextWrapper id={'search'}>
  {(trackingContext) => (
    <input 
      type={'text'} 
      onBlur={() => trackInputChangeEvent(trackingContext)} 
    />
  )}
</InputContextWrapper>

info

The above is just an example to illustrate the Render Props functionality.
Check out our Tracked Elements for a ready-to-use TrackedInput component.


Did you know ?

InputContextWrapper internally uses LocationContextWrapper.


See also