@ledgerhq/react-ui 0.7.6 → 0.7.7-nightly.0

package/lib/cjs/styles/global.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/styles/global.ts"],
+  "sourcesContent": ["import { createGlobalStyle } from \"styled-components\";\n\nimport { rgba } from \"./helpers\";\nimport tippyStyles from \"../components/message/Tooltip/styles\";\nimport { fontStyles } from \"../components/asorted/Text/styles\";\n\nexport type GlobalStyleProps = {\n  fontsPath?: string;\n  fontMappings?: (name: string) => string;\n};\n\nexport const GlobalStyle = createGlobalStyle<GlobalStyleProps>`\n  html {\n    box-sizing: border-box;\n  }\n\n  body {\n    font-family: Inter;\n    font-size: 100%;\n  }\n\n  *, *:before, *:after {\n    box-sizing: inherit;\n  }\n\n  * {\n    margin: 0;\n    padding: 0;\n    font: inherit;\n    color: inherit;\n    user-select: inherit;\n    cursor: inherit;\n    outline: none;\n  }\n\n  ::selection {\n    background: ${(p) => rgba(p.theme.colors.primary.c100, 0.1)};\n  }\n\n  --track-color: rgba(0,0,0,0);\n\n  ${(props) => (typeof props.fontsPath === \"string\" ? fontStyles : \"\")}\n\n  ${tippyStyles}\n`;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,+BAAkC;AAElC,qBAAqB;AACrB,oBAAwB;AACxB,qBAA2B;AAOpB,MAAM,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAyBT,CAAC,MAAM,yBAAK,EAAE,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,IAKvD,CAAC,UAAW,OAAO,MAAM,cAAc,WAAW,4BAAa;AAAA;AAAA,IAE/D;AAAA;",
+  "names": []
+}

package/lib/cjs/styles/helpers.js

@@ -0,0 +1,47 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  darken: () => darken,
+  ff: () => ff,
+  lighten: () => lighten,
+  mix: () => mix,
+  rgba: () => rgba
+});
+var import_color = __toModule(require("color"));
+var import_theme = __toModule(require("./theme"));
+const rgba = (c, a) => (0, import_color.default)(c).alpha(a).rgb().toString();
+const darken = (c, a) => (0, import_color.default)(c).darken(a).toString();
+const lighten = (c, a) => (0, import_color.default)(c).lighten(a).toString();
+const mix = (c, b, a) => (0, import_color.default)(c).mix((0, import_color.default)(b), a).toString();
+const ff = (v) => {
+  const [font, type = "Regular"] = v.split("|");
+  const { style, weight } = import_theme.fontFamilies[font][type];
+  const fallback = import_theme.fontFamilies[font].fallback ?? "Arial";
+  return {
+    fontFamily: `${font}, ${fallback}`,
+    fontWeight: weight,
+    fontStyle: style
+  };
+};
+//# sourceMappingURL=helpers.js.map

package/lib/cjs/styles/helpers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/styles/helpers.ts"],
+  "sourcesContent": ["import Color from \"color\";\n\nimport { fontFamilies } from \"./theme\";\n\nexport const rgba = (c: string, a: number): string => Color(c).alpha(a).rgb().toString();\n\nexport const darken = (c: string, a: number): string => Color(c).darken(a).toString();\n\nexport const lighten = (c: string, a: number): string => Color(c).lighten(a).toString();\n\nexport const mix = (c: string, b: string, a: number): string =>\n  Color(c).mix(Color(b), a).toString();\n\nexport const ff = (v: string) => {\n  const [font, type = \"Regular\"] = v.split(\"|\");\n  // @ts-expect-error FIXME\n  const { style, weight } = fontFamilies[font][type];\n  // @ts-expect-error FIXME\n  const fallback: string = fontFamilies[font].fallback ?? \"Arial\";\n\n  return {\n    fontFamily: `${font}, ${fallback}`,\n    fontWeight: weight,\n    fontStyle: style,\n  };\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,mBAA6B;AAEtB,MAAM,OAAO,CAAC,GAAW,MAAsB,0BAAM,GAAG,MAAM,GAAG,MAAM;AAEvE,MAAM,SAAS,CAAC,GAAW,MAAsB,0BAAM,GAAG,OAAO,GAAG;AAEpE,MAAM,UAAU,CAAC,GAAW,MAAsB,0BAAM,GAAG,QAAQ,GAAG;AAEtE,MAAM,MAAM,CAAC,GAAW,GAAW,MACxC,0BAAM,GAAG,IAAI,0BAAM,IAAI,GAAG;AAErB,MAAM,KAAK,CAAC,MAAc;AAC/B,QAAM,CAAC,MAAM,OAAO,aAAa,EAAE,MAAM;AAEzC,QAAM,EAAE,OAAO,WAAW,0BAAa,MAAM;AAE7C,QAAM,WAAmB,0BAAa,MAAM,YAAY;AAExD,SAAO;AAAA,IACL,YAAY,GAAG,SAAS;AAAA,IACxB,YAAY;AAAA,IACZ,WAAW;AAAA;AAAA;",
+  "names": []
+}

package/lib/cjs/styles/index.js

@@ -0,0 +1,35 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  InvertTheme: () => import_InvertTheme.InvertTheme,
+  defaultTheme: () => import_theme.default,
+  palettes: () => import_ui_shared.palettes
+});
+var import_theme = __toModule(require("./theme"));
+__reExport(exports, __toModule(require("./helpers")));
+__reExport(exports, __toModule(require("./global")));
+__reExport(exports, __toModule(require("./StyleProvider")));
+var import_InvertTheme = __toModule(require("./InvertTheme"));
+var import_ui_shared = __toModule(require("@ledgerhq/ui-shared"));
+//# sourceMappingURL=index.js.map

package/lib/cjs/styles/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/styles/index.ts"],
+  "sourcesContent": ["export { default as defaultTheme } from \"./theme\";\nexport * from \"./helpers\";\nexport * from \"./global\";\nexport * from \"./StyleProvider\";\nexport { InvertTheme } from \"./InvertTheme\";\nexport type { ThemeNames, ColorPalette } from \"@ledgerhq/ui-shared\";\nexport { palettes } from \"@ledgerhq/ui-shared\";\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAwC;AACxC,oBAAc;AACd,oBAAc;AACd,oBAAc;AACd,yBAA4B;AAE5B,uBAAyB;",
+  "names": []
+}

package/lib/cjs/styles/palettes/colors.stories.js

@@ -0,0 +1,81 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  Colors: () => Colors,
+  default: () => colors_stories_default
+});
+var import_react = __toModule(require("react"));
+var import_styled_components = __toModule(require("styled-components"));
+var import_Text = __toModule(require("../../components/asorted/Text"));
+var import_Flex = __toModule(require("../../components/layout/Flex"));
+var import_ui_shared = __toModule(require("@ledgerhq/ui-shared"));
+var colors_stories_default = { title: "Particles" };
+const ColorArea = import_styled_components.default.div`
+  width: 200px;
+  aspect-ratio: 1;
+  background-color: ${(p) => {
+  return p.theme.colors[p.type][p.shade];
+}};
+  cursor: pointer;
+  border-radius: 2px;
+`;
+const CardColor = ({ shade, type, value }) => {
+  const [isHovered, setIsHovered] = (0, import_react.useState)(false);
+  const onClick = (type2, shade2) => {
+    navigator.clipboard.writeText(`p.theme.colors.${type2}.${shade2}`);
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
+    flexDirection: "column",
+    alignItems: "center",
+    onMouseEnter: () => setIsHovered(true),
+    onMouseLeave: () => setIsHovered(false)
+  }, /* @__PURE__ */ import_react.default.createElement(ColorArea, {
+    type,
+    shade,
+    onClick: () => onClick(type, shade)
+  }), /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
+    variant: "tiny"
+  }, isHovered ? value : shade));
+};
+const { type: _, ...palette } = import_ui_shared.palettes.light;
+const Colors = () => /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
+  flexDirection: "column",
+  rowGap: "2rem"
+}, Object.entries(palette).map(([type, shades]) => /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
+  flexDirection: "column",
+  rowGap: "1rem"
+}, /* @__PURE__ */ import_react.default.createElement(import_Text.default, {
+  variant: "h2",
+  textTransform: "uppercase"
+}, type), /* @__PURE__ */ import_react.default.createElement(import_Flex.default, {
+  columnGap: "0.5rem",
+  rowGap: "0.5rem",
+  flexWrap: "wrap"
+}, Object.entries(shades).map(([shade, value]) => /* @__PURE__ */ import_react.default.createElement(CardColor, {
+  key: shade,
+  shade,
+  type,
+  value
+}))))));
+//# sourceMappingURL=colors.stories.js.map

package/lib/cjs/styles/palettes/colors.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/styles/palettes/colors.stories.tsx"],
+  "sourcesContent": ["import React, { useState } from \"react\";\nimport styled from \"styled-components\";\nimport Text from \"../../components/asorted/Text\";\nimport Flex from \"../../components/layout/Flex\";\nimport { palettes, ColorPalette } from \"@ledgerhq/ui-shared\";\n\nexport default { title: \"Particles\" };\n\nconst ColorArea = styled.div<{ type: keyof ColorPalette; shade: string }>`\n  width: 200px;\n  aspect-ratio: 1;\n  background-color: ${(p) => {\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore next-line\n    return p.theme.colors[p.type][p.shade];\n  }};\n  cursor: pointer;\n  border-radius: 2px;\n`;\n\ntype CardColorProps = { shade: string; type: string; value: string };\nconst CardColor = ({ shade, type, value }: CardColorProps): JSX.Element => {\n  const [isHovered, setIsHovered] = useState(false);\n\n  const onClick = (type: string, shade: string): void => {\n    navigator.clipboard.writeText(`p.theme.colors.${type}.${shade}`);\n  };\n\n  return (\n    <Flex\n      flexDirection=\"column\"\n      alignItems=\"center\"\n      onMouseEnter={() => setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n    >\n      <ColorArea\n        type={type as keyof ColorPalette}\n        shade={shade}\n        onClick={() => onClick(type, shade)}\n      />\n      <Text variant=\"tiny\">{isHovered ? value : shade}</Text>\n    </Flex>\n  );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nconst { type: _, ...palette } = palettes.light;\n\nexport const Colors = (): JSX.Element => (\n  <Flex flexDirection=\"column\" rowGap=\"2rem\">\n    {Object.entries(palette).map(([type, shades]: [string, Array<string>]) => (\n      <Flex flexDirection=\"column\" rowGap=\"1rem\">\n        <Text variant=\"h2\" textTransform=\"uppercase\">\n          {type}\n        </Text>\n        <Flex columnGap=\"0.5rem\" rowGap=\"0.5rem\" flexWrap=\"wrap\">\n          {Object.entries(shades).map(([shade, value]) => (\n            <CardColor key={shade} shade={shade} type={type} value={value} />\n          ))}\n        </Flex>\n      </Flex>\n    ))}\n  </Flex>\n);\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAgC;AAChC,+BAAmB;AACnB,kBAAiB;AACjB,kBAAiB;AACjB,uBAAuC;AAEvC,IAAO,yBAAQ,EAAE,OAAO;AAExB,MAAM,YAAY,iCAAO;AAAA;AAAA;AAAA,sBAGH,CAAC,MAAM;AAGzB,SAAO,EAAE,MAAM,OAAO,EAAE,MAAM,EAAE;AAAA;AAAA;AAAA;AAAA;AAOpC,MAAM,YAAY,CAAC,EAAE,OAAO,MAAM,YAAyC;AACzE,QAAM,CAAC,WAAW,gBAAgB,2BAAS;AAE3C,QAAM,UAAU,CAAC,OAAc,WAAwB;AACrD,cAAU,UAAU,UAAU,kBAAkB,SAAQ;AAAA;AAG1D,SACE,mDAAC,qBAAD;AAAA,IACE,eAAc;AAAA,IACd,YAAW;AAAA,IACX,cAAc,MAAM,aAAa;AAAA,IACjC,cAAc,MAAM,aAAa;AAAA,KAEjC,mDAAC,WAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS,MAAM,QAAQ,MAAM;AAAA,MAE/B,mDAAC,qBAAD;AAAA,IAAM,SAAQ;AAAA,KAAQ,YAAY,QAAQ;AAAA;AAMhD,MAAM,EAAE,MAAM,MAAM,YAAY,0BAAS;AAElC,MAAM,SAAS,MACpB,mDAAC,qBAAD;AAAA,EAAM,eAAc;AAAA,EAAS,QAAO;AAAA,GACjC,OAAO,QAAQ,SAAS,IAAI,CAAC,CAAC,MAAM,YACnC,mDAAC,qBAAD;AAAA,EAAM,eAAc;AAAA,EAAS,QAAO;AAAA,GAClC,mDAAC,qBAAD;AAAA,EAAM,SAAQ;AAAA,EAAK,eAAc;AAAA,GAC9B,OAEH,mDAAC,qBAAD;AAAA,EAAM,WAAU;AAAA,EAAS,QAAO;AAAA,EAAS,UAAS;AAAA,GAC/C,OAAO,QAAQ,QAAQ,IAAI,CAAC,CAAC,OAAO,WACnC,mDAAC,WAAD;AAAA,EAAW,KAAK;AAAA,EAAO;AAAA,EAAc;AAAA,EAAY;AAAA;",
+  "names": []
+}

package/lib/cjs/styles/styled/fontFamily.js

@@ -0,0 +1,35 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  default: () => fontFamily_default
+});
+var import_helpers = __toModule(require("../helpers"));
+var fontFamily_default = (props) => {
+  const prop = props.ff;
+  if (prop == null) {
+    return null;
+  }
+  return (0, import_helpers.ff)(prop);
+};
+//# sourceMappingURL=fontFamily.js.map

package/lib/cjs/styles/styled/fontFamily.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/styles/styled/fontFamily.ts"],
+  "sourcesContent": ["import { ff } from \"../helpers\";\n\nexport default (props: { ff?: string }) => {\n  const prop = props.ff;\n\n  if (prop == null) {\n    return null;\n  }\n\n  return ff(prop);\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,qBAAmB;AAEnB,IAAO,qBAAQ,CAAC,UAA2B;AACzC,QAAM,OAAO,MAAM;AAEnB,MAAI,QAAQ,MAAM;AAChB,WAAO;AAAA;AAGT,SAAO,uBAAG;AAAA;",
+  "names": []
+}

package/lib/cjs/styles/system/gaps.js

@@ -0,0 +1,33 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  default: () => gaps_default
+});
+var import_styled_system = __toModule(require("styled-system"));
+const gaps = (0, import_styled_system.system)({
+  rowGap: { property: "rowGap", scale: "space" },
+  columnGap: { property: "columnGap", scale: "space" }
+});
+var gaps_default = gaps;
+//# sourceMappingURL=gaps.js.map

package/lib/cjs/styles/system/gaps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/styles/system/gaps.ts"],
+  "sourcesContent": ["import { system } from \"styled-system\";\n\nconst gaps = system({\n  rowGap: { property: \"rowGap\", scale: \"space\" },\n  columnGap: { property: \"columnGap\", scale: \"space\" },\n});\n\nexport default gaps;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA,2BAAuB;AAEvB,MAAM,OAAO,iCAAO;AAAA,EAClB,QAAQ,EAAE,UAAU,UAAU,OAAO;AAAA,EACrC,WAAW,EAAE,UAAU,aAAa,OAAO;AAAA;AAG7C,IAAO,eAAQ;",
+  "names": []
+}

package/lib/cjs/styles/theme.js

@@ -0,0 +1,263 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  default: () => theme_default,
+  fontFamilies: () => fontFamilies,
+  fontSizes: () => fontSizes,
+  radii: () => radii,
+  shadows: () => shadows,
+  space: () => space,
+  zIndexes: () => zIndexes
+});
+var import_styled_components = __toModule(require("styled-components"));
+var import_ui_shared = __toModule(require("@ledgerhq/ui-shared"));
+const space = [
+  0,
+  2,
+  4,
+  8,
+  10,
+  12,
+  16,
+  20,
+  24,
+  28,
+  32,
+  36,
+  40,
+  44,
+  48,
+  52,
+  56,
+  60,
+  64,
+  68,
+  72,
+  76
+];
+const fontSizes = [8, 10, 11, 12, 13, 14, 16, 20, 24, 28, 32, 36];
+[
+  fontSizes.micro,
+  fontSizes.tiny,
+  fontSizes.extraSmall,
+  fontSizes.small,
+  fontSizes.paragraph,
+  fontSizes.body,
+  fontSizes.large,
+  fontSizes.h5,
+  fontSizes.h4,
+  fontSizes.h3,
+  fontSizes.h2,
+  fontSizes.h1
+] = fontSizes;
+fontSizes.largeLineHeight = fontSizes.large;
+fontSizes.bodyLineHeight = fontSizes.body;
+fontSizes.paragraphLineHeight = fontSizes.paragraph;
+fontSizes.subtitle = fontSizes.extraSmall;
+const fontWeights = {
+  extraLight: "100",
+  light: "300",
+  regular: "400",
+  medium: "500",
+  semiBold: "600",
+  bold: "700",
+  extraBold: "800"
+};
+const radii = [0, 4, 8, 12, 16, 20];
+const shadows = ["0 4px 8px 0 rgba(0, 0, 0, 0.03)"];
+const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1e3];
+const fontFamilies = {
+  Inter: {
+    ExtraLight: {
+      weight: 100,
+      style: "normal"
+    },
+    Light: {
+      weight: 300,
+      style: "normal"
+    },
+    Regular: {
+      weight: 400,
+      style: "normal"
+    },
+    Medium: {
+      weight: 500,
+      style: "normal"
+    },
+    SemiBold: {
+      weight: 600,
+      style: "normal"
+    },
+    Bold: {
+      weight: 700,
+      style: "normal"
+    },
+    ExtraBold: {
+      weight: 800,
+      style: "normal"
+    }
+  },
+  Alpha: {
+    Medium: {
+      weight: 500,
+      style: "normal"
+    }
+  }
+};
+const animationDuration = "0.33s";
+const easings = {
+  outQuadratic: "cubic-bezier(0.25, 0.46, 0.45, 0.94)"
+};
+const transition = (properties = ["all"], duration = animationDuration, easing = easings.outQuadratic) => import_styled_components.css`
+  transition-property: ${properties.join(",")};
+  transition-duration: ${duration};
+  transition-timing-function: ${easing};
+`;
+const fadeIn = import_styled_components.keyframes`
+    0% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 1;
+    }
+  `;
+const fadeOut = import_styled_components.keyframes`
+    0% {
+      opacity: 1;
+    }
+    100% {
+      opacity: 0;
+    }
+  `;
+const fadeInGrowX = import_styled_components.keyframes`
+    0% {
+      opacity: 0;
+      transform: scaleX(0);
+    }
+    100% {
+      opacity: 1;
+      transform: scaleX(1);
+    }
+`;
+const fadeInUp = import_styled_components.keyframes`
+    0% {
+      opacity: 0;
+      transform: translateY(66%);
+    }
+    100% {
+      opacity: 1;
+      transform: translateY(0%);
+    }
+  `;
+const animations = {
+  fadeIn: () => import_styled_components.css`
+      ${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards
+    `,
+  fadeOut: () => import_styled_components.css`
+      ${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards
+    `,
+  fadeInGrowX: () => import_styled_components.css`
+      ${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards
+    `,
+  fadeInUp: () => import_styled_components.css`
+      ${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards
+    `
+};
+const overflow = {
+  x: import_styled_components.css`
+    overflow-y: hidden;
+    overflow-x: scroll;
+    will-change: transform;
+    &:hover {
+      --track-color: ${(p) => p.theme.colors.neutral.c30};
+    }
+  `,
+  y: import_styled_components.css`
+    overflow-x: hidden;
+    overflow-y: scroll;
+    will-change: transform;
+    &:hover {
+      --track-color: ${(p) => p.theme.colors.neutral.c30};
+    }
+  `,
+  yAuto: import_styled_components.css`
+    overflow-x: hidden;
+    overflow-y: auto;
+    will-change: transform;
+    &:hover {
+      --track-color: ${(p) => p.theme.colors.neutral.c30};
+    }
+  `,
+  xy: import_styled_components.css`
+    overflow: scroll;
+    will-change: transform;
+    &:hover {
+      --track-color: ${(p) => p.theme.colors.neutral.c30};
+    }
+  `,
+  trackSize: 12
+};
+const theme = {
+  theme: "light",
+  sizes: {
+    drawer: {
+      side: {
+        big: {
+          width: 580
+        },
+        small: {
+          width: 420
+        }
+      },
+      popin: {
+        min: {
+          height: 158,
+          width: 462
+        },
+        max: {
+          height: 522,
+          width: 622
+        }
+      }
+    },
+    topBarHeight: 58,
+    sideBarWidth: 230
+  },
+  radii,
+  fontFamilies,
+  fontSizes,
+  fontWeights,
+  space,
+  shadows,
+  colors: {
+    palette: import_ui_shared.palettes.light,
+    ...import_ui_shared.palettes.light
+  },
+  animations,
+  overflow,
+  transition,
+  zIndexes
+};
+var theme_default = theme;
+//# sourceMappingURL=theme.js.map

package/lib/cjs/styles/theme.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/styles/theme.ts"],
+  "sourcesContent": ["import { keyframes, css, DefaultTheme } from \"styled-components\";\nimport { palettes, ColorPalette } from \"@ledgerhq/ui-shared\";\n\n/* space indexes:\n  0, 1, 2, 3, 4,  5,  6,  7,  8,  9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21\n */\nexport const space = [\n  0, 2, 4, 8, 10, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 68, 72, 76,\n];\n\nexport type TextVariants =\n  | \"h1\"\n  | \"h2\"\n  | \"h3\"\n  | \"h4\"\n  | \"h5\"\n  | \"large\"\n  | \"largeLineHeight\"\n  | \"body\"\n  | \"bodyLineHeight\"\n  | \"paragraph\"\n  | \"paragraphLineHeight\"\n  | \"small\"\n  | \"extraSmall\"\n  | \"tiny\"\n  | \"micro\"\n  | \"subtitle\";\n\nexport type ThemeScale<Type, Aliases extends string> = Array<Type> & Record<Aliases, Type>;\n\nexport const fontSizes = [8, 10, 11, 12, 13, 14, 16, 20, 24, 28, 32, 36] as ThemeScale<\n  number,\n  TextVariants\n>;\n\n[\n  fontSizes.micro,\n  fontSizes.tiny,\n  fontSizes.extraSmall,\n  fontSizes.small,\n  fontSizes.paragraph,\n  fontSizes.body,\n  fontSizes.large,\n  fontSizes.h5,\n  fontSizes.h4,\n  fontSizes.h3,\n  fontSizes.h2,\n  fontSizes.h1,\n] = fontSizes;\nfontSizes.largeLineHeight = fontSizes.large;\nfontSizes.bodyLineHeight = fontSizes.body;\nfontSizes.paragraphLineHeight = fontSizes.paragraph;\nfontSizes.subtitle = fontSizes.extraSmall;\n\nconst fontWeights = {\n  extraLight: \"100\",\n  light: \"300\",\n  regular: \"400\",\n  medium: \"500\",\n  semiBold: \"600\",\n  bold: \"700\",\n  extraBold: \"800\",\n};\n\nexport const radii = [0, 4, 8, 12, 16, 20];\nexport const shadows = [\"0 4px 8px 0 rgba(0, 0, 0, 0.03)\"];\nexport const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1000];\n\n// Those fonts are now defined in global.css, this is just a mapping for styled-system\nexport const fontFamilies = {\n  Inter: {\n    ExtraLight: {\n      weight: 100,\n      style: \"normal\",\n    },\n    Light: {\n      weight: 300,\n      style: \"normal\",\n    },\n    Regular: {\n      weight: 400,\n      style: \"normal\",\n    },\n    Medium: {\n      weight: 500,\n      style: \"normal\",\n    },\n    SemiBold: {\n      weight: 600,\n      style: \"normal\",\n    },\n    Bold: {\n      weight: 700,\n      style: \"normal\",\n    },\n    ExtraBold: {\n      weight: 800,\n      style: \"normal\",\n    },\n  },\n  Alpha: {\n    Medium: {\n      weight: 500,\n      style: \"normal\",\n    },\n  },\n};\n\nconst animationDuration = \"0.33s\";\nconst easings = {\n  outQuadratic: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n};\n\nconst transition = (\n  properties = [\"all\"],\n  duration = animationDuration,\n  easing = easings.outQuadratic,\n) => css`\n  transition-property: ${properties.join(\",\")};\n  transition-duration: ${duration};\n  transition-timing-function: ${easing};\n`;\n\nconst fadeIn = keyframes`\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\n  `;\nconst fadeOut = keyframes`\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n    }\n  `;\nconst fadeInGrowX = keyframes`\n    0% {\n      opacity: 0;\n      transform: scaleX(0);\n    }\n    100% {\n      opacity: 1;\n      transform: scaleX(1);\n    }\n`;\nconst fadeInUp = keyframes`\n    0% {\n      opacity: 0;\n      transform: translateY(66%);\n    }\n    100% {\n      opacity: 1;\n      transform: translateY(0%);\n    }\n  `;\nconst animations = {\n  fadeIn: () =>\n    css`\n      ${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards\n    `,\n  fadeOut: () =>\n    css`\n      ${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards\n    `,\n  fadeInGrowX: () =>\n    css`\n      ${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards\n    `,\n  fadeInUp: () =>\n    css`\n      ${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards\n    `,\n};\nconst overflow = {\n  x: css`\n    overflow-y: hidden;\n    overflow-x: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${(p) => p.theme.colors.neutral.c30};\n    }\n  `,\n  y: css`\n    overflow-x: hidden;\n    overflow-y: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${(p) => p.theme.colors.neutral.c30};\n    }\n  `,\n  yAuto: css`\n    overflow-x: hidden;\n    overflow-y: auto;\n    will-change: transform;\n    &:hover {\n      --track-color: ${(p) => p.theme.colors.neutral.c30};\n    }\n  `,\n  xy: css`\n    overflow: scroll;\n    will-change: transform;\n    &:hover {\n      --track-color: ${(p) => p.theme.colors.neutral.c30};\n    }\n  `,\n  trackSize: 12,\n};\n\ndeclare module \"styled-components\" {\n  export interface Font {\n    weight: number;\n    style: string;\n  }\n  export interface DefaultTheme {\n    theme: string;\n    animations: typeof animations;\n    transition: typeof transition;\n    overflow: typeof overflow;\n    sizes: {\n      topBarHeight: number;\n      sideBarWidth: number;\n      drawer: {\n        side: {\n          big: {\n            width: number;\n          };\n          small: {\n            width: number;\n          };\n        };\n        popin: {\n          min: {\n            height: number;\n            width: number;\n          };\n          max: {\n            height: number;\n            width: number;\n          };\n        };\n      };\n    };\n    radii: number[];\n    fontFamilies: Record<string, Record<string, Font>>;\n    fontSizes: number[];\n    space: number[];\n    shadows: string[];\n    colors: ColorPalette & {\n      /**\n       * @deprecated Do not use the .palette prefix anymore!\n       */\n      palette: ColorPalette;\n    };\n    fontWeights: Record<string, string>;\n    zIndexes: number[];\n  }\n}\n\nconst theme: DefaultTheme = {\n  theme: \"light\",\n  sizes: {\n    drawer: {\n      side: {\n        big: {\n          width: 580,\n        },\n        small: {\n          width: 420,\n        },\n      },\n      popin: {\n        min: {\n          height: 158,\n          width: 462,\n        },\n        max: {\n          height: 522,\n          width: 622,\n        },\n      },\n    },\n    topBarHeight: 58,\n    sideBarWidth: 230,\n  },\n  radii,\n  fontFamilies,\n  fontSizes,\n  fontWeights,\n  space,\n  shadows,\n  colors: {\n    palette: palettes.light,\n    ...palettes.light,\n  },\n  animations,\n  overflow,\n  transition,\n  zIndexes,\n};\n\nexport default theme;\nexport type Theme = DefaultTheme;\n"],
+  "mappings": "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",
+  "names": []
+}

package/{components → lib/components}/Chart/index.js

@@ -120,6 +120,5 @@ export default (_a) => {
         scales: config.scales,
     }), [config.scales]);
     // The redraw is needed to allow the chart to be updated with new value
-    // @ts-expect-error : There are issues with the chartjs typings. In the future, check and improve.
     return React.createElement(Line, Object.assign({ data: chartData, options: options }, chartProps, { redraw: true }));
 };

package/{components → lib/components}/Table/index.d.ts

@@ -50,8 +50,8 @@ export interface RowProps<T> extends CommonProps<T> {
 }
 declare function RowsComponent<T>({ data, columns, render, extraRender, renderRow, }: RowProps<T>): JSX.Element;
 export declare const Rows: typeof RowsComponent;
-declare function Table<T>({ data, columns, withHeaders, extraRender, renderRow, ...containerProps }: Props<T>): JSX.Element;
-declare namespace Table {
+export declare function Table<T>({ data, columns, withHeaders, extraRender, renderRow, ...containerProps }: Props<T>): JSX.Element;
+export declare namespace Table {
     var Columns: typeof import("./Columns");
     var ExtraRowContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
         gridColumn: string;

package/{components → lib/components}/Table/index.js

@@ -45,7 +45,7 @@ function RowsComponent({ data, columns, render, extraRender, renderRow, }) {
     })));
 }
 export const Rows = memo(RowsComponent);
-function Table(_a) {
+export function Table(_a) {
     var { data, columns, withHeaders, extraRender, renderRow } = _a, containerProps = __rest(_a, ["data", "columns", "withHeaders", "extraRender", "renderRow"]);
     const gridTemplateColumns = useMemo(() => columns.reduce((acc, col) => `${acc} ${col.layout || "auto"}`, ""), [columns]);
     const headers = useMemo(() => withHeaders

package/{components → lib/components}/animations/GlitchText/index.js

@@ -29,7 +29,9 @@ export default function GlitchText({ text, duration = 800, delay = 500 }) {
             }
             frameT++;
         }, INTERVAL);
-        return () => interval && clearInterval(interval);
+        return () => {
+            interval && clearInterval(interval);
+        };
     }, [delay, duration, text]);
     return React.createElement(React.Fragment, null, shownText);
 }