Link
Docplanner provides a component that shows as a text link, where you can add an icon.
Properties
variant
"primary" | "danger" | "secondary" | undefined
primary
🎨 The variant of the button to render.
emphasis
"low" | "medium" | undefined
low
🎨 The emphasis of the variant
onPress
() => void
required
onPress triggered when clicking on the Link.
children
ReactNode
Add extra text that component or value to render.
inline
boolean | undefined
Decide if the text will be used as inline.
disabled
boolean | undefined
Disable the Link.
iconName
"action-add-phone" | "action-add-visit" | "action-alarm-clock" | "action-alarm" | "action-back" | "action-bin" | "action-bookmark" | "action-calendar-block" | "action-calendar-filled" | ... 254 more ... | undefined
Pass this props in order to show an icon in the Link.
hasPadding
boolean | undefined
Default value set to true, set it to false to remove padding.
size
"xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | undefined
md
Size of the text and the icon.
textProps
RobotoProps | undefined
Extra properites that you can add to the text to make it custom.
iconProps
IconProps | undefined
Extra properites that you can add to the Icon to make it custom.
testID
string | undefined
Testid of the container of the Text and Icon.
accessibilityLabel
string | undefined
Basic usage
Click to open
Variations
Secondary variant wiht emphasis low
Secondary variant wiht emphasis medium
Danger variant wiht emphasis low
Danger variant with empashes medium
Black Link disabled
Icon example enabled
Icon example disabled
Icon with big size