Repository URL to install this package:
|
Version:
0.0.11 ▾
|
import * as React from 'react';
import { Image as BaseImage } from '@skava/ui/dist/components/atoms/Image';
import { Magnifier } from './Magnifier';
import { isImageLike } from './deps';
// className
// classes
// classList
// containerClasses
// containerClassName
// figureClassName
// captionClass
// captionClassName
//
// isImage
// isZoom
class Image extends React.PureComponent {
constructor() {
super(...arguments);
this.labelFor = () => {
// NOTE: these are alternative text props from reference-store
const { caption, text, captionText, labelText } = this.props;
return caption || text || captionText || labelText;
};
this.noWrapFor = () => {
const { Wrap, hasNoWrap, nowrap } = this.props;
return hasNoWrap || nowrap || Wrap === undefined;
};
this.sourceFor = () => {
const { src, alt, imageSrc, imageSource, alternateImage, url } = this.props;
const source = src || imageSrc || imageSource || url || alternateImage;
return isImageLike(alt) ? alt : source || '';
};
this.renderCaption = () => {
const { children } = this.props;
const label = this.labelFor();
return (React.createElement("figure", null,
children,
React.createElement("figcaption", null, label)));
};
this.renderMagnifier = () => {
const { width, height, className, alt, imgWidth, imgHeight } = this.props;
const src = this.sourceFor();
const nowrap = this.noWrapFor();
const qa = this.props.qa || this.props['data-qa'];
const props = {
alt,
width,
height,
nowrap,
className,
src,
imgWidth,
imgHeight,
'zoomFactor': 1.5,
'zoomImgSrc': src,
'data-qa': qa,
};
console.log('-- Magnifier: ', props);
return React.createElement(Magnifier, Object.assign({}, props));
};
this.renderWrapper = () => {
const { Wrap, children } = this.props;
return React.createElement(Wrap, null, children);
};
}
render() {
// NOTE: these props are for Image in the ui-component-library
const { width, height, className, children, alt } = this.props;
const { Wrap, enableZoom } = this.props;
const src = this.sourceFor();
const label = this.labelFor();
const nowrap = this.noWrapFor();
const qa = this.props.qa || this.props['data-qa'];
const props = {
alt,
width,
height,
nowrap,
className,
children,
src,
'data-qa': qa,
};
if (label) {
props.renderWrapper = this.renderCaption;
}
else if (Wrap) {
props.renderWrapper = this.renderWrapper;
}
if (enableZoom) {
props.renderImage = this.renderMagnifier;
}
return React.createElement(BaseImage, Object.assign({}, props));
}
}
export { Image };
export default Image;
//# sourceMappingURL=Image.js.map