import MediaUploader from "../media/MediaUploader";

function Media({ 
    title = 'Input Label', 
    text = 'You can handle the sales notification width.', 
    defaultValue = 'https://placeholder.com/150x150', 
    onChange = () => {}
}) {
  return (
    <div className="strb-offcanvas-option-item strb-d-flex strb-align-items-center strb-justify-content-between strb-flex-wrap">
        <div className="strb-offcanvas-option-content">
            <h4 className="strb-offcanvas-option-title">{title}</h4>
            <p>{text}</p>
        </div>
        <div className="strb-offcanvas-option-action">
            <div className="strb-offcanvas-input">
                <MediaUploader 
                    value={defaultValue}
                    handleChange={onChange}
                />
            </div>
        </div>
    </div>
  )
}

export default Media