@pagopa/io-app-design-system 4.4.2 → 4.4.3
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/buttons/ButtonSolid.js +12 -2
- package/lib/commonjs/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/commonjs/components/buttons/__test__/__snapshots__/button.test.tsx.snap +0 -2
- package/lib/module/components/buttons/ButtonSolid.js +13 -3
- package/lib/module/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/module/components/buttons/__test__/__snapshots__/button.test.tsx.snap +0 -2
- package/lib/typescript/components/buttons/ButtonSolid.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/buttons/ButtonSolid.tsx +18 -3
- package/src/components/buttons/__test__/__snapshots__/button.test.tsx.snap +0 -2
|
@@ -123,6 +123,16 @@ const ButtonSolid = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
123
123
|
const colorMap = _react.default.useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
124
124
|
const buttonStyles = _react.default.useMemo(() => isExperimental ? _core.IOButtonStyles : _core.IOButtonLegacyStyles, [isExperimental]);
|
|
125
125
|
|
|
126
|
+
/* Prevent the component from triggering the `isEntering' transition
|
|
127
|
+
on the on the first render. Solution from this discussion:
|
|
128
|
+
https://github.com/software-mansion/react-native-reanimated/discussions/2513
|
|
129
|
+
*/
|
|
130
|
+
const isMounted = (0, _react.useRef)(false);
|
|
131
|
+
(0, _react.useEffect)(() => {
|
|
132
|
+
// eslint-disable-next-line functional/immutable-data
|
|
133
|
+
isMounted.current = true;
|
|
134
|
+
}, []);
|
|
135
|
+
|
|
126
136
|
// Interpolate animation values from `isPressed` values
|
|
127
137
|
const pressedAnimationStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
|
|
128
138
|
// Link color states to the pressed states
|
|
@@ -174,7 +184,7 @@ const ButtonSolid = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
174
184
|
!disabled && !reducedMotion && scaleAnimatedStyle, !disabled && pressedAnimationStyle]
|
|
175
185
|
}, loading && /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
|
|
176
186
|
style: buttonStyles.buttonInner,
|
|
177
|
-
entering: _core.enterTransitionInnerContentSmall,
|
|
187
|
+
entering: isMounted.current ? _core.enterTransitionInnerContentSmall : undefined,
|
|
178
188
|
exiting: _core.exitTransitionInnerContent
|
|
179
189
|
}, /*#__PURE__*/_react.default.createElement(_loadingSpinner.LoadingSpinner, {
|
|
180
190
|
color: foregroundColor
|
|
@@ -187,7 +197,7 @@ const ButtonSolid = /*#__PURE__*/_react.default.forwardRef(({
|
|
|
187
197
|
iconPosition === "end" && {
|
|
188
198
|
flexDirection: "row-reverse"
|
|
189
199
|
}],
|
|
190
|
-
entering: _core.enterTransitionInnerContent
|
|
200
|
+
entering: isMounted.current ? _core.enterTransitionInnerContent : undefined
|
|
191
201
|
}, icon && /*#__PURE__*/_react.default.createElement(_icons.Icon, {
|
|
192
202
|
allowFontScaling: true,
|
|
193
203
|
name: icon,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeHapticFeedback","_interopRequireDefault","_reactNativeReanimated","_core","_hooks","_icons","_loadingSpinner","_ButtonText","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","colorPrimaryLegacyButtonDisabled","legacyStyles","StyleSheet","create","backgroundDisabled","backgroundColor","IOColors","colorPrimaryButtonDisabled","ICON_MARGIN","DISABLED_OPACITY","iconSize","styles","opacity","mapColorStates","primary","pressed","label","disabled","danger","contrast","white","mapLegacyColorStates","blue","ButtonSolid","React","forwardRef","color","fullWidth","loading","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_colorMap$color","_colorMap$color2","_colorMap$color3","isExperimental","useIOExperimentalDesign","progress","onPressIn","onPressOut","scaleAnimatedStyle","useScaleAnimation","reducedMotion","useReducedMotion","colorMap","useMemo","buttonStyles","IOButtonStyles","IOButtonLegacyStyles","pressedAnimationStyle","useAnimatedStyle","interpolateColor","value","handleOnPress","useCallback","event","ReactNativeHapticFeedback","trigger","foregroundColor","createElement","Pressable","accessible","accessibilityState","busy","accessibilityRole","style","dimensionsDefault","View","button","overflow","paddingHorizontal","buttonSizeDefault","buttonInner","entering","enterTransitionInnerContentSmall","exiting","exitTransitionInnerContent","LoadingSpinner","columnGap","flexDirection","enterTransitionInnerContent","Icon","allowFontScaling","name","size","ButtonText","numberOfLines","ellipsizeMode","accessibilityElementsHidden","importantForAccessibility","exports","_default"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonSolid.tsx"],"mappings":"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
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_reactNativeHapticFeedback","_interopRequireDefault","_reactNativeReanimated","_core","_hooks","_icons","_loadingSpinner","_ButtonText","obj","__esModule","default","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","colorPrimaryLegacyButtonDisabled","legacyStyles","StyleSheet","create","backgroundDisabled","backgroundColor","IOColors","colorPrimaryButtonDisabled","ICON_MARGIN","DISABLED_OPACITY","iconSize","styles","opacity","mapColorStates","primary","pressed","label","disabled","danger","contrast","white","mapLegacyColorStates","blue","ButtonSolid","React","forwardRef","color","fullWidth","loading","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_colorMap$color","_colorMap$color2","_colorMap$color3","isExperimental","useIOExperimentalDesign","progress","onPressIn","onPressOut","scaleAnimatedStyle","useScaleAnimation","reducedMotion","useReducedMotion","colorMap","useMemo","buttonStyles","IOButtonStyles","IOButtonLegacyStyles","isMounted","useRef","useEffect","current","pressedAnimationStyle","useAnimatedStyle","interpolateColor","value","handleOnPress","useCallback","event","ReactNativeHapticFeedback","trigger","foregroundColor","createElement","Pressable","accessible","accessibilityState","busy","accessibilityRole","style","dimensionsDefault","View","button","overflow","paddingHorizontal","buttonSizeDefault","buttonInner","entering","enterTransitionInnerContentSmall","undefined","exiting","exitTransitionInnerContent","LoadingSpinner","columnGap","flexDirection","enterTransitionInnerContent","Icon","allowFontScaling","name","size","ButtonText","numberOfLines","ellipsizeMode","accessibilityElementsHidden","importantForAccessibility","exports","_default"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonSolid.tsx"],"mappings":"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"}
|
|
@@ -300,7 +300,6 @@ exports[`Test Buttons Components - Experimental Enabled ButtonSolid Snapshot 1`]
|
|
|
300
300
|
}
|
|
301
301
|
>
|
|
302
302
|
<View
|
|
303
|
-
entering={[Function]}
|
|
304
303
|
style={
|
|
305
304
|
[
|
|
306
305
|
{
|
|
@@ -1038,7 +1037,6 @@ exports[`Test Buttons Components ButtonSolid Snapshot 1`] = `
|
|
|
1038
1037
|
}
|
|
1039
1038
|
>
|
|
1040
1039
|
<View
|
|
1041
|
-
entering={[Function]}
|
|
1042
1040
|
style={
|
|
1043
1041
|
[
|
|
1044
1042
|
{
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useCallback } from "react";
|
|
1
|
+
import React, { useCallback, useEffect, useRef } from "react";
|
|
2
2
|
import { Pressable, StyleSheet } from "react-native";
|
|
3
3
|
import ReactNativeHapticFeedback from "react-native-haptic-feedback";
|
|
4
4
|
import Animated, { interpolateColor, useAnimatedStyle, useReducedMotion } from "react-native-reanimated";
|
|
@@ -114,6 +114,16 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
114
114
|
const colorMap = React.useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
115
115
|
const buttonStyles = React.useMemo(() => isExperimental ? IOButtonStyles : IOButtonLegacyStyles, [isExperimental]);
|
|
116
116
|
|
|
117
|
+
/* Prevent the component from triggering the `isEntering' transition
|
|
118
|
+
on the on the first render. Solution from this discussion:
|
|
119
|
+
https://github.com/software-mansion/react-native-reanimated/discussions/2513
|
|
120
|
+
*/
|
|
121
|
+
const isMounted = useRef(false);
|
|
122
|
+
useEffect(() => {
|
|
123
|
+
// eslint-disable-next-line functional/immutable-data
|
|
124
|
+
isMounted.current = true;
|
|
125
|
+
}, []);
|
|
126
|
+
|
|
117
127
|
// Interpolate animation values from `isPressed` values
|
|
118
128
|
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
119
129
|
// Link color states to the pressed states
|
|
@@ -165,7 +175,7 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
165
175
|
!disabled && !reducedMotion && scaleAnimatedStyle, !disabled && pressedAnimationStyle]
|
|
166
176
|
}, loading && /*#__PURE__*/React.createElement(Animated.View, {
|
|
167
177
|
style: buttonStyles.buttonInner,
|
|
168
|
-
entering: enterTransitionInnerContentSmall,
|
|
178
|
+
entering: isMounted.current ? enterTransitionInnerContentSmall : undefined,
|
|
169
179
|
exiting: exitTransitionInnerContent
|
|
170
180
|
}, /*#__PURE__*/React.createElement(LoadingSpinner, {
|
|
171
181
|
color: foregroundColor
|
|
@@ -178,7 +188,7 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
178
188
|
iconPosition === "end" && {
|
|
179
189
|
flexDirection: "row-reverse"
|
|
180
190
|
}],
|
|
181
|
-
entering: enterTransitionInnerContent
|
|
191
|
+
entering: isMounted.current ? enterTransitionInnerContent : undefined
|
|
182
192
|
}, icon && /*#__PURE__*/React.createElement(Icon, {
|
|
183
193
|
allowFontScaling: true,
|
|
184
194
|
name: icon,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","Pressable","StyleSheet","ReactNativeHapticFeedback","Animated","interpolateColor","useAnimatedStyle","useReducedMotion","IOButtonLegacyStyles","IOButtonStyles","IOColors","enterTransitionInnerContent","enterTransitionInnerContentSmall","exitTransitionInnerContent","useIOExperimentalDesign","useScaleAnimation","Icon","LoadingSpinner","ButtonText","colorPrimaryLegacyButtonDisabled","legacyStyles","create","backgroundDisabled","backgroundColor","colorPrimaryButtonDisabled","ICON_MARGIN","DISABLED_OPACITY","iconSize","styles","opacity","mapColorStates","primary","default","pressed","label","disabled","danger","contrast","white","mapLegacyColorStates","blue","ButtonSolid","forwardRef","color","fullWidth","loading","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_colorMap$color","_colorMap$color2","_colorMap$color3","isExperimental","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","colorMap","useMemo","buttonStyles","pressedAnimationStyle","value","handleOnPress","event","trigger","foregroundColor","createElement","accessible","accessibilityState","busy","accessibilityRole","style","dimensionsDefault","View","button","overflow","paddingHorizontal","buttonSizeDefault","buttonInner","entering","exiting","columnGap","flexDirection","allowFontScaling","name","size","numberOfLines","ellipsizeMode","accessibilityElementsHidden","importantForAccessibility"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonSolid.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAoBC,WAAW,QAAQ,OAAO;
|
|
1
|
+
{"version":3,"names":["React","useCallback","useEffect","useRef","Pressable","StyleSheet","ReactNativeHapticFeedback","Animated","interpolateColor","useAnimatedStyle","useReducedMotion","IOButtonLegacyStyles","IOButtonStyles","IOColors","enterTransitionInnerContent","enterTransitionInnerContentSmall","exitTransitionInnerContent","useIOExperimentalDesign","useScaleAnimation","Icon","LoadingSpinner","ButtonText","colorPrimaryLegacyButtonDisabled","legacyStyles","create","backgroundDisabled","backgroundColor","colorPrimaryButtonDisabled","ICON_MARGIN","DISABLED_OPACITY","iconSize","styles","opacity","mapColorStates","primary","default","pressed","label","disabled","danger","contrast","white","mapLegacyColorStates","blue","ButtonSolid","forwardRef","color","fullWidth","loading","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_colorMap$color","_colorMap$color2","_colorMap$color3","isExperimental","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","colorMap","useMemo","buttonStyles","isMounted","current","pressedAnimationStyle","value","handleOnPress","event","trigger","foregroundColor","createElement","accessible","accessibilityState","busy","accessibilityRole","style","dimensionsDefault","View","button","overflow","paddingHorizontal","buttonSizeDefault","buttonInner","entering","undefined","exiting","columnGap","flexDirection","allowFontScaling","name","size","numberOfLines","ellipsizeMode","accessibilityElementsHidden","importantForAccessibility"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonSolid.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAoBC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAC7E,SAEEC,SAAS,EACTC,UAAU,QAEL,cAAc;AACrB,OAAOC,yBAAyB,MAAM,8BAA8B;AACpE,OAAOC,QAAQ,IACbC,gBAAgB,EAChBC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAChC,SACEC,oBAAoB,EACpBC,cAAc,EACdC,QAAQ,EACRC,2BAA2B,EAC3BC,gCAAgC,EAChCC,0BAA0B,EAC1BC,uBAAuB,QAClB,YAAY;AACnB,SAASC,iBAAiB,QAAQ,aAAa;AAE/C,SAAmCC,IAAI,QAAQ,UAAU;AACzD,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,UAAU,QAAQ,0BAA0B;AAarD;AACA;AACA,MAAMC,gCAA0C,GAAG,eAAe;AAClE,MAAMC,YAAY,GAAGlB,UAAU,CAACmB,MAAM,CAAC;EACrCC,kBAAkB,EAAE;IAClBC,eAAe,EAAEb,QAAQ,CAACS,gCAAgC;EAC5D;AACF,CAAC,CAAC;AAEF,MAAMK,0BAAoC,GAAG,UAAU;AACvD,MAAMC,WAAW,GAAG,CAAC;AACrB,MAAMC,gBAAgB,GAAG,GAAG;;AAE5B;AACA,MAAMC,QAAyB,GAAG,EAAE;AAEpC,MAAMC,MAAM,GAAG1B,UAAU,CAACmB,MAAM,CAAC;EAC/BC,kBAAkB,EAAE;IAClBC,eAAe,EAAEb,QAAQ,CAACc,0BAA0B,CAAC;IACrDK,OAAO,EAAEH;EACX;AACF,CAAC,CAAC;AA6BF,MAAMI,cAGL,GAAG;EACF;EACAC,OAAO,EAAE;IACPC,OAAO,EAAEtB,QAAQ,CAAC,YAAY,CAAC;IAC/BuB,OAAO,EAAEvB,QAAQ,CAAC,YAAY,CAAC;IAC/BwB,KAAK,EAAE;MACLF,OAAO,EAAE,OAAO;MAChBG,QAAQ,EAAE;IACZ;EACF,CAAC;EACD;EACAC,MAAM,EAAE;IACNJ,OAAO,EAAEtB,QAAQ,CAAC,WAAW,CAAC;IAC9BuB,OAAO,EAAEvB,QAAQ,CAAC,WAAW,CAAC;IAC9BwB,KAAK,EAAE;MACLF,OAAO,EAAE,OAAO;MAChBG,QAAQ,EAAE;IACZ;EACF,CAAC;EACD;EACAE,QAAQ,EAAE;IACRL,OAAO,EAAEtB,QAAQ,CAAC4B,KAAK;IACvBL,OAAO,EAAEvB,QAAQ,CAAC,WAAW,CAAC;IAC9BwB,KAAK,EAAE;MACLF,OAAO,EAAE,YAAY;MACrBG,QAAQ,EAAE;IACZ;EACF;AACF,CAAC;;AAED;AACA,MAAMI,oBAGL,GAAG;EACF;EACAR,OAAO,EAAE;IACPC,OAAO,EAAEtB,QAAQ,CAAC8B,IAAI;IACtBP,OAAO,EAAEvB,QAAQ,CAAC,UAAU,CAAC;IAC7BwB,KAAK,EAAE;MACLF,OAAO,EAAE,OAAO;MAChBG,QAAQ,EAAE;IACZ;EACF,CAAC;EACD;EACAC,MAAM,EAAE;IACNJ,OAAO,EAAEtB,QAAQ,CAAC,WAAW,CAAC;IAC9BuB,OAAO,EAAEvB,QAAQ,CAAC,WAAW,CAAC;IAC9BwB,KAAK,EAAE;MACLF,OAAO,EAAE,OAAO;MAChBG,QAAQ,EAAE;IACZ;EACF,CAAC;EACD;EACAE,QAAQ,EAAE;IACRL,OAAO,EAAEtB,QAAQ,CAAC4B,KAAK;IACvBL,OAAO,EAAEvB,QAAQ,CAAC,SAAS,CAAC;IAC5BwB,KAAK,EAAE;MACLF,OAAO,EAAE,MAAM;MACfG,QAAQ,EAAE;IACZ;EACF;AACF,CAAC;AAED,OAAO,MAAMM,WAAW,gBAAG5C,KAAK,CAAC6C,UAAU,CACzC,CACE;EACEC,KAAK,GAAG,SAAS;EACjBT,KAAK;EACLU,SAAS,GAAG,KAAK;EACjBT,QAAQ,GAAG,KAAK;EAChBU,OAAO,GAAG,KAAK;EACfC,IAAI;EACJC,YAAY,GAAG,OAAO;EACtBC,OAAO;EACPC,kBAAkB;EAClBC,iBAAiB;EACjBC;AACF,CAAC,EACDC,GAAG,KACA;EAAA,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;EACH,MAAM;IAAEC;EAAe,CAAC,GAAG1C,uBAAuB,CAAC,CAAC;EACpD,MAAM;IAAE2C,QAAQ;IAAEC,SAAS;IAAEC,UAAU;IAAEC;EAAmB,CAAC,GAC3D7C,iBAAiB,CAAC,CAAC;EACrB,MAAM8C,aAAa,GAAGtD,gBAAgB,CAAC,CAAC;EAExC,MAAMuD,QAAQ,GAAGjE,KAAK,CAACkE,OAAO,CAC5B,MAAOP,cAAc,GAAG1B,cAAc,GAAGS,oBAAqB,EAC9D,CAACiB,cAAc,CACjB,CAAC;EAED,MAAMQ,YAAY,GAAGnE,KAAK,CAACkE,OAAO,CAChC,MAAOP,cAAc,GAAG/C,cAAc,GAAGD,oBAAqB,EAC9D,CAACgD,cAAc,CACjB,CAAC;;EAED;AACJ;AACA;AACA;EACI,MAAMS,SAAS,GAAGjE,MAAM,CAAC,KAAK,CAAC;EAE/BD,SAAS,CAAC,MAAM;IACd;IACAkE,SAAS,CAACC,OAAO,GAAG,IAAI;EAC1B,CAAC,EAAE,EAAE,CAAC;;EAEN;EACA,MAAMC,qBAAqB,GAAG7D,gBAAgB,CAAC,MAAM;IACnD;IACA,MAAMiB,eAAe,GAAGlB,gBAAgB,CACtCoD,QAAQ,CAACW,KAAK,EACd,CAAC,CAAC,EAAE,CAAC,CAAC,EACN,CAACN,QAAQ,CAACnB,KAAK,CAAC,CAACX,OAAO,EAAE8B,QAAQ,CAACnB,KAAK,CAAC,CAACV,OAAO,CACnD,CAAC;IAED,OAAO;MAAEV;IAAgB,CAAC;EAC5B,CAAC,CAAC;EAEF,MAAM8C,aAAa,GAAGvE,WAAW,CAC9BwE,KAA4B,IAAK;IAChC;AACR;IACQ,IAAIzB,OAAO,EAAE;MACX;IACF;IACA1C,yBAAyB,CAACoE,OAAO,CAAC,aAAa,CAAC;IAChDvB,OAAO,CAACsB,KAAK,CAAC;EAChB,CAAC,EACD,CAACzB,OAAO,EAAEG,OAAO,CACnB,CAAC;;EAED;EACA,MAAMwB,eAAyB,GAAGrC,QAAQ,IAAAkB,eAAA,GACtCS,QAAQ,CAACnB,KAAK,CAAC,cAAAU,eAAA,gBAAAA,eAAA,GAAfA,eAAA,CAAiBnB,KAAK,cAAAmB,eAAA,uBAAtBA,eAAA,CAAwBlB,QAAQ,IAAAmB,gBAAA,GAChCQ,QAAQ,CAACnB,KAAK,CAAC,cAAAW,gBAAA,gBAAAA,gBAAA,GAAfA,gBAAA,CAAiBpB,KAAK,cAAAoB,gBAAA,uBAAtBA,gBAAA,CAAwBtB,OAAO;EAEnC,oBACEnC,KAAA,CAAA4E,aAAA,CAACxE,SAAS;IACRkD,MAAM,EAAEA,MAAO;IACfC,GAAG,EAAEA,GAAI;IACTsB,UAAU,EAAE;IACZ;IAAA;IACAzB,kBAAkB,EAAEA,kBAAkB,IAAIf,KAAM;IAChDgB,iBAAiB,EAAEA,iBAAkB;IACrCyB,kBAAkB,EAAE;MAClBC,IAAI,EAAE/B,OAAO;MACbV,QAAQ,EAAEA,QAAQ,IAAI;IACxB,CAAE;IACF0C,iBAAiB,EAAE,QAAS;IAC5B7B,OAAO,EAAEqB,aAAc;IACvBX,SAAS,EAAEA,SAAU;IACrBC,UAAU,EAAEA,UAAW;IACvBxB,QAAQ,EAAEA,QAAS;IACnB2C,KAAK,EAAE,CAAClC,SAAS,GAAGnC,cAAc,CAACsE,iBAAiB,GAAG,CAAC;EAAE,gBAE1DlF,KAAA,CAAA4E,aAAA,CAACrE,QAAQ,CAAC4E,IAAI;IACZF,KAAK,EAAE,CACLd,YAAY,CAACiB,MAAM,EACnB;MAAEC,QAAQ,EAAE;IAAS,CAAC,EACtB1B,cAAc,IAAIZ,SAAS,IAAI;MAAEuC,iBAAiB,EAAE;IAAG,CAAC,EACxDnB,YAAY,CAACoB,iBAAiB,EAC9BjD,QAAQ,GACJqB,cAAc,GACZ5B,MAAM,CAACN,kBAAkB,GACzBF,YAAY,CAACE,kBAAkB,GACjC;MAAEC,eAAe,GAAAgC,gBAAA,GAAEO,QAAQ,CAACnB,KAAK,CAAC,cAAAY,gBAAA,uBAAfA,gBAAA,CAAiBvB;IAAQ,CAAC;IACjD;AACZ;IACY,CAACG,QAAQ,IAAI,CAAC0B,aAAa,IAAID,kBAAkB,EACjD,CAACzB,QAAQ,IAAIgC,qBAAqB;EAClC,GAEDtB,OAAO,iBACNhD,KAAA,CAAA4E,aAAA,CAACrE,QAAQ,CAAC4E,IAAI;IACZF,KAAK,EAAEd,YAAY,CAACqB,WAAY;IAChCC,QAAQ,EACNrB,SAAS,CAACC,OAAO,GAAGtD,gCAAgC,GAAG2E,SACxD;IACDC,OAAO,EAAE3E;EAA2B,gBAEpChB,KAAA,CAAA4E,aAAA,CAACxD,cAAc;IAAC0B,KAAK,EAAE6B;EAAgB,CAAE,CAC5B,CAChB,EAEA,CAAC3B,OAAO,iBACPhD,KAAA,CAAA4E,aAAA,CAACrE,QAAQ,CAAC4E,IAAI;IACZF,KAAK,EAAE,CACLd,YAAY,CAACqB,WAAW,EACxB;MAAEI,SAAS,EAAEhE;IAAY,CAAC;IAC1B;AAChB;IACgBsB,YAAY,KAAK,KAAK,IAAI;MAAE2C,aAAa,EAAE;IAAc,CAAC,CAC1D;IACFJ,QAAQ,EACNrB,SAAS,CAACC,OAAO,GAAGvD,2BAA2B,GAAG4E;EACnD,GAEAzC,IAAI,iBACHjD,KAAA,CAAA4E,aAAA,CAACzD,IAAI;IACH2E,gBAAgB;IAChBC,IAAI,EAAE9C,IAAK;IACX+C,IAAI,EAAElE,QAAS;IACfgB,KAAK,EAAE6B;EAAgB,CACxB,CACF,eACD3E,KAAA,CAAA4E,aAAA,CAACvD,UAAU;IACTyB,KAAK,EAAE6B,eAAgB;IACvBM,KAAK,EAAErE,cAAc,CAACyB,KAAM;IAC5B4D,aAAa,EAAE,CAAE;IACjBC,aAAa,EAAC,MAAM;IACpBrB,UAAU,EAAE,KAAM;IAClBsB,2BAA2B;IAC3BC,yBAAyB,EAAC;EAAqB,GAE9C/D,KACS,CACC,CAEJ,CACN,CAAC;AAEhB,CACF,CAAC;AAED,eAAeO,WAAW"}
|
|
@@ -300,7 +300,6 @@ exports[`Test Buttons Components - Experimental Enabled ButtonSolid Snapshot 1`]
|
|
|
300
300
|
}
|
|
301
301
|
>
|
|
302
302
|
<View
|
|
303
|
-
entering={[Function]}
|
|
304
303
|
style={
|
|
305
304
|
[
|
|
306
305
|
{
|
|
@@ -1038,7 +1037,6 @@ exports[`Test Buttons Components ButtonSolid Snapshot 1`] = `
|
|
|
1038
1037
|
}
|
|
1039
1038
|
>
|
|
1040
1039
|
<View
|
|
1041
|
-
entering={[Function]}
|
|
1042
1040
|
style={
|
|
1043
1041
|
[
|
|
1044
1042
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonSolid.d.ts","sourceRoot":"","sources":["../../../../src/components/buttons/ButtonSolid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"ButtonSolid.d.ts","sourceRoot":"","sources":["../../../../src/components/buttons/ButtonSolid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,cAAc,EAAkC,MAAM,OAAO,CAAC;AAC9E,OAAO,EACL,qBAAqB,EACrB,SAAS,EAET,IAAI,EACL,MAAM,cAAc,CAAC;AAiBtB,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAmB,OAAO,EAAQ,MAAM,UAAU,CAAC;AAI1D,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,QAAQ,GAAG,UAAU,CAAC;AAkCjE,MAAM,MAAM,gBAAgB,GAAG,UAAU,CACvC;IACE;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC/B,OAAO,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACjD,GAAG,IAAI,CACN,cAAc,CAAC,OAAO,SAAS,CAAC,EAChC,UAAU,GAAG,oBAAoB,GAAG,mBAAmB,CACxD,CACF,CAAC;AAqEF,eAAO,MAAM,WAAW;IA5FpB;;OAEG;;WAEI,MAAM;IACb;;OAEG;;IAEH;;OAEG;;;IAGH;;OAEG;;aAEM,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI;sMAyOlD,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { ComponentProps, useCallback } from "react";
|
|
1
|
+
import React, { ComponentProps, useCallback, useEffect, useRef } from "react";
|
|
2
2
|
import {
|
|
3
3
|
GestureResponderEvent,
|
|
4
4
|
Pressable,
|
|
@@ -186,6 +186,17 @@ export const ButtonSolid = React.forwardRef<View, ButtonSolidProps>(
|
|
|
186
186
|
[isExperimental]
|
|
187
187
|
);
|
|
188
188
|
|
|
189
|
+
/* Prevent the component from triggering the `isEntering' transition
|
|
190
|
+
on the on the first render. Solution from this discussion:
|
|
191
|
+
https://github.com/software-mansion/react-native-reanimated/discussions/2513
|
|
192
|
+
*/
|
|
193
|
+
const isMounted = useRef(false);
|
|
194
|
+
|
|
195
|
+
useEffect(() => {
|
|
196
|
+
// eslint-disable-next-line functional/immutable-data
|
|
197
|
+
isMounted.current = true;
|
|
198
|
+
}, []);
|
|
199
|
+
|
|
189
200
|
// Interpolate animation values from `isPressed` values
|
|
190
201
|
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
191
202
|
// Link color states to the pressed states
|
|
@@ -255,7 +266,9 @@ export const ButtonSolid = React.forwardRef<View, ButtonSolidProps>(
|
|
|
255
266
|
{loading && (
|
|
256
267
|
<Animated.View
|
|
257
268
|
style={buttonStyles.buttonInner}
|
|
258
|
-
entering={
|
|
269
|
+
entering={
|
|
270
|
+
isMounted.current ? enterTransitionInnerContentSmall : undefined
|
|
271
|
+
}
|
|
259
272
|
exiting={exitTransitionInnerContent}
|
|
260
273
|
>
|
|
261
274
|
<LoadingSpinner color={foregroundColor} />
|
|
@@ -271,7 +284,9 @@ export const ButtonSolid = React.forwardRef<View, ButtonSolidProps>(
|
|
|
271
284
|
reverse flex property to invert the position */
|
|
272
285
|
iconPosition === "end" && { flexDirection: "row-reverse" }
|
|
273
286
|
]}
|
|
274
|
-
entering={
|
|
287
|
+
entering={
|
|
288
|
+
isMounted.current ? enterTransitionInnerContent : undefined
|
|
289
|
+
}
|
|
275
290
|
>
|
|
276
291
|
{icon && (
|
|
277
292
|
<Icon
|
|
@@ -300,7 +300,6 @@ exports[`Test Buttons Components - Experimental Enabled ButtonSolid Snapshot 1`]
|
|
|
300
300
|
}
|
|
301
301
|
>
|
|
302
302
|
<View
|
|
303
|
-
entering={[Function]}
|
|
304
303
|
style={
|
|
305
304
|
[
|
|
306
305
|
{
|
|
@@ -1038,7 +1037,6 @@ exports[`Test Buttons Components ButtonSolid Snapshot 1`] = `
|
|
|
1038
1037
|
}
|
|
1039
1038
|
>
|
|
1040
1039
|
<View
|
|
1041
|
-
entering={[Function]}
|
|
1042
1040
|
style={
|
|
1043
1041
|
[
|
|
1044
1042
|
{
|