@wix/design-system
Version:
@wix/design-system
142 lines (140 loc) • 4.89 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _MarketingPageLayoutSt = require("./MarketingPageLayout.st.css.js");
var _constants = require("./constants");
var _Layout = require("../Layout");
var _Divider = _interopRequireDefault(require("../Divider"));
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/MarketingPageLayout/MarketingPageLayout.js";
/** Marketing Page Layout */
class MarketingPageLayout extends _react.default.PureComponent {
render() {
var {
dataHook,
className,
horizontalSize,
verticalSize,
removeImageHorizontalPadding,
removeImageVerticalPadding,
content,
image,
footer,
height,
fullHeightImage
} = this.props;
return /*#__PURE__*/_react.default.createElement(_Layout.Layout, {
dataHook: dataHook,
className: (0, _MarketingPageLayoutSt.st)(_MarketingPageLayoutSt.classes.root, {
horizontalSize,
verticalSize,
removeImageHorizontalPadding,
removeImageVerticalPadding
}, className),
height: height,
gap: 0,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 28,
columnNumber: 7
}
}, content && /*#__PURE__*/_react.default.createElement(_Layout.Cell, {
span: 6,
vertical: true,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 44,
columnNumber: 11
}
}, /*#__PURE__*/_react.default.createElement("div", {
"data-hook": _constants.dataHooks.contentContainer,
className: _MarketingPageLayoutSt.classes.contentContainer,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 45,
columnNumber: 13
}
}, content)), image && /*#__PURE__*/_react.default.createElement(_Layout.Cell, {
span: 6,
className: _MarketingPageLayoutSt.classes.imageCell,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 54,
columnNumber: 11
}
}, /*#__PURE__*/_react.default.createElement("div", {
"data-hook": _constants.dataHooks.imageContainer,
className: (0, _MarketingPageLayoutSt.st)(_MarketingPageLayoutSt.classes.imageContainer, {
full: fullHeightImage
}),
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 55,
columnNumber: 13
}
}, image)), footer && /*#__PURE__*/_react.default.createElement(_Layout.Cell, {
span: 12,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 66,
columnNumber: 11
}
}, /*#__PURE__*/_react.default.createElement(_Divider.default, {
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 67,
columnNumber: 13
}
}), /*#__PURE__*/_react.default.createElement("div", {
"data-hook": _constants.dataHooks.footerContainer,
className: _MarketingPageLayoutSt.classes.footerContainer,
__self: this,
__source: {
fileName: _jsxFileName,
lineNumber: 68,
columnNumber: 13
}
}, footer)));
}
}
MarketingPageLayout.displayName = 'MarketingPageLayout';
MarketingPageLayout.propTypes = {
/** Applies a data-hook HTML attribute that can be used in the tests. */
dataHook: _propTypes.default.string,
/** Specifies a CSS class name to be appended to the component’s root element.
* @internal
*/
className: _propTypes.default.string,
/** Controls horizontal padding size. */
horizontalSize: _propTypes.default.oneOf(['medium', 'large']),
/** Controls vertical padding size. */
verticalSize: _propTypes.default.oneOf(['medium', 'large']),
/** Specifies whether to remove image side paddings. */
removeImageHorizontalPadding: _propTypes.default.bool,
/** Specifies whether to remove image vertical paddings. */
removeImageVerticalPadding: _propTypes.default.bool,
/** Defines page content. In the majority of cases should use `<MarketingPageLayoutContent/>` component as a content. */
content: _propTypes.default.node,
/** Accepts link to an image source or a custom media element. */
image: _propTypes.default.node,
/** Accepts content to be displayed at the bottom of a page. */
footer: _propTypes.default.node
};
MarketingPageLayout.defaultProps = {
horizontalSize: 'large',
verticalSize: 'large',
removeImageHorizontalPadding: false,
removeImageVerticalPadding: false,
fullheightImage: false
};
var _default = exports.default = MarketingPageLayout;
//# sourceMappingURL=MarketingPageLayout.js.map