@pagopa/io-app-design-system 4.2.1 → 4.3.1
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/alert/Alert.js +10 -31
- package/lib/commonjs/components/alert/Alert.js.map +1 -1
- package/lib/commonjs/components/alert/AlertEdgeToEdge.js +9 -29
- package/lib/commonjs/components/alert/AlertEdgeToEdge.js.map +1 -1
- package/lib/commonjs/components/banner/Banner.js +10 -34
- package/lib/commonjs/components/banner/Banner.js.map +1 -1
- package/lib/commonjs/components/buttons/ButtonLink.js +20 -53
- package/lib/commonjs/components/buttons/ButtonLink.js.map +1 -1
- package/lib/commonjs/components/buttons/ButtonOutline.js +24 -44
- package/lib/commonjs/components/buttons/ButtonOutline.js.map +1 -1
- package/lib/commonjs/components/buttons/ButtonSolid.js +14 -39
- package/lib/commonjs/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButton.js +13 -32
- package/lib/commonjs/components/buttons/IconButton.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButtonContained.js +19 -42
- package/lib/commonjs/components/buttons/IconButtonContained.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButtonSolid.js +15 -31
- package/lib/commonjs/components/buttons/IconButtonSolid.js.map +1 -1
- package/lib/commonjs/components/buttons/__test__/__snapshots__/button.test.tsx.snap +34 -10
- package/lib/commonjs/components/layout/index.js +0 -11
- package/lib/commonjs/components/layout/index.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemAction.js +14 -40
- package/lib/commonjs/components/listitems/ListItemAction.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemCheckbox.js +13 -41
- package/lib/commonjs/components/listitems/ListItemCheckbox.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemHeader.js +2 -2
- package/lib/commonjs/components/listitems/ListItemHeader.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemInfoCopy.js +15 -43
- package/lib/commonjs/components/listitems/ListItemInfoCopy.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemNav.js +17 -48
- package/lib/commonjs/components/listitems/ListItemNav.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemNavAlert.js +19 -50
- package/lib/commonjs/components/listitems/ListItemNavAlert.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemRadio.js +20 -50
- package/lib/commonjs/components/listitems/ListItemRadio.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemRadioWithAmount.js +2 -2
- package/lib/commonjs/components/listitems/ListItemRadioWithAmount.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemTransaction.js +2 -2
- package/lib/commonjs/components/listitems/ListItemTransaction.js.map +1 -1
- package/lib/commonjs/components/listitems/{PressableListItemsBase.js → PressableListItemBase.js} +7 -7
- package/lib/commonjs/components/listitems/PressableListItemBase.js.map +1 -0
- package/lib/commonjs/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +13 -7
- package/lib/commonjs/components/listitems/__test__/listitem.test.js +3 -3
- package/lib/commonjs/components/listitems/__test__/listitem.test.js.map +1 -1
- package/lib/commonjs/components/listitems/index.js +11 -11
- package/lib/commonjs/components/listitems/index.js.map +1 -1
- package/lib/commonjs/components/modules/PressableModuleBase.js +17 -11
- package/lib/commonjs/components/modules/PressableModuleBase.js.map +1 -1
- package/lib/commonjs/components/modules/index.js +8 -8
- package/lib/commonjs/components/modules/index.js.map +1 -1
- package/lib/commonjs/components/numberpad/NumberButton.js +12 -28
- package/lib/commonjs/components/numberpad/NumberButton.js.map +1 -1
- package/lib/commonjs/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +20 -0
- package/lib/commonjs/components/otpInput/OTPInput.js +2 -1
- package/lib/commonjs/components/otpInput/OTPInput.js.map +1 -1
- package/lib/commonjs/components/tabs/TabItem.js +15 -21
- package/lib/commonjs/components/tabs/TabItem.js.map +1 -1
- package/lib/commonjs/core/IOAnimations.js +6 -12
- package/lib/commonjs/core/IOAnimations.js.map +1 -1
- package/lib/commonjs/hooks/index.js +28 -0
- package/lib/commonjs/hooks/index.js.map +1 -0
- package/lib/commonjs/hooks/useListItemAnimation.js +40 -0
- package/lib/commonjs/hooks/useListItemAnimation.js.map +1 -0
- package/lib/commonjs/hooks/useScaleAnimation.js +36 -0
- package/lib/commonjs/hooks/useScaleAnimation.js.map +1 -0
- package/lib/commonjs/index.js +11 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/utils/hooks/index.js +28 -0
- package/lib/commonjs/utils/hooks/index.js.map +1 -0
- package/lib/commonjs/utils/hooks/useSpringPressProgressValue.js +5 -7
- package/lib/commonjs/utils/hooks/useSpringPressProgressValue.js.map +1 -1
- package/lib/module/components/alert/Alert.js +10 -32
- package/lib/module/components/alert/Alert.js.map +1 -1
- package/lib/module/components/alert/AlertEdgeToEdge.js +10 -31
- package/lib/module/components/alert/AlertEdgeToEdge.js.map +1 -1
- package/lib/module/components/banner/Banner.js +10 -33
- package/lib/module/components/banner/Banner.js.map +1 -1
- package/lib/module/components/buttons/ButtonLink.js +23 -56
- package/lib/module/components/buttons/ButtonLink.js.map +1 -1
- package/lib/module/components/buttons/ButtonOutline.js +27 -47
- package/lib/module/components/buttons/ButtonOutline.js.map +1 -1
- package/lib/module/components/buttons/ButtonSolid.js +17 -42
- package/lib/module/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/module/components/buttons/IconButton.js +16 -35
- package/lib/module/components/buttons/IconButton.js.map +1 -1
- package/lib/module/components/buttons/IconButtonContained.js +21 -45
- package/lib/module/components/buttons/IconButtonContained.js.map +1 -1
- package/lib/module/components/buttons/IconButtonSolid.js +17 -34
- package/lib/module/components/buttons/IconButtonSolid.js.map +1 -1
- package/lib/module/components/buttons/__test__/__snapshots__/button.test.tsx.snap +34 -10
- package/lib/module/components/layout/index.js +0 -1
- package/lib/module/components/layout/index.js.map +1 -1
- package/lib/module/components/listitems/ListItemAction.js +15 -42
- package/lib/module/components/listitems/ListItemAction.js.map +1 -1
- package/lib/module/components/listitems/ListItemCheckbox.js +15 -43
- package/lib/module/components/listitems/ListItemCheckbox.js.map +1 -1
- package/lib/module/components/listitems/ListItemHeader.js +2 -2
- package/lib/module/components/listitems/ListItemHeader.js.map +1 -1
- package/lib/module/components/listitems/ListItemInfoCopy.js +16 -45
- package/lib/module/components/listitems/ListItemInfoCopy.js.map +1 -1
- package/lib/module/components/listitems/ListItemNav.js +17 -47
- package/lib/module/components/listitems/ListItemNav.js.map +1 -1
- package/lib/module/components/listitems/ListItemNavAlert.js +19 -49
- package/lib/module/components/listitems/ListItemNavAlert.js.map +1 -1
- package/lib/module/components/listitems/ListItemRadio.js +22 -52
- package/lib/module/components/listitems/ListItemRadio.js.map +1 -1
- package/lib/module/components/listitems/ListItemRadioWithAmount.js +1 -1
- package/lib/module/components/listitems/ListItemRadioWithAmount.js.map +1 -1
- package/lib/module/components/listitems/ListItemTransaction.js +1 -1
- package/lib/module/components/listitems/ListItemTransaction.js.map +1 -1
- package/lib/module/components/listitems/{PressableListItemsBase.js → PressableListItemBase.js} +7 -7
- package/lib/module/components/listitems/PressableListItemBase.js.map +1 -0
- package/lib/module/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +13 -7
- package/lib/module/components/listitems/__test__/listitem.test.js +1 -1
- package/lib/module/components/listitems/__test__/listitem.test.js.map +1 -1
- package/lib/module/components/listitems/index.js +1 -1
- package/lib/module/components/listitems/index.js.map +1 -1
- package/lib/module/components/modules/PressableModuleBase.js +17 -10
- package/lib/module/components/modules/PressableModuleBase.js.map +1 -1
- package/lib/module/components/modules/index.js +1 -1
- package/lib/module/components/modules/index.js.map +1 -1
- package/lib/module/components/numberpad/NumberButton.js +14 -30
- package/lib/module/components/numberpad/NumberButton.js.map +1 -1
- package/lib/module/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +20 -0
- package/lib/module/components/otpInput/OTPInput.js +2 -1
- package/lib/module/components/otpInput/OTPInput.js.map +1 -1
- package/lib/module/components/tabs/TabItem.js +18 -24
- package/lib/module/components/tabs/TabItem.js.map +1 -1
- package/lib/module/core/IOAnimations.js +4 -10
- package/lib/module/core/IOAnimations.js.map +1 -1
- package/lib/module/hooks/index.js +3 -0
- package/lib/module/hooks/index.js.map +1 -0
- package/lib/module/hooks/useListItemAnimation.js +33 -0
- package/lib/module/hooks/useListItemAnimation.js.map +1 -0
- package/lib/module/hooks/useScaleAnimation.js +29 -0
- package/lib/module/hooks/useScaleAnimation.js.map +1 -0
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/utils/hooks/index.js +3 -0
- package/lib/module/utils/hooks/index.js.map +1 -0
- package/lib/module/utils/hooks/useSpringPressProgressValue.js +5 -5
- package/lib/module/utils/hooks/useSpringPressProgressValue.js.map +1 -1
- package/lib/typescript/components/alert/Alert.d.ts.map +1 -1
- package/lib/typescript/components/alert/AlertEdgeToEdge.d.ts.map +1 -1
- package/lib/typescript/components/banner/Banner.d.ts.map +1 -1
- package/lib/typescript/components/buttons/ButtonLink.d.ts.map +1 -1
- package/lib/typescript/components/buttons/ButtonOutline.d.ts.map +1 -1
- package/lib/typescript/components/buttons/ButtonSolid.d.ts.map +1 -1
- package/lib/typescript/components/buttons/IconButton.d.ts.map +1 -1
- package/lib/typescript/components/buttons/IconButtonContained.d.ts.map +1 -1
- package/lib/typescript/components/buttons/IconButtonSolid.d.ts.map +1 -1
- package/lib/typescript/components/layout/index.d.ts +0 -1
- package/lib/typescript/components/layout/index.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemAction.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemCheckbox.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemInfoCopy.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemNav.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemNavAlert.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemRadio.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemRadioWithAmount.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemTransaction.d.ts +1 -1
- package/lib/typescript/components/listitems/ListItemTransaction.d.ts.map +1 -1
- package/lib/typescript/components/listitems/{PressableListItemsBase.d.ts → PressableListItemBase.d.ts} +3 -2
- package/lib/typescript/components/listitems/PressableListItemBase.d.ts.map +1 -0
- package/lib/typescript/components/listitems/index.d.ts +1 -1
- package/lib/typescript/components/listitems/index.d.ts.map +1 -1
- package/lib/typescript/components/modules/PressableModuleBase.d.ts.map +1 -1
- package/lib/typescript/components/modules/index.d.ts +1 -1
- package/lib/typescript/components/modules/index.d.ts.map +1 -1
- package/lib/typescript/components/numberpad/NumberButton.d.ts.map +1 -1
- package/lib/typescript/components/otpInput/OTPInput.d.ts.map +1 -1
- package/lib/typescript/components/tabs/TabItem.d.ts.map +1 -1
- package/lib/typescript/core/IOAnimations.d.ts +6 -10
- package/lib/typescript/core/IOAnimations.d.ts.map +1 -1
- package/lib/typescript/hooks/index.d.ts +3 -0
- package/lib/typescript/hooks/index.d.ts.map +1 -0
- package/lib/typescript/hooks/useListItemAnimation.d.ts +10 -0
- package/lib/typescript/hooks/useListItemAnimation.d.ts.map +1 -0
- package/lib/typescript/hooks/useScaleAnimation.d.ts +10 -0
- package/lib/typescript/hooks/useScaleAnimation.d.ts.map +1 -0
- package/lib/typescript/index.d.ts +1 -0
- package/lib/typescript/index.d.ts.map +1 -1
- package/lib/typescript/utils/hooks/index.d.ts +3 -0
- package/lib/typescript/utils/hooks/index.d.ts.map +1 -0
- package/lib/typescript/utils/hooks/useSpringPressProgressValue.d.ts +7 -8
- package/lib/typescript/utils/hooks/useSpringPressProgressValue.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/alert/Alert.tsx +7 -46
- package/src/components/alert/AlertEdgeToEdge.tsx +6 -46
- package/src/components/banner/Banner.tsx +6 -52
- package/src/components/buttons/ButtonLink.tsx +32 -89
- package/src/components/buttons/ButtonOutline.tsx +26 -60
- package/src/components/buttons/ButtonSolid.tsx +11 -58
- package/src/components/buttons/IconButton.tsx +10 -47
- package/src/components/buttons/IconButtonContained.tsx +21 -57
- package/src/components/buttons/IconButtonSolid.tsx +15 -46
- package/src/components/buttons/__test__/__snapshots__/button.test.tsx.snap +34 -10
- package/src/components/layout/index.tsx +0 -1
- package/src/components/listitems/ListItemAction.tsx +10 -66
- package/src/components/listitems/ListItemCheckbox.tsx +10 -68
- package/src/components/listitems/ListItemHeader.tsx +2 -2
- package/src/components/listitems/ListItemInfoCopy.tsx +11 -71
- package/src/components/listitems/ListItemNav.tsx +13 -74
- package/src/components/listitems/ListItemNavAlert.tsx +18 -92
- package/src/components/listitems/ListItemRadio.tsx +14 -75
- package/src/components/listitems/ListItemRadioWithAmount.tsx +2 -1
- package/src/components/listitems/ListItemTransaction.tsx +1 -1
- package/src/components/listitems/{PressableListItemsBase.tsx → PressableListItemBase.tsx} +7 -6
- package/src/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +13 -7
- package/src/components/listitems/__test__/listitem.test.tsx +1 -1
- package/src/components/listitems/index.tsx +1 -1
- package/src/components/modules/PressableModuleBase.tsx +15 -8
- package/src/components/modules/index.tsx +1 -1
- package/src/components/numberpad/NumberButton.tsx +12 -43
- package/src/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +20 -0
- package/src/components/otpInput/OTPInput.tsx +1 -0
- package/src/components/tabs/TabItem.tsx +15 -29
- package/src/core/IOAnimations.ts +8 -10
- package/src/hooks/index.tsx +2 -0
- package/src/hooks/useListItemAnimation.tsx +59 -0
- package/src/hooks/useScaleAnimation.tsx +41 -0
- package/src/index.tsx +1 -0
- package/src/utils/hooks/index.tsx +2 -0
- package/src/utils/hooks/useSpringPressProgressValue.ts +14 -8
- package/lib/commonjs/components/layout/FooterWithButtons.js +0 -84
- package/lib/commonjs/components/layout/FooterWithButtons.js.map +0 -1
- package/lib/commonjs/components/listitems/PressableListItemsBase.js.map +0 -1
- package/lib/commonjs/components/listitems/hooks/useListItemSpringAnimation.js +0 -56
- package/lib/commonjs/components/listitems/hooks/useListItemSpringAnimation.js.map +0 -1
- package/lib/commonjs/components/modules/hooks/useModuleSpringAnimation.js +0 -41
- package/lib/commonjs/components/modules/hooks/useModuleSpringAnimation.js.map +0 -1
- package/lib/module/components/layout/FooterWithButtons.js +0 -75
- package/lib/module/components/layout/FooterWithButtons.js.map +0 -1
- package/lib/module/components/listitems/PressableListItemsBase.js.map +0 -1
- package/lib/module/components/listitems/hooks/useListItemSpringAnimation.js +0 -47
- package/lib/module/components/listitems/hooks/useListItemSpringAnimation.js.map +0 -1
- package/lib/module/components/modules/hooks/useModuleSpringAnimation.js +0 -34
- package/lib/module/components/modules/hooks/useModuleSpringAnimation.js.map +0 -1
- package/lib/typescript/components/layout/FooterWithButtons.d.ts +0 -16
- package/lib/typescript/components/layout/FooterWithButtons.d.ts.map +0 -1
- package/lib/typescript/components/listitems/PressableListItemsBase.d.ts.map +0 -1
- package/lib/typescript/components/listitems/hooks/useListItemSpringAnimation.d.ts +0 -13
- package/lib/typescript/components/listitems/hooks/useListItemSpringAnimation.d.ts.map +0 -1
- package/lib/typescript/components/modules/hooks/useModuleSpringAnimation.d.ts +0 -10
- package/lib/typescript/components/modules/hooks/useModuleSpringAnimation.d.ts.map +0 -1
- package/src/components/layout/FooterWithButtons.tsx +0 -90
- package/src/components/listitems/hooks/useListItemSpringAnimation.ts +0 -72
- package/src/components/modules/hooks/useModuleSpringAnimation.ts +0 -49
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNativeReanimated","_core","useSpringPressProgressValue","springValue","isPressed","useSharedValue","progress","useDerivedValue","withSpring","value","IOSpringValues","onPressIn","useCallback","onPressOut","exports"],"sourceRoot":"../../../../src","sources":["utils/hooks/useSpringPressProgressValue.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,sBAAA,GAAAD,OAAA;AAMA,IAAAE,KAAA,GAAAF,OAAA;AAEO,MAAMG,2BAA2B,GAAGA,CACzCC,WAA2B,GAAG,QAAQ,KAKnC;EACH,MAAMC,SAA8B,GAAG,IAAAC,qCAAc,EAAC,CAAC,CAAC;EAExD,MAAMC,QAAQ,GAAG,IAAAC,sCAAe,EAAC,MAC/B,IAAAC,iCAAU,EAACJ,SAAS,CAACK,KAAK,EAAEC,oBAAc,CAACP,WAAW,CAAC,CACzD,CAAC;EAED,MAAMQ,SAAS,GAAG,IAAAC,kBAAW,EAAC,MAAM;IAClC;IACAR,SAAS,CAACK,KAAK,GAAG,CAAC;EACrB,CAAC,EAAE,CAACL,SAAS,CAAC,CAAC;EACf,MAAMS,UAAU,GAAG,IAAAD,kBAAW,EAAC,MAAM;IACnC;IACAR,SAAS,CAACK,KAAK,GAAG,CAAC;EACrB,CAAC,EAAE,CAACL,SAAS,CAAC,CAAC;EAEf,OAAO;IAAEO,SAAS;IAAEE,UAAU;IAAEP;EAAS,CAAC;AAC5C,CAAC;AAACQ,OAAA,CAAAZ,2BAAA,GAAAA,2BAAA"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import React, { useCallback, useState } from "react";
|
|
1
|
+
import React, { forwardRef, useCallback, useState } from "react";
|
|
2
2
|
import { PixelRatio, Pressable, StyleSheet, View } from "react-native";
|
|
3
|
-
import Animated
|
|
3
|
+
import Animated from "react-native-reanimated";
|
|
4
4
|
import { IOVisualCostants, useIOThemeContext } from "../../core";
|
|
5
|
-
import { IOScaleValues, IOSpringValues } from "../../core/IOAnimations";
|
|
6
5
|
import { IOColors, hexToRgba } from "../../core/IOColors";
|
|
7
6
|
import { IOAlertRadius } from "../../core/IOShapes";
|
|
8
7
|
import { IOAlertSpacing } from "../../core/IOSpacing";
|
|
8
|
+
import { useScaleAnimation } from "../../hooks";
|
|
9
9
|
import { Icon } from "../icons";
|
|
10
10
|
import { VSpacer } from "../spacer";
|
|
11
11
|
import { Body, ButtonText } from "../typography";
|
|
@@ -74,7 +74,7 @@ const mapVariantStatesDarkMode = {
|
|
|
74
74
|
foreground: "success-100"
|
|
75
75
|
}
|
|
76
76
|
};
|
|
77
|
-
export const Alert = /*#__PURE__*/
|
|
77
|
+
export const Alert = /*#__PURE__*/forwardRef(({
|
|
78
78
|
variant,
|
|
79
79
|
title,
|
|
80
80
|
content,
|
|
@@ -84,40 +84,18 @@ export const Alert = /*#__PURE__*/React.forwardRef(({
|
|
|
84
84
|
accessibilityHint,
|
|
85
85
|
testID
|
|
86
86
|
}, viewRef) => {
|
|
87
|
-
|
|
87
|
+
const {
|
|
88
|
+
onPressIn,
|
|
89
|
+
onPressOut,
|
|
90
|
+
scaleAnimatedStyle
|
|
91
|
+
} = useScaleAnimation("medium");
|
|
88
92
|
const {
|
|
89
93
|
themeType
|
|
90
94
|
} = useIOThemeContext();
|
|
91
|
-
const isPressed = useSharedValue(0);
|
|
92
95
|
const [isMultiline, setIsMultiline] = useState(false);
|
|
93
96
|
const onTextLayout = useCallback(event => {
|
|
94
97
|
setIsMultiline(event.nativeEvent.lines.length > 1);
|
|
95
98
|
}, []);
|
|
96
|
-
|
|
97
|
-
// Scaling transformation applied when the button is pressed
|
|
98
|
-
const animationScaleValue = IOScaleValues === null || IOScaleValues === void 0 || (_IOScaleValues$magnif = IOScaleValues.magnifiedButton) === null || _IOScaleValues$magnif === void 0 ? void 0 : _IOScaleValues$magnif.pressedState;
|
|
99
|
-
|
|
100
|
-
// Using a spring-based animation for our interpolations
|
|
101
|
-
const progressPressed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
|
|
102
|
-
|
|
103
|
-
// Interpolate animation values from `isPressed` values
|
|
104
|
-
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
105
|
-
// Scale down button slightly when pressed
|
|
106
|
-
const scale = interpolate(progressPressed.value, [0, 1], [1, animationScaleValue], Extrapolation.CLAMP);
|
|
107
|
-
return {
|
|
108
|
-
transform: [{
|
|
109
|
-
scale
|
|
110
|
-
}]
|
|
111
|
-
};
|
|
112
|
-
});
|
|
113
|
-
const onPressIn = useCallback(() => {
|
|
114
|
-
// eslint-disable-next-line functional/immutable-data
|
|
115
|
-
isPressed.value = 1;
|
|
116
|
-
}, [isPressed]);
|
|
117
|
-
const onPressOut = useCallback(() => {
|
|
118
|
-
// eslint-disable-next-line functional/immutable-data
|
|
119
|
-
isPressed.value = 0;
|
|
120
|
-
}, [isPressed]);
|
|
121
99
|
const mapVariantStates = themeType === "light" ? mapVariantStatesLightMode : mapVariantStatesDarkMode;
|
|
122
100
|
const renderMainBlock = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
|
|
123
101
|
style: {
|
|
@@ -179,7 +157,7 @@ export const Alert = /*#__PURE__*/React.forwardRef(({
|
|
|
179
157
|
backgroundColor: mapVariantStates[variant].background
|
|
180
158
|
},
|
|
181
159
|
// Disable pressed animation when component is full width
|
|
182
|
-
!fullWidth &&
|
|
160
|
+
!fullWidth && scaleAnimatedStyle]
|
|
183
161
|
}, renderMainBlock()));
|
|
184
162
|
return action ? /*#__PURE__*/React.createElement(PressableButton, null) : /*#__PURE__*/React.createElement(StaticComponent, null);
|
|
185
163
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","useState","PixelRatio","Pressable","StyleSheet","View","Animated","
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useCallback","useState","PixelRatio","Pressable","StyleSheet","View","Animated","IOVisualCostants","useIOThemeContext","IOColors","hexToRgba","IOAlertRadius","IOAlertSpacing","useScaleAnimation","Icon","VSpacer","Body","ButtonText","H4","iconSize","spacingDefault","spacingFullWidth","styles","create","container","flexDirection","alignItems","alignContent","padding","borderRadius","borderCurve","mapVariantStatesLightMode","error","icon","background","foreground","warning","info","success","bgOpacityDarkMode","mapVariantStatesDarkMode","Alert","variant","title","content","action","onPress","fullWidth","accessibilityHint","testID","viewRef","onPressIn","onPressOut","scaleAnimatedStyle","themeType","isMultiline","setIsMultiline","onTextLayout","event","nativeEvent","lines","length","mapVariantStates","renderMainBlock","createElement","Fragment","style","marginRight","iconMargin","alignSelf","name","size","color","marginTop","getFontScale","marginBottom","flex","weight","accessibilityRole","numberOfLines","ellipsizeMode","StaticComponent","ref","backgroundColor","accessible","PressableButton","onTouchEnd"],"sourceRoot":"../../../../src","sources":["components/alert/Alert.tsx"],"mappings":"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"}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useMemo } from "react";
|
|
2
2
|
import { Pressable, StyleSheet, Text, View } from "react-native";
|
|
3
|
-
import Animated
|
|
3
|
+
import Animated from "react-native-reanimated";
|
|
4
4
|
import { useSafeAreaInsets } from "react-native-safe-area-context";
|
|
5
|
-
import {
|
|
5
|
+
import { IOVisualCostants, enterTransitionAlertEdgeToEdge, enterTransitionAlertEdgeToEdgeContent, exitTransitionAlertEdgeToEdge } from "../../core";
|
|
6
6
|
import { IOColors } from "../../core/IOColors";
|
|
7
7
|
import { IOAlertSpacing } from "../../core/IOSpacing";
|
|
8
8
|
import { IOStyles } from "../../core/IOStyles";
|
|
9
|
+
import { useScaleAnimation } from "../../hooks";
|
|
9
10
|
import { makeFontStyleObject } from "../../utils/fonts";
|
|
10
11
|
import { Icon } from "../icons";
|
|
11
12
|
import { Body } from "../typography";
|
|
@@ -46,34 +47,12 @@ export const AlertEdgeToEdge = ({
|
|
|
46
47
|
accessibilityHint,
|
|
47
48
|
testID
|
|
48
49
|
}) => {
|
|
49
|
-
|
|
50
|
-
|
|
50
|
+
const {
|
|
51
|
+
onPressIn,
|
|
52
|
+
onPressOut,
|
|
53
|
+
scaleAnimatedStyle
|
|
54
|
+
} = useScaleAnimation("slight");
|
|
51
55
|
const insets = useSafeAreaInsets();
|
|
52
|
-
|
|
53
|
-
// Scaling transformation applied when the button is pressed
|
|
54
|
-
const animationScaleValue = IOScaleValues === null || IOScaleValues === void 0 || (_IOScaleValues$basicB = IOScaleValues.basicButton) === null || _IOScaleValues$basicB === void 0 ? void 0 : _IOScaleValues$basicB.pressedState;
|
|
55
|
-
|
|
56
|
-
// Using a spring-based animation for our interpolations
|
|
57
|
-
const progressPressed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
|
|
58
|
-
|
|
59
|
-
// Interpolate animation values from `isPressed` values
|
|
60
|
-
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
61
|
-
// Scale down button slightly when pressed
|
|
62
|
-
const scale = interpolate(progressPressed.value, [0, 1], [1, animationScaleValue], Extrapolate.CLAMP);
|
|
63
|
-
return {
|
|
64
|
-
transform: [{
|
|
65
|
-
scale
|
|
66
|
-
}]
|
|
67
|
-
};
|
|
68
|
-
});
|
|
69
|
-
const onPressIn = useCallback(() => {
|
|
70
|
-
// eslint-disable-next-line functional/immutable-data
|
|
71
|
-
isPressed.value = 1;
|
|
72
|
-
}, [isPressed]);
|
|
73
|
-
const onPressOut = useCallback(() => {
|
|
74
|
-
// eslint-disable-next-line functional/immutable-data
|
|
75
|
-
isPressed.value = 0;
|
|
76
|
-
}, [isPressed]);
|
|
77
56
|
const backgroundColor = useMemo(() => IOColors[mapVariantStates[variant].background], [variant]);
|
|
78
57
|
const renderMainBlock = () => /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
|
|
79
58
|
style: {
|
|
@@ -109,7 +88,7 @@ export const AlertEdgeToEdge = ({
|
|
|
109
88
|
accessibilityRole: "button"
|
|
110
89
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
111
90
|
entering: enterTransitionAlertEdgeToEdgeContent,
|
|
112
|
-
style: [styles.alert,
|
|
91
|
+
style: [styles.alert, scaleAnimatedStyle]
|
|
113
92
|
}, renderMainBlock()));
|
|
114
93
|
const StaticComponent = () => /*#__PURE__*/React.createElement(Animated.View, {
|
|
115
94
|
entering: enterTransitionAlertEdgeToEdgeContent,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","useMemo","Pressable","StyleSheet","Text","View","Animated","useSafeAreaInsets","IOVisualCostants","enterTransitionAlertEdgeToEdge","enterTransitionAlertEdgeToEdgeContent","exitTransitionAlertEdgeToEdge","IOColors","IOAlertSpacing","IOStyles","useScaleAnimation","makeFontStyleObject","Icon","Body","iconSize","spacingDefault","styles","create","alert","flexDirection","alignItems","alignContent","padding","mapVariantStates","error","icon","background","foreground","warning","info","AlertEdgeToEdge","variant","content","action","onPress","accessibilityHint","testID","onPressIn","onPressOut","scaleAnimatedStyle","insets","backgroundColor","renderMainBlock","createElement","Fragment","style","marginRight","iconMargin","alignSelf","name","size","color","flex","weight","accessibilityRole","undefined","PressableButton","onTouchEnd","accessible","entering","StaticComponent","exiting","paddingTop","top"],"sourceRoot":"../../../../src","sources":["components/alert/AlertEdgeToEdge.tsx"],"mappings":"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"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { Pressable, StyleSheet, View } from "react-native";
|
|
3
|
-
import Animated
|
|
4
|
-
import { IOBannerBigSpacing, IOBannerRadius, IOBannerSmallHSpacing, IOBannerSmallVSpacing,
|
|
3
|
+
import Animated from "react-native-reanimated";
|
|
4
|
+
import { IOBannerBigSpacing, IOBannerRadius, IOBannerSmallHSpacing, IOBannerSmallVSpacing, IOStyles, useIOExperimentalDesign, useIOTheme, useIOThemeContext } from "../../core";
|
|
5
5
|
import { hexToRgba, IOColors } from "../../core/IOColors";
|
|
6
|
+
import { useScaleAnimation } from "../../hooks";
|
|
6
7
|
import { IconButton } from "../buttons";
|
|
7
8
|
import { PictogramBleed } from "../pictograms";
|
|
8
9
|
import { VSpacer } from "../spacer";
|
|
@@ -72,8 +73,11 @@ export const Banner = ({
|
|
|
72
73
|
accessibilityLabel,
|
|
73
74
|
testID
|
|
74
75
|
}) => {
|
|
75
|
-
|
|
76
|
-
|
|
76
|
+
const {
|
|
77
|
+
onPressIn,
|
|
78
|
+
onPressOut,
|
|
79
|
+
scaleAnimatedStyle
|
|
80
|
+
} = useScaleAnimation("medium");
|
|
77
81
|
const {
|
|
78
82
|
isExperimental
|
|
79
83
|
} = useIOExperimentalDesign();
|
|
@@ -92,33 +96,6 @@ export const Banner = ({
|
|
|
92
96
|
paddingHorizontal: size === "big" ? sizeBigPadding : sizeSmallHPadding
|
|
93
97
|
};
|
|
94
98
|
|
|
95
|
-
// Scaling transformation applied when the button is pressed
|
|
96
|
-
const animationScaleValue = IOScaleValues === null || IOScaleValues === void 0 || (_IOScaleValues$magnif = IOScaleValues.magnifiedButton) === null || _IOScaleValues$magnif === void 0 ? void 0 : _IOScaleValues$magnif.pressedState;
|
|
97
|
-
|
|
98
|
-
// Using a spring-based animation for our interpolations
|
|
99
|
-
const progressPressed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
|
|
100
|
-
|
|
101
|
-
// Interpolate animation values from `isPressed` values
|
|
102
|
-
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
103
|
-
// Link color states to the pressed states
|
|
104
|
-
|
|
105
|
-
// Scale down button slightly when pressed
|
|
106
|
-
const scale = interpolate(progressPressed.value, [0, 1], [1, animationScaleValue], Extrapolation.CLAMP);
|
|
107
|
-
return {
|
|
108
|
-
transform: [{
|
|
109
|
-
scale
|
|
110
|
-
}]
|
|
111
|
-
};
|
|
112
|
-
});
|
|
113
|
-
const onPressIn = useCallback(() => {
|
|
114
|
-
// eslint-disable-next-line functional/immutable-data
|
|
115
|
-
isPressed.value = 1;
|
|
116
|
-
}, [isPressed]);
|
|
117
|
-
const onPressOut = useCallback(() => {
|
|
118
|
-
// eslint-disable-next-line functional/immutable-data
|
|
119
|
-
isPressed.value = 0;
|
|
120
|
-
}, [isPressed]);
|
|
121
|
-
|
|
122
99
|
/* Generates a complete fallbackAccessibilityLabel by concatenating the title, content, and action
|
|
123
100
|
if they are present. */
|
|
124
101
|
const fallbackAccessibilityLabel = [title, content, action].filter(Boolean).join(" ");
|
|
@@ -185,7 +162,7 @@ export const Banner = ({
|
|
|
185
162
|
onPressOut: onPressOut,
|
|
186
163
|
accessible: false
|
|
187
164
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
188
|
-
style: [styles.container, dynamicContainerStyles,
|
|
165
|
+
style: [styles.container, dynamicContainerStyles, scaleAnimatedStyle]
|
|
189
166
|
}, renderMainBlock()));
|
|
190
167
|
const StaticComponent = () => /*#__PURE__*/React.createElement(View, {
|
|
191
168
|
ref: viewRef,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","Pressable","StyleSheet","View","Animated","IOBannerBigSpacing","IOBannerRadius","IOBannerSmallHSpacing","IOBannerSmallVSpacing","IOStyles","useIOExperimentalDesign","useIOTheme","useIOThemeContext","hexToRgba","IOColors","useScaleAnimation","IconButton","PictogramBleed","VSpacer","BodySmall","buttonTextFontSize","H6","IOText","sizePictogramBig","sizePictogramSmall","closeButtonDistanceFromEdge","closeButtonOpacity","sizeBigPadding","sizeSmallHPadding","sizeSmallVPadding","styles","create","container","flexDirection","alignItems","alignContent","borderRadius","borderCurve","bleedPictogram","marginRight","closeIconButton","position","right","top","opacity","bannerBackgroundColours","mapBackgroundColorLightMode","neutral","turquoise","mapBackgroundColorDarkMode","Banner","viewRef","size","color","pictogramName","title","content","action","labelClose","onPress","onClose","accessibilityHint","accessibilityLabel","testID","onPressIn","onPressOut","scaleAnimatedStyle","isExperimental","themeType","theme","colorTitle","colorCloseButton","colorMainButton","dynamicContainerStyles","backgroundColor","paddingVertical","paddingHorizontal","fallbackAccessibilityLabel","filter","Boolean","join","renderMainBlock","createElement","Fragment","style","flex","selfCenter","accessible","accessibilityRole","undefined","weight","pointerEvents","importantForAccessibility","accessibilityElementsHidden","font","numberOfLines","ellipsizeMode","name","icon","PressableButton","ref","StaticComponent"],"sourceRoot":"../../../../src","sources":["components/banner/Banner.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAGEC,SAAS,EACTC,UAAU,EACVC,IAAI,QAEC,cAAc;AACrB,OAAOC,QAAQ,MAAM,yBAAyB;AAC9C,SACEC,kBAAkB,EAClBC,cAAc,EACdC,qBAAqB,EACrBC,qBAAqB,EACrBC,QAAQ,EACRC,uBAAuB,EACvBC,UAAU,EACVC,iBAAiB,QACZ,YAAY;AACnB,SAASC,SAAS,EAAEC,QAAQ,QAAQ,qBAAqB;AACzD,SAASC,iBAAiB,QAAQ,aAAa;AAE/C,SAASC,UAAU,QAAQ,YAAY;AACvC,SAGEC,cAAc,QACT,eAAe;AACtB,SAASC,OAAO,QAAQ,WAAW;AACnC,SAASC,SAAS,EAAEC,kBAAkB,EAAEC,EAAE,EAAEC,MAAM,QAAQ,eAAe;;AAEzE;AACA,MAAMC,gBAAsC,GAAG,EAAE;AACjD,MAAMC,kBAAwC,GAAG,EAAE;AACnD,MAAMC,2BAAmC,GAAG,CAAC;AAC7C,MAAMC,kBAAkB,GAAG,GAAG;AAC9B,MAAMC,cAAc,GAAGtB,kBAAkB;AACzC,MAAMuB,iBAAiB,GAAGrB,qBAAqB;AAC/C,MAAMsB,iBAAiB,GAAGrB,qBAAqB;AAE/C,MAAMsB,MAAM,GAAG5B,UAAU,CAAC6B,MAAM,CAAC;EAC/BC,SAAS,EAAE;IACTC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,YAAY;IACxBC,YAAY,EAAE,QAAQ;IACtBC,YAAY,EAAE9B,cAAc;IAC5B+B,WAAW,EAAE;EACf,CAAC;EACDC,cAAc,EAAE;IACdC,WAAW,EAAE,CAACZ;EAChB,CAAC;EACDa,eAAe,EAAE;IACfC,QAAQ,EAAE,UAAU;IACpBC,KAAK,EAAEjB,2BAA2B;IAClCkB,GAAG,EAAElB,2BAA2B;IAChCmB,OAAO,EAAElB;EACX;AACF,CAAC,CAAC;;AAEF;;AAYA;;AAEA;;AAEA;;AAoBA;;AAgBA;AAEA;AACA;AACA,OAAO,MAAMmB,uBAAwD,GAAG,CACtE,SAAS,EACT,WAAW,CACZ;AAED,MAAMC,2BAGL,GAAG;EACFC,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE;AACb,CAAC;AAED,MAAMC,0BAGL,GAAG;EACFF,OAAO,EAAE,SAAS;EAClBC,SAAS,EAAE;AACb,CAAC;AAED,OAAO,MAAME,MAAM,GAAGA,CAAC;EACrBC,OAAO;EACPC,IAAI;EACJC,KAAK;EACLC,aAAa;EACbC,KAAK;EACLC,OAAO;EACPC,MAAM;EACNC,UAAU;EACVC,OAAO;EACPC,OAAO;EACPC,iBAAiB;EACjBC,kBAAkB;EAClBC;AACM,CAAC,KAAK;EACZ,MAAM;IAAEC,SAAS;IAAEC,UAAU;IAAEC;EAAmB,CAAC,GACjDnD,iBAAiB,CAAC,QAAQ,CAAC;EAE7B,MAAM;IAAEoD;EAAe,CAAC,GAAGzD,uBAAuB,CAAC,CAAC;EACpD,MAAM;IAAE0D;EAAU,CAAC,GAAGxD,iBAAiB,CAAC,CAAC;EACzC,MAAMyD,KAAK,GAAG1D,UAAU,CAAC,CAAC;;EAE1B;EACA,MAAM2D,UAAoB,GAAGF,SAAS,KAAK,MAAM,GAAG,SAAS,GAAG,YAAY;EAC5E,MAAMG,gBAAqC,GACzCH,SAAS,KAAK,MAAM,GAAG,UAAU,GAAG,SAAS;EAC/C,MAAMI,eAAe,GACnBJ,SAAS,KAAK,MAAM,GAAG,YAAY,GAAGC,KAAK,CAAC,yBAAyB,CAAC;EAExE,MAAMI,sBAAiC,GAAG;IACxCC,eAAe,EACbN,SAAS,KAAK,MAAM,GAChBvD,SAAS,CAACC,QAAQ,CAACmC,0BAA0B,CAACI,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC,GAC3DvC,QAAQ,CAACgC,2BAA2B,CAACO,KAAK,CAAC,CAAC;IAClDsB,eAAe,EAAEvB,IAAI,KAAK,KAAK,GAAGzB,cAAc,GAAGE,iBAAiB;IACpE+C,iBAAiB,EAAExB,IAAI,KAAK,KAAK,GAAGzB,cAAc,GAAGC;EACvD,CAAC;;EAED;AACF;EACE,MAAMiD,0BAA0B,GAAG,CAACtB,KAAK,EAAEC,OAAO,EAAEC,MAAM,CAAC,CACxDqB,MAAM,CAACC,OAAO,CAAC,CACfC,IAAI,CAAC,GAAG,CAAC;EAEZ,MAAMC,eAAe,GAAGA,CAAA,kBACtBjF,KAAA,CAAAkF,aAAA,CAAAlF,KAAA,CAAAmF,QAAA,qBACEnF,KAAA,CAAAkF,aAAA,CAAC/E,IAAI;IACHiF,KAAK,EAAE,CAAC3E,QAAQ,CAAC4E,IAAI,EAAE5E,QAAQ,CAAC6E,UAAU,CAAE;IAC5CC,UAAU,EAAE;IACZ;IAAA;IACAzB,kBAAkB,EAAEA,kBAAkB,IAAIe,0BAA2B;IACrEhB,iBAAiB,EAAEA,iBAAkB;IACrC2B,iBAAiB,EAAE/B,MAAM,KAAKgC,SAAS,GAAG,QAAQ,GAAGA;EAAU,GAE9DlC,KAAK,iBACJvD,KAAA,CAAAkF,aAAA,CAAAlF,KAAA,CAAAmF,QAAA,qBAGEnF,KAAA,CAAAkF,aAAA,CAAC7D,EAAE;IAACgC,KAAK,EAAEiB;EAAW,GAAEf,KAAU,CAAC,eACnCvD,KAAA,CAAAkF,aAAA,CAAChE,OAAO;IAACkC,IAAI,EAAE;EAAE,CAAE,CACnB,CACH,EACAI,OAAO,iBACNxD,KAAA,CAAAkF,aAAA,CAAAlF,KAAA,CAAAmF,QAAA,qBACEnF,KAAA,CAAAkF,aAAA,CAAC/D,SAAS;IAACkC,KAAK,EAAEgB,KAAK,CAAC,mBAAmB,CAAE;IAACqB,MAAM,EAAE;EAAU,GAC7DlC,OACQ,CAAC,EACXC,MAAM,iBAAIzD,KAAA,CAAAkF,aAAA,CAAChE,OAAO;IAACkC,IAAI,EAAE;EAAE,CAAE,CAC9B,CACH,EACAK,MAAM;EAAA;EACL;AACV;EACUzD,KAAA,CAAAkF,aAAA,CAAC/E,IAAI;IACHwF,aAAa,EAAC,MAAM;IACpBC,yBAAyB,EAAC,qBAAqB;IAC/CL,UAAU,EAAE,IAAK;IACjBM,2BAA2B;IAC3B/B,kBAAkB,EAAEL,MAAO;IAC3B+B,iBAAiB,EAAC;EAAQ,gBAE1BxF,KAAA,CAAAkF,aAAA,CAAChE,OAAO;IAACkC,IAAI,EAAE;EAAE,CAAE,CAAC,eACpBpD,KAAA,CAAAkF,aAAA,CAAC5D,MAAM;IACLwE,IAAI,EAAE3B,cAAc,GAAG,UAAU,GAAG,kBAAmB;IACvDuB,MAAM,EAAC,UAAU;IACjBrC,KAAK,EAAEmB,eAAgB;IACvBpB,IAAI,EAAEhC,kBAAmB;IACzB2E,aAAa,EAAE,CAAE;IACjBC,aAAa,EAAC;IACd;IAAA;IACAT,UAAU,EAAE,KAAM;IAClBK,yBAAyB,EAAC,qBAAqB;IAC/CC,2BAA2B,EAAE;EAAK,GAEjCpC,MACK,CACJ,CAEJ,CAAC,eACPzD,KAAA,CAAAkF,aAAA,CAAC/E,IAAI;IAACiF,KAAK,EAAE,CAACtD,MAAM,CAACQ,cAAc,EAAE7B,QAAQ,CAAC6E,UAAU;EAAE,gBACxDtF,KAAA,CAAAkF,aAAA,CAACjE,cAAc;IACbgF,IAAI,EAAE3C,aAAc;IACpBF,IAAI,EAAEA,IAAI,KAAK,KAAK,GAAG7B,gBAAgB,GAAGC;EAAmB,CAC9D,CACG,CAAC,EACNoC,OAAO,IAAIF,UAAU,iBACpB1D,KAAA,CAAAkF,aAAA,CAAC/E,IAAI;IAACiF,KAAK,EAAEtD,MAAM,CAACU;EAAgB,gBAClCxC,KAAA,CAAAkF,aAAA,CAAClE,UAAU;IACTkF,IAAI,EAAC,YAAY;IACjB7C,KAAK,EAAEkB,gBAAiB;IACxBZ,OAAO,EAAEC,OAAQ;IACjBE,kBAAkB,EAAEJ;EAAW,CAChC,CACG,CAER,CACH;EAED,MAAMyC,eAAe,GAAGA,CAAA,kBACtBnG,KAAA,CAAAkF,aAAA,CAACjF,SAAS;IACRmG,GAAG,EAAEjD,OAAQ;IACbY,MAAM,EAAEA,MAAO;IACfJ,OAAO,EAAEA,OAAQ;IACjBK,SAAS,EAAEA,SAAU;IACrBC,UAAU,EAAEA,UAAW;IACvBsB,UAAU,EAAE;EAAM,gBAElBvF,KAAA,CAAAkF,aAAA,CAAC9E,QAAQ,CAACD,IAAI;IACZiF,KAAK,EAAE,CAACtD,MAAM,CAACE,SAAS,EAAEyC,sBAAsB,EAAEP,kBAAkB;EAAE,GAErEe,eAAe,CAAC,CACJ,CACN,CACZ;EAED,MAAMoB,eAAe,GAAGA,CAAA,kBACtBrG,KAAA,CAAAkF,aAAA,CAAC/E,IAAI;IACHiG,GAAG,EAAEjD,OAAQ;IACbY,MAAM,EAAEA,MAAO;IACfqB,KAAK,EAAE,CAACtD,MAAM,CAACE,SAAS,EAAEyC,sBAAsB;IAChD;IAAA;IACAc,UAAU,EAAE,KAAM;IAClB1B,iBAAiB,EAAEA,iBAAkB;IACrCC,kBAAkB,EAAEA,kBAAmB;IACvC0B,iBAAiB,EAAE;EAAO,GAEzBP,eAAe,CAAC,CACb,CACP;EAED,OAAOxB,MAAM,gBAAGzD,KAAA,CAAAkF,aAAA,CAACiB,eAAe,MAAE,CAAC,gBAAGnG,KAAA,CAAAkF,aAAA,CAACmB,eAAe,MAAE,CAAC;AAC3D,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { forwardRef, useMemo } from "react";
|
|
2
2
|
import { Pressable } from "react-native";
|
|
3
|
-
import Animated, {
|
|
4
|
-
import { IOButtonStyles, IOColors,
|
|
3
|
+
import Animated, { interpolateColor, useAnimatedStyle, useReducedMotion } from "react-native-reanimated";
|
|
4
|
+
import { IOButtonStyles, IOColors, hexToRgba, useIOExperimentalDesign } from "../../core";
|
|
5
|
+
import { useScaleAnimation } from "../../hooks";
|
|
5
6
|
import { AnimatedIcon, IconClassComponent } from "../icons";
|
|
6
|
-
import { HSpacer } from "../spacer/Spacer";
|
|
7
7
|
import { IOText, buttonTextFontSize } from "../typography";
|
|
8
8
|
const mapColorStates = {
|
|
9
9
|
// Primary button
|
|
@@ -42,7 +42,7 @@ const mapLegacyColorStates = {
|
|
|
42
42
|
}
|
|
43
43
|
};
|
|
44
44
|
const DISABLED_OPACITY = 0.5;
|
|
45
|
-
export const ButtonLink = /*#__PURE__*/
|
|
45
|
+
export const ButtonLink = /*#__PURE__*/forwardRef(({
|
|
46
46
|
color = "primary",
|
|
47
47
|
label,
|
|
48
48
|
disabled = false,
|
|
@@ -53,60 +53,27 @@ export const ButtonLink = /*#__PURE__*/React.forwardRef(({
|
|
|
53
53
|
accessibilityHint,
|
|
54
54
|
testID
|
|
55
55
|
}, ref) => {
|
|
56
|
-
var
|
|
57
|
-
const isPressed = useSharedValue(0);
|
|
56
|
+
var _colorMap$color, _colorMap$color2, _colorMap$color3;
|
|
58
57
|
const {
|
|
59
58
|
isExperimental
|
|
60
59
|
} = useIOExperimentalDesign();
|
|
60
|
+
const {
|
|
61
|
+
progress,
|
|
62
|
+
onPressIn,
|
|
63
|
+
onPressOut,
|
|
64
|
+
scaleAnimatedStyle
|
|
65
|
+
} = useScaleAnimation();
|
|
66
|
+
const reducedMotion = useReducedMotion();
|
|
61
67
|
const colorMap = useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
62
68
|
const AnimatedIOText = Animated.createAnimatedComponent(IOText);
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
// Using a spring-based animation for our interpolations
|
|
68
|
-
const progressPressed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
|
|
69
|
-
|
|
70
|
-
// Interpolate animation values from `isPressed` values
|
|
71
|
-
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
72
|
-
// Link color states to the pressed states
|
|
73
|
-
|
|
74
|
-
// Scale down button slightly when pressed
|
|
75
|
-
const scale = interpolate(progressPressed.value, [0, 1], [1, animationScaleValue], Extrapolate.CLAMP);
|
|
76
|
-
return {
|
|
77
|
-
transform: [{
|
|
78
|
-
scale
|
|
79
|
-
}]
|
|
80
|
-
};
|
|
81
|
-
});
|
|
82
|
-
const pressedColorLabelAnimationStyle = useAnimatedStyle(() => {
|
|
83
|
-
// Link color states to the pressed states
|
|
84
|
-
|
|
85
|
-
const labelColor = interpolateColor(progressPressed.value, [0, 1], [colorMap[color].label.default, colorMap[color].label.pressed]);
|
|
86
|
-
return {
|
|
87
|
-
color: labelColor
|
|
88
|
-
};
|
|
89
|
-
});
|
|
90
|
-
|
|
91
|
-
// Animate the <Icon> color prop
|
|
92
|
-
const pressedColorIconAnimationStyle = useAnimatedProps(() => {
|
|
93
|
-
const iconColor = interpolateColor(progressPressed.value, [0, 1], [colorMap[color].label.default, colorMap[color].label.pressed]);
|
|
94
|
-
return {
|
|
95
|
-
color: iconColor
|
|
96
|
-
};
|
|
97
|
-
});
|
|
69
|
+
const pressedColorAnimationStyle = useAnimatedStyle(() => ({
|
|
70
|
+
color: interpolateColor(progress.value, [0, 1], [colorMap[color].label.default, colorMap[color].label.pressed])
|
|
71
|
+
}));
|
|
98
72
|
const AnimatedIconClassComponent = Animated.createAnimatedComponent(IconClassComponent);
|
|
99
|
-
const onPressIn = useCallback(() => {
|
|
100
|
-
// eslint-disable-next-line functional/immutable-data
|
|
101
|
-
isPressed.value = 1;
|
|
102
|
-
}, [isPressed]);
|
|
103
|
-
const onPressOut = useCallback(() => {
|
|
104
|
-
// eslint-disable-next-line functional/immutable-data
|
|
105
|
-
isPressed.value = 0;
|
|
106
|
-
}, [isPressed]);
|
|
107
73
|
|
|
108
74
|
// Icon size
|
|
109
75
|
const iconSize = 24;
|
|
76
|
+
const iconMargin = 8;
|
|
110
77
|
return /*#__PURE__*/React.createElement(Pressable, {
|
|
111
78
|
ref: ref,
|
|
112
79
|
accessibilityLabel: accessibilityLabel || label,
|
|
@@ -132,23 +99,23 @@ export const ButtonLink = /*#__PURE__*/React.forwardRef(({
|
|
|
132
99
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
133
100
|
style: [IOButtonStyles.buttonLink, iconPosition === "end" && {
|
|
134
101
|
flexDirection: "row-reverse"
|
|
102
|
+
}, {
|
|
103
|
+
columnGap: iconMargin
|
|
135
104
|
}, disabled ? {
|
|
136
105
|
opacity: DISABLED_OPACITY
|
|
137
106
|
} : {},
|
|
138
107
|
/* Prevent Reanimated from overriding background colors
|
|
139
108
|
if button is disabled */
|
|
140
|
-
!disabled &&
|
|
141
|
-
}, icon &&
|
|
109
|
+
!disabled && !reducedMotion && scaleAnimatedStyle]
|
|
110
|
+
}, icon && (!disabled ? /*#__PURE__*/React.createElement(AnimatedIconClassComponent, {
|
|
142
111
|
name: icon,
|
|
143
|
-
animatedProps:
|
|
112
|
+
animatedProps: pressedColorAnimationStyle,
|
|
144
113
|
color: (_colorMap$color = colorMap[color]) === null || _colorMap$color === void 0 || (_colorMap$color = _colorMap$color.label) === null || _colorMap$color === void 0 ? void 0 : _colorMap$color.default,
|
|
145
114
|
size: iconSize
|
|
146
115
|
}) : /*#__PURE__*/React.createElement(AnimatedIcon, {
|
|
147
116
|
name: icon,
|
|
148
117
|
color: (_colorMap$color2 = colorMap[color]) === null || _colorMap$color2 === void 0 || (_colorMap$color2 = _colorMap$color2.label) === null || _colorMap$color2 === void 0 ? void 0 : _colorMap$color2.disabled,
|
|
149
118
|
size: iconSize
|
|
150
|
-
}), /*#__PURE__*/React.createElement(HSpacer, {
|
|
151
|
-
size: 8
|
|
152
119
|
})), /*#__PURE__*/React.createElement(AnimatedIOText, {
|
|
153
120
|
accessible: false,
|
|
154
121
|
accessibilityElementsHidden: true,
|
|
@@ -159,7 +126,7 @@ export const ButtonLink = /*#__PURE__*/React.forwardRef(({
|
|
|
159
126
|
style: disabled ? {
|
|
160
127
|
color: (_colorMap$color3 = colorMap[color]) === null || _colorMap$color3 === void 0 || (_colorMap$color3 = _colorMap$color3.label) === null || _colorMap$color3 === void 0 ? void 0 : _colorMap$color3.disabled
|
|
161
128
|
} : {
|
|
162
|
-
...
|
|
129
|
+
...pressedColorAnimationStyle
|
|
163
130
|
},
|
|
164
131
|
numberOfLines: 1,
|
|
165
132
|
ellipsizeMode: "tail"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","forwardRef","useMemo","Pressable","Animated","interpolateColor","useAnimatedStyle","useReducedMotion","IOButtonStyles","IOColors","hexToRgba","useIOExperimentalDesign","useScaleAnimation","AnimatedIcon","IconClassComponent","IOText","buttonTextFontSize","mapColorStates","primary","label","default","pressed","disabled","contrast","white","mapLegacyColorStates","blue","DISABLED_OPACITY","ButtonLink","color","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_colorMap$color","_colorMap$color2","_colorMap$color3","isExperimental","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","colorMap","AnimatedIOText","createAnimatedComponent","pressedColorAnimationStyle","value","AnimatedIconClassComponent","iconSize","iconMargin","createElement","accessibilityRole","accessibilityState","onTouchEnd","accessible","hitSlop","top","right","bottom","left","style","dimensionsDefault","View","buttonLink","flexDirection","columnGap","opacity","name","animatedProps","size","accessibilityElementsHidden","importantForAccessibility","font","weight","numberOfLines","ellipsizeMode"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonLink.tsx"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,OAAO,QAAQ,OAAO;AAClD,SAAgCC,SAAS,QAAc,cAAc;AACrE,OAAOC,QAAQ,IACbC,gBAAgB,EAChBC,gBAAgB,EAChBC,gBAAgB,QACX,yBAAyB;AAChC,SACEC,cAAc,EACdC,QAAQ,EAERC,SAAS,EACTC,uBAAuB,QAClB,YAAY;AACnB,SAASC,iBAAiB,QAAQ,aAAa;AAE/C,SACEC,YAAY,EAGZC,kBAAkB,QACb,UAAU;AACjB,SAASC,MAAM,EAAEC,kBAAkB,QAAQ,eAAe;AA0B1D,MAAMC,cAGL,GAAG;EACF;EACAC,OAAO,EAAE;IACPC,KAAK,EAAE;MACLC,OAAO,EAAEX,QAAQ,CAAC,YAAY,CAAC;MAC/BY,OAAO,EAAEZ,QAAQ,CAAC,YAAY,CAAC;MAC/Ba,QAAQ,EAAEb,QAAQ,CAAC,UAAU;IAC/B;EACF,CAAC;EACDc,QAAQ,EAAE;IACRJ,KAAK,EAAE;MACLC,OAAO,EAAEX,QAAQ,CAACe,KAAK;MACvBH,OAAO,EAAEX,SAAS,CAACD,QAAQ,CAACe,KAAK,EAAE,IAAI,CAAC;MACxCF,QAAQ,EAAEZ,SAAS,CAACD,QAAQ,CAACe,KAAK,EAAE,GAAG;IACzC;EACF;AACF,CAAC;;AAED;AACA,MAAMC,oBAGL,GAAG;EACF;EACAP,OAAO,EAAE;IACPC,KAAK,EAAE;MACLC,OAAO,EAAEX,QAAQ,CAACiB,IAAI;MACtBL,OAAO,EAAEZ,QAAQ,CAAC,UAAU,CAAC;MAC7Ba,QAAQ,EAAEb,QAAQ,CAAC,UAAU;IAC/B;EACF,CAAC;EACDc,QAAQ,EAAE;IACRJ,KAAK,EAAE;MACLC,OAAO,EAAEX,QAAQ,CAACe,KAAK;MACvBH,OAAO,EAAEX,SAAS,CAACD,QAAQ,CAACe,KAAK,EAAE,IAAI,CAAC;MACxCF,QAAQ,EAAEZ,SAAS,CAACD,QAAQ,CAACe,KAAK,EAAE,GAAG;IACzC;EACF;AACF,CAAC;AAED,MAAMG,gBAAgB,GAAG,GAAG;AAE5B,OAAO,MAAMC,UAAU,gBAAG3B,UAAU,CAClC,CACE;EACE4B,KAAK,GAAG,SAAS;EACjBV,KAAK;EACLG,QAAQ,GAAG,KAAK;EAChBQ,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,GAAG7B,uBAAuB,CAAC,CAAC;EACpD,MAAM;IAAE8B,QAAQ;IAAEC,SAAS;IAAEC,UAAU;IAAEC;EAAmB,CAAC,GAC3DhC,iBAAiB,CAAC,CAAC;EACrB,MAAMiC,aAAa,GAAGtC,gBAAgB,CAAC,CAAC;EAExC,MAAMuC,QAAQ,GAAG5C,OAAO,CACtB,MAAOsC,cAAc,GAAGvB,cAAc,GAAGQ,oBAAqB,EAC9D,CAACe,cAAc,CACjB,CAAC;EAED,MAAMO,cAAc,GAAG3C,QAAQ,CAAC4C,uBAAuB,CAACjC,MAAM,CAAC;EAE/D,MAAMkC,0BAA0B,GAAG3C,gBAAgB,CAAC,OAAO;IACzDuB,KAAK,EAAExB,gBAAgB,CACrBoC,QAAQ,CAACS,KAAK,EACd,CAAC,CAAC,EAAE,CAAC,CAAC,EACN,CAACJ,QAAQ,CAACjB,KAAK,CAAC,CAACV,KAAK,CAACC,OAAO,EAAE0B,QAAQ,CAACjB,KAAK,CAAC,CAACV,KAAK,CAACE,OAAO,CAC/D;EACF,CAAC,CAAC,CAAC;EAEH,MAAM8B,0BAA0B,GAC9B/C,QAAQ,CAAC4C,uBAAuB,CAAClC,kBAAkB,CAAC;;EAEtD;EACA,MAAMsC,QAAyB,GAAG,EAAE;EACpC,MAAMC,UAA0B,GAAG,CAAC;EAEpC,oBACErD,KAAA,CAAAsD,aAAA,CAACnD,SAAS;IACRiC,GAAG,EAAEA,GAAI;IACTH,kBAAkB,EAAEA,kBAAkB,IAAId,KAAM;IAChDe,iBAAiB,EAAEA,iBAAkB;IACrCqB,iBAAiB,EAAE,QAAS;IAC5BC,kBAAkB,EAAE;MAAElC;IAAS,CAAE;IACjCa,MAAM,EAAEA,MAAO;IACfH,OAAO,EAAEA,OAAQ;IACjBU,SAAS,EAAEA,SAAU;IACrBC,UAAU,EAAEA,UAAW;IACvBc,UAAU,EAAEd,UAAW;IACvBe,UAAU,EAAE,IAAK;IACjBpC,QAAQ,EAAEA,QAAS;IACnBqC,OAAO,EAAE;MAAEC,GAAG,EAAE,EAAE;MAAEC,KAAK,EAAE,EAAE;MAAEC,MAAM,EAAE,EAAE;MAAEC,IAAI,EAAE;IAAG,CAAE;IACtDC,KAAK,EAAExD,cAAc,CAACyD;EAAkB,gBAExCjE,KAAA,CAAAsD,aAAA,CAAClD,QAAQ,CAAC8D,IAAI;IACZF,KAAK,EAAE,CACLxD,cAAc,CAAC2D,UAAU,EACzBpC,YAAY,KAAK,KAAK,IAAI;MAAEqC,aAAa,EAAE;IAAc,CAAC,EAC1D;MAAEC,SAAS,EAAEhB;IAAW,CAAC,EACzB/B,QAAQ,GAAG;MAAEgD,OAAO,EAAE3C;IAAiB,CAAC,GAAG,CAAC,CAAC;IAC7C;AACZ;IACY,CAACL,QAAQ,IAAI,CAACuB,aAAa,IAAID,kBAAkB;EACjD,GAEDd,IAAI,KACF,CAACR,QAAQ,gBACRtB,KAAA,CAAAsD,aAAA,CAACH,0BAA0B;IACzBoB,IAAI,EAAEzC,IAAK;IACX0C,aAAa,EAAEvB,0BAA2B;IAC1CpB,KAAK,GAAAQ,eAAA,GAAES,QAAQ,CAACjB,KAAK,CAAC,cAAAQ,eAAA,gBAAAA,eAAA,GAAfA,eAAA,CAAiBlB,KAAK,cAAAkB,eAAA,uBAAtBA,eAAA,CAAwBjB,OAAQ;IACvCqD,IAAI,EAAErB;EAAS,CAChB,CAAC,gBAEFpD,KAAA,CAAAsD,aAAA,CAACzC,YAAY;IACX0D,IAAI,EAAEzC,IAAK;IACXD,KAAK,GAAAS,gBAAA,GAAEQ,QAAQ,CAACjB,KAAK,CAAC,cAAAS,gBAAA,gBAAAA,gBAAA,GAAfA,gBAAA,CAAiBnB,KAAK,cAAAmB,gBAAA,uBAAtBA,gBAAA,CAAwBhB,QAAS;IACxCmD,IAAI,EAAErB;EAAS,CAChB,CACF,CAAC,eACJpD,KAAA,CAAAsD,aAAA,CAACP,cAAc;IACbW,UAAU,EAAE,KAAM;IAClBgB,2BAA2B;IAC3BC,yBAAyB,EAAC,qBAAqB;IAC/CC,IAAI,EAAEpC,cAAc,GAAG,UAAU,GAAG,kBAAmB;IACvDqC,MAAM,EAAE,UAAW;IACnBJ,IAAI,EAAEzD,kBAAmB;IACzBgD,KAAK,EACH1C,QAAQ,GACJ;MAAEO,KAAK,GAAAU,gBAAA,GAAEO,QAAQ,CAACjB,KAAK,CAAC,cAAAU,gBAAA,gBAAAA,gBAAA,GAAfA,gBAAA,CAAiBpB,KAAK,cAAAoB,gBAAA,uBAAtBA,gBAAA,CAAwBjB;IAAS,CAAC,GAC3C;MAAE,GAAG2B;IAA2B,CACrC;IACD6B,aAAa,EAAE,CAAE;IACjBC,aAAa,EAAC;EAAM,GAEnB5D,KACa,CACH,CACN,CAAC;AAEhB,CACF,CAAC;AAED,eAAeS,UAAU"}
|