@ledgerhq/native-ui 0.36.0-nightly.0 → 0.36.0-nightly.1

package/lib/components/Icon/type.d.ts

@@ -5,7 +5,7 @@ export type IconProps = {
 };
 export type IconType = React.ComponentType<IconProps>;
 export type NewIconProps = {
-    size?: "XS" | "S" | "M" | "L" | "XL";
+    size?: "XS" | "S" | "M" | "L" | "XL" | "XXL";
     color?: string;
     style?: object;
 };

package/lib/components/Icon/type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAC1D,MAAM,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;AAEtD,MAAM,MAAM,YAAY,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACpG,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;AAE5D,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,KAAK,CAAC,YAAY,CAAC;AAC9D,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG,KAAK,CAAC,YAAY,CAAC"}
+{"version":3,"file":"type.d.ts","sourceRoot":"","sources":["../../../src/components/Icon/type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAC1D,MAAM,MAAM,QAAQ,GAAG,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;AAEtD,MAAM,MAAM,YAAY,GAAG;IACzB,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AACF,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;AAE5D,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,KAAK,CAAC,YAAY,CAAC;AAC9D,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAAG,KAAK,CAAC,YAAY,CAAC"}

package/lib/components/cta/QuickAction/QuickActionList/index.d.ts.map

@@ -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,EAAQ,MAAM,cAAc,CAAC;AAE7D,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,YA6B/B,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"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,EAAQ,MAAM,cAAc,CAAC;AAE7D,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,YA0B/B,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/cta/QuickAction/QuickActionList/index.js

@@ -3,14 +3,11 @@ import { FlatList, View } from "react-native";
 import QuickActionButton from "../QuickActionButton";
 const QuickActionList = ({ numColumns = 3, data, id, testID, isActive = false, ...otherProps }) => {
     const renderItem = useCallback(({ item, index }) => {
-        const isNotLastColumn = (index + 1) % numColumns > 0;
-        const isNotLastItem = data && index !== data.length - 1;
-        const hasButtonToItsRight = isNotLastColumn && isNotLastItem;
         const hasRowBelow = data?.length && index + numColumns < data.length;
-        const mr = hasButtonToItsRight ? 4 : 0;
         const mb = hasRowBelow ? 4 : 0;
-        return (React.createElement(View, { style: { flex: 1, minHeight: 30 } },
-            React.createElement(QuickActionButton, { ...item, isActive: isActive, mr: mr, mb: mb, testID: testID })));
+        const mh = 6;
+        return (React.createElement(View, { style: { flex: 1, minHeight: 30, marginHorizontal: mh } },
+            React.createElement(QuickActionButton, { ...item, isActive: isActive, mb: mb, testID: testID })));
     }, []);
     return (React.createElement(FlatList, { ...otherProps, data: data, keyExtractor: (_item, index) => `${id}${index}`, horizontal: false, renderItem: renderItem, numColumns: numColumns }));
 };

package/lib/pre-ldls/components/Input/Input.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import { TextInput } from "react-native";
+export type IconProps = {
+    size?: "XS" | "S" | "M" | "L" | "XL" | "XXL";
+    color?: string;
+    style?: object;
+};
+export declare const Input: React.ForwardRefExoticComponent<import("react-native").TextInputProps & {
+    icon?: (({ size }: IconProps) => JSX.Element) | undefined;
+} & React.RefAttributes<TextInput>>;
+//# sourceMappingURL=Input.d.ts.map

package/lib/pre-ldls/components/Input/Input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAQ,MAAM,cAAc,CAAC;AAI/C,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAkCF,eAAO,MAAM,KAAK;uBA/BE,SAAS,KAAK,WAAW;mCA2C3C,CAAC"}

package/lib/pre-ldls/components/Input/Input.js

@@ -0,0 +1,38 @@
+import React, { useContext } from "react";
+import { TextInput, View } from "react-native";
+import styled, { ThemeContext } from "styled-components/native";
+import { useTokens } from "../../libs";
+const Wrapper = styled(View) `
+  height: 40px;
+  min-width: 328px;
+  padding-horizontal: ${({ tokens }) => tokens["spacing-s"]}px;
+  align-items: center;
+  flex-direction: row;
+  gap: ${({ tokens }) => tokens["spacing-xxs"]}px;
+  border-radius: ${({ tokens }) => tokens["radius-s"]}px;
+  background-color: ${({ tokens }) => tokens["colors-surface-transparent-subdued-default"]};
+  overflow: hidden;
+  color: ${({ tokens }) => tokens["colors-content-subdued-default-default"]};
+`;
+const StyledInput = styled(TextInput) `
+  flex: 1;
+  background-color: transparent;
+  border-width: 0;
+  color: ${({ tokens }) => tokens["colors-content-subdued-default-default"]};
+`;
+const TOKEN_KEYS = [
+    "spacing-s",
+    "spacing-xxs",
+    "radius-s",
+    "colors-surface-transparent-subdued-default",
+    "colors-content-subdued-default-default",
+];
+export const Input = React.forwardRef(({ icon: Icon, ...props }, ref) => {
+    const theme = useContext(ThemeContext);
+    const themeType = theme?.colors?.type ?? "light";
+    const tokens = useTokens(themeType, [...TOKEN_KEYS]);
+    return (React.createElement(Wrapper, { tokens: tokens },
+        !!Icon && React.createElement(Icon, { color: String(tokens["colors-content-subdued-default-default"]) }),
+        React.createElement(StyledInput, { ...props, ref: ref, tokens: tokens })));
+});
+Input.displayName = "Input";

package/lib/pre-ldls/components/Input/Input.stories.d.ts

@@ -0,0 +1,9 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Input } from "./Input";
+declare const meta: Meta<typeof Input>;
+export default meta;
+type Story = StoryObj<typeof Input>;
+export declare const Default: Story;
+export declare const Search: Story;
+export declare const WithInteraction: Story;
+//# sourceMappingURL=Input.stories.d.ts.map

package/lib/pre-ldls/components/Input/Input.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.stories.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAIvD,OAAO,EAAE,KAAK,EAAa,MAAM,SAAS,CAAC;AAE3C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,KAAK,CAK5B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,KAAK,CAAC,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAKpB,CAAC;AAGF,eAAO,MAAM,eAAe,EAAE,KAU7B,CAAC"}

package/lib/pre-ldls/components/Input/Input.stories.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { within, userEvent } from "@storybook/testing-library";
+import { expect } from "@storybook/jest";
+import { Icons } from "../../../assets";
+import { Input } from "./Input";
+const meta = {
+    component: Input,
+    title: "PreLdls/Components/Input",
+    tags: ["autodocs"],
+    args: {},
+};
+export default meta;
+export const Default = {
+    args: {},
+};
+export const Search = {
+    args: {
+        placeholder: "Search",
+        icon: (props) => React.createElement(Icons.Search, { size: "S", ...props }),
+    },
+};
+// Interaction Testing
+export const WithInteraction = {
+    args: {},
+    controls: { expanded: true },
+    play: async ({ canvasElement }) => {
+        const canvas = within(canvasElement);
+        const input = canvas.getByRole("textbox");
+        await userEvent.type(input, "Write something");
+        expect(input).toHaveValue("Write something");
+    },
+};

package/lib/pre-ldls/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Input/Input";
+//# sourceMappingURL=index.d.ts.map

package/lib/pre-ldls/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/lib/pre-ldls/components/index.js

@@ -0,0 +1 @@
+export * from "./Input/Input";

package/lib/pre-ldls/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./components";
+//# sourceMappingURL=index.d.ts.map

package/lib/pre-ldls/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/pre-ldls/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/lib/pre-ldls/index.js

@@ -0,0 +1 @@
+export * from "./components";