diff --git a/src/button/Button.tsx b/src/button/Button.tsx index aabc3093..3c2bc82b 100644 --- a/src/button/Button.tsx +++ b/src/button/Button.tsx @@ -13,9 +13,12 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. */ - import React, { forwardRef } from "react"; +import { PressEvent } from "@react-types/shared"; import classNames from "classnames"; +import { useButton } from "@react-aria/button"; +import { mergeProps, useObjectRef } from "@react-aria/utils"; + import styles from "./Button.module.css"; import { ReactComponent as MicIcon } from "../icons/Mic.svg"; import { ReactComponent as MuteMicIcon } from "../icons/MuteMic.svg"; @@ -26,8 +29,6 @@ import { ReactComponent as ScreenshareIcon } from "../icons/Screenshare.svg"; import { ReactComponent as SettingsIcon } from "../icons/Settings.svg"; import { ReactComponent as AddUserIcon } from "../icons/AddUser.svg"; import { ReactComponent as ArrowDownIcon } from "../icons/ArrowDown.svg"; -import { useButton } from "@react-aria/button"; -import { mergeProps, useObjectRef } from "@react-aria/utils"; import { TooltipTrigger } from "../Tooltip"; export const variantToClassName = { @@ -47,8 +48,19 @@ export const variantToClassName = { export const sizeToClassName = { lg: [styles.lg], }; - -export const Button = forwardRef( +interface Props { + variant: string; + size: number; + on: () => void; + off: () => void; + iconStyle: string; + className: string; + children: Element[]; + onPress: (e: PressEvent) => void; + onPressStart: (e: PressEvent) => void; + [index: string]: unknown; +} +export const Button = forwardRef( ( { variant = "default", @@ -64,7 +76,7 @@ export const Button = forwardRef( }, ref ) => { - const buttonRef = useObjectRef(ref); + const buttonRef = useObjectRef(ref); const { buttonProps } = useButton( { onPress, onPressStart, ...rest }, buttonRef @@ -75,7 +87,7 @@ export const Button = forwardRef( let filteredButtonProps = buttonProps; if (rest.type === "submit" && !rest.onPress) { - const { onKeyDown, onKeyUp, ...filtered } = buttonProps; + const { ...filtered } = buttonProps; filteredButtonProps = filtered; } diff --git a/src/button/CopyButton.tsx b/src/button/CopyButton.tsx index b28d693a..257ac96e 100644 --- a/src/button/CopyButton.tsx +++ b/src/button/CopyButton.tsx @@ -16,10 +16,18 @@ limitations under the License. import React from "react"; import useClipboard from "react-use-clipboard"; + import { ReactComponent as CheckIcon } from "../icons/Check.svg"; import { ReactComponent as CopyIcon } from "../icons/Copy.svg"; import { Button } from "./Button"; +interface Props { + value: string; + children: JSX.Element; + className: string; + variant: string; + copiedMessage: string; +} export function CopyButton({ value, children, @@ -27,7 +35,7 @@ export function CopyButton({ variant, copiedMessage, ...rest -}) { +}: Props) { const [isCopied, setCopied] = useClipboard(value, { successDuration: 3000 }); return ( diff --git a/src/button/LinkButton.tsx b/src/button/LinkButton.tsx index 561bba47..b96f461f 100644 --- a/src/button/LinkButton.tsx +++ b/src/button/LinkButton.tsx @@ -17,9 +17,23 @@ limitations under the License. import React from "react"; import { Link } from "react-router-dom"; import classNames from "classnames"; -import { variantToClassName, sizeToClassName } from "./Button"; -export function LinkButton({ className, variant, size, children, ...rest }) { +import { variantToClassName, sizeToClassName } from "./Button"; +interface Props { + className: string; + variant: string; + size: number; + children: JSX.Element; + [index: string]: unknown; +} + +export function LinkButton({ + className, + variant, + size, + children, + ...rest +}: Props) { return (