@ledgerhq/react-ui 0.10.0 → 0.10.1-next.0

package/lib/assets/logos/LedgerLiveAltRegular.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-declare type Props = {
+type Props = {
     width?: number | string;
     height?: number | string;
     color?: string;

package/lib/assets/logos/LedgerLiveRegular.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-declare type Props = {
+type Props = {
     width?: number | string;
     height?: number | string;
     color?: string;

package/lib/cjs/components/asorted/Icon/FlagIcon.js

@@ -26,7 +26,7 @@ __export(exports, {
   iconNames: () => iconNames,
   sizes: () => sizes
 });
-var flags = __toModule(require("@ledgerhq/icons-ui/react/_Flags/index"));
+var flags = __toModule(require("@ledgerhq/icons-ui/react/Flags/index"));
 var import_react = __toModule(require("react"));
 const sizes = {
   XXS: 16,

package/lib/cjs/components/asorted/Icon/FlagIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/asorted/Icon/FlagIcon.tsx"],
-  "sourcesContent": ["import * as flags from \"@ledgerhq/icons-ui/react/_Flags/index\";\nimport React from \"react\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type FlagsSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: FlagsSizes;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(flags).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nconst FlagIcon = ({ name, size = \"S\" }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n  if (maybeIconName in flags) {\n    // @ts-expect-error FIXME I don't know how to make you happy ts\n    const Component = flags[maybeIconName];\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default FlagIcon;\n"],
+  "sourcesContent": ["import * as flags from \"@ledgerhq/icons-ui/react/Flags/index\";\nimport React from \"react\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type FlagsSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: FlagsSizes;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(flags).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nconst FlagIcon = ({ name, size = \"S\" }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n  if (maybeIconName in flags) {\n    // @ts-expect-error FIXME I don't know how to make you happy ts\n    const Component = flags[maybeIconName];\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default FlagIcon;\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;AACvB,mBAAkB;AAEX,MAAM,QAAQ;AAAA,EACnB,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA;AAUC,MAAM,YAAY,MAAM,KAC7B,OAAO,KAAK,OAAO,OAAO,CAAC,KAAK,WAAW;AACzC,QAAM,MAAM,OACT,QAAQ,iDAAiD,MACzD,QAAQ,kBAAkB;AAC7B,MAAI,CAAC,IAAI,IAAI;AAAM,QAAI,IAAI;AAC3B,SAAO;AAAA,GACN,IAAI;AAGT,MAAM,WAAW,CAAC,EAAE,MAAM,OAAO,UAAqC;AACpE,QAAM,gBAAgB,GAAG;AACzB,MAAI,iBAAiB,OAAO;AAE1B,UAAM,YAAY,MAAM;AACxB,WAAO,mDAAC,WAAD;AAAA,MAAW,MAAM,MAAM;AAAA;AAAA;AAEhC,SAAO;AAAA;AAGT,IAAO,mBAAQ;",
   "names": []
 }

package/lib/cjs/components/asorted/Icon/PaymentIcon.js

@@ -26,7 +26,7 @@ __export(exports, {
   iconNames: () => iconNames,
   sizes: () => sizes
 });
-var paymentProviders = __toModule(require("@ledgerhq/icons-ui/react/_Payment/index"));
+var paymentProviders = __toModule(require("@ledgerhq/icons-ui/react/Payment/index"));
 var import_react = __toModule(require("react"));
 const sizes = {
   XXS: 16,

package/lib/cjs/components/asorted/Icon/PaymentIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/asorted/Icon/PaymentIcon.tsx"],
-  "sourcesContent": ["import * as paymentProviders from \"@ledgerhq/icons-ui/react/_Payment/index\";\n\nimport React from \"react\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type PaymentIconSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: PaymentIconSizes;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(paymentProviders).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nexport type IconGetterProps = {\n  search: string;\n  object: Record<string, React.ReactNode>;\n};\n\nconst getIconCaseInsensitive = ({ search, object }: IconGetterProps) => {\n  const asLower = search.toLowerCase();\n  const key = Object.keys(object).find((key) => key.toLowerCase() === asLower);\n  return key ? object[key] : null;\n};\n\nconst PaymentIcon = ({ name, size = \"S\" }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n\n  const Component = getIconCaseInsensitive({\n    search: maybeIconName,\n    object: paymentProviders,\n  }) as React.ElementType;\n  if (Component) {\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default PaymentIcon;\n"],
+  "sourcesContent": ["import * as paymentProviders from \"@ledgerhq/icons-ui/react/Payment/index\";\n\nimport React from \"react\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type PaymentIconSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: PaymentIconSizes;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(paymentProviders).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nexport type IconGetterProps = {\n  search: string;\n  object: Record<string, React.ReactNode>;\n};\n\nconst getIconCaseInsensitive = ({ search, object }: IconGetterProps) => {\n  const asLower = search.toLowerCase();\n  const key = Object.keys(object).find((key) => key.toLowerCase() === asLower);\n  return key ? object[key] : null;\n};\n\nconst PaymentIcon = ({ name, size = \"S\" }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n\n  const Component = getIconCaseInsensitive({\n    search: maybeIconName,\n    object: paymentProviders,\n  }) as React.ElementType;\n  if (Component) {\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default PaymentIcon;\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAAkC;AAElC,mBAAkB;AAEX,MAAM,QAAQ;AAAA,EACnB,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA;AAUC,MAAM,YAAY,MAAM,KAC7B,OAAO,KAAK,kBAAkB,OAAO,CAAC,KAAK,WAAW;AACpD,QAAM,MAAM,OACT,QAAQ,iDAAiD,MACzD,QAAQ,kBAAkB;AAC7B,MAAI,CAAC,IAAI,IAAI;AAAM,QAAI,IAAI;AAC3B,SAAO;AAAA,GACN,IAAI;AAQT,MAAM,yBAAyB,CAAC,EAAE,QAAQ,aAA8B;AACtE,QAAM,UAAU,OAAO;AACvB,QAAM,MAAM,OAAO,KAAK,QAAQ,KAAK,CAAC,SAAQ,KAAI,kBAAkB;AACpE,SAAO,MAAM,OAAO,OAAO;AAAA;AAG7B,MAAM,cAAc,CAAC,EAAE,MAAM,OAAO,UAAqC;AACvE,QAAM,gBAAgB,GAAG;AAEzB,QAAM,YAAY,uBAAuB;AAAA,IACvC,QAAQ;AAAA,IACR,QAAQ;AAAA;AAEV,MAAI,WAAW;AACb,WAAO,mDAAC,WAAD;AAAA,MAAW,MAAM,MAAM;AAAA;AAAA;AAEhC,SAAO;AAAA;AAGT,IAAO,sBAAQ;",
   "names": []
 }

package/lib/cjs/components/asorted/Icon/ProviderIcon.js

@@ -26,10 +26,10 @@ __export(exports, {
   iconNames: () => iconNames,
   sizes: () => sizes
 });
-var providers = __toModule(require("@ledgerhq/icons-ui/react/_ProvidersLogos/index"));
-var favicons = __toModule(require("./providerFaviconsIndex"));
+var providers = __toModule(require("@ledgerhq/icons-ui/react/Providers/index"));
+var providersBoxed = __toModule(require("@ledgerhq/icons-ui/react/ProvidersBoxed/index"));
 var import_react = __toModule(require("react"));
-var import_styled_components = __toModule(require("styled-components"));
+var import_Flex = __toModule(require("../../layout/Flex"));
 const sizes = {
   XXS: 16,
   XS: 24,
@@ -39,27 +39,31 @@ const sizes = {
   XL: 56
 };
 const iconNames = Array.from(Object.keys(providers).reduce((set, rawKey) => {
-  const key = rawKey.replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, "$1").replace(/(.+)(Ultra)+$/g, "$1");
+  const key = rawKey.replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, "$1").replace(/(.+)(Ultra)+$/g, "$1").replace(/^_/, "");
   if (!set.has(key))
     set.add(key);
   return set;
 }, new Set()));
-const Favicon = import_styled_components.default.img`
-  border-radius: 8px;
-`;
 const getIconCaseInsensitive = ({ search, object }) => {
   const asLower = search.toLowerCase();
-  const key = Object.keys(object).find((key2) => key2.toLowerCase() === asLower);
+  const key = Object.keys(object).find((key2) => key2.toLowerCase().replace(/^_/, "") === asLower);
   return key ? object[key] : null;
 };
 const ProviderIcon = ({ name, size = "S", boxed = false }) => {
   const maybeIconName = `${name}`;
   if (boxed) {
-    return /* @__PURE__ */ import_react.default.createElement(Favicon, {
+    const BoxedComponent = getIconCaseInsensitive({
+      search: maybeIconName,
+      object: providersBoxed
+    });
+    return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
       width: sizes[size],
       height: sizes[size],
-      src: getIconCaseInsensitive({ search: maybeIconName, object: favicons })
-    });
+      borderRadius: 8,
+      overflow: "hidden"
+    }, /* @__PURE__ */ import_react.default.createElement(BoxedComponent, {
+      size: sizes[size]
+    }));
   }
   const Component = getIconCaseInsensitive({
     search: maybeIconName,

package/lib/cjs/components/asorted/Icon/ProviderIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/components/asorted/Icon/ProviderIcon.tsx"],
-  "sourcesContent": ["import * as providers from \"@ledgerhq/icons-ui/react/_ProvidersLogos/index\";\nimport * as favicons from \"./providerFaviconsIndex\";\n\nimport React from \"react\";\nimport styled from \"styled-components\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type ProviderSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: ProviderSizes;\n  boxed?: boolean;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(providers).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nconst Favicon = styled.img`\n  border-radius: 8px;\n`;\n\nexport type IconGetterProps = {\n  search: string;\n  object: Record<string, React.ReactNode>;\n};\n\nconst getIconCaseInsensitive = ({ search, object }: IconGetterProps) => {\n  const asLower = search.toLowerCase();\n  const key = Object.keys(object).find((key) => key.toLowerCase() === asLower);\n  return key ? object[key] : null;\n};\n\nconst ProviderIcon = ({ name, size = \"S\", boxed = false }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n\n  if (boxed) {\n    return (\n      <Favicon\n        width={sizes[size]}\n        height={sizes[size]}\n        src={getIconCaseInsensitive({ search: maybeIconName, object: favicons }) as string}\n      />\n    );\n  }\n  const Component = getIconCaseInsensitive({\n    search: maybeIconName,\n    object: providers,\n  }) as React.ElementType;\n  if (Component) {\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default ProviderIcon;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAA2B;AAC3B,eAA0B;AAE1B,mBAAkB;AAClB,+BAAmB;AAEZ,MAAM,QAAQ;AAAA,EACnB,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA;AAWC,MAAM,YAAY,MAAM,KAC7B,OAAO,KAAK,WAAW,OAAO,CAAC,KAAK,WAAW;AAC7C,QAAM,MAAM,OACT,QAAQ,iDAAiD,MACzD,QAAQ,kBAAkB;AAC7B,MAAI,CAAC,IAAI,IAAI;AAAM,QAAI,IAAI;AAC3B,SAAO;AAAA,GACN,IAAI;AAGT,MAAM,UAAU,iCAAO;AAAA;AAAA;AASvB,MAAM,yBAAyB,CAAC,EAAE,QAAQ,aAA8B;AACtE,QAAM,UAAU,OAAO;AACvB,QAAM,MAAM,OAAO,KAAK,QAAQ,KAAK,CAAC,SAAQ,KAAI,kBAAkB;AACpE,SAAO,MAAM,OAAO,OAAO;AAAA;AAG7B,MAAM,eAAe,CAAC,EAAE,MAAM,OAAO,KAAK,QAAQ,YAAuC;AACvF,QAAM,gBAAgB,GAAG;AAEzB,MAAI,OAAO;AACT,WACE,mDAAC,SAAD;AAAA,MACE,OAAO,MAAM;AAAA,MACb,QAAQ,MAAM;AAAA,MACd,KAAK,uBAAuB,EAAE,QAAQ,eAAe,QAAQ;AAAA;AAAA;AAInE,QAAM,YAAY,uBAAuB;AAAA,IACvC,QAAQ;AAAA,IACR,QAAQ;AAAA;AAEV,MAAI,WAAW;AACb,WAAO,mDAAC,WAAD;AAAA,MAAW,MAAM,MAAM;AAAA;AAAA;AAEhC,SAAO;AAAA;AAGT,IAAO,uBAAQ;",
+  "sourcesContent": ["import * as providers from \"@ledgerhq/icons-ui/react/Providers/index\";\nimport * as providersBoxed from \"@ledgerhq/icons-ui/react/ProvidersBoxed/index\";\n\nimport React from \"react\";\nimport FlexBox from \"../../layout/Flex\";\n\nexport const sizes = {\n  XXS: 16,\n  XS: 24,\n  S: 32,\n  M: 40,\n  L: 48,\n  XL: 56,\n};\n\nexport type ProviderSizes = keyof typeof sizes;\n\nexport type Props = {\n  name: string;\n  size?: ProviderSizes;\n  boxed?: boolean;\n};\n\nexport const iconNames = Array.from(\n  Object.keys(providers).reduce((set, rawKey) => {\n    const key = rawKey\n      .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, \"$1\")\n      .replace(/(.+)(Ultra)+$/g, \"$1\")\n      .replace(/^_/, \"\");\n    if (!set.has(key)) set.add(key);\n    return set;\n  }, new Set<string>()),\n);\n\nexport type IconGetterProps = {\n  search: string;\n  object: Record<string, React.ReactNode>;\n};\n\nconst getIconCaseInsensitive = ({ search, object }: IconGetterProps) => {\n  const asLower = search.toLowerCase();\n  const key = Object.keys(object).find((key) => key.toLowerCase().replace(/^_/, \"\") === asLower);\n  return key ? object[key] : null;\n};\n\nconst ProviderIcon = ({ name, size = \"S\", boxed = false }: Props): JSX.Element | null => {\n  const maybeIconName = `${name}`;\n\n  if (boxed) {\n    const BoxedComponent = getIconCaseInsensitive({\n      search: maybeIconName,\n      object: providersBoxed,\n    }) as React.ElementType;\n    return (\n      <FlexBox width={sizes[size]} height={sizes[size]} borderRadius={8} overflow={\"hidden\"}>\n        <BoxedComponent size={sizes[size]} />\n      </FlexBox>\n    );\n  }\n  const Component = getIconCaseInsensitive({\n    search: maybeIconName,\n    object: providers,\n  }) as React.ElementType;\n  if (Component) {\n    return <Component size={sizes[size]} />;\n  }\n  return null;\n};\n\nexport default ProviderIcon;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAA2B;AAC3B,qBAAgC;AAEhC,mBAAkB;AAClB,kBAAoB;AAEb,MAAM,QAAQ;AAAA,EACnB,KAAK;AAAA,EACL,IAAI;AAAA,EACJ,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,IAAI;AAAA;AAWC,MAAM,YAAY,MAAM,KAC7B,OAAO,KAAK,WAAW,OAAO,CAAC,KAAK,WAAW;AAC7C,QAAM,MAAM,OACT,QAAQ,iDAAiD,MACzD,QAAQ,kBAAkB,MAC1B,QAAQ,MAAM;AACjB,MAAI,CAAC,IAAI,IAAI;AAAM,QAAI,IAAI;AAC3B,SAAO;AAAA,GACN,IAAI;AAQT,MAAM,yBAAyB,CAAC,EAAE,QAAQ,aAA8B;AACtE,QAAM,UAAU,OAAO;AACvB,QAAM,MAAM,OAAO,KAAK,QAAQ,KAAK,CAAC,SAAQ,KAAI,cAAc,QAAQ,MAAM,QAAQ;AACtF,SAAO,MAAM,OAAO,OAAO;AAAA;AAG7B,MAAM,eAAe,CAAC,EAAE,MAAM,OAAO,KAAK,QAAQ,YAAuC;AACvF,QAAM,gBAAgB,GAAG;AAEzB,MAAI,OAAO;AACT,UAAM,iBAAiB,uBAAuB;AAAA,MAC5C,QAAQ;AAAA,MACR,QAAQ;AAAA;AAEV,WACE,mDAAC,qBAAD;AAAA,MAAS,OAAO,MAAM;AAAA,MAAO,QAAQ,MAAM;AAAA,MAAO,cAAc;AAAA,MAAG,UAAU;AAAA,OAC3E,mDAAC,gBAAD;AAAA,MAAgB,MAAM,MAAM;AAAA;AAAA;AAIlC,QAAM,YAAY,uBAAuB;AAAA,IACvC,QAAQ;AAAA,IACR,QAAQ;AAAA;AAEV,MAAI,WAAW;AACb,WAAO,mDAAC,WAAD;AAAA,MAAW,MAAM,MAAM;AAAA;AAAA;AAEhC,SAAO;AAAA;AAGT,IAAO,uBAAQ;",
   "names": []
 }

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

@@ -2,7 +2,7 @@
 import { ChartProps } from "react-chartjs-2";
 import "chartjs-adapter-moment";
 import type { Item, timeOptions } from "./types";
-export declare type Props = Omit<ChartProps, "type" | "data" | "options"> & {
+export type Props = Omit<ChartProps, "type" | "data" | "options"> & {
     data: Array<Item>;
     color: string;
     variant?: "default" | "small";

package/lib/components/Chart/types.d.ts

@@ -1,11 +1,11 @@
-export declare type Item = {
+export type Item = {
     date: Date;
     value?: number | string;
 } & {
     [key: string]: number | string;
 };
-declare type Unit = "millisecond" | "second" | "minute" | "hour" | "day" | "week" | "month" | "quarter" | "year";
-export declare type timeOptions = {
+type Unit = "millisecond" | "second" | "minute" | "hour" | "day" | "week" | "month" | "quarter" | "year";
+export type timeOptions = {
     unit?: Unit;
     displayFormats?: {
         [unit in Unit]?: string;

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

@@ -11,7 +11,7 @@ export interface ContainerProps extends ContainerExtraProps, GridProps {
 export declare const ExtraRowContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
     gridColumn: string;
 } & GridColumnProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>>, "gridColumn">;
-export declare type RowContainerProps = {
+export type RowContainerProps = {
     rowIndex: number;
 };
 export declare const RowContainer: import("styled-components").StyledComponent<"div", 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>>> & BorderProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>> & import("styled-system").OverflowProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & {

package/lib/components/Table/stories.helper.d.ts

@@ -1,5 +1,5 @@
 import { Column } from "./index";
-export declare type BalanceElement = {
+export type BalanceElement = {
     currency: string;
     amount: number;
     counterValue: number;
@@ -11,7 +11,7 @@ export declare const balance: {
     data: BalanceElement[];
     columns: Column<BalanceElement>[];
 };
-export declare type Account = {
+export type Account = {
     name: string;
     currency: {
         name: string;

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

@@ -2,9 +2,9 @@ import React from "react";
 import { BorderProps } from "styled-system";
 import { TextProps } from "../asorted/Text";
 import { BaseStyledProps } from "../styled";
-export declare type Size = "large" | "medium" | "small";
-export declare type Type = "plain" | "opacity" | "outlined" | "outlinedOpacity";
-export declare type TagProps = BaseStyledProps & BorderProps & React.PropsWithChildren<{
+export type Size = "large" | "medium" | "small";
+export type Type = "plain" | "opacity" | "outlined" | "outlinedOpacity";
+export type TagProps = BaseStyledProps & BorderProps & React.PropsWithChildren<{
     /**
      * Changes the appearance based on the active state.
      */

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type Props = {
+export type Props = {
     variant: "default" | "light";
 };
 declare const _default: ({ variant }: Props) => JSX.Element;

package/lib/components/asorted/Icon/BoxedIcon.d.ts

@@ -2,11 +2,11 @@ import React from "react";
 export declare const DEFAULT_BOX_SIZE = 40;
 export declare const DEFAULT_ICON_SIZE = 16;
 export declare const DEFAULT_BADGE_SIZE = 20;
-export declare type IconProps = {
+export type IconProps = {
     size?: number;
     color?: string;
 };
-export declare type IconBoxProps = {
+export type IconBoxProps = {
     /**
      * Component that takes `{size?: number; color?: string}` as props. Will be rendered at the top right with the size provided in `badgeSize` or a default size.
      */
@@ -29,7 +29,7 @@ export declare type IconBoxProps = {
      */
     size?: number;
 };
-export declare type BoxedIconProps = IconBoxProps & {
+export type BoxedIconProps = IconBoxProps & {
     /**
      * Component that takes `{size?: number; color?: string}` as props. Will be rendered at the top right with the size provided in `iconSize` or a default size.
      */

package/lib/components/asorted/Icon/CryptoIcon.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type Props = {
+export type Props = {
     name: string;
     size?: number;
     color?: string;

package/lib/components/asorted/Icon/FlagIcon.d.ts

@@ -7,8 +7,8 @@ export declare const sizes: {
     L: number;
     XL: number;
 };
-export declare type FlagsSizes = keyof typeof sizes;
-export declare type Props = {
+export type FlagsSizes = keyof typeof sizes;
+export type Props = {
     name: string;
     size?: FlagsSizes;
 };

package/lib/components/asorted/Icon/FlagIcon.js

@@ -1,4 +1,4 @@
-import * as flags from "@ledgerhq/icons-ui/react/_Flags/index";
+import * as flags from "@ledgerhq/icons-ui/react/Flags/index";
 import React from "react";
 export const sizes = {
     XXS: 16,

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type Props = {
+export type Props = {
     name: string;
     size?: number;
     weight?: "Regular" | "Thin" | "Light" | "Medium" | "UltraLight";

package/lib/components/asorted/Icon/PaymentIcon.d.ts

@@ -7,13 +7,13 @@ export declare const sizes: {
     L: number;
     XL: number;
 };
-export declare type PaymentIconSizes = keyof typeof sizes;
-export declare type Props = {
+export type PaymentIconSizes = keyof typeof sizes;
+export type Props = {
     name: string;
     size?: PaymentIconSizes;
 };
 export declare const iconNames: string[];
-export declare type IconGetterProps = {
+export type IconGetterProps = {
     search: string;
     object: Record<string, React.ReactNode>;
 };

package/lib/components/asorted/Icon/PaymentIcon.js

@@ -1,4 +1,4 @@
-import * as paymentProviders from "@ledgerhq/icons-ui/react/_Payment/index";
+import * as paymentProviders from "@ledgerhq/icons-ui/react/Payment/index";
 import React from "react";
 export const sizes = {
     XXS: 16,

package/lib/components/asorted/Icon/ProviderIcon.d.ts

@@ -7,14 +7,14 @@ export declare const sizes: {
     L: number;
     XL: number;
 };
-export declare type ProviderSizes = keyof typeof sizes;
-export declare type Props = {
+export type ProviderSizes = keyof typeof sizes;
+export type Props = {
     name: string;
     size?: ProviderSizes;
     boxed?: boolean;
 };
 export declare const iconNames: string[];
-export declare type IconGetterProps = {
+export type IconGetterProps = {
     search: string;
     object: Record<string, React.ReactNode>;
 };

package/lib/components/asorted/Icon/ProviderIcon.js

@@ -1,7 +1,7 @@
-import * as providers from "@ledgerhq/icons-ui/react/_ProvidersLogos/index";
-import * as favicons from "./providerFaviconsIndex";
+import * as providers from "@ledgerhq/icons-ui/react/Providers/index";
+import * as providersBoxed from "@ledgerhq/icons-ui/react/ProvidersBoxed/index";
 import React from "react";
-import styled from "styled-components";
+import FlexBox from "../../layout/Flex";
 export const sizes = {
     XXS: 16,
     XS: 24,
@@ -13,23 +13,26 @@ export const sizes = {
 export const iconNames = Array.from(Object.keys(providers).reduce((set, rawKey) => {
     const key = rawKey
         .replace(/(.+)(Regular|Light|UltraLight|Thin|Medium)+$/g, "$1")
-        .replace(/(.+)(Ultra)+$/g, "$1");
+        .replace(/(.+)(Ultra)+$/g, "$1")
+        .replace(/^_/, "");
     if (!set.has(key))
         set.add(key);
     return set;
 }, new Set()));
-const Favicon = styled.img `
-  border-radius: 8px;
-`;
 const getIconCaseInsensitive = ({ search, object }) => {
     const asLower = search.toLowerCase();
-    const key = Object.keys(object).find((key) => key.toLowerCase() === asLower);
+    const key = Object.keys(object).find((key) => key.toLowerCase().replace(/^_/, "") === asLower);
     return key ? object[key] : null;
 };
 const ProviderIcon = ({ name, size = "S", boxed = false }) => {
     const maybeIconName = `${name}`;
     if (boxed) {
-        return (React.createElement(Favicon, { width: sizes[size], height: sizes[size], src: getIconCaseInsensitive({ search: maybeIconName, object: favicons }) }));
+        const BoxedComponent = getIconCaseInsensitive({
+            search: maybeIconName,
+            object: providersBoxed,
+        });
+        return (React.createElement(FlexBox, { width: sizes[size], height: sizes[size], borderRadius: 8, overflow: "hidden" },
+            React.createElement(BoxedComponent, { size: sizes[size] })));
     }
     const Component = getIconCaseInsensitive({
         search: maybeIconName,

package/lib/components/asorted/Text/index.d.ts

@@ -1,7 +1,7 @@
 import { BaseStyledProps } from "../../styled";
 import { TextVariants } from "../../../styles/theme";
-declare type FontFamilies = "Inter|ExtraLight" | "Inter|Light" | "Inter|Regular" | "Inter|Medium" | "Inter|SemiBold" | "Inter|Bold" | "Inter|ExtraBold" | "Alpha|Medium";
-declare type WhiteSpace = "normal" | "nowrap" | "pre" | "pre-line" | "pre-wrap";
+type FontFamilies = "Inter|ExtraLight" | "Inter|Light" | "Inter|Regular" | "Inter|Medium" | "Inter|SemiBold" | "Inter|Bold" | "Inter|ExtraBold" | "Alpha|Medium";
+type WhiteSpace = "normal" | "nowrap" | "pre" | "pre-line" | "pre-wrap";
 export interface TextProps extends BaseStyledProps {
     fontFamily?: string;
     ff?: FontFamilies;

package/lib/components/cards/Carousel/Slide.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export declare type Props = {
+export type Props = {
     onClick: () => void;
     title: string;
     description: string;

package/lib/components/cards/Carousel/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { Props as SlideProps } from "./Slide";
-export declare type Props = {
+export type Props = {
     timeout?: number;
     queue: SlideProps[];
     isDismissed: boolean;

package/lib/components/cta/Button/index.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
 import { BaseStyledProps } from "../../styled";
 import { BordersProps } from "styled-system";
-export declare type ButtonVariants = "main" | "shade" | "error" | "color" | "neutral";
-export declare type IconPosition = "right" | "left";
+export type ButtonVariants = "main" | "shade" | "error" | "color" | "neutral";
+export type IconPosition = "right" | "left";
 interface BaseProps extends BaseStyledProps, BordersProps {
     ff?: string;
     color?: string;
@@ -39,7 +39,7 @@ declare const ButtonWithRef: {
         onToggle?: ((arg0: boolean) => void) | undefined;
     }, "overflow" | "p" | "style" | "key" | "color" | "children" | "onClick" | "variant" | "size" | "rowGap" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontSize" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "top" | "verticalAlign" | "whiteSpace" | "width" | "zIndex" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "margin" | "outline" | "padding" | "disabled" | "onToggle" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "bg" | "borderX" | "borderY" | "Icon" | "iconSize" | "ff" | "iconPosition" | "iconButton" | "iconName"> & React.RefAttributes<HTMLButtonElement>>;
 };
-export declare type ButtonExpandProps = React.PropsWithChildren<ButtonProps & {
+export type ButtonExpandProps = React.PropsWithChildren<ButtonProps & {
     onToggle?: (arg0: boolean) => void;
 }>;
 export declare function ButtonExpand({ onToggle, onClick, ...props }: ButtonExpandProps, ref?: React.ForwardedRef<HTMLButtonElement>): React.ReactElement;

package/lib/components/cta/Link/index.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { TextProps } from "../../asorted/Text";
 import { BaseStyledProps } from "../../styled";
-export declare type LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & BaseStyledProps & {
+export type LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & BaseStyledProps & {
     /**
      * Component that takes `{size: number; color?: string}` as props
      */

package/lib/components/form/BaseInput/index.d.ts

@@ -1,12 +1,12 @@
 import { TypographyProps } from "styled-system";
 import React, { InputHTMLAttributes } from "react";
-declare type ValueType = HTMLInputElement["value"];
-export declare type CommonProps = InputHTMLAttributes<HTMLInputElement> & TypographyProps & {
+type ValueType = HTMLInputElement["value"];
+export type CommonProps = InputHTMLAttributes<HTMLInputElement> & TypographyProps & {
     disabled?: boolean;
     error?: string;
     warning?: string;
 };
-export declare type InputProps<T = ValueType> = Omit<CommonProps, "value" | "onChange"> & {
+export type InputProps<T = ValueType> = Omit<CommonProps, "value" | "onChange"> & {
     value: T;
     onChange?: (value: T) => void;
     onChangeEvent?: InputHTMLAttributes<HTMLInputElement>["onChange"];
@@ -32,7 +32,7 @@ export declare type InputProps<T = ValueType> = Omit<CommonProps, "value" | "onC
      */
     deserialize?: (value: ValueType) => T;
 };
-export declare type InputContainerProps = React.ComponentProps<typeof InputContainer>;
+export type InputContainerProps = React.ComponentProps<typeof InputContainer>;
 export declare const InputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Partial<CommonProps> & {
     focus?: boolean | undefined;
 }, never>;

package/lib/components/form/Checkbox/Checkbox.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export declare type CheckboxProps = {
+export type CheckboxProps = {
     isDisabled?: boolean;
     isChecked: boolean;
     variant?: "default" | "success" | "error";

package/lib/components/form/Dropdown/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { GroupBase } from "react-select";
 import { Props as SelectInputProps } from "../../form/SelectInput";
-export declare type Props<O> = SelectInputProps<O, false, GroupBase<O>> & {
+export type Props<O> = SelectInputProps<O, false, GroupBase<O>> & {
     label: string;
 };
 export default function Dropdown<O>(props: Props<O>): JSX.Element;

package/lib/components/form/DropdownGeneric/index.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 export declare const placements: readonly ["bottom-start", "bottom", "bottom-end"];
-declare type Placement = typeof placements[number];
-export declare type Props = {
+type Placement = typeof placements[number];
+export type Props = {
     /**
      * Label of the dropdown button, displayed before the dropdown icon.
      */

package/lib/components/form/LegendInput/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { InputProps } from "../BaseInput";
-export declare type Props = InputProps & {
+export type Props = InputProps & {
     legend: string;
 };
 declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInput").CommonProps, "onChange" | "value"> & {

package/lib/components/form/Radio/RadioElement.d.ts

@@ -1,6 +1,6 @@
 import { InputHTMLAttributes } from "react";
-declare type InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "name">;
-export declare type RadioElementProps = InputAttributes & {
+type InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "name">;
+export type RadioElementProps = InputAttributes & {
     variant?: "default" | "main" | "success" | "error";
     label: string;
     outlined?: boolean;

package/lib/components/form/Radio/RadioListElement.d.ts

@@ -1,12 +1,12 @@
 import React, { InputHTMLAttributes } from "react";
 import { FlexBoxProps } from "../../layout/Flex";
-declare type ElementState = {
+type ElementState = {
     checked: boolean;
     disabled: boolean | undefined;
 };
 export declare const Label: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, import("../../asorted/Text").TextProps & ElementState, keyof import("../../asorted/Text").TextProps>;
-declare type InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "name">;
-export declare type RadioListElementProps = InputAttributes & {
+type InputAttributes = Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "onChange" | "name">;
+export type RadioListElementProps = InputAttributes & {
     /**
      * The string or component that will be rendered as label of this radio element
      * If it's a component, it's rendered with these props: { checked:boolean; disabled:boolean }

package/lib/components/form/Radio/index.d.ts

@@ -1,6 +1,6 @@
 import React, { InputHTMLAttributes } from "react";
 import { FlexBoxProps } from "../../layout/Flex";
-export declare type RadioProps = {
+export type RadioProps = {
     currentValue?: InputHTMLAttributes<HTMLInputElement>["value"];
     onChange: (value: InputHTMLAttributes<HTMLInputElement>["value"]) => void;
     children: React.ReactNode;

package/lib/components/form/SelectInput/Option.d.ts

@@ -1,8 +1,8 @@
 import React from "react";
 import { GroupBase, StylesConfig, OptionProps } from "react-select";
 export declare function getStyles<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>>(): NonNullable<StylesConfig<O, M, G>["option"]>;
-export declare type ExtraProps<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = {
+export type ExtraProps<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = {
     render?: (props: React.PropsWithChildren<OptionProps<O, M, G>>) => React.ReactNode;
 };
-export declare type Props<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = OptionProps<O, M, G> & ExtraProps<O, M, G>;
+export type Props<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = OptionProps<O, M, G> & ExtraProps<O, M, G>;
 export declare function Option<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>>(props: Props<O, M, G>): JSX.Element;

package/lib/components/form/SelectInput/ValueContainer.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import { GroupBase, StylesConfig, ValueContainerProps } from "react-select";
 export declare function getStyles<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>>(): StylesConfig<O, M, G>["valueContainer"];
-declare type ExtraProps<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = {
+type ExtraProps<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = {
     render?: (props: React.PropsWithChildren<ValueContainerProps<O, M, G>>) => React.ReactNode;
 };
 export declare function ValueContainer<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>>(props: ValueContainerProps<O, M, G> & ExtraProps<O, M, G>): JSX.Element;

package/lib/components/form/SelectInput/VirtualMenuList.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { GroupBase, MenuListProps } from "react-select";
-export declare type RowProps = React.PropsWithChildren<{
+export type RowProps = React.PropsWithChildren<{
     style: React.CSSProperties;
 }>;
 export declare const VirtualRow: React.MemoExoticComponent<({ style, children }: RowProps) => JSX.Element>;

package/lib/components/form/SelectInput/index.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { Props as SelectProps, ControlProps, IndicatorsContainerProps, GroupBase, StylesConfig } from "react-select";
-export declare type SelfProps<O, M extends boolean, G extends GroupBase<O>> = {
+export type SelfProps<O, M extends boolean, G extends GroupBase<O>> = {
     error?: string;
     renderLeft?: (props: ControlProps<O, M, G>) => React.ReactNode;
     renderRight?: (props: IndicatorsContainerProps<O, M, G>) => React.ReactNode;
@@ -8,7 +8,7 @@ export declare type SelfProps<O, M extends boolean, G extends GroupBase<O>> = {
     unwrapped?: boolean;
     extendStyles?: (styles: StylesConfig<O, M, G>) => StylesConfig<O, M, G>;
 };
-export declare type Props<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = SelectProps<O, M, G> & SelfProps<O, M, G>;
+export type Props<O = unknown, M extends boolean = false, G extends GroupBase<O> = GroupBase<O>> = SelectProps<O, M, G> & SelfProps<O, M, G>;
 declare function SelectInput<O, M extends boolean, G extends GroupBase<O>>({ error, rowHeight, unwrapped, extendStyles, ...props }: Props<O, M, G>): JSX.Element;
 declare const _default: typeof SelectInput;
 export default _default;

package/lib/components/form/SplitInput/index.d.ts

@@ -1,17 +1,17 @@
 import React from "react";
-declare type Callbacks = {
+type Callbacks = {
     onFocus: <F>(event: React.FocusEvent<F>) => void;
     onBlur: <B>(event: React.FocusEvent<B>) => void;
 };
-declare type ExtraRenderProps = {
+type ExtraRenderProps = {
     renderLeft: (p: StateProps & Callbacks) => React.ReactNode;
     renderRight: (p: StateProps & Callbacks) => React.ReactNode;
 };
-export declare type StateProps = {
+export type StateProps = {
     error?: string | undefined;
     disabled?: boolean;
     isDisabled?: boolean;
 };
-export declare type Props = StateProps & ExtraRenderProps;
+export type Props = StateProps & ExtraRenderProps;
 export default function SplitInput(props: Props): JSX.Element;
 export {};

package/lib/components/form/Switch/Switch.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-export declare type SwitchProps = {
+export type SwitchProps = {
     name: string;
     checked: boolean;
     onChange: (e: React.FormEvent<HTMLDivElement>) => void;