@hero-design/rn 8.84.2 → 8.85.0

package/.turbo/turbo-build.log

@@ -1,7 +1,7 @@
-(node:2992) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
+(node:2994) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
 (Use `node --trace-warnings ...` to show where the warning was created)
 
 src/index.ts → lib/index.js, es/index.js...
 (!) [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`.
 (!) [plugin node-resolve] preferring built-in module 'events' over local alternative at '/home/runner/work/hero-design/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning.or passing a function to 'preferBuiltins' to provide more fine-grained control over which built-in modules to prefer.
-created lib/index.js, es/index.js in 52.3s
+created lib/index.js, es/index.js in 50s

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @hero-design/rn
 
+## 8.85.0
+
+### Minor Changes
+
+- [#3605](https://github.com/Thinkei/hero-design/pull/3605) [`ab87bce2a285fbbe735eca30fa686f26eb2f2a97`](https://github.com/Thinkei/hero-design/commit/ab87bce2a285fbbe735eca30fa686f26eb2f2a97) Thanks [@vinhphan-eh](https://github.com/vinhphan-eh)! - [Box] Support gap property
+
+## 8.84.3
+
+### Patch Changes
+
+- [#3598](https://github.com/Thinkei/hero-design/pull/3598) [`b837f8d5986633709c679de6132c10b8d404c398`](https://github.com/Thinkei/hero-design/commit/b837f8d5986633709c679de6132c10b8d404c398) Thanks [@nhatle684](https://github.com/nhatle684)! - [BottomSheet.ScrollView] Add support ref
+
 ## 8.84.2
 
 ### Patch Changes

package/es/index.js

@@ -1,7 +1,7 @@
 import * as reactNative from 'react-native';
 import { Platform, Dimensions, StyleSheet as StyleSheet$1, Animated, View, UIManager, LayoutAnimation, TouchableOpacity, Text as Text$1, Easing, useWindowDimensions, TouchableWithoutFeedback, Modal as Modal$1, Image as Image$1, Pressable, SafeAreaView, KeyboardAvoidingView, TouchableHighlight, ScrollView, FlatList, TextInput as TextInput$1, PanResponder, BackHandler, InteractionManager, Keyboard, SectionList, RefreshControl as RefreshControl$1 } from 'react-native';
 import * as React from 'react';
-import React__default, { useMemo, useEffect, useCallback, useRef, useLayoutEffect, useState, createContext, useContext, forwardRef, memo, useReducer, useImperativeHandle, isValidElement } from 'react';
+import React__default, { useMemo, useEffect, useCallback, useRef, useLayoutEffect, useState, createContext, forwardRef, useContext, memo, useReducer, useImperativeHandle, isValidElement } from 'react';
 import { createIconSet } from 'react-native-vector-icons';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { MonthYearPickerViewIOS, MonthYearPickerDialogueAndroid } from '@hero-design/react-native-month-year-picker';
@@ -8831,6 +8831,10 @@ var space = {
   paddingVertical: {
     property: 'paddingVertical',
     scale: 'space'
+  },
+  gap: {
+    property: 'gap',
+    scale: 'space'
   }
 };
 var radii = {
@@ -10133,7 +10137,7 @@ var Header = function Header(_ref) {
 };
 
 var _excluded$x = ["scrollEventThrottle"];
-var BottomSheetScrollView = function BottomSheetScrollView(_ref) {
+var BottomSheetScrollView = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var _ref$scrollEventThrot = _ref.scrollEventThrottle,
     scrollEventThrottle = _ref$scrollEventThrot === void 0 ? 100 : _ref$scrollEventThrot,
     props = _objectWithoutProperties(_ref, _excluded$x);
@@ -10155,12 +10159,13 @@ var BottomSheetScrollView = function BottomSheetScrollView(_ref) {
     props === null || props === void 0 || (_props$onMomentumScro2 = props.onMomentumScrollEnd) === null || _props$onMomentumScro2 === void 0 || _props$onMomentumScro2.call(props, e);
   }, []);
   return /*#__PURE__*/React__default.createElement(ScrollView, _extends$1({}, props, {
+    ref: ref,
     onScrollBeginDrag: onScrollBeginDrag,
     onMomentumScrollBegin: onMomentumScrollBegin,
     onMomentumScrollEnd: onMomentumScrollEnd,
     scrollEventThrottle: scrollEventThrottle
   }));
-};
+});
 
 var BottomSheet = function BottomSheet(_ref) {
   var open = _ref.open,

package/lib/index.js

@@ -8859,6 +8859,10 @@ var space = {
   paddingVertical: {
     property: 'paddingVertical',
     scale: 'space'
+  },
+  gap: {
+    property: 'gap',
+    scale: 'space'
   }
 };
 var radii = {
@@ -10161,7 +10165,7 @@ var Header = function Header(_ref) {
 };
 
 var _excluded$x = ["scrollEventThrottle"];
-var BottomSheetScrollView = function BottomSheetScrollView(_ref) {
+var BottomSheetScrollView = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref$scrollEventThrot = _ref.scrollEventThrottle,
     scrollEventThrottle = _ref$scrollEventThrot === void 0 ? 100 : _ref$scrollEventThrot,
     props = _objectWithoutProperties(_ref, _excluded$x);
@@ -10183,12 +10187,13 @@ var BottomSheetScrollView = function BottomSheetScrollView(_ref) {
     props === null || props === void 0 || (_props$onMomentumScro2 = props.onMomentumScrollEnd) === null || _props$onMomentumScro2 === void 0 || _props$onMomentumScro2.call(props, e);
   }, []);
   return /*#__PURE__*/React__namespace.default.createElement(reactNative.ScrollView, _extends$1({}, props, {
+    ref: ref,
     onScrollBeginDrag: onScrollBeginDrag,
     onMomentumScrollBegin: onMomentumScrollBegin,
     onMomentumScrollEnd: onMomentumScrollEnd,
     scrollEventThrottle: scrollEventThrottle
   }));
-};
+});
 
 var BottomSheet = function BottomSheet(_ref) {
   var open = _ref.open,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "8.84.2",
+  "version": "8.85.0",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",

package/src/components/BottomSheet/ScrollView.tsx

@@ -1,4 +1,4 @@
-import React, { useContext, useCallback } from 'react';
+import React, { useContext, useCallback, forwardRef } from 'react';
 import {
   NativeScrollEvent,
   NativeSyntheticEvent,
@@ -9,49 +9,49 @@ import BottomSheetContext, {
   BottomSheetContextType,
 } from './BottomSheetContext';
 
-const BottomSheetScrollView = ({
-  scrollEventThrottle = 100,
-  ...props
-}: ScrollViewProps): JSX.Element => {
-  const { setInternalShowDivider } =
-    useContext<BottomSheetContextType>(BottomSheetContext);
-
-  const onScrollBeginDrag = useCallback(
-    (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-      setInternalShowDivider(true);
-
-      props?.onScrollBeginDrag?.(e);
-    },
-    []
-  );
-
-  const onMomentumScrollBegin = useCallback(
-    (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-      setInternalShowDivider(true);
-
-      props?.onMomentumScrollEnd?.(e);
-    },
-    []
-  );
-
-  const onMomentumScrollEnd = useCallback(
-    (e: NativeSyntheticEvent<NativeScrollEvent>) => {
-      setInternalShowDivider(false);
-
-      props?.onMomentumScrollEnd?.(e);
-    },
-    []
-  );
-
-  return (
-    <ScrollView
-      {...props}
-      onScrollBeginDrag={onScrollBeginDrag}
-      onMomentumScrollBegin={onMomentumScrollBegin}
-      onMomentumScrollEnd={onMomentumScrollEnd}
-      scrollEventThrottle={scrollEventThrottle}
-    />
-  );
-};
+const BottomSheetScrollView = forwardRef<ScrollView, ScrollViewProps>(
+  ({ scrollEventThrottle = 100, ...props }, ref): JSX.Element => {
+    const { setInternalShowDivider } =
+      useContext<BottomSheetContextType>(BottomSheetContext);
+
+    const onScrollBeginDrag = useCallback(
+      (e: NativeSyntheticEvent<NativeScrollEvent>) => {
+        setInternalShowDivider(true);
+
+        props?.onScrollBeginDrag?.(e);
+      },
+      []
+    );
+
+    const onMomentumScrollBegin = useCallback(
+      (e: NativeSyntheticEvent<NativeScrollEvent>) => {
+        setInternalShowDivider(true);
+
+        props?.onMomentumScrollEnd?.(e);
+      },
+      []
+    );
+
+    const onMomentumScrollEnd = useCallback(
+      (e: NativeSyntheticEvent<NativeScrollEvent>) => {
+        setInternalShowDivider(false);
+
+        props?.onMomentumScrollEnd?.(e);
+      },
+      []
+    );
+
+    return (
+      <ScrollView
+        {...props}
+        ref={ref}
+        onScrollBeginDrag={onScrollBeginDrag}
+        onMomentumScrollBegin={onMomentumScrollBegin}
+        onMomentumScrollEnd={onMomentumScrollEnd}
+        scrollEventThrottle={scrollEventThrottle}
+      />
+    );
+  }
+);
 
 export default BottomSheetScrollView;

package/src/components/Box/__tests__/__snapshots__/index.spec.tsx.snap

@@ -567,6 +567,7 @@ exports[`Box map prop to valid property and correct space from theme 1`] = `
   }
 >
   <View
+    gap="large"
     margin="large"
     marginBottom="large"
     marginEnd="large"
@@ -588,6 +589,7 @@ exports[`Box map prop to valid property and correct space from theme 1`] = `
     style={
       [
         {
+          "gap": 24,
           "margin": 24,
           "marginBottom": 24,
           "marginEnd": 24,
@@ -643,6 +645,7 @@ exports[`Box map prop to valid property and correct space from theme 2`] = `
   }
 >
   <View
+    gap="medium"
     margin="medium"
     marginBottom="medium"
     marginEnd="medium"
@@ -664,6 +667,7 @@ exports[`Box map prop to valid property and correct space from theme 2`] = `
     style={
       [
         {
+          "gap": 16,
           "margin": 16,
           "marginBottom": 16,
           "marginEnd": 16,
@@ -719,6 +723,7 @@ exports[`Box map prop to valid property and correct space from theme 3`] = `
   }
 >
   <View
+    gap="small"
     margin="small"
     marginBottom="small"
     marginEnd="small"
@@ -740,6 +745,7 @@ exports[`Box map prop to valid property and correct space from theme 3`] = `
     style={
       [
         {
+          "gap": 8,
           "margin": 8,
           "marginBottom": 8,
           "marginEnd": 8,
@@ -795,6 +801,7 @@ exports[`Box map prop to valid property and correct space from theme 4`] = `
   }
 >
   <View
+    gap="xlarge"
     margin="xlarge"
     marginBottom="xlarge"
     marginEnd="xlarge"
@@ -816,6 +823,7 @@ exports[`Box map prop to valid property and correct space from theme 4`] = `
     style={
       [
         {
+          "gap": 32,
           "margin": 32,
           "marginBottom": 32,
           "marginEnd": 32,

package/src/components/Box/__tests__/index.spec.tsx

@@ -81,6 +81,7 @@ describe('Box', () => {
         paddingStart={space}
         paddingTop={space}
         paddingVertical={space}
+        gap={space}
       />
     );
 

package/src/components/Box/config.ts

@@ -110,6 +110,10 @@ const space = {
     property: 'paddingVertical',
     scale: 'space',
   },
+  gap: {
+    property: 'gap',
+    scale: 'space',
+  },
 } as const;
 
 const radii = {

package/stats/8.84.2/rn-stats.html

@@ -4840,3 +4840,5 @@ var drawChart = (function (exports) {
 </body>
 </html>
 
+
+