DSMessage.jsx (1136B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this file, 3 * You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 import React from "react"; 6 import { SafeAnchor } from "../SafeAnchor/SafeAnchor"; 7 import { FluentOrText } from "content-src/components/FluentOrText/FluentOrText"; 8 9 export class DSMessage extends React.PureComponent { 10 render() { 11 return ( 12 <div className="ds-message"> 13 <header className="title"> 14 {this.props.icon && ( 15 <div 16 className="glyph" 17 style={{ backgroundImage: `url(${this.props.icon})` }} 18 /> 19 )} 20 {this.props.title && ( 21 <span className="title-text"> 22 <FluentOrText message={this.props.title} /> 23 </span> 24 )} 25 {this.props.link_text && this.props.link_url && ( 26 <SafeAnchor className="link" url={this.props.link_url}> 27 <FluentOrText message={this.props.link_text} /> 28 </SafeAnchor> 29 )} 30 </header> 31 </div> 32 ); 33 } 34 }