@novin-dev/formalite
Version:
Generate MUI form with few line of code
53 lines (46 loc) • 2.84 kB
JavaScript
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var tslib = require('tslib');
var React = require('react');
var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
var material = require('@mui/material');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
function Image(_a) {
var ratio = _a.ratio, _b = _a.disabledEffect, disabledEffect = _b === void 0 ? false : _b, _c = _a.effect, effect = _c === void 0 ? "blur" : _c, sx = _a.sx, other = tslib.__rest(_a, ["ratio", "disabledEffect", "effect", "sx"]);
if (ratio) {
return (React__default["default"].createElement(material.Box, { component: "span", sx: tslib.__assign({ width: 1, lineHeight: 0, display: "block", overflow: "hidden", position: "relative", pt: getRatio(ratio), "& .wrapper": {
top: 0,
left: 0,
right: 0,
bottom: 0,
lineHeight: 0,
position: "absolute",
backgroundSize: "cover !important",
} }, sx) },
React__default["default"].createElement(material.Box, tslib.__assign({ component: reactLazyLoadImageComponent.LazyLoadImage, wrapperClassName: "wrapper", effect: disabledEffect ? undefined : effect, placeholderSrc: "https://zone-assets-api.vercel.app/assets/img_placeholder.svg", sx: { width: 1, height: 1, objectFit: "cover" } }, other))));
}
return (React__default["default"].createElement(material.Box, { component: "span", sx: tslib.__assign({ lineHeight: 0, display: "block", overflow: "hidden", "& .wrapper": {
width: 1,
height: 1,
backgroundSize: "cover !important",
} }, sx) },
React__default["default"].createElement(material.Box, tslib.__assign({ component: reactLazyLoadImageComponent.LazyLoadImage, wrapperClassName: "wrapper", effect: disabledEffect ? undefined : effect, placeholderSrc: "https://zone-assets-api.vercel.app/assets/img_placeholder.svg", sx: { width: 1, height: 1, objectFit: "cover" } }, other))));
}
// ----------------------------------------------------------------------
function getRatio(ratio) {
if (ratio === void 0) { ratio = "1/1"; }
return {
"4/3": "calc(100% / 4 * 3)",
"3/4": "calc(100% / 3 * 4)",
"6/4": "calc(100% / 6 * 4)",
"4/6": "calc(100% / 4 * 6)",
"16/9": "calc(100% / 16 * 9)",
"9/16": "calc(100% / 9 * 16)",
"21/9": "calc(100% / 21 * 9)",
"9/21": "calc(100% / 9 * 21)",
"1/1": "100%",
}[ratio];
}
exports.Image = Image;
//# sourceMappingURL=Image.js.map