add title attr to text text links
This commit is contained in:
@@ -135,6 +135,7 @@ export const TextLink = observer(function TextLink({
|
|||||||
numberOfLines,
|
numberOfLines,
|
||||||
lineHeight,
|
lineHeight,
|
||||||
dataSet,
|
dataSet,
|
||||||
|
title,
|
||||||
}: {
|
}: {
|
||||||
testID?: string
|
testID?: string
|
||||||
type?: TypographyVariant
|
type?: TypographyVariant
|
||||||
@@ -144,10 +145,12 @@ export const TextLink = observer(function TextLink({
|
|||||||
numberOfLines?: number
|
numberOfLines?: number
|
||||||
lineHeight?: number
|
lineHeight?: number
|
||||||
dataSet?: any
|
dataSet?: any
|
||||||
|
title?: string
|
||||||
} & TextProps) {
|
} & TextProps) {
|
||||||
const {...props} = useLinkProps({to: sanitizeUrl(href)})
|
const {...props} = useLinkProps({to: sanitizeUrl(href)})
|
||||||
const store = useStores()
|
const store = useStores()
|
||||||
const navigation = useNavigation<NavigationProp>()
|
const navigation = useNavigation<NavigationProp>()
|
||||||
|
const anchorRef = React.useRef(null)
|
||||||
|
|
||||||
props.onPress = React.useCallback(
|
props.onPress = React.useCallback(
|
||||||
(e?: Event) => {
|
(e?: Event) => {
|
||||||
@@ -166,8 +169,14 @@ export const TextLink = observer(function TextLink({
|
|||||||
return {}
|
return {}
|
||||||
}, [href])
|
}, [href])
|
||||||
|
|
||||||
|
React.useEffect(() => {
|
||||||
|
// @ts-expect-error web only, shows date on hover -esb
|
||||||
|
anchorRef.current?.setNativeProps?.({title})
|
||||||
|
}, [title])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Text
|
<Text
|
||||||
|
ref={anchorRef}
|
||||||
testID={testID}
|
testID={testID}
|
||||||
type={type}
|
type={type}
|
||||||
style={style}
|
style={style}
|
||||||
@@ -197,6 +206,7 @@ interface DesktopWebTextLinkProps extends TextProps {
|
|||||||
accessible?: boolean
|
accessible?: boolean
|
||||||
accessibilityLabel?: string
|
accessibilityLabel?: string
|
||||||
accessibilityHint?: string
|
accessibilityHint?: string
|
||||||
|
title?: string
|
||||||
}
|
}
|
||||||
export const DesktopWebTextLink = observer(function DesktopWebTextLink({
|
export const DesktopWebTextLink = observer(function DesktopWebTextLink({
|
||||||
testID,
|
testID,
|
||||||
|
|||||||
@@ -79,6 +79,7 @@ export const PostMeta = observer(function (opts: PostMetaOpts) {
|
|||||||
lineHeight={1.2}
|
lineHeight={1.2}
|
||||||
text={timeElapsed}
|
text={timeElapsed}
|
||||||
accessibilityLabel={niceDate(opts.timestamp)}
|
accessibilityLabel={niceDate(opts.timestamp)}
|
||||||
|
title={niceDate(opts.timestamp)}
|
||||||
accessibilityHint=""
|
accessibilityHint=""
|
||||||
href={opts.postHref}
|
href={opts.postHref}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -8,19 +8,18 @@ export type CustomTextProps = TextProps & {
|
|||||||
lineHeight?: number
|
lineHeight?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export function Text({
|
export const Text = React.forwardRef<any, CustomTextProps>(
|
||||||
type = 'md',
|
({type = 'md', children, lineHeight, style, ...props}, ref) => {
|
||||||
children,
|
|
||||||
lineHeight,
|
|
||||||
style,
|
|
||||||
...props
|
|
||||||
}: React.PropsWithChildren<CustomTextProps>) {
|
|
||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
const typography = theme.typography[type]
|
const typography = theme.typography[type]
|
||||||
const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
|
const lineHeightStyle = lineHeight ? lh(theme, type, lineHeight) : undefined
|
||||||
return (
|
return (
|
||||||
<RNText style={[s.black, typography, lineHeightStyle, style]} {...props}>
|
<RNText
|
||||||
|
ref={ref}
|
||||||
|
style={[s.black, typography, lineHeightStyle, style]}
|
||||||
|
{...props}>
|
||||||
{children}
|
{children}
|
||||||
</RNText>
|
</RNText>
|
||||||
)
|
)
|
||||||
}
|
},
|
||||||
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user