mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-22 03:42:14 +00:00
bd03b86c02
* Add copyright script Copied over our copyright script from the react repo. I made a small fix to handle shebangs. * Update copyright on all files Run the script.
54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
/**
|
|
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*/
|
|
|
|
/*
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*/
|
|
|
|
import * as React from 'react';
|
|
import cn from 'classnames';
|
|
|
|
interface ButtonProps {
|
|
children: React.ReactNode;
|
|
onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
|
|
active?: boolean;
|
|
className?: string;
|
|
style?: Record<string, string>;
|
|
}
|
|
|
|
export function Button({
|
|
children,
|
|
onClick,
|
|
active = false,
|
|
className,
|
|
style,
|
|
}: ButtonProps) {
|
|
return (
|
|
<button
|
|
style={style}
|
|
onMouseDown={(evt) => {
|
|
evt.preventDefault();
|
|
evt.stopPropagation();
|
|
}}
|
|
onClick={onClick}
|
|
className={cn(
|
|
className,
|
|
'text-base leading-tight font-bold rounded-full py-2 px-4 focus:outline focus:outline-offset-2 focus:outline-link dark:focus:outline-link-dark inline-flex items-center my-1',
|
|
{
|
|
'bg-link border-link text-white hover:bg-link focus:bg-link active:bg-link':
|
|
active,
|
|
'bg-transparent text-primary dark:text-primary-dark active:text-primary shadow-secondary-button-stroke dark:shadow-secondary-button-stroke-dark hover:bg-gray-40/5 active:bg-gray-40/10 hover:dark:bg-gray-60/5 active:dark:bg-gray-60/10':
|
|
!active,
|
|
}
|
|
)}>
|
|
{children}
|
|
</button>
|
|
);
|
|
}
|
|
|
|
export default Button;
|