@pagopa/io-app-design-system 4.4.2 → 5.0.0-0
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/Advice/__test__/__snapshots__/advice.test.tsx.snap +1 -1
- package/lib/commonjs/components/accordion/index.js +0 -11
- package/lib/commonjs/components/accordion/index.js.map +1 -1
- package/lib/commonjs/components/badge/Badge.js +4 -4
- package/lib/commonjs/components/badge/Badge.js.map +1 -1
- package/lib/commonjs/components/badge/__test__/__snapshots__/badge.test.tsx.snap +1 -1
- package/lib/commonjs/components/banner/Banner.js +4 -4
- package/lib/commonjs/components/banner/Banner.js.map +1 -1
- package/lib/commonjs/components/banner/__test__/__snapshots__/banner.test.tsx.snap +3 -3
- package/lib/commonjs/components/buttons/ButtonLink.js +25 -32
- package/lib/commonjs/components/buttons/ButtonLink.js.map +1 -1
- package/lib/commonjs/components/buttons/ButtonOutline.js +18 -86
- package/lib/commonjs/components/buttons/ButtonOutline.js.map +1 -1
- package/lib/commonjs/components/buttons/ButtonSolid.js +9 -53
- package/lib/commonjs/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButton.js +6 -36
- package/lib/commonjs/components/buttons/IconButton.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButtonContained.js +5 -50
- package/lib/commonjs/components/buttons/IconButtonContained.js.map +1 -1
- package/lib/commonjs/components/buttons/IconButtonSolid.js +5 -36
- package/lib/commonjs/components/buttons/IconButtonSolid.js.map +1 -1
- package/lib/commonjs/components/buttons/__test__/__snapshots__/button.test.tsx.snap +29 -27
- package/lib/commonjs/components/checkbox/AnimatedCheckbox.js +5 -15
- package/lib/commonjs/components/checkbox/AnimatedCheckbox.js.map +1 -1
- package/lib/commonjs/components/checkbox/AnimatedMessageCheckbox.js +2 -9
- package/lib/commonjs/components/checkbox/AnimatedMessageCheckbox.js.map +1 -1
- package/lib/commonjs/components/layout/FooterActions.js +1 -5
- package/lib/commonjs/components/layout/FooterActions.js.map +1 -1
- package/lib/commonjs/components/layout/HeaderSecondLevel.js +3 -3
- package/lib/commonjs/components/layout/HeaderSecondLevel.js.map +1 -1
- package/lib/commonjs/components/layout/ModalBSHeader.js +3 -15
- package/lib/commonjs/components/layout/ModalBSHeader.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemNavAlert.js +1 -4
- package/lib/commonjs/components/listitems/ListItemNavAlert.js.map +1 -1
- package/lib/commonjs/components/listitems/ListItemTransaction.js +1 -4
- package/lib/commonjs/components/listitems/ListItemTransaction.js.map +1 -1
- package/lib/commonjs/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +27 -27
- package/lib/commonjs/components/modules/ModuleIDP.js +4 -5
- package/lib/commonjs/components/modules/ModuleIDP.js.map +1 -1
- package/lib/commonjs/components/numberpad/NumberButton.js +3 -18
- package/lib/commonjs/components/numberpad/NumberButton.js.map +1 -1
- package/lib/commonjs/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +10 -10
- package/lib/commonjs/components/radio/AnimatedRadio.js +4 -14
- package/lib/commonjs/components/radio/AnimatedRadio.js.map +1 -1
- package/lib/commonjs/components/searchInput/SearchInput.js +6 -10
- package/lib/commonjs/components/searchInput/SearchInput.js.map +1 -1
- package/lib/commonjs/components/stepper/Stepper.js +1 -10
- package/lib/commonjs/components/stepper/Stepper.js.map +1 -1
- package/lib/commonjs/components/switch/NativeSwitch.js +2 -15
- package/lib/commonjs/components/switch/NativeSwitch.js.map +1 -1
- package/lib/commonjs/components/tabs/TabItem.js +6 -46
- package/lib/commonjs/components/tabs/TabItem.js.map +1 -1
- package/lib/commonjs/components/tag/Tag.js +4 -4
- package/lib/commonjs/components/tag/Tag.js.map +1 -1
- package/lib/commonjs/components/textInput/TextInputBase.js +10 -20
- package/lib/commonjs/components/textInput/TextInputBase.js.map +1 -1
- package/lib/commonjs/components/typography/Body.js +4 -6
- package/lib/commonjs/components/typography/Body.js.map +1 -1
- package/lib/commonjs/components/typography/BodySmall.js +3 -3
- package/lib/commonjs/components/typography/BodySmall.js.map +1 -1
- package/lib/commonjs/components/typography/ButtonText.js +6 -7
- package/lib/commonjs/components/typography/ButtonText.js.map +1 -1
- package/lib/commonjs/components/typography/Caption.js +6 -12
- package/lib/commonjs/components/typography/Caption.js.map +1 -1
- package/lib/commonjs/components/typography/H1.js +6 -13
- package/lib/commonjs/components/typography/H1.js.map +1 -1
- package/lib/commonjs/components/typography/H2.js +8 -17
- package/lib/commonjs/components/typography/H2.js.map +1 -1
- package/lib/commonjs/components/typography/H3.js +4 -8
- package/lib/commonjs/components/typography/H3.js.map +1 -1
- package/lib/commonjs/components/typography/H4.js +7 -14
- package/lib/commonjs/components/typography/H4.js.map +1 -1
- package/lib/commonjs/components/typography/H5.js +5 -10
- package/lib/commonjs/components/typography/H5.js.map +1 -1
- package/lib/commonjs/components/typography/H6.js +7 -10
- package/lib/commonjs/components/typography/H6.js.map +1 -1
- package/lib/commonjs/components/typography/Hero.js +8 -17
- package/lib/commonjs/components/typography/Hero.js.map +1 -1
- package/lib/commonjs/components/typography/LabelMini.js +4 -6
- package/lib/commonjs/components/typography/LabelMini.js.map +1 -1
- package/lib/commonjs/components/typography/__test__/__snapshots__/ComposedBodyFromArray.test.tsx.snap +42 -42
- package/lib/commonjs/components/typography/__test__/__snapshots__/typography.test.tsx.snap +26 -26
- package/lib/commonjs/components/typography/markdown/MdH1.js +3 -3
- package/lib/commonjs/components/typography/markdown/MdH1.js.map +1 -1
- package/lib/commonjs/components/typography/markdown/MdH2.js +3 -3
- package/lib/commonjs/components/typography/markdown/MdH2.js.map +1 -1
- package/lib/commonjs/components/typography/markdown/MdH3.js +3 -3
- package/lib/commonjs/components/typography/markdown/MdH3.js.map +1 -1
- package/lib/commonjs/core/IOColors.js +1 -8
- package/lib/commonjs/core/IOColors.js.map +1 -1
- package/lib/commonjs/core/IODSExperimentalContextProvider.js +4 -3
- package/lib/commonjs/core/IODSExperimentalContextProvider.js.map +1 -1
- package/lib/commonjs/core/IONewTypefaceContextProvider.js +33 -0
- package/lib/commonjs/core/IONewTypefaceContextProvider.js.map +1 -0
- package/lib/commonjs/core/IOStyles.js +1 -49
- package/lib/commonjs/core/IOStyles.js.map +1 -1
- package/lib/commonjs/core/IOThemeContextProvider.js +4 -15
- package/lib/commonjs/core/IOThemeContextProvider.js.map +1 -1
- package/lib/commonjs/core/index.js +11 -0
- package/lib/commonjs/core/index.js.map +1 -1
- package/lib/module/components/Advice/__test__/__snapshots__/advice.test.tsx.snap +1 -1
- package/lib/module/components/accordion/index.js +0 -1
- package/lib/module/components/accordion/index.js.map +1 -1
- package/lib/module/components/badge/Badge.js +5 -5
- package/lib/module/components/badge/Badge.js.map +1 -1
- package/lib/module/components/badge/__test__/__snapshots__/badge.test.tsx.snap +1 -1
- package/lib/module/components/banner/Banner.js +5 -5
- package/lib/module/components/banner/Banner.js.map +1 -1
- package/lib/module/components/banner/__test__/__snapshots__/banner.test.tsx.snap +3 -3
- package/lib/module/components/buttons/ButtonLink.js +28 -35
- package/lib/module/components/buttons/ButtonLink.js.map +1 -1
- package/lib/module/components/buttons/ButtonOutline.js +19 -87
- package/lib/module/components/buttons/ButtonOutline.js.map +1 -1
- package/lib/module/components/buttons/ButtonSolid.js +10 -54
- package/lib/module/components/buttons/ButtonSolid.js.map +1 -1
- package/lib/module/components/buttons/IconButton.js +6 -37
- package/lib/module/components/buttons/IconButton.js.map +1 -1
- package/lib/module/components/buttons/IconButtonContained.js +6 -51
- package/lib/module/components/buttons/IconButtonContained.js.map +1 -1
- package/lib/module/components/buttons/IconButtonSolid.js +6 -37
- package/lib/module/components/buttons/IconButtonSolid.js.map +1 -1
- package/lib/module/components/buttons/__test__/__snapshots__/button.test.tsx.snap +29 -27
- package/lib/module/components/checkbox/AnimatedCheckbox.js +6 -16
- package/lib/module/components/checkbox/AnimatedCheckbox.js.map +1 -1
- package/lib/module/components/checkbox/AnimatedMessageCheckbox.js +3 -10
- package/lib/module/components/checkbox/AnimatedMessageCheckbox.js.map +1 -1
- package/lib/module/components/layout/FooterActions.js +2 -6
- package/lib/module/components/layout/FooterActions.js.map +1 -1
- package/lib/module/components/layout/HeaderSecondLevel.js +4 -4
- package/lib/module/components/layout/HeaderSecondLevel.js.map +1 -1
- package/lib/module/components/layout/ModalBSHeader.js +5 -17
- package/lib/module/components/layout/ModalBSHeader.js.map +1 -1
- package/lib/module/components/listitems/ListItemNavAlert.js +2 -5
- package/lib/module/components/listitems/ListItemNavAlert.js.map +1 -1
- package/lib/module/components/listitems/ListItemTransaction.js +2 -5
- package/lib/module/components/listitems/ListItemTransaction.js.map +1 -1
- package/lib/module/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +27 -27
- package/lib/module/components/modules/ModuleIDP.js +4 -5
- package/lib/module/components/modules/ModuleIDP.js.map +1 -1
- package/lib/module/components/numberpad/NumberButton.js +5 -20
- package/lib/module/components/numberpad/NumberButton.js.map +1 -1
- package/lib/module/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +10 -10
- package/lib/module/components/radio/AnimatedRadio.js +5 -15
- package/lib/module/components/radio/AnimatedRadio.js.map +1 -1
- package/lib/module/components/searchInput/SearchInput.js +7 -11
- package/lib/module/components/searchInput/SearchInput.js.map +1 -1
- package/lib/module/components/stepper/Stepper.js +2 -11
- package/lib/module/components/stepper/Stepper.js.map +1 -1
- package/lib/module/components/switch/NativeSwitch.js +3 -16
- package/lib/module/components/switch/NativeSwitch.js.map +1 -1
- package/lib/module/components/tabs/TabItem.js +7 -47
- package/lib/module/components/tabs/TabItem.js.map +1 -1
- package/lib/module/components/tag/Tag.js +5 -5
- package/lib/module/components/tag/Tag.js.map +1 -1
- package/lib/module/components/textInput/TextInputBase.js +11 -21
- package/lib/module/components/textInput/TextInputBase.js.map +1 -1
- package/lib/module/components/typography/Body.js +5 -7
- package/lib/module/components/typography/Body.js.map +1 -1
- package/lib/module/components/typography/BodySmall.js +4 -4
- package/lib/module/components/typography/BodySmall.js.map +1 -1
- package/lib/module/components/typography/ButtonText.js +7 -8
- package/lib/module/components/typography/ButtonText.js.map +1 -1
- package/lib/module/components/typography/Caption.js +6 -12
- package/lib/module/components/typography/Caption.js.map +1 -1
- package/lib/module/components/typography/H1.js +6 -13
- package/lib/module/components/typography/H1.js.map +1 -1
- package/lib/module/components/typography/H2.js +8 -17
- package/lib/module/components/typography/H2.js.map +1 -1
- package/lib/module/components/typography/H3.js +4 -8
- package/lib/module/components/typography/H3.js.map +1 -1
- package/lib/module/components/typography/H4.js +7 -14
- package/lib/module/components/typography/H4.js.map +1 -1
- package/lib/module/components/typography/H5.js +6 -11
- package/lib/module/components/typography/H5.js.map +1 -1
- package/lib/module/components/typography/H6.js +7 -10
- package/lib/module/components/typography/H6.js.map +1 -1
- package/lib/module/components/typography/Hero.js +8 -17
- package/lib/module/components/typography/Hero.js.map +1 -1
- package/lib/module/components/typography/LabelMini.js +5 -7
- package/lib/module/components/typography/LabelMini.js.map +1 -1
- package/lib/module/components/typography/__test__/__snapshots__/ComposedBodyFromArray.test.tsx.snap +42 -42
- package/lib/module/components/typography/__test__/__snapshots__/typography.test.tsx.snap +26 -26
- package/lib/module/components/typography/markdown/MdH1.js +4 -4
- package/lib/module/components/typography/markdown/MdH1.js.map +1 -1
- package/lib/module/components/typography/markdown/MdH2.js +4 -4
- package/lib/module/components/typography/markdown/MdH2.js.map +1 -1
- package/lib/module/components/typography/markdown/MdH3.js +4 -4
- package/lib/module/components/typography/markdown/MdH3.js.map +1 -1
- package/lib/module/core/IOColors.js +0 -6
- package/lib/module/core/IOColors.js.map +1 -1
- package/lib/module/core/IODSExperimentalContextProvider.js +2 -2
- package/lib/module/core/IODSExperimentalContextProvider.js.map +1 -1
- package/lib/module/core/IONewTypefaceContextProvider.js +22 -0
- package/lib/module/core/IONewTypefaceContextProvider.js.map +1 -0
- package/lib/module/core/IOStyles.js +0 -46
- package/lib/module/core/IOStyles.js.map +1 -1
- package/lib/module/core/IOThemeContextProvider.js +3 -12
- package/lib/module/core/IOThemeContextProvider.js.map +1 -1
- package/lib/module/core/index.js +1 -0
- package/lib/module/core/index.js.map +1 -1
- package/lib/typescript/components/accordion/index.d.ts +0 -1
- package/lib/typescript/components/accordion/index.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/checkbox/AnimatedCheckbox.d.ts.map +1 -1
- package/lib/typescript/components/checkbox/AnimatedMessageCheckbox.d.ts.map +1 -1
- package/lib/typescript/components/layout/FooterActions.d.ts.map +1 -1
- package/lib/typescript/components/layout/HeaderSecondLevel.d.ts.map +1 -1
- package/lib/typescript/components/layout/ModalBSHeader.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemNavAlert.d.ts.map +1 -1
- package/lib/typescript/components/listitems/ListItemTransaction.d.ts.map +1 -1
- package/lib/typescript/components/modules/ModuleIDP.d.ts.map +1 -1
- package/lib/typescript/components/numberpad/NumberButton.d.ts.map +1 -1
- package/lib/typescript/components/radio/AnimatedRadio.d.ts.map +1 -1
- package/lib/typescript/components/searchInput/SearchInput.d.ts.map +1 -1
- package/lib/typescript/components/stepper/Stepper.d.ts.map +1 -1
- package/lib/typescript/components/switch/NativeSwitch.d.ts.map +1 -1
- package/lib/typescript/components/tabs/TabItem.d.ts.map +1 -1
- package/lib/typescript/components/textInput/TextInputBase.d.ts.map +1 -1
- package/lib/typescript/components/typography/Body.d.ts.map +1 -1
- package/lib/typescript/components/typography/ButtonText.d.ts.map +1 -1
- package/lib/typescript/components/typography/Caption.d.ts.map +1 -1
- package/lib/typescript/components/typography/H1.d.ts.map +1 -1
- package/lib/typescript/components/typography/H2.d.ts +0 -3
- package/lib/typescript/components/typography/H2.d.ts.map +1 -1
- package/lib/typescript/components/typography/H3.d.ts.map +1 -1
- package/lib/typescript/components/typography/H4.d.ts.map +1 -1
- package/lib/typescript/components/typography/H5.d.ts.map +1 -1
- package/lib/typescript/components/typography/H6.d.ts.map +1 -1
- package/lib/typescript/components/typography/Hero.d.ts.map +1 -1
- package/lib/typescript/components/typography/LabelMini.d.ts.map +1 -1
- package/lib/typescript/core/IOColors.d.ts +0 -1
- package/lib/typescript/core/IOColors.d.ts.map +1 -1
- package/lib/typescript/core/IODSExperimentalContextProvider.d.ts.map +1 -1
- package/lib/typescript/core/IONewTypefaceContextProvider.d.ts +16 -0
- package/lib/typescript/core/IONewTypefaceContextProvider.d.ts.map +1 -0
- package/lib/typescript/core/IOStyles.d.ts +2 -32
- package/lib/typescript/core/IOStyles.d.ts.map +1 -1
- package/lib/typescript/core/IOThemeContextProvider.d.ts +0 -4
- package/lib/typescript/core/IOThemeContextProvider.d.ts.map +1 -1
- package/lib/typescript/core/index.d.ts +1 -0
- package/lib/typescript/core/index.d.ts.map +1 -1
- package/lib/typescript/utils/fonts.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/Advice/__test__/__snapshots__/advice.test.tsx.snap +1 -1
- package/src/components/accordion/index.tsx +0 -1
- package/src/components/badge/Badge.tsx +3 -3
- package/src/components/badge/__test__/__snapshots__/badge.test.tsx.snap +1 -1
- package/src/components/banner/Banner.tsx +3 -4
- package/src/components/banner/__test__/__snapshots__/banner.test.tsx.snap +3 -3
- package/src/components/buttons/ButtonLink.tsx +38 -41
- package/src/components/buttons/ButtonOutline.tsx +31 -103
- package/src/components/buttons/ButtonSolid.tsx +11 -69
- package/src/components/buttons/IconButton.tsx +5 -49
- package/src/components/buttons/IconButtonContained.tsx +11 -58
- package/src/components/buttons/IconButtonSolid.tsx +9 -47
- package/src/components/buttons/__test__/__snapshots__/button.test.tsx.snap +29 -27
- package/src/components/checkbox/AnimatedCheckbox.tsx +6 -34
- package/src/components/checkbox/AnimatedMessageCheckbox.tsx +3 -14
- package/src/components/layout/FooterActions.tsx +1 -4
- package/src/components/layout/HeaderSecondLevel.tsx +4 -3
- package/src/components/layout/ModalBSHeader.tsx +11 -29
- package/src/components/listitems/ListItemNavAlert.tsx +1 -4
- package/src/components/listitems/ListItemTransaction.tsx +1 -5
- package/src/components/listitems/__test__/__snapshots__/listitem.test.tsx.snap +27 -27
- package/src/components/modules/ModuleIDP.tsx +3 -8
- package/src/components/numberpad/NumberButton.tsx +4 -27
- package/src/components/numberpad/__test__/__snapshots__/NumberPad.test.tsx.snap +10 -10
- package/src/components/radio/AnimatedRadio.tsx +5 -33
- package/src/components/searchInput/SearchInput.tsx +11 -20
- package/src/components/stepper/Stepper.tsx +2 -20
- package/src/components/switch/NativeSwitch.tsx +3 -21
- package/src/components/tabs/TabItem.tsx +14 -61
- package/src/components/tag/Tag.tsx +3 -3
- package/src/components/textInput/TextInputBase.tsx +19 -34
- package/src/components/typography/Body.tsx +4 -11
- package/src/components/typography/BodySmall.tsx +3 -3
- package/src/components/typography/ButtonText.tsx +6 -8
- package/src/components/typography/Caption.tsx +6 -13
- package/src/components/typography/H1.tsx +6 -14
- package/src/components/typography/H2.tsx +8 -18
- package/src/components/typography/H3.tsx +4 -8
- package/src/components/typography/H4.tsx +7 -15
- package/src/components/typography/H5.tsx +6 -14
- package/src/components/typography/H6.tsx +7 -11
- package/src/components/typography/Hero.tsx +8 -18
- package/src/components/typography/LabelMini.tsx +4 -11
- package/src/components/typography/__test__/__snapshots__/ComposedBodyFromArray.test.tsx.snap +42 -42
- package/src/components/typography/__test__/__snapshots__/typography.test.tsx.snap +26 -26
- package/src/components/typography/markdown/MdH1.tsx +3 -3
- package/src/components/typography/markdown/MdH2.tsx +3 -3
- package/src/components/typography/markdown/MdH3.tsx +3 -3
- package/src/core/IOColors.ts +0 -7
- package/src/core/IODSExperimentalContextProvider.tsx +2 -2
- package/src/core/IONewTypefaceContextProvider.tsx +37 -0
- package/src/core/IOStyles.ts +0 -52
- package/src/core/IOThemeContextProvider.tsx +3 -16
- package/src/core/index.ts +1 -0
- package/lib/commonjs/components/accordion/RawAccordion.js +0 -93
- package/lib/commonjs/components/accordion/RawAccordion.js.map +0 -1
- package/lib/module/components/accordion/RawAccordion.js +0 -86
- package/lib/module/components/accordion/RawAccordion.js.map +0 -1
- package/lib/typescript/components/accordion/RawAccordion.d.ts +0 -17
- package/lib/typescript/components/accordion/RawAccordion.d.ts.map +0 -1
- package/src/components/accordion/RawAccordion.tsx +0 -116
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import React, { forwardRef
|
|
1
|
+
import React, { forwardRef } from "react";
|
|
2
2
|
import { Pressable } from "react-native";
|
|
3
|
-
import Animated, { interpolateColor, useAnimatedStyle, useReducedMotion } from "react-native-reanimated";
|
|
4
|
-
import { IOButtonStyles, IOColors, hexToRgba,
|
|
3
|
+
import Animated, { interpolateColor, useAnimatedProps, useAnimatedStyle, useReducedMotion } from "react-native-reanimated";
|
|
4
|
+
import { IOButtonStyles, IOColors, hexToRgba, useIONewTypeface } from "../../core";
|
|
5
5
|
import { useScaleAnimation } from "../../hooks";
|
|
6
6
|
import { AnimatedIcon, IconClassComponent } from "../icons";
|
|
7
7
|
import { IOText, buttonTextFontSize } from "../typography";
|
|
@@ -22,25 +22,6 @@ const mapColorStates = {
|
|
|
22
22
|
}
|
|
23
23
|
}
|
|
24
24
|
};
|
|
25
|
-
|
|
26
|
-
// TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
|
|
27
|
-
const mapLegacyColorStates = {
|
|
28
|
-
// Primary button
|
|
29
|
-
primary: {
|
|
30
|
-
label: {
|
|
31
|
-
default: IOColors.blue,
|
|
32
|
-
pressed: IOColors["blue-600"],
|
|
33
|
-
disabled: IOColors["grey-700"]
|
|
34
|
-
}
|
|
35
|
-
},
|
|
36
|
-
contrast: {
|
|
37
|
-
label: {
|
|
38
|
-
default: IOColors.white,
|
|
39
|
-
pressed: hexToRgba(IOColors.white, 0.85),
|
|
40
|
-
disabled: hexToRgba(IOColors.white, 0.5)
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
25
|
const DISABLED_OPACITY = 0.5;
|
|
45
26
|
const ICON_MARGIN = 8;
|
|
46
27
|
export const ButtonLink = /*#__PURE__*/forwardRef(({
|
|
@@ -54,10 +35,10 @@ export const ButtonLink = /*#__PURE__*/forwardRef(({
|
|
|
54
35
|
accessibilityHint,
|
|
55
36
|
testID
|
|
56
37
|
}, ref) => {
|
|
57
|
-
var
|
|
38
|
+
var _mapColorStates$color, _mapColorStates$color2, _mapColorStates$color3;
|
|
58
39
|
const {
|
|
59
|
-
|
|
60
|
-
} =
|
|
40
|
+
newTypefaceEnabled
|
|
41
|
+
} = useIONewTypeface();
|
|
61
42
|
const {
|
|
62
43
|
progress,
|
|
63
44
|
onPressIn,
|
|
@@ -65,11 +46,23 @@ export const ButtonLink = /*#__PURE__*/forwardRef(({
|
|
|
65
46
|
scaleAnimatedStyle
|
|
66
47
|
} = useScaleAnimation();
|
|
67
48
|
const reducedMotion = useReducedMotion();
|
|
68
|
-
const colorMap = useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
69
49
|
const AnimatedIOText = Animated.createAnimatedComponent(IOText);
|
|
70
|
-
const
|
|
71
|
-
color
|
|
72
|
-
|
|
50
|
+
const pressedColorLabelAnimationStyle = useAnimatedStyle(() => {
|
|
51
|
+
// Link color states to the pressed states
|
|
52
|
+
|
|
53
|
+
const labelColor = interpolateColor(progress.value, [0, 1], [mapColorStates[color].label.default, mapColorStates[color].label.pressed]);
|
|
54
|
+
return {
|
|
55
|
+
color: labelColor
|
|
56
|
+
};
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
// Animate the <Icon> color prop
|
|
60
|
+
const pressedColorIconAnimationStyle = useAnimatedProps(() => {
|
|
61
|
+
const iconColor = interpolateColor(progress.value, [0, 1], [mapColorStates[color].label.default, mapColorStates[color].label.pressed]);
|
|
62
|
+
return {
|
|
63
|
+
color: iconColor
|
|
64
|
+
};
|
|
65
|
+
});
|
|
73
66
|
const AnimatedIconClassComponent = Animated.createAnimatedComponent(IconClassComponent);
|
|
74
67
|
|
|
75
68
|
// Icon size
|
|
@@ -113,25 +106,25 @@ export const ButtonLink = /*#__PURE__*/forwardRef(({
|
|
|
113
106
|
}, icon && (!disabled ? /*#__PURE__*/React.createElement(AnimatedIconClassComponent, {
|
|
114
107
|
allowFontScaling: true,
|
|
115
108
|
name: icon,
|
|
116
|
-
animatedProps:
|
|
117
|
-
color: (
|
|
109
|
+
animatedProps: pressedColorIconAnimationStyle,
|
|
110
|
+
color: (_mapColorStates$color = mapColorStates[color]) === null || _mapColorStates$color === void 0 || (_mapColorStates$color = _mapColorStates$color.label) === null || _mapColorStates$color === void 0 ? void 0 : _mapColorStates$color.default,
|
|
118
111
|
size: iconSize
|
|
119
112
|
}) : /*#__PURE__*/React.createElement(AnimatedIcon, {
|
|
120
113
|
allowFontScaling: true,
|
|
121
114
|
name: icon,
|
|
122
|
-
color: (
|
|
115
|
+
color: (_mapColorStates$color2 = mapColorStates[color]) === null || _mapColorStates$color2 === void 0 || (_mapColorStates$color2 = _mapColorStates$color2.label) === null || _mapColorStates$color2 === void 0 ? void 0 : _mapColorStates$color2.disabled,
|
|
123
116
|
size: iconSize
|
|
124
117
|
})), /*#__PURE__*/React.createElement(AnimatedIOText, {
|
|
125
118
|
accessible: false,
|
|
126
119
|
accessibilityElementsHidden: true,
|
|
127
120
|
importantForAccessibility: "no-hide-descendants",
|
|
128
|
-
font:
|
|
121
|
+
font: newTypefaceEnabled ? "Titillio" : "TitilliumSansPro",
|
|
129
122
|
weight: "Semibold",
|
|
130
123
|
size: buttonTextFontSize,
|
|
131
124
|
style: disabled ? {
|
|
132
|
-
color: (
|
|
125
|
+
color: (_mapColorStates$color3 = mapColorStates[color]) === null || _mapColorStates$color3 === void 0 || (_mapColorStates$color3 = _mapColorStates$color3.label) === null || _mapColorStates$color3 === void 0 ? void 0 : _mapColorStates$color3.disabled
|
|
133
126
|
} : {
|
|
134
|
-
...
|
|
127
|
+
...pressedColorLabelAnimationStyle
|
|
135
128
|
},
|
|
136
129
|
numberOfLines: 1,
|
|
137
130
|
ellipsizeMode: "tail"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","
|
|
1
|
+
{"version":3,"names":["React","forwardRef","Pressable","Animated","interpolateColor","useAnimatedProps","useAnimatedStyle","useReducedMotion","IOButtonStyles","IOColors","hexToRgba","useIONewTypeface","useScaleAnimation","AnimatedIcon","IconClassComponent","IOText","buttonTextFontSize","mapColorStates","primary","label","default","pressed","disabled","contrast","white","DISABLED_OPACITY","ICON_MARGIN","ButtonLink","color","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_mapColorStates$color","_mapColorStates$color2","_mapColorStates$color3","newTypefaceEnabled","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","AnimatedIOText","createAnimatedComponent","pressedColorLabelAnimationStyle","labelColor","value","pressedColorIconAnimationStyle","iconColor","AnimatedIconClassComponent","iconSize","iconMargin","createElement","accessibilityRole","accessibilityState","onTouchEnd","accessible","hitSlop","top","right","bottom","left","style","dimensionsDefault","View","buttonLink","flexDirection","columnGap","opacity","allowFontScaling","name","animatedProps","size","accessibilityElementsHidden","importantForAccessibility","font","weight","numberOfLines","ellipsizeMode"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonLink.tsx"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { forwardRef } from "react";
|
|
2
2
|
import { Pressable, StyleSheet } from "react-native";
|
|
3
3
|
import Animated, { interpolateColor, useAnimatedProps, useAnimatedStyle, useReducedMotion } from "react-native-reanimated";
|
|
4
|
-
import {
|
|
4
|
+
import { IOButtonStyles, IOColors, hexToRgba, useIONewTypeface } from "../../core/";
|
|
5
5
|
import { useScaleAnimation } from "../../hooks";
|
|
6
6
|
import { AnimatedIcon, IconClassComponent } from "../icons";
|
|
7
7
|
import { IOText, buttonTextFontSize } from "../typography";
|
|
@@ -62,71 +62,6 @@ const mapColorStates = {
|
|
|
62
62
|
}
|
|
63
63
|
};
|
|
64
64
|
|
|
65
|
-
// TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
|
|
66
|
-
const mapLegacyColorStates = {
|
|
67
|
-
// Primary button
|
|
68
|
-
primary: {
|
|
69
|
-
border: {
|
|
70
|
-
default: IOColors.blue,
|
|
71
|
-
pressed: IOColors.blue,
|
|
72
|
-
disabled: IOColors.bluegreyLight
|
|
73
|
-
},
|
|
74
|
-
background: {
|
|
75
|
-
default: hexToRgba(IOColors.blue, 0),
|
|
76
|
-
pressed: hexToRgba(IOColors.blue, 0.15),
|
|
77
|
-
disabled: "transparent"
|
|
78
|
-
},
|
|
79
|
-
label: {
|
|
80
|
-
default: IOColors.blue,
|
|
81
|
-
pressed: IOColors.blue,
|
|
82
|
-
disabled: IOColors.grey
|
|
83
|
-
}
|
|
84
|
-
},
|
|
85
|
-
// Contrast button
|
|
86
|
-
contrast: {
|
|
87
|
-
border: {
|
|
88
|
-
default: IOColors.white,
|
|
89
|
-
pressed: IOColors.white,
|
|
90
|
-
disabled: hexToRgba(IOColors.white, 0.5)
|
|
91
|
-
},
|
|
92
|
-
background: {
|
|
93
|
-
default: hexToRgba(IOColors.white, 0),
|
|
94
|
-
pressed: hexToRgba(IOColors.white, 0.2),
|
|
95
|
-
disabled: "transparent"
|
|
96
|
-
},
|
|
97
|
-
label: {
|
|
98
|
-
default: IOColors.white,
|
|
99
|
-
pressed: IOColors.white,
|
|
100
|
-
disabled: hexToRgba(IOColors.white, 0.5)
|
|
101
|
-
}
|
|
102
|
-
},
|
|
103
|
-
// Danger button
|
|
104
|
-
danger: {
|
|
105
|
-
border: {
|
|
106
|
-
default: IOColors.red,
|
|
107
|
-
pressed: IOColors.red,
|
|
108
|
-
disabled: IOColors.bluegreyLight
|
|
109
|
-
},
|
|
110
|
-
background: {
|
|
111
|
-
default: hexToRgba(IOColors.red, 0),
|
|
112
|
-
pressed: hexToRgba(IOColors.red, 0.15),
|
|
113
|
-
disabled: "transparent"
|
|
114
|
-
},
|
|
115
|
-
label: {
|
|
116
|
-
default: IOColors.red,
|
|
117
|
-
pressed: IOColors.red,
|
|
118
|
-
disabled: IOColors.grey
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
// TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
|
|
124
|
-
const IOButtonLegacyStylesLocal = StyleSheet.create({
|
|
125
|
-
buttonWithBorder: {
|
|
126
|
-
borderWidth: 1
|
|
127
|
-
}
|
|
128
|
-
});
|
|
129
|
-
|
|
130
65
|
// Icon size
|
|
131
66
|
const iconSize = 20;
|
|
132
67
|
const DISABLED_OPACITY = 0.5;
|
|
@@ -148,10 +83,10 @@ export const ButtonOutline = /*#__PURE__*/forwardRef(({
|
|
|
148
83
|
accessibilityHint,
|
|
149
84
|
testID
|
|
150
85
|
}, ref) => {
|
|
151
|
-
var
|
|
86
|
+
var _mapColorStates$color, _mapColorStates$color2, _mapColorStates$color3, _mapColorStates$color4, _mapColorStates$color5, _mapColorStates$color6, _mapColorStates$color7;
|
|
152
87
|
const {
|
|
153
|
-
|
|
154
|
-
} =
|
|
88
|
+
newTypefaceEnabled
|
|
89
|
+
} = useIONewTypeface();
|
|
155
90
|
const {
|
|
156
91
|
progress,
|
|
157
92
|
onPressIn,
|
|
@@ -160,27 +95,24 @@ export const ButtonOutline = /*#__PURE__*/forwardRef(({
|
|
|
160
95
|
} = useScaleAnimation();
|
|
161
96
|
const reducedMotion = useReducedMotion();
|
|
162
97
|
const AnimatedIOText = Animated.createAnimatedComponent(IOText);
|
|
163
|
-
const colorMap = React.useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
164
|
-
const buttonStyles = React.useMemo(() => isExperimental ? IOButtonStyles : IOButtonLegacyStyles, [isExperimental]);
|
|
165
|
-
const buttonStylesLocal = React.useMemo(() => isExperimental ? IOButtonStylesLocal : IOButtonLegacyStylesLocal, [isExperimental]);
|
|
166
98
|
|
|
167
99
|
// Interpolate animation values from `isPressed` values
|
|
168
100
|
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
169
101
|
// Link color states to the pressed states
|
|
170
|
-
const backgroundColor = interpolateColor(progress.value, [0, 1], [
|
|
171
|
-
const borderColor = interpolateColor(progress.value, [0, 1], [
|
|
102
|
+
const backgroundColor = interpolateColor(progress.value, [0, 1], [mapColorStates[color].background.default, mapColorStates[color].background.pressed]);
|
|
103
|
+
const borderColor = interpolateColor(progress.value, [0, 1], [mapColorStates[color].border.default, mapColorStates[color].border.pressed]);
|
|
172
104
|
return {
|
|
173
105
|
borderColor,
|
|
174
106
|
backgroundColor
|
|
175
107
|
};
|
|
176
108
|
});
|
|
177
109
|
const pressedColorLabelAnimationStyle = useAnimatedStyle(() => ({
|
|
178
|
-
color: interpolateColor(progress.value, [0, 1], [
|
|
110
|
+
color: interpolateColor(progress.value, [0, 1], [mapColorStates[color].border.default, mapColorStates[color].border.pressed])
|
|
179
111
|
}));
|
|
180
112
|
|
|
181
113
|
// Animate the <Icon> color prop
|
|
182
114
|
const pressedColorIconAnimationStyle = useAnimatedProps(() => ({
|
|
183
|
-
color: interpolateColor(progress.value, [0, 1], [
|
|
115
|
+
color: interpolateColor(progress.value, [0, 1], [mapColorStates[color].label.default, mapColorStates[color].label.pressed])
|
|
184
116
|
}));
|
|
185
117
|
const AnimatedIconClassComponent = Animated.createAnimatedComponent(IconClassComponent);
|
|
186
118
|
return /*#__PURE__*/React.createElement(Pressable, {
|
|
@@ -199,19 +131,19 @@ export const ButtonOutline = /*#__PURE__*/forwardRef(({
|
|
|
199
131
|
disabled: disabled,
|
|
200
132
|
style: !fullWidth ? IOButtonStyles.dimensionsDefault : {}
|
|
201
133
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
202
|
-
style: [
|
|
134
|
+
style: [IOButtonStyles.button, IOButtonStyles.buttonSizeDefault, IOButtonStylesLocal.buttonWithBorder, fullWidth && {
|
|
203
135
|
paddingHorizontal: 16
|
|
204
|
-
},
|
|
136
|
+
}, {
|
|
205
137
|
columnGap: ICON_MARGIN
|
|
206
138
|
}, iconPosition === "end" && {
|
|
207
139
|
flexDirection: "row-reverse"
|
|
208
140
|
}, disabled ? {
|
|
209
|
-
backgroundColor: (
|
|
210
|
-
borderColor: (
|
|
141
|
+
backgroundColor: (_mapColorStates$color = mapColorStates[color]) === null || _mapColorStates$color === void 0 || (_mapColorStates$color = _mapColorStates$color.background) === null || _mapColorStates$color === void 0 ? void 0 : _mapColorStates$color.disabled,
|
|
142
|
+
borderColor: (_mapColorStates$color2 = mapColorStates[color]) === null || _mapColorStates$color2 === void 0 || (_mapColorStates$color2 = _mapColorStates$color2.border) === null || _mapColorStates$color2 === void 0 ? void 0 : _mapColorStates$color2.disabled,
|
|
211
143
|
opacity: DISABLED_OPACITY
|
|
212
144
|
} : {
|
|
213
|
-
backgroundColor: (
|
|
214
|
-
borderColor: (
|
|
145
|
+
backgroundColor: (_mapColorStates$color3 = mapColorStates[color]) === null || _mapColorStates$color3 === void 0 || (_mapColorStates$color3 = _mapColorStates$color3.background) === null || _mapColorStates$color3 === void 0 ? void 0 : _mapColorStates$color3.default,
|
|
146
|
+
borderColor: (_mapColorStates$color4 = mapColorStates[color]) === null || _mapColorStates$color4 === void 0 ? void 0 : _mapColorStates$color4.border.default
|
|
215
147
|
},
|
|
216
148
|
/* Prevent Reanimated from overriding background colors
|
|
217
149
|
if button is disabled */
|
|
@@ -220,15 +152,15 @@ export const ButtonOutline = /*#__PURE__*/forwardRef(({
|
|
|
220
152
|
allowFontScaling: true,
|
|
221
153
|
name: icon,
|
|
222
154
|
animatedProps: pressedColorIconAnimationStyle,
|
|
223
|
-
color: (
|
|
155
|
+
color: (_mapColorStates$color5 = mapColorStates[color]) === null || _mapColorStates$color5 === void 0 || (_mapColorStates$color5 = _mapColorStates$color5.label) === null || _mapColorStates$color5 === void 0 ? void 0 : _mapColorStates$color5.default,
|
|
224
156
|
size: iconSize
|
|
225
157
|
}) : /*#__PURE__*/React.createElement(AnimatedIcon, {
|
|
226
158
|
allowFontScaling: true,
|
|
227
159
|
name: icon,
|
|
228
|
-
color: (
|
|
160
|
+
color: (_mapColorStates$color6 = mapColorStates[color]) === null || _mapColorStates$color6 === void 0 || (_mapColorStates$color6 = _mapColorStates$color6.label) === null || _mapColorStates$color6 === void 0 ? void 0 : _mapColorStates$color6.disabled,
|
|
229
161
|
size: iconSize
|
|
230
162
|
})), /*#__PURE__*/React.createElement(AnimatedIOText, {
|
|
231
|
-
font:
|
|
163
|
+
font: newTypefaceEnabled ? "Titillio" : "TitilliumSansPro",
|
|
232
164
|
weight: "Semibold",
|
|
233
165
|
size: buttonTextFontSize,
|
|
234
166
|
accessible: false,
|
|
@@ -236,8 +168,8 @@ export const ButtonOutline = /*#__PURE__*/forwardRef(({
|
|
|
236
168
|
importantForAccessibility: "no-hide-descendants",
|
|
237
169
|
numberOfLines: 1,
|
|
238
170
|
ellipsizeMode: "tail",
|
|
239
|
-
style: [
|
|
240
|
-
color: (
|
|
171
|
+
style: [IOButtonStyles.label, disabled ? {
|
|
172
|
+
color: (_mapColorStates$color7 = mapColorStates[color]) === null || _mapColorStates$color7 === void 0 || (_mapColorStates$color7 = _mapColorStates$color7.label) === null || _mapColorStates$color7 === void 0 ? void 0 : _mapColorStates$color7.disabled
|
|
241
173
|
} : {
|
|
242
174
|
...pressedColorLabelAnimationStyle
|
|
243
175
|
}]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","forwardRef","Pressable","StyleSheet","Animated","interpolateColor","useAnimatedProps","useAnimatedStyle","useReducedMotion","
|
|
1
|
+
{"version":3,"names":["React","forwardRef","Pressable","StyleSheet","Animated","interpolateColor","useAnimatedProps","useAnimatedStyle","useReducedMotion","IOButtonStyles","IOColors","hexToRgba","useIONewTypeface","useScaleAnimation","AnimatedIcon","IconClassComponent","IOText","buttonTextFontSize","mapColorStates","primary","border","default","pressed","disabled","background","label","contrast","white","danger","red","bluegreyLight","grey","iconSize","DISABLED_OPACITY","ICON_MARGIN","IOButtonStylesLocal","create","buttonWithBorder","borderWidth","ButtonOutline","color","fullWidth","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_mapColorStates$color","_mapColorStates$color2","_mapColorStates$color3","_mapColorStates$color4","_mapColorStates$color5","_mapColorStates$color6","_mapColorStates$color7","newTypefaceEnabled","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","AnimatedIOText","createAnimatedComponent","pressedAnimationStyle","backgroundColor","value","borderColor","pressedColorLabelAnimationStyle","pressedColorIconAnimationStyle","AnimatedIconClassComponent","createElement","accessibilityRole","accessibilityState","accessible","style","dimensionsDefault","View","button","buttonSizeDefault","paddingHorizontal","columnGap","flexDirection","opacity","allowFontScaling","name","animatedProps","size","font","weight","accessibilityElementsHidden","importantForAccessibility","numberOfLines","ellipsizeMode"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonOutline.tsx"],"mappings":"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"}
|
|
@@ -2,19 +2,11 @@ import React, { useCallback } 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";
|
|
5
|
-
import {
|
|
5
|
+
import { IOButtonStyles, IOColors, enterTransitionInnerContent, enterTransitionInnerContentSmall, exitTransitionInnerContent } from "../../core";
|
|
6
6
|
import { useScaleAnimation } from "../../hooks";
|
|
7
7
|
import { Icon } from "../icons";
|
|
8
8
|
import { LoadingSpinner } from "../loadingSpinner";
|
|
9
9
|
import { ButtonText } from "../typography/ButtonText";
|
|
10
|
-
// Disabled state
|
|
11
|
-
// TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
|
|
12
|
-
const colorPrimaryLegacyButtonDisabled = "bluegreyLight";
|
|
13
|
-
const legacyStyles = StyleSheet.create({
|
|
14
|
-
backgroundDisabled: {
|
|
15
|
-
backgroundColor: IOColors[colorPrimaryLegacyButtonDisabled]
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
10
|
const colorPrimaryButtonDisabled = "grey-200";
|
|
19
11
|
const ICON_MARGIN = 8;
|
|
20
12
|
const DISABLED_OPACITY = 0.5;
|
|
@@ -56,37 +48,6 @@ const mapColorStates = {
|
|
|
56
48
|
}
|
|
57
49
|
}
|
|
58
50
|
};
|
|
59
|
-
|
|
60
|
-
// TODO: Remove this when legacy look is deprecated https://pagopa.atlassian.net/browse/IOPLT-153
|
|
61
|
-
const mapLegacyColorStates = {
|
|
62
|
-
// Primary button
|
|
63
|
-
primary: {
|
|
64
|
-
default: IOColors.blue,
|
|
65
|
-
pressed: IOColors["blue-600"],
|
|
66
|
-
label: {
|
|
67
|
-
default: "white",
|
|
68
|
-
disabled: "white"
|
|
69
|
-
}
|
|
70
|
-
},
|
|
71
|
-
// Danger button
|
|
72
|
-
danger: {
|
|
73
|
-
default: IOColors["error-600"],
|
|
74
|
-
pressed: IOColors["error-500"],
|
|
75
|
-
label: {
|
|
76
|
-
default: "white",
|
|
77
|
-
disabled: "white"
|
|
78
|
-
}
|
|
79
|
-
},
|
|
80
|
-
// Contrast button
|
|
81
|
-
contrast: {
|
|
82
|
-
default: IOColors.white,
|
|
83
|
-
pressed: IOColors["blue-50"],
|
|
84
|
-
label: {
|
|
85
|
-
default: "blue",
|
|
86
|
-
disabled: "white"
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
};
|
|
90
51
|
export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
91
52
|
color = "primary",
|
|
92
53
|
label,
|
|
@@ -100,10 +61,7 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
100
61
|
accessibilityHint,
|
|
101
62
|
testID
|
|
102
63
|
}, ref) => {
|
|
103
|
-
var
|
|
104
|
-
const {
|
|
105
|
-
isExperimental
|
|
106
|
-
} = useIOExperimentalDesign();
|
|
64
|
+
var _mapColorStates$color, _mapColorStates$color2, _mapColorStates$color3;
|
|
107
65
|
const {
|
|
108
66
|
progress,
|
|
109
67
|
onPressIn,
|
|
@@ -111,13 +69,11 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
111
69
|
scaleAnimatedStyle
|
|
112
70
|
} = useScaleAnimation();
|
|
113
71
|
const reducedMotion = useReducedMotion();
|
|
114
|
-
const colorMap = React.useMemo(() => isExperimental ? mapColorStates : mapLegacyColorStates, [isExperimental]);
|
|
115
|
-
const buttonStyles = React.useMemo(() => isExperimental ? IOButtonStyles : IOButtonLegacyStyles, [isExperimental]);
|
|
116
72
|
|
|
117
73
|
// Interpolate animation values from `isPressed` values
|
|
118
74
|
const pressedAnimationStyle = useAnimatedStyle(() => {
|
|
119
75
|
// Link color states to the pressed states
|
|
120
|
-
const backgroundColor = interpolateColor(progress.value, [0, 1], [
|
|
76
|
+
const backgroundColor = interpolateColor(progress.value, [0, 1], [mapColorStates[color].default, mapColorStates[color].pressed]);
|
|
121
77
|
return {
|
|
122
78
|
backgroundColor
|
|
123
79
|
};
|
|
@@ -133,7 +89,7 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
133
89
|
}, [loading, onPress]);
|
|
134
90
|
|
|
135
91
|
// Label & Icons colors
|
|
136
|
-
const foregroundColor = disabled ? (
|
|
92
|
+
const foregroundColor = disabled ? (_mapColorStates$color = mapColorStates[color]) === null || _mapColorStates$color === void 0 || (_mapColorStates$color = _mapColorStates$color.label) === null || _mapColorStates$color === void 0 ? void 0 : _mapColorStates$color.disabled : (_mapColorStates$color2 = mapColorStates[color]) === null || _mapColorStates$color2 === void 0 || (_mapColorStates$color2 = _mapColorStates$color2.label) === null || _mapColorStates$color2 === void 0 ? void 0 : _mapColorStates$color2.default;
|
|
137
93
|
return /*#__PURE__*/React.createElement(Pressable, {
|
|
138
94
|
testID: testID,
|
|
139
95
|
ref: ref,
|
|
@@ -153,24 +109,24 @@ export const ButtonSolid = /*#__PURE__*/React.forwardRef(({
|
|
|
153
109
|
disabled: disabled,
|
|
154
110
|
style: !fullWidth ? IOButtonStyles.dimensionsDefault : {}
|
|
155
111
|
}, /*#__PURE__*/React.createElement(Animated.View, {
|
|
156
|
-
style: [
|
|
112
|
+
style: [IOButtonStyles.button, IOButtonStyles.buttonSizeDefault, {
|
|
157
113
|
overflow: "hidden"
|
|
158
|
-
},
|
|
114
|
+
}, fullWidth && {
|
|
159
115
|
paddingHorizontal: 16
|
|
160
|
-
},
|
|
161
|
-
backgroundColor: (
|
|
116
|
+
}, disabled ? styles.backgroundDisabled : {
|
|
117
|
+
backgroundColor: (_mapColorStates$color3 = mapColorStates[color]) === null || _mapColorStates$color3 === void 0 ? void 0 : _mapColorStates$color3.default
|
|
162
118
|
},
|
|
163
119
|
/* Prevent Reanimated from overriding background colors
|
|
164
120
|
if button is disabled */
|
|
165
121
|
!disabled && !reducedMotion && scaleAnimatedStyle, !disabled && pressedAnimationStyle]
|
|
166
122
|
}, loading && /*#__PURE__*/React.createElement(Animated.View, {
|
|
167
|
-
style:
|
|
123
|
+
style: IOButtonStyles.buttonInner,
|
|
168
124
|
entering: enterTransitionInnerContentSmall,
|
|
169
125
|
exiting: exitTransitionInnerContent
|
|
170
126
|
}, /*#__PURE__*/React.createElement(LoadingSpinner, {
|
|
171
127
|
color: foregroundColor
|
|
172
128
|
})), !loading && /*#__PURE__*/React.createElement(Animated.View, {
|
|
173
|
-
style: [
|
|
129
|
+
style: [IOButtonStyles.buttonInner, {
|
|
174
130
|
columnGap: ICON_MARGIN
|
|
175
131
|
},
|
|
176
132
|
/* If 'iconPosition' is set to 'end', we use
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useCallback","Pressable","StyleSheet","ReactNativeHapticFeedback","Animated","interpolateColor","useAnimatedStyle","useReducedMotion","
|
|
1
|
+
{"version":3,"names":["React","useCallback","Pressable","StyleSheet","ReactNativeHapticFeedback","Animated","interpolateColor","useAnimatedStyle","useReducedMotion","IOButtonStyles","IOColors","enterTransitionInnerContent","enterTransitionInnerContentSmall","exitTransitionInnerContent","useScaleAnimation","Icon","LoadingSpinner","ButtonText","colorPrimaryButtonDisabled","ICON_MARGIN","DISABLED_OPACITY","iconSize","styles","create","backgroundDisabled","backgroundColor","opacity","mapColorStates","primary","default","pressed","label","disabled","danger","contrast","white","ButtonSolid","forwardRef","color","fullWidth","loading","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","ref","_mapColorStates$color","_mapColorStates$color2","_mapColorStates$color3","progress","onPressIn","onPressOut","scaleAnimatedStyle","reducedMotion","pressedAnimationStyle","value","handleOnPress","event","trigger","foregroundColor","createElement","accessible","accessibilityState","busy","accessibilityRole","style","dimensionsDefault","View","button","buttonSizeDefault","overflow","paddingHorizontal","buttonInner","entering","exiting","columnGap","flexDirection","allowFontScaling","name","size","numberOfLines","ellipsizeMode","accessibilityElementsHidden","importantForAccessibility"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonSolid.tsx"],"mappings":"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"}
|