react-image-magnify/dist/es/lens/negative-space/LensLeft.js

A responsive image zoom component designed for shopping sites.

import React from 'react';
import objectAssign from 'object-assign';
import clamp from 'clamp';
import Lens from './Lens';
import LensPropTypes from '../../prop-types/Lens';

var LensLeft = function LensLeft(_ref) {
    var cursorOffset = _ref.cursorOffset,
        position = _ref.position,
        fadeDurationInMs = _ref.fadeDurationInMs,
        isActive = _ref.isActive,
        isPositionOutside = _ref.isPositionOutside,
        smallImage = _ref.smallImage,
        parentSpecifiedStyle = _ref.style;

    var clearLensHeight = cursorOffset.y * 2;
    var clearLensWidth = cursorOffset.x * 2;
    var maxHeight = smallImage.height - clearLensHeight;
    var maxWidth = smallImage.width - clearLensWidth;
    var height = clearLensHeight;
    var width = clamp(position.x - cursorOffset.x, 0, maxWidth);
    var top = clamp(position.y - cursorOffset.y, 0, maxHeight);
    var computedStyle = {
        height: height + 'px',
        width: width + 'px',
        top: top + 'px',
        left: '0px'
    };

    return React.createElement(Lens, {
        fadeDurationInMs: fadeDurationInMs,
        isActive: isActive,
        isPositionOutside: isPositionOutside,
        style: objectAssign({}, parentSpecifiedStyle, computedStyle)
    });
};

LensLeft.propTypes = LensPropTypes;

export default LensLeft;