Range

TwebMetaRangeControl

{ label, help, min, max, step, beforeIcon, metaKey* }

/**
 * @param {string} [label] - Component label.
 * @param {string} [help] - Component description.
 * @param {number} [min] - Minimum value (default: 0).
 * @param {number} [max] - Maximum value (default: 100).
 * @param {number} [step] - Step value (default: 1).
 * @param {React.ReactNode} [beforeIcon] - Icon before the slider.
 * @param {string} metaKey - Registered meta key from register_post_meta().
 */

functions.php

register_post_meta( 'post_type_name', 'test_range', array(
	'type'         => 'number',
	'default'      => 3,
	'single'       => true,
	'show_in_rest' => true,
) );

index.js

import {
	TwebMetaRangeControl,
} from '@tigriweb/components/meta';

index.js | PanelBody

<TwebMetaRangeControl
	label={ __('Range Label', 'your-theme-name') }
	help={ __('Range Description', 'your-theme-name') }
	min="3"
	max="13"
	step="2"
	metaKey="test_range"
/>