parent
1fa9402453
commit
7c99df33ad
|
@ -90,6 +90,7 @@ export const TextLink = observer(function TextLink({
|
||||||
text,
|
text,
|
||||||
numberOfLines,
|
numberOfLines,
|
||||||
lineHeight,
|
lineHeight,
|
||||||
|
dataSet,
|
||||||
}: {
|
}: {
|
||||||
testID?: string
|
testID?: string
|
||||||
type?: TypographyVariant
|
type?: TypographyVariant
|
||||||
|
@ -98,6 +99,7 @@ export const TextLink = observer(function TextLink({
|
||||||
text: string | JSX.Element | React.ReactNode
|
text: string | JSX.Element | React.ReactNode
|
||||||
numberOfLines?: number
|
numberOfLines?: number
|
||||||
lineHeight?: number
|
lineHeight?: number
|
||||||
|
dataSet?: any
|
||||||
}) {
|
}) {
|
||||||
const {...props} = useLinkProps({to: href})
|
const {...props} = useLinkProps({to: href})
|
||||||
const store = useStores()
|
const store = useStores()
|
||||||
|
@ -117,6 +119,8 @@ export const TextLink = observer(function TextLink({
|
||||||
style={style}
|
style={style}
|
||||||
numberOfLines={numberOfLines}
|
numberOfLines={numberOfLines}
|
||||||
lineHeight={lineHeight}
|
lineHeight={lineHeight}
|
||||||
|
// @ts-ignore web only -prf
|
||||||
|
dataSet={dataSet}
|
||||||
{...props}>
|
{...props}>
|
||||||
{text}
|
{text}
|
||||||
</Text>
|
</Text>
|
||||||
|
|
|
@ -8,6 +8,8 @@ import {toShortUrl} from 'lib/strings/url-helpers'
|
||||||
import {useTheme, TypographyVariant} from 'lib/ThemeContext'
|
import {useTheme, TypographyVariant} from 'lib/ThemeContext'
|
||||||
import {usePalette} from 'lib/hooks/usePalette'
|
import {usePalette} from 'lib/hooks/usePalette'
|
||||||
|
|
||||||
|
const WORD_WRAP = {wordWrap: 1}
|
||||||
|
|
||||||
export function RichText({
|
export function RichText({
|
||||||
testID,
|
testID,
|
||||||
type = 'md',
|
type = 'md',
|
||||||
|
@ -39,7 +41,8 @@ export function RichText({
|
||||||
lineHeight: 30,
|
lineHeight: 30,
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<Text testID={testID} style={[style, pal.text]}>
|
// @ts-ignore web only -prf
|
||||||
|
<Text testID={testID} style={[style, pal.text]} dataSet={WORD_WRAP}>
|
||||||
{text}
|
{text}
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
|
@ -48,7 +51,9 @@ export function RichText({
|
||||||
<Text
|
<Text
|
||||||
testID={testID}
|
testID={testID}
|
||||||
type={type}
|
type={type}
|
||||||
style={[style, pal.text, lineHeightStyle]}>
|
style={[style, pal.text, lineHeightStyle]}
|
||||||
|
// @ts-ignore web only -prf
|
||||||
|
dataSet={WORD_WRAP}>
|
||||||
{text}
|
{text}
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
|
@ -72,6 +77,7 @@ export function RichText({
|
||||||
text={segment.text}
|
text={segment.text}
|
||||||
href={`/profile/${mention.did}`}
|
href={`/profile/${mention.did}`}
|
||||||
style={[style, lineHeightStyle, pal.link]}
|
style={[style, lineHeightStyle, pal.link]}
|
||||||
|
dataSet={WORD_WRAP}
|
||||||
/>,
|
/>,
|
||||||
)
|
)
|
||||||
} else if (link && AppBskyRichtextFacet.validateLink(link).success) {
|
} else if (link && AppBskyRichtextFacet.validateLink(link).success) {
|
||||||
|
@ -82,6 +88,7 @@ export function RichText({
|
||||||
text={toShortUrl(segment.text)}
|
text={toShortUrl(segment.text)}
|
||||||
href={link.uri}
|
href={link.uri}
|
||||||
style={[style, lineHeightStyle, pal.link]}
|
style={[style, lineHeightStyle, pal.link]}
|
||||||
|
dataSet={WORD_WRAP}
|
||||||
/>,
|
/>,
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
|
@ -94,7 +101,9 @@ export function RichText({
|
||||||
testID={testID}
|
testID={testID}
|
||||||
type={type}
|
type={type}
|
||||||
style={[style, pal.text, lineHeightStyle]}
|
style={[style, pal.text, lineHeightStyle]}
|
||||||
numberOfLines={numberOfLines}>
|
numberOfLines={numberOfLines}
|
||||||
|
// @ts-ignore web only -prf
|
||||||
|
dataSet={WORD_WRAP}>
|
||||||
{els}
|
{els}
|
||||||
</Text>
|
</Text>
|
||||||
)
|
)
|
||||||
|
|
|
@ -72,6 +72,11 @@
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Styling hacks */
|
||||||
|
*[data-word-wrap] {
|
||||||
|
word-break: break-word;
|
||||||
|
}
|
||||||
|
|
||||||
/* ProseMirror */
|
/* ProseMirror */
|
||||||
.ProseMirror {
|
.ProseMirror {
|
||||||
font: 18px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
font: 18px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||||
|
|
Loading…
Reference in New Issue