export { Assistive , BodyHeading , EditorHeading , Paragraph , Heading , SubHeading , SubHeadingSecondary } ; import * as React from 'react' ; import { Text , ITextStyles , ITextProps } from '@fluentui/react/lib/Text' ; import { FontSizes , FontWeights } from '@fluentui/react/lib/Styling' ; import { theme } from '../../core/ui/fluent' ; const assistiveStyles = { root : { fontSize : FontSizes . small , color : theme . palette . neutralPrimary } } ; const headingStyles = { root : { fontWeight : FontWeights . semibold , fontSize : FontSizes . xLarge , color : theme . palette . neutralPrimary } } ; const subHeadingStyles = { root : { fontSize : FontSizes . medium , color : theme . palette . neutralPrimary } } ; const subHeadingSecondaryStyles = { root : { fontSize : FontSizes . smallPlus , color : theme . palette . neutralSecondary } } ; const bodyHeadingStyles = { root : { fontWeight : FontWeights . semibold , fontSize : FontSizes . mediumPlus , color : theme . palette . neutralPrimary , lineHeight : '2.5em' } } ; const editorHeadingStyles = { root : { fontWeight : FontWeights . semibold , fontSize : FontSizes . mediumPlus , color : theme . palette . neutralPrimary } } ; const paragraphStyles = { root : { fontSize : FontSizes . smallPlus , color : theme . palette . neutralPrimary } } ; const Heading = ( props ) => ( < > < div > < Text { ... props } styles = { headingStyles } > { props . children } < /Text> < /div> < />); const SubHeading = ( props ) => ( < > < div > < Text { ... props } styles = { subHeadingStyles } > { props . children } < /Text> < /div> < />); const SubHeadingSecondary = ( props ) => ( < > < div > < Text { ... props } styles = { subHeadingSecondaryStyles } > { props . children } < /Text> < /div> < />); const BodyHeading = ( props ) => ( < > < div > < Text { ... props } styles = { bodyHeadingStyles } > { props . children } < /Text> < /div> < />); const EditorHeading = ( props ) => ( < > < div > < Text { ... props } styles = { editorHeadingStyles } > { props . children } < /Text> < /div> < />); const Paragraph = ( props ) => ( < > < p > < Text { ... props } styles = { paragraphStyles } > { props . children } < /Text> < /p> < />); const Assistive = ( props ) => ( < > < Text { ... props } styles = { assistiveStyles } > { props . children } < /Text> < />);