@pagopa/io-app-design-system 1.0.0-0

package/lib/module/components/banner/__test__/__snapshots__/banner.test.tsx.snap

@@ -0,0 +1,288 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Test Banner Components Banner Snapshot 1`] = `
+<View
+  accessibilityRole="button"
+  accessibilityState={
+    {
+      "busy": undefined,
+      "checked": undefined,
+      "disabled": undefined,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
+    }
+  }
+  accessible={true}
+  collapsable={false}
+  focusable={true}
+  onBlur={[Function]}
+  onClick={[Function]}
+  onFocus={[Function]}
+  onResponderGrant={[Function]}
+  onResponderMove={[Function]}
+  onResponderRelease={[Function]}
+  onResponderTerminate={[Function]}
+  onResponderTerminationRequest={[Function]}
+  onStartShouldSetResponder={[Function]}
+>
+  <View
+    style={
+      [
+        {
+          "alignContent": "center",
+          "alignItems": "flex-start",
+          "borderRadius": 8,
+          "flexDirection": "row",
+        },
+        {
+          "backgroundColor": "#F4F5F8",
+          "paddingHorizontal": 16,
+          "paddingVertical": 16,
+        },
+        {
+          "transform": [
+            {
+              "scale": undefined,
+            },
+          ],
+        },
+      ]
+    }
+  >
+    <View
+      style={
+        [
+          {
+            "flex": 1,
+          },
+          {
+            "alignSelf": "center",
+          },
+        ]
+      }
+    >
+      <Text
+        color="blueIO-850"
+        defaultColor="black"
+        defaultWeight="Regular"
+        font="ReadexPro"
+        fontStyle={
+          {
+            "fontSize": 16,
+            "lineHeight": 20,
+          }
+        }
+        style={
+          [
+            {
+              "fontSize": 16,
+              "lineHeight": 20,
+            },
+            {
+              "color": "#031344",
+              "fontFamily": "Readex Pro",
+              "fontStyle": "normal",
+              "fontWeight": "600",
+            },
+          ]
+        }
+        weight="SemiBold"
+      >
+        Banner title
+      </Text>
+      <View
+        style={
+          {
+            "height": 4,
+          }
+        }
+      />
+      <View
+        pointerEvents="none"
+      >
+        <View
+          style={
+            {
+              "height": 4,
+            }
+          }
+        />
+        <View
+          accessibilityRole="button"
+          accessibilityState={
+            {
+              "busy": undefined,
+              "checked": undefined,
+              "disabled": false,
+              "expanded": undefined,
+              "selected": undefined,
+            }
+          }
+          accessibilityValue={
+            {
+              "max": undefined,
+              "min": undefined,
+              "now": undefined,
+              "text": undefined,
+            }
+          }
+          accessible={true}
+          collapsable={false}
+          focusable={true}
+          hitSlop={
+            {
+              "bottom": 14,
+              "left": 24,
+              "right": 24,
+              "top": 14,
+            }
+          }
+          onBlur={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onResponderGrant={[Function]}
+          onResponderMove={[Function]}
+          onResponderRelease={[Function]}
+          onResponderTerminate={[Function]}
+          onResponderTerminationRequest={[Function]}
+          onStartShouldSetResponder={[Function]}
+          style={
+            {
+              "alignSelf": "flex-start",
+            }
+          }
+        >
+          <View
+            style={
+              [
+                {
+                  "alignItems": "center",
+                  "elevation": 0,
+                  "flexDirection": "row",
+                  "justifyContent": "center",
+                  "textAlignVertical": "center",
+                },
+                false,
+                {},
+                {
+                  "transform": [
+                    {
+                      "scale": undefined,
+                    },
+                  ],
+                },
+              ]
+            }
+          >
+            <Text
+              ellipsizeMode="tail"
+              numberOfLines={1}
+              style={
+                [
+                  {
+                    "fontFamily": "Readex Pro",
+                    "fontSize": 16,
+                    "fontStyle": "normal",
+                    "fontWeight": "400",
+                  },
+                  {
+                    "color": "#0B3EE3",
+                  },
+                  {
+                    "color": undefined,
+                  },
+                ]
+              }
+            >
+              Action text
+            </Text>
+          </View>
+        </View>
+      </View>
+    </View>
+    <View
+      style={
+        [
+          {
+            "marginRight": -16,
+          },
+          {
+            "alignSelf": "center",
+          },
+        ]
+      }
+    >
+      <RNSVGSvgView
+        align="xMidYMid"
+        bbHeight={80}
+        bbWidth={80}
+        focusable={false}
+        height={80}
+        meetOrSlice={0}
+        minX={0}
+        minY={0}
+        style={
+          [
+            {
+              "backgroundColor": "transparent",
+              "borderWidth": 0,
+            },
+            {
+              "flex": 0,
+              "height": 80,
+              "width": 80,
+            },
+          ]
+        }
+        vbHeight={240}
+        vbWidth={240}
+        width={80}
+      >
+        <RNSVGGroup>
+          <RNSVGPath
+            clipRule={0}
+            d="M147.212 192.138c.852.489 1.722.687 2.557.688 1.688-.002 3.239-.8 4.178-1.531 7.01-3.154 96.182-35.614 99.267-36.674h.001l.189-.065-1.328-3.835-.574.197c-5.355 1.842-93.089 33.823-99.504 36.809-.155.077-.319.189-.457.301 0 0-.006.004-.015.011h-.001c-.157.12-1.433 1.085-2.287.591-1.146-.68-6.407-6.424 2.924-52.883 4.407-21.91 2.285-38.661-6.295-49.7966-10.504-13.6464-27.726-14.7298-33.383-15.0824l-.888-.0516c-3.536.0774-11.8661.7223-12.832 5.1851-.6467 2.9494 1.932 5.8989 8.503 9.5534-12.1766.4299-28.967 2.4593-35.0553 9.9833-.0776.1032-.1466.2063-.2069.3181-.6037 1.1179-1.1901 3.5084.3794 5.3917.4798.573 1.161 1.147 2.2752 1.557-2.1345 1.696-3.9916 3.899-3.8706 6.38.207 4.187 5.5364 5.984 7.287 6.569.1294.043.2587.078.3967.095.1811.026 1.7075.206 4.0963.206l-.0087.009c1.4315 0 3.1716-.066 5.1144-.271-.581 2.115-.8166 4.783.629 6.892 1.3194 1.935 3.6737 2.898 6.9248 2.898l.0087-.009c.8537 0 1.7678-.06 2.7509-.198 1.8857-.095 5.7711-.365 9.6731-1.091-3.196 15.023-15.1229 77.882 4.582 96.651 1.561 2.063 15.359 19.055 45.05 19.055v.008c15.574 0 65.53-14.678 90.374-28.642l-2-3.534C138 262 121 220.936 115.442 218.433c-.086-.12-.181-.232-.284-.326-19.07-17.837-5.227-85.166-3.106-94.877 2.869-.886 5.268-2.124 6.21-3.856l-3.579-1.934c-1 1.84-9.71 3.525-17.0745 3.903-3.0701.422-5.2432.069-5.9417-.945-.8383-1.215-.129-3.711.5702-5.31 3.7122-.764 7.786-2.086 11.701-4.33l-2.026-3.517c-9.8141 5.624-21.1456 4.764-22.7496 4.609-3.1218-1.083-4.2773-2.21-4.3118-2.855-.0756-1.499 3.5311-4.206 6.9223-5.792 3.4963-.397 8.28-1.458 14.887-3.5632l-1.2418-3.8609c-17.3595 5.5291-19.8 2.9924-19.9035 2.8807-.138-.1634-.0518-.5504.0259-.7653 6.5712-7.6702 29.8555-8.3581 36.8925-8.3839 1.285-.0086 2.38-.8857 2.664-2.1326.285-1.2726-.336-2.5624-1.517-3.13-10.487-5.0561-10.849-7.3434-10.849-7.3434.483-.9373 4.915-1.9433 8.779-2.0379l.724.0516.008.0004c5.757.3615 21.029 1.3204 30.408 13.4998 7.83 10.1639 9.693 25.8227 5.528 46.5287-10.391 51.726-3.295 55.841-.966 57.191Z"
+            fill={4278927075}
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+          <RNSVGPath
+            d="M89.9306 0C76.0999 0 64.8867 11.1786 64.8867 24.9668 64.8867 11.1786 53.6769 0 39.8462 0c-.2464 0-.4929.00332-.7393.00996C21.2631.52456 11.9649 21.5073 23.268 35.2822l32.1174 39.1467c4.9122 5.986 14.0938 5.986 19.006 0l32.1176-39.1467C117.809 21.5073 108.51.52457 90.6666.00996A27.44628 27.44628 0 0 0 89.9273 0h.0033Z"
+            fill={4289392367}
+            propList={
+              [
+                "fill",
+              ]
+            }
+          />
+          <RNSVGPath
+            clipRule={0}
+            d="M87.1816 7.87002c0-.72428.5872-1.31143 1.3115-1.31143 5.9448 0 10.2533 2.29037 13.0539 5.63291 2.77 3.3058 3.994 7.5532 3.994 11.4157 0 .7242-.587 1.3114-1.311 1.3114s-1.311-.5872-1.311-1.3114c0-3.3505-1.07-6.9716-3.3825-9.7312-2.2813-2.7228-5.8413-4.69455-11.0434-4.69455-.7243 0-1.3115-.58715-1.3115-1.31143Z"
+            fill={4278240714}
+            fillRule={0}
+            propList={
+              [
+                "fill",
+                "fillRule",
+              ]
+            }
+          />
+        </RNSVGGroup>
+      </RNSVGSvgView>
+    </View>
+  </View>
+</View>
+`;

package/lib/module/components/banner/__test__/banner.test.js

@@ -0,0 +1,23 @@
+import React from "react";
+import { Alert } from "react-native";
+import * as TestRenderer from "react-test-renderer";
+import { Banner } from "../Banner";
+const viewRef = /*#__PURE__*/React.createRef();
+const onLinkPress = () => {
+  Alert.alert("Alert", "Action triggered");
+};
+describe("Test Banner Components", () => {
+  it("Banner Snapshot", () => {
+    const advice = TestRenderer.create( /*#__PURE__*/React.createElement(Banner, {
+      viewRef: viewRef,
+      color: "neutral",
+      size: "big",
+      title: "Banner title",
+      pictogramName: "donation",
+      action: "Action text",
+      onPress: onLinkPress
+    })).toJSON();
+    expect(advice).toMatchSnapshot();
+  });
+});
+//# sourceMappingURL=banner.test.js.map

package/lib/module/components/banner/__test__/banner.test.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Alert","TestRenderer","Banner","viewRef","createRef","onLinkPress","alert","describe","it","advice","create","createElement","color","size","title","pictogramName","action","onPress","toJSON","expect","toMatchSnapshot"],"sourceRoot":"../../../../../src","sources":["components/banner/__test__/banner.test.tsx"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK,QAAc,cAAc;AAC1C,OAAO,KAAKC,YAAY,MAAM,qBAAqB;AACnD,SAASC,MAAM,QAAQ,WAAW;AAElC,MAAMC,OAAO,gBAAGJ,KAAK,CAACK,SAAS,CAAO,CAAC;AACvC,MAAMC,WAAW,GAAGA,CAAA,KAAM;EACxBL,KAAK,CAACM,KAAK,CAAC,OAAO,EAAE,kBAAkB,CAAC;AAC1C,CAAC;AAEDC,QAAQ,CAAC,wBAAwB,EAAE,MAAM;EACvCC,EAAE,CAAC,iBAAiB,EAAE,MAAM;IAC1B,MAAMC,MAAM,GAAGR,YAAY,CAACS,MAAM,eAACX,KAAA,CAAAY,aAAA,CAACT,MAAM;MACxCC,OAAO,EAAEA,OAAQ;MACjBS,KAAK,EAAC,SAAS;MACfC,IAAI,EAAC,KAAK;MACVC,KAAK,EAAC,cAAc;MACpBC,aAAa,EAAC,UAAU;MACxBC,MAAM,EAAC,aAAa;MACpBC,OAAO,EAAEZ;IAAY,CACtB,CAAC,CAAC,CAACa,MAAM,CAAC,CAAC;IACZC,MAAM,CAACV,MAAM,CAAC,CAACW,eAAe,CAAC,CAAC;EAClC,CAAC,CAAC;AACJ,CAAC,CAAC"}

package/lib/module/components/banner/index.js

@@ -0,0 +1,2 @@
+export * from "./Banner";
+//# sourceMappingURL=index.js.map

package/lib/module/components/banner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/banner/index.tsx"],"mappings":"AAAA,cAAc,UAAU"}

package/lib/module/components/buttons/ButtonExtendedOutline.js

@@ -0,0 +1,77 @@
+import React, { useCallback } from "react";
+import { Pressable, StyleSheet, View } from "react-native";
+import Animated, { Extrapolate, interpolate, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring } from "react-native-reanimated";
+import { Icon } from "../icons";
+import { H4, LabelSmall } from "../typography";
+import { IOScaleValues, IOSpringValues, IOColors, IOStyles } from "../../core";
+const styles = StyleSheet.create({
+  button: {
+    flex: 1,
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingHorizontal: 16,
+    paddingVertical: 16,
+    borderRadius: 8,
+    borderColor: IOColors.bluegreyLight,
+    backgroundColor: IOColors.white,
+    borderStyle: "solid",
+    borderWidth: 1
+  }
+});
+export const ButtonExtendedOutline = _ref => {
+  var _IOScaleValues$magnif;
+  let {
+    label,
+    description,
+    onPress,
+    icon = "info"
+  } = _ref;
+  const isPressed = useSharedValue(0);
+
+  // Scaling transformation applied when the button is pressed
+  const animationScaleValue = IOScaleValues === null || IOScaleValues === void 0 ? void 0 : (_IOScaleValues$magnif = IOScaleValues.magnifiedButton) === null || _IOScaleValues$magnif === void 0 ? void 0 : _IOScaleValues$magnif.pressedState;
+  const scaleTraversed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
+
+  // Interpolate animation values from `isPressed` values
+  const animatedStyle = useAnimatedStyle(() => {
+    const scale = interpolate(scaleTraversed.value, [0, 1], [1, animationScaleValue], Extrapolate.CLAMP);
+    return {
+      transform: [{
+        scale
+      }]
+    };
+  });
+  const onPressIn = useCallback(() => {
+    // eslint-disable-next-line functional/immutable-data
+    isPressed.value = 1;
+  }, [isPressed]);
+  const onPressOut = useCallback(() => {
+    // eslint-disable-next-line functional/immutable-data
+    isPressed.value = 0;
+  }, [isPressed]);
+  return /*#__PURE__*/React.createElement(Pressable, {
+    onPress: onPress,
+    onPressIn: onPressIn,
+    onPressOut: onPressOut,
+    accessible: true,
+    accessibilityRole: "button"
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    style: [styles.button, animatedStyle]
+  }, /*#__PURE__*/React.createElement(View, {
+    style: IOStyles.flex
+  }, /*#__PURE__*/React.createElement(H4, null, label), description && /*#__PURE__*/React.createElement(LabelSmall, {
+    weight: "Regular",
+    color: "bluegreyDark"
+  }, description)), /*#__PURE__*/React.createElement(View, {
+    style: {
+      marginLeft: 8
+    }
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: icon,
+    color: "blue",
+    size: 24
+  }))));
+};
+export default ButtonExtendedOutline;
+//# sourceMappingURL=ButtonExtendedOutline.js.map

package/lib/module/components/buttons/ButtonExtendedOutline.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","Pressable","StyleSheet","View","Animated","Extrapolate","interpolate","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","Icon","H4","LabelSmall","IOScaleValues","IOSpringValues","IOColors","IOStyles","styles","create","button","flex","flexDirection","alignItems","justifyContent","paddingHorizontal","paddingVertical","borderRadius","borderColor","bluegreyLight","backgroundColor","white","borderStyle","borderWidth","ButtonExtendedOutline","_ref","_IOScaleValues$magnif","label","description","onPress","icon","isPressed","animationScaleValue","magnifiedButton","pressedState","scaleTraversed","value","animatedStyle","scale","CLAMP","transform","onPressIn","onPressOut","createElement","accessible","accessibilityRole","style","weight","color","marginLeft","name","size"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonExtendedOutline.tsx"],"mappings":"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"}

package/lib/module/components/buttons/ButtonLink.js

@@ -0,0 +1,167 @@
+import React, { useCallback } from "react";
+import { Pressable, StyleSheet } from "react-native";
+import Animated, { Extrapolate, interpolate, interpolateColor, useAnimatedProps, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring } from "react-native-reanimated";
+import { makeFontStyleObject } from "../../utils/fonts";
+import { AnimatedIcon, IconClassComponent } from "../icons/Icon";
+import { HSpacer } from "../spacer/Spacer";
+import { IOScaleValues, IOSpringValues, IOColors, IOButtonStyles } from "../../core";
+const mapColorStates = {
+  // Primary button
+  primary: {
+    label: {
+      default: IOColors["blueIO-500"],
+      pressed: IOColors["blueIO-600"],
+      disabled: IOColors["grey-700"]
+    }
+  },
+  error: {
+    label: {
+      default: IOColors["error-850"],
+      pressed: IOColors["error-850"],
+      disabled: IOColors["grey-700"]
+    }
+  },
+  warning: {
+    label: {
+      default: IOColors["warning-850"],
+      pressed: IOColors["warning-850"],
+      disabled: IOColors["grey-700"]
+    }
+  },
+  success: {
+    label: {
+      default: IOColors["success-850"],
+      pressed: IOColors["success-850"],
+      disabled: IOColors["grey-700"]
+    }
+  },
+  info: {
+    label: {
+      default: IOColors["info-850"],
+      pressed: IOColors["info-850"],
+      disabled: IOColors["grey-700"]
+    }
+  }
+};
+const DISABLED_OPACITY = 0.5;
+const IOButtonStylesLocal = StyleSheet.create({
+  label: {
+    fontSize: 16,
+    ...makeFontStyleObject("Regular", false, "ReadexPro")
+  }
+});
+export const ButtonLink = /*#__PURE__*/React.memo(_ref => {
+  var _IOScaleValues$basicB, _mapColorStates$color, _mapColorStates$color2, _mapColorStates$color3, _mapColorStates$color4, _mapColorStates$color5, _mapColorStates$color6, _mapColorStates$color7, _mapColorStates$color8;
+  let {
+    color = "primary",
+    label,
+    disabled = false,
+    icon,
+    iconPosition = "start",
+    onPress,
+    accessibilityLabel,
+    accessibilityHint,
+    testID
+  } = _ref;
+  const isPressed = useSharedValue(0);
+
+  // Scaling transformation applied when the button is pressed
+  const animationScaleValue = IOScaleValues === null || IOScaleValues === void 0 ? void 0 : (_IOScaleValues$basicB = IOScaleValues.basicButton) === null || _IOScaleValues$basicB === void 0 ? void 0 : _IOScaleValues$basicB.pressedState;
+
+  // Using a spring-based animation for our interpolations
+  const progressPressed = useDerivedValue(() => withSpring(isPressed.value, IOSpringValues.button));
+
+  // Interpolate animation values from `isPressed` values
+  const pressedAnimationStyle = useAnimatedStyle(() => {
+    // Link color states to the pressed states
+
+    // Scale down button slightly when pressed
+    const scale = interpolate(progressPressed.value, [0, 1], [1, animationScaleValue], Extrapolate.CLAMP);
+    return {
+      transform: [{
+        scale
+      }]
+    };
+  });
+  const pressedColorLabelAnimationStyle = useAnimatedStyle(() => {
+    // Link color states to the pressed states
+
+    /* ◀ REMOVE_LEGACY_COMPONENT: Remove the following condition */
+    const labelColor = interpolateColor(progressPressed.value, [0, 1], [mapColorStates[color].label.default, mapColorStates[color].label.pressed]);
+    return {
+      color: labelColor
+    };
+  });
+
+  // Animate the <Icon> color prop
+  const pressedColorIconAnimationStyle = useAnimatedProps(() => {
+    const iconColor = interpolateColor(progressPressed.value, [0, 1], [mapColorStates[color].label.default, mapColorStates[color].label.pressed]);
+    return {
+      color: iconColor
+    };
+  });
+  const AnimatedIconClassComponent = Animated.createAnimatedComponent(IconClassComponent);
+  const onPressIn = useCallback(() => {
+    // eslint-disable-next-line functional/immutable-data
+    isPressed.value = 1;
+  }, [isPressed]);
+  const onPressOut = useCallback(() => {
+    // eslint-disable-next-line functional/immutable-data
+    isPressed.value = 0;
+  }, [isPressed]);
+
+  // Icon size
+  const iconSize = 24;
+  return /*#__PURE__*/React.createElement(Pressable, {
+    accessibilityLabel: accessibilityLabel,
+    accessibilityHint: accessibilityHint,
+    accessibilityRole: "button",
+    testID: testID,
+    onPress: onPress,
+    onPressIn: onPressIn,
+    onPressOut: onPressOut,
+    accessible: true,
+    disabled: disabled,
+    hitSlop: {
+      top: 14,
+      right: 24,
+      bottom: 14,
+      left: 24
+    },
+    style: IOButtonStyles.dimensionsDefault
+  }, /*#__PURE__*/React.createElement(Animated.View, {
+    style: [IOButtonStyles.buttonLink, iconPosition === "end" && {
+      flexDirection: "row-reverse"
+    }, disabled ? {
+      opacity: DISABLED_OPACITY
+    } : {},
+    /* Prevent Reanimated from overriding background colors
+    if button is disabled */
+    !disabled && pressedAnimationStyle]
+  }, icon && /*#__PURE__*/React.createElement(React.Fragment, null, !disabled ? /*#__PURE__*/React.createElement(AnimatedIconClassComponent, {
+    name: icon,
+    animatedProps: pressedColorIconAnimationStyle,
+    color: (_mapColorStates$color = mapColorStates[color]) === null || _mapColorStates$color === void 0 ? void 0 : (_mapColorStates$color2 = _mapColorStates$color.label) === null || _mapColorStates$color2 === void 0 ? void 0 : _mapColorStates$color2.default,
+    size: iconSize
+  }) : /*#__PURE__*/React.createElement(AnimatedIcon, {
+    name: icon,
+    color: (_mapColorStates$color3 = mapColorStates[color]) === null || _mapColorStates$color3 === void 0 ? void 0 : (_mapColorStates$color4 = _mapColorStates$color3.label) === null || _mapColorStates$color4 === void 0 ? void 0 : _mapColorStates$color4.disabled,
+    size: iconSize
+  }), /*#__PURE__*/React.createElement(HSpacer, {
+    size: 8
+  })), /*#__PURE__*/React.createElement(Animated.Text, {
+    style: [IOButtonStylesLocal.label, disabled ? {
+      color: (_mapColorStates$color5 = mapColorStates[color]) === null || _mapColorStates$color5 === void 0 ? void 0 : (_mapColorStates$color6 = _mapColorStates$color5.label) === null || _mapColorStates$color6 === void 0 ? void 0 : _mapColorStates$color6.disabled
+    } : {
+      color: (_mapColorStates$color7 = mapColorStates[color]) === null || _mapColorStates$color7 === void 0 ? void 0 : (_mapColorStates$color8 = _mapColorStates$color7.label) === null || _mapColorStates$color8 === void 0 ? void 0 : _mapColorStates$color8.default
+    }, !disabled && pressedColorLabelAnimationStyle],
+    numberOfLines: 1,
+    ellipsizeMode: "tail"
+    /* A11y-related props:
+    DON'T UNCOMMENT THEM */
+    /* allowFontScaling
+    maxFontSizeMultiplier={1.3} */
+  }, label)));
+});
+export default ButtonLink;
+//# sourceMappingURL=ButtonLink.js.map

package/lib/module/components/buttons/ButtonLink.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useCallback","Pressable","StyleSheet","Animated","Extrapolate","interpolate","interpolateColor","useAnimatedProps","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","makeFontStyleObject","AnimatedIcon","IconClassComponent","HSpacer","IOScaleValues","IOSpringValues","IOColors","IOButtonStyles","mapColorStates","primary","label","default","pressed","disabled","error","warning","success","info","DISABLED_OPACITY","IOButtonStylesLocal","create","fontSize","ButtonLink","memo","_ref","_IOScaleValues$basicB","_mapColorStates$color","_mapColorStates$color2","_mapColorStates$color3","_mapColorStates$color4","_mapColorStates$color5","_mapColorStates$color6","_mapColorStates$color7","_mapColorStates$color8","color","icon","iconPosition","onPress","accessibilityLabel","accessibilityHint","testID","isPressed","animationScaleValue","basicButton","pressedState","progressPressed","value","button","pressedAnimationStyle","scale","CLAMP","transform","pressedColorLabelAnimationStyle","labelColor","pressedColorIconAnimationStyle","iconColor","AnimatedIconClassComponent","createAnimatedComponent","onPressIn","onPressOut","iconSize","createElement","accessibilityRole","accessible","hitSlop","top","right","bottom","left","style","dimensionsDefault","View","buttonLink","flexDirection","opacity","Fragment","name","animatedProps","size","Text","numberOfLines","ellipsizeMode"],"sourceRoot":"../../../../src","sources":["components/buttons/ButtonLink.tsx"],"mappings":"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"}