crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-03-14 22:42:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Button forward ref

Browse Source
This commit is contained in:
paco 2020-10-08 15:36:27 -06:00
parent 4deaa5d1aa
commit e1d3ceffc5
No known key found for this signature in database
GPG Key ID: CD243AF4E535B475
3 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/ui/Button/Button.tsx
View File

@ -1,9 +1,11 @@
import cn from 'classnames'
import React, {
forwardRef,
ButtonHTMLAttributes,
JSXElementConstructor,
useRef,
} from 'react'
import mergeRefs from 'react-merge-refs'
import { useButton } from 'react-aria'
import s from './Button.module.css'
@ -16,7 +18,7 @@ interface Props extends ButtonHTMLAttributes<HTMLButtonElement> {
Component?: string | JSXElementConstructor<any>
}
const Button: React.FC<Props> = (props) => {
const Button: React.FC<Props> = forwardRef((props, buttonRef) => {
const {
className,
variant = 'filled',
@ -54,7 +56,7 @@ const Button: React.FC<Props> = (props) => {
href={href}
aria-pressed={active}
data-variant={variant}
ref={ref}
ref={mergeRefs([ref, buttonRef])}
{...rest}
{...buttonProps}
data-active={isPressed ? '' : undefined}
@ -62,6 +64,6 @@ const Button: React.FC<Props> = (props) => {
{children}
</Component>
)
}
})
export default Button

1
package.json
View File

@ -30,6 +30,7 @@
"react": "^16.13.1",
"react-aria": "^3.0.0",
"react-dom": "^16.13.1",
"react-merge-refs": "^1.1.0",
"react-ticker": "^1.2.2",
"swr": "^0.3.3"
},

5
yarn.lock
View File

@ -6698,6 +6698,11 @@ react-is@16.13.1, react-is@^16.8.1:
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==
react-merge-refs@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/react-merge-refs/-/react-merge-refs-1.1.0.tgz#73d88b892c6c68cbb7a66e0800faa374f4c38b06"
integrity sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ==
react-refresh@0.8.3:
version "0.8.3"
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"