@ledgerhq/native-ui 0.7.16 → 0.7.18-nightly.0

package/{components → lib/components}/cta/Button/index.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="styled-components-react-native" />
 import React from "react";
-import { TouchableOpacity, TouchableOpacityProps } from "react-native";
+import { TouchableHighlight, TouchableHighlightProps } from "react-native";
 import { BaseStyledProps } from "../../styled";
-export declare type ButtonProps = TouchableOpacityProps & BaseStyledProps & {
+export declare type ButtonProps = TouchableHighlightProps & BaseStyledProps & {
     Icon?: React.ComponentType<{
         size: number;
         color: string;
@@ -18,7 +18,7 @@ export declare type ButtonProps = TouchableOpacityProps & BaseStyledProps & {
     pending?: boolean;
     displayContentWhenPending?: boolean;
 };
-export declare const Base: import("styled-components").StyledComponent<typeof TouchableOpacity, import("styled-components").DefaultTheme, {
+export declare const Base: import("styled-components").StyledComponent<typeof TouchableHighlight, import("styled-components").DefaultTheme, {
     iconButton?: boolean | undefined;
     sizeVariant?: ButtonProps["size"];
 } & Omit<ButtonProps, "size">, never>;

package/{components → lib/components}/cta/Button/index.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import React, { useCallback, useState, useMemo } from "react";
 import styled, { useTheme } from "styled-components/native";
-import { ActivityIndicator, TouchableOpacity } from "react-native";
+import { ActivityIndicator, TouchableHighlight, View } from "react-native";
 import { buttonSizeStyle, getButtonColorStyle } from "../../cta/Button/getButtonStyle";
 import { ctaIconSize, ctaTextType } from "../../cta/getCtaStyle";
 import Text from "../../Text";
@@ -18,7 +18,7 @@ import baseStyled from "../../styled";
 const IconContainer = styled.View `
   ${(p) => p.iconButton ? "" : p.iconPosition === "left" ? `margin-right: 10px;` : `margin-left: 10px;`}
 `;
-export const Base = baseStyled(TouchableOpacity).attrs((p) => (Object.assign(Object.assign({}, getButtonColorStyle(p.theme.colors, p).button), { 
+export const Base = baseStyled(TouchableHighlight).attrs((p) => (Object.assign(Object.assign({}, getButtonColorStyle(p.theme.colors, p).button), { 
     // Avoid conflict with styled-system's size property by nulling size and renaming it
     size: undefined, sizeVariant: p.size }))) `
 
@@ -71,10 +71,11 @@ const ButtonContainer = (props) => {
 const Button = (props) => {
     const { Icon, children, type = "default", iconName, disabled = false, pending = false, displayContentWhenPending = false, } = props;
     const theme = useTheme();
-    return (React.createElement(Base, Object.assign({}, props, { type: type, iconButton: (!!Icon || !!iconName) && !children, activeOpacity: 0.5, disabled: disabled || pending }),
-        React.createElement(ButtonContainer, Object.assign({}, props, { type: type, hide: pending && !displayContentWhenPending })),
-        pending && !displayContentWhenPending ? (React.createElement(SpinnerContainer, { displayContentWhenPending: displayContentWhenPending },
-            React.createElement(ActivityIndicator, { color: theme.colors.neutral.c50, animating: true }))) : null));
+    return (React.createElement(Base, Object.assign({}, props, { type: type, iconButton: (!!Icon || !!iconName) && !children, activeOpacity: 1, disabled: disabled || pending }),
+        React.createElement(View, null,
+            React.createElement(ButtonContainer, Object.assign({}, props, { type: type, hide: pending && !displayContentWhenPending })),
+            pending && !displayContentWhenPending ? (React.createElement(SpinnerContainer, { displayContentWhenPending: displayContentWhenPending },
+                React.createElement(ActivityIndicator, { color: theme.colors.neutral.c50, animating: true }))) : null)));
 };
 export const PromisableButton = (props) => {
     const { Icon, children, onPress, type = "main", disabled = false, iconName } = props;
@@ -92,8 +93,9 @@ export const PromisableButton = (props) => {
         }
     }), [onPress]);
     return (React.createElement(Base, Object.assign({}, props, { type: type, iconButton: (!!Icon || !!iconName) && !children, disabled: disabled || spinnerOn, onPress: onPressHandler }),
-        React.createElement(ButtonContainer, Object.assign({}, props, { type: type, hide: spinnerOn })),
-        React.createElement(SpinnerContainer, null,
-            React.createElement(ActivityIndicator, { color: theme.colors.neutral.c50, animating: spinnerOn }))));
+        React.createElement(View, null,
+            React.createElement(ButtonContainer, Object.assign({}, props, { type: type, hide: spinnerOn })),
+            React.createElement(SpinnerContainer, null,
+                React.createElement(ActivityIndicator, { color: theme.colors.neutral.c50, animating: spinnerOn })))));
 };
 export default Button;

package/{components → lib/components}/styled.js

@@ -6,7 +6,10 @@ const proxyStyled = new Proxy(styled, {
         return styled(target.apply(thisArg, argumentsList)(baseStyles));
     },
     get(target, property) {
-        return styled(target[property].apply(styled, [baseStyles]));
+        if (typeof target[property] === "function") {
+            return styled(target[property].apply(styled, [baseStyles]));
+        }
+        return target[property];
     },
 });
 export default proxyStyled;

package/package.json

@@ -1,29 +1,41 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.7.16",
-  "description": "Ledger Live - React Native UI",
+  "version": "0.7.18-nightly.0",
+  "description": "Ledger Live - Mobile UI",
   "repository": "https://github.com/LedgerHQ/ui",
   "license": "MIT",
   "author": "Ledger Live Team <team-live@ledger.fr>",
+  "main": "lib/index.js",
+  "types": "index.d.ts",
+  "typesVersions": {
+    "*": {
+      "*": [
+        "lib/*",
+        "lib/*/index.d.ts",
+        "./*"
+      ]
+    }
+  },
+  "exports": {
+    ".": "./lib/index.js",
+    "./": "./lib/",
+    "./package.json": "./package.json"
+  },
   "files": [
-    "components",
-    "assets",
-    "styles",
-    "helpers",
-    "icons",
-    "index.d.ts",
-    "index.js"
+    "lib/**/*"
   ],
   "dependencies": {
-    "@ledgerhq/icons-ui": "^0.2.4",
-    "@ledgerhq/ui-shared": "^0.1.6",
-    "@types/color": "^3.0.2",
-    "@types/react": "^17.0.37",
+    "@ledgerhq/icons-ui": "^0.2.5-nightly.0",
+    "@ledgerhq/ui-shared": "^0.1.8-nightly.0",
+    "@types/color": "^3.0.3",
+    "@types/react": "^17.0.39",
     "@types/react-native": "^0.65.9",
+    "@types/styled-components": "^5.1.3",
     "@types/styled-components-react-native": "^5.1.3",
     "@types/styled-system": "^5.1.13",
     "color": "^3.1.3",
     "moment": "^2.29.1",
+    "react-native-animatable": "^1.3.3",
     "react-native-modal": "^13.0.0",
     "rn-range-slider": "^2.1.1",
     "styled-system": "^5.1.5",
@@ -31,9 +43,109 @@
   },
   "peerDependencies": {
     "react": "^17.0.2",
-    "react-native": "^0.65.0",
-    "react-native-reanimated": "^2.2.4",
+    "react-native": ">=0.64.0",
+    "react-native-reanimated": "~2.3.1",
     "react-native-svg": "^12.1.1",
     "styled-components": "^5.3.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.17.4",
+    "@babel/generator": "^7.17.2",
+    "@babel/plugin-proposal-export-namespace-from": "^7.16.0",
+    "@babel/preset-env": "^7.15.8",
+    "@babel/runtime": "^7.17.2",
+    "@emotion/core": "^11.0.0",
+    "@expo/webpack-config": "^0.16.18",
+    "@react-native-community/cli-server-api": "^7.0.3",
+    "@react-native-community/eslint-config": "^3.0.1",
+    "@storybook/addon-actions": "^6.4.19",
+    "@storybook/addon-backgrounds": "^6.4.19",
+    "@storybook/addon-controls": "^6.4.19",
+    "@storybook/addon-docs": "^6.4.19",
+    "@storybook/addon-essentials": "^6.4.19",
+    "@storybook/addon-knobs": "^6.4.0",
+    "@storybook/addon-links": "^6.4.19",
+    "@storybook/addon-measure": "^6.4.19",
+    "@storybook/addon-ondevice-actions": "^5.3.23",
+    "@storybook/addon-ondevice-knobs": "^5.3.25",
+    "@storybook/addon-outline": "^6.4.19",
+    "@storybook/addon-toolbars": "^6.4.19",
+    "@storybook/addon-viewport": "^6.4.19",
+    "@storybook/addons": "^6.4.19",
+    "@storybook/api": "^6.4.19",
+    "@storybook/components": "^6.4.19",
+    "@storybook/core-events": "^6.4.19",
+    "@storybook/react": "^6.4.19",
+    "@storybook/react-native": "^5.3.25",
+    "@storybook/theming": "^6.4.19",
+    "@svgr/core": "^5.5.0",
+    "@svgr/plugin-jsx": "^5.5.0",
+    "@svgr/plugin-svgo": "^5.5.0",
+    "@types/hoist-non-react-statics": "^3.3.1",
+    "@types/node": "^17.0.31",
+    "@types/prop-types": "^15.7.5",
+    "@typescript-eslint/eslint-plugin": "^5.22.0",
+    "@typescript-eslint/parser": "^5.22.0",
+    "babel-loader": "^8.2.2",
+    "babel-plugin-module-resolver": "^4.1.0",
+    "babel-preset-expo": "^9.0.2",
+    "camelcase": "^6.2.1",
+    "csstype": "^3.0.11",
+    "eslint": "^8.10.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.29.2",
+    "eslint-plugin-react-hooks": "^4.3.0",
+    "expo": "~44.0.0",
+    "expo-asset": "~8.4.6",
+    "expo-cli": "^5",
+    "expo-constants": "~13.0.2",
+    "expo-file-system": "~13.1.3",
+    "expo-font": "^10.0.5",
+    "expo-modules-core": "0.6.5",
+    "expo-status-bar": "~1.2.0",
+    "fs-extra": "^10.0.1",
+    "glob": "^7.2.0",
+    "metro": "^0.67.0",
+    "metro-config": "^0.67.0",
+    "metro-extra-config": "1.0.0",
+    "metro-minify-uglify": "^0.67.0",
+    "metro-react-native-babel-preset": "^0.67.0",
+    "metro-runtime": "^0.67.0",
+    "metro-transform-worker": "^0.67.0",
+    "prettier": "^2.4.1",
+    "prop-types": "^15.8.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-is": "^17.0.2",
+    "react-native": "0.64.3",
+    "react-native-gesture-handler": "^1.10.3",
+    "react-native-reanimated": "~2.3.1",
+    "react-native-svg": "^12.1.1",
+    "react-native-web": "~0.17.5",
+    "regenerator-runtime": "^0.13.9",
+    "rimraf": "^3.0.2",
+    "styled-components": "^5.3.3",
+    "typescript": "^4.4.4",
+    "victory": "^35.5.5",
+    "webpack": "^4.46.0"
+  },
+  "scripts": {
+    "android": "expo start --android",
+    "build": "tsc -p tsconfig.prod.json && node scripts/postBuild",
+    "prebuild:storybook": "pnpm -F ui-shared -F icons-ui build",
+    "build:storybook": "pnpm build-storybook -o web-build",
+    "watch": "tsc -p tsconfig.prod.json --watch",
+    "clean": "rimraf lib",
+    "eject": "expo eject",
+    "ios": "expo start --ios",
+    "lint": "eslint src storybook --ext .ts,.tsx,.js,.jsx --cache",
+    "lint:fix": "pnpm lint --fix",
+    "release": "yarn publish ./lib --access public",
+    "expo": "expo start",
+    "storybook": "start-storybook -p 6006",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "test": "exit 0",
+    "web": "expo start --web"
   }
 }