wix-style-react
Version:
wix-style-react
174 lines (173 loc) • 7.52 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.Footer = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _FooterSt = require("./Footer.st.css");
var _Button = _interopRequireDefault(require("../../../Button"));
var _constants = require("../../constants");
var _Divider = _interopRequireDefault(require("../../../Divider"));
var _BaseModalLayoutContext = require("../../BaseModalLayoutContext");
var _Tooltip = _interopRequireDefault(require("../../../Tooltip"));
var _TooltipCommon = require("../../../common/PropTypes/TooltipCommon");
var _excluded = ["dataHook"],
_excluded2 = ["dataHook"];
var _jsxFileName = "/home/builduser/work/a9c1ac8876d5057c/packages/wix-style-react/dist/cjs/BaseModalLayout/LayoutBlocks/Footer/Footer.js";
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Footer = _ref => {
var {
dataHook,
className,
showFooterDivider = false
} = _ref;
var {
footerClassName,
theme,
actionsSize,
sideActions,
secondaryButtonText,
secondaryButtonOnClick,
secondaryButtonProps,
primaryButtonText,
primaryButtonOnClick,
primaryButtonProps,
primaryButtonTooltipProps
} = (0, _BaseModalLayoutContext.useBaseModalLayoutContext)();
var hasPrimaryButton = primaryButtonText || primaryButtonOnClick || primaryButtonProps;
var hasSecondaryButton = secondaryButtonText || secondaryButtonOnClick || secondaryButtonProps;
var hasFooter = hasPrimaryButton || hasSecondaryButton || sideActions;
return hasFooter && /*#__PURE__*/_react.default.createElement("div", {
"data-hook": dataHook,
"data-divider": showFooterDivider,
className: (0, _FooterSt.st)(_FooterSt.classes.root, {
showDivider: showFooterDivider
}, footerClassName, className),
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 33,
columnNumber: 7
}
}, /*#__PURE__*/_react.default.createElement(_Divider.default, {
className: _FooterSt.classes.divider,
dataHook: _constants.dataHooks.footerDivider,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 43,
columnNumber: 9
}
}), /*#__PURE__*/_react.default.createElement("div", {
className: _FooterSt.classes.innerContent,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 47,
columnNumber: 9
}
}, sideActions && /*#__PURE__*/_react.default.createElement("div", {
"data-hook": _constants.dataHooks.footerSideActions,
className: _FooterSt.classes.sideActions,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 49,
columnNumber: 13
}
}, sideActions), (hasPrimaryButton || hasSecondaryButton) && /*#__PURE__*/_react.default.createElement("div", {
className: _FooterSt.classes.actions,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 57,
columnNumber: 13
}
}, hasSecondaryButton && /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
skin: theme,
size: actionsSize,
onClick: secondaryButtonOnClick,
priority: "secondary"
}, secondaryButtonProps, {
dataHook: _constants.dataHooks.footerSecondaryButton,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 59,
columnNumber: 17
}
}), secondaryButtonText || secondaryButtonProps && secondaryButtonProps.children), hasPrimaryButton && /*#__PURE__*/_react.default.createElement(_Tooltip.default, (0, _extends2.default)({
dataHook: _constants.dataHooks.primaryButtonTooltip,
disabled: !(primaryButtonTooltipProps != null && primaryButtonTooltipProps.content)
}, primaryButtonTooltipProps, {
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 72,
columnNumber: 17
}
}), /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
skin: theme,
size: actionsSize,
onClick: primaryButtonOnClick
}, primaryButtonProps, {
dataHook: _constants.dataHooks.footerPrimaryButton,
__self: void 0,
__source: {
fileName: _jsxFileName,
lineNumber: 77,
columnNumber: 19
}
}), primaryButtonText || (primaryButtonProps == null ? void 0 : primaryButtonProps.children)))))) || null;
};
exports.Footer = Footer;
Footer.displayName = 'BaseModalLayout.Footer';
Footer.propTypes = {
/** additional css classes */
className: _propTypes.default.string,
/** data hook for testing */
dataHook: _propTypes.default.string,
/** a theme for the Footer, will affect footer action buttons skin */
theme: _propTypes.default.oneOf(['standard', 'premium', 'destructive']),
/** will determine the action buttons size*/
actionsSize: _Button.default.propTypes.size,
/** a text for the primary action button */
primaryButtonText: _propTypes.default.string,
/** a callback for when the primary action button is clicked */
primaryButtonOnClick: _propTypes.default.func,
/** Passed to the primary action button as props without any filter / mutation */
primaryButtonProps: (() => {
var _Button$propTypes = _Button.default.propTypes,
{
dataHook
} = _Button$propTypes,
buttonProps = (0, _objectWithoutProperties2.default)(_Button$propTypes, _excluded);
return _propTypes.default.shape(buttonProps);
})(),
/** Allows to pass all common tooltip props */
primaryButtonTooltipProps: _propTypes.default.shape(_objectSpread({
content: _propTypes.default.string
}, _TooltipCommon.TooltipCommonProps)),
/** a text for the secondary action button */
secondaryButtonText: _propTypes.default.string,
/** callback for when the secondary action button is clicked */
secondaryButtonOnClick: _propTypes.default.func,
/** Passed to the secondary button as props without any filter / mutation */
secondaryButtonProps: (() => {
var _Button$propTypes2 = _Button.default.propTypes,
{
dataHook
} = _Button$propTypes2,
buttonProps = (0, _objectWithoutProperties2.default)(_Button$propTypes2, _excluded2);
return _propTypes.default.shape(buttonProps);
})(),
/** side actions node, to be rendered as the first element on the same row as the action buttons */
sideActions: _propTypes.default.node,
/** shows the footer divider */
showFooterDivider: _propTypes.default.bool
};
//# sourceMappingURL=Footer.js.map