wix-style-react
Version:
wix-style-react
44 lines • 1.86 kB
TypeScript
export default Proportion;
declare class Proportion extends React.PureComponent<any, any, any> {
static PREDEFINED_RATIOS: {
square: number;
portrait: number;
cinema: number;
landscape: number;
none: string;
};
static displayName: string;
static propTypes: {
/** Applied as data-hook HTML attribute that can be used in the tests */
dataHook: PropTypes.Requireable<string>;
/** Children to render. */
children: PropTypes.Validator<NonNullable<PropTypes.ReactNodeLike>>;
/** A css class to be applied to the component's root element */
className: PropTypes.Requireable<string>;
/** Condition for wrapping content with Proportion or return original */
/** Predefined Proportion.square (1), Proportion.portrait (3/4), Proportion.cinema (16/9), Proportion.landscape (4/3), or a custom number (width / height) or 'none' for original size */
aspectRatio: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
};
static defaultProps: {
aspectRatio: number;
};
constructor(props: any);
constructor(props: any, context: any);
render(): React.JSX.Element;
_getContent(disabled: any): any;
/**
* This is based on Noam Rosenthal's (noamr@wix.com) solution
* which can be found here: https://codeburst.io/keeping-aspect-ratio-with-html-and-no-padding-tricks-40705656808b
*
* The solution uses the fact that SVGs can maintain aspect ratio's natively.
* In addition we use an img element for this solution to work correctly in IE
* */
_getAspectRatioHolder(): React.JSX.Element;
_getRatio(): {
width: number;
height: number;
};
}
import React from 'react';
import PropTypes from 'prop-types';
//# sourceMappingURL=Proportion.d.ts.map