@hero-design/rn 7.14.2 → 7.14.3-alpha.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "7.14.2",
+  "version": "7.14.3-alpha.1",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -27,12 +27,12 @@
     "hero-editor": "^1.9.9"
   },
   "peerDependencies": {
+    "@react-native-community/datetimepicker": "^3.5.2",
     "react": "17.0.2",
     "react-native": "0.65.1",
     "react-native-pager-view": "^5.4.25",
     "react-native-safe-area-context": "^4.2.5",
     "react-native-vector-icons": "^9.1.0",
-    "@react-native-community/datetimepicker": "^3.5.2",
     "react-native-webview": "^11.15.0"
   },
   "devDependencies": {

package/rollup.config.js

@@ -29,6 +29,8 @@ export default {
     'react-native-safe-area-context',
     '@react-native-community/datetimepicker',
     'react-native-webview',
+    'react-native-pager-view',
+    'react-native-vector-icons',
   ],
   plugins: [
     replace({

package/src/components/DatePicker/DatePickerAndroid.tsx

@@ -15,6 +15,7 @@ const DatePickerAndroid = ({
   disabled = false,
   required,
   error,
+  helpText,
   style,
   testID,
 }: DatePickerProps) => {
@@ -34,6 +35,7 @@ const DatePickerAndroid = ({
           disabled={disabled}
           error={error}
           required={required}
+          helpText={helpText}
           style={style}
           testID={testID}
         />

package/src/components/DatePicker/DatePickerIOS.tsx

@@ -19,6 +19,7 @@ const DatePickerIOS = ({
   disabled = false,
   required,
   error,
+  helpText,
   style,
   testID,
 }: DatePickerProps) => {
@@ -38,6 +39,7 @@ const DatePickerIOS = ({
           disabled={disabled}
           error={error}
           required={required}
+          helpText={helpText}
           testID={testID}
           style={style}
         />

package/src/components/DatePicker/__tests__/DatePickerAndroid.spec.tsx

@@ -36,4 +36,18 @@ describe('DatePickerAndroid', () => {
 
     expect(onChange).toBeCalledWith(new Date('December 17, 1995'));
   });
+
+  it('renders correct help text', () => {
+    const { getByText } = renderWithTheme(
+      <DatePickerAndroid
+        value={new Date('December 21, 1995')}
+        label="Start date"
+        confirmLabel="Confirm"
+        helpText="This is help text"
+        onChange={jest.fn()}
+      />
+    );
+
+    expect(getByText('This is help text')).toBeTruthy();
+  });
 });

package/src/components/DatePicker/__tests__/DatePickerIOS.spec.tsx

@@ -43,4 +43,18 @@ describe('DatePickerIOS', () => {
 
     expect(onChange).toBeCalledWith(new Date('December 17, 1995'));
   });
+
+  it('renders correct help text', () => {
+    const { getByText } = renderWithTheme(
+      <DatePickerIOS
+        value={new Date('December 21, 1995')}
+        label="Start date"
+        confirmLabel="Confirm"
+        helpText="This is help text"
+        onChange={jest.fn()}
+      />
+    );
+
+    expect(getByText('This is help text')).toBeTruthy();
+  });
 });

package/src/components/DatePicker/types.ts

@@ -38,6 +38,10 @@ export interface DatePickerProps {
    *  Whether the value is required, if true, an asterisk will be appended to the label.
    */
   required?: boolean;
+  /**
+   * The helper text to display.
+   */
+  helpText?: string;
   /**
    * Addtional style.
    */