@ledgerhq/native-ui 0.36.0 → 0.37.0

package/lib/components/Layout/List/VerticalTimeline/TimelineItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/List/VerticalTimeline/TimelineItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAM3C,OAAO,EAAE,IAAI,EAAc,MAAM,UAAU,CAAC;AAM5C,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,EAAE,IAAI,CAAC;IACX,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC,CAAC;AA8BF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,IAAI,EACJ,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,cAAc,EACd,KAAK,EACL,2BAA2B,GAC5B,EAAE,KAAK,qBAuFP"}
+{"version":3,"file":"TimelineItem.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/List/VerticalTimeline/TimelineItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAM3C,OAAO,EAAE,IAAI,EAAc,MAAM,UAAU,CAAC;AAM5C,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,EAAE,IAAI,CAAC;IACX,mBAAmB,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC,CAAC;AA+BF,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,IAAI,EACJ,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,cAAc,EACd,KAAK,EACL,2BAA2B,GAC5B,EAAE,KAAK,qBAwFP"}

package/lib/components/Layout/List/VerticalTimeline/TimelineItem.js

@@ -33,6 +33,7 @@ const Container = styled(Flex) `
   background: ${(p) => getContainerBackground(p.theme, p.status)};
   border: 1px solid ${(p) => getContainerBorder(p.theme, p.status, p.isLastItem)};
   padding: 20px 16px;
+  overflow: hidden;
 `;
 export default function TimelineItem({ item, formatEstimatedTime, isFirstItem, isLastItem, setActiveIndex, index, withExtraMarginOnActiveStep, }) {
     const theme = useTheme();
@@ -64,6 +65,7 @@ export default function TimelineItem({ item, formatEstimatedTime, isFirstItem, i
                     ? TimelineIndicator.topSegmentDefaultHeight + theme.space[4]
                     : undefined }),
             React.createElement(Container, { status: item.status, isLastItem: isLastItem, mt: withExtraMarginOnActiveStep && !isFirstItem && item.status === "active" ? 4 : 0, mb: withExtraMarginOnActiveStep && !isLastItem && item.status === "active" ? 4 : 0 },
+                item.status === "active" ? item.background : null,
                 React.createElement(Flex, { flexDirection: "row", justifyContent: "space-between" },
                     React.createElement(Text, { variant: "body", fontWeight: item.status === "active" ? "semiBold" : "medium", flexShrink: 1, color: item.status === "completed" && isLastItem
                             ? "success.c70"

package/lib/components/Layout/List/types.d.ts

@@ -11,5 +11,6 @@ export type Item = {
     estimatedTime?: number;
     progress?: number;
     renderBody?: (isDisplayed?: boolean) => ReactNode;
+    background?: ReactNode;
 };
 //# sourceMappingURL=types.d.ts.map

package/lib/components/Layout/List/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/List/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,oBAAY,UAAU;IACpB,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,SAAS,cAAc;CACxB;AAED,MAAM,MAAM,IAAI,GAAG;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,OAAO,KAAK,SAAS,CAAC;CACnD,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/List/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,oBAAY,UAAU;IACpB,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,SAAS,cAAc;CACxB;AAED,MAAM,MAAM,IAAI,GAAG;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,OAAO,KAAK,SAAS,CAAC;IAClD,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB,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";