1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 04:37:13 +01:00
metamask-extension/ui/components/app/flask/snap-ui-markdown/snap-ui-markdown.js
Frederik Bolding 7e7a0f1f72
[FLASK] Use custom UI for transaction insights (#16912)
* Allow custom UI for transaction insights

* Fix margin

* Small fixes to CSS and selectors

* Rename property

* Fix E2E locally

* Bump test-snaps

* Bump test-snaps
2022-12-20 11:44:49 +01:00

29 lines
655 B
JavaScript

import React from 'react';
import PropTypes from 'prop-types';
import ReactMarkdown from 'react-markdown';
import { TYPOGRAPHY } from '../../../../helpers/constants/design-system';
import Typography from '../../../ui/typography/typography';
const Paragraph = (props) => (
<Typography
{...props}
variant={TYPOGRAPHY.H6}
className="snap-ui-markdown__text"
/>
);
export const SnapUIMarkdown = ({ children }) => {
return (
<ReactMarkdown
allowedElements={['p', 'strong', 'em']}
components={{ p: Paragraph }}
>
{children}
</ReactMarkdown>
);
};
SnapUIMarkdown.propTypes = {
children: PropTypes.string,
};