@ledgerhq/native-ui 0.9.0-nightly.1 → 0.9.0-nightly.2

package/lib/components/Layout/Divider/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="styled-components-react-native" />
+declare const Divider: import("styled-components").StyledComponent<typeof import("react-native").View, import("styled-components").DefaultTheme, import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("styled-system").FlexboxProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").PositionProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").ColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("styled-system").LayoutProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").OverflowProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").BorderProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>> & import("styled-system").BackgroundProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>> & {
+    columnGap?: string | number | undefined;
+    rowGap?: string | number | undefined;
+    color?: string | undefined;
+    display?: string | undefined;
+    position?: string | undefined;
+    maxHeight?: number | undefined;
+} & {
+    my: number;
+    height: number;
+    backgroundColor: string;
+}, "height" | "backgroundColor" | "my">;
+export default Divider;

package/lib/components/Layout/Divider/index.js

@@ -0,0 +1,8 @@
+import { Flex } from "../index";
+import styled from "styled-components/native";
+const Divider = styled(Flex).attrs(() => ({
+    my: 4,
+    height: 1,
+    backgroundColor: "neutral.c40",
+})) ``;
+export default Divider;

package/lib/components/Layout/index.d.ts

@@ -1,6 +1,7 @@
 export { default as Accordion } from "./Collapse/Accordion";
 export { default as Flex } from "./Flex";
 export { default as Box } from "./Box";
+export { default as Divider } from "./Divider";
 export * from "./Modals";
 export { default as ScrollContainer } from "./ScrollContainer";
 export { default as ScrollContainerHeader } from "./ScrollContainerHeader";

package/lib/components/Layout/index.js

@@ -1,6 +1,7 @@
 export { default as Accordion } from "./Collapse/Accordion";
 export { default as Flex } from "./Flex";
 export { default as Box } from "./Box";
+export { default as Divider } from "./Divider";
 export * from "./Modals";
 export { default as ScrollContainer } from "./ScrollContainer";
 export { default as ScrollContainerHeader } from "./ScrollContainerHeader";

package/lib/components/tags/Tag/index.d.ts

@@ -1,8 +1,11 @@
 import React from "react";
 import { FlexBoxProps } from "../../Layout/Flex";
+import { IconType } from "../../Icon/type";
 export interface TagProps extends FlexBoxProps {
-    active?: boolean;
+    type?: "shade" | "color" | "warning";
+    size?: "small" | "medium";
+    Icon?: IconType;
     uppercase?: boolean;
-    children: React.ReactNode;
+    children?: React.ReactNode;
 }
-export default function Tag({ active, uppercase, children, ...props }: TagProps): JSX.Element;
+export default function Tag({ type, size, uppercase, Icon, children, ...props }: TagProps): JSX.Element;

package/lib/components/tags/Tag/index.js

@@ -12,8 +12,16 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from "react";
 import Flex from "../../Layout/Flex";
 import Text from "../../Text";
+import { Box } from "../../Layout";
+const typeColor = {
+    color: "primary.c80",
+    shade: "neutral.c30",
+    warning: "warning.c100",
+};
 export default function Tag(_a) {
-    var { active, uppercase, children } = _a, props = __rest(_a, ["active", "uppercase", "children"]);
-    return (React.createElement(Flex, Object.assign({ px: 2, alignItems: "center", justifyContent: "center", borderRadius: 4, borderWidth: 1, borderColor: active ? "primary.c50" : "neutral.c40" }, props),
-        React.createElement(Text, { variant: "tiny", fontWeight: "semiBold", lineHeight: "16px", uppercase: uppercase !== false, textAlign: "center", color: active ? "primary.c70" : "neutral.c80" }, children)));
+    var { type = "shade", size = "small", uppercase, Icon, children } = _a, props = __rest(_a, ["type", "size", "uppercase", "Icon", "children"]);
+    return (React.createElement(Flex, Object.assign({ px: size === "small" ? "6px" : 3, alignItems: "center", justifyContent: "center", flexDirection: "row", borderRadius: 6, bg: typeColor[type], height: size === "small" ? "18px" : "28px" }, props),
+        Icon && (React.createElement(Box, { pr: 2 },
+            React.createElement(Icon, { size: size === "small" ? 16 : 20, color: type === "shade" ? "neutral.c90" : "neutral.c00" }))),
+        React.createElement(Text, { variant: size === "small" ? "subtitle" : "small", fontWeight: "bold", uppercase: uppercase !== false, textAlign: "center", color: type === "shade" ? "neutral.c90" : "neutral.c00" }, children)));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.9.0-nightly.1",
+  "version": "0.9.0-nightly.2",
   "description": "Ledger Live - Mobile UI",
   "repository": {
     "type": "git",