saagie-ui
Version:
Saagie UI from Saagie Design System
44 lines (39 loc) • 1.06 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { Button } from '../../atoms/button/Button';
const propTypes = {
children: PropTypes.string,
className: PropTypes.string,
icon: PropTypes.element,
/**
* The component used for the root node.
* Either a string to use a DOM element or a component.
*/
tag: PropTypes.elementType,
};
const defaultProps = {
children: '',
className: '',
icon: null,
tag: Button,
};
export const PagePopinActionButton = ({
children, className, icon, tag: Tag, ...props
}) => (
<div className="sui-o-page-popin__action">
<Tag className={`sui-o-page-popin__button as--show-label@xs ${className}`} {...props}>
{!!icon && (
<span className="sui-o-page-popin__button-icon">
{icon}
</span>
)}
{!!children && (
<span className="sui-o-page-popin__button-label">
{children}
</span>
)}
</Tag>
</div>
);
PagePopinActionButton.propTypes = propTypes;
PagePopinActionButton.defaultProps = defaultProps;