@shopgate/engage
Version:
Shopgate's ENGAGE library.
42 lines (41 loc) • 1.09 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { css } from 'glamor';
import { i18n } from '@shopgate/engage/core';
import { Ripple } from '@shopgate/engage/components';
import TrashOutlineIcon from '@shopgate/pwa-ui-shared/icons/TrashOutlineIcon';
import { jsx as _jsx } from "react/jsx-runtime";
const styles = {
root: css({
display: 'flex',
borderRadius: '50%',
color: 'var(--color-text-high-emphasis)',
fontSize: '1.5rem',
padding: '0 8px 8px 8px',
lineHeight: 1,
outline: 0,
justifyContent: 'center',
alignItems: 'center',
marginRight: -1
}).toString(),
ripple: css({
flexShrink: 0
}).toString()
};
/**
* The remove favorites button component.
* @returns {JSX}
*/
const RemoveButton = ({
onClick
}) => /*#__PURE__*/_jsx("button", {
className: styles.root,
onClick: onClick,
type: "button",
"aria-label": i18n.text('favorites.remove'),
children: /*#__PURE__*/_jsx(Ripple, {
className: styles.ripple,
children: /*#__PURE__*/_jsx(TrashOutlineIcon, {})
})
});
export default RemoveButton;