@alfalab/core-components 26.3.0-beta.9 → 26.3.1-beta.2

package/chart/index.js

@@ -1,45 +1,32 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-1c2852c7.js');
+require('./tslib.es6-f1c9e7cc.js');
 require('react');
 require('classnames');
 require('recharts');
-require('./hooks/use-path-bar/utils/get-radius.js');
-require('./hooks/use-path-bar/index.js');
-require('./hooks/use-settings/utils/set-composed-charts-margin.js');
-require('./hooks/use-settings/utils/set-datas.js');
-require('./hooks/use-settings/utils/set-gradient-charts.js');
-require('./hooks/use-settings/utils/set-legend-margin.js');
-require('./hooks/use-settings/utils/sort-by-index.js');
-require('./hooks/use-settings/index.js');
-require('./components/customized-label/Component.js');
-require('./icons/circle-icon.js');
-require('./icons/circle-line-icon.js');
-require('./icons/filled-circle-icon.js');
-require('./icons/point-icon.js');
-require('./icons/stroke-circle-icon.js');
-require('./components/dot/Component.js');
-require('../amount');
-require('../typography');
-require('./components/legends/Component.js');
-require('./components/linear-gradient/Component.js');
-require('./components/rect-bar/Component.js');
-require('./components/tick/Component.js');
-require('./components/tooltip-content/tooltip-icon/index.js');
-require('./helpers/add-str.js');
-require('./components/tooltip-content/tooltip-name/index.js');
-require('./components/tooltip-content/tooltip-value/index.js');
-var types_tooltip_types = require('./types/tooltip.types.js');
-require('./components/tooltip-content/Component.js');
-require('./customized-hoc-8a6c9616.js');
 var Component = require('./Component.js');
+require('./components/LinearGradient.js');
+require('../typography');
+require('./icons/Circle.js');
+require('./icons/CircleLine.js');
+require('./icons/FilledCircle.js');
+require('./icons/StrokeCircle.js');
+require('./components/Legends/index.js');
+require('./icons/Point.js');
+require('./components/Dot/index.js');
+require('./hooks/useSettings/utils/setComposedChartsMargin.js');
+require('./hooks/useSettings/utils/setDatas.js');
+require('./hooks/useSettings/utils/setGradientCharts.js');
+require('./hooks/useSettings/utils/setLegendMargin.js');
+require('./hooks/useSettings/utils/sortByIndex.js');
+require('./hooks/useSettings/index.js');
+require('./hooks/usePathBar/utils/getRadius.js');
+require('./hooks/usePathBar/index.js');
+require('./components/CustomizedLabel.js');
+require('./components/RectBar.js');
+require('./components/Tick/index.js');
+require('./components/TooltipContent/index.js');
 
 
 
-Object.defineProperty(exports, 'ArrangeData', {
-	enumerable: true,
-	get: function () {
-		return types_tooltip_types.ArrangeData;
-	}
-});
 exports.Chart = Component.Chart;

package/chart/modern/Component.js

@@ -1,34 +1,34 @@
 import React, { useState, useRef, useMemo, useCallback, useEffect } from 'react';
 import cn from 'classnames';
 import { Legend, CartesianGrid, XAxis, YAxis, Brush, Tooltip, Area, Line, Bar, LabelList, Cell, ResponsiveContainer, ComposedChart } from 'recharts';
-import './hooks/use-path-bar/utils/get-radius.js';
-import './hooks/use-path-bar/index.js';
-import './hooks/use-settings/utils/set-composed-charts-margin.js';
-import './hooks/use-settings/utils/set-datas.js';
-import './hooks/use-settings/utils/set-gradient-charts.js';
-import './hooks/use-settings/utils/set-legend-margin.js';
-import './hooks/use-settings/utils/sort-by-index.js';
-import { useSettings } from './hooks/use-settings/index.js';
-import { CustomizedLabel } from './components/customized-label/Component.js';
-import './icons/circle-icon.js';
-import './icons/circle-line-icon.js';
-import './icons/filled-circle-icon.js';
-import './icons/point-icon.js';
-import './icons/stroke-circle-icon.js';
-import { Dot } from './components/dot/Component.js';
-import '../../amount/modern';
+import { LinearGradient } from './components/LinearGradient.js';
 import '../../typography/modern';
-import { Legends } from './components/legends/Component.js';
-import { LinearGradient } from './components/linear-gradient/Component.js';
-import { RectBar } from './components/rect-bar/Component.js';
-import { Tick } from './components/tick/Component.js';
-import './components/tooltip-content/tooltip-icon/index.js';
-import './helpers/add-str.js';
-import './components/tooltip-content/tooltip-name/index.js';
-import './components/tooltip-content/tooltip-value/index.js';
-import './types/tooltip.types.js';
-import { TooltipContent } from './components/tooltip-content/Component.js';
-import { C as CustomizedHOC } from './customized-hoc-95fdeada.js';
+import './icons/Circle.js';
+import './icons/CircleLine.js';
+import './icons/FilledCircle.js';
+import './icons/StrokeCircle.js';
+import { Legends } from './components/Legends/index.js';
+import './icons/Point.js';
+import { Dot } from './components/Dot/index.js';
+import './hooks/useSettings/utils/setComposedChartsMargin.js';
+import './hooks/useSettings/utils/setDatas.js';
+import './hooks/useSettings/utils/setGradientCharts.js';
+import './hooks/useSettings/utils/setLegendMargin.js';
+import './hooks/useSettings/utils/sortByIndex.js';
+import { useSettings } from './hooks/useSettings/index.js';
+import './hooks/usePathBar/utils/getRadius.js';
+import './hooks/usePathBar/index.js';
+import { CustomizedLabel } from './components/CustomizedLabel.js';
+import { RectBar } from './components/RectBar.js';
+import { Tick } from './components/Tick/index.js';
+import { TooltipContent } from './components/TooltipContent/index.js';
+
+const CustomizedHOC = (Component, options) => {
+    const NewComponent = props => {
+        return React.createElement(Component, Object.assign({}, props, options));
+    };
+    return NewComponent;
+};
 
 var styles = {"coreChart":"chart__coreChart_p1dmp","bar":"chart__bar_p1dmp","unfocused":"chart__unfocused_p1dmp"};
 require('./index.css');
@@ -138,12 +138,7 @@ const Chart = (props) => {
     const renderTooltip = useMemo(() => {
         if (!state?.tooltip)
             return null;
-        return (React.createElement(Tooltip, Object.assign({ ref: tooltipRef }, state.tooltip, { content: CustomizedHOC(TooltipContent, {
-                series: state.series,
-                tooltipArrowSide,
-                legend: state.legend,
-                tooltip: state.tooltip,
-            }) })));
+        return (React.createElement(Tooltip, Object.assign({ ref: tooltipRef }, state.tooltip, { content: CustomizedHOC(TooltipContent, { series: state.series, tooltipArrowSide }) })));
     }, [state, tooltipArrowSide]);
     const renderChartsItems = useMemo(() => {
         if (!state || !charts)
@@ -153,12 +148,11 @@ const Chart = (props) => {
             const show = charts[`${properties.dataKey}`];
             switch (chart) {
                 case 'bar':
-                    return show && !item?.hide ? (React.createElement(Bar, Object.assign({ key: `${state.id}-${properties.dataKey}` }, properties, { shape: React.createElement(RectBar, { radius: radius, activeDotsState: activeDotsState, unfocusedAnimation: state.composeChart.unfocusedAnimation }) }),
+                    return show && !item?.hide ? (React.createElement(Bar, Object.assign({ key: `${state.id}-${properties.dataKey}` }, properties, { shape: React.createElement(RectBar, { radius: radius }) }),
                         labelList && (React.createElement(LabelList, Object.assign({ dataKey: properties.dataKey.toString() }, labelList, { content: React.createElement(CustomizedLabel, { radius: radius }) }))),
                         data.map((_, index) => {
                             const key = `${state.id}-${properties.dataKey}-${index}`;
                             return (React.createElement(Cell, { key: key, className: cn(styles.bar, typeof activeDotsState.active === 'number' &&
-                                    state.composeChart.unfocusedAnimation &&
                                     activeDotsState.active !== index
                                     ? styles.unfocused
                                     : '') }));
@@ -172,11 +166,10 @@ const Chart = (props) => {
                                 inherit: properties?.inheritStroke
                                     ? properties.inheritStroke
                                     : false,
-                                unfocusedAnimation: state.composeChart.unfocusedAnimation || false,
                             })
                             : false, activeDot: false }))) : null;
                 case 'gradient':
-                    return show && !item?.hide ? (React.createElement(Area, Object.assign({}, item.properties, { key: `${state.id}-${item.properties.dataKey}`, dataKey: `${item.properties.dataKey}`, stroke: 'transparent', fill: item?.gradient?.gid
+                    return show && !item?.hide ? (React.createElement(Area, Object.assign({}, item.properties, { key: `${state.id}-${item.properties.dataKey}`, dataKey: `${item.properties.dataKey}`, stroke: 'transparent', fill: item.gradient.gid
                             ? `url(#${state.id}-${item.gradient.gid})`
                             : item.properties.fill, dot: false, activeDot: false }))) : null;
                 default:

package/chart/modern/components/{customized-label/Component.js → CustomizedLabel.js}

@@ -1,6 +1,6 @@
 import React from 'react';
-import '../../hooks/use-path-bar/utils/get-radius.js';
-import { usePathBar } from '../../hooks/use-path-bar/index.js';
+import '../hooks/usePathBar/utils/getRadius.js';
+import { usePathBar } from '../hooks/usePathBar/index.js';
 
 const CustomizedLabel = ({ x, y, value, offset, radius, height, width, formatter, }) => {
     const [initHeight] = usePathBar({ radius, height });

package/chart/modern/components/Dot/index.css

@@ -0,0 +1,23 @@
+/* hash: be8fr */
+.chart__dotUnfocused_16iqv {
+    opacity: 0.3;
+}
+
+.chart__dot_16iqv,
+.chart__dotItem_16iqv,
+.chart__dotWrap_16iqv {
+    transition: all 0.2s ease;
+}
+
+.chart__dot_16iqv {
+    animation: chart__showDot_16iqv 0.5s ease;
+}
+
+@keyframes chart__showDot_16iqv {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}

package/chart/modern/components/{dot/Component.js → Dot/index.js}

@@ -1,11 +1,11 @@
 import React, { useState, useEffect } from 'react';
 import cn from 'classnames';
-import { PointIcon } from '../../icons/point-icon.js';
+import { PointIcon } from '../../icons/Point.js';
 
-var styles = {"dotUnfocused":"chart__dotUnfocused_14r9i","dot":"chart__dot_14r9i","dotItem":"chart__dotItem_14r9i","dotWrap":"chart__dotWrap_14r9i","showDot":"chart__showDot_14r9i"};
+var styles = {"dotUnfocused":"chart__dotUnfocused_16iqv","dot":"chart__dot_16iqv","dotItem":"chart__dotItem_16iqv","dotWrap":"chart__dotWrap_16iqv","showDot":"chart__showDot_16iqv"};
 require('./index.css');
 
-const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings, value, stroke, unfocusedAnimation }, ref) => {
+const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings, value, stroke }, ref) => {
     const [windowWidth, setWindowWidth] = useState(0);
     const [height, setHeight] = useState(0);
     const [width, setWidth] = useState(0);
@@ -36,9 +36,7 @@ const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings,
         return null;
     return (React.createElement("g", { ref: ref, className: cn(styles.dot), transform: `translate(${cx - width / 2}, ${cy - height / 2})` },
         React.createElement("g", { className: cn(styles.dotWrap), transform: `scale(${activeDot === index ? option?.scale || 0 : option?.initScale || 0})` },
-            React.createElement("svg", { className: cn(styles.dotItem, activeDot === index ? styles.dotActive : '', typeof activeDot === 'number' &&
-                    activeDot !== index &&
-                    unfocusedAnimation
+            React.createElement("svg", { className: cn(styles.dotItem, activeDot === index ? styles.dotActive : '', typeof activeDot === 'number' && activeDot !== index
                     ? styles.dotUnfocused
                     : ''), "data-id": index, "data-name": dataKey, width: option?.width || 0, height: option?.height || 0 },
                 React.createElement(PointIcon, { fill: stroke })))));

package/chart/{components/legends → modern/components/Legends}/index.css

@@ -1,4 +1,4 @@
-/* hash: 1q7dr */
+/* hash: zvtoo */
 :root {
 
     /* Hard */
@@ -8,40 +8,33 @@
     /* Hard up */
 }
 :root {
-    --gap-2xs: 4px;
     --gap-2xl: 32px;
 }
-.chart__legendContent_1cjw3 {
+.chart__legendContent_5vx0d {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }
-.chart__legendWrap_1cjw3 {
+.chart__legendWrap_5vx0d {
     width: 100%;
     margin: 0;
     padding: 0;
 }
-.chart__legendItem_1cjw3 {
+.chart__legendItem_5vx0d {
     margin-right: var(--gap-2xl);
     cursor: pointer;
     display: inline-block;
 }
-.chart__legendItem_1cjw3:last-child {
+.chart__legendItem_5vx0d:last-child {
     margin-right: 0;
 }
-.chart__legendUnactive_1cjw3 {
+.chart__legendUnactive_5vx0d {
     opacity: 0.3;
 }
-.chart__legendIcon_1cjw3 {
+.chart__legendIcon_5vx0d {
     margin-right: 13px;
     display: flex;
 }
-.chart__legendValue_1cjw3 {
+.chart__legendValue_5vx0d {
     text-transform: capitalize;
 }
-.chart__amount_1cjw3 {
-    margin-left: var(--gap-2xs)
-}
-.chart__amount_1cjw3 > span {
-        font-weight: var(--amount-major-part-font-weight);
-    }

package/chart/modern/components/Legends/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import React from 'react';
+import { DataDynamicBooleanProps } from "../../types/utils/data.types";
+import { LegendProps } from "../../types/legend.types";
+import { SeriaProps } from "../../types/seria.types";
+interface Props {
+    legend: LegendProps;
+    series: SeriaProps[];
+    id: string;
+    charts: DataDynamicBooleanProps;
+    toggleChart(item: SeriaProps): void;
+}
+declare const Legends: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLUListElement>>;
+export { Legends };

package/chart/modern/components/{legends/Component.js → Legends/index.js}

@@ -1,13 +1,12 @@
 import React from 'react';
 import cn from 'classnames';
-import { CircleIcon } from '../../icons/circle-icon.js';
-import { CircleLineIcon } from '../../icons/circle-line-icon.js';
-import { FilledCircleIcon } from '../../icons/filled-circle-icon.js';
-import { StrokeCircleIcon } from '../../icons/stroke-circle-icon.js';
-import { Amount } from '../../../../amount/modern';
 import { Typography } from '../../../../typography/modern';
+import { CircleIcon } from '../../icons/Circle.js';
+import { CircleLineIcon } from '../../icons/CircleLine.js';
+import { FilledCircleIcon } from '../../icons/FilledCircle.js';
+import { StrokeCircleIcon } from '../../icons/StrokeCircle.js';
 
-var styles = {"legendContent":"chart__legendContent_1cjw3","legendWrap":"chart__legendWrap_1cjw3","legendItem":"chart__legendItem_1cjw3","legendUnactive":"chart__legendUnactive_1cjw3","legendIcon":"chart__legendIcon_1cjw3","legendValue":"chart__legendValue_1cjw3","amount":"chart__amount_1cjw3"};
+var styles = {"legendContent":"chart__legendContent_5vx0d","legendWrap":"chart__legendWrap_5vx0d","legendItem":"chart__legendItem_5vx0d","legendUnactive":"chart__legendUnactive_5vx0d","legendIcon":"chart__legendIcon_5vx0d","legendValue":"chart__legendValue_5vx0d"};
 require('./index.css');
 
 const icons = {
@@ -22,10 +21,6 @@ const Legends = React.forwardRef(({ legend, series, id, charts, toggleChart }, r
         transform: `translateY(${(legend?.marginTop ? legend.marginTop : 0) *
             (legend.verticalAlign === 'top' ? -1 : 1)}px)`,
     };
-    const label = legend?.typography?.label ?? {
-        view: 'primary-medium',
-        tag: 'span',
-    };
     return (React.createElement("ul", { ref: ref, className: cn(styles.legendWrap), style: style }, series.map((item) => {
         if (item.hideLegend || item.hide)
             return null;
@@ -36,9 +31,8 @@ const Legends = React.forwardRef(({ legend, series, id, charts, toggleChart }, r
                     React.createElement(Icon, { fill: item.properties?.fill ||
                             item.properties?.stroke ||
                             '', height: legend.iconHeight || 16 }))) : null,
-                React.createElement(Typography.Text, Object.assign({}, label, { className: cn(styles.legendValue, label.className ?? '') }), item.properties.name),
-                item.properties.amount && (React.createElement(Amount, Object.assign({}, item.properties.amount, { className: cn(styles.amount, item?.properties?.amount?.className ?? '') }))))));
+                React.createElement(Typography.Text, { view: 'primary-medium', tag: 'span', className: cn(styles.legendValue) }, item.properties.name))));
     })));
 });
 
-export { Legends, icons };
+export { Legends };

package/chart/modern/components/{linear-gradient/Component.d.ts → LinearGradient.d.ts}

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
-import { LinearGradientProps } from "../../types/utils/gradient.types";
+import { LinearGradientProps } from "../types/utils/gradient.types";
 declare const LinearGradient: ({ id, gid, points }: LinearGradientProps) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
 export { LinearGradient };

package/chart/modern/components/RectBar.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const RectBar: ({ fill, x, y, width, height, radius, background }: any) => JSX.Element;
+export { RectBar };

package/chart/modern/components/{rect-bar/Component.js → RectBar.js}

@@ -1,10 +1,6 @@
 import React, { useMemo } from 'react';
-import cn from 'classnames';
-import '../../hooks/use-path-bar/utils/get-radius.js';
-import { usePathBar } from '../../hooks/use-path-bar/index.js';
-
-var styles = {"bar":"chart__bar_15nwl","unfocused":"chart__unfocused_15nwl"};
-require('./index.css');
+import '../hooks/usePathBar/utils/getRadius.js';
+import { usePathBar } from '../hooks/usePathBar/index.js';
 
 // eslint-disable-next-line complexity
 const getPath = (x, width, height, initHeight, topRadius, bottomRadius, initY) => `
@@ -22,31 +18,14 @@ const getPath = (x, width, height, initHeight, topRadius, bottomRadius, initY) =
     ((height !== 0 && bottomRadius) || 0)} ${initY + initHeight}
         Z
     `;
-const RectBar = (props) => {
-    const { fill, x, y, width, height, radius, background, activeDotsState, index, unfocusedAnimation, } = props;
+const RectBar = ({ fill, x, y, width, height, radius, background }) => {
     const [initHeight, topRadius, bottomRadius, initY] = usePathBar({
         radius,
         height,
         background,
         y,
     });
-    const path = useMemo(() => (React.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill, className: cn(styles.bar, typeof activeDotsState.active === 'number' &&
-            unfocusedAnimation &&
-            activeDotsState.active !== index
-            ? styles.unfocused
-            : '') })), [
-        x,
-        width,
-        height,
-        initHeight,
-        topRadius,
-        bottomRadius,
-        initY,
-        fill,
-        activeDotsState.active,
-        unfocusedAnimation,
-        index,
-    ]);
+    const path = useMemo(() => (React.createElement("path", { d: getPath(x, width, height, initHeight, topRadius, bottomRadius, initY), stroke: 'none', fill: fill })), [x, width, height, initHeight, topRadius, bottomRadius, initY, fill]);
     return React.createElement(React.Fragment, null, path);
 };
 

package/chart/modern/components/{tick → Tick}/index.css

@@ -1,4 +1,4 @@
-/* hash: 3lsk0 */
+/* hash: 10ajj */
 :root {
     --color-dark-bg-primary: #0b1f35;
     --color-light-text-primary: #0b1f35;
@@ -11,13 +11,17 @@
 
     /* Hard up */
 }
-.chart__tickText_1iu5l {
+.chart__tickText_1ddgc {
     fill: var(--color-light-text-primary);
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
 }
-.chart__circle_1iu5l {
+.chart__circle_1ddgc {
+    opacity: 0.3;
+    fill: var(--color-dark-bg-primary);
+}
+.chart__circle_1ddgc {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }

package/chart/modern/components/{tick/Component.js → Tick/index.js}

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"tickText":"chart__tickText_1iu5l","circle":"chart__circle_1iu5l"};
+var styles = {"tickText":"chart__tickText_1ddgc","circle":"chart__circle_1ddgc"};
 require('./index.css');
 
 const Tick = ({ y, payload, tickFormatter, xAxis }) => {

package/chart/{components/tooltip-content → modern/components/TooltipContent}/index.css

@@ -1,4 +1,4 @@
-/* hash: 1f4og */
+/* hash: 1dthf */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
@@ -19,7 +19,7 @@
 :root {
     --border-radius-m: 8px;
 }
-.chart__tooltip_9p5o8 {
+.chart__tooltip_qtxuh {
     background-color: var(--color-light-bg-primary);
     border: 1px solid var(--color-light-border-primary);
     box-shadow: var(--shadow-l);
@@ -28,7 +28,17 @@
     pointer-events: none;
     position: relative;
 }
-.chart__tooltipArrow_9p5o8 {
+.chart__tooltipList_qtxuh {
+    position: relative;
+    z-index: 5;
+    list-style-type: none;
+    padding: 0;
+    margin: 0;
+}
+.chart__tooltipItem_qtxuh {
+    margin-bottom: 10px;
+}
+.chart__tooltipArrow_qtxuh {
     position: absolute;
     left: 0;
     top: 50%;
@@ -38,7 +48,7 @@
     border: 1px solid var(--color-light-border-primary);
     background-color: var(--color-light-bg-primary);
 }
-.chart__tooltipArrow_9p5o8:before {
+.chart__tooltipArrow_qtxuh:before {
     content: '';
     position: absolute;
     left: -2px;
@@ -49,17 +59,7 @@
     border-width: 0 24px 24px 0;
     border-color: transparent var(--color-light-bg-primary) transparent transparent;
 }
-.chart__tooltipArrowRight_9p5o8 {
+.chart__tooltipArrowRight_qtxuh {
     left: 100%;
     transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
 }
-.chart__tooltipList_9p5o8 {
-    position: relative;
-    z-index: 5;
-    list-style-type: none;
-    padding: 0;
-    margin: 0;
-}
-.chart__tooltipItem_9p5o8 {
-    margin-bottom: 10px;
-}

package/chart/modern/components/{tooltip-content/Component.d.ts → TooltipContent/index.d.ts}

@@ -1,16 +1,10 @@
 /// <reference types="react" />
-import { LegendProps } from "../../types/legend.types";
 import { PayloadProps } from "../../types/payload.types";
 import { SeriaProps } from "../../types/seria.types";
 import { TooltipProps } from "../../types/tooltip.types";
 interface TooltipContentProps extends TooltipProps {
     payload: PayloadProps[];
     series: SeriaProps[];
-    legend: LegendProps;
-    tooltip: TooltipProps;
 }
-interface JSXElementObject {
-    [name: string]: JSX.Element;
-}
-declare const TooltipContent: ({ payload, separator, label, tooltipArrowSide, arrow, series, labelFormatter, labelStyle, amount, legend, tooltip, }: TooltipContentProps) => JSX.Element | null;
-export { TooltipContentProps, JSXElementObject, TooltipContent };
+declare const TooltipContent: ({ payload, separator, label, tooltipArrowSide, arrow, series, labelFormatter, labelStyle, }: TooltipContentProps) => JSX.Element | null;
+export { TooltipContentProps, TooltipContent };

package/chart/modern/components/TooltipContent/index.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import cn from 'classnames';
+import { Typography } from '../../../../typography/modern';
+
+var styles = {"tooltip":"chart__tooltip_qtxuh","tooltipList":"chart__tooltipList_qtxuh","tooltipItem":"chart__tooltipItem_qtxuh","tooltipArrow":"chart__tooltipArrow_qtxuh","tooltipArrowRight":"chart__tooltipArrowRight_qtxuh"};
+require('./index.css');
+
+const TooltipContent = ({ payload, separator, label, tooltipArrowSide, arrow, series, labelFormatter, labelStyle, }) => {
+    if (!label || payload.length === 0)
+        return null;
+    return (React.createElement("div", { className: cn(styles.tooltip) },
+        arrow && (React.createElement("span", { className: cn(styles.tooltipArrow, tooltipArrowSide ? '' : styles.tooltipArrowRight) })),
+        React.createElement("ul", { className: cn(styles.tooltipList) },
+            React.createElement("li", { className: cn(styles.tooltipItem), style: labelStyle },
+                React.createElement(Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn(styles.tooltipLabel) }, labelFormatter ? labelFormatter(label) : label)),
+            payload.map((entry) => {
+                const data = series.find((d) => d.properties.dataKey === entry.dataKey);
+                if (data?.hideTooltip || data?.hide)
+                    return null;
+                return (React.createElement("li", { className: cn(styles.tooltipItem), key: entry.dataKey, style: { color: entry.color } },
+                    React.createElement(Typography.Text, { view: 'primary-medium', tag: 'span', weight: 'medium', className: cn(styles.tooltipValue) },
+                        entry?.formatter ? entry.formatter(entry.value) : entry.value,
+                        separator || ' '),
+                    React.createElement(Typography.Text, { view: 'secondary-large', tag: 'span', className: cn(styles.tooltipName) }, `${entry.name}`)));
+            }))));
+};
+
+export { TooltipContent };

package/chart/modern/hooks/{use-path-bar → usePathBar}/index.js

@@ -1,5 +1,5 @@
 import { useState, useEffect } from 'react';
-import { getRadius } from './utils/get-radius.js';
+import { getRadius } from './utils/getRadius.js';
 
 const usePathBar = (props) => {
     const [topRadius, setTopRadius] = useState(0);

package/chart/modern/hooks/{use-settings → useSettings}/index.js

@@ -1,9 +1,9 @@
 import { useState, useEffect } from 'react';
-import { setComposedChartsMargin } from './utils/set-composed-charts-margin.js';
-import { setDatas } from './utils/set-datas.js';
-import { setGradientCharts } from './utils/set-gradient-charts.js';
-import { setLegendMargin } from './utils/set-legend-margin.js';
-import { sortByIndex } from './utils/sort-by-index.js';
+import { setComposedChartsMargin } from './utils/setComposedChartsMargin.js';
+import { setDatas } from './utils/setDatas.js';
+import { setGradientCharts } from './utils/setGradientCharts.js';
+import { setLegendMargin } from './utils/setLegendMargin.js';
+import { sortByIndex } from './utils/sortByIndex.js';
 
 const useSettings = (options) => {
     const [state, setState] = useState(null);

package/chart/modern/hooks/{use-settings/utils/set-datas.d.ts → useSettings/utils/setDatas.d.ts}

@@ -2,5 +2,5 @@
 import { DataDynamicBooleanProps, DataDynamicProps } from "../../../types/utils/data.types";
 import { SeriaProps } from "../../../types/seria.types";
 type DatasResultProps = [DataDynamicProps[], DataDynamicBooleanProps, number];
-declare const setDatas: (series: SeriaProps[], labels: import("react").ReactText[]) => DatasResultProps;
+declare const setDatas: (series: SeriaProps[], labels: import("react").Key[]) => DatasResultProps;
 export { setDatas };