Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@react-aria/button

Package Overview
Dependencies
Maintainers
2
Versions
859
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@react-aria/button - npm Package Compare versions

Comparing version 3.0.0-nightly.786 to 3.0.0-nightly.790

2

dist/main.js

@@ -28,2 +28,3 @@ var {

function useButton(props, ref) {
/* eslint-enable no-redeclare */
let {

@@ -104,2 +105,3 @@ elementType = 'button',

function useToggleButton(props, state, ref) {
/* eslint-enable no-redeclare */
const {

@@ -106,0 +108,0 @@ isSelected

@@ -13,2 +13,3 @@ import { usePress } from "@react-aria/interactions";

export function useButton(props, ref) {
/* eslint-enable no-redeclare */
let {

@@ -87,2 +88,3 @@ elementType = 'button',

export function useToggleButton(props, state, ref) {
/* eslint-enable no-redeclare */
const {

@@ -89,0 +91,0 @@ isSelected

30

dist/types.d.ts

@@ -0,23 +1,23 @@

import { ElementType, HTMLAttributes, RefObject } from "react";
import { AriaButtonProps, AriaToggleButtonProps } from "@react-types/button";
import { ButtonHTMLAttributes, RefObject } from "react";
import { ToggleState } from "@react-stately/toggle";
export interface ButtonAria {
export interface ButtonAria<T> {
/** Props for the button element. */
buttonProps: ButtonHTMLAttributes<HTMLButtonElement>;
buttonProps: T;
/** Whether the button is currently pressed. */
isPressed: boolean;
}
/**
* Provides the behavior and accessibility implementation for a button component. Handles mouse, keyboard, and touch interactions,
* focus behavior, and ARIA props for both native button elements and custom element types.
* @param props - Props to be applied to the button.
* @param ref - A ref to a DOM element for the button.
*/
export function useButton(props: AriaButtonProps, ref: RefObject<HTMLElement>): ButtonAria;
/**
* Provides the behavior and accessibility implementation for a toggle button component.
* ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes.
*/
export function useToggleButton(props: AriaToggleButtonProps, state: ToggleState, ref: RefObject<HTMLElement>): ButtonAria;
export function useButton(props: AriaButtonProps<'a'>, ref: RefObject<HTMLAnchorElement>): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;
export function useButton(props: AriaButtonProps<'button'>, ref: RefObject<HTMLButtonElement>): ButtonAria<ButtonHTMLAttributes<HTMLButtonElement>>;
export function useButton(props: AriaButtonProps<'div'>, ref: RefObject<HTMLDivElement>): ButtonAria<HTMLAttributes<HTMLDivElement>>;
export function useButton(props: AriaButtonProps<'input'>, ref: RefObject<HTMLInputElement>): ButtonAria<InputHTMLAttributes<HTMLInputElement>>;
export function useButton(props: AriaButtonProps<'span'>, ref: RefObject<HTMLSpanElement>): ButtonAria<HTMLAttributes<HTMLSpanElement>>;
export function useButton(props: AriaButtonProps<ElementType>, ref: RefObject<HTMLElement>): ButtonAria<HTMLAttributes<HTMLElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'a'>, state: ToggleState, ref: RefObject<HTMLAnchorElement>): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'button'>, state: ToggleState, ref: RefObject<HTMLButtonElement>): ButtonAria<ButtonHTMLAttributes<HTMLButtonElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'div'>, state: ToggleState, ref: RefObject<HTMLDivElement>): ButtonAria<HTMLAttributes<HTMLDivElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'input'>, state: ToggleState, ref: RefObject<HTMLInputElement>): ButtonAria<InputHTMLAttributes<HTMLInputElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'span'>, state: ToggleState, ref: RefObject<HTMLSpanElement>): ButtonAria<HTMLAttributes<HTMLSpanElement>>;
export function useToggleButton(props: AriaToggleButtonProps<ElementType>, state: ToggleState, ref: RefObject<HTMLElement>): ButtonAria<HTMLAttributes<HTMLElement>>;
//# sourceMappingURL=types.d.ts.map
{
"name": "@react-aria/button",
"version": "3.0.0-nightly.786+d80334eb",
"version": "3.0.0-nightly.790+b44f2f11",
"description": "Spectrum UI components in React",

@@ -21,8 +21,8 @@ "license": "Apache-2.0",

"@babel/runtime": "^7.6.2",
"@react-aria/focus": "3.0.0-nightly.786+d80334eb",
"@react-aria/i18n": "3.0.0-nightly.786+d80334eb",
"@react-aria/interactions": "3.0.0-nightly.786+d80334eb",
"@react-aria/utils": "3.0.0-nightly.786+d80334eb",
"@react-stately/toggle": "3.0.0-nightly.786+d80334eb",
"@react-types/button": "3.2.2-nightly.2464+d80334eb"
"@react-aria/focus": "3.0.0-nightly.790+b44f2f11",
"@react-aria/i18n": "3.0.0-nightly.790+b44f2f11",
"@react-aria/interactions": "3.0.0-nightly.790+b44f2f11",
"@react-aria/utils": "3.0.0-nightly.790+b44f2f11",
"@react-stately/toggle": "3.0.0-nightly.790+b44f2f11",
"@react-types/button": "3.2.2-nightly.2468+b44f2f11"
},

@@ -35,3 +35,3 @@ "peerDependencies": {

},
"gitHead": "d80334eba4d7a44d282ccbd3736a80708112d0a2"
"gitHead": "b44f2f11b8e091afa2f0166bb75cedc0e5f56e1e"
}

@@ -13,4 +13,11 @@ /*

import {
AnchorHTMLAttributes,
ButtonHTMLAttributes,
ElementType,
HTMLAttributes,
InputHTMLAttributes,
RefObject
} from 'react';
import {AriaButtonProps} from '@react-types/button';
import {ButtonHTMLAttributes, RefObject} from 'react';
import {filterDOMProps} from '@react-aria/utils';

@@ -22,5 +29,5 @@ import {mergeProps} from '@react-aria/utils';

export interface ButtonAria {
export interface ButtonAria<T> {
/** Props for the button element. */
buttonProps: ButtonHTMLAttributes<HTMLButtonElement>,
buttonProps: T,
/** Whether the button is currently pressed. */

@@ -30,2 +37,9 @@ isPressed: boolean

/* eslint-disable no-redeclare */
export function useButton(props: AriaButtonProps<'a'>, ref: RefObject<HTMLAnchorElement>): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;
export function useButton(props: AriaButtonProps<'button'>, ref: RefObject<HTMLButtonElement>): ButtonAria<ButtonHTMLAttributes<HTMLButtonElement>>;
export function useButton(props: AriaButtonProps<'div'>, ref: RefObject<HTMLDivElement>): ButtonAria<HTMLAttributes<HTMLDivElement>>;
export function useButton(props: AriaButtonProps<'input'>, ref: RefObject<HTMLInputElement>): ButtonAria<InputHTMLAttributes<HTMLInputElement>>;
export function useButton(props: AriaButtonProps<'span'>, ref: RefObject<HTMLSpanElement>): ButtonAria<HTMLAttributes<HTMLSpanElement>>;
export function useButton(props: AriaButtonProps<ElementType>, ref: RefObject<HTMLElement>): ButtonAria<HTMLAttributes<HTMLElement>>;
/**

@@ -37,3 +51,4 @@ * Provides the behavior and accessibility implementation for a button component. Handles mouse, keyboard, and touch interactions,

*/
export function useButton(props: AriaButtonProps, ref: RefObject<HTMLElement>): ButtonAria {
export function useButton(props: AriaButtonProps<ElementType>, ref: RefObject<any>): ButtonAria<HTMLAttributes<any>> {
/* eslint-enable no-redeclare */
let {

@@ -40,0 +55,0 @@ elementType = 'button',

@@ -13,2 +13,10 @@ /*

import {
AnchorHTMLAttributes,
ButtonHTMLAttributes,
ElementType,
HTMLAttributes,
InputHTMLAttributes,
RefObject
} from 'react';
import {AriaToggleButtonProps} from '@react-types/button';

@@ -18,5 +26,11 @@ import {ButtonAria, useButton} from './useButton';

import {mergeProps} from '@react-aria/utils';
import {RefObject} from 'react';
import {ToggleState} from '@react-stately/toggle';
/* eslint-disable no-redeclare */
export function useToggleButton(props: AriaToggleButtonProps<'a'>, state: ToggleState, ref: RefObject<HTMLAnchorElement>): ButtonAria<AnchorHTMLAttributes<HTMLAnchorElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'button'>, state: ToggleState, ref: RefObject<HTMLButtonElement>): ButtonAria<ButtonHTMLAttributes<HTMLButtonElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'div'>, state: ToggleState, ref: RefObject<HTMLDivElement>): ButtonAria<HTMLAttributes<HTMLDivElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'input'>, state: ToggleState, ref: RefObject<HTMLInputElement>): ButtonAria<InputHTMLAttributes<HTMLInputElement>>;
export function useToggleButton(props: AriaToggleButtonProps<'span'>, state: ToggleState, ref: RefObject<HTMLSpanElement>): ButtonAria<HTMLAttributes<HTMLSpanElement>>;
export function useToggleButton(props: AriaToggleButtonProps<ElementType>, state: ToggleState, ref: RefObject<HTMLElement>): ButtonAria<HTMLAttributes<HTMLElement>>;
/**

@@ -26,3 +40,4 @@ * Provides the behavior and accessibility implementation for a toggle button component.

*/
export function useToggleButton(props: AriaToggleButtonProps, state: ToggleState, ref: RefObject<HTMLElement>): ButtonAria {
export function useToggleButton(props: AriaToggleButtonProps<ElementType>, state: ToggleState, ref: RefObject<any>): ButtonAria<HTMLAttributes<any>> {
/* eslint-enable no-redeclare */
const {isSelected} = state;

@@ -29,0 +44,0 @@ const {isPressed, buttonProps} = useButton({

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc