wix-style-react/dist/es/src/AnnouncementModalLayout/AnnouncementModalLayout.js

wix-style-react

import React from 'react';
import PropTypes from 'prop-types';
import { st, classes } from './AnnouncementModalLayout.st.css';
import TextButton from '../TextButton';
import { dataHooks } from './constants';
import BaseModalLayout from '../BaseModalLayout';
import Button from '../Button';
import { WixStyleReactContext } from '../WixStyleReactProvider/context';
/** A layout for announcement modals, to be used inside a <Modal /> */
const AnnouncementModalLayout = ({ theme = 'standard', actionsSize = 'medium', ...propsWithoutDefaults }) => {
    const { className, children, ...restProps } = {
        theme,
        actionsSize,
        ...propsWithoutDefaults,
    };
    return (React.createElement(WixStyleReactContext.Consumer, null, ({ newColorsBranding }) => (
    // @ts-ignore
    React.createElement(BaseModalLayout, { className: st(classes.announcementModalLayout, className), ...restProps },
        React.createElement(BaseModalLayout.Illustration, null),
        React.createElement(BaseModalLayout.Header, { titleSize: newColorsBranding ? 'extraLarge' : 'large' }),
        React.createElement(BaseModalLayout.Content, { hideTopScrollDivider: true, hideBottomScrollDivider: true }, children),
        React.createElement(BaseModalLayout.Footer, null),
        React.createElement(Link, { ...restProps }),
        React.createElement("div", { className: classes.bottomSpacing }),
        React.createElement(BaseModalLayout.Footnote, null)))));
};
const Link = ({ linkText, linkOnClick, theme, }) => ((linkText || linkOnClick) && (React.createElement("div", { className: classes.link },
    React.createElement(TextButton, { size: "small", weight: "normal", dataHook: dataHooks.link, onClick: linkOnClick, skin: theme }, linkText)))) ||
    null;
AnnouncementModalLayout.displayName = 'AnnouncementModalLayout';
AnnouncementModalLayout.propTypes = {
    className: PropTypes.string,
    dataHook: PropTypes.string,
    onCloseButtonClick: PropTypes.func,
    onHelpButtonClick: PropTypes.func,
    theme: PropTypes.oneOf(['standard', 'premium']),
    title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    subtitle: PropTypes.string,
    content: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    actionsSize: Button.propTypes.size,
    primaryButtonText: PropTypes.string,
    primaryButtonOnClick: PropTypes.func,
    primaryButtonProps: (() => {
        const { dataHook, ...buttonProps } = Button.propTypes;
        return PropTypes.shape(buttonProps);
    })(),
    secondaryButtonText: PropTypes.string,
    secondaryButtonOnClick: PropTypes.func,
    secondaryButtonProps: (() => {
        const { dataHook, ...buttonProps } = Button.propTypes;
        return PropTypes.shape(buttonProps);
    })(),
    sideActions: PropTypes.node,
    footnote: PropTypes.node,
    illustration: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
    linkText: PropTypes.string,
    linkOnClick: PropTypes.func,
};
export default AnnouncementModalLayout;
//# sourceMappingURL=AnnouncementModalLayout.js.map