@react-native-ohos/native-base 3.4.29-rc.1

package/lib/commonjs/components/composites/FormControl/FormControlHelperText.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Box = _interopRequireDefault(require("../../primitives/Box"));
+
+var _useThemeProps = require("../../../hooks/useThemeProps");
+
+var _useFormControl = require("./useFormControl");
+
+var _useHasResponsiveProps = require("../../../hooks/useHasResponsiveProps");
+
+var _utils = require("../../../utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const FormControlHelperText = (props, ref) => {
+  const formControlContext = (0, _useFormControl.useFormControlContext)();
+  const combinedProps = (0, _utils.combineContextAndProps)(formControlContext, props);
+  const resolvedProps = (0, _useThemeProps.usePropsResolution)('FormControlHelperText', combinedProps, {
+    isDisabled: combinedProps.isDisabled,
+    isReadOnly: combinedProps.isReadOnly,
+    isInvalid: combinedProps.isInvalid // isRequired: combinedProps.isRequired,
+
+  });
+
+  _react.default.useEffect(() => {
+    resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.setHasHelpText(true);
+    return () => {
+      resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.setHasHelpText(false);
+    };
+  }); //TODO: refactor for responsive prop
+
+
+  if ((0, _useHasResponsiveProps.useHasResponsiveProps)(props)) {
+    return null;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_Box.default, _extends({}, resolvedProps, {
+    nativeID: resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.feedbackId,
+    ref: ref
+  }));
+};
+
+var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(FormControlHelperText));
+
+exports.default = _default;
+//# sourceMappingURL=FormControlHelperText.js.map

package/lib/commonjs/components/composites/FormControl/FormControlHelperText.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FormControlHelperText.tsx"],"names":["FormControlHelperText","props","ref","formControlContext","combinedProps","resolvedProps","isDisabled","isReadOnly","isInvalid","React","useEffect","setHasHelpText","feedbackId"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;AACA;;;;;;;;;;AAEA,MAAMA,qBAAqB,GAAG,CAC5BC,KAD4B,EAE5BC,GAF4B,KAGzB;AACH,QAAMC,kBAAkB,GAAG,4CAA3B;AACA,QAAMC,aAAa,GAAG,mCAAuBD,kBAAvB,EAA2CF,KAA3C,CAAtB;AACA,QAAMI,aAAa,GAAG,uCACpB,uBADoB,EAEpBD,aAFoB,EAGpB;AACEE,IAAAA,UAAU,EAAEF,aAAa,CAACE,UAD5B;AAEEC,IAAAA,UAAU,EAAEH,aAAa,CAACG,UAF5B;AAGEC,IAAAA,SAAS,EAAEJ,aAAa,CAACI,SAH3B,CAIE;;AAJF,GAHoB,CAAtB;;AAWAC,iBAAMC,SAAN,CAAgB,MAAM;AACpBL,IAAAA,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAEM,cAAf,CAA8B,IAA9B;AACA,WAAO,MAAM;AACXN,MAAAA,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAEM,cAAf,CAA8B,KAA9B;AACD,KAFD;AAGD,GALD,EAdG,CAoBH;;;AACA,MAAI,kDAAsBV,KAAtB,CAAJ,EAAkC;AAChC,WAAO,IAAP;AACD;;AAED,sBACE,6BAAC,YAAD,eAASI,aAAT;AAAwB,IAAA,QAAQ,EAAEA,aAAF,aAAEA,aAAF,uBAAEA,aAAa,CAAEO,UAAjD;AAA6D,IAAA,GAAG,EAAEV;AAAlE,KADF;AAGD,CA/BD;;4BAiCe,+BAAK,uBAAWF,qBAAX,CAAL,C","sourcesContent":["import React, { memo, forwardRef } from 'react';\r\nimport Box from '../../primitives/Box';\r\nimport { usePropsResolution } from '../../../hooks/useThemeProps';\r\nimport { useFormControlContext } from './useFormControl';\r\nimport type { IFormControlHelperTextProps } from './types';\r\nimport { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';\r\nimport { combineContextAndProps } from '../../../utils';\r\n\r\nconst FormControlHelperText = (\r\n  props: IFormControlHelperTextProps,\r\n  ref: any\r\n) => {\r\n  const formControlContext = useFormControlContext();\r\n  const combinedProps = combineContextAndProps(formControlContext, props);\r\n  const resolvedProps = usePropsResolution(\r\n    'FormControlHelperText',\r\n    combinedProps,\r\n    {\r\n      isDisabled: combinedProps.isDisabled,\r\n      isReadOnly: combinedProps.isReadOnly,\r\n      isInvalid: combinedProps.isInvalid,\r\n      // isRequired: combinedProps.isRequired,\r\n    }\r\n  );\r\n\r\n  React.useEffect(() => {\r\n    resolvedProps?.setHasHelpText(true);\r\n    return () => {\r\n      resolvedProps?.setHasHelpText(false);\r\n    };\r\n  });\r\n  //TODO: refactor for responsive prop\r\n  if (useHasResponsiveProps(props)) {\r\n    return null;\r\n  }\r\n\r\n  return (\r\n    <Box {...resolvedProps} nativeID={resolvedProps?.feedbackId} ref={ref} />\r\n  );\r\n};\r\n\r\nexport default memo(forwardRef(FormControlHelperText));\r\n"]}

package/lib/commonjs/components/composites/FormControl/FormControlLabel.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Box = _interopRequireDefault(require("../../primitives/Box"));
+
+var _Text = _interopRequireDefault(require("../../primitives/Text"));
+
+var _useFormControl = require("./useFormControl");
+
+var _useThemeProps = require("../../../hooks/useThemeProps");
+
+var _utils = require("../../../utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const FormControlLabel = ({
+  children,
+  ...props
+}, ref) => {
+  const formControlContext = (0, _useFormControl.useFormControlContext)();
+  const combinedProps = (0, _utils.combineContextAndProps)(formControlContext, props);
+
+  const _ref = _react.default.useRef(null);
+
+  const {
+    _astrick,
+    ...resolvedProps
+  } = (0, _useThemeProps.usePropsResolution)('FormControlLabel', combinedProps, {
+    isDisabled: combinedProps.isDisabled,
+    isReadOnly: combinedProps.isReadOnly,
+    isInvalid: combinedProps.isInvalid // isRequired: combinedProps.isRequired,
+
+  });
+
+  const requiredAsterisk = () => /*#__PURE__*/_react.default.createElement(_Text.default, _extends({
+    _web: {
+      accessibilityHidden: true,
+      //@ts-ignore
+      accessibilityRole: 'presentation'
+    }
+  }, _astrick), "*");
+
+  const mergedRef = (0, _utils.mergeRefs)([_ref, ref]);
+
+  _react.default.useEffect(() => {
+    if (_ref.current) {
+      // RN web doesn't support htmlFor for Label element yet
+      if (props.htmlFor) {
+        _ref.current.htmlFor = props.htmlFor;
+      } else if (resolvedProps !== null && resolvedProps !== void 0 && resolvedProps.nativeID) {
+        _ref.current.htmlFor = resolvedProps.nativeID;
+      }
+    }
+  }, [resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.nativeID, props.htmlFor]);
+
+  return /*#__PURE__*/_react.default.createElement(_Box.default, _extends({
+    _web: {
+      //@ts-ignore
+      accessibilityRole: 'label'
+    }
+  }, resolvedProps, {
+    nativeID: resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.labelId,
+    ref: mergedRef
+  }), children, (resolvedProps === null || resolvedProps === void 0 ? void 0 : resolvedProps.isRequired) && requiredAsterisk());
+};
+
+var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(FormControlLabel));
+
+exports.default = _default;
+//# sourceMappingURL=FormControlLabel.js.map

package/lib/commonjs/components/composites/FormControl/FormControlLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FormControlLabel.tsx"],"names":["FormControlLabel","children","props","ref","formControlContext","combinedProps","_ref","React","useRef","_astrick","resolvedProps","isDisabled","isReadOnly","isInvalid","requiredAsterisk","accessibilityHidden","accessibilityRole","mergedRef","useEffect","current","htmlFor","nativeID","labelId","isRequired"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;;;;;AAGA,MAAMA,gBAAgB,GAAG,CACvB;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CADuB,EAEvBC,GAFuB,KAGpB;AACH,QAAMC,kBAAkB,GAAG,4CAA3B;AACA,QAAMC,aAAa,GAAG,mCAAuBD,kBAAvB,EAA2CF,KAA3C,CAAtB;;AACA,QAAMI,IAAI,GAAGC,eAAMC,MAAN,CAA+B,IAA/B,CAAb;;AACA,QAAM;AAAEC,IAAAA,QAAF;AAAY,OAAGC;AAAf,MAAiC,uCACrC,kBADqC,EAErCL,aAFqC,EAGrC;AACEM,IAAAA,UAAU,EAAEN,aAAa,CAACM,UAD5B;AAEEC,IAAAA,UAAU,EAAEP,aAAa,CAACO,UAF5B;AAGEC,IAAAA,SAAS,EAAER,aAAa,CAACQ,SAH3B,CAIE;;AAJF,GAHqC,CAAvC;;AAWA,QAAMC,gBAAgB,GAAG,mBACvB,6BAAC,aAAD;AACE,IAAA,IAAI,EAAE;AACJC,MAAAA,mBAAmB,EAAE,IADjB;AAEJ;AACAC,MAAAA,iBAAiB,EAAE;AAHf;AADR,KAMMP,QANN,OADF;;AAYA,QAAMQ,SAAS,GAAG,sBAAU,CAACX,IAAD,EAAOH,GAAP,CAAV,CAAlB;;AACAI,iBAAMW,SAAN,CAAgB,MAAM;AACpB,QAAIZ,IAAI,CAACa,OAAT,EAAkB;AAChB;AACA,UAAIjB,KAAK,CAACkB,OAAV,EAAmB;AACjBd,QAAAA,IAAI,CAACa,OAAL,CAAaC,OAAb,GAAuBlB,KAAK,CAACkB,OAA7B;AACD,OAFD,MAEO,IAAIV,aAAJ,aAAIA,aAAJ,eAAIA,aAAa,CAAEW,QAAnB,EAA6B;AAClCf,QAAAA,IAAI,CAACa,OAAL,CAAaC,OAAb,GAAuBV,aAAa,CAACW,QAArC;AACD;AACF;AACF,GATD,EASG,CAACX,aAAD,aAACA,aAAD,uBAACA,aAAa,CAAEW,QAAhB,EAA0BnB,KAAK,CAACkB,OAAhC,CATH;;AAWA,sBACE,6BAAC,YAAD;AACE,IAAA,IAAI,EAAE;AACJ;AACAJ,MAAAA,iBAAiB,EAAE;AAFf;AADR,KAKMN,aALN;AAME,IAAA,QAAQ,EAAEA,aAAF,aAAEA,aAAF,uBAAEA,aAAa,CAAEY,OAN3B;AAOE,IAAA,GAAG,EAAEL;AAPP,MASGhB,QATH,EAUG,CAAAS,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAEa,UAAf,KAA6BT,gBAAgB,EAVhD,CADF;AAcD,CAxDD;;4BAyDe,+BAAK,uBAAWd,gBAAX,CAAL,C","sourcesContent":["import React, { memo, forwardRef } from 'react';\r\nimport Box from '../../primitives/Box';\r\nimport Text from '../../primitives/Text';\r\nimport { useFormControlContext } from './useFormControl';\r\nimport { usePropsResolution } from '../../../hooks/useThemeProps';\r\nimport type { IFormControlLabelProps } from './types';\r\nimport { mergeRefs } from '../../../utils';\r\nimport { combineContextAndProps } from '../../../utils';\r\n\r\nconst FormControlLabel = (\r\n  { children, ...props }: IFormControlLabelProps,\r\n  ref: any\r\n) => {\r\n  const formControlContext = useFormControlContext();\r\n  const combinedProps = combineContextAndProps(formControlContext, props);\r\n  const _ref = React.useRef<HTMLLabelElement>(null);\r\n  const { _astrick, ...resolvedProps } = usePropsResolution(\r\n    'FormControlLabel',\r\n    combinedProps,\r\n    {\r\n      isDisabled: combinedProps.isDisabled,\r\n      isReadOnly: combinedProps.isReadOnly,\r\n      isInvalid: combinedProps.isInvalid,\r\n      // isRequired: combinedProps.isRequired,\r\n    }\r\n  );\r\n\r\n  const requiredAsterisk = () => (\r\n    <Text\r\n      _web={{\r\n        accessibilityHidden: true,\r\n        //@ts-ignore\r\n        accessibilityRole: 'presentation',\r\n      }}\r\n      {..._astrick}\r\n    >\r\n      *\r\n    </Text>\r\n  );\r\n  const mergedRef = mergeRefs([_ref, ref]);\r\n  React.useEffect(() => {\r\n    if (_ref.current) {\r\n      // RN web doesn't support htmlFor for Label element yet\r\n      if (props.htmlFor) {\r\n        _ref.current.htmlFor = props.htmlFor;\r\n      } else if (resolvedProps?.nativeID) {\r\n        _ref.current.htmlFor = resolvedProps.nativeID;\r\n      }\r\n    }\r\n  }, [resolvedProps?.nativeID, props.htmlFor]);\r\n\r\n  return (\r\n    <Box\r\n      _web={{\r\n        //@ts-ignore\r\n        accessibilityRole: 'label',\r\n      }}\r\n      {...resolvedProps}\r\n      nativeID={resolvedProps?.labelId}\r\n      ref={mergedRef}\r\n    >\r\n      {children}\r\n      {resolvedProps?.isRequired && requiredAsterisk()}\r\n    </Box>\r\n  );\r\n};\r\nexport default memo(forwardRef(FormControlLabel));\r\n"]}

package/lib/commonjs/components/composites/FormControl/index.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "FormControlContext", {
+  enumerable: true,
+  get: function () {
+    return _useFormControl.FormControlContext;
+  }
+});
+Object.defineProperty(exports, "useFormControl", {
+  enumerable: true,
+  get: function () {
+    return _useFormControl.useFormControl;
+  }
+});
+Object.defineProperty(exports, "useFormControlProvider", {
+  enumerable: true,
+  get: function () {
+    return _useFormControl.useFormControlProvider;
+  }
+});
+Object.defineProperty(exports, "useFormControlContext", {
+  enumerable: true,
+  get: function () {
+    return _useFormControl.useFormControlContext;
+  }
+});
+exports.FormControl = void 0;
+
+var _FormControl = _interopRequireDefault(require("./FormControl"));
+
+var _FormControlLabel = _interopRequireDefault(require("./FormControlLabel"));
+
+var _FormControlErrorMessage = _interopRequireDefault(require("./FormControlErrorMessage"));
+
+var _FormControlHelperText = _interopRequireDefault(require("./FormControlHelperText"));
+
+var _useFormControl = require("./useFormControl");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+let FormControlTemp = _FormControl.default;
+FormControlTemp.Label = _FormControlLabel.default;
+FormControlTemp.ErrorMessage = _FormControlErrorMessage.default;
+FormControlTemp.HelperText = _FormControlHelperText.default; // To add typings
+
+const FormControl = FormControlTemp;
+exports.FormControl = FormControl;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/composites/FormControl/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["FormControlTemp","FormControlBase","Label","FormControlLabel","ErrorMessage","FormControlErrorMessage","HelperText","FormControlHelperText","FormControl"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAYA;;;;AATA,IAAIA,eAAoB,GAAGC,oBAA3B;AACAD,eAAe,CAACE,KAAhB,GAAwBC,yBAAxB;AACAH,eAAe,CAACI,YAAhB,GAA+BC,gCAA/B;AACAL,eAAe,CAACM,UAAhB,GAA6BC,8BAA7B,C,CAEA;;AACA,MAAMC,WAAW,GAAGR,eAApB","sourcesContent":["import { default as FormControlBase } from './FormControl';\r\nimport { default as FormControlLabel } from './FormControlLabel';\r\nimport { default as FormControlErrorMessage } from './FormControlErrorMessage';\r\nimport { default as FormControlHelperText } from './FormControlHelperText';\r\nimport type { FormControlComponentType } from './types';\r\n\r\nlet FormControlTemp: any = FormControlBase;\r\nFormControlTemp.Label = FormControlLabel;\r\nFormControlTemp.ErrorMessage = FormControlErrorMessage;\r\nFormControlTemp.HelperText = FormControlHelperText;\r\n\r\n// To add typings\r\nconst FormControl = FormControlTemp as FormControlComponentType;\r\n\r\nexport { FormControl };\r\nexport {\r\n  FormControlContext,\r\n  useFormControl,\r\n  useFormControlProvider,\r\n  useFormControlContext,\r\n} from './useFormControl';\r\n\r\nexport type { IFormControlContext } from './useFormControl';\r\n\r\nexport type {\r\n  IFormControlProps,\r\n  IFormControlLabelProps,\r\n  IFormControlErrorMessageProps,\r\n  IFormControlHelperTextProps,\r\n} from './types';\r\n"]}

package/lib/commonjs/components/composites/FormControl/test/FormControl.test.js

@@ -0,0 +1,111 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _index = require("../index");
+
+var _reactNative = require("react-native");
+
+var _reactNative2 = require("@testing-library/react-native");
+
+var _testUtils = require("../../../../utils/test-utils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const Input = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const inputProps = (0, _index.useFormControl)(props);
+  return (
+    /*#__PURE__*/
+    //@ts-ignore
+    _react.default.createElement(_reactNative.TextInput, _extends({
+      ref: ref
+    }, inputProps))
+  );
+});
+
+it('a11y test in when required', async () => {
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: "name",
+    isRequired: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, null, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"), /*#__PURE__*/_react.default.createElement(_index.FormControl.ErrorMessage, null, "Your name is invalid"))));
+  const textInput = getByPlaceholderText('Name');
+  expect(textInput.props.accessibilityRequired).toBe(true);
+  expect(textInput.props.required).toBe(true);
+});
+it('a11y test in when invalid', async () => {
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: "name",
+    isInvalid: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, null, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"), /*#__PURE__*/_react.default.createElement(_index.FormControl.ErrorMessage, null, "Your name is invalid"))));
+  const textInput = getByPlaceholderText('Name');
+  expect(textInput.props.accessibilityInvalid).toBe(true);
+});
+it('a11y test in when readOnly', async () => {
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: "name",
+    isReadOnly: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, null, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"), /*#__PURE__*/_react.default.createElement(_index.FormControl.ErrorMessage, null, "Your name is invalid"))));
+  const textInput = getByPlaceholderText('Name');
+  expect(textInput.props.accessibilityReadOnly).toBe(true);
+  expect(textInput.props.readOnly).toBe(true);
+});
+it('a11y test in when disabled', async () => {
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: "name",
+    isDisabled: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, null, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"), /*#__PURE__*/_react.default.createElement(_index.FormControl.ErrorMessage, null, "Your name is invalid"))));
+  const textInput = getByPlaceholderText('Name');
+  expect(textInput.props.disabled).toBe(true);
+});
+it('a11y test when helper text is present', async () => {
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: "name",
+    isDisabled: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, null, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"))));
+  const textInput = getByPlaceholderText('Name');
+  expect(textInput.props.accessibilityDescribedBy).toBe('name-helptext');
+  expect(textInput.props.accessibilityReadOnly).toBeUndefined();
+  expect(textInput.props.accessibilityInvalid).toBeUndefined();
+  expect(textInput.props.accessibilityRequired).toBeUndefined();
+});
+it('sets htmlFor of FormLabel ref to nativeID of Input', async () => {
+  let ref;
+  const inputID = 'name';
+  let {
+    getByPlaceholderText
+  } = (0, _reactNative2.render)( /*#__PURE__*/_react.default.createElement(_testUtils.Wrapper, null, /*#__PURE__*/_react.default.createElement(_index.FormControl, {
+    nativeID: inputID,
+    isInvalid: true
+  }, /*#__PURE__*/_react.default.createElement(_index.FormControl.Label, {
+    //@ts-ignore
+    ref: _ref => ref = _ref
+  }, "Name"), /*#__PURE__*/_react.default.createElement(Input, {
+    placeholder: "Name"
+  }), /*#__PURE__*/_react.default.createElement(_index.FormControl.HelperText, null, "Enter your name please!"), /*#__PURE__*/_react.default.createElement(_index.FormControl.ErrorMessage, null, "Your name is invalid"))));
+  const textInput = getByPlaceholderText('Name'); //@ts-ignore
+
+  expect(textInput.props.nativeID).toBe(ref.htmlFor);
+});
+//# sourceMappingURL=FormControl.test.js.map

package/lib/commonjs/components/composites/FormControl/test/FormControl.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FormControl.test.tsx"],"names":["Input","React","forwardRef","props","ref","inputProps","it","getByPlaceholderText","textInput","expect","accessibilityRequired","toBe","required","accessibilityInvalid","accessibilityReadOnly","readOnly","disabled","accessibilityDescribedBy","toBeUndefined","inputID","_ref","nativeID","htmlFor"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport { FormControl, useFormControl } from '../index';\r\nimport { TextInput } from 'react-native';\r\nimport { render } from '@testing-library/react-native';\r\nimport { Wrapper } from '../../../../utils/test-utils';\r\n\r\nconst Input = React.forwardRef((props: any, ref: any) => {\r\n  const inputProps = useFormControl(props);\r\n  return (\r\n    //@ts-ignore\r\n    <TextInput ref={ref} {...inputProps} />\r\n  );\r\n});\r\n\r\nit('a11y test in when required', async () => {\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID=\"name\" isRequired>\r\n        <FormControl.Label>Name</FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n        <FormControl.ErrorMessage>\r\n          Your name is invalid\r\n        </FormControl.ErrorMessage>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  expect(textInput.props.accessibilityRequired).toBe(true);\r\n  expect(textInput.props.required).toBe(true);\r\n});\r\n\r\nit('a11y test in when invalid', async () => {\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID=\"name\" isInvalid>\r\n        <FormControl.Label>Name</FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n        <FormControl.ErrorMessage>\r\n          Your name is invalid\r\n        </FormControl.ErrorMessage>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  expect(textInput.props.accessibilityInvalid).toBe(true);\r\n});\r\n\r\nit('a11y test in when readOnly', async () => {\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID=\"name\" isReadOnly>\r\n        <FormControl.Label>Name</FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n        <FormControl.ErrorMessage>\r\n          Your name is invalid\r\n        </FormControl.ErrorMessage>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  expect(textInput.props.accessibilityReadOnly).toBe(true);\r\n  expect(textInput.props.readOnly).toBe(true);\r\n});\r\n\r\nit('a11y test in when disabled', async () => {\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID=\"name\" isDisabled>\r\n        <FormControl.Label>Name</FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n        <FormControl.ErrorMessage>\r\n          Your name is invalid\r\n        </FormControl.ErrorMessage>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  expect(textInput.props.disabled).toBe(true);\r\n});\r\n\r\nit('a11y test when helper text is present', async () => {\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID=\"name\" isDisabled>\r\n        <FormControl.Label>Name</FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  expect(textInput.props.accessibilityDescribedBy).toBe('name-helptext');\r\n  expect(textInput.props.accessibilityReadOnly).toBeUndefined();\r\n  expect(textInput.props.accessibilityInvalid).toBeUndefined();\r\n  expect(textInput.props.accessibilityRequired).toBeUndefined();\r\n});\r\n\r\nit('sets htmlFor of FormLabel ref to nativeID of Input', async () => {\r\n  let ref: HTMLLabelElement;\r\n  const inputID = 'name';\r\n  let { getByPlaceholderText } = render(\r\n    <Wrapper>\r\n      <FormControl nativeID={inputID} isInvalid>\r\n        <FormControl.Label\r\n          //@ts-ignore\r\n          ref={(_ref) => (ref = _ref)}\r\n        >\r\n          Name\r\n        </FormControl.Label>\r\n        <Input placeholder=\"Name\" />\r\n        <FormControl.HelperText>Enter your name please!</FormControl.HelperText>\r\n        <FormControl.ErrorMessage>\r\n          Your name is invalid\r\n        </FormControl.ErrorMessage>\r\n      </FormControl>\r\n    </Wrapper>\r\n  );\r\n  const textInput = getByPlaceholderText('Name');\r\n  //@ts-ignore\r\n  expect(textInput.props.nativeID).toBe(ref.htmlFor);\r\n});\r\n"]}

package/lib/commonjs/components/composites/FormControl/types.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.js.map

package/lib/commonjs/components/composites/FormControl/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/lib/commonjs/components/composites/FormControl/useFormControl.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFormControlProvider = useFormControlProvider;
+exports.useFormControl = useFormControl;
+exports.useFormControlContext = exports.FormControlContext = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _utils = require("@react-native-aria/utils");
+
+var _lodash = _interopRequireDefault(require("lodash.omit"));
+
+var _utils2 = require("../../../utils");
+
+var _ResponsiveQueryProvider = require("../../../utils/useResponsiveQuery/ResponsiveQueryProvider");
+
+var _lodash2 = _interopRequireDefault(require("lodash.uniqueid"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const FormControlContext = /*#__PURE__*/_react.default.createContext({});
+
+exports.FormControlContext = FormControlContext;
+
+function useFormControlProvider(props) {
+  const {
+    nativeID: idProp,
+    isRequired,
+    isInvalid,
+    isDisabled,
+    isReadOnly,
+    ...htmlProps
+  } = props;
+  let id = (0, _lodash2.default)();
+
+  const responsiveQueryContext = _react.default.useContext(_ResponsiveQueryProvider.ResponsiveQueryContext);
+
+  const disableCSSMediaQueries = responsiveQueryContext.disableCSSMediaQueries;
+
+  if (!disableCSSMediaQueries) {
+    // This if statement technically breaks the rules of hooks, but is safe
+    // because the condition never changes after mounting.
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    id = (0, _utils.useId)();
+  } // const id = '';
+  // Generate all the required ids
+
+
+  const nativeID = idProp || "field-".concat(id);
+  const labelId = "".concat(nativeID, "-label");
+  const feedbackId = "".concat(nativeID, "-feedback");
+  const helpTextId = "".concat(nativeID, "-helptext");
+  /**
+   * Track whether the `FormErrorMessage` has been rendered.
+   * We use this to append its id the the `aria-describedby` of the `input`.
+   */
+
+  const [hasFeedbackText, setHasFeedbackText] = _react.default.useState(false);
+  /**
+   * Track whether the `FormHelperText` has been rendered.
+   * We use this to append its id the the `aria-describedby` of the `input`.
+   */
+
+
+  const [hasHelpText, setHasHelpText] = _react.default.useState(false);
+
+  const context = {
+    isRequired: !!isRequired,
+    isInvalid: !!isInvalid,
+    isReadOnly: !!isReadOnly,
+    isDisabled: !!isDisabled,
+    hasFeedbackText,
+    setHasFeedbackText,
+    hasHelpText,
+    setHasHelpText,
+    nativeID,
+    labelId,
+    feedbackId,
+    helpTextId,
+    htmlProps
+  };
+  return context;
+}
+/**
+ * React hook that provides the props that should be spread on to
+ * input fields (`input`, `select`, `textarea`, etc.).
+ *
+ * It provides a convenient way to control a form fields, validation
+ * and helper text.
+ */
+
+
+function useFormControl(props) {
+  const field = useFormControlContext();
+  const describedBy = []; // Error message must be described first in all scenarios.
+
+  if (field !== null && field !== void 0 && field.hasFeedbackText) describedBy.push(field === null || field === void 0 ? void 0 : field.feedbackId);
+  if (field !== null && field !== void 0 && field.hasHelpText) describedBy.push(field === null || field === void 0 ? void 0 : field.helpTextId);
+  const ariaDescribedBy = describedBy.join(' ');
+  const cleanProps = (0, _lodash.default)(props, ['isInvalid', 'isDisabled', 'isReadOnly', 'isRequired']);
+  let nativeID = props === null || props === void 0 ? void 0 : props.nativeID;
+
+  if (!nativeID && field !== null && field !== void 0 && field.nativeID) {
+    nativeID = "".concat(field === null || field === void 0 ? void 0 : field.nativeID, "-input");
+  }
+
+  return { ...cleanProps,
+    nativeID: nativeID,
+    disabled: props.isDisabled || (field === null || field === void 0 ? void 0 : field.isDisabled),
+    readOnly: props.isReadOnly || (field === null || field === void 0 ? void 0 : field.isReadOnly),
+    required: props.isRequired || (field === null || field === void 0 ? void 0 : field.isRequired),
+    accessibilityInvalid: (0, _utils2.ariaAttr)(props.isInvalid || (field === null || field === void 0 ? void 0 : field.isInvalid)),
+    accessibilityRequired: (0, _utils2.ariaAttr)(props.isRequired || (field === null || field === void 0 ? void 0 : field.isRequired)),
+    accessibilityReadOnly: (0, _utils2.ariaAttr)(props.isReadOnly || (field === null || field === void 0 ? void 0 : field.isReadOnly)),
+    accessibilityDescribedBy: ariaDescribedBy || undefined
+  };
+}
+
+const useFormControlContext = () => {
+  return _react.default.useContext(FormControlContext);
+};
+
+exports.useFormControlContext = useFormControlContext;
+//# sourceMappingURL=useFormControl.js.map

package/lib/commonjs/components/composites/FormControl/useFormControl.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useFormControl.tsx"],"names":["FormControlContext","React","createContext","useFormControlProvider","props","nativeID","idProp","isRequired","isInvalid","isDisabled","isReadOnly","htmlProps","id","responsiveQueryContext","useContext","ResponsiveQueryContext","disableCSSMediaQueries","labelId","feedbackId","helpTextId","hasFeedbackText","setHasFeedbackText","useState","hasHelpText","setHasHelpText","context","useFormControl","field","useFormControlContext","describedBy","push","ariaDescribedBy","join","cleanProps","disabled","readOnly","required","accessibilityInvalid","accessibilityRequired","accessibilityReadOnly","accessibilityDescribedBy","undefined"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport { useId } from '@react-native-aria/utils';\r\nimport omit from 'lodash.omit';\r\nimport type { IFormControlProps } from './types';\r\nimport { ariaAttr } from '../../../utils';\r\nimport { ResponsiveQueryContext } from '../../../utils/useResponsiveQuery/ResponsiveQueryProvider';\r\nimport uniqueId from 'lodash.uniqueid';\r\n\r\nexport type IFormControlContext = Omit<\r\n  ReturnType<typeof useFormControlProvider>,\r\n  'htmlProps'\r\n>;\r\n\r\nexport const FormControlContext = React.createContext({});\r\n\r\nexport function useFormControlProvider(props: IFormControlProps) {\r\n  const {\r\n    nativeID: idProp,\r\n    isRequired,\r\n    isInvalid,\r\n    isDisabled,\r\n    isReadOnly,\r\n    ...htmlProps\r\n  } = props;\r\n\r\n  let id = uniqueId();\r\n  const responsiveQueryContext = React.useContext(ResponsiveQueryContext);\r\n  const disableCSSMediaQueries = responsiveQueryContext.disableCSSMediaQueries;\r\n\r\n  if (!disableCSSMediaQueries) {\r\n    // This if statement technically breaks the rules of hooks, but is safe\r\n    // because the condition never changes after mounting.\r\n    // eslint-disable-next-line react-hooks/rules-of-hooks\r\n    id = useId();\r\n  }\r\n\r\n  // const id = '';\r\n  // Generate all the required ids\r\n  const nativeID = idProp || `field-${id}`;\r\n\r\n  const labelId = `${nativeID}-label`;\r\n  const feedbackId = `${nativeID}-feedback`;\r\n  const helpTextId = `${nativeID}-helptext`;\r\n\r\n  /**\r\n   * Track whether the `FormErrorMessage` has been rendered.\r\n   * We use this to append its id the the `aria-describedby` of the `input`.\r\n   */\r\n  const [hasFeedbackText, setHasFeedbackText] = React.useState(false);\r\n\r\n  /**\r\n   * Track whether the `FormHelperText` has been rendered.\r\n   * We use this to append its id the the `aria-describedby` of the `input`.\r\n   */\r\n  const [hasHelpText, setHasHelpText] = React.useState(false);\r\n\r\n  const context = {\r\n    isRequired: !!isRequired,\r\n    isInvalid: !!isInvalid,\r\n    isReadOnly: !!isReadOnly,\r\n    isDisabled: !!isDisabled,\r\n    hasFeedbackText,\r\n    setHasFeedbackText,\r\n    hasHelpText,\r\n    setHasHelpText,\r\n    nativeID,\r\n    labelId,\r\n    feedbackId,\r\n    helpTextId,\r\n    htmlProps,\r\n  };\r\n\r\n  return context;\r\n}\r\n\r\n/**\r\n * React hook that provides the props that should be spread on to\r\n * input fields (`input`, `select`, `textarea`, etc.).\r\n *\r\n * It provides a convenient way to control a form fields, validation\r\n * and helper text.\r\n */\r\nexport function useFormControl(props: IFormControlProps) {\r\n  const field = useFormControlContext();\r\n  const describedBy: any[] = [];\r\n\r\n  // Error message must be described first in all scenarios.\r\n  if (field?.hasFeedbackText) describedBy.push(field?.feedbackId);\r\n  if (field?.hasHelpText) describedBy.push(field?.helpTextId);\r\n  const ariaDescribedBy = describedBy.join(' ');\r\n\r\n  const cleanProps = omit(props, [\r\n    'isInvalid',\r\n    'isDisabled',\r\n    'isReadOnly',\r\n    'isRequired',\r\n  ]);\r\n\r\n  let nativeID = props?.nativeID;\r\n\r\n  if (!nativeID && field?.nativeID) {\r\n    nativeID = `${field?.nativeID}-input`;\r\n  }\r\n\r\n  return {\r\n    ...cleanProps,\r\n    nativeID: nativeID,\r\n    disabled: props.isDisabled || field?.isDisabled,\r\n    readOnly: props.isReadOnly || field?.isReadOnly,\r\n    required: props.isRequired || field?.isRequired,\r\n    accessibilityInvalid: ariaAttr(props.isInvalid || field?.isInvalid),\r\n    accessibilityRequired: ariaAttr(props.isRequired || field?.isRequired),\r\n    accessibilityReadOnly: ariaAttr(props.isReadOnly || field?.isReadOnly),\r\n    accessibilityDescribedBy: ariaDescribedBy || undefined,\r\n  };\r\n}\r\n\r\nexport const useFormControlContext = () => {\r\n  return (React.useContext(\r\n    FormControlContext\r\n  ) as unknown) as IFormControlContext;\r\n};\r\n"]}

package/lib/commonjs/components/composites/IconButton/index.js

@@ -0,0 +1,111 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Pressable = require("../../primitives/Pressable");
+
+var _Icon = require("../../primitives/Icon");
+
+var _useThemeProps = require("../../../hooks/useThemeProps");
+
+var _useHasResponsiveProps = require("../../../hooks/useHasResponsiveProps");
+
+var _utils = require("../../../utils");
+
+var _Pressable2 = require("../../primitives/Pressable/Pressable");
+
+var _focus = require("@react-native-aria/focus");
+
+var _lodash = _interopRequireDefault(require("lodash.merge"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+const IconButton = ({
+  icon,
+  _icon: pseudoIconProp,
+  children,
+  isHovered: isHoveredProp,
+  isPressed: isPressedProp,
+  isFocused: isFocusedProp,
+  isFocusVisible: isFocusVisibleProp,
+  isDisabled,
+  ...props
+}, ref) => {
+  const {
+    hoverProps,
+    isHovered
+  } = (0, _Pressable2.useHover)();
+  const {
+    pressableProps,
+    isPressed
+  } = (0, _Pressable2.useIsPressed)();
+  const {
+    focusProps,
+    isFocused
+  } = (0, _Pressable2.useFocus)();
+  const {
+    isFocusVisible,
+    focusProps: focusRingProps
+  } = (0, _focus.useFocusRing)();
+  const {
+    _icon,
+    onPressIn,
+    onPressOut,
+    onHoverIn,
+    onHoverOut,
+    onFocus,
+    onBlur,
+    ...resolvedProps
+  } = (0, _useThemeProps.usePropsResolution)('IconButton', { ...props,
+    _icon: (0, _lodash.default)({}, pseudoIconProp, icon === null || icon === void 0 ? void 0 : icon.props)
+  }, {
+    isHovered: isHoveredProp || isHovered,
+    isPressed: isPressedProp || isPressed,
+    isFocused: isFocusedProp || isFocused,
+    isFocusVisible: isFocusVisibleProp || isFocusVisible,
+    isDisabled
+  });
+  let clonedIcon;
+
+  if (icon) {
+    clonedIcon = /*#__PURE__*/_react.default.cloneElement(icon, { ..._icon
+    });
+  } //TODO: refactor for responsive prop
+
+
+  if ((0, _useHasResponsiveProps.useHasResponsiveProps)(props)) {
+    return null;
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_Pressable.Pressable, _extends({
+    disabled: isDisabled,
+    accessibilityRole: "button",
+    ref: ref,
+    onPressIn: (0, _utils.composeEventHandlers)(onPressIn, pressableProps.onPressIn),
+    onPressOut: (0, _utils.composeEventHandlers)(onPressOut, pressableProps.onPressOut) // @ts-ignore - web only
+    ,
+    onHoverIn: (0, _utils.composeEventHandlers)(onHoverIn, hoverProps.onHoverIn) // @ts-ignore - web only
+    ,
+    onHoverOut: (0, _utils.composeEventHandlers)(onHoverOut, hoverProps.onHoverOut) // @ts-ignore - web only
+    ,
+    onFocus: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onFocus, focusProps.onFocus), focusRingProps.onFocus) // @ts-ignore - web only
+    ,
+    onBlur: (0, _utils.composeEventHandlers)((0, _utils.composeEventHandlers)(onBlur, focusProps.onBlur), focusRingProps.onBlur)
+  }, resolvedProps), clonedIcon || /*#__PURE__*/_react.default.createElement(_Icon.Icon, _icon, children));
+};
+
+var _default = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(IconButton));
+
+exports.default = _default;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/components/composites/IconButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":["IconButton","icon","_icon","pseudoIconProp","children","isHovered","isHoveredProp","isPressed","isPressedProp","isFocused","isFocusedProp","isFocusVisible","isFocusVisibleProp","isDisabled","props","ref","hoverProps","pressableProps","focusProps","focusRingProps","onPressIn","onPressOut","onHoverIn","onHoverOut","onFocus","onBlur","resolvedProps","clonedIcon","React","cloneElement"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEA;;AAKA;;AACA;;;;;;;;;;AAEA,MAAMA,UAAU,GAAG,CACjB;AACEC,EAAAA,IADF;AAEEC,EAAAA,KAAK,EAAEC,cAFT;AAGEC,EAAAA,QAHF;AAIEC,EAAAA,SAAS,EAAEC,aAJb;AAKEC,EAAAA,SAAS,EAAEC,aALb;AAMEC,EAAAA,SAAS,EAAEC,aANb;AAOEC,EAAAA,cAAc,EAAEC,kBAPlB;AAQEC,EAAAA,UARF;AASE,KAAGC;AATL,CADiB,EAYjBC,GAZiB,KAad;AACH,QAAM;AAAEC,IAAAA,UAAF;AAAcX,IAAAA;AAAd,MAA4B,2BAAlC;AACA,QAAM;AAAEY,IAAAA,cAAF;AAAkBV,IAAAA;AAAlB,MAAgC,+BAAtC;AACA,QAAM;AAAEW,IAAAA,UAAF;AAAcT,IAAAA;AAAd,MAA4B,2BAAlC;AACA,QAAM;AAAEE,IAAAA,cAAF;AAAkBO,IAAAA,UAAU,EAAEC;AAA9B,MAAsD,0BAA5D;AAEA,QAAM;AACJjB,IAAAA,KADI;AAEJkB,IAAAA,SAFI;AAGJC,IAAAA,UAHI;AAIJC,IAAAA,SAJI;AAKJC,IAAAA,UALI;AAMJC,IAAAA,OANI;AAOJC,IAAAA,MAPI;AAQJ,OAAGC;AARC,MASF,uCACF,YADE,EAEF,EAAE,GAAGZ,KAAL;AAAYZ,IAAAA,KAAK,EAAE,qBAAM,EAAN,EAAUC,cAAV,EAA0BF,IAA1B,aAA0BA,IAA1B,uBAA0BA,IAAI,CAAEa,KAAhC;AAAnB,GAFE,EAGF;AACET,IAAAA,SAAS,EAAEC,aAAa,IAAID,SAD9B;AAEEE,IAAAA,SAAS,EAAEC,aAAa,IAAID,SAF9B;AAGEE,IAAAA,SAAS,EAAEC,aAAa,IAAID,SAH9B;AAIEE,IAAAA,cAAc,EAAEC,kBAAkB,IAAID,cAJxC;AAKEE,IAAAA;AALF,GAHE,CATJ;AAqBA,MAAIc,UAAJ;;AACA,MAAI1B,IAAJ,EAAU;AACR0B,IAAAA,UAAU,gBAAGC,eAAMC,YAAN,CAAmB5B,IAAnB,EAAyB,EACpC,GAAGC;AADiC,KAAzB,CAAb;AAGD,GAhCE,CAkCH;;;AACA,MAAI,kDAAsBY,KAAtB,CAAJ,EAAkC;AAChC,WAAO,IAAP;AACD;;AAED,sBACE,6BAAC,oBAAD;AACE,IAAA,QAAQ,EAAED,UADZ;AAEE,IAAA,iBAAiB,EAAC,QAFpB;AAGE,IAAA,GAAG,EAAEE,GAHP;AAIE,IAAA,SAAS,EAAE,iCAAqBK,SAArB,EAAgCH,cAAc,CAACG,SAA/C,CAJb;AAKE,IAAA,UAAU,EAAE,iCAAqBC,UAArB,EAAiCJ,cAAc,CAACI,UAAhD,CALd,CAME;AANF;AAOE,IAAA,SAAS,EAAE,iCAAqBC,SAArB,EAAgCN,UAAU,CAACM,SAA3C,CAPb,CAQE;AARF;AASE,IAAA,UAAU,EAAE,iCAAqBC,UAArB,EAAiCP,UAAU,CAACO,UAA5C,CATd,CAUE;AAVF;AAWE,IAAA,OAAO,EAAE,iCACP,iCAAqBC,OAArB,EAA8BN,UAAU,CAACM,OAAzC,CADO,EAEPL,cAAc,CAACK,OAFR,CAXX,CAeE;AAfF;AAgBE,IAAA,MAAM,EAAE,iCACN,iCAAqBC,MAArB,EAA6BP,UAAU,CAACO,MAAxC,CADM,EAENN,cAAc,CAACM,MAFT;AAhBV,KAoBMC,aApBN,GAsBGC,UAAU,iBAAI,6BAAC,UAAD,EAAUzB,KAAV,EAAkBE,QAAlB,CAtBjB,CADF;AA0BD,CA9ED;;4BAgFe,+BAAK,uBAAWJ,UAAX,CAAL,C","sourcesContent":["import React, { memo, forwardRef } from 'react';\r\nimport { Pressable } from '../../primitives/Pressable';\r\nimport { Icon } from '../../primitives/Icon';\r\nimport { usePropsResolution } from '../../../hooks/useThemeProps';\r\nimport { useHasResponsiveProps } from '../../../hooks/useHasResponsiveProps';\r\nimport { composeEventHandlers } from '../../../utils';\r\nimport type { IIconButtonProps } from './types';\r\nimport {\r\n  useHover,\r\n  useFocus,\r\n  useIsPressed,\r\n} from '../../primitives/Pressable/Pressable';\r\nimport { useFocusRing } from '@react-native-aria/focus';\r\nimport merge from 'lodash.merge';\r\n\r\nconst IconButton = (\r\n  {\r\n    icon,\r\n    _icon: pseudoIconProp,\r\n    children,\r\n    isHovered: isHoveredProp,\r\n    isPressed: isPressedProp,\r\n    isFocused: isFocusedProp,\r\n    isFocusVisible: isFocusVisibleProp,\r\n    isDisabled,\r\n    ...props\r\n  }: IIconButtonProps,\r\n  ref: any\r\n) => {\r\n  const { hoverProps, isHovered } = useHover();\r\n  const { pressableProps, isPressed } = useIsPressed();\r\n  const { focusProps, isFocused } = useFocus();\r\n  const { isFocusVisible, focusProps: focusRingProps }: any = useFocusRing();\r\n\r\n  const {\r\n    _icon,\r\n    onPressIn,\r\n    onPressOut,\r\n    onHoverIn,\r\n    onHoverOut,\r\n    onFocus,\r\n    onBlur,\r\n    ...resolvedProps\r\n  } = usePropsResolution(\r\n    'IconButton',\r\n    { ...props, _icon: merge({}, pseudoIconProp, icon?.props) },\r\n    {\r\n      isHovered: isHoveredProp || isHovered,\r\n      isPressed: isPressedProp || isPressed,\r\n      isFocused: isFocusedProp || isFocused,\r\n      isFocusVisible: isFocusVisibleProp || isFocusVisible,\r\n      isDisabled,\r\n    }\r\n  );\r\n\r\n  let clonedIcon;\r\n  if (icon) {\r\n    clonedIcon = React.cloneElement(icon, {\r\n      ..._icon,\r\n    });\r\n  }\r\n\r\n  //TODO: refactor for responsive prop\r\n  if (useHasResponsiveProps(props)) {\r\n    return null;\r\n  }\r\n\r\n  return (\r\n    <Pressable\r\n      disabled={isDisabled}\r\n      accessibilityRole=\"button\"\r\n      ref={ref}\r\n      onPressIn={composeEventHandlers(onPressIn, pressableProps.onPressIn)}\r\n      onPressOut={composeEventHandlers(onPressOut, pressableProps.onPressOut)}\r\n      // @ts-ignore - web only\r\n      onHoverIn={composeEventHandlers(onHoverIn, hoverProps.onHoverIn)}\r\n      // @ts-ignore - web only\r\n      onHoverOut={composeEventHandlers(onHoverOut, hoverProps.onHoverOut)}\r\n      // @ts-ignore - web only\r\n      onFocus={composeEventHandlers(\r\n        composeEventHandlers(onFocus, focusProps.onFocus),\r\n        focusRingProps.onFocus\r\n      )}\r\n      // @ts-ignore - web only\r\n      onBlur={composeEventHandlers(\r\n        composeEventHandlers(onBlur, focusProps.onBlur),\r\n        focusRingProps.onBlur\r\n      )}\r\n      {...resolvedProps}\r\n    >\r\n      {clonedIcon || <Icon {..._icon}>{children}</Icon>}\r\n    </Pressable>\r\n  );\r\n};\r\n\r\nexport default memo(forwardRef(IconButton));\r\nexport type { IIconButtonProps };\r\n"]}

package/lib/commonjs/components/composites/IconButton/types.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.js.map

package/lib/commonjs/components/composites/IconButton/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}