OwlCyberSecurity - MANAGER

Edit File: dimension.js

import { useState, useRef } from '@wordpress/element';
import { LabelControl } from './label';

export const DimensionControl = (props) =>{
		
	const { prop, label, value, setAttributes } = props;
	const { name } = prop['c'];
	
	var values = !pagelayer_empty(value) ? value : ['', ''];

if(pagelayer_is_string(values)){
		values = values.split(',');
	}
	
	const [isLinked, setIsLinked] = useState(true);
	const dimensionRef = useRef(null)

return (
		<div className="components-base-control pagelayer-base-control" ref={dimensionRef}>
			<LabelControl {...props}/>
			<div className="pagelayer-elp-dimension-div">
				<input
					type="number"
					className="pagelayer-elp-dimension"
					value={parseFloat(values[0])}
					onChange={(e) => handleInputChange(0, e)}
				/>
				<input
					type="number"
					className="pagelayer-elp-dimension"
					value={parseFloat(values[1])}
					onChange={(e) => handleInputChange(1, e)}
				/>
				<i
				className={`pli pli-link${isLinked ? ' pagelayer-elp-padding-linked' : ''}`}
				onClick={ () => setIsLinked(!isLinked) }
				></i>
			</div>
		</div>
	);
}