@hero-design/rn 8.0.1 → 8.0.2

package/.turbo/turbo-build.log

@@ -1,9 +1,9 @@
-@hero-design/rn:build: cache hit, replaying output fe6d8e0ca32b30ea
-@hero-design/rn:build: $ yarn build:js && yarn build:types
-@hero-design/rn:build: $ rollup -c
-@hero-design/rn:build: 
-@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
-@hero-design/rn:build: (!) Plugin replace: @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
-@hero-design/rn:build: (!) Plugin node-resolve: preferring built-in module 'events' over local alternative at '/root/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
-@hero-design/rn:build: created lib/index.js, es/index.js in 24.6s
-@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly --project tsconfig.prod.json
+@hero-design/rn:build: cache hit, replaying output 395e759f2a2de395
+@hero-design/rn:build: $ yarn build:js && yarn build:types
+@hero-design/rn:build: $ rollup -c
+@hero-design/rn:build: 
+@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
+@hero-design/rn:build: (!) Plugin replace: @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
+@hero-design/rn:build: (!) Plugin node-resolve: preferring built-in module 'events' over local alternative at '/root/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning
+@hero-design/rn:build: created lib/index.js, es/index.js in 28.3s
+@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly --project tsconfig.prod.json

package/es/index.js

@@ -13899,7 +13899,9 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
     error = _ref.error,
     helpText = _ref.helpText,
     style = _ref.style,
-    testID = _ref.testID;
+    testID = _ref.testID,
+    _ref$showSuffix = _ref.showSuffix,
+    showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -13918,7 +13920,7 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
   }, /*#__PURE__*/React.createElement(TextInput, {
     label: label,
     value: displayValue,
-    suffix: "clock-3",
+    suffix: showSuffix ? 'clock-3' : undefined,
     placeholder: placeholder || displayFormat,
     disabled: disabled,
     error: error,
@@ -13962,7 +13964,9 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
     error = _ref.error,
     helpText = _ref.helpText,
     style = _ref.style,
-    testID = _ref.testID;
+    testID = _ref.testID,
+    _ref$showSuffix = _ref.showSuffix,
+    showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix;
   var _useState = useState(value || new Date()),
     _useState2 = _slicedToArray(_useState, 2),
     selectingDate = _useState2[0],
@@ -13984,7 +13988,7 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   }, /*#__PURE__*/React.createElement(TextInput, {
     label: label,
     value: displayValue,
-    suffix: "clock-3",
+    suffix: showSuffix ? 'clock-3' : undefined,
     placeholder: placeholder || displayFormat,
     disabled: disabled,
     error: error,

package/lib/index.js

@@ -13928,7 +13928,9 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
     error = _ref.error,
     helpText = _ref.helpText,
     style = _ref.style,
-    testID = _ref.testID;
+    testID = _ref.testID,
+    _ref$showSuffix = _ref.showSuffix,
+    showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix;
   var _useState = React.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -13947,7 +13949,7 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement(TextInput, {
     label: label,
     value: displayValue,
-    suffix: "clock-3",
+    suffix: showSuffix ? 'clock-3' : undefined,
     placeholder: placeholder || displayFormat,
     disabled: disabled,
     error: error,
@@ -13991,7 +13993,9 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
     error = _ref.error,
     helpText = _ref.helpText,
     style = _ref.style,
-    testID = _ref.testID;
+    testID = _ref.testID,
+    _ref$showSuffix = _ref.showSuffix,
+    showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix;
   var _useState = React.useState(value || new Date()),
     _useState2 = _slicedToArray(_useState, 2),
     selectingDate = _useState2[0],
@@ -14013,7 +14017,7 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement(TextInput, {
     label: label,
     value: displayValue,
-    suffix: "clock-3",
+    suffix: showSuffix ? 'clock-3' : undefined,
     placeholder: placeholder || displayFormat,
     disabled: disabled,
     error: error,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "8.0.1",
+  "version": "8.0.2",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/native": "^11.9.3",
     "@emotion/react": "^11.9.3",
-    "@hero-design/colors": "8.0.1",
+    "@hero-design/colors": "8.0.2",
     "date-fns": "^2.16.1",
     "events": "^3.2.0",
     "hero-editor": "^1.9.12"
@@ -44,7 +44,7 @@
     "@babel/preset-typescript": "^7.17.12",
     "@babel/runtime": "^7.18.9",
     "@emotion/jest": "^11.9.3",
-    "@hero-design/eslint-plugin": "8.0.1",
+    "@hero-design/eslint-plugin": "8.0.2",
     "@react-native-community/datetimepicker": "^3.5.2",
     "@react-native-community/slider": "4.1.12",
     "@rollup/plugin-babel": "^5.3.1",
@@ -60,9 +60,9 @@
     "@types/react-native": "^0.67.7",
     "@types/react-native-vector-icons": "^6.4.10",
     "babel-plugin-inline-import": "^3.0.0",
-    "eslint-config-hd": "8.0.1",
+    "eslint-config-hd": "8.0.2",
     "jest": "^27.3.1",
-    "prettier-config-hd": "8.0.1",
+    "prettier-config-hd": "8.0.2",
     "react": "17.0.2",
     "react-native": "0.65.1",
     "react-native-gesture-handler": "~2.1.0",

package/src/components/TimePicker/TimePickerAndroid.tsx

@@ -18,6 +18,7 @@ const TimePickerAndroid = ({
   helpText,
   style,
   testID,
+  showSuffix = true,
 }: TimePickerProps) => {
   const [open, setOpen] = useState(false);
 
@@ -31,7 +32,7 @@ const TimePickerAndroid = ({
         <TextInput
           label={label}
           value={displayValue}
-          suffix="clock-3"
+          suffix={showSuffix ? 'clock-3' : undefined}
           placeholder={placeholder || displayFormat}
           disabled={disabled}
           error={error}

package/src/components/TimePicker/TimePickerIOS.tsx

@@ -22,6 +22,7 @@ const TimePickerIOS = ({
   helpText,
   style,
   testID,
+  showSuffix = true,
 }: TimePickerProps) => {
   const [selectingDate, setSelectingDate] = useState<Date>(value || new Date());
   const [open, setOpen] = useState(false);
@@ -35,7 +36,7 @@ const TimePickerIOS = ({
         <TextInput
           label={label}
           value={displayValue}
-          suffix="clock-3"
+          suffix={showSuffix ? 'clock-3' : undefined}
           placeholder={placeholder || displayFormat}
           disabled={disabled}
           error={error}

package/src/components/TimePicker/__tests__/TimePickerAndroid.spec.tsx

@@ -50,4 +50,17 @@ describe('TimePickerAndroid', () => {
 
     expect(getByText('This is help text')).toBeTruthy();
   });
+  it('renders correct with hide suffix', () => {
+    const { toJSON } = renderWithTheme(
+      <TimePickerAndroid
+        value={new Date('December 17, 1995 03:24:00')}
+        label="Break time"
+        confirmLabel="Confirm"
+        helpText="This is help text"
+        showSuffix={false}
+        onChange={jest.fn()}
+      />
+    );
+    expect(toJSON()).toMatchSnapshot();
+  });
 });

package/src/components/TimePicker/__tests__/TimePickerIOS.spec.tsx

@@ -56,4 +56,18 @@ describe('TimePickerIOS', () => {
 
     expect(getByText('This is help text')).toBeTruthy();
   });
+
+  it('renders correct with hide suffix', () => {
+    const { toJSON } = renderWithTheme(
+      <TimePickerIOS
+        value={new Date('December 17, 1995 03:24:00')}
+        label="Break time"
+        confirmLabel="Confirm"
+        helpText="This is help text"
+        showSuffix={false}
+        onChange={jest.fn()}
+      />
+    );
+    expect(toJSON()).toMatchSnapshot();
+  });
 });

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerAndroid.spec.tsx.snap

@@ -1,5 +1,213 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`TimePickerAndroid renders correct with hide suffix 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={true}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "opacity": 1,
+    }
+  }
+>
+  <View
+    pointerEvents="none"
+    testID="timePickerInputAndroid"
+  >
+    <View
+      pointerEvents="auto"
+      style={
+        Array [
+          Object {
+            "marginVertical": 8,
+            "width": "100%",
+          },
+          undefined,
+        ]
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "alignItems": "center",
+              "flexDirection": "row",
+              "padding": 16,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "borderColor": "#001f23",
+                "borderRadius": 8,
+                "borderWidth": 1,
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+              undefined,
+            ]
+          }
+          themeFocused={false}
+          themeVariant="filled"
+        />
+        <View
+          pointerEvents="none"
+          style={
+            Array [
+              Object {
+                "backgroundColor": "#ffffff",
+                "flexDirection": "row",
+                "left": 16,
+                "paddingHorizontal": 4,
+                "position": "absolute",
+                "top": -10,
+                "zIndex": 1,
+              },
+              undefined,
+            ]
+          }
+        >
+          <Text
+            style={
+              Array [
+                Object {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 12,
+                  "letterSpacing": 0.36,
+                  "lineHeight": 20,
+                },
+                Array [
+                  Object {
+                    "color": "#001f23",
+                  },
+                  undefined,
+                ],
+              ]
+            }
+            testID="input-label"
+            themeFontSize="small"
+            themeFontWeight="regular"
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="filled"
+          >
+            Break time
+          </Text>
+        </View>
+        <View
+          style={
+            Array [
+              Object {
+                "alignItems": "center",
+                "alignSelf": "stretch",
+                "flexDirection": "row",
+                "flexGrow": 2,
+                "flexShrink": 1,
+              },
+              undefined,
+            ]
+          }
+        >
+          <TextInput
+            accessibilityState={
+              Object {
+                "disabled": false,
+              }
+            }
+            editable={true}
+            onBlur={[Function]}
+            onChangeText={[Function]}
+            onFocus={[Function]}
+            placeholder=" "
+            style={
+              Array [
+                Object {
+                  "alignSelf": "stretch",
+                  "flexGrow": 2,
+                  "fontSize": 14,
+                  "marginHorizontal": 8,
+                  "paddingVertical": 0,
+                  "textAlignVertical": "center",
+                },
+                Object {
+                  "color": "#001f23",
+                },
+              ]
+            }
+            testID="text-input"
+            value="03:24 AM"
+          />
+        </View>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "paddingLeft": 16,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "flexDirection": "row",
+                "justifyContent": "space-between",
+              },
+              undefined,
+            ]
+          }
+        />
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#001f23",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              Array [
+                Object {
+                  "fontSize": 12,
+                },
+                undefined,
+              ],
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+          themeTypeface="neutral"
+        >
+          This is help text
+        </Text>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
 exports[`TimePickerAndroid renders correctly 1`] = `
 <View
   accessible={true}

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap

@@ -1,5 +1,213 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`TimePickerIOS renders correct with hide suffix 1`] = `
+<View
+  accessible={true}
+  collapsable={false}
+  focusable={true}
+  nativeID="animatedComponent"
+  onClick={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+  style={
+    Object {
+      "opacity": 1,
+    }
+  }
+>
+  <View
+    pointerEvents="none"
+    testID="timePickerInputIOS"
+  >
+    <View
+      pointerEvents="auto"
+      style={
+        Array [
+          Object {
+            "marginVertical": 8,
+            "width": "100%",
+          },
+          undefined,
+        ]
+      }
+    >
+      <View
+        style={
+          Array [
+            Object {
+              "alignItems": "center",
+              "flexDirection": "row",
+              "padding": 16,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "borderColor": "#001f23",
+                "borderRadius": 8,
+                "borderWidth": 1,
+                "bottom": 0,
+                "left": 0,
+                "position": "absolute",
+                "right": 0,
+                "top": 0,
+              },
+              undefined,
+            ]
+          }
+          themeFocused={false}
+          themeVariant="filled"
+        />
+        <View
+          pointerEvents="none"
+          style={
+            Array [
+              Object {
+                "backgroundColor": "#ffffff",
+                "flexDirection": "row",
+                "left": 16,
+                "paddingHorizontal": 4,
+                "position": "absolute",
+                "top": -10,
+                "zIndex": 1,
+              },
+              undefined,
+            ]
+          }
+        >
+          <Text
+            style={
+              Array [
+                Object {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 12,
+                  "letterSpacing": 0.36,
+                  "lineHeight": 20,
+                },
+                Array [
+                  Object {
+                    "color": "#001f23",
+                  },
+                  undefined,
+                ],
+              ]
+            }
+            testID="input-label"
+            themeFontSize="small"
+            themeFontWeight="regular"
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="filled"
+          >
+            Break time
+          </Text>
+        </View>
+        <View
+          style={
+            Array [
+              Object {
+                "alignItems": "center",
+                "alignSelf": "stretch",
+                "flexDirection": "row",
+                "flexGrow": 2,
+                "flexShrink": 1,
+              },
+              undefined,
+            ]
+          }
+        >
+          <TextInput
+            accessibilityState={
+              Object {
+                "disabled": false,
+              }
+            }
+            editable={true}
+            onBlur={[Function]}
+            onChangeText={[Function]}
+            onFocus={[Function]}
+            placeholder=" "
+            style={
+              Array [
+                Object {
+                  "alignSelf": "stretch",
+                  "flexGrow": 2,
+                  "fontSize": 14,
+                  "marginHorizontal": 8,
+                  "paddingVertical": 0,
+                  "textAlignVertical": "center",
+                },
+                Object {
+                  "color": "#001f23",
+                },
+              ]
+            }
+            testID="text-input"
+            value="03:24 AM"
+          />
+        </View>
+      </View>
+      <View
+        style={
+          Array [
+            Object {
+              "paddingLeft": 16,
+            },
+            undefined,
+          ]
+        }
+      >
+        <View
+          style={
+            Array [
+              Object {
+                "flexDirection": "row",
+                "justifyContent": "space-between",
+              },
+              undefined,
+            ]
+          }
+        />
+        <Text
+          style={
+            Array [
+              Object {
+                "color": "#001f23",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 14,
+                "letterSpacing": 0.42,
+                "lineHeight": 22,
+              },
+              Array [
+                Object {
+                  "fontSize": 12,
+                },
+                undefined,
+              ],
+            ]
+          }
+          themeFontSize="medium"
+          themeFontWeight="regular"
+          themeIntent="body"
+          themeTypeface="neutral"
+        >
+          This is help text
+        </Text>
+      </View>
+    </View>
+  </View>
+</View>
+`;
+
 exports[`TimePickerIOS renders correctly 1`] = `
 <View
   accessible={true}

package/src/components/TimePicker/types.ts

@@ -43,6 +43,11 @@ export interface TimePickerProps {
    * The helper text to display.
    */
   helpText?: string;
+  /**
+   * hides icon
+   */
+  showSuffix?: boolean;
+
   /**
    * Addtional style.
    */

package/types/components/TimePicker/TimePickerAndroid.d.ts

@@ -1,3 +1,3 @@
 import type { TimePickerProps } from './types';
-declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, }: TimePickerProps) => JSX.Element;
+declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => JSX.Element;
 export default TimePickerAndroid;

package/types/components/TimePicker/TimePickerIOS.d.ts

@@ -1,3 +1,3 @@
 import type { TimePickerProps } from './types';
-declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, }: TimePickerProps) => JSX.Element;
+declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => JSX.Element;
 export default TimePickerIOS;

package/types/components/TimePicker/types.d.ts

@@ -42,6 +42,10 @@ export interface TimePickerProps {
      * The helper text to display.
      */
     helpText?: string;
+    /**
+     * hides icon
+     */
+    showSuffix?: boolean;
     /**
      * Addtional style.
      */