Files
bsky-social-app/src/view/com/composer/AltTextCounterWrapper.tsx
T

33 lines
749 B
TypeScript

import {View} from 'react-native'
import {MAX_ALT_TEXT} from '#/lib/constants'
import {CharProgress} from '#/view/com/composer/char-progress/CharProgress'
import {atoms as a, useTheme} from '#/alf'
export function AltTextCounterWrapper({
altText,
children,
}: {
altText?: string
children: React.ReactNode
}) {
const t = useTheme()
return (
<View style={[a.flex_row]}>
<CharProgress
style={[
a.flex_col_reverse,
a.align_center,
a.mr_xs,
{minWidth: 50, gap: 1},
]}
textStyle={[{marginRight: 0}, a.text_sm, t.atoms.text_contrast_medium]}
size={26}
count={altText?.length || 0}
max={MAX_ALT_TEXT}
/>
{children}
</View>
)
}