@ledgerhq/native-ui 0.33.0-nightly.0 → 0.33.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.
@@ -10,12 +10,14 @@ export type QuickActionButtonProps = TouchableOpacityProps & BaseStyledProps & {
10
10
  onPressWhenDisabled?: TouchableOpacityProps["onPress"];
11
11
  textVariant?: TextVariants;
12
12
  variant?: Variant;
13
+ isActive?: boolean;
13
14
  };
14
15
  export declare const StyledText: import("styled-components").StyledComponent<({ children, bracket, textAlign, testID, ...props }: import("../../../Text").BaseTextProps) => React.JSX.Element, import("styled-components").DefaultTheme, {}, never>;
15
16
  export declare const Base: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<TouchableOpacityProps & React.RefAttributes<import("react-native").View>>, import("styled-components").DefaultTheme, TouchableOpacityProps & {
16
17
  visuallyDisabled?: boolean | undefined;
17
18
  variant: Variant;
19
+ isActive?: boolean | undefined;
18
20
  }, never>;
19
- declare const QuickActionButton: ({ Icon, children, disabled, onPress, onPressWhenDisabled, textVariant, variant, testID, ...otherProps }: QuickActionButtonProps) => React.ReactElement;
21
+ declare const QuickActionButton: ({ Icon, children, disabled, onPress, onPressWhenDisabled, textVariant, variant, testID, isActive, ...otherProps }: QuickActionButtonProps) => React.ReactElement;
20
22
  export default QuickActionButton;
21
23
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/cta/QuickAction/QuickActionButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAoB,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAEvE,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAmB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,KAAK,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAEjC,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,GACxD,eAAe,GAAG;IAChB,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mBAAmB,CAAC,EAAE,qBAAqB,CAAC,SAAS,CAAC,CAAC;IACvD,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEJ,eAAO,MAAM,UAAU,oNAGtB,CAAC;AAEF,eAAO,MAAM,IAAI;;aACgD,OAAO;SAcvE,CAAC;AAEF,QAAA,MAAM,iBAAiB,4GAUpB,sBAAsB,KAAG,MAAM,YA6BjC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/cta/QuickAction/QuickActionButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAoB,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAEvE,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACpD,OAAmB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAC9D,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAExD,KAAK,OAAO,GAAG,OAAO,GAAG,OAAO,CAAC;AAEjC,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,GACxD,eAAe,GAAG;IAChB,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,mBAAmB,CAAC,EAAE,qBAAqB,CAAC,SAAS,CAAC,CAAC;IACvD,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEJ,eAAO,MAAM,UAAU,oNAGtB,CAAC;AAEF,eAAO,MAAM,IAAI;;aACgD,OAAO;;SAmBvE,CAAC;AAEF,QAAA,MAAM,iBAAiB,sHAWpB,sBAAsB,KAAG,MAAM,YA8BjC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
@@ -12,18 +12,26 @@ export const Base = baseStyled(TouchableOpacity) `
12
12
  text-align: center;
13
13
  align-items: center;
14
14
  justify-content: center;
15
- border-radius: ${(p) => p.theme.radii[2]}px;
15
+ border-radius: ${({ isActive, theme }) => (isActive ? 14 : theme.radii[2])}px;
16
16
  padding: ${({ theme, variant }) => variant === "small" ? `${theme.space[3]}px ${theme.space[2]}px` : `0 ${theme.space[6]}px`};
17
- ${({ visuallyDisabled, theme }) => visuallyDisabled
18
- ? `border: 1px solid ${theme.colors.neutral.c30};`
19
- : `background-color: ${theme.colors.neutral.c20};`}
17
+ ${({ visuallyDisabled, isActive, theme }) => {
18
+ if (visuallyDisabled) {
19
+ return `border: 1px solid ${theme.colors.neutral.c30};`;
20
+ }
21
+ else if (isActive) {
22
+ return `background-color: ${theme.colors.neutral.c30};`;
23
+ }
24
+ else {
25
+ return `background-color: ${theme.colors.neutral.c20};`;
26
+ }
27
+ }}
20
28
  `;
21
- const QuickActionButton = ({ Icon, children, disabled, onPress, onPressWhenDisabled, textVariant = "body", variant = "large", testID, ...otherProps }) => {
29
+ const QuickActionButton = ({ Icon, children, disabled, onPress, onPressWhenDisabled, textVariant = "body", variant = "large", testID, isActive = true, ...otherProps }) => {
22
30
  const text = // Extract the text to use it as a testID
23
31
  React.isValidElement(children) && children.props?.i18nKey
24
32
  ? children.props.i18nKey.split(".").pop() // Extract the last part of the key
25
33
  : children?.toString().toLowerCase();
26
- return (React.createElement(Base, { disabled: onPressWhenDisabled ? false : disabled, onPress: disabled ? onPressWhenDisabled : onPress, visuallyDisabled: disabled, variant: variant, ...otherProps, testID: `${testID}-${text}` },
34
+ return (React.createElement(Base, { disabled: onPressWhenDisabled ? false : disabled, onPress: disabled ? onPressWhenDisabled : onPress, visuallyDisabled: disabled, variant: variant, isActive: !disabled && isActive, ...otherProps, testID: `${testID}-${text}` },
27
35
  React.createElement(Icon, { size: variant === "small" ? 20 : 24, color: disabled ? "neutral.c50" : "neutral.c100" }),
28
36
  React.createElement(StyledText, { numberOfLines: 1, variant: textVariant, fontWeight: "semiBold", color: disabled ? "neutral.c50" : "neutral.c100", mt: 2 }, children)));
29
37
  };
@@ -4,7 +4,8 @@ import { QuickActionButtonProps } from "../QuickActionButton";
4
4
  export type QuickActionListProps = Omit<FlatListProps<QuickActionButtonProps>, "renderItem"> & {
5
5
  id: string;
6
6
  testID?: string;
7
+ isActive?: boolean;
7
8
  };
8
- declare const QuickActionList: ({ numColumns, data, id, testID, ...otherProps }: QuickActionListProps) => React.ReactElement;
9
+ declare const QuickActionList: ({ numColumns, data, id, testID, isActive, ...otherProps }: QuickActionListProps) => React.ReactElement;
9
10
  export default QuickActionList;
10
11
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/cta/QuickAction/QuickActionList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAY,aAAa,EAAE,MAAM,cAAc,CAAC;AAEvD,OAA0B,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAEjF,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,aAAa,CAAC,sBAAsB,CAAC,EAAE,YAAY,CAAC,GAAG;IAC7F,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,QAAA,MAAM,eAAe,oDAMlB,oBAAoB,KAAG,MAAM,YA0B/B,CAAC;AAEF,eAAe,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/cta/QuickAction/QuickActionList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAY,aAAa,EAAE,MAAM,cAAc,CAAC;AAEvD,OAA0B,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAC;AAEjF,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,aAAa,CAAC,sBAAsB,CAAC,EAAE,YAAY,CAAC,GAAG;IAC7F,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,eAAe,8DAOlB,oBAAoB,KAAG,MAAM,YA2B/B,CAAC;AAEF,eAAe,eAAe,CAAC"}
@@ -1,9 +1,9 @@
1
1
  import React, { useCallback } from "react";
2
2
  import { FlatList } from "react-native";
3
3
  import QuickActionButton from "../QuickActionButton";
4
- const QuickActionList = ({ numColumns = 3, data, id, testID, ...otherProps }) => {
4
+ const QuickActionList = ({ numColumns = 3, data, id, testID, isActive = false, ...otherProps }) => {
5
5
  const renderItem = useCallback(({ item, index }) => {
6
- return (React.createElement(QuickActionButton, { ...item, flex: 1, mr: (index + 1) % numColumns > 0 && data && index !== data.length - 1 ? 4 : 0, mb: data?.length && index + numColumns < data.length ? 4 : 0, testID: testID }));
6
+ return (React.createElement(QuickActionButton, { ...item, isActive: isActive, flex: 1, mr: (index + 1) % numColumns > 0 && data && index !== data.length - 1 ? 4 : 0, mb: data?.length && index + numColumns < data.length ? 4 : 0, testID: testID }));
7
7
  }, []);
8
8
  return (React.createElement(FlatList, { ...otherProps, data: data, keyExtractor: (_item, index) => `${id}${index}`, horizontal: false, renderItem: renderItem, numColumns: numColumns }));
9
9
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ledgerhq/native-ui",
3
- "version": "0.33.0-nightly.0",
3
+ "version": "0.33.0",
4
4
  "description": "Ledger Live - Mobile UI",
5
5
  "repository": {
6
6
  "type": "git",
@@ -39,8 +39,8 @@
39
39
  "react-native-modal": "^13.0.0",
40
40
  "rn-range-slider": "2.1.1",
41
41
  "styled-system": "^5.1.5",
42
- "@ledgerhq/icons-ui": "^0.9.0",
43
42
  "@ledgerhq/crypto-icons-ui": "^1.12.0",
43
+ "@ledgerhq/icons-ui": "^0.9.0",
44
44
  "@ledgerhq/ui-shared": "^0.3.0"
45
45
  },
46
46
  "peerDependencies": {