@draftbit/core 50.7.0 → 50.7.1-e6ac8e.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/components/BottomSheet/BottomSheet.js +1 -1
- package/lib/typescript/src/components/BottomSheet/BottomSheet.d.ts +1 -0
- package/lib/typescript/src/components/BottomSheet/BottomSheet.js +3 -2
- package/lib/typescript/src/components/BottomSheet/BottomSheet.js.map +1 -1
- package/lib/typescript/tsconfig.tsbuildinfo +1 -1
- package/package.json +4 -4
- package/src/components/BottomSheet/BottomSheet.js +3 -2
- package/src/components/BottomSheet/BottomSheet.js.map +1 -1
- package/src/components/BottomSheet/BottomSheet.tsx +6 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["snapPoints","topSnapPosition","middleSnapPosition","bottomSnapPosition","initialSnapIndex","initialSnapPosition","showHandle","handleColor","topBorderRadius","borderWidth","borderColor","enableDynamicSizing","onSettle","style","children"];var _this=this,_jsxFileName="/home/runner/work/react-native-jigsaw/react-native-jigsaw/packages/core/src/components/BottomSheet/BottomSheet.tsx";import React from"react";import{StyleSheet,Dimensions}from"react-native";import BottomSheetComponent,{BottomSheetScrollView}from"@gorhom/bottom-sheet";import{useTheme}from"@draftbit/theme";import{extractPercentNumber,useDeepCompareMemo}from"../../utilities";import{jsx as _jsx}from"react/jsx-runtime";var windowHeight=Dimensions.get("window").height;var BottomSheet=React.forwardRef(function(_ref,ref){var snapPointsProp=_ref.snapPoints,_ref$topSnapPosition=_ref.topSnapPosition,topSnapPosition=_ref$topSnapPosition===void 0?"10%":_ref$topSnapPosition,_ref$middleSnapPositi=_ref.middleSnapPosition,middleSnapPosition=_ref$middleSnapPositi===void 0?"50%":_ref$middleSnapPositi,_ref$bottomSnapPositi=_ref.bottomSnapPosition,bottomSnapPosition=_ref$bottomSnapPositi===void 0?"80%":_ref$bottomSnapPositi,initialSnapIndex=_ref.initialSnapIndex,_ref$initialSnapPosit=_ref.initialSnapPosition,initialSnapPosition=_ref$initialSnapPosit===void 0?"bottom":_ref$initialSnapPosit,_ref$showHandle=_ref.showHandle,showHandle=_ref$showHandle===void 0?true:_ref$showHandle,handleColor=_ref.handleColor,_ref$topBorderRadius=_ref.topBorderRadius,topBorderRadius=_ref$topBorderRadius===void 0?20:_ref$topBorderRadius,_ref$borderWidth=_ref.borderWidth,borderWidth=_ref$borderWidth===void 0?1:_ref$borderWidth,borderColor=_ref.borderColor,_ref$enableDynamicSiz=_ref.enableDynamicSizing,enableDynamicSizing=_ref$enableDynamicSiz===void 0?true:_ref$enableDynamicSiz,onSettle=_ref.onSettle,style=_ref.style,children=_ref.children,rest=_objectWithoutProperties(_ref,_excluded);var theme=useTheme();var backgroundColor=(style==null?void 0:style.backgroundColor)||theme.colors.background.base;var snapPoints=snapPointsProp!=null?snapPointsProp:[topSnapPosition,middleSnapPosition,bottomSnapPosition];var mappedSnapPoints=useDeepCompareMemo(function(){return convertSnapPointsForNewImplementation(snapPoints);},snapPoints);var getSnapIndexFromPosition=function getSnapIndexFromPosition(position){switch(position){case"bottom":return 0;case"middle":return 1;case"top":return 2;}};return _jsx(BottomSheetComponent,{ref:ref,enableDynamicSizing:enableDynamicSizing,snapPoints:mappedSnapPoints,index:initialSnapIndex!==undefined?mappedSnapPoints.length-initialSnapIndex-1:getSnapIndexFromPosition(initialSnapPosition),handleIndicatorStyle:[{backgroundColor:handleColor!=null?handleColor:theme.colors.border.base},!showHandle?{display:"none"}:{}],backgroundStyle:{backgroundColor:backgroundColor,borderTopLeftRadius:topBorderRadius,borderTopRightRadius:topBorderRadius,borderWidth:borderWidth,borderColor:borderColor!=null?borderColor:theme.colors.border.base},onChange:function onChange(index){return enableDynamicSizing?onSettle==null?void 0:onSettle(mappedSnapPoints.length-index):onSettle==null?void 0:onSettle(mappedSnapPoints.length-index-1);},children:_jsx(BottomSheetScrollView,Object.assign({contentContainerStyle:[styles.contentContainerStyle,style]},rest,{children:children}))});});function convertSnapPointsForNewImplementation(snapPoints){var reversedSnapPoints=_toConsumableArray(snapPoints).reverse();return reversedSnapPoints.map(function(point){if(typeof point==="string"){var percentNumber=extractPercentNumber(point);if(percentNumber!==undefined){return`${100-percentNumber}%`;}return point;}else if(typeof point==="number"){return windowHeight-point;}else{return point;}});}var styles=StyleSheet.create({contentContainerStyle:{paddingHorizontal:16,paddingVertical:10}});export default BottomSheet;
|
|
1
|
+
import _toConsumableArray from"@babel/runtime/helpers/toConsumableArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["snapPoints","topSnapPosition","middleSnapPosition","bottomSnapPosition","initialSnapIndex","initialSnapPosition","showHandle","handleColor","topBorderRadius","borderWidth","borderColor","enableDynamicSizing","onSettle","style","children","ignoreReduceMotion"];var _this=this,_jsxFileName="/home/runner/work/react-native-jigsaw/react-native-jigsaw/packages/core/src/components/BottomSheet/BottomSheet.tsx";import React from"react";import{StyleSheet,Dimensions}from"react-native";import BottomSheetComponent,{BottomSheetScrollView}from"@gorhom/bottom-sheet";import{useTheme}from"@draftbit/theme";import{extractPercentNumber,useDeepCompareMemo}from"../../utilities";import{ReduceMotion}from"react-native-reanimated";import{jsx as _jsx}from"react/jsx-runtime";var windowHeight=Dimensions.get("window").height;var BottomSheet=React.forwardRef(function(_ref,ref){var snapPointsProp=_ref.snapPoints,_ref$topSnapPosition=_ref.topSnapPosition,topSnapPosition=_ref$topSnapPosition===void 0?"10%":_ref$topSnapPosition,_ref$middleSnapPositi=_ref.middleSnapPosition,middleSnapPosition=_ref$middleSnapPositi===void 0?"50%":_ref$middleSnapPositi,_ref$bottomSnapPositi=_ref.bottomSnapPosition,bottomSnapPosition=_ref$bottomSnapPositi===void 0?"80%":_ref$bottomSnapPositi,initialSnapIndex=_ref.initialSnapIndex,_ref$initialSnapPosit=_ref.initialSnapPosition,initialSnapPosition=_ref$initialSnapPosit===void 0?"bottom":_ref$initialSnapPosit,_ref$showHandle=_ref.showHandle,showHandle=_ref$showHandle===void 0?true:_ref$showHandle,handleColor=_ref.handleColor,_ref$topBorderRadius=_ref.topBorderRadius,topBorderRadius=_ref$topBorderRadius===void 0?20:_ref$topBorderRadius,_ref$borderWidth=_ref.borderWidth,borderWidth=_ref$borderWidth===void 0?1:_ref$borderWidth,borderColor=_ref.borderColor,_ref$enableDynamicSiz=_ref.enableDynamicSizing,enableDynamicSizing=_ref$enableDynamicSiz===void 0?true:_ref$enableDynamicSiz,onSettle=_ref.onSettle,style=_ref.style,children=_ref.children,_ref$ignoreReduceMoti=_ref.ignoreReduceMotion,ignoreReduceMotion=_ref$ignoreReduceMoti===void 0?true:_ref$ignoreReduceMoti,rest=_objectWithoutProperties(_ref,_excluded);var theme=useTheme();var backgroundColor=(style==null?void 0:style.backgroundColor)||theme.colors.background.base;var snapPoints=snapPointsProp!=null?snapPointsProp:[topSnapPosition,middleSnapPosition,bottomSnapPosition];var mappedSnapPoints=useDeepCompareMemo(function(){return convertSnapPointsForNewImplementation(snapPoints);},snapPoints);var getSnapIndexFromPosition=function getSnapIndexFromPosition(position){switch(position){case"bottom":return 0;case"middle":return 1;case"top":return 2;}};return _jsx(BottomSheetComponent,{ref:ref,enableDynamicSizing:enableDynamicSizing,snapPoints:mappedSnapPoints,index:initialSnapIndex!==undefined?mappedSnapPoints.length-initialSnapIndex-1:getSnapIndexFromPosition(initialSnapPosition),handleIndicatorStyle:[{backgroundColor:handleColor!=null?handleColor:theme.colors.border.base},!showHandle?{display:"none"}:{}],backgroundStyle:{backgroundColor:backgroundColor,borderTopLeftRadius:topBorderRadius,borderTopRightRadius:topBorderRadius,borderWidth:borderWidth,borderColor:borderColor!=null?borderColor:theme.colors.border.base},onChange:function onChange(index){return enableDynamicSizing?onSettle==null?void 0:onSettle(mappedSnapPoints.length-index):onSettle==null?void 0:onSettle(mappedSnapPoints.length-index-1);},overrideReduceMotion:ignoreReduceMotion?ReduceMotion.System:undefined,children:_jsx(BottomSheetScrollView,Object.assign({contentContainerStyle:[styles.contentContainerStyle,style]},rest,{children:children}))});});function convertSnapPointsForNewImplementation(snapPoints){var reversedSnapPoints=_toConsumableArray(snapPoints).reverse();return reversedSnapPoints.map(function(point){if(typeof point==="string"){var percentNumber=extractPercentNumber(point);if(percentNumber!==undefined){return`${100-percentNumber}%`;}return point;}else if(typeof point==="number"){return windowHeight-point;}else{return point;}});}var styles=StyleSheet.create({contentContainerStyle:{paddingHorizontal:16,paddingVertical:10}});export default BottomSheet;
|
|
@@ -22,6 +22,7 @@ export interface BottomSheetProps extends ScrollViewProps {
|
|
|
22
22
|
enableDynamicSizing?: boolean;
|
|
23
23
|
onSettle?: (index: number) => void;
|
|
24
24
|
style?: StyleProp<ViewStyle>;
|
|
25
|
+
ignoreReduceMotion?: boolean;
|
|
25
26
|
}
|
|
26
27
|
declare const BottomSheet: React.ForwardRefExoticComponent<BottomSheetProps & React.RefAttributes<import("@gorhom/bottom-sheet/lib/typescript/types").BottomSheetMethods>>;
|
|
27
28
|
export default BottomSheet;
|
|
@@ -3,11 +3,12 @@ import { StyleSheet, Dimensions, } from "react-native";
|
|
|
3
3
|
import BottomSheetComponent, { BottomSheetScrollView, } from "@gorhom/bottom-sheet";
|
|
4
4
|
import { useTheme } from "@draftbit/theme";
|
|
5
5
|
import { extractPercentNumber, useDeepCompareMemo } from "../../utilities";
|
|
6
|
+
import { ReduceMotion } from "react-native-reanimated";
|
|
6
7
|
const windowHeight = Dimensions.get("window").height;
|
|
7
8
|
// Clarification:
|
|
8
9
|
// Input of snap points is sorted top -> bottom where each value represents distance from top
|
|
9
10
|
// Implementation using `@gorhom/bottom-sheet` is sorted bottom -> top where each value represents distance from bottom
|
|
10
|
-
const BottomSheet = React.forwardRef(({ snapPoints: snapPointsProp, topSnapPosition = "10%", middleSnapPosition = "50%", bottomSnapPosition = "80%", initialSnapIndex, initialSnapPosition = "bottom", showHandle = true, handleColor, topBorderRadius = 20, borderWidth = 1, borderColor, enableDynamicSizing = true, onSettle, style, children, ...rest }, ref) => {
|
|
11
|
+
const BottomSheet = React.forwardRef(({ snapPoints: snapPointsProp, topSnapPosition = "10%", middleSnapPosition = "50%", bottomSnapPosition = "80%", initialSnapIndex, initialSnapPosition = "bottom", showHandle = true, handleColor, topBorderRadius = 20, borderWidth = 1, borderColor, enableDynamicSizing = true, onSettle, style, children, ignoreReduceMotion = true, ...rest }, ref) => {
|
|
11
12
|
const theme = useTheme();
|
|
12
13
|
const backgroundColor = (style === null || style === void 0 ? void 0 : style.backgroundColor) || theme.colors.background.base;
|
|
13
14
|
const snapPoints = snapPointsProp !== null && snapPointsProp !== void 0 ? snapPointsProp : [
|
|
@@ -42,7 +43,7 @@ const BottomSheet = React.forwardRef(({ snapPoints: snapPointsProp, topSnapPosit
|
|
|
42
43
|
// When dynamic sizing is enabled, we don't need to subtract 1 since an extra snap point may be added
|
|
43
44
|
enableDynamicSizing
|
|
44
45
|
? onSettle === null || onSettle === void 0 ? void 0 : onSettle(mappedSnapPoints.length - index)
|
|
45
|
-
: onSettle === null || onSettle === void 0 ? void 0 : onSettle(mappedSnapPoints.length - index - 1) },
|
|
46
|
+
: onSettle === null || onSettle === void 0 ? void 0 : onSettle(mappedSnapPoints.length - index - 1), overrideReduceMotion: ignoreReduceMotion ? ReduceMotion.System : undefined },
|
|
46
47
|
React.createElement(BottomSheetScrollView, { contentContainerStyle: [styles.contentContainerStyle, style], ...rest }, children)));
|
|
47
48
|
});
|
|
48
49
|
// @gorhom/bottom-sheet has a different format for snap points and requires some manipulation
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.js","sourceRoot":"","sources":["../../../../../src/components/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,UAAU,EAIV,UAAU,GACX,MAAM,cAAc,CAAC;AAEtB,OAAO,oBAAoB,EAAE,EAC3B,qBAAqB,GACtB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAC3C,OAAO,EAAE,oBAAoB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomSheet.js","sourceRoot":"","sources":["../../../../../src/components/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"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"}
|