Skip to content

Latest commit

 

History

History
42 lines (29 loc) · 1.29 KB

README.md

File metadata and controls

42 lines (29 loc) · 1.29 KB

cycle-cropper

npm version Libraries.io dependency status for GitHub repo npm bundle size npm GitHub

cycle-cropper is component for cropper.js

Usage

import {CropperComponent} from "cycle-cropper";

const main = (sources: Sources): Sinks => {
    const imageInput$ = sources.DOM.select(".image");

    const cropperSinks = CropperComponent({
        DOM: sources.DOM,
        image$: imageInput$,
        props$: Stream.of({ aspectRatio: 1 }) // cropper options
    });

    const imageData$ = cropperSinks.crop$
        .compose(sampleCombine(cropperSinks.cropper$))
        .map(([_, cropper]) => cropper.getCroppedCanvas().toDataURL())

    const dom$ = Stream.of([p("Image Cropper")].concat(cropperSinks.DOM));

    return { DOM: dom$ };
};

run(main, {
    DOM: makeDOMDriver("#app")
});

License

see LICENSE