@react-aria/button - npm Package Compare versions

Comparing version 3.0.0-rc.2 to 3.0.0-rc.3

dist/main.js

@@ -1,12 +0,16 @@
-var _babelRuntimeHelpersObjectSpread = $parcel$interopDefault(require("@babel/runtime/helpers/objectSpread2"));
+var {
+  usePress
+} = require("@react-aria/interactions");
 
-var mergeProps = require("@react-aria/utils").mergeProps;
+var {
+  useFocusable
+} = require("@react-aria/focus");
 
-var _temp = require("@react-aria/interactions");
+var {
+  filterDOMProps,
+  mergeProps
+} = require("@react-aria/utils");
 
-var useDOMPropsResponder = _temp.useDOMPropsResponder;
-var usePress = _temp.usePress;
+var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
 
-var useFocusable = require("@react-aria/focus").useFocusable;
-
 function $parcel$interopDefault(a) {
@@ -16,21 +20,23 @@ return a && a.__esModule ? a.default : a;
 
+/**
+ * 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
+ */
 function useButton(props, ref) {
-  var _props$elementType = props.elementType,
-      elementType = _props$elementType === void 0 ? 'button' : _props$elementType,
-      isDisabled = props.isDisabled,
-      onPress = props.onPress,
-      onPressStart = props.onPressStart,
-      onPressEnd = props.onPressEnd,
-      onPressChange = props.onPressChange,
-      deprecatedOnClick = props.onClick,
-      href = props.href,
-      target = props.target,
-      tabIndex = props.tabIndex,
-      isSelected = props.isSelected,
-      validationState = props.validationState,
-      ariaExpanded = props['aria-expanded'],
-      ariaHasPopup = props['aria-haspopup'],
-      _props$type = props.type,
-      type = _props$type === void 0 ? 'button' : _props$type;
-  var additionalProps;
+  let {
+    elementType = 'button',
+    isDisabled,
+    onPress,
+    onPressStart,
+    onPressEnd,
+    onPressChange,
+    // @ts-ignore
+    onClick: deprecatedOnClick,
+    href,
+    target,
+    type = 'button'
+  } = props;
+  let additionalProps;
 
@@ -40,3 +46,3 @@ if (elementType !== 'button') {
       role: 'button',
-      tabIndex: isDisabled ? undefined : tabIndex || 0,
+      tabIndex: isDisabled ? undefined : 0,
       href: elementType === 'a' && isDisabled ? undefined : href,
@@ -50,33 +56,32 @@ target: elementType === 'a' ? target : undefined,
 
-  var _usePress = usePress({
-    onPressStart: onPressStart,
-    onPressEnd: onPressEnd,
-    onPressChange: onPressChange,
-    onPress: onPress,
-    isDisabled: isDisabled,
-    ref: ref
-  }),
-      pressProps = _usePress.pressProps,
-      isPressed = _usePress.isPressed;
-
-  var _useDOMPropsResponder = useDOMPropsResponder(ref),
-      contextProps = _useDOMPropsResponder.contextProps;
-
-  var _useFocusable = useFocusable(props, ref),
-      focusableProps = _useFocusable.focusableProps;
-
-  var handlers = mergeProps(pressProps, focusableProps);
-  var interactions = mergeProps(contextProps, handlers);
+  let {
+    pressProps,
+    isPressed
+  } = usePress({
+    onPressStart,
+    onPressEnd,
+    onPressChange,
+    onPress,
+    isDisabled,
+    ref
+  });
+  let {
+    focusableProps
+  } = useFocusable(props, ref);
+  let buttonProps = mergeProps(pressProps, focusableProps);
+  buttonProps = mergeProps(buttonProps, filterDOMProps(props, {
+    labelable: true
+  }));
   return {
-    isPressed: isPressed,
+    isPressed,
     // Used to indicate press state for visual
-    buttonProps: mergeProps(interactions, _babelRuntimeHelpersObjectSpread({
-      'aria-haspopup': ariaHasPopup,
-      'aria-expanded': ariaExpanded || ariaHasPopup && isSelected,
-      'aria-checked': isSelected,
-      'aria-invalid': validationState === 'invalid' ? true : null,
+    buttonProps: mergeProps(buttonProps, _babelRuntimeHelpersExtends({
+      'aria-haspopup': props['aria-haspopup'],
+      'aria-expanded': props['aria-expanded'],
+      'aria-controls': props['aria-controls'],
+      'aria-pressed': props['aria-pressed'],
       disabled: isDisabled,
-      type: type
+      type
     }, additionalProps || {}, {
-      onClick: function onClick(e) {
+      onClick: e => {
         if (deprecatedOnClick) {
@@ -91,2 +96,3 @@ deprecatedOnClick(e);
 
-exports.useButton = useButton;
+exports.useButton = useButton;
+//# sourceMappingURL=main.js.map

dist/module.js

@@ -1,5 +0,12 @@
-import _babelRuntimeHelpersEsmObjectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { mergeProps } from "@react-aria/utils";
-import { useDOMPropsResponder, usePress } from "@react-aria/interactions";
+import { usePress } from "@react-aria/interactions";
 import { useFocusable } from "@react-aria/focus";
+import { filterDOMProps, mergeProps } from "@react-aria/utils";
+import _babelRuntimeHelpersEsmExtends from "@babel/runtime/helpers/esm/extends";
+
+/**
+ * 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, ref) {
@@ -17,7 +24,2 @@ let {
     target,
-    tabIndex,
-    isSelected,
-    validationState,
-    'aria-expanded': ariaExpanded,
-    'aria-haspopup': ariaHasPopup,
     type = 'button'
@@ -30,3 +32,3 @@ } = props;
       role: 'button',
-      tabIndex: isDisabled ? undefined : tabIndex || 0,
+      tabIndex: isDisabled ? undefined : 0,
       href: elementType === 'a' && isDisabled ? undefined : href,
@@ -52,17 +54,16 @@ target: elementType === 'a' ? target : undefined,
   let {
-    contextProps
-  } = useDOMPropsResponder(ref);
-  let {
     focusableProps
   } = useFocusable(props, ref);
-  let handlers = mergeProps(pressProps, focusableProps);
-  let interactions = mergeProps(contextProps, handlers);
+  let buttonProps = mergeProps(pressProps, focusableProps);
+  buttonProps = mergeProps(buttonProps, filterDOMProps(props, {
+    labelable: true
+  }));
   return {
     isPressed,
     // Used to indicate press state for visual
-    buttonProps: mergeProps(interactions, _babelRuntimeHelpersEsmObjectSpread({
-      'aria-haspopup': ariaHasPopup,
-      'aria-expanded': ariaExpanded || ariaHasPopup && isSelected,
-      'aria-checked': isSelected,
-      'aria-invalid': validationState === 'invalid' ? true : null,
+    buttonProps: mergeProps(buttonProps, _babelRuntimeHelpersEsmExtends({
+      'aria-haspopup': props['aria-haspopup'],
+      'aria-expanded': props['aria-expanded'],
+      'aria-controls': props['aria-controls'],
+      'aria-pressed': props['aria-pressed'],
       disabled: isDisabled,
@@ -79,2 +80,3 @@ type
   };
-}
+}
+//# sourceMappingURL=module.js.map

dist/types.d.ts

@@ -1,16 +0,17 @@
-import { ButtonProps } from "@react-types/button";
-import { RefObject } from "react";
-interface AriaButtonProps extends ButtonProps {
-    isSelected?: boolean;
-    validationState?: 'valid' | 'invalid';
-    'aria-expanded'?: boolean | 'false' | 'true';
-    'aria-haspopup'?: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
-    type?: 'button' | 'submit';
-}
+import { AriaButtonProps } from "@react-types/button";
+import { ButtonHTMLAttributes, RefObject } from "react";
 interface ButtonAria {
-    buttonProps: React.ButtonHTMLAttributes<HTMLButtonElement>;
+    /** Props for the button element. */
+    buttonProps: ButtonHTMLAttributes<HTMLButtonElement>;
+    /** 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;
 
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@react-aria/button",
-  "version": "3.0.0-rc.2",
+  "version": "3.0.0-rc.3",
   "description": "Spectrum UI components in React",
@@ -20,7 +20,7 @@ "license": "Apache-2.0",
     "@babel/runtime": "^7.6.2",
-    "@react-aria/focus": "^3.0.0-rc.2",
-    "@react-aria/i18n": "^3.0.0-rc.2",
-    "@react-aria/interactions": "^3.0.0-rc.2",
-    "@react-aria/utils": "^3.0.0-rc.2",
-    "@react-types/button": "^3.0.0-rc.2"
+    "@react-aria/focus": "3.0.0-rc.3",
+    "@react-aria/i18n": "3.0.0-rc.3",
+    "@react-aria/interactions": "3.0.0-rc.3",
+    "@react-aria/utils": "3.0.0-rc.3",
+    "@react-types/button": "3.0.0-rc.3"
   },
@@ -33,3 +33,3 @@ "peerDependencies": {
   },
-  "gitHead": "207e6ee9076905c96638a7f81a367758872e1410"
+  "gitHead": "461d6321126ae9b4f1508aa912f7b36bf8a603f8"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

29558

increased by57.84%

Number of package files

9

increased by28.57%

Lines of code

177

increased by8.59%

Dependency changes

• + Added@react-aria/focus@3.0.0-rc.3(transitive)

• + Added@react-aria/i18n@3.0.0-rc.3(transitive)

• + Added@react-aria/interactions@3.0.0-rc.3(transitive)

• + Added@react-aria/utils@3.0.0-rc.3(transitive)

• + Added@react-types/button@3.0.0-rc.3(transitive)

• + Added@react-types/shared@3.0.0-rc.3(transitive)

• + Addedclassnames@2.5.1(transitive)

• + Addedintl-messageformat@2.2.0(transitive)

• + Addedintl-messageformat-parser@1.4.0(transitive)

• - Removed@formatjs/ecma402-abstract@2.2.3(transitive)

• - Removed@formatjs/fast-memoize@2.2.3(transitive)

• - Removed@formatjs/icu-messageformat-parser@2.9.3(transitive)

• - Removed@formatjs/icu-skeleton-parser@1.8.7(transitive)

• - Removed@formatjs/intl-localematcher@0.5.7(transitive)

• - Removed@internationalized/date@3.5.6(transitive)

• - Removed@internationalized/message@3.1.5(transitive)

• - Removed@internationalized/number@3.5.4(transitive)

• - Removed@internationalized/string@3.2.4(transitive)

• - Removed@react-aria/focus@3.18.4(transitive)

• - Removed@react-aria/i18n@3.12.3(transitive)

• - Removed@react-aria/interactions@3.22.4(transitive)

• - Removed@react-aria/ssr@3.9.6(transitive)

• - Removed@react-aria/utils@3.25.3(transitive)

• - Removed@react-stately/utils@3.10.4(transitive)

• - Removed@react-types/button@3.10.0(transitive)

• - Removed@react-types/shared@3.25.0(transitive)

• - Removed@swc/helpers@0.5.13(transitive)

• - Removedclsx@2.1.1(transitive)

• - Removedintl-messageformat@10.7.6(transitive)

• - Removedtslib@2.8.1(transitive)

• Updated@react-aria/focus@3.0.0-rc.3

• Updated@react-aria/i18n@3.0.0-rc.3

• Updated@react-aria/interactions@3.0.0-rc.3

• Updated@react-aria/utils@3.0.0-rc.3

• Updated@react-types/button@3.0.0-rc.3