@ledgerhq/native-ui 0.7.12 → 0.7.15

package/components/Form/SelectableList.js

@@ -10,10 +10,10 @@ const ElementContainer = styled(Flex).attrs({
 function Element(props) {
     const { first, value, selected, disabled, onPress, children, Icon, renderRight: RenderRight, } = props;
     return (React.createElement(TouchableOpacity, { onPress: onPress, disabled: disabled },
-        React.createElement(ElementContainer, { p: 6, mt: first ? 0 : 4, backgroundColor: selected ? "primary.c20" : "neutral.c00", border: "1px solid", borderColor: selected ? "primary.c100" : "neutral.c40", borderRadius: 1, flexDirection: "row", alignItems: "center" },
+        React.createElement(ElementContainer, { p: 6, mt: first ? 0 : 4, backgroundColor: selected ? "primary.c20" : "transparent", border: "1px solid", borderColor: selected ? "primary.c50" : "neutral.c40", borderRadius: 1, flexDirection: "row", alignItems: "center" },
             Icon && (React.createElement(Flex, { mr: 6, flexShrink: 0 },
-                React.createElement(Icon, { size: 24, color: disabled ? "neutral.c50" : "neutral.c100" }))),
-            React.createElement(Text, { variant: "large", flex: 1, color: disabled ? "neutral.c50" : "neutral.c100" }, children || value),
+                React.createElement(Icon, { size: 24, color: disabled ? "neutral.c50" : selected ? "primary.c90" : "neutral.c100" }))),
+            React.createElement(Text, { variant: "large", flex: 1, color: disabled ? "neutral.c50" : selected ? "primary.c90" : "neutral.c100" }, children || value),
             RenderRight && (React.createElement(Flex, { pl: 6, flexShrink: 0 }, React.isValidElement(RenderRight) ? RenderRight : React.createElement(RenderRight, Object.assign({}, props)))))));
 }
 function SelectableList({ currentValue, onChange, children }) {

package/components/Text/getTextStyle.js

@@ -3,6 +3,7 @@ const bracketSizes = {
     h2: 28,
     h3: 20,
     h4: 18,
+    h5: 18,
     large: 20,
     body: 20,
     bodyLineHeight: 20,
@@ -37,7 +38,9 @@ export function getTextTypeStyle({ bracket }) {
         },
         h4: {
             fontFamily: "Inter",
-            textTransform: "uppercase",
+        },
+        h5: {
+            fontFamily: "Inter",
         },
         large: {
             fontFamily: "Inter",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.7.12",
+  "version": "0.7.15",
   "description": "Ledger Live - React Native UI",
   "repository": "https://github.com/LedgerHQ/ui",
   "license": "MIT",
@@ -15,7 +15,7 @@
     "index.js"
   ],
   "dependencies": {
-    "@ledgerhq/icons-ui": "^0.2.3",
+    "@ledgerhq/icons-ui": "^0.2.4",
     "@ledgerhq/ui-shared": "^0.1.6",
     "@types/color": "^3.0.2",
     "@types/react": "^17.0.37",

package/styles/theme.d.ts

@@ -1,6 +1,6 @@
 import { ColorPalette } from "@ledgerhq/ui-shared";
 export declare const space: number[];
-export declare type TextVariants = "h1" | "h2" | "h3" | "h4" | "large" | "body" | "bodyLineHeight" | "paragraph" | "paragraphLineHeight" | "small" | "subtitle" | "tiny";
+export declare type TextVariants = "h1" | "h2" | "h3" | "h4" | "h5" | "large" | "body" | "bodyLineHeight" | "paragraph" | "paragraphLineHeight" | "small" | "subtitle" | "tiny";
 export declare type ThemeScale<Type, Aliases extends string> = Array<Type> & Record<Aliases, Type>;
 export declare const fontSizes: ThemeScale<number, TextVariants>;
 export declare const radii: number[];

package/styles/theme.js

@@ -16,7 +16,8 @@ export const fontSizes = [10, 11, 12, 13, 14, 16, 18, 24, 28];
 ] = fontSizes;
 fontSizes.bodyLineHeight = fontSizes.body;
 fontSizes.paragraphLineHeight = fontSizes.paragraph;
-fontSizes.h4 = fontSizes.h3;
+fontSizes.h4 = fontSizes.h2;
+fontSizes.h5 = fontSizes.h3;
 export const radii = [0, 4, 8];
 export const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1000];
 const theme = {