@ledgerhq/react-ui 0.14.18 → 0.15.0-next.0

package/lib/cjs/components/Chart/index.js

@@ -1,150 +0,0 @@
-"use strict";
-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 __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var Chart_exports = {};
-__export(Chart_exports, {
-  default: () => Chart_default
-});
-module.exports = __toCommonJS(Chart_exports);
-var import_react = __toESM(require("react"));
-var import_react_chartjs_2 = require("react-chartjs-2");
-var import_color = __toESM(require("color"));
-var import_styled_components = require("styled-components");
-var import_chartjs_adapter_moment = require("chartjs-adapter-moment");
-var import_utils = require("./utils");
-const getConfig = (variant, options) => {
-  const config = {
-    small: {
-      gradient: { alpha: 0.3 },
-      scales: { y: { display: false }, x: { display: false, type: "time" } }
-    },
-    default: {
-      gradient: { alpha: 0.1 },
-      scales: {
-        y: {
-          display: true,
-          grid: {
-            color: options.gridColor,
-            borderDash: [4, 4],
-            tickWidth: 0,
-            tickLength: 18,
-            // This is an hack to don't render a duplicate axis
-            borderWidth: 0
-          },
-          ticks: { callback: import_utils.valueFormatter, labelOffset: -3 }
-        },
-        x: {
-          display: true,
-          grid: {
-            color: options.gridColor,
-            borderDash: [4, 4],
-            tickWidth: 0,
-            tickLength: 15,
-            // Don't render a duplicate axis
-            borderWidth: 0
-          },
-          // always display first/last ticks
-          bounds: "ticks",
-          type: "time",
-          // control how the tickers on the x-axis are formatted
-          time: options.timeOptions
-        }
-      }
-    }
-  };
-  return config[variant];
-};
-const defaultValue = {
-  variant: "default",
-  valueKey: "value",
-  timeOptions: { unit: "month", displayFormats: { month: "MMM." } }
-};
-var Chart_default = ({
-  data,
-  color,
-  variant = defaultValue.variant,
-  valueKey = defaultValue.valueKey,
-  timeOptions = defaultValue.timeOptions,
-  ...chartProps
-}) => {
-  const theme = (0, import_styled_components.useTheme)();
-  const config = (0, import_react.useMemo)(
-    () => getConfig(variant, { gridColor: theme.colors.neutral.c40, timeOptions }),
-    [variant, theme.colors.neutral.c40, timeOptions]
-  );
-  (0, import_react.useEffect)(() => {
-    import_react_chartjs_2.defaults.font = import_utils.fontConfig;
-  }, []);
-  const chartData = (0, import_react.useMemo)(
-    () => ({
-      datasets: [
-        {
-          borderColor: color,
-          borderWidth: 2,
-          fill: "start",
-          backgroundColor: (context) => {
-            const chart = context.chart;
-            const { ctx, chartArea } = chart;
-            if (!chartArea)
-              return null;
-            const gradient = ctx.createLinearGradient(0, 0, 0, chartArea.height / 1.2);
-            gradient.addColorStop(0, (0, import_color.default)(color).alpha(config.gradient.alpha).string());
-            gradient.addColorStop(1, (0, import_color.default)(color).alpha(0).string());
-            return gradient;
-          },
-          // prevent points rendering
-          pointRadius: 0,
-          pointHitRadius: 0,
-          data: data.map(({ date: x, [`${valueKey}`]: y }) => ({ x, y }))
-        }
-      ]
-    }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [color, data, valueKey, variant]
-  );
-  const options = (0, import_react.useMemo)(
-    () => ({
-      // Responsive options use the parent element to create the canvas
-      responsive: true,
-      maintainAspectRatio: false,
-      plugins: { tooltips: { enabled: false }, legend: { display: false } },
-      animation: false,
-      elements: {
-        points: { radius: 0 },
-        line: {
-          // Bezier curve tension of the line. Set to 0 to draw straightlines.
-          tension: 0.2
-        }
-      },
-      scales: config.scales
-    }),
-    [config.scales]
-  );
-  return /* @__PURE__ */ import_react.default.createElement(import_react_chartjs_2.Line, { data: chartData, options, ...chartProps, redraw: true });
-};
-//# sourceMappingURL=index.js.map

package/lib/cjs/components/Chart/index.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Chart/index.tsx"],
-  "sourcesContent": ["import React, { useEffect, useMemo } from \"react\";\nimport { Line, defaults, ChartProps } from \"react-chartjs-2\";\nimport type { ScriptableContext } from \"chart.js\";\nimport Color from \"color\";\nimport { useTheme } from \"styled-components\";\nimport \"chartjs-adapter-moment\";\n\nimport type { Item, timeOptions } from \"./types\";\nimport { fontConfig, valueFormatter } from \"./utils\";\n\ntype LineProps = React.ComponentProps<typeof Line>;\n\nexport type Props = Omit<ChartProps, \"type\" | \"data\" | \"options\"> & {\n  data: Array<Item>;\n  color: string;\n  variant?: \"default\" | \"small\";\n  valueKey?: string;\n  /*\n   ** This prop is used to format the x-axis using time options from chart.js.\n   ** See https://www.chartjs.org/docs/latest/axes/cartesian/time.html#time-units\n   */\n  timeOptions?: timeOptions;\n};\n\n/*\n ** @DEV: I'm sorry, I spent too much time to try to type scales. Types from chart.js\n ** are horrible. I hope someone in the future will have more luck than me.\n */\ntype GetConfigOutput = { gradient: { alpha: number }; scales: unknown };\n\n/*\n ** Returns the correct config based on the variant\n */\nconst getConfig = (\n  variant: NonNullable<Props[\"variant\"]>,\n  options: NonNullable<Pick<Props, \"timeOptions\">> & { gridColor: string },\n): GetConfigOutput => {\n  const config: { small: GetConfigOutput; default: GetConfigOutput } = {\n    small: {\n      gradient: { alpha: 0.3 },\n      scales: { y: { display: false }, x: { display: false, type: \"time\" } },\n    },\n    default: {\n      gradient: { alpha: 0.1 },\n      scales: {\n        y: {\n          display: true,\n          grid: {\n            color: options.gridColor,\n            borderDash: [4, 4],\n            tickWidth: 0,\n            tickLength: 18,\n\n            // This is an hack to don't render a duplicate axis\n            borderWidth: 0,\n          },\n          ticks: { callback: valueFormatter, labelOffset: -3 },\n        },\n        x: {\n          display: true,\n          grid: {\n            color: options.gridColor,\n            borderDash: [4, 4],\n            tickWidth: 0,\n            tickLength: 15,\n\n            // Don't render a duplicate axis\n            borderWidth: 0,\n          },\n          // always display first/last ticks\n          bounds: \"ticks\",\n          type: \"time\",\n          // control how the tickers on the x-axis are formatted\n          time: options.timeOptions,\n        },\n      },\n    },\n  };\n\n  return config[variant];\n};\n\nconst defaultValue: {\n  variant: NonNullable<Props[\"variant\"]>;\n  valueKey: NonNullable<Props[\"valueKey\"]>;\n  timeOptions: NonNullable<Props[\"timeOptions\"]>;\n} = {\n  variant: \"default\",\n  valueKey: \"value\",\n  timeOptions: { unit: \"month\", displayFormats: { month: \"MMM.\" } },\n};\n\n/**\n * @remarks This component must have a parent that has only it as a child and it must be in relative position!\n * @privateRemarks Don't name this component \"Chart\", that will conflict with the Chart.js library cuz of the adapter\n */\nexport default ({\n  data,\n  color,\n  variant = defaultValue.variant,\n  valueKey = defaultValue.valueKey,\n  timeOptions = defaultValue.timeOptions,\n  ...chartProps\n}: Props): JSX.Element => {\n  const theme = useTheme();\n  const config = useMemo(\n    () => getConfig(variant, { gridColor: theme.colors.neutral.c40, timeOptions }),\n    [variant, theme.colors.neutral.c40, timeOptions],\n  );\n\n  // inject default font configuration at mount\n  useEffect(() => {\n    defaults.font = fontConfig;\n  }, []);\n\n  const chartData = useMemo(\n    () => ({\n      datasets: [\n        {\n          borderColor: color,\n          borderWidth: 2,\n          fill: \"start\",\n          backgroundColor: (context: ScriptableContext<\"bar\">) => {\n            const chart = context.chart;\n            const { ctx, chartArea } = chart;\n\n            // This case happens on initial chart load\n            if (!chartArea) return null;\n\n            // Create gradient based on the props color\n            const gradient = ctx.createLinearGradient(0, 0, 0, chartArea.height / 1.2);\n            gradient.addColorStop(0, Color(color).alpha(config.gradient.alpha).string());\n            gradient.addColorStop(1, Color(color).alpha(0.0).string());\n            return gradient;\n          },\n\n          // prevent points rendering\n          pointRadius: 0,\n          pointHitRadius: 0,\n\n          data: data.map(({ date: x, [`${valueKey}`]: y }) => ({ x, y })),\n        },\n      ],\n    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [color, data, valueKey, variant],\n  ) as unknown as LineProps[\"data\"];\n\n  const options: ChartProps[\"options\"] = useMemo(\n    () => ({\n      // Responsive options use the parent element to create the canvas\n      responsive: true,\n      maintainAspectRatio: false,\n\n      plugins: { tooltips: { enabled: false }, legend: { display: false } },\n      animation: false,\n      elements: {\n        points: { radius: 0 },\n        line: {\n          // Bezier curve tension of the line. Set to 0 to draw straightlines.\n          tension: 0.2,\n        },\n      },\n      scales: config.scales,\n    }),\n    [config.scales],\n  ) as unknown as LineProps[\"options\"];\n\n  // The redraw is needed to allow the chart to be updated with new value\n  return <Line data={chartData} options={options} {...chartProps} redraw />;\n};\n"],
-  "mappings": "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",
-  "names": ["Color", "React"]
-}

package/lib/cjs/components/Chart/types.js

@@ -1,17 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var types_exports = {};
-module.exports = __toCommonJS(types_exports);
-//# sourceMappingURL=types.js.map

package/lib/cjs/components/Chart/types.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Chart/types.ts"],
-  "sourcesContent": ["export type Item = {\n  date: Date;\n  value?: number | string;\n} & { [key: string]: number | string };\n\ntype Unit =\n  | \"millisecond\"\n  | \"second\"\n  | \"minute\"\n  | \"hour\"\n  | \"day\"\n  | \"week\"\n  | \"month\"\n  | \"quarter\"\n  | \"year\";\n\nexport type timeOptions = {\n  unit?: Unit;\n  displayFormats?: { [unit in Unit]?: string };\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;AAAA;AAAA;",
-  "names": []
-}

package/lib/cjs/components/Chart/utils.js

@@ -1,42 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var utils_exports = {};
-__export(utils_exports, {
-  fontConfig: () => fontConfig,
-  valueFormatter: () => valueFormatter
-});
-module.exports = __toCommonJS(utils_exports);
-const valueFormatter = (value) => {
-  const breakpoints = [
-    { value: 1e6, unit: "M" },
-    { value: 1e3, unit: "K" },
-    { value: 1, unit: "" }
-  ];
-  const formattedValue = typeof value === "number" ? value : parseFloat(value);
-  const item = breakpoints.find((item2) => formattedValue >= item2.value);
-  return item ? `${(formattedValue / item.value).toFixed(1).replace(".0", "")} ${item.unit}` : "0";
-};
-const fontConfig = {
-  family: "Inter, Arial",
-  size: 11,
-  weight: "600",
-  lineHeight: 1.21,
-  style: "normal"
-};
-//# sourceMappingURL=utils.js.map

package/lib/cjs/components/Chart/utils.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../src/components/Chart/utils.ts"],
-  "sourcesContent": ["/**\n * Returns the value fixed to 1 decimals when needed with his associated unit (e.g. \"1.5K\" or \"1.5M\")\n * @param value - Value displayed on the y-axis as a tick\n * @example\n * ```\n * valueFormatter(1500) // \"1.5K\"\n * valueFormatter(1567) // \"1.5K\"\n * valueFormatter(1567657) // \"1.5M\"\n * valueFormatter(156) // \"156\"\n * ```\n */\nexport const valueFormatter = (value: string | number): string => {\n  const breakpoints = [\n    { value: 1e6, unit: \"M\" },\n    { value: 1e3, unit: \"K\" },\n    { value: 1, unit: \"\" },\n  ];\n  const formattedValue = typeof value === \"number\" ? value : parseFloat(value);\n  const item = breakpoints.find(item => formattedValue >= item.value);\n  return item ? `${(formattedValue / item.value).toFixed(1).replace(\".0\", \"\")} ${item.unit}` : \"0\";\n};\n\n// set default font configuration for the chart - I used ll-text_subTitle class from our theme\nexport const fontConfig: {\n  family: string;\n  size: number;\n  weight: string;\n  lineHeight: number;\n  style: \"normal\" | \"italic\";\n} = {\n  family: \"Inter, Arial\",\n  size: 11,\n  weight: \"600\",\n  lineHeight: 1.21,\n  style: \"normal\",\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWO,MAAM,iBAAiB,CAAC,UAAmC;AAChE,QAAM,cAAc;AAAA,IAClB,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,IACxB,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,IACxB,EAAE,OAAO,GAAG,MAAM,GAAG;AAAA,EACvB;AACA,QAAM,iBAAiB,OAAO,UAAU,WAAW,QAAQ,WAAW,KAAK;AAC3E,QAAM,OAAO,YAAY,KAAK,CAAAA,UAAQ,kBAAkBA,MAAK,KAAK;AAClE,SAAO,OAAO,IAAI,iBAAiB,KAAK,OAAO,QAAQ,CAAC,EAAE,QAAQ,MAAM,EAAE,CAAC,IAAI,KAAK,IAAI,KAAK;AAC/F;AAGO,MAAM,aAMT;AAAA,EACF,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,OAAO;AACT;",
-  "names": ["item"]
-}

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

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-import { ChartProps } from "react-chartjs-2";
-import "chartjs-adapter-moment";
-import type { Item, timeOptions } from "./types";
-export type Props = Omit<ChartProps, "type" | "data" | "options"> & {
-    data: Array<Item>;
-    color: string;
-    variant?: "default" | "small";
-    valueKey?: string;
-    timeOptions?: timeOptions;
-};
-/**
- * @remarks This component must have a parent that has only it as a child and it must be in relative position!
- * @privateRemarks Don't name this component "Chart", that will conflict with the Chart.js library cuz of the adapter
- */
-declare const _default: ({ data, color, variant, valueKey, timeOptions, ...chartProps }: Props) => JSX.Element;
-export default _default;

package/lib/components/Chart/index.js

@@ -1,125 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React, { useEffect, useMemo } from "react";
-import { Line, defaults } from "react-chartjs-2";
-import Color from "color";
-import { useTheme } from "styled-components";
-import "chartjs-adapter-moment";
-import { fontConfig, valueFormatter } from "./utils";
-/*
- ** Returns the correct config based on the variant
- */
-const getConfig = (variant, options) => {
-    const config = {
-        small: {
-            gradient: { alpha: 0.3 },
-            scales: { y: { display: false }, x: { display: false, type: "time" } },
-        },
-        default: {
-            gradient: { alpha: 0.1 },
-            scales: {
-                y: {
-                    display: true,
-                    grid: {
-                        color: options.gridColor,
-                        borderDash: [4, 4],
-                        tickWidth: 0,
-                        tickLength: 18,
-                        // This is an hack to don't render a duplicate axis
-                        borderWidth: 0,
-                    },
-                    ticks: { callback: valueFormatter, labelOffset: -3 },
-                },
-                x: {
-                    display: true,
-                    grid: {
-                        color: options.gridColor,
-                        borderDash: [4, 4],
-                        tickWidth: 0,
-                        tickLength: 15,
-                        // Don't render a duplicate axis
-                        borderWidth: 0,
-                    },
-                    // always display first/last ticks
-                    bounds: "ticks",
-                    type: "time",
-                    // control how the tickers on the x-axis are formatted
-                    time: options.timeOptions,
-                },
-            },
-        },
-    };
-    return config[variant];
-};
-const defaultValue = {
-    variant: "default",
-    valueKey: "value",
-    timeOptions: { unit: "month", displayFormats: { month: "MMM." } },
-};
-/**
- * @remarks This component must have a parent that has only it as a child and it must be in relative position!
- * @privateRemarks Don't name this component "Chart", that will conflict with the Chart.js library cuz of the adapter
- */
-export default (_a) => {
-    var { data, color, variant = defaultValue.variant, valueKey = defaultValue.valueKey, timeOptions = defaultValue.timeOptions } = _a, chartProps = __rest(_a, ["data", "color", "variant", "valueKey", "timeOptions"]);
-    const theme = useTheme();
-    const config = useMemo(() => getConfig(variant, { gridColor: theme.colors.neutral.c40, timeOptions }), [variant, theme.colors.neutral.c40, timeOptions]);
-    // inject default font configuration at mount
-    useEffect(() => {
-        defaults.font = fontConfig;
-    }, []);
-    const chartData = useMemo(() => ({
-        datasets: [
-            {
-                borderColor: color,
-                borderWidth: 2,
-                fill: "start",
-                backgroundColor: (context) => {
-                    const chart = context.chart;
-                    const { ctx, chartArea } = chart;
-                    // This case happens on initial chart load
-                    if (!chartArea)
-                        return null;
-                    // Create gradient based on the props color
-                    const gradient = ctx.createLinearGradient(0, 0, 0, chartArea.height / 1.2);
-                    gradient.addColorStop(0, Color(color).alpha(config.gradient.alpha).string());
-                    gradient.addColorStop(1, Color(color).alpha(0.0).string());
-                    return gradient;
-                },
-                // prevent points rendering
-                pointRadius: 0,
-                pointHitRadius: 0,
-                data: data.map(({ date: x, [`${valueKey}`]: y }) => ({ x, y })),
-            },
-        ],
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [color, data, valueKey, variant]);
-    const options = useMemo(() => ({
-        // Responsive options use the parent element to create the canvas
-        responsive: true,
-        maintainAspectRatio: false,
-        plugins: { tooltips: { enabled: false }, legend: { display: false } },
-        animation: false,
-        elements: {
-            points: { radius: 0 },
-            line: {
-                // Bezier curve tension of the line. Set to 0 to draw straightlines.
-                tension: 0.2,
-            },
-        },
-        scales: config.scales,
-    }), [config.scales]);
-    // The redraw is needed to allow the chart to be updated with new value
-    return React.createElement(Line, Object.assign({ data: chartData, options: options }, chartProps, { redraw: true }));
-};
-//# sourceMappingURL=index.js.map

package/lib/components/Chart/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Chart/index.tsx"],"names":[],"mappings":"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"}

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

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

package/lib/components/Chart/types.js

@@ -1,2 +0,0 @@
-export {};
-//# sourceMappingURL=types.js.map

package/lib/components/Chart/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Chart/types.ts"],"names":[],"mappings":""}

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

@@ -1,19 +0,0 @@
-/**
- * Returns the value fixed to 1 decimals when needed with his associated unit (e.g. "1.5K" or "1.5M")
- * @param value - Value displayed on the y-axis as a tick
- * @example
- * ```
- * valueFormatter(1500) // "1.5K"
- * valueFormatter(1567) // "1.5K"
- * valueFormatter(1567657) // "1.5M"
- * valueFormatter(156) // "156"
- * ```
- */
-export declare const valueFormatter: (value: string | number) => string;
-export declare const fontConfig: {
-    family: string;
-    size: number;
-    weight: string;
-    lineHeight: number;
-    style: "normal" | "italic";
-};

package/lib/components/Chart/utils.js

@@ -1,30 +0,0 @@
-/**
- * Returns the value fixed to 1 decimals when needed with his associated unit (e.g. "1.5K" or "1.5M")
- * @param value - Value displayed on the y-axis as a tick
- * @example
- * ```
- * valueFormatter(1500) // "1.5K"
- * valueFormatter(1567) // "1.5K"
- * valueFormatter(1567657) // "1.5M"
- * valueFormatter(156) // "156"
- * ```
- */
-export const valueFormatter = (value) => {
-    const breakpoints = [
-        { value: 1e6, unit: "M" },
-        { value: 1e3, unit: "K" },
-        { value: 1, unit: "" },
-    ];
-    const formattedValue = typeof value === "number" ? value : parseFloat(value);
-    const item = breakpoints.find(item => formattedValue >= item.value);
-    return item ? `${(formattedValue / item.value).toFixed(1).replace(".0", "")} ${item.unit}` : "0";
-};
-// set default font configuration for the chart - I used ll-text_subTitle class from our theme
-export const fontConfig = {
-    family: "Inter, Arial",
-    size: 11,
-    weight: "600",
-    lineHeight: 1.21,
-    style: "normal",
-};
-//# sourceMappingURL=utils.js.map

package/lib/components/Chart/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../src/components/Chart/utils.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,KAAsB,EAAU,EAAE;IAC/D,MAAM,WAAW,GAAG;QAClB,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE;QACzB,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE;QACzB,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;KACvB,CAAC;IACF,MAAM,cAAc,GAAG,OAAO,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;IAC7E,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,cAAc,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;IACpE,OAAO,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;AACnG,CAAC,CAAC;AAEF,8FAA8F;AAC9F,MAAM,CAAC,MAAM,UAAU,GAMnB;IACF,MAAM,EAAE,cAAc;IACtB,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,KAAK;IACb,UAAU,EAAE,IAAI;IAChB,KAAK,EAAE,QAAQ;CAChB,CAAC"}