use JSX.IntrinsicElements for pass-through props (#545)

This commit is contained in:
Alex Johansson 2021-09-02 12:02:45 +02:00 committed by GitHub
parent 995f8eea26
commit f63c9311e5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -2,20 +2,18 @@ import classNames from "@lib/classNames";
import Link, { LinkProps } from "next/link"; import Link, { LinkProps } from "next/link";
import React from "react"; import React from "react";
type HTMLAnchorProps = React.AnchorHTMLAttributes<HTMLAnchorElement>;
type HTMLButtonProps = React.ButtonHTMLAttributes<HTMLButtonProps>;
type SVGComponent = React.FunctionComponent<React.SVGProps<SVGSVGElement>>;
export type ButtonProps = { export type ButtonProps = {
color?: "primary" | "secondary" | "minimal"; color?: "primary" | "secondary" | "minimal";
size?: "base" | "sm" | "lg" | "fab"; size?: "base" | "sm" | "lg" | "fab";
loading?: boolean; loading?: boolean;
disabled?: boolean; disabled?: boolean;
onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void; onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
StartIcon?: SVGComponent; StartIcon?: JSX.IntrinsicElements["svg"];
EndIcon?: SVGComponent; EndIcon?: JSX.IntrinsicElements["svg"];
} & ((Omit<HTMLAnchorProps, "href"> & { href: LinkProps["href"] }) | (HTMLButtonProps & { href?: never })); } & (
| (Omit<JSX.IntrinsicElements["a"], "href"> & { href: LinkProps["href"] })
| (JSX.IntrinsicElements["button"] & { href?: never })
);
export const Button = function Button(props: ButtonProps) { export const Button = function Button(props: ButtonProps) {
const { const {