core-components: update Button and Link doc workarounds
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
This commit is contained in:
@@ -31,6 +31,13 @@ import { Link, LinkProps } from '../Link';
|
||||
export type ButtonProps = MaterialButtonProps &
|
||||
Omit<LinkProps, 'variant' | 'color'>;
|
||||
|
||||
/**
|
||||
* This wrapper is here to reset the color of the Link and make typescript happy.
|
||||
*/
|
||||
const LinkWrapper = React.forwardRef<any, LinkProps>((props, ref) => (
|
||||
<Link ref={ref} {...props} color="initial" />
|
||||
));
|
||||
|
||||
/**
|
||||
* Thin wrapper on top of material-ui's {@link https://v4.mui.com/components/buttons/ | Button} component
|
||||
*
|
||||
@@ -39,23 +46,6 @@ export type ButtonProps = MaterialButtonProps &
|
||||
*
|
||||
* Makes the Button to utilise react-router
|
||||
*/
|
||||
declare function ButtonType(props: ButtonProps): JSX.Element;
|
||||
|
||||
/**
|
||||
* This wrapper is here to reset the color of the Link and make typescript happy.
|
||||
*/
|
||||
const LinkWrapper = React.forwardRef<any, LinkProps>((props, ref) => (
|
||||
<Link ref={ref} {...props} color="initial" />
|
||||
));
|
||||
|
||||
/** @public */
|
||||
const ActualButton = React.forwardRef<any, ButtonProps>((props, ref) => (
|
||||
export const Button = React.forwardRef<any, ButtonProps>((props, ref) => (
|
||||
<MaterialButton ref={ref} component={LinkWrapper} {...props} />
|
||||
)) as { (props: ButtonProps): JSX.Element };
|
||||
|
||||
// TODO(Rugvip): We use this as a workaround to make the exported type be a
|
||||
// function, which makes our API reference docs much nicer.
|
||||
// The first type to be exported gets priority, but it will
|
||||
// be thrown away when compiling to JS.
|
||||
// @ts-ignore
|
||||
export { ButtonType as Button, ActualButton as Button };
|
||||
)) as (props: ButtonProps) => JSX.Element;
|
||||
|
||||
@@ -32,8 +32,6 @@ export type LinkProps = MaterialLinkProps &
|
||||
noTrack?: boolean;
|
||||
};
|
||||
|
||||
declare function LinkType(props: LinkProps): JSX.Element;
|
||||
|
||||
/**
|
||||
* Given a react node, try to retrieve its text content.
|
||||
*/
|
||||
@@ -62,7 +60,7 @@ const getNodeText = (node: React.ReactNode): string => {
|
||||
* - Makes the Link use react-router
|
||||
* - Captures Link clicks as analytics events.
|
||||
*/
|
||||
const ActualLink = React.forwardRef<any, LinkProps>(
|
||||
export const Link = React.forwardRef<any, LinkProps>(
|
||||
({ onClick, noTrack, ...props }, ref) => {
|
||||
const analytics = useAnalytics();
|
||||
const to = String(props.to);
|
||||
@@ -96,11 +94,4 @@ const ActualLink = React.forwardRef<any, LinkProps>(
|
||||
/>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
// TODO(Rugvip): We use this as a workaround to make the exported type be a
|
||||
// function, which makes our API reference docs much nicer.
|
||||
// The first type to be exported gets priority, but it will
|
||||
// be thrown away when compiling to JS.
|
||||
// @ts-ignore
|
||||
export { LinkType as Link, ActualLink as Link };
|
||||
) as (props: LinkProps) => JSX.Element;
|
||||
|
||||
Reference in New Issue
Block a user