expo-checkbox 2.2.1 → 2.3.0

package/CHANGELOG.md

@@ -10,6 +10,16 @@
 
 ### 💡 Others
 
+## 2.3.0 — 2023-02-03
+
+### ⚠️ Notices
+
+- Remove deprecated `isAvailableAsync()` method. ([#20961](https://github.com/expo/expo/pull/20961) by [@Simek](https://github.com/Simek))
+
+## 2.2.2 — 2022-11-02
+
+_This version does not introduce any user-facing changes._
+
 ## 2.2.1 — 2022-10-25
 
 _This version does not introduce any user-facing changes._
@@ -26,7 +36,7 @@ _This version does not introduce any user-facing changes._
 
 ### 🛠 Breaking changes
 
-- Remove `isAvailableAsync()` and reimplement module in javascript. ([#13510](https://github.com/expo/expo/pull/13510) by [@ajsmth](https://github.com/ajsmth))
+- Deprecate `isAvailableAsync()` and reimplement module in javascript. ([#13510](https://github.com/expo/expo/pull/13510) by [@ajsmth](https://github.com/ajsmth))
 
 ## 1.0.3 — 2021-03-10
 

package/README.md

@@ -1,6 +1,6 @@
 # expo-checkbox
 
-`expo-checkbox` provides a material design styled checkbox on Android and web.
+`expo-checkbox` provides a basic `boolean` input element for Android, iOS and web.
 
 ## API documentation
 

package/build/Checkbox.d.ts

@@ -1,3 +1,6 @@
-export { default } from './ExpoCheckbox';
+import Checkbox from './ExpoCheckbox';
 export * from './Checkbox.types';
+export { Checkbox };
+/** @hidden */
+export default Checkbox;
 //# sourceMappingURL=Checkbox.d.ts.map

package/build/Checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAE,CAAC;AAEpB,cAAc;AACd,eAAe,QAAQ,CAAC"}

package/build/Checkbox.js

@@ -1,3 +1,6 @@
-export { default } from './ExpoCheckbox';
+import Checkbox from './ExpoCheckbox';
 export * from './Checkbox.types';
+export { Checkbox };
+/** @hidden */
+export default Checkbox;
 //# sourceMappingURL=Checkbox.js.map

package/build/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,cAAc,kBAAkB,CAAC","sourcesContent":["export { default } from './ExpoCheckbox';\nexport * from './Checkbox.types';\n"]}
+{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../src/Checkbox.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,cAAc,kBAAkB,CAAC;AAEjC,OAAO,EAAE,QAAQ,EAAE,CAAC;AAEpB,cAAc;AACd,eAAe,QAAQ,CAAC","sourcesContent":["import Checkbox from './ExpoCheckbox';\nexport * from './Checkbox.types';\n\nexport { Checkbox };\n\n/** @hidden */\nexport default Checkbox;\n"]}

package/build/Checkbox.types.d.ts

@@ -1,11 +1,20 @@
+import { SyntheticEvent } from 'react';
 import { ColorValue, NativeSyntheticEvent, ViewProps } from 'react-native';
-export declare type CheckboxEvent = NativeSyntheticEvent<{
-    target: number;
+export type CheckboxEvent = {
+    /**
+     * On native platforms, a `NodeHandle` for the element on which the event has occurred.
+     * On web, a DOM node on which the event has occurred.
+     */
+    target: any;
+    /**
+     * A boolean representing checkbox current value.
+     */
     value: boolean;
-}>;
-export declare type CheckboxProps = ViewProps & {
+};
+export type CheckboxProps = ViewProps & {
     /**
-     * Value indicating if the checkbox should be rendered as checked or not. Default value is `false`.
+     * Value indicating if the checkbox should be rendered as checked or not.
+     * @default false
      */
     value?: boolean;
     /**
@@ -20,17 +29,11 @@ export declare type CheckboxProps = ViewProps & {
      * Callback that is invoked when the user presses the checkbox.
      * @param event A native event containing the checkbox change.
      */
-    onChange?: (event: CheckboxEvent) => void;
+    onChange?: (event: NativeSyntheticEvent<CheckboxEvent> | SyntheticEvent<HTMLInputElement, CheckboxEvent>) => void;
     /**
      * Callback that is invoked when the user presses the checkbox.
      * @param value A boolean indicating the new checked state of the checkbox.
      */
     onValueChange?: (value: boolean) => void;
 };
-export declare type CheckboxComponent = React.FC<CheckboxProps> & {
-    /**
-     * @deprecated
-     */
-    isAvailableAsync: () => Promise<boolean>;
-};
 //# sourceMappingURL=Checkbox.types.d.ts.map

package/build/Checkbox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.types.d.ts","sourceRoot":"","sources":["../src/Checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG3E,oBAAY,aAAa,GAAG,oBAAoB,CAAC;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,OAAO,CAAA;CAAE,CAAC,CAAC;AAGrF,oBAAY,aAAa,GAAG,SAAS,GAAG;IACtC;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IAC1C;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAGF,oBAAY,iBAAiB,GAAG,KAAK,CAAC,EAAE,CAAC,aAAa,CAAC,GAAG;IACxD;;OAEG;IACH,gBAAgB,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;CAC1C,CAAC"}
+{"version":3,"file":"Checkbox.types.d.ts","sourceRoot":"","sources":["../src/Checkbox.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE3E,MAAM,MAAM,aAAa,GAAG;IAC1B;;;OAGG;IACH,MAAM,EAAE,GAAG,CAAC;IACZ;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;CAChB,CAAC;AAGF,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG;IACtC;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,oBAAoB,CAAC,aAAa,CAAC,GAAG,cAAc,CAAC,gBAAgB,EAAE,aAAa,CAAC,KACzF,IAAI,CAAC;IACV;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC"}

package/build/Checkbox.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.types.js","sourceRoot":"","sources":["../src/Checkbox.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ColorValue, NativeSyntheticEvent, ViewProps } from 'react-native';\n\n// @docsMissing\nexport type CheckboxEvent = NativeSyntheticEvent<{ target: number; value: boolean }>;\n\n// @needsAudit\nexport type CheckboxProps = ViewProps & {\n  /**\n   * Value indicating if the checkbox should be rendered as checked or not. Default value is `false`.\n   */\n  value?: boolean;\n  /**\n   * If the checkbox is disabled, it becomes opaque and uncheckable.\n   */\n  disabled?: boolean;\n  /**\n   * The tint or color of the checkbox. This overrides the disabled opaque style.\n   */\n  color?: ColorValue;\n  /**\n   * Callback that is invoked when the user presses the checkbox.\n   * @param event A native event containing the checkbox change.\n   */\n  onChange?: (event: CheckboxEvent) => void;\n  /**\n   * Callback that is invoked when the user presses the checkbox.\n   * @param value A boolean indicating the new checked state of the checkbox.\n   */\n  onValueChange?: (value: boolean) => void;\n};\n\n// @docsMissing\nexport type CheckboxComponent = React.FC<CheckboxProps> & {\n  /**\n   * @deprecated\n   */\n  isAvailableAsync: () => Promise<boolean>;\n};\n"]}
+{"version":3,"file":"Checkbox.types.js","sourceRoot":"","sources":["../src/Checkbox.types.ts"],"names":[],"mappings":"","sourcesContent":["import { SyntheticEvent } from 'react';\nimport { ColorValue, NativeSyntheticEvent, ViewProps } from 'react-native';\n\nexport type CheckboxEvent = {\n  /**\n   * On native platforms, a `NodeHandle` for the element on which the event has occurred.\n   * On web, a DOM node on which the event has occurred.\n   */\n  target: any;\n  /**\n   * A boolean representing checkbox current value.\n   */\n  value: boolean;\n};\n\n// @needsAudit\nexport type CheckboxProps = ViewProps & {\n  /**\n   * Value indicating if the checkbox should be rendered as checked or not.\n   * @default false\n   */\n  value?: boolean;\n  /**\n   * If the checkbox is disabled, it becomes opaque and uncheckable.\n   */\n  disabled?: boolean;\n  /**\n   * The tint or color of the checkbox. This overrides the disabled opaque style.\n   */\n  color?: ColorValue;\n  /**\n   * Callback that is invoked when the user presses the checkbox.\n   * @param event A native event containing the checkbox change.\n   */\n  onChange?: (\n    event: NativeSyntheticEvent<CheckboxEvent> | SyntheticEvent<HTMLInputElement, CheckboxEvent>\n  ) => void;\n  /**\n   * Callback that is invoked when the user presses the checkbox.\n   * @param value A boolean indicating the new checked state of the checkbox.\n   */\n  onValueChange?: (value: boolean) => void;\n};\n"]}

package/build/ExpoCheckbox.d.ts

@@ -1,4 +1,7 @@
-import { CheckboxComponent } from './Checkbox.types';
-declare const ExpoCheckbox: CheckboxComponent;
-export default ExpoCheckbox;
+import React from 'react';
+import { CheckboxProps } from './Checkbox.types';
+export default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {
+    private handleChange;
+    render(): JSX.Element;
+}
 //# sourceMappingURL=ExpoCheckbox.d.ts.map

package/build/ExpoCheckbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpoCheckbox.d.ts","sourceRoot":"","sources":["../src/ExpoCheckbox.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAKrD,QAAA,MAAM,YAAY,EAAE,iBAiCnB,CAAC;AAIF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ExpoCheckbox.d.ts","sourceRoot":"","sources":["../src/ExpoCheckbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKjD,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IAC1E,OAAO,CAAC,YAAY,CAElB;IAEF,MAAM;CA8BP"}

package/build/ExpoCheckbox.js

@@ -1,26 +1,26 @@
-import React, { useCallback } from 'react';
+import React from 'react';
 import { StyleSheet, Image, Pressable, Platform } from 'react-native';
 const checkmarkBase64 = 'data:image/png;base64,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';
-const ExpoCheckbox = (props) => {
-    const { color, disabled, onChange, onValueChange, style, value, ...other } = props;
-    const handleChange = useCallback(() => {
-        onValueChange && onValueChange(!value);
-    }, [onValueChange, value]);
-    return (React.createElement(Pressable, { ...other, disabled: disabled, 
-        // Announces "checked" status and "checkbox" as the focused element
-        accessibilityRole: "checkbox", accessibilityState: { disabled, checked: value }, style: [
-            styles.root,
-            style,
-            value && styles.checked,
-            !!color && { backgroundColor: value ? color : undefined, borderColor: color },
-            disabled && styles.disabled,
-            value && disabled && styles.checkedAndDisabled,
-        ], onPress: handleChange }, value && (React.createElement(Image, { source: {
-            uri: checkmarkBase64,
-        }, style: StyleSheet.absoluteFill }))));
-};
-ExpoCheckbox.displayName = 'Checkbox';
-export default ExpoCheckbox;
+export default class ExpoCheckbox extends React.PureComponent {
+    handleChange = () => {
+        this.props.onValueChange?.(!this.props.value);
+    };
+    render() {
+        const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;
+        return (React.createElement(Pressable, { ...other, disabled: disabled, 
+            // Announces "checked" status and "checkbox" as the focused element
+            accessibilityRole: "checkbox", accessibilityState: { disabled, checked: value }, style: [
+                styles.root,
+                style,
+                value && styles.checked,
+                !!color && { backgroundColor: value ? color : undefined, borderColor: color },
+                disabled && styles.disabled,
+                value && disabled && styles.checkedAndDisabled,
+            ], onPress: this.handleChange }, value && (React.createElement(Image, { source: {
+                uri: checkmarkBase64,
+            }, style: StyleSheet.absoluteFill }))));
+    }
+}
 const defaultEnabledColor = Platform.select({
     ios: '#007AFF',
     android: '#009688',
@@ -49,8 +49,4 @@ const styles = StyleSheet.create({
         borderColor: disabledCheckedGrayColor,
     },
 });
-ExpoCheckbox.isAvailableAsync = () => {
-    console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');
-    return Promise.resolve(true);
-};
 //# sourceMappingURL=ExpoCheckbox.js.map

package/build/ExpoCheckbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpoCheckbox.js","sourceRoot":"","sources":["../src/ExpoCheckbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAItE,MAAM,eAAe,GACnB,osJAAosJ,CAAC;AAEvsJ,MAAM,YAAY,GAAsB,CAAC,KAAK,EAAE,EAAE;IAChD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAEnF,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,aAAa,IAAI,aAAa,CAAC,CAAC,KAAK,CAAC,CAAC;IACzC,CAAC,EAAE,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC,CAAC;IAE3B,OAAO,CACL,oBAAC,SAAS,OACJ,KAAK,EACT,QAAQ,EAAE,QAAQ;QAClB,mEAAmE;QACnE,iBAAiB,EAAC,UAAU,EAC5B,kBAAkB,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,EAChD,KAAK,EAAE;YACL,MAAM,CAAC,IAAI;YACX,KAAK;YACL,KAAK,IAAI,MAAM,CAAC,OAAO;YACvB,CAAC,CAAC,KAAK,IAAI,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE;YAC7E,QAAQ,IAAI,MAAM,CAAC,QAAQ;YAC3B,KAAK,IAAI,QAAQ,IAAI,MAAM,CAAC,kBAAkB;SAC/C,EACD,OAAO,EAAE,YAAY,IACpB,KAAK,IAAI,CACR,oBAAC,KAAK,IACJ,MAAM,EAAE;YACN,GAAG,EAAE,eAAe;SACrB,EACD,KAAK,EAAE,UAAU,CAAC,YAAY,GAC9B,CACH,CACS,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,UAAU,CAAC;AAEtC,eAAe,YAAY,CAAC;AAE5B,MAAM,mBAAmB,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC1C,GAAG,EAAE,SAAS;IACd,OAAO,EAAE,SAAS;CACnB,CAAC,CAAC;AACH,MAAM,gBAAgB,GAAG,SAAS,CAAC;AACnC,MAAM,iBAAiB,GAAG,SAAS,CAAC;AACpC,MAAM,wBAAwB,GAAG,SAAS,CAAC;AAE3C,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE;QACJ,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,YAAY,EAAE,CAAC;QACf,WAAW,EAAE,CAAC;QACd,WAAW,EAAE,gBAAgB;KAC9B;IACD,OAAO,EAAE;QACP,eAAe,EAAE,mBAAmB;QACpC,WAAW,EAAE,mBAAmB;KACjC;IACD,QAAQ,EAAE;QACR,WAAW,EAAE,iBAAiB;QAC9B,eAAe,EAAE,aAAa;KAC/B;IACD,kBAAkB,EAAE;QAClB,eAAe,EAAE,wBAAwB;QACzC,WAAW,EAAE,wBAAwB;KACtC;CACF,CAAC,CAAC;AAEH,YAAY,CAAC,gBAAgB,GAAG,GAAG,EAAE;IACnC,OAAO,CAAC,IAAI,CAAC,kFAAkF,CAAC,CAAC;IACjG,OAAO,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/B,CAAC,CAAC","sourcesContent":["import React, { useCallback } from 'react';\nimport { StyleSheet, Image, Pressable, Platform } from 'react-native';\n\nimport { CheckboxComponent } from './Checkbox.types';\n\nconst checkmarkBase64 =\n  'data:image/png;base64,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';\n\nconst ExpoCheckbox: CheckboxComponent = (props) => {\n  const { color, disabled, onChange, onValueChange, style, value, ...other } = props;\n\n  const handleChange = useCallback(() => {\n    onValueChange && onValueChange(!value);\n  }, [onValueChange, value]);\n\n  return (\n    <Pressable\n      {...other}\n      disabled={disabled}\n      // Announces \"checked\" status and \"checkbox\" as the focused element\n      accessibilityRole=\"checkbox\"\n      accessibilityState={{ disabled, checked: value }}\n      style={[\n        styles.root,\n        style,\n        value && styles.checked,\n        !!color && { backgroundColor: value ? color : undefined, borderColor: color },\n        disabled && styles.disabled,\n        value && disabled && styles.checkedAndDisabled,\n      ]}\n      onPress={handleChange}>\n      {value && (\n        <Image\n          source={{\n            uri: checkmarkBase64,\n          }}\n          style={StyleSheet.absoluteFill}\n        />\n      )}\n    </Pressable>\n  );\n};\n\nExpoCheckbox.displayName = 'Checkbox';\n\nexport default ExpoCheckbox;\n\nconst defaultEnabledColor = Platform.select({\n  ios: '#007AFF',\n  android: '#009688',\n});\nconst defaultGrayColor = '#657786';\nconst disabledGrayColor = '#CCD6DD';\nconst disabledCheckedGrayColor = '#AAB8C2';\n\nconst styles = StyleSheet.create({\n  root: {\n    height: 20,\n    width: 20,\n    borderRadius: 2,\n    borderWidth: 2,\n    borderColor: defaultGrayColor,\n  },\n  checked: {\n    backgroundColor: defaultEnabledColor,\n    borderColor: defaultEnabledColor,\n  },\n  disabled: {\n    borderColor: disabledGrayColor,\n    backgroundColor: 'transparent',\n  },\n  checkedAndDisabled: {\n    backgroundColor: disabledCheckedGrayColor,\n    borderColor: disabledCheckedGrayColor,\n  },\n});\n\nExpoCheckbox.isAvailableAsync = () => {\n  console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');\n  return Promise.resolve(true);\n};\n"]}
+{"version":3,"file":"ExpoCheckbox.js","sourceRoot":"","sources":["../src/ExpoCheckbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAItE,MAAM,eAAe,GACnB,osJAAosJ,CAAC;AAEvsJ,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,aAA4B;IAClE,YAAY,GAAG,GAAG,EAAE;QAC1B,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAExF,OAAO,CACL,oBAAC,SAAS,OACJ,KAAK,EACT,QAAQ,EAAE,QAAQ;YAClB,mEAAmE;YACnE,iBAAiB,EAAC,UAAU,EAC5B,kBAAkB,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,EAChD,KAAK,EAAE;gBACL,MAAM,CAAC,IAAI;gBACX,KAAK;gBACL,KAAK,IAAI,MAAM,CAAC,OAAO;gBACvB,CAAC,CAAC,KAAK,IAAI,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE;gBAC7E,QAAQ,IAAI,MAAM,CAAC,QAAQ;gBAC3B,KAAK,IAAI,QAAQ,IAAI,MAAM,CAAC,kBAAkB;aAC/C,EACD,OAAO,EAAE,IAAI,CAAC,YAAY,IACzB,KAAK,IAAI,CACR,oBAAC,KAAK,IACJ,MAAM,EAAE;gBACN,GAAG,EAAE,eAAe;aACrB,EACD,KAAK,EAAE,UAAU,CAAC,YAAY,GAC9B,CACH,CACS,CACb,CAAC;IACJ,CAAC;CACF;AAED,MAAM,mBAAmB,GAAG,QAAQ,CAAC,MAAM,CAAC;IAC1C,GAAG,EAAE,SAAS;IACd,OAAO,EAAE,SAAS;CACnB,CAAC,CAAC;AACH,MAAM,gBAAgB,GAAG,SAAS,CAAC;AACnC,MAAM,iBAAiB,GAAG,SAAS,CAAC;AACpC,MAAM,wBAAwB,GAAG,SAAS,CAAC;AAE3C,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE;QACJ,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,YAAY,EAAE,CAAC;QACf,WAAW,EAAE,CAAC;QACd,WAAW,EAAE,gBAAgB;KAC9B;IACD,OAAO,EAAE;QACP,eAAe,EAAE,mBAAmB;QACpC,WAAW,EAAE,mBAAmB;KACjC;IACD,QAAQ,EAAE;QACR,WAAW,EAAE,iBAAiB;QAC9B,eAAe,EAAE,aAAa;KAC/B;IACD,kBAAkB,EAAE;QAClB,eAAe,EAAE,wBAAwB;QACzC,WAAW,EAAE,wBAAwB;KACtC;CACF,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { StyleSheet, Image, Pressable, Platform } from 'react-native';\n\nimport { CheckboxProps } from './Checkbox.types';\n\nconst checkmarkBase64 =\n  'data:image/png;base64,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';\n\nexport default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {\n  private handleChange = () => {\n    this.props.onValueChange?.(!this.props.value);\n  };\n\n  render() {\n    const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;\n\n    return (\n      <Pressable\n        {...other}\n        disabled={disabled}\n        // Announces \"checked\" status and \"checkbox\" as the focused element\n        accessibilityRole=\"checkbox\"\n        accessibilityState={{ disabled, checked: value }}\n        style={[\n          styles.root,\n          style,\n          value && styles.checked,\n          !!color && { backgroundColor: value ? color : undefined, borderColor: color },\n          disabled && styles.disabled,\n          value && disabled && styles.checkedAndDisabled,\n        ]}\n        onPress={this.handleChange}>\n        {value && (\n          <Image\n            source={{\n              uri: checkmarkBase64,\n            }}\n            style={StyleSheet.absoluteFill}\n          />\n        )}\n      </Pressable>\n    );\n  }\n}\n\nconst defaultEnabledColor = Platform.select({\n  ios: '#007AFF',\n  android: '#009688',\n});\nconst defaultGrayColor = '#657786';\nconst disabledGrayColor = '#CCD6DD';\nconst disabledCheckedGrayColor = '#AAB8C2';\n\nconst styles = StyleSheet.create({\n  root: {\n    height: 20,\n    width: 20,\n    borderRadius: 2,\n    borderWidth: 2,\n    borderColor: defaultGrayColor,\n  },\n  checked: {\n    backgroundColor: defaultEnabledColor,\n    borderColor: defaultEnabledColor,\n  },\n  disabled: {\n    borderColor: disabledGrayColor,\n    backgroundColor: 'transparent',\n  },\n  checkedAndDisabled: {\n    backgroundColor: disabledCheckedGrayColor,\n    borderColor: disabledCheckedGrayColor,\n  },\n});\n"]}

package/build/ExpoCheckbox.web.d.ts

@@ -7,8 +7,11 @@
  *
  * see: https://github.com/necolas/react-native-web
  */
-import { CheckboxComponent } from './Checkbox.types';
-declare const ExpoCheckbox: CheckboxComponent;
-export default ExpoCheckbox;
+import React from 'react';
+import { CheckboxProps } from './Checkbox.types';
+export default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {
+    private handleChange;
+    render(): JSX.Element;
+}
 export declare const name = "ExpoCheckbox";
 //# sourceMappingURL=ExpoCheckbox.web.d.ts.map

package/build/ExpoCheckbox.web.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpoCheckbox.web.d.ts","sourceRoot":"","sources":["../src/ExpoCheckbox.web.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAMH,OAAO,EAAE,iBAAiB,EAAiB,MAAM,kBAAkB,CAAC;AAEpE,QAAA,MAAM,YAAY,EAAE,iBA0CnB,CAAC;AA2DF,eAAe,YAAY,CAAC;AAO5B,eAAO,MAAM,IAAI,iBAAiB,CAAC"}
+{"version":3,"file":"ExpoCheckbox.web.d.ts","sourceRoot":"","sources":["../src/ExpoCheckbox.web.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,aAAa,EAAiB,MAAM,kBAAkB,CAAC;AAEhE,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC;IAC1E,OAAO,CAAC,YAAY,CAKlB;IAEF,MAAM;CAkCP;AAyDD,eAAO,MAAM,IAAI,iBAAiB,CAAC"}

package/build/ExpoCheckbox.web.js

@@ -7,38 +7,40 @@
  *
  * see: https://github.com/necolas/react-native-web
  */
-import React, { useCallback } from 'react';
+import React from 'react';
 // @ts-ignore
 import { StyleSheet, View, unstable_createElement as createElement } from 'react-native';
-const ExpoCheckbox = (props) => {
-    const { color, disabled, onChange, onValueChange, style, value, ...other } = props;
-    const handleChange = useCallback((event) => {
+export default class ExpoCheckbox extends React.PureComponent {
+    handleChange = (event) => {
         const value = event.nativeEvent.target.checked;
         event.nativeEvent.value = value;
-        onChange && onChange(event);
-        onValueChange && onValueChange(value);
-    }, [onChange, onValueChange]);
-    const fakeControl = (React.createElement(View, { pointerEvents: "none", style: [
-            styles.fakeControl,
-            value && styles.fakeControlChecked,
-            // custom color
-            !!color && { backgroundColor: value ? color : undefined, borderColor: color },
-            disabled && styles.fakeControlDisabled,
-            value && disabled && styles.fakeControlCheckedAndDisabled,
-        ] }));
-    const nativeControl = createElement('input', {
-        accessibilityState: { disabled, checked: value },
-        checked: value,
-        disabled,
-        onChange: handleChange,
-        style: [styles.nativeControl, styles.cursorInherit],
-        type: 'checkbox',
-    });
-    return (React.createElement(View, { ...other, style: [styles.root, style, disabled && styles.cursorDefault] },
-        nativeControl,
-        fakeControl));
-};
-ExpoCheckbox.displayName = 'Checkbox';
+        this.props.onChange?.(event);
+        this.props.onValueChange?.(value);
+    };
+    render() {
+        const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;
+        const fakeControl = (React.createElement(View, { pointerEvents: "none", style: [
+                styles.fakeControl,
+                value && styles.fakeControlChecked,
+                // custom color
+                !!color && { backgroundColor: value ? color : undefined, borderColor: color },
+                disabled && styles.fakeControlDisabled,
+                value && disabled && styles.fakeControlCheckedAndDisabled,
+            ] }));
+        const nativeControl = createElement('input', {
+            accessibilityChecked: value,
+            accessibilityDisabled: disabled,
+            checked: value,
+            disabled,
+            onChange: this.handleChange,
+            style: [styles.nativeControl, styles.cursorInherit],
+            type: 'checkbox',
+        });
+        return (React.createElement(View, { ...other, style: [styles.root, style, disabled && styles.cursorDefault] },
+            nativeControl,
+            fakeControl));
+    }
+}
 const styles = StyleSheet.create({
     root: {
         // @ts-ignore
@@ -91,10 +93,5 @@ const styles = StyleSheet.create({
         WebkitAppearance: 'none',
     },
 });
-export default ExpoCheckbox;
-ExpoCheckbox.isAvailableAsync = () => {
-    console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');
-    return Promise.resolve(true);
-};
 export const name = 'ExpoCheckbox';
 //# sourceMappingURL=ExpoCheckbox.web.js.map

package/build/ExpoCheckbox.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpoCheckbox.web.js","sourceRoot":"","sources":["../src/ExpoCheckbox.web.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n * Copyright (c) Nicolas Gallagher.\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * see: https://github.com/necolas/react-native-web\n */\n\nimport React, { useCallback } from 'react';\n// @ts-ignore\nimport { StyleSheet, View, unstable_createElement as createElement } from 'react-native';\n\nimport { CheckboxComponent, CheckboxEvent } from './Checkbox.types';\n\nconst ExpoCheckbox: CheckboxComponent = (props) => {\n  const { color, disabled, onChange, onValueChange, style, value, ...other } = props;\n\n  const handleChange = useCallback(\n    (event: CheckboxEvent) => {\n      const value = (event.nativeEvent.target as unknown as HTMLInputElement).checked;\n      event.nativeEvent.value = value;\n      onChange && onChange(event);\n      onValueChange && onValueChange(value);\n    },\n    [onChange, onValueChange]\n  );\n\n  const fakeControl = (\n    <View\n      pointerEvents=\"none\"\n      style={[\n        styles.fakeControl,\n        value && styles.fakeControlChecked,\n        // custom color\n        !!color && { backgroundColor: value ? color : undefined, borderColor: color },\n        disabled && styles.fakeControlDisabled,\n        value && disabled && styles.fakeControlCheckedAndDisabled,\n      ]}\n    />\n  );\n\n  const nativeControl = createElement('input', {\n    accessibilityState: { disabled, checked: value },\n    checked: value,\n    disabled,\n    onChange: handleChange,\n    style: [styles.nativeControl, styles.cursorInherit],\n    type: 'checkbox',\n  });\n\n  return (\n    <View {...other} style={[styles.root, style, disabled && styles.cursorDefault]}>\n      {nativeControl}\n      {fakeControl}\n    </View>\n  );\n};\n\nExpoCheckbox.displayName = 'Checkbox';\n\nconst styles = StyleSheet.create({\n  root: {\n    // @ts-ignore\n    cursor: 'pointer',\n    height: 16,\n    userSelect: 'none',\n    width: 16,\n  },\n  cursorDefault: {\n    // @ts-ignore\n    cursor: 'default',\n  },\n\n  cursorInherit: {\n    // @ts-ignore\n    cursor: 'inherit',\n  },\n  fakeControl: {\n    ...StyleSheet.absoluteFillObject,\n    alignItems: 'center',\n    backgroundColor: '#fff',\n    borderColor: '#657786',\n    borderRadius: 2,\n    borderStyle: 'solid',\n    borderWidth: 2,\n    height: '100%',\n    justifyContent: 'center',\n    width: '100%',\n  },\n  fakeControlChecked: {\n    backgroundColor: '#009688',\n    // @ts-ignore\n    backgroundImage:\n      'url(\"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K\")',\n    backgroundRepeat: 'no-repeat',\n    borderColor: '#009688',\n  },\n  fakeControlDisabled: {\n    borderColor: '#CCD6DD',\n  },\n  fakeControlCheckedAndDisabled: {\n    backgroundColor: '#AAB8C2',\n    borderColor: '#AAB8C2',\n  },\n  nativeControl: {\n    ...StyleSheet.absoluteFillObject,\n    height: '100%',\n    margin: 0,\n    padding: 0,\n    width: '100%',\n    // @ts-ignore\n    WebkitAppearance: 'none',\n  },\n});\n\nexport default ExpoCheckbox;\n\nExpoCheckbox.isAvailableAsync = () => {\n  console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');\n  return Promise.resolve(true);\n};\n\nexport const name = 'ExpoCheckbox';\n"]}
+{"version":3,"file":"ExpoCheckbox.web.js","sourceRoot":"","sources":["../src/ExpoCheckbox.web.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,aAAa;AACb,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,sBAAsB,IAAI,aAAa,EAAE,MAAM,cAAc,CAAC;AAIzF,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,KAAK,CAAC,aAA4B;IAClE,YAAY,GAAG,CAAC,KAA4D,EAAE,EAAE;QACtF,MAAM,KAAK,GAAG,KAAK,CAAC,WAAW,CAAC,MAAM,CAAC,OAAO,CAAC;QAC/C,KAAK,CAAC,WAAW,CAAC,KAAK,GAAG,KAAK,CAAC;QAChC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,CAAC;QAC7B,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC,KAAK,CAAC,CAAC;IACpC,CAAC,CAAC;IAEF,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAExF,MAAM,WAAW,GAAG,CAClB,oBAAC,IAAI,IACH,aAAa,EAAC,MAAM,EACpB,KAAK,EAAE;gBACL,MAAM,CAAC,WAAW;gBAClB,KAAK,IAAI,MAAM,CAAC,kBAAkB;gBAClC,eAAe;gBACf,CAAC,CAAC,KAAK,IAAI,EAAE,eAAe,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE;gBAC7E,QAAQ,IAAI,MAAM,CAAC,mBAAmB;gBACtC,KAAK,IAAI,QAAQ,IAAI,MAAM,CAAC,6BAA6B;aAC1D,GACD,CACH,CAAC;QAEF,MAAM,aAAa,GAAG,aAAa,CAAC,OAAO,EAAE;YAC3C,oBAAoB,EAAE,KAAK;YAC3B,qBAAqB,EAAE,QAAQ;YAC/B,OAAO,EAAE,KAAK;YACd,QAAQ;YACR,QAAQ,EAAE,IAAI,CAAC,YAAY;YAC3B,KAAK,EAAE,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,aAAa,CAAC;YACnD,IAAI,EAAE,UAAU;SACjB,CAAC,CAAC;QAEH,OAAO,CACL,oBAAC,IAAI,OAAK,KAAK,EAAE,KAAK,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,IAAI,MAAM,CAAC,aAAa,CAAC;YAC3E,aAAa;YACb,WAAW,CACP,CACR,CAAC;IACJ,CAAC;CACF;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,IAAI,EAAE;QACJ,aAAa;QACb,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,EAAE;QACV,UAAU,EAAE,MAAM;QAClB,KAAK,EAAE,EAAE;KACV;IACD,aAAa,EAAE;QACb,aAAa;QACb,MAAM,EAAE,SAAS;KAClB;IAED,aAAa,EAAE;QACb,aAAa;QACb,MAAM,EAAE,SAAS;KAClB;IACD,WAAW,EAAE;QACX,GAAG,UAAU,CAAC,kBAAkB;QAChC,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,MAAM;QACvB,WAAW,EAAE,SAAS;QACtB,YAAY,EAAE,CAAC;QACf,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,CAAC;QACd,MAAM,EAAE,MAAM;QACd,cAAc,EAAE,QAAQ;QACxB,KAAK,EAAE,MAAM;KACd;IACD,kBAAkB,EAAE;QAClB,eAAe,EAAE,SAAS;QAC1B,aAAa;QACb,eAAe,EACb,m4BAAm4B;QACr4B,gBAAgB,EAAE,WAAW;QAC7B,WAAW,EAAE,SAAS;KACvB;IACD,mBAAmB,EAAE;QACnB,WAAW,EAAE,SAAS;KACvB;IACD,6BAA6B,EAAE;QAC7B,eAAe,EAAE,SAAS;QAC1B,WAAW,EAAE,SAAS;KACvB;IACD,aAAa,EAAE;QACb,GAAG,UAAU,CAAC,kBAAkB;QAChC,MAAM,EAAE,MAAM;QACd,MAAM,EAAE,CAAC;QACT,OAAO,EAAE,CAAC;QACV,KAAK,EAAE,MAAM;QACb,aAAa;QACb,gBAAgB,EAAE,MAAM;KACzB;CACF,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,IAAI,GAAG,cAAc,CAAC","sourcesContent":["/**\n * Copyright (c) Nicolas Gallagher.\n * Copyright (c) Facebook, Inc. and its affiliates.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n *\n * see: https://github.com/necolas/react-native-web\n */\n\nimport React from 'react';\n// @ts-ignore\nimport { StyleSheet, View, unstable_createElement as createElement } from 'react-native';\n\nimport { CheckboxProps, CheckboxEvent } from './Checkbox.types';\n\nexport default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {\n  private handleChange = (event: React.SyntheticEvent<HTMLInputElement, CheckboxEvent>) => {\n    const value = event.nativeEvent.target.checked;\n    event.nativeEvent.value = value;\n    this.props.onChange?.(event);\n    this.props.onValueChange?.(value);\n  };\n\n  render() {\n    const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;\n\n    const fakeControl = (\n      <View\n        pointerEvents=\"none\"\n        style={[\n          styles.fakeControl,\n          value && styles.fakeControlChecked,\n          // custom color\n          !!color && { backgroundColor: value ? color : undefined, borderColor: color },\n          disabled && styles.fakeControlDisabled,\n          value && disabled && styles.fakeControlCheckedAndDisabled,\n        ]}\n      />\n    );\n\n    const nativeControl = createElement('input', {\n      accessibilityChecked: value,\n      accessibilityDisabled: disabled,\n      checked: value,\n      disabled,\n      onChange: this.handleChange,\n      style: [styles.nativeControl, styles.cursorInherit],\n      type: 'checkbox',\n    });\n\n    return (\n      <View {...other} style={[styles.root, style, disabled && styles.cursorDefault]}>\n        {nativeControl}\n        {fakeControl}\n      </View>\n    );\n  }\n}\n\nconst styles = StyleSheet.create({\n  root: {\n    // @ts-ignore\n    cursor: 'pointer',\n    height: 16,\n    userSelect: 'none',\n    width: 16,\n  },\n  cursorDefault: {\n    // @ts-ignore\n    cursor: 'default',\n  },\n\n  cursorInherit: {\n    // @ts-ignore\n    cursor: 'inherit',\n  },\n  fakeControl: {\n    ...StyleSheet.absoluteFillObject,\n    alignItems: 'center',\n    backgroundColor: '#fff',\n    borderColor: '#657786',\n    borderRadius: 2,\n    borderStyle: 'solid',\n    borderWidth: 2,\n    height: '100%',\n    justifyContent: 'center',\n    width: '100%',\n  },\n  fakeControlChecked: {\n    backgroundColor: '#009688',\n    // @ts-ignore\n    backgroundImage:\n      'url(\"data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgdmVyc2lvbj0iMS4xIgogICB2aWV3Qm94PSIwIDAgMSAxIgogICBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJ4TWluWU1pbiBtZWV0Ij4KICA8cGF0aAogICAgIGQ9Ik0gMC4wNDAzODA1OSwwLjYyNjc3NjcgMC4xNDY0NDY2MSwwLjUyMDcxMDY4IDAuNDI5Mjg5MzIsMC44MDM1NTMzOSAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IE0gMC4yMTcxNTcyOSwwLjgwMzU1MzM5IDAuODUzNTUzMzksMC4xNjcxNTcyOSAwLjk1OTYxOTQxLDAuMjczMjIzMyAwLjMyMzIyMzMsMC45MDk2MTk0MSB6IgogICAgIGlkPSJyZWN0Mzc4MCIKICAgICBzdHlsZT0iZmlsbDojZmZmZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPgo8L3N2Zz4K\")',\n    backgroundRepeat: 'no-repeat',\n    borderColor: '#009688',\n  },\n  fakeControlDisabled: {\n    borderColor: '#CCD6DD',\n  },\n  fakeControlCheckedAndDisabled: {\n    backgroundColor: '#AAB8C2',\n    borderColor: '#AAB8C2',\n  },\n  nativeControl: {\n    ...StyleSheet.absoluteFillObject,\n    height: '100%',\n    margin: 0,\n    padding: 0,\n    width: '100%',\n    // @ts-ignore\n    WebkitAppearance: 'none',\n  },\n});\n\nexport const name = 'ExpoCheckbox';\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "expo-checkbox",
-  "version": "2.2.1",
+  "version": "2.3.0",
   "description": "Basic checkbox for iOS, Android, and web",
   "main": "build/Checkbox.js",
   "types": "build/Checkbox.d.ts",
@@ -30,10 +30,13 @@
   "license": "MIT",
   "homepage": "https://docs.expo.dev/versions/latest/sdk/checkbox",
   "devDependencies": {
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/react-native": "^11.3.0",
     "expo-module-scripts": "^3.0.0"
   },
   "jest": {
-    "preset": "expo-module-scripts/enzyme"
+    "preset": "expo-module-scripts"
   },
-  "gitHead": "eab2b09c735fb0fc2bf734a3f29a6593adba3838"
+  "gitHead": "1815e2eaad8c753588c7b1eb74420174a28e01f4"
 }

package/src/Checkbox.ts

@@ -1,2 +1,7 @@
-export { default } from './ExpoCheckbox';
+import Checkbox from './ExpoCheckbox';
 export * from './Checkbox.types';
+
+export { Checkbox };
+
+/** @hidden */
+export default Checkbox;

package/src/Checkbox.types.ts

@@ -1,12 +1,23 @@
+import { SyntheticEvent } from 'react';
 import { ColorValue, NativeSyntheticEvent, ViewProps } from 'react-native';
 
-// @docsMissing
-export type CheckboxEvent = NativeSyntheticEvent<{ target: number; value: boolean }>;
+export type CheckboxEvent = {
+  /**
+   * On native platforms, a `NodeHandle` for the element on which the event has occurred.
+   * On web, a DOM node on which the event has occurred.
+   */
+  target: any;
+  /**
+   * A boolean representing checkbox current value.
+   */
+  value: boolean;
+};
 
 // @needsAudit
 export type CheckboxProps = ViewProps & {
   /**
-   * Value indicating if the checkbox should be rendered as checked or not. Default value is `false`.
+   * Value indicating if the checkbox should be rendered as checked or not.
+   * @default false
    */
   value?: boolean;
   /**
@@ -21,18 +32,12 @@ export type CheckboxProps = ViewProps & {
    * Callback that is invoked when the user presses the checkbox.
    * @param event A native event containing the checkbox change.
    */
-  onChange?: (event: CheckboxEvent) => void;
+  onChange?: (
+    event: NativeSyntheticEvent<CheckboxEvent> | SyntheticEvent<HTMLInputElement, CheckboxEvent>
+  ) => void;
   /**
    * Callback that is invoked when the user presses the checkbox.
    * @param value A boolean indicating the new checked state of the checkbox.
    */
   onValueChange?: (value: boolean) => void;
 };
-
-// @docsMissing
-export type CheckboxComponent = React.FC<CheckboxProps> & {
-  /**
-   * @deprecated
-   */
-  isAvailableAsync: () => Promise<boolean>;
-};

package/src/ExpoCheckbox.tsx

@@ -1,49 +1,47 @@
-import React, { useCallback } from 'react';
+import React from 'react';
 import { StyleSheet, Image, Pressable, Platform } from 'react-native';
 
-import { CheckboxComponent } from './Checkbox.types';
+import { CheckboxProps } from './Checkbox.types';
 
 const checkmarkBase64 =
   'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZAAAAGQCAYAAACAvzbMAAAACXBIWXMAFxGDABcRgwEFErJzAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAADY1JREFUeJzt3TuOrOtZhuGnFyKxnSMYgGWJKeBgyxFj2EhIZgxMAuQpIO0IOwXJ2hEQMAUSJEIExJDin4D12+vUq+vwvf93uq6wg9KjDvrWW9VVlQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADAso7j+P3eGwCYzHEcPz2O49+O4/jj3lsAmMT7ePz38f/+U0QAeNMn8ThEBIA3vRIPEQHgdW/EQ0QA+NyN8RARAH7nzniICAAPx0NEAHb2ZDxEBGBHjeIhIgA7aRwPEQHYQVE8RARgZcXxEBGAFV0UDxEBWMnF8RARgBV0ioeIAMysczxEBGBGg8TjNEVEXnoPAOjtOI6fJvl1kh/13vKB/0rys5eXl3/pPeQ1AgJsbdB4nIaOiIAA2xo8HqdhIyIgwJYmicdpyIgICLCdyeJxGi4iAgJsZdJ4nIaKiIAA25g8HqdhIiIgwBYWicdpiIgICLC8xeJx6h4RAQGWtmg8Tl0jIiDAshaPx6lbRAQEWNIm8Th1iYiAAMvZLB6nyyMiIMBSNo3H6dKICAiwjM3jcbosIgICLEE8PnJJRAQEmJ54fFF5RAQEmJp4fFVpRAQEmJZ43KQsIgICTEk87lISEQEBpiMeD2keEQEBpiIeT2kaEQEBpiEeTTSLiIAAUxCPpppE5F2jMQBljuP4Jsn3EY9W/iDJz599EBcIMDSXR4lfJvmzl5eX/33mQQQEGJZ4lGgSj0RAgEGJR4lm8UgEBBiQeJRoGo9EQIDBiEeJ5vFIBAQYiHiUKIlHIiDAIMSjRFk8EgEBBiAeJUrjkQgI0Jl4lCiPRyIgQEfiUeKSeCQCAnQiHiUui0ciIEAH4lHi0ngkAgJcTDxKXB6PRECAC4lHiS7xSAQEuIh4lOgWj0RAgAuIR4mu8UgEBCgmHiW6xyMREKCQeJQYIh6JgABFxKPEMPFIBAQoIB4lhopHIiBAY+JRYrh4JAICNCQeJYaMRyIgQCPiUWLYeCQCAjQgHiWGjkciIMCTxKPE8PFIBAR4gniUmCIeiYAADxKPEtPEIxEQ4AHiUWKqeCQCAtxJPEpMF49EQIA7iEeJKeORCAhwI/EoMW08EgEBbiAeJaaORyIgwBvEo8T08UgEBPgK8SixRDwSAQFeIR4llolHIiDAF4hHiaXikQgI8AnxKLFcPBIBAT4gHiWWjEciIMB74lFi2XgkAgJEPIosHY9EQGB74lFi+XgkAgJbE48SW8QjERDYlniU2CYeiYDAlsSjxFbxSAQEtiMeJbaLRyIgsBXxKLFlPBIBgW2IR4lt45EICGxBPEpsHY9EQGB54lFi+3gkAgJLE48S4vGegMCixKOEeHxAQGBB4lFCPD4hILAY8SghHl8gILAQ8SghHq8QEFiEeJQQj68QEFiAeJQQjzcICExOPEqIxw0EBCYmHiXE40YCApMSjxLicQcBgQmJRwnxuJOAwGTEo4R4PEBAYCLiUUI8HiQgMAnxKCEeTxAQmIB4lBCPJwkIDE48SohHAwICAxOPEuLRiIDAoMSjhHg0JCAwIPEoIR6NCQgMRjxKiEcBAYGBiEcJ8SgiIDAI8SghHoUEBAYgHiXEo5iAQGfiUUI8LiAg0JF4lBCPiwgIdCIeJcTjQgICHYhHCfG4mIDAxcSjhHh0ICBwIfEoIR6dCAhcRDxKiEdHAgIXEI8S4tGZgEAx8SghHgMQECgkHiXEYxACAkXEo4R4DERAoIB4lBCPwQgINCYeJcRjQAICDYlHCfEYlIBAI+JRQjwGJiDQgHiUEI/BCQg8STxKiMcEBASeIB4lxGMSAgIPEo8S4jERAYEHiEcJ8ZiMgMCdxKOEeExIQOAO4lFCPCYlIHAj8SghHhMTELiBeJQQj8kJCLxBPEqIxwIEBL5CPEqIxyLe9R5wheM43h3H8ZfHcfyw9xbmcRzHN0m+j3i09F2Sb8VjDcsH5DiOd0n+JslfJfn+OA5/DHjT+8vj75L8oPeWhfwyyV+8vLz8pvcQ2lj6KawP4vHnH/z4n5P86cvLy//0WcXoPG1VwtNWC1o2IK/E4yQifJF4lBCPRS0ZkDficRIRPiIeJcRjYcsF5MZ4nESEJOJRRDwWt1RA7ozHSUQ2Jx4lxGMDywTkwXicRGRT4lFCPDaxRECejMdJRDYjHiXEYyPTB6RRPE4isgnxKCEem5k6II3jcRKRxYlHCfHY0LQBKYrHSUQWJR4lxGNTUwakOB4nEVmMeJQQj41NF5CL4nESkUWIRwnx2NxUAbk4HicRmZx4lBAP5glIp3icRGRS4lFCPEgySUA6x+MkIpMRjxLiwW8NH5BB4nESkUmIRwnx4CNDB2SweJxEZHDiUUI8+MywARk0HicRGZR4lBAPvmjIgAwej5OIDEY8SogHrxouIJPE4yQigxCPEuLBVw0VkMnicRKRzsSjhHjwpmECMmk8TiLSiXiUEA9uMkRAJo/HSUQuJh4lxIObdQ/IIvE4ichFxKOEeHCXrgFZLB4nESkmHiXEg7t1C8ii8TiJSBHxKCEePKRLQBaPx0lEGhOPEuLBwy4PyCbxOIlII+JRQjx4yqUB2SweJxF5kniUEA+edllANo3HSUQeJB4lxIMmLgnI5vE4icidxKOEeNBMeUDE4yMiciPxKCEeNFUaEPH4IhF5g3iUEA+aKwuIeHyViLxCPEqIByVKAiIeNxGRT4hHCfGgTPOAiMddROQ98SghHpRqGhDxeMj2ERGPEuJBuWYBEY+nbBsR8SghHlyiSUDEo4ntIiIeJcSDyzwdEPFoapuIiEcJ8eBS7xo8xl9HPFr5kyR/fxzHD3sPqXQcxzdJvo94tPRdkm/Fgyu1uEB+nOQfk/zR83N4b9lLxOVRwuVBF61eAxGR9paLiHiUEA+6aflfWCLS3jIREY8S4kFXrd8HIiLtTR8R8SghHnRX8U50EWlv2oiIRwnxYAhVn4UlIu1NFxHxKCEeDKPy03hFpL1pIiIeJcSDoVR/H4iItDd8RMSjhHgwnCu+kVBE2hs2IuJRQjwY0lXfiS4i7Q0XEfEoIR4M65KAJCJSZJiIiEcJ8WBolwUkEZEi3SMiHiXEg+FdGpBERIp0i4h4lBAPpnB5QBIRKXJ5RMSjhHgwjS4BSUSkyGUREY8S4sFUugUkEZEi5RERjxLiwXS6BiQRkSJlERGPEuLBlLoHJBGRIs0jIh4lxINpDRGQRESKNIuIeJQQD6Y2TEASESnydETEo4R4ML2hApKISJGHIyIeJcSDJQwXkEREitwdEfEoIR4sY8iAJCJS5OaIiEcJ8WApwwYkEZEib0ZEPEqIB8sZOiCJiBR5NSLiUUI8WNLwAUlEpMhnERGPEuLBsqYISCIiRX4bEfEoIR4sbZqAJMlxHD9J8g9J/rD3loX8U5JfJPlVkh/0nbKU75L8/OXl5Te9h0CVqQKSuESYgsuDLUwXkEREGJp4sI0pA5KICEMSD7YybUASEWEo4sF2pg5IIiIMQTzY0vQBSUSErsSDbS0RkERE6EI82NoyAUlEhEuJB9tbKiCJiHAJ8YAsGJBERCglHvDekgFJRIQS4gEfWDYgiYjQlHjAJ5YOSCIiNCEe8AXLByQREZ4iHvCKLQKSiAgPEQ/4im0CkogIdxEPeMNWAUlEhJuIB9xgu4AkIsJXiQfcaMuAJCLCF4kH3GHbgCQiwkfEA+60dUASESGJeMBDtg9IIiKbEw94kIC8JyJbEg94goB8QES2Ih7wJAH5hIhsQTygAQH5AhFZmnhAIwLyChFZknhAQwLyFSKyFPGAxgTkDSKyBPGAAgJyAxGZmnhAEQG5kYhMSTygkIDcQUSmIh5QTEDuJCJTEA+4gIA8QESGJh5wEQF5kIgMSTzgQgLyBBEZinjAxQTkSSIyBPGADgSkARHpSjygEwFpRES6EA/oSEAaEpFLiQd0JiCNicglxAMGICAFRKSUeMAg3vUesKKXl5d/TfKzJP/Re8tivkvyrXjAGFwghVwiTbk8YDACUkxEmhAPGJCAXEBEniIeMCgBuYiIPEQ8YGACciERuYt4wOAE5GIichPxgAkISAci8lXiAZMQkE5E5IvEAyYiIB2JyEfEAyYjIJ2JSBLxgCkJyAA2j4h4wKQEZBCbRkQ8YGICMpDNIiIeMDkBGcwmEREPWICADGjxiIgHLEJABrVoRMQDFiIgA1ssIuIBixGQwS0SEfGABQnIBCaPiHjAogRkEpNGRDxgYQIykckiIh6wOAGZzCQREQ+AER3H8ePjOP79GNPfHsfxe71/RwC84hgzIuIBMINjrIiIB8BMjjEiIh4AM+ocEfEAmFmniIgHwAoujoh4AKzkooiIB8CKiiMiHgArK4qIeADsoHFExANgJ40iIh4AO3oyIuIBsLMHIyIeANwdEfEA4HdujIh4APC5NyIiHgC87pWIiAcAb/skIuIBwO2O4/jJcRy/OI7jXe8tAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADA5/4PiZTk2kr08uAAAAAASUVORK5CYII=';
 
-const ExpoCheckbox: CheckboxComponent = (props) => {
-  const { color, disabled, onChange, onValueChange, style, value, ...other } = props;
+export default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {
+  private handleChange = () => {
+    this.props.onValueChange?.(!this.props.value);
+  };
 
-  const handleChange = useCallback(() => {
-    onValueChange && onValueChange(!value);
-  }, [onValueChange, value]);
+  render() {
+    const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;
 
-  return (
-    <Pressable
-      {...other}
-      disabled={disabled}
-      // Announces "checked" status and "checkbox" as the focused element
-      accessibilityRole="checkbox"
-      accessibilityState={{ disabled, checked: value }}
-      style={[
-        styles.root,
-        style,
-        value && styles.checked,
-        !!color && { backgroundColor: value ? color : undefined, borderColor: color },
-        disabled && styles.disabled,
-        value && disabled && styles.checkedAndDisabled,
-      ]}
-      onPress={handleChange}>
-      {value && (
-        <Image
-          source={{
-            uri: checkmarkBase64,
-          }}
-          style={StyleSheet.absoluteFill}
-        />
-      )}
-    </Pressable>
-  );
-};
-
-ExpoCheckbox.displayName = 'Checkbox';
-
-export default ExpoCheckbox;
+    return (
+      <Pressable
+        {...other}
+        disabled={disabled}
+        // Announces "checked" status and "checkbox" as the focused element
+        accessibilityRole="checkbox"
+        accessibilityState={{ disabled, checked: value }}
+        style={[
+          styles.root,
+          style,
+          value && styles.checked,
+          !!color && { backgroundColor: value ? color : undefined, borderColor: color },
+          disabled && styles.disabled,
+          value && disabled && styles.checkedAndDisabled,
+        ]}
+        onPress={this.handleChange}>
+        {value && (
+          <Image
+            source={{
+              uri: checkmarkBase64,
+            }}
+            style={StyleSheet.absoluteFill}
+          />
+        )}
+      </Pressable>
+    );
+  }
+}
 
 const defaultEnabledColor = Platform.select({
   ios: '#007AFF',
@@ -74,8 +72,3 @@ const styles = StyleSheet.create({
     borderColor: disabledCheckedGrayColor,
   },
 });
-
-ExpoCheckbox.isAvailableAsync = () => {
-  console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');
-  return Promise.resolve(true);
-};

package/src/ExpoCheckbox.web.tsx

@@ -8,57 +8,55 @@
  * see: https://github.com/necolas/react-native-web
  */
 
-import React, { useCallback } from 'react';
+import React from 'react';
 // @ts-ignore
 import { StyleSheet, View, unstable_createElement as createElement } from 'react-native';
 
-import { CheckboxComponent, CheckboxEvent } from './Checkbox.types';
+import { CheckboxProps, CheckboxEvent } from './Checkbox.types';
 
-const ExpoCheckbox: CheckboxComponent = (props) => {
-  const { color, disabled, onChange, onValueChange, style, value, ...other } = props;
+export default class ExpoCheckbox extends React.PureComponent<CheckboxProps> {
+  private handleChange = (event: React.SyntheticEvent<HTMLInputElement, CheckboxEvent>) => {
+    const value = event.nativeEvent.target.checked;
+    event.nativeEvent.value = value;
+    this.props.onChange?.(event);
+    this.props.onValueChange?.(value);
+  };
 
-  const handleChange = useCallback(
-    (event: CheckboxEvent) => {
-      const value = (event.nativeEvent.target as unknown as HTMLInputElement).checked;
-      event.nativeEvent.value = value;
-      onChange && onChange(event);
-      onValueChange && onValueChange(value);
-    },
-    [onChange, onValueChange]
-  );
+  render() {
+    const { color, disabled, onChange, onValueChange, style, value, ...other } = this.props;
 
-  const fakeControl = (
-    <View
-      pointerEvents="none"
-      style={[
-        styles.fakeControl,
-        value && styles.fakeControlChecked,
-        // custom color
-        !!color && { backgroundColor: value ? color : undefined, borderColor: color },
-        disabled && styles.fakeControlDisabled,
-        value && disabled && styles.fakeControlCheckedAndDisabled,
-      ]}
-    />
-  );
+    const fakeControl = (
+      <View
+        pointerEvents="none"
+        style={[
+          styles.fakeControl,
+          value && styles.fakeControlChecked,
+          // custom color
+          !!color && { backgroundColor: value ? color : undefined, borderColor: color },
+          disabled && styles.fakeControlDisabled,
+          value && disabled && styles.fakeControlCheckedAndDisabled,
+        ]}
+      />
+    );
 
-  const nativeControl = createElement('input', {
-    accessibilityState: { disabled, checked: value },
-    checked: value,
-    disabled,
-    onChange: handleChange,
-    style: [styles.nativeControl, styles.cursorInherit],
-    type: 'checkbox',
-  });
+    const nativeControl = createElement('input', {
+      accessibilityChecked: value,
+      accessibilityDisabled: disabled,
+      checked: value,
+      disabled,
+      onChange: this.handleChange,
+      style: [styles.nativeControl, styles.cursorInherit],
+      type: 'checkbox',
+    });
 
-  return (
-    <View {...other} style={[styles.root, style, disabled && styles.cursorDefault]}>
-      {nativeControl}
-      {fakeControl}
-    </View>
-  );
-};
-
-ExpoCheckbox.displayName = 'Checkbox';
+    return (
+      <View {...other} style={[styles.root, style, disabled && styles.cursorDefault]}>
+        {nativeControl}
+        {fakeControl}
+      </View>
+    );
+  }
+}
 
 const styles = StyleSheet.create({
   root: {
@@ -115,11 +113,4 @@ const styles = StyleSheet.create({
   },
 });
 
-export default ExpoCheckbox;
-
-ExpoCheckbox.isAvailableAsync = () => {
-  console.warn('Checkbox.isAvailableAsync() is deprecated and will be removed in future releases');
-  return Promise.resolve(true);
-};
-
 export const name = 'ExpoCheckbox';