@react-native-aria/button 0.2.2 → 0.2.5-alpha.0

package/lib/commonjs/useButton.js

@@ -9,7 +9,7 @@ var _interactions = require("@react-native-aria/interactions");
 
 var _utils = require("@react-aria/utils");
 
-function useButton(props, ref) {
+function useButton(props) {
   let {
     isDisabled,
     onPress,
@@ -26,15 +26,12 @@ function useButton(props, ref) {
     onPressEnd,
     onPressChange,
     onPress,
-    isDisabled,
-    ref
+    isDisabled
   });
   const mergedProps = (0, _utils.mergeProps)(pressProps, rest, {
-    accessibilityState: {
-      disabled: isDisabled
-    },
-    accessibilityRole: "button",
-    disabled: isDisabled
+    'aria-disabled': isDisabled,
+    'role': 'button',
+    'disabled': isDisabled
   });
   return {
     isPressed,

package/lib/commonjs/useButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useButton.ts"],"names":["useButton","props","ref","isDisabled","onPress","onPressStart","onPressEnd","onPressChange","rest","pressProps","isPressed","mergedProps","accessibilityState","disabled","accessibilityRole","buttonProps"],"mappings":";;;;;;;AACA;;AAEA;;AAkBO,SAASA,SAAT,CACLC,KADK,EAELC,GAFK,EAGO;AACZ,MAAI;AACFC,IAAAA,UADE;AAEFC,IAAAA,OAFE;AAGFC,IAAAA,YAHE;AAIFC,IAAAA,UAJE;AAKFC,IAAAA,aALE;AAMF,OAAGC;AAND,MAOAP,KAPJ;AASA,MAAI;AAAEQ,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAA4B,4BAAS;AACvCL,IAAAA,YADuC;AAEvCC,IAAAA,UAFuC;AAGvCC,IAAAA,aAHuC;AAIvCH,IAAAA,OAJuC;AAKvCD,IAAAA,UALuC;AAMvCD,IAAAA;AANuC,GAAT,CAAhC;AASA,QAAMS,WAAW,GAAG,uBAAWF,UAAX,EAAuBD,IAAvB,EAA6B;AAC/CI,IAAAA,kBAAkB,EAAE;AAClBC,MAAAA,QAAQ,EAAEV;AADQ,KAD2B;AAI/CW,IAAAA,iBAAiB,EAAE,QAJ4B;AAK/CD,IAAAA,QAAQ,EAAEV;AALqC,GAA7B,CAApB;AAQA,SAAO;AACLO,IAAAA,SADK;AAELK,IAAAA,WAAW,EAAEJ;AAFR,GAAP;AAID","sourcesContent":["import { ReactNode, RefObject } from \"react\";\nimport { PressEvents, usePress } from \"@react-native-aria/interactions\";\nimport { AccessibilityProps, PressableProps } from \"react-native\";\nimport { mergeProps } from \"@react-aria/utils\";\n\ninterface ButtonProps extends PressEvents {\n  /** Whether the button is disabled. */\n  isDisabled?: boolean;\n  /** The content to display in the button. */\n  children?: ReactNode;\n}\n\nexport interface RNAriaButtonProps extends AccessibilityProps, ButtonProps {}\n\nexport interface ButtonAria {\n  /** Props for the button element. */\n  buttonProps: PressableProps;\n  /** Whether the button is currently pressed. */\n  isPressed: boolean;\n}\n\nexport function useButton(\n  props: RNAriaButtonProps,\n  ref: RefObject<any>\n): ButtonAria {\n  let {\n    isDisabled,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    ...rest\n  } = props;\n\n  let { pressProps, isPressed } = usePress({\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPress,\n    isDisabled,\n    ref,\n  });\n\n  const mergedProps = mergeProps(pressProps, rest, {\n    accessibilityState: {\n      disabled: isDisabled,\n    },\n    accessibilityRole: \"button\",\n    disabled: isDisabled,\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergedProps,\n  };\n}\n"]}
+{"version":3,"sources":["useButton.ts"],"names":["useButton","props","isDisabled","onPress","onPressStart","onPressEnd","onPressChange","rest","pressProps","isPressed","mergedProps","buttonProps"],"mappings":";;;;;;;AACA;;AAEA;;AAkBO,SAASA,SAAT,CAAmBC,KAAnB,EAAyD;AAC9D,MAAI;AACFC,IAAAA,UADE;AAEFC,IAAAA,OAFE;AAGFC,IAAAA,YAHE;AAIFC,IAAAA,UAJE;AAKFC,IAAAA,aALE;AAMF,OAAGC;AAND,MAOAN,KAPJ;AASA,MAAI;AAAEO,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAA4B,4BAAS;AACvCL,IAAAA,YADuC;AAEvCC,IAAAA,UAFuC;AAGvCC,IAAAA,aAHuC;AAIvCH,IAAAA,OAJuC;AAKvCD,IAAAA;AALuC,GAAT,CAAhC;AAQA,QAAMQ,WAAW,GAAG,uBAAWF,UAAX,EAAuBD,IAAvB,EAA6B;AAC/C,qBAAiBL,UAD8B;AAE/C,YAAQ,QAFuC;AAG/C,gBAAYA;AAHmC,GAA7B,CAApB;AAMA,SAAO;AACLO,IAAAA,SADK;AAELE,IAAAA,WAAW,EAAED;AAFR,GAAP;AAID","sourcesContent":["import { ReactNode } from 'react';\nimport { PressEvents, usePress } from '@react-native-aria/interactions';\nimport { AccessibilityProps, PressableProps } from 'react-native';\nimport { mergeProps } from '@react-aria/utils';\n\ninterface ButtonProps extends PressEvents {\n  /** Whether the button is disabled. */\n  isDisabled?: boolean;\n  /** The content to display in the button. */\n  children?: ReactNode;\n}\n\nexport interface RNAriaButtonProps extends AccessibilityProps, ButtonProps {}\n\nexport interface ButtonAria {\n  /** Props for the button element. */\n  buttonProps: PressableProps;\n  /** Whether the button is currently pressed. */\n  isPressed: boolean;\n}\n\nexport function useButton(props: RNAriaButtonProps): ButtonAria {\n  let {\n    isDisabled,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    ...rest\n  } = props;\n\n  let { pressProps, isPressed } = usePress({\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPress,\n    isDisabled,\n  });\n\n  const mergedProps = mergeProps(pressProps, rest, {\n    'aria-disabled': isDisabled,\n    'role': 'button',\n    'disabled': isDisabled,\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergedProps,\n  };\n}\n"]}

package/lib/commonjs/useToggleButton.js

@@ -9,7 +9,7 @@ var _useButton = require("./useButton");
 
 var _utils = require("@react-aria/utils");
 
-function useToggleButton(props, state, ref) {
+function useToggleButton(props, state) {
   const {
     isSelected
   } = state;
@@ -18,13 +18,11 @@ function useToggleButton(props, state, ref) {
     buttonProps
   } = (0, _useButton.useButton)({ ...props,
     onPress: (0, _utils.chain)(state.toggle, props.onPress)
-  }, ref);
+  });
   return {
     isPressed,
     buttonProps: (0, _utils.mergeProps)(buttonProps, {
-      accessibilityState: {
-        selected: isSelected
-      }
+      'aria-selected': isSelected
     })
   };
 }

package/lib/commonjs/useToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToggleButton.ts"],"names":["useToggleButton","props","state","ref","isSelected","isPressed","buttonProps","onPress","toggle","accessibilityState","selected"],"mappings":";;;;;;;AAAA;;AAGA;;AAkBO,SAASA,eAAT,CACLC,KADK,EAELC,KAFK,EAGLC,GAHK,EAIO;AACZ,QAAM;AAAEC,IAAAA;AAAF,MAAiBF,KAAvB;AACA,QAAM;AAAEG,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6B,0BACjC,EACE,GAAGL,KADL;AAEEM,IAAAA,OAAO,EAAE,kBAAML,KAAK,CAACM,MAAZ,EAAoBP,KAAK,CAACM,OAA1B;AAFX,GADiC,EAKjCJ,GALiC,CAAnC;AAQA,SAAO;AACLE,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAE,uBAAWA,WAAX,EAAwB;AACnCG,MAAAA,kBAAkB,EAAE;AAClBC,QAAAA,QAAQ,EAAEN;AADQ;AADe,KAAxB;AAFR,GAAP;AAQD","sourcesContent":["import { ButtonAria, useButton } from \"./useButton\";\nimport type { ToggleState } from \"@react-stately/toggle\";\nimport type { RefObject } from \"react\";\nimport { chain, mergeProps } from \"@react-aria/utils\";\nimport type { PressEvents } from \"@react-native-aria/interactions\";\nimport type { PressableProps } from \"react-native\";\n\nexport type AriaButtonProps = PressableProps &\n  PressEvents & {\n    isDisabled: boolean;\n  };\n\nexport interface AriaToggleButtonProps extends AriaButtonProps {\n  /** Whether the element should be selected (controlled). */\n  isSelected?: boolean;\n  /** Whether the element should be selected (uncontrolled). */\n  defaultSelected?: boolean;\n  /** Handler that is called when the element's selection state changes. */\n  onChange?: (isSelected: boolean) => void;\n}\n\nexport function useToggleButton(\n  props: AriaToggleButtonProps,\n  state: ToggleState,\n  ref: RefObject<any>\n): ButtonAria {\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton(\n    {\n      ...props,\n      onPress: chain(state.toggle, props.onPress),\n    },\n    ref\n  );\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      accessibilityState: {\n        selected: isSelected,\n      },\n    }),\n  };\n}\n"]}
+{"version":3,"sources":["useToggleButton.ts"],"names":["useToggleButton","props","state","isSelected","isPressed","buttonProps","onPress","toggle"],"mappings":";;;;;;;AAAA;;AAEA;;AAkBO,SAASA,eAAT,CACLC,KADK,EAELC,KAFK,EAGO;AACZ,QAAM;AAAEC,IAAAA;AAAF,MAAiBD,KAAvB;AACA,QAAM;AAAEE,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6B,0BAAU,EAC3C,GAAGJ,KADwC;AAE3CK,IAAAA,OAAO,EAAE,kBAAMJ,KAAK,CAACK,MAAZ,EAAoBN,KAAK,CAACK,OAA1B;AAFkC,GAAV,CAAnC;AAKA,SAAO;AACLF,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAE,uBAAWA,WAAX,EAAwB;AACnC,uBAAiBF;AADkB,KAAxB;AAFR,GAAP;AAMD","sourcesContent":["import { ButtonAria, useButton } from './useButton';\nimport type { ToggleState } from '@react-stately/toggle';\nimport { chain, mergeProps } from '@react-aria/utils';\nimport type { PressEvents } from '@react-native-aria/interactions';\nimport type { PressableProps } from 'react-native';\n\nexport type AriaButtonProps = PressableProps &\n  PressEvents & {\n    isDisabled: boolean;\n  };\n\nexport interface AriaToggleButtonProps extends AriaButtonProps {\n  /** Whether the element should be selected (controlled). */\n  isSelected?: boolean;\n  /** Whether the element should be selected (uncontrolled). */\n  defaultSelected?: boolean;\n  /** Handler that is called when the element's selection state changes. */\n  onChange?: (isSelected: boolean) => void;\n}\n\nexport function useToggleButton(\n  props: AriaToggleButtonProps,\n  state: ToggleState\n): ButtonAria {\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton({\n    ...props,\n    onPress: chain(state.toggle, props.onPress),\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      'aria-selected': isSelected,\n    }),\n  };\n}\n"]}

package/lib/commonjs/useToggleButton.web.js

@@ -25,7 +25,7 @@ var _utils = require("@react-aria/utils");
  * 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.
  */
-function useToggleButton(props, state, ref) {
+function useToggleButton(props, state) {
   /* eslint-enable no-redeclare */
   const {
     isSelected
@@ -35,14 +35,11 @@ function useToggleButton(props, state, ref) {
     buttonProps
   } = (0, _useButton.useButton)({ ...props,
     onPress: (0, _utils.chain)(state.toggle, props.onPress)
-  }, ref);
+  });
   return {
     isPressed,
     buttonProps: (0, _utils.mergeProps)(buttonProps, {
-      // For v0.14+
-      'aria-pressed': isSelected,
-      // For v0.15+
-      accessibilityPressed: isSelected
+      'aria-pressed': isSelected
     })
   };
 }

package/lib/commonjs/useToggleButton.web.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToggleButton.web.ts"],"names":["useToggleButton","props","state","ref","isSelected","isPressed","buttonProps","onPress","toggle","accessibilityPressed"],"mappings":";;;;;;;AAcA;;AACA;;AAfA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AASA;AACA;AACA;AACA;AACO,SAASA,eAAT,CACLC,KADK,EAELC,KAFK,EAGLC,GAHK,EAIA;AACL;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAiBF,KAAvB;AACA,QAAM;AAAEG,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6B,0BACjC,EACE,GAAGL,KADL;AAEEM,IAAAA,OAAO,EAAE,kBAAML,KAAK,CAACM,MAAZ,EAAoBP,KAAK,CAACM,OAA1B;AAFX,GADiC,EAKjCJ,GALiC,CAAnC;AAQA,SAAO;AACLE,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAE,uBAAWA,WAAX,EAAwB;AACnC;AACA,sBAAgBF,UAFmB;AAInC;AACAK,MAAAA,oBAAoB,EAAEL;AALa,KAAxB;AAFR,GAAP;AAUD","sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { ElementType, RefObject } from 'react';\nimport { AriaToggleButtonProps } from '@react-types/button';\nimport { useButton } from './useButton';\nimport { chain } from '@react-aria/utils';\nimport { mergeProps } from '@react-aria/utils';\nimport { ToggleState } from '@react-stately/toggle';\n\n/**\n * Provides the behavior and accessibility implementation for a toggle button component.\n * ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes.\n */\nexport function useToggleButton(\n  props: AriaToggleButtonProps<ElementType>,\n  state: ToggleState,\n  ref: RefObject<any>\n): any {\n  /* eslint-enable no-redeclare */\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton(\n    {\n      ...props,\n      onPress: chain(state.toggle, props.onPress),\n    },\n    ref\n  );\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      // For v0.14+\n      'aria-pressed': isSelected,\n      \n      // For v0.15+\n      accessibilityPressed: isSelected,\n    }),\n  };\n}\n"]}
+{"version":3,"sources":["useToggleButton.web.ts"],"names":["useToggleButton","props","state","isSelected","isPressed","buttonProps","onPress","toggle"],"mappings":";;;;;;;AAcA;;AACA;;AAfA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AASA;AACA;AACA;AACA;AACO,SAASA,eAAT,CACLC,KADK,EAELC,KAFK,EAGA;AACL;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAiBD,KAAvB;AACA,QAAM;AAAEE,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6B,0BAAU,EAC3C,GAAGJ,KADwC;AAE3CK,IAAAA,OAAO,EAAE,kBAAMJ,KAAK,CAACK,MAAZ,EAAoBN,KAAK,CAACK,OAA1B;AAFkC,GAAV,CAAnC;AAKA,SAAO;AACLF,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAE,uBAAWA,WAAX,EAAwB;AACnC,sBAAgBF;AADmB,KAAxB;AAFR,GAAP;AAMD","sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { ElementType } from 'react';\nimport { AriaToggleButtonProps } from '@react-types/button';\nimport { useButton } from './useButton';\nimport { chain } from '@react-aria/utils';\nimport { mergeProps } from '@react-aria/utils';\nimport { ToggleState } from '@react-stately/toggle';\n\n/**\n * Provides the behavior and accessibility implementation for a toggle button component.\n * ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes.\n */\nexport function useToggleButton(\n  props: AriaToggleButtonProps<ElementType>,\n  state: ToggleState\n): any {\n  /* eslint-enable no-redeclare */\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton({\n    ...props,\n    onPress: chain(state.toggle, props.onPress),\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      'aria-pressed': isSelected,\n    }),\n  };\n}\n"]}

package/lib/module/useButton.js

@@ -1,6 +1,6 @@
-import { usePress } from "@react-native-aria/interactions";
-import { mergeProps } from "@react-aria/utils";
-export function useButton(props, ref) {
+import { usePress } from '@react-native-aria/interactions';
+import { mergeProps } from '@react-aria/utils';
+export function useButton(props) {
   let {
     isDisabled,
     onPress,
@@ -17,15 +17,12 @@ export function useButton(props, ref) {
     onPressEnd,
     onPressChange,
     onPress,
-    isDisabled,
-    ref
+    isDisabled
   });
   const mergedProps = mergeProps(pressProps, rest, {
-    accessibilityState: {
-      disabled: isDisabled
-    },
-    accessibilityRole: "button",
-    disabled: isDisabled
+    'aria-disabled': isDisabled,
+    'role': 'button',
+    'disabled': isDisabled
   });
   return {
     isPressed,

package/lib/module/useButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useButton.ts"],"names":["usePress","mergeProps","useButton","props","ref","isDisabled","onPress","onPressStart","onPressEnd","onPressChange","rest","pressProps","isPressed","mergedProps","accessibilityState","disabled","accessibilityRole","buttonProps"],"mappings":"AACA,SAAsBA,QAAtB,QAAsC,iCAAtC;AAEA,SAASC,UAAT,QAA2B,mBAA3B;AAkBA,OAAO,SAASC,SAAT,CACLC,KADK,EAELC,GAFK,EAGO;AACZ,MAAI;AACFC,IAAAA,UADE;AAEFC,IAAAA,OAFE;AAGFC,IAAAA,YAHE;AAIFC,IAAAA,UAJE;AAKFC,IAAAA,aALE;AAMF,OAAGC;AAND,MAOAP,KAPJ;AASA,MAAI;AAAEQ,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAA4BZ,QAAQ,CAAC;AACvCO,IAAAA,YADuC;AAEvCC,IAAAA,UAFuC;AAGvCC,IAAAA,aAHuC;AAIvCH,IAAAA,OAJuC;AAKvCD,IAAAA,UALuC;AAMvCD,IAAAA;AANuC,GAAD,CAAxC;AASA,QAAMS,WAAW,GAAGZ,UAAU,CAACU,UAAD,EAAaD,IAAb,EAAmB;AAC/CI,IAAAA,kBAAkB,EAAE;AAClBC,MAAAA,QAAQ,EAAEV;AADQ,KAD2B;AAI/CW,IAAAA,iBAAiB,EAAE,QAJ4B;AAK/CD,IAAAA,QAAQ,EAAEV;AALqC,GAAnB,CAA9B;AAQA,SAAO;AACLO,IAAAA,SADK;AAELK,IAAAA,WAAW,EAAEJ;AAFR,GAAP;AAID","sourcesContent":["import { ReactNode, RefObject } from \"react\";\nimport { PressEvents, usePress } from \"@react-native-aria/interactions\";\nimport { AccessibilityProps, PressableProps } from \"react-native\";\nimport { mergeProps } from \"@react-aria/utils\";\n\ninterface ButtonProps extends PressEvents {\n  /** Whether the button is disabled. */\n  isDisabled?: boolean;\n  /** The content to display in the button. */\n  children?: ReactNode;\n}\n\nexport interface RNAriaButtonProps extends AccessibilityProps, ButtonProps {}\n\nexport interface ButtonAria {\n  /** Props for the button element. */\n  buttonProps: PressableProps;\n  /** Whether the button is currently pressed. */\n  isPressed: boolean;\n}\n\nexport function useButton(\n  props: RNAriaButtonProps,\n  ref: RefObject<any>\n): ButtonAria {\n  let {\n    isDisabled,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    ...rest\n  } = props;\n\n  let { pressProps, isPressed } = usePress({\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPress,\n    isDisabled,\n    ref,\n  });\n\n  const mergedProps = mergeProps(pressProps, rest, {\n    accessibilityState: {\n      disabled: isDisabled,\n    },\n    accessibilityRole: \"button\",\n    disabled: isDisabled,\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergedProps,\n  };\n}\n"]}
+{"version":3,"sources":["useButton.ts"],"names":["usePress","mergeProps","useButton","props","isDisabled","onPress","onPressStart","onPressEnd","onPressChange","rest","pressProps","isPressed","mergedProps","buttonProps"],"mappings":"AACA,SAAsBA,QAAtB,QAAsC,iCAAtC;AAEA,SAASC,UAAT,QAA2B,mBAA3B;AAkBA,OAAO,SAASC,SAAT,CAAmBC,KAAnB,EAAyD;AAC9D,MAAI;AACFC,IAAAA,UADE;AAEFC,IAAAA,OAFE;AAGFC,IAAAA,YAHE;AAIFC,IAAAA,UAJE;AAKFC,IAAAA,aALE;AAMF,OAAGC;AAND,MAOAN,KAPJ;AASA,MAAI;AAAEO,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAA4BX,QAAQ,CAAC;AACvCM,IAAAA,YADuC;AAEvCC,IAAAA,UAFuC;AAGvCC,IAAAA,aAHuC;AAIvCH,IAAAA,OAJuC;AAKvCD,IAAAA;AALuC,GAAD,CAAxC;AAQA,QAAMQ,WAAW,GAAGX,UAAU,CAACS,UAAD,EAAaD,IAAb,EAAmB;AAC/C,qBAAiBL,UAD8B;AAE/C,YAAQ,QAFuC;AAG/C,gBAAYA;AAHmC,GAAnB,CAA9B;AAMA,SAAO;AACLO,IAAAA,SADK;AAELE,IAAAA,WAAW,EAAED;AAFR,GAAP;AAID","sourcesContent":["import { ReactNode } from 'react';\nimport { PressEvents, usePress } from '@react-native-aria/interactions';\nimport { AccessibilityProps, PressableProps } from 'react-native';\nimport { mergeProps } from '@react-aria/utils';\n\ninterface ButtonProps extends PressEvents {\n  /** Whether the button is disabled. */\n  isDisabled?: boolean;\n  /** The content to display in the button. */\n  children?: ReactNode;\n}\n\nexport interface RNAriaButtonProps extends AccessibilityProps, ButtonProps {}\n\nexport interface ButtonAria {\n  /** Props for the button element. */\n  buttonProps: PressableProps;\n  /** Whether the button is currently pressed. */\n  isPressed: boolean;\n}\n\nexport function useButton(props: RNAriaButtonProps): ButtonAria {\n  let {\n    isDisabled,\n    onPress,\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    ...rest\n  } = props;\n\n  let { pressProps, isPressed } = usePress({\n    onPressStart,\n    onPressEnd,\n    onPressChange,\n    onPress,\n    isDisabled,\n  });\n\n  const mergedProps = mergeProps(pressProps, rest, {\n    'aria-disabled': isDisabled,\n    'role': 'button',\n    'disabled': isDisabled,\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergedProps,\n  };\n}\n"]}

package/lib/module/useToggleButton.js

@@ -1,6 +1,6 @@
-import { useButton } from "./useButton";
-import { chain, mergeProps } from "@react-aria/utils";
-export function useToggleButton(props, state, ref) {
+import { useButton } from './useButton';
+import { chain, mergeProps } from '@react-aria/utils';
+export function useToggleButton(props, state) {
   const {
     isSelected
   } = state;
@@ -9,13 +9,11 @@ export function useToggleButton(props, state, ref) {
     buttonProps
   } = useButton({ ...props,
     onPress: chain(state.toggle, props.onPress)
-  }, ref);
+  });
   return {
     isPressed,
     buttonProps: mergeProps(buttonProps, {
-      accessibilityState: {
-        selected: isSelected
-      }
+      'aria-selected': isSelected
     })
   };
 }

package/lib/module/useToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToggleButton.ts"],"names":["useButton","chain","mergeProps","useToggleButton","props","state","ref","isSelected","isPressed","buttonProps","onPress","toggle","accessibilityState","selected"],"mappings":"AAAA,SAAqBA,SAArB,QAAsC,aAAtC;AAGA,SAASC,KAAT,EAAgBC,UAAhB,QAAkC,mBAAlC;AAkBA,OAAO,SAASC,eAAT,CACLC,KADK,EAELC,KAFK,EAGLC,GAHK,EAIO;AACZ,QAAM;AAAEC,IAAAA;AAAF,MAAiBF,KAAvB;AACA,QAAM;AAAEG,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6BT,SAAS,CAC1C,EACE,GAAGI,KADL;AAEEM,IAAAA,OAAO,EAAET,KAAK,CAACI,KAAK,CAACM,MAAP,EAAeP,KAAK,CAACM,OAArB;AAFhB,GAD0C,EAK1CJ,GAL0C,CAA5C;AAQA,SAAO;AACLE,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAEP,UAAU,CAACO,WAAD,EAAc;AACnCG,MAAAA,kBAAkB,EAAE;AAClBC,QAAAA,QAAQ,EAAEN;AADQ;AADe,KAAd;AAFlB,GAAP;AAQD","sourcesContent":["import { ButtonAria, useButton } from \"./useButton\";\nimport type { ToggleState } from \"@react-stately/toggle\";\nimport type { RefObject } from \"react\";\nimport { chain, mergeProps } from \"@react-aria/utils\";\nimport type { PressEvents } from \"@react-native-aria/interactions\";\nimport type { PressableProps } from \"react-native\";\n\nexport type AriaButtonProps = PressableProps &\n  PressEvents & {\n    isDisabled: boolean;\n  };\n\nexport interface AriaToggleButtonProps extends AriaButtonProps {\n  /** Whether the element should be selected (controlled). */\n  isSelected?: boolean;\n  /** Whether the element should be selected (uncontrolled). */\n  defaultSelected?: boolean;\n  /** Handler that is called when the element's selection state changes. */\n  onChange?: (isSelected: boolean) => void;\n}\n\nexport function useToggleButton(\n  props: AriaToggleButtonProps,\n  state: ToggleState,\n  ref: RefObject<any>\n): ButtonAria {\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton(\n    {\n      ...props,\n      onPress: chain(state.toggle, props.onPress),\n    },\n    ref\n  );\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      accessibilityState: {\n        selected: isSelected,\n      },\n    }),\n  };\n}\n"]}
+{"version":3,"sources":["useToggleButton.ts"],"names":["useButton","chain","mergeProps","useToggleButton","props","state","isSelected","isPressed","buttonProps","onPress","toggle"],"mappings":"AAAA,SAAqBA,SAArB,QAAsC,aAAtC;AAEA,SAASC,KAAT,EAAgBC,UAAhB,QAAkC,mBAAlC;AAkBA,OAAO,SAASC,eAAT,CACLC,KADK,EAELC,KAFK,EAGO;AACZ,QAAM;AAAEC,IAAAA;AAAF,MAAiBD,KAAvB;AACA,QAAM;AAAEE,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6BR,SAAS,CAAC,EAC3C,GAAGI,KADwC;AAE3CK,IAAAA,OAAO,EAAER,KAAK,CAACI,KAAK,CAACK,MAAP,EAAeN,KAAK,CAACK,OAArB;AAF6B,GAAD,CAA5C;AAKA,SAAO;AACLF,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAEN,UAAU,CAACM,WAAD,EAAc;AACnC,uBAAiBF;AADkB,KAAd;AAFlB,GAAP;AAMD","sourcesContent":["import { ButtonAria, useButton } from './useButton';\nimport type { ToggleState } from '@react-stately/toggle';\nimport { chain, mergeProps } from '@react-aria/utils';\nimport type { PressEvents } from '@react-native-aria/interactions';\nimport type { PressableProps } from 'react-native';\n\nexport type AriaButtonProps = PressableProps &\n  PressEvents & {\n    isDisabled: boolean;\n  };\n\nexport interface AriaToggleButtonProps extends AriaButtonProps {\n  /** Whether the element should be selected (controlled). */\n  isSelected?: boolean;\n  /** Whether the element should be selected (uncontrolled). */\n  defaultSelected?: boolean;\n  /** Handler that is called when the element's selection state changes. */\n  onChange?: (isSelected: boolean) => void;\n}\n\nexport function useToggleButton(\n  props: AriaToggleButtonProps,\n  state: ToggleState\n): ButtonAria {\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton({\n    ...props,\n    onPress: chain(state.toggle, props.onPress),\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      'aria-selected': isSelected,\n    }),\n  };\n}\n"]}

package/lib/module/useToggleButton.web.js

@@ -17,7 +17,7 @@ import { mergeProps } from '@react-aria/utils';
  * 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, state, ref) {
+export function useToggleButton(props, state) {
   /* eslint-enable no-redeclare */
   const {
     isSelected
@@ -27,14 +27,11 @@ export function useToggleButton(props, state, ref) {
     buttonProps
   } = useButton({ ...props,
     onPress: chain(state.toggle, props.onPress)
-  }, ref);
+  });
   return {
     isPressed,
     buttonProps: mergeProps(buttonProps, {
-      // For v0.14+
-      'aria-pressed': isSelected,
-      // For v0.15+
-      accessibilityPressed: isSelected
+      'aria-pressed': isSelected
     })
   };
 }

package/lib/module/useToggleButton.web.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToggleButton.web.ts"],"names":["useButton","chain","mergeProps","useToggleButton","props","state","ref","isSelected","isPressed","buttonProps","onPress","toggle","accessibilityPressed"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,SAAT,QAA0B,aAA1B;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;;AAGA;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAT,CACLC,KADK,EAELC,KAFK,EAGLC,GAHK,EAIA;AACL;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAiBF,KAAvB;AACA,QAAM;AAAEG,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6BT,SAAS,CAC1C,EACE,GAAGI,KADL;AAEEM,IAAAA,OAAO,EAAET,KAAK,CAACI,KAAK,CAACM,MAAP,EAAeP,KAAK,CAACM,OAArB;AAFhB,GAD0C,EAK1CJ,GAL0C,CAA5C;AAQA,SAAO;AACLE,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAEP,UAAU,CAACO,WAAD,EAAc;AACnC;AACA,sBAAgBF,UAFmB;AAInC;AACAK,MAAAA,oBAAoB,EAAEL;AALa,KAAd;AAFlB,GAAP;AAUD","sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { ElementType, RefObject } from 'react';\nimport { AriaToggleButtonProps } from '@react-types/button';\nimport { useButton } from './useButton';\nimport { chain } from '@react-aria/utils';\nimport { mergeProps } from '@react-aria/utils';\nimport { ToggleState } from '@react-stately/toggle';\n\n/**\n * Provides the behavior and accessibility implementation for a toggle button component.\n * ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes.\n */\nexport function useToggleButton(\n  props: AriaToggleButtonProps<ElementType>,\n  state: ToggleState,\n  ref: RefObject<any>\n): any {\n  /* eslint-enable no-redeclare */\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton(\n    {\n      ...props,\n      onPress: chain(state.toggle, props.onPress),\n    },\n    ref\n  );\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      // For v0.14+\n      'aria-pressed': isSelected,\n      \n      // For v0.15+\n      accessibilityPressed: isSelected,\n    }),\n  };\n}\n"]}
+{"version":3,"sources":["useToggleButton.web.ts"],"names":["useButton","chain","mergeProps","useToggleButton","props","state","isSelected","isPressed","buttonProps","onPress","toggle"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,SAASA,SAAT,QAA0B,aAA1B;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;;AAGA;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAT,CACLC,KADK,EAELC,KAFK,EAGA;AACL;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAiBD,KAAvB;AACA,QAAM;AAAEE,IAAAA,SAAF;AAAaC,IAAAA;AAAb,MAA6BR,SAAS,CAAC,EAC3C,GAAGI,KADwC;AAE3CK,IAAAA,OAAO,EAAER,KAAK,CAACI,KAAK,CAACK,MAAP,EAAeN,KAAK,CAACK,OAArB;AAF6B,GAAD,CAA5C;AAKA,SAAO;AACLF,IAAAA,SADK;AAELC,IAAAA,WAAW,EAAEN,UAAU,CAACM,WAAD,EAAc;AACnC,sBAAgBF;AADmB,KAAd;AAFlB,GAAP;AAMD","sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { ElementType } from 'react';\nimport { AriaToggleButtonProps } from '@react-types/button';\nimport { useButton } from './useButton';\nimport { chain } from '@react-aria/utils';\nimport { mergeProps } from '@react-aria/utils';\nimport { ToggleState } from '@react-stately/toggle';\n\n/**\n * Provides the behavior and accessibility implementation for a toggle button component.\n * ToggleButtons allow users to toggle a selection on or off, for example switching between two states or modes.\n */\nexport function useToggleButton(\n  props: AriaToggleButtonProps<ElementType>,\n  state: ToggleState\n): any {\n  /* eslint-enable no-redeclare */\n  const { isSelected } = state;\n  const { isPressed, buttonProps } = useButton({\n    ...props,\n    onPress: chain(state.toggle, props.onPress),\n  });\n\n  return {\n    isPressed,\n    buttonProps: mergeProps(buttonProps, {\n      'aria-pressed': isSelected,\n    }),\n  };\n}\n"]}

package/lib/typescript/useButton.d.ts

@@ -1,6 +1,6 @@
-import { ReactNode, RefObject } from "react";
-import { PressEvents } from "@react-native-aria/interactions";
-import { AccessibilityProps, PressableProps } from "react-native";
+import { ReactNode } from 'react';
+import { PressEvents } from '@react-native-aria/interactions';
+import { AccessibilityProps, PressableProps } from 'react-native';
 interface ButtonProps extends PressEvents {
     /** Whether the button is disabled. */
     isDisabled?: boolean;
@@ -15,5 +15,5 @@ export interface ButtonAria {
     /** Whether the button is currently pressed. */
     isPressed: boolean;
 }
-export declare function useButton(props: RNAriaButtonProps, ref: RefObject<any>): ButtonAria;
+export declare function useButton(props: RNAriaButtonProps): ButtonAria;
 export {};

package/lib/typescript/useToggleButton.d.ts

@@ -1,8 +1,7 @@
-import { ButtonAria } from "./useButton";
-import type { ToggleState } from "@react-stately/toggle";
-import type { RefObject } from "react";
-import type { PressEvents } from "@react-native-aria/interactions";
-import type { PressableProps } from "react-native";
+import { ButtonAria } from './useButton';
+import type { ToggleState } from '@react-stately/toggle';
+import type { PressEvents } from '@react-native-aria/interactions';
+import type { PressableProps } from 'react-native';
 export declare type AriaButtonProps = PressableProps & PressEvents & {
     isDisabled: boolean;
 };
@@ -14,4 +13,4 @@ export interface AriaToggleButtonProps extends AriaButtonProps {
     /** Handler that is called when the element's selection state changes. */
     onChange?: (isSelected: boolean) => void;
 }
-export declare function useToggleButton(props: AriaToggleButtonProps, state: ToggleState, ref: RefObject<any>): ButtonAria;
+export declare function useToggleButton(props: AriaToggleButtonProps, state: ToggleState): ButtonAria;

package/lib/typescript/useToggleButton.web.d.ts

@@ -1,8 +1,8 @@
-import { ElementType, RefObject } from 'react';
+import { ElementType } from 'react';
 import { AriaToggleButtonProps } from '@react-types/button';
 import { ToggleState } from '@react-stately/toggle';
 /**
  * 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 declare function useToggleButton(props: AriaToggleButtonProps<ElementType>, state: ToggleState, ref: RefObject<any>): any;
+export declare function useToggleButton(props: AriaToggleButtonProps<ElementType>, state: ToggleState): any;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-aria/button",
-  "version": "0.2.2",
+  "version": "0.2.5-alpha.0",
   "description": "mono repo setup with bob",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -47,8 +47,8 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@react-aria/utils": "^3.5.0",
-    "@react-native-aria/interactions": "^0.2.2",
+    "@react-aria/utils": "^3.6.0",
+    "@react-native-aria/interactions": "^0.2.3",
     "@react-stately/toggle": "^3.2.1",
     "@react-types/checkbox": "^3.2.1"
   },

package/src/useButton.ts

@@ -1,7 +1,7 @@
-import { ReactNode, RefObject } from "react";
-import { PressEvents, usePress } from "@react-native-aria/interactions";
-import { AccessibilityProps, PressableProps } from "react-native";
-import { mergeProps } from "@react-aria/utils";
+import { ReactNode } from 'react';
+import { PressEvents, usePress } from '@react-native-aria/interactions';
+import { AccessibilityProps, PressableProps } from 'react-native';
+import { mergeProps } from '@react-aria/utils';
 
 interface ButtonProps extends PressEvents {
   /** Whether the button is disabled. */
@@ -19,10 +19,7 @@ export interface ButtonAria {
   isPressed: boolean;
 }
 
-export function useButton(
-  props: RNAriaButtonProps,
-  ref: RefObject<any>
-): ButtonAria {
+export function useButton(props: RNAriaButtonProps): ButtonAria {
   let {
     isDisabled,
     onPress,
@@ -38,15 +35,12 @@ export function useButton(
     onPressChange,
     onPress,
     isDisabled,
-    ref,
   });
 
   const mergedProps = mergeProps(pressProps, rest, {
-    accessibilityState: {
-      disabled: isDisabled,
-    },
-    accessibilityRole: "button",
-    disabled: isDisabled,
+    'aria-disabled': isDisabled,
+    'role': 'button',
+    'disabled': isDisabled,
   });
 
   return {

package/src/useToggleButton.ts

@@ -1,9 +1,8 @@
-import { ButtonAria, useButton } from "./useButton";
-import type { ToggleState } from "@react-stately/toggle";
-import type { RefObject } from "react";
-import { chain, mergeProps } from "@react-aria/utils";
-import type { PressEvents } from "@react-native-aria/interactions";
-import type { PressableProps } from "react-native";
+import { ButtonAria, useButton } from './useButton';
+import type { ToggleState } from '@react-stately/toggle';
+import { chain, mergeProps } from '@react-aria/utils';
+import type { PressEvents } from '@react-native-aria/interactions';
+import type { PressableProps } from 'react-native';
 
 export type AriaButtonProps = PressableProps &
   PressEvents & {
@@ -21,24 +20,18 @@ export interface AriaToggleButtonProps extends AriaButtonProps {
 
 export function useToggleButton(
   props: AriaToggleButtonProps,
-  state: ToggleState,
-  ref: RefObject<any>
+  state: ToggleState
 ): ButtonAria {
   const { isSelected } = state;
-  const { isPressed, buttonProps } = useButton(
-    {
-      ...props,
-      onPress: chain(state.toggle, props.onPress),
-    },
-    ref
-  );
+  const { isPressed, buttonProps } = useButton({
+    ...props,
+    onPress: chain(state.toggle, props.onPress),
+  });
 
   return {
     isPressed,
     buttonProps: mergeProps(buttonProps, {
-      accessibilityState: {
-        selected: isSelected,
-      },
+      'aria-selected': isSelected,
     }),
   };
 }

package/src/useToggleButton.web.ts

@@ -10,7 +10,7 @@
  * governing permissions and limitations under the License.
  */
 
-import { ElementType, RefObject } from 'react';
+import { ElementType } from 'react';
 import { AriaToggleButtonProps } from '@react-types/button';
 import { useButton } from './useButton';
 import { chain } from '@react-aria/utils';
@@ -23,27 +23,19 @@ import { ToggleState } from '@react-stately/toggle';
  */
 export function useToggleButton(
   props: AriaToggleButtonProps<ElementType>,
-  state: ToggleState,
-  ref: RefObject<any>
+  state: ToggleState
 ): any {
   /* eslint-enable no-redeclare */
   const { isSelected } = state;
-  const { isPressed, buttonProps } = useButton(
-    {
-      ...props,
-      onPress: chain(state.toggle, props.onPress),
-    },
-    ref
-  );
+  const { isPressed, buttonProps } = useButton({
+    ...props,
+    onPress: chain(state.toggle, props.onPress),
+  });
 
   return {
     isPressed,
     buttonProps: mergeProps(buttonProps, {
-      // For v0.14+
       'aria-pressed': isSelected,
-      
-      // For v0.15+
-      accessibilityPressed: isSelected,
     }),
   };
 }