fixed min-value-setter issue

This commit is contained in:
Syed Ali Shahbaz 2021-08-13 18:37:26 +05:30
parent c3959e3cd4
commit 81c16fea23
2 changed files with 7 additions and 7 deletions

View file

@ -49,7 +49,6 @@ export default function ImageUploader({target, id, buttonMsg, handleAvatarChange
} }
const handleZoomSliderChange = ([value]) => { const handleZoomSliderChange = ([value]) => {
console.log(value);
value < 1 ? setZoom(1) : setZoom(value); value < 1 ? setZoom(1) : setZoom(value);
// setZoom(e[0]); // setZoom(e[0]);
} }
@ -192,15 +191,15 @@ export default function ImageUploader({target, id, buttonMsg, handleAvatarChange
</div> </div>
<Slider <Slider
value={zoom} value={zoom}
min="1" min={1}
max="3" max={3}
step="0.1" step={0.1}
label="Slide to zoom, drag to reposition" label="Slide to zoom, drag to reposition"
changeHandler={handleZoomSliderChange} changeHandler={handleZoomSliderChange}
/> />
</div> </div>
} }
<label htmlFor={id} className="mt-4 cursor-pointer inline-flex items-center px-4 py-1 border border-gray-300 shadow-sm text-xs font-medium rounded-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-500;">Choose a file...</label> <label htmlFor={id} className="mt-8 cursor-pointer inline-flex items-center px-4 py-1 border border-gray-300 shadow-sm text-xs font-medium rounded-sm text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-neutral-500;">Choose a file...</label>
<input <input
onChange={ImageUploadHandler} onChange={ImageUploadHandler}
ref={imageFileRef} ref={imageFileRef}
@ -208,7 +207,7 @@ export default function ImageUploader({target, id, buttonMsg, handleAvatarChange
id={id} id={id}
name={id} name={id}
placeholder="Upload image" placeholder="Upload image"
className="mt-4 cursor-pointer opacity-0 absolute" className="mt-4 pointer-events-none opacity-0 absolute"
accept="image/*" accept="image/*"
/> />
</div> </div>

View file

@ -5,8 +5,9 @@ import * as SliderPrimitive from '@radix-ui/react-slider';
const Slider = ({value, min, max, step, label, changeHandler}) => ( const Slider = ({value, min, max, step, label, changeHandler}) => (
<SliderPrimitive.Root <SliderPrimitive.Root
className="slider" className="slider mt-2"
// defaultValue={[value]} // defaultValue={[value]}
min={min}
step={step} step={step}
max={max} max={max}
value={[value]} value={[value]}