How to use the @wordpress/compose.pure function in @wordpress/compose

aria-label={ __(
								'Alpha value, from 0 (transparent) to 1 (fully opaque).'
							) }
							className="components-color-picker__alpha-pointer"
							style={ pointerLocation }
							onKeyDown={ this.preventKeyEvents }
						/>
					
					{ /* eslint-enable jsx-a11y/no-static-element-interactions */ }
				
			
		);
	}
}

export default pure( Alpha );

const { label, value, ...props } = this.props;
		return (
			 this.handleChange( newValue ) }
				onBlur={ this.handleBlur }
				onKeyDown={ this.handleKeyDown }
				{ ...omit( props, [ 'onChange', 'valueKey', 'source' ] ) }
			/>
		);
	}
}

const PureIconButton = pure( IconButton );

export class Inputs extends Component {
	constructor( { hsl } ) {
		super( ...arguments );

		const view = hsl.a === 1 ? 'hex' : 'rgb';
		this.state = { view };

		this.toggleViews = this.toggleViews.bind( this );
		this.resetDraftValues = this.resetDraftValues.bind( this );
		this.handleChange = this.handleChange.bind( this );
		this.normalizeValue = this.normalizeValue.bind( this );
	}

	static getDerivedStateFromProps( props, state ) {
		if ( props.hsl.a !== 1 && state.view === 'hex' ) {

stepValue: PropTypes.oneOfType( [
		PropTypes.number,
		PropTypes.string,
	] ),
	clickable: PropTypes.bool,
	action: PropTypes.func,
};

StepBubble.defaultProps = {
	isActive: false,
	stepValue: 1,
	clickable: true,
	action: () => null,
};

export default pure( StepBubble );

/**
 * External imports
 */
import PropTypes from 'prop-types';
import { pure } from '@wordpress/compose';


export const StepText = ( { content } ) => {
	return <span>
		{ content }
	</span>;
};

StepText.propTypes = { content: PropTypes.string.isRequired };

export default pure( StepText );