Install

npm install @zym-com/video

or

yarn add @zym-com/video

Import

import Video from "@zym-com/video";
import "@zym-com/video/dist/style.css";

Usage

import Video from "@zym-com/video";
import "@zym-com/video/dist/style.css";

function App() {
  const options ={
    "configuration": {
        "mixBlendModetype": false,
        "mixBlendMode": "normal",
        "videoUrl": "video.mp4",
        "imageUrl": "",
        "objectFit": "initial",
        "opacity": 1,
        "autoPlay": true,
        "controls": true,
        "loop": true,
        "muted": true,
        "preoadselect": "none",
        "controlslist": "",
        "blur": 5,
        "brightness": 100,
        "contrast": 100,
        "grayscale": 50,
        "hueRotate": 180,
        "invert": 50,
        "saturate": 100,
        "sepia": 50,
        "textShadowName": {
            "shadowOffsetX": 0,
            "shadowOffsetY": 0,
            "shadowBlur": 0,
            "shadowColor": "rgba(255,255,255,1)"
        },
        "videoStyle": true,
        "blur_form": false,
        "brightness_form": false,
        "contrast_form": false,
        "grayscale_form": false,
        "hueRotate_form": false,
        "invert_form": false,
        "saturate_form": false,
        "sepia_form": false,
        "textShadowName_form": false
    },
    "base": {
        "width": 300,
        "height": 200
    },
    "dataSource": [
        {
            "value": ""
        }
    ],
    bindCallbackParams:(evenName: string, data: Record<string, any>) => void;
  }
  return (
    <>
      <Video {...options} />
    </>
  );
}

export default App;