Lucas Bordeau
e03d5ed8a7
* wip * Changed all other components * Removed console log * Console.log * lint * Removed internal state * Fix * Lint
35 lines
834 B
TypeScript
35 lines
834 B
TypeScript
import { MouseEvent } from 'react';
|
|
import styled from '@emotion/styled';
|
|
import { isValidPhoneNumber, parsePhoneNumber } from 'libphonenumber-js';
|
|
|
|
import { RawLink } from '@/ui/components/links/RawLink';
|
|
|
|
const StyledRawLink = styled(RawLink)`
|
|
overflow: hidden;
|
|
|
|
a {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
`;
|
|
|
|
type OwnProps = {
|
|
value: string;
|
|
};
|
|
|
|
export function InplaceInputPhoneDisplayMode({ value }: OwnProps) {
|
|
return isValidPhoneNumber(value) ? (
|
|
<StyledRawLink
|
|
href={parsePhoneNumber(value, 'FR')?.getURI()}
|
|
onClick={(event: MouseEvent<HTMLElement>) => {
|
|
event.stopPropagation();
|
|
}}
|
|
>
|
|
{parsePhoneNumber(value, 'FR')?.formatInternational() || value}
|
|
</StyledRawLink>
|
|
) : (
|
|
<StyledRawLink href="#">{value}</StyledRawLink>
|
|
);
|
|
}
|