Block height control

The T2 block height control lets you select a height size from a range of sizes.
This control is used by the T2 custom support for minimum block height.

link Example

import { BlockHeightControl } from '@t2/editor';

const { attributes, setAttributes } = props;
const { minHeight = 'none' } = attributes;
const sizes = [
	{
		value: 'none',
		label: __('None', 't2'),
	},
	{
		value: 'small',
		label: __('Small', 't2'),
	},
	{
		value: 'medium',
		label: __('Medium', 't2'),
	},
	{
		value: 'large',
		label: __('Large', 't2'),
	},
];

<BlockHeightControl
	label={__('Min height', 't2')}
	value={minHeight}
	sizes={sizes}
	onChange={(value) =>
		setAttributes({ minHeight: value })
	}
/>

link Available props

Prop	Type	Description
label?	string	The control label.
value	string	The selected height size.
sizes?	Array<object>	An array of available height size objects.
onChange	(value: string) => void	Returns the selected height size.

If the sizes array is empty, the control uses the default
sizes: none, small, medium and large