35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
// Metro module 12290 (f12291).
|
|
import { ScrollView } from "react-native";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { useUrlParts } from "../../masked_link/SharedStateUtils";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
const useStyles = createStyles({
|
|
linkCalloutContainer: {
|
|
maxHeight: 300,
|
|
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH,
|
|
width: "100%",
|
|
borderRadius: Module712.radii.md
|
|
},
|
|
linkCalloutContainerText: {
|
|
padding: Module712.space.PX_8,
|
|
paddingVertical: Module712.space.PX_12,
|
|
textAlign: "center"
|
|
}
|
|
});
|
|
export function URLCallout(props) {
|
|
const url = props.url;
|
|
const styles = useStyles();
|
|
const urlParts = useUrlParts(url);
|
|
return <ScrollView style={styles.linkCalloutContainer}>
|
|
<Text style={styles.linkCalloutContainerText} variant="text-md/normal">
|
|
<Text variant="text-md/normal" color="text-muted">
|
|
{urlParts.protocol}
|
|
//
|
|
</Text>
|
|
<Text variant="text-md/semibold" color="text-default">{urlParts.hostname}</Text>
|
|
<Text variant="text-md/normal" color="text-muted">{urlParts.theRestOfTheUrl}</Text>
|
|
</Text>
|
|
</ScrollView>;
|
|
}
|