This commit is contained in:
Eric Bailey
2024-01-09 14:27:17 -06:00
parent 3e055025c7
commit 88b13451cc
2 changed files with 22 additions and 6 deletions
+7 -1
View File
@@ -11,11 +11,17 @@ import {atoms, tokens, web, native} from '#/alf'
export type ButtonType = 'primary' | 'secondary' | 'negative' export type ButtonType = 'primary' | 'secondary' | 'negative'
export type ButtonSize = 'small' | 'large' export type ButtonSize = 'small' | 'large'
export type VariantProps = { export type VariantProps = {
/**
* The presentation styles of the button
*/
type?: ButtonType type?: ButtonType
/**
* The size of the button
*/
size?: ButtonSize size?: ButtonSize
} }
export type ButtonProps = Omit<PressableProps, 'children'> & export type ButtonProps = Omit<PressableProps, 'children'> &
VariantProps & { VariantProps & {
children: children:
+15 -5
View File
@@ -26,9 +26,19 @@ import {useModalControls} from '#/state/modals'
import {router} from '#/routes' import {router} from '#/routes'
export type LinkProps = Omit<ButtonProps, 'style' | 'onPress' | 'disabled'> & { export type LinkProps = Omit<ButtonProps, 'style' | 'onPress' | 'disabled'> & {
style?: StyleProp<TextStyle> // only accept text styles on element itself /**
warnOnMismatchingLabel?: boolean * `TextStyle` to apply to the anchor element itself. Does not apply to any children.
*/
style?: StyleProp<TextStyle>
/**
* The React Navigation `StackAction` to perform when the link is pressed.
*/
action?: 'push' | 'replace' | 'navigate' action?: 'push' | 'replace' | 'navigate'
/**
* If true, will warn the user if the link text does not match the href. Only
* works for Links with children that are strings i.e. text links.
*/
warnOnMismatchingTextChild?: boolean
} & Pick<Parameters<typeof useLinkProps<AllNavigatorParams>>[0], 'to'> } & Pick<Parameters<typeof useLinkProps<AllNavigatorParams>>[0], 'to'>
/** /**
@@ -44,7 +54,7 @@ export function Link({
to, to,
style, style,
action = 'push', action = 'push',
warnOnMismatchingLabel, warnOnMismatchingTextChild,
...rest ...rest
}: LinkProps) { }: LinkProps) {
const t = useTheme() const t = useTheme()
@@ -59,7 +69,7 @@ export function Link({
(e: GestureResponderEvent) => { (e: GestureResponderEvent) => {
const label = typeof children === 'string' ? children : '' const label = typeof children === 'string' ? children : ''
const requiresWarning = Boolean( const requiresWarning = Boolean(
warnOnMismatchingLabel && warnOnMismatchingTextChild &&
label && label &&
isExternal && isExternal &&
linkRequiresWarning(href, label), linkRequiresWarning(href, label),
@@ -118,7 +128,7 @@ export function Link({
[ [
href, href,
isExternal, isExternal,
warnOnMismatchingLabel, warnOnMismatchingTextChild,
navigation, navigation,
action, action,
children, children,